/* Responsive elements                              */
/* ------------------------------------------------ */

@media screen and (min-width: 1281px) {
	#header, #wrapper, #homepageboxes, #footer {
		width: 1230px;
	}
	
	#navbar {
		clear: none;
		padding: 25px 0 0 0;
	}
	
	/*
	#homepageboxes .sotw h3 {
		background: 0;
		margin-left: 0;
		padding-left: 0;
	}
	*/
	
}

@media screen and (max-width: 1280px) {
	#header, #wrapper, #homepageboxes, #footer {
		width: auto;
	}
	
	.sotw {
		background: #e8b201 url(images/3877181a-b167-41cc-a8e5-8cbd890dad6b.jpg) left bottom repeat-x;
	}
	
	/*
	.sotw:after {
		width: 138px;
		left: auto;
	}
	
	
	#homepageboxes .sotw h3 {
		background: 0;
		margin-left: 0;
		padding-left: 0;
	}
	*/
}

@media screen and ( max-width: 976px ) {
	#headerimage img {
		min-width: 700px;
		overflow: hidden;
	}

	a#header-title {
		font-size: 40px;
	}
	
	span#tagline {
		font-size: 17px;
		padding-top: 5px;
	}
	
	#contact {
		float: left;
		width: 70%;
		margin-top: 8px;
		text-align: left;
	}
	
	#phone {
		float: left;
		font-size: 17px;
		margin-bottom: 0;
		background: url(images/phone-sm.png) left top no-repeat;
		margin-right: 18px;
	}
	#email a {
		background: url(images/email-sm.png) left top no-repeat;
	}
	
	#phone, #email a {
		line-height: 33px;
		padding-left: 30px;
	}
	
	#social {
		margin-top: 20px;
		z-index: 999;
	}
	
	#homepageboxes-wrapper {
		padding: 20px 0;
	}
	
	.homepagebox {
		background-size: cover;
	}
	
	.principal {
		background-size: initial;
	}
	
	.homepagebox {
		min-height: 70px;
	}

	
	.homepagebox h3 {
		background: none;
	}

	.principal, .sotw {
		width: 93%;
	}
	
	.sotw {
		background: #e8b201 url(images/3877181a-b167-41cc-a8e5-8cbd890dad6b.jpg) left bottom repeat-x;
	}
	
	#homepageboxes .middlerow {
		margin-top: 0;
		margin-bottom: 0;
	}
	
	
	#homepageboxes .homepagebox {
		margin-bottom: 3%;
	}
	
	
	#homepageboxes .absences, #homepageboxes .news {
		margin-bottom: 0;
	}
	
	.homepagebox h3 {
		font-size: 24px;
	}
	
	.sotw:after {
		width: auto;
		left: 0;
	}
	
	img.eventpic {
		display: none;
	}
	
	.eventtext {
		margin: 0 44px 0 0;
	}
}




@media screen and ( max-width: 760px ) {
	#header, #footer {
		width: auto;
	}
	
	#wrapper, #homepageboxes {
		width: 500px;
	}
	
	#headerimage {
		display: none;
	}
	
	#phone, #email a {
		font-size: 15px;
	}
	
	#social {
		margin-top: 0;
		width: 234px;
	}
	/*#social img:hover {
		opacity: 0.5;
	}*/
	
	img#fb, img#twitterlg {
		display: none;
	}
	
	img#facebooksm, img#twittersm, img#facebook-intsm {
		display: block;
	}
	
	a#facebook, a#twitter, a#facebook-int {
		background: none;
		width: 30px;
		padding-top: 3px;
	}
	
	#homepageboxes-wrapper {
		padding: 12px 0;
	}
	
	.homepagebox h3 {
		font-size: 27px;
	}
	
	.news {
		margin-top: 0 !important;
	}
	
	#content-left, #content-left-inner {
		width: 100%;
		float: none;
	}
	
	#content-right, #content-right-inner {
		clear: both;
		float: left;
		width: 100%;
		margin-top: 3%;
	}
	
	#content-right-inner {
		border-left: 0;
		border-top: 1px solid #ddd;
		margin: 20px 0 50px 0;
		padding: 20px 0 0 0;
	}
	
	.homepagebox {
		width: 94%;
		min-height: 100px;
		padding: 2% 2% 88px 4%;
	}
	
	.homepagebox h3 {
		background: url(images/homepage-more.gif) right top no-repeat;
	}
	
	#homepageboxes .absences {
		margin-bottom: 3%;
	}
	
	#footer {
		font-size: 90%;
	}
	
	.footer-column {
		width: 47%;
	}
}


@media screen and ( max-width: 600px ) {
	#header, #wrapper, #homepageboxes, #footer {
		width: auto;
	}
	
	#headerlogo {
		display: none;
	}
	
	.anchor-link {
		float: none;
		margin: 70px 0 0 -20px;
		padding: 20px 20px 5px 0;
	}
	
	#homepageboxes-wrapper {
		padding: 12px 0;
	}
	
	.homepagebox h3 {
		font-size: 27px;
	}
	
	.news {
		margin-top: 0 !important;
	}
	
	#content-left {
		width: 100%;
		float: none;
	}
	
	#content-right {
		clear: both;
		float: left;
		width: 100%;
		margin-top: 3%;
	}
	
	.homepagebox {
		width: 94%;
		min-height: 100px;
		padding: 2% 2% 88px 4%;
	}
	
	.homepagebox h3 {
		background: url(images/homepage-more.gif) right top no-repeat;
	}
	
	#footer-menu {
		display: none;
	}
}


@media screen and ( max-width: 480px ) {
	.homepagebox h3 {
		font-size: 23px; 
	}
	
	.principal-content {
		width: 55%;
	}


	
	
}