/*
School of the Art Institute of Chicago
Responsive Stylesheet
*/

@media only screen and (min-width: 768px) and (max-width: 996px) {

	html { background-size: auto 340px; }
	body { font-size: 14px; line-height: 22px; background-size: 1170px auto; }
	
	#wrap { width: 768px; background-position: -140px top; }
	.col-left { width: 470px;  padding: 0 0 30px 0; }	
	.col-right { width: 261px; font-size: 12px; line-height: 16px; }
	
	#phone { width: 261px; height: 83px; padding: 32px 0 0 0; font-size: 15px; line-height: 26px; background-size: 261px auto; }
	#phone strong { font-size: 36px; line-height: 36px; }

	#phone_link { width: 261px; height: 100px; padding: 32px 0 0 0; font-size: 15px; line-height: 26px; background-size: 261px auto; }
	#phone_link strong { font-size: 36px; line-height: 36px; }
	
	#hero { width: 450px;  margin-top:323px;}
	#hero h1 {font-size: 37px; padding: 10px 15px; }
	
	#col-right-form { width: 261px; min-height: 438px; }
	#col-right-form form { width: 230px; }
	#col-right-form h1 { padding: 20px 0 0 0; font-size: 19px; line-height: 29px; }
	#col-right-form h2 { padding: 0 10px 14px 10px; font-size: 18px; line-height: 24px; }
	#col-right-form input { width: 212px; margin: 0 0 9px 0; padding: 7px 9px; font-size: 14px; line-height: 20px; }
	#col-right-form form a#b-submit { width: 140px; height: 40px; margin: 11px auto 0 auto; background-size: 140px auto; }

	#col-right-link { width: 261px; min-height: 85px; }
	#col-right-link form { width: 230px; }
	#col-right-link h1 { padding: 25px 0 0 0; font-size: 25px; line-height: 29px; }
	#col-right-link h2 { padding: 0 10px 14px 10px; font-size: 18px; line-height: 24px; }
	#col-right-link input { width: 212px; margin: 0 0 9px 0; padding: 7px 9px; font-size: 14px; line-height: 20px; }
	#col-right-link form a#b-submit { width: 140px; height: 40px; margin: 11px auto 0 auto; background-size: 140px auto; }

	h1, h2, h3, h4, h5, h6 { padding-left: 0px; padding-right: 0px; }
	h1 { font-size: 26px; line-height: 32px; }
	h2 { padding-top: 35px; font-size: 22px; line-height: 29px; }
	h4 { font-size: 1.3em; font-weight: 700; line-height: 1.6em!important;}
	p { padding: 0 0px 18px 0px; }

	.col-right h3 { padding: 22px 25px 16px 25px; }
	.col-right ul { padding: 0 20px 20px 25px; }
	.col-right li { padding: 0 0 8px 24px; }

	.col-right #col-right-photos { padding: 30px 0 12px 0; width:261px; }
	.col-right #col-right-photos .photo-box { padding-left:32px; }
	.col-right #col-right-photos .photo-box img{ width:191px;}
	
	#video {width:414px;}
	#video .item img{ width:200px;}
	#video .item{width:200px;}
	#video .item_last{ margin-left:10px; 	 }
	
	#footer { width: 740px; padding: 24px 0; }

}

@media only screen and (min-width: 480px) and (max-width: 767px) {

	html { background-size: auto 322px; }
	body { font-size: 13px; line-height: 21px; background-size: 1110px auto; }

	#wrap { width: 480px; }
	.col-left { float: none; width: 480px; margin: 0 auto; padding: 0 0 20px 0; }
	.col-right { float: none; width: 480px; margin: 0 auto; font-size: 11px; line-height: 15px;  }

	#phone { width: 480px; height: 85px; padding: 22px 0 0 0; font-size: 15px; line-height: 26px; text-align: center; background-image: none; }
	#phone strong { font-size: 36px; line-height: 36px; }
	
	
	#hero { width: 480px;  margin-top:300px;}
	#hero h1 {font-size: 40px; padding: 10px 15px; margin-left:0; }
	
	
	#col-right-form { width: 480px; min-height: 472px; background-size: 480px auto; border-top: 1px solid #78473b; border-bottom: 1px solid #78473b; }
	#col-right-form h1 { padding: 25px 0 0 0; }

	#col-right-link { width: 480px; min-height: 85px; background-size: 480px auto; border-top: 1px solid #78473b; border-bottom: 1px solid #78473b; }
	#col-right-link h1 { padding: 25px 0 0 0; }

	h1, h2, h3, h4, h5, h6 { padding-left: 0; padding-right: 0; text-align: left; -webkit-text-size-adjust: none; }
	h1 { font-size: 30px; line-height: 30px; -webkit-text-size-adjust: none; }
	h2 { padding-top: 18px; font-size: 23px; line-height: 27px; -webkit-text-size-adjust: none; }
	p { padding: 0 0 16px 0; -webkit-text-size-adjust: none; }
	ul, li { -webkit-text-size-adjust: none; }

	.col-right h3 { padding: 20px 25px 14px 25px; }
	.col-right ul { padding: 0 30px 20px 30px; }
	.col-right li { padding: 0 0 8px 24px; }

	.col-right #col-right-photos { padding: 0 0 12px 0; width:480px; margin-bottom:30px; }
	.col-right #col-right-photos .photo-box {padding: 40px 0 0 123px;}
	.col-right #col-right-photos #photo-prev { margin-left: 84px; }
	.col-right #col-right-photos #photo-next { margin-right: 84px; }
	
	#video {width:424px;}
	#video .item img{ width:200px;}
	#video .item{width:200px;}
	#video .item_last{ margin-left:20px; 	 }

	#footer { width: 480px; padding: 18px 0; }
	#footer p span.phone{font-size:39px;}

}

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

	html { background-size: auto 215px; } 
	body { font-size: 13px; line-height: 21px; background-size: 1110px auto; }

	#wrap { width: 320px; }
	.col-left { float: none; width: 320px; margin: 0 auto; padding: 0 0 15px 0; }
	.col-right { float: none; width: 320px; margin: 0 auto; font-size: 11px; line-height: 15px;  }

	.col-left p, .col-left h2, .col-left h3 { padding-left: 10px; padding-right: 10px; }

	#phone { width: 320px; height: 80px; padding: 16px 0 0 0; font-size: 15px; line-height: 26px; text-align: center; background-image: none; color: #333!important; }
	#phone strong { font-size: 36px; line-height: 36px; color: #333 !important; display: none; }
	
	#logo {margin-left:80px;} 
	#hero { width: 320px;  margin-top:280px; margin-bottom:20px;}
	#hero h1 {font-size: 30px; padding: 10px 15px; margin-left:0; }

	#col-right-form { width: 320px; min-height: 462px; background-size: 320px auto; border-top: 1px solid #78473b; border-bottom: 1px solid #78473b; }
	#col-right-form h1 { padding: 20px 0 0 0; }

	#col-right-link { width: 320px; min-height: 85px; background-size: 320px auto; border-top: 1px solid #78473b; border-bottom: 1px solid #78473b; }
	#col-right-link h1 { padding: 20px 0 0 0; }


	h1, h2, h3, h4, h5, h6 { padding-left: 0; padding-right: 0; text-align: left; -webkit-text-size-adjust: none; }
	h1 { font-size: 24px; line-height: 30px; -webkit-text-size-adjust: none; }
	h2 { padding-top: 18px; font-size: 19px; line-height: 26px; -webkit-text-size-adjust: none; }
	p { padding: 0 0 14px 0; -webkit-text-size-adjust: none; }
	ul, li { -webkit-text-size-adjust: none; }

	.col-right h3 { padding: 20px 25px 14px 25px; }
	.col-right ul { padding: 0 25px 20px 30px; }
	.col-right li { padding: 0 0 8px 24px; }

	.col-right #col-right-photos { padding: 0 0 12px 0; width:320px; margin-bottom:20px;}
	.col-right #col-right-photos #photo-prev { margin-left: 4px; }
	.col-right #col-right-photos #photo-next { margin-right: 4px; }
	.col-right #col-right-photos .photo-box {  padding: 35px 0 0 48px; }

	#video {width:260px; padding:20px 30px;}
	#video .item img{ width:260px;}
	#video .item{width:260px;}
	#video .item_last{ margin-left:0px; margin-top:20px; 	 }

	#footer { width: 320px; padding: 16px 0 14px 0; }
	#footer p { line-height: 18px; text-align: center; }
	#footer p.fright { text-align:center; width: 320px; }
	#footer p.fleft { width: 320px; text-align:center; }
	.f_bottom{ margin-top:30px;}

	#footer p span.phone {
text-align: center!important;
font-style: normal;
font-weight: normal;
font-size: 50px;
background: none;
color: #fff;
padding: 0;
margin: 0;
font-family: "MeranProSmConBold", Arial, sans-serif;
/* display: block; */
/* margin: auto; */
width: 100%;
}

}