/* id-css-layout.php?css=landing-wide&colour=69C4D9 */
/* generated fresh */


/* ##### Begin device "id-css-layouts/landing-wide.css" ##### */

#bodycontainer #pagebanner .copy {
	border-left: 0px;
	padding-left: 30px;
}

#bodycontainer #pagebanner .copy h2 {
	border-left: 15px solid #69c4d9;
	padding-left: 15px;
	margin-left: -30px;
}

#navcontainer {
	margin-top: 401px;
	padding-top: 0px;}

#bodycontainer #pagebanner {
	margin-left: -182px;
	height: 70px;
}

#bodycontainer #pagebanner .copy {
	height: 100%;
}

#bodycontainer ol#breadcrumbs {
	margin-left: -182px;
	padding-left: 1em;
	height: 15px;
	margin-bottom: 15px;
	margin-top: 15px;
}

@media screen and (max-width: 900px) {
	#bodycontainer #pagebanner {
		margin-left: -0px;
	}

	#spotlight_mk3 {
		margin-left: -10px;
		margin-right: -10px;
	}
}

div.landing-wide-banner {
	overflow: hidden;
	height: 283px;
	margin-left: -213px;
	margin-right: -30px;
	border-top: 3px solid #69c4d9;
	background-color: white;
	position: relative;
	background-position: bottom left;
	background-image: url("../graphics/id-css-layouts/landing-shadow-bottom.png");
	background-repeat: repeat-x;
	background-color: white;
	z-index: 50;
}

div.landing-wide-banner:before{
	content: url("../graphics/id-css-layouts/landing-wide-dots-overlay.gif");
	position: absolute;
	z-index: 60;
	bottom: 33px;
	left: 0px;
}
div.landing-wide-banner:after{
	content: url("../graphics/id-css-layouts/landing-wide-dots-overlay.gif");
	position: absolute;
	z-index: 60;
	bottom: 33px;
	right: 0px;
}
div.landing-wide-banner > div.image-center {
	float:left;
	position: relative;
	right: -50%;
}
div.landing-wide-banner > div.image-center > img {
	position: relative;
	height: 250px;
	left: -50%;
	z-index: -10;
	margin: 0px !important;
	
	border-bottom: 3px solid #69c4d9;
}

#pagecontentbox {
	margin-top: 0px;
}

#bodycontainer #pagecontainer {
	padding: 0px;

}
div.landing-wide-banner div[class^="copy-"] {
	display: table;
	position: absolute;
	top: 0px;
	bottom: 63px;
	right: 45px;
	width: 400px;
	height: 250px;
	overflow-y: auto;

}
div.landing-wide-banner div[class^="copy-"] > div {
	display: table-cell;
	width: 100%;
	padding: 30px;
}

div.landing-wide-banner div.copy-right > div {
	vertical-align: middle;
}
div.landing-wide-banner div.copy-top-right > div {
	vertical-align: top;

}
div.landing-wide-banner div[class^="copy-"] > div > div {
	background: url("../graphics/id-css-layouts/background-dark-trans.png") center center repeat;
	font-size: 14px;
	padding: 15px 20px 10px 20px;
}

@media screen and (max-width: 900px) {

	div.landing-wide-banner, 
	#bodycontainer div.shadow-bottom {
		margin-right: -10px;
		margin-left: -10px;
	}
	#centrecontainer2col #pagecontentbox {
		border-left: 0px;
	}
	div.landing-wide-banner > div.image-center > img {
		height: 200px;
	}
	div.landing-wide-banner div[class^="copy-"] {
		
		height: 200px;
	}

	div.landing-wide-banner {
		height: 233px;
	}
	div.landing-wide-banner:before {
		left: 20px;
	}
	div.landing-wide-banner:after {
		right: 20px;
	}
}

@media screen and (max-width: 600px) {
	div.landing-wide-banner > div.image-center > img {
		height: 150px;
	}

	div.landing-wide-banner {
		height: 183px;
	}
	div.landing-wide-banner div[class^="copy-"] {
		display: block;
		right: 50px;
		left: 50px;
		top: 0px;
		width: auto !important;
		text-align: center;
	}
	div.landing-wide-banner div[class^="copy-"] > div {
		padding: 0px;
		display: inline-block;
	}
	div.landing-wide-banner div[class^="copy-"] > div > div {
		height: 125px;
		overflow-y: auto;
	}
}
@media screen and (max-width: 400px) {
	div.landing-wide-banner div[class^="copy-"] {
		right: 0px;
		left: 0px;
		z-index:80;
	}
}

