*{
    padding: 0;
    margin: 0;
}

body{
    background-color: #fbf8f1;
}

@font-face{
    font-family: 'Bigola Display Outline';
    src: url('Fonts/bigola-display-outline.otf') format('otf');
    font-weight: normal;
    font-style: normal;
}

@font-face{
    font-family: 'Bigola Display Regular';
    src: url('Fonts/bigola-display-regular.otf') format('otf');
    font-weight: normal;
    font-style: normal;
}

@font-face{
    font-family: 'Corbel';
    src: url('Fonts/corbel.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face{
    font-family: 'Corbell';
    src: url('Fonts/corbell.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
}

#init{
    height: 100vh;
    max-height: 1080px;
    width: 100%;
    max-width: 1920px;
    margin: auto;
    display: flex;
}

#initText{
    height: 100%;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

#textOneInit{
    margin-bottom: 15px;
    margin-top: 25px;
}

#textTwoInit{
    margin-bottom: 35px;
}

#conheca{
    width: 578px;
    height: 66px;
    background-image: url('Imagens/Arquivos-156.png');
    background-repeat: no-repeat;
    background-size: contain;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fbf8f1;
    font-family: 'Font Bigola Outiline', Arial;
    font-size: 20px;
}

#containerInitText{
    display: flex;
    flex-direction: column;
}

#initImg{
    height: 100%;
    width: 50%;
    justify-content: center;
    align-items: end;
    display: flex;
    position: relative;
}

#imgOnInit{
    width: 700px;
}



@media screen and (max-width: 1750px) {
    #imgOnInit{
        width: 550px;
    }
}

@media screen and (max-width: 1450px) {
    #imgOnInit{
        width: 500px;
    }

    #initLogo{
      width: 180px;  
    }

    #textOneInit{
        width: 500px;
    }

    #textTwoInit{
        width: 400px;
    }

    #conheca{
        width: 400px;
        height: 45px;
    }
}

@media screen and (max-width: 1200px) {
    #imgOnInit{
        width: 450px;
    }

    #initLogo{
      width: 150px;  
    }

    #textOneInit{
        width: 450px;
    }

    #textTwoInit{
        width: 350px;
    }

    #conheca{
        width: 350px;
        height: 40px;
    }
}

/*Parte dois (Vídeo)*/
#linhaVideo{
    width: 100%;
    height: 10px;
    background-color: rgba(213, 137, 228, 1);
    margin-bottom: 100px;
}

.displayImg{
    display: block;
    margin: auto;
    margin-bottom: 50px;
}

#video{
    width: 100%;
    margin: auto;
    max-width: 1920px;
    margin-bottom: 100px;
}

#containVideo{
    display: flex;
    justify-content: center;
}

@media screen and (max-width:1450px) {
    #logoVideo{
        width: 160px;
    }

    #tituloVideo{
        width: 950px;
    }

    #corpoVideo{
        width: 890px;
    }

    #imgVideo{
        width: 830px;
    }
}

@media screen and (max-width:1100px) {
    #logoVideo{
        width: 100px;
    }

    #tituloVideo{
        width: 750px;
    }

    #corpoVideo{
        width: 690px;
    }

    #imgVideo{
        width: 630px;
    }
}

@media screen and (max-width: 780px) {
    #logoVideo{
        width: calc(100% - 80%);
    }

    #tituloVideo{
        width: calc(100% - 15%);
    }

    #corpoVideo{
        width: calc(100% - 20%);
    }

    #imgVideo{
        width: calc(100% - 25%);
    }
}

/*Parte três (Avaliação)*/

#containerAvaliacao {
    width: 100%;
    max-width: 1920px;
    margin: auto;
    background: linear-gradient(18deg,rgba(213, 137, 228, 1) 0%, rgba(42, 3, 51, 1) 100%)
}

#avaliacao{
    width: 100%;
    max-width: 1920px;
    margin: auto;
    background-image: url('Imagens/Arquivos-96.png');;
    background-repeat: no-repeat;
    background-size: 1200px auto;
    background-position: left bottom;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#tituloAvaliacao{
    padding: 50px;
}

.left{
    margin-right: auto;
    max-width: 560px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.right{
    margin-left: auto;
    max-width: 565px;
    display: flex;
    align-items: center;
    padding: 20px 0px;
    gap: 20px;
}

#optionsSelecao{
    width: 100%;
    max-width: 1178px;
}

#tituloComments{
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 200px 0px 100px 0px;
}

#commentOntitulo{
    width: 950px;
}

#decorationLeftComments{
    width: 100%;
    height: 3px;
    background: rgba(213, 137, 228, 1);
    margin-right: 2%;
}

#decorationRigthComments{
    width: 100%;
    height: 3px;
    background: rgba(213, 137, 228, 1);
    margin-left: 2%;
}

#comments{
    display: flex;
    align-items: start;
    justify-content: start;
    gap: 20px;
    position: relative;
}

.conteinerCardComments{
    width: 413px;
    display: flex;
    position: relative;
}

#textoComment{
    width: calc(100% - 60px);
    position: absolute;
    padding: 15px 30px;
    font-family: 'Font Bigola Outiline', Arial;
    color: #fbf8f1;
}

.commentsImg{
    padding-bottom: 250px;
    width: 413px;
}


#avaliadorImg1{
    width: 73px;
    height: 73px;
    border-radius: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('Imagens/Arquivos-106.png');
}

#avaliadorImg2{
    width: 73px;
    height: 73px;
    border-radius: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('Imagens/Arquivos-113.png');
}

#avaliadorImg3{
    width: 73px;
    height: 73px;
    border-radius: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('Imagens/Arquivos-120.png');
}

#avaliadorImg4{
    width: 73px;
    height: 73px;
    border-radius: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('Imagens/Arquivos-127.png');
}

#tituloTextoComment{
    padding-bottom: 20px;
    font-size: 23px;
}

.corpoTextoComment{
    padding-bottom: 20px;
    font-size: 19px;
}

#imgCommentContain{
    padding-top: 5px;
    display: flex;
    gap: 20px;
    align-items: center;
}

#nomeAvaliadora{
    font-size: 22px;
}

#cargoAvaliadora{
    font-size: 18px;
}

@media screen and (max-width: 1750px) {
    #commentOntitulo{
        width: 850px;
    }
    
    .conteinerCardComments{
        width: 345px;
    }

    .commentsImg{
        width: 345px;
    }

    #textoComment{
        width: 280px;
    }

    #comments{
      flex-wrap: wrap;
      justify-content: center;  
    }

    #tituloTextoComment{
        padding-bottom: 20px;
        font-size: 20px;
    }

    .corpoTextoComment{
        padding-bottom: 20px;
        font-size: 15px;
    }

    #nomeAvaliadora{
        font-size: 19px;
    }

    #cargoAvaliadora{
        font-size: 14px;
    }

    #avaliadorImg{
        width: 80px;
        height: 80px;
    }

    #avaliadorImg1{
        width: 50px;
        height: 50px;
    }

    #avaliadorImg2{
        width: 50px;
        height: 50px;
    }

    #avaliadorImg3{
        width: 50px;
        height: 50px;
    }

    #avaliadorImg4{
        width: 50px;
        height: 50px;
    }
}

@media screen and (max-width: 1450px) {
    #commentOntitulo{
        width: 750px;
    }
    
    .conteinerCardComments{
        width: 280px;
    }

    .commentsImg{
        width: 280px;
    }

    #textoComment{
        width: 220px;
    }

    #comments{
      flex-wrap: wrap;
      justify-content: center;  
    }

    #tituloTextoComment{
        padding-bottom: 20px;
        font-size: 15px;
    }

    .corpoTextoComment{
        padding-bottom: 20px;
        font-size: 11px;
    }

    #nomeAvaliadora{
        font-size: 15px;
    }

    #cargoAvaliadora{
        font-size: 10px;
    }

    #avaliadorImg{
        width: 65px;
        height: 65px;
    }

    .cardAcertivo{
        width: 21px;
    }

    .textoOptionSelecao{
        width: 370px;
    }

    #optionsSelecao{
        width: 65%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    #imgTituloAvaliacao{
        width: 550px;
    }
}

@media screen and (max-width: 1200px) {
   .commentsImg{
        padding-bottom: 0px;
   }

   #comments{
    padding-bottom: 100px;
   }
}

/*Parte quatro (Sobre)*/

#sobre{
    width: 100%;
    max-width: 1920px;
    margin: auto;
    background-color: white;
}

#decorationLeftSobre{
    width: 100%;
    height: 3px;
    background: rgba(42, 3, 51, 1);
    margin-right: 2%;
}

#decorationRigthSobre{
    width: 100%;
    height: 3px;
    background: rgba(42, 3, 51, 1);
    margin-left: 2%;
}

#tituloSobre{
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 60px;
}

#decoraion{
    width: 100%;
}

/* #mentoraTitulo{
    position: absolute;
} */

#containerInternoSobre{
    display: flex;
    padding: 120px 0px;
}

#containerImagem{
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

#bordaImgSobre{
    width: 600px;
    height: 600px;
    border-radius: 100%;
    padding: 10px;
    border: solid rgba(42, 3, 51, 1) 1px;
}

#imgSobre{
    width: 98.5%;
    height: 98.3%;
    border-radius: 100%;
    border: solid rgba(42, 3, 51, 1) 5px;
    background-image: url('Imagens/Arquivos-91.png');
    background-size: cover;
    background-position: center;
}

.imgSobre{
    display: block;
}

#textoSobre{
    width: 50%;
}

@media screen and (max-width: 1750px) {
    #imgSobreTxt{
        width: 700px;
    }

    #imgSobreTitulo{
        width: 550px;
    }
}

@media screen and (max-width: 1450px) {
    #bordaImgSobre{
        width: 500px;
        height: 500px;
    }

    #imgSobreTxt{
        width: 550px;
    }

    #imgSobreTitulo{
        width: 450px;
    }

    #mentoraTitulo{
       width: 500px; 
    }
}

@media screen and (max-width: 1100px) {
    #bordaImgSobre{
        width: 380px;
        height: 380px;
    }

    #imgSobreTxt{
        width: 450px;
    }

    #imgSobreTitulo{
        width: 350px;
    }

    #mentoraTitulo{
       width: 400px; 
    }
}

@media screen and (max-width: 950px) {
    #bordaImgSobre{
        width: 290px;
        height: 290px;
    }

    #imgSobreTxt{
        width: 350px;
    }

    #imgSobreTitulo{
        width: 250px;
    }

    #mentoraTitulo{
       width: 300px; 
    }
}

@media screen and (max-width:780px) {
    #containerInternoSobre{
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    #imgSobreTitulo{
        width: calc(100% - 20%);
    }

    #imgSobreTxt{
        width: calc(100%);
    }
}

/*Parte cinco (Conteudo curso)*/

.btn{
    color:#fbf8f1;
    padding: 100px;
    z-index: 20;
}

#btnCurso{
    width: 100%;
    display: flex;
    justify-content: space-between;
    position: absolute;

}

#tituloCurso{
    width: 100%;
    position: absolute;
    display: flex;
    justify-content: center;
    top: 100px;
}

#conteudoCurso{
    width: 100%;
    max-width: 1920px;
    height: 1080px;
    margin: auto;
    background-color: rgba(42, 3, 51, 1);
    display: flex;
    flex-direction: column;
    align-items: center;
}

#internoCurso{
    width: 100%;
    height: 100%;
    background-image: url('Imagens/Arquivos-53.png');
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    justify-content: center;
}

#containerInternoConteudo{
    width: 80%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 130px;
    overflow: hidden;
}

#containCards{
    height: 608px;
    display: flex;
    gap: 15px;
    justify-content: center;
    align-items: center;
    transform: translateX(0px);
    transition-property: transform;
    transition-duration: 0.8s;
    transition-timing-function: ease;
}

.cardConteudo{
    width: 404px;
    height: 608px;
}

#cardConteudo0{
    background-image: url('modulos/Comece-por-Aqui.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#cardConteudo-1{
    background-image: url('modulos/Excelência-no-ministério-de-louvor.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#cardConteudo-2{
    background-image: url('modulos/Fundamentos-da-verdadeira-adoração.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#cardConteudo1{
    background-image: url('modulos/A-equipe-e-o-fluir-coletivo.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#cardConteudo2{
    background-image: url('modulos/Módulo-extra.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
#cardConteudo3{
    background-image: url('modulos/O-ministro-de-louvor-com-propósito.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

#cardConteudo0{
    width: 424px;
    height: 638px;
}

@media screen and (max-width: 1920px) {
    .cardConteudo{
        width: 350px;
        height: 550px;
    }

    #cardConteudo0{
        width: 370px;
        height: 580px;
    }

    #containCards{
        height: 580px;
    }

    #conteudoCurso{
        height: 950px;
    }

    #imgTituloCurso{
        width: 850px;
    }
}

@media screen and (max-width: 1450px) {
    .cardConteudo{
        width: 300px;
        height: 500px;
    }

    #cardConteudo0{
        width: 320px;
        height: 530px;
    }

    #containCards{
        height: 530px;
    }

    #conteudoCurso{
        height: 850px;
    }

    #imgTituloCurso{
        width: 750px;
    }
}

/*Parte seis (planos)*/

#planos{
    width: 100%;
    max-width: 1920px;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: white;
}

#tituloPlanos{
    padding: 120px;
}

#cardsPlanos{
    display: flex;
    gap: 100px;
    align-items: center;
}

#cardSemestral{
    display: flex;
    flex-direction: column;
    position: relative;
}

#cardMensal{
    display: flex;
    flex-direction: column;
    position: relative;
    justify-content: center;
}

.containerInternoPlanos{
    position: absolute;
    padding: 20px;
    color: #fbf8f1;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: 'Font Bigola Outiline', Arial;
    gap: 25px;
}

.tipoPlano{
    font-size: 38px;
    font-weight: bold
}

.descPlano{
    font-size: 19px;
    text-align: center;
}

.linhaCardPlano{
    width: 100%;
    height: 3px;
    background: #fbf8f1;
}

.precoCardPlano{
    font-size: 80px;
}

.btnCardPlano{
    padding: 10px 30px;
    font-size: 30px;
    border-radius: 6px;
    background-color: rgba(213, 137, 228, 1);
}

@media screen and (max-width: 1450px) {
    #cardSemestral{
        width: 300px;
    }

    #logoPlanos{
        width: 70px;
    }

    .tipoPlano{
        font-size: 19px;
    }

    .descPlano{
        font-size: 10px;
    }

    .precoPlano{
        width: 102px;
    }

    .btnCardPlano{
        font-size: 10px;
        padding: 6px 20px;
    }

    #cardMensal{
        width: 327px;
    }
}

@media screen and (max-width: 1450px) {
    #cardSemestral{
        width: 300px;
    }

    #logoPlanos{
        width: 70px;
    }

    .tipoPlano{
        font-size: 19px;
    }

    .descPlano{
        font-size: 10px;
    }

    .precoPlano{
        width: 102px;
    }

    .btnCardPlano{
        font-size: 10px;
        padding: 6px 20px;
    }

    #cardMensal{
        width: 327px;
    }
}

@media screen and (max-width: 780px) {
    #cardsPlanos{
        flex-direction: column;
    }
}

/*Parte sete (footer)*/

#footer{
    width: 100%;
    max-width: 1920px;
    margin: auto;
    background: #FFF;
    background: linear-gradient(0deg, rgba(213, 137, 228, 1) 0%, rgba(255, 255, 255, 1) 50%);
}

#garantiaCurso{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 50px;
    padding-top: 300px;
}

#tituloDuvidas{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 100px 0px;
}

#decorationLeftDuvidas{
    width: 100%;
    height: 3px;
    background: rgba(42, 3, 51, 1);
    margin-right: 2%;
}

#decorationRigthDuvidas{
    width: 100%;
    height: 3px;
    background: rgba(42, 3, 51, 1);
    margin-left: 2%;
}

#duvidas{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    padding-bottom: 200px;
}

.duvidasContainer{
    position: relative;
    display: flex;
    justify-content: center;
}

.internoDuvidas{
    width: 95%;
    height: 100%;
    position: absolute;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fbf8f1;
    font-size: 40px;
    padding: 0px;
    font-family: 'Font Bigola Outiline', Arial;
}

.resposta{
    font-size: 30px;
    max-width: 1215px;
    font-family: 'Font Bigola Outiline', Arial;
    color: rgba(42, 3, 51, 1);
    display: none;
}

.imgContainerDiv{
    width: 100%;
}

@media screen and (max-width: 1450px) {
    .duvidasContainer{
        width: 1000px;
    }

    .resposta{
        max-width: 1000px;
        font-size: 25px;
    }

    .imgContainerDiv{
        width: 1000px;
    }

    .internoDuvidas{
        font-size: 30px;
    }

    #imgTituloDuvidas{
        width: 400px;
    }
    
    #seloGarantia{
        width: 300px;
    }

    #tituloGatantia{
        width: 600px;
    }

    #textoGatantia{
        width: 950px;
    }

    #imgTituloPlanos{
        width: 450px;
    }
}

@media screen and (max-width: 1100px) {
    .duvidasContainer{
        width: 800px;
    }

    .resposta{
        max-width: 800px;
        font-size: 18px;
    }

    .imgContainerDiv{
        width: 800px;
    }

    .internoDuvidas{
        font-size: 20px;
    }

    #imgTituloDuvidas{
        width: 350px;
    }
    
    #seloGarantia{
        width: 250px;
    }

    #tituloGatantia{
        width: 500px;
    }

    #textoGatantia{
        width: 750px;
    }

    #imgTituloPlanos{
        width: 450px;
    }
}

@media screen and (max-width: 780px) {
    .duvidasContainer{
        width: calc(100% - 15%);
    }

    .imgContainerDiv{
        width: 100%;
    }

    .internoDuvidas{
        font-size: 15px;
    }

    #imgTituloDuvidas{
        width: calc(100% - 50%);
    }
    
    #seloGarantia{
        width: calc(100% - 70%);
    }

    #tituloGatantia{
        width: calc(100% - 20%);
    }

    #textoGatantia{
        width: calc(100% - 10%);
    }

    #imgTituloPlanos{
        width: 100%;
    }
}

#containerEmBreve{
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

#imageBreve{
    width: 200px;
}

#emBreve{
    font-size: 36px;
    font-family: 'Font Bigola Outiline', Arial;
    color: rgba(42, 3, 51, 1);
}