/*
Theme Name: DSA Blog
Theme URI: http://www.dsaportfolio.com.br/
Author: Diego Alencar
Author URI: http://www.dsaportfolio.com.br/
Version: 1.0
Tags: green, sand, verde, areia, jardinagem, garden, responsive, responsivo
Text Domain: dsablog
*/

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

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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
main, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border: 0; font-size: 100%; font: inherit; vertical-align: baseline; border-collapse: collapse; border-spacing: 0; }
caption, tbody, tfoot, thead, tr, th, td{margin: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
html, body { width: 100%; height: 100%; -webkit-font-smoothing: subpixel-antialiased; margin: 0; padding: 0;}

/*------------------------ Essencial */

*:not(#wpadminbar):not(.ab-icon){-webkit-text-size-adjust: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; font-family: 'Rubik', sans-serif !important; color: #FFF;}
body{background-color: #000; background-image: url(images/home_bg.jpg); background-repeat: no-repeat; background-size: 100%; overflow-x: hidden;}

h1, h2, h3, h4, h5, h6,
h1 *, h2 *, h3 *, h4 *, h5 *, h6 *{font-weight: 700 !important;}

a{text-decoration: none; color: #FFFFFF; transition: color .5s;}
a:hover{color: #c3dce0;}
p{margin: 15px 0; color: #bbbbbb !important; line-height: 1.2em;}
i,em{font-style: italic; color: inherit !important;}
li{color: #bbbbbb !important;}
span{color: inherit !important;}
strong{font-weight: 700;}
code{display: inline-block; background-color: #000;}
p code{margin: 0;}
sup{vertical-align: super; color: inherit !important; font-size: 0.8em;}
sub{vertical-align: sub; color: inherit !important; font-size: 0.8em;}

svg{-webkit-filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.7)); filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.7)); }
body>header svg, #about_me svg, footer svg{width: 35px; height: 35px;}
.categories svg, .post_categ svg{width: 55px; height: 55px;}
main svg{width: 16px; height: 16px;}
svg[data-icon='facebook']{margin-right: -8px;}
svg *{fill: none; stroke: #FFFFFF; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-miterlimit:10;
	stroke-dashoffset: 0; stroke-dasharray: 200;}
a svg *{stroke: #CCCCCC; transition: stroke .5s ease .5s;}
svg.hover *{animation-duration: 2s; animation-delay: 0s; animation-fill-mode: forwards; animation-timing-function: ease;}
svg.hover:hover *{animation-name: hover;}
svg.intro *{stroke-dashoffset: 200; animation-duration: 2s; animation-delay: .5s; animation-fill-mode: forwards; animation-timing-function: ease; animation-name: intro;}

label{width: 100%; display: block; padding-bottom: 8px; padding-left: 6px;}

.center{text-align: center;}

input:not([type="checkbox"]):not([type="radio"]), textarea{width: 100%; min-width: 0; padding: 0 5px; margin-bottom: 25px; background-color: transparent !important; height: 42px; line-height: 1em; font-size: 16px; border: 2px solid #FFF; border-radius: 0; -webkit-appearance: none;}
textarea{height: auto; line-height: 20px; padding: 12px; resize: vertical;}
input[type='submit'],input[type='reset'],input[type='button'],button,.button{margin-bottom: 0; background-color: transparent !important; min-width: 140px; line-height: 2em; font-size: 16px; padding: 6px; cursor: pointer; border: 2px solid #FFF; color: #FFF; display: inline-block;}
input[type='submit']:hover,input[type='reset']:hover,input[type='button']:hover,button:hover,.button:hover{background-image: url("https://www.dsaportfolio.com.br/images/bt_interf.gif"); background-size: cover;}
.button.download{border: 2px solid #5bef47; color: #5bef47; position: relative; left: 50%; transform: translateX(-50%); text-align: center;}

.dropdown{height: 42px; width: 100%; position: relative; display: inline-block; cursor: pointer; margin-bottom: 10px; border: 2px solid #504f51;}
.dropdown, .dropdown *{-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: all 0.5s; transition: all 0.5s;}
.dropdown .selected_opt{height: 42px; line-height: 42px; font-size: 18px; color: #504f51; margin-right: 32px; padding-left: 12px; overflow: hidden; white-space: nowrap;}
.dropdown .selected_opt:after{content: ""; display: block; width: 19px; height: 17px; background-size: 19px 17px; background-image: url(images/dropdown_seta.png); background-repeat: no-repeat; background-position: center; position: absolute; top: 11px; right: 8px; -ms-transform: rotate(0deg); -webkit-transform: rotate(deg); transform: rotate(0deg); -webkit-transition: all 0.5s; transition: all 0.5s;}
.dropdown.open .selected_opt:after{-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); top: 9px;}
.dropdown ul.options{list-style: none; margin: 0; padding: 0; position: absolute; top: 39px; height: 0; overflow: hidden; background-color: #000;}
.dropdown.open ul.options{height: auto; min-width: 100%;}
.dropdown ul.options li{display: block; line-height: 1em; font-size: 18px; padding: 10px 5px; text-align: left; -webkit-transition: all 0.5s; transition: all 0.5s;}
.dropdown ul.options li:hover{background-color: #333;}
.dropdown ul.options li.disabled{color: #504f51 !important;}
.dropdown ul.options li.selected{background-color: #FFF; color: #000;}
.dropdown select{display: none;}

.alignleft{float: left; margin: 15px 15px 15px 0;}
.alignright{float: right; margin: 15px 0 15px 15px;}
.aligncenter{margin: 15px auto;}

img, .wp-caption{max-width: 1010px; width: 100%; height: auto;}
.wp-attach{position: relative;}
.wp-credito{position: absolute; bottom: 0; left: 0; display: inline-block; padding: 5px; background-color: rgba(49,51,57,0.8);}
.wp-caption-text{margin: 5px 0 30px 0 !important; font-size: 14px; font-style: italic;}
img.aligncenter, .wp-caption.aligncenter{display: block !important;}

#alfafiltro, .wp-pagenavi{text-align: center; line-height: 1.5em; margin: 50px 0;}
#alfafiltro>*, .wp-pagenavi>*{display: inline-block; padding: 0 7px !important;}
#alfafiltro a, .wp-pagenavi a{padding: 0;}

table{background-color: #313339;}
table, table *{line-height: 1.2em !important;}
table p{margin: 10px 0;}
table td{color: #bbbbbb !important;}
table td *:first-child{margin-top: 0 !important;}
table td *:last-child{margin-bottom: 0 !important;}
table.alignleft, table.alignright, table.aligncenter{width: auto !important; min-width: 50%;}
th, td{border-bottom: 1px solid #515663; border-top: 1px solid #515663; border-right: 1px solid #434751; padding: 10px;}
th {background-color: #434751; font-weight: 700; text-align: center;}
td:last-child, th:last-child {border-right: 0;}

@keyframes hover { 0% {stroke-dashoffset: 0;} 100% {stroke-dashoffset: 400;} }
@keyframes intro { 0% {stroke-dashoffset: 200;} 100% {stroke-dashoffset: 0;} }

/*------------------------ Estrutura basica */

body>header,#post_banner,#highlights,#site,#site>.categories,.column>.ad,main{max-width: 1440px; width: 100%;}
body>header,#post_banner,#highlights,#site{margin-left: auto; margin-right: auto;}
#site>.categories,#post_banner,#highlights,#site,.column>.ad{margin-bottom: 25px;}
body>footer{width: 100%;}
.column{width: calc(100% - 25px - 365px); margin-right: 25px;}
.social_all,#site>.categories,.column>.ad,main,#sidebar,body>footer{background-color: rgba(49,51,57,0.8);}

body>header,#site>.categories{padding: 0 20px;}
body>header>*, #secondary_header>*{position: absolute; top: 50%; transform: translateY(-50%);}

/*------------------------ Header */

body>header{height: 120px; margin-bottom: 0; transition: margin-bottom .5s; position: relative;}

#welcome{width: 100%; height: 300px; position: relative; overflow: hidden; transition: height 1s;}
#welcome:after{content: ""; display: block; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); position: absolute; z-index: 2; top: 0; left: 0;}
#welcome video{position: absolute; z-index: 1; width: 100%; height: 100%; left: 0; top: 0; object-fit: cover;}
#welcome #ret{display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 3; background: url(images/reticula.gif);}
#welc_close{display: block; position: absolute; top: 10px; right: 10px; cursor: pointer; width: 20px; height: 10px; font-weight: 900; font-size: 24px; z-index: 5;}
#welc_frase{position: absolute; top: 50%; left: 50%; width: 100%; max-width: 1440px; transform: translate(-50%,-50%); font-size: 34px; font-weight: 700; z-index: 4; text-align: center; padding: 0 20px;}
#welc_frase span{font-size: 42px; display: inline-block; padding-bottom: 10px;}

.logo_area{width: 179px; height: 98px; left: 0;}
.logo{background-image: url(images/logo.png); background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; }
.logo a{display: block; width: 100%; height: 100%;}
#status{position: absolute; display: inline-block; white-space: nowrap; top: 50%; left: calc(100% + 2px); transform: translateY(-50%); background-color: #313339; border-radius: 14px; height: 28px; line-height: 28px; font-size: 14px; padding: 0 15px;}
#status:before{content: ""; display: block; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 22px solid #313339; position: absolute; left: -20px; top: 50%; transform: translateY(-50%);}

#secondary_header{height: 75px; width: 100%; position: fixed; top: -100px; left: 0; transition: top .5s; background-color: #313339; z-index: 9999; box-shadow: 0 5px 20px rgba(0,0,0,0.5);}
#secondary_header.show{top: 0;}
#secondary_header .logo_area{width: 126px; height: 70px; left: calc(50% - 720px); z-index: 3;}
#secondary_header .logo_area a{display: block; width: 100%; height: 100%;}
#secondary_header .categories{right: calc(50% - 700px); z-index: 1;}
#secondary_header>.categories, #secondary_header>.categories ul, #secondary_header>.categories li{height: auto;}
#secondary_header>.categories li{text-align: center; font-size: 12px; padding: 0 16px 0 15px;}
#secondary_header>.categories li:first-child{padding: 0 16px 0 0 !important;}
#secondary_header>.categories li:last-child{padding: 0 0 0 15px;}
#secondary_header>.categories li a{padding-bottom: 10px;}
#secondary_header>.categories li svg{display: block; margin-left: auto; margin-right: auto; margin-top: -1px; margin-bottom: -2px; transform: scale(0.7);}
body.customize-support #secondary_header.show, body.user-loggedin #secondary_header.show{top: 32px;}

.search{position: relative; min-width: 35px; width: 35px; height: 42px; overflow: hidden; transition: width .5s; z-index: 10;}
.call_search{cursor: pointer; width: 35px; height: 100%;}
.call_search, .search form{display: inline-block; vertical-align: top;}
.search form{padding-left: 20px; width: calc(100% - 50px);}
.search form, .search form input{height: 35px; margin: 0;}
.search form input{font-size: 16px; border: 2px solid #504f51;}

body>header .search{left: 360px;}
#secondary_header .search{position: absolute; top: 50%; transform: translateY(-50%); left: calc(50% - 594px); z-index: 2;}
#secondary_header .search svg{width: 35px; height: 35px;}

:target:before {content:""; display:block; height: 90px; margin: -90px 0 0;}
body.customize-support :target:before, body.user-loggedin :target:before{height: 120px; margin: -120px 0 0;}

#right_area{right: 20px; max-width: 50%; text-align: right; transition: right .5s, max-width .5s; white-space: nowrap; overflow: hidden;}
#right_area *{display: inline-block; vertical-align: middle;}
#right_area .social{padding-left: 10px;}
.social ul{display: inline-block; vertical-align: middle;}
#right_area .social_main, .social_all{display: none;}
#right_area .social_main{height: 0;}
#right_area .social_main div[role='button']{cursor: pointer; transform: rotate(0deg); transition: transform .5s;}
body>header.show_sn #right_area .social_main div[role='button']{transform: rotate(180deg);}
#right_area{height: 38px;}
#right_area nav{text-transform: uppercase;}
#right_area nav li{padding-left: 15px;}
.social_all{position: absolute; width: 100%; bottom: -45px; top: auto; left: 0; text-align: center; height: 0; transition: height .5s; overflow: hidden; transform: none;}
.social_all ul{display: flex; justify-content: center; align-items: center; height: 100%;}
.social_all li{margin: 0 5px; display: none;}
.social li, .social_main li{padding: 0 2px;}
#right_area nav, #right_area nav ul, #right_area nav li{white-space: nowrap;}
body>header.show_sn .social_all{height: 45px;}

@media screen and (max-width: 1440px){
	#secondary_header .logo_area{left: 10px;}
	#secondary_header .search{left: 136px;}
	#secondary_header .categories{right: 20px;}
}
@media screen and (max-width: 1080px){
	body>header.show_sn{margin-bottom: 65px;}

	#right_area {height: 68px;}
	#right_area .social{display: none;}
	.social_all{display: block;}
	.social_all li{display: none;}
	.social_all li:nth-child(n+4){display: list-item;}
	#right_area .social_main{display: block; height: 38px;}
	#right_area nav li{padding-bottom: 15px;}
}
@media screen and (max-width: 1000px){
	#secondary_header:not(.show)>.categories{display: none;}
	#secondary_header>.categories{top: 9.5px; width: 100%; padding-left: 20px; transform: none; }
	#secondary_header>.categories .cat_icon{display: block; text-align: right;}
	#secondary_header>.categories .cat_menu{display: none; margin-top: 7px; width: calc(100% + 20px); background-color: #313339;}
	#secondary_header>.categories.show_cat .cat_menu{display: block;}
	#secondary_header>.categories ul{display: flex; flex-flow: row wrap; justify-content: center; align-content: flex-start; align-items: baseline;}
	#secondary_header>.categories li{min-height: 60px; font-size: 14px; width: 33.3%; display: table; text-align: center; padding-top: 5px !important; padding-bottom: 5px !important;}
	#secondary_header>.categories li:after{height: 65%;}
	#secondary_header>.categories li a{padding-bottom: 0 !important;}
	#secondary_header>.categories li svg{top: 0; margin-top: 5px; margin-bottom: 5px; transform: scale(1); display: inline-block; margin-left: 0; margin-right: 5px; margin-top: 0; margin-bottom: 0;}
}
@media screen and (max-width: 920px){
	#status{top: 5px; left: calc(100% - 10px); transform: none;}
	body>header .search{left: 162px; top: 63%;}
}
@media screen and (max-width: 1000px) and (min-width: 601px){
	#secondary_header>.categories li:nth-child(3n+1){padding: 0 16px 0 15px;}
	#secondary_header>.categories li:nth-child(3n+0){padding: 0 15px 0 15px;}
	#secondary_header>.categories li:nth-child(3n+0):after{display: none;}
}
@media screen and (max-width: 782px){
	:target:before {content:""; display:block; height: 104px; margin: -104px 0 0;}
	body.customize-support :target:before, body.user-loggedin :target:before{height: 134px; margin: -134px 0 0;}

	body.customize-support #secondary_header.show, body.user-loggedin #secondary_header.show{top: 46px;}
}
@media screen and (max-width: 650px){
	.logo_area{width: 150px; height: 78px;}
	body>header .search{left: 132px; top: 65%;}
}
@media screen and (max-width: 600px){
	#right_area{height: 38px;}
	#right_area nav{display: none;}
	body>header.show_search #right_area{max-width: 0;}

	:target:before {content:""; display:block; height: 90px !important; margin: -90px 0 0 !important;}

	body.customize-support #secondary_header.show, body.user-loggedin #secondary_header.show{top: 0;}
}
@media screen and (max-width: 580px), screen and (max-device-height: 900px){
	#welcome{height: 240px;}
	#welc_frase{font-size: 24px;}
	#welc_frase span{font-size: 30px;}
}
@media screen and (max-width: 515px){
	#right_area{top: 68%;}
}
@media screen and (max-width: 430px){
	#right_area .social_main li:nth-child(2), #right_area .social_main li:nth-child(3){display: none !important;}
	.social_all li:nth-child(2), .social_all li:nth-child(3){display: list-item !important;}
}

/*------------------------ Destaques e Categorias */

.post_categ{width: 140px; height: 140px; position: absolute; z-index: 3; top: 0; right: 0; overflow: hidden;}
.post_categ:before{content: ""; display: block; position: absolute; width: 200%; height: 200%; bottom: 35px; left: 55px; transform: rotate(45deg); z-index: 1; background-color: rgba(49,51,57,0.8); box-shadow: 3px 3px 40px rgba(0,0,0,0.5);}
.post_categ svg{position: absolute; top: 0; right: 0; z-index: 2; top: 2px; right: 2px;}

#highlights, #highlights .post_thumb{height: 330px;}
#highlights{display: flex;}
#highlights .post_thumb{width: calc(33.3% - 5.3px); position: relative; overflow: hidden;}
#highlights .post_thumb:nth-child(2){margin: 0 8px;}
#highlights .post_thumb a{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 4; display: block;}
#highlights .post_thumb h2{position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; font-size: 28px; text-shadow: 3px 3px 6px rgba(0,0,0,0.5); z-index: 2; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0.8) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.8) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,0.8) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 );}
#highlights .post_thumb h2 span{position: absolute; display: block; width: calc(100% - 40px); left: 20px; bottom: 20px;}
#highlights .post_thumb .post_thumb_img{width: 100%; height: 100%; transition: width .5s, height .5s; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1; background-repeat: no-repeat; background-size: cover; background-position: center;}
#highlights .post_thumb:hover .post_thumb_img{width: 115%; height: 115%;}

#post_banner{height: 335px; position: relative; text-align: center; background-size: cover; background-position: center;}
#post_banner:before{content: ""; display: block; position: absolute; z-index: 1; width: 100%; height: 100%; background-color: rgba(0,0,0,0.75);}
#post_banner svg{width: 55px; height: 55px;}
#post_banner .post_title{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; width: 70%;}
#post_banner .post_title h1{font-size: 44px;}

.categories, .categories ul, .categories li{height: 70px;}
.categories ul{display: flex; justify-content: center;}
.categories ul, .categories li{margin: 0; padding: 0;}
.categories li{padding: 0 23px 0 15px; position: relative; display: table; font-weight: 500;}
.categories li:after{content: ""; display: block; position: absolute; top: 50%; right: 0; height: calc(100% - 45px); width: 1px; background-color: #808080; transform: translateY(-50%);}
.categories li:first-child{padding: 0 23px 0 0;}
.categories li:last-child{padding: 0 0 0 15px;}
.categories li:last-child:after{display: none;}
.categories li>*{display: table-cell; vertical-align: middle;}
.categories li svg{display: inline-block; vertical-align: middle; margin-right: 5px; opacity: 0.3; transition: opacity .5s;}
.categories li a{color: #bbbbbb; transition: color .5s;}
.categories li a:hover{color: #FFFFFF;}
.categories li a:hover svg{opacity: 1;}
.categories .cat_icon{text-align: center; display: none;}
.categories .cat_icon svg{cursor: pointer;}

@media screen and (max-width: 1280px){
	#highlights, #highlights .post_thumb{height: 240px;}
	#highlights .post_categ{width: 130px; height: 130px;}
	#highlights .post_categ svg{transform: scale(0.8); top: 0; right: 0;}
	#site>.categories, #site>.categories ul, #site>.categories li{height: auto;}
	#site>.categories li{text-align: center; font-size: 14px; padding: 0 16px 0 15px; min-height: 60px;}
	#site>.categories li:first-child{padding: 0 16px 0 0 !important;}
	#site>.categories li:last-child{padding: 0 0 0 15px;}
	#site>.categories li a{padding-bottom: 10px;}
	#site>.categories li svg{display: block; margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px;}
}
@media screen and (max-width: 1280px) and (min-width: 921px){
	#highlights .post_thumb h2{font-size: 22px;}
}
@media screen and (max-width: 920px){
	#highlights{flex-direction: column; align-items: flex-start; height: 400px;}
	#highlights .post_thumb{height: calc(33.3% - 5.3px); background-color: #313339; width: 100%;}
	#highlights .post_thumb:nth-child(2){margin: 8px 0;}
	#highlights .post_thumb h2{position: absolute; bottom: 0; left: auto; right: 0; width: 60%; height: 100%; background: -moz-linear-gradient(left, rgba(49,51,57,0) 0%, rgba(49,51,57,1) 25%, rgba(49,51,57,1) 100%);
background: -webkit-linear-gradient(left, rgba(49,51,57,0) 0%,rgba(49,51,57,1) 25%,rgba(49,51,57,1) 100%);
background: linear-gradient(to right, rgba(49,51,57,0) 0%,rgba(49,51,57,1) 25%,rgba(49,51,57,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00313339', endColorstr='#313339',GradientType=1 );}
	#highlights .post_thumb h2 span{width: calc(100% - 80px); left: 60px; bottom: 50%; transform: translateY(50%);}
	#highlights .post_categ{display: none;}
	#highlights .post_thumb .post_thumb_img{width: 60%; left: 25%;}
	#highlights .post_thumb:hover .post_thumb_img{width: 75%;}
}
@media screen and (max-width: 820px){
	#site .categories .cat_icon{display: block;}
	#site .categories .cat_menu{display: none;}
	#site .categories.show_cat .cat_menu{display: block;}
	#site .categories ul{display: flex; flex-flow: row wrap; justify-content: center; align-content: flex-start; align-items: baseline;}
	#site .categories li{width: 33.3%; display: table; text-align: center; padding-top: 5px !important; padding-bottom: 5px !important;}
	#site .categories li:after{height: 65%;}
	#site .categories li a{padding-bottom: 0 !important;}
	#site .categories li svg{display: inline-block; margin-left: 0; margin-right: 5px; margin-top: 0; margin-bottom: 0;}

	#post_banner .post_title{width: calc(100% - 40%);}
	#post_banner .post_title h1{font-size: 36px !important;}
}
@media screen and (max-width: 820px) and (min-width: 601px){
	#site .categories li:nth-child(3n+1){padding: 0 16px 0 15px;}
	#site .categories li:nth-child(3n+0){padding: 0 15px 0 15px;}
	#site .categories li:nth-child(3n+0):after{display: none;}
}
@media screen and (max-width: 650px){
	#highlights .post_thumb h2{font-size: 22px;}
}
@media screen and (max-width: 600px){
	.categories li{width: 50% !important;}
}
@media screen and (max-width: 600px) and (min-width: 431px){
	.categories li:nth-child(2n+1){padding: 0 16px 0 0 !important;}
	.categories li:nth-child(2n+0){padding: 0 0 0 15px !important;}
	.categories li:nth-child(2n+0):after{display: none !important;}
}
@media screen and (max-width: 540px){
	#highlights .post_thumb h2{font-size: 18px;}
	#post_banner .post_title h1{font-size: 28px !important;}
}
@media screen and (max-width: 430px){
	#highlights{display: block; height: auto;}
	#highlights .post_thumb{height: auto; width: 100%; background: transparent;}
	#highlights .post_thumb h2{position: relative; bottom: auto; top: 100%; width: 100%; height: auto; background: transparent; padding: 5px 20px 2px 20px;}
	#highlights .post_thumb h2 a{position: static; top: auto; left: auto; width: auto; height: auto; display: inline;}
	#highlights .post_thumb h2 span{position: static; width: 100%; left: auto; bottom: auto;  transform: none;}
	#highlights .post_thumb .post_thumb_img{height: 130px; width: 100%; position: static; transform: none;}
	#highlights .post_thumb:hover .post_thumb_img{width: 100%; height: 130px;}

	.categories li{width: 100% !important; height: 60px !important; padding: 0 !important;}
	.categories li:after{display: none !important;}
	.categories li:first-child{padding: 0 !important;}
	.categories li a{padding-left: 80px !important; font-size: 18px !important;}
	.categories li svg{position: absolute !important; left: 25px !important; top: 50% !important; transform: translateY(-50%) !important;}
}

/*------------------------ Conteudo geral */

#site{display: flex; align-items: flex-start; align-content: flex-start; flex-flow: row wrap; position: relative;}
#site .column{flex-direction: column; align-items: flex-start;}

.column>.ad{min-height: 100px; order: 2; text-align: center; padding-top: 5px;}
main{order: 4; padding: 20px; font-size: 16px;}

#home main>article,
#archive main:not(#termos)>article,
#search main>article.post{position: relative; margin-bottom: 40px; padding-left: 440px; min-height: 235px;}
#home main>article .post_thumb,
#archive main:not(#termos)>article .post_thumb,
#search main>article.post .post_thumb{width: 420px; height: 255px; position: absolute; left: -20px; top: -20px; overflow: hidden;}
#home main>article .post_thumb a,
#archive main:not(#termos)>article .post_thumb a,
#search main>article.post .post_thumb a{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 4; display: block;}
#home main>article .post_thumb_img,
#archive main:not(#termos)>article .post_thumb_img,
#search main>article.post .post_thumb_img{width: 100%; height: 100%; transition: width .5s, height .5s; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; background-size: cover; background-position: center;}
#home main>article:hover .post_thumb .post_thumb_img,
#archive main:not(#termos)>article:hover .post_thumb .post_thumb_img,
#search main>article.post:hover .post_thumb .post_thumb_img{width: 115%; height: 115%;}
#home main>article header,
#archive main:not(#termos)>article header,
#search main>article.post header{margin-bottom: 20px; font-size: 12px;}
#home main>article h2,
#archive main:not(#termos)>article h2,
#search main>article.post h2{font-size: 24px; margin-bottom: 10px;}

#search main>article.post{margin-top: 60px;}
#search main>article.termo{margin-bottom: 30px;}

#archive main .archives_title{padding-bottom: 40px;}

main#termos article{padding-bottom: 20px;}
main#termos article h2{margin: 25px 0 20px 0;}
main#termos article h2 a{color: #c3dce0 !important;}
main#termos article .button{line-height: 1.125em;}

.conteudo p{margin: 30px 0;}

main>article .comentarios{display: inline-block; padding-left: 10px; padding-top: 30px;}
main>article .comentarios svg{margin-right: 5px; vertical-align: middle;}
main>article .comente{padding-top: 50px;}
main>article .comente .comment_form_left{float: left; padding-right: 10px; width: 50%;}
main>article .comente .comment_form_right{float: right; padding-left: 10px; width: 50%;}
main>article .comente .oneall_social_login{margin-bottom: 40px; border-bottom: 1px solid #666; padding-bottom: 30px; position: relative;}
main>article .comente .oneall_social_login:after{content: "ou preencha o formul\00E1rio abaixo:"; background-color: #27292e; padding: 3px 10px; color: #888; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); display: inline-block; min-width: 244px; text-align: center;}
main>article .comente .center:before{content: ""; display: block; clear: both;}
main>article .comente .cancel-comment-reply{padding-bottom: 20px;}
main>article .share{margin-top: 55px;}
main>article .share>*{vertical-align: middle; display: inline-block;}
main>article .share .psl_frase{padding-right: 10px;}
main>article .share a.psl_share{width: 50px; height: 50px; margin: 7px 10px 7px 0; border-radius: 50%; background-color: #FFF;}
main>article .share a.psl_share svg{width: 35px; height: 35px; -webkit-filter: none; filter: none; margin-top: 6.5px; margin-left: 6.5px;}
main>article .share a.psl_share svg *{stroke: #000;}

.oneall_social_login_providers{overflow: hidden;}

.syntaxhighlighter{padding: 5px 0;}

.likes>* {vertical-align: top;}

main>article .commentlist, main>article .commentlist ol, main>article .commentlist ul{list-style: none !important;}
main>article .commentlist li{margin-left: 0 !important; padding-left: 0 !important; margin-bottom: 30px !important;}
main>article .commentlist li article{padding-left: 70px; position: relative; line-height: 1.2em;}
main>article .commentlist li div.avatar{width: 60px; height: 60px; position: absolute; top: 0; left: 0; overflow: hidden; text-align: center; border-radius: 50%;}
main>article .commentlist article:target div.avatar{top: 90px;}
body.customize-support main>article .commentlist article:target div.avatar, body.user-loggedin main>article .commentlist article:target div.avatar{top: 120px;}
main>article .commentlist li div.avatar img{width: auto; height: 100%;}
main>article .commentlist li li, main>article .commentlist ol ol, main>article .commentlist ol ul, main>article .commentlist ul, main>article .commentlist ol{padding-left: 30px !important;}
main>article .commentlist li .comentario_txt em.mod{color: #666 !important;}
main>article .commentlist .authcomment div.avatar{border: 3px solid #FFF; box-shadow: 0 7px 10px rgba(0,0,0,0.5);}

#oa_social_login_modal, #oa_social_login_modal *{font-family: 'Rubik', sans-serif !important;}
#oa_social_login_modal{margin-left: 0 !important; top: 50% !important; transform: translate(-50%,-50%) !important;}
.oa_social_login_modal_outer{background-color: #313339 !important;}
.oa_social_login_modal_title{background-color: #313339 !important; border-bottom: 0 !important; text-indent: -9999px; position: relative;}
.oa_social_login_modal_title strong{position: absolute; text-indent: 0; line-height: initial; left: 284px; top: 2px;}
.oa_social_login_modal_title:after{content: "Aeee! Voc\00EA\0020 conseguiu se logar com o "; display: inline-block; text-indent: 0; line-height: initial; position: absolute; top: 2px; left: 4px;}
.oa_social_login_modal_inner{background-color: #000 !important;}
.oa_social_login_modal_notice{background-color: #313339 !important; border: 0 !important; margin: 15px 15px 0 15px;}
.oa_social_login_modal_inner input.oa_social_login_confirm_text{width: 100% !important;}
.oa_social_login_modal_subtitle{text-indent: -9999px; position: relative;}
.oa_social_login_modal_subtitle:after{content: "Por favor, insira seu e-mail:"; display: block; text-indent: 0; position: absolute; top: 0; left: 0; line-height: initial;}
#oa_social_login_button_cancel{text-indent: -9999px; display: inline-block; position: relative; min-width: 170px;}
#oa_social_login_button_cancel:after{content: "N\00E3o curti, cancela!"; display: inline-block; text-indent: 0; line-height: initial; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%;}
#oa_social_login_button_confirm{margin-bottom: 12px !important;}

body:not(#home) main>article header{margin-bottom: 30px;}
body:not(#home) main#termos>article header{margin-bottom: 15px;}
body:not(#home) main>article a{font-weight: 500;}
body:not(#home) main>article p,
body:not(#home) main>article p *,
body:not(#home) main>article blockquote,
body:not(#home) main>article li{line-height: 1.5em;}

body#page main h1{margin: 0 0 35px 0 !important;}
body#page main h1, body#termo main h1, body#post main>article h2, body#search main>article h2{margin: 35px 0; font-size: 30px; padding-bottom: 5px; position: relative;}
body#page main h2, body#termo main h2{position: relative; padding-bottom: 3px;}
body#archive main h1.is_cat{text-align: center; font-size: 30px;}
body#page main h1:after, body#termo main h1:after, body#page main#termos header>h2:after, body#page main:not(#termos) h2:after, body#termo main h2:after, body#post main h2:after{content: ""; display: block; position: absolute; bottom: 0; height: 1px; width: 100%; background: #808080;
background: -moz-linear-gradient(left, #808080 0%, #313339 50%);
background: -webkit-linear-gradient(left, #808080 0%,#313339 50%);
background: linear-gradient(to right, #808080 0%,#313339 50%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#808080', endColorstr='#313339',GradientType=1 );}
body#home main>article h2:after, body#archive main>article h2:after, body#page main#termos>article>h2:after{display: none;}
body#page main h2, body#termo main h2, body:not(#home) main>article h3{margin: 25px 0 20px 0; font-size: 22px;}
body main#termos>article header h2{margin: 25px 0 15px 0;}
body#page main h3, body#termo main h3, body:not(#home) main>article h4{margin: 25px 0 20px 0; font-size: 20px;}
body#page main h4, body#termo main h4, body:not(#home) main>article h5{margin: 25px 0 0 0; font-size: 18px;}
body#page main h5, body#termo main h5, body:not(#home) main>article h6{margin: 25px 0 0 0; font-size: 16px;}
body#page main h6, body#termo main h6{margin: 20px 0 0 0; font-size: 16px;}

body:not(#home) main h5 + p,
body:not(#home) main h6 + p{margin-top: 0.4em;}
body:not(#home) main blockquote{margin: 45px 0; padding: 0 80px; position: relative; font-style: italic; color: #FFF;}
body:not(#home) main blockquote:before,
body:not(#home) main blockquote:after{content: ""; display: block; position: absolute; width: 68px; height: 62px; background-image: url(images/blockquote.png); background-repeat: no-repeat; background-size: cover;}
body:not(#home) main blockquote:before{top: 0; left: 0;}
body:not(#home) main blockquote:after{bottom: 0; right: 0; transform: rotate(180deg);}

body:not(#home) main ul{list-style: disc;}
body:not(#home) main ul li{margin-bottom: 10px; margin-left: 20px; padding-left: 8px;}
body:not(#home) main ol{list-style: decimal-leading-zero;}
body:not(#home) main ol li{margin-bottom: 10px; margin-left: 30px; padding-left: 12px;}

#page main a, #page main a *,
#post main>article a, #post main>article a *,
#termo main>article a, #termo main>article a *{color: #c3dce0 !important; font-weight: 500;}
#page main strong, #post main>article strong{font-weight: 500; color: #FFF;}

main>article footer{padding-top: 20px;}
main>article footer p.tags svg{vertical-align: middle;}
#termo main>article footer {padding-top: 60px;}

@media screen and (min-width: 1136px) and (max-width: 1390px), screen and (max-width: 890px){
	main>article .comente .comment_form_left{float: none; padding-right: 0; width: 100%;}
	main>article .comente .comment_form_right{float: none; padding-left: 0; width: 100%;}
}
@media screen and (max-width: 1135px){
	.column{width: 100%; margin-right: 0; margin-bottom: 25px;}
}
@media screen and (max-width: 820px){
	#home main>article,
	#archive main:not(#termos)>article,
	#search main>article.post{padding-left: 50%; min-height: 195px;}
	#home main>article .post_thumb,
	#archive main:not(#termos)>article .post_thumb,
	#search main>article.post .post_thumb{width: 50%; height: 205px;}
	#home main>article:hover .post_thumb .post_thumb_img,
	#archive main:not(#termos)>article.post .post_thumb .post_thumb_img,
	#search main>article.post .post_thumb .post_thumb_img{width: 110%; height: 110%;}
	#home main>article .post_categ,
	#archive main:not(#termos)>article.post .post_categ,
	#search main>article.post .post_categ{width: 130px; height: 130px;}
	#home main>article .post_categ svg,
	#archive main:not(#termos)>article .post_categ svg,
	#search main>article.post .post_categ svg{transform: scale(0.8); top: 0; right: 0;}
}
@media screen and (max-width: 782px){
	main>article .commentlist article:target div.avatar{top: 104px;}
	body.customize-support main>article .commentlist article:target div.avatar, body.user-loggedin main>article .commentlist article:target div.avatar{top: 134px;}
}
@media screen and (max-width: 728px){
	body.notouch .column>.ad{display: none;}
}
@media screen and (max-width: 600px){
	main>article .commentlist article:target div.avatar{top: 90px !important;}
}
@media screen and (max-width: 540px){
	#home main>article,
	#archive main:not(#termos)>article,
	#search main>article.post{padding-left: 0; padding-top: 205px; min-height: 100px; margin-bottom: 60px;}
	#home main>article .post_thumb,
	#archive main:not(#termos)>article .post_thumb,
	#search main>article.post .post_thumb{width: calc(100% + 40px); height: 205px;}

	#search main>article.post .post_thumb{top: 0;}

	body:not(#home) main>article blockquote{padding: 0 48px;}
	body:not(#home) main>article blockquote:before,
	body:not(#home) main>article blockquote:after{width: 38px; height: 35px;}

	main>article .commentlist li li, main>article .commentlist ol ol, main>article .commentlist ol ul, main>article .commentlist ul, main>article .commentlist ol{padding-left: 15px !important;}
	main>article .commentlist li article{padding-left: 40px;}
	main>article .commentlist li div.avatar{width: 30px; height: 30px;}
}

/*------------------------ Sidebar */

#sidebar{width: 365px; order: 3; padding: 20px; display: flex; align-items: flex-start; flex-flow: column wrap;}
#sidebar aside{margin-bottom: 40px; width: 100%;}
#sidebar aside:last-child{margin-bottom: 0;}
#sidebar aside h2{text-align: center; margin-bottom: 15px; font-size: 22px;}
#sidebar aside iframe{position: relative; left: 50%; transform: translateX(-50%);}

#sidebar #about_me .social{font-weight: 500;}
#sidebar #about_me .social ul{margin-top: 10px;}
#sidebar #about_me .social li{display: inline-block;}

#sidebar .post_popular{display: table; width: 100%; margin-bottom: 10px;}
#sidebar .post_popular a{display: table-cell; min-height: 50px; vertical-align: middle; color: #bbbbbb; transition: color .5s;}
#sidebar .post_popular a:hover{color: #FFFFFF;}
#sidebar .post_popular a:first-child{width: 70px;}
#sidebar .post_popular a:last-child{width: calc(100% - 80px); padding-left: 10px;}
#sidebar .post_popular a img{width: 100%; height: auto;}

#sidebar .paypal-donations{line-height: 0;}
#sidebar .paypal-donations img{max-width: 0 !important; width: auto !important; height: auto !important;}
#sidebar .paypal-donations input[type='image']{width: auto !important; height: auto !important; margin-bottom: 0 !important; margin-left: auto; margin-right: auto; display: block; border: 0 !important;}

#sidebar #adsense{text-align: center;}
#sidebar #adsense iframe{position: static; left: 0 !important; transform: none !important;}

#sidebar #tags li{display: inline-block; margin-bottom: 13px; margin-right: 8px;}
#sidebar #tags .button{min-width: 20px; line-height: 1em; padding: 5px;}

#sidebar #oa_social_login_widget .oneall_social_login_label{display: none;}

#subscribe-email *, #subscribe-submit *{margin-bottom: 0;}
#subscribe-email input{width: 100% !important;}
#subscribe-submit input{height: 35px; font-size: 16px; width: auto; margin: 0 auto; display: inherit;}

@media screen and (max-width: 1135px){
	#sidebar{width: 100%; flex-flow: row wrap; justify-content: flex-start; align-content: flex-start;}
	#sidebar aside{width: 50%;}
	#sidebar aside:nth-child(odd){padding-right: 10px;}
	#sidebar aside:nth-child(even){padding-left: 10px;}
}
@media screen and (max-width: 730px){
	#sidebar aside{width: 100%;}
	#sidebar aside:nth-child(odd){padding-right: 0;}
	#sidebar aside:nth-child(even){padding-left: 0;}
}
@media screen and (max-width: 350px){
	#playlist iframe{width: 300px; height: 300px;}
}

/*------------------------ Footer */

body>footer{min-height: 175px; display: flex; justify-content: center; font-size: 15px; padding: 40px 0;}
body>footer nav{margin: 25px 0;}
body>footer nav:first-child{margin-top: 12px !important;}
body>footer li{display: inline-block; font-weight: 500; margin-right: 15px;}
body>footer #left_area{width: calc(1440px - 365px); padding: 0 20px;}
body>footer .social{width: 365px; padding: 0 20px; text-align: right;}
body>footer .social ul{position: relative; top: 50%; transform: translateY(-50%);}
body>footer .social li{margin-right: 0;}

@media screen and (max-width: 1440px){
	body>footer #left_area{width: calc(100% - 365px);}
}
@media screen and (max-width: 768px){
	body>footer{flex-direction: column;}
	body>footer #left_area{width: 100%;}
	body>footer .social{width: 100%; text-align: left; margin-top: 5px;}
	body>footer .social ul{position: static; top: auto; transform: none;}
}