@font-face {
    font-family: 'Roboto-Regular';
    src        : url('/fonts/Roboto-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Roboto-Bold';
    src        : url('/fonts/Roboto-Bold.woff2') format('woff2');

}

@font-face {
    font-family: 'Roboto-light';
    src        : url('/fonts/Roboto-Light.woff2') format('woff2');

}

@font-face {
    font-family: 'Roboto-Condensed';
    src        : url('/fonts/RobotoCondensed.woff2') format('woff2');

}

/* ====== Paleta de colores ====== */
:root {
    --links      : #016ca2;
    --etiquetas  : #e0e6e9;
    --negro      : #000000;
    --blanco     : #FFFFFF;
    --footer-gray: #333333;
    --rojo-unav  : #ee2605;
    --transition : all 300ms;
    --nav-text   : #898989;
    --links-hover: #3489bf;
}

body {
    font-family: 'Roboto-Light';
}




.recent-item {
    display       : flex;
    height        : 500px;
    flex-direction: column;
    padding       : 1rem 1rem;



    .recent-categories {
        height         : 18%;
        display        : flex;
        justify-content: flex-start;
        align-items    : flex-end;
        flex-wrap      : wrap;
        flex-direction : row;
        padding        : 1rem 6px;
    }

    .cat-etiqueta {
        background: var(--etiquetas);
        margin    : 0;
        padding   : 5px 8px;
        margin    : 0px 2px 0px 0px;

    }

    .recent-object {
        height         : 82%;
        display        : flex;
        justify-content: center;
        align-items    : center;
        flex-direction : column;
        gap            : 1rem;
    }

    .recent-object-title {
        height: 10%;
        margin-top: 1rem;
    }

    .recent-object-title h4 {
        margin: 0;
        font-family: 'Roboto-Condensed' !important;
        font-weight: 700;
    }

    .recent-object-cover {
        height: 80%;
    }

    .recent-object-cover img {
        height   : 100%;
        max-width: 200px;
        max-height: 290px;
    }

    .recent-object-links {
        height         : 10%;
        display        : flex;
        justify-content: center;
        flex-wrap      : wrap;
        gap            : 1rem;
        align-items    : flex-start;
        flex-direction : row;
    }

    .recent-link {
        font-family    : 'Roboto-light';
        color          : var(--links);
        text-decoration: none;
        transition: var(--transition);
    }

    .recent-link:hover {
        transition: var(--transition);
        text-decoration: underline;
        color: var(--links-hover);
    }
}

.footer {
    padding: 0 !important;

    .container {
        width : 100%;
        margin: 0;
    }

    .footer-redes {
        background     : var(--etiquetas);
        height         : 80px;
        padding        : 0 !important;
        display        : flex;
        justify-content: center;
        align-items    : center;
        flex-direction : row;
        gap            : 1rem;
    }

    .redes-icon {
        max-width   : 40px;
        border-left : 1px solid var(--footer-gray);
        height      : 25px;
        padding-left: 6px;
    }

    .redes-icon-last {
        max-width   : 40px;
        border-left : 1px solid var(--footer-gray);
        border-right: 1px solid var(--footer-gray);
        height      : 25px;
        padding     : 0px 6px;
    }

    .footer-info {
        background     : var(--footer-gray);
        padding        : 2em 10em;
        width          : 100%;
        display        : flex;
        justify-content: center;
        align-items    : center;
        flex-direction : row;
        flex-wrap      : wrap;
        color          : #FFFFFF;
    }

    .title-info {
        font-size  : 1.8rem;
        font-weight: bold;
    }

    .info-contact {
        display        : flex;
        justify-content: center;
        align-items    : center;
        flex-direction : column;
        gap            : 1rem;
    }
    .info-logo{
        .info-logo-img{
            max-width: 180px;
        }
    }

    .contact-btn {
        border    : 2px solid var(--blanco);
        width     : 100%;
        text-align: center;
        padding   : 5px;
        transition: var(--transition);

    }

    .contact-btn:hover {
        border    : 2px solid var(--negro);
        width     : 100%;
        background: var(--blanco);
        color     : var(--negro);
        transition: var(--transition);

        a{
            color: var(--negro);
        }

        .contact-btn-icon{
            filter: invert(1);
            transition: var(--transition);
        }
        
    }

    .contact-btn-icon{
        max-width: 20px;
        max-height: 20px;
        margin-right: 5px;
        transition: var(--transition);
    }
    


    .footer-license {
        background: var(--negro);
        padding   : 1em;
    }

    .license-links {
        display        : flex;
        justify-content: center;
        align-items    : center;
        flex-wrap      : wrap;
    }

    .links-text {
        color: var(--blanco);
    }

    .links-text-link {
        display        : flex;
        justify-content: flex-end;
        align-items    : center;
        gap            : 1rem;
        flex-wrap      : wrap;
    }

    .links-text-link a,
    a {
        color     : var(--blanco);
        transition: var(--transition);
    }

    .links-text-link a:hover,
    a:hover {
        color          : var(--links-hover);
        transition     : var(--transition);
        text-decoration: none;
    }

    .links-license {
        text-align: center;
        color     : var(--blanco);
    }

    .col-md-12 {
        padding: 0 !important;
    }


}

.footer-unav {
    width  : 100%;
    padding: 0 !important;
}

.separador {
    border-bottom: 2px solid var(--footer-gray);
    text-align   : center;
    margin       : 2rem 0rem;
    font-family  : 'Roboto-Bold';

    h2{
        font-size: 18px;
        font-family: 'Roboto-Condensed';
        text-transform: uppercase;
    }
}

.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus {
    color: var(--negro);
    text-decoration: none;
    background-color: var(--etiquetas);
    font-weight: bold;
    transition: var(--transition);
}

.dropdown-menu>li>a, .dropdown-menu>li>a {
    transition: var(--transition);
}

.breadcrumb > li + li:before {
    padding: 0 5px;
    color: #ccc;
    content: ">\00a0";
}

.breadcrumb {

    background-color: transparent;
    padding: 8px 0px;

}

/* ====== Dispositivos móviles (Punto de quiebre OJS) (hasta 991px) ====== */
@media (max-width: 772px) {

    .footer {
        .links-text-link {
            display        : flex;
            justify-content: center;
            align-items    : center;
            gap            : 1rem;
            flex-wrap      : wrap;
        }

        .info-dir {
            text-align: center;
        }
    }

    .navbar .container-fluid {
        padding   : 0;
        background: var(--etiquetas);
    }

    .navbar-default .nav>li>a, .header_view .nav>li>a {
        color: var(--nav-text);
        font-family: 'Roboto-Regular';
        font-weight: normal;
        transition: var(--transition);
    }
    .navbar-default .nav>li>a:hover, .header_view .nav>li>a:hover {
        color: var(--negro);
        font-family: 'Roboto-Regular';
        font-weight: normal;
        text-decoration: underline;
        transition: var(--transition);
        background: none;
    }

    .navbar-toggle {
        position: absolute;
        float: right;
        padding: 11px 10px;
        margin-right: 0;
        margin-top: 12px;
        top: calc(9vw - -9.25vw);
        left: 10px;
        margin-bottom: 13px;
        background-color: var(--nav-text);
        background-image: none;
        border: 1px solid var(--negro);
        border-radius: 4px;
    }

    .container>.navbar-header,
    .container-fluid>.navbar-header,
    .container>.navbar-collapse,
    .container-fluid>.navbar-collapse {
        margin-right: 0;
        margin-left : 0;
        position    : relative;
    }

    .navbar-brand {
        padding: 0;
        height : auto;
    }

    .navbar-brand-logo img {
        max-height: 100%;
        width     : 100vw;
        height    : auto;
    }

    .buscador {
        display         : flex;
        justify-content : center;
        align-items     : center;
        width           : 100%;
        margin-top      : 1rem;
        margin-bottom   : 1rem;
        padding-left    : 4rem;
        background-color: var(--etiquetas);

        .buscador-form {
            display        : flex;
            justify-content: center;
            align-items    : center;
            width          : 80%;
            position       : relative;
        }

        .buscador-input {
            width  : 100%;
            padding: 5px 45px 5px 5px;
        }

        .buscador-boton {
            position  : absolute;
            right     : 0;
            background: none;
            border    : none;
        }

        .icon-lupa {
            max-width : 30px;
            height    : auto;
            margin-top: 3px;
        }
    }

}

/* ====== Escritorio (Punto de quiebre OJS)(Desde 992px) ====== */
@media (min-width: 773px) {

    .navbar .container-fluid {
        padding    : 0;
        font-family: 'Roboto-Light';
        color      : var(--nav-text);
        font-size: 18px;
    }

    .col-md-9 {
        width: 100%;
        padding: 0em 5em;
    }

    .navbar>.container-fluid .navbar-brand {
        margin-left: 0px;
    }

    .nav .open>a,
    .nav .open>a:hover,
    .nav .open>a:focus {
        background-color: none;
    }

    .navbar-default .nav>li>a:hover,
    .navbar-default .nav>li>a:focus,
    .navbar-default .nav>li>a:active,
    .header_view .nav>li>a:hover,
    .header_view .nav>li>a:focus,
    .header_view .nav>li>a:active {
        color          : #000;
        background     : none;
        text-decoration: underline;
        transition     : var(--transition);
    }

    .navbar-default .nav>li>a,
    .header_view .nav>li>a {
        color      : var(--nav-text);
        background : none;
        font-weight: normal;
    }

    .navbar-brand-logo img {
        max-height: 100%;
        width     : 100%;
    }

    .navbar-header {
        float: none;
        width: 100%;
    }

    .navbar-brand {
        float      : none;
        height     : auto;
        padding    : 0;
        font-size  : 19px;
        line-height: 21px;
    }

    .navbar-default .navbar-collapse,
    .navbar-default {
        background-color: var(--etiquetas);
    }

    #nav-menu,
    .navbar-collapse.collapse {
        display        : flex !important;
        justify-content: center;
        align-items    : center;

    }

    .buscador {
        display        : flex;
        justify-content: center;
        align-items    : center;
        width          : 100%;
        margin-top     : 3rem;

        .buscador-form {
            display        : flex;
            justify-content: center;
            align-items    : center;
            width          : 80%;
            position       : relative;
        }

        .buscador-input {
            width  : 100%;
            font-family: 'Roboto-Light';
            font-weight: normal;
            padding: 20px 45px 20px 5px;
        }

        .buscador-boton {
            position  : absolute;
            right     : 0;
            background: none;
            border    : none;
        }

        .icon-lupa {
            max-width : 30px;
            height    : auto;
            margin-top: 3px;
        }
    }

    .pkp_structure_content.container {
        width: 100%;
    }

}


/* ====== Escritorio (Punto de quiebre OJS)(Desde 1690px) ====== */
@media (min-width: 1690px) {}