﻿/*.header .btn-getstarted,
.header .btn-getstarted:focus {
    color: var(--accentt-color);
    background: var(--contrast-color);
    font-size: 14px;
    padding: 8px 26px;
    margin: 0;
    border-radius: 4px;
    transition: 0.3s;
}

    .header .btn-getstarted:hover,
    .header .btn-getstarted:focus:hover {
        color: var(--accentt-color);
        background: color-mix(in srgb, var(--contrast-color), transparent 15%);
    }

.index-page.scrolled .header {
    --background-color: #19305a;
    --heading-color: #32353a;
    --nav-color: #d6dff1;
    --nav-hover-color: #ffffff;*/

:root {
    --color-secondary: #007EAD;
    --color-thrid: #949494;
    --color-remark:#EAB93E;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header {
    padding:0;
}
.index-page .header {
    --nav-color: rgba(255, 255, 255);
    max-height: 75px;
}
.header .menu-primary {
    margin-top:70px;
}
.header .logo img.normal {
    max-height: 85px;
    margin-right: 0px;
}
.header .logo img.scroll {
    max-height: 85px;
    margin-right: 0px;
    display:none;
}
.scrolled .header .menu-primary {
    margin-top: 0;
}
.scrolled .header .logo img.normal {
    display:none;
}
.scrolled .header .logo img.scroll {
    display: flex;
}

.header .btn-getstarted, .header .btn-getstarted:focus {
    font-size: 16px;
}

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Navmenu - Desktop */
@media (min-width: 1200px) {
    .navmenu a, .navmenu a:focus {
        /*font-size: 20px;*/
        font-weight: 400;
    }

    .navmenu li:hover > a,
    .navmenu .active,
    .navmenu .active:focus {
        color: var(--nav-hover-color);
    }
    .navmenu .a_1::before {
        content: "";
        display: block;
        width: 60px;
        height: 4px;
        background: var(--nav-hover-color);
        position: absolute;
        left: calc(50% - 30px);
        top:110%;
        bottom: 0;
        transition: 0.4s;
        transform: scale(0);
    }

    .navmenu li:hover .a_1::before {
        transform: scale(1);
    }

    .navmenu .dropdown ul {
        width: 290px;
    }

    .AvisosMobil {
        visibility:hidden;
        display:none;

    }
    /*----------Menu Secundario----------*/
    .header .menu-secundario {
        max-height: 30px;
    }

    .navsecondary a {
        font-size: 0.7rem;
        color: rgba(255, 255, 255,0.8);
    
    }
    .navsecondary .container div:hover > a{
        color:orangered;
    }
    .navsecondary .container div:hover > a,
    .navsecondary .active,
    .navsecondary .active:focus {
        color: var(--nav-hover-color);
    }

    .scrolled .header .menu-secundario {
        display:none;
        /*background: var(--accent-color);*/
    }

        .scrolled .header .menu-secundario .navsecondary a {
            font-size: 0.7rem;
            color: rgba(255, 255, 255,0.8);
        }
/*--------------------------------------------------------------
# Navigation sub menu
--------------------------------------------------------------*/

    .navmenu .dropdown.dropdown-hover .dropdown-menu {
        display: block;
        position: absolute;
        opacity: 0;
        transform-origin: 0 0;
        inset: 0 auto auto 0;
        /*margin-top: 2.8125rem !important;*/
        top: 87%;
        pointer-events: none;
        transform: scale(.95) !important;
        backface-visibility: hidden;
        will-change: transform, box-shadow;
    }
    .navmenu .dropdown.dropdown-hover:hover > .dropdown-menu, .navmenu .dropdown .dropdown-menu.show {
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
        transform: scale(1) !important;
    }

    .navmenu .dropdown .dropdown-menu:before {
        font-family: FontAwesome;
        content: "\f0d8";
        position: absolute;
        top: 0;
        left: 28px;
        right: auto;
        font-size: 22px;
        color: #fff;
        transition: top .35s ease;
    }
    .dropdown-header {
        display: block;
        padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);
        margin-bottom: 0;
        font-size: .875rem;
        color: var(--bs-dropdown-header-color);
        white-space: nowrap;
    }
    .font-weight-bolder {
        font-weight: 700 !important;
    }
    .dropdown-item {
        display: block;
        width: 100%;
        padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x) !important;
        clear: both;
        font-weight: 400;
        color: var(--bs-dropdown-link-color) !important;
        text-align: inherit;
        white-space: nowrap;
        background-color: transparent;
        border: 0;
        border-radius: var(--bs-dropdown-item-border-radius, 0);
    }
    .border-radius-md {
        border-radius: .375rem;
    }

}



/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.hero:before {
    background: color-mix(in srgb, var(--background-color), transparent 80%);
}
.hero video {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}
.hero .bg-transparent {
    opacity: 0.1 !important;
}

.hero .sign-up-form .offer {
    background-color: transparent;
    padding: 4px 10px;
    width: 100%;
}

    .hero .sign-up-form .offer span {
        color: var(--accent-color);
        opacity: 0.6;
    }

@media (max-width: 640px) {
    .hero .sign-up-form .offer {
        padding: unset;
    }
    .hero .sign-up-form {
        display:inline-block;
    }
}


/*--------------------------------------------------------------
# Clients Section
--------------------------------------------------------------*/
.destacados {
    padding: 20px 0;
}

    .destacados .destacados-logo {
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }

        .destacados .destacados-logo img {
            padding: 20px 40px;
            max-width: 90%;
            transition: 0.3s;
            opacity: 0.5;
            filter: grayscale(100);
        }

            .destacados .destacados-logo img:hover {
                filter: none;
                opacity: 1;
            }

.clients .destacados-logo img {
    padding: 5px 25px;
    max-width: 90%;
}
.clients {
    padding-top: 0;
    padding-bottom: 0;
}

    @media (max-width: 640px) {
        .destacados .destacados-logo img {
            padding: 20px;
        }

        .clients .destacados-logo img {
            opacity:1;
            filter:none;
        }

        #AvisosMobil {
            visibility:visible;
            display: block;
        }
    

    }
/*--------------------------------------------------------------
# oferta educativa Section
--------------------------------------------------------------*/
    .color-uteq-secondary {
    --color-uteq: #007EAD;
}
.color-uteq-yellow {
    --color-uteq: #EAB93E;
}
.color-uteq-grey {
    --color-uteq: #949494;
}
.color-uteq-green {
    --color-uteq: #9ec74c;
}
.color-uteq-pink {
    --color-uteq: #e93b7a;
}
.color-uteq-orange {
    --color-uteq: #ed6825;
}

.about .content h3 {
    background: color-mix(in srgb, var(--color-secondary), transparent 95%);
    color: var(--color-secondary);
}
.about .icon-box:hover {
    cursor:pointer
}
.about .icon-box:hover i {
background-color: var(--color-uteq);
}
.about .icon-box i {
    background-color: color-mix(in srgb, var(--color-uteq), transparent 95%);
    color: var(--color-uteq);
}
/*------------------------------------------------------------------------
                                Section Stats
------------------------------------------------------------------------*/
.stats .bg-transparent {
    opacity:0!important;
}
@media (min-width: 1200px) {
    .stats img {
        /*transform: scaleX(1.5);
    top: -500px;*/
        top: -80px;
        height: -webkit-fill-available;
    }
}

/*------------------------------------------------------------------------
                                Section features
------------------------------------------------------------------------*/
/*.features .features-item .features-img-bg img {
    height:max-content;
}*/

.features .features-item iframe {
    width: 100%;
    height: 90%;
    border: 6px solid var(--surface-color);
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
}
.features .features-item h3 {
    color:var(--color-remark);
}
/*-------------------------------------------------------------------------
    Section call to actio 
--------------------------------------------------------------------------*/
.call-to-action .call-to-action-item span {
    font-size: 48px;
    display: block;
    color: var(--default-color);
    font-weight: 700;
}



/*-------------------------------------------------------------------------
    Section footer
--------------------------------------------------------------------------*/
.footer .footer-about .logo {
    justify-content: space-around;
}
.footer .footer-about .logo img {
    max-height: 100px;
    margin-right: 6px;
}
.footer .footer-links .logo img {
    max-height: 100px;
    margin-right: 6px;
}
.footer .links-2 img {
    background: #949494;
    border-radius: 2px;
}
.heraldica .heraldica-logo img {
    padding: 5px 25px;
    max-width: 80%;
}

@media (max-width: 1199px) {}

.footer .footer-contact iframe {
    width: max-content;
    height: auto;
}

@media (min-width: 1200px) {
    .footer .footer-contact iframe {
        width: 180px;
        height: 100px;
    }
}


/*-------------------------------------------------------------------------
    Buttons Social Networks
__________________________________________________________________________*/
/*
        /* visibility: visible; */
/* opacity: 1;
*/
.scroll-top-social {
    --default-color: #ffffff;
}

.index-page.scrolled .scroll-top-social {
    --visibility-social-link: visible;
    --opacity-social-link: 1;
    --default-color: #212529;
}
.scroll-top-social {
    position: fixed;
    z-index: 999999;
    bottom: 50px;
    right: 6px;
}
    .scroll-top-social a {
        visibility: var(--visibility-social-link);
        opacity: var(--opacity-social-link);
        width: 40px;
        height: 40px;
        border-radius: 50%;
        border: 1px solid color-mix(in srgb, var(--default-color), transparent 30%);
        font-size: 16px;
        color: color-mix(in srgb, var(--default-color), transparent 30%);
        margin-right: 10px;
        transition: all 0.4s;
    }

        .scroll-top-social a:hover {
            color: color-mix(in srgb, var(--default-color), transparent 0%);
            border-color: 1px solid color-mix(in srgb, var(--default-color), transparent 0%);
        }

.index-page.scrolled .scroll-top-social a:hover {
    color: var(--accent-color);
    border-color: var(--accent-color);
}

.social-links {
    display:none!important;
}
