/* --------------------------------------- */
/* CITCLOPS home css */
/* --------------------------------------- */

#content h3,
#content p {
	margin-bottom: 0px;
	}

#content h3	{ padding-top:0px; }

header
	{
	min-height:480px;
	}

/* caroussel */
.bx-wrapper 					{ margin-top: 18px !important; position:relative; }
.eyeonwater-slide 				{ background: url(/grfx/eyeonwater_logo_big.png) no-repeat; content:""; position:absolute; width:200px; height:200px; top:25px; right:0;} 
.bxslider						{ height: 268px; display: block; overflow: hidden; max-width:100%;}
.bx-viewport					{ height: auto !important; }


/* content */
#content						{ background-color: transparent; padding-right: 0px; padding-top:0px; }

#map_home
	{
	height:300px;
	border: 1px solid #7d7d7d;
	margin-bottom:10px;
	}

.gm-style
	{
	font-family:arial, helvetica, sans-serif;
	color:#666;
	}


#block-map
	{
	margin:0px 0px 20px 0px;
	display: inline-block;
	width:100%;
	}

/* featured */
#block-featured {
	background-color: #e0f0f8;
	border: 1px solid #acacac;
	margin-bottom: 18px;
	}

#block-featured h3 {
	background-color: #58bccc;
	font-weight: bold;
	font-size: 0.95em;
	color: #fff;
	text-transform: uppercase;
	padding: 6px 6px 5px 14px;
	}

#block-featured dl {
	border-bottom: 1px solid #788493;
	margin: 14px 14px 0px 14px;
	padding-bottom: 10px;
	display: block;
	}

#block-featured dl:last-child	{ margin-bottom: 10px; }

#block-featured dt {
	position: relative;
	border: 1px solid #aeaeae;
	width: 82px;
	height: 82px;
	float: left;
	overflow: hidden;
	}

#block-featured h6 {
	position: absolute;
	background-color: #58bccc;
	font-weight: normal;
	font-size: 0.7em;
	color: #fff;
	text-transform: uppercase;
	padding: 0px 6px 0px 6px;
	bottom: 10px;
	left: 0px;
	}

#block-featured dd {
	font-size: 0.8em;
	line-height: 1.4em;
	margin-left: 92px;
	}

#block-featured h4 {
	font-weight: bold;
	font-size: 1.2em;
	margin-bottom: 6px;
	}

#block-featured h4 a			{ color: #4d4a4a; }

.publication-date {
	font-style: italic;
	font-size: 0.85em;
	}

#buttons-block-featured {
	list-style: none;
	margin: 0px 14px 14px 14px;
	display: block;
	}

#buttons-block-featured li {
	font-size: 0.75em;
	text-transform: uppercase;
	width: 49%;
	float: left;
	}

#buttons-block-featured li:last-child {
	text-align: right;
	}

#buttons-block-featured a		{ color: #6d6c6c; }


/* signup */
#block-signup					{ display: inline-block; margin-bottom:10px;}
.block-signup {
	position: relative;
	border: 1px solid #7d7d7d;
	width: 314px;
	height: 220px;
	margin-right: 15px;
	padding: 24px 14px 14px 14px;
	float: left;
	display: block;
	}

.block-signup:last-child		{ margin-right: 0px; }

#content .block-signup h3 {
	position: absolute;
	background-color: #fff;
	border: 1px solid #7d7d7d;
	font-weight: normal;
	font-size: 1.1em;
	color: #4da3bc;
	padding: 3px 10px 3px 10px;
	top: -15px;
	left: 14px;
	}

#content .block-signup h4		{ font-weight: normal; font-size: 1em; margin-top: 6px; }

.block-signup input {
	font-family: arial,helvetica;
	font-size: 1em;
	color: #acacac;
	width: 295px;
	margin-top: 10px;
	padding: 6px 6px 6px 10px;
	}

.block-signup input:first-child	{ margin-top: 0px; }

.block-signup input.input-type-submit {
	position: absolute;
	background-color: #007ba0;
	background-image: url(/grfx/signup-arrow.png);
	background-repeat: no-repeat;
	background-position: 95% center;
	border: 0px;
	font-size: 1.2em;
	color: #fff;
	width: auto;
	padding-right: 30px;
	float: right;
	bottom: 14px;
	right: 14px;
	}

.block-videos {
	font-size: 1em;
	width: 225px;
	margin-right: 14px;
	float: left;
	border-bottom:1px solid #788493;
	min-height:315px;
	margin-bottom:15px;
	padding-bottom:10px;
	}

#btn-videos
	{
	background-image: url(/grfx/btn-videos.png);
	float:right;
    margin-top: 5px;
	}

#btn-videos a
	{
	display:block;
	cursor:pointer;
	width:135px;
	height:29px;
	text-indent:-9999px;
	}


.submit-newsletter				{ background-color: #58bccc !important; }

.block-highlight a				{ color: #fff; }
.block-videos a					{ color: #4d4a4a; }
.readmore						{ margin-top: 10px; float: right; }

.highlight-two-columns {
	background-color: #579fb8;
	width: 464px;
	min-height: 220px;
	margin-left: 0px;
	padding: 0px;
	}

#content .highlight-two-columns h3,
#content .highlight-two-columns p {
	margin: 0px 14px 10px 14px;
	}

#content .highlight-two-columns h3	{ margin-bottom:0px; padding-bottom:0px;}
	
#content h3	{ padding-left:0px;}

aside .block-highlight			{ font-size: 0.8em; margin-left: 0px; }

aside .block-highlight h3 a,
#content .block-highlight:last-child h3 a {
	color: #002740;
	}

.highlight-image				{ max-width: 100%; margin: 0px 0px 10px 0px !important; overflow: hidden; }
aside .highlight-image			{ height: 144px; }
.highlight-two-columns .highlight-image {
	height: 227px;
	}

.highlight-image img	{width:100%;}

.block-blue						{ background-color: #007ba0; 	margin-bottom: 18px; }
.block-home						{ min-height:308px; }




/* --------------------------------------- */
/* TABLET - mediaqueries css */
/* --------------------------------------- */

/* notebooks, tablets */
@media only screen and (max-width: 1024px) {

	.block-signup					{ width: 312px; }

	.block-videos 					{ width: 224px; }

	.highlight-two-columns 			{ width: 462px; }
}

/* notebooks, tablets */
@media only screen and (max-width: 960px) {

	.bxslider						{ height: 208px; max-width:100%;}
	.eyeonwater-slide				{ top:0;}
	.block-signup					{ width: 232px; }
	.block-signup input 			{ max-width: 90%; }

	.block-videos 					{width: 31.5%; overflow: hidden; min-height: 360px;}

	.highlight-two-columns 			{ width: 354px; }
}

/* tablets */
@media only screen and (max-width: 800px) {

	.bxslider						{ height: 208px; max-width:100%; }

	.block-signup 					{ width: 45%; margin-right:14px; }

	.block-videos 					{ width: 32%; min-height: 320px; }

	.highlight-two-columns 			{ width: 495px; }

	aside .block-highlight			{ width: 100%; box-sizing: border-box; }
	#content						{padding-left:0px;}

	#buttons-block-featured li      {width:100%;}
	#buttons-block-featured li:last-child {text-align:center;}

	.block-home                     { min-height:auto; }


}

/* tablets */
@media only screen and (max-width: 768px) {

	.block-videos 					{ width: 100%; float: none; min-height: auto !Important; overflow:hidden; }
	.block-home						{ min-height:auto; }
	
	.block-signup {
		width: 94%;
		margin-right: 0px;
		float: none;
		}

	.block-signup:last-child 		{ margin-top: 30px; }

	.block-highlight {
		margin-left: 0px;
		margin-right: 14px;
		float: left;
		}
	
	.block-highlight:first-child	{ margin-bottom: 18px; }

	.block-highlight:last-child,
	aside .block-highlight			{ margin-right: 0px; }

	aside .block-highlight			{ width: 100%; }

	.highlight-two-columns, .bx-wrapper .bx-caption	 			{ width: 100%; }

	.highlight-image img			{ width: 100%; }
	.eyeonwater-slide				{ background-size:100px 100px; width:100px !important; height:100px !important;}

	#content iframe { overflow: scroll;width: 100%; height: 300px; }
	#block-videos {margin-top:20px;}
}

/* tablets, mobiles */
@media only screen and (max-width: 480px) {

	.bxslider						{ height: 198px; }

	.block-signup 					{ width: 274px; height: auto; }
	.bx-wrapper .bx-viewport		{ height:125px !important; }

	.block-signup input.input-type-submit {
		position: relative;
		margin-top: 8px;
		right: 0px;
		bottom: 0px;
		float: none;
		}
	
	.eyeonwater-slide				{ background-size:50px 50px; width:50px !important; height:50px !important;}
	.bx-wrapper .bx-viewport		{ height:75px !important; }

}

/* mobiles */
@media only screen and (max-width: 360px) {

	.bxslider						{ height: 138px; }

	aside .block-highlight			{ width: 100%; }

	.block-signup 					{ width: 232px; }
	.bx-wrapper .bx-viewport		{ height:75px !important; }
	.eyeonwater-slide				{ background-size:50px 50px; width:50px !important; height:50px !important;}

}