/*
Theme Name: H&P Papéis
Theme URI: http://www.i2w.com.br/
Author: i2w
Author URI: http://www.i2w.com.br/
Description: Tema desenvolvido exclusivamente para H&P Papéis.
Version: 1.0
License: Código por GNU General Public License v2, Design Comercial
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hppapeis
Tags: H&P Papéis

*/


/* fonts */
@font-face {
  font-family:Geogrotesque2;
  src:url(fonts/Geogtq-Rg.otf);
}
@font-face {
  font-family:Geogrotesque2;
  src:url(fonts/Geogtq-Bd.otf);
  font-weight: bold;
}
@font-face {
  font-family:Geogrotesque2;
  src:url(fonts/Geog-RgIt.otf);
  font-style: italic;
}
@font-face {
  font-family:Geogrotesque2;
  src:url(fonts/Geog-BdIt.otf);
  font-weight: bold;
  font-style: italic;
}

/* geral */

* { box-sizing: border-box; }
body {
  font-family: Geogrotesque2, sans-serif;
  background: #f8f8fb;
  color: #1b1b1b;
}
article,main {
  display: block;
  line-height: 2;
}
button {
  border: 0;
  cursor: pointer;
}
img {
  max-width: 100%;
  height: auto;
}



/* formularios */
.form-control {
  background: transparent;
  border-color: #333;
  color: #333;
}
.form-control:focus {
  border-color: #1f262d;
  box-shadow: 0 0 0 .2rem rgba(20, 36, 53, 0.3);
}
#searchsubmit {
  padding: 5px;
  border-radius: 0;
  line-height: 28px;
  background: transparent;
  border: 0;
  color: #333;
  font-size: 25px;
  box-shadow: unset;
}

/* botoes */
.btn {
  cursor: pointer;
  border-radius: 30px;
  padding: .375em 3em;
  letter-spacing: 2px;
  box-shadow: 7px 7px 26px -8px rgba(0,0,0,0.7);
  line-height: 2em;
}
a.btn:hover {
  text-decoration: none;
}
.btn-primary, .btn-dark, .btn-preto,
a.btn-primary, a.btn-dark, a.btn-preto {
  color: #FFF;
  background: #000;
  border-color: #000
}
.btn-branco {
  color: #333;
  background: #FFF;
  border-color: #FFF
}
.btm.branco.vermelho, .btn-light.vermelho {
  color: #bd3737
}
.btn-verde, .btn-success {
  color: #FFF;
  background: #00827f;
  border-color: #00827f
}
.btn-vinho, .btn-vermelho, .btn-danger {
  color: #FFF;
  background: #bd3737;
  border-color: #bd3737
}

.btn-primary:hover, .btn-dark:hover, .btn-preto:hover,
a.btn-primary:hover, a.btn-dark:hover, a.btn-preto:hover {
  color: #FFF;
  background: #333;
  border-color: #333
}
.btn-branco:hover,
a.btn-branco:hover {
  color: #333;
  background: #fafafa;
  border-color: #fafafa
}
.btn-verde:hover, .btn-success:hover,
a.btn-verde:hover, a.btn-success:hover {
  color: #FFF;
  background: #0a9a97;
  border-color: #0a9a97
}
.btn-vinho:hover, .btn-vermelho:hover, .btn-danger:hover,
a.btn-vinho:hover, a.btn-vermelho:hover, a.btn-danger:hover {
  color: #FFF;
  background: #9c3c3a;
  border-color: #9c3c3a
}

.full-width-bg {
  background-position: top center;
  background-repeat: no-repeat;
  background-color: transparent;
  margin-top: -1px;
}
.wpcf7-submit {
    margin: 0 auto;
    display: block;
}s

/* Fix for container within navbar on small viewports, for Firefox and Chrome.
This may but be necessary when Bootstrap 4 is improved after alpha. */

@media (max-width: 575px) {
  .navbar > .container {
    position: static;
    width: 100%;
  }
}

/* Max content widths */

.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
  max-width: 100%;
  height: auto
}


/* header */
#masthead {
  padding: 20px 0 10px;
  background: #f8f8fb;
}

.site-title img {
    transition: all 0.5s;
    width: 140px;
}
.site-title img.rolling {
    width: 60px;
    margin-top: 1rem;
}
@media (max-width: 991px) {
  .site-title {
    margin-left: auto;
    margin-right: auto;
  }
}
.solicitar-ligacao {
  display: block;
  text-transform: uppercase;
  background: url(images/call.png) no-repeat 10px center #15817e;
  color: #FFF;
  padding: 10px 10px 10px 46px;
  border-radius: 10px;
  text-align: center;
  letter-spacing: normal;
  line-height: 1.2;
  box-shadow: unset;
}
.solicitar-ligacao:hover {
  color: #FFF;
  background-color: #148986;
  text-decoration: none;
}
.solicitar-ligacao strong, .solicitar-ligacao span {
  display: block;
}
.solicitar-ligacao span {
  font-size: 12px;
}
/* Navbar */
nav.navbar li a{
  text-transform: uppercase;
}
.navbar-topbar {
  border-radius: 0;
}

.navbar .dropdown-menu li {
  width: 100%;
  margin-left: 0 !important;
}

.navbar .dropdown-menu {
  margin-top: 0;
}

.navbar-light .navbar-nav .nav-link {
  color: rgba(0,0,0,0.6);
  font-weight: bold;
}
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255,255,255,0.9);
  font-weight: bold;
}
@media (min-width: 768px) {
  .navbar-expand-md .navbar-nav .nav-link,
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0.8rem;
    padding-left: 0.8rem;
  }

  #menu-menu-topo a.nav-link {
    position: relative;
  }
  #menu-menu-topo a.nav-link:after {
    content: '';
    border-bottom: 3px solid transparent;
    display: block;
    position: absolute;
    left: 0.8rem;
    right: 0.8rem;
    bottom: -1rem;
    transition: all 0.3s;
  }
  #menu-menu-topo a.nav-link:hover:after {
    border-bottom-color: inherit;
  }
}

/* slideshow */
.owl-carousel h1,
.owl-carousel h2,
.owl-carousel h3,
.owl-carousel h4,
.owl-carousel h5,
.owl-carousel h6 {
  letter-spacing: 3px;
}


/* Main content */

#content article.list {
  margin: 40px 0;
  background: #FFF;
  border-radius: 10px;
}
@media (max-width: 767px) {
   #content article.list {
    padding-left: 15px;
    padding-right: 15px;
   }
 } 
#content section {
  margin-bottom: 20px
}
#content footer {
  padding-bottom: 20px
}
.page-header {
  background: #f9f9f9 none repeat scroll 0 0;
  border-bottom: 1px solid #eee;
  margin: 40px 0 20px;
  padding: 10px 14px;
}

.post-list-title, .post-list-title a {
  color: #a33a3a;
  font-weight: bold;
}
.list-thumb img{
  border-radius: 10px;
}
a.more-link {
  color: #FFF;
  background: #000;
  display: block;
  clear: both;
  float: left;
  line-height: 37px;
  padding: 0 30px;
  border-radius: 20px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
a.more-link:hover {
  opacity: 0.8;
  text-decoration: none;
}


dt.gt3pg_gallery-icon img {
  border-radius: 1rem;
}



/* Sidebar */

.sidebar {
  margin-top: 20px
}
.sidebar section {
  margin-bottom: 3rem;
  clear: both;
  overflow: hidden;
}
.sidebar section > h4 {
  font-weight: bold;
  text-transform: uppercase;
}
.sidebar ul,
.sidebar ol {
  list-style-type: none;
  padding: 0
}
.sidebar li {
  margin: 10px 0
}
.widget_tag_cloud > h4,
.widget_categories > h4 {
  color: #bd3737;
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
  position: relative;
}
.widget_tag_cloud > h4:after,
.widget_categories > h4:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 3rem;
  border-bottom: 3px solid;
}
.widget_tag_cloud a.tag-cloud-link,
.widget_categories .cat-item a {
  border: 1px solid;
  border-radius: 0.5rem;
  clear: left;
  color: #bd3737;
  float: left;
  font-size: 16px !important;
  margin-bottom: 1rem;
  padding: 0.3rem 2rem;
}
.widget_categories .cat-item a,
.widget_categories > h4 {
  color: #00827f;
}



/* Hide form placeholders on focus */
input:focus::-webkit-input-placeholder { color: transparent; }
input:focus:-moz-placeholder { color: transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color: transparent; } /* FF 19+ */
textarea:focus::-webkit-input-placeholder { color: transparent; }
textarea:focus:-moz-placeholder { color: transparent; } /* FF 4-18 */
textarea:focus::-moz-placeholder { color: transparent; } /* FF 19+ */ 

/* Comments */
#respond {
  margin-top: 40px
}
ol.commentlist {
  counter-reset: li; /* Initiate a counter */
  padding: 0
}
ol.commentlist ul {
  padding: 0
}
ol.commentlist > li {
  position: relative;
  margin: 0 0 20px 0;
  list-style: none /* Disable the normal item numbering */
}
ol.commentlist > li:before {
  content: "Thread " counter(li); /* Use the counter as content */
  counter-increment: li; /* Increment the counter by 1 */
  position:absolute;  
  top: 0;
  right: 0;
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
  border-bottom-left-radius: 4px;
  padding: 5px 20px 5px 10px;
  color: #999
}
ol.commentlist li ol,
ol.commentlist li ul {
  list-style-type: none;
  margin: 0
}

.commentlist li li {
  background: #f9f9f9;
}
.commentlist li li li {
  background: #fff
}
.commentlist li li li li {
  background: #f9f9f9
}
.commentlist li li li li li li {
  background: #fff
}
.commentlist li {
  padding: 20px
}
.commentlist ul li {
  margin-top: 20px;
  margin-bottom: 0
}
.reply p {
  margin: 0
}

/* conteudo */
.single-entry-header {
  background: no-repeat center #333;
  background-size: 100% auto;
}
.single-entry-header .title-background {

  text-align: center;
  color: #FFF;
  background-color: rgba(0,0,0,0.7);
  text-align: center;
  text-transform: uppercase;
}
.single-entry-header .title-background .container {
  padding-top: 30px;
  padding-bottom: 30px;
  position: relative;
}

.single-entry-header button,
.single-entry-header a {
  background: transparent;
  color: #FFF;
  text-shadow: 1px 1px #000;
  font-weight: bold;
  display: none;
}
.single-entry-header #header-voltar {
  top: 1em;
  left: 0;
}
.single-entry-header #header-compartilhar {
  top: 1em;
  right: 0;
}
.single-entry-header time {
  top: 1em;
  left: 50%;
  transform: translateX(-50%);
  display: none;
}
@media screen and (min-width: 770px) {
  .single-entry-header .title-background .container{
    padding-top: 7em;
    padding-bottom: 7em;
  }
  .single-entry-header .title-background h1 {
    letter-spacing: 0.2em;
  }
  .single-entry-header button,
  .single-entry-header a,
  .single-entry-header time {
    display: block;
  }
}

.alignleft {
  float: left;
}
.alignright {
  float: right;
}
.aligncenter {
  display: block;
  margin: 0 auto;
}

.recent-post-content, 
.list-produto-content {
  padding-top: 30px;
  padding-bottom: 30px
}
h3.recent-post-title {
  text-align: center;
  padding: 20px 0;
}
h4.recent-post-title, 
h4.list-produto-title {
  text-align: center;
  padding: 20px;
  color: #a33a3a;
}
h4.list-produto-title {
  font-weight: bold;
}
h4.recent-post-title a {
  color: #333;
}
.recent-post, 
.list-produto {
  background: #FFF;
  border-radius: 15px;
  overflow: hidden;
  text-align: center;
  box-shadow: 3px 6px 31px rgba(0,0,0,0.2);
  position: relative;
}
.recent-post-title, 
.list-produto-title {
  padding: 5;
}
@media (min-width: 576px) {
  .recent-post, 
  .list-produto {
    margin: 10px;
    position: static;
  }
  .recent-post-title, 
  .list-produto-title {
    padding: 20px 20px 0;
  }
}
.recent-post-title a, {
  color: #333;
} 
.list-produto-title a {
  color: #a33a3a;
}
.recent-post-excerpt {
  padding: 0 20px 0;
}
a.recent-post-continue-read {
  color: #a33a3a;
  display: inline-block;
  font-weight: bold;
  margin-bottom: 20px;
}
a.recent-post-continue-read {
  color: #9c3c3a;
}

.list-produto-continue-read {
  background: #a33a3a;
  color: #FFF;
  display: block;
  position: absolute;
  font-weight: bold;
  left: 50%;
  transform: translateX(-50%);
  bottom: -7px;
  padding: 0;
  width: 100%
}
.list-produto-continue-read:hover {
  color: #FFF;
  text-transform: none;
  background: #b74b4b;
}
@media (min-width: 576px) {
  .list-produto-continue-read {
    border-radius: 30px;
    padding: 1px 40px;
    width: auto;
  }
}
.blog-background {
  background-image: url(images/blog-fundo.gif);
  background-attachment: fixed;
  margin: 0;
  padding: 2px 0 0;
}
.single-thumb img {
  display: block;
  border-radius: 10px;
  box-shadow: 10px 10px 20px -10px rgba(0,0,0,0.5);
}



.pagination {
  display: block;
  text-align: center;
}
.page-item {
  display: inline-block;

}
.page-item .current,
.page-link {
  position: relative;
  display: block;
  width: 2.4em;
  line-height: 2.4em;
  color: #a33a3a;
  background-color: transparent;
  border: 1px solid #a33a3a;
  font-weight: bold;
  margin: 0 5px;
  padding: 0;
}
.page-item .current {
  color: #FFF;
  background-color: #a33a3a;
}
.page-link:focus,
.page-link:hover {
  color: #a33a3a;
  text-decoration: none;
  background-color: #FFF;
  border-color: #000;
}

.page-item:last-child .page-link,
.page-item:first-child .page-link {
  border-radius: 50%;
}


/* shortcodes */
.um-pouco-sobre {
  text-align: center;
}
.um-pouco-sobre h2{
  text-align: center;
  color: #15817e;
}
.um-pouco-sobre hr{
  width: 100px;
  border-width: 5px;
  border-color: #15817e;
}
@media (min-width: 576px) {
  .um-pouco-sobre {
    text-align: left;
  }
  .um-pouco-sobre h2 {
    text-align: right;
  }
  .um-pouco-sobre hr {
    margin-right: 0;
  }
}

.conheca-nossos-produtos {
  text-align: center;
}
.conheca-nossos-produtos hr {
  width: 100px;
  border-width: 5px;
  border-color: #FFF;
}
@media (min-width: 576px) {
  .conheca-nossos-produtos {
    text-align: left;
  }
  .conheca-nossos-produtos hr {
    margin-left: 0;
  }
}


.deseja-receber > div {
  position: relative;
}
.deseja-receber img {
  margin-bottom: -10%
}
.deseja-receber .conteudo {
  text-align: center;
}
@media (min-width: 576px) {
  .deseja-receber .conteudo {
    text-align: left;
  }
}


/* footer */
#footer-contato {
  color: #FFF;
  padding-top: 6em;
  padding-bottom: 6em;
  background: url(images/footer-contato-bkg.jpg) no-repeat top center #333;
}
#footer-contato .conteudo {
  text-align: center;
  padding-bottom: 60px;
}
#footer-contato .conteudo p {
  color: #959595;
}
#footer-contato .conteudo button#open-fale-conosco {
  position:absolute;
  bottom:0;
  border: 0;
  left: 50%;
  transform: translateX(-50%);
}
#footer-contato .conteudo button#open-fale-conosco:hover {
  background-color: rgba(255,255,255,0.9);
}
#colophon {
  background: #15817e;
  color: #FFF;
}
#colophon > .container {
  padding-top: 37px;
  padding-bottom: 37px;
}
}#colophon a {
  color: #FFF;
}
#colophon .copyright {
  background: #065b59;
  text-align: center;
  font-size: 12px;
  line-height: 40px;
}

.site-footer ul,
.site-footer ol {
  list-style-type: none;
  padding: 0
}
.site-footer li {
  margin: 10px 0
}
.site-sub-footer p {
  text-align: center
}

.site-footer p {
  text-align: center
}

/* modal */
.modal-header button.close {
  background: transparent;
  box-shadow: unset;
  text-shadow: unset;
  color: #FFF;
  opacity: 0.9;
  padding: 1rem 0 1rem 1rem;
}
.modal-content {
  background: transparent;
  border: 0;
}
.modal-body {
  background: #fff;
}
.modal-body .form-control {
  border-color: #DDD;
}