/*

Theme Name: Basicco
Theme URI: http://basicco.digiartistica.com.br/
Description: The Basicco is a minimalist theme with responsive layouts, designed for institutional websites and blogs.
Version: 1.0.0
License: GNU General Public License
License URI: license.txt
Tags: two-columns, right-sidebar, custom-background, custom-header, green, light, flexible-width, translation-ready
Author: Digi Artistica
Author URI: http://digiartistica.com.br/
        
DO NOT EDIT THIS FILE, IF YOU DO IT WILL BE OVERWRITTEN BY THE NEXT UPDATE. CREATE CHILD THEME INSTEAD. 
    
*/



/* ----- Reset ----- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, 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, thread, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: none;
}
textarea {
	overflow:auto;
	vertical-align:text-top;
}
/* ----- General -----*/

body {
	background: #EAEAEA url(images/header-bg.png) repeat fixed;
	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #000000;
}
a {
	text-decoration: none;
	color: #F2A26F;
}
a:hover {
	color: #DA7F52;
}
h1, h2, h3, h4, h5, h6 {
	margin: 20px 0;
}
h1, h1 a {
	color: #3F774C;
	font-size: 2em;
}
h1 a:hover {
	color: #8a9858;
}
h2, h2 a {
	color: #8a9858;
	font-size: 1.6em;
}
h2 a:hover {
	color: #D2C485;
}
h3, h3 a {
	color: #F2A26F;
	font-size: 1.4em;
}
h3 a:hover {
	color: #DA7F52;
}
h4, h4 a {
	color: #DA7F52;
	font-size: 1.2em;
}
h4 a:hover {
	color: #F2A26F;
}
h5 {
	color: #F9DA97;
	font-size: 1em;
}
h5 a:hover {
	color: #F2A26F;
}
h6 {
	font-size: 0.8em;
	text-transform: uppercase;
}
h6 a:hover {
	color: #F2A26F;
}
p {
	color: #666666;
	font-size: 1em;
	margin: 5px 0;
}
p.right {
	text-align: right;
}
p.center {
	text-align: center;
}
p.admin {
	color: #AAAAAA;
	font-size:  12px;
}
p.nocomments {
	padding:  0 20px;
	font-style:  italic;
	color:  #777777;
}
div#content embed, .embedded {
	text-align: center;
	margin: 0 0 14px 0;
	padding-left: 0;
	border: 0;
}
blockquote {
	font-size: 0.75em;
	margin: 16px 0 16px 20px;
	padding:  0 20px;
	border: 1px solid #E9E9E9;
	border-width: 0 0 0 1px;
}
blockquote.pullquote {
	width:  220px;
	padding: 5px 0;
	border:  0;
	line-height: 150%;
}
blockquote.pullquote p {
	margin-bottom: 0;
}
ol.commentlist li blockquote {
	border: 0;
	padding: 0;
}
.alignleft, blockquote.alignleft {
	margin: 0 20px 20px 0;
}
alignright, blockquote.alignright {
	margin: 0 0 20px 20px;
}
img.aligncenter, .aligncenter {
	margin: 0 auto 16px auto;
	text-align: center;
}
img.alignright, .alignright {
	margin: 16px 0 16px 16px;
	float: right;
}
img.alignleft, .alignleft {
	margin: 16px 16px 16px 0;
	float: left;
}
.frame {
	padding: 1px;
	border: 1px solid #E9E9E9;
}
.wp-caption {
	padding: 20px 18px;
	border: 1px solid #E9E9E9;
	color: #888888;
	font-style: italic;
	text-align: center;
}
p.wp-caption-text {
	margin: 10px 0 0 0 !important;
	padding: 0;
	font-size: 12px;
	line-height: 14px !important;
}
div.gallery {
	margin-bottom: 14px;
}
dd.gallery-caption {
	margin-top: 8px;
	font-size: 12px;
	color:  #777777;
	font-style: italic;
}
#post-thumbnail {
	margin: 20px 20px 10px;
	overflow: hidden;
	padding: 0;
}
.sticky {
	padding: 15px;
	background: #eeeeee;
	border: 1px solid #bbbbbb;
	color: #444444;
}
/* -----Repeatable patterns ----- */

/* ----- Small headers ----- */

.archive-title, .page-title, .widget-title, .entry-content th, .comment-content th {
	font-size: 11px;
	font-size: 0.785714286rem;
	line-height: 2.181818182;
	font-weight: bold;
	text-transform: uppercase;
	color: #8a9858;
}
/* ----- Shared Post Format styling ----- */

article.format-quote footer.entry-meta, article.format-link footer.entry-meta, article.format-status footer.entry-meta {
	font-size: 11px;
	font-size: 0.785714286rem;
	line-height: 2.181818182;
}
/* ----- Buttons ----- */

li.bypostauthor cite span {
	padding: 6px 10px;
	padding: 0.428571429rem 0.714285714rem;
	font-size: 11px;
	font-size: 0.785714286rem;
	line-height: 1.428571429;
	font-weight: normal;
	color: #7c7c7c;
	background-color: #e6e6e6;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6);
	background-image: linear-gradient(top, #f4f4f4, #e6e6e6);
	border: 1px solid #d2d2d2;
	border-radius: 3px;
	box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1);
}
li.bypostauthor cite span {
	color: #fff;
	background-color: #21759b;
	background-image: none;
	border: 1px solid #1f6f93;
	border-radius: 2px;
	box-shadow: none;
	padding: 0;
}
/* ----- Header ----- */

#header {
	background: #FFFFFF url(images/header-bg.png) repeat;
	width: 100%;
}
#header-wrapper {
	width:  960px;
	padding:20px;
	margin: 0 auto;
	overflow: hidden;
}
#logo {
	color: #949D5E;
	font-size: 2em;
	font-weight: bold;
	margin-left: 20px;
	float: left;
}
.site-name a {
	font-size: 1.5em;
	color: #949D5E;
	width: 300px;
}
.site-description {
	font-size: 0.50em;
}
/* ----- Social Media ----- */

#social-media-section {
	width: 600px;
	float: right;
}
.social-icons {
	padding: 0;
	margin: 30px 20px 0 0;
}
.social-icons li {
	float: right;
	margin-left: 10px;
}
.social-icons li a img {
	border: none;
}
/* ----- Menu ----- */

#top-menu {
	background: #3F774C;
	background-image: -ms-linear-gradient(top, #D2C485 0%, #3F774C 100%);
	background-image: -moz-linear-gradient(top, #D2C485 0%, #3F774C 100%);
	background-image: -o-linear-gradient(top, #D2C485 0%, #3F774C 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #D2C485), color-stop(1, #3F774C));
	background-image: -webkit-linear-gradient(top, #D2C485 0%, #3F774C 100%);
	background-image: linear-gradient(to bottom, #D2C485 0%, #3F774C 100%);
	width:  100%;
	height:  40px;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
}
#top-navigation {
	width: 960px;
	margin: 0 auto;
}
.menu ul li {
	float: left;
	overflow: hidden;
	margin: 0 2px 0 0;
}
.menu ul li a {
	padding: 10px 20px 11px;
	color: #FFFFFF;
	font-size: 0.92em;
	display:  block;
	text-shadow: 0 1px 0 #000000;
	border-left: 1px solid #3F774C;
	border-right: 1px solid #3F774C;
}
.menu ul li a:hover {
	background: #284d30;
	background-image: -ms-linear-gradient(top, #3F774C 0%, #284D30 100%);
	background-image: -moz-linear-gradient(top, #3F774C 0%, #284D30 100%);
	background-image: -o-linear-gradient(top, #3F774C 0%, #284D30 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3F774C), color-stop(1, #284D30));
	background-image: -webkit-linear-gradient(top, #3F774C 0%, #284D30 100%);
	background-image: linear-gradient(to bottom, #3F774C 0%, #284D30 100%);
	color: #F7F4E8;
}
/* ----- Wrapper ----- */

#wrapper {
	width:  960px;
	background: #FFFFFF;
	height:  auto;
	margin:  10px auto;
	overflow: hidden;
	min-height: 600px;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
	border-radius: 5px;
}
/* ----- Content ----- */

#content {
	float:  left;
	width: 70%;
	border-right: 1px solid #EAEAEA;
	margin: 20px 20px 40px 10px;
	padding: 10px 20px 10px 20px;
}
/* ----- Tags ----- */

.tags {
	color: #777777;
	font-size: 0.80em;
	margin: 15px 0;
}
/* ----- Comments ----- */


#comments, #respond {
	margin-top: 30px;
	clear: both;
}
#comments {
	font-size: 0.90em;
}
#author, #email, #url, #comment {
	margin: 0 10px 10px 0;
}
.comment-body {
	margin-bottom: 20px;
	border-bottom: 1px solid #EAEAEA;
	padding-bottom: 10px;
	font-size: 0.90em;
	line-height: 1.5em;
}
ol.commentlist {
	margin-top: 20px;
}
.comementlist p, .commentlist a {
	margin: 5px 0;
}
#comment {
	font-size: 0.95em;
	margin-bottom: 20px 0 0;
	float: left;
	clear: both;
}
#respond h3 {
	font-size: 1.2em;
}
#commentform label {
	float: left;
	clear:  both;
}
#commentform p {
	margin-bottom: 5px;
	font-size: 0.75em;
	float: left;
	clear: both;
}
img.avatar {
	margin-bottom: 0;
}
.comment-meta {
	margin: 10px 0;
	font-size: 0.75em;
}
.comment-reply-link {
	margin-bottom: 20px;
}
.nocomments {
	display: none;
}
.form-label {
	color: #777777;
	font-size: 0.90em;
	margin-top: 15px;
}
/* ----- Search ----- */

.screen-reader-text {
	font-size: 0.75em;
	float: left;
	margin-bottom: 5px;
}
#s {
	float: left;
	clear: both;
	width: 80%;
}
#searchsubmit {
	float: left;
	clear: both;
	margin-top: 5px;
}
/* ----- Sidebar ----- */

#sidebar-container p, #sidebar-container a, .recentcomments {
	font-size: 0.90em;
}
#sidebar-container {
	float: right;
	width: 20%;
	margin: 20px 20px 20px 0;
}
/* ----- Widgets ----- */

.widget-banner {
	width: 920px;
	height: 300px;
	margin:  20px;
	border: 1px solid #EAEAEA;
}
.widget-container {
	margin-bottom: 10px;
	border-bottom: 1px solid #EAEAEA;
	margin-right: 0;
	padding:  10px;
	overflow: hidden;
}
h2.widget-title {
	font-size: 0.90em;
	margin-top: 5px;
	margin-bottom: 5px;
}
.footer-column-container {
	background: #DFD08E;
	width: 100%;
	clear: both;
	padding:  10px 20px;
}
.footer-column-container p, .footer-column-container h1, .footer-column-container h2, .footer-column-container h3, .footer-column-container h4, .footer-column-container h5, .footer-column-container h6, .footer-column-container a {
	color: #FFFFFF;
}
/* ----- Footer ----- */

#footer {
	background: #8a9858;
	color: #FFFFFF;
	font-size: 0.75em;
	font-weight: bold;
	width:  100%;
	clear: both;
	overflow: hidden;
	text-shadow:  0 1px 0 #3F774C;
	border-top: 1px solid #3F774C;
}
#footer p, #footer a {
	color: #FFFFFF;
}
#footer a:hover {
	color: #F7F4E8;
}
#footer-wrapper {
	width: 960px;
	margin: 0 auto;
	padding: 10px;
}
#copyright {
	width: 100%;
}
.footer-site-name {
	width: 40%;
	float: left;
	margin-top: 10px;
	margin-left:  20px;
}
.footer-site-copy {
	width: 40%;
	float:  right;
	text-align: right;
	margin-bottom: 10px;
	margin-right:  20px;
}



/* ----- RESPONSIVE DESIGN ----- */

@media screen and (max-width: 980px) {
 #header-wrapper {
 width:  100%;
 padding:20px 0;
 margin: 0 auto;
 overflow: hidden;
}
 #logo {
 width: 40%;
 margin-left:  20px;
 float: left;
}
 #social-media-section {
 width: 50%;
 float: right;
 margin-right: 0;
}
 .social-icons {
 padding: 0;
 margin: 0 20px 0 0;
}
 #top-menu {
 width: 96%;
 margin-left: 20px;
 margin-right: 20px;
 overflow: hidden;
 border-radius: 7px;
}
 #top-navigation {
 width:  100%;
}
 .menu ul {
 margin-left: 10px;
}
 #wrapper {
 width: 96%;
}
 #post-thumbnail img {
 width: 100%;
 height: auto;
}
 #content {
 width: 57%;
 border: none;
}
 textarea {
 width: 100%;
 height: auto;
}
 #sidebar-container {
 width: 28%
}
 #footer-wrapper {
 width: 90.4%;
 overflow: hidden;
}
}
 @media screen and (max-width: 650px) {
 #header {
 width:  94%;
 border-radius: 7px;
 margin: 10px auto;
 overflow: hidden;
}
 #header-wrapper {
 width:  100%;
 padding:20px 0;
 margin: 0 auto;
 overflow: hidden;
}
 #logo {
 width: 50%;
 margin-left:  20px;
}
 #logo img {
 width: 90%;
 height: auto;
}
 #social-media-section {
 width: 40%;
 float: right;
 margin-right: 0;
}
 .social-icons {
 padding: 0;
 margin: 0 20px 0 0;
}
 #top-menu {
 width: 94%;
 margin-left: 20px;
 margin-right: 20px;
 overflow: hidden;
 border-radius: 7px;
}
 #top-navigation {
 width:  100%;
}
 .menu ul {
 margin-left: 10px;
}
 #wrapper {
 width: 94%;
}
 #post-thumbnail img {
 width: 100%;
 height: auto;
}
 #content {
 width: 83%;
 border-bottom: 1px solid #E9E9E9;
 border-right: none;
 margin-left: 20px;
}
 #sidebar-container {
 width: 93%;
 float: left;
 margin: 0 20px 20px;
}
 .widget-container {
 width: 27%;
 margin: 0 7px;
 float: left;
 border: 0;
}
 #footer-wrapper {
 width: 90.4%;
 overflow: hidden;
}
}
 @media screen and (max-width: 480px) {
 #header {
 width:  94%;
 border-radius: 7px;
 margin: 10px auto;
 overflow: hidden;
}
 #header-wrapper {
 width:  100%;
 padding: 10px 0 0 0;
 margin: 0 auto;
 overflow: hidden;
}
 #logo {
 width: 90%;
 margin:  0 auto;
}
 #logo img {
 width: 70%;
 height: auto;
 margin-left: 20px;
}
 #social-media-section {
 display: none;
}
 #top-menu {
 width: 94.2%;
 height: 30px;
 margin-left: 15px;
 margin-right: 15px;
 overflow: hidden;
 border-radius: 7px;
}
 #top-navigation {
 width:  100%;
}
 .menu ul {
 margin-left: 10px;
}
 .menu ul li a {
 padding: 5px 10px 5px;
}
 #wrapper {
 width: 94%;
 margin-left: 15px;
 margin-right: 15px;
}
 #post-thumbnail img {
 display: none;
}
 #content {
 width: 81%;
 border-bottom: 1px solid #E9E9E9;
 border-right: none;
 margin-left: 20px;
}
 #sidebar-container {
 width: 93%;
 float: left;
 margin: 0 20px 20px;
}
 .widget-container {
 width: 40%;
 float: left;
 border: 0;
}
 #footer-wrapper {
 width: 90.4%;
 overflow: hidden;
}
 .footer-site-name {
 width: 100%;
 float: left;
 margin: 10px 0;
 margin-left:  0;
 text-align: center;
}
 .footer-site-copy {
 width: 100%;
 float:  left;
 text-align: center;
 margin-bottom: 10px;
 margin-right:  0;
}
}
 @media screen and (max-width: 320px) {
 #header {
 width:  94%;
 border-radius: 7px;
 margin: 10px auto;
 overflow: hidden;
}
 #header-wrapper {
 width:  100%;
 padding: 10px 0 0 0;
 margin: 0 auto;
 overflow: hidden;
}
 #logo {
 width: 90%;
 margin:  0 auto;
}
 #logo img {
 width: 90%;
 height: auto;
 margin-left: 5%;
}
 #social-media-section {
 display: none;
}
 #top-menu {
 width: 94.2%;
 height: 30px;
 margin-left: 10px;
 margin-right: 10px;
 overflow: hidden;
 border-radius: 7px;
}
 #top-navigation {
 width:  100%;
}
 .menu ul {
 margin-left: 10px;
}
 .menu ul li a {
 padding: 5px 10px 5px;
}
 #wrapper {
 width: 94%;
 margin-left: 10px;
 margin-right: 10px;
}
 #post-thumbnail img {
 display: none;
}
 #content {
 width: 79.5%;
 border-bottom: 1px solid #E9E9E9;
 border-right: none;
 margin-left: 10px;
}
 #sidebar-container {
 width: 93%;
 float: left;
 margin: 0 20px 20px;
}
 .widget-container {
 width: 100%;
 float: left;
 border: 0;
}
 #footer-wrapper {
 width: 86%;
 overflow: hidden;
 margin-left: 10px;
 margin-right: 10px;
}
 .footer-site-name {
 width: 100%;
 float: left;
 margin: 10px 0;
 margin-left:  0;
 text-align: center;
}
 .footer-site-copy {
 width: 100%;
 float:  left;
 text-align: center;
 margin-bottom: 10px;
 margin-right:  0;
}
}