/*  1996-2017 Kiteknology S.A. Todos los Derechos Reservados. */
/*  CSS para proyecto Toesca                                  */
/*  Version 1.0                                               */
/*  media: SCREEN                                             */
/*  Fecha de creacion 21/11/2017                              */

/*  HISTORIAL DE MODIFICACIONES                               */
/*  dd/mm/aaaa Comentario de la modificacion realizada        */

@font-face {
    font-family: 'callunasemibold';
    src: url('../fonts/calluna-semibold.woff2') format('woff2'),
         url('../fonts/calluna-semibold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

.altura p {
    line-height:1.0 !important;
}


@font-face {
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?9bnvuh');
    src: url('../fonts/icomoon.eot?9bnvuh#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?9bnvuh') format('truetype'), url('../fonts/icomoon.woff?9bnvuh') format('woff'), url('../fonts/icomoon.svg?9bnvuh#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}
  
  [class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
  
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

.errorMsg {
    font-size: 14Px !important;
    color: #ff0000;
    padding: 5px;
}


.error {
    color: #ff0000;
}

.okMsg {
    font-size: 14Px !important;
    color: #01DF3A;
    padding: 5px;
}
  
.icon-facebook:before {
content: "\e901";
color: #fff;
}
.icon-instagram:before {
content: "\e902";
color: #fff;
}
.icon-refresh:before {
content: "\e903";
color: #00c08b;
}
.icon-twitter:before {
content: "\e904";
color: #fff;
}
.icon-youtube:before {
content: "\e906";
color: #fff;
}

body{font: 400 13px/140% 'Roboto', sans-serif; color: #000;}

h1{font: 400 15px 'Roboto', sans-serif; margin: 0px; padding: 0; font-weight: 700;}
h2{font: 400 20px 'Roboto', sans-serif; margin: 30px 0 10px 0;
}
h3{font: 400 17px 'Roboto', sans-serif; margin: 0; padding: 0;}

a{color: inherit;}
a:hover, .cont-forms .link-modal{color: #00C18B; text-decoration: none;}
b{
    font-weight:400;
}
p{
    font-size: 16px;
    font-weight: 300;
    line-height: 140%;
}
.main{
background:#eeeeee;
padding-top: 75px;
padding-bottom: 50px;
}
.mobile-title{
    display: none;
}

/*RESET*/
figure, .figure-img{margin: 0;}

.badge-primary{background-color: #FFF; border-radius: 0px; color: #00C08B; font-weight: 300; font-size: 14px; padding: 4px 10px;}

.btn-primary{background: #00CE7C; border-color: transparent; cursor: pointer; border-radius: 0;}
.btn-primary:hover, .btn-primary:focus,  .btn-primary:active{background:#00aa60 !important; border-color: transparent !important;}
.btn-download{background: url(../images/html/icon-download.png) no-repeat 0px 0px; text-decoration: none; width: 35px; height: 28px; display: inline-block; cursor: pointer;}
.btn-link{background: none; border: none; border-radius: 0px; color: #00CE7C; text-decoration: none; font-size: 12px;}

.link-active-primary{color: #00CE7C; text-decoration: underline;}
.small-text-header{font-style: normal; font-size: 14px;}
.text-primary{color: #3FA5F1!important;}
.text-secondary{color: #00CE7C!important;}

.title-toesca{font: 37px/100% 'callunasemibold'; margin: 0px; padding: 0px;}

.link-download{background: url(../images/html/icon-download.png) no-repeat right top; text-decoration: none; display: inline-block; padding-right: 35px; font-size: 16px; background-size: contain;}


/*NAV TOP*/
.header {padding-bottom: 20px;}
.header .nav-header{text-align: right; font-size: 16px; text-transform: uppercase; font-weight: 500; padding-top: 15px;}
.header .nav-header li a{padding-top: 0px; padding-bottom: 0px;}
.header .nav-header li:last-child a{padding-right: 0px;}
.header .title-toesca{font-size: 63px; color: #353535;}
.header .link-contact{background: url(../images/html/icon-user.png) no-repeat 9px 7px #E5E5E5;color: #333;text-decoration: none;padding: 10px 10px 10px 34px;text-align: center;display: inline-block;}
.header .link-contact:hover{background-color: #00C18B; color: #FFF;}

.header .link-logout{background: url(../images/html/icon-user.png) no-repeat 9px 7px #E5E5E5;color: #333;text-decoration: none;padding: 10px 0 10px 20px;text-align: center;display: inline-block;width: 217px;margin-right: 36px;}
.header .link-logout:hover{background-color: #00C18B; color: #FFF;}

.header .link-passwd{background: url(../images/html/icon-user.png) no-repeat 9px 7px #E5E5E5;color: #333;text-decoration: none;padding: 10px 0 10px 20px;text-align: center;display: inline-block;width: 217px;margin-right: 36px;}
.header .link-passwd:hover{background-color: #00C18B; color: #FFF;}

.header .link-home{background: url(../images/html/icon-user.png) no-repeat 9px 7px #E5E5E5;color: #333;text-decoration: none;padding: 10px 0 10px 20px;text-align: center;display: inline-block;width: 217px;margin-right: 36px;}
.header .link-home:hover{background-color: #00C18B; color: #FFF;}


.header .lupa{background: url(../images/html/icon-magnifying-glass.png) no-repeat center; padding: 10px;}
.header .navbar{padding-right: 0px;}
.header .navbar-toggler{float: right; position: absolute; right: 0px; top: 20px;}

.header .navbar-toggler .icon-bar {background-color: #00CE7C; display: block; width: 22px; height: 2px; border-radius: 1px; }
.header .navbar-toggler .icon-bar + .icon-bar {margin-top: 4px;}
.header .show-element-mobile{display: none !important;}
.header .back-icon{background: url(../images/html/back-icon.png) no-repeat center;padding: 24px;margin-top: 9px;display: inline-block;}

.header .menu-principal{font: 400 12px/100% 'Roboto', sans-serif; text-align: right; margin: 0px;}
.header .menu-principal li{display: inline-block; margin-top: 30px;}
.header .menu-principal li a{display: block; padding: 0px 15px; letter-spacing: 1px;}
.header .menu-principal li a:hover{text-decoration: underline;}
.header .menu-principal li:last-child a{padding-right: 0px;}

/*CLOSE BUTTON*/
.link-close-button {height: 40px; width: 30px; position: relative; vertical-align: middle; line-height: 40px; cursor: pointer; display: inline-block;}
.link-close-button:before,
.link-close-button:after
{background-color: #000; content: ""; position: absolute; top: 50%; left: 50%; margin-top: -5px; margin-left: -20px; display: block;  height: 5px;width: 30px; transform: rotate(-45deg); transition: all 0.2s ease-out;}

.link-close-button:after {transform: rotate(45deg);}
.link-close-button:hover:before,
.link-close-button:hover:after {transform: rotate(0deg);}


/*MAIN IMAGE*/
.main-image{height:278px;clear: both; margin: 0px; position: relative; background: url(../images/fotos-banners/header-mi-portafolio.jpg) no-repeat;background-size: cover;}
.main-image .figure-img{width: 100%;}
.main-image .figure-caption {float: left;margin-top: 110px;}
.main-image .figure-caption .head{color: #00CE7C;font-size: 20px;text-transform: uppercase;border-bottom: 1px solid #00CE7C;display: inline-block;margin: 0 0 4px 0;}
.main-image .figure-caption .name{font-size: 28pt; font-weight: 100; color: #FFF;}
.main-image .figure-caption select{width: 196px;}


/*FORM LOGIN*/
.form-login{background: #fff; padding: 30px 20px; width: 100%; max-width: 600px; margin: 58px auto 0 auto;}
.form-login .form-control{border:none; border-radius: 0; background: #eeeeee;font: 300 15px/140% 'Roboto', sans-serif;}
.form-login label{font: 300 15px/140% 'Roboto', sans-serif;}
.form-login .btn{margin-top: 15px;}
.form-login ul{background: #575756;list-style: none; padding-left: 20px;margin-top: 15px;}
.form-login ul li a{color:#fff;}
.form-login ul li {padding: 13px 0;}



/*TABLES*/
.cont-table{margin-bottom: 20px; font-size: 11px;}
.header-table{margin-bottom: 5px;}
.table-data {font-weight: 300; color: #000;}
.table-data th, .table-data td{vertical-align: top; padding: 8px 2px;}
.table-data th{padding-top: 0px;}
.table-data thead th{font-weight: 400; vertical-align: bottom;}
.table-data thead tr{border-bottom: 1px solid #A9AAAC;}

.table-data .highlight td{background-color: #E4E4E4; color: #000; font-weight: 400;}
.table-data .highlight-strong td{background-color: #C8C8C8; color: #000; font-weight: 400;}

.table-data tfoot{background: #E4E4E4; font-weight: 400;}


/*NAV TOP*/
.nav-top{margin: 0px 0px 66px 0px; padding: 0px;}
.nav-top a{padding: 0px;}
.nav-top a.active{color: #00CE7C; text-decoration: underline;}

/*CONTENT*/

/*HOME PRIVADO*/

.datos{
background: #fff;
padding:23px 4px 0px 13px;
color: #4a4a49;
min-height: 351px;
max-height: 351px;
}

.datos_op2 {
    border: 1px solid #4a4a49;
    min-height: 436px;
    background: #fff;
}



.datos.acordeon{
padding: 0;

}
.datos h3 a{
color: #00CE7C;
display: block;
width: 165px;
margin: 0 auto;

}
.datos h3 a:hover{
color: #00C18B;
}
.datos .datos-cliente p{
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 5px;
}
.datos .estado-cuenta{
    margin: 100px 0 126px 0;
}
.datos .estado-cuenta h3{
    font-weight: 300;
}
.datos ul.lista-cartolas {
    margin: 0;
    padding: 0;
    overflow: hidden;
    height: 350px;
    max-height: 270px;
    overflow-y: auto;
}
.datos ul.lista-cartolas li{
    list-style: none;
}

.datos #accordion h3 .btn-link, .datos a{
    font-size: 17px;
    font-weight: 400;
}
.datos ul.lista-cartolas li a{
    display: block;
    padding-bottom: 15px;
    margin-bottom: 15px;
    margin-right:10px;
    border-bottom: 1px solid #55565a;
    background: url(../images/html/icon-download2.png) no-repeat right 0; 
}
.datos #accordion ul.lista-cartolas li a{
    background: url(../images/html/icon-download-b2.png) no-repeat right 0; 
    background-position: right 9px top 3px;
}
.datos #accordion .ui-accordion-header{
    border: none;
        padding: 14px 15px 6px 15px;
    background: url(../images/html/icon-download2.png) no-repeat;
    background-position: right 34px top 14px;
    position: relative;
    cursor: pointer;
    font-size: 17px;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    border-radius: 0;
}
.datos #accordion .ui-accordion-content {
    background: #808080;
    padding: 2px 4px 0 15px;
    border: none;

}
.datos #accordion .ui-accordion-header-active{
    background: #808080;
    background-position: right 34px top 14px;
    color: #00CE7C;
    position: relative;
}
.datos #accordion .ui-accordion-header-active:before{
    content: 'CERRAR';
    position: absolute;
    right: 25px;
    top: 17px;
    font-size: 13px;
    color: #fff;
}
.datos #accordion .ui-accordion-header-active:after{
    content: '';
    position: absolute;
    bottom: 0;
    border-bottom: 1px solid #55565a;
    margin: 0 23px 0 14px;
    left: 0;
    right: 0;
}
.datos #accordion .ui-accordion-content a{
color: #fff;
    font-size: 16px;
    font-weight: 100;
    padding: 8px 0px 10px 39px;
    background-position: right 10px top 2px;
    margin: 2px 13px 2px 0px;
}
*:focus {
    outline: none;
   }
/*scrollbar*/
/* width */
#accordion ::-webkit-scrollbar {
    width: 7px;}
/* Track */
#accordion ::-webkit-scrollbar-track {
    border-radius: 5px;
    background: #fff;}
/* Handle */
#accordion ::-webkit-scrollbar-thumb {
    background: #00C18B; 
    border-radius: 5px;}
/* Handle on hover */
#accordion ::-webkit-scrollbar-thumb:hover {
    background: #00C18B; }

.accordion-generico ::-webkit-scrollbar {
    width: 7px;}
/* Track */
.accordion-generico ::-webkit-scrollbar-track {
    border-radius: 5px;
    background: #fff;}
/* Handle */
.accordion-generico ::-webkit-scrollbar-thumb {
    background: #00C18B; 
    border-radius: 5px;}
/* Handle on hover */
.accordion-generico ::-webkit-scrollbar-thumb:hover {
    background: #00C18B; }


.box-mobile{
        display: none;
    }
.indices{
    background:#eeeeee;   
    padding: 22px 0;
}

.indices p span {
    padding: 3px 14px;
    margin-left: 9px;
}
.indices .up{
    background: url(../images/html/indices-up.png) no-repeat center;
}
.indices .down{
    background: url(../images/html/indices-down.png) no-repeat center;
}
/*FORMS*/
.cont-forms .title-forms{background: #EEE; margin: 0px; padding: 10px 20px; font-weight: 400; font-size: 18px; color: #575756;}
.cont-forms .content-forms{border: 1px solid #E2E2E2; border-top: none; padding: 15px 20px 0px 20px;}
.cont-forms .form-group{margin-top: 10px;}
.cont-forms label{color: #000; padding-top: 5px;}
.cont-forms .form-control{border: 1px solid #959595; border-radius: 0px; padding: 2px 0px 2px 4px; font-size: 16px; font-weight: 300; color: #000;}
.cont-forms .btn-download{margin-top:10px;}
.cont-forms .link-modal{ text-transform: uppercase; border-bottom: 1px solid #00CE7C; font-size: 14px; margin-top: 15px; display: inline-block; }
.cont-forms .form-control:not([size]):not([multiple]){height: calc(1.25rem + 15px);}

.cont-forms.hightlight{background-color: #EEE;}
.cont-forms.hightlight .content-forms{border: none;}


.cont-forms-update-data .btn-link:hover{text-decoration: none;}
.cont-forms-update-data .icon-refresh{margin-bottom: 20px; font-size: 30px; cursor: pointer;}

.form-radios .radio{
    margin: 0 25px 0 0;
}
.form-radios .radio label{
    font-size: 16px;
    font-weight: 300;
}
.form-inline.form-radios input[type=radio]{
    position: relative;
    margin: -13px 17px 0 0;
    width: 2px;
    height: 1px;
}
.form-inline.form-radios input[type=radio]:before{
    content: '';
    border: 2px solid #2a2d2f;
    width: 15px;
    height: 15px;
    position: absolute;
    border-radius: 13px;
    background: #eeeeee;
    left: -2px;
    top: -1px;
}
.form-inline.form-radios input[type=radio]:checked:after{
    content: '';
    width: 3px;
    height: 3px;
    position: absolute;
    border-radius: 18px;
    background: #2a2d2f;
    top: 5px;
    left: 4px;
}

input[type=radio]:checked:before{
    border: 2px solid #00aa60;
}
/*DOWNLOADS FILES*/
.download-files{font-weight: 300; font-weight: 18px; color: #24272A; list-style: none; margin: 0px; padding: 0px;}
.download-files li{clear: both; border-bottom: 1px solid #CACBCC; margin: 0px; padding: 0px; overflow: hidden;}
.download-files a{color: #24272A; display: block; text-decoration: none; padding: 15px 2px 15px 2px;}
.download-files a:hover{color: #00C18B;}
.download-files .btn-download{vertical-align: middle;}


/*FOOTER*/
.footer{background: #808080; color: #FFF; clear: both; font-weight: 300; padding: 80px 0px 60px 0px;}
.footer a:hover{color: #FFF;}
.footer p, .footer address{margin: 0px; padding: 0px;}
.footer .title-toesca{padding-bottom: 40px;}

.footer .icon-footer{clear: both; margin: 15px 0px 0px 0px; font-size: 17px;}
.footer .icon-footer a{margin-right: 15px;}

.footer .col-contact p:not(:last-child), .footer .col-contact address{padding-bottom: 30px;}

.footer .download{list-style: none; margin: 0px; padding: 0px 20px 0px 0px;}
.footer .download li{border-bottom: 1px solid #A0A0A0; margin: 0px; padding: 10px 0px;}
.footer .download li:last-child{border-bottom: none;}

.footer .download a{background: url(../images/html/icon-download.png) no-repeat right top; background-size: 25px 21px; text-decoration: none; display: block; filter: brightness(0) invert(1);}

.footer-bottom{background: #353535; border-top: 1px solid #5A5A5A; color: #FFF; padding: 20px 0px; line-height: 100%; font-weight: 400; font-size: 10px;}

@media (min-width: 1200px){
    .main-image .container, .main .container{max-width: 970px;}
}
@media (max-width: 991px){
    .footer .col-12.col-lg-4{margin-bottom:30px;}
    .footer .col-contact p:not(:last-child), .footer .col-contact address {
    padding-bottom: 10px;}
    .footer p, .footer address {
    font-size: 14px;}
    .footer-bottom .text-right {text-align: left!important;}
}
@media (max-width: 769px){
    /*NAV TOP*/
    .nav-top li{clear: both;}
    .nav-top li a{text-align: center !important;}
    .cont-forms .form-control{margin-bottom: 10px;}
}
@media (max-width:768px){
    .navbar-expand-md .navbar-toggler{display: block;}
    .container-header{margin:18px 0 0 0;}
    .Login .container-header{border-bottom: 1px solid #00CE7C; margin: 0 21px; padding-bottom: 13px;}
    .hide-element-mobile{display: none !important;}
    .header .nav-header li:first-child a{padding: 0 12px 0 0;} 
    .header .nav-header li.show-element-mobile{display: block !important; width: 100%;}
    .header .nav-header li.show-element-mobile a{ width: 100%;padding: 10px 0 10px 20px;margin-top: 10px;}
    .header .title-toesca{text-align:center;width: 100%;}
    .Login .header .title-toesca{text-align:left; font-size: 74px;}
    .box-mobile{display: block;}
    .box-desktop{display: none;}
}

@media (max-width: 767px){
    .mobile-title{
        display: block;
    }
    p{
        margin-bottom: 0;
    }
    .main {
        padding-top: 26px;
        background: #fff;
    }
    .Login header{
    background: #eeeeee;
    padding-top: 90px;
    }
    .Login .main, .form-login{
    background: #eeeeee;
    margin: 0;
    }
    #loginForm h1{display:none;}
    .form-login .form-control {
    background: #ffffff;
    }
    .main h2{
        background: #eeeeee;
        padding: 12px;
        color: #585757;
        margin-bottom: 0;
    }
    .main h2:first-child{
        margin-bottom: 20px;
    }
    .datos{
        border: 1px solid #4a4a49;
        padding: 13px 15px;
        min-height: auto;
    }

    .datos:first-child{
        border:1px solid #eeeeee;
    }
    .datos h3{
        color:#000;
    }
    .datos .estado-cuenta {
        margin: 40px 0 60px 0;
    }
    .datos #accordion{
        margin-top: 17px;
    }
    .main-image .figure-caption .name{font-size: 20px;
    }  

}
@media (max-width: 640px){
    .main-image .figure-caption{bottom: 10px;}
      

}
@media (max-width: 576px){
    .container {
        max-width: 680px;
    }
    .indices p{
    margin-bottom:13px; 
    }
    .indices p span {
    padding: 12px 14px;
    float: left;
    margin-right: 10px;
    }
    .header .title-toesca{margin-top: 10px;font-size: 50px;}
}
@media (max-width:320px){
    .header .title-toesca{font-size: 34px;margin-top: 18px;}
}

/*Notes*/
.notes p{color:#666; font-size:13px; font-weight: bold;}
.notes ul{background: #fff;}
.notes ul li{ margin:0px; padding:2px; color: #666; font-size:12px;}