/*
* 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, #top-nav-solar 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;}
	.example-retina {background-image:url(../images/example-retina@2x.png); background-size:20px 85px;}
	nav .sf-menu li:first-child {background-image:url(../images/navigation-home@2x.png); background-size:82px 75px; }
	.searchform #s {background-image: url(../images/search-magnify@2x.png); background-size: 30px 30px; }
	nav .sf-menu li li:first-child, nav .sf-menu li:first-child li {background:none;}
	.solar-comments a {background-image: url(../images/solar-comments@2x.png); background-size: 18px 18px; }
	.rsDefault .rsThumbsArrowIcn, .rsDefault .rsArrowIcn, .rsDefault .rsPlayBtnIcon, .rsDefault .rsCloseVideoIcn, .solar-image-slider .video-play-solar:after {background-image:url(../royalslider/rs-default@2x.png); background-size: 197px 133px;}
	span.tags-heading {background-image:url(../images/tags@2x.png);  background-size: 20px 20px;}
	.flex-control-paging li a {background-image:url(../images/slider/bg_bullets@2x.png); background-size:20px 85px;}
	.flex-direction-nav a {background-image: url(../images/slider/arrows@2x.png); background-size:68px 69px;}
	.video-play-solar:after {background-image: url(../images/video-play-solar@2x.png); background-size:18px 21px;}
}
@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.5) {
}

/* IE7-IE8 Fixes*/
.lt-ie9 .example-retina {background-image: url(../images/example-retina.png); }
.lt-ie9 .sf-menu li:first-child {background-image:url(../images/navigation-home.png);  }
.lt-ie9 .searchform #s {background-image: url(../images/search-magnify.png);  }
.lt-ie9 .solar-comments a {background-image: url(../images/solar-comments.png);  }
.lt-ie9 .rsDefault .rsThumbsArrowIcn, .lt-ie9 .rsDefault .rsArrowIcn, .lt-ie9 .rsDefault .rsPlayBtnIcon, .lt-ie9 .rsDefault .rsCloseVideoIcn, .lt-ie9 .solar-image-slider .video-play-solar:after {background-image:url(../royalslider/rs-default.png); }
.lt-ie9 nav .sf-menu li li:first-child, .lt-ie9 nav .sf-menu li:first-child li {background-image:none;}
.lt-ie9  span.tags-heading {background-image:url(images/tags.png);}
.lt-ie9 .flex-control-paging li a {background-image: url(../images/slider/bg_bullets.png); }
.lt-ie9 .flex-direction-nav a {background-image: url(../images/slider/arrows.png);}
.lt-ie9 video-play-solar:after {background-image: url(../images/video-play-solar.png);}

}




/*
=============================================== 02. BASE STYLES (1140px) ===============================================
*/
/* Note: Design for a width of 1190px */
body:after {content: "Wider than 1190px";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: 1190px) {
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; */ 


.width-container {width:925px;} /* Default Width */
#content-container { width:572px;}
.sidebar-background {background-position:-1200px 0px;}
.sidebar-main {background-position:-1200px 0px; }
#sidebar {width:280px;}
#additional-background {background-position:-1521px 0px; }

/* SLIDER STYLES */
.solar-image-slider.video-responsive-solar {padding:0px 52px;}
a.solar-button, body input.contact-button, body input#submit, a.progression-button {font-size:14px; padding:9px 14px;}
.videoGallery .rsThumbs {width: 322px;}
.videoGallery .rsThumbs .rsThumb {width: 320px; height:80px;}
.videoGallery .rsTmb {padding: 14px 15px 12px 15px;}
.videoGallery .rsTmb .controller-text div {font-size:13px;}
.videoGallery .rsTmb .image-thumb {width:70px}
.videoGallery .rsTmb .controller-text {width:205px;}
.content-slider-solar h2 {font-size:25px;}
.slider-byline {font-size:13px;}
.slider-excerpt {font-size:13px;}

#breadcrumb  {bottom:14px;}
.commentlist {width:80%;}
#flickr-widget ul li img {width:82px; height:82px;}

/* HEADING STYLES */
h1 {font-size:40px;  }
h3.solar-post-headline {font-size:20px;}
h3 {font-size:22px;}
h2.widget-title {font-size:22px;}

.solar-byline {font-size:13px;}
body {font-size:14px;}
#sidebar {font-size:13px;}


}



/*
=============================================== 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 { width: 725px; }
#content-container { width:415px;}
.sidebar-background {background-position:-1240px 0px;}
.sidebar-main {background-position:-1240px 0px;}
#additional-background {background-position:-1521px 0px; }
#sidebar {width:260px; padding-right:10px; padding-left:10px;}
h4.widget-title {margin-right:-10px; margin-left:-10px;}


/* SLIDER STYLES */
a.solar-button, body input.contact-button, body input#submit, a.progression-button {font-size:11px; padding:6px 10px;}
.videoGallery .rsThumbs {width: 282px;}
.videoGallery .rsThumbs .rsThumb {width: 280px; height:79px}
.videoGallery .rsTmb {padding: 14px 15px 12px 15px;}
.videoGallery .rsTmb .controller-text div {font-size:12px;}
.videoGallery .rsTmb .image-thumb {width:60px}
.videoGallery .rsTmb .controller-text {width:172px;}
.content-slider-solar h2 {font-size:20px;}
.slider-byline {font-size:12px; padding-bottom:6px;}
.slider-excerpt {font-size:11px; padding-bottom:10px;}
.solar-image-slider.video-responsive-solar {padding:0px 38px;}

/* Misc Fixes */
#flickr-widget ul li img {width:74px; height:74px;}
.commentlist {width:73%;}
#breadcrumb {bottom:2px; font-size:11px;}
.searchform #s {width:125px;}
.searchform #s:focus {width:155px;}

.progression-tab a { padding: 12px 35px;  font-size: 13px; }
.progression-tab-container .progression-div {padding:25px 40px ;}

.sf-menu a {padding-right:12px; padding-left:12px;}  /* Top Menu Size */
.sf-menu li:first-child a {padding-right:32px;}
.sf-menu li li:first-child a {padding-right:12px;}
#top-nav-solar .sf-menu a, #top-nav-solar .sf-menu li:first-child a, #top-nav-solar .sf-menu li li:first-child a {padding-right:15px; padding-left:12px; }  /* Top Menu Size */

/* HEADING STYLES */
h1 {font-size:34px;  }
#page-title h1 {padding:22px 0px;}
h3 {font-size:20px;}
h3.solar-post-headline {font-size:17px;}
h4.widget-title {font-size:18px;}
h2.widget-title {font-size:20px;}
.solar-byline {font-size:12px;}

body {font-size:14px;}
#sidebar {font-size:13px;}


}



/*
=============================================== 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 { width: 300px; }
.sidebar-background, .sidebar-main, #sidebar, #additional-background {background-image:none ; }
#sidebar {background:none ; border:none;}
#sidebar, #content-container { width:100%;}
#sidebar {padding-left:0px; padding-right:0px;}
h4.widget-title {margin-right:0px; margin-left:0px; border:1px solid #d4d4d4;}

/* Default Grid */
.grid2column, .grid3column, .grid3columnbig, .grid4column, .grid4columnbig {width:100%; margin-bottom:15px;}
#sidebar ul.sidebar-recent-posts .grid3columnbig {width:65%; margin-right:4%;}
#sidebar ul.sidebar-recent-posts .grid3column {width:30%; margin-right:4%;}

/* Misc Fixes */
#flickr-widget ul li img {width:58px; height:58px;}
#breadcrumb {float:none; text-align:left; font-size:10px; position:static; margin-top:-15px; margin-bottom:-20px;}
.commentlist {width:95%; left:-10px;}
.commentlist .children li.comment .comment-meta {margin-left:0px;}
.commentlist .avatar, .commentlist > li:before {display:none;}
#copyright, #top-footer {font-size:12px;}
#search-form-header {text-align:center; float:none; display:none;}
span.sub-headline-solar {display:block; left:0px; padding-left:0px; float:none; top:-15px; text-align:center; border:none; }
body #logo {float:none; margin:0 auto;}
#logo-container .icons { text-align:center; float:none; margin-top:0px; margin-bottom:10px;}

.progression-tab a { padding: 10px 25px;  font-size: 12px; }
.progression-tab-container .progression-div {padding:15px 25px ;}

/* Select Menu */
#top-nav-solar .sf-menu a, #top-nav-solar .sf-menu li:first-child a, #top-nav-solar .sf-menu li li:first-child a {padding-right:13px; padding-left:10px; }  /* Top Menu Size */
#top-nav-solar .sf-menu a, #top-nav-solar .sf-menu a:visited  {font-size:9px;}
body #top-nav-solar .sf-menu {text-align: center; float:none;}
body #top-nav-solar .sf-menu li {display:inline-block; float:none; }
body #top-nav-solar .sf-menu li li {text-align:left;}
body #top-nav-solar  .sf-menu li:hover ul, body #top-nav-solar  .sf-menu li.sfHover ul {top:56px;}

nav ul, body #top-nav-solar select { display: none; }  
nav select option, #top-nav-solar select option {font-size:12px; background:#fff; color:#888;}
header nav {float:none; text-align:center; z-index:0; }
nav select, #top-nav-solar select { text-transform:none; display:block; margin:12px auto 12px auto; width:300px; min-width: 150px; 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;}

/* 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; }

/* SLIDER STYLES */
a.solar-button, body input.contact-button, body input#submit, a.progression-button {font-size:10px; padding:6px 10px;}
.videoGallery .rsThumbs {display:none !important; width:0px !important;}
.content-slider-solar h2 {font-size:15px;}
.slider-byline {font-size:10px; padding-bottom:5px;}
.slider-excerpt {font-size:10px;}
.slider-solar-container {padding:18px 0px 18px 0px;}
.solar-image-slider.video-responsive-solar {padding:0px 0px;}

/* HEADING STYLES */
h1 {font-size:30px;  }
#page-title h1 {padding:20px 0px; }
h3 {font-size:19px;}
h3.solar-post-headline {font-size:18px;}
h4.widget-title {font-size:16px;}
.solar-byline {font-size:12px;}
h4 {font-size:16px;}
h2.widget-title {font-size:18px;}

body {font-size:13px;}
#sidebar {font-size:12px;}


}


/*
=============================================== 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 { width: 420px; }



}



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