h1 {
    font-family: 'Montserrat', sans-serif;
}
h2, h3 {
    font-family: 'Maven Pro', sans-serif;
}

p, li {
    font-family: 'Arimo', sans-serif;
}

a {
    text-decoration: none;
    color: #85bdb5;
}

/* * {
    outline: 2px solid greenyellow ;
} */

body {
    margin: 0px;
    overflow-x: hidden;
  
}

header {
    
    width: 100%;
    position: fixed;
    z-index: 5;
    display: flex;
    justify-content: center;
}

.headercontainer {
    width: 100%;
    height: 10vh;
    background: linear-gradient(0deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);

    display: flex;
    align-items: center;
    justify-content: space-between;

    transition: 0.6s;

}

.round {
    border-radius: 30px;
    width: 90%;
}

.logo   {
    width: fit-content;
    margin: 0 3em;
}

.menu-options ul {
    width: fit-content;
    margin: 0 3em;

    display: flex;
    align-items: center;
}

.menu-options li {
    color: white;
    list-style: none;
    margin-right: 2vw;
    font-size: 1.2vw;
    font-weight: 600;
    cursor: pointer;
}

.menu-options li:hover {
    transition: .5s;
    transform: scale(1.1);
}

.bginicial {
    position: static;
    width: 100%;
    height: 42vw;

    z-index: 2;

    box-shadow: 0px 21px 19px -3px rgba(0,0,0,0.67);
}

.slidecontainer {
    width: 100%;
    height: 45vw;
    overflow: hidden;


    
}

.slidechamada {    
    display: flex;
    flex-direction: row;

    background-color: aquamarine;
    width: 500%;

    height: 45vw;
    list-style: none;

}

.slidechamada input {
    display: none;
}

.slidechamada h2 {
    width: 40%;
    color: white;
    font-size: 3vw;
    margin-left: 5%;
    margin-top: 20%;
}

.slidechamada h3 {
    width: fit-content;
    padding: 5px 10px;
    color: white;
    font-size: 150%;
    border: solid 2px white;
    border-radius: 20px;
}

.btns-slides {
    width: 35%;
    margin-top: 1%;
    margin-left: 3.5%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
}
.slide {
    position: relative;
    transition: 2s;
}

#slide-missao{
    width: 20%;
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/carrossel1.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 90vh;
}

#slide-base {
    width: 20%;
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/carrossel2.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 90vh;
}

#slide-espaco {
    width: 20%;
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/espaco.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 90vh;
}

#slide-exclusivo {
    width: 20%;
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/camera.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 90vh;
}

#slide-casa {
    width: 20%;
    background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/quebracabecas.jpg);
    background-repeat: no-repeat;
    background-size: 110%;
    height: 90vh;
}

.manual-nav {
    position: absolute;
    width: 100%;
    margin-top: -7vw; 
    display: flex;
    justify-content: center;
}

.manual-btn {
    border: 2px solid white;
    padding: .5vw;
    border-radius: .8vw;
    cursor: pointer;
    transition: .6s;
}

.manual-btn:not(:last-child) {
    margin-right: 40px;
}

.manual-btn:hover {
    background-color: white;
}

#radio1:checked ~ .first{
    margin-left: 0;
}

#radio2:checked ~ .first{
    margin-left: -20%;
}

#radio3:checked ~ .first{
    margin-left: -40%;
}

#radio4:checked ~ .first{
    margin-left: -60%;
}

#radio5:checked ~ .first{
    margin-left: -80%;
}

.nav-auto div{
    border: 2px solid teal;
    padding: .5vw;
    border-radius: .8vw;
    cursor: pointer;
    transition: 0.6s;
}

.nav-auto {
    position: absolute;
    width: 100%;
    margin-top: 38vw;
    display: flex;
    justify-content: center;
}

.nav-auto div:not(:last-child){
    margin-right: 40px;
}

#radio1:checked ~.nav-auto .auto-btn1{
    background-color: white;
}

#radio2:checked ~.nav-auto .auto-btn2{
    background-color: white;
}

#radio3:checked ~.nav-auto .auto-btn3{
    background-color: white;
}

#radio4:checked ~.nav-auto .auto-btn4{
    background-color: white;
}

#radio5:checked ~.nav-auto .auto-btn5{
    background-color: white;
}

h1.titulo {
    color: #85bdb5;
    font-size: 4vw;
    
}

.under { 
    position: sticky;
    z-index: 1;
    
    background-color: #fdf7de;

    box-shadow: inset 0px -20px 19px -3px rgba(0,0,0,0.67);

}

section.prop-ped {
    



    display: flex;
    flex-direction: row;
    align-items: flex-start;
}


.coluna-esq {
    width: 15%;
    height: 60vw;
}

.coluna-esq img#vert {
    position: absolute;
    width: 12%;
    transform: scale(1.2);

    top: 25vh;
    left: 2vw;


}

.cont-centro {
    width: 70%;
    position: relative;
}

div#topicos {
    display: flex;

    align-items: center;
    justify-content: flex-start;
}

div#t ul {
    margin-left: 80px;
}

div#t li::marker {
    font-size: 3vw;
    font-family: 'Pacifico', cursive;
    color: rgb(54, 155, 150);
}

section.prop-ped div#t li#t1, li#t2, li#t3, li#t4, li#t5 {
    text-align: left;
    list-style: decimal;
    color: #85bdb5;
    margin-bottom: 1.5em;


    font-weight: 700;
    border-radius: 15px;
    cursor: pointer;
    font-size: 2vw;
    line-height: 2;
}

section.prop-ped div#t li#t1 h2, li#t2 h2, li#t3 h2, li#t4 h2, li#t5 h2 {
    margin: 0;
    margin-left: 2vw;
    font-family: 'Pacifico', cursive;
    font-weight: 200;
    color: rgb(54, 155, 150);
}


section.prop-ped div#topicos div#t {
    width: 100%;
}

.cont-centro h1 {
    margin-bottom: 1em;
}


section.prop-ped div#t p.tativo {
    height: auto;
    opacity: 1;
    transition: .6s;
}

section.prop-ped div#t p {
    margin: 0;
    font-size: 1.3vw;
    position: relative;
    margin-left: 1vw;
    height: 0;
    opacity: 0;

    transition: .2s;

}



div#t ul li h2::after {
    display: block;
    background: rgb(54, 155, 150);
    height: 5px;
    width: 95%;
    margin: 0;
    margin-bottom: 20px;
    content: ""; 
}

div#d ul li.descri {
    height: 0;
    text-align: center;
    opacity: 0;
    transition: .6s;
}

div#d ul li.propativ {
    opacity: 1;
    background: linear-gradient(70deg, rgb(255, 192, 2) 0%, rgb(0, 255, 0) 100%);
    border-radius: 2.5vw;
    height: fit-content;
    padding-top: 1vw;
    padding-bottom: 1vw;
    padding-inline-start: 2vw;
    padding-inline-end: 2vw;
}

div#t li {
    scale: (0.8);
}

div#t li:hover {
    transition: .2s;
    transform: scale(1);
    border: 3px #85bdb5 solid ;
    background-color: #c8def177;
}



.coluna-d {
    width: 15%;
    height: 60vw;

}

.coluna-d img#vert {
    position: absolute;
    width: 12%;
    
    transform: scale(1.1);

    top: 15vh;
    right: 2vw;
}


.over {
    background: linear-gradient(60deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);
    box-shadow:  0px 20px 19px 5px rgba(0,0,0,0.67);
    position: sticky;
    z-index: 2;

}


section.over h1.titulo {
    padding-top: .5em;
    color: #fdf7de;
    font-size: 4vw;
    margin: 0 5% 0;
    
}

section.sobre h4{
    font-size: 1.3vw;
    line-height: 1.3;
    color:#fdf7de ;
}

.contentpq {
    display: flex;
    align-items: center;
}

.textpq {
    width: 40%;
    margin: 10px 20px;
    font-family: 'Arimo', sans-serif;
    font-weight: 100;
    text-align: justify;
    padding-left: 5%;
}

.textpq::before, .textpq::after {
    display: block;
    background: #eee;
    height: 5px;
    width: 100%;
    margin: 40px auto 30px;
    content: ""; 
}

.imgpq {
    margin: 20px 20px;
    width: 50%;
    display: flex;
    justify-content: center;
    height: 60vh;
}

.imgpq img {
    border: 5px solid white;
    width: 80%;
}

.tres {
    display: flex;
    justify-content: center;
    height: fit-content;
}

#missao h1 {
    padding-left: 1.3em;
}

#piece-e {
    margin-top: 35px;
    background-image: url(../imagens/piece-e.png);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 24em;
    width: 30vw;
    margin-left: 1em;

    display: flex;
    align-items: center;


} 

#piece-e p {
    font-family: 'Pacifico', cursive;
    font-size: 180%;
    padding-left: 1em;
    padding-right: 3em;
    text-align: center;
    color: #ebe9e2 ;
    font-weight: 300;
    line-height: 1.2;
}

#visao h1 {
padding-left: 2.1em ;
}

#piece-c {
    margin-top: 30px;
    background-image: url(../imagens/piece-c.png);
    background-repeat: no-repeat;
    background-size: 92%;
    height: 25em;
    width: 38vw;

    display: flex;
    align-items: center;


} 

#piece-c p {
    font-family: 'Pacifico', cursive;
    font-size: 180%;
    padding-left: 3em;
    padding-right: 4.7em;
    text-align: center;
    color: #ebe9e2 ;
    font-weight: 300;
    line-height: 1.2;
}

#valores h1 {
    padding-left: 1.5em;
}

#piece-d {
    margin-top: 35px;
    background-image: url(../imagens/piece-d.png);
    background-repeat: no-repeat;
    background-size: 100%;
    margin-left: -2em;
    height: 24em;
    width: 30vw;

    display: flex;
    align-items: center;
} 


#piece-d p {
    font-family: 'Pacifico', cursive;
    font-size: 180%;
    padding-left: 4em;
    padding-right: 1em;
    text-align: center;
    color: #ebe9e2 ;
    font-weight: 300;
    line-height: 1.2;
}

.mapa {
    display: flex;
}

section.mapa .coluna-esq #vert {
    position: absolute;
    top: 20vh;
    left: 1vw;
}

section.mapa .coluna-d img#vert {
    position: absolute;

    top: 15vh;
    right: 1vw;

}

section.mapa .cont-centro {
    margin-bottom: 20vw;
}

.container-mapa1 {
    opacity: 1;
    transition: .3s;
}

.container-mapa1.desap {
    opacity: 0;
}

div.container-1st.desap {
    opacity: 0;
}

div.container-1st.lado {
    display: none;
    opacity: 0;
    transform: translateX(100%);
    transition: .8s;

}

.container-1st {
    width: 100%;
    position: absolute;
    top: 12em;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    transition: .8s;
    opacity: 1;
}

.planta {
    position: relative;
}

div.container-1st .planta {

    width: 300px;
    aspect-ratio: .48;
    background-color: rgba(255, 255, 255, 0.884);
    background-image: url(../imagens/firstfloor-bp.png);
    background-repeat: no-repeat;
    background-position-x: center;
}
div.container-2nd.lado {
    display: none;
    opacity: 0;
    transform: translateX(100%);
    transition: .8s;

}

.container-2nd {
    width: 100%;
    position: absolute;
    top: 12em;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    transition: .8s;
    opacity: 1;
}

.container-2nd .planta {
    width: 300px;
    aspect-ratio: .48;
    background-color: rgba(255, 255, 255, 0.884);
    background-image: url(../imagens/scndfloor-bp.png);
    background-repeat: no-repeat;
    background-position-x: center;
}

.container-ug.lado {
    display: none;
    opacity: 0;
    transform: translateX(100%);
    transition: .8s;
}

.container-ug {
    width: 100%;
    position: absolute;
    top: 12em;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    transition: .8s;
    opacity: 1;
}

.container-ug .planta {
    width: 300px;
    aspect-ratio: .48;
    background-color: rgba(255, 255, 255, 0.884);
    background-image: url(../imagens/ug-bp.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
}

div.planta h6 {
    font-family: 'Arimo', sans-serif;
    font-size: 110%;
    cursor: pointer;
    color: #3f709b;
    text-align: center;
    display: flex;
    flex-flow: column;
    align-items: center;
}

/* Salas térreo */

div.planta h6.up-1st {
    background: linear-gradient(0deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);
    position: absolute;
    font-size: 120%;
    top: 46%;
    left: 40%;
    --animate-duration: 1s;
}

div.planta h6.down-1st {
    background: linear-gradient(0deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);
    position: absolute;
    font-size: 120%;
    top: 55%;
    left: 40%;
    --animate-duration: 1s;
}


div.planta h6.ber {
    position: absolute;
    top: 35%;
    left: 25%;
}

div.planta h6.soneca {
    position: absolute;
    text-align: center;
    width: 60px;
    left: 58%;
    top: 42%;
}

div.planta h6.refeit {
    position: absolute;
    top: 62%;
    left: 40%;
    transform: rotate(-45deg);
}

div.planta h6.refeit ion-icon {
    transform: rotate(45deg);
}

div.planta h6.parqext {
    position: absolute;
    top: 80%;
    width: 80px;
    left: 27%;
}

div.planta h6.atelie {
    position: absolute;
    top: 80%;
    left: 73%;
}

div.planta h6.iI {
    position: absolute;
    top: -2%;
    left: 12%;
}

div.planta h6.iII {
    position: absolute;
    top: -2%;
    left: 50%;
}

div.planta h6.banho {
    flex-flow: row-reverse;
    position: absolute;
    font-size: 95%;
    top: 30%;
    width: 80px;
    left: 50%;

}

div.planta h6.banho ion-icon {
    font-size: 150%;
}

/* Salas Segundo */

div.planta h6.down-2nd {
    background: linear-gradient(0deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);
    position: absolute;
    font-size: 120%;
    top: 41%;
    left: 48%;
    --animate-duration: 1s;
}


div.planta h6.hort {
    position: absolute;
    top: 73%;
    left: 69%;
}

div.planta h6.iII2 {
    position: absolute;
    top: 20%;
    left: 17%;
}

div.planta h6.iIII {
    position: absolute;
    top: 19%;
    left: 60%;
}

div.planta h6.iIV {
    position: absolute;
    top: 37%;
    left: 70%;
}

div.planta h6.iV {
    position: absolute;
    top: 52%;
    left: 48%;
}

/* Salas Subssolo */

div.planta h6.up-ug {
    background: linear-gradient(0deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);
    position: absolute;
    font-size: 120%;
    top: 46%;
    left: 32%;
    --animate-duration: 1s;
}

div.planta h6.brinq {
    position: absolute;
    top: 35%;
    left: 30%;
}

div.planta h6.parqinf {
    position: absolute;
    top: 15%;
    left: 30%;
}

div.planta h6.ing {
    position: absolute;
    width: 60px;
    top: -5%;
    left: 10%;
}

div.planta h6.salativ {
    position: absolute;
    width: 60px;
    top: -5%;
    left: 52%;
}


div.salas {
    width: 60%;
}

div.salas li.descrativo {
    opacity: 1;
    height: auto;
}

div.salas li {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    opacity: 0;
    height: 0;
    transition: .6s;
}

div.salas li h2 {
    display: flex;
    width: 40%;
    font-family: 'Pacifico', cursive;
    font-size: 200%;
    color: rgb(133, 189, 181);
    align-items: center;
    justify-content: center;
}

div.salas li img {
    width: 60%;
    aspect-ratio: 1.6;
    object-fit: cover;
    align-content: center;
    background-color: blue;
}
/* 
div.salas li img:hover {
    transition: .6s;
    transform: scale(3) translateX(-20%) translateY(20%);
} */

div.salas li p {
    border: 5px solid rgb(133, 189, 181);
    padding: 15px;
    display: flex;
    align-items: center;
    text-align: center;
    width: 60%;
    aspect-ratio: 1.2;
    font-size: 150%;
    color: rgb(133, 189, 181);
    font-family: 'Ubuntu', sans-serif;
}




.fachada {
    border: solid 5px white;
    background-image: url(../imagens/fachada.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 30em;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.fachada h2 {

    width: fit-content;
    color: white;
    padding: 5px 5px;
    font-size: 2vw;
    border: solid 5px white;
    border-radius:  25px;
    cursor: pointer;
}

/* Atividades  */

section.atividades h1.titulo {
    margin-bottom: 50px;
}


section.atividades h2 {
    color: white;
    transition: .6s;
}

.destaque {
    font-size: 3vw;
}

.index .destaque {
    display: flex;
    justify-content: center;
    width: 3.8vw;
    border: 3px solid #3f709b;
    border-radius: 50%;
    
}


.sidebar {
    position: absolute;
    top: 18%;
    width: 35%;
}

.grud {
    position:sticky;
    top: 30%;
    height: 0;
}

.baixo {
    top: 72%;
}

.index {
    margin-left: -20px;
    margin-right: 20px;
    margin-top: 0px;
}

.item {
    display: flex;
    margin-left: 8em;
    margin-bottom: 60px;
}

.ativbox {
    width: 100%;
    aspect-ratio: 2.3;
}



.cultural-bg {
    background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/cultural.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
}

.esporte-bg {
    background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/esporte.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
}

.ambiente-bg {
    background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, 0.4), rgba(0,0,0,.7)), url(../imagens/ambiente.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
}

.textativ {
    position: absolute;
    width: 45%;
    right: 6em;
    
    height: max-content;


    display: flex;
    flex-direction: column;

}

.mobile-ativ {
    display: none;
}

.descrig, .ativitens h5 {
    font-size: 1.6vw;
    color: white;
    font-family: 'Arimo', sans-serif;
}

div.textativ div#culturalt {
    position: absolute;
    top: 15vh;
}

.alltext {
    opacity: 0;
    transition: .4s;
}

.ativa {
    opacity: 1;
}

.textativ .alltext ul {
    display: flex;
  flex-wrap: wrap;
  justify-content: space-between;

  color: white;

}

.textativ .alltext ul li {
    flex: 0 0 40%;    
}

div.textativ div#esportet {
    position: absolute;
    top: 100vh;
}

div.textativ div#ambientet {
    position: absolute;
    top: 190vh;
}

.contato {
    display: flex;
}

.contato-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.forms {
    width: 35vw;
    background: linear-gradient(45deg, rgb(33, 151, 145) 0%, rgba(44,143,221,1) 100%);
    height: fit-content;
    border-radius: 40px;
}

section.contato .cont-centro h1 {
    margin-bottom: .2em;
}

.contato h3 {
    text-align: center;
    width: 25vw;
    font-size: 3vw;
    color: white;
    font-family: 'Ubuntu', sans-serif;
    padding: 1vw;
    margin: 2vw;
    outline: 2px solid #cbd7e7;
    border-radius: 1vw ;
}


.inputbox {

    margin: 00px 0px 0px 20%;
}



.inputbox input, .inputbox textarea {
    width: 60%;
    padding: .25vw .25vw;
    margin: .1vw 0;
    border: none;
    border-bottom: 2px solid rgb(214, 214, 214);
    font-family: 'Arimo', sans-serif;
    outline: none;
    font-weight: 900;
    resize: none;
    list-style: none;
    background-color: #3f709b00;
    color: white;
}

.inputbox input.btn {
    font-size: 2vw;
    border: 4px solid white;
    border-radius: 1vw;
}

.inputbox input::placeholder, .inputbox textarea::placeholder  {
    color: white;
    font-size: 1vw;
    font-family: 'Arimo', sans-serif;
}

.infos {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}


.infos h2 {
    font-size: 300%;
    color: #85bdb5;
}

.infos ul {
    line-height: 2.5;
    list-style: none;
    color: #85bdb5;
    margin-left: -10px;
}

.infos ul ion-icon {
    transform: scale(1.8);
    margin-right: 15px;
}

.mapa iframe {
    width: 100%;
    height: 40vh;
    border: 5px solid #85bdb5;
    border-radius: 15px;
}

#cima {
    position: sticky;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 20vh;
    background: linear-gradient(0deg, rgba(46,255,245,1) 0%, rgba(44,143,221,1) 100%);
    padding: 0px 80px;

}
.redes {
    width: 20%;
    display: flex;
    justify-content: space-between;
}

.redes ion-icon{
    color: white;
    font-size: 400%;

}    

#dreamspace {
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(180deg, rgba(26,26,26,1) 0%, rgba(75,89,94,1) 49%, rgba(26,26,26,1) 100%);
    height: 50vh;
}

#power {
    padding-right: 45vw;
    color: white;
    font-size: 130%;
}

#logof {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    
    width: 30%;

    height: fit-content;
 }

#logof  img {
    width: 100%;
    height: fit-content;
    background-color: #1a1a1a5b;
    border-radius: 50%;
    box-shadow: 8px 9px 20px #1a1a1a;

    opacity: 1;
}

#logof h5 {
    font-size: 130% ;
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-family: 'Zen Dots', cursive;
    margin: 0;
    margin-left: 30px;
    margin-top: 6px;
}

#logof h6 {
    font-size: 110% ;
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
}

#contato {
    margin-right: -80vw;
    width: 50%;
    border-radius: 15px;
}

#contato h3 {
    padding-bottom: 15px;
    text-align: left;
    width: 70%;
    font-size: 140%;
    color: #cbd7e7;
    font-family: 'Ubuntu', sans-serif;
    margin: 0;
}

#contato ion-icon {
    color: white;
    font-weight: 700;
}