@charset "utf-8";
/* Layout for medium size screens */

header { 
	background-image:url(../images/FrontPageMainMedium.jpg);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	background-size: 900px 346px;
}

header a.logo{
	width: 90px;
	height: 115px;
	top: 195px;
	right: 20px;
	background-image:url(../images/CDSCLogoMedium_2x.png);
	background-size: 90px 112px;
	}
	
	

nav a {
	/*margin-right: 10px;*/
	font-size: .8em;
}

nav ul li{ 
		padding-left: 40px;
		}	

@media screen and (orientation : portrait){
	nav ul li{ 
		padding-left: 35px;
		}	
	nav ul li ul {
		width:220px; }
	nav ul li ul li {width:220px; }

}

@media screen and (orientation : landscape){
	nav ul li{ 
		padding-left: 60px;
		}	
	nav ul li ul {
		width:220px; }
	nav ul li ul li {width:220px; }

}

.promo_container {padding: 0px 20px 15px 20px;}

.promo_container .promo {background-position: 0px 25px;}

.promo_container .promo .content {
	/*padding: 110px 30px 0px 0px; */
	padding: 0px 30px 0px 0px;
	}
.promoText{
	padding-left: 0px;
	padding-top: 100px;
	}
.promo_container .promo .content .cta{padding-left: 0px;}


body {background-image:none;}

#hero {height: 346px;}
#hero .panel {width:100%; height: 346px;}
#hero .panel .caption {width:40%; top:200px;}


@media
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min--moz-device-pixel-ratio: 2),
	only screen and (-o-min-device-pixel-ratio: 2/1),
	only screen and (min-device-pixel-ratio: 2),
	only screen and (min-resolution: 192dpi),
	only screen and (min-resolution: 2dppx)
{

	header {
	background-image:url(../images/FrontPageMainMedium_2x.jpg);
	
	} 
	
	header a.logo {
		background-image:url(../images/CDSCLogoMedium_2x.png);
		}
}

/* -----------    Rules for secondary pages   ---------------------------------   */


.content_container { padding: 60px 20px 15px 20px;}

.content_container .mainContent {
	width: 65%;
	float: left;
	
	background-position: 0px 3px;
	}


.content_container .sideContent {
	width: 30%;
	float: right;
	background-position: 0px 3px;
	}

#mapIframe {
	width: 90%;
	height: 400px;
	display:block;
	}


#studioSpace1 {
	display: block;
	background-image:url(../images/StudioSpace1Medium.jpg);
	background-repeat: no-repeat;
	background-position:left;
	background-size: 250px 188px;
	width: 100%;
	height: 188px;
	}

#danceParty {
	display: block;
	background-image:url(../images/DancePartyMedium.jpg);
	background-repeat: no-repeat;
	background-position:left;
	background-size: 250px 138px;
	width: 100%;
	height: 138px;
	}

#showCase {
	display: block;
	background-image:url(../images/ShowcaseMedium.jpg);
	background-repeat: no-repeat;
	background-position:left;
	background-size: 250px 296px;
	width: 100%;
	height: 296px;
	}

#competition {
	display: block;
	background-image:url(../images/CompetitionMedium.jpg);
	background-repeat: no-repeat;
	background-position:left;
	background-size: 250px 247px;
	width: 100%;
	height: 247px;
	}


	
@media
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min--moz-device-pixel-ratio: 2),
	only screen and (-o-min-device-pixel-ratio: 2/1),
	only screen and (min-device-pixel-ratio: 2),
	only screen and (min-resolution: 192dpi),
	only screen and (min-resolution: 2dppx)
{
	#studioSpace1 {
	background-image:url(../images/StudioSpace1Medium_2x.jpg);
	}
	
	#danceParty {
	background-image:url(../images/DancePartyMedium_2x.jpg);
	}
	
	#showCase {
	background-image:url(../images/ShowcaseMedium_2x.jpg);
	}
	
	#competition {
	background-image:url(../images/CompetitionMedium_2x.jpg);
	}
	
}