@font-face {
	font-family: "DinPRO-Regular";
	src: url('/websvcs/templates/fonts/ffdin/DINWeb.woff');
}

@font-face {
	font-family: "DinPRO-Medium";
	src: url('/websvcs/templates/fonts/ffdin/DINWeb.woff');
	
}

@font-face {
	font-family: "DinPRO-Bold";
	src: url('/websvcs/templates/fonts/ffdin/DINWeb-Bold.woff');
	
}

#print-header{display: none;}

html{-webkit-text-size-adjust: none;}
p{font-size: .875em;}
a img{border: 0px;}
img{width: 100%}



@media (min-width: 0px) {
	body{width: 100%;background-image: none;margin: 0px;font-size: 1em;font-family: arial, helvetica, sans-serif;}
	a{text-decoration:none;}
	a:hover{color: #c75b12}
	h1 a, p a{color: #008542;}
	h4 a{}
	hr{color: #CCCCCC;margin-bottom: 10px;margin-top: 10px;}
	fieldset{border: 0px;}
	ol{font-size: .875em;}
	/*CONTAINER DIV RIGHT UNDER BODY, THIS SHOULD BE THE ONLY ONE TO HAVE A SET PIXEL WIDTH, ALL ELSE NEEDS PERCENTAGE WIDTHS*/
	
	#page-wrap{width: 100%;}
	
	/*LOGO AND HEADER*/
	
	#header{background-color: #c75b12; height; auto;}
	#logo-container{width: 80%; margin: 10px auto }
	.header-top-left{ }
	#school-logo{float:left; width:30%}
	#news-center{float:right; width: 70%;}
	#school-logo img{ margin-top: 5px; float:left;}
	#news-center img{  float:right; padding-top:9px;  }
	#header-top-right{display: block; height: 18px; width: 100%; text-align: center; background-color: #E98300;padding: 5px 0px;}
		#header-top-right img{width: 70%; margin-top: 3px; }
	#mobile-date .date{font-size:1em;text-align:center;color:#766A62;margin-top: 30px;margin-bottom: -10px;}
	#mobile-date .date br{display:none;}
	#mobile-date .current-date{margin-left: 5px;}
	/*This is only on for mobile view*/
	
	/*CONTENT, Contains Left, Middle, and Right*/
	
		#content{clear: both; margin: auto;width: 100%;}
		#content .date{display: none;}
		
		#left, #right{float: none; width: 100%; max-width: 100%;}

		#storymiddle, #storyright{margin-top: 10px;}
		.story_datep{margin-bottom: 20px !important;}
		.middle-title{}
			.middle-title a{background-color: #69be28; color:white !important; height: 15px; display:block; width: 97%;padding: 6px 0 6px 3%; text-transform: uppercase; font-family: 'DinPRO-Regular', arial; font-size: 17px}
		.story-content h1, .category h1{width: 97%; margin-left: 3%; margin-top: 10px; font-size: 1em;}
		.story-content h3, .category h3{width: 97%; margin-left: 3%; font-size: .8em; font-weight: normal; font-style:italic;}
			
		.story-content p, #sidebar p, .category p{width: 94%; margin: 10px 3%; font-size:.9em; line-height: 1.4;}
		.story-content a, #sidebar a, .category a{color: #008542;}
		.story-content img, #sidebar img, .category img{width: 100%; border: 0px;}
			.story-content a:active, .story-content a:visited, .category a:visited{color: #c75b12}
		.story-content ul, .story-content ol, #sidebar ul, #sidebar ol, .category ul, .category ol{width: 82%; margin: 10px 3% 10px 15%; padding:0px; font-size: .9em; line-height: 1.2}
			.story-content ul li, .story-content ol li, #sidebar ul li, #sidebar ol li, .category ul li, .category ol li{margin:4px 0;}
		.story-content #media, .category #media{border-top: 1px solid #a59d95; font-size: .7em; line-height: 1.2; padding-top: 10px;}
		.story-content hr, .category hr{margin-left: 3%; border-width: 0px; height: 1px; background-color:#a59d95; width: 94%}
		#sidebar img{max-width: 100%;}
		#social{width: 93%; margin:auto; padding-bottom: 10px; overflow-y:auto;}
			#social a img{width: 20%; height: auto; margin-right: 5px;}
			
		#mobile-sidebar, #sidebar{}
		#mobile-sidebar li, #sidebar li{padding: 2px 0;}
			#mobile-sidebar h1, #sidebar h1{font-size: 1.3em; margin: 10px 0%}
			#mobile-sidebar h2, #sidebar h2{font-size: 1.1em; margin: 10px 0%}
			#mobile-sidebar h3, #sidebar h3{font-size: 1.05em;margin: 10px 0%}
			#mobile-sidebar p, #sidebar p{margin: 10px 0;}

		.green-border{border:1px solid #69be28; font-family: 'DINPro-Regular', arial;}
			.green-box-heading{font-family: 'DINPro-Bold', arial;font-size: 16px !important; }
			.green-border b, .green-border strong{font-family: 'DINPro-Bold', arial; font-weight:normal;}
			.green-border ul, .green-border ol{margin-left: 30px !important; }
			.green-border ul li, .green-border ol li{margin: 13px 0;}
			.green-border .less-space-list li{margin: 0px;}
			.story-content .green-border p{padding: 3px 5%; width: 80%;}
			.green-border img{width: 94%; margin: 3%; padding-top: 10px;}
			.green-border .imageCaption{width: 94%; margin: auto;}
		
		.pull-quote{border: 0px solid #69be28; border-width: 2px 0 2px 0; padding: 12px 0;}
			.pull-quote p{font-family: 'DINPro-Bold', arial; color: black; font-size: 17px; line-height: 24px; margin: 0px !important;}
			.pull-quote .green{color: #69be28; font-size: 24px; font-family: 'times new roman'; margin-right: 2px;}
			.pull-quote .rightgreen{display: inline-block; height: 17px;}
			.story-content p.pull-quote-caption{display:block; font-weight: normal; font-size: 15px; line-height: 17px; font-family: "DinPRO-Regular", arial !important; padding-top: 15px;}
		
		pre{display:none;}
			
	/***************************/
	/********  IMAGES  *********/
	/***************************/
	
	.imagesDiv{width: 94%; margin: auto;}
	.imagesDiv img{margin-top: 0px;}
	.right-div, .left-div{float: none; width: 94%; margin:auto; margin-bottom: 15px}
	.portrait-right{width: 45%; float: right; margin: 0 3% 15px 3%;}
	.portrait-left{width: 45%; float:left; margin: 0 3% 15px 3%;}

			
	/***************************/
	/******** YOUTUBE  *********/
	/***************************/

	iframe{display:block;}
	.youtube-sidebarpage-100{height: 200px; width: 94%; margin: auto;}
	.youtube-sidebarpage-50{height: 200px; width: 94%; margin: auto;}
	.youtube-fullpage-100{height: 200px; width: 94%; margin: auto;}
	.youtube-fullpage-50{height: 200px; width: 94%; margin: auto;}

	.imageCaption{font-size: 13px; line-height: 18px; margin: 0px; padding-top: 5px;}
			
	/*LEFT NAVIGATION*/
	
		#left .date{margin: 5px 0 0 1px;}
		#left .search{display: block; width: 203px; margin:auto; margin-top:20px;}
		#left .search form{width: 100%; margin: auto;}
		#left .search input[type='text']{background-color: white;border: 1px solid #E89300;border-radius: 5px 5px 5px 5px;color: #A59D95;height: 25px;padding: 0 10px;width: 153px;	}
		#left .search input[type='submit']{background-color: transparent;background-image: url("/news/images/searchbutton.png");background-size: 20px auto;border: 0 none;height: 20px;width: 22px;margin-top: -1px;}
		#menu-container li{display: none;}
		#left ul{background-color: white; padding: 0px;}
		#left ul li.left-li-first{width: 185px;}
		.left-li-first a{color:white !important; font-size: 16px !important;}
		#left ul li a{color: black; font-size: 1em;}
		#menu-container{margin-top: 0px;}
		#responsive-menu{display: block; margin-left: 13px; font-size: 1em;}
		#responsive-menu select, #mobile-menu select{ margin-left: 10px;border-radius: 3px; background-color: #eee;}
		#mobile-menu select{padding: 5px;}
		#left .social{display: none;} /*toggled off in mobile view, there is another in the right hand*/
		#left ul li{padding: 0px;}
		#search-tab-img{width: 200px;}
		#responsive-menu{text-align: center; font-size: 1em;}
		#responsive-menu select{margin-left: 10px;}
		#left .social{display: none;}
	
	/********************************************/
	/********************************************/
	/*MIDDLE, STORY MIDDLE, STORY RIGHT, STORIES*/
	/********************************************/
	/********************************************/
	
	#text-size{ color: white; position: absolute; right: 3px; top: 4px; display:none;}

		/*#middle h3#blurb {font-weight: normal; font-style: italic;}*/
		div#storyright div.accolade {font-family: arial, helvetica; font-size: 0.875em; line-height: 1.4em;}
		div#storyright div.accolade h1.accolade {border-top: 1px solid #ddd; padding: 10px 0px 10px 0px;}
		div#storyright div.accolade h1.month_year {padding-bottom: 0px; clear: both; font-size: 1.2em; font-weight: bold; color: #E98300;}
		div#storyright div.accolade p { min-height: 1px; float: left; width: auto; display: inline;}
		div#storyright div.accolade div.thumbnail {padding: 0px; margin: 0px; float: left;}
		div#storyright div.accolade div.thumbnail img { width: 130px; padding: 0px; margin: 0px; }
        div#thisweek-sidebar li span.tw_accolade img { width: 75px; margin: 0px 5px 5px 0px; float: left;}
        div#thisweek-sidebar li { clear: left; margin: 10px 0; font-size: 1em; line-height: 1.3;}
        table#articles td img.img-left { width: 130px; }
		/*div#right ul.accolade_yrmo { background-color: #fff; list-style-type: none; margin-bottom: 1px; }
			div#right ul.accolade_yrmo li { padding: 4px 4px 4px 20px; list-style-type: none; font-size: 0.8em; line-height: 1.3em; }
			div#right ul.accolade_yrmo li.year { background-color: #999; color: #fff; font-weight: bold; }
			div#right ul.accolade_yrmo li.month { background-color: #fff; color: #333; }
			div#right ul.accolade_yrmo li.month:hover { background-color: #eee; color: #333; }*/
	
	#storyright, #storymiddle{position: relative;}

	#galleria {background: none repeat scroll 0 0 #FFFFFF;width: 320px; height: 294px;}
	.images-div a img{width: 100% !important;}
	.images-div{margin: auto;}
	

	
	#stories {margin: 3px 0px 0 0px;}
	#stories a{padding-left: 10px;}
	#stories h1 a{padding-left: 0px; font-family: arial;}
	#stories p{margin: 0 3% 0 3%; padding: 0px;}
	#blurb{font-size: .8em !important; padding-bottom: 10px;}
	
	#viewmore{display: block; text-align: center; padding-bottom: 10px; color: #008542;}
	/*CATEGORY - Mostly the same as Story middle*/
	
	.category p .img-left{margin-bottom: 10px; width: 112px !important; height: 112px !important; float: left;}
	.category hr{display: block; clear: both;}
	.category .img-left{margin-right: 10px;}
	.category h3, .category h1{font-size: 1em;}
	#view-more{clear: both; font-size: 1em; color: #008542; cursor: pointer;}
	#view-more:hover{color: #c75b12;}
	#view-more-container{display: none;}
	
	/*RIGHT, SIDEBAR - Most of this is not shown on Mobile, but the Social part does need to pop up for Mobile view.*/
	
	
	#right ul{padding: 0px; display:none;}
	#right .social{display: block; width: 70%; margin: auto;}
	#right .popular-stories, #right .in-print{display: none;}
	#right .social img{width: 10%; height: auto;}
	#right .social h1{font-size: .75em; float: left;}
	#right .first-li a:visited{color:white;}
	
	#mobile-sidebar{display: block; width: 94%; margin: auto; background-color:#eee; padding: 10px 0;}
	#sidebar a{color: #008542;}
	#sidebar{display: none;}
	
	
	/*This is for when there are lots of images in the article. Identify images as .images */
	#galleria-mobile{width: 300px; height: 300px; margin:auto; display:block;}
		.images, .table .captions, .table{display:none;}
	
	/**********************************/
	/*FOOTER, NOT SHOWN ON MOBILE VIEW*/
	/**********************************/

	#footer-back{display: none;}

	/*************************/
	/*****    HOMEPAGE   *****/
	/*************************/

	#middle{ margin-top: 10px;}
	.index h1{font-size: 1em; margin: 10px 10px;}
	.index p{margin: 10px; font-size: .9em;}
	.index p span{display:block;}
	.index hr{display:none;}
	.index .img-left{float: left; margin: 0 10px 10px 0px;}
	.index .middle-title a{background-image: url('/news/images/more.png'); display:block; background-repeat: no-repeat; background-position: 97% center; background-size: 20px;}

	/*******/
	/*PRINT*/
	/*******/
	
	.print{display: none;}

	/*THIS WEEK*/
	#thisweek p{width: 95%;margin: auto;font-family: Arial, Helvetica, sans-serif;color: #000;	margin: 10px auto;}
	#thisweek p a{color: #008542;text-decoration: none;	}
	.story-wide #thisweek, .story-sidebar #thisweek{display: none;}
	.this-week-container #left{display: none;}
	.thisweek #media{font-size: .75em;}
	.thisweek .img-left{margin: 0 10px 10px 0; float:left;}
	.thisweek p{padding: 0 10px;}
	.thisweek .middle-title{
		background-color: #777777;
		color: white;
		display: block;
		font-family: "DinPRO-Regular",arial,helvetica,sans-serif;
		font-size: 1em;
		padding: 10px;
		padding-top: 12px;
		padding-right: 0px;
		padding-left: 2%;
		text-transform: uppercase;
		width: 100%;
		margin-top: 10px;
		clear: both;
	}
	.thisweek a{color: #008542; text-decoration: none;}
	.thisweek a:hover, .thisweek a:visited{color: #c75b12;}
	.thisweek-name{font-weight: bold;}
	.thisweek-date{font-style: italic; display:block; text-align:center; font-size: .75em !important;}
	p .thisweek-date{text-align:left;}
	.thisweek hr{display: block; clear: both;}
	#thisweek-sidebar{width: 94%; margin: auto; font-size: .8em;}
	#thisweek-sidebar img{max-width: 100%; width: 100%; height: auto;}
	#thisweek-sidebar h1{font-size: 1.1em;}
	#thisweek-sidebar ul{margin-left: 0%; list-style-type:none; padding-left: 0px;}
	#thisweek-sidebar ul li{padding: 0px 10px;;}
	#thisweek-sidebar p{font-size: 100%;}
	#thisweek-sidebar table td{font-size: 1em;}
	#thisweek-sidebar a{color: #008542; text-decoration: none;}
	#thisweek-sidebar a:hover, #thisweek-sidebar a:visited{color: #c75b12;}
	#thisweek-sidebar .first-li{background-color: #666;;}
	#thisweek-sidebar .first-li a{color:white; font-size: 16px;display:block; padding: 10px 0; margin-bottom: 10px;} 
	
	
	/*ARCHIVE PAGE*/
	#archive-navigation{
		border: 0px solid #999;
		border-right-width:0px;
		border-left-width: 0px;
		padding: 5px 0px; 
		font-size: 1em;	
		margin-top: 5px;
	}
	#archive-navigation table{
		background-color: white;
		width: 94%;	
		height: 0px;
		font-size: 1em;
		margin: 0 3%;
		margin-bottom: 10px;
		border: 1px solid #dddddd;
		border-left-width: 0px;
		border-right-width: 0px;
	}
	#archive-navigation table td{padding: 5px 0px;}
	#archive-navigation td{font-size: .75em;}
	#archive-navigation button {height: 18px;margin: 0;}
	
	#archives{position: relative;}
	#arrows{position: absolute; top: 0; right: 0;}
	
	#arrows a{display:block; height: 20px; width: 28px; float:left; background-image:url('../images/arrows.png'); background-size:60px auto; margin-right: 25px;}
	#asc:hover{background-image:url('../images/arrows.png'); background-position: 30px 0;}
	#desc{background-position: 0 -20px;}
	#desc:hover{background-position: 30px 66px;}
	#archive-container table{width: 94%; margin: auto;}
	.story-name{ font-size: .9em; vertical-align:top; padding: 5px 0;}
	.story-name a{color: #008542;}
	.story-date{width: 12.5%; font-size: .8em; text-align: right; vertical-align:top; padding: 5px 0; color: #5a5a5a;}
	.page-title{text-transform:uppercase;color: #008542; text-align: center; font-family: "DINPro Medium", arial, helvetica, sans-serif; font-size: 1.4em; display:block; padding-top: 15px;}
	#archive-container .month a{color: black; pointer: cursor}
	
	/*EMAIL SHARE BOX*/
	
	.ui-dialog{background-color: white; border: 2px solid #e98300; width: 350px; height: auto; position:absolute;}
	.ui-dialog-titlebar{height: 40px; background-color: #e98300; background-image: url('/news/images/emailbg.png'); background-repeat: repeat-x; border: 0px solid #69be28; border-bottom-width: 5px;}
	.ui-dialog-title{color: white; padding-top: 5px; display:block; font-size: 1.4em; font-family: 'DinPRO-Regular', arial; margin-left: 10px; float:left;}
	.ui-icon-closethick{display: block;text-indent: -9999px;width: 30px;height: 30px;float: right; margin-right: 4px;margin-top: 6px;background-image: url('/news/images/emailclose.png');background-repeat: no-repeat;}
	
	#email-box ul{list-style-type: none;padding-left: 10px; font-size: 1em; color: #555; font-family: 'DinPRO-Regular', arial, sans-serif;}
		#email-box ul li label{display: block;width: 39%;float: left;clear: both;text-align: right;padding-right: 5px;}
		#email-box ul li{margin: 7px 0;}
		#email-box ul li input[type='text']{width: 150px; color: #555;}
		#email-box ul li textarea{height: 100px; width: 148px;}
		#email-box ul li input[type='reset'], #email-box ul li input[type='button']{padding: 5px 12px;font-weight: bold;color: #444;text-transform: capitalize;font-family: arial;border-color: #aaa;border-width: 1px;border-style: solid;border-radius: 5px; float:right; cursor: pointer;}
			#email-box ul li input[type='reset']:hover{background-color: #008542; color:white;}
			#email-box ul li input[type='button']:hover{background-color: #008542; color:white;}
		#email-box #send{margin: 0 18px 0px 10px;}
		#email-box #response, #email-box span{padding: 0 10px;}
			#email-box span{font-size: .875em; color: red; display:block;}
			#email-box .success{padding: 0 10px;}
	

	
	#error-message{border: 2px solid #f3f3f3; margin-top: 20px;width: 90%; margin: auto; font-family: 'DinPRO-Bold', arial, helvetica; text-align: center; padding: 1%;}
	#error-message p{font-family: 'DinPRO-Bold', arial, helvetica;}
	#error-message b{font-size: 20px;}
}

@media (min-width: 320px) {

}

@media (min-width: 480px) {
	/*ANDROID LANDSCAPE*/
	#logo-container{width:45%; margin: auto;  display:block; padding-top: 4px; padding-bottom: 5px;}
	#header-top-right img{width: 50%; margin-top: 1px; }

	#galleria {background: none repeat scroll 0 0 #FFFFFF;height: 300px;width: 450px; margin: auto;}

	/***************************/
	/********  IMAGES  *********/
	/***************************/
	
	.width-10, .width-15, .width-20, .width-25, .width-30, .width-35{width: 33%; margin: 5px auto 10px auto}
	.width-40, .width-45, .width-50, .width-55, .width-60{width: 50%; margin: 5px auto 10px auto}
	.width-65, .width-70, .width-75, .width-100{width: 94%; margin: 5px auto 10px auto}
	.width-100{margin-bottom: 20px;}
	.right-div{float: right; margin-left: 3%; margin-right: 3%} 
	.left-div{float: left; margin-right: 3%; margin-left: 3%}
	.portrait-right{width: 45%; float: right; margin: 0 3% 15px 3%;}
	.portrait-left{width: 45%; float:left; margin: 0 3% 15px 3%;}

	.index p{min-height: 115px;}
	
}

@media (min-width: 640px) {
	body{width: 100%;background-position: center -25px;}

	#galleria {background: none repeat scroll 0 0 #FFFFFF;height: 300px;width: 450px;}
	#error-message{width: 435px;}

	.story-content .green-border p{padding: 3px 3%; width: 85%;}

	/***************************/
	/******** YOUTUBE  *********/
	/***************************/

	iframe{display:block;}
	.youtube-sidebarpage-100{height: 200px; width: 94%; margin: auto;}
	.youtube-sidebarpage-50{height: 200px; width: 94%; margin: auto;}
	.youtube-fullpage-100{height: 360px; width: 94%; margin: auto;}
	.youtube-fullpage-50{height: 250px; width: 50%; margin: 0 20px 10px 3%;}
}

@media (min-width: 768px) {
	/*IPAD PORTRAIT*/
	body{width: 100%;background-position: center -25px;background-image: url("../images/header-bg-image-2.jpg?v=123");background-repeat: repeat-x;}	
	hr{display: block !important;}
	
	#page-wrap{width: 100%;}
	
	/*LOGO AND HEADER*/
	#header{ border-bottom: 5px solid #e98300}
	#logo-container{width: 720px ; height: 80px;}
	#school-logo{float:left; width:10%}
	#news-center{float:left; width: 25%; margin-left: 10px; margin-top: -5px}
	#header-top-right{float: right; background-color: transparent; width: 45%; margin-top:-57px; margin-right: 20px;}
		#header-top-right img{width: 100%;}
	#mobile-date .date{display:none}

	/*CONTENT, Contains Left, Middle, and Right*/
	
	#content .date{display:block; padding: 5px 0; margin-top: 5px;} 
		#content .date br{display:none;}
		#content .current-date{margin-left: 5px;}
	
	pre{display:block;}

	#storymiddle, #storyright{margin-top: 10px;}
	#storyright{width: 71%;float: left;}
		#storyright .middle-title a{margin-left: 10px;}
	#storymiddle{width: 50%; float:left;}
	#mobile-sidebar{display:none;}
	#sidebar{display:block; width: 20%; padding: 10px; font-size: .9em; float: right; background-color: #eee; margin-top: 10px;}
		.middle-title{}
			.middle-title a{background-color: white; color:#008542 !important; height: auto; display:block; width: 97%;padding: 6px 0 16px 9px; text-transform: uppercase; 
			font-family: 'DinPRO-Regular', arial; font-size: 1.4em;}
		.story-content h1{font-size: 1em;}
		.story-content p{width: 97%;  line-height: 1.4; margin: 10px 0 10px 3%; padding: 0px 0;}
		.story-content ul, .story-content ol{width: auto; margin: 10px 3% 10px 80px; padding:0px; font-size: .9em;}
		.story-content hr{}

		.story-content .green-border p{padding: 3px 0%; width: 85%;}
		
		#social{width: 93%; margin:auto; padding-bottom: 10px; overflow-y:auto;}
			#social a img{width: auto; height: 18px; margin-right: 5px;}
	#left, #right{width: 24%; display: block;float: left; margin-top: 10px;}
	
			.green-border p{width: 100% !important; margin: 10px 0 !important;}
			.green-border img{width: 100%; margin: 0px 0%; padding-top: 00px;}
			.green-border .imageCaption{width: 100%; margin: auto;}
				
	/***************************/
	/********  IMAGES  *********/
	/***************************/
	
	
	.width-10{width: 10%}
	.width-15{width: 15%;}
	.width-25{width: 20%;}
	.width-20{width: 25%;}
	.width-30{width: 30%;}
	.width-35{width: 35%;}
	.width-40{width: 40%;}
	.width-45{width: 45%;}
	.width-50{width: 50%;}
	.width-55{width: 55%;}
	.width-60{width: 60%;}
	.width-65{width: 65%}
	.width-70{width: 70%;}
	.width-75{width: 75%;}
	.width-100{width: 94%; margin:auto; margin-bottom: 20px;}
	.right-div{float: right; margin-left: 3%;} 
	.left-div{float: left; margin-right: 3%}

	.slideshow-fullpage-50{width: 50%;}

	#sidebar .width-100{width: 100%; margin:auto;  margin-bottom: 20px;}
	#sidebar .right-div{float: right; margin-left: 3%; margin-right: 0;} 
	#sidebar .left-div{float: left; margin-right: 3%; margin-left: 0}

	/***************************/
	/******** YOUTUBE  *********/
	/***************************/

	iframe{display:block;}
	.youtube-sidebarpage-100{height: 200px; width: 94%; margin: auto;}
	.youtube-sidebarpage-50{height: 200px; width: 94%; margin: auto;}
	.youtube-fullpage-100{height: 360px; width: 94%; margin: auto;}
	.youtube-fullpage-50{height: 200px; width: 50%; margin: 0 20px 10px 3%;}
	
	
	/*LEFT NAVIGATION*/
	
	#menu-container{display: block; background-color: #eee; margin: 0px !important;}
	#menu-container li{display: block;}
	#responsive-menu{display: none;}
	#left{margin-left: 1%;}
	#left .search{display: block; width: 209px; margin-top: 0px;}
	#left .search form{width: 100%; margin: auto;}
	#left .search input[type='text']{color: #333;height: 25px;padding: 0 10px;width: 127px;	}
	#left .search input[type='submit']{background-size: 20px auto;border: 0 none;height: 20px;width: 22px;}
	#left ul{background-color: #eee;}
	#content #left ul li.left-li-first{width: auto; font-size:  12px !important; background-color: #69be28;}
	.left-li-first a{color:white !important; font-size: 16px !important;padding-top: 5px; padding-bottom: 1px; display:block; }
	#left ul li, #right ul li{font-size: .8em; padding: 8px;}
	#left img{width: 100% !important; height: auto;}
	#left a img{width: 20% !important; height: auto;}
	#left .social{display: block; margin-top: 10px;}
	#left .social a{margin-left: 5px;}
		#menu li a, #menu-container li a{font-family: "DINPro-Regular", arial, sans-serif; font-size: 1em;}
		#menu li a:hover, #menu-container li a:hover{color: #c75b12;}
	#left h1 {font-family: "DinPRO-Regular",Arial,Helvetica,sans-serif;font-size: 0.8em;font-weight: normal;margin: 2px 0 5px 5px;text-align: left;}
	
	/*MIDDLE, STORY MIDDLE, STORY RIGHT*/
	
	#text-size{ color: black;position: absolute; right: 0px; top: 0px; display:block;}

	#galleria {background: none repeat scroll 0 0 #FFFFFF;height: 495px;width: 550px;}
	
	#stories p{}
	#stories h1 a{margin-bottom: 10px; display:block;}
	#stories a{padding-left: 0px;}
	#blurb{font-size: .875em !important;}
	
	/***************************/
	/******** HOMEPAGE  ********/
	/***************************/

	#right ul{display:block; width: 180px; float: right; background-color: #eee;padding-bottom: 10px;padding-top: 0px; margin-top: 5px;}
	#right li.first-li{  color: white; background-color: #777777;font-size: 16px; vertical-align: top; font-family: "DinPRO-Regular", arial, helvetica, sans-serif;}
	#right li.first-li a{color: white;}
	#right #thisweek, #right .social{display:none;}
	#right a{color: #008542;}
	.index #middle{width: 360px; float: left; margin-left: 10px; margin-bottom: 40px;}
	.index #middle .img-left{margin-bottom: 5px;}
	.index #middle p{margin: 0px; margin-left: 10px; font-size: .9em;}
	.index #middle hr{margin-left: 10px; width: 345px;}
	.index h1{margin: 10px 0; margin-left: 10px; font-size: 1.1em;margin-top: 0px;}

	/*CATEGORY - Mostly the same as Story middle*/
	
	.category .middle-title{background-color: white; color: #008542; width: 100%; padding: 5px 0 5px 0%; display: block; clear:both;}
	
	/*RIGHT, SIDEBAR*/

	/*THIS WEEK*/
	.this-week-container #left{display:block;}
	.thisweek{float: left; width: 365px; margin-left: 10px;}
	.thisweek .page-title{text-align: left;}
		.thisweek .page-title a{color: #008542}
		.thisweek p{padding: 0 10px 0 0}
		.thisweek-date{text-align: left; font-size: .9em !important;;}
		.thisweek .middle-title{font-size: .9em;}
	#thisweek-sidebar{float: right; width: 180px; margin-right: 10px; background-color: #eee;}
	#thisweek-sidebar li.first-li a{font-size: 1.1em;}
	
	#archive-container table{width: 97%; margin: auto; margin-left: 20px;}
	.story-date{width: 20%; font-size: .8em; text-align: right; vertical-align:top; padding: 5px 0;}
	
	#archive-navigation table{
		margin: 0 0 10px 0;
		margin-left: 20px;
	}
	.green-border{padding: 15px;}
	.left-div{margin-left: 3%}
	.right-div{margin-right: 0;}
	.full-div{width: 94%; margin: auto;}
	
	#error-message{width: 300px; padding: 2%;}
	
	#footer-back{width: 100%; background-image: url('/websvcs/templates/gateway/images/footerbg.png'); background-repeat: repeat-x; padding:32px 0 25px 0; clear:both; margin-top:10px;}
	#footer-back .wordmark{display:block; height: 23px; text-align:center; font-family: "DinPRO-Regular", arial; font-size: 18px; text-transform: uppercase; letter-spacing: 5px; color: #5e5e5e; }
	#footernav{display:none;}
		.footer-bottom{display:none;}
		
	#contact-tables{margin-left: 20px;}
}

@media (min-width: 960px) {

	/*IPAD LANDSCAPE AND UP*/
	
	html, body { width: 100%; display: block; margin: 0px; padding: 0px; font-family: Arial, Helvetica, sans-serif; }	
	body{padding: 0px;font-family: Arial,Helvetica,sans-serif;font-size: 1em;background-image: url('/news/images/header-bg-image.jpg');background-repeat: repeat-x;background-color: white;}
	hr, #middfle hr{color:#CCCCCC;margin-top:10px;margin-bottom:10px;clear: both;display: block !important;}	
	img{border: 0px;}
	a{cursor: pointer;}
	
	#page-wrap{width: 980px;margin: 0 auto;}
	
	/*LOGO AND HEADER*/
	
	#header{width: 100%;}
	#logo-container{height: 66px; width: 960px;}
	#school-logo{float:left; width:60px}
	#news-center{float:left; width: 160px; margin-left: 10px; margin-top: -5px}
	#header-top-right{float: right; background-color: transparent; width: 370px; margin-top:-50px; margin-right: 20px;}
		#header-top-right img{width: 100%;}
	#mobile-date .date{display:none}

	/*CONTENT, Contains Left, Middle, and Right*/
	
	#content{clear: both; margin-top:10px}
		.story-content h1{font-size: 19px;margin-left: 19px;}
		.story-content p{width: 97%;}
	
	#storymiddle{width: 470px; float:left;}
		#storymiddle .middle-title a{margin-left: 2px;}
		#storymiddle h1{margin-left: 12px; }
	#storyright .middle-title{}
	#mobile-sidebar{display:none;}
	#sidebar{display:block; width: 225px; padding: 15px; font-size: .9em; float: right; background-color: #eee; margin-top: 10px;}
		#mobile-sidebar .width-100.green-border, #sidebar .width-100.green-border{max-width:195px;}

	/***************************/
	/******** YOUTUBE  *********/
	/***************************/

	iframe{display:block;}
	.youtube-sidebarpage-100{height: 200px; width: 94%; margin: auto;}
	.youtube-sidebarpage-50{height: 200px; width: 94%; margin: auto;}
	.youtube-fullpage-100{height: 400px; width: 94%; margin: 20px auto;}
	.youtube-fullpage-50{height: 250px; width: 50%; margin: 0 20px 10px 3%;}
	
	/*LEFT NAVIGATION*/
	
	#left{width: 230px;max-width: 255px;float: left;}
	#left h1{font-family: "DinPRO-Regular", Arial, Helvetica, sans-serif;font-size:.8em;font-weight:normal;margin: 2px 0 5px 5px;text-align:left;}	
	#left ul{list-style-type: none;background-color:#EEEEEE;margin-top:0px;}	
	#left ul li.left-li-first{color: white;background-color:#69BE28;font-size: 16px;width: 215px;font-family:"DinPRO-Medium", Arial, Helvetica, sans-serif;}	
	#left ul li{font-size: .9em;color:#444444;padding: 5px 5px 5px 0px;padding-left:10px;line-height:1.3em;}
	#left ul li a{text-decoration: none;font-size: 1em;font-family:"DinPRO-Medium", Arial, Helvetica, sans-serif;	}
	#left ul li a:hover, #left ul li a:visited{color: #c75b12;}	
	#left .search{margin-left: 0px;}
	#left .search input[type="text"]{width: 160px;}
	
	/*MIDDLE, STORY MIDDLE, STORY RIGHT*/
	
	.right{float: right;}
	.left{float: left;}
	
	#galleria {background: none repeat scroll 0 0 #FFFFFF;height: 550px;width: 675px;}
	
	/*CATEGORY - Mostly the same as Story middle*/
	/*RIGHT, SIDEBAR - Most of this is not shown on Mobile, but the Social part does need to pop up for Mobile view.*/

	/*This is for when there are lots of images in the article. Identify images as .images. IF THE IMAGES ARE IN TABLES, PLEASE LABEL TABLE AS .table */
	
	#galleria-mobile{ display:none;}
		.images, .table .captions, .table{display:block;}
			
	/*THIS WEEK*/
	.thisweek .page-title{padding-top: 10px; font-family: 'DinPRO-Regular', arial;}
	.thisweek .middle-title{color: #e98300; background-color: white; padding-left: 0px; font-size: 1.2em; font-family: 'DinPRO-Bold', arial; text-transform: capitalize; }
	.thisweek{width: 490px; margin-left: 15px;}
	.thisweek p{font-size: .8em; line-height: 1.3}
	#thisweek-sidebar{width: 200px;}


	/***************************/
	/******** HOMEPAGE  ********/
	/***************************/

	.index #middle{width: 470px; }
	.index #middle h1{margin-left: 10px;}
	.index #middle p{margin: 0px; margin-left: 10px; font-size: .9em;}
	.index #middle hr{margin-left: 10px; width: 455px;}
	#right ul{width: 220px;}

	#error-message{width: 300px; padding: 2%;}
	#error-message p{font-family: 'DinPRO-Bold', arial, helvetica !important;}

	/*FOR CATEGORY PAGES*/
	
	.category .img-left{margin-right: 10px !important; margin-bottom: 10px !important;}

	/*FOOTER, ONLY AVAILABLE IN DESKTOP VIEW*/
	
/*Footer*/

#footer-back{display:block;width: 100%; background-image: url('/websvcs/templates/gateway/images/footerbg.png'); background-repeat: repeat-x; padding:32px 0 25px 0; clear:both; margin-top:10px;}
#footer-back a:hover{}
	#footer-back .wordmark{display:block; height: 26px; text-align:center; font-family: "DinPRO-Regular", arial; font-size: 26px; text-transform: uppercase; letter-spacing: 5px; color: #5e5e5e; text-shadow: 1px 1px 1px gray;}
	#footernav{height: 164px; padding-top: 35px; width: 940px; margin: auto; padding-left: 20px; display:block;}
	#footernav li{list-style-type:none;}
	#footernav li a:hover{text-decoration:underline;}
	#footernav ul{padding-left:0px;}
	.footer-first{float: left;}
	.footer-first a{color:white; font-family: "DinPRO-Regular", arial, sans-serif; font-size: 1.23em; display:block; border: 0px solid #b7b1a9; border-bottom-width: 1px;}
	.footer-first li{margin: 5px 0;}
	.footer-first li a{color: white; font-size: .875em; font-family: "DinPRO-Regular", arial, sans-serif; border-width:0px; height:16px;}
		#about, #academcis, 
		#about{width: 200px;}
		#academics{width: 168px;}
		#admissions{width: 192px;}
		#life{width: 189px;}
		#gift{width: 149px;}
		
		#about, #academics, #admissions, #life, #gift{height: 26px;}
	.footer-first ul{margin-top: 9px;}
	.footer-bottom{font-size: .7em; text-align:center; color: white; margin-top: 25px; display:block;}
		.footer-bottom a{color:white;}
		.footer-bottom p{margin: 0px; width: 98%; }
	
	#mod-date{color:white; font-size: .6em; text-align: center; margin-top: 2px;}
		#mod-date a{color:white;}
}