/* CSS General */

@import url(fonts.css);
@import url(push.css);
@import url(modal.css);
@import url(globalColors.css);

body{
    font-family: 'Open Sans';
    background: var(--pageBackground)
}

.logo { width:247px; height:auto}
.logo path { fill: var(--logoColor1); }
.logo .otherColor { fill: var(--logoColor2); }
.navbar{border-bottom:1px solid var(--borderHeaderColor); padding-top:0; padding-bottom:0}
.navbar-light .navbar-nav .nav-link { color: var(--textColor1)}

.collapse .navbar-nav a{padding:10px}

.nav-item.active a{font-family:'Open Sans Bold'; position: relative; opacity: 1!important;}
.nav-item.active a::after{ content: ''; display: block; width: 100%; height: 1px; background-color: var(--cons-green); position: absolute; left: 0; bottom: -2px;}

.nav-item a{text-transform:uppercase; font-size:.8rem}
.nav-link{padding:0rem 0.05rem}

.navbar-light .navbar-toggler { margin-left: 16px!important; }
.navbar-light .navbar-toggler-icon { background-image: var(--menuIcon); }

.main{background:var(--mainContentBackground)}

.market, .headchart, .puntas, .comparador, .analisis, .foot, .resumenrenta{font-size:.7rem}
.market thead{ border-bottom:1px solid var(--dark-light); color: var(--textColor1) }
.market thead th span{display:flex; justify-content:flex-end}
.market tbody td { color: var(--textColor2) }
.flag img{width:13px}
.headchart h4 { color: var(--textColor2) }
.headchart h4, .headchart b{font-size:.9rem; font-family:'Open Sans Bold'}
.resumenrenta { color: var(--textColor2) }
.valores{text-align:right; color: var(--textColor2)}

.puntas, .comparador{border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -ms-border-radius:10px; -o-border-radius:10px}
.puntas{background:var(--cons-green); color:var(--white)}
.comparador{background: var(--jupiter)}
.comparador .caja{margin-right:15px}

/* .busca .btn, .clean .btn{background:var(--mayMist); padding:0.08rem 0.38rem; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px} */
.busca .btn, .clean .btn{background:var(--botonera); padding:0.08rem 0.38rem; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px}
.busca i{color:var(--white); font-size:.9rem}

.busca input{width:45%}
.seeker{border:1px solid var(--dark-light); font-size:.7rem; text-indent:10px; line-height:24px;
    border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -ms-border-radius:10px; -o-border-radius:10px; 
}

.seeker:focus{border-color: var(--dark-blue);}

.grafico{min-height:230px}

.analisis .btn, .comparador .btn, .headchart .btn{background:var(--mayMist); color:var(--white); padding:0.08rem 0.38rem; font-size:.7rem; border-radius:15px; -webkit-border-radius:15px; -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px}
.analisis b { color: var(--textColor1)}
.actualizado{ color: var(--textColor2)}
.headchart .btn{height:fit-content}

.busca .btn:hover, .clean .btn:hover, .analisis .btn:hover, .comparador .btn:hover, .headchart .btn:hover { background:var(--jewelCave); }

.periodos a{font-size:.8rem; font-family:'Open Sans Bold'}

.nav-pills .nav-item { margin-right: 5px; }
.nav-pills .nav-item:last-child { margin-right: 0; }
.nav-pills .nav-link{border-radius: 0.7rem; -webkit-border-radius: 0.7rem; -moz-border-radius: 0.7rem; -ms-border-radius: 0.7rem; -o-border-radius: 0.7rem; color: var(--textColor2);}
.nav-pills .nav-link:hover { background: var(--cerebralGrey)!important; color: var(--periodColorHover)!important;}
.foot{line-height:.8rem; text-align:left; color: var(--dark-light);}
.foot a { color: var(--textColor1)}

.showflags{position:fixed; bottom:0; z-index: 99999;}
.showflags .btn{
    background:var(--philippineBlue);
    color:var(--white);
    border-radius: 1.2rem;
    -webkit-border-radius: 1.2rem;
    -moz-border-radius: 1.2rem;
    -ms-border-radius: 1.2rem;
    -o-border-radius: 1.2rem;
    padding: 0.5rem 0.75rem
}

.vcuota{font-size:.7rem; text-align:right; color: var(--textColor1);}

.hazte, .acceso{text-align:center; padding:12px 25px; width:100%; color:var(--white);
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    -ms-border-radius:4px;
    -o-border-radius:4px;
}

.goConsorcio{font-size:16px; display:block; margin:15px 0}
/* .goConsorcio i{color:var(--cons-green); margin-left:5px} */
.goConsorcio i{margin-left:5px}
.goConsorcio a {color: var(--textColor1)!important;}
.goConsorcio a, .foot a{text-decoration:none}
.goConsorcio a:hover{color:var(--mayMist)!important}

.rrss i{color:var(--dark-light)}

.banner{height: auto; width: 100%; display:inline; background:var(--mayMist)}
.banner img{width:100%}

h6{font-weight:bold; color:var(--textColor1)}

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

.constituyentes th{font-family:'Open Sans light'}
.constituyentes th:first-child{font-family:'Open Sans Bold'}

.clear{margin-top:0}

.nav-fill .nav-item .nav-link, .nav-justified .nav-item .nav-link{text-align:center}

.dropdown-item{display:flex}
.dropdown-item img{float:left; margin-right:7px}
.ellipse-item{display:contents}

.instrument, .delete-fav{cursor:pointer; color: var(--textColor1)}
.delete-fav{color: var(--dark-light)}
.instrument:hover, .delete-fav:hover{color: var(--cons-celeste)}

.form-check{color: var(--textColor2); width: 130px;}
.form-check label{font-size:.8rem; position:relative; top:-2px}

input:focus, input.form-check-input:focus, a:focus, li:focus{outline:none!important; outline-width:0 !important; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none}

.btn:focus {
    outline: none;
    box-shadow: none;
}

.btn-green { background: var(--cons-green)!important; color: var(--white)}
.btn-green:hover { background: var(--tardis)!important; color: var(--white)}

.btn-lightBlue { background:var(--cons-celeste)!important; color: var(--white) }
.btn-lightBlue:hover { background:var(--tardis)!important; color: var(--white) }

.navbar-toggler:focus { box-shadow: none!important; }

.modo i { color: var(--textColor1) }

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
    color: var(--textColor1)!important;
    opacity: 0.4;
}

#charts {
    transition: all 0.8s ease;
}

#loadingChart i { color: var(--textColor1); }

.analisisTecnicoContainer {
    position: absolute;
    background: var(--atBackground);
    border-radius: 8px;
    border: 1px solid var(--atBorderColor);
    padding-bottom: 10px;
    -webkit-box-shadow: 2px 1px 11px 0px rgba(0,0,0,0.28); 
    box-shadow: 2px 1px 11px 0px rgba(0,0,0,0.28);
}

.card {
    background: var(--pageBackground);
    border: 1px solid var(--textColor1);
    color: var(--textColor1);
}

.card .card-title{
    font-size: 16px;
}

.card .card-body {
    padding: 8px;
}

.blkFavoritos .instrument {
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 62px;
    vertical-align: middle;
}

.boardFavoritos::before {
    content: '';
    display: block;
    width: 100%;
    height: 8px;
    background: var(--botomGradient);
    position: absolute;
    bottom: 0;
    z-index: 1;
}

.modal-body > .close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0.5rem 0.75rem;
    z-index: 1;
}
.modal .close {
    font-weight: 100;
}

button.close {
    padding: 0;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
}

button, html [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
}

.close {
    float: right;
    font-size: 1.40625rem;
    font-weight: 600;
    line-height: 1;
    color: #000;
    text-shadow: none;
    opacity: .5;
}

.bootbox-body {
    text-align: center;
}

.modal-footer {
    justify-content: center;
    border-top: none;
}

#blkRentabilidadSelect {
    width: fit-content;
    background: var(--atBackground);
    position: absolute;
    top: 10px;
    right: 0;
    border: 1px solid var(--atBorderColor);
    border-radius: 4px;
    font-size: 11px;
    color: var(--textColor1);
    -webkit-box-shadow: 0px 3px 5px 1px rgb(0 0 0 / 14%);
    -moz-box-shadow: 0px 3px 5px 1px rgba(0,0,0,0.14);
    box-shadow: 0px 3px 5px 1px rgb(0 0 0 / 14%);
}

#blkRentabilidadSelectText, #btnCloseRentabilidadChart {
    display: inline-block;
    vertical-align: top;
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: var(--scrollColor)!important;
}

#blkCookiePolicy {
    background-color: var(--dark-blue)!important;
    color: var(--beluga);
}

#blkCookiePolicy .btn {
    background-color: var(--cons-green)!important;
    color: var(--white);
}

#blkCookiePolicy .btn:hover {
    background-color: var(--overTheHills)!important;
}

#blkCookiePolicy a {
    color: var(--mayMist);
    text-decoration: none;
}

#blkCookiePolicy a:hover {
    color: var(--cons-celeste);
}

@media (max-width:397px) {
    .clear{margin-top:0.5rem}
    .logo{width:155px}
}

@media (max-width:575px) {
    .form-check{width: auto;}
}

@media (max-width: 992px) {
    .header-page .navbar-light { padding-top: 10px; padding-bottom: 10px; }
    .navbar-collapse { border-top: 1px solid var(--borderHeaderColor); margin-top: 10px; }
    .nav-link{text-align:left}
    .nav-item.active a{border-bottom:none}
    .navbar-light .navbar-nav .nav-link { line-height: 32px;}
    .nav-item.active a { padding-left: 20px!important; }
    .nav-item.active a::after { width: 3px; height: 100%;}
    .navbar-light .navbar-toggler{border-color:rgba(0, 0, 0, 0)}
    .analisis .btn{height:fit-content}
    .busca input{width:65%}
    .foot{text-align:justify}
    .collapse .navbar-nav a{padding:unset}
    .collapse .navbar-nav li{ transition: 0.9s; margin-bottom:10px; -webkit-transition: 0.9s; -moz-transition: 0.9s; -ms-transition: 0.9s; -o-transition: 0.9s; }
    .analisisTecnicoContainer {
        position: relative;
        background: transparent;
        border-radius: 0;
        border: none;
        padding-bottom: 0;
        -webkit-box-shadow: none; 
        box-shadow: none;
    }
}