body{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: #383737;
}

/* CONTAINERS */
@media (min-width: 1200px){
    .container{
        width: 1140px;
    }
}

/*FONTS*/

h1{font-size: 2.986rem;}
h2{font-size: 30px;}
h3{font-size: 20px;}
h4{font-size: 1.728rem;}
h5{font-size: 1.44rem;}
h6{font-size: 1.2rem;}

small{font-size: 0.833rem;}	
.xsmall{font-size: .694rem;}

/* FONTS */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-Italic.woff2') format('woff2'),
        url('../fonts/Lufga-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
/* LIGHT: 300 */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-Light.woff2') format('woff2'),
        url('../fonts/Lufga-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
/* NORMAL */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-Regular.woff2') format('woff2'),
        url('../fonts/Lufga-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
/* MEDIUM: 500 */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-Medium.woff2') format('woff2'),
        url('../fonts/Lufga-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
/* BOLD */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-Bold.woff2') format('woff2'),
        url('../fonts/Lufga-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
/* SEMIBOLD: 600 */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-SemiBold.woff2') format('woff2'),
        url('../fonts/Lufga-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
/* EXTRABOLD */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-ExtraBold.woff2') format('woff2'),
        url('../fonts/Lufga-ExtraBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
/* BLACK: 900 */
@font-face {
    font-family: 'Lufga';
    src: url('../fonts/Lufga-Black.woff2') format('woff2'),
        url('../fonts/Lufga-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* BUTTONS / LINKS */
.btn{
    padding: 6px 22px;
    border-radius: 30px;
}
.btn-primary{
    background: #2985c8;
    border-color: #2985c8;
    min-width: 170px
}
.btn-primary:hover{
    background: #393938;
    border-color: #393938;
}

.btn-link-icon-right{
    display: inline-flex;
    gap: 10px;
    align-items: center;
    color:#383737;
    text-decoration: none;
    padding: 0;
    position: relative;
}
.btn-link-icon-right b{
    font-weight: 800;
    color: #008efb;
}
.btn-link-icon-right i{
    background: #383737;
    color: #fff;;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

header .btn-link-icon-right:after{
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 1px;
    border-right: 1px dotted #868685;
    right: -15px;
}


a:focus{
    outline: none;
}
a:focus-visible{
    outline: none !important;
    outline-offset: 4px;
    outline: 1px dashed #008efb;
    box-shadow: none !important;
}
/* MENU */
.navbar{
    background: #fff;
    padding: 0;
    margin-top: 14px;
}
.navbar .navbar-nav{
    width: 100%;
}
.navbar .nav-link{
    background-color: #383737;
    color: #fff;
    font-size: 12px;
    font-weight: 300;
    text-transform: uppercase;
    padding: 12px;
}
.navbar .nav-link.active{
    background-color: #2985c8;
    color: #fff;
}
.navbar-nav .nav-link.active, 
.navbar-nav .nav-link.show{
    color: #fff;
}
.navbar .nav-link:hover{
    background-color: #5a5a5a;
}
.navbar .nav-link:not(.active){
    border-right: 1px dotted #868685;
}
.navbar .nav-item:last-child .nav-link{
    border-right: none;
}
.nav-link.dropdown-toggle.show{
    background-color: #5a5a5a;
    color: #fff;
}

.dropdown-menu{
    background-color: #383737;
    padding: 0;
    border-radius: 0;
    margin-top: 0 !important;
    border: none;
}
.dropdown-menu .dropdown-item{
    color: #fff;
    font-size: 12px;
    font-weight: 300;
    text-transform: uppercase;
    padding: 14px 36px;
}
.dropdown-menu .dropdown-item:hover{
    background-color: #2985c8;
}

/* MENU MOBILE */
.navbar .menu-mobile{
    background-color: #007bc0;
}
.navbar .menu-mobile .nav-link{
    background-color: transparent;
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    text-transform: initial;
    padding: 12.3px 10px;
    text-align: left;
    border-bottom: 1px solid rgba(0, 106, 166, .9);
}

/* ELEMENTS */
.card{
    border: none;
    padding: 28px 20px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 20px 20px 0px rgba(0,0,0,.1);
    border-radius: 20px;
}
.card p{
    font-size: 18px;
}
.banner-publicidad{
    padding-top: 30px;
    padding-bottom: 20px;
    background-color: #d3d6dd;
}
.g-recaptcha div{
    margin: 0 auto;
    height: auto !important;
}

/*HEADER*/
header{
    background: #fff;
}
@media (max-width: 991px){
    header div img{
        width: auto !important;
        height: 78px !important;
    }
    header .navbar {
        padding: 0 !important;
        margin: 0 !important;
    }
    header .navbar .container{
        padding: 0;
    }
    header .navbar .navbar-toggler{
        background-color: #007bc0 !important;
        border: none;
        border-radius: 0;
        width: 66px;
        height: 66px;
    }
    header .navbar .navbar-toggler:focus{
        box-shadow: none;
    }
    header .navbar .navbar-brand{
        padding: 0 !important;
    }
    header .navbar .navbar-brand img{
        height: 60px !important;
    }
    /*MENU TOGGLER*/
    .navbar-toggler{
        position: relative;
    }
    .menu-hamburger span {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 25px;
    height: 3px;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    border-radius: 10px;
    background-color: #fff;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    transition: all .3s;
    }
    .menu-hamburger span:nth-child(1) {
    -webkit-transform: translate(-50%, -9px);
    transform: translate(-50%, -9px)
    }

    .menu-hamburger span:nth-child(2) {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
    }

    .menu-hamburger span:nth-child(3) {
    -webkit-transform: translate(-50%, 6px);
    transform: translate(-50%, 6px)
    }

    .navbar-toggler[aria-expanded="true"] .menu-hamburger span:nth-child(1){
        -webkit-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg)
      }
      .navbar-toggler[aria-expanded="true"] .menu-hamburger span:nth-child(2){
        opacity: 0
      }
      .navbar-toggler[aria-expanded="true"] .menu-hamburger span:nth-child(3) {
        -webkit-transform: translate(-50%, -50%) rotate(-45deg);
        transform: translate(-50%, -50%) rotate(-45deg)
      }
}

/*MAIN*/
main{
    background: #e0e2e7;
    padding-bottom: 72px;
}
main hr{
    border-color: #eff2f4;
    opacity: 1;
    margin: 0 0 35px;
}
main .titulo-seccion{
    padding: 24px 0 10px;
}
main .titulo-seccion h2{
    font-weight: 600;
    text-transform: uppercase;
}
main h3{
    font-weight: 600;
    margin-top: 30px;
    color: #2985c8;
}
/* ASIDE */

aside ul{
    list-style: none;
    padding: 0;
}
aside ul li{
    margin-bottom: 30px;
}
aside ul li a{
    padding: 9px;
    text-transform: uppercase;
    color: #383737;
    border-radius: 35px;
    font-family: 'Roboto', Arial;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
}
aside ul li a:hover{
    color: #2985c8;
    background: transparent;
    text-decoration: none;
}
aside ul li.selec > a{
    display: block;
    width: 220px;
    background-color: #383737;
    padding-left: 15px;
    color: #fff;
}
aside ul li.selec ul li{
    margin: 10px 0px;
    padding-left: 3px;
}
aside ul li.selec ul li a{
    padding-left: 15px;
}
aside ul li ul{
    display: none;
}
/*FOOTER*/
footer{
    background: #383737;
    color: #fff;
    padding: 32px 0;
}
footer ul{
    list-style: none;
    margin: 0;
    padding: 0;
}
footer ul.menu-footer li a{
    text-decoration: none;
}
footer ul.links-rrss{
        display: flex;
        border-bottom: none;
        gap: 12px;
    }
    footer a{
        font-size: 0.833rem;
        color: #fff;
        text-decoration: none;
    }
    
    footer .cyber{
        text-transform: uppercase;
        color: #646363;
        font-weight: 400;
        font-size: 8px;
    }
@media (max-width: 991px){
    footer ul.menu-footer li a{
        display: block;
        padding-top: 10px;
        padding-right: 10px;
        padding-bottom: 10px;
        padding-left: 10px;
        text-transform: uppercase;
        color: #fff;
        font-family: 'Roboto', Arial;
        font-weight: 700;
        font-size: 17px;
        border-bottom: 1px solid #646363;
    }
    footer p{
        color: #b6b6b8;
        font-weight: 400;
        font-size: 14px;
        text-align: center;
    }
    footer ul.links-rrss{
        align-items: center;
        justify-content: center;
    }
    footer ul.links-rrss li a i{
        font-size: 18px;
    }
    footer .border-start{
        border-left: none !important;
    }
}
@media (min-width: 992px){
    footer ul{
        display: flex;
        gap: 12px;
        border-bottom: 1px solid #646363;
    }
    footer ul.menu-footer{
        text-transform: uppercase;
    }
    footer ul.menu-footer li a{
        border-right: 1px solid #646363;
        margin-right: 10px;
        padding-right: 10px;
        font-size: 8px;
    }
    footer ul.menu-footer li:last-child a{
        border-right: none;
    }
    footer ul.links-rrss{
        align-items: center;
        justify-content: flex-end;
    }
    footer p{
        color: #b6b6b8;
        font-weight: 400;
        font-size: 8px;
    }
    footer .border-start{
        border-left-style: dotted !important;
        border-left-color: #646363 !important;
    }
}


/* INTERIOR */
main .avisos span{
    color: #4e4d4d;
    font-weight: 400;
    font-size: 14px;
}

/* TABLAS */
.table-light {
    border-spacing: 0;
    border-collapse: collapse;
  }
  
  .table-light thead tr td {
    padding: 10px 0px;
    vertical-align: top;
    color: #4c4b4b;
    border-bottom: 5px solid #e2e8ec;
    background-color: transparent;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    line-height: 15px;
  }
  
  .table-light tbody tr th {
    height: 40px;
    padding: 0 0 15px 0;
    text-align: left;
    vertical-align: middle;
    color: #4c4b4b;
    border-right: 5px solid #e2e8ec;
    border-bottom: 1px solid #e2e8ec;
    background-color: transparent;
    font-family: 'Roboto', sans-serif;
        font-weight: 700;
    font-size: 13px;
    line-height: 15px;
  }
  
  .table-light tbody tr td {
    padding: 10px 0;
    vertical-align: top;
    vertical-align: middle;
    color: #4c4b4b;
    border-bottom: 1px solid #e2e8ec;
    background-color: transparent;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 14px;
  }
  
  
  .table-light tbody tr:last-child td {
    border: none;
  }

  .tr_detalle{
    background: #f4f4f4;
}

.encabezado_detalle {
    text-align: left;
}

.encabezado_detalle td {
    font-weight: 800 !important;
    padding: 0 2px !important;
}

.alert{
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.alert small{
    font-size: 12px;
    line-height: 14px;
}

.dues-listing-wrapper .due-title{
    display: flex;
    justify-content: space-between;
    padding-top: 30px;
}

.dues-listing-wrapper .due-title span:first-child{
    font-weight: 600;
    color: #6a6a6a;
}

.dues-listing-wrapper .due-title span:last-child{
    font-weight: 800;
    color: #2985c8;
}

#qservus_widget[style]{
    margin: initial !important;
    line-height: 40px !important;
    min-width: 133px !important;
    font-size: 18px !important;
}

/*ACCORDION*/
.accordion-item{
    background: transparent;
  }
  .accordion-header .accordion-button{
    background: transparent;
    border-bottom: 1px solid #ebedf0;
    font-size: 16px;
    font-weight: bold;
    color: #5f5f5f;
    padding-left: 0;
  }
  .accordion-body p,
  .accordion-body li{
    font-size: 16px;
    color: #5f5f5f;
  }
  .accordion-button:focus{
    box-shadow: none;
  }

  /* ESTILOS CAJA LOGOUT */
  .login span.error{
    color: #fff;
  }
  .login .enviar input,
  .login .cerrar input{
    background: #fff;
      display: block;
      width: 100%;
      border: none;
      padding: 6px 22px;
        border-radius: 30px;
      font-size: 16px !important;
  }


  /*CENTRO DE AYUDA*/
  .related{
    background: #f0f1f3;
    padding: 20px 40px 30px;
    border-radius: 10px;
}
.related h3{
    color: #383737;
}
.related h3 span{
    color: #2985c8;
}
.list-faq{
    list-style: none;
    padding: 0;
    margin-top: 30px;
}
.list-faq li{
    margin-bottom: 20px;
}
.list-faq a{
    font-size: 16px;
    text-decoration: none;
    color: #383737;
}

.link-volver{
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    color: #2985c8;
    padding-bottom: 10px;
    display: inline-block;
    position: relative;
}
.link-volver:before{
    content:'';
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    position: relative;
    top: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--%3E%3Cpath d='M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.2 288 416 288c17.7 0 32-14.3 32-32s-14.3-32-32-32l-306.7 0L214.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z' fill='%232985c8'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
}

