/* Theme Name: Nature Light
Description: Light theme for anyone in need of simple layout.
Version: 1.6
Author: Rakshasi
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, light, one-column, two-columns, right-sidebar, custom-header, custom-menu
*/

/* RESET DEFAULT CSS*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
background: transparent;
}


/* DEFAULT STYLES */
body{background: #ffffff; font-family: Tahoma;}
#allwrap{width: 100% !important;}
#pagewrap{margin:auto; margin-top: 30px; padding: 20px 10px 25px 10px; width: 960px;}
.spacer{clear: both !important; margin: 0px;}

h1, h2, h3, h4, h5, h6{margin: 7px 0px 7px 0px;}
p{margin: 15px 0px 15px 0px;}
blockquote{color: #777777; font-style:italic; margin: 0px 10px 0px 10px; padding-left: 5px; border-left: 3px solid #CCCCCC;}
table{border: solid 1px #777777; margin: 10px 0px 10px 0px;}
th, td{border: solid 1px #777777; padding: 5px; vertical-align: middle;}


/*HEADER*/
#header{width: 960px; margin:auto;}
#pagetitle a:link, #pagetitle a:visited, #pagetitle a:hover, #pagetitle a:active, #pagetitle h1{color: #ffffff; text-decoration: none;}
img#banner{width: 960px; border: none;}


/*NAVIGATION*/
/*Things that are affecting in every level*/
#mainnavi{width: 960px; margin:auto; margin-bottom: 10px;}
#mainnavi a:link, #mainnavi a:visited, #mainnavi a:hover, #mainnavi a:active{text-decoration: none; color: #ffffff; font-size: 16px; display: block;}
nav ul{display: none;}
nav select {display: none;}

/*First level*/
#mainnavi ul{display:block; list-style: none; padding-left: 5px; line-height: 40px;}
#mainnavi ul li{position: relative; float: left;}
#mainnavi ul a{padding: 0px 10px 0px 10px;}

/*Second level*/
#mainnavi ul ul{position: absolute; visibility: hidden; left: 0px; top: 40px; width: 140px; z-index: 9001; padding-left: 0px; line-height: 30px;}
#mainnavi ul ul li{width: 140px; z-index: 9001; padding-right: 10px;}
#mainnavi ul ul a{width: 140px;}
#mainnavi ul li:hover ul{visibility: visible;}
#mainnavi li li{border-bottom: solid 2px;}

/*Third level*/
#mainnavi ul ul ul{position: absolute; left: 151px !important; top: 1px; display: none; z-index: 9001; padding-left: 0px;}
#mainnavi ul ul ul li{width: 140px; z-index: 9001;}
#mainnavi ul ul ul a{width: 140px;}
#mainnavi ul ul li:hover ul{display: block;}



/*MAIN CONTENT*/
#contentwrap{width: 960px; margin:auto;}
#maincontent{width: 600px; margin-top: 15px; padding-bottom: 20px; float:left;}
#maincontent a:link, #maincontent a:visited{text-decoration: none; !important}
#maincontent a:hover, #maincontent a:active{text-decoration: underline; !important}

#maincontent-full{width: 960px; margin-top: 15px; padding-bottom: 20px;}
#maincontent-full a:link, #maincontent-full a:visited{text-decoration: none; !important}
#maincontent-full a:hover, #maincontent-full a:active{text-decoration: underline; !important}

/*Articles*/
#article{background: #ffffff; padding: 20px 10px 20px 10px; margin-bottom: 15px;}
#longthumb{text-align: center; margin-bottom: 15px;}
#longthumb img{max-width: 330px; max-height: 440px;}
#shortthumb{text-align: center; margin-bottom: 15px;}
#shortthumb img{max-width: 580px; max-height: 400px;}
h2.articletitle{margin-bottom: 10px;}
p.time{font-size: 14px; margin-bottom: 7px; color: #888888;}
p.details{font-size: 14px; margin: 0px !important; color: #888888;}

#articlecontent{margin-bottom: 15px;}
#articledetails{font-size: 14px; margin-bottom: 7px; color: #888888; line-height: 1.5;}
img.detailspic{margin-right: 7px; padding-top: 4px;}
#articlecontent ul{margin-left: 30px;}
#articlecontent ol{margin-left: 30px;}

/*Pagination*/
#pagination a {color: #ffffff !important; padding: 5px; }
p.older{float: left; line-height: 40px !important; margin: 0px !important; padding: 0px 10px 0px 10px; color: #ffffff !important; font-size: 13px;}
p.newer{float: right; line-height: 40px !important; margin: 0px !important; padding: 0px 10px 0px 10px; color: #ffffff !important; font-size: 13px;}
a[rel="next"], a[rel="prev"]{line-height: 38px !important;}

/*Comments*/
#comments{background: #ffffff; padding: 20px 10px 20px 10px; margin-bottom: 15px;}
#comments h3{margin: 15px 0px 15px 0px;}
#commentpagination a {color: #ffffff !important; padding: 5px; padding-bottom: 7px;}
#comments ol, #comments li{list-style: none;}
.comment-info{font-size: 13px; float:left; padding-right: 15px; max-width: 120px;}
.comment-data{margin-left: 125px;}
.single-comment{padding-top: 20px; margin-bottom: 20px;}
.required{color: #FF0000; font-size: 14px;}
#comments ul.children {padding-left: 50px;}

.comment-data li{border: none !important; margin-left: 15px; list-style: circle !important;}
.comment-data ol{list-style: square !important;} 

/*Archive*/
h1.archivetitle{margin-bottom: 20px; text-transform:uppercase;}
#miniarticle{margin: 0px 20px 20px 0px; }
#archivethumb{float: left; margin: 0px 10px 10px 0px; text-align: center;}
#archivethumb img{width: 120px !important; height: 120px !important;}
#archivetext p{font-size: 14px !important; margin: 5px 0px 0px 0px !important;}
a.archivemore{font-size: 14px !important;}


/*SIDEBAR AND SIDEBAR CONTENT*/
#sidebar{width: 300px; margin-top: 15px; float: right;}
#sidebar a:link, #sidebar a:visited{text-decoration: none;}
#sidebar a:hover, #sidebar a:active{text-decoration: underline;}

#widget{margin: 0px 0px 20px 0px; background:#ffffff; padding: 15px 10px 10px 10px;}
#widget ul{list-style: none;}
#widget ul ul{padding-left: 10px;}
#widget ul ul ul{padding-left: 20px;}

/*Calendar widget*/
#wp-calendar {border-collapse:collapse;}
#wp-calendar caption{text-transform:uppercase;}
#wp-calendar th{border-top: 1px solid #000000; padding: 3px; text-align: center;}
#wp-calendar td{border-top: 1px solid #000000; padding: 3px; text-align: center;}
td#prev{text-align: left;}
td#next{text-align: right;}


/*FOOTER*/
#footer{width: 960px; margin:auto; padding: 10px 0px 10px 0px; text-align: center; font-size: 13px;}
#footer a:link, #footer a:visited{text-decoration: none;}
#footer a:hover, #footer a:active{text-decoration: underline;}


/*WP STYLES -- REQUIRED */
#articlecontent img {margin: 0; max-width: 580px; height: auto;}
#articlecontent .alignleft, #articlecontent img.alignleft {display: inline; float: left; margin-right: 20px; margin-top: 5px; padding: 1px;}
#articlecontent .alignright, #articlecontent img.alignright {display: inline; float: right; margin-left: 20px; margin-top: 5px; padding: 1px;}
#articlecontent .aligncenter, #articlecontent img.aligncenter {clear: both; display: block; margin-left: auto; margin-right: auto;}
#articlecontent img.alignleft, #articlecontent img.alignright, #articlecontent img.aligncenter {margin-bottom: 12px;}
#articlecontent .wp-caption {background: #EEEEEE; line-height: 18px; text-align: center; margin-bottom: 20px; padding: 4px; max-width: 580px; height: auto;}
#articlecontent .wp-caption img {margin: 5px 5px 0; max-width: 96%;}
#articlecontent .wp-caption p.wp-caption-text {margin: 5px; color: #888; font-size: 12px;}
#articlecontent .wp-smiley {margin:0;}
#articlecontent .gallery {margin: auto;}
#articlecontent .gallery .gallery-item {float: left; margin-top: 0; text-align: center; width: 33%;}
#articlecontent .gallery img {border: 2px solid #CFCFCF;}
#articlecontent .gallery .gallery-caption {color: #888; font-size: 12px; margin: 0 0 12px;}
#articlecontent .gallery dl {margin: 0;}
#articlecontent .gallery img {border: 10px solid #EEEEEE;}
#articlecontent .gallery br+br {display: none;}
.sticky{ /*This is defined in css folder for each color */}
.bypostauthor{/* This isn't used in theme but theme tester needed it so... */}




/*IPADS!*/
@media only screen and (max-width : 1024px) {

#pagewrap, #header, #mainnavi, #contentwrap, #maincontent-full, #footer{width: 95%;}
img#banner{width: 100% !important; height: auto !important;}
#maincontent{width: 65%;}
#longthumb img{width: 80% !important; height: auto !important;}
#shortthumb img{width: 100% !important; height: auto !important;}
a[rel="next"], a[rel="prev"]{line-height: 41px;}
ul.children li{padding-left: 0px;}
#sidebar{width: 30%;}
label.screen-reader-text, input#s{width: 100%;}
input#s{margin-bottom: 5px;}

}





/*SMALL TABLET! (RESOLUTION)*/
@media only screen and (max-width : 768px){

#mainnavi ul{display: none !important;}
nav{width: 95% !important; margin: auto !important;}
nav select{display: inline !important; width: 100% !important;}
#maincontent, #sidebar{width: 100%;}
#articlecontent p, #articlecontent .wp-caption {width: 100% !important;}
#sidebar{margin: auto;}
#widget{width: 40%; float: left; margin-left: 20px;}
#pagination, #commentpagination{text-align: center; width: 100%;}
p.older, p.newer{float: none !important; width: 100%; margin: 0px !important; padding: 0px !important; text-align: center;}

}


/*SMALL TABLET (DEVICE)!*/
@media only screen and (max-device-width : 768px){

#mainnavi ul{display: none !important;}
nav{width: 95% !important; margin: auto !important;}
nav select{display: inline !important; width: 100% !important;}
#maincontent, #sidebar{width: 100%;}
#articlecontent p, #articlecontent .wp-caption {width: 100% !important;}
#widget{width: 40%; float: left; margin-left: 20px;}
#pagination, #commentpagination{text-align: center; width: 100%;}
p.older, p.newer{float: none !important; width: 100%; margin: 0px !important; padding: 0px !important; text-align: center;}

}






/*MOBILE! (RESOLUTION)*/
@media only screen and (max-width : 479px){

#maincontent, #sidebar{width: 100%; float: none !important;}
#widget{width: 70%; float: none; margin-left: 0px;}
textarea#comment{width: 100%;}

}


/*MOBILE! (DEVICE)*/
@media only screen and (max-device-width : 479px){

#maincontent, #sidebar{width: 100%; float: none !important;}
#widget{width: 70%; float: none; margin-left: 0px;}
textarea#comment{width: 100%;}

}


/*MOBILE 2! (RESOLUTION)*/
@media only screen and (max-width : 320px){

#pagewrap, #header, img#banner, #mainnavi, #contentwrap, #maincontent-full{width: 300px;}

}