/* GENERAL */

html {
    font-family: 'Montserrat', sans-serif;
    background-color: #eaeaea;
/*    overflow: hidden;*/
}

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

#chat {
    overflow: hidden;
    position:fixed;
    bottom:0;
    right:0;
    width:350px;
    height:450px;
    pointer-events: auto;
}

#chat:hover {
    pointer-events: auto;
}


/* HEADER */
.header {
    display: flex;
    align-items: center;
    justify-content: center; 
}

.logo {
    width: 350px;
}

/*#iframe {
    width="50";
    height="50";
    frameBorder="0";
    pointer-events: auto;
}*/

/*#chat.clicked {
    width:350px;
    height:430px;
    pointer-events: auto;
}*/

iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* BODY */

.container {
    flex-direction: row;
 
    max-width: 1920px;
    width: 100vw;
    box-shadow: inset 0 0 0 10000px rgba(32, 136, 194, 0.8);
    height: 500px;
    margin-top: 50px;
}

.bg1{
    background: url("https://portalrh.sesisenaisp.org.br/arte/img/S1.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;

}

.bg2{
    background: url("https://portalrh.sesisenaisp.org.br/arte/img/S2.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;

}

.bg3{
    background: url("https://portalrh.sesisenaisp.org.br/arte/img/S3.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;

}

.bg4{
    background: url("https://portalrh.sesisenaisp.org.br/arte/img/S4.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;

}




.text {
    margin-top: 50px;
    padding-bottom: 3rem;
    width: 80vw;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.5em;
    color: #eaeaea;
    font-weight: 500;
}

.box-container {
    display: flex;
    align-items: center;
    justify-content: center;
    /* justify-content: space-between; */
    margin-left: auto;
    margin-right: auto;
    width: 40%;
}
.box {   
    background-color: #eaeaea;
    width: 300px;
    height: 300px;
    margin: 30px;
    padding: 30px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    font-size: 2vw;
    font-weight: 800;
    line-height: 1.6;
    color: #2088c2 ;
    text-align: center;
}

.box:hover{   
    background-color: #4c4c4c;
    color: #eaeaea ;
    transition: all 0.3s ease;
}

.acesso:hover{   
    background-color: #6b6a6a;
    border-color: #6b6a6a;
    color: #eaeaea ;
    transition: all 0.3s ease;
}

/* VUETIFY */

.acesso {
    background-color: #2088c2;
    border-color: #2088c2;
    position: relative;
    bottom: -45px;
    height: 56px;
    font-size: 1.5rem;
    text-transform: none;
    border-radius: 40px;
}

.rcw-link{
    color: white;
}

.rcw-link:hover{
    color: black;
}

/*@media (max-width: 1080px) {
	.text {font-size: 4vmax;}
}*/

@media (max-width: 640px) {
.theme--light.v-btn:not(.v-btn--flat):not(.v-btn--text):not(.v-btn--outlined) {
    bottom: -26px;
}

#chat {
    overflow: hidden;
    position:fixed;
    bottom:0;
    right:0;
    width:150px;
    height:430px;
    pointer-events: auto;
}


    .text {
        font-size: 4vw;
        width: 90vw;
        padding-bottom: 1rem;
    }
    
    .box {   
        background-color: #eaeaea;
        width: 50vw;
        height: 50vw;
        margin: 10px;
        padding: 10px;
        font-size: 5vw;

}