@font-face {
    font-family: 'club-icons';
    src:  url('../fonts/icons/club-icons.eot?l7ahw3');
    src:  url('../fonts/icons/club-icons.eot?l7ahw3#iefix') format('embedded-opentype'),
          url('../fonts/icons/club-icons.ttf?l7ahw3') format('truetype'),
          url('../fonts/icons/club-icons.woff?l7ahw3') format('woff'),
          url('../fonts/icons/club-icons.svg?l7ahw3#club-icons') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="clubicon-"], [class*=" clubicon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'club-icons' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.clubicon-exit:before {
    content: "\e913";
}
.clubicon-switch:before {
    content: "\e914";
}
.clubicon-pencil:before {
    content: "\e912";
}
.clubicon-out:before {
    content: "\e911";
}
.clubicon-menu:before {
    content: "\e90f";
}
.clubicon-cerrar:before {
    content: "\e910";
}
.clubicon-mas:before {
    content: "\e909";
}
.clubicon-tarjeta:before {
    content: "\e90a";
}
.clubicon-datos:before {
    content: "\e90b";
}
.clubicon-candado:before {
    content: "\e90c";
}
.clubicon-actualizar:before {
    content: "\e90d";
}
.clubicon-registro:before {
    content: "\e90e";
}
.clubicon-flecha-abajo:before {
    content: "\e903";
}
.clubicon-flecha-arriba:before {
    content: "\e904";
}
.clubicon-inicio:before {
    content: "\e905";
}
.clubicon-perfil:before {
    content: "\e906";
}
.clubicon-trabajo:before {
    content: "\e907";
}
.clubicon-tiempo:before {
    content: "\e908";
}
.clubicon-gestion:before {
    content: "\e900";
}
.clubicon-biblioteca:before {
    content: "\e901";
}
.clubicon-buzon:before {
    content: "\e902";
}
  

/** custom CSS | v202406 - responsive **/
html{
    overflow-x: hidden;
}

/* Main menu */
#center_column #menu{
    height: auto;
    margin-bottom: 36px;
}

#center_column #menu ul.nice-menu{
    display: flex;
    justify-content: space-between;
    width: 100%;
    float: none;
    height: auto !important;
    box-sizing: border-box;
}

#center_column #menu ul.nice-menu:after{
    display: none;
}
  
#center_column #menu ul.nice-menu > li{
    width: 100% !important;
    height: 100% !important;
    float: none !important;
    margin: 0 !important;
    display: inline-block;
    box-sizing: border-box;
    flex-grow: 1;
    background: none !important;
    position: relative;
    cursor: pointer;
    box-sizing: border-box;
}

#center_column #menu ul.nice-menu > li:before{
    content: '';
    width: 46px;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: calc(50% - 23px);
    background: rgb(186,188,192);
    background: linear-gradient(180deg, rgba(186,188,192,1) 0%, rgba(254,254,254,1) 100%);
    border-radius: 100%;
    z-index: 1;
    transition: all .4s ease-in-out;
}

#center_column #menu ul.nice-menu > li.over:before,
#center_column #menu ul.nice-menu > li.active:before{
    transform: rotate(180deg);
}

#center_column #menu ul.nice-menu > li:after{
    content: 'XX';
    width: 38px;
    height: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 3px;
    left: calc(50% - 20px);
    background: #F0F0F0;
    color: #C7C7C7;
    font-size: 21px;
    border-radius: 100%;
    box-shadow: 0px .5px 1.3px 0 rgba(0, 0, 0, .25);
    z-index: 2;
    border: 1px solid #F0F0F0;
    transition: all .25s ease-in-out;
}

#center_column #menu ul.nice-menu > li.over:after{
    box-shadow: 0px -.5px 1.3px 0 rgba(0, 0, 0, .25);
    background-color: #C7C7C7;
    color: #F0F0F0;
}

#center_column #menu ul.nice-menu > li.active:after{
    box-shadow: 0px -.5px 1.3px 0 rgba(0, 0, 0, .25);
    background-color: #C7C7C7;
    color: #0074CC;
}

#center_column #menu ul.nice-menu > li.item1:after{
    content: '\e905';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li.item2:after{
    content: '\e906';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li.item3:after{
    content: '\e907';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li.item4:after{
    content: '\e908';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li.item5:after{
    content: '\e900';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li.item6:after{
    content: '\e901';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li.item7:after{
    content: '\e902';
    font-family: 'club-icons';
}

#center_column #menu ul.nice-menu > li > a.mainMenuLink{
    width: 100% !important;
    text-align: center;
    font-size: 16px !important;
    line-height: 18px;
    font-weight: 400 !important;
    color: #3E3D40;
    display: inline-block !important;
    box-sizing: border-box;
    top: 0 !important;
    left: 0 !important;
    padding: 50px 14px 2px 6px !important;
    position: relative;
    transition: all .4s ease-in-out;
}

#center_column #menu ul.nice-menu > li.menuparent > a.mainMenuLink:after{
    content: '\e903';
    font-family: 'club-icons';
    position: absolute;
    top: 51px;
    right: 2px;
    font-size: 5px;
    transition: all .4s ease-in-out;
}

#center_column #menu ul.nice-menu > li.menuparent.over > a.mainMenuLink:after{
    transform: rotate(180deg) scale(.8) translateY(3px);
    opacity: .7;
}

#center_column #menu ul.nice-menu > li ul{
    display: block !important;
    position: absolute;
    top: 100%;
    padding-top: 8px;
    border-radius: 4px;
    overflow: hidden !important;
    width: 176px;
    max-height: 0;
    transform: translateY(20px);
    opacity: 0;
    transition: all .3s ease-in-out;
}

#center_column #menu ul.nice-menu > li.over ul{
    transform: translateY(0);
    opacity: 1;
    max-height: 600px;
}

#center_column #menu ul.nice-menu > li ul li.sub-menu-arrow-border{
    display: none;
}

#center_column #menu ul.nice-menu > li ul li.sub-menu-arrow{
    border-color: transparent transparent #0074CC !important;
    top: -7px;
    position: absolute;
}

#center_column #menu ul.nice-menu > li ul li.menu-item{
    background: #0074CC !important;
    float: none;
    border: 0;
    color: #fff;
    text-align: left !important;
    width: 100%;
    height: auto;
    position: relative;
}

#center_column #menu ul.nice-menu > li ul li.menu-item:after{
    content: '';
    width: calc(100% - 20px);
    height: 1px;
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 10px;
    background-color: rgba(255,255,255,.6);
}

#center_column #menu ul.nice-menu > li ul li.menu-item:last-of-type:after{
    display: none;
}

#center_column #menu ul.nice-menu > li ul li.menu-item > a{
    padding: 7px 8px 6px;
    font-weight: 400 !important;
    transition: all .4s ease-in-out;
}

#center_column #menu ul.nice-menu > li ul li.menu-item:hover{
    background: #0074CC !important;
}

#center_column #menu ul.nice-menu > li ul li.menu-item > a:hover{
    opacity: .6;
    color: #fff;
    transform: translateX(2px);
    font-weight: 400 !important;
}

.header-responsive{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #EFEFEF;
    box-shadow: 0 .5px 2px 0 rgba(0, 0, 0, .15);
    z-index: 25;
}

.header-responsive__grid{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 16px;
}

.header-responsive__logo{
    width: 80px;
    height: 80px;
    display: inline-block;
}

.header-responsive__logo img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

.hamburger {
    display: inline-block;
    overflow: visible;
    margin: 0;
    padding: 2px 10px;
    cursor: pointer;
    transition: all .15s ease-in-out;
    text-transform: none;
    color: inherit;
    border: 0;
    background-color: transparent;
}

.hamburger__box {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px;
}

.hamburger__inner {
    top: 2px;
    display: block;
    margin-top: -2px;
    transition: background-color 1s linear .13s;
}

.hamburger__inner,.hamburger__inner:after,.hamburger__inner:before {
    position: absolute;
    width: 40px;
    height: 4px;
    transition-timing-function: ease;
    transition-duration: .15s;
    transition-property: transform;
    border-radius: 4px;
    background-color: #0074CC;
}

.hamburger__inner:after,.hamburger__inner:before {
    display: block;
    content: "";
}

.hamburger__inner:before {
    top: 10px;
    transition: top .1s cubic-bezier(.33333,.66667,.66667,1) .2s,transform .13s cubic-bezier(.55,.055,.675,.19);
}

.hamburger__inner:after {
    top: 20px;
    transition: top .2s cubic-bezier(.33333,.66667,.66667,1) .2s,transform .13s cubic-bezier(.55,.055,.675,.19);
}

.hamburger.is-active .hamburger__inner {
    transition-delay: .22s;
    background-color: transparent !important;
}

.hamburger.is-active .hamburger__inner:before {
    top: 0;
    transition: top .1s cubic-bezier(.33333,0,.66667,.33333) .15s,transform .13s cubic-bezier(.215,.61,.355,1) .22s;
    transform: translate3d(0,10px,0) rotate(45deg);
}

.hamburger.is-active .hamburger__inner:after {
    top: 0;
    transition: top .2s cubic-bezier(.33333,0,.66667,.33333),transform .13s cubic-bezier(.215,.61,.355,1) .22s;
    transform: translate3d(0,10px,0) rotate(-45deg);
}

#main #center_column #content{
    transition: filter .4s ease-in-out;
}

.hamburger--is-active #main #center_column #content{
    filter: blur(15px);
}

.user-responsive{
    display: none;
    background-color: #3E3D40;
    margin-top: 1px;
    color: #fff;
}

.user-responsive a{
    color: #fff;
}

.user-responsive a:hover{
    text-decoration: none;
}

.user-responsive__grid{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.user-responsive__link-edit{
    position: relative;
    font-size: 18px;
    line-height: 20px;
    font-weight: 600;
    padding: 10px 6px 10px 40px;
    height: 32px;
    display: flex;
    align-items: center;
    width: 100%;
}

.user-responsive__link-edit:before{
    content: '\e912';
    font-family: 'club-icons';
    font-size: 14px;
    opacity: 1;
    position: absolute;
    top: 16px;
    left: 16px;
    transition: all .25s ease-in-out;
}

.user-responsive__link-edit:active:before{
    transform: scaleX(-1);
}

.user-responsive__logout{
    font-size: 32px;
    line-height: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 100%;
    background-color: rgba(255,255,255,.6);
    color: #3E3D40 !important;
    padding: 10px 16px;
    box-sizing: border-box;
    transition: all .4s ease-in-out;
}

.user-responsive__logout:active{
    color: rgba(255,255,255,.6) !important;
    background-color: #3E3D40;
    border-left: 1px solid #FFF;
}

/* HOME:: noticias - vista resumen */
#content_otros_destacados article{
    min-height: 322px;
}

#content_otros_destacados article .content{
    background-color: rgba(0, 136, 204, .6);
    position: relative;
}

#content_otros_destacados article img{
    width: 100%;
    height: 177px;
    display: inline-block;
    object-fit: cover;
    object-position: center;
}

#content_otros_destacados article .destacado_tip{
    min-height: 145px;
    height: auto !important;
    box-sizing: border-box;
}

#content_otros_destacados article .destacado_tip .destacados_plus{
    top: -2px;
}

@media (max-width: 1000px) {
    .toolbar-oriented .toolbar-bar{
        position: fixed;
    }

    /* Page:: login */
    .page-login #wrapper{
        overflow-x: initial;
    }

    .page-login{
        line-height: normal;
    }

    .page-login .div-18p{
        line-height: normal;
    }

    .page-login .cerrado{
        display: flex !important;
    }

    .page-login .r-menu,
    .page-login .r-menu.cerrado{
        display: none !important;
    }

    .page-login #left_column #logo img{
        width: 136px;
    }

    .page-login #center_column{
        float: none;
        display: inline-block;
        width: 100%;
        padding: 0;
    }
    
    .page-login #content{
        margin: 0 !important;
        padding: 24px !important;
    }

    .page-login #center_column #content form#user-login-form div.user-login-input-bg{
        margin-bottom: 10px !important;
    }

    .page-login #center_column #content form input.form-submit{
        line-height: 22px;
    }

    .page-login #right_column{
        margin: 20px 0;
    }

    .page-login #block-ayudaacceso{
        display: inline-block;
        width: 100%;
        padding: 0 24px;
        box-sizing: border-box;
    }

    .page-login #block-ayudaacceso h2{
        width: 100%;
        text-align: center;
    }

    .page-login #right_column{
        margin: 20px 0 !important;
    }

    .page-login #right_column ul{
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2,1fr);
    }

    .page-login #right_column ul li.separator{
        display: none;
    }

    .page-login .push{
        height: auto;
    }

    .page-login #main{
        margin: 0 auto;
    }

    .page-login .header-responsive{
        display: none;
    }

    .page-login #wrapper{
        margin-top: 30px;
    }
    #wrapper{
        margin-top: 0;
    }

    /* Footer */
    #footer_wrapper{
        display: inline-block;
        width: 100%;
        top: initial;
        padding: 0 20px;
        box-sizing: border-box;
        background-color: #013a71;  
        height: auto;
    }

    #footer_wrapper #footer.footeres{
        background-size: contain;
        padding: 0;
    }

    #footer_wrapper #footer.footeres{
        background: none;
        padding: 22px 0 16px;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #footer_wrapper #footer.footeres::before{
        content: '';
        height: 48px;
        width: 100%;
        display: inline-block;
        background-image: url(../images/logo-alsea.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        margin-bottom: 16px;
    }

    #footer_wrapper #footer.footeres::after{
        content: '';
        height: 88px;
        width: 100%;
        display: inline-block;
        text-align: center;
        background-image: url(../images/footer_people.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        margin-top: 25px;
    }

    #footer_wrapper #footer p.footer_text{
        padding-top: 0;
    }

    #footer_wrapper #footer p{
        margin-bottom: 10px;
    }

    /* Main menu */
    .header-responsive +#main{
        padding-top: 92px;
    }

    #boton-menu-cerrar,
    #boton-menu-abrir{
        display: none;
    }

    .toolbar-horizontal .header-responsive{
        top: 39px;
    }

    .toolbar-vertical .header-responsive{
        top: 47px;
    }
    
    .toolbar-horizontal .header-responsive +#main{
        padding-top: 122px;
    }
    
    .toolbar-vertical .header-responsive +#main{
        padding-top: 100px;
    }

    .toolbar-horizontal.toolbar-tray-open .header-responsive{
        top: 79px;
    }

    .toolbar-horizontal.toolbar-tray-open .header-responsive +#main{
        padding-top: 92px;
    }

    #menu{
        position: fixed;
        top: 92px;
        left: 0;
        max-height: 0;
        width: 100%;
        overflow: hidden;
        z-index: 15;
        transition: all .4s ease-in-out;
    }

    .toolbar-horizontal #menu{
        top: 162px;
    }
    
    .toolbar-vertical #menu{
        top: 139px;
    }

    .toolbar-horizontal.toolbar-tray-open #menu{
        top: 171px;
    }

    .hamburger--is-active #menu{
        max-height: 900px;
        box-shadow: 0px 2px 10px rgba(0,0,0,.6);
    }

    #block-nicemenus{
        max-height: calc(100vh - 92px);
        width: 100%;
        overflow-y: auto;
        background-color: #EFEFEF;
        display: block;
        width: 100%;
    }

    .toolbar-horizontal #block-nicemenus{
        max-height: calc(100vh - 162px);
    }
    
    .toolbar-vertical #block-nicemenus{
        max-height: calc(100vh - 139px);
    }

    .toolbar-horizontal.toolbar-tray-open #block-nicemenus{
        max-height: calc(100vh - 171px);
    }

    #center_column #menu ul.nice-menu{
        flex-direction: column;
        align-content: flex-start;
        row-gap: 1px;
    }

    #center_column #menu ul.nice-menu > li{
        text-align: left;
    }

    #center_column #menu ul.nice-menu > li:last-of-type > a.mainMenuLink:before{
        display: none;
    }

    #center_column #menu ul.nice-menu > li:before{
        left: 12px;
        top: 13px;
        width: 58px;
        height: 58px;
    }

    #center_column #menu ul.nice-menu > li:after{
        left: 15px;
        top: 16px;
        width: 50px;
        height: 50px;
    }

    #center_column #menu ul.nice-menu > li > a.mainMenuLink{
        width: calc(100% - 10px) !important;
        padding: 10px 36px 10px 82px !important;
        text-align: left;
        min-height: 88px;
        display: flex !important;
        align-items: center;
        font-size: 18px !important;
        line-height: 20px;
    }

    #center_column #menu ul.nice-menu > li.menuparent > a.mainMenuLink{
        pointer-events: none;
    }

    #center_column #menu ul.nice-menu > li > a.mainMenuLink:before{
        content: '';
        width: calc(100% - 32px);
        height: 1px;
        display: inline-block;
        background-color: #C7C7C7;
        position: absolute;
        bottom: -1px;
        left: 16px;
    }

    #center_column #menu ul.nice-menu > li.menuparent > a.mainMenuLink:after{
        font-size: 10px;
        top: calc(50% - 8px);
        right: 16px;
    }

    #center_column #menu ul.nice-menu > li ul{
        position: relative;
        padding: 0;
        width: 100%;
        left: 0;
        border-radius: 0;
        /* padding: 12px 0; */
        transition: max-height .4s ease-in-out;
    }

    #center_column #menu ul.nice-menu > li ul li.sub-menu-arrow{
        border: 0;
        background-color: #0074CC;
        width: 100%;
        height: 12px;
        bottom: initial;
        top: 0;
        left: 0;
        position: relative;
        display: inline-block;
    }

    #center_column #menu ul.nice-menu > li ul li.menu-item:last-of-type{
        padding-bottom: 23px;
    }

    #center_column #menu ul.nice-menu > li ul li.menu-item:after{
        left: 37px;
        width: calc(100% - 74px);
    }

    #center_column #menu ul.nice-menu > li ul li.menu-item > a{
        font-size: 18px;
        padding: 11px 37px;
    }

    .header-responsive{
        display: block;
    }

    .user-responsive{
        display: block;
    }

    /* HOME:: resumen noticias */
    body.front #wrapper #main #center_column #content_otros_destacados div.views-row div.destacado_tip{
        box-sizing: border-box;
    }

    /* Globales */
    body{
        font-size: 16px;
        line-height: 24px;
    }

    #center_column{
        padding: 20px 0;
    }

    .page- .views-element-container{
        flex-direction: column;
        gap: 20px;
    }

    /* Miga de pan */
    #center_column #breadcrumb_cde div.breadcrumb_cde{
        margin: 0;
        padding: 0 15px;
        box-sizing: border-box;
        line-height: 15px;
    }

    /* Mi perfil:: datos personales */
    #datos_personales_content #datos_personales{
        padding: 16px 0;
    }

    #datos_personales_content #datos_personales form #edit-foto{
        width: calc(100% - 60px) !important;
        margin: 10px 30px 22px;
        font-size: 16px !important;
    }

    #datos_personales_content #datos_personales form .form-separator{
        width: calc(100% - 54px) !important;
    }

    #datos_personales_content #datos_personales form #avisoccc{
        float: none !important;
        text-align: center;
        padding: 8px 0;
    }

    #datos_personales_content #datos_personales form .iban_title{
        width: 100%;
        text-align: center;
    }

    #datos_personales_content #datos_personales form .iban_title label{
        width: 100%;
    }

    #datos_personales_content #datos_personales form #cuenta-bancaria-ajax .form-item input{
        width: 100% !important;
        margin-left: 0 !important;
        text-align: center !important;
    }

    #datos_personales_content #datos_personales form .form-item input{
        padding: 2px 8px !important;
        font-size: 16px !important;
        box-sizing: border-box;
    }

    #datos_personales_content #datos_personales form #edit-grupo-cuenta-bancaria{
        padding: 0 16px;
    }

    #datos_personales_content #datos_personales form #edit-grupo-cuenta-bancaria .fieldset-wrapper{
        gap: 10px;
    }

    #datos_personales_content #datos_personales form #edit-grupo-cuenta-bancaria .avisoIban{
        font-size: 12px;
        line-height: 14px;
    }

    #datos_personales_content #datos_personales .fieldset-wrapper{
        position: relative;
    }

    #datos_personales_content #datos_personales form .img-edit{
        /* display: none; */
        width: 17px;
        position: absolute;
        bottom: 14px;
        left: 170px;
    }

    #datos_personales_content #datos_personales form .img-edit img{
        margin-top: 0;
        margin-left: 0;
    }

    #datos_personales_content #datos_personales form #edit-col2--3,
    #datos_personales_content #datos_personales form #edit-col3--3{
        width: 100% !important;
        float: none !important;
        padding: 5px 42px !important;
        box-sizing: border-box;
    }

    .ui-widget.ui-widget-content #sistema-miperfil-actualizar-documento-main-form .fijoec{
        height: auto;
    }

    .ui-widget.ui-widget-content #sistema-miperfil-actualizar-documento-main-form .der,
    .ui-widget.ui-widget-content #sistema-miperfil-actualizar-documento-main-form .izq{
        width: 100%;
        float: none;
    }

    .ui-widget.ui-widget-content #sistema-miperfil-actualizar-documento-main-form #edit-dni--2,
    .ui-widget.ui-widget-content #sistema-miperfil-actualizar-documento-main-form #edit-nacionalidad-ex{
        width: 100%;
    }

    .ui-widget.ui-widget-content #edit-submit--3,
    .ui-widget.ui-widget-content #edit-submit--2,
    .ui-widget.ui-widget-content #edit-submit{
        padding: .4em 1em;
    }

    .ui-widget.ui-widget-content #sistema-miperfil-actualizar-documento-main-form #documentos_nie{
        overflow-x: auto;
    }

    /* Mi perfil:: datos fiscales */
    .taxnote{
        box-sizing: border-box;
    }

    .page-mi-perfil .finalbuttons{
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
    }

    .page-mi-perfil .finalbuttons > div{
        float: none;
        width: auto;
    }

    .ui-widget.ui-widget-content{
        width: calc(100% - 30px) !important;
        left: 15px !important;
        box-sizing: border-box;
    }

    /* Mi perfil:: datos contacto */
    #datos_contacto_content #datos_contacto form.perfil-datos-contacto{
        padding: 16px 0;
    }

    #datos_contacto_content #datos_contacto form.perfil-datos-contacto input{
        width: 100% !important;
        box-sizing: border-box;
    }

    #datos_contacto_content #datos_contacto form .form-separator{
        width: calc(100% - 54px) !important;
        margin-top: 10px;
    }

    #datos_contacto_content #datos_contacto form fieldset#edit-fila3{
        top: 0 !important;
    }

    #datos_contacto_content #datos_contacto form #botones-contacto-cambiar{
        display: flex !important;
    }

    /* Mi perfil:: descuento amig@s */
    #block-clubdelempleado-content .ficha-socio{
        box-sizing: border-box;
    }

    label, input, button, select, textarea{
        font-size: 17px !important;
        line-height: 21px !important;
    }

    #block-clubdelempleado-content .ficha-socio .cyg-fil1{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
        column-gap: 16px;
        height: auto;
    }

    #block-clubdelempleado-content .ficha-socio .cyg-fil1 .cyg-col1,
    #block-clubdelempleado-content .ficha-socio .cyg-fil1 .cyg-col2{
        float: none;
        width: 100%;
    }

    #block-clubdelempleado-content .ficha-socio .form-item{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
        column-gap: 6px;
    }

    /* Mi trabajo:: ficha */
    #block-clubdelempleado-content form.sistema-mitrabajo-trabajo-actual-form{
        display: flex;
        column-gap: 30px;
        padding: 0 0 22px 24px;
    }

    #block-clubdelempleado-content form.sistema-mitrabajo-trabajo-actual-form .col-1,
    #block-clubdelempleado-content form.sistema-mitrabajo-trabajo-actual-form .col-2{
        flex-grow: 1;
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
    }

    #block-clubdelempleado-content form.sistema-mitrabajo-trabajo-actual-form input{
        font-size: 16px !important;
        line-height: 21px !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    #block-clubdelempleado-content {
        font-size: 16px !important;
        line-height: 21px !important;
    }

    /* Mi tiempo:: mi calendario */
    .page-mi-tiempo .views-element-container{
        overflow-x: auto;
        width: 100%;
        display: inline-block;
        padding-top: 16px;
    }

    .view-mi-tiempo{
        padding: 0;
        min-width: 755px;
        box-sizing: border-box;
    }

    .view-mi-tiempo .view-header{
        margin-top: 16px !important;
        justify-content: space-between !important;
        align-items: center !important;
        position: relative;
        padding: 16px 16px !important;
        box-sizing: border-box;
    }

    .view-mi-tiempo .view-header .horas-complementarias-disponibles-form{
        position: relative !important;
        margin-right: 0 !important;
        width: calc(100% - 250px);
    }

    .view-mi-tiempo .view-header .horas-complementarias-disponibles-form .form-item-saldo-horas{
        margin: 0 !important;
        display: flex;
        flex-direction: row-reverse;
        justify-content: flex-end;
        align-items: center;
        column-gap: 6px;
    }

    .view-mi-tiempo .view-header .horas-complementarias-disponibles-form .form-item-saldo-horas label{
        max-width: 100% !important;
        padding: 0 !important;
    }

    .view-mi-tiempo .view-header .horas-complementarias-disponibles-form .form-item-saldo-horas #edit-saldo-horas{
        height: 19px !important;
        width: 34px !important;
        font-size: 14px !important;
        line-height: 18px !important;
    }

    .view-mi-tiempo .view-header h3{
        text-align: center;
        width: 228px;
        padding: 0 20px;
        box-sizing: border-box;
        font-size: 18px !important;
    }

    .view-mi-tiempo .view-header nav.pager{
        position: absolute;
        top: calc(50% - 12px);
        right: 10px;
        display: inline-block;
        width: 240px;
        height: 20px;
        min-height: 0;
    }

    .view-mi-tiempo .view-header nav.pager .visually-hidden{
        display: none;
    }

    .view-mi-tiempo .view-header nav.pager .js-pager__items{
        position: relative !important;
        display: inline-block;
        width: 100%;
        height: 100%;
        left: 0 !important;
        top: 0 !important;
    }

    .view-mi-tiempo .view-header nav.pager .js-pager__items .pager__item{
        float: none !important;
        left: initial !important;
        right: initial !important;
    }

    .view-mi-tiempo .view-header nav.pager .js-pager__items .pager__item--previous{
        left: 0 !important;
    }
    
    .view-mi-tiempo .view-header nav.pager .js-pager__items .pager__item--next{
        right: 0 !important;
    }

    .view-mi-tiempo .view-content .tabs.tabs_calendar{
        top: -40px !important;
    }

    .view-mi-tiempo .view-content .calendar-calendar .month-view .full thead tr th{
        font-size: 11px !important;
        line-height: 13px;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-eventos{
        flex-direction: row;
        gap: 6px;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-eventos > div{
        flex-grow: 1;
        float: none;
        margin: 0;
        width: 100%;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-eventos > div span{
        top: 0 !important;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-iconos-hc{
        flex-direction: row;
        gap: 6px;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-iconos-hc > div{
        flex-grow: 1;
        float: none;
        margin: 0;
        width: 100%;
        position: relative;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-iconos-hc .horas-complement{
        min-width: 150px;
    }

    .view-mi-tiempo .view-content .leyenda .leyenda-iconos-hc .horas-complement span{
        top: 0;
        margin-right: 8px !important;
    }

    .view-mi-tiempo .view-content .calendar-calendar .month-view .full tbody .date-box td .month .dia .evento span.title,
    .view-mi-tiempo .view-content .calendar-calendar .full tbody .dia-semana .dia .evento span.title{
        top: 0 !important;
    }

    /* Biblioteca */
    .page-biblioteca form input.btn-primary,
    .page-mi-buzon form input.btn-primary{
        width: auto;
    }
}

@media (max-width: 768px) {
    /* Page:: login */
    .page-login #left_column #logo img{
        width: 100px;
    }
  
    .page-login #content{
        padding: 8px 16px !important;
    }
  
    .page-login #center_column #content form#user-login-form{
        margin-top: 15px !important;
    }
  
    .page-login #block-ayudaacceso{
        padding: 0 16px;
    }

    /* Main menu */
    #menu{
        top: 72px;
    }

    #block-nicemenus{
        max-height: calc(100vh - 72px);
    }

    .header-responsive__logo{
        width: 60px;
        height: 60px;
    }

    .toolbar-vertical #menu{
        top: 119px;
    }

    .toolbar-vertical #block-nicemenus{
        max-height: calc(100vh - 119px);
    }

    /* HOME:: carousel */
    body.front #wrapper #main #center_column #content div.view-noticias-slider .content{
        width: 100%;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider #content_destacado1{
        position: relative;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider .views-row,
    body.front #wrapper #main #center_column #content div.view-noticias-slider article,
    body.front #wrapper #main #center_column #content div.view-noticias-slider .content,
    body.front #wrapper #main #center_column #content div.view-noticias-slider #content_destacado1{
        height: 100%;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider .views_slideshow_cycle_slide{
        width: 100% !important;
        height: 100% !important;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider .views_slideshow_cycle_teaser_section{
        width: 100% !important;
        display: inline-block;
        overflow: hidden;
        height: 356px !important;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider #content_destacado1 div.destacado1_tip{
        width: 100%;
        background-position: 97% center;
        height: auto;
        overflow: initial;
        top: initial;
        bottom: 0;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider #content_destacado1 img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider #content_destacado1 div.destacado1_tip:hover{
        background-position: 97% center;
        transition: all .4s ease-in-out;
    }

    body.front #wrapper #main #center_column #content div.view-noticias-slider #content_destacado1 div.destacado1_tip a{
        display: inline-block;
        width: 100%;
        box-sizing: border-box;
    }

    .header-responsive +#main{
        padding-top: 72px;
    }

    .toolbar-vertical .header-responsive +#main{
        padding-top: 80px;
    }

    /* Mi perfil:: descuento amig@s */
    #block-clubdelempleado-content .ficha-socio .cyg-fil1{
        grid-template-columns: 100%;
    }

    #block-clubdelempleado-content .ficha-socio .cyg-fil2{
        height: auto;
    }

    #block-clubdelempleado-content .ficha-socio .cyg-fil2 .cyg-col1,
    #block-clubdelempleado-content .ficha-socio .cyg-fil2 .cyg-col2{
        float: none;
        width: 100%;
    }

    #block-clubdelempleado-content .ficha-socio .form-item{
        display: flex;
    }

    #block-clubdelempleado-content .ficha-socio .form-item label{
        width: 100%;
    }

    #block-clubdelempleado-content .ficha-socio .form-item input{
        width: 100% !important;
        float: none;
    }

    #block-clubdelempleado-content .ficha-socio .cyg-col2 .form-submit{
        margin: 0;
        width: 100%;
    }

    /* Mi trabajo:: ficha */
    #block-clubdelempleado-content form.sistema-mitrabajo-trabajo-actual-form{
        flex-direction: column;
        padding-right: 24px;
    }

    /* Mi perfil:: Datos fiscales */
    .ui-widget.ui-widget-content #datosdescendiente .trescol,
    .ui-widget.ui-widget-content #datosascendiente .trescol{
        float: none;
        width: 100%;
        box-sizing: border-box;
    }

    .ui-widget.ui-widget-content #datosdescendiente .trescol input,
    .ui-widget.ui-widget-content #datosascendiente .trescol input{
        width: 100%;
        box-sizing: border-box;
    }

    .ui-widget.ui-widget-content #datosdescendiente .todoancho label,
    .ui-widget.ui-widget-content #datosascendiente .todoancho label{
        width: 100%;
        display: inline-block;
    }

    .ui-widget.ui-widget-content #datospensiones .cajaform .izq,
    .ui-widget.ui-widget-content #datospensiones .cajaform .der{
        float: none;
        width: 100%;
    }

    .ui-widget.ui-widget-content #sistema-miperfil-permiso-validez-main-form .fijoec{
        height: auto;
    }
    
    .ui-widget.ui-widget-content #sistema-miperfil-permiso-validez-main-form .izq,
    .ui-widget.ui-widget-content #sistema-miperfil-permiso-validez-main-form .der{
        float: none;
        width: 100%;
    }
}

@media (max-width: 576px) {
    /* Page:: login */
    .page-login #center_column{
        text-align: left !important;
    }
  
    .page-login #center_column #content form#user-login-form div.user-login-input-bg{
        width: 100%;
        box-sizing: border-box;
        padding: 5px !important;
    }
  
    .page-login #center_column #content form#user-login-form div.user-login-input-bg span.login-form-input{
        width: 100% !important;
        height: 32px !important;
    }
  
    .page-login #center_column #content form#user-login-form div.user-login-field div.user-login-input-bg span input.form-text{
        padding: 5px 50px 5px 12px !important;
        font-size: 14px !important;
        left: 0px !important;
        width: calc(100% - 62px) !important;
    }
  
    .page-login #center_column #content form#user-login-form div.user-login-field div.user-login-input-bg span.login-form-input-id input,
    .page-login #center_column #content form#user-login-form div.user-login-field div.user-login-input-bg span.login-form-input-password input{
        padding: 5px 50px 5px 12px !important;
        font-size: 14px !important;
        left: 0px !important;
        width: calc(100% - 62px) !important;
        background-position-x: right !important;
        height: 22px !important;
        background-size: contain !important;
    }

    .page-login #center_column #content form input.form-submit{
        font-size: 14px !important;
    }
  
    .page-login #block-ayudaacceso h2{
        text-align: left;
        font-size: 18px !important;
        line-height: normal;
    }
  
    .page-login #right_column ul{
        font-size: 14px;
        line-height: normal;
        margin-top: 16px !important;
        column-gap: 10px;
    }
  
    .page-login #right_column ul li{
        height: auto !important;
    }
  
    .page-login #right_column ul li a{
        padding: 8px 2px 8px 26px !important;
        background: none !important;
        position: relative;
        text-decoration: underline !important;
        box-sizing: border-box;
    }
  
    .page-login #right_column ul li a::before{
        content: '';
        width: 15px;
        height: 18px;
        position: absolute;
        top: 8px;
        left: 3px;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }
  
    .page-login #right_column ul li a.menu-sistema_usuarios-new_user::before{
        background-image: url("../images/login_menu_1_off.png");
    }
    
    .page-login #right_column ul li a.menu-sistema_usuarios-remember_employee_id::before{
        background-image: url("../images/login_menu_2_off.png");
    }
    
    .page-login #right_column ul li a.menu-sistema_usuarios-change_password::before{
        background-image: url("../images/login_menu_3_off.png");
    }
    
    .page-login #right_column ul li a.menu-sistema_usuarios-restore_password::before{
        background-image: url("../images/login_menu_4_off.png");
    }
    
    .page-login #right_column ul li a.menu-sistema_usuarios-reset_login_data::before{
        background-image: url("../images/login_menu_5_off.png");
    }

    /* Footer */
    #footer_wrapper #footer.footeres::before,
    #footer_wrapper #footer.footeres::after{
        background-position: left;
    }

    #footer_wrapper #footer.footeres{
        text-align: left;
        align-items: flex-start;
    }

    #footer_wrapper #footer .contextual-region{
        align-items: flex-start;
    }

    /* Mi perfil:: Datos fiscales */
    .ui-widget.ui-widget-content #estadocivil-form{
        max-height: calc(100vh - 100px) !important;
        height: auto !important;
        font-size: 16px;
        line-height: 18px;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .ui-widget.ui-widget-content #estadocivil-form .fijoec{
        height: auto;
        display: flex;
        flex-direction: column;
    }

    .ui-widget.ui-widget-content #estadocivil-form .fijoec > div{
        flex-grow: 1;
        width: 100%;
        float: none;
    }

    .ui-widget.ui-widget-content #estadocivil-form select,
    .ui-widget.ui-widget-content #estadocivil-form input{
        width: 100%;
        box-sizing: border-box;
    }

    .ui-widget.ui-widget-content #datosdescendiente .cajaform .izq,
    .ui-widget.ui-widget-content #datosdescendiente .cajaform .der{
        float: none;
        width: 100%;
    }

    .ui-widget.ui-widget-content #datosdescendiente .big-drop,
    .ui-widget.ui-widget-content #datosascendiente .big-drop,
    .ui-widget.ui-widget-content #sp .big-drop{
        width: 100%;
    }
}

@media (max-width: 450px) {
    .ui-widget.ui-widget-content .ui-dialog-buttonpane,
    .ui-widget.ui-widget-content .ui-dialog-buttonpane .ui-dialog-buttonset{
        width: 100%;
        float: none;
        box-sizing: border-box;
    }

    .ui-widget.ui-widget-content .ui-dialog-buttonpane input,
    .ui-widget.ui-widget-content .ui-dialog-buttonpane button{
        margin-right: 0 !important;
        margin-left: 0 !important;
        width: 100%;
    }
}
/** / end / **/