 /********************************************/
/*                  CLASS                   */
.section-center {/*TAG: section*/
    display: flex; flex-direction: column; width: 70%; margin: auto;
}
.section-center-calendario {
    width: 99%;
}
.container-section {
    background-color: bisque;
    justify-content: center;
    padding: 6vh 0vw;
    display: grid;
}
.display-container { margin: 0vh 2vw; }
.div-container {
    /*margin: 0vh auto 2vh auto;*/
    margin: 0vh 4vw 2vh 4vh;
    /*margin-top: 3vh;*/
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}.h2-section { margin-bottom: 2vh; }

.div-container-auxiliares {
    text-align: center;
    /*display: inline-grid*/ 
}
/*.p-ul-section {}*/
.ul-aux-container {
    letter-spacing: 2px;
    /*display: flex;
    align-items: center;
    justify-content: center;*/

    /*justify-items: center; /*(text-align substitui) alinha ao centro da UL*/
    /*justify-content: center; /*alinha os componentes ao centro página*/
}

.li-aux-container {
    list-style: none;
    margin: 2vh 2vw;
    /*display: flex;
    justify-content: center;*/
}
/*.i-aux-section{ }*/
.a-aux-container {
    /*font-size: var(--fontsz-m);*/
    text-decoration: none;
    color: gray;
}.a-aux-container:hover{ opacity: 0.5; }




 /************************ CARROSSEL SECTION ******************/
.carrossel-container { /*posicionar no meio e adionar texto*/
    position: relative;
    margin: 15px auto;
    width: 90%;
    height: 75vw;
    /*
    display: flex;
    justify-content: center;
    */
    /*max-width: 800px;*/
    overflow-y: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
}
.carrossel-slide {
    display: flex;
    width: 100%;
    transition: transform 0.5s ease-in-out;
    /*background-image: url('../images/logofatec.png');
    height: 30vh;*/
}
.slide {
    min-width: 100%;
    height: 75vw;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2em;
    color: white;
    border-radius: 10px;
    background-size: cover;
    background-position: center;
}
.prev, .next {
    position: absolute;
    cursor: pointer;
    top: 50%;     width:50px;     height: 50px;
    margin-top:-25px;
    color: white;
    font-weight: bold;     font-size: 18px;
    transition:background-color 0.3s ease;
    background-color: rgba(0, 0, 0, 0.5);
    border: none;    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.prev {
    left: 10px;
}
.next {
    right: 10px;
}
.prev:hover, .next:hover {
     background-color: rgba(0, 0, 0, 0.8);
}
.pagination-carrossel {
    text-align: center;
    position: absolute;
    bottom: 20px;
    width: 100%;
}
.dot {
    cursor: pointer;
    height: 12px;
    margin: 0 5px;
    width: 12px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.3s ease;
}
/*.active-carrossel-container{}*/
.dot:hover {
    background-color: #717171;
}
.text-laboratorio {
    /*margin-right: 5vw;*/
    padding: 30px;
    /*width: 40%;*/
    text-align: justify;
    display: flex;
    align-items: center;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}


/**************** PAGE 2 - RESERVAS.HTML*********************/
.reserva-cad input[type="text"], input[type="datetime-local"], input[type="time"], input[type="number"], input[type="email"],
   textarea[id="solicitacoes"],
    label[for="curso"], label[for="depart"], label[for="resp"], label[for="prof"], label[for="reserva-data"], label[for="reserva-hora"], label[for="num-alunos"], label[for="inputOthers"], label[for="email-resp"], label[for="email-resp"], label[for="solicitacoes"] {/* todo input dentro da class receberá o stylo*/
    width: 99%;
    padding: 12px;
    margin: 8px 0px;
}.reserva-cad { margin-top: 20px;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: large;
}.reserva-cad .titulo-informativo {
    font-weight: 600;
    font-size: x-large;
    padding: 5px 0px;
}p[id="legenda-simbolos"] { font-size: x-large;}
button[id="btn-submit"] { width: 100%; padding: 20px; display: flex; justify-content: center; align-items: center; }



/*#programs input[type="text"]{ padding: 10px 0px; }*/

/*#curso, #depart, #resp, #prof, #reserva, #reserva-hora, #num-alunos { padding: 12px; }*/

/*#others[id=outhers]{ margin-left: 20px; width: 80%;} diferencia dos outros inputs*/
#adendo-forms { font-size: small; color: tomato;}
fieldset {
    padding: 25px;
}
.atendimento-cad, input[type="text"] { /* pagina de atendimento */
    width: 94%;
    padding: 12px;
    margin: 8px 0px;
    font-family: Arial, Helvetica, sans-serif;
}
textarea[id=mensagem]{ /* pagina de atendimento */
    width: 93%;
    padding: 15px;
    font-size: large;
}
textarea[id="solicitacoes"] {
    width: 98%;
    height: 100px;
    padding: 15px;
    font-size: large;
}
button {
    width: 100px;
    height: 30px;
    border: none;
    border-radius: 10px;
    color: white;
    background-color: cadetblue;
    
}button:hover {
    opacity: 0.7;
}
div[class="grade-lab"]{
    margin: auto;
    padding: 0px 10px;
    width: 98%;
}

 /****************************************/
/*                  IDs                 */

div[id="edificios-container1"], div[id="edificios-container2"] { text-align: center; }
/*div[id="hidraulica-container"], div[id="pavimentacao-container"] { margin-top: 2vh; }*/

#b-aux-container { /*margin: auto;*/opacity: 0.7; font-size: var(--fontsz-x);}
/*#div-container2{ padding-left: 0vh 2vw; }*/
img[id="gradeAula"] { width: 100%; }


/*   -->   IDs CALENDÁRIO SEMESTRE   -->   */
#h2-calendario-semestre {
    color:chocolate;
    font-family: Arial, Helvetica, sans-serif;
    margin: 20px 5px 20px 5px;
    text-align: center;
}
#p-calendario-semestre {
    font-family: Arial, Helvetica, sans-serif;
    margin: 20px 5px 20px 5px;
}
#img-calendario-semestre {
    width: 100%;
}

/*   <--   fim IDs Calendário   <--   */