/*Theme Name: Green Bulgaria Grid
Theme URI: http://www.greenbulgaria.org/
Description: The fresh theme for the GreenBulgaria.org site.
Version: 2.0
Author: Julian Kuntorov
Author URI: http://www.juliank.eu/
Tags: green, brown, grid, fixed width

The CSS, XHTML and design is released under Creative Commons Attribution-Noncommercial-No Derivative Works 2.5 Bulgaria: http://creativecommons.org/licenses/by-nc-nd/2.5/bg/

*/

body {margin: 0px 0px 20px 0px; background: url(img/cork.jpg) #fff; padding: 10px 0px 30px 25px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; clear: both; -webkit-text-stroke: 0.5px transparent;}
#center {margin-left: auto; margin-right: auto; width: 900px;}
@media only screen and (max-device-width:480px) {body{-webkit-text-stroke:0 black;}}

#grid {width: 880px; height: auto; margin: 0px; padding:0px;}
#grid ul {list-style: none; margin: 0px; padding:0px;}
#grid ul li {display: inline; margin: 6px; padding:0px; overflow: hidden; float: left; position: relative; -moz-box-shadow: 4px 2px 10px rgba(0, 0, 0, 0.65); box-shadow: 4px 2px 10px rgba(0, 0, 0, 0.7); -webkit-box-shadow: 4px 2px 10px rgba(0, 0, 0, 0.7); width: 199px; height: 199px;}
#grid ul li.box {padding:0px; width: 200px; height: 200px; display: block; margin-bottom: 5px; background: rgba(0, 0, 0, 0.7); /* IE FALLBACK background: #3d2718; */}

/* Logo Box */
#grid ul li.logo {background: url(img/logobox.png) top left no-repeat;}
#grid ul li.logo h1 {opacity: 1; position: absolute; top: 20px; left: 20px; margin-top: 0px; display: block; width: 161px; height: 120px;}
#grid ul li.logo h1:hover {opacity: 0.8;}
#grid ul li.logo h1 img {}
#grid ul li.logo form #s {font-size: 15px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; border: none; background-color: transparent; width: 130px; height: 30px; padding: 5px 0px 5px 0px; position: absolute; top: 155px; left: 23px; outline: none;}
#grid ul li.logo form #searchsubmit {width: 29px; height: 29px; border: none; background: url(img/searchbutton.png); position: absolute; bottom: 17px; right: 12px; text-indent: -9999px;}

/* Navigation */
#grid ul li.nav {color: #fff; width: 200px; height: 200px; font-size: 13px; display: block;}
#grid ul li.nav ul {list-style: none; height: 300px; padding: 10px;}
#grid ul li.nav ul li {display: block; float: none; margin: 0px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; width: auto; height: auto;}
#grid ul li.nav ul li a {color: #ddd; opacity: 1; padding: 6px 5px 6px 5px; display: block; width: 165px; border-bottom: 1px dotted rgba(255, 255, 255, 0.2); text-decoration: none;}
#grid ul li.nav ul li a:hover {color: #fff; background: rgba(255, 255, 255, 0.1);}

/* Footer */
#grid ul li.footer {color: #fff; width: 200px; height: 200px;}
#grid ul li.footer ul {padding: 10px;}
#grid ul li.footer ul li {-moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; width: auto; height: auto;}
#grid ul li.footer ul li.page a {font-size: 14px; color: #fff; opacity: 1; margin-bottom: 1px; text-decoration: none; text-shadow: 1px 1px 0px #000;}
#grid ul li.footer ul li.page a:hover {color: #111; background-color: #fff; text-shadow: none;}
#grid ul li.footer ul li.text {font-size: 11px; padding-top: 0px; line-height: 15px;}
#grid ul li.footer ul li.text a {color: #fff; opacity: 1; float: none; font-weight: bold; text-decoration: none;}
#grid ul li.footer ul li.text a:hover {color: #111; background-color: #fff;}
#grid ul li.footer ul li.text a.designedby {font-weight: normal;}

/* Articles List */
.back {position: absolute; top: 0; left: 0;}
.wrap {width:200px; height:200px; position:relative; margin:auto; overflow:hidden;}
.desc {position:absolute; width:180px; bottom:-300px; left:0px; color: #fff; background: rgba(0,0,0,0.7); padding: 10px; line-height: 18px; text-shadow: 1px 1px 0px #000;}
.desc a {display: block; margin-bottom: 0px; font-size: 13px; padding: 0px 0px 4px 0px; border-bottom: 1px dotted 
#fff; text-shadow: 1px 1px 0px #000; color: #fff; font-weight: bold; text-decoration: none;} 
.desc a:hover {border-bottom: 1px solid #fff;}
.desc a.readmore {display: inline; padding: 0px; font-size: 13px; border-bottom: none; text-shadow: 1px 1px 0px #000; color: #fff; font-weight: bold; text-decoration: none;} 
.desc a.readmore:hover {color: #111; background: #fff; text-shadow: none;}
.desc p {margin: 5px 0px 2px 0px; font-size: 12px;}

/* Grid Misc */
#grid ul li.notfound {color: #fff; padding: 10px; width: 180px; height: 180px;}
#grid ul li.notfound strong {font-size: 14px; font-weight: bold;}
#grid ul li.notfound p {font-size: 13px;}
#grid ul li.notfound p a {font-size: 13px; color: #fff; opacity: 1; margin-bottom: 1px; float: none; font-weight: bold; text-decoration: none;}
#grid ul li.notfound p a:hover {color: #444; background-color: #fff;}
#grid ul li a .desc {display: none;}
#grid ul li a:hover .more {visibility: hidden;}
#grid ul li img {margin: -1px; padding:0px;}
#grid ul li a img {border: none; padding: 0px; margin:0px;}
.message p {font-size: 13px; line-height: 19px;}
.message p .small {font-size: 11px; display: block;}
.message p a {color: #333; text-decoration: none; border-bottom: 1px dotted #333;}
.message p a:hover {border-bottom: 1px solid #333;}

/* Single Publication */
#grid .single {width: 200px; float: right; position: absolute; top: -5px; right: -10px;}
#grid .single li {dipslay: block; margin: 6px;}
#grid .single li.footer ul li.text {font-size: 11px; padding-top: 0px; line-height: 19px;}
#grid .single li.footer ul li.text a {color: #fff; opacity: 1; float: none; font-weight: bold;}
#grid .single li.footer ul li.text a:hover {color: #444; background-color: #fff;}
#grid .single li.footer ul li.text a.designedby {font-weight: normal;}

/* Content */
#content {position: relative; margin-top: 10px;}
#content h3 {font-size: 16px; font-weight: bold; margin-top: 0px;}
#content h3 a {color: #333; text-decoration: none; border-bottom: 2px dotted #333;}
#content h3 a:hover {border-bottom: 2px solid #333;}
.single-box {background: rgba(255, 255, 255, 0.9); padding: 30px; width: 630px; height: auto; -moz-box-shadow: 4px 2px 10px rgba(0, 0, 0, 0.4); box-shadow: 4px 2px 10px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 4px 2px 10px rgba(0, 0, 0, 0.4);}
#content .page img.init {padding: 5px 0px 10px 0px;}

/* Articles */
#content .article {clear: both;}
#content .article h2 {font-size: 24px; font-weight: normal; margin-top: 0px;}
#content .article h2 a {color: #333; text-decoration: none; border-bottom: none; padding-bottom: 2px;}
#content .article h2 a:hover {border-bottom: 2px dotted #333;}
#content .article p {font-size: 14px; color: #333; line-height: 22px;}
#content .article ol, #content .article ul  {font-size: 14px; color: #333; line-height: 22px;}
#content .article p a {text-decoration: none; color: #333; border-bottom: dotted 1px #333;} 
#content .article p a:hover {border-bottom: solid 1px #333;} 
#content .article .post-image {float: left; margin: 0px 15px 5px 0px; -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);}

/* Article Footer */
#content .article .footer {clear: both; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(0, 0, 0, 0.1); height: 40px; font-size: 12px;}
#content .article .footer a {text-decoration: none; color: #333;}

.post-time a {padding: 5px 7px 5px 7px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; border: 1px solid transparent;}

.post-time a:hover {background-color: #e5ff7b; border: 1px solid #aed805; display: inline; padding-left: 0px; padding: 5px 7px 5px 7px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px;}

.post-category a {padding: 5px 7px 5px 7px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; border: 1px solid transparent;}

.post-category a:hover {background-color: #b6dfff; border: 1px solid #74acd8; display: inline; padding-left: 0px; padding: 5px 7px 5px 7px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px;}

.post-author a {padding: 5px 7px 5px 7px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; background-color: none; border: 1px solid transparent;}

.post-author a:hover {background-color: #fafafa; border: 1px solid #ccc; color: #333; display: inline; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

.post-comments a {padding: 5px 7px 5px 7px; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; border: 1px solid transparent;}

.post-comments a:hover {background-color: #ffd6c2; border: 1px solid #e5946c; display: inline; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

/* Share */
a.stbutton {font-weight: bold; background: none !important; padding-left: 7px; padding: 5px 7px 5px 7px; display: inline; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: #fff; border: 1px solid transparent;}
a.stbutton:hover {background: #00BF72 !important; color: #fff !important; border: 1px solid #397d4e; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}


/* Comments */
#comments {margin-top: 25px;}
#comments ol {list-style: none; margin-left: -50px;}
#comments .comment {display: table-row;}
#comments img.avatar {display: table-cell; width: 48px; margin: 0px 10px 10px 10px; height: 48px;  vertical-align: top; border: 2px #fff solid;}
#comments div.comment-text {display: table-cell; vertical-align: top; padding-top: 10px; padding-bottom: 15px;}
#comments div.comment-text p.comment-author {font-size: 13px;}
#comments div.comment-text p.comment-author a {font-weight: bold; text-decoration: none; border-bottom: 1px dotted #999; color: #333;}
#comments div.comment-text p {font-size: 12px; line-height: 18px; margin-top: -10px;}
#comments div.comment-text p a {color: #333; text-decoration: none; border-bottom: 1px dotted #333;}
#comments div.comment-text p a:hover {border-bottom: 1px solid #333;}
#comments div.comment-text p.comment-time {font-size: 12px; line-height: 18px; color: #555;}
#comments div.comment-text p.comment-time a {text-decoration: none; color: #555; border-bottom: 1px dotted #999;}
#comments div.comment-text p.comment-time a:hover {border-bottom: 1px solid #999;}

/* Commenting */
#commenting {margin-top: 25px;}
#commenting #rules {font-size: 12px; width: 210px; line-height: 20px; float: right; margin: -10px 5px 10px 0px; padding: 10px; background:rgba(255, 255, 255, 0.5); border: 1px solid #fff;}
#commenting #rules a {color: #333; text-decoration: none; border-bottom: 1px dotted #333;}
#commenting #rules a:hover {border-bottom: 1px solid #333;}
#commenting div.form-row {padding-bottom: 10px;}
#commenting div.form-row input {width: 200px; background: #fff; border: 1px solid #ddd; opacity: 0.6; padding: 7px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #333;} 
#commenting div.form-row input:focus {opacity: 1; outline: none;}
#commenting div.form-row label {font-size: 12px; padding-left: 5px;}
#commenting div.form-area textarea {background: #fff; border: 1px solid #ddd; opacity: 0.6; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 5px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 13px; width: 580px; padding: 10px; color: #333;}
#commenting div.form-area textarea:focus {opacity: 1; outline: none;}
#commenting div.form-area label {font-size: 12px; padding-left: 5px; float: none;}
#commenting div.form-area input {background-color: #9ACD32; border: 1px solid #6B8E23; padding: 7px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #fff; margin: 10px; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; font-weight: bold;} 
#commenting div.form-area input:hover {background: #9ACD32; color: #e5ff7b;} 
#commenting div.form-area input:active {background: #6B8E23; color: #e5ff7b;}

/* Archive & Friends */
ul.pagelist {list-style: none; padding-left: 0px; border-top: 1px dotted #ddd;}
ul.pagelist li {border-bottom: 1px dotted #ddd; padding: 5px;}
ul.pagelist li:hover {background-color: #fafafa; -webkit-transition-property: background-color; -webkit-transition-duration: 500ms; -webkit-transition-timing-function: ease-out;}
ul.pagelist a {color: #333; text-decoration: none; border-bottom: none;}
ul.pagelist a:hover {border-bottom: #999 dotted 1px;}
ul.pagelist a.title {font-weight: bold;}
.bannerad {width: 145px; float: right; margin: -180px 5px 10px 0px; padding: 10px; background:rgba(255, 255, 255, 0.5); border: 1px solid #fff; text-align: center; }
.bannerad strong {font-size: 12px; line-height: 18px; margin: 0px; }
.bannerad img {margin-top: 10px;}