/* Table of Contents
==================================================
01. RETINA STYLES
02. BASE STYLES (1140px)
03. #DESKTOP (960px)
04. #Tablet (Portrait)
05. #Mobile (Portrait)
*/



/*
=============================================== 01. RETINA STYLES ===============================================
*/
@media screen and (-webkit-min-device-pixel-ratio: 1.5) {
	body nav select {background-image: url(../images/hamburger-retina.png); background-size:100px 100px;}
	.flex-direction-nav a {background-image: url(../images/slider/arrows@2x.png); background-size:68px 69px;}
	.flex-control-paging li a {background-image:url(../images/slider/slider-bullets@2x.png); background-size:20px 85px;}

	
}

/* IE7-IE8 Fixes*/
.lt-ie9	nav select {background-image: url(../images/hamburger.png);}
.lt-ie9 .flex-direction-nav a {background-image: url(../images/slider/arrows.png); background-size:68px 69px;}
.lt-ie9 .flex-control-paging li a {background-image:url(../images/slider/slider-bullets.png); background-size:20px 85px;}


/*
=============================================== 02. BASE STYLES (1140px) ===============================================
*/
/* Note: Design for a width of 1040px */
html {-webkit-text-size-adjust: none;}	/* Removes webkit font resizing */ 
body {max-width:100%; width:100%;}
img {max-width:100%; height: auto; }
.width-container, .flex-caption .slider-container {-moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; }


/*
=============================================== 03. #DESKTOP (960px) ===============================================
*/
/* Note: Design for a width of 960px */
@media only screen and (min-width: 959px) and (max-width: 1190px) {
	
.flex-caption .slider-container {width:92%;} /* Default Width */
.width-container {width:930px;}

body #main.sidebar-bg-progression {
	background-position:-800px 0px;
}
body #main.sidebar-bg-progression .width-container {
	background:url(../images/sidebar-bg.png) -860px 0px repeat-y;
}

#content-container {width:607px;  padding-left:30px; padding-right:30px; }
#sidebar { width:225px;   padding-left:18px; padding-right:18px;}

.blog-progression #content-container {width:667px;}
.blog-progression  #sidebar {float:right; width:243px; padding-left:18px;}


nav {margin-left:10px;}
.sf-menu a {padding-right:16px; padding-left:16px; margin-right:4px;}

}


/*
=============================================== 04. #Tablet (Portrait) ===============================================
*/
/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {

/* Default Width */
.flex-caption .slider-container { width:92%; }

.width-container {width:730px;}

body {font-size:14px;}

body #main.sidebar-bg-progression {
	background-position:-950px 0px;
}
body #main.sidebar-bg-progression .width-container {
	background:url(../images/sidebar-bg.png) -1027px 0px repeat-y;
}

#content-container {width:459px; padding-left:20px; padding-right:20px; }
#sidebar { width:200px; padding-left:14px; padding-right:14px;}

.blog-progression #content-container {width:499px;}
.blog-progression  #sidebar {float:right; width:214px; padding-left:14px;}



nav {margin-left:7px;}
.sf-menu a {padding-right:10px; padding-left:10px; margin-right:2px;}

}


/*
=============================================== 05. #Mobile (Portrait) ===============================================
*/
/* Note: Design for a width of 320px */

@media only screen and (max-width: 767px) {
	
body, footer {font-size:13px;}

/* Default Width */
.width-container, .flex-caption .slider-container { width:90%; }

/* Default Grid */
.blog-progression #content-container, .blog-progression  #sidebar, #full-width-progression, #sidebar, #content-container, footer .footer-2-column .widget, footer .footer-3-column .widget, footer .footer-4-column .widget,
.grid2column-progression, .grid3column-progression, .grid3columnbig-progression, .grid4column-progression, .grid4columnbig-progression,
#sidebar, #content-container {
	width:100%; margin-bottom:10px;
}


#content-container, #sidebar, #full-width-progression, .blog-progression  #sidebar {padding-left:0px; padding-right:0px;}
#sidebar-border, #full-width-progression {border:none;}
body #main.sidebar-bg-progression {background-image:none;}

h1#logo {float:none; margin:0 auto;}
header .social-ico {text-align:center; float:none; margin-bottom:15px;}
footer .social-ico, footer #copyright {text-align:center;}

/* Select Menu */
nav {float:none; margin:0 auto;  background:none;}
nav ul { display: none;  }  
nav select option { background:#fff; color:#888;}
nav select { 
	text-align:center; 
	margin:0 auto;
	display:block; padding:0px;  border:none; 
	-webkit-appearance: none; -moz-appearance: normal; appearance: normal;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	width:70px; height:70px;
	text-indent:-99999px;
	cursor:pointer;
	background-color:#aaa ;
	background-image: url(../images/hamburger.png);
	background-position: center center;
	background-repeat:no-repeat;
	border:1px solid #e9e9e9;
	font-family:"Helvetica Neue", Helvetica, Arial, Sans-Serif !important;
	font-weight:normal !important;
}



}