/*
----------------------------------------------------------------------------------------------------
    Base structure RAC
----------------------------------------------------------------------------------------------------
*/

@charset "UTF-8";

@import 'pushy.css';
@import 'hover.css';
@import 'reiac.css';

:root {
    --blue: #14A2B8;
    --pink: #EB0D90;
    --red: #DC3545;
    --red-light: #E35D6A;
    --purple: #923692;
    --orange: #ff8100;
    --yellow: #F4D80D;
    --green: #3EB441;
    --white: #ffffff;
    --gray: #6c757d;
    --gray-dark: #5E5E5E;
    /*************************/
    --primary: #174A7C;
    --secondary: #357398;
    --success: #80C34C;
    --info: #1fa0bf;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --font-color: #495057;
    --header-color: #4784B2;
    --ras-color: #719440;
}

/* Men� */
:root {
    --menu-back: #174A7C;
    --menu-header: #98C0E4;
    --menu-link: #ffffff;
    --menu-hover: #ffd200;
    --menu-perfil: #4784B2;
}

/* Links */
:root {
    --anchor-normal: #206AB6;
    --anchor-hover: #206AB6;
}

/* Scroll */
:root {
    scroll-behavior: smooth;
}

@font-face {
    font-family: 'Abel-Regular';
    src: url('fonts/Abel-Regular.ttf.woff') format('woff'), url('fonts/Abel-Regular.ttf.svg#Abel-Regular') format('svg'), url('fonts/Abel-Regular.ttf.eot'), url('fonts/Abel-Regular.ttf.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}




html, body, form {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Abel-Regular';
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.4rem;
    color: #606060;
    background-color: var(--white);
}


/*body {
    height: auto;
    width: 100%;
}

form {
    height: auto;
    width: 100%;
}*/


a {
    color: var(--anchor-normal);
    text-decoration: none;
}

    a:hover {
        color: var(--anchor-hover);
        text-decoration:none;
    }

    a.yellow {
        color: var(--yellow);
        text-decoration: none;
    }

        a.yellow:hover {
            color: var(--yellow);
            text-decoration: none;
        }

    a.hiddenhref,
    a:not([href]).hiddenhref {
        color: #DA1F1F;
        text-decoration: none;
        cursor: pointer;
    }

        a.hiddenhref:hover,
        a:not([href]).hiddenhref:hover {
            color: #E56262;
            text-decoration: none;
            cursor: pointer;
        }

    a:not([href]):not([tabindex]) {
        color: #DA1F1F;
        text-decoration: none;
        cursor: pointer;
    }

em, code {
    color: var(--gray-dark);
}

ins, mark {
    background-color: #ffa;
}

mark {
    color: #444;
}

hr {
    border-top-color: #dfdfdf;
    margin-top: 0.4rem;
    margin-bottom: 0.8rem;
}

    hr.mini {
        border-top-color: #dfdede;
        margin-top: 0.1rem;
        margin-bottom: 0.2rem;
    }

pre {
    border: 1px solid #ddd;
    background: #fafafa;
}

p, blockquote p {
    margin: 10px 0;
}

ul, ol, dl {
    padding-left: 0;
}

label {
    padding-left: 5px;
}

    

/***********************************************************
	TITULARES
***********************************************************/
.table {
    width: 100%;
    margin-bottom: 1rem;
    background-color: transparent;
}

    .table td, .table th {
        padding: .2rem;
        vertical-align: top;
        border-top: 1px solid var(--primary);
        font-size: 0.8rem;
        line-height: 0.9rem;
    }

        .table td .ico-listado {
            max-width: 16px !important;
        }

        .table td .img-listado {
            max-width: 20px !important;
        }

@media (min-width: 32rem) {
    .table th {
        padding: .3rem;
        font-size: 0.8rem;
        line-height: 0.9rem;
    }

    .table td {
        padding: .4rem;
        font-size: 0.8rem;
        line-height: 0.9rem;
    }
        .table td .ico-listado {
            max-width: 24px !important;
        }

        .table td .img-listado {
            max-width: 32px !important;
        }
}


@media (min-width: 64rem) {
    .table th {
        padding: .3rem;
        font-size: 0.9rem;
        line-height: 1rem;
    }

    .table td {
        padding: .4rem;
        font-size: 1rem;
        line-height: 1.1rem;
    }

        .table td .ico-listado {
            max-width: 24px !important;
        }

        .table td .img-listado {
            max-width: 32px !important;
        }
}


.table .thead-custom th {
    color: var(--white);
    background-color: #414A58;
    border-color: #414A58;
    font-weight: normal;
    vertical-align: middle !important;
}

.table .thead-custom2 th{
    color: var(--white);
    background-color: #414A58;
    /*border-color: #414A58;*/
    font-weight: normal;
    font-size: 1rem !important; 
    vertical-align:middle !important;
}

.table .row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}

.table .thead-height {
    height: auto;
    min-height: 35px;
    text-align: center;
    border-bottom: 1px solid #eceaea;
}

.table .subthead-height {
    height: auto;
    min-height: 15px;
    text-align: center;
    margin-top: 3px;
    width: 100%;
    border-bottom: 1px solid #eceaea;
}

.table .widthmin {
    width: 40px !important;
}

.table .widthmedium,
.table .widthmax,
.table .widthsuper {
    width: 80px !important;
}

.table .widthsuper {
    width: 100px !important;
}

.table .widthmaxsuper {
    width: 150px !important;
}

@media (min-width: 64rem) {
    .table .widthmin {
        width: 50px !important;
    }

    .table .widthmedium {
        width: 100px !important;
    }

    .table .widthmax {
        width: 150px !important;
    }

    .table .widthsuper {
        width: 200px !important;
    }

    .table .widthmaxsuper {
        width: 250px !important;
    }
}

@media (min-width: 87rem) {
    .table .widthmin {
        width: 50px !important;
    }

    .table .widthmedium {
        width: 150px !important;
    }

    .table .widthmax {
        width: 200px !important;
    }

    .table .widthsuper {
        width: 250px !important;
    }

    .table .widthmaxsuper {
        width: 300px !important;
    }
}




/***********************************************************/


.container {
    width: 100% !important;
    margin: 0 auto !important;
}



.main-container {
    flex: 1;
    width: 100% !important;
    padding-top: 40px;
    padding-bottom: 40px;
    min-height:700px;
}

@media (min-width: 64rem) {
    .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 30px;
        padding-left: 30px;
        margin: 0 auto !important;
    }

    /*.main-container {
        width: 100% !important;
        min-height: 1500px;
        padding-top: 30px;
        padding-bottom: 40px;
    }*/
}


/***********************************************************
	TITULARES
***********************************************************/

h1, h2, h3, h4, h5, h6 {
    letter-spacing: -0.4px;
    text-rendering: optimizelegibility;
}

h3, h4, h5, h6 {
    color: #4f4f4f;
}

h1 {
    font-size: 1.8rem !important;
    line-height: 2rem;
    margin-bottom: 8px;
    /*color: var(--anchor-normal);*/
    color: var(--header-color);
}

@media (min-width: 64rem) {
    h1 {
        font-size: 2.4rem !important;
        line-height: 2.6rem;
        margin-bottom: 10px;
        /*color: var(--anchor-normal);*/
        color: var(--header-color);
    }
}

h2 {
    font-size: 1.6rem !important;
    margin-bottom: 10px;
    color: var(--header-color);
}

@media (min-width: 64rem) {
    h2 {
        font-size: 2rem !important;
        margin-bottom: 8px;
        color: var(--header-color);
    }
}

h3 {
    font-size: 1.4rem !important;
    margin-bottom: 2px;
}

@media (min-width: 64rem) {
    h3 {
        font-size: 1.8rem !important;
        margin-bottom: 5px;
    }
}

h4 {
    font-size: 1.3rem !important;
    margin-bottom: 2px;
}

@media (min-width: 64rem) {
    h4 {
        font-size: 1.6rem !important;
        margin-bottom: 5px;
    }
}

h5 {
    font-size: 1.2rem !important;
}

@media (min-width: 75rem) {
    h5 {
        font-size: 1.4rem !important;
    }
}

@media (min-width: 64rem) {
    h5 {
        font-size: 1.3rem !important;
    }
}

h6 {
    font-size: 1.1rem !important;
}

@media (min-width: 64rem) {
    h6 {
        font-size: 1.2rem !important;
    }
}


/***********************************************************
	FOOTER
***********************************************************/
footer {
    background-color: #F7F7F7;
    color: #606060;
    font-size: 1rem;
    width: 100%;
    height: 200px;
}

    footer a {
        color: var(--anchor-normal);
        text-decoration: none;
        line-height: inherit;
    }

        footer a:hover {
            color: var(--anchor-normal);
            text-decoration: none;
            line-height: inherit;
        }

    footer ul {
        list-style: none;
        padding-left: 0px;
    }

    footer li, footer li a {
        display: inline-block;
    }

    footer li {
        line-height: 22px;
        margin-right: 10px;
    }

    footer .footer-border-top {
        width: 100%;
        border-top: 2px solid #808080;
        left: 0;
        right: 0;
        padding-top: 15px;
        padding-bottom: 40px;
        padding-left: 5px;
    }

    

/***********************************************************/


/***********************************************************
	PORTADA
***********************************************************/

.login {
    clear: both;
    position: relative;
    margin-top: 20px;
    margin-bottom: 30px;
    width: 100%;
    max-width: 400px;
    padding: 15px 20px 25px 20px;
    background-color: var(--white);
    /*
    opacity: 0.7;
    filter: alpha(opacity = 70);
    -moz-opacity: .70;
    */
    text-align: left;
}



/***********************************************************
	SITE MASTER
    -Header
    -Contadores
    -Noticias
***********************************************************/
header{
    width:100%;
}

.header-top {
    height: auto;
    min-height: 70px;
    margin: 0 0px;
    background: var(--primary);
    width: 100%;
    display: block;
}

.imgAvisosMenu {
    width: 32px;
}

 .sobreImagen {
    position: relative;
    left: 26px;
    bottom: 0px;
    color: black;
}


@media (min-width: 20rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 03px;
        top: 10px;
        cursor: pointer;
    }

    .mensajesPendientes {
        display: none;
    }
}

@media (min-width: 24rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 30px;
        top: 66px;
    }

    .mensajesPendientes {
        display: none;
    }
}

@media (min-width: 28.5rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 115px;
        top: 05px;
    }

    .mensajesPendientes {
        display: none;
    }
}

@media (min-width: 31rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 5px;
        top: 42px;
    }

    .mensajesPendientes {
        display: none;
    }
}

@media (min-width: 37rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 5px;
        top: 35px;
    }

    .mensajesPendientes {
        display: none;
    }
}

@media (min-width: 37.5rem) {
    .header-top-center {
        background: transparent;
        display: block;
        float: right;
        margin-top: 0px;
        margin-bottom: 10px;
    }

    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 10px;
        top: 5px;
    }

    
}

@media (min-width: 43.75rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 5px;
        top: 50px;
    }

    .mensajesPendientes {
        display: inline-block;
        position: relative;
        bottom: -17px;
    }

    .imgAvisosMenu {
        width: 48px;
    }

    .sobreImagen {
        position: relative;
        left: 33.5px;
        bottom: 0px;
        color: black;
    }
}

@media (min-width: 45.5rem) {
    .header-top-center {
        background: transparent;
        display: block;
        float: right;
        margin-top: 10px;
        margin-bottom: 0px;
    }
}

@media (min-width: 52rem) {
    .header-top-center {
        background: transparent;
        display: block;
        float: right;
        margin-top: 10px;
        margin-bottom: 0px;
    }
}

@media (min-width: 64rem) {
    .header-top-center {
        background: transparent;
        display: block;
        float: left;
        position: relative;
        margin-top: 10px;
        /*margin-left: 50px;*/
    }

    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 5px;
        top: 55px;
    }
}

@media (min-width: 72rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 5px;
        top: 55px;
    }
}

@media (min-width: 77.5rem) {
    .header-top-right {
        margin-top: 0px;
        margin-left: 0px;
        background: transparent;
        display: inline;
        position: absolute;
        right: 305px;
        top: 75px;
    }
}


.mensajesPendientes {
    color: color-mix(in srgb, var(--menu-hover) 90%, white 15%);
    position: relative;
    bottom: -17px;
}

.tag-line {
    background: url(../Images/typo/separator.png) no-repeat scroll left center transparent;
    padding: 6px 8px;
    position: relative;
    float: left;
    margin-top: 15px;
    color: var(--white);
    text-shadow: none;
    min-height: 14px;
    font-size: 1rem;
    display: block;
}

.textoTitle {
    font-size: 2rem;
    display: block;
}

a.textoTitle {
    color: var(--white);
    text-decoration: none;
}

.textoTitle2 {
    display: none;
}

#logo {
    float: left;
}

.logo-img {
    background: url(../Images/portada/logo.png) no-repeat scroll 0 0 transparent;
    width: 93px;
    height: 60px;
    float: left;
    margin-top: 0px;
    margin-left: 5px;
    margin-right: 5px;
    background-size: contain !important;
}

.size-auto {
    max-width: 100%;
}

@media (min-width: 22rem) {
    .header-top {
        height: auto;
        min-height: 80px;
        margin: 0 0px;
        background: var(--primary);
        width: 100%;
    }

    .textoTitle {
        font-size: 2rem;
        display: block;
    }

    .textoTitle2 {
        font-size: 0.7rem;
        display: block;
    }

    .tag-line {
        background: url(../Images/typo/separator.png) no-repeat scroll left center transparent;
        padding: 7px 10px;
        position: relative;
        float: left;
        margin-top: 15px;
        color: var(--white);
        text-shadow: none;
        min-height: 16px;
        font-size: 1.2rem;
        display: block;
    }

    .logo-img {
        background: url(../Images/portada/logo.png) no-repeat scroll 0 0 transparent;
        width: 124px;
        height: 80px;
        float: left;
        margin-top: 0px;
        margin-left: 5px;
        margin-right: 5px;
        background-size: contain !important;
    }
}

@media (min-width: 37.5rem) {
    .header-top {
        height: 128px;
        margin: 0 0px;
        background: var(--primary);
        width: 100%;
    }

    .tag-line {
        background: url(../Images/typo/separator.png) no-repeat scroll left center transparent;
        padding: 7px 10px;
        position: relative;
        float: left;
        margin-top: 20px;
        color: var(--white);
        text-shadow: none;
        min-height: 16px;
        font-size: 1.2rem;
    }

    .textoTitle {
        font-size: 2.3rem;
        display: block;
    }

    .textoTitle2 {
        display: block;
        font-size: 1.2rem;
        margin-top: 0px;
    }

    .logo-img {
        background: url(../Images/portada/logo.png) no-repeat scroll 0 0 transparent;
        width: 147px;
        height: 95px;
        float: left;
        margin-top: 10px;
        margin-left: 20px;
        margin-right: 20px;
        background-size: contain !important;
    }
}

@media (min-width: 58rem) {
    .header-top {
        height: 128px;
        margin: 0 0px;
        background: var(--primary);
        width: 100%;
    }

    .tag-line {
        background: url(../Images/typo/separator.png) no-repeat scroll left center transparent;
        padding: 7px 10px;
        position: relative;
        float: left;
        margin-top: 20px;
        color: var(--white);
        text-shadow: none;
        min-height: 16px;
        font-size: 1.5rem;
    }

    .textoTitle {
        font-size: 3rem;
        display: block;
    }

    .textoTitle2 {
        margin-top: 15px;
        font-size: 1.5rem;
        display: block;
    }

    .textoTitle3 {
        display: block;
    }

    .logo-img {
        background: url(../Images/portada/logo.png) no-repeat scroll 0 0 transparent;
        width: 147px;
        height: 95px;
        float: left;
        margin-top: 10px;
        margin-left: 20px;
        margin-right: 20px;
        background-size: contain !important;
    }
}

@media (min-width: 64rem) {
    .header-top {
        height: 128px;
        margin: 0 0px;
        background: var(--primary);
        width: 100%;
    }

    .tag-line {
        background: url(../Images/typo/separator.png) no-repeat scroll left center transparent;
        padding: 7px 10px;
        position: relative;
        float: left;
        margin-top: 35px;
        color: var(--white);
        text-shadow: none;
        min-height: 16px;
        font-size: 1.5rem;
    }

    .textoTitle {
        font-size: 3rem;
        display: block;
    }

    .textoTitle2 {
        margin-top: 15px;
        font-size: 1.5rem;
        display: block;
    }

    .logo-img {
        background: url(../Images/portada/logo.png) no-repeat scroll 0 0 transparent;
        width: 147px;
        height: 95px;
        float: left;
        margin-top: 10px;
        margin-left: 20px;
        margin-right: 20px;
        background-size: contain !important;
    }
}

.etiquetaTextoSearch {
    color: var(--white);
    font-size: 1rem;
    display: block;
    color: var(--white);
    padding: 5px 10px;
    font-size: 1rem;
}



.input-group-xs > .form-control,
.input-group-xs > .input-group-prepend > .input-group-text,
.input-group-xs > .input-group-append > .input-group-text,
.input-group-xs > .input-group-prepend > .btn,
.input-group-xs > .input-group-append > .btn {
    /*height: calc(2rem + 2px);
  padding: 0.1rem 0.3rem;*/
    height: 25px;
    font-size: 0.875rem;
    line-height: 1.1rem;
    border-radius: 0.2rem;
}

    .input-group-xs > .input-group-append > .btn > .fas {
        line-height: 0rem;
    }

/*************************************************
    MODAL SALVADO DE DATOS
*************************************************/
.labelTituloModal {
    font-size: 22px;
    font-weight: bold;
    color: white;
    background-color: var(--anchor-normal);
}

.capaTituloModal {
    font-size: 18px;
    /*font-weight: bold;*/
    color: antiquewhite;
    background-color: var(--anchor-normal);
}


/***********************************************  
    CLIENT AREA 
***********************************************/

.client-area {
    position: relative;
    width: 100%;
    height: 50px;
    background-color: var(--white);
    padding-top: 5px;
    padding-bottom: 10px;
    padding-left: 10px;
    float: none;
    clear: both;
}

@media (min-width: 77.5rem) {
    .client-area {
        position: relative;
        width: 300px;
        float: right;
        height: 120px;
        clear: none;
        background-color: var(--white);
        border-top-left-radius: 20px;
        padding-top: 0;
        padding-bottom: 0;
        margin-top: 10px;
        border-bottom: none;
    }
}



.hello-text {
    color: #333;
    font-size: 16px;
    text-align: left;
    font-weight: 500;
    line-height: 18px;
    float: left;
    display: inline-block;
    width: 70%;
}

.hello-text2 {
    color: #333;
    font-size: 16px;
    text-align: left;
    font-weight: 500;
    line-height: 18px;
    float: left;
    display: inline-block;
    width: 70%;
}


@media (min-width: 77.5rem) {

    .hello-text {
        color: #333;
        font-size: 18px;
        text-align: left;
        width: 90%;
        margin: 0 auto;
        margin-top: 15px;
        font-weight: 500;
        line-height: 22px;
        margin-left: 5px;
    }

    .hello-text2 {
        color: #333;
        font-size: 16px;
        text-align: left;
        font-weight: 500;
        line-height: 20px;
        float: left;
        display: inline-block;
        margin-left: 5px;
    }
}

.hello-links {
    float: right;
    display: inline-block;
    margin-bottom: 5px;
    padding-right: 10px;
    position: relative;
}


@media (min-width: 77.5rem) {
    .hello-links {
        text-align: left;
        float: left;
        display: inline-block;
        margin-left: 8px;
        margin-top: 10px;
    }
}

/*@media (min-width: 87.5rem) {
    .hello-links {
        width: 90%;
        margin: 0 auto;
        margin-top: 10px;
    }
}*/


.my-account-link {
    float: left;
    margin-right: 10px;
}

@media (min-width: 32.5rem) {
    .my-account-link {
        float: left;
        margin-right: 10px;
    }
}

@media (min-width: 48rem) {
    .my-account-link {
        float: left;
        margin-right: 20px;
    }
}

@media (min-width: 64rem) {
    .my-account-link {
        float: left;
        margin-right: 10px;
        font-size: 16px;
    }
}

@media (min-width: 87.5rem) {
    .my-account-link {
        float: left;
        margin-right: 10px;
        font-size: 16px;
    }
}

.escape-link {
    float: left;
}

.hello-links a {
    color: var(--menu-perfil);
    font-size: 16px;
}

@media (min-width: 64rem) {
    .hello-links a {
        color: var(--menu-perfil);
        font-size: 18px;
    }
}

.text-link {
    display: none;
}

/*min-width: 520px*/
@media (min-width: 32.5rem) {
    .text-link {
        display: none;
    }
}

/*min-width: 600px*/
@media (min-width: 37.5rem) {
    .text-link {
        display: inline;
    }
}

/*min-width: 768px*/
@media (min-width: 48rem) {
    .text-link {
        display: inline;
    }
}


/*min-width: 1040px*/
@media (min-width: 64rem) {
    .text-link {
        display: inline;
    }
}

/*min-width: 1200px*/
@media (min-width: 75rem) {
    .text-link {
        display: inline;
    }
}

/*min-width: 1400px*/
@media (min-width: 87.5rem) {
    .text-link {
        display: inline;
    }
}


/***********************************************  
    MENU 
***********************************************/

.flex-container {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    width:100%;
}


.flex-item:nth-child(1) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self:stretch;
    -ms-flex-item-align:stretch;
    align-self: stretch;
    background-color:var(--primary);
}

.flex-item:nth-child(2) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    background-color:var(--white);
}




.flex-item-ficha:nth-child(1) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
}

.flex-item-ficha:nth-child(2) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self:stretch;
    -ms-flex-item-align:stretch;
    align-self: stretch;
}



.pushy-open-left .general-wrapper {
    margin-left: 0;
}

.general-wrapper {
    margin-left: 30px;
    display: flex;
    height: 100%;
    flex-direction: column;
    -ms-flex-direction: column;
}

.pushy-open-left {
    height: auto;
}


.pushy-open-left .menu-btn-wrapper {
    width: 20px;
    position: absolute;
    overflow: visible;
    z-index: 9999;
    height: auto;
    background-color: transparent;
}

.menu-btn-wrapper {
    width: 30px;
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 9999;
    height: 100%;
    /*-webkit-align-self:stretch;
    -ms-flex-item-align:stretch;
    align-self: stretch;*/
    background-color: var(--primary);
}

.pushy-open-left .menu-btn {
    margin-top: 0;
}

.menu-btn {
    background: none;
    border: none;
    color: #000;
    position: relative;
    margin-top: 10px;
    cursor: pointer;
    text-align: center;
}


.pushy-open-left .menu-btn p {
    display: none;
    color: var(--white);
}

.menu-btn p {
    display: block;
    color: var(--white);
}

.menu-btn:before {
    font-size: 20px;
    margin-bottom: 5px;
    margin-left: 0;
    margin-right: 0;
    cursor: pointer;
}

/**********************CONTADORES*********************/

.counters-wrapper {
    width: 100%;
    float: none;
    margin-bottom: 30px !important;
}

.counters {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    justify-content:unsafe center;
    background-color: rgba(152,192,228, 0.1);
    border-top: 2px solid rgba(152,192,228, 0.7);
    border-bottom: 2px solid rgba(152,192,228, 0.7); 
    width:100%;
}

.one-counter {
    width: 40%;
    height: 85px;
    /*border: 1px solid #333;*/
    margin-left: 2px;
    margin-right: 2px;
    text-align: center;
    background-color: transparent;
}

.shiva {
    text-align: center;
    height: 40px !important;
}

.count {
    color: #333;
    font-size: 1rem;
    font-weight: 600;
}

.counter-name {
    font-size: 0.8rem;
    color: var(--anchor-normal);
    text-align: center;
    float: none;
    width: 100%;
    height: 44px;
    white-space: nowrap;
    font-weight: 500;
    margin-bottom: 2px;
}

@media (min-width: 28rem) {

    .one-counter {
        width: 20%;
        height: 90px;
        /*border: 1px solid #333;*/
        margin-left: 5px;
        margin-right: 5px;
        text-align: center;
        background-color: transparent;
    }

    .counter-name {
        font-size: 1rem;
        font-weight: 500;
        color: var(--anchor-normal);
        text-align: center;
        position: relative;
        width: 100%;
        height: 44px;
        white-space: nowrap;
        margin-bottom: 5px;
    }
}


@media (min-width: 64rem) {
    .one-counter {
        width: 10%;
        height: 90px;
        /*border: 1px solid #333;*/
        margin-left: 2px;
        margin-right: 2px;
        padding: 10px 4px;
        text-align: center;
        /*max-width:150px;*/
        background-color: transparent;
    }

    .count {
        color: #333;
        font-size: 1.4rem;
        font-weight: 600;
    }

    .counter-name {
        font-size: 1rem;
        font-weight: 500;
        color: var(--anchor-normal);
        text-align: center;
        position: relative;
        width: 100%;
        height: 45px;
        white-space: nowrap;
        margin-bottom: 5px;
    }
}



.progress1 {
    width: 100%;
    height: 30px;
}

.progress-wrap1 {
    background: #f80;
    margin: 10px 0;
    overflow: hidden;
    position: relative;
}

.progress-bar1 {
    background: #ddd;
    left: 0;
    position: absolute;
    top: 0;
}

.progress2 {
    width: 100%;
    height: 25px;
}

.progress-wrap2 {
    background: #830067;
    margin: 0px;
    overflow: hidden;
    position: relative;
    text-align: center;
}

.progress-bar2 {
    background: #ddd;
    left: 0;
    position: absolute;
    top: 0;
}


.percentage {
    position: relative;
    z-index: 9100;
    font-weight: 600;
    font-size: 20px;
    margin-top: 10px;
    text-align: center;
    color: #c6c6c6;
}


/*@media (min-width: 31.25rem){
    .percentage{
        position: absolute;
        top: 50px;
        left: 28%;
        z-index: 99999;
        font-weight: 600;
        font-size: 30px;
        margin-top: 0;
        text-align: center;
        color:#c6c6c6;
    }
}*/

.progress-general-wrapper {
    position: relative;
    width: 40%;
    margin: 0 auto;
    padding-top: 20px;
}

@media (min-width: 48rem) {
    .progress-general-wrapper {
        position: relative;
        width: 60%;
        margin: 0 auto;
        padding-top: 40px;
    }
}


.pushy-open-left .icon-cancel-circled:before {
    display: block;
    font-size: 20px;
}


.pushy-open-left .icon-menu:before {
    display: none;
}

.icon-cancel-circled:before {
    display: none;
}


.icon-menu:before {
    display: block;
    cursor: pointer;
    /*font-size: 26px;*/
    color: var(--white);
}

.links-wrapper li {
    color: #b3b3b1;
    font-size: 12px;
    margin-right: 0;
    float: none;
    text-align: center;
}

    .links-wrapper li:last-of-type {
        margin-right: 0;
    }

@media (min-width: 37.5rem) {
    .links-wrapper li {
        color: #b3b3b1;
        font-size: 18px;
        margin-right: 40px;
        float: left;
    }

        .links-wrapper li:last-of-type {
            margin-right: 0;
        }
}

.links-wrapper {
    width: auto;
    margin: 0 auto;
}

@media (min-width: 37.5rem) {
    .links-wrapper {
        width: 420px;
        margin: 0 auto;
    }
}










/*****************  MAIN *******************/

.main-sections {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    flex-wrap: wrap;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
}

@media (min-width: 37.5rem) {
    .main-sections {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (min-width: 68.75rem) {
    .main-sections {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}


.section-button {
    width: 48%;
    margin-right: 2%;
    margin-bottom: 40px;
}

@media (min-width: 28.125rem) {
    .section-button {
        width: 20%;
        margin-right: 2%;
        margin-bottom: 20px;
    }
}

@media (min-width: 64rem) {
    .section-button {
        width: 20%;
        margin-right: 2%;
        margin-bottom: 20px;
    }
}


.section-button p {
    font-size: 14px;
    text-align: center;
    color: #293e6b;
    margin-top: 10px;
}


@media (min-width: 37.5rem) {
    .section-button p {
        font-size: 18px;
        text-align: center;
        color: #293e6b;
        margin-top: 10px;
    }
}


.section-image {
    width: 100px;
    margin: 0 auto;
    height: auto;
    overflow: hidden;
    border: #c6c6c6 solid 1px;
    padding: 20px;
    border-radius: 20px;
}


    .section-image img {
        width: 100%;
    }


@media (min-width: 64rem) {
    .section-image {
        width: 150px;
        margin: 0 auto;
        height: auto;
        overflow: hidden;
        border: #c6c6c6 solid 1px;
        padding: 30px;
        border-radius: 20px;
    }
}


.section-image img {
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    transform: scale(1.0);
}

    .section-image img:hover {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -o-transform: scale(1.2);
        transform: scale(1.2);
    }



.information-wrapper {
    width: 100%;
    float: none;
    padding-right: 0;
}

    .information-wrapper:after {
        content: "";
        display: block;
        width: 100%;
        margin: 0 auto;
        border-bottom: 1px solid #727272;
        margin-bottom: 40px;
        margin-top: 40px;
    }


@media (min-width: 57.5rem) {
    .information-wrapper {
        width: 40%;
        float: left;
        padding-right: 40px;
    }

        .information-wrapper:after {
            display: none;
        }
}


@media (min-width: 75rem) {
    .information-wrapper {
        width: 50%;
        float: left;
        padding-right: 40px;
    }

        .information-wrapper:after {
            display: none;
        }
}

.news-wrapper {
    width: 100%;
    float: none;
    padding-left: 0;
    border-left: none;
}

    .news-wrapper .news-image {
        width: 100%;
    }

.big-news-section img {
    width: 100%;
}

@media (min-width: 57.5rem) {
    .news-wrapper {
        width: 60%;
        float: right;
        padding-left: 40px;
        border-left: 1px solid #727272;
    }
}

@media (min-width: 75rem) {
    .news-wrapper {
        width: 50%;
        float: right;
        padding-left: 40px;
        border-left: 1px solid #727272;
    }
}

.date {
    color: #3c86c9;
    font-size: 14px;
    margin-bottom: 5px;
}

@media (min-width: 32.5rem) {
    .date {
        color: #3c86c9;
        font-size: 14px;
        margin-bottom: 10px;
        margin-top: 20px;
    }
}


@media (min-width: 10rem) {
    .news-text1 {
        /*color: #727272;*/
        font-weight: 400;
        font-size: 1.12rem;
        text-align: justify;
    }

    .font-size-smallLeerMas {
        font-size: 100% !important;
    }

    .news-titulo{
        font-weight: 400;
        font-size: 1.14rem;
        text-align: justify;
    }
   
}

@media (min-width: 61.876rem) {
    .news-text1 {
        /*color: #727272;*/
        font-weight: 400;
        font-size: 0.9rem;
        text-align: justify;
    }

    .font-size-smallLeerMas {
        font-size: 80% !important;
    }

    .news-titulo{
        font-weight: 400;
        font-size: 1.1rem;
        text-align: justify;
    }
}

.news-date {
    color: #3c86c9;
    font-size: 0.8rem;
}

.information-text {
    color: #727272;
    font-weight: 400;
    font-size: 18px;
    text-align: justify;
}

.news-text {
    color: #727272;
    font-weight: 400;
    font-size: 0.9rem;
    text-align: justify;
}

.information-section {
    margin-bottom: 20px;
    clear: both;
    float: none;
}

.news-section {
    float: left;
    clear: both;
    margin-bottom: 20px;
}

.news-section:after {
    content: "";
    display: block;
    width: 100%;
    margin: 0 auto;
    border-bottom: 1px solid #727272;
    margin-bottom: 20px;
    margin-top: 20px;
}

@media (min-width: 32.5rem) {
    .news-section {
        float: left;
        clear: none;
        width: 30%;
        margin-right: 5%;
        margin-bottom: 40px;
    }

    .news-section:after {
        display: none;
    }


    .news-section:nth-of-type(3n) {
        margin-right: 0;
    }

    .news-section:nth-of-type(3n+1) {
        clear: both;
    }

}

.read-more {
    clear: both;
    float: none;
    color: #0063be;
    font-weight: 600;
    margin-top: 20px;
}

.news-content .read-more {
    clear: both;
    float: none;
    color: #0063be;
    font-weight: 600;
    margin-top: 10px;
}

.news-content {
    margin-top: 10px;
}

.read-more a {
    color: #0063be;
}

.main-news-wrapper {
    width: 100%;
    background-color: #eee;
    clear: both;
    float: none;
    padding-top: 10px;
}

.news-secondary-wrapper {
    clear: both;
    float: none;
    width: 100%;
    margin: 0 auto;
    padding-top: 20px;
    padding-bottom: 10px;
}

.news-background {
    background-color: #f4f4f4;
}

@media (min-width: 32.5rem) {
    .news-secondary-wrapper {
        clear: both;
        float: none;
        width: 85%;
        margin: 0 auto;
        padding-top: 20px;
        padding-bottom: 40px;
    }
}

.news-card-item {
    max-width: 18rem;
    min-height: 22rem;
    height: auto;
}

.news-card-item-horizontales {
    max-height: 18rem;
    width: auto;
}

.border-news {
    
    border-top: 1px solid rgba(0,0,0,.125);
    padding-top: 0.5rem !important;
}

@media (min-width: 63rem) {
    .border-news {
        border:none;
        padding-top:0rem !important;
    }
}

.card-resume{
    border: 1px solid var(--orange) !important;
}

/***********************************************************
	BOTONES
***********************************************************/

.btn {
    border-radius: 0.35rem;
    /*display: flex;
    flex-direction: row;
    justify-content: space-between;*/
}

.btn-group-sm > .btn, .btn-sm {
    margin-bottom: 0.5rem;
    padding: .2rem .3rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .35rem;
}

/*BOTON DEFAULT*/
.btn-default {
    color: var(--white);
    background-color: var(--secondary);
    border-color: var(--secondary);
    margin-top: 0px;
}

@media (min-width: 48rem) {

    .btn-default {
        color: var(--white);
        background-color: var(--secondary);
        border-color: var(--secondary);
        margin-top: 0px;
    }
}

.btn-default:hover {
    color: var(--white);
    background-color: #85ABC1;
    border-color: #85ABC1;
}

.btn-default:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.aspNetDisabled.btn-default {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

.btn-default.disabled {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

.btn-default:not([disabled]):not(.disabled):active, .btn-default:not([disabled]):not(.disabled).active,
.show > .btn-default.dropdown-toggle {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

    .btn-default:not([disabled]):not(.disabled):active:focus, .btn-default:not([disabled]):not(.disabled).active:focus,
    .show > .btn-default.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }
/*END BOTON DEFAULT*/


/*BOTON ORANGE*/
.btn-orange {
    color: var(--white);
    background-color: var(--orange);
    border-color: var(--orange);
    margin-top: 0px;
}

.btn-orange:hover {
    color: var(--white);
    background-color: #CC8400;
    border-color: #CC8400;
}

.btn-orange:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.aspNetDisabled.btn-orange {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

.btn-orange.disabled {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

.btn-orange:not([disabled]):not(.disabled):active, .btn-orange:not([disabled]):not(.disabled).active,
.show > .btn-orange.dropdown-toggle {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

    .btn-orange:not([disabled]):not(.disabled):active:focus, .btn-orange:not([disabled]):not(.disabled).active:focus,
    .show > .btn-orange.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }


.btn-outline-orange {
    color: var(--orange);
    background-color: transparent;
    background-image: none;
    border-color: var(--orange);
}

    .btn-outline-orange:hover {
        color: var(--white);
        background-color: var(--orange);
        border-color: var(--orange);
    }

    .btn-outline-orange:focus, .btn-outline-orange.focus {
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
    }

    .btn-outline-orange.disabled, .btn-outline-orange:disabled {
        color: var(--orange);
        background-color: transparent;
    }

    .btn-outline-orange:not(:disabled):not(.disabled):active, .btn-outline-orange:not(:disabled):not(.disabled).active,
    .show > .btn-outline-orange.dropdown-toggle {
        color: var(--white);
        background-color: var(--orange);
        border-color: var(--orange);
    }

        .btn-outline-orange:not(:disabled):not(.disabled):active:focus, .btn-outline-orange:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outline-orange.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
        }

/*END BOTON ORANGE*/


/*BOTON SUCCESS*/
.btn-success {
    color: var(--white);
    background-color: var(--success);
    border-color: #f6f6f5;
    margin-top: 0px;
}

.btn-success:hover {
    color: var(--white);
    background-color: #B2DB93;
    border-color: #f6f6f5;
}

.btn-success:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.aspNetDisabled.btn-success {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

.btn-success.disabled {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

.btn-success:not([disabled]):not(.disabled):active, .btn-success:not([disabled]):not(.disabled).active,
.show > .btn-orange.dropdown-toggle {
    background-color: #b6c2c9;
    border-color: #b6c2c9;
    color: var(--white) !important;
}

    .btn-success:not([disabled]):not(.disabled):active:focus, .btn-success:not([disabled]):not(.disabled).active:focus,
    .show > .btn-success.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }
/*END BOTON SUCCESS*/



/*BOTON BLUE1*/
.btn-blue1 {
    color: var(--white);
    background-color: var(--blue);
    border-color: var(--blue);
    margin-top: 0px;
}

    .btn-blue1:hover {
        color: var(--white);
        background-color: #0e7180;
        border-color: #0e7180;
    }

.btn-blue2 {
    color: var(--white);
    background-color: #1974D2;
    border-color: #1974D2;
    margin-top: 0px;
}

    .btn-blue2:hover {
        color: var(--white);
        background-color: #0c3a69;
        border-color: #0c3a69;
    }


/*BOTON PINK1*/
.btn-pink1 {
    color: var(--white);
    background-color: var(--pink);
    border-color: var(--pink);
    margin-top: 0px;
}

    .btn-pink1:hover {
        color: var(--white);
        background-color: #973171;
        border-color: #973171;
    }


/*BOTON RED1*/
.btn-red1 {
    color: var(--white);
    background-color: var(--red);
    border-color: var(--red);
    margin-top: 0px;
}

    .btn-red1:hover {
        color: var(--white);
        background-color: #E35D6A;
        border-color: #E35D6A;
    }

.btn-red-light {
    color: var(--white);
    background-color: var(--red-light);
    border-color: var(--red-light);
    margin-top: 0px;
}

    .btn-red-light:hover {
        color: var(--white);
        background-color: #B54A54;
        border-color: #B54A54;
    }


/*BOTON PURPLE1*/
.btn-purple1 {
    color: var(--white);
    background-color: var(--purple);
    border-color: var(--purple);
    margin-top: 0px;
}

    .btn-purple1:hover {
        color: var(--white);
        background-color: #662566;
        border-color: #662566;
    }


/*BOTON GREEN1*/
.btn-green1 {
    color: var(--white);
    background-color: #2E5C1A;
    border-color: #2E5C1A;
    margin-top: 0px;
}

    .btn-green1:hover {
        color: var(--white);
        background-color: #819d75;
        border-color: #819d75;
    }



.btn-info {
    color: #fff !important;
    background-color: var(--info) !important;
    border-color: var(--info) !important;
}

    .btn-info:hover {
        color: #fff !important;
        background-color: #70939c !important;
        border-color: #70939c !important;
    }

    .btn-info:focus, .btn-info.focus {
        box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5) !important;
    }

    .btn-info.disabled, .btn-info:disabled {
        color: #fff !important;
        background-color: var(--info) !important;
        border-color: var(--info) !important;
    }

    .btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
    .show > .btn-info.dropdown-toggle {
        color: #fff !important;
        background-color: #70939c !important;
        border-color: #70939c !important;
    }

        .btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus,
        .show > .btn-info.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
        }


/***********************************************************
	LISTAS
***********************************************************/
.lista1 {
    width: 100%;
    list-style: none;
    margin-left: 10px;
    padding-left: 0px;
    margin-top:10px;
}

    .lista1 li {
        background: url(../images/square-rounded-16.png) 0px 4px no-repeat;
        padding: 4px 0px 4px 20px;
        color: #606060;
    }

        /*.lista1 li a,
        .lista1 li a:hover {
            color: #606060;
        }*/

.lista2 {
    width: 100%;
    list-style: none;
    margin-left: 10px;
    padding-left: 0px;
    margin-top: 10px;
}

    .lista2 li {
        background: url(../images/bullet_grey.png) 0px 4px no-repeat;
        padding: 0px 0px 8px 20px;
        color: #606060;
    }

/***********************************************************
	LIST IDIOMA
***********************************************************/
.listidioma {
    /*float: right;*/
    padding: 4px 8px 0px 0px;
    border: none;
    list-style: none;
    outline: none;
    cursor: default;
}

    .listidioma > li {
        float: left;
        background: #365974;
        margin-left: 4px;
        font-size: 0.7rem;
    }

@media (min-width: 64rem) {
    .listidioma > li {
        float: left;
        background: #365974;
        margin-left: 4px;
        font-size: 0.8rem;
    }
}


.listidioma > li > div.inactive {
    color: #365974;
    background-color: #365974;
    padding: 1px;
    width: 60px !important;
    text-align: center;
}

    .listidioma > li > div.inactive > a {
        color: var(--white);
        text-decoration: none;
    }

    .listidioma > li > div.inactive:hover,
    .listidioma > li > div.inactive:active,
    .listidioma > li > div.inactive:focus {
        color: var(--white);
        text-decoration: none;
        border: 1px solid #8A920A;
        padding: 1px;
    }

.listidioma > li > div.active {
    color: var(--white);
    background-color: #364D74;
    padding: 1px;
    width: 60px !important;
    text-align: center;
    border: 1px solid #8A920A;
}

    .listidioma > li > div.active > a {
        color: var(--white);
        text-decoration: none;
    }

    .listidioma > li > div.active:hover,
    .listidioma > li > div.active:active,
    .listidioma > li > div.active:focus {
        color: var(--white);
        text-decoration: none;
        border: 1px solid #8A920A;
        padding: 1px;
    }

/*************************************************
    MODAL CONFIRMACI�N
*************************************************/
.imagen-centrada {
    margin-left: 360%;
}

.texto_modal_centrado {
    margin-top: 7%;
}




/*************************************************
    SCROLL PAGE TO UP
*************************************************/
.scrollup {
    width: 42px;
    height: 42px;
    opacity: 0.4;
    position: fixed;
    bottom: 30px;
    right: 30px;
    display: none;
    text-indent: -9999px;
    z-index: 9999 !important;
    background: url('../Images/ico_top_black.png') no-repeat;
}
/*************************************************/





/*************************************************
    LABELS
*************************************************/
.label {
    display: block;
    margin-bottom: .1rem;
    color: #365974 !important;
}

    .label.required:after {
        content: "(*)";
        margin-left: 3px;
        display: inline-block;
        color: #ff0000; 
        font-size:80%;
    }

.label-plaintext {
    display: block;
    width: 100%;
    padding-top: .3rem;
    padding-bottom: .2rem;
    margin-bottom: 1rem;
    line-height: 1.5rem;
    background-color: transparent;
    border: solid transparent;
    border-width: 1px 0;
    border-top: 1px solid #d8d7d7;
}

.line-plaintext {
    border: solid transparent;
    border-width: 1px 0;
    border-top: 1px solid #d8d7d7;
}



.label-plaintext-compacto {
    display: block;
    width: 100%;
    padding-top: .2rem;
    padding-bottom: .2rem;
    margin-bottom: 0.6rem;
    line-height: 1.2rem;
    background-color: transparent;
    border: solid transparent;
    border-width: 1px 0;
    border-top: 1px solid #d8d7d7;
    font-size: 1rem !important;
}

.label-compacto {
    display: block;
    margin-bottom: .1rem;
    color: #365974 !important;
    font-size: 1rem !important;
}

.label-inline {
    display: inline;
    margin-bottom: .1rem;
}

.label-inline-compacto {
    display: inline;
    margin-bottom: .1rem;
    font-size: 1rem !important;
}


.form-group {
    margin-bottom: 0.4rem;
}

.card-body-small {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1rem 0.8rem 0.8rem 0.8rem;
}

.required:after {
    content: "(*)";
    margin-left: 3px;
    display: inline-block;
    color: #ff0000;
}

/**********************************/
/*CG. SOLUCIONA DISTORSION EN IE11*/
/**********************************/
.card-body,
.card-body-small,
.card-header {
    height:100%;
}

.card-header img {
    width:100%;
    height:100%;
}
/**********************************/


.labelPaginado {
    font-size: 0.8rem;
    line-height: 1rem;
}

@media (min-width: 48rem) {
    .labelPaginado {
        font-size: 1rem;
        line-height: 1.2rem;
    }
}


.responsiveText {
    font-size: 0.8rem;
    line-height: 1rem;
}

@media (min-width: 48rem) {
    .responsiveText {
        font-size: 1.1rem;
        line-height: 1.4rem;
    }
}


/*************************************************
    FONT SIZES
*************************************************/
.font-size-big0 {
    font-size: 1rem !important;
}

.font-size-big1 {
    font-size: 0.9rem !important;
}

.font-size-big2 {
    font-size: 1rem !important;
}

.font-size-big3 {
    font-size: 1rem !important;
}

.font-size-big4 {
    font-size: 1rem !important;
}

.font-size-big5 {
    font-size: 1rem !important;
}

.font-size-small1 {
    font-size: 80% !important;
}

.font-size-small2 {
    font-size: 90% !important;
}

@media (min-width: 48rem) {
    .font-size-big0 {
        font-size: 1rem !important;
    }

    .font-size-big1 {
        font-size: 1.1rem !important;
    }

    .font-size-big2 {
        font-size: 1.2rem !important;
    }

    .font-size-big3 {
        font-size: 1.3rem !important;
    }

    .font-size-big4 {
        font-size: 1.4rem !important;
    }

    .font-size-big5 {
        font-size: 1.5rem !important;
    }
}

.width32 {
    width: 32px !important;
}

.width48 {
    width: 48px !important;
}

.width50 {
    width: 50px !important;
}

.width60 {
    width: 60px !important;
}

.width100 {
    width: 100px !important;
}

.width120 {
    width: 120px !important;
}

.width150 {
    width: 150px !important;
}

.width200 {
    width: 200px !important;
}

.width250 {
    width: 250px !important;
}

.width300 {
    width: 300px !important;
}

.width350 {
    width: 350px !important;
}
.width50-p{
    width:50%;
}
.max-width50 {
    max-width: 50px !important;
}

.max-width100 {
    max-width: 100px !important;
}

.max-width150 {
    max-width: 150px !important;
}

.max-width200 {
    max-width: 200px !important;
}

.max-width250 {
    max-width: 250px !important;
}

.max-width300 {
    max-width: 300px !important;
}

.max-width350 {
    max-width: 350px !important;
}

.max-width400 {
    max-width: 400px !important;
}



.min-width100 {
    min-width: 100px !important;
}

.min-width150 {
    min-width: 150px !important;
}

.min-width200 {
    min-width: 200px !important;
}

.min-width250 {
    min-width: 250px !important;
}

@media (max-width: 32rem) {
    .min-width100,
    .min-width150,
    .min-width200,
    .min-width250 {
        min-width: 0px;
    }

}


    .center {
        text-align: center;
    }

    .flotando {
        float: left;
        width: 100%;
        display: inline;
        margin-top: 2px;
        margin-bottom: 3px;
    }


    .form-title {
        position: absolute;
        z-index: 850;
        background-color: var(--white);
        margin: -15px 0 0 15px;
        padding: 2px 5px 2px 5px;
        color: slategray; /*//var(--anchor-normal);*/
        font-size: 1em;
        letter-spacing: -0.5px;
    }

    @media (min-width: 48rem) {
        .form-title {
            position: absolute;
            z-index: 850;
            background-color: var(--white);
            margin: -15px 0 0 15px;
            padding: 2px 5px 2px 5px;
            color: slategray; /*//var(--anchor-normal);*/
            font-size: 1.2em;
            letter-spacing: -0.5px;
        }
    }


    .texto-entero {
        white-space: normal !important;
    }

    @media (min-width: 32rem) {
        .texto-entero {
            white-space: nowrap !important;
        }
    }


/***********************************************************
    Formulario Registrar Identificaci�n
***********************************************************/
    #panelMenuAlta1, .panelMenuAlta1 {
        display: none;
    }

    #panelMenuAlta2, .panelMenuAlta2 {
        display: block;
    }

    #panelMenuAlta3, .panelMenuAlta3 {
        display: block;
    }

    @media (min-width: 64rem) {

        #panelMenuAlta1, .panelMenuAlta1 {
            display: block;
        }

        #panelMenuAlta2, .panelMenuAlta2 {
            display: none;
        }

        #panelMenuAlta3, .panelMenuAlta3 {
            display: none;
        }
    }


    /***********************************************************
    Men� de opciones formulario de Registrar Identificaci�n 
    media >= 1024px o 64rem
***********************************************************/
    .tab-form {
        display: block;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        border-bottom: none;
    }

    .tab-item {
        display: block;
        margin-bottom: 10px;
        border: 1px solid #ddd;
        border-radius: 4px 4px 0 0;
        background-color: #ddd;
        color: var(--white);
        height: auto;
        width: 100%;
        text-align: left;
        padding: 4px 8px;
    }

    a.tab-item,
    a.tab-item:link,
    a.tab-item:visited {
        cursor: default;
        color: var(--white);
        text-decoration: none;
    }

    .tab-item.completed {
        background-color: var(--green);
        border: 1px solid var(--green);
        width: 100%;
        padding: 4px 8px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    .tab-item.activated {
        background-color: var(--white);
        border: 1px solid var(--secondary);
        width: 100%;
        padding: 4px 8px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    a.tab-item.completed,
    a.tab-item.completed:link,
    a.tab-item.completed:visited {
        cursor: pointer;
        /*color: var(--green);*/
        color: var(--white);
        text-decoration: none;
    }

        a.tab-item.completed:hover {
            color: #44e712;
            border: 1px solid #44e712;
            cursor: pointer;
            text-decoration: none;
        }


    a.tab-item.activated,
    a.tab-item.activated:link,
    a.tab-item.activated:visited {
        cursor: pointer;
        color: var(--secondary);
        text-decoration: none;
    }

        a.tab-item.activated:hover {
            color: #44e712;
            border: 1px solid #44e712;
            cursor: pointer;
            text-decoration: none;
        }


    .tab-item.active {
        color: var(--white);
        background-color: var(--secondary);
        border: 1px solid var(--secondary);
        width: 100%;
        padding: 4px 8px;
        text-align: left;
        margin-bottom: 0px;
        font-size: 1.2rem;
    }

    .tab-form-card {
        position: relative;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        min-width: 0;
        word-wrap: break-word;
        background-color: var(--white);
        background-clip: border-box;
        border: 1px solid rgba(0, 0, 0, 0.125);
        border-top: none;
        border-radius: 0 0 0.25rem 0.25rem;
    }

    .tab-form-collapse {
        margin-bottom: 0;
        border: 1px solid #4981A2;
        background-color: var(--white);
        background-clip: border-box;
        border-radius: 0.25rem 0.25rem 0 0;
        text-align: left;
        padding: 0.5rem 0.9rem;
        display: flex;
        justify-content: space-between;
    }

    .tab-form-collapse-resume {
        margin-bottom: 0;
        border-bottom: 2px solid #4981A2;
        background-color: var(--white);
        background-clip: border-box;
        border-radius: 0.25rem 0.25rem 0 0;
        text-align: left;
        padding: 0.5rem 0.9rem;
        display: flex;
        justify-content: space-between;
    }

    .tab-form-collapse span {
        font-size: 1.1rem;
        color: #4981A2;
    }

    @media (min-width: 64rem) {
        .tab-form-collapse span {
            font-size: 1.2rem;
            color: #4981A2;
        }
    }



/***********************************************************
   Men� de opciones formulario de Registrar Identificaci�n 
    media < 1024px o 64rem
***********************************************************/

    .f1-steps {
        overflow: hidden;
        position: relative;
        margin-top: 20px;
    }

    .f1-progress {
        position: absolute;
        top: 24px;
        left: 0;
        width: 100%;
        height: 1px;
        background: #ddd;
    }

    .f1-progress-line {
        position: absolute;
        top: 0;
        left: 0;
        height: 1px;
        background: var(--secondary);
    }

    .f1-step {
        position: relative;
        float: left;
        width: 14%;
        padding: 0 5px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

        .f1-step .f1-step-icon {
            display: inline-block;
            width: 40px;
            height: 40px;
            margin-top: 4px;
            background: #ddd;
            text-align: center;
            font-size: 16px;
            color: var(--white);
            line-height: 40px;
            -moz-border-radius: 50%;
            -webkit-border-radius: 50%;
            border-radius: 50%;
        }


        .f1-step .f1-step-text {
            display: block;
            color: #ccc;
            margin: 0px;
            text-align: center;
            width: 100%;
        }

    .f1-step-text span {
        /*font-weight:bold;*/
    }


    .f1-step.active .f1-step-icon {
        width: 50px;
        height: 50px;
        margin-top: 0;
        background: var(--secondary);
        font-size: 22px;
        line-height: 48px;
    }

    .f1-step.active .f1-step-text {
        color: var(--secondary);
        font-weight: bold;
    }


    .f1-step.activated .f1-step-icon {
        background: var(--white);
        border: 1px solid var(--secondary);
        color: var(--secondary);
        line-height: 38px;
    }

    .f1-step.activated .f1-step-text {
        color: var(--secondary);
    }


    .f1-step.completed .f1-step-icon {
        background: var(--green);
        border: 1px solid var(--green);
        color: var(--white);
        line-height: 38px;
    }

    .f1-step.completed .f1-step-text {
        color: var(--secondary);
    }


    a.f1-step {
        cursor: default;
        text-decoration: none;
    }

        a.f1-step.activated:hover span,
        a.f1-step.completed:hover span {
            color: #44e712;
            cursor: pointer;
            text-decoration: none;
        }

        a.f1-step.activated:hover .f1-step-icon,
        a.f1-step.completed:hover .f1-step-icon {
            color: #44e712;
            border: 1px solid #44e712;
            cursor: pointer;
            text-decoration: none;
        }





/*************************************************************
    MENU-STEPS
*************************************************************/

    .menu-steps {
        overflow: hidden;
        position: relative;
        margin-top: 20px;
    }

    .menu-progress {
        position: absolute;
        top: 24px;
        left: 0;
        width: 100%;
        height: 1px;
        background: #ddd;
    }

    .menu-progress-line {
        position: absolute;
        top: 0;
        left: 0;
        height: 1px;
        background: var(--secondary);
    }

    .menu-step {
        position: relative;
        float: left;
        width: 7%;
        padding: 0 5px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

        .menu-step.hide {
            display: none;
        }

        .menu-step .menu-step-icon {
            display: inline-block;
            width: 40px;
            height: 40px;
            margin-top: 4px;
            background: #ddd;
            text-align: center;
            font-size: 16px;
            color: var(--white);
            line-height: 40px;
            -moz-border-radius: 50%;
            -webkit-border-radius: 50%;
            border-radius: 50%;
        }


        .menu-step .menu-step-text {
            display: block;
            color: #ccc;
            margin: 0px;
            text-align: center;
            width: 100%;
        }

    .menu-step-text span {
        /*font-weight:bold;*/
    }


    .menu-step.active .menu-step-icon {
        width: 50px;
        height: 50px;
        margin-top: 0;
        background: var(--secondary);
        font-size: 22px;
        line-height: 48px;
    }

    .menu-step.active .menu-step-text {
        color: var(--secondary);
        font-weight: bold;
    }

    /* Nuevas css para los botones de activos del men� de migas de pan*/
    a.menu-step.active:hover span {
        color: cornflowerblue;
        cursor: pointer;
        text-decoration: none;
    }

    a.menu-step.active:hover .menu-step-icon {
        color: aquamarine;
        border: 1px solid cornflowerblue;
        cursor: pointer;
        text-decoration: none;
    }
    /* fin nuevas css para los botones de activos del men� de migas de pan*/




    .menu-step.activated .menu-step-icon {
        background: var(--white);
        border: 1px solid var(--secondary);
        color: var(--secondary);
        line-height: 38px;
    }

    .menu-step.activated .menu-step-text {
        color: var(--secondary);
    }


    .menu-step.completed .menu-step-icon {
        background: var(--green);
        border: 1px solid var(--green);
        color: var(--white);
        line-height: 38px;
    }

    .menu-step.completed .menu-step-text {
        color: var(--secondary);
    }


    a.menu-step {
        cursor: pointer;
        text-decoration: none;
    }

        a.menu-step.activated:hover span,
        a.menu-step.completed:hover span {
            color: #44e712;
            cursor: pointer;
            text-decoration: none;
        }

        a.menu-step.activated:hover .menu-step-icon,
        a.menu-step.completed:hover .menu-step-icon {
            color: #44e712;
            border: 1px solid #44e712;
            cursor: pointer;
            text-decoration: none;
        }

    .menu-step.denuncia {
        width: 14% !important;
    }

/***********************************************************
   Inputs style
***********************************************************/


    .radio input[type="radio"],
    .checkbox input[type="checkbox"],
    .radio input.radio,
    .checkbox input.checkbox {
        margin-top: 4px;
        margin-left: 0;
    }

        .checkbox input[type="checkbox"] + label,
        .checkbox input.checkbox + label,
        .radio input[type="radio"] + label,
        .radio input.radio + label {
            padding-left: 4px;
            display: inline;
        }



    .radio.radiobuttonlist input[type="radio"],
    .checkbox.checkboxlist input[type="checkbox"],
    .radio.radiobuttonlist input.radio,
    .checkbox.checkboxlist put.checkbox {
        margin-left: 0;
    }

        .checkbox.radiobuttonlist input[type="checkbox"] + label,
        .checkbox.radiobuttonlist input.checkbox + label .radio.radiobuttonlist input[type="radio"] + label,
        .radio.radiobuttonlist input.radio + label {
            padding-left: 4px;
            display: inline;
            margin-bottom: 0.2rem;
            margin-left: 0.9rem;
        }


    .radio.radiobuttonlistHorizontal input[type="radio"],
    .checkbox.radiobuttonlistHorizontal input[type="checkbox"] {
        margin-left: 0.6rem;
        display: inline-block;
    }

    .radio.radiobuttonlistHorizontal label,
    .checkbox.radiobuttonlistHorizontal label {
        margin-bottom: 0rem;
        margin-left: 0rem;
        display: inline-block;
    }

    @media (min-width: 32.5rem) {
        .radio.radiobuttonlistHorizontal input[type="radio"],
        .checkbox.radiobuttonlistHorizontal input[type="checkbox"] {
            margin-left: 0.6rem;
            display: inline-block;
        }

        .radio.radiobuttonlistHorizontal label,
        .checkbox.radiobuttonlistHorizontal label {
            margin-bottom: 0rem;
            margin-left: 0rem;
            display: inline-block;
        }
    }

    .checkbox-space input[type="checkbox"] {
        margin: 10px !important;
        vertical-align: middle;
        display: inline;
    }

    select.form-control:not([size]):not([multiple]) {
        height: calc(2.25rem + 2px);
        color: #6C757D;
    }

    select.form-control-sm:not([size]):not([multiple]), .input-group-sm > select.form-control:not([size]):not([multiple]) {
        height: calc(2.25rem + 2px);
        color: #6C757D;
    }

textarea {
    display: block;
    width: 100%;
    color: var(--font-color);
    background-color: var(--white);
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    padding: 0.25rem 0.5rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.2rem;
    margin-bottom: 10px;
    height: auto;
}

select,
input[type="text"],
input[type="password"],
input[type=number],
input[type=search],
input[type=phone],
input.password {
    display: block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--font-color);
    background-color: var(--white);
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

        textarea:disabled,
        select:disabled,
        input[type="text"]:disabled,
        input.text:disabled {
            background-color: #ececec;
            opacity: 1;
        }

        input[type="text"]:focus,
        input[type="password"]:focus,
        input.text:focus,
        input.password:focus{
            border: 1px solid #ddd;
        }


input[type=date], input[type=datetime-local], input[type=month], input[type=time] {
    display: block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--font-color);
    background-color: var(--white);
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

    /* Colocaci�n del aspa de borrado de contenido de la caja de texto*/
    input[type="search"] {
        -webkit-appearance: searchfield;
    }

        input[type="search"]::-webkit-search-cancel-button {
            -webkit-appearance: searchfield-cancel-button;
        }


    input[type="file" i] {
        align-items: baseline;
        color: inherit;
        text-align: start !important;
        width: 150px !important;
    }

    @media (min-width: 32.5rem) {
        input[type="file" i] {
            align-items: baseline;
            color: inherit;
            text-align: start !important;
            width: 100% !important;
        }
    }

    .tipoInputFile > div > div > input[type="file"] {
        display: none;
    }


    .whiteline {
        margin-top: 20px;
    }
    /*este lo uso en buscadores cuando un literal necesita dos l�neas y hay que alinear el resto de filtro de una fila*/

    input[type="text"].aspNetDisabled {
        background-color: #ececec;
        opacity: 1;
    }




input[type="text"]::-webkit-input-placeholder, 
input[type="text"]::-moz-placeholder,
input[type="text"]:-ms-input-placeholder,
input[type="text"]::-ms-input-placeholder,
input[type="text"]::placeholder {
    color: #A6ACB1;
    opacity: 1;
}




/***************************************************************************
  CG.20170503. CHECKBOX MARCAR TODOS BUSCADOR Y GESTION DE MICROCHIPS
****************************************************************************/
label.checkbox input[type="checkbox"] {
    display: none;
}

    label.checkbox span {
        display: inline-block;
        border: 2px solid #BBB;
        border-radius: 10px;
        width: 25px;
        height: 25px;
        background: var(--white);
        vertical-align: middle;
        margin: 3px;
        transition: width 0.1s, height 0.1s, margin 0.1s;
        margin-left: 0px;
    }

    label.checkbox :checked + span {
        background: var(--white) url("../Images/typo/tick24.png") 0 0 repeat-x;
        width: 27px;
        height: 27px;
        margin: 2px;
        margin-left: 0px;
    }


    label.checkbox > span.aspNetDisabled input[type="checkbox"] {
        display: none;
    }

    label.checkbox > span.aspNetDisabled span {
        display: inline-block;
        border: 2px solid #BBB;
        border-radius: 10px;
        width: 25px;
        height: 25px;
        background: var(--white);
        vertical-align: middle;
        margin: 3px;
        transition: width 0.1s, height 0.1s, margin 0.1s;
        margin-left: 0px;
    }

    label.checkbox > span.aspNetDisabled :checked + span {
        background: var(--white) url("../Images/typo/tick24.png") 0 0 repeat-x;
        width: 27px;
        height: 27px;
        margin: 2px;
        margin-left: 0px;
    }


    /**********************************************************/
    /*        DATOS USUARIO                                   */
    /**********************************************************/
    .textboxClave {
        position: absolute;
        top: 24px;
        /*margin-left: 75px;*/
        margin-left: 40px;
        background-color: gainsboro !important;
    }

    .textboxInactivo {
        background-color: gainsboro;
    }


    /***********************************************************
   ui-autocomplete style
***********************************************************/
    .ui-autocomplete {
        max-height: 200px;
        overflow-y: auto;
        /* prevent horizontal scrollbar */
        overflow-x: hidden;
    }
    /* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
    * html .ui-autocomplete {
        height: 200px;
    }

    @media (min-width: 64rem) {
        .ui-autocomplete {
            max-height: 300px;
            overflow-y: auto;
            /* prevent horizontal scrollbar */
            overflow-x: hidden;
        }
        /* IE 6 doesn't support max-height
    * we use height instead, but this forces the menu to always be this tall
    */
        * html .ui-autocomplete {
            height: 300px;
        }
    }


    .ui-widget-content {
        border: 1px solid #dddddd;
        background: var(--white);
        color: #333333;
        width: 90%;
        z-index: 10000 !important;
    }

    @media (min-width: 64rem) {
        .ui-widget-content {
            border: 1px solid #dddddd;
            background: var(--white);
            color: #333333;
            width: 90%;
            z-index: 10000 !important;
        }
    }



    .ui-widget {
        font-family: 'Abel-Regular';
        font-size: 0.9em;
    }

        .ui-widget .ui-widget {
            font-size: 0.9em;
        }

        .ui-widget input,
        .ui-widget select,
        .ui-widget textarea,
        .ui-widget button {
            font-family: 'Abel-Regular';
            font-size: 0.9em;
        }


    .ui-menu {
        width: 50%;
    }

    @media (min-width: 64rem) {
        .ui-menu {
            width: auto;
        }
    }


    .ui-menu .ui-menu-item {
        margin: 2px;
        cursor: pointer;
        /* support: IE10, see #8844 */
        list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
    }

    .ui-menu .ui-menu-item-wrapper {
        position: relative;
        padding: 3px 0.8em 3px .4em;
        min-height: 20px;
        white-space: normal;
    }


    /***********************************************************
   ui-datepicker style
***********************************************************/
    .ui-datepicker {
        z-index: 10000 !important;
        width: 300px;
    }

        .ui-datepicker select.ui-datepicker-month,
        .ui-datepicker select.ui-datepicker-year {
            width: 45%;
            display: inline-block;
        }


/***********************************************************
   custom-combobox style
***********************************************************/
    .custom-combobox {
        position: relative;
        display: inline-block;
        width: 100%;
        margin-bottom: 2px;
    }

    .combo-phases {
        border: 1px solid var(--success) !important;
    }

    div-select-phases {
        padding-left: 0px !important;
    }

    

.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(100% - 26px);
    padding: 0;
    height: calc(2.25rem + 2px);
}

.custom-combobox-input {
    display: block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--font-color);
    background-color: var(--white);
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   
}


/*.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
    height: 31px;
}

.custom-combobox-input {
    color: var(--font-color);
    background-color: var(--white);
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
    height: 31px;
}*/


    /*************************************************
    LOADING PANEL
**************************************************/
    .modalBackground {
        background-color: #f3f3f3;
        filter: alpha(opacity=60);
        opacity: 0.6;
        z-index: 10050 !important;
    }

    .updateProgress {
        padding-top: 20px;
        background-color: transparent;
        position: absolute;
        width: 400px;
        height: 180px;
        text-align: center;
        vertical-align: middle;
        z-index: 10200 !important;
    }

        .updateProgress img {
            margin-bottom: 30px;
        }

        .updateProgress span {
            color: #36454F;
            font-size: 1.3rem;
            font-size: 1.5rem;
            letter-spacing: -0.5px;
            font-weight: 500;
        }





    .modal {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999 !important;
        display: none;
        overflow: hidden;
        outline: 0;
    }

    .modal-lockon {
        display: block;
        visibility: visible;
        position: absolute;
        z-index: 9999 !important;
        top: 0px;
        left: 0px;
        width: 105%;
        height: 105%;
        background-color: white;
        vertical-align: bottom;
        padding-top: 20%;
        filter: alpha(opacity=50);
        opacity: 0.5;
        font-size: large;
        color: blue;
        font-style: italic;
        font-weight: 400;
        background-image: url("../Images/ajax_loading.gif");
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: center;
    }



    /*************************************************
    FIN LOADING PANEL
    **************************************************/


    /*************************************************
    ICONS FONT AWESOME
    *************************************************/
    [class^="fa-"]:before, [class*=" fa-"]:before {
        margin-right: .2em;
    }

    [class^="fa-"]:after, [class*=" fa-"]:after {
        margin-left: .2em;
    }

    /******************************************************
   FIN ICONS FONT AWESOME
    *******************************************************/



    .userControl {
        background-color: gainsboro;
        padding: 15px;
    }

    .mensajeInfo {
        /*background-color: gainsboro;*/
        background-color: LightCyan;
        padding: 15px;
        border: 1px solid LightGray;
    }


    .anchorControlUsuarioSudidaDocs {
        width: 20px;
    }


    .intimeDiv {
        background-color: aquamarine;
    }

    .timeoutDiv {
        background-color: red;
    }



/**************************************************************************************
        Botones de acciones en formularios y fichas
**************************************************************************************/

.menu-button {
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 0.25rem;
}

    .menu-button li {
    }

        .menu-button li a {
            position: relative;
            display: block;
            /*padding: 0.5rem 0.75rem;*/
            line-height: 1.25;
            color: #727272;
            background-color: #fff;
            border: solid 2px #cecece;
            border-radius: 8px;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
            font-size: 0.8rem;
            line-height: 0.9rem;
            margin-left: 5px;
            align-content: center;
            text-align: center;
            width: 100px;
            height: 65px;
        }

            .menu-button li a:hover {
                z-index: 2;
                text-decoration: none;
                /*color: #ffffff;*/
                /*background-color: #9fb1c2;*/
                border: double 6px #9fb1c2;
            }

            .menu-button li a:focus {
                z-index: 2;
                outline: 0;
                box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
            }

            .menu-button li a:not(:disabled):not(.disabled) {
                cursor: pointer;
            }

            .menu-button li a > input[type="image"],
            .menu-button li a > img {
                width: 24px;
            }

            .menu-button li a > span {
                margin-top: 1px;
                display: block;
            }


.menu-button2 {
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: 0.25rem;
}

    .menu-button2 li {
        position: relative;
        display: block;
        /*padding: 0.5rem 0.75rem;*/
        line-height: 1.25;
        color: #727272;
        background-color: #fff;
        border: solid 2px #cecece;
        border-radius: 8px;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        font-size: 0.8rem;
        line-height: 0.9rem;
        margin-left: 5px;
        align-content: center;
        text-align: center;
        width: 100px;
        height: 65px;
    }

        .menu-button2 li:hover {
            z-index: 2;
            text-decoration: none;
            /*color: #ffffff;*/
            /*background-color: #9fb1c2;*/
            border: double 6px #9fb1c2;
        }

        .menu-button2 li:focus {
            z-index: 2;
            outline: 0;
            box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
        }

        .menu-button2 li:not(:disabled):not(.disabled) {
            cursor: pointer;
        }

        .menu-button2 li > input[type="image"],
        .menu-button2 li > img {
            width: 24px;
        }

        .menu-button2 li > span {
            margin-top: 1px;
            display: block;
        }


.menu-ficha {
    width: 100%;
    list-style: none;
    margin-left: 0px;
    padding-left: 0px;
}

    .menu-ficha li {
        float: left;
        position: relative;
        margin-right: 10px;
        margin-bottom: 5px;
        margin-top: 0px;
        padding: 2px 8px;
        width: auto;
        min-width: 90px;
        height: 32px;
        background-color: var(--secondary);
        border: solid 1px var(--secondary);
        border-radius: 8px;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
    }

        .menu-ficha li span,
        .menu-ficha li a,
        .menu-ficha li a:link {
            text-decoration: none;
            font-size: 0.9rem;
            line-height: 1rem;
            margin-top: 0px;
            color: var(--white);
        }


            .menu-ficha li a:visited,
            .menu-ficha li a:hover {
                text-decoration: none;
                font-size: 0.9rem;
                line-height: 1rem;
                margin-top: 0px;
                color: #f3f42e;
            }

/**************************************************************************************/ 



.submenu1 {
    width: 100%;
    list-style: none;
    margin-left: 0px;
    margin-bottom: 0px;
    margin-top: -1px;
    padding-left: 0px;
}

    .submenu1 li {
        float: left;
        position: relative;
        display: inline-block;
        margin-right: 5px;
        margin-bottom: 5px;
        width: 35px;
        height: 35px;
        padding: 2px;
        text-align: center;
        background-color: var(--white);
        border: solid 2px #cecece;
        border-radius: 8px;
        -moz-border-radius: 8px;
        -webkit-border-radius: 8px;
        cursor: pointer;
    }


        .submenu1 li input[type="image"],
        .submenu1 li img {
            width: 24px;
            margin-bottom: 0px;
        }

        .submenu1 li span,
        .submenu1 li a,
        .submenu1 li a:link,
        .submenu1 li a:visited
        .submenu1 li a:active,
        .submenu1 li a:hover {
            display: none;
        }


@media (min-width: 52rem) {
    .submenu1 {
        width: 100%;
        list-style: none;
        margin-left: 0px;
        padding-left: 0px;
    }

        .submenu1 li {
            float: left;
            position: relative;
            display: flex;
            justify-content: space-around;
            align-items: center;
            flex-direction: column;
            margin-right: 10px;
            margin-bottom: 5px;
            margin-top: 0px;
            width: 90px;
            height: 65px;
            background-color: var(--white);
            border: solid 2px #cecece;
            border-radius: 8px;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
        }

            /*.submenu1 li input[type="image"] { width:32px; }*/

            .submenu1 li span,
            .submenu1 li a,
            .submenu1 li a:link,
            .submenu1 li a:visited,
            .submenu1 li a:active,
            .submenu1 li a:hover {
                background: var(--white);
                text-decoration: none;
                display: block;
                font-size: 0.8rem;
                line-height: 0.9rem;
                margin-top: 0px;
                white-space: normal;
                width: 100%;
            }
}

   



    .img-upload {
        width: 80px;
    }

    @media (min-width: 48rem) {
        .img-upload {
            width: 150px;
        }
    }



/**************************************************************************************
    Etiquetas de los paneles colapsables
***************************************************************************************/
    .titleLabel {
        color: var(--white);
        font-weight: 600;
        font-family: 'Abel-Regular';
        font-size: 1.1rem;
        font-weight: 400;
        margin-left: 20px;
    }

        .titleLabel:hover {
            color: #48b;
            font-weight: 600;
            font-family: 'Abel-Regular';
            font-size: 1.1rem;
            font-weight: 400;
            margin-left: 20px;
        }

        .titleLabel:focus {
            text-decoration: none;
            border-color: transparent;
            box-shadow: none;
            color: var(--white);
            margin-left: 20px;
        }

        .titleLabel:disabled {
            color: var(--white);
            pointer-events: none;
            margin-left: 20px;
        }
    /*
   Fin Css de los paneles colapsables
   */






    /***********************************
	ESTADOS DE SOLICITUD
************************************/
    .codeAceptada {
        color: #57953B;
        font-size: 1.5em;
        letter-spacing: -0.5px;
        font-weight: 500;
    }

    .codeRechazada {
        color: #D01D24;
        font-size: 1.5em;
        letter-spacing: -0.5px;
        font-weight: 500;
    }

    .codePendiente {
        color: #F4861E;
        font-size: 1.5em;
        letter-spacing: -0.5px;
        font-weight: 500;
    }

    .codeDevuelta {
        color: #0076C0;
        font-size: 1.5em;
        letter-spacing: -0.5px;
        font-weight: 500;
    }

    .codeModificada {
        color: #9253C4;
        font-size: 1.5em;
        letter-spacing: -0.5px;
        font-weight: 500;
    }

    .codeEnCurso {
        color: #44A3E0;
        font-size: 1.5em;
        letter-spacing: -0.5px;
        font-weight: 500;
    }


    @media (min-width: 48rem) {

        .codeAceptada {
            color: #57953B;
            font-size: 1.8em;
            letter-spacing: -0.5px;
            font-weight: 500;
        }

        .codeRechazada {
            color: #D01D24;
            font-size: 1.7em;
            letter-spacing: -0.5px;
            font-weight: 500;
        }

        .codePendiente {
            color: #F4861E;
            font-size: 1.7em;
            letter-spacing: -0.5px;
            font-weight: 500;
        }

        .codeDevuelta {
            color: #0076C0;
            font-size: 1.7em;
            letter-spacing: -0.5px;
            font-weight: 500;
        }

        .codeModificada {
            color: #9253C4;
            font-size: 1.7em;
            letter-spacing: -0.5px;
            font-weight: 500;
        }

        .codeEnCurso {
            color: #44A3E0;
            font-size: 1.7em;
            letter-spacing: -0.5px;
            font-weight: 500;
        }
    }


    /***********************************************************
	TEXT, BORDER COLOR
***********************************************************/
    .border-default {
        border-color: var(--secondary) !important;
    }

    .text-success {
        color: var(--green) !important;
    }

    .text-info {
        color: #6296CB !important;
    }

    .text-orange {
        color: var(--orange) !important;
    }

.text-colorIndigo {
    color: #4B0082 !important;
}

.text-colorDarkPink4 {
    color: #4C0026 !important;
}

.text-colorSteelBlue4 {
    color: #36648b !important;
}

.text-colorDodgerBlue4 {
    color: #104e8b !important;
}

.text-colorOliveDrab {
    color: #6b8e23 !important;
}

.text-colorOrangeRed1 {
    color: #ff4500 !important;
}

.text-colorRed3 {
    color: #cd0000 !important;
}

.text-colorDarkGoldenrod4 {
    color: #8B6508 !important;
}

.text-colorForestGreen {
    color: #228b22 !important;
}

.text-colorIndianRed3 {
    color: #D13C3C !important;
}

.text-colorRoyalBlue {
    color: #4169e1 !important;
}

.alert-info {
    color: #0c5460;
    background-color: #e2f0ff;
    border-color: #bee5eb;
}


    /*******************************************************************************
                    ESTADOS DE ANIMAL
********************************************************************************/
    .codeNormal {
        color: #57953B !important;
    }

    .codeBaja {
        color: #E31010 !important;
    }

    .codeDesaparecido {
        color: var(--orange) !important;
    }

    .codePerrera {
        color: #507a83 !important;
    }


    /*******************************************************************************
                    ESTADOS DE MICROCHIP
********************************************************************************/
    .codeRegistrado,
    .codeRegistrado a,
    .codeRegistrado a:hover {
        color: #57953B !important;
    }

    .codeSolicitud,
    .codeSolicitud a,
    .codeSolicitud a:hover {
        color: #996177 !important;
    }

    .codeNoRegistrado,
    .codeNoRegistrado a,
    .codeNoRegistrado a:hover {
        color: #186697 !important;
    }

    .codeNoEncontrado,
    .codeNoEncontrado a,
    .codeNoEncontrado a:hover {
        color: #8b3a3a !important;
    }

    .codeEnREIAC,
    .codeEnREIAC a,
    .codeEnREIAC a:hover {
        color: #cd661d !important;
    }



    /*******************************************************************************
                    ESTADOS DE ITEMS EN DESPENSAS
********************************************************************************/
    .estado-item1 {
        color: #F4861E !important; /*pendiente de asignaci�n*/
    }

    .estado-item3 {
        color: #186697 !important; /*asignado no usado*/
    }

    .estado-item4 {
        color: #57953B !important; /*registrado y usado*/
    }

    .estado-item5 {
        color: #720A72 !important; /*inactivos*/
    }

    .estado-item6 {
        color: #D01D24 !important; /*borrados*/
    }

    .estado-item7 {
        color: #177E89 !important; /*solicitud y usado*/
    }
    /*vial mostra*/
    .estado-item11 {
        color: #008000 !important;
    }
    /*vial recollit centre veterinari*/
    .estado-item14 { 
        color: var(--blue) !important;
    }
    /*vial rebut lab1*/
    .estado-item15 {
        color: var(--pink) !important;
    }
    /*vial enviat lab2*/
    .estado-item16 {
        color: var(--red) !important;
    }
    /*vial rebut lab2*/
    .estado-item17 {
        color: #ff8800 !important;
    }

    .estado-item18 {
        color: var(--success) !important;
    }

    .estado-item19 {
        color: #cd3700 !important;
    }

    .estado-item20 {
        color: #8b0000 !important;
    }

    .estado-item21 {
        color: #cd0000 !important;
    }

    
    







/*******************************************************************************
                    SITUACIONES ESTADOS PERRERA
********************************************************************************/

.perrera-sinmicrochip {
    color: #f0a90d !important; /*Espera identificaci�n*/
}
.situacion-perrera-6 {
    color: #F89509 !important; /*Espera propietario*/
}
.situacion-perrera-7 {
    color: #26CC26 !important; /*Acude propietario*/
}
.situacion-perrera-9 {
    color: #1EA31E !important; /*Devuelto propietario*/
}
.situacion-perrera-10 {
    color: #DF1297 !important; /*Cedido (tasa pendiente)*/
}
.situacion-perrera-11 {
    color: #DF1261 !important; /*Adoptable*/
}
.situacion-perrera-12 {
    color: #DF1297 !important; /*Acogido*/
}
.situacion-perrera-13 {
    color: #DF1261 !important; /*Adoptado*/
}
.situacion-perrera-14 {
    color: #F20C50 !important; /*Custodiado (entrada)*/
}
.situacion-perrera-15 {
    color: #3D85C6 !important; /*Decomisado*/
}
.situacion-perrera-16 {
    color: #F20707 !important; /*Cuarentena*/
}
.situacion-perrera-17 {
    color: #E69138 !important; /*Devuelto propietario (tasa pendiente)*/
}
.situacion-perrera-21 {
    color: #2a2626 !important; /*Muerto*/
}
.situacion-perrera-22 {
    color: #cd3700 !important; /*Traslado*/
}
.situacion-perrera-23 {
    color: #E69138 !important; /*Acogido (tasa pendiente)*/
}
.situacion-perrera-24 {
    color: #E69138 !important; /*Adoptado (tasa pendiente)*/
}
.situacion-perrera-25 {
    color: #698b22 !important; /*Propietario contactado*/
}
.situacion-perrera-26 {
    color: #8b2500 !important; /*Propietario no contactado*/
}
.situacion-perrera-27 {
    color: #E69138 !important; /*Decomisado (tasa pendiente)*/
}
.situacion-perrera-29 {
    color: #E69138 !important; /*Custodiado (tasa pendiente)*/
}
.situacion-perrera-30 {
    color: #45818E !important; /*Publicado BOPA*/
}
.situacion-perrera-31,
.situacion-perrera-32 {
    color: #F20707 !important; /*Cuarentena*/
}
.situacion-perrera-33 {
    color: #F44336 !important; /*Espera sacrificio*/
}
.situacion-perrera-34 {
    color: #16537E !important; /*Escapat*/
}
.situacion-perrera-35 {
    color: #DF1261 !important; /*Preadoptado*/
}
.situacion-perrera-36 {
    color: #E06666 !important; /*Tratamiento veterinario*/
}
.situacion-perrera-37 {
    color: #F20C50 !important; /*Custodiado (Salida)*/
}
.situacion-perrera-38 {
    color: #fa0808 !important; /*BAJA ADMINISTRATIVA*/
}


/*************************************************
    NAVS ITEMS
*************************************************/
    .nav-tabs .nav-link.active,
    .nav-tabs .nav-item.show .nav-link {
        color: var(--font-color);
        background-color: var(--white);
        border-color: var(--primary) var(--primary) var(--white);
    }

    .nav-tabs .nav-link.disabled {
        color: #6c757d;
        background-color: var(--white);
        border-color: var(--primary) var(--primary) var(--white);
    }

    .nav-link {
        display: block;
        padding: 0.2rem 0.5rem;
        font-size: 0.8rem;
    }

    .nav-tabs .nav-link {
        border: 1px solid var(--primary);
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
        height: 100%;
    }

    .nav-justified .nav-item,
    .nav-justified-ficha .nav-item {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -ms-flex-positive: 1;
        flex-grow: 1;
        text-align: center;
        width: 90px;
    }

    @media (min-width: 48rem) {

        .nav-justified-ficha .nav-item {
            -ms-flex-preferred-size: 0;
            flex-basis: 0;
            -ms-flex-positive: 1;
            flex-grow: 1;
            text-align: center;
            width: auto;
            max-width: 110px;
        }

        .nav-justified .nav-item {
            -ms-flex-preferred-size: 0;
            flex-basis: 0;
            -ms-flex-positive: 1;
            flex-grow: 1;
            text-align: center;
            width: auto;
        }

        .nav-link {
            display: block;
            padding: .4rem 0.8rem;
            font-size: 0.9rem;
            line-height: 1rem;
        }

        .nav-tabs .nav-link {
            border: 1px solid var(--primary);
            border-top-left-radius: .25rem;
            border-top-right-radius: .25rem;
            height: 100%;
        }
    }







    /********************************************************************************/
    /*                  PESTA�AS - COLLAPSE                                          /
/********************************************************************************/

    .tabs-carga {
        display: none;
    }

    @media (min-width: 48rem) {
        .acordeon-link-carga {
            display: none;
        }

        .tabs-carga {
            display: block;
        }
    }


    .tabs-menu {
        display: none;
    }

    @media (min-width: 48rem) {
        .acordeon-link {
            display: none;
        }

        .tabs-menu {
            display: block;
        }

        .tabs-menu-ficha {
            display: block;
        }
    }


    .tabs-menu-ficha {
        display: none;
    }

    @media (min-width: 64rem) {
        .acordeon-link-ficha {
            display: none;
        }

        .tabs-menu-ficha {
            display: block;
        }
    }



/********************************************************************************/
/*                                   MODAL                                       /
/*                               Confirmaci�n clave                              /
/********************************************************************************/
    .cajaDialogo {
        width: 90%;
        /*min-height:200px;*/
        padding: 0.61rem 0.52rem;
        background-color: var(--white);
        background-clip: padding-box;
        border: 1px solid rgba(0, 0, 0, 0.2);
        border-radius: 0.4rem;
        outline: 0;
    }

    @media (min-width: 32.5rem) {
        .cajaDialogo {
            width: 650px;
            /*min-height:200px;*/
            padding: 10px 15px;
            background-color: var(--white);
            background-clip: padding-box;
            border: 1px solid rgba(0, 0, 0, 0.2);
            border-radius: 0.4rem;
            outline: 0;
        }
    }




/*************************************************
    VALIDATION SUMMARY
*************************************************/
    .validationsummary {
        background-color: #f8d7da;
        border-width: 1px;
        border-style: solid;
        border-color: #dc3545;
        color: #dc3545;
        width: 100%;
        padding: 10px;
        font-size: 1rem;
        margin-bottom: 20px;
        border-radius: 8px; /*propiedad CSS3 */
        -moz-border-radius: 8px; /* Firefox y Chrome */
        -webkit-border-radius: 8px; /* WebKit y Safari */
    }


        .validationsummary ul {
            padding-top: 5px;
            padding-left: 45px;
            list-style-type: disc;
            font-size: 1rem;
            color: #dc3545;
        }

            .validationsummary ul li {
                padding: 2px 0px 0px 15px;
                font-size: 1.2rem !important;
            }


    .validationheader {
        height: 25px;
        color: #333;
        font-size: 1.1rem;
        font-weight: bold;
    }


    a.enlaceBlanco {
        color: white;
        text-decoration: none;
    }


    @media( min-width:26rem) {
        .desplegableAvisosHome {
            z-index: 99999;
        }
    }

    @media( min-width:41.5rem) {
        .desplegableAvisosHome {
            position: absolute;
            left: 15rem;
            top: 5.4rem;
            z-index: 99999;
        }
    }


    @media( min-width:53rem) {
        .desplegableAvisosHome {
            position: absolute;
            left: 30rem;
            top: 5.4rem;
            z-index: 99999;
        }
    }

    @media( min-width:57rem) {
        .desplegableAvisosHome {
            position: absolute;
            left: 34rem;
            top: 5.4rem;
            z-index: 99999;
        }
    }


    @media( min-width: 64rem) {
        .desplegableAvisosHome {
            position: absolute;
            left: 42rem;
            top: 5.4rem;
            z-index: 99999;
        }
    }

    @media( min-width: 78rem) {
        .desplegableAvisosHome {
            position: absolute;
            left: 30rem;
            top: 6.5rem;
            z-index: 99999;
        }
    }

    /*desplegableAvisosHome*/

    /*.desplegableAvisosHome {
    position: absolute;
    left: 30rem;
    top: 6.5rem;
    z-index: 99999;
}*/

    .list-noticias {
        counter-reset: li;
        list-style: none;
        *list-style: decimal;
        font: 15px 'trebuchet MS', 'lucida sans';
        padding: 0;
        margin-bottom: 2em;
        text-shadow: 0 1px 0 rgba(255,255,255,.5);
    }

        .list-noticias ol {
            margin: 0 0 0 2em;
        }

    .list-noticias {
        list-style-type: none;
        list-style-type: decimal !ie; /*IE 7- hack*/
        margin: 0;
        margin-left: 1em;
        padding: 0;
        counter-reset: li-counter;
    }

        .list-noticias > li {
            position: relative;
            margin-bottom: 1.5em;
            padding: 1.5em;
            background-color: #eaeaea;
        }

            .list-noticias > li:before {
                position: absolute;
                top: -0.3em;
                left: -0.5em;
                width: 1.8em;
                height: 1.2em;
                font-size: 2em;
                line-height: 1.2;
                font-weight: bold;
                text-align: center;
                color: #464646;
                background-color: #FFA500;
                transform: rotate(-20deg);
                -ms-transform: rotate(-20deg);
                -webkit-transform: rotate(-20deg);
                z-index: 99;
                overflow: hidden;
                content: counter(li-counter);
                counter-increment: li-counter;
            }

    .padding-2 {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    /*Leidos*/

    .leido {
        background-color: #f9e502;
    }

    .noLeido {
        background-color: var(--primary);
    }

    .combo-box-disabled {
        height: calc(1.5em + 1rem + 2px);
        background-color: #e9ecef;
        opacity: 1;
    }

    .aspNetDisabled {
        opacity: .65;
        cursor: not-allowed;
    }




    .break-text {
        -ms-word-break: break-all;
        word-break: break-all;
        word-break: break-word; /* S�lo WebKit -NO DOCUMENTADO */
        -ms-hyphens: auto; /* Guiones para separar en s�labas */
        -moz-hyphens: auto; /*  depende de lang en <html>      */
        -webkit-hyphens: auto;
        hyphens: auto;
    }


    .flex-container {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
        align-content: stretch;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        width: 100%;
    }


    .flex-item:nth-child(1) {
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
        background-color: var(--primary);
    }

    .flex-item:nth-child(2) {
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
        background-color: var(--white);
    }




    .flex-item-ficha:nth-child(1) {
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        -webkit-align-self: auto;
        -ms-flex-item-align: auto;
        align-self: auto;
    }

    .flex-item-ficha:nth-child(2) {
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0;
        -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch;
    }




    .securenone,
    input[type=text].securenone {
        -webkit-text-security: none;
    }

    .secure,
    input[type=text].secure {
        -webkit-text-security: disc;
        font: bold 100% "Lucida Sans Unicode",sans-serif;
    }


/********************************************************
   INPUT CLEARABLE
*********************************************************/

    .clearable {
        background: var(--white) url(/images/mJotv.gif) no-repeat right -10px center;
    }

        .clearable.x {
            background-position: right 5px center;
        }
        /* (jQ) Show icon */
        .clearable.onX {
            cursor: pointer;
        }
        /* (jQ) hover cursor style */
        .clearable::-ms-clear {
            display: none;
            width: 0;
            height: 0;
        }
    /* Remove IE default X */



.cursor-pointer {
    cursor: pointer;
}





.seccion-ras {
    float: right;
    display: inline-block;
    margin-bottom: 2px;
    text-align:left;
    width:100%;
    padding-right:5px;
    position: relative;
}

.btn-green-ras {
    color: var(--white);
    background-color: var(--ras-color);
    border-color: var(--ras-color);
    margin-top: 0px;
}

    .btn-green-ras:hover {
        color: var(--white);
        background-color: #9BB479;
        border-color: #9BB479;
    }


.list-group-item {
    padding: 0.5rem 0.8rem;
}


input[type="text"].codigo {
    border: 1px solid #838b8b;
    background-color: #fefefe;
    font-family: Arial;
    font-size: 1.8em;
    padding: 10px 8px;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    vertical-align: middle;
    text-align: center;
    letter-spacing: 2px;
}