﻿/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	/*--------------------------------------*/
	/*COLUMNS*
	/*--------------------------------------*/	
	#pre-header { width: 71%; }
	
	#top-header { width: 100%; }
	
	#header { width: 80%; height: 10px; }
	
	#header-right { width: 99%; }
	
	.front #banner { height: 25.2vw; }
	
	.one-third-logo { float: left; display: block; margin-left: -40px; }
	
	.one-third-logo img { width: 300px; }
	
	.search_area { float: right; display: block; margin-top: 60px; }

	.sub-page-content .entry-body { width: 100%; } /* adjusting width for all Views pages */
	
	 #sub-page-content  { width: 90%; }
	 
	.three-fourth { width: 95%!important; }
	
	.one-fourth { width: 230px; }
	
	.section-content.first { margin-top: -80px; z-index: 99; }
	
	#banner-inside { height: 200px; } 
	
	.sidebar { display: none; } /* hide left menu, mobile browser window is too small to show these */
	
	.image-container, .image-container img { height: 200px; }
		
	.node-article .field-item img { max-width: 380px; }
	
	.node-teaser .field-item img { height: 60px; max-height: 60px; width: auto; max-width: auto; }
	
	.file img.file-icon { height: 16px; max-height: 16px; }

	/*--------------------------------------*/
	/* Front banner *
	/*--------------------------------------*/
	.front-banner-flexslider .views-slideshow-cycle-main-frame, .front-banner-flexslider .views-row-first, .front-banner-flexslider .view-content,
	.front-banner-flexslider .skin-default,.front-banner-flexslider, .front-banner-flexslider .views_slideshow_cycle_main,.front-banner-flexslider .views-slideshow-cycle-main-frame
	{ height: 300px; max-height: 300px; }
	.front-banner-flexslider .views-field-field-front-banner img { width: 330px; height: 300px; }
	.front-banner-flexslider .views-field-field-video-link, .front-banner-flexslider .views-field-field-video-link .field-content { height: 100px; max-height: 100px; }
	.front-banner-flexslider .views-slideshow-controls-bottom  { height: 200px!important; max-height: 200px!important; }

	.front-banner-flexslider .views-field-field-caption-1, .front-banner-flexslider .views-field-field-caption-2,
	.front-banner-flexslider .views-field-field-caption-3, .front-banner-flexslider .views-field-field-caption-4 
	{ position: relative; /* setting position relative, resets the behavior of the captions so that they have to be properly aligned at the bottom of the banner */
	font-size: 38px; top: -80px; width: auto; width: 100%; background-color: #161616; text-shadow: none!important; left: 0!important; clear: both; float: left; text-align: left; }
	
	.front-banner-flexslider .views-field-field-caption-1 { color: #fff!important; }
	.front-banner-flexslider .views-field-field-caption-4 { font-size: 28px; font-weight: normal; padding-bottom: 20px!important; }
	
	.front-banner-flexslider .views-field-field-caption-1 .field-content, .front-banner-flexslider .views-field-field-caption-2 .field-content,
	.front-banner-flexslider .views-field-field-caption-3 .field-content, .front-banner-flexslider .views-field-field-caption-4 .field-content { padding-left: 20px!important; }
	
	.front-banner-flexslider .views-field-field-video-link .field-content a { top: 140px; margin-right: 85px!important; }

	/*--------------------------------------*/
	/* Front slide show *
	/*--------------------------------------*/	
	.slideshow-flexslider { height: 300px; max-height: 300px; }
	.slideshow-flexslider .views-slideshow-cycle-main-frame { max-height: 250px; }
	.slideshow-flexslider .views-field-field-slideshow-image img { width: 230px; } 
	.slideshow-flexslider .views-field-title { width: 208px; top: 150px; line-height: 15px; height: 70px; max-height: 70px; background: #000; }
	.slideshow-flexslider .views-field-title .field-content { font-size: 16px; }
		
	/*--------------------------------------*/
	/*Footer content *
	/*--------------------------------------*/
	#footer-main { width: 85%; }	
	#footer { width: 100%; }
	#footer-bottom { width: 72%; padding: 0px; margin: 0px; }
	#footer-main .footer-item.last { display: block; }
	#footer-main a.last-link { border-right: none; margin-right: 0; }
	
	/*--------------------------------------*/
	/*NAVIGATION*
	/*--------------------------------------*/
	#navigation-wrapper { float: none; }
	
	#main-navigation { margin-left: -20px; padding-left: 0; }
	
	#main-navigation ul.menu li { margin-right: -20px; margin-left: -2px; }
	
	@media only screen and (max-width: 750px) {	
		/*--------------------------------------*/
		/*Columns *
		/*--------------------------------------*/
		.one-fourth { width: 90%; }
		
		/*--------------------------------------*/
		/* Front slide show *
		/*--------------------------------------*/		
		/* force multiple slides to display in a column (default) rather than a row */
		.slideshow-flexslider .views-slideshow-cycle-main-frame-row-item { display: block; height: 340px; max-height: 340px; }
  		.slideshow-flexslider .views-slideshow-controls-bottom { margin-top: 260px; }

		.slideshow-flexslider { height: 720px; max-height: 720px; }
		.slideshow-flexslider .views-slideshow-cycle-main-frame { max-height: 720px; }
		.slideshow-flexslider .views-field-field-slideshow-image img { width: 360px; margin-top: -80px; } 
		.slideshow-flexslider .views-field-title { width: 338px; top: 220px; line-height: 18px; height: 70px; max-height: 70px; background: #000; }
		.slideshow-flexslider .views-field-title .field-content { font-size: 18px; }
		
		/*--------------------------------------*/
		/*Footer content *
		/*--------------------------------------*/
		#footer .footer-area .content, #footer-main { font-size: 20px; }
		#footer .footer-area h2 { font-size: 24px; }
		
		@media only screen and (max-width: 635px) {
			/*--------------------------------------*/
			/*Columns *
			/*--------------------------------------*/
			.section-content { width: 90%; margin-bottom: 0; }
			.section-one, .section-two, .section-three, .section-four { display: block; width: 100%; border-bottom: 1px solid #c4c4c4; }
			.section-four.last { margin-bottom: 20px; }			
			.search_area { margin: 70px 30px 30px 30px; padding: 10px; text-align: center; float: none; display: block; left: 10vw; }
			#search-block-form input.form-text { margin: 0; padding: 15px; font-size: 18px; width: 350px; }
			.one-third-logo { float: none; margin-left: 0; }
			.one-third-logo img { width: 362px; }
		
			/*--------------------------------------*/
			/*Footer content *
			/*--------------------------------------*/
			#footer-main .content { text-align: left; }
			#footer-main .footer-item.last { display: inline; }
			#footer-main a.last-link { border-right: 1px solid #aaa; }
		}
	} 
}