/* reset rafael monroe */
* { margin: 0px; padding: 0px; border: 0px; font-weight: normal; font-size: 100%; list-style: none; line-height: 1; outline: 0px; background: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; }

/* global class */
.block { position: relative; float: left; width: 100%; height: auto; }
.container { display: block; width: 1260px; height: auto; margin: 0px auto; }

/* base */
a { text-decoration: none; transition: all .5s ease; }
body { background-color: #eee; font: normal 16px 'Source Sans Pro', sans-serif; }
body.single { background-color: #fff; }
input, textarea, select, button { font: normal 16px 'Source Sans Pro', sans-serif; }

/* var */
:root { --blue: #037fdd; --gray: #555; }

/* header */
#header { position: fixed; z-index: 1000; top: 50px; left: 0px; width: 100%; height: 66px; transition: all .5s ease; }
#header h1 { float: left; width: 160px; height: 50px; background: transparent url('../img/header-logo.png') no-repeat; background-size: contain; text-indent: -9999em; transition: all .5s ease; }
#header h1 a { display: block; width: 100%; height: 100%; }
#header nav { float: right; width: auto; margin-top: 6px; transition: all .5s ease; }
#header nav ul { float: left; width: auto; margin: 10px 50px 0px 0px; }
#header nav ul li { float: left; width: auto; margin-left: 30px; }
#header nav ul li a { display: block; width: auto; color: #fff; font-weight: 600; }
#header nav ul li a:hover { color: var(--blue); }
#header form { display: none; float: left; width: 200px; height: auto; margin-right: 20px; }
#header form input { float: left; width: 100%; height: 40px; padding: 0px 8px; border-radius: 5px; background-color: #fff; }
#header nav span { float: left; width: auto; }
#header nav span.bt a { display: inline-block; width: auto; padding: 10px 30px; background-color: var(--blue); font-weight: 600; color: #fff; border-radius: 100px; }
#header nav span.bt a i { display: inline-block; width: auto; margin-right: 10px; vertical-align: middle; }
#header nav span.bt a:hover { background-color: #fff; color: var(--blue); }
#header nav span.search { margin-top: 10px; }
#header nav span.search a { display: inline-block; width: auto; margin-right: 50px; color: #fff; font-size: 18px; }

    /* header -> menu */
    #header b { display: none; position: absolute; top: 10px; right: 20px; width: 20px; height: 30px; border-top: 2px solid #fff; cursor: pointer; transition: all .5s ease; }
    #header b::before { position: absolute; top: 4px; left: 0px; width: 100%; height: 2px; background-color: #fff; transition: all .5s ease; content: ''; }
    #header b::after { position: absolute; top: 10px; left: 0px; width: 100%; height: 2px; background-color: #fff; transition: all .5s ease; content: ''; }
    #header b.on { border-top: transparent; }
    #header b.on::before { top: 6px; transform: rotate(45deg); }
    #header b.on::after { top: 6px; transform: rotate(-45deg); }

    /* header -> on */
    #header.on { top: 0px; padding-top: 5px; background-color: #2f2e2e; backdrop-filter: saturate(150%) blur(15px); }
    #header.on h1 { width: 140px; height: 30px; margin-top: 10px; }
    #header.on nav { margin-top: 8px; }
    #header.on b  { top: 22px; }

/* feat */
#feat { position: relative; height: 450px; background-color: #323232; overflow: hidden; }
#feat::before { position: absolute; z-index: 2; top: 0px; left: 0px; width: 100%; height: 250px; background: linear-gradient(to bottom, #323232, 50%, transparent); content: ''; }
#feat figure { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-position: center center; background-size: cover; }
#feat figcaption { position: absolute; z-index: 20; bottom: 100px; left: 50%; width: 800px; height: auto; transform: translate(-50%, 0%); text-align: center; }
#feat figcaption small { display: block; margin-bottom: 10px; font-weight: 600; color: #fff; letter-spacing: 4px; text-transform: uppercase; }
#feat figcaption strong { display: block; font-weight: 800; font-size: 36px; color: #fff; line-height: 1.2; }
#feat figcaption em { display: block; margin-top: 20px; font-style: normal; letter-spacing: 2px; text-transform: uppercase; }
#feat figcaption em i { display: inline-block; margin-bottom: 10px; font-size: 18px; }
#feat figcaption em a { font-weight: 600; color: #fff; }
#feat figcaption p { display: block; margin-top: 15px; font-weight: 600; line-height: 1.8; color: #fff; }
#feat figcaption p a { font-weight: 600; color: #fff; text-decoration: underline; }

    /* feat -> int */
    #feat.int figure { opacity: .5; }
    #feat.int img { position: relative; z-index: 2; display: block; width: 100px; height: 100px; margin: 0px auto 20px auto; border-radius: 100%; }
    .single-loja #feat figcaption::before { position: absolute; top: 0px; left: 50%; width: 100px; height: 100px; margin-left: -50px; background-color: #fff; border-radius: 100%; content: ''; }

    /* feat -> cat */
    #feat.cat { height: 400px; }
    #feat.cat figure { opacity: 1; }

/* bar */
#bar { z-index: 2; margin: -40px 0px 80px 0px; text-align: center; }
#bar section { display: inline-block; width: 960px; height: 80px; background-color: #fff; border-radius: 200px; background-color: #fff; box-shadow: 0px 8px 98px 0px rgba(5, 126, 218, .13); text-align: left; overflow: hidden; }
#bar section label { position: relative; float: left; width: auto; height: 80px; }
#bar section label.lb1 { width: 85%; }
/* #bar section label.lb1::after { position: absolute; top: 20%; right: 20px; width: 1px; height: 60%; background-color: #ddd; content: ''; } */
#bar section label.lb2 { width: 16%; padding: 30px 0px 0px 14px; }
#bar section label.lb3 { width: 15%; }
#bar section input.field_text { float: left; width: 100%; height: 80px; padding: 0px 50px 0px 100px; font-weight: 300; font-size: 16px; color: var(--gray); background: transparent url('../img/bar-search.png') no-repeat 40px center; background-size: 30px; }
#bar section input.field_radio { position: relative; display: inline-block; width: 20px; height: 20px; border: 2px solid var(--blue); border-radius: 100%; appearance: none; -webkit-appearance: none; vertical-align: middle; text-align: center; }
#bar section input.field_radio:checked { background-color: var(--blue); }
#bar section input.field_radio:checked::after { position: absolute; top: 3px; left: 3px; width: 10px; height: 10px; background-color: #fff; border-radius: 100%; content: ''; }
#bar section small { display: inline-block; width: auto; margin-left: 5px; vertical-align: middle; color: var(--blue); font-weight: 700; font-size: 12px; text-transform: uppercase; }
#bar section input.field_submit { float: left; width: 100%; height: 80px; background: var(--blue) url('../img/bar-submit.png') no-repeat 46% 48%; background-size: 30px; cursor: pointer; text-indent: -9999em; }

/* cupons */
#cupons { margin-top: 60px; }
#cupons header { margin-bottom: 120px; }
#cupons .cupons ul { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-auto-rows: minmax(280px, auto); grid-gap: 10px; }
#cupons .cupons ul li { position: relative; display: block; margin-bottom: 60px; background-color: #fff; border: 1px solid #eee; border-radius: 5px; transition: all .5s ease; }
#cupons .cupons ul li a { display: block; width: 100%; height: 100%; padding: 0px 40px; }
#cupons .cupons ul li figure { position: absolute; top: -50px; left: 50%; width: 100px; height: 100px; border-radius: 10px; background-color: #fff; background-repeat: no-repeat; background-position: center center; background-size: contain; transform: translateX(-50%); box-shadow: 0px 20px 20px rgba(0,0,0,.1); }
#cupons .cupons ul li strong { display: block; width: 100%; height: auto; margin-top: 80px; font-weight: bold; font-size: 18px; color: var(--blue); line-height: 1.4; }
#cupons .cupons ul li em { display: inline-block; width: auto; margin-top: 10px; padding: 5px 8px; border-radius: 20px; background-color: #999; color: #fff; letter-spacing: 2px; font-size: 12px; text-transform: uppercase; font-style: normal; font-weight: bold; }
#cupons .cupons ul li:hover { box-shadow: 0px 40px 40px rgba(0,0,0,.1); }
.code-cupom a { display: block; width: 400px; height: 80px; margin: 40px auto; background-color: #e9f6ff; border: 5px dotted var(--blue); color: var(--blue); text-align: center; border-radius: 20px; font-weight: bold; font-size: 24px; line-height: 66px; }

/* categorias */
#categorias { padding-bottom: 80px; }
#categorias li { text-align: center; }
#categorias li img { display: block; width: 90px; height: auto; margin: 0px auto; }
#categorias li strong { display: block; margin-top: 20px; color: var(--blue); font-weight: 800; text-transform: uppercase; letter-spacing: 2px; }

/* head block */
.head { margin-bottom: 20px; }
.head strong { display: block; margin-bottom: 40px; font-weight: 700; color: var(--blue); font-size: 16px; text-align: center; text-transform: uppercase; letter-spacing: 4px; }
/* .head strong::before { display: block; width: 3px; height: 40px; margin: 0px auto 50px auto; background-color: var(--blue); content: ''; } */

/* posts */
.posts { margin-bottom: 60px;}
.posts ul li { padding: 0px 5px; text-align: center; }
.posts ul li figure { position: relative; display: block; width: 100%; height: 200px; background-color: #fff; border-radius: 10px; overflow: hidden; }
.posts ul li figure img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.posts ul li figure sup { position: absolute; top: 20px; right: 20px; width: 50px; height: 50px; background-color: var(--blue); color: #fff; font-weight: 800; font-size: 16px; text-align: center; border-radius: 100%; line-height: 50px; }
.posts ul li strong { display: block; min-height: 70px; margin: 30px 0px; padding: 0px 10px; font-weight: 600; color: var(--gray); line-height: 1.6; }
.posts ul li span { display: inline-block; width: auto; padding: 10px 60px; background-color: #fff; font-weight: 800; font-size: 13px; color: var(--gray); text-transform: uppercase; letter-spacing: 1px; border-radius: 100px; transition: all .5s ease; }
.posts ul li:hover span { background-color: var(--blue); color: #fff; }
.posts .slick-dots { display: block; margin-top: 30px; text-align: center; }
.posts .slick-dots li { display: inline-block; width: 14px; height: 14px; margin: 0px 5px; border: 2px solid var(--blue); background-color: transparent; border-radius: 100%; text-indent: -9999em; cursor: pointer; transition: all .5s ease; }
.posts .slick-dots li.slick-active { width: 24px; background-color: var(--blue); border-radius: 10px; }

    /* posts -> int */
    .posts.int ul li { display: inline-block; width: 23%; margin-bottom: 80px; vertical-align: top; }

    /* posts -> related */
    .posts .related { padding: 0px 150px; }
    .posts .related li { padding: 0px 10px; }
    .posts .related li figure { height: 160px; }
    .posts .related li figure img { object-fit: contain; }
    .posts .related .slick-dots li { padding: 0px; }

    /* posts -> logo */
    .posts-logo ul li figure, .page-id-39 ul li figure { width: 200px; margin: 0px auto; border-radius: 100%; overflow: visible; }
    .posts-logo ul li figure img, .page-id-39 ul li figure img { width: 200px; height: 200px; border-radius: 100%; object-fit: contain; }
    .posts-logo ul li figure sup, .page-id-39 ul li figure sup { top: 0px; right: 0px; }

/* post */
#post { margin-top: -120px; padding-top: 80px; background-color: #fff; }
#post section { float: left; width: 100%; height: auto; margin-bottom: 80px; padding: 0px 150px; }
#post section p { display: block; width: auto; margin-bottom: 16px; font-weight: 500; font-size: 18px; line-height: 1.6; color: var(--gray); }
#post section a { font-weight: 600; color: var(--blue); }
#post section strong { font-weight: 700; }
#post section em { font-weight: 500; }
#post section h1, #post section h2, #post section h3, #post section h4, #post section h5, #post section h6 { display: block; margin: 30px 0px; color: var(--blue); }
#post section h1 { font-weight: 800; font-size: 36px; }
#post section h2 { font-weight: 700; font-size: 30px; }
#post section h3 { font-weight: 700; font-size: 28px; }
#post section h4 { font-weight: 600; font-size: 24px; }
#post section h5 { font-weight: 600; font-size: 22px; }
#post section h6 { font-weight: 600; font-size: 20px; }
#post section ul, #post section ol { display: inline-block; width: 100%; margin: 15px 0px 20px 0px; }
#post section ul li, #post section ol li { position: relative; display: block; margin-bottom: 6px; padding-left: 60px; color: var(--gray); font-weight: 600; font-size: 18px; line-height: 1.6; }
#post section ul li::before, #post section ol li::before { position: absolute; top: 50%; left: 30px; width: 6px; height: 6px; background-color: var(--blue); border-radius: 100%; transform: translate(0%, -50%); content: ''; }
#post section img { max-width: 100%; height: auto; }
#post section img.alignleft { float: left; width: auto; margin: 0px 20px 20px 0px; }
#post section img.alignright { float: left; width: auto; margin: 0px 0px 20px 20px; }
#post section img.aligncenter { display: block; width: auto; margin: 20px auto; }
#post .wp-caption { width: 100% !important; margin-bottom: 30px; padding: 20px; background-color: #eee; border-radius: 10px; }
#post .wp-caption img { display: block; margin: 0px auto 15px auto; border-radius: 10px; }
#post .wp-caption p { display: block; text-align: center; margin-bottom: 0px; letter-spacing: 2px; font-weight: 700; font-size: 12px; text-transform: uppercase; }

/* compartilhar */
#compartilhar { z-index: 2; margin-bottom: 120px; text-align: center; }
#compartilhar small { display: block; margin-bottom: 20px; font-weight: 700; font-size: 12px; letter-spacing: 2px; color: var(--gray); text-transform: uppercase; }
#compartilhar ul li { display: inline-block; margin: 0px 20px; font-size: 20px; vertical-align: middle; }
#compartilhar ul li a { display: block; width: 40px; height: 40px; color: var(--blue); border: 2px solid var(--blue); line-height: 36px; border-radius: 100%; }
#compartilhar ul li a:hover { background-color: var(--blue); color: #fff; }

/* comentarios */
#comentarios { margin-bottom: 60px; }
#comentarios #disqus_thread { display: block; width: 960px; margin: 0px auto; }
#comentarios .fb-comments { display: block; width: 960px; margin: 0px auto; }

/* contato */
#form form { float: left; width: 100%; height: auto; margin-top: 80px; padding: 0px 130px; }
#form form label { display: inline-block; width: 49%; height: auto; margin-bottom: 40px; padding-right: 20px; }
#form form label.lb100 { width: 98%; }
#form form label strong { display: block; width: auto; margin-bottom: 10px; font-weight: 700; font-size: 12px; text-transform: uppercase; color: var(--blue); }
#form form label input.field_text { display: block; width: 100%; height: 50px; padding: 0px 20px; background-color: #fff; border-radius: 5px; color: var(--gray); box-shadow: 0px 8px 98px 0px rgba(5, 126, 218, .13); }
#form form label textarea { display: block; width: 100%; height: 200px; padding: 20px; background-color: #fff; border-radius: 5px; color: var(--gray); box-shadow: 0px 8px 98px 0px rgba(5, 126, 218, .13); }
#form form label input.field_submit { display: inline-block; width: auto; padding: 20px 60px; background-color: var(--blue); color: #fff; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; border-radius: 5px; cursor: pointer; }

/* newsletter */
#newsletter { margin: 80px 0px; text-align: center; }
#newsletter section { position: relative; display: inline-block; width: 1000px; height: auto; padding: 40px; background-color: #fff; box-shadow: 0px 8px 98px 0px rgba(5, 126, 218, .13); text-align: left; border-radius: 20px; }
#newsletter section strong { display: block; width: 50%; margin-bottom: 20px; font-weight: 900; font-size: 24px; color: var(--blue); }
#newsletter section p { display: block; width: 50%; font-size: 18px; line-height: 1.4; color: var(--gray); }
#newsletter section input { float: right; width: 42%; height: 50px; margin-top: -60px; padding: 0px 20px; background-color: #eee; border-radius: 100px; }

/* cta */
#cta { height: 450px; margin-bottom: -100px; background-color: var(--blue); }
#cta figure { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-attachment: fixed; background-size: cover; mix-blend-mode: soft-light; }
#cta figcaption { position: absolute; z-index: 2; top: 50%; left: 50%; width: 600px; height: auto; transform: translate(-50%, -50%); text-align: center; }
#cta figcaption small { display: block; margin-bottom: 10px; font-weight: 700; color: #fff; letter-spacing: 4px; text-transform: uppercase; }
#cta figcaption strong { display: block; font-weight: 800; font-size: 40px; color: #fff; line-height: 1.2; }
#cta figcaption span a { display: inline-block; width: auto; margin-top: 30px; padding: 15px 60px; border: 2px solid #fff; color: #fff; font-weight: 700; text-transform: uppercase; border-radius: 100px; }
#cta figcaption span a:hover { background-color: #fff; color: var(--blue); }

/* footer */
#footer { margin-top: 100px; padding: 80px 0px; background: linear-gradient(to bottom, #2f2e2e, #666); }
#footer .column { float: left; width: auto; height: auto; }
#footer .column:nth-child(1) { width: 30%; }
#footer .column:nth-child(2) { width: 20%; }
#footer .column:last-child { width: 50%; }
#footer .column p { float: left; width: 100%; height: auto; color: #fff; font-weight: 600; }
#footer .column .social { margin: 40px 0px; }
#footer .column .social li { float: left; width: auto; margin-right: 20px; font-size: 16px; text-align: center; }
#footer .column .social li a { display: inline-block; width: 40px; height: 40px; border: 2px solid #fff; border-radius: 100%; color: #fff; line-height: 38px; }
#footer .column .social li a:hover { background-color: #fff; color: var(--blue); }
#footer .column nav { float: left; width: 100%; height: auto; }
#footer .column nav strong { float: left; width: 100%; height: auto; margin-bottom: 40px; text-transform: uppercase; font-weight: 600; color: #fff; }
#footer .column .links li { float: left; width: 100%; height: auto; margin-bottom: 20px; }
#footer .column .links li a { display: block; font-weight: 600; color: #fff; }
#footer .column .links li a:hover { text-decoration: underline; }
#footer .column .descontos li { display: inline-block; width: auto; margin: 0px 5px 10px 0px; }
#footer .column .descontos li a { display: inline-block; width: auto; padding: 8px 12px; font-weight: 600; background-color: rgba(255,255,255,.2); color: #fff; border-radius: 100px; }
#footer .column .descontos li a:hover { background-color: #fff; color: var(--blue); }

/* contact form 7 */
.wpcf7 br { display: none; }

/* #################################### responsive #################################### */

@media (max-width: 1260px){

    /* global class */
    .container { width: 100%; padding: 0px 20px; }

}

@media (max-width: 1080px){

    /* header */
    #header nav ul { margin-right: 20px; }
    #header nav ul li { margin-left: 15px; }
    #header nav span.search a { margin-right: 20px; }

    /* newsletter */
    #newsletter section { width: 100%; }

}

@media (max-width: 960px){

    /* header */
    #header nav { position: fixed; z-index: 1000; top: 0px; left: -250px; width: 250px; height: 100%; background-color: var(--gray); transition: all .5s ease; }
    #header nav span.search { display: none; }
    #header nav.on { left: 0px; margin-top: 0px; }
    #header nav.on ul { width: 100%; margin: 0px; padding: 40px 20px; }
    #header nav.on ul li { width: 100%; }
    #header nav.on ul li a { padding-bottom: 20px;  }
    #header nav.on span { position: absolute; bottom: 40px; left: 0px; width: 100%; text-align: center; }
    #header b { display: block; }

    /* feat */
    #feat figcaption { width: 100%; padding: 0px 20px; }

    /* bar */
    #bar { margin: -25px 0px 10px 0px; }
    #bar .container { padding: 0px 10px; }
    #bar section { width: 100%; height: 50px; }
    #bar section label { height: 50px; }
    #bar section label.lb1 { width: 100%; }
    #bar section label.lb1::after { display: none; }
    #bar section label.lb2 { display: none; }
    #bar section label.lb3 { display: none; width: 20%; }
    #bar section input.field_text { height: 50px; padding: 0px 20px 0px 40px; background-size: 15px; background-position: 20px center; }

    /* posts */
    .posts { text-align: center; }
    .posts.int ul li { width: 30%; }
    .posts .related  { padding: 0px; }

    /* post */
    #post section { padding: 0px; }

    /* comentarios */
    #comentarios #disqus_thread { width: 100%; }

}

@media (max-width: 880px){

    /* header */
    #header { top: 0px; padding-top: 5px; background-color: rgba(0,0,0,.5); backdrop-filter: saturate(150%) blur(15px); }
    #header h1 { width: 140px; height: 30px; margin-top: 10px; }
    #header nav { margin-top: 8px; }
    #header b  { top: 22px; }

    /* compartilhar */
    #compartilhar { margin-bottom: 70px; }

    /* posts */
    .posts .slick-dots li { width: 8px; height: 8px; padding: 0px; }

    /* cupons */
    #cupons .cupons ul { grid-template-columns: 1fr 1fr; }

    /* footer */
    #footer .column { width: 100% !important; text-align: center; }
    #footer .column:nth-child(2) { margin: 40px 0px; }
    #footer .column nav { text-align: center; }
    #footer .column .social li { float: none; display: inline-block; margin: 0px 10px; }
    
}

@media (max-width: 720px){

    /* feat */
    #feat { height: 260px; }
    #feat figcaption { bottom: 50px; }
    #feat figcaption small { font-size: 12px; letter-spacing: 0px; }
    #feat figcaption strong { font-size: 20px; }

    /* newsletter */
    #newsletter section strong { width: 100%; }
    #newsletter section p { width: 100%; }
    #newsletter section input { position: relative; right: 0px; display: block; width: 100%; margin-top: 20px; }

    /* cta */
    #cta figcaption { width: 100%; padding: 0px 20px; }
    #cta figcaption strong { font-size: 36px; }

}

@media (max-width: 660px){

    /* categorias */
    #categorias { padding-bottom: 20px; }
    #categorias li img { width: 50px; }
    #categorias li strong { margin-top: 0px; font-size: 12px; }
    
    /* compartilhar */
    #compartilhar ul li { margin: 0px 5px; }

    /* cupons */
    #cupons .cupons ul { grid-template-columns: 1fr; }

    /* posts */
    .posts.slide .head { display: none; }
    .posts ul li figure { height: 150px; }
    .posts.int ul li { width: 47%; }

}

@media (max-width: 460px){

    /* posts */
    .posts.int ul li { width: 100%; }

}