/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

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



/*
=============================================== 01. TESTING TEXT ===============================================
*/
body:after {position:relative; z-index:55; content: "less than 320px";font-size: 300%;font-weight: bold;position: fixed;bottom: 60px;width: 100%;text-align: center;background-color: hsla(1,60%,40%,0.7);color: #fff;
display:none !important; /* -------------------- ADD OR REMOVE display:none !important; to display testing text -------------------- */}



/*
=============================================== 02. BASE STYLES (1140px) ===============================================
*/
/* Note: Design for a width of 1040px */
body:after {content: "Wider than 1140px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */
html {-webkit-text-size-adjust: none;}	/* Removes webkit font resizing */ 
body {max-width:100%; width:100%;}
img {max-width:100%; height: auto; }
.header-container, .container, #container-sidebar, #sidebar, .grid2column, .grid3column, .grid3columnbig, .grid4column, .grid4columnbig {-moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; 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: 1140px) {
body:after {content: "959px to 1139px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 


.header-container, .container {width:960px;} /* Default Width */
#container-sidebar {width:665px; }


/* Default Grid */
.grid2column {width:458px;}
.grid4column {width:207px; }
.grid4columnbig {width:709px; }
.grid3column {width:290px; }
.grid3columnbig {width:624px; }

#container-sidebar .grid2column {width:310px; }
#container-sidebar .grid4column {width:133px; }
#container-sidebar .grid4columnbig {width:487px; }
#container-sidebar .grid3column {width:192px; }
#container-sidebar .grid3columnbig {width:428px; }

#container-sidebar .grid3column  .zoom-icon {width:170px; height:95px;}
#container-sidebar .grid4column .zoom-icon {  width:111px; height:62px; }
#container-sidebar .grid2column .zoom-icon {  width:288px; height:161px; }

.grid3column  .zoom-icon {width:268px; height:150px;}
.grid2column .zoom-icon {  width:436px; height:244px; }
.grid4column .zoom-icon {  width:185px; height:103px; }

#container-sidebar .blog-post .zoom-icon {width:643px; height:214px;}
.blog-post .zoom-icon {width:938px; height:312px;}

/* Misc Adjustments */
.sf-menu a {padding-right:18px; padding-left:18px;}  /* Top Menu Size */





/******* B42 *******/
.caption {
	height:269px;
}
.header-container ul.sf-menu li a {
	padding: 16px 34px 16px 0;
}
.withe-box {
	background:url(../images/fire-big-960.png) no-repeat scroll left bottom transparent
}
.grid4column-prod {
	width:30%;
}


}



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

@media only screen and (min-width: 768px) and (max-width: 959px) {
body:after {content: "768 to 959px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 

/* Default Width */
.header-container, .container { width: 752px; }
#container-sidebar {width:500px; }
#sidebar {width:222px;}

/* Default Grid */
.grid2column {width:352px;}
.grid4column {width:155px; }
.grid4columnbig {width:553px; }
.grid3column {width:226px; }
.grid3columnbig {width:496px; }

#container-sidebar .grid2column {width:228px; }
#container-sidebar .grid4column {width:92px; }
#container-sidebar .grid4columnbig {width:364px; }
#container-sidebar .grid3column {width:137px; }
#container-sidebar .grid3columnbig {width:318px; }

#container-sidebar .grid3column .zoom-icon {width:115px; height:64px;}
#container-sidebar .grid4column .zoom-icon {  width:70px; height:39px; }
#container-sidebar .grid2column .zoom-icon {  width:206px; height:115px; }

.grid3column  .zoom-icon {width:204px; height:114px;}
.grid2column .zoom-icon {  width:340px; height:190px; }
.grid4column .zoom-icon {  width:137px; height:76px; }

#container-sidebar .blog-post .zoom-icon {width:478px; height:159px;}
.blog-post .zoom-icon {width:746px; height:248px;}

/* Misc Fixes */
.sf-menu {margin-left:5px;}
header a.search-icon {display:inline-block; }
header a.search-icon2 {display:block; text-indent:-999999px; width:25px; height:32px; bottom:0px; right:0px; position:absolute;}
header #right-nav-bar .searchform { display:none; }
header #right-nav-bar .searchform2 {display:inline-block; position:absolute; float:right; right:0px; top:0px;}
.sf-menu a {padding-right:18px; padding-left:18px;}  /* Top Menu Size */

/******* B42 *******/
.caption {
	height:203px;
}
.sf-menu a {
	font-size:18px;
}
.header-container ul.sf-menu li a {
	padding: 18px 20px 17px 0;
}
footer .grid4column {
	width:180px;
}
footer .grid2column {
	width:300px;
}
.withe-box {
	background:url(../images/fire-big-768.png) no-repeat scroll left bottom transparent
}
.grid4column-prod {
	width:29%;
}
.grid4column-prod .item-container {
	height:410px;
}


}



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

@media only screen and (max-width: 767px) {
body:after {content: "0 to 480px"; background-color: hsla(90,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 


/* Default Width */
.header-container, .container { width: 300px; }


/* Default Grid */
.grid2column, #container-sidebar, #sidebar, .grid2column, .grid3column, .grid3columnbig, .grid4column, .grid4columnbig, #container-sidebar .grid2column, #container-sidebar .grid3column, #container-sidebar .grid3columnbig, #container-sidebar .grid4column, #container-sidebar .grid4columnbig 
{width:100%; margin-bottom:15px;}
#container-sidebar .grid3column .zoom-icon, #container-sidebar .grid2column .zoom-icon, #container-sidebar .grid4column .zoom-icon, .grid4column .zoom-icon, .grid2column .zoom-icon, .grid3column .zoom-icon {width:278px; height:155px;}
#container-sidebar .blog-post .zoom-icon, .blog-post .zoom-icon {width:278px; height:92px;}


/* Misc Fixes */
header #right-nav-bar {display:none;}
header h1#logo, footer #copyright {float:none; margin:0 auto; text-align:center;}
ul#login-header-area { top:0px;  margin:0 auto; text-align:center; float:none;}
ul#login-header-area li { padding:0px 7px; font-size:85%; float:none; }
#login-header-area a {padding:18px 0px; }
.flex-direction-nav {display:none;}
.flex-control-nav {bottom:5px; right:12px; }
.flex-control-nav li a {width: 15px; height:17px;  background-image: url(../images/slider/fire-nav-small.png); }
.flex-control-nav li a:hover {background-position: 0 -18px;}
.flex-control-nav li a.active {background-position: 0 -18px; cursor: default;}
.homepage-adjust {bottom:0px;}
.filter-products {float:none;  margin:0px auto 15px auto; }
.filter-products select {display:block; top:0px; margin:0px auto;}



/* Select Menu */
nav ul { display: none; }  
nav select option { font-size:12px; background:#fff; color:#888;}
header nav {float:none; text-align:center; z-index:0; }
nav select { text-transform:none; display:block; margin:0px auto 20px auto; width:100%; min-width: 300px; max-width: 100%; -webkit-appearance: none; -moz-appearance: normal; appearance: normal;
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
 -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
-webkit-padding-end: 20px; -webkit-padding-start: 2px; -webkit-user-select: none;-moz-user-select: none;
background-image: url(../images/select-arrow.png),  -webkit-linear-gradient(#FAFAFA, #f9f9f9 40%, #e8e8e8);
background: linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
background-position: center right; background-repeat: no-repeat;
font-size:13px;
border: 1px solid #aaaaaa;
color: #555555;
padding:7px 5px 7px 10px;
position:relative;
top:9px;
}


/******* B42 *******/
.caption {
	height:97px;
}
.header-container {
	position:relative;
}
.header-container {
	position:relative;
}
header h1 img {
	margin:-10px 0 0;
    max-width:70%;
}
header h1#logo, footer #copyright {
	text-align:center;
}
.info {
    font-size:14px;
    margin:3px 0 0;
    position:relative;
    text-align:center;
    float:none;
}
.flex-control-nav {
	bottom: -50px;
    right: 0;
}
.withe-box {
	background:url(../images/fire-big-420.png) no-repeat scroll left bottom transparent
}
.ngg-gallery-thumbnail {
	margin-bottom:5px;
}
.fluid-width-video-wrapper {
    height:270px !important;
    width:360px !important;
}
.single-page-box .map iframe {
    height:360px;
    width:360px;
}

}

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

@media only screen and (width: 320px) {
body:after {content: "0 to 480px"; background-color: hsla(90,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 


/* Default Width */
.header-container, .container { width: 300px; }


/* Default Grid */
.grid2column, #container-sidebar, #sidebar, .grid2column, .grid3column, .grid3columnbig, .grid4column, .grid4columnbig, #container-sidebar .grid2column, #container-sidebar .grid3column, #container-sidebar .grid3columnbig, #container-sidebar .grid4column, #container-sidebar .grid4columnbig 
{width:100%; margin-bottom:15px;}
#container-sidebar .grid3column .zoom-icon, #container-sidebar .grid2column .zoom-icon, #container-sidebar .grid4column .zoom-icon, .grid4column .zoom-icon, .grid2column .zoom-icon, .grid3column .zoom-icon {width:278px; height:155px;}
#container-sidebar .blog-post .zoom-icon, .blog-post .zoom-icon {width:278px; height:92px;}


/* Misc Fixes */
header #right-nav-bar {display:none;}
header h1#logo, footer #copyright {float:none; margin:0 auto; text-align:center;}
ul#login-header-area { top:0px;  margin:0 auto; text-align:center; float:none;}
ul#login-header-area li { padding:0px 7px; font-size:85%; float:none; }
#login-header-area a {padding:18px 0px; }
.flex-direction-nav {display:none;}
.flex-control-nav {bottom:5px; right:12px; }
.flex-control-nav li a {width: 15px; height:17px;  background-image: url(../images/slider/fire-nav-small.png); }
.flex-control-nav li a:hover {background-position: 0 -18px;}
.flex-control-nav li a.active {background-position: 0 -18px; cursor: default;}
.homepage-adjust {bottom:0px;}
.filter-products {float:none;  margin:0px auto 15px auto; }
.filter-products select {display:block; top:0px; margin:0px auto;}



/* Select Menu */
nav ul { display: none; }  
nav select option { font-size:12px; background:#fff; color:#888;}
header nav {float:none; text-align:center; z-index:0; }
nav select { text-transform:none; display:block; margin:0px auto 20px auto; width:100%; min-width: 300px; max-width: 100%; -webkit-appearance: none; -moz-appearance: normal; appearance: normal;
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
 -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
-webkit-padding-end: 20px; -webkit-padding-start: 2px; -webkit-user-select: none;-moz-user-select: none;
background-image: url(../images/select-arrow.png),  -webkit-linear-gradient(#FAFAFA, #f9f9f9 40%, #e8e8e8);
background: linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
background-position: center right; background-repeat: no-repeat;
font-size:13px;
border: 1px solid #aaaaaa;
color: #555555;
padding:7px 5px 7px 10px;
position:relative;
top:9px;
}


/******* B42 *******/
.caption {
	display:none
}
.header-container {
	position:relative;
}
header h1 img {
	margin:-10px 0 0;
    max-width:70%;
}
header h1#logo, footer #copyright {
	text-align:center;
}
.info {
    font-size:13px;
    margin:3px 0 0;
    position:relative;
    text-align:center;
    float:none;
}
.flex-control-nav {
	bottom: -50px;
    right: 0;
}
.withe-box {
	padding: 0 0 30px 100px;
}
.ngg-gallery-thumbnail {
	margin-bottom:5px;
}
.fluid-width-video-wrapper {
    height:180px !important;
    width:240px !important;
}
.single-page-box .map iframe {
    height:240px;
    width:240px;
}

}


/*
=============================================== 07. #Mobile (Landscape) ===============================================
*/
/* Note: Design for a width of 480px */

@media only screen and (min-width: 480px) and (max-width: 767px) {
body:after { content: "480 to 767px"; background-color: hsla(150,50%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */

/* Default Width */
.header-container, .container { width: 420px; }
#container-sidebar .grid3column .zoom-icon, #container-sidebar .grid2column .zoom-icon, #container-sidebar .grid4column .zoom-icon, .grid4column .zoom-icon, .grid2column .zoom-icon, .grid3column .zoom-icon {width:398px; height:222px;}
#container-sidebar .blog-post .zoom-icon, .blog-post .zoom-icon {width:398px; height:132px;}



}
