body{
    background-color:#E6E6E6 !important;
    font-family: Roboto,sans-serif !important;
    font-size: 1rem;
}

.frontpage{
    background-color:#E6E6E6 !important;
}

.search-bar-input{
    position:absolute;
    top:5rem;
}

.sbn-navbar{
    padding:0px;
    border-top: 2px solid;
    border-top-color:#008E65;
    background-color:#0a3f0a;
}

.sbn-navbar a{
    color: #fff;    
    font-size:14px;
    font-weight:600;
}

.sbn-menu-navbar .navbar-nav{
    min-height:86px;
}

.sbn-navbar .nav-item{
    padding-left: 10px;
    padding-right: 10px;
}

.sbn-navbar .nav-item:hover{
    background-color: #BAD405;
    color: #014235;  
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{
    color: #056031 !important;
}

.green-line-separator{
    border-top: solid 2px;
    color: #bad405;
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
}

.title-separator-main-carousel{
    margin-left: 7rem;
    width: 45%;
}

.title-separator-secondary-carousel{
    margin-left: 20%;
    margin-right: 20%;
}

.card{
    border-radius: 0.75rem;
}

.card-text-impl-sbn{
    height:100%;
    
}

.circle-img-card{
    width: 10rem;
    height: 10rem;
}

.custom-circle-image {
  width: 10vw; /* note i used vw not px for better responsive */
  height: 10vw;
}

.custom-circle-image-role {
  width: 12vw; /* note i used vw not px for better responsive */
  height: 9vw;
}

.custom-circle-image-min {
  position: absolute;
    width: 3.5rem;     
    height: 3.5rem; 
    top: 8.5rem;
    right: 3rem;
}

.border-warning{
    border-color:#ff5f00!important
}

.border-carousel-slide{
    border-color:#ffff!important
}

.curved-border{
    border-radius: 8px 8px 8px 8px;
}

.card-margin-top-sbn{
    margin-top:25px;
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: visible;
}

.card-body{
    overflow: hidden;
}

.card-header{
    background-color:#BAD405 !important;
    padding: 0.75rem 1.25rem !important;
    margin-bottom:1rem;
    border-radius: 5px !important; 
}

.btn-card-impl-sbn {
    position: absolute;
    left: 33.3%;
    color: #fff;
    background-color: #0a3f0a;  /* #BAD405 */
    border-radius: 8px 0 8px 0;
    font-weight: 600;
    width: 115px;
    line-height: 1.1;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    bottom: -12px;
}

.carousel-control-next,.carousel-control-prev{
    position:absolute;
    top:0;
    bottom:0;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:5%;
    color:#fff;
    text-align:center;
    opacity:.5;
    transition:opacity .15s ease}
    
.carousel-control-prev-icon-green{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23BAD405' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e")}

.carousel-control-next-icon-green{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23BAD405' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e")}

.container-carousel-control-2-prev{
    position: relative;
    top:2rem;
    left:-1rem;
}

.container-carousel-control-2-next{
    position: relative;
    top:2rem;
    right:-0.8rem;
    z-index:9999;
}
.btn-card-impl-sbn:hover {
    color: #1a3f32;
    background-color: #BAD405;
}

.btn-read-more{
    background-color: #BAD405;
    color: #1a3f32;
    border-radius: 8px 0 8px 0;
    font-weight: 500;
    width: 115px;
    line-height: 1.1;
}

.img-d {
    object-fit: cover;
    border: 10px solid #E3E2E6;
    box-shadow: 0 0 0 10px #f1f1f1, 0 0 0 10px #f1f1f1;
    margin-bottom: 15px;
}

footer {
  background: #fff;
  color: #2c6e28;
  font-weight: 600;
  padding: 1px 0; 
  line-height: 1.5;
}
footer .logo_footer {
width: 190px;
display: block;
}
footer .logo_footer img {
width: 100%;     
}
footer .box_link_footer a {
display: inline-block;
margin: 0 5px 0 0;       
}
footer .box_link_footer a img {
    width: 25px; 
    
}
footer .links_social a {
display: inline-block;
margin: 10px 5px 10px 0; 
    
}
footer .links_social a img {
    width: auto;
    height: 20px; 
    
}
footer .link-footer {
color: #333333;
font-weight: 600;
text-decoration: underline;
font-size: 14px;
margin-bottom: 1rem;
display: block; 
}
footer .info_footer {
font-size: 14px; }
footer .info_footer strong {
    color: #266831;
    font-weight: 600;
    font-size: 14px; 
}
footer .info_footer a {
    color: #266831;
    font-size: 14px;
    overflow-wrap: break-word; 
}
footer .links_site {
text-align: right;
}
@media screen and (max-width: 768px) {
    footer .links_site {
    text-align: left; 
    } 
    .search-bar-input {
        position: absolute !important;
        top: 20rem !important;
        left: 4rem !important;
    }
    .header-search{
        max-width: 300px !important;
    }
}
footer .links_site a {
    color: #2c6e28;
    font-weight: 600;
    display: block;
    font-size: 14px;
    margin: 12px 0; 
    line-height: 1.5;
}
footer .box_tyc {
    text-align: right;
    margin: 16px 0; 
}
@media screen and (max-width: 767px) {
    .container-fluid.container-desafios.container-carousel-standar{
        display: none;
    }
    .card-text-desafios{
        margin-left: 3rem;
        margin-right: 3rem;
    }
}
@media screen and (max-width: 768px) {
    body {        
        font-size: 0.75rem;
    }
    .container{
        max-width: 670px;
    }
    
    footer .box_tyc {
    text-align: left;
    }
    .mx-auto-main-bar{
        display: flex;
        align-items: center;
        margin: 0 auto;
    }
    .sbn-navbar a {
        font-size: 11px;
    }
    .sbn-logo-image-navbar{
        position: absolute;
        width: 45px !important;
        left: 5px !important;
        top: 35px !important;
    }
}
@media (min-width: 576px) {
    .container{
        padding-right: 5px;
        padding-left: 5px;        
    }
    .pt-5, .py-5 {
        padding-top: 1rem !important;
    }
}

footer .box_tyc a {
    color: #2c6e28;
    font-weight: 600;
    font-size: 14px;
    line-height: 1.5;
}

.copyright {
  height: 35px;
  background-color: #fff;
  color: #333333;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
}

 #holder {
    height: 600px;
    margin: 0px 0 0 0px;
    width: 850px;
    margin-left: 15px;
    background-color:#fefefe;
}
#time {
    text-align: center;
    font: 100 3em "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.news-wrapper .row .img {
    width: 150px;
    min-height: 150px;
    border-radius: 50%;
    margin-bottom: 16px;
    margin-left:60px;
    color: #333333;
    background-size: cover;
    border: 15px solid #eee;
}

.news-wrapper .row .flag {
    position: absolute;
    background: #bad405;
    top: 24px;
    padding: 6px 8px;
    font-size: 14px;
    color: #333333;
    line-height: 1;
    font-weight: 600;
}

.news-wrapper {
    position: relative;
    padding-bottom: 32px;
    padding-left:20px;
    padding-right:20px;
}

.news-vertical-content{
    padding:1px;
    width:300px;
}

.news-text{
    font-size: 0.8rem;
    text-align: center;
}

.news-wrapper .row .titulo-step{
    text-align: center;
    color: #1B4F72;
}

/* -- PAGINATION -- */

.pagination {
    float: left;
    width: 100%;
}

.pagination ul {
    list-style: none;
    margin: 0;
    padding: 0px 0px 0px 0px;
    position: relative;
    text-align: center;
}

.pagination li {
    margin-left: 1px;
    padding: 0;
    display: inline-block;
}

.pagination li a {
    color: #555;
    text-align: center;
    background: #eee;
    display: block;
    float: left;
    width: 28px;
    height: 28px;
    text-decoration: none;
    line-height: 30px;
}
    
.pagination li a.active, .pagination li.active, .pagination li a:hover {
    background: #e6e6e6;
    color: #0a3f0a;
    font-weight:600;
}

.pagination li a.disabled {
    cursor:default;
    opacity:0.5;
}

.pagination li a.disabled:hover {
    cursor:default;
    color: #a5a5a5;
    background: #eee;
    text-decoration: none;
}

.btn-sbn-tools{
    text-align: left;
}

.btn-sbn-tools-2:hover {
    color:#fff;
}

.video-switch-tabs {
    margin-bottom: 0.75rem;
}

/* Indicador de selección SIN cambiar el tamaño del botón:
   atenuamos el inactivo (opacidad + escala de grises); el activo queda pleno.
   No usamos border/box-shadow para no agrandar visualmente el botón. */
.btn-video-switch {
    opacity: 0.5;
    filter: grayscale(35%);
    transition: opacity 0.2s ease, filter 0.2s ease;
}

.btn-video-switch.active {
    opacity: 1;
    filter: none;
}

/* Móvil: evitar que "Video Bioeconomía" se parta en 2 líneas
   (los botones quedan de una sola línea y de alto parejo). */
.d-md-none .btn-video-switch {
    width: auto;
    white-space: nowrap;
    padding-left: 14px;
    padding-right: 14px;
    margin: 0 4px 8px;
}

/* Escritorio: los botones se anclan sobre el ancho del background del laptop.
   Van DENTRO de .laptop-main-page (contenedor posicionado del laptop) para
   heredar su mismo desplazamiento y quedar por encima del <video> (que es
   position:absolute y, si no, taparía el botón derecho e impediría el clic).
   left:2em = padding del contenedor -> alinea con el borde izq. del background.
   El width por-breakpoint (= ancho del background) se define más abajo. */
.panel-info-and-video .video-switch-tabs {
    position: absolute;
    top: -14px;
    left: 2em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    z-index: 30;
}

.panel-info-and-video .btn-video-switch {
    position: relative;
    z-index: 31;
    width: 130px;
    padding-left: 6px;
    padding-right: 6px;
    text-align: center;
    font-size: 15px;
}

.curved-div svg {
  display: block;
}

.border-sbn-tools{
    margin-top:20px;
    padding-bottom:3rem;
    border:3px solid !important;
    border-color: #BAD405!important;
    border-top-left-radius: 2rem!important;
    width: 500px;
    position: absolute;
    right: -2rem;
    padding-left:5%;
}

.sbn-imagen-size{
    margin-bottom:2rem !important;
    padding-top: 10px;
    max-width:500px;
    margin:auto;
}

.sbn-figures-info{
    margin-left: auto; 
    margin-right: auto;    
    color: #0a3f0a;
    font-size: 11px;
    text-align: center;
}

.sbn-card-desafios-size{
    width: 18rem;
    height:7rem;
    border-radius:0.5rem !important;
}

.sbn-card-display{
    align-items: center;
    justify-content: center;
    margin-bottom:1rem;
    display: flex;
    max-width:100% !important;
}

.sbn-nav-bar-responsive{
    padding-left:0rem !important;
}

.card-casos-de-exito{
    padding:5px;
}
.card-casos-de-exito .overlay {
    position: absolute;
    top: 5px;
    left: 20px;
    width: 340px;
    height: 340px;
    background: #b8cf00;
    opacity: 0;
    z-index:99;
    transition: opacity 250ms ease-in-out;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.card-casos-de-exito:hover .overlay{
  opacity:0.97;
}

.card-casos-de-exito-sbn{
    padding:5px;
    position: relative;
    overflow: hidden;
}

.card-casos-de-exito-sbn .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #b8cf00;
    opacity: 0;
    z-index:99;
    transition: opacity 250ms ease-in-out;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.card-casos-de-exito-sbn:hover .overlay{
  opacity:0.97;
}

.card-text-overlay{
    margin-top:0px;
    text-align:center;
}

.card-text-overlay h5{
    color:#fff !important;
}

.card-text-overlay-sbn{
    margin-top:0px;
    text-align:center;
}

.card-text-overlay-sbn h5{
    color:#fff !important;
    font-size:0.85rem;
}

.card-text-overlay-sbn p{
    font-size:0.75rem;
}

.cart-download-icon {
    position: absolute;
    right: 10px;
    bottom: 5px;
    color: #fff !important;
    font-size:2rem;
    cursor:pointer;
}

.cart-download-icon a{
    color: #fff !important;
}

.header-search-icon{
    position: absolute;
    right: 10px;
    bottom: 5px;
    color: #fff !important;
    font-size:2rem;
    cursor:pointer;
}


.card-img-casos-de-exito-sbn{
    width:250px;
    height:250px;
    overflow: hidden;
    object-fit: cover;
    display: block;
}

.card-title-main{
    position:absolute;
    background-color : #0a3f0a;
    color: #fff !important;
    bottom:5px;
    left:20px;
    width:340px;
    opacity: 0.8;
    height: 25%;
}
.card-title-main-sbn{
    position:absolute;
    background-color : #0a3f0a;
    color: #fff !important;
    bottom:0;
    left:0;
    right:0;
    opacity: 0.8;
    height: 35%;
    overflow: hidden;
}
.card-title-center{
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.card-title-main h5{
    color: #fff !important;
    margin-top:1px;
    margin-left:0px;
}

.card-title-center-sbn{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 0.75rem;
}

.card-title-main-sbn h5{
    color:#fff !important;
    margin-top:1px;
    margin-left:0px;
}

.casos-de-exito-header{
    background-color:#3e522f21;
    margin-bottom:30px;
}

.casos-de-exito-background-header{
    position: absolute;
    /*background-color: #438711;*/
    width: 100%;
    
    height: 300px;
    background: url('/media/j5slgvbr/ddeb880b61a02925f681e22b8b2690d75d0373d6552c4c6fbb5e60d7e3f5e916052990d1c543eac1b463b2a5b35b5dfebdc205cecabea27721661b_1280.jpg') #00ff0055;
}
.casos-de-exito-background-header2{
    position: absolute;
    /*background-color: #438711;*/
    width: 100%;
    
    height: 300px;
    background: url('/media/vseg3udx/tnc19001_180824_1695.jpg') #00ff0055;
}

.casos-de-exito-background-header-overcolor{
 position:relative; 
 background: linear-gradient(to right, #033003d1 50%, #032603bf 50%, #125312de 55%, #1c661d94 95%);
    top: 0px;
    height: 18.8rem;
    padding-top: 2rem;
    padding-bottom: 20px;
    width: 100%;
    margin-top: -1px;
    margin-bottom: -1px;
}

.casos-de-exito-background-header:before{
    background-color: #438711;
}

.row-casos-de-exito{
    background-color: #fff;
    padding-top:15px;
    
}    

.section-casos-de-exito{
    padding-top:15px;
    padding-left:15px;
    padding-bottom:35px;
    width:100%;
}

.btn-toolbar1{
    padding-bottom:5px;
}

.tittle-sbn2{
    font-weight:bold !important;
    margin-top:2rem;
    font-size:22px;
}

.bold-text-sbn{
    color:#0a3f0a !important;
    font-size:22px;
    font-weight:bold;
}

.normal-text-sbn{
    color:#212529 !important;
    font-size:1rem;
    font-weight:normal;
}

.normal-text-sbn-2{
    color:#0a3f0a !important;
    font-size:1rem;
    font-weight:normal;
}

.button-text-sbn{
    color:#0a3f0a !important;
    font-size:12px;
    font-weight:normal;
}

.float-button{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#BAD405;
	color:#1a3f32;
	border-radius:50px;
	text-align:center;
	box-shadow: 2px 2px 3px #999;
	padding-top: 0.75rem;
}

.float-button .bi {
	font-size: 1.5rem;
}

.sbn-title-area-aplicacion{
    padding:0.75rem;
}
.sbn-personal-apoyo{
    width:95%;
}
.table th{
    border:2px solid #dee2e6;
}
.table td{
    border:2px solid #dee2e6;
}


@media (min-width: 320px) {
    .sbn-logo-image-navbar{
        position: absolute;
        width: 60px;
        left: 1px;
        top: 3rem;
    }
    
    .laptop-main-page{
        position: relative;
        padding: 1em;
        left: 1px;
        transform: translate(-1%, 2%);
        opacity: 1;
    }
    .panel-info-and-video{
        height: 32rem;
        background-color: #fff;
        opacity: 0.9;
    }
    .video-container video{
        position: absolute;
        top: 20rem;
        left: 1px;
        width: 100%;
    }
    
    .video-container img{
        display:none;
    }
    .buton-video-container{
        padding-left:3rem;
    }
    .home-exploration-panel{
        font-size:1.6rem;
        padding-left:.5rem;
    }
    .btn-sbn-tools {
        background-color: #BAD405;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    
    .btn-sbn-tools-2 {
        background-color: #0a3f0a;
        color: #BAD405;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
        border-color:#BAD405;
    }
    .btn-sbn-tools-3{
        background-color: #fff;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .btn-sbn-tools-4 {
        background-color: #0a3f0a;
        color: #fff;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .curved-div {
        display:none;
    }
    .min-background-color{
        background-color:#E6E6E6 ;
    }
    .card-text-overlay{
        margin-top:0px;
        text-align:center;
        font-size:13px;
    }
    .card-text-overlay h5{
        
        font-size:15px;
    }
    .card-img-casos-de-exito{
        width:100%;
        height:auto;
        overflow: hidden;
        object-fit: cover;
    }
    .card-casos-de-exito{
        padding:5px;
    }
    .card-casos-de-exito .overlay {
        position: absolute;
        top: 5px;
        left: 20px;
        width: -webkit-fill-available;
        height:97%;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        margin-right: 2.5rem;
        overflow: hidden;
    }
    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        opacity: 0.8;
        height: 30%;
        margin-right: 2.5rem;
        width: -webkit-fill-available;
    }
    .card-title-main h5{
        font-size:14px !important;
    }
    .sbn-objetivos-img{
        width:50%;
    }
    .sbn-tips{
        margin-top: 20%;
        margin-left: 15%;
    }
    
    .border-card-text{
        margin:0rem;
    }
    
    .toolbox-border{
        padding:1.2rem;
        background: #70998ae3;
    }
    .sbn-desafio-img{
        width:50%;
        margin:auto;
    }
    .table-width-sbn{
        width:80%;
    }
    .card-casos-de-exito-sbn{
        padding:5px;
        position: relative;
        overflow: hidden;
    }

    .card-casos-de-exito-sbn .overlay {
        position: absolute;
        top: 4px;
        left: 4px;
        right: 4px;
        bottom: 4px;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        overflow:hidden;
    }
    .card-title-main-sbn{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:4px;
        left:5px;
        right:5px;
        opacity: 0.8;
        height: 35%;
        overflow: hidden;
    }
    .card-img-casos-de-exito-sbn{
        width:-webkit-fill-available;
        aspect-ratio: 1 / 1;
        overflow: hidden;
        object-fit: cover;
        display: block;
    }
    .sbn-img-resource{
        display:none;
    }
    .sbn-asistente-display{
        padding-right: 0rem;
        text-align:center;
    }
    .sbn-seleccion-align{
        text-align: center; 
        padding-top: 10px;
        line-height: 1;
    }
}

@media (min-width: 576px) and (max-width: 767){      
    .sbn-logo-navbar {
        position: absolute;
        top: 2rem;
        left: 5rem;
    }
    .laptop-main-page{
        position: relative;
        padding: 2em;
        left: 1px;
        transform: translate(-13%, 2%);
        opacity: 1;
    }  
    .sbn-logo-image-navbar{
        width: 60px;
        margin-top: -5px;
    }
    .sbn-image-navbar{
        display: block;
        position: absolute;
        white-space: nowrap;
        margin: 12px auto 0 -50px;
    }
    .sbn-menu-navbar ul li a{
        padding: 12px 20px;
    }
    .panel-info-and-video{
        height: 43rem;
        background-color: #fff;
        opacity: 0.9;
    }
    .video-container video{
        position: absolute;
        top: 450px;
        left: 23%;
        width:500px;
    }
    .video-container img{
        width:410px;
        display:none;
    }
    .home-exploration-panel{
        margin-top:20px;
        margin-bottom:5rem;
        text-align: center;
        width: 75%;
    }
    .btn-sbn-tools {
        background-color: #BAD405;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    
    .btn-sbn-tools-2 {
        background-color: #0a3f0a;
        color: #BAD405;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
        border-color:#BAD405;
    }
    .btn-sbn-tools-3{
        background-color: #fff;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .btn-sbn-tools-4 {
        background-color: #0a3f0a;
        color: #fff;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .curved-div {
        position: relative;
        padding: 0.1em;
        left: 45%;
        transform: translate(-50%, -70%);
        opacity: 0.99;
        z-index:-1;
    }
    .buton-video-container{
        padding-left:0rem;
         margin-left: -35px;
    }
    .card-text-overlay{
        margin-top:0px;
        text-align:center;
        font-size:1rem;
    }
    .card-text-overlay h5{
        
        font-size:1.25rem;
    }
    .card-img-casos-de-exito{
        width:450px;
        height:450px;
        overflow: hidden;
        object-fit: cover;
    }
    .card-casos-de-exito{
        padding:5px;
    }
    .card-casos-de-exito .overlay {
        position: absolute;
        top: 5px;
        left: 20px;
        width: 450px;
        height:450px;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        opacity: 0.8;
        height: 30%;
        margin-right: 1.3rem;
        width: 450px;
    }
    .card-title-main h5{
        font-size:16px;
    }
    .sbn-objetivos-img{
        width:50%;
    }
    .sbn-tips{
        margin-top: 20%;
        margin-left: 45%;
    }
    .border-card-text{
        margin:2rem;
    }
    .toolbox-border{
        padding:1.2rem;
        background: #70998ae3;
    }
    .sbn-desafio-img{
        width:50%;
        margin:auto;
    }
    .table-width-sbn{
        width:100%;
    }
    .card-casos-de-exito-sbn{
        padding:5px;
        position: relative;
        overflow: hidden;
    }

    .card-casos-de-exito-sbn .overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    .card-title-main-sbn{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:0;
        left:0;
        right:0;
        opacity: 0.8;
        height: 35%;
        overflow: hidden;
    }
    .card-img-casos-de-exito-sbn{
        width:350px;
        height:350px;
        overflow: hidden;
        object-fit: cover;
        display: block;
    }
    .sbn-img-resource{
        display:none;
    }
    .sbn-asistente-display{
        padding-right: 0rem;
        text-align:center;
    }
    .sbn-seleccion-align{
        text-align: center; 
        padding-top: 10px;
    }
}
@media (min-width: 768px) and (max-width: 959px) {  
    .container-carousel-control-2-prev{
        top:10rem !important;
    }

    .container-carousel-control-2-next{
        top:10rem !important;
    }
      
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: 0.2rem !important;
        padding-left: 0.1rem !important;
    }
    .mx-auto-main-bar{
        display: flex;
        align-items: center;
        margin: 0 auto;
    }
    .header-search{
        max-width: 650px !important;
    }
    .sbn-navbar a {
        font-size: 10.4px;
        font-weight: 700;
    }
    .sbn-logo-navbar {
        position: absolute;
        top: 1px;
        left: 3rem;
    }
    .sbn-logo-image-navbar{
        width: 60px;
        margin-top: -2rem;
    }
    .laptop-main-page{
        position: relative;
        padding: 2em;
        left: 11rem;
        transform: translate(-48%, 20%) scale(0.66);
        transform-origin: right top;
        opacity: 0.99;
    }  
    .sbn-image-navbar{
        display: block;
        position: absolute;
        white-space: nowrap;
        margin: 12px auto 0 -50px;
    }
    .sbn-navbar .nav-item {
        padding-left: 1px;
        padding-right: 1px;
    }
    .sbn-menu-navbar ul li a{
        padding: 36px 20px 21px 20px;
    }
    .panel-info-and-video{
        height: 20rem;
        background-color: #fff;
        opacity: 0.9;
    }
    .video-container video{
        position: absolute;
        top: 10px;
        left: 103px;
        width:260px;
        height:200px;
    }
    .video-container img{
        width:410px;
        display:block;
    }
    .panel-info-and-video .video-switch-tabs{
        left:103px;
        width:260px;
    }
    .home-exploration-panel{
        margin-top:20px;
        margin-bottom:5rem;
        text-align: center;
        width: 75%;
    }
    .btn-sbn-tools {
        background-color: #BAD405;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 100px;
        font-family: Roboto,sans-serif !important;
        font-size:11px;
        line-height: 1.1;
        height: 43px;
    }
    
    .btn-sbn-tools-2 {
        background-color: #0a3f0a;
        color: #BAD405;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 85px;
        font-size:11px;
        line-height: 1.1;
        height: 43px;
        border-color:#BAD405;
    }
    .btn-sbn-tools-3{
        background-color: #fff;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .btn-sbn-tools-4 {
        background-color: #0a3f0a;
        color: #fff;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .curved-div {
        position: relative;
        padding: 0.1em;
        left: 45%;
        transform: translate(-50%, -70%);
        opacity: 0.99;
        z-index:-1;
        display: block;
        width:114%;
    }
    .buton-video-container{
        padding-left:0rem;
         margin-left: -35px;
    }
    .min-background-color{
        background-color:#fff ;
    }
    .border-sbn-tools{
        margin-top:20px;
        padding-bottom:3rem;
        border:3px solid !important;
        border-color: #BAD405!important;
        border-top-left-radius: 2rem!important;
        width: 500px;
        position: absolute;
        right: -8rem;
    }
    .card-text-overlay{
        margin-top:0px;
        text-align:center;
        font-size:13px;
    }
    .card-text-overlay h5{
        
        font-size:15px;
    }
    .card-img-casos-de-exito{
        width:195px;
        height:195px;
        overflow: hidden;
        object-fit: cover;
    }
    .card-casos-de-exito{
        padding:5px;
    }
    .card-casos-de-exito .overlay {
        position: absolute;
        top: 5px;
        left: 20px;
        width: 195px;
        height:195px;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        opacity: 0.8;
        height: 30%;
        margin-right: 1.3rem;
        width: 195px;
    }
    .card-title-main h5{
        font-size:13px !important;
    }
    .toolbox-right-panel{
     padding-left: 0px;
     padding-right: 0px;
     color:#0a3f0a;
    }
    .sbn-objetivos-img{
        width:100%;
    }
    .sbn-tips{
        margin-top: 20%;
        margin-left: 65%;
    }
    .border-card-text{
        margin:0rem;
    }
    .toolbox-border{
        padding:1.2rem;
        background: #70998ae3;
    }
    .sbn-desafio-img{
        width:100%;
        margin:auto;
    }
    .table-width-sbn{
        width:80%;
    }
    .card-casos-de-exito-sbn{
        padding:5px;
        position: relative;
        overflow: hidden;
    }

    .card-casos-de-exito-sbn .overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    .card-title-main-sbn{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:0;
        left:0;
        right:0;
        opacity: 0.8;
        height: 35%;
        overflow: hidden;
    }
    .card-img-casos-de-exito-sbn{
        width:170px;
        height:170px;
        overflow: hidden;
        object-fit: cover;
        display: block;
    }
    .sbn-img-resource{
        display:inline;
    }
    .sbn-asistente-display{
        padding-right: 0rem;
        text-align:center;
    }
    .sbn-seleccion-align{
        text-align: center; 
        padding-top: 10px;
    }
    .row-casos-de-exito {
        background-color: #fff;
        padding-top: 15px;
        margin-right: 0;
    }
    .sbn-tittle-style{
        padding-top:15px !important;
    }
    .sbn-content-style{
        padding-right: 5px!important;
        padding-left: 5px !important;
    }
    .sbn-content-margin{
        margin-top:15px;
    }
}
@media (min-width: 960px) and (max-width: 1199px){
    .sbn-navbar .nav-item {
        padding-left: 7px !important;
        padding-right: 7px !important;
    }
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: 0.2rem !important;
        padding-left: 0.1rem !important;
    }
    .mx-auto-main-bar{
        display: flex;
        align-items: center;
        margin: 0 auto;
    }
    .header-search{
        max-width: 800px !important;
    }
    .sbn-navbar a {
        font-size: 11px;
        font-weight: 700;
    }
    .sbn-logo-navbar {
        position: absolute;
        top: 1px;
        left: 4rem;
    }
    .sbn-logo-image-navbar{
        width: 90px;
        margin-top: -3.5rem;
    }
    .laptop-main-page{
        position: relative;
        padding: 2em;
        left: 12rem;
        transform: translate(-48%, 15%) scale(0.9);
        transform-origin: right top;
        opacity: 0.99;
    }  
    .sbn-image-navbar{
        display: block;
        position: absolute;
        white-space: nowrap;
        margin: 12px auto 0 -50px;
    }
    .sbn-menu-navbar ul li a{
        padding: 36px 20px 21px 20px;
    }
    .panel-info-and-video{
        height: 16rem;
        background-color: #fff;
        opacity: 0.9;
    }
    .video-container video{
        position: absolute;
        top: 24px;
        left: 99px;
        width:240px;
        height:165px;
    }
    .video-container img{
        width:380px;
        display:block;
    }
    .panel-info-and-video .video-switch-tabs{
        left:99px;
        width:240px;
    }
    .home-exploration-panel{
        margin-top:20px;
        margin-bottom:1rem;
        text-align: center;
        width: 95%;
    }
    .curved-div {
        position: relative;
        padding: 0.1em;
        left: 45%;
        transform: translate(-50%, -70%);
        opacity: 0.99;
        z-index:-1;
        display: block;
        width:114%;
    }
    .buton-video-container{
        padding-left:0rem;
         margin-left: -35px;
    }
    .min-background-color{
        background-color:#fff ;
    }
    .border-sbn-tools{
        margin-top:20px;
        padding-bottom:3rem;
        border:3px solid !important;
        border-color: #BAD405!important;
        border-top-left-radius: 2rem!important;
        width: 500px;
        position: absolute;
        right: -2rem;
    }
    .card-text-overlay{
        margin-top:0px;
        text-align:center;
        font-size:13px;
    }
    .card-text-overlay h5{
        
        font-size:15px;
    }
    .card-img-casos-de-exito{
        width:275px;
        height:275px;
        overflow: hidden;
        object-fit: cover;
    }
    .card-casos-de-exito{
        padding:5px;
    }
    .card-casos-de-exito .overlay {
        position: absolute;
        top: 5px;
        left: 20px;
        width: 275px;
        height:275px;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        opacity: 0.8;
        height: 30%;
        margin-right: 1.25rem;
        width: 275px;
    }
    .card-title-main h5{
        font-size:14px !important;
    }
    .toolbox-right-panel{
     padding-left: 2.1rem;
     padding-right: 2.1rem;
     color:#0a3f0a;
    }
    .sbn-tips{
        margin-top: 20%;
        margin-left: 65%;
    }
    .border-card-text{
        margin:1rem;
    }
    .toolbox-border{
        padding:1rem 0.1rem 1rem 1rem;
        background: #70998ae3;
    }
    .table-width-sbn{
        width:100%;
    }
    .card-casos-de-exito-sbn{
        padding:5px;
        position: relative;
        overflow: hidden;
    }

    .card-casos-de-exito-sbn .overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    .card-title-main-sbn{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:0;
        left:0;
        right:0;
        opacity: 0.8;
        height: 35%;
        overflow: hidden;
    }
    .card-img-casos-de-exito-sbn{
        width:225px;
        height:225px;
        overflow: hidden;
        object-fit: cover;
        display: block;
    }
    .sbn-img-resource{
        display:inline;
    }
    .sbn-asistente-display{
        padding-right: 0rem;
        text-align:center;
    }
    .sbn-seleccion-align{
        text-align: center; 
        padding-top: 10px;
    }
    .container, .container-md, .container-sm {
        max-width: 960px;
    }
}
@media (min-width: 1200px) and (max-width: 1399px){
    .mx-auto-main-bar{
        display: flex;
        align-items: center;
        margin: 0 auto;
    }
    .sbn-logo-navbar {
        position: absolute;
        top: 1px;
        left: 6rem;
    }
    .sbn-logo-image-navbar{
        width: 90px;
        margin-top: -3.5rem;
    }
    .sbn-image-navbar{
        display: block;
        position: absolute;
        white-space: nowrap;
        margin: 12px auto 0 -50px;
    }
    .sbn-menu-navbar ul li a{
        padding: 36px 20px 21px 20px;
    }
    .laptop-main-page{
        position: relative;
        padding: 2em;
        left: -6rem;
        transform: translate(-1%, 8%) scale(0.82);
        transform-origin: right top;
        opacity: 0.99;
    } 
    .panel-info-and-video{
        height: 18rem;
        background-color: #fff;
        opacity: 0.9;
    }
    .video-container video{
        position: absolute;
        top: 10px;
        left: 130px;
        width:345px;
        height:260px;
    }
    .home-exploration-panel{
        margin-top:20px;
        margin-bottom:5rem;
        text-align: center;
        width: 75%;
    }
    .video-container img{
        width:550px;
        display:block;
    }
    .panel-info-and-video .video-switch-tabs{
        left:130px;
        width:345px;
    }
    .btn-sbn-tools {
        background-color: #BAD405;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    
    .btn-sbn-tools-2 {
        background-color: #0a3f0a;
        color: #BAD405;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
        border-color:#BAD405;
    }
    .btn-sbn-tools-3{
        background-color: #fff;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .btn-sbn-tools-4 {
        background-color: #0a3f0a;
        color: #fff;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .curved-div {
        position: relative;
        padding: 0px;
        left: 0px;
        transform: translate(0px, -70%);
        opacity: 0.99;
        z-index:-1;
        display: block;
        margin-left:-16px;
        margin-right:-14px;
        background: url('/media/assets/img/achurado.svg') ;
    }
    .buton-video-container{
        padding-left:0rem;
         margin-left: -35px;
    }
    .min-background-color{
        background-color:#fff ;
    }
    .card-text-overlay{
        margin-top:0px;
        text-align:center;
        font-size:1rem;
    }
    .card-text-overlay h5{
        color:#fff !important;
        font-size:1.25rem;
    }
    .card-img-casos-de-exito{
        width:340px;
        height:340px;
        overflow: hidden;
        object-fit: cover;
    }

    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        width:340px;
        opacity: 0.8;
        height: 25%;
    }
    .card-casos-de-exito{
        padding:5px;
    }
    .card-casos-de-exito .overlay {
        position: absolute;
        top: 5px;
        left: 20px;
        width: 340px;
        height: 340px;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        width:340px;
        opacity: 0.8;
        height: 25%;
    }
    .card-title-main h5{
        font-size:16px !important;
    }
    .sbn-tips{
        margin-top: 20%;
        margin-left: 75%;
        
    }
    .border-card-text{
        margin:2rem;
    }
    .card-casos-de-exito-sbn{
        padding:5px;
        position: relative;
        overflow: hidden;
    }

    .card-casos-de-exito-sbn .overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    .card-title-main-sbn{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:0;
        left:0;
        right:0;
        opacity: 0.8;
        height: 35%;
        overflow: hidden;
    }
    .card-img-casos-de-exito-sbn{
        width:275px;
        height:275px;
        overflow: hidden;
        object-fit: cover;
        display: block;
    }
    .sbn-img-resource{
        display:inline;
    }
    .show-header-sbn {
        display: flex;
    }
    .sbn-asistente-display{
        padding-right: 2rem;
        text-align:right;
    }
    .sbn-seleccion-align{
        text-align: left; 
        padding-top: 10px;
    }
    .container-caja-herramientas{
        margin-left:3rem;   
        margin-right:3rem;
        color: #0a3f0a;
    }
}
@media (min-width: 1400px) {
    .mx-auto-main-bar{
        display: flex;
        align-items: center;
        margin: 0 auto;
    }
    .sbn-logo-navbar {
        position: absolute;
        top: 1px;
        left: 8rem;
    }
    .sbn-logo-image-navbar{
        width: 90px;
        margin-top: -3.5rem;
    }
    .sbn-image-navbar{
        display: block;
        position: absolute;
        white-space: nowrap;
        margin: 12px auto 0 -50px;
    }
    .sbn-menu-navbar ul li a{
        padding: 36px 20px 21px 20px;
    }
    .laptop-main-page{
        position: relative;        
        left: -6rem;
        transform: translate(-1%, 8%) scale(0.82);
        transform-origin: right top;
        opacity: 0.99;
        padding-top: 3rem;
        padding-left: 2rem;
    }
    .panel-info-and-video{
        height: 20rem;
        background-color: #fff;
        opacity: 0.9;
    }
    .video-container video{
        position: absolute;
        top: 47px;
        left: 130px;
        width: 345px;
        height: 232px;
    }
    .home-exploration-panel{
        margin-top:20px;
        margin-bottom:5rem;
        text-align: center;
        width: 75%;
    }
    .video-container img{
        width:550px;
        display:block;
    }
    .panel-info-and-video .video-switch-tabs{
        left:130px;
        width:345px;
    }
    .btn-sbn-tools {
        background-color: #0a3f0a;
        color: #BAD405;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 120px;
        font-family: Roboto,sans-serif !important;
        font-size:13px;
        line-height: 1.1;
        height: 40px;
        border-color: #BAD405;
    }

    .btn-sbn-tools:hover {
        color: #fff;
    }
    
    .btn-sbn-tools-2 {
        background-color: #0a3f0a;
        color: #BAD405;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 120px;
        font-size:13px;
        line-height: 1.1;
        height: 40px;
        border-color:#BAD405;
    }
    .btn-sbn-tools-3{
        background-color: #fff;
        color: #1a3f32;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-family: Roboto,sans-serif !important;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .btn-sbn-tools-4 {
        background-color: #0a3f0a;
        color: #fff;
        border-radius: 8px 0 8px 0;
        font-weight: 600;
        width: 115px;
        font-size:12px;
        line-height: 1.1;
        height: 40px;
    }
    .curved-div {
        position: relative;
        padding: 0.1em;
        left: -19px;
        transform: translate(1%, -86%);
        opacity: 0.99;
        z-index:-1;
        /*width: 101%;*/
        display: block;
        margin-left:-16px;
        margin-right:-14px;
        background: url('/media/assets/img/achurado.svg') ;
    }
    .buton-video-container{
        padding-left:0rem;
         margin-left: -35px;
    }
    .min-background-color{
        background-color:#fff ;
    }
    .sbn-tips{
        margin-top: 20%;
        margin-left: 80%;
        
    }
    .card-img-casos-de-exito{
        width:340px;
        height:340px;
        overflow: hidden;
        object-fit: cover;
    }
    .card-casos-de-exito{
        padding:5px;
    }
    .card-casos-de-exito .overlay {
        position: absolute;
        top: 5px;
        left: 20px;
        width: 340px;
        height: 340px;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    .sbn-img-resource{
        display:inline;
    }
    .card-title-main{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:5px;
        left:20px;
        width:340px;
        opacity: 0.8;
        height: 25%;
    }
    .show-header-sbn {
        display: flex;
    }
    .sbn-asistente-display{
        padding-right: 2rem;
        text-align:right;
    }
    .sbn-seleccion-align{
        text-align: left; 
        padding-top: 10px;
    }
    .container-caja-herramientas{
        margin-left:3rem;
        margin-right:3rem;
        color: #0a3f0a;
    }
    .card-casos-de-exito-sbn{
        padding:5px;
        position: relative;
        overflow: hidden;
    }

    .card-casos-de-exito-sbn .overlay {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #b8cf00;
        opacity: 0;
        z-index:99;
        transition: opacity 250ms ease-in-out;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    .card-title-main-sbn{
        position:absolute;
        background-color : #0a3f0a;
        color: #fff !important;
        bottom:0;
        left:5px;
        right:0;
        opacity: 0.8;
        height: 35%;
        overflow: hidden;
    }
    .card-img-casos-de-exito-sbn{
        width:300px;
        height:300px;
        overflow: hidden;
        object-fit: cover;
        display: block;
    }
}

.recurso-titulo, .recurso-titulo a{
    color: #0a3f0a;
    font-size: 1.2rem;
    font-weight: 500;
}

.recurso-descripcion p{
    color: #333;
    font-size: 0.95rem;
    font-weight: 500; 
    margin-bottom: 0;
    line-height: 1.2;
}

.recurso-mas-info{
    color: #333;
    font-size: 1rem;
    font-weight: 500; 
    line-height: 1.2;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.swal2-title {
    position: relative;
    max-width: 100%;
    margin: 0;
    padding: 0.8em 1em 0;
    color: inherit;
    font-size: 0.875em !important;
    font-weight: 600;
    text-align: center;
    text-transform: none;
    word-wrap: break-word;
}

.swal2-html-container {
    z-index: 1;
    justify-content: center;
    margin: 1em 1.6em 0.3em;
    padding: 0;
    overflow: auto;
    color: inherit;
    font-size: 0.8em !important;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    word-wrap: break-word;
    word-break: break-word;
}

.swal2-confirm{
    background:#0a3f0a !important;
    color:#fff;
    font-size: 0.875em !important;
    font-weight: 600;
}

.swal2-deny{
    background:#0a3f0a !important;
    color:#fff;
    font-size: 0.875em !important;
    font-weight: 600;
}

.sbn-text-container{
    margin:2rem;
}

.sbn-text-container2{
    margin:1rem;
}

.sbn-color-box{
    background:#BAD405; 
    color:#1a3f32; 
    font-weight:bold;
    margin-top:1rem;
    margin-bottom:1rem;
    font-size:22px;
    border-radius:10px;
}

.sbn-color-box p{
    font-family: sans-serif !important;
}

.sbn-color-box2{
    background:#B5B0AD; 
    color:#1a3f32; 
    font-weight:bold;
    margin-top:1rem;
    margin-bottom:1rem;
    font-size:22px;
    border-radius:10px;
}

.sbn-color-box2 p{
    font-family: sans-serif !important;
}

.sbn-color-box3{
    background:#fff; 
    color:#0a3f0a; 
    margin-top:1rem;
    margin-bottom:1rem;
    font-size:22px;
    border-radius:10px;
    border: solid;
    border-color: #8080805e;
    border-width: 2px;
}

.sbn-color-box3 p{
    font-family: sans-serif !important;
    
}

.sbn-text-box-grey{
    border-radius: 10px;
    border: solid;
    border-color: #B5B0AD;
    margin-bottom:1rem;
    border-width: 1px;
    padding: 1rem;
}

.sbn-text-box-grey-2{
    border-radius: 10px;
    border: solid;
    border-color: #B5B0AD;
    margin-bottom:1rem;
    border-width: 1px;
    padding: 1rem;
    height:400px;
}

.btn-sbn-tools-width{
    width:160px !important;
    text-align:center;
}
.sbn-separador{
    border-top: solid 2px;
    color: #B5B0AD; 
    margin-top: 1rem; 
    margin-bottom: 1.2rem;
}

.menu-vertical-tab{
    /*background: #a8cbb6bf;*/
    font-weight: 600;
    color: #0a3f0a !important;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 10px;
}

.nav-pills .nav-link, .nav-pills .show>.nav-link {
    color: #0a3f0a;
    background-color: #a8cbb614;
    
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #0a3f0a;
    background-color: #fff;
    border-top-left-radius: 1rem !important;
    border-bottom-left-radius: 1rem !important;
    border-top-right-radius: 0.1rem !important;
    border-bottom-right-radius: 0.1rem !important;
}


.vline-right-panel{
    border-left: solid 2px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    border-left-color: #e6e6e6;
}


.calification-right-panel{
    margin-top:2rem;
}

.calification-check{
    font-size:0.9rem;
    color:#333;
    margin-top:.85rem;
}

.calification-check p{
    margin-top:.75rem;
}

.section-toolbox-2{
    width: 100%;
    background: url('/media/uakiabre/8d00a82c3da843dc7dd74161c03266c9_original.jpg') #00ff0055;
    background-size: cover;
}
.parallax{
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.btn-sbn-white{
    border-radius: 0.75rem;
    width: 175px;
    color: #0a3f0a;
    line-height: 1.1;
    font-weight: 600;
    background: #fff;
    border-color: #fff;
}

.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}

.sdg img {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16) , 0 2px 10px 0 rgba(0,0,0,.12);
    transition: all .3s ease-out;
    margin: .625rem 0;
    height: auto;
}

.sdg img:hover {
    box-shadow: 0 5px 11px 0 rgba(0,0,0,.5) , 0 4px 15px 0 rgba(0,0,0,.5)
}

.sdg .has-tip {
    border: 0;
    cursor: pointer;
}

.sdg .img-gray {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    opacity: 0.25;
}

@media print, screen and (min-width: 40em) {
    .sdg img {
        margin: .9375rem 0;
    }
}

.sbn-filters{
    height:100px;       
    overflow: auto;
}

.sbn-filters-hg {
    height: 255px;
    overflow: auto;
    font-size: small;
}

.sbn-hide{
    display:none;
}

.container-desafios{
    background: url('/media/assets/img/achurado.svg') #00ff0055;
}


.hide-header-sbn{
    display:none;
}

.sbn-resource-hide{
    display:none;
}

.sbn-item{
    padding-bottom:0px;
}

.sbn-bibliografia{
    padding-bottom:10px;
}

.header-search{
    margin-top: -25px;
    margin-left: 10px;
    max-width: 1000px;
    display:none;
}

.bi-search{
    cursor:pointer;
}

.sbn-clear-filter{
    padding-left: 5px;
    cursor: pointer;
    color: #0a3f0a;
    transition: color 0.15s ease-in-out, transform 0.15s ease-in-out;
    display: inline-block;
}

.sbn-clear-filter:hover,
.sbn-clear-filter:focus{
    color: #438711;
    transform: scale(1.15);
}

/* Indicador de progreso del Asistente de selección SbN */
.sbn-loading{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.75rem 0;
    color: #0a3f0a;
    font-weight: 600;
    font-size: 1.05rem;
}
.sbn-loading .spinner-border{
    color: #BAD405;
    width: 1.9rem;
    height: 1.9rem;
    border-width: 0.22em;
}

.img-colaboradores{
    object-fit: contain;
}

.row-form-input {
    margin-right: 0px;
    margin-left: 0px;
}

.sw-theme-dots>.tab-content>.tab-pane {
    padding: 8px !important;
}

/* === Franja Bioeconomía === */
.franja-bioeconomia {
    display: flex;
    height: 600px;
    overflow: hidden;
    margin-top: 2.5rem;
}

.franja-bio-texto {
    width: 40%;
    background-color: #003b00;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem 3.5rem;
}

.franja-bio-texto h2{
    color: #fff !important;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.franja-bio-texto .fbt-p-1{
    color:#fff !important; 
    font-size:1.75rem; 
    font-weight:500; 
    margin-bottom:1.5rem; 
    line-height:1.4; 
    width: 80%;   
}

.franja-bio-texto .fbt-p-2{
    color:#fff; 
    font-size:1.25rem; 
    line-height:1.6; 
    margin-bottom:2rem;
}

.franja-bio-imagenes {
    width: 60%;
    display: flex;
    flex-direction: row;
    overflow: hidden;
}

.franja-bio-img-item {
    flex: 1;
    overflow: hidden;
}

.franja-bio-img-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 820px) {
    .franja-bioeconomia {
        flex-direction: column;
        height: auto;
    }
    
    .franja-bio-texto {
        width: 100%;
        padding: 2rem 1.5rem;
    }

    .franja-bio-texto h2{    
        font-size: 1.75rem;
    }
    .franja-bio-texto .fbt-p-1{
        font-size:1.25rem;         
    }

    .franja-bio-texto .fbt-p-2{
        font-size:1.1rem;         
    }

    .franja-bio-imagenes {
        width: 100%;
        height: 220px;
    }
}

@media (max-width: 480px) {
    .franja-bio-texto h2{    
        font-size: 1.5rem;
    }
    .franja-bio-texto .fbt-p-1{
        font-size:1.25rem;         
    }

    .franja-bio-texto .fbt-p-2{
        font-size:1.1rem;         
    }

    .franja-bio-imagenes {
        height: 150px;
    }
}

/* === VISTA SBN DETALLE - Estilos extraídos de Sbn.cshtml === */

/* Tablas de recursos */
.sbn-table-header-row {
    background-color: #d6d8db99;
    color: #0a3f0a;
    text-align: center;
}

.sbn-table-th {
    vertical-align: middle;
}

.sbn-table-overflow {
    overflow-x: auto;
}

.sbn-table-sm {
    font-size: 0.8rem;
}

/* Accordions: card-header y card-body dentro del toolbox */
.toolbox-border .accordion .card-header {
    padding: unset !important;
}

.card-body.normal-text-sbn,
.card-body.normal-text-sbn-2 {
    padding-top: 0;
}

.sbn-accordion-btn {
    box-shadow: 0 0 0 0 !important;
}

.sbn-paso-nombre {
    font-size: 17px;
    color: #000;
    text-decoration: none;
}

.sbn-paso-nombre:hover {
    font-size: 18px;
    color: #000;
    text-decoration: none;
}

.sbn-btn-ver-mas {
    float: right;
    margin-top: 0.5rem;
    padding-top: 12px;
}

.sbn-desc-mb {
    margin-bottom: 1rem;
}

/* Modales de tips */
.sbn-modal-header {
    background-color: #bad405;
}

.sbn-tip-title {
    font-size: 17px;
}

.sbn-tip-content {
    color: #0a3f0a;
    font-size: 15px;
}

.sbn-tip-link {
    color: #0a3f0a;
    margin-bottom: 1rem;
    display: inline-block;
}

/* Nombre de recurso en tablas */
.sbn-resource-name-text {
    color: #0a3f0a;
    font-weight: normal;
}

/* Sección lineamientos */
.sbn-lineamiento-icon-col {
    display: grid;
    align-content: center;
}

.sbn-lineamiento-title-col {
    font-size: 18px;
    text-align: center;
    display: flex;
    align-items: center;
}

.sbn-lineamiento-title-link {
    color: #0a3f0a !important;
    padding-left: 1rem;
}

.sbn-lineamiento-desc-col {
    font-size: 13px;
    padding-top: 0.75rem;
    padding-left: 1rem;
}

/* Sección diseños, planos e indicadores */
.sbn-resource-title-col {
    color: #0a3f0a;
    font-weight: normal;
}

.sbn-resource-title {
    font-size: 18px;
}

.sbn-resource-desc {
    font-size: 15px;
    font-weight: normal;
}

.sbn-download-col {
    display: flex;
    align-items: center;
}

.sbn-btn-download-right {
    float: right;
    padding-top: 12px;
}

/* Sección modelos */
.sbn-model-row {
    justify-content: center;
    display: flex;
    padding-bottom: 1rem;
}

.sbn-model-box-pt {
    padding-top: 1rem;
}

.sbn-model-title {
    font-size: 18px;
    text-align: center;
}

/* Sección personal de apoyo */
.sbn-personal-card-text {
    font-size: 14px;
}

.sbn-personal-row {
    justify-content: center;
}

/* Sección plantilla */
.sbn-plantilla-link {
    color: #0a3f0a !important;
    text-decoration: none;
}

/* Plantilla Excel destacada en tabla de recursos */
.sbn-resource-plantilla-row {
    background-color: #fff8e1;
    border-left: 4px solid #f9a825;
}
.sbn-resource-plantilla-row th,
.sbn-resource-plantilla-row td {
    border-top: 1px solid #f9a825 !important;
    border-bottom: 1px solid #f9a825 !important;
}
.sbn-badge-plantilla {
    display: inline-block;
    background-color: #f9a825;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 10px;
    margin-left: 6px;
    vertical-align: middle;
    white-space: nowrap;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* Utilidades flex */
.sbn-flex-center {
    justify-content: center;
    display: flex;
    align-items: center;
}

/* Modal video */
.sbn-video-modal-dialog {
    height: 100%;
}

.sbn-video-modal-content {
    height: 50%;
}

/* Sección glosario */
.sbn-glosario-title {
    font-size: 18px;
}

/* Sección acuerdos de trabajo */
.sbn-acuerdos-link {
    text-align: center;
    margin-bottom: 2rem;
}

/* Sección casos de éxito */
.sbn-casos-section {
    width: 100%;
    padding-bottom: 2rem;
}

/* Separador indicadores */
.sbn-indicador-separador {
    border-width: 1px;
}

/* Valores en tarjetas de desafío/área/problema */
.sbn-card-value {
    font-size: 15px;
    line-height: 1.5;
    font-weight: 500;
}

/* === Wrapper carrusel casos de éxito === */
.wrapper-carousel-casos {
    position: relative;
    padding: 0 3rem 2rem;
}

@media (max-width: 820px) {
    .wrapper-carousel-casos {
        padding: 0 2rem 2rem;
    }
}

@media (max-width: 576px) {
    .wrapper-carousel-casos {
        padding: 0 1.5rem 1.5rem;
    }
}

#btn-search{
    background-color: #003b00;
    border-color: #008E65;
}

/* ============================================================
   MICROINTERACCIONES / HOVER  (home)
   Solo CSS. Respetan prefers-reduced-motion (al final del bloque).
   ============================================================ */

/* --- Tarjetas de desafíos socioambientales --- */
.card-text-desafios {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    will-change: transform;
    overflow: hidden;
}
.card-text-desafios .card-img-top {
    transition: transform 0.35s ease;
}
/* El enlace envuelve la tarjeta: activamos el hover desde el <a> */
a:hover > .card-text-desafios,
.card-text-desafios:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 28px rgba(10, 63, 10, 0.18);
    transition-delay: 0.5s;
}
a:hover > .card-text-desafios .card-img-top,
.card-text-desafios:hover .card-img-top {
    transform: scale(1.07);
    transition-delay: 0.5s;
}
a:focus-visible > .card-text-desafios {
    outline: 3px solid #BAD405;
    outline-offset: 3px;
}

/* --- Franja Bioeconomía: zoom leve --- */
.franja-bio-img-item img {
    transition: transform 0.5s ease, filter 0.4s ease;
}
/* La imagen bajo el cursor hace un zoom sutil, sin mover a las vecinas */
.franja-bio-img-item:hover img {
    transform: scale(1.04);
    filter: brightness(1.05);
}

/* --- Botones: transición y estado de foco uniformes --- */
.btn-carousel,
.btn-read-more,
.btn-sbn-tools,
.btn-sbn-tools-2 {
    transition: background-color 0.2s ease, color 0.2s ease,
                box-shadow 0.2s ease, transform 0.2s ease;
}
.btn-carousel:hover,
.btn-read-more:hover {
    filter: brightness(0.92);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
}
.btn-carousel:focus-visible,
.btn-read-more:focus-visible,
.btn-sbn-tools:focus-visible,
.btn-sbn-tools-2:focus-visible {
    outline: 3px solid #BAD405;
    outline-offset: 2px;
}

/* --- Accesibilidad: desactiva animaciones si el usuario lo pide --- */
@media (prefers-reduced-motion: reduce) {
    .card-text-desafios,
    .card-text-desafios .card-img-top,
    .franja-bio-img-item,
    .franja-bio-img-item img,
    .btn-carousel,
    .btn-read-more,
    .btn-sbn-tools,
    .btn-sbn-tools-2 {
        transition: none !important;
    }
    a:hover > .card-text-desafios,
    .card-text-desafios:hover,
    .franja-bio-imagenes:hover .franja-bio-img-item,
    .franja-bio-imagenes .franja-bio-img-item:hover,
    .card-text-desafios:hover .card-img-top,
    .franja-bio-img-item:hover img,
    .btn-carousel:hover,
    .btn-read-more:hover {
        transform: none !important;
    }
}



/* Botones "Anterior/Siguiente" del smartWizard (tema dots): la librería los define
   con texto blanco sobre fondo lima (#BAD405), lo que da mal contraste. Se fuerza
   el texto a #1a3f32. Va con !important porque smart_wizard_all.min.css se carga
   después de sbn.css en master.cshtml (misma especificidad, el vendor ganaría). */
.sw-theme-dots .toolbar > .btn {
    color: #1a3f32 !important;
}