/*
* 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. RETINA STYLES
02. BASE STYLES (1140px)
03. #DESKTOP (960px)
04. #Tablet (Portrait)
05. #Mobile (Portrait)
06. #Mobile (Landscape)
07. TESTING TEXT
*/



/*
=============================================== 01. RETINA STYLES ===============================================
*/
@media screen and (-webkit-min-device-pixel-ratio: 1.5) {
	nav select, body #main form.woocommerce-ordering select {background-image: url(../images/select-arrow@2x.png) ,  -webkit-linear-gradient(#FAFAFA, #f9f9f9 40%, #e8e8e8)    !important;background: linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
	background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);background-position: center right; background-repeat: no-repeat; background-size:contain;}
	.flex-direction-nav a {background-image: url(../images/slider/arrows@2x.png); background-size:107px 80px;}
	.post-comments a {background-image:url(images/post-comments@2x.html);  background-size:18px 16px;}
	#searchform #s {background-image: url(../images/search-magnify@2x.png); background-size: 30px 30px; }
	
	
	.featured-image-homepage a.hover-title {background-image:url(../images/featured-image-homepage@2x.png); background-size:59px 54px;}
	.gallery-sensica-slider .flex-control-paging li a {background-image:url(../images/slider/bg_bullets3@2x.png); background-size:20px 85px;}
	.gallery-sensica-slider .flex-direction-nav a {background-image: url(../images/slider/arrows3@2x.png); background-size:68px 69px;}
	
}
@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* IE7-IE8 Fixes*/
.lt-ie9  .post-comments a {background-image:url(images/post-comments.html); }
.lt-ie9	#searchform #s {background-image: url(../images/search-magnify.png);}

.lt-ie9	.featured-image-homepage a.hover-title {background-image:url(../images/featured-image-homepage.png); }

.lt-ie9	.gallery-sensica-slider .flex-control-paging li a {background-image:url(../images/slider/bg_bullets3.png);}
.lt-ie9	.gallery-sensica-slider .flex-direction-nav a {background-image: url(../images/slider/arrows3.png); }


}




/*
=============================================== 02. BASE STYLES (1175px) ===============================================
*/
/* Note: Design for a width of 1175px */
body:after {content: "Wider than 1175px";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; }
.width-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: 1175px) {
body:after {content: "959px to 1174px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 


.width-container, .flex-caption {width:930px;} /* Default Width */


#sidebar #flickr-widget ul li img {width:65px; height:65px;}


/* Slider Options */
.flex-control-nav {top:90px; margin-left:-465px;}
.flex-caption {top:50px; margin-left:-465px; }
.flex-caption .slider-container { margin-left:35px; width:530px; font-size:13px;}
.flex-caption .slider-container h3 {font-size:38px;  margin-bottom:15px;}


.flexslider a.progression-button, .highlighted-area a.button-sensica { font-size:15px; padding:14px 32px;}
.sf-menu a { padding-left:20px; padding-right:20px;}

}



/*
=============================================== 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 */
.width-container, .flex-caption { width: 738px; }

/* Slider Options */
.flex-control-nav {margin-left:-369px; top:55px;}
.flex-caption {top:30px; margin-left:-369px; }
.flex-caption .slider-container { margin-left:30px; width:425px; font-size:12px;}
.flex-caption .slider-container h3 {font-size:30px;  margin-bottom:12px;}


/* HEADING SIZES */
h1 {font-size:32px; }
h2 {font-size:35px;}
h3 {font-size:22px; }
#respond h3#reply-title, h5.comments-title {font-size:19px;}
h4 {font-size:15px; }
h5 {font-size:14px; }
#sidebar h5 {font-size:15px; padding:10px 0px 10px 0px; }
h6 {font-size:14px; }
h6.post-type-header {font-size:18px;}

.highlighted-area h2 {font-size:30px;}
.highlighted-area h4 {font-size:13px;}
.highlight-button-divider {font-size:18px; padding:0px 10px; }


.portfolio-title-hover { font-size:15px;}
.portfolio-excerpt {font-size:14px;}
.grid4column .portfolio-title-hover {font-size:14px;}
.grid4column .portfolio-excerpt {font-size:12px;}


/* Misc Fixes */
.flexslider a.progression-button, .highlighted-area a.button-sensica { font-size:13px; padding:12px 28px;}
.sf-menu a { padding-left:12px; padding-right:12px;}
.sf-menu li li a {padding-right:18px; padding-left:18px;}
#sidebar #flickr-widget ul li img {width:50px; height:50px;}

}



/*
=============================================== 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 */
.width-container, .flex-caption { width: 300px; }

body {font-size:13px;}
/* Slider Options */
.flex-control-nav {margin-left:-150px; top:25px;}
.flex-control-paging li a {width: 2px; height: 15px;}
.flex-caption {top:10px; margin-left:-150px; }
.flex-caption .slider-container { margin-left:20px; width:165px; font-size:6px;}
.flex-caption .slider-container h3 {font-size:12px;  margin-bottom:3px;}
.flex-caption .slider-container p {margin-bottom:5px;}


/* Default Grid */
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,
#footer-widgets .footer-2-column .widget, #footer-widgets .footer-3-column .widget, #footer-widgets .footer-4-column .widget,
footer #copyright, footer ul#footer-nav-sensica, #content-container, #sidebar, .grid2column, .grid3column, .grid3columnbig, .grid4column, .grid4columnbig {width:100%; margin-bottom:15px;}
#footer-widgets .widget {margin-bottom:10px; margin-top:20px;}
form.checkout .col-1, form.checkout .col-2 {width:100% !important; margin-bottom:15px;}
.author-category-single .lastcolumn {text-align:left;}

.portfolio-widget-sensica .grid2column, .portfolio-widget-sensica .grid3column, .portfolio-widget-sensica .grid4column {margin-bottom:0px; width:99.9%;}

/* Misc Fixes */
#breadcrumb {display:none;}
.flexslider a.progression-button, .highlighted-area a.button-sensica { font-size:6px; padding:5px 8px;}
a.progression-button, a.button-sensica, a.more-link span.button-more, input.button-sensica, #respond input#submit, body input.wpcf7-submit {padding:8px 15px; font-size:11px;}

body #logo {float:none; margin:0 auto;}
footer #copyright, footer ul.footer-nav-sensica {text-align:center; padding-bottom:15px;}
footer ul.footer-nav-sensica  {padding-top:0px; margin-top:-5px; margin-bottom:0px; float:none; }
footer ul.footer-nav-sensica  li {display:inline-block; float:none; text-align:center; }


/* Checkout + Cart Styling */
table.cart th.product-remove,  table.cart td.product-remove, table.cart td.product-thumbnail, table.cart th.product-thumbnail,
table.cart th.product-price, table.cart td.product-price
 {display:none !important;}
body #main p.woocommerce-result-count {text-align:center ; float:none; padding-bottom:0px;}
body #main form.woocommerce-ordering {float:none; text-align:center;}
body #main form.woocommerce-ordering select {margin:0 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:300px;  max-width: 100%; -webkit-appearance: none; -moz-appearance: normal; appearance: normal;
-webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;
 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 2px 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 #cccccc;
color: #555555;
padding:7px 5px 7px 10px;}

/* prettyPhoto styling for small screens */
.pp_pic_holder.pp_default { width: 100%!important; left: 0!important; overflow: hidden; }
div.pp_default .pp_content_container .pp_left { padding-left: 0!important; }
div.pp_default .pp_content_container .pp_right { padding-right: 0!important; }
.pp_content { width: 100%!important; height: auto!important; }
.pp_fade { width: 100%!important; height: 100%!important; }
a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none!important; }
#pp_full_res img { width: 100%!important; height: auto!important; }
.pp_details { width: 94%!important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px!important; }
a.pp_close { right: 10px!important; top: 10px!important; }


/* HEADING SIZES */
h1 {font-size:30px; }
h2 {font-size:32px;}
h3 {font-size:18px; }
#respond h3#reply-title, h5.comments-title {font-size:16px;}
h4 {font-size:14px; }
h5 {font-size:13px; }
#sidebar h5 {font-size:14px; padding:10px 0px 10px 0px; }
h6 {font-size:13px; }
h6.post-type-header {font-size:15px;}

.highlighted-area { margin:-47px 0px 50px 0px;  padding:15px 0px 15px 0px;}
.highlighted-area h2 {font-size:16px;}
.highlighted-area h4 {font-size:10px;}
.highlight-button-divider {font-size:14px; padding:0px 5px; }

/* Comment Fix */
.commentlist {width:95%; left:-10px;}
.commentlist .children li.comment .comment-meta {margin-left:0px;}
.commentlist .avatar, .commentlist > li:before {display:none;}


}


/*
=============================================== 06. #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 */
.width-container, .flex-caption { width: 420px; }


/* Slider Options */
.flex-control-nav {margin-left:-210px; top:35px;}
.flex-caption {top:25px; margin-left:-210px; }
.flex-caption .slider-container { margin-left:25px; width:225px; font-size:8px;}
.flex-caption .slider-container h3 {font-size:16px;  margin-bottom:6px;}
.flex-caption .slider-container p {margin-bottom:8px;}


}



/*
=============================================== 07. 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 -------------------- */}