@charset "utf-8";

html {
    font-size: 16px;
    font-family: var(--font-Arimo);
    color: var(--main-white-color);
    height: 100%;
}

body {
    background-color: var(--main-dark-blue-color);
    font-family: var(--font-Arimo);
    color: var(--main-white-color);
    min-height: 100%;
    position: relative;
    margin: 0;
    padding-bottom:355px;
}


main {
    padding-top: 98px;
    min-height: calc(100vh - 355px);
}

footer {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height:355px;
}

a, a:hover {
    color: var(--main-white-color);
}

#cookieChoiceInfo a:hover {
    color: var(--main-dark-grey-color);
}

/* --------------------------------- COMPONENTES REUTILIZABLES ---------------------------------------- */


/* Btn principal invertido 
 * Normal: Tiene fondo naranja, letras blancas, bordes redondeados
 * Hover: Borde naranja, fondo transparente, letras blancas y bordes redondeados
 */
.md-main-btn-inverted {
    padding-top: 0.1rem;
    padding-bottom: 0.2rem;
    background-color: var(--main-dark-orange-color) !important;
    border-color: var(--main-dark-orange-color) !important;
    border-width: 4px;
    border-radius: 0.8rem;
    min-width: 6rem;
    color: var(--main-white-color) !important;
    box-shadow: none !important;
}

.md-main-btn-inverted:hover {
    background-color: transparent !important;
}


/* Ok Check */
.fa-check-circle {
    color: green;
}

/* Cross circle */
.fa-times-circle {
    color: red;
}

/* Cabecera de las páginas en el body */
.page-tittle {
    font-family: var(--font-paytone);
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.background-image-container {
    min-height: calc(100vh - 452px);
    background-size: cover;
}

.background-color-container {
    min-height: inherit;
    background-color: rgba(0, 36, 67, 0.4);
    background-size: cover;
}

#MainTopBar ul li a:hover, #cookieChoiceInfo a {
    color: var(--main-dark-orange-color);
}

.orange-paytone-font, .blue-paytone-font {
    font-family: var(--font-paytone);
}

.blue-font-color, .blue-paytone-font{
    color: var(--main-dark-blue-color);
}

.color-red {
    color: #e74c3c;
}


/*------------------------ Correctores de barra de menu ----------------------*/

.dropdown:hover > .dropdown-menu {
    display: block;
    top: 100%;
}

.dropdown-menu {
    margin: 0;
}



/* --------------------------------- Footer -------------------------------- */

#md-main-footer-container {
    border-top: 4px solid var(--main-white-color);
    padding-top: 1.605rem;
}

footer li a {
    font-size: 12px;
}

footer ul a span {
    padding-left: .4rem;
    color: var(--main-dark-orange-color);
    
}

footer ul{
    padding-left: .9rem;
}

footer li a:hover {
    text-decoration-line: none;
    padding-left: 2px;
    border-bottom: 1.5px solid var(--main-dark-orange-color);
}

.md-ul-left-border {
    border-left: 3px solid var(--main-dark-orange-color);
}

#logos-face-twitter {
    padding-top: 0.6rem;
    padding-left: 0.4rem;
}

#footer-logo-facebook {
    border-radius: 200px 200px 200px 200px;
    color: var(--main-dark-blue-color);
    background-color: var(--main-white-color);
    padding: 1px 7px;
}

#footer-logo-twitter {
    border-radius: 200px 200px 200px 200px;
    color: var(--main-dark-blue-color);
    background-color: var(--main-white-color);
    padding: 1px 5px;
}

#footer-logo-facebook:hover, #footer-logo-twitter:hover {
    background-color: var(--main-dark-orange-color);
    color: var(--main-white-color);
}

#footer-right-column {
    border: 2.5px solid var(--main-dark-orange-color);
    border-radius: 20px;
    padding: 4%;
    font-size: 13px;
    text-align: right;
}

#md-footer-image-row {
    margin-top: 1rem;
    background-color: var(--main-white-color);
}

#md-footer-image-row img {
    width: 100%;
}

#md-footer-image-container-fluid {
    background-color: var(--main-white-color);
}

/* Grow */
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
    -webkit-transform: scale(1.1);
    transition: all 1s;
    transform: scale(1.1)
}


@media screen and (max-width: 767px) {
    .md-nav-container {
        max-width: 540px;
    }

    #right-upper-ul {
        float: right;
        padding-right: 10%;
    }

    #footer-right-column {
        margin-top: 1.5rem;
    }

    footer .md-footer-row-content, #logos-face-twitter {
        margin-left: 35%;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {

    .md-nav-container {
        max-width: 720px;
    }

    #right-upper-ul {
        float: right;
        padding-right: 5%;
    }
}

@media screen and (min-width: 992px) and (max-width: 1198px) {
    .md-nav-container {
        max-width: 960px;
    }

    #right-upper-ul {
        float: right;
        padding-right: 5%;
    }
}

@media screen and (min-width: 1200px) {
    .md-nav-container {
        max-width: 1400px;
    }

    #right-upper-ul {
        float: right;
        padding-right: 10rem;
    }

    #MainBar .container:first-child {
        padding-left: 0;
        padding-right: 0;
    }

}