/*subpainel  alert*/

.matriz_alert {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 75vh;
    overflow: hidden;
}

.sub_tela_alert_frame_1 {
    width: 95%;
    height: 100%;

    background-color: var(--fundo_5);
    overflow: hidden;
}


/* Subpainel Vpn */

.Matriz_Vpn {
    display: none;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    height: 75vh;

    overflow: hidden;
}

.Subtela_Vpn_1 {
    overflow: hidden;
}

.Matriz_Vpn .Subtela_Vpn_1 .Subtela_Vpn_frame_1,
.Matriz_Vpn .Subtela_Vpn_1 .Subtela_Vpn_frame_2 {

    width: 48vw;
    height: 100%;

    background-color: var(--fundo_5);
    overflow: hidden;
}

/*Data Center*/

.matriz_DataCenter {
    display: none;
    flex-direction: column;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.matriz_DataCenter .Subtela_Data_1 .Subtela_Data_frame_1,
.matriz_DataCenter .Subtela_Data_1 .Subtela_Data_frame_2 {

    width: 100%;
    height: 35vh;
    background-color: var(--fundo_5);
    overflow: hidden;
}


/*Fireware*/

.matriz_Firewall {
    display: none;
    flex-direction: row;
    width: 100%;
    height: 75vh;
    overflow: hidden;


}

.capitulo_1,
.capitulo_2 {
    width: 50vw;
    height: 75vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;

}


.Hardware {
    display: flex;
    width: 48vw;
    height: 100%;

    flex-direction: column;


    overflow: hidden;


}

.sessao_1 {

    width: 100%;

    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: column;
}

.sessao_2 {

    width: 100%;

    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-direction: row;
}

.tela_har_1 {
    width: 46vw;
    height: 35vh;

    background-color: var(--fundo_5);
}

.tela_har_1 iframe {
    width: 100%;
    height: 100%;
}


.tela_har_2,
.tela_har_3 {
    width: 23vw;
    height: 40vh;

    background-color: var(--fundo_5);
}

.tela_har_2 iframe,
.tela_har_3 iframe {
    width: 100%;
    height: 100%;
}



.trafegos {
    width: 48vw;
    height: 30vh;

    display: flex;
    background-color: var(--fundo_5);
    flex-direction: row;

}

.tela_traf_1 {
    width: 50%;
    height: 100%;
}


.tela_traf_2 {
    width: 50%;
    height: 100%;
}

.tela_traf_3 {
    width: 50%;
    height: 100%;
}


.tela_traf_1 iframe,
.tela_traf_2 iframe,
.tela_traf_3 iframe {
    outline: none;
    border: none;
    width: 100%;
    height: 100%;
}


.speed_teste {

    width: 48vw;
    height: 44vh;
    margin-top: 3vh;

    display: flex;
    background-color: var(--fundo_5);
    flex-direction: row;
    overflow: hidden;
}

.tela_spe_1,
.tela_spe_2 {
    height: 100%;


}

.tela_spe_1 iframe,
.tela_spe_2 iframe {

    width: 24.01366vw;
    height: 100%;
}


/*Ramais*/

.matriz_Ramais {

    display: none;
    justify-content: center;
}

.matriz_Ramais .Subtela_ramais_1 .Subtela_Ramais_frame_1 {

    width: 90vw;
    height: 75vh;

    background-color: var(--fundo_5);
}


/*CFTV*/

.matriz_CFTV {

    display: none;
    justify-content: center;
    flex-wrap: wrap;
}


.matriz_CFTV .Subtela_CFTV_1 .Subtela_CFTV_frame_1,
.matriz_CFTV .Subtela_CFTV_2 .Subtela_CFTV_frame_2,
.matriz_CFTV .Subtela_CFTV_3 .Subtela_CFTV_frame_3,
.matriz_CFTV .Subtela_CFTV_4 .Subtela_CFTV_frame_4 {

    margin: 1vw;
    background-color: var(--fundo_5);
    width: 38vw;
    height: 35vh;

}


/*Host*/


.matriz_hosts {
    width: 100vw;
    display: none;
    justify-content: center;
    flex-direction: row;
}

.host_2,
.host_3,
.host_4 {
    width: 22.5vw;

}

.host_2 .Subtela_2_1 .subtela_frame_1,
.host_2 .Subtela_2_2 .subtela_frame_2,
.host_2 .Subtela_2_3 .subtela_frame_3 {
    width: 100%;
    height: 25vh;
    background-color: var(--fundo_5);
}

.host_3 .Subtela_3_1 .subtela_frame_1,
.host_3 .Subtela_3_2 .subtela_frame_2,
.host_3 .Subtela_3_3 .subtela_frame_3 {
    width: 100%;
    height: 25vh;
    background-color: var(--fundo_5);
}

.host_4 .Subtela_4_1 .subtela_frame_1,
.host_4 .Subtela_4_2 .subtela_frame_2,
.host_4 .Subtela_4_3 .subtela_frame_3 {
    width: 100%;
    height: 25vh;
    background-color: var(--fundo_5);
}


.matriz_consumo_PDU {
    width: 100%;
    display: none;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    overflow: hidden;

}

.cap_1 {
    margin-top: 1vh;
}

.cap_1,
.cap_2,
.cap_3 {
    display: flex;
    flex-direction: row;
    width: 99vw;
    height: 25vh;
}

.cap_1 .sessao_1 {
    width: 49.5vw;
    background-color: var(--fundo_5);
}

.cap_1 .sessao_2 {
    display: flex;
    flex-direction: column;
    width: 49.5vw;
    background-color: var(--fundo_5);
}

.cap_1 .sessao_1 .subtela_PDU_1 .subtela_PDU_1_1 {
    width: 49.5vw;
    height: 25vh;
}

.cap_1 .sessao_2 .subtela_PDU_1 .subtela_PDU_1_1 {
    width: 49.5vw;
    height: 13vh;
    margin-bottom: -1vh;
}

.cap_1 .sessao_2 .subtela_PDU_2 .subtela_PDU_1_2 {
    width: 49.5vw;
    height: 13vh;
}


.cap_2 .sessao_1 {
    display: flex;
    flex-direction: row;
    width: 49.5vw;
    background-color: var(--fundo_5);
}

.cap_2 .sessao_2 {
    display: flex;
    flex-direction: row;
    width: 49.5vw;
    background-color: var(--fundo_5);
}

.cap_2 .sessao_1 .subtela_PDU_1 .subtela_PDU_1_1,
.cap_2 .sessao_1 .subtela_PDU_2 .subtela_PDU_1_2,
.cap_2 .sessao_1 .subtela_PDU_3 .subtela_PDU_1_3,
.cap_2 .sessao_1 .subtela_PDU_4 .subtela_PDU_1_4 {
    width: 12.375vw;
    height: 25vh;
}


.cap_2 .sessao_2 .subtela_PDU_1 .subtela_PDU_1_1 {
    width: 24.75vw;
    height: 25vh;
}

.cap_2 .sessao_2 .subtela_PDU_2 .subtela_PDU_1_2 {
    width: 24.75vw;
    height: 25vh;
}


.cap_3 .sessao_1 {
    width: 49.5vw;
    background-color: rgb(226, 226, 226);
}

.cap_3 .sessao_2 {
    width: 49.5vw;
    display: flex;
    flex-direction: row;
    background-color: var(--fundo_5);
}

.cap_3 .sessao_2 .esqueda {

    width: 50%;

}

.cap_3 .sessao_2 .direita {

    width: 50%;
    display: flex;
    flex-direction: column;
}

.cap_3 .sessao_1 .subtela_PDU_1 .subtela_PDU_1_1 {
    width: 49.5vw;
    height: 26vh;
}

.cap_3 .sessao_2 .esqueda .subtela_PDU_1 .subtela_PDU_1_1 {
    width: 24.75vw;
    height: 26vh;
}

.cap_3 .sessao_2 .direita .subtela_PDU_2 .subtela_PDU_1_2 {
    width: 24.75vw;
    height: 13vh;
    margin-bottom: -1vh;
}

.cap_3 .sessao_2 .direita .subtela_PDU_3 .subtela_PDU_1_3 {
    width: 24.75vw;
    height: 13vh;
}


#panel1,
#panel2,
#panel3,
#panel4,
#panel5,
#panel6,
#panel7,
#panel8 {

    animation: conteudoPrincipal2 2s ease;

}

@keyframes conteudoPrincipal2 {
    to {
        opacity: 1;
        transform: translateY(0vh);

    }

    from {
        opacity: 0;
        transform: translateY(10vh);
        overflow: auto;

    }

}