* {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', 'Times New Roman', Times, serif, 'Gill Sans', 'Gill Sans MT';

}

body {
    background: linear-gradient(rgba(151, 192, 204, 0.5), rgba(100, 133, 218, 0.582)),
        url(../imginicio/fondo3.webp );
    background-repeat: no-repeat;
    background-size: cover;
    box-sizing: border-box;

}
/* barra de desplazamiento*/
body::-webkit-scrollbar{
    width: 10px;
    background-color: rgba(13, 96, 198, 0.62);
    
}
body::-webkit-scrollbar-thumb{
    background-color: rgb(34, 112, 202);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}
#tituloVideo{
    color: #fff;
}
#textVideo{
    color: #fff;
    padding: 5vh;
    text-align: center;
}
#iniciarsesion {
    width: 30%;

}

.parrafo {
    color: #ffffff;
    text-align: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.parrafo p {
    margin: 1% 3% 3% 1%;
    color: #ffffff;
    text-align: start;
    margin-left: 2vw;
}


#principal h2 {
    text-align: center;
    margin-bottom: 2vh;
}


.parrafo {
    background: linear-gradient(330deg, rgba(81, 201, 241, 0.483), rgba(129, 151, 207, 0.281));
    padding: 2vh;
}



.video {
    border-radius: 5px;
    max-width: 100%;
}
.imgLogo{
    width: 90%;
    margin:1vw 5vw 1vw 5vw;
}
/*formulariodecontacto*/
.container.contactenos {
    text-align: center;
    font-size: 130%;
    font-family: 'Helvetica', Arial, serif;
}

.container.contactenos h2 {
    margin-bottom: 25px;


}

.container.contactenos h5 {
    font-size: 100%;
}

#nombre {
    width: 80%;
    height: 35px;
    margin-bottom: 30px;
    border-radius: 4px;
    max-width: 550px;
    padding-left: 10px;
    font-family: 'Helvetica', Arial, serif;
}

#telefono {
    width: 80%;
    height: 35px;
    margin-bottom: 30px;
    border-radius: 4px;
    max-width: 550px;
    padding-left: 10px;
    font-family: 'Helvetica', Arial, serif;
}

#email {
    width: 80%;
    height: 35px;
    margin-bottom: 30px;
    border-radius: 4px;
    max-width: 550px;
    padding-left: 10px;
    font-family: 'Helvetica', Arial, serif;
}

#mensaje {
    width: 80%;
    height: 145px;
    margin-bottom: 30px;
    border-radius: 4px;
    max-width: 550px;
    padding-left: 10px;
    padding-top: 10px;
    font-family: 'Helvetica', Arial, serif;
}

#boton {
    background-color: rgb(34, 112, 202);
    width: 25%;
    max-width: 200px;
    border-radius: 4px;
    border-color: rgba(10, 10, 100, 0.521);
    font-size: 100%;
    cursor: pointer;
    color: #fff;
    height: 40px;
}

#boton:hover {
    background-color: rgba(8, 144, 185, 0.795);
    border-color: rgb(77, 118, 231);
}



/*tamaño compu o tele*/
@media screen and (min-width:1401px) {
    #principal {
        display: grid;
        gap: 1vw;
        /*grid-template-rows: repeat(2 1fr);*/
        grid-template-columns:60% 40%;
        margin: 10vh 10vh 0vh 10vh;
        font-size: 150%;
    }
    .parrafo {
        padding: 2vh;
    }
}

/*tamaño tablet*/
@media screen and (min-width:1000px) and (max-width:1400px) {


    #principal {
        display: grid;
        gap: 0.5vw;
        grid-template-columns:70% 30%;
        margin: 10vh 1vh 0vh 1vh;
    }
    .parrafo {
        padding: 0vh;
    }

}

/*para tamaño telefono*/
@media screen and (max-width:999px) {
    #principal {
        margin: 5vh 1vh 0vh 1vh;
    }

}