/*--------------------------------------------------------------
* Fontes
--------------------------------------------------------------*/

@font-face{
  font-family: "Montserrat-ExtraBold";
  src: url('../fonts/montserrat/Montserrat-ExtraBold.ttf');
}

@font-face{
  font-family: "Montserrat-Bold";
  src: url('../fonts/montserrat/Montserrat-Bold.ttf');
}

@font-face{
  font-family: "Montserrat-SemiBold";
  src: url('../fonts/montserrat/Montserrat-SemiBold.ttf');
}

@font-face{
  font-family: "Montserrat-Medium";
  src: url('../fonts/montserrat/Montserrat-Medium.ttf');
}

@font-face{
  font-family: "Montserrat-Regular";
  src: url('../fonts/montserrat/Montserrat-Regular.ttf');
}

@font-face{
  font-family: "Montserrat-Light";
  src: url('../fonts/montserrat/Montserrat-Light.ttf');
}

/*--------------------------------------------------------------

/*--------------------------------------------------------------
# Geral
--------------------------------------------------------------*/

body {
    overflow-x: hidden;
    font-family: 'Montserrat-Bold';
}

.fadeIn_1 {
    animation: fadeIn_1 1s ease-in-out;
}
@keyframes fadeIn_1 {
0% { opacity: 0; }
100% { opacity: 1; }
}

.fadeIn_2 {
    animation: fadeIn_2 2s ease-in-out;
}
@keyframes fadeIn_2 {
0% { opacity: 0; }
100% { opacity: 1; }
}
.fadeIn_3 {
    animation: fadeIn_3 3s ease-in-out;
}
@keyframes fadeIn_3 {
0% { opacity: 0; }
100% { opacity: 1; }
}

.btns{
    z-index: 10!important;
    position: relative!important;
}


/*--------------------------------------------------------------


/*--------------------------------------------------------------
# Sessao01
--------------------------------------------------------------*/
#sessao01 {
  z-index: 5;
  width: 100.05%;
  /*height: 90vh;*/
  background: url("../img/s1/1BG.webp") bottom center;
  background-size: cover;
  position: relative;
}

.frase01{
    width: 90%;
    margin: 20px 5% 65px 5%;
}

#sessao01 p{
    font-family: "Montserrat-Bold", sans-serif;
    color: white;
    font-size: 1.1em;
    line-height:1.4;
    text-align: center;
    margin: 1vh auto 0vh auto;
}

.pc{
    display: none;
}

@media (min-width: 550px){
    #sessao01 {
        background: url("../img/s1/BG3-PC.webp") bottom center;
        background-size: cover;
        position: relative;
    }  
    .frase01{
        width: 50%;
        margin: 40px 25% 40px 25%;
    }
    .pc{
        display: unset;
    }
    .pc .antesDepois{
        width: 60%;
        margin: 0 20% 10px 20%;
    }
}
/*
@media (min-height: 701px) and (max-width: 550px){
    .frase01{
        width: 92%;
        margin-left: 4%;
        margin-top: calc(90vh - 170%);
    }  
}
*/


/*------------------------------------------------------------*/


/*--------------------------------------------------------------
# Sessao02
--------------------------------------------------------------*/
#sessao02 {
  z-index: 2;
  margin-top: -16vh;
  background: url("../img/s2/BG.webp") bottom center;
  background-size: cover;
  position: relative;
}

#btn01{
    width: 74%;
    margin: -7vh 13% 1vh 13%;
    z-index: 10;
    position: relative;
}
#btn02{
    z-index: 10;
    position: relative;
    width: 74%;
    margin: 0 13% 3vh 13%;
}
@media (min-height: 701px) and (max-width: 550px){
    #btn01{
        margin: -6vh 13% 1.5vh 13%;
    }
}
.frase02{
    width: 90%;
    margin: 15.5vh 5% 0 5%;
}

#sessao02 .crop02{
    width: 100%;
    margin-top: -12vh;
}
@media (min-height: 690px) and (max-width: 550px){
    #sessao02 .crop02{
        margin-top: -11vh;
    }
}

@media (min-width: 550px){
    #btn01{
            margin: -10vh 13% 1vh 13%;
    }
    #sessao02 {
        z-index: 2;
        margin-top: -34vh;
        background: url("../img/s2/BGPC.webp") bottom center;
        background-size: cover;
        position: relative;
    }
    .frase02{
        width: 84%;
        margin: 24vh 8% 0 8%;
    }
    #btn02{
        z-index: 10;
        position: relative;
        width: 49%;
        margin: -11vh auto 4vh 47.5%;
    }
    #sessao02 .crop02{
        display: none;
    }
}

/*------------------------------------------------------------*/


/*--------------------------------------------------------------
# Sessao03
--------------------------------------------------------------*/
#sessao03 {
  z-index: 5;
  margin-top: -8.5vh;
  background: url("../img/s3/BG4.webp");
  background-size: cover;
  position: relative;
}
@media (min-height: 690px) and (max-width: 550px){
    #sessao03{
        margin-top: -7vh;
    }
}

.texto03{
    width: 90%;
    margin: 0 5% 0 5%;
}

#sessao03 p{
    font-family: "Montserrat-Medium", sans-serif;
    color: white;
    font-size: 1em;
    line-height:1.4;
    text-align: justify;
    width: 90%;
    margin: 1.2vh 5% 0 5%
}

#sessao03 b{
    font-family: "Montserrat-Bold", sans-serif;
    font-size: 1.05em;
}

#sessao03 span{
    font-family: "Montserrat-Bold", sans-serif;
    color: #02FDEC;
    font-size: 1.1em;
}
@media (min-width: 550px){
    #sessao03 {
        z-index: 5;
        margin-top: -12.5vh;
        background: url("../img/s3/BGpc.webp") right;
        background-size: cover;
        position: relative;
    }
    #sessao03 p{
        display: none;
    }
    .texto03{
        width: 90%;
        margin: 11vh 5% 0 5%;
    }
}
/*------------------------------------------------------------*/


/*--------------------------------------------------------------
# Sessao04
--------------------------------------------------------------*/
#sessao04 {
  z-index: 2;
  margin-top: -6.5vh;
  background: url("../img/s4/BG.webp");
  background-size: cover;
}

#btn03{
    position: relative;
    z-index: 10;
    width: 74%;
    margin: 1vh 13% 3vh 13%;
}

.texto04{
    width: 90%;
    margin: 0 5% 0 5%;
}

#sessao04 p{
    font-family: "Montserrat-SemiBold", sans-serif;
    color: #051d29;
    font-size: 1em;
    line-height:1.4;
    text-align: justify;
    width: 90%;
    margin: 1.8vh 5% 0.7vh 5%
}

#sessao04 b{
    font-family: "Montserrat-Bold", sans-serif;
    font-size: 1.05em;
    text-align: left;
}

#btn04{
    z-index: 10;
    position: relative;
    width: 74%;
    margin: 1vh 13% 2vh 13%;
}

#sessao04 .crop02{
    width: 100%;
    margin-top: -11vh;
}

@media (min-height: 690px) and (max-width: 550px){
    #sessao04 .crop02{
        margin-top: -10vh;
    }
}

@media (min-width: 550px){
    #sessao04 {
        z-index: 2;
        margin-top: -23vh;
        background: url("../img/s4/BGpc.webp");
        background-size: cover;
    }
    #sessao04 .crop02{
        display:none;
    }
    #btn03{
        z-index: 10;
        position: relative;
        width: 44%;
        margin: 4vh auto 1vh 52.5%;
    }
    #sessao04 p{
        display: none;
    }
    .texto04{
        width: 80%;
        margin: 0 10% 0 10%;
    }
    #btn04{
        z-index: 10;
        position: relative;
        width: 48%;
        margin: auto auto 10vh 49%;
    }
}
/*------------------------------------------------------------*/


/*--------------------------------------------------------------
# Sessao05
--------------------------------------------------------------*/
#sessao05 {
  z-index: 5;
  margin-top: -2.5vh;
  background: url("../img/s5/BG2.webp");
  background-size: cover;
  position: relative;
}

.texto05{
    width: 70%;
    margin: 0 15% 0 15%;
}

#sessao05 p{
    font-family: "Montserrat-Medium", sans-serif;
    color: white;
    font-size: 1em;
    line-height:1.4;
    text-align: justify;
    width: 90%;
    margin: 3vh 5% 0 5%
}

#sessao05 b{
    font-family: "Montserrat-Bold", sans-serif;
    font-size: 1.05em;
}

#btn05{
    z-index: 10;
    position: relative;
    width: 74%;
    margin: 3vh 13% 4vh 13%;
}

.fim {
    width: 100%;
    margin: 0;
}
@media (min-width: 550px){
    #sessao05 p{
        display: none;
    }
    #sessao05 {
        z-index: 5;
        margin-top: -17vh;
        background: url("../img/s5/BGpcB.webp") right;
        background-size: cover;
        position: relative;
    }
    #btn05{
        z-index: 10;
        position: relative;
        width: 30%;
        margin: 1vh 0 2.5vh 10%;
    }
    .texto05{
        width: 50%;
        margin: 22vh 0 0 10%
    }
    .fim {
        width: 100%;
        margin-top: -50vh;
    }
}
/*------------------------------------------------------------*/