﻿/*-------------------------------------------*/
/* #MOBILE 320px (Portrait)*/
/*-------------------------------------------*/
@media only screen and (max-width: 480px), screen and (max-device-width: 480px) {

	/*--------------------------------------*/
	/*COLUMNS*
	/*--------------------------------------*/
	#pre-header { width: 71%; }
	
	#top-header { width: 100%; }
	
	#header { width: 75%; height: 10px; }
	
	#header-right { width: 99%; }
	
	.front #banner { height: 25.2vw; }
	
	.one-third-logo { width: 90%; margin: auto 0; padding: 0px; }
	
	.one-third-logo img { width: 95%; min-width: 260px; margin-left: -30px; }
	
	.search_area {  width: 60%; float: none; margin-bottom: -40px; }

	#search-block-form input.form-text { margin: 0; padding: 15px; font-size: 18px; width: 90%; }
	
	#breadcrumb { width: 85%!important; }

	.sub-page-content .entry-body { width: 100%; } /* adjusting width for all Views pages */
	
	 #sub-page-content  { width: 87%; padding: 0; }
	 
	.three-fourth { width: 95%!important; }
	
	.one-fourth { width: 90%; }
	
	.image-container, .image-container img { height: 200px; }
	
	.section-content.first { margin-top: -140px; z-index: 99; }
	
	#banner-inside { height: 200px; } 
	
	.sidebar { display: none; } /* hide left menu, mobile browser window is too small to show these */
	
	.node-article .field-item img { max-width: 220px; }
	
	.node-teaser .field-item img { height: 60px; max-height: 60px; width: auto; max-width: auto; }

	.file img.file-icon { height: 16px; max-height: 16px; border: 1px solid }
	
	.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; }			
	.section-one, .section-two, .section-three, .section-four { background-size: 110px;  }
	.section-one a, .section-two a, .section-three a, .section-four a { font-size: 23px; }
	.section-one h2, .section-two h2, .section-three h2, .section-four h2 { font-size: 4em; width: 110px; }
	
	/*--------------------------------------*/
	/* 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: 240px; max-height: 240px; }
	.front-banner-flexslider .views-field-field-front-banner img { width: 264px; height: 240px; }
	.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-video-link .field-content a { float: left; left: 25px!important; top: 150px; }

	.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: -140px; 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: 25px; 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 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: 300px; max-height: 300px; }
	.slideshow-flexslider .views-slideshow-controls-bottom { margin-top: 190px; }

	.slideshow-flexslider { height: 640px; max-height: 640px; }
	.slideshow-flexslider .views-slideshow-cycle-main-frame { max-height: 640px; }
	.slideshow-flexslider .views-field-field-slideshow-image img { width: 290px; margin-top: -80px; } 
	.slideshow-flexslider .views-field-title { width: 268px; top: 185px; line-height: 16px; height: 70px; max-height: 70px; background: #000; }
	.slideshow-flexslider .views-field-title .field-content { font-size: 16px; }
	
	/*--------------------------------------*/
	/*Footer content *
	/*--------------------------------------*/
	#footer-main { width: 85%; }	
	.one-fourth { border-bottom: 1px solid #aaa; }
	.one-fourth.last { border-bottom: none; }
	#footer { width: 100%; }
	#footer-bottom { width: 72%; padding: 0px; margin: 0px; }
	#footer-main .footer-item.last { display: block; }
	#footer-main a.last-link { 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: 400px) {		
		/* 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: 260px; max-height: 260px; }
		.slideshow-flexslider .views-slideshow-controls-bottom { margin-top: 100px; }
		
		.slideshow-flexslider { height: 545px; max-height: 545px; }
		.slideshow-flexslider .views-slideshow-cycle-main-frame { max-height: 545px; }
		.slideshow-flexslider .views-field-field-slideshow-image img { width: 210px; margin-top: -95px; } 
		.slideshow-flexslider .views-field-title { width: 188px; top: 125px; line-height: 15px; height: 80px; max-height: 80px; }
		.slideshow-flexslider .views-field-title .field-content { font-size: 15px; }
	}
	* { xxxborder: 1px solid #ff0000; }
}