* {box-sizing: border-box; margin: 0; padding: 0; font-family: Helvetica; text-decoration: none; transition: all .3s;}
::-webkit-scrollbar-track{background-color: #ede5da}::-webkit-scrollbar{width:1.2rem}::-webkit-scrollbar-thumb{background:#a7a7a7; border-radius: .2rem;} input[type=checkbox],#topo label {display: none;} .hide {opacity: 0; transform: translateY(-100%);} .fullFULL {position: absolute; width: 0; height: 0; visibility: hidden; opacity: 0; overflow: hidden;} .titPADR { font-size: 2.1rem; color: #1f1f1f;} .subtitPADR {font-size: 1.2rem; color: #373435; padding: .5rem 0;} .botPADR {position: relative; width: 10rem; background: #3157ad; padding: .6rem; text-align: center; font-size: 1rem; color: #fff; border-radius: .5rem;} .botPADR:hover {box-shadow:  0 0 .3rem #373435;} a {color: #1f1f1f;}

#full {background: #ede5da;}

#idx {position: relative; width: 100%; height: 100vh; background-position: 0 -7rem; background-repeat: no-repeat; background-size: 100%; background-image: url(../imgs/fundo/poetag-fulldynamic-01.webp);}
#topo {position: relative; width: 100%; top: 1.5rem; left: 0; display: grid; grid-template-areas: "navTOP"; place-content: center; grid-gap: 1rem; padding: .3rem; z-index: 3;} #topo nav a {color: #dfdfdf;} #topo nav a:hover {transform: scale(1.05);} #topo nav { display: grid; grid-gap: 2rem; place-content: center; grid-template-areas: "navTOP1 navTOP1 navTOP1 navTOP1";}   #topo nav a span {color: #dfdfdf}

#prin {position: relative; width: 100%; top: 3rem; margin: 0 auto; display: flex; place-content: center; place-items: center;} #txtPRIN {position: relative; width: 30%; display: grid; grid-gap: .5rem;}  #idtTOP {position: relative; width: 7rem; height: 7rem; background-image: url(../imgs/logo-poeta-g.webp); background-position: center; background-repeat: no-repeat; background-size: contain;} #imgPRIN {position: relative; width: 30rem; height: 27rem; background-position: center; background-repeat: no-repeat; background-size: 100%; background-image: url(../imgs/fundo/capa-davi-poetag-fulldynamic.webp);}

#dest {position: relative; width: 100%; height: 110vh; margin-top: 2rem; padding: 4rem 0; background-position: bottom; background-repeat: no-repeat; background-size: 100%; background-image: url(../imgs/fundo/poetag-fulldynamic-02.webp);} #dest .titPADR {text-align: center; color: #c7c7c7;} #dest .subtitPADR {color: #a7a7a7; text-align: center;} #exttDEST {position: relative; width: 80%; margin: 0 auto; display: flex; place-items: center; grid-gap: 2rem;} .blocDEST {position: relative; width: 30%;} .titDEST {position: relative; font-size: 1.4rem; color: #c7c7c7; font-weight: 600; padding: .5rem 0;} .descDEST {font-size: 1.1rem; margin: .5rem 0; color: #a7a7a7;} #imgDEST {position: relative; top: 3rem; width: 35rem; height: 22rem; background-position: center; background-repeat: no-repeat; background-size: 100%; background-image: url(../imgs/ebooks/ebook-destaque-poetag-fulldynamic.webp);} #dest .botPADR {top: 1.5rem;}

#sobr {position: relative; width: 85%; margin: 0 auto; padding: 4rem 0;} #exttSOBR {position: relative; display: flex; place-content: space-between;} .titSOBR {font-size: 1.4rem; color: #373435; font-weight: 600; margin-bottom: .7rem;} .descSOBR {font-size: 1.25rem; color: #373435; font-family: serif;} #txtSOBR {position: relative; width: 50%; margin: 3rem 0;}
#imgSOBR {position: relative; width: 21rem; height: 21rem; display: block; background-position: bottom; background-repeat: no-repeat; background-size: 100%; transform: rotateY(180deg); border: .1rem solid #a7a7a7; background-image: url(../imgs/davi-garcia-poetag.webp);}

#bnf {position: relative; width: 100%; height: 115vh; background-position: left; background-repeat: no-repeat; background-size: 100%; background-image: url(../imgs/fundo/poetag-fulldynamic-03.webp); display: grid; grid-gap: 4rem; place-content: center; padding-left: 10%;} #bnf .titPADR1 {color: #dfdfdf; width: 35%;} .titPADR2 {color: #3157ad; width: 35%;} .subtitPADR2 {color: #dfdfdf; font-size: 1.4rem;} .blocBNF {position: relative; width: 60%; left: 0; display: flex; grid-gap: 4rem; place-items: center;} .txtBNF {width: 60%;} .descBNF {color: #a7a7a7; font-size: 1rem;}

#ebook {position: relative; width: 90%; margin: 0 auto; padding: 4rem 0;} #ebook .titPADR {text-align: center;} #ebook .subtitPADR {text-align: center;} #exttEBOOK {position: relative; margin: 3rem auto; display: grid; grid-template-areas: "blocEBOOK blocEBOOK"; grid-gap: 3rem;} .blocEBOOK {position: relative; border: .1rem solid #c7c7c7; border-radius: .5rem; display: flex; background: #fff;} .blocEBOOK:hover {box-shadow: 0 0 .3rem #a7a7a7;} .imgEBOOK {position: relative; width: 60%; height: 15rem; background-position: center; background-repeat: no-repeat; background-size: contain;} .txtEBOOK {position: relative; width: 100%; padding: 1rem; display: grid; align-items: center;} .titEBOOK {font-size: 1.3rem; color: #3157ad; font-weight: 700;} .descEBOOK {font-size: 1.1rem; color: #373435;} .blocEBOOK:nth-child(1) .imgEBOOK {background-image: url(../imgs/ebooks/dicas-de-ouro-para-se-casar-depois-dos-40.webp);} .blocEBOOK:nth-child(2) .imgEBOOK {background-image: url(../imgs/ebooks/16-motivos-para-nao-usar-alcool-e-drogas.webp);} .blocEBOOK:nth-child(3) .imgEBOOK {background-image: url(../imgs/ebooks/de-volta-para-a-escola.webp); background-size: 65%;} .blocEBOOK:nth-child(4) .imgEBOOK {background-image: url(../imgs/ebooks/poemas-cristaos.webp); background-size: 70%;} .blocEBOOK:nth-child(5) .imgEBOOK {background-image: url(../imgs/ebooks/poemas-de-amor.webp); background-size: 75%;} .blocEBOOK:nth-child(6) .imgEBOOK {background-image: url(../imgs/ebooks/poemas-de-perdao.webp); background-size: 70%;}

#roda {position: relative; padding: 2rem 4rem 0 4rem; background: #fff;} #exttROD {display: flex; grid-gap: 4rem;} .titROD {font-size: 1.2rem; margin-bottom: 1.5rem; color: #3157ad; font-weight: 600;} .descROD {width: 100%; position: relative; font-size: 1.1rem; color: #373435;} .blocROD {position: relative; width: 70%; display: grid; border: .1rem solid #dfdfdf; padding: 2rem;} .blocROD a {margin: .15rem 0; padding: .3rem;} .blocROD a:hover {color: #3157ad;} .blocROD a::after {content: ''; position: absolute; width: .7rem; height: .7rem; border-radius: 50%; left: 1rem; background: #3157ad; opacity: .5;} .blocROD a:hover::after {opacity: 1;} #rdsROD {display: flex; grid-gap: 1rem;} #rdsROD a {font-size: 1.1rem; padding: .3rem; color: #3157ad;} #roda section:nth-child(3) a::after {display: none;} #dirROD {position: relative; margin: 2rem 0 0 0; padding: 2rem 0; border-top: .1rem solid #dfdfdf;}


@media screen and (min-width:990px) and (max-width:1100px) {*{font-size: .86rem;}}

@media screen and (min-width:1400px) {*{font-size: 1.1rem;}}

@media screen and (min-width:1500px) {*{font-size: 1.2rem;}}

@media screen and (min-width:1900px) {*{font-size: 1.4rem;}}
 
@media screen and (min-width:2200px) {*{font-size: 1.6rem;}}

@media screen and (min-width:300px) and (max-width:990px) { #rdsTOP {display: none;} 
#topo {grid-template-areas: "idtTOP navTOP"; align-items: center; margin: 0 auto;} 
#topo label {background: #3157ad; border-radius: 50%; position: absolute; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; right: 1rem; z-index: 1;} #topo label::after {content: ''; position: absolute; transition: all .3s; width: 60%; height: .3rem; border-radius: 1rem; margin-top: -.7rem; background: #fff;} #topo label::before {content: ''; transition: all .3s; position: absolute; width: 60%; height: .3rem; border-radius: 1rem; margin-top: .7rem; background: #fff;} 

#topo input:checked ~ label::after {transform: rotate(45deg); margin:0;} #topo input:checked ~ label::before {margin:0; transform: rotate(-45deg);}

#topo input:checked ~ nav {visibility: visible; padding-top: 4rem; top: -1.5rem; transform: translateX(0);}

#topo nav {position: absolute; visibility: hidden; transform: translateX(-100%); display: grid; width: 100%; background: #3157ad; padding: 1.5rem 0; grid-gap: 0; grid-template-areas: "navTOP1" "navTOP1" "navTOP1" "navTOP1";} #topo nav a {width: 99vw; text-align: center; font-size: .9rem; color: #3157ad; background: #fff; padding: .7rem; margin: .5rem 0;} #topo nav a span {color: #fff}

#prin {display: grid;} #txtPRIN {width: 90%; display: grid; grid-gap: .5rem;} #imgPRIN {position: relative; width: 90%; height: 20rem; background-size: 100%; margin-top: -35rem;} #prin .subtitPADR {padding-top: 20rem;}

#dest {height: auto; margin-top: 5rem; padding: 4rem 0; background-image: none; background-color: #011B3E;} #exttDEST {width: 90%; margin-top: 1rem; display: grid;} .blocDEST {position: relative; width: 100%; margin: 2rem auto;} #imgDEST {display: none;} .imgDEST {position: relative; width: 100%; height: 32rem; margin: .5rem auto; background-position: center; background-repeat: no-repeat; background-size: 100%; display: block;} .blocDEST:nth-child(1) .imgDEST {background-image: url(../imgs/ebooks/dicas-de-ouro-para-se-casar-depois-dos-40.webp);} .blocDEST:nth-child(3) .imgDEST {background-image: url(../imgs/ebooks/16-motivos-para-nao-usar-alcool-e-drogas.webp);}

#sobr {width: 90%;} #exttSOBR {display: grid; place-content: center;} #txtSOBR {position: relative; width: 100%; margin: 2rem 0;} #imgSOBR {width: 100; height: 21rem;}

#bnf {position: relative; width: 100%; height: auto; background-position: left; background-size: cover;grid-gap: 5rem; place-content: center; padding: 3rem 5%;} #bnf .titPADR1 {width: 100%;} .titPADR2 {width: 100%;} .blocBNF {position: relative; width: 100%; display: grid; grid-gap: .5rem; place-items: center;} .txtBNF {width: 100%;} .descBNF {color: #a7a7a7; font-size: 1rem;}

#exttEBOOK {grid-template-areas: "blocEBOOK"; grid-gap: 3rem;} .blocEBOOK {padding: 1rem 0; display: grid;} .imgEBOOK {position: relative; width: 100%;} .txtEBOOK {width: 100%; padding: 1rem; display: grid; grid-gap: 1rem;} .blocEBOOK:nth-child(3) .imgEBOOK {background-size: contain;} .blocEBOOK:nth-child(4) .imgEBOOK {background-size: contain;} .blocEBOOK:nth-child(5) .imgEBOOK {background-size: contain;} .blocEBOOK:nth-child(6) .imgEBOOK {background-size: contain;}

#roda {padding: 2rem 5% 0 5%;} #exttROD {display: grid; grid-gap: 2rem;} .blocROD {width: 100%;}

} 


@media screen and (min-width:400px) and (max-width:990px) {*{font-size: 1.05rem;}}

@media screen and (min-width:600px) and (max-width:990px) {*{font-size: 1.4rem;}}

@media screen and (min-width:900px) and (max-width:990px) {*{font-size: 1rem;}}
  
