

html,body{
    height:100% !important;
}

body .row{
    margin:0px;
}

body{
    font-family: 'Mazzard', sans-serif;
    background-color: #23007f;
}

@media(min-width: 1px) {
    #img_hero_left_mobile {
        max-width: 100%;
        position: absolute;
        top: 25%;

    }

    #img_hero_right_mobile {
        max-width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
    }
}

.card-links{
    background: transparent;
    border-color: white;
    border-radius:20px;
    padding:15px 10px 0px 10px;
    color: white;
    height:100%;
    text-align:left;
}

.card-links span{
    margin-top:10px;
    font-size:0.8em;
}

.card-links:hover{
    text-decoration: none !important;
    background:white !important;
    color:black !important;
}

.card-text{
    font-size:0.9em;
}

.secao{
    width: 100% !important;
    /* padding: 30px 50px; */
    padding-top: 100px;
    padding-bottom: 100px;
    /* box-shadow: inset 7px -11px 95px -22px rgba(0,0,0,0.8); */
}

#intro{
    padding:0 !important;
    height: fit-content !important;
}

#intro::before{
    content: '' !important;
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    left: 0 !important;
    /* background: rgba(35,0,127, 0.8) !important; */
}

.btn-branco{
    background-color: #ffffff !important;
    color: #ca23ab !important;
    padding: 16px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.7);
    white-space: normal;
}

.btn-rosa{
    background-color: #ca23ab !important;
    color: #ffffff !important;
    padding: 16px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 800;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.7);
    white-space: normal;
}

.btnDetCurso{
    display:none;
    position:absolute;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    width: fit-content;
    top: 49%;
    transform: translateY(-49%);
    color: #ca23ab !important;
}

.col-curso{
    padding:5px;
}

.card-curso{
    position:relative;
    padding:0px;
    justify-content: center;
    text-align: center;
    border:1px solid #9E9E9E;
    border-radius:1em;
}

.curso-info{
    width:100%;
    padding:10px 5px;
}

.curso-preco{
    font-size:1.2em;
    color: #ca23ab;
    font-weight:bold;
}

.curso-preco-old{
    font-size:0.9em;
    color: #434343;
    font-weight:bold;
    text-decoration: line-through;
}

.curso-duracao{
    font-size:1.2em;
    color: #23007c;
    font-weight:bold;
}

.card-curso .img-curso{
    width:100%;
    border-radius:1em;
}

.card-curso::before{
    position:absolute;
    top:0px;
    right:0px;
    content: '';
    width:100%;
    height:100%;
    background: rgba(0,0,0,0);
    display:block;
    transition: background 0.2s;
    border-radius:1em;
}

.card-curso:hover::before{
    background: rgba(0,0,0,0.6);
    z-index:999;
}

.card-curso:hover .btnDetCurso{
    display: block;
    z-index:9999;
}

.card-curso .curso-label{
    position:absolute;
    /* left:10px;
    top:180px; */
    left: 0;
    bottom: 0;
    padding: 8px;

}

.curso-title{
    width:fit-content;
    color:white;
    background-color: #F72585;
    padding:5px;
    /* font-size:1.5em; */
    font-size: 24px;
    margin:0;
}

.curso-tipo{
    width:fit-content;
    color:white;
    background-color: #23007c;
    /* font-size:0.8em; */
    font-size: 16px;
    padding:2px;
    z-index:99;
    margin:0;
}

.card-ingresso{
    border:1px solid #F72585;
    border-radius:1em;
    padding:20px;
    padding-bottom:30px;
    margin:5px;
}

.card-ingresso .btn{
    position: absolute;
    right: 10px;
    bottom: 10px;
}

#accordion a{
    color: white;
}

#accordion .card{
    background-color: transparent !important;
}

#accordion .card-header{
    background-color: transparent !important;
    background: rgba(0,0,0,0.3) !important;
}

#accordion .card-body{
    font-size:1.1em;
}

#header{
    position:fixed !important;
    top:0px;
    width:100%;
    padding:10px 20px;
    background: rgba(35,0,127,0.8);
    z-index:9999;
    display:none;
}

.btn-vestibular{
    background-color: #ca23ab !important;
    color:white !important;
    font-size: 16px !important;
    padding: 16px;
    font-size: 16px;
    font-weight: 500;
    /* box-shadow: 0 4px 6px rgba(0, 0, 0, 0.7); */
    border-radius: 8px;
}

.btn-vestibular:hover{
    background-color: #23007c !important;
}

@media screen and (max-width: 550px){
    
    .secao{
        /* padding:20px 6px; */
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .card-links{
        text-align:center;
    }

    #metricas .media{
        margin-bottom: 20px;
        padding-bottom: 5px;
        border-bottom: 1px solid #626262;
    }
    
    #header{
        display: none !important;
    }
}

.img-turmaok{
    width:80px;
    position:absolute;
    right:5px;
    top:5px;
}

.btn{
    border-radius:0.6em;
}

#estrutura{
    background-color: #23007c;
}

.card-estrutura{
    background:transparent !important;
    transition: background 0.2s;
    border-radius:1em;
    border:0px;
}

.card-estrutura:hover{
    background:white !important;
    color:black;
}

.card-estrutura:hover .btn{
    color: black !important;
    border-color: black !important;
}

.img-estrutura{
    background-repeat: no-repeat !important; 
    background-size: cover !important; 
    min-height:150px;
    height:100%;
    width:100%;
    border-radius:1em;
    box-shadow: 8px 8px 0px -3px rgba(255,255,255,1); 
}

.curso-periodo{
    position:absolute;
    top:10px;
    left:10px;
    width:fit-content;
    padding:5px;
    font-size:12px;
    border-radius:0.5em;
}

#label-preco-condicoes{
    font-size:1.2em;
}

#img_hero_left{
    max-width: 50%;
    position: absolute;
    bottom: 10%;
}

#img_hero_right{
    max-width: 50%;
    position: absolute;
    right: 0;
    bottom: 0;
}

#img_meio_circulo{
    
    max-height: 50%;
}

@keyframes pulsar{
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

@keyframes chacoalhar {
    0% {
        transform: rotate(0deg); 
    }
    15% {
        transform: rotate(5deg); 
    }
    30% {
        transform: rotate(-5deg); 
    }
    45% {
        transform: rotate(5deg); 
    }
    60% {
        transform: rotate(-5deg); 
    }
    75% {
        transform: rotate(2deg);
    }
    100% {
        transform: rotate(0deg); 
    }
}

@keyframes zigzag{
    0% { transform: translate(0, 0); }
    50% { transform: translate(8px, 0); }
    100% { transform: translate(0, 0); }
}

.btn-rosa {
    display: inline-block;
    transform-origin: center center; 

    animation-name: pulsar;
    animation-duration: 2s; /* Duração de uma chacoalhada completa */
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite; /* Repetir continuamente */
}

#metricas{
    background-color: #ca23ab;
}
.bg-rosa{
    background-color: #ca23ab !important;
}

.bg-azul{
    background-color: #23007c !important;
}

.btn-outline-azul{
    color: #23007f;
    border-color: #23007f;
    background-image: none;
    background-color: transparent;
}

.btn-outline-azul.active{
    color: #fff;
    background-color: #23007f;
    border-color: #23007f;
    box-shadow: 0 0 0 0.2rem rgba(35, 0, 127, 0.5);
}

.card-curso .curso-label h4{
    background-color: #ca23ab !important;
}

.card-curso .curso-label .curso-tipo{
    background-color: #23007f !important;
}

.text-rosa{
    color: #ca23ab !important;
}


