/*generales*/
body {font-family: 'Quicksand', sans-serif;}
img {max-width: 100%; height: auto;}
header {background: #0B2539;}

/*nav*/
.menu {text-transform:uppercase; font-weight: 700;}
.navbar-dark .navbar-nav .nav-link:hover {color: #21B6E2;}

/*base general*/ 
.logo-maj {width: 130px; height: auto;}


/*home*/
.seccion1 {background: #0B2539; padding: 90px 0px;}
h1 {font-family: 'Quicksand', sans-serif; font-size: 45px; font-weight: 700;}
.subtitulo {font-family: 'Quicksand'; font-size:32px; font-weight: 500;}
.oscuro {color: #0B2539;}
.claro {color: #21B6E2;}
.masclaro {color: #90CDE6;  margin: 0 0 5px 0;}
.blanco {color: #FFFFFF; margin: 40px 0 20px 0; font-weight: 700; font-size:20px;}
.btn-blanco {font-family: 'Quicksand', sans-serif; font-weight: 700; background: #FFFFFF; color: #003B5A; border-radius: 10px; padding: 10px 20px; margin: 20px 0px}
.btn-blanco:hover {background: #01080D; color: #B6E1F4;}
.btn-verde {font-family: 'Quicksand', sans-serif; font-weight: 700; background: #29B55D; color: #FFFFFF; border-radius: 10px; padding: 10px 20px; margin: 20px 10px}
.btn-verde:hover {background: #061A0D; color: #B6E1F4;}

/*servicios*/
.seccion2 {background: #21B6E2; padding: 70px 0px;}
h2 {font-family: 'Quicksand', sans-serif; font-size: 36px; font-weight: 700;}
.servicios {text-transform: uppercase; font-size: 22px; font-weight: 700;}
.serv-card {padding: 10px; background: #24CFFF;}
.parrafo {font-weight: 500; font-size: 18px;}
.iconoservicio {margin: 20px 0;}
h4 {font-family: 'Quicksand', sans-serif; font-size: 28px; font-weight: 500;}

/*marcas*/
.seccion3 {background: #A6E2F4; padding: 70px 0px;}
h3 {font-family: 'Quicksand', sans-serif; font-size: 32px; font-weight: 700; margin: 15px 0;}
.marcas {background: #FFFFFF;}

/*contacto*/
.seccion4 {background: #0B2539; padding: 70px 0px;}
h5 {color: #90CDE6; font-family: 'Quicksand', sans-serif; font-size: 28px; font-weight: 500; margin: 10px 0}
.subsubtitulo {font-family: 'Quicksand'; font-size:24px; font-weight: 500; line-height:20px; margin: 14px 0}
.info {font-size:18px; font-weight: 300;}
.icontacto {margin: 5px 5px 0px 0px;}

.saludo {color: #21B6E2; font-family: 'Quicksand', sans-serif; font-size: 28px; font-weight: 500;}

/*formulario*/ 
label, input, textarea {display:block; font-family: 'Quicksand', sans-serif; font-weight: 500;}
input, textarea {width: 100%; border: 1px solid #0B2539; padding: 5px; box-sizing: border-box;}
label {color: #90CDE6; margin: 15px 0 5px 0;}
textarea {height: 200px;}
.submit {font-family: 'Quicksand', sans-serif; font-weight: 700; text-transform: uppercase; background: #21B6E2; color: #F0F9FD; border-radius: 10px; padding: 10px 30px; border:0px; margin: 15px 0 0 0;}
.submit:hover {background: #01080D; color: #B6E1F4;} 
.error {color: red; font-size: 12px; margin: 0px;}


/*footer*/
footer {background: #003B5A; padding: 10px 0}
.pie {color: #ffffff; font-size: 12px;}
.redes {color: #ffffff; font-size: 20px; margin: 10px;}


/*botones flotantes*/
#iconos a {
    text-decoration: none;
}

.boton-top {position:fixed; bottom: 90px; right: 50px; color: #ffffff; font-size: 40px; opacity: 0.3;} 
.boton-top:hover {color: #445a64; opacity: 0.7;}

.icon-right {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 30px;
    right: 40px;
    background-color: #29B55D;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 10000;
    display: inline-grid;
    align-items: center;
    transition: 0.4s;
}

.icon-left {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 30px;
    left: 40px;
    background-color: #0076e3;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 10000;
    display: inline-grid;
    align-items: center;
    transition: 0.4s;
}

@media screen and (max-width: 450px) {
    .navbar-dark .navbar-nav .nav-link:hover {border-bottom: 0px;}
    h1 {font-size: 30px; color: #FFFFFF;}
    h2 {font-size: 28px;}
    h3 {font-size: 26px;}
    h4 {font-size: 24px;}   
    .subsubtitulo {font-family: 'Quicksand'; font-size:16px;}
    .subtitulo {font-family: 'Quicksand'; font-size:18px;}
    .blanco { margin: 60px 0 20px 0; font-size:16px;}
    .iconoservicio {margin: 5px 0;}
    }