/* Theme Name: Blog Básico Theme URI: https://github.com/aicoutodasilva/blogbasico Description: Um belo tema de duas colunas para WordPress Version: 0.0.2 Author: Anderson Ismael Author URI: https://github.com/aicoutodasilva License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: one-column,two-columns,left-sidebar,right-sidebar,custom-background,custom-colors,custom-logo,custom-menu,editor-style,featured-images,post-formats,sticky-post,theme-options,threaded-comments,translation-ready,blog,news Text Domain: blogbasico */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # General # Header # Navigation # Content # Post # Widget # Comments # Navigation # Search # Footer # Slider # Responsive --------------------------------------------------------------*/ /*-------------------------------------------------------------- # General --------------------------------------------------------------*/ /* html */ html { font-family: sans-serif; font-size: 14px; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } /* body */ body { background-color: #e5e5e5; } body, button, input, select, optgroup, textarea { color: #333333; font-family: "Open Sans", sans-serif; font-size: 14px; line-height: 1.6; } /* links */ a { color: #c51e3a; text-decoration:none; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } a:hover, a:focus, a:active { color: #c51e3a; text-decoration:none; } /* forms */ button, input[type="button"], input[type="reset"], input[type="submit"] { border: none; background: #505050; color: #ffffff; text-transform:uppercase; font-size: 12px; line-height: 1.2; padding: 10px 12px; filter: alpha(opacity=80); opacity:0.8; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { filter: alpha(opacity=100); opacity:1; } button:active, button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus { filter: alpha(opacity=100); opacity:1; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { color: #666; border: 1px solid #dbdbdb; padding: 4px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus { color: #111111; border: 1px solid #707070; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } select { border: 1px solid #ccc; } textarea { width: 100%; } /* h1 - h6 */ h1, h2, h3, h4, h5, h6 { clear: both; margin:0 0 1em; } h1, .h1 { font-size: 29px; } h2, .h2 { font-size: 26px; } h3, .h3 { font-size: 23px; } h4, .h4 { font-size: 20px; } h5, .h5 { font-size: 17px; } h6, .h6 { font-size: 14px; text-transform: uppercase; } /* tags */ p { margin:0 0 1em; } ul, ol { margin:0 0 1em; } dfn, cite, em, i { font-style: italic; } blockquote { background-color: #f3f3f3; border-left: 4px solid #c51e3a; font-style: italic; margin: 0 0 10px; padding: 15px; font-size: 14px; } blockquote > p:last-child { margin: 0; } address { margin: 0 0 1.5em; } pre { background-color: rgba(0, 0, 0, 0.01); border: 1px solid rgba(51, 51, 51, 0.1); line-height: 1.2; margin-bottom: 1.6em; max-width: 100%; overflow: auto; overflow-wrap: break-word; padding: 0.8em; white-space: pre-wrap; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } code { background-color: #f9f2f4; color: #c7254e; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } dt { font-weight: bold; } dd { margin: 0 1.5em 1.5em; } table { border-collapse: collapse; border-spacing: 0; margin: 1.5em 0; width: 100%; } td, th { padding: 0.75em; border: 1px solid rgba(51, 51, 51, 0.1); } img { height: auto; max-width: 100%; } embed, iframe, object, video { max-width: 100%; } /* caption */ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /* posts and pages */ .sticky { display: block; } .updated:not(.published) { display: none; } .page-links { clear: both; margin: 0 0 1.5em; } /* comments */ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } /* alignments */ .alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /* gallery */ .gallery { margin-bottom: 1.5em; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66%; } .gallery-columns-7 .gallery-item { max-width: 14.28%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11%; } .gallery-caption { display: block; } /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; word-wrap: normal !important; } /* site */ .site{ background:#ffffff; box-shadow: 0 0 5px #707070; } /*-------------------------------------------------------------- # Header --------------------------------------------------------------*/ /*site-header*/ .site-header{ border-top: 3px solid #c51e3a; } .site-branding{ padding:47px 50px 0; position: relative; } .site-branding-logo{ width: 100%; display:inline-block; min-height: 60px; text-align:center; margin:0 0 40px; } .custom-logo-link{ line-height:0; font-size: 0; display:inline-block; vertical-align: middle; margin-right: 15px; } .custom-logo-link img{ max-height: 60px; width: auto; } .only-logo .custom-logo-link{ margin-right: 0; } .site-title{ display:inline-block; font-size:40px; line-height:45px; font-weight: lighter; color:#333333; letter-spacing: 1.75px; margin:0; padding: 10px 0 5px; vertical-align: middle; } .site-title a{ color:#333333; } .site-title a:hover, .site-title a:focus, .site-title a:active{ color:#c51e3a; } .site-description{ width: 100%; text-align:center; text-transform:uppercase; font-size: 10px; letter-spacing: 2px; color:#707070; margin:16px 0 0; } /*-------------------------------------------------------------- # Navigation --------------------------------------------------------------*/ /*main-navigation*/ .main-navigation{ border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; float:none; padding:0 10px; text-align:center; } /* menu */ .main-navigation .menu { list-style: none; margin: 0; padding-left: 0; } .main-navigation .menu >li{ position: relative; float:none; display:inline-block; } .main-navigation .menu li:hover > ul, .main-navigation .menu li.focus > ul { left: auto; } .main-navigation .menu >li >a{ display: block; color:#333333; line-height:48px; text-transform: uppercase; letter-spacing: 0.75px; font-size:12px; font-weight: 600; margin:0 15px; } .main-navigation .menu >li >a:hover, .main-navigation .menu >li >a:focus{ color:#c51e3a; text-decoration:none; } .main-navigation .menu >li ul{ float: left; position: absolute; top: 100%; left: -999em; z-index: 99999; list-style: none; margin: 0; padding-left: 0; background:#ffffff; box-shadow:none; border-left:1px solid #dbdbdb; border-right:1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; } .main-navigation .menu >li ul li{ float: left; position: relative; text-align:left; padding:0; } .main-navigation .menu >li ul li a{ display:inline-block; font-size:12px; line-height:1.2; padding:8px 15px; min-height:30px; border-bottom: 1px solid #f2f2f2; font-weight:lighter; color:#333333; width: 200px; } .main-navigation .menu >li ul li a:hover, .main-navigation .menu >li ul li a:focus{ color:#c51e3a; text-decoration:none; } .main-navigation .menu >li ul ul { left: -999em; top: 0; } .main-navigation .menu ul li:hover > ul, .main-navigation .menu ul li.focus > ul { left: 100%; } /* menu-toggle */ .menu-toggle{ width:40px; height:40px; position:absolute; top:0; right:0; font-size:30px; line-height:40px; text-transform:uppercase; text-align:center; padding:0; background:none; color:#c51e3a; } .menu-toggle:hover, .menu-toggle:focus{ background:none; filter: alpha(opacity=80); opacity:0.8; } /* responsive-nav */ .responsive-nav{ background-color: #ffffff; margin: 0; } .responsive-nav >li{ border-top: 1px solid rgba(125, 125, 125, 0.15); } .responsive-nav >li a{ display: block; padding: 10px 15px; color: #333333; } .responsive-nav >li a:hover, .responsive-nav >li a:focus{ background: none; color: #c51e3a; } .responsive-nav >li ul{ list-style: none; } .responsive-nav >li ul li{ border-top: 1px solid rgba(125, 125, 125, 0.15); } .responsive-nav >li ul li a{ display: block; padding: 10px 15px; } .responsive-nav >li ul li a:hover{ background: none; } .navbar-collapse{ box-shadow:none; padding: 0; } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ /*site-content*/ .site-content{} .site-main{} /*content-area*/ .content-area{ padding-top: 50px; padding-left: 50px; padding-right: 50px; } .sidebar-right .content-area{ padding-left: 50px; padding-right: 10px; } .sidebar-left .content-area{ padding-left: 10px; padding-right: 50px; } /*about-author*/ .about-author{ padding: 25px 0; border-bottom: 1px dotted #dbdbdb; font-size: 12px; line-height: 1.2; } .about-author-avatar{ width: 60px; height: 60px; float: left; } .about-author-avatar a{ display: block; width: 60px; height: 60px; line-height: 0; } .about-author-avatar img { width: 60px; height: 60px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .about-author-bio-wrap{ padding: 0 0 0 75px; } .about-author-name{ margin: 0 0 10px; } .about-author-name a{ color: #333333; font-weight: bold; font-size: 14px; } .about-author-name a:hover{ color: #c51e3a; } .about-author-name span{ color: #707070; margin-left: 5px; } .about-author-bio{ line-height: 1.6; margin: 0 0 10px; } .about-author-link{ color: #707070; } .about-author-link i { margin-left: 6px; position: relative; top: 1px; } /*-------------------------------------------------------------- # Post --------------------------------------------------------------*/ /*post*/ .site-main .post, .site-main .page{ border-bottom:1px solid #dbdbdb; margin:0; padding: 20px 0 0; } .site-main .post:first-child, .site-main .page:first-child{ margin: -40px 0 0; } .post-media{ margin: 0; padding: 20px 0 0; } .post-media a{ display:block; line-height:0; overflow: hidden; } .entry-header{} .entry-title{ color:#333333; text-align:center; font-size:24px; line-height: 1.2; letter-spacing:1px; margin: 0; padding: 20px 0 0; font-weight: bold; } .entry-title a{ color:#333333; } .entry-title a:hover, .entry-title a:focus{ color:#c51e3a; } .sticky .entry-title, .sticky .entry-title a{ color:#c51e3a; } .entry-meta{ text-align:center; font-size:12px; text-transform:uppercase; margin: 0; padding: 15px 0 0; } .entry-meta span{ margin:0 12px 0 0; } .entry-content{ margin: 0; padding: 20px 0; } .entry-footer{ margin:0 0 20px; } .entry-footer a{ display:inline-block; background:#dbdbdb; color:#ffffff; padding:5px; font-size: 10px; line-height:1.2; border-radius: 2px; text-transform: uppercase; margin:0 6px 5px 0; letter-spacing: 1px; } .entry-footer a:hover, .entry-footer a:focus{ text-decoration:none; background:#707070; color:#ffffff; } .more-link{ display:inline-block; text-transform:uppercase; margin:10px 0 0; } .error-404{ min-height:400px; } /*-------------------------------------------------------------- # Widget --------------------------------------------------------------*/ /*widget-area*/ .widget-area{ padding-top: 50px; padding-left: 50px; padding-right: 50px; } .sidebar-right .widget-area{ padding-left: 0; padding-right: 50px; } .sidebar-left .widget-area{ padding-left: 50px; padding-right: 0; } .widget{ margin:0 0 30px; } .widget a{ color:#333333; } .widget a:hover, .widget a:focus{ color:#c51e3a; } .widget-title{ text-align:center; font-weight:700; text-transform:uppercase; font-size:16px; line-height:1.2; } .widget >ul{ padding:0; list-style:none; } .widget >ul >li{ color:#333333; border-bottom:1px dotted #dbdbdb; margin:0 0 10px; padding:0 0 10px; line-height:1.2; } /*widget_tag_cloud*/ .widget_tag_cloud{} .widget_tag_cloud .tagcloud { padding: 5px 0 0; overflow: hidden; } .widget_tag_cloud a{ display: inline-block; height: 30px; line-height: 30px; font-size: 14px !important; background-color:#ffffff; padding: 0 10px; margin: 0 5px 7px 0; text-align: center; border: 1px dotted #dbdbdb; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .widget_tag_cloud a:hover { color: #ffffff !important; background-color: #c51e3a; } /*-------------------------------------------------------------- # Comments --------------------------------------------------------------*/ /*comments-area*/ .comments-area{ padding: 30px 0; margin: 0; } .comments-title{ text-align:center; font-size:16px; font-weight: 700; } .comment-list{ list-style:none; padding:0 0 15px; margin:0; border-bottom: 1px dotted #dbdbdb; } .comment, .pingback{ border-top: 1px dotted #dbdbdb; padding:15px 0 0; margin:15px 0 0; } .comment-body{ position:relative; } .comment-body .comment-avatar{ width:40px; height:40px; float:left; margin:0 10px 0 0; } .comment-body .comment-avatar img{ width:40px; height:40px; border-radius: 2px; } .comment-body .fn{ line-height:1.2; padding:4px 0 6px; font-weight: 600; letter-spacing: 0.75px; } .comment-body .fn a{ color:#333333; } .comment-body .comment-meta{ color:#707070; font-size:12px; font-style: italic; } .comment-body .comment-meta a{ color:#707070; } .comment-content p:last-of-type{ margin-bottom:0; } .comment-body .comment_wrap{ padding:0 0 0 50px; } .comment-body .comment-content{ padding:5px 0 0; line-height:1.5; } .comment-body .reply{ position:absolute; top:0; right:0; } .comment-body .reply a{ display:inline-block; background:#dbdbdb; color:#ffffff; padding:5px; font-size: 10px; line-height:1.2; border-radius: 2px; text-transform: uppercase; } .comment-body .reply a:hover, .comment-body .reply a:focus{ text-decoration:none; background:#707070; } .comment-list .comment .children{ margin:0; padding:0 0 0 50px; list-style:none; } .comment-list .comment .comment-respond{ margin-top: 15px; margin-left:50px; } .no-comments{ padding:15px 0 0; } /*comment-respond*/ .comment-respond{ padding:0 0 30px; margin:0; } .comment-reply-title{ font-weight:700; text-transform:uppercase; font-size:16px; line-height:1.2; margin:0 0 10px; position:relative; } .comment-reply-title small{ position:absolute; top:0; right:0; font-size:10px; line-height:1.2; } .comment-reply-title small a{ color:#707070; text-transform:uppercase; } .comment-form{} .comment-form .logged-in-as{ margin:0 0 10px; line-height:1.2; font-size:12px; color:#808080; } .comment-form .logged-in-as a{ color:#808080; } .comment-form .logged-in-as a:hover, .comment-form .logged-in-as a:focus{ color:#c51e3a; } .comment-form .comment-item{ margin:0 0 10px; } .comment-form textarea{ height:120px; } .comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"]{ width:50%; margin:0 10px 0 0; } .comment-form .form-submit{ margin:0; } /*-------------------------------------------------------------- # Navigation --------------------------------------------------------------*/ /*posts-navigation*/ .posts-navigation{ margin: 0; padding: 30px 0; text-transform:uppercase; overflow: hidden; } .posts-navigation .nav-previous{ float: left; width: 50%; } .posts-navigation .nav-next{ float: right; text-align: right; width: 50%; } /*post-navigation*/ .post-navigation{ line-height:1.2; margin:0; padding: 25px 0; overflow: hidden; } .post-navigation .nav-previous{ float: left; width: 50%; } .post-navigation .nav-next{ float: right; text-align: right; width: 50%; } /*comment-navigation*/ .comment-navigation{ padding:30px 0; text-transform:uppercase; overflow: hidden; } .comment-navigation .nav-previous{ float: left; width: 50%; } .comment-navigation .nav-next{ float: right; text-align: right; width: 50%; } /*pagination*/ .pagination{ margin: 0; padding: 40px 0; display: inline-block; } .pagination .nav-links{} .pagination .nav-links span, .pagination .nav-links a{ padding: 11px 15px; border: 1px solid #e5e5e5; color: #333333; display: inline-block; line-height:1.2; margin-left: -1px; float: left; background:#ffffff; } .pagination .nav-links a:hover, .pagination .nav-links a:focus{ text-decoration:none; color:#ffffff; background:#c51e3a; } .pagination .nav-links .current{ color:#ffffff; background:#c51e3a; } /*page-header*/ .page-header{ border:1px dotted #dbdbdb; margin:0; padding:15px 15px 0; text-align:center; } .page-header .page-title{ margin:0; font-size:20px; line-height:1.2; padding:0 0 15px; } .archive-description{ line-height:1.2; padding:0 0 15px; color:#707070; font-size:12px; } .archive-description p{ margin:0; } /*-------------------------------------------------------------- # Search --------------------------------------------------------------*/ /*search-form*/ .search-form{} .search-form label{ display:none; } .search-form .search-field{ height:40px; border-radius:3px 0 0 3px; padding:6px; } .search-form .search-submit{ width:40px; height:40px; line-height:40px; text-align:center; font-size:18px; padding:0; border-radius:0 3px 3px 0; } /*-------------------------------------------------------------- # Footer --------------------------------------------------------------*/ /*site-footer*/ .site-footer{ text-align:center; } .site-info{ font-size:13px; line-height:1.2; letter-spacing: 1px; padding:80px 50px 50px; color:#707070; } .site-info a{ color:#707070; } .site-info a:hover, .site-info a:focus{ color:#c51e3a; } .site-info-nav{ width: 40%; float: right; text-align: right; } .site-info-nav >div{ padding: 0 0 10px; } .site-info-nav >div:last-child{ padding: 0; } .site-info-social{ } .site-info-social >a{ padding: 0 10px 0 0; } .site-info-social >a:last-child{ padding: 0; } .site-info-social a i{ font-size: 14px; } .site-info-menu{ } .site-info-menu .footer-menu{ margin: 0; padding: 0; } .site-info-menu .footer-menu >li{ display: inline-block; margin: 0; padding: 0 10px 0 0; } .site-info-menu .footer-menu >li:last-child{ padding: 0; } .site-info-menu .footer-menu >li >ul{ display: none; margin: 0; padding: 0; } .site-info-copyright{ text-align: center; } .have-site-info-nav{ text-align: left; width: 60%; float: left; padding: 0 20px 0 0; } #back_top { bottom: 20px; cursor: pointer; height: 40px; position: fixed; right: 20px; text-align: center; width: 40px; z-index: 100; background: #777777; padding: 0; filter: alpha(opacity=100); opacity: 1; display: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } #back_top i { line-height: 40px; font-size: 20px; color: #ffffff; } #back_top.visible-button{ display: block; } /*-------------------------------------------------------------- # Responsive --------------------------------------------------------------*/ @media (max-width: 991px){ .site-branding{ padding-left:15px; padding-right:15px; } .site-branding-logo{ width:100%; text-align:center; } .custom-logo-link{ width: 100%; padding-top: 15px; padding-bottom: 15px; margin-right: 0; } .site-title{ width: 100%; } .site-description{ width: 100%; } .main-navigation{ border-bottom: none; } .content-area{ width:100%; padding-top: 20px; padding-left:15px; padding-right:15px; } .sidebar-right .content-area{ padding-left:15px; padding-right:15px; } .sidebar-left .content-area{ padding-left:15px; padding-right:15px; } .widget-area{ width:100%; padding-top: 20px; padding-left:15px; padding-right:15px; } .sidebar-right .widget-area{ padding-left:15px; padding-right:15px; } .sidebar-left .widget-area{ padding-left:15px; padding-right:15px; } .site-info{ padding-top: 30px; padding-left:15px; padding-right:15px; padding-bottom: 30px; } .site-info-copyright{ text-align: center; } .have-site-info-nav{ text-align:center; float:none; width:100%; padding:0; } }