html {
	height:100%;
	width:100%;
}

body {
	margin:0;
	padding:0;
	height:100%;
	width:100%;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	color: #404040;
	font-size: 14px;
}

table {
	font-size:1em;
	line-height:28px;
	text-decoration:none;
	color:#000000;
}

a {
	color: #808080;
	text-decoration: none;
}
a:visited {
	color: #808080;
}
a:hover {
	text-decoration:underline;
	color: #808080;
}
a:active {
	text-decoration:none;
	color: #969696;
}

img {border: 0; padding: 0; margin: 0;}

li {list-style: none; line-height: 1.6em;}

/*input {width:100%; max-width: 700px; font-size: 0.9em; color: #404040; border: 1px solid #AAA;border-radius: 3px; height: 21px; vertical-align: middle;}
input[type='checkbox'], input[type='radio'] {width:1.2em !important; display: inline; ;}
input[type='submit'] {width:200px !important; display: inline; color: white; background: linear-gradient(#88c053, #346313); border: 1px solid #5d8733;}
input[type='submit']:hover {color: white; background: linear-gradient(#88c053, #5d942c); border: 1px solid #88c053; cursor: pointer;}
input[type='button']{width:200px !important; display: inline; }
label {display: inline; min-width: 20px;  font-style: italic; white-space: nowrap;}
select {width:100%; min-width: 100px; max-width: 700px; font-size: 0.9em; color: #404040; border: 1px solid #AAA;border-radius: 3px; height: 21px;}
textarea {width:100%; min-width: 200px; max-width: 700px; min-height: 150px; font-size:1em; color: #404040; border: 1px solid #AAA;border-radius: 3px; height: 21px;}
.ms-choice {height: 21px; line-height: 21px;}*/

h1 {font-size: 1.6em;}
h2 {font-size: 1.4em;}
h3 {font-size: 1.2em;}
h4 {font-size: 1em;}
h5 {font-size: 0.9em;}
h6 {font-size: 0.8em;}

.font1_6 {font-size: 1.6em;}
.font1_4 {font-size: 1.4em;}
.font1_2 {font-size: 1.2em;}
.font1_0 {font-size: 1.0em;}
.font0_8 {font-size: 0.8em;}
.font0_7 {font-size: 0.7em;}
.font0_6 {font-size: 0.6em;}

.error {color:#cb120d; display: block; }
.red {color:#cb120d;}
.green {color:#6a9604;}
.lightgray {color: #969696;}
.white {color: #fff;}
.margin0 {margin:0;}
.padding5 {padding:5px;}
.br5 {clear:both; height:5px;}
.br10 {clear:both; height:10px;}
.br20 {clear:both; height:20px;}
.br30 {clear:both; height:30px;}
.br50 {clear:both; height:50px;}
.hide {display: none;}
.left {float:left;}
.right {float:right;}
.clear {clear:both;}
.absolute {position: absolute; display: block;}
.bold {font-weight: bold;}
.pointer {cursor: pointer;}
.rightText {text-align: right;}
.leftText {text-align: left;}

.banner {float: right; width: 300px;}

.category {cursor: pointer; background: #eee; border: 1px solid #ccc; margin-bottom: 0.3em; float: left; width: 298px; margin-left: 5px; margin-right: 5px;}
.category:hover {background: #ccc; }
.category h2 {padding: 3px; margin: 0; font-size: 1em; font-variant: small-caps; text-transform: lowercase;}

.index-komentari {cursor: pointer; background: #eee; border: 1px solid #ccc; padding: 5px; min-height: 200px;}
.index-komentari p {padding-left: 5px;}
.komentari-container {margin-left: auto; margin-right: auto; margin-top: 1em; margin-bottom: 1em; width: 90%; font-size: 1.6em;}
.komentar-row {border-bottom: 1px dotted gray; clear: both; cursor: pointer; margin-top: 1em;}
.komentar-row:hover {background-color: #eee;}
figure.komemntar-pic a {color: lightgray; font-size: 0.7em;}
.breadcrumb {margin-bottom: 1em;}

.cookies-msg { background-color: #6c6c6c; color: white; position: fixed; bottom: 0px; height: 70px; width: 100%; opacity: 0.7;}
.cookies-msg  a { color: white; }
.cookies-msg  div {min-height: 70px;}
.cookies-msg .col-2 {max-width:500px; width: 70%; padding-top: 10px; float: left; }
.cookies-msg .col-2 img {float: left; margin-right: 1em; width: 52px; margin-bottom: 3em;}
.cookies-msg .col-3 {width: 20%; padding-top: 17px; margin-right: 1em;  margin-left: 1em; float: left;}
.cookies-msg  input[type="button"]{background-color: white;}
	
#wrapper {
/*	border: 1px solid red;*/
	margin-left: auto;
	margin-right: auto;
	background-color: #f7f7f7;
	overflow: hidden;
}

header {
	height: 168px;
	/*background: url('images/header.png') no-repeat;*/
	/*background-color: white;*/
}
header a {text-decoration: none;  }
/*header .logo img {width: 210px; height: 162px;}*/
header .logo {float: left;}
header .logo img {width: 100%; height: 100%;}
header .logo-right {float: right;}
header .logo-right img {width: 71%; float: right;}
header .text {width: auto; height: 150px; float: left;}
header .headings h1 {font-family: 'Trebuchet MS'; font-size: 2.57em; color: #c6de0d; font-weight: bold; margin-bottom: 0; display: block;}
header .headings h2 {font-family: 'Trebuchet MS'; font-size: 2em; color: #b58c53; font-weight: bold; margin-top: 0; display: block;}
header .headings h3 {font-family: 'Trebuchet MS'; font-size: 1.71em; color: #bbbbbb; font-weight: bold; margin-top: 10px; margin-bottom: 0; display: block;}
header .headings {width: auto; float: left;}
header .line-1 {width: 100%; min-height: 25px; /*background: #eee;*/}
header .line-2 {width: 100%; height: 52px; clear: both; background-image: url('images/top-gray-line.png'); background-position: top; background-repeat: repeat-x;}
header .line-2 h2 {font-family: 'Segoe Print'; margin-left: 10px; font-size: 28px; font-weight: 100; color: #808080; margin-top: 0px; clear: both;}
header .line-2 figure {float: right; margin-right: 170px; width: 300px; margin-top: -65px;}

#top-menu {
	background: #b58c53;
	clear: both;
	font-variant: small-caps;
	font-size: 1.4em;
}
#top-menu a, #top-menu a:visited {
	display: inline-block;
	height: 2em;
	line-height: 2em;
	text-align: center;
	color: #fff;
	min-width: 7em ;
	padding-left: 0.3em;
	padding-right: 0.3em;
	text-decoration: none;
}
#top-menu a:hover {
	background-color: #c6de0d; 
	color: #b58c53;
}
.menu-item {
	display:inline-block;
}
.sub-menu {
	display:inline-block;
	position: absolute;
	margin-top: 2em;
	background-color: #c6de0d;
	padding: 0;
	z-index: 77;
	text-align: left;
}
.sub-menu a {
	padding: 10px;
	margin: 0;
	display: block !important;
	padding: 0 !important;
	margin: 0 !important;
	text-align: left !important;
	padding-left: 1em !important;
	padding-right: 1em !important;
	color: #b58c53 !important;
	border-bottom: 1px solid #b58c53;
	white-space: nowrap;
	overflow: hidden;
}
.sub-menu a:hover {
	color: #c6de0d !important;
	background-color: #b58c53 !important;
}

footer {
	margin-top: 1em;
	min-height: 3em;
	line-height: 16px;
	background-color:#d8e0e3;
	text-align: center;
	clear: both;
}
footer .middle-holder {opacity: 0.7; width: 175px; margin-left: auto; margin-right: auto;}
footer .left-holder {width: 30%; padding-left: 1em; padding-right: 1em; font-size: 12px; float: left;}
footer .right-holder {float: right; width: 30%; padding-left: 1em; padding-right: 1em; font-size: 12px;}
footer .copy-holder {width: 70%; margin-left: auto; margin-right: auto;}

footer .middle-holder a img {width: 34px;}

#content {
	margin-top: 2em;
}

.cms-page {padding-left: 1em; padding-right: 1em;}

textarea {width: 100%; height: 250px; border-radius: 7px; border: 1px solid #999; padding: 3px;}
input {width: 100%; border-radius: 7px; border: 1px solid #999; padding: 3px;}
input[type="button"], input[type="submit"] {border: 1px solid #c8c8c8; background: transparent; border-radius: 7px; color: #999; padding: 2px; font-size: 1.6em; margin-right: 1em; width: auto;}
input[type="button"]:hover, input[type="submit"]:hover {background-color: #eee; cursor: pointer; }
input[type="radio"] {width: auto; display: inline; }
input[type="checkbox"] {width: auto; height: auto; display: inline; }
select {background: url('images/select-arrow.png') no-repeat right; background-position: 175px; border-radius: 7px; width: 200px; color: #404040; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #999; padding: 3px;}
select::-ms-expand{ display: none; }
select:hover {cursor: pointer;}

.col-left {width: 50%; float: left; min-width: 100px; max-width: 350px;}
.col-left input, .col-right input {width:50%; min-width: 100px; max-width: 350px; font-size:1em;color: #333366;color: #333366;}
.col-right {width: 50%; float: right; min-width: 100px; max-width: 350px;}
.input-form {margin-left: auto; margin-right: auto; margin-top: 3em; margin-bottom: 3em; width: 90%; font-size: 1.1em;}
.thank-you-container {margin-left: auto; margin-right: auto; margin-top: 3em; margin-bottom: 3em; width: 90%; font-size: 1.6em;}

#main-video-container {clear: both; margin-left: auto; margin-right: auto; width: 100%; }
#main-video {width: 1280px; height: 720px;}
#embed-video-frame {width: 100%; min-height: 700px; clear: both;}
#embed-video-frame * {width: 100%; min-height: 700px;}
#fb-root {display: none;}

#list-videos {clear: both;}
#list-videos .video-box {padding: 0; width: 300px; height: 160px; float: left; overflow: hidden; margin-bottom: 1em; margin-left: 5px; margin-right: 5px;}
/*#list-videos .video-box a {color: black;}*/
#list-videos .picture {width: 100%; height: auto;}
#list-videos .text {position: absolute; width: 290px; padding-left: 5px; padding-right: 5px; opacity: 0.9; background: white; margin-top: 120px;}
#list-videos .author {width: 100%; }
#list-videos .tag {width: 100%; font-variant: small-caps; margin: 0; padding: 0; margin-bottom: 7px;}
#list-videos .title {width: 100%; line-height: 16px; clear: both;}
#list-videos h1, #list-videos h2, #list-videos h3 {margin-left: 5px; margin-right: 5px;}
#list-videos .heading {margin-left: 5px; margin-right: 5px;}

.audio-bible h1, .audio-bible h2, .audio-bible .breadcrumb , .audio-bible .content {margin-left: 1em;}

audio { width: 275px; }
.audio-box {width: 275px; float: left; border: 1px solid #eee; padding: 10px; margin: 5px;}
.audio-box:hover {background-color: #eee;}

.fb_iframe_widget {display: block; float: left; margin-right: 1em;}
.steaming-iframe {width: 100%; height: 50vh;}

/*begin responsive*/
@media screen and (min-width: 1px) and (max-width: 639px) {
	body {font-size: 13px; }
	#wrapper { width: 100%; }

	#list-videos .video-box {margin-left: auto; margin-right: auto; float: none;}
	#list-videos h1 {text-align: center;}
	.audio-box {width: 300px; float: none; border: 1px solid #eee; padding: 1em; margin-left: auto; margin-right: auto; margin-top: 1em;}

	.input-form {width: 100%;}

	footer .left-holder, footer .middle-holder, footer .right-holder {
		width: 100%; float: none; margin-left: auto; margin-right: auto; clear: both;
	}
	/*footer .left-holder, *//*footer .right-holder, *//*footer .note, footer .space {display: none;}*/

	header .headings {width: 190px;}
	header .headings * {margin-top: 0; margin-bottom: 0;}
	header .headings h1 {font-size: 1.3em;}
	header .headings h2 {font-size: 1.3em;}
	header .headings h3 {font-size: 1em; margin-top: 7px;}
	#main-video-container {width: 320px;}
	#main-video {width: 320px; height: 240px;}
	header .img-middle {display: none;}
	header {height: 102px;}
	header .right {display: none;}
	header .line-2 h2 {display: none;}
	header .logo-right {width: 120px; height: 93px;}
	header .logo {width: 96px; height: 96px; margin-right: 1em;}
	
	.cookies-msg { height: 120px;}
}

@media screen and (min-width: 640px) and (max-width: 949px) {
	header {height: 136px;}
	body {font-size: 12px; }
	#wrapper { width: 620px; }
	#main-video-container {width: 320px;}
	#main-video {width: 320px; height: 240px; margin-left: auto; margin-right: auto;}
	.steaming-iframe {height: 472px;}
	
	.input-form {width: 100%;}

	header .headings {width: 410px;}
	header .headings * {margin-top: 0; margin-bottom: 0;}

	header .img-middle {display: none;}
	/*header .img-right img {margin-top: -5em;}*/
	header .right {display: none;}
	header .line-2 h2 {display: none;}
	header .logo-right {width: 168px; height: 120px;}
	header .logo {width: 130px; height: 130px; margin-right: 1em;}
}
@media screen and (min-width: 950px) and (max-width: 1279px) {
	header {height: 136px;}
	body {font-size: 12px; }
	#wrapper { width: 930px; }
	#main-video-container {width: 854px;}
	#main-video {width: 854px; height: 480px; margin-left: auto; margin-right: auto;}
	.steaming-iframe {height: 700px;}

	header .headings {width: 450px;}
	header .headings * {margin-top: 0; margin-bottom: 0;}
	header .img-middle {display: block;}
/*	header .img-right img {margin-top: -5em;}*/
	header .right {width: 310px;}
	header .right figure {margin: 0; padding: 0;}
	header .right figure img {width: 100%;}
	header .logo-right {width: 168px; height: 120px;}
	header .logo {width: 130px; height: 130px; margin-right: 1em;}
	/*header .line-2 figure {display: none;}*/

}
@media screen and (min-width: 1280px) and (max-width: 1650px) {
  /*body{font-size: 13px; }*/
	#wrapper { width: 1280px; }
	#main-video-container {width: 1280px;}
	#main-video {width: 1280px; height: 720px; margin-left: auto; margin-right: auto;}
	.steaming-iframe {height: 962px;}

	#details-view .text-box {width: 650px; float: right; clear: none; display: block; color: #999; }
	header .headings {width: 500px; }
	header .headings h3 {font-size: 18px; margin-top: -10px;}
	header .img-middle {display: none;}
	header .right {display: block;}
	header .logo-right {width: 210px; height: 150px;}
	header .logo {width: 162px; height: 162px; margin-right: 1em;}
}
@media screen and (min-width: 1651px) and (max-width: 1919px) {
/*	header .line-1 {zoom: 100%;}*/
	
  body {font-size: 14px; }
	#wrapper { width: 1550px; }
	.steaming-iframe {height: 1165px;}
	/*#main-video-container {width: 1280px;}
	#main-video {width: 1280px; height: 720px;}*/
	#main-video-container {width: 1280px;}
	#main-video {width: 1280px; height: 720px; margin-left: auto; margin-right: auto;}
	#details-view .text-box {width: 1035px; float: right; clear: none; display: block; color: #999; }
	header .img-middle {display: none;}
	header .right {display: block;}
	header .logo-right {width: 210px; height: 150px;}
	header .logo {width: 162px; height: 162px; margin-right: 1em;}
}
@media screen and (min-width: 1920px) and (max-width: 10000px) {
/*	header .line-1 {zoom: 100%;}*/
	
  body {font-size: 14px; }
	#wrapper { width: 1920px; }
	.steaming-iframe {height: 1443px;}
	/*#main-video-container {width: 1280px;}
	#main-video {width: 1280px; height: 720px;}*/
	#main-video-container {width: 1920px;}
	#main-video {width: 1920px; height: 1080px; margin-left: auto; margin-right: auto;}
	#details-view .text-box {width: 1035px; float: right; clear: none; display: block; color: #999; }
	header .img-middle {display: none;}
	header .right {display: block;}
	header .logo-right {width: 210px; height: 150px;}
	header .logo {width: 162px; height: 162px; margin-right: 1em;}
}
/*end responsive*/
