/* Response CSS */

@media only screen and (max-width: 975px) {

	/*Layout CSS */
	
	#content.container_12 .grid_8, #content.container_12 .grid_4
	{
		/*padding: 0px 20px 20px 20px;
		width: 90%;
		max-width: 90%;*/
		
		width: 95%;
		max-width: 95%;
		
	}
	
	.homepage-content, .page-wrapper
	{
		width: 98% !important;
		max-width: 98% !important;
	}
	
	/* Header CSS */
	
	#header
	{
		background-position: bottom center;
	}
	
	.header-logo
	{
		width: auto;
		float: none;
		margin: 50px auto 10px auto;
	}

	.header-logo a img
	{
		position: relative;
		margin: 0 auto;
	}
	
	.school-name
	{
		float: none;
		margin: 5px auto 10px auto;
		padding-top: 0;
	}
	
	.social-media
	{
		float: none;
		position: absolute;
		margin: 0 auto 25px auto;
		top: 10px;
		left: 0;
		right: 0;
		width: 260px; /*match width of navigation div */
		text-align: center;
	}

	
	/* Navigation CSS */
	
	.main-menu
	{
		display: none !important;
	}
	
	.mobile-nav-container
	{
		display: block;
	}
	
	.mobile-menu-wrapper {
		display: block;
		float: none;
		margin: 15px auto;
		width: 260px;
	}
	
	/* Main Content CSS */
	body.home.blog #content, .home #content, #content, .main-image
	{
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;		
	}
	
	#content
	{
		margin-top: 0;
	}
	
	#content h1, #content h2
	{
		font-size: 2em;
	}
	
	#sidebar
	{
		margin-left: 0;
		padding: 0px 20px 50px 20px;	
	}
	
	/* Feature Area CSS */
	
	.container_12 div.grid_4.featured-area
	{
		padding: 0 !important;	
		max-width: 30% !important;
	}
	
	.featured-area .custom-area-image img
	{
		max-width: 100%;
		width: 100%;
	}
	
	.featured-area h2
	{
		font-size: 1.3em !important;
	}
	
	/* Footer Widget CSS */
	
	#top-footer
	{
		padding: 0 10px;
	}
	
	#top-footer .grid_4
	{
		max-width: 29%;
		font-size: 12px;
	}
	
	#top-footer .grid_4 h3
	{
		font-size: 1.3em;
	}

	
	/* Footer CSS */
	#footer.container_12 .grid_8
	{
		width: 100%;
		max-width: 100%;
		padding: 0;
		margin: 0;
		text-align: center;
	}

	#footer.container_12 .grid_4
	{
		width: 100%;
		max-width: 100%;
		overflow: hidden;
		padding: 0;
		margin: 20px 0;
		text-align: center;
	}
	
    #footer ul li
       {
        float:  none;
        display:  inline-block;
		margin-right: 10px;
    }
	
	#footer .footer-contact-info p
	{
		text-align: center;
	}
	
}

@media only screen and (max-width: 660px) {
	
	/*Top Search CSS */
	.search-bar #searchform #s
	{
		display: block;
		float: none;
		margin: 5px auto 5px auto;
	}
	
	/* Feature Area CSS */
	
	.container_12 div.grid_4.featured-area
	{
		padding: 0 !important;
		max-width: 45% !important;
	}

	
	/* Footer Widget CSS */
	
	#top-footer-wrap
	{
		padding: 5px 10px;
	}
	
	#top-footer .grid_4
	{
		margin-top: 15px;
		max-width: 45%;
	}
	
}

@media only screen and (max-width: 435px) {

	/* Feature Area CSS */
	
	.container_12 div.grid_4.featured-area
	{
		padding: 0 !important;
		max-width: 100% !important;
	}

	
	/* Footer Widget CSS */
	
	#top-footer .grid_4
	{
		max-width: 100%;
		margin-top: 15px;
	}
	
	.blog-title-wrapper
	{
		background: url(../images/chalkboard_bg3.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
		height: auto;
		max-width: 100%;
		overflow: hidden;
	}

	.blog-title-wrapper p
	{
		padding-top: 20px;
		font-family: 'dk_crayon_crumbleregular', sans-serif;
		font-size: 30px;
		color: #fff !important;
		text-align: center;
		width: 100%;
	}	
}