/* Table of Contents

==================================================

01. RETINA STYLES

02. BASE STYLES (1140px)

03. #DESKTOP (960px)

04. #Tablet (Portrait)

05. #Mobile (Portrait)

*/







/*

=============================================== 01. RETINA STYLES ===============================================

*/
#main-nav .sub-menu .menu-item a {
  font-size: 10px;
  white-space: normal !important;
}

@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;
}
 .example-retina {
background-image:url(../images/example-retina@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;
}
.lt-ie9 .example-retina {
	background-image: url(../images/example-retina.png);
}
/*

=============================================== 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) {
 body #logo-container {
background-position:-300px 0px;
}

 header {
 position: relative;
 width: 100%;
 z-index: 7;
 max-height: 100px!important;
}
 header, #panel-search, nav, #logo-container .width-container, .sf-menu ul {
 max-height: 100px!important;
}


/* Navigation Size */

.sf-menu a {
padding-left:10px;
padding-right:10px;
font-size:90%;
}



/* Caption Styles */

.caption-progression {
 padding-top:50px;
}
 #homepage-slider a.progression-button {
 padding:14px 35px;
 font-size:13px;
}



/* Heading Styles */

h2 {
font-size:50px;
}
}





/*

=============================================== 04. #Tablet (Portrait) ===============================================

*/

/* Note: Design for a width of 768px */


@media only screen and (min-width: 768px) and (max-width: 959px) {



/* Default Width */


body #logo-container {
background-position:-600px 0px;
}
 .entry-meta-progression {
font-size:11px;
}

.sf-menu ul {
  top: 59px;
}



/* Navigation Size */

.sf-menu a {

margin-left:3px;
}





/* Caption Styles */

.caption-progression {
 padding-top:15px;
}
 #homepage-slider a.progression-button {
 padding:12px 25px;
 font-size:13px;
}



/* Heading Styles */

h1 {
font-size:40px;
}
 #bread-crumb {
padding-top:62px;
}
 h2 {
font-size:40px;
}
 header {
 position: relative;
 width: 100%;
 z-index: 7;
 max-height: 75px!important;
}
 header, #panel-search, nav, #logo-container .width-container, .sf-menu ul {
 max-height: 75px!important;
}
 nav ul, nav ol {
 margin-top:-25px!Important;
}
 .slides p {
 display:none!Important
}
 .slides h2 {
 width:40%!Important;
 font-size:35px;
}
 .footer-4-column .widget {
 width:95%
}
 .footer-4-column .widget .ls-sc-button {
 width:80%
}
}

/*

=============================================== 05. #Mobile (Portrait) ===============================================

*/

/* Note: Design for a width of 320px */


@media only screen and (max-width: 768px) {

	



/* Default Width */




/* Default Grid */

.footer-2-column .widget, .footer-3-column .widget, .footer-4-column .widget,  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;
}
 body #main .width-container li.product.column-2, body #main .width-container li.product.column-3, body #main .width-container li.product.column-4, .lt-ie8 body #main .width-container li.product.column-2, .lt-ie8 body #main .width-container li.product.column-3, .lt-ie8 body #main .width-container li.product.column-4 {
 width:100%;
 margin-bottom:10px;
}

 #copyright {
text-align:center;
}
 #copyright .lastcolumn-progression {
text-align:center;
}
 .post-container-right {
float:none;
width:100%;
}
 .entry-meta-progression {
float:none;
padding-top:10px;
font-size:12px;
width:100%;
text-align:center;
}
 .entry-meta-progression div {
display:inline-block;
margin-left:5px;
}



/* Caption Styles */

.caption-progression {
 padding-top:0px;
 padding-bottom:15px;
}
 .caption-progression p {
margin-bottom:0px;
font-size:10px;
}
 .flex-control-nav {
bottom: 10px;
}



/* Heading Styles */

h1 {
font-size:20px;
}
 #bread-crumb {
padding-top:50px;
font-size:10px;
}
 h2 {
font-size:16px;
margin-bottom:2px;
}



/* Header Styles */

body #logo {
float:none;
margin:0 auto;
position:relative;
left:13px
}
 header #search-icon {
display:none;
float:none;
text-align:center;
}
 header #search-icon i {
padding:0px 0px 20px 0px;
}
 body #logo-container {
background-position:0px 0px;
}




/* Select Menu */

body 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;
 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;
}


/* WooCommerce Styles */

.product-thumbnail {
display:none;
}
 #logo {
 width:201px!important;
}
 header {
 position: relative;
 width: 100%;
 z-index: 7;
 max-height: 75px!important;
}
 header, #panel-search, nav, #logo-container .width-container, .sf-menu ul {
 max-height: 75px!important;
}
 nav ul, nav ol {
 margin-top:-25px!Important;
}
 .slides p {
 display:none!Important
}
 .slides h2 {
 font-size:20px;
 line-height:20px!important;
 margin-bottom:10px;
 padding-left: 0px;
}

 .footer-4-column .widget {
 width:95%
}
 .footer-4-column .widget .ls-sc-button {
 width:80%
}
 #homepage-slider a.progression-button {
 font-size:12px;
 padding:10px 15px;
}
 nav {
 position:fixed;
 top:0;
 right:0;
}
}
