/* Global */


    @font-face {
        font-family: 'Avenir';
        src: url("../font/Walrus-Bold.woff") format('woff'), 
        url("../font/Walrus-Bold.ttf")  format('truetype');
    }



    /* @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap'); */
    @import url('https://fonts.googleapis.com/css2?family=Dosis:wght@200;300;400;500;600;700;800&display=swap');

    body {
        text-rendering: optimizeLegibility;
    }

    h1, h2, h3, h4, h5 {
        font-family: 'Dosis', sans-serif;
    }

    p, span {
        font-family: 'Dosis', sans-serif;
    }

    .align-center{
        display: flex;
        align-items: center;
    }

    .punto-izq{
        background: linear-gradient(120deg, rgba(0,66,132,1) 20%, rgba(6,119,174,1) 70%); 
        padding: 3px; 
        width: 0px; 
        margin-right: auto; 
        border-radius: 10px;
    }

    .punto-dcho{
        background: linear-gradient(120deg, rgba(0,66,132,1) 20%, rgba(6,119,174,1) 70%); 
        padding: 3px;
        width: 0px;
        margin-left: auto;
        border-radius: 10px;
    }

    .punto-izq-2{
        background: linear-gradient(120deg, rgba(28,184,184,1) 20%, rgba(6,119,174,1) 70%); 
        padding: 3px; 
        width: 0px; 
        margin-right: auto; 
        border-radius: 10px;
    }

    .punto-dcho-2{
        background: linear-gradient(120deg, rgba(28,184,184,1) 20%, rgba(6,119,174,1) 70%); 
        padding: 3px;
        width: 0px;
        margin-left: auto;
        border-radius: 10px;
    }

    .punto{
        background: linear-gradient(120deg, rgba(0,66,132,1) 20%, rgba(6,119,174,1) 70%); 
        padding: 3px;
        width: 0px;
        border-radius: 10px;
    }

    .footer {
        background: linear-gradient(20deg, #0677ae 5%, #000000 50%, #0b8ec1 90%);
        /* background: #000033; */
        padding: 100px;
    }

    .btnsecondary{
        background: #004284;
        color: #fff;
        border: 0px;
        border-radius: 10px;
        font-family: 'Dosis', sans-serif;
        font-weight: 700;
        height: 40px;
        width: 25%;
        margin: 10px;
    }
    .btnsecondary:hover{
        background-color: #1cb8e8;
        transition: 0.5s;
        color: #000;
    }

/* Fin Global */



/* Header */
    .cabecera {
        position: fixed;
        z-index: 100;
        width: 100%;
        height: 100px;
        background: linear-gradient(30deg, #004284, #000000, #45ccf6);
        display: flex;
        justify-content: space-evenly;
        align-items: center;
        clip-path: polygon(0% 0%, 100% 0%, 100% 15%, 65% 75%, 50% 100%, 35% 75%, 0% 15%);
        transition: all ease 0.5s;
        font-family: 'Dosis', sans-serif;
    }
    header .logo {
        font-size: 48px;
        /* display: none; */
    }

    header ul li {
        display: inline-block;
    }

    header ul li a {
        font-size: 14px;
        font-weight: 900;
        text-decoration: none;
        color: #fff;
        text-transform: uppercase;
        margin: 0 15px;
        opacity: 0;
        transition: all ease 0.5s;
    }

    .link-list:hover {
        color: #ccc;
        text-decoration: none;
    }

    header img{
        margin: 0 15px;
        opacity: 0;
        transition: all ease 0.5s;
    }
    header.sticky img{
        opacity: 1;
    }

    header.sticky {
        clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 65% 75%, 50% 100%, 35% 75%, 0% 75%);
    }

    header.sticky ul li a{
        opacity: 1;
    }

/* Fin HEADER */



/* Inicio */
    .sec-inicio{
        align-items: center;
        background-image: url('../images/prube.png');
        background-position: bottom;
        background-repeat: no-repeat; 
        background-size: cover; 
        /* background: linear-gradient(30deg, #fff, #fff); */
        display: flex; 
        height: 670px;
    }

    .linea-inicio{
        border: 1px solid #0677ae; 
        margin-left: auto; 
        margin-right: auto;
        opacity: 0.2;
    }

    .azul-osc{
        border: 1px solid #0677ae;
    }

    .azul-med{
        border: 1px solid #0b8ec1;
    }

    .azul-cla{
        border: 1px solid #1cb8e8;
    }

    .tam-linea-1{
        width: 91%;
        margin-left: auto;
        margin-right: auto;
        opacity: 0.5;
    }

    .tam-linea-2{
        width: 91%;
        margin-left: auto;
        margin-right: auto;
        opacity: 0.5;
    }

    .img-logo-partes{
        width: 70%; 
        position: absolute; 
        /* margin-top: -100px; */
    }

/* Fin Inicio */



/* Servicios */
    #sec-servicio{
        position: absolute;
        margin-top: -70px;
    }
    .sec-servicio {
        background-image: url('../images/prube2.png'); 
        background-position: top;
        background-repeat: no-repeat; 
        background-size: cover; 
        padding: 130px 50px 130px; 
    }

    .title-servicio{
        font-size: 50px; 
        text-align: center;
        color: #004284;
        font-family: 'Dosis', sans-serif !important;
    }

    .cuadro-servicio{
        background: white;
        border: 1px solid #ccc; 
        border-radius: 5px;
        height: 200px;
        padding: 35px; 
    }

    .sub-servicio{
        color: #fff; 
        font-size: 20px; 
        font-family: 'Dosis', sans-serif !important;
        font-weight: 600;
        text-align: center; 
    }

    .icon-servicio{
        font-size: 50px; 
        margin-bottom: 30px;
        color: #004284;
    }

    #cua-serv{
        margin-top: -130px;
    }

/* Fin Servicios */



/* Vaquita */

    .sec-vaquita {
        background: #FECE33;
        padding: 80px;
    }

    .pf-vaquita {
        color: black;
        text-align: center;
        font-size: 55px;
        font-weight: 900;
        /* padding: 40px; */
        font-family: "Avenir" !important;
        text-transform: uppercase;
    }

    .row-vaquita {
        display: flex;
        align-items: center;
        text-align: center
    }

    .img-phone {
        text-align: center;
        width: 70%;
    }

    .btn-vaquita {
        position: relative;
        display: block;
        color: #fff !important;
        font-size: 14px !important;
        text-decoration: none;
        border: 0px solid #35a64d !important;
        background-color: #35a64d;
        padding: 10px 25px !important;
        text-transform: uppercase;
        overflow: hidden;
        transition: 1s all ease;
        font-family: 'Avenir';
        font-weight: 900 !important;
        border-radius: 10px;
    }

    .btn-vaquita::before {
        background: #57d172;
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: -1;
        transition: all 0.6s ease;
        color: #000 !important;
    }

    .btn-vaquita-1::before {
        width: 100%;
        height: 0%;
        font-size: 11px;
        transform: translate(-50%, -50%) rotate(45deg);
        color: #000 !important;
    }

    .btn-vaquita-1:hover::before {
        height: 380%;
        color: #000 !important
    }

    #phone-slider{
        height: 450px
    }
/* Fin Vaquita */



/* Cliente */
    #sec-cliente{
        position: absolute; 
        margin-top: -70px;
    }

    .sec-cliente {
        background: #004284;
        padding: 60px;
    }

    .title-cliente {
        font-size: 50px;
        text-align: center;
        color: #f8f8f8;
    }

    .clientes {
        position: relative;
        border-radius: 5px;
        padding: 10px;
        padding-top: 5px;
        padding-bottom: 5px;
        margin: 10px;
        width: 60%;
    }

    .linea-clientes{
        border-bottom: 1px solid #1cb8e8; 
        border-right: 1px solid #1cb8e8; 
        border-bottom-style: dashed; 
        border-right-style: dashed;
    }

    .linea-clientes-2{
        border-bottom: 1px solid #1cb8e8; 
        border-bottom-style: dashed;
    }

    .linea-clientes-3{
        border-right: 1px solid #1cb8e8; 
        border-right-style: dashed;
    }

    #logo-cliente{
        width: 100%; 
        position: absolute; 
        right: 0; 
        left: 0; 
        top: -30px;
    }

    .logo-clientes{
        width: 70%;
    }

    .row-cliente {
        display: flex;
        align-items: center;
        text-align: center
    }

/* Fin Cliente */



/* Contacto */
    #sec-contacto{
        position: absolute; 
        margin-top: -70px;
    }
    .sec-contacto {
        background: #f8f8f8;
        padding: 45px;
        padding-bottom: 45px;
    }

    .title-contacto {
        font-size: 50px;
        text-align: center;
        color: #004284;
    }

    .sub-contact {
        font-size: 17px;
        font-weight: 600;
        color: #0b8ec1;
        text-align: center;
    }

    .pf-contact {
        font-size: 13px;
        font-weight: 300;
        color: #000;
        text-align: center;
    }

    .icon-contact {
        font-size: 40px;
        padding-bottom: 10px;
        color: #1cb8e8;
    }

    .cuadro-contact {
        padding: 15px;
        border: 1px solid #004284;
        background: #fff;
        border-radius: 10px;
        text-align: center;
        margin-bottom: 10px;
        height: 150px;
        /* box-shadow: 5px 5px 5px #004284 */
    }

    .form-style{
        border: 0px !important;
        font-weight: 100 !important;
        border-bottom: 1px solid #ccc !important;
        font-family: 'Barlow Condensed', sans-serif !important;    
        font-size: 15px !important;
        border-radius: 3px !important;
        background: #fff !important;
        height: 40px !important;    
        border-top-left-radius: 7px !important;
        border-bottom-left-radius: 5px !important;
        border-top-right-radius: 7px !important;
        border-bottom-right-radius: 5px !important;
    }

    .textarea-style{
        border: 0px !important;
        font-weight: 100 !important;
        border-bottom: 1px solid #ccc !important;
        font-family: 'Barlow Condensed', sans-serif !important;    
        font-size: 15px !important;
        border-radius: 3px !important;
        background: #fff !important;
        height: 60px !important;
    }

    .style-form{
        padding-left: 200px; 
        padding-right: 200px;
    }
    .form-cuadro{
        padding-top: 15px; 
        padding-left: 100px; 
        padding-right: 100px;
    }

/* Fin Contacto */