/**
 * Pagina de Inicio
 * Registro
 * Consulta de Solicitud
 */

 main {
    padding: 0 10% 0 10%;
    margin-bottom: 60px;
 }

.d-none{
    display:none !important;
}

#mobileshow { 
    display:none; 
}
#mobilehide { 
    display:block; 
}

.txt-registrate { 
    font-weight: bold;
    color: #0663AB !important; 
}
.txt-ingresa { 
    font-weight: bold;
    color: forestgreen !important; 
}

a.btn-reg-main { 
    background-color: #0663AB !important; 
}
.fecamype .nav > li > a.btn-reg-main:hover { 
    background-color:#065591 !important;
}

a.btn-login-main { 
    background-color: forestgreen !important;
}
.fecamype .nav > li > a.btn-login-main:hover { 
    background-color: #1c741c !important;
}
.fecamype .nav .open > a.btn-login-main{
    background-color: forestgreen !important;
}
.fecamype .nav > li > a.btn-login-main:hover, .nav > li >  a.btn-login-main:focus{
    background-color:#1c741c !important;
}


div.sticky {
    position: -webkit-sticky;
    position: sticky !important;
    top: 0;
    display:flex;
    flex-direction:row-reverse;
    background-color: #303845;   
    font-size: 16px;
    padding: 10px;
    z-index: 3;
    margin-bottom: -50px;
    
}

.nav-mrg-right {
    margin-right: 8%;
}

.mrg-bottom {
    margin-bottom: 20px;
}

.fecamype .nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: #6b7187 !important;
}

.fecamype .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: #6b7187 !important;
}

#formLogin{
    margin-left: -100px; 
    padding: 15px; 
    min-width:300px;
}

.art-page{
    margin-left:50px; margin-right:50px;
}

.anchor { padding-top: 75px; }


.btn-pill {
    border: medium none;
    border-spacing: 0;
    cursor: pointer;
    font-weight: 400;
    line-height: 48px;
    font-size: 16px;
    border-radius: 46px;
    padding: 0 25px;
    display: inline-block;
    color: #fff;
    -webkit-appearance: none;
    background-size: 100% 100%;
    transition: all 0.35s ease-in-out;
}

.conamype {

    background-color:#3c4557;
    color: #FEFFFF!important;
}
.conamype:hover{
    background-color: #6b7187;
}


.margin-btn-right{
    margin-right: 5px !important;
}

.fecamype .enlace-clave a {
    color: #3c4557 !important;
    text-decoration: underline;  
}

.fecamype a {
    color: #FEFFFF !important; 
    text-decoration: none !important;   

}

.fecamype a:link a:visited a:hover a:active {
    text-decoration: none !important;
}

.modal-trigger {
    cursor: pointer;
}

#cuerpo {
    font-size: 14px;
    padding-top: 5px;
}
.panel-dark {
    background-color: #2c3e50;
    color: white; 
    border-radius: 8px;
}
.panel-dark:hover{
    background-color:#1a252f;
}
#collapse_linea_credito .collapse {
       display: block;
}
.btn-primary-dark{
    background-color:#343a40;
    color:#FFFFFF;
}
.btn-primary-dark:hover{
    background-color:#1a252f;
    color:#FFFFFF !important;
}

.card-row {
  /*SET DISPLAY FLEX ON CONTAINER*/ 
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;  
  
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  
}
.card__img {
  display: block;  
  flex-grow: 1 1 0;
  width: 75%;/*75%*/
  height: 100%; /*18rem*/
  object-fit: cover;
  margin: 0 auto;  
}

.img {   
    margin-top:10px; 
    align-items: center;
    flex-grow: 1 1 0;  
   
}

.img img{   
    width: 100%;
    height: auto;
   
}

.lnc-detalle img{
    width: 50% !important;
    height: auto;
}

.flex-child {
    flex:1;
    margin: 5px;
    border: 1px black solid; 
    border-radius: 5px;  
    display: flex;
    flex-direction: column;  
    
}
.flex-child:hover{
    
    border: 1.5px #1a252f solid;
    background: #fff;
    box-shadow: 0px 15px 26px rgba(0, 0, 0, 0.50);
    
    
}
.flex-child .card-titulo{
    display:flex;
    justify-content:space-between;  
    line-height: 16px;  
    margin: 10px 5px 5px 5px;   
    align-items: center; 
    height:5px;
}
.card-titulo span{
    flex:1;
    text-align: center;
    color:#343a40;
    font-weight:bold;       
    font-size: 16px;
    margin: 0px 15px 0px 15px;    
}

.card .content {
  flex: 1 1 auto;
}


.card .card-footer {
  
  flex: 0;
  bottom:0px; 
  margin-bottom:8px; 
  border-top: 1px solid rgba(0, 0, 0, 0.125);
  min-width: 100%;  
  box-sizing: border-box;

}

#mobileshow { 
    display:none; 
}
#mobilehide { 
    display:block; 
}
.swal-text{
    text-align:justify !important;
}
.swal-icon img{
    width:90%;
    height:40%;
}
/* linea de credito detalle */
.linea-titulo {

 
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;  
  
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  justify-content: center;
}

.linea-titulo > .flex-titulo {
    flex: 1/3;
    margin: 5px;     
    display: flex;
    flex-direction: row;  
     
}

.flex-titulo .card-header{
    /*SET DISPLAY FLEX ON CONTAINER */
    display:flex;
    justify-content:space-between; 
    flex-direction: row-reverse;
    margin: -20px -8px 5px -8px;
    align-items: center; 
}

.flex-titulo > .card-header > .card-titulo{
    display:flex;
    justify-content:space-between;  
    line-height: 36px;  
    margin: 10px 5px 5px 5px;   
    align-items: center; 
    height:60px;
    flex-grow: 1 1 0;
}

.card_titulo_img {    
    display: block;      
    height: 100%; /*18rem*/
    object-fit: cover;
    margin: 0 auto;
}
  

.flex-titulo > .card-header > .card-titulo > span{
    
    text-align: center;
    color:#343a40;
    font-weight:bold;       
    font-size: 40px;
    margin: 0px 15px 0px 15px;    
}

.box > .icon > .image > .image-icon{
    display: block;
    background-image: url('../images/lupa.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 36px;
    width: 36px;
    padding: 10px;
    margin: 0 auto;
    margin-top: 20px;
    
  }
  
  .box > .icon:hover > .image > .image-icon{
    display: block;
    background-image: url('../images/lupa_hover.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 36px;
    width: 36px;
    padding: 2px;
    margin: 0 auto;
    margin-top: 20px;
    
  }



.box > .icon { 
    /*text-align: center;*/ 
    position: relative; 
    font-size : 16px !important;
}
.box > .icon > .image { 
    position: relative;
    text-align: center;
    z-index: 2;
    margin: auto;
    width: 88px; 
    height: 88px; 
    border: 8px solid white; 
    line-height: 85px; 
    border-radius: 50%; 
    background: rgb(211, 207, 207); 
    vertical-align: middle; 
    color:black;
}
.box > .icon:hover > .image { 
    background: #3c4557;/* rgb(211, 207, 207); */
    color: white;
}
.box > .icon > .image > i {    
    font-size: 48px !important; 
    color: #fff !important;

}
.box > .icon:hover > .image > i { 
    color: white !important; 
}
.box > .image:hover > .image-icon{ 
    color: white !important; 
}
.box > .icon > .info { 
    margin-top: -24px; 
    background: rgba(0, 0, 0, 0.04); 
    border: 1px solid #e0e0e0; 
    padding: 15px 0 10px 0; 
}
.box > .icon:hover > .info { 
    background: rgba(0, 0, 0, 0.04); 
    border-color: #e0e0e0; 
    
}
.box > .icon > .info > h3.title { 
    font-family: "Roboto",sans-serif !important; 
    font-size: 18px; color: #222; 
    font-weight: 500;
    text-align: center; 
}
.box > .icon > .info > p { 
    font-family: "Roboto",sans-serif !important; 
    font-size: 16px; color: #666; 
    line-height: 1.5em; 
    margin: 20px;
}
.box > .icon > .info > ul {    
    margin: 20px;
}
.box > .icon:hover > .info > h3.title, .box > .icon:hover > .info > p, .box > .icon:hover > .info > .more > a { 
    color: #222; 
}
/*
.box > .icon > .info > .more a { 
    font-family: "Roboto",sans-serif !important; 
    font-size: 12px; 
    color: #222; 
    line-height: 12px; 
    text-transform: uppercase; 
    text-decoration: none; 
}
.box > .icon:hover > .info > .more > a { 
    color: #fff; 
    padding: 6px 8px; 
    background-color: #63B76C; 
}
*/
.box .space { 
    height: 30px; 
}
/*-----------------------*/
/* Tabs panel */
.tabbable-panel {
    border:1px solid #eee;
    padding: 10px;
  }
  
  /* Default mode */
  .tabbable-line > .nav-tabs {
    border: none;
    margin: 0px;
  }
  .tabbable-line > .nav-tabs > li {
    margin-right: 2px;
  }
  .tabbable-line > .nav-tabs > li > a {
    border: 0;
    margin-right: 0;
    color: #737373;    
  }
  .tabbable-line > .nav-tabs > li > a > i {
    color: #a6a6a6;
  }
  .tabbable-line > .nav-tabs > li.open, .tabbable-line > .nav-tabs > li:hover {
    border-bottom: 4px solid  #7d8086;
  }
  .tabbable-line > .nav-tabs > li.open > a, .tabbable-line > .nav-tabs > li:hover > a {
    border: 0;
    background: none !important;
    color:#303845;  
  }  
  .tabbable-line > .nav-tabs > li.open > a > i, .tabbable-line > .nav-tabs > li:hover > a > i {
    color: #a6a6a6;
  }
  .tabbable-line > .nav-tabs > li.open .dropdown-menu, .tabbable-line > .nav-tabs > li:hover .dropdown-menu {
    margin-top: 0px;
  }
  .tabbable-line > .nav-tabs > li.active {
    background: none !important;
    border-bottom: 4px solid #303845;
    position: relative;
  }
  .tabbable-line > .nav-tabs > li.active > a {
    border: 0;
    color:#333333;
  }
  
  .tabbable-line > .nav-tabs > li.active > a:focus{
    background: none !important;      
  }
  .tabbable-line > .nav-tabs > li.active > a > i {
    color: #404040;
  }
  .tabbable-line > .tab-content {
    margin-top: -3px;    
    background-color: #fff;
    border: 0;
    border-top: 1px solid #eee;
    padding: 15px 0;
    font-size: 16px;
  }
  .portlet .tabbable-line > .tab-content {
    padding-bottom: 0;
  }

  .tabbable-line > .tab-content > .tab-pane{
    margin-left: 10px !important;
  }

  .opcionales{
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    
  }
  
  /* Below tabs mode */
  
  .tabbable-line.tabs-below > .nav-tabs > li {
    border-top: 4px solid transparent;
  }
  .tabbable-line.tabs-below > .nav-tabs > li > a {
    margin-top: 0;
  }
  .tabbable-line.tabs-below > .nav-tabs > li:hover {
    border-bottom: 0;
    border-top: 4px solid #464a52;
  }
  .tabbable-line.tabs-below > .nav-tabs > li.active {
    margin-bottom: -2px;
    border-bottom: 0;
    border-top: 4px solid #303845;
  }
  .tabbable-line.tabs-below > .tab-content {
    margin-top: -10px;
    border-top: 0;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
  }
/* end */

@media (max-width: 480px){

    .art-page{
        margin-left:0px !important; 
        margin-right:0px !important;
    }  
    
    .art-page div{
        margin-left:0px !important; 
        margin-right:0px !important;
    } 

    .art-page ul > li {
        margin-left: -20px;      
    }

    #login-titulo {
        text-align: center;
    }

    .fecamype .navbar-nav  > li {display:inline-block;} 
   
    #mobileshow { 
        display:block; 
    }    
    #mobilehide { 
        display:none; 
    }
    #transforma-titulo{
        /*margin-right:35px;  */
        margin-right: 0px;      
    }
    #collapse_linea_credito .collapse {
       display: none;
    }

    .card-row{
        margin-left:-15px;
        margin-right:-15px; 
    }

    .linea-titulo{
        margin-top: -50px;
    }

    .card-header{
        /*SET DISPLAY FLEX ON CONTAINER */
        display:flex;
        justify-content:space-between; 
        flex-direction: row-reverse;
        margin: -20px -8px 5px -8px;
    } 
    
    .flex-titulo > .card-header {        
        all:unset;  
        display:flex;
        align-items: center;  
        text-align: center;
        flex-direction: row-reverse; 
        margin: 0 auto;          
    }

    .flex-titulo > .card-header > .card-titulo {        
        all:unset;  
        display:flex;
        align-items: center;  
        text-align: center;           
    }
    
    .flex-titulo > .card-header > .card-titulo > span{
        all: unset;   
       
        color:#343a40;
        font-weight:bold;       
        font-size: 16px;  
          
    }
    .flex-child {
        all:unset; 
        margin: 5px;
        border: 1px black solid;
        border-radius: 5px;
        display: flex;
        flex-direction: column;
    }
    .flex-child .img {  
        all:unset;    
        width:100%;    
    } 

    .flex-titulo .img {  
        all:unset;    
        /*width:40%;   */ 
    } 
    .flex-child:hover{    
        
        box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.50) !important;          
        
    }
    .flex-child .card-titulo{
        all:unset;  
        display:flex;
        align-items: center;  
        text-align: center;        
    } 

    .card-titulo span{
        all: unset;    
        text-align: center;
        color:#343a40;
        font-weight:bold;       
        font-size: 16px;           
    }
    .card__img {
        all: unset; 
        display: block;            
        height: 8rem; 
        object-fit: cover;
    }
    .card_titulo_img {
        all: unset; 
        display: block;            
        height: 8rem; 
        object-fit: cover;
    }
    .card-footer {  
        all:unset;      
        display: flex;     
        --gap: 15px !important;
        justify-content: flex-end;
        width: 130px;    

    }
    .card-footer .btn{
        font-size: 11px !important;
        font-weight:bold;
        border-radius: 23px !important;
    }  

    .card-footer .margin-actionBtn {
        margin-left:10px !important;
    }
    .card-footer .btn-block {
        width:auto !important;
    }

    .linea-titulo > .card-footer {              
        display: flex;       
        justify-content: center;       
        margin: 0 auto !important; 
    }
    .linea-titulo > .card-footer > a{
        flex: 1/3;           
        display: flex;
        flex-direction: row; 
    }   
    .linea-titulo > .card-footer .btn{
        font-size: 11px !important;
        font-weight:bold;
        border-radius: 23px !important;
    }  

    .linea-titulo > .card-footer .margin-actionBtn {
        margin-left:10px !important;
    }
    .linea-titulo > .card-footer .btn-block {
        width:auto !important;
    }
    .breadcrumb{
       margin-top:30px !important;
    }
    
    .btn-pill {        
        line-height: 30px;
        font-size: 14px;        
        padding: 0 15px;       
    }

    .lnc-detalle img{
        width: 100% !important;
        height: auto;
    }
}