@media (max-width:3000px){
    .desktop{
        display: flex;
        cursor: url(imágenes/Cursores/pointer-small.webp), auto;
    }

    
    .container {
        width: 100% !important;
        margin: 0 0px;
    }
    
    .banner{
        display: flex;
        position: relative;
        height:500px;
        align-content: center;
        align-items: center;
        justify-content: center;
        top:0%;
        width: 100%;
        overflow: hidden;
    }
    .banner .banner_text{
        display: flex;
        flex-direction: column;
        margin-top: 8%;
        margin-left: 5px;
        position:absolute;
        width: 100%;
        background: linear-gradient(
        #000000be,
        #00000031,
        #000000be);
        padding: 40px;
        padding-top: 10px;
        padding-bottom: 20px;
        align-content: center;
        justify-content: center;
        align-items: flex-start;
        overflow: hidden;
    }
    .banner .banner_text .banner_text1{
        display: flex;
        width: fit-content;
        height: fit-content;
        overflow: hidden;
    }
    .banner .banner_text h1{
        margin-left: 60px;
        font-size: 54px;
        color: #fff;
        margin-bottom: 0PX;
        font-weight: bolder;
        letter-spacing: 5px;
    }
    .banner .banner_text h3{
        margin-left: 60px;
        margin-top:20px;
        color: #fff;
        font-size: 18PX;
        font-weight: normal;
    }
    .banner img{
        width: 100%;
        height:100%;
        filter:brightness(0.25) saturate(100%);
    }
    .banner_buttons{
        display: flex;
        position: absolute;
        bottom: 0vh;
        width: 100%;
        background-color: #0270b1;
        justify-content: center;
        margin: none;
    }
    .banner_buttons a{
        background-color: #0270b1;
        color: #fff;
        text-decoration: none;
        padding: 10px;
        padding-left: 10px;
        padding-right: 10px;
        font-size: 20px;
        transition: 1s ease;
    }
    .banner_buttons a:hover{
        background-color: #fff;
        color: #000;
    }
    .banner_buttons2{
        display: flex;
        position: absolute;
        bottom: 6vh !important;
        width: 90%;
        background-color: #003366;
        justify-content: center;
    }
    .banner_buttons2 a{
        background-color: #003366;
        color: #fff;
        text-decoration: none;
        padding: 10px;
        padding-left: 10px;
        padding-right: 10px;
        font-size: 20px;
        transition: 1s ease;
    }
    .banner_buttons2 a:hover{
        background-color: grey;
        color: #fff;
    }
    
    
    .main {
        display: flex;
        padding: 20px;
    }
    .sidebar {
        width: 300px;
        margin-right: 15px;
        margin-left: 2px;
    }
    .content {
        flex: 1;
    }
    
    .media{
        display: flex;
        position: relative;
        justify-content: center;
        align-items: center;
        align-content: center;
        width: 100%;
        height: 400px;
        margin:none;
    }
    
    #fondo{
        transition: 1.5s ease;
        width: 100%;
        height: 100%;
        margin:none;
    }
    
    .media .b1{
        display: flex;
        position:   relative;
        align-items: center;
        font-weight: bolder;
        font-size: 30px;
        color: #fff;
        background-color: #156eeb;
        opacity: 12%;
        cursor: url(imágenes/Cursores/link.webp), auto;
        transition: 0.5s ease;
        border:none;
        left:6.2%;
    }
    
    .media .b1:hover{
        opacity: 100%;
        background-color: #156eeb8c;
    }
    
    .media .b2{
        display: flex;
        position:   relative;
        align-items: center;
        font-weight: bolder;
        font-size: 30px;
        color: #fff;
        background-color: #156eeb;
        opacity: 12%;
        cursor: url(imágenes/Cursores/link.webp), auto;
        transition: 0.5s ease;
        border:none;
        right:6.2%;
    }
    
    .media .b2:hover{
        opacity: 100%;
        background-color: #156eeb8c;
    }
    
    
    .card {
        background-color: white;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        margin: 20px;
        padding: 20px;
        border-radius: 10px;
        margin-right: 80px;
        margin-left: 80px;
    }
    .card h3 {
        color: #003366;
        margin-bottom: 10px;
        font-size: 18px;
    }
    .card p {
        color: #333333;
        line-height: 1.5;
        font-size: 16px;
    }
    .card a {
        color: #003366;
        text-decoration: none;
    }
    .card a:hover {
        text-decoration: underline;
    }
    
    .card-content{
        background-color: #f0f0f0;
        cursor: url(imágenes/Cursores/link.webp), auto;
        transition: .5s ease;
        margin:none;
        position: relative;
        display: flex;
        margin-bottom: 2px;
    }
    
    
    .card-content img{
        display: inline;
        flex-direction: row;
    }
    
    .card-content h4{
        margin-top: 0px;
        margin-bottom: 2px;
    }
    
    .card-content p{
        margin-top: 2px;
        margin-bottom: 0px;
    }
    
    .card-content:hover{
        background-color: #ccc;
    }
    
    
    
    .card-item{
        background-color: #f0f0f0;
        cursor: url(imágenes/Cursores/link.webp), auto;
        transition: 1s ease;
        display: inline-flex;
        flex-direction: column;
        text-align: center;
        border: none;
        border-radius: 10px;
        overflow: hidden;
        margin-bottom: 5px;
    }
    
    .card-item h3{
        margin-bottom: 2px;
    }
    
    .card-item p{
        margin-top: 2px;
    }
    
    .card-item:hover{
        background-color: #ccc;
        outline: 2px solid #c3c3c3;
    }

    /* Contenido de Novedades */
    
    .nov{
        display: inline-flex;
        flex-direction: row;
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 400px;
        outline: 1px solid #ccc;
        border-radius: 15px;
    }

    .nov .nov_dis{
        display: inline-flex;
        flex-direction: column;
        position: relative;
        overflow-y: scroll !important;
        overflow-x: hidden;
        width: 100%;
        background-color: #cccccc36;
    }

    .nov .nov_dis::-webkit-scrollbar{
        width: 15px;
        background-color: #cccccc36;
        border-radius: 2px;
    }

    .nov .nov_dis::-webkit-scrollbar-track{
        background-image: linear-gradient(to top, #d5d4d0 0%, #d5d4d0 1%, #eeeeec 31%, #efeeec 75%, #e9e9e7 100%);
        border-radius: 3em;
    }

    .nov .nov_dis::-webkit-scrollbar-thumb{
        background: linear-gradient(
        #8fbdff,   
        #156eeb,
        #156EEB,
        #003366
        );
        border-radius: 25px;
    }

    .nov .nov_dis .nov_div{
       display: inline;
       position: relative;
       margin-top: 20px;
       margin-bottom: 20px;
       margin-left: 20px;
       transition: .5s ease;
    }

    .nov .nov_dis .nov_div h2{
        text-align: center;
        font-size: 42px;
        margin: 0px;
        margin-bottom: 5px;
        font-weight: bold;
        color: #fff;
        background:linear-gradient(
            90deg,
            #003366,
            #156EEB,
            #156eeb,
            #156EEB,
            #003366);
        border-radius: 25px;
        letter-spacing: 5px;
        margin-right: 20px;
        font-size: 52px;
    }
    
    .contenido{
        display: flex;
        flex-direction: row;
    }

    .index{
        display: flex;
        flex-direction: column;
        margin: 10px;
        margin-top: 20px;
        margin-right: 0px;
        width: 400px;
        border-radius: 10px;
        background-color: #ffffff;
        align-items: center;
        height: fit-content;
    }

    .index a{
        font-size: 16px;
        margin-bottom: 10px;
        text-decoration: none;
        font-weight: bold;
        font-size: 18px;
        color: #003366;
        width: 90%;
        border-radius: 5px;
        text-align: center;
        transition: .5s ease;
    }

    .index a:hover{
        background-color: #003366;
        color: #ffffff;
    }

    .index h2{
        margin-bottom: 10px;
    }

    .expandable_item{
        display: flex;
        flex-direction: column;
        position: relative;
        justify-content: center;
        align-items: center;
        align-content: center;
        transition: .5s ease;
        margin: 10px;
    }

    .expandable_item h2{
        margin-bottom: 2px;
    }

    .expandable-btn{
        display: flex;
        background: #bee0ff;
        padding:15px;
        border-radius: 5px;
        text-align: center;
        justify-content: center;
        color: #003366;
        font-weight: BOLD;
        align-items: center;
        align-content: center;
        height: fit-content;
        cursor: url(imágenes/Cursores/link.webp), auto;
        max-width:800px ;
        width: 100%;
        transition: .5s ease ;
        overflow: hidden;
        border: #156eeb00 2px solid;
    }

    .expandable-btn:hover, .exp-btn-content:hover{
        border: #156EEB 2px solid;
    }

    .expandable-btn i{
        margin-left: 5px;
        color: slateblue;
        font-weight: bold;
        font-size: 18px;
    }

    .exp-btn-content{
        display: flex;
        flex-direction: column;
        background-color: #cccccc36 !important;
        justify-content: center;
        align-items: center;
        align-content: center;
        margin: 5px;
        border-radius: 5px;
        overflow: hidden;
        transition: 0.5s;
        height: 0px;
        width: 0%;
        max-width: 900px;
        border: #156eeb00 2px solid;
        animation:jello-horizontal .9s linear both;
        @keyframes jello-horizontal{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}100%{transform:scale3d(1,1,1)}};
    }

    .exp-btn-content p {
        margin-left: 15px;
    }

    .exp-btn-content img{
        aspect-ratio: 16/9;
        height: 300px;
        width: 500px;
        border-radius: 25px;
        box-shadow: 0px 2px 5px 3px  #888;
        margin: 10px;
    }

    .img-conceptuales{
        display: inline-flex;
        position: relative;
        background: linear-gradient(#444,#666,#444);
        border-radius: 25px;
        padding: 5px;
        box-shadow: 3px 3px 3px 3px #ddd;
        img{
            cursor: pointer;
            transition: .5s ease;
            width: 150px; height: 150px; padding:10px;
            background: radial-gradient(#ccc,#999);
            box-shadow: 3px 3px 3px #111;
            transition: .5s ease;
        }
    }
    .img-conceptuales img:hover{
        box-shadow: 5px 5px 5px #777 !important;
        background: radial-gradient(#eee,#ccc);
        transform:scale(1.05);
    }

    .exp-btn-content a{
        text-decoration: none !important;
        margin-top: 20px;
        font-weight: bold;
        font-size: 24px;
        color: #fff;
        transition: 1s ease;
        background: linear-gradient(#003366,#156EEB,#156EEB, #156EEB);
        padding: 10px;
        border-radius: 25px;
        transition: .5s ease !important;
        width: 50%;
        text-align: center;
        box-shadow: 4px 4px 4px #ccc;
    }

    .exp-btn-content a:hover{
        margin-top: 20px;
        font-weight: bold;
        font-size: 24px;
        text-decoration: underline;
        color: #ddd;
        box-shadow: 5px 5px 5px #999;
        transform:scale(1.05);
    }


    .card_itemv2{
        display: inline-flex;
        position: relative;
        cursor: url(imágenes/Cursores/link.webp), auto;
        overflow: hidden !important;
        transition: 1.5s ease;
        margin-bottom: 5px;
        margin-right: 5px;
        border-radius: 5px;
        width: 100%;
        height: 100%;
        max-width: 255px;
        max-height: 155px;
        outline: 2px solid #ffffff00;
    }

    
    .card_itemv2 video{
        display: none;
    }
    
    .card_itemv2 span{
        display: none;
    }

    .card_itemv2 img{
        aspect-ratio: 16/9;
        transition: 1.5s ease;
        filter:blur(0.2px);
        filter:blur(1.2px) brightness(0.3);
        border-radius: 5px;
        width: 110%;
        height: 100% ;
    }
    
    
    .card_itemv2:hover{
        img{
            transform: scale(1.1);
            filter:blur(0px) brightness(1);
            border-radius: 5px;
        }
        padding: none;
        outline: 2px solid #156eeb;
    }
    
    .card_itemv2 .nuevo{
        display: flex;
        position:absolute;
        top:-5%;
        left:2%;
        color:#fff;
        background-color: #156eeb;
        z-index: 1;
        border-radius: 5px;
        padding-left: 3px;
        padding-right: 3px;
        font-size: 18px;
    }
    
    .card_itemv2 h4{
        bottom:5%;
        display: flex;
        position: absolute;
        left:4%;
        color: #fff;
        z-index: 1 !important;
        font-size: 20px;
    }
    
    .card_itemv2 p{
        bottom:-1%;
        display: flex;
        position: absolute;
        left:4%;
        color: #fff;
        z-index: 1 !important;
        font-size: 14px;
    }
    
    
    
    .info img:hover{
        cursor: url(imágenes/Cursores/link.webp), auto;
    }
    
    .footer {
      background-color:#156EEB;
        /* background: linear-gradient(
            #152BEB,
            #156EEB,
            #0B3775);
        /* background-color: #003366;*/
        color: white;
        text-align: center;
        width: 100%;
        padding-bottom: 10px;
        padding-top: 5px;
    }
    
    .contacts{
        display: inline-flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        align-content: center;
        flex: 1;
        position: relative;
        width:250px;
        color: white;
        margin-left:20px;
    }

    .contacts p{
        margin-bottom: 0px;
        margin-top: 0px;
    }

    .contacts .contacts_items{
        display: inline-flex;
        flex-direction: row;
        position: relative;
        justify-content: flex-start;
        align-items: flex-start;
        align-content: flex-start;
    }

    .contacts .icon{
        width: fit-content;
    }

    
    .contacts a{
        text-decoration: none;
        color: white;
    }
    
    
    .carrousel{
        display: flex;
        flex-direction: column;
        overflow: hidden;
        width: 100%;
        min-width: 100px;
    }

    .display_text{
        display: flex;
        flex-direction: column;
        width: 100%;
        position: absolute;
        bottom: 6%;
        left:0%;
        background-color: #292929bd;
        height:70px;
    }

    .display_text h1{
        color: #fff;
        width: 100%;
        margin:0px;
        margin-left: 30px;
    }

    .display_text p{
        color: #fff;
        font-size: 24px;
        margin:0px;
        margin-top: -10px;
        margin-left: 30px;
    }


    .display_text1{
        display: flex;
        flex-direction: column;
        width: 100%;
        position: absolute;
        bottom: 6%;
        left:100%;
        background-color: #292929bd;
        height:70px;
    }

    .display_text1 h1{
        color: #fff;
        width: 100%;
        margin:0px;
        margin-left: 30px;
    }

    .display_text1 p{
        color: #fff;
        font-size: 24px;
        margin:0px;
        margin-top: -10px;
        margin-left: 30px;
    }
    

    .display_text2{
        display: flex;
        flex-direction: column;
        width: 100%;
        position: absolute;
        bottom: 6%;
        left:200%;
        background-color: #292929bd;
        height:70px;
    }

    .display_text2 h1{
        color: #fff;
        width: 100%;
        margin:0px;
        margin-left: 30px;
    }

    .display_text2 p{
        color: #fff;
        font-size: 24px;
        margin:0px;
        margin-top: -10px;
        margin-left: 30px;
    }

    .display_text3{
        display: flex;
        flex-direction: column;
        width: 100%;
        position: absolute;
        bottom: 6%;
        left:300%;
        background-color: #292929bd;
        height:70px;
    }

    .display_text3 h1{
        color: #fff;
        width: 100%;
        margin:0px;
        margin-left: 30px;
    }

    .display_text3 p{
        color: #fff;
        font-size: 24px;
        margin:0px;
        margin-top: -10px;
        margin-left: 30px;
    }


    .carrousel_nextandprev{
        display: flex;
        position:relative;
        z-index: 1 ;
    }

    .next_button{
        display: flex;
        position: absolute;
        color: #fff;
        font-weight: bold;
        font-size: 28px;
        background-color: #29292985;
        border:none;
        padding-top: 30px;
        padding-bottom: 30px;
        right:0%;
        margin-top: 20%;
        transition: .5s ease;
        cursor: url(imágenes/Cursores/link.webp), auto;
        border-radius: 5px;
    }

    .prev_button{
        display: flex;
        position: absolute;
        color: #fff;
        font-weight: bold;
        font-size: 28px;
        background-color: #29292985;
        border:none;
        padding-top: 30px;
        padding-bottom: 30px;
        left:0%;
        margin-top: 20%;
        transition: .5s ease;
        cursor: url(imágenes/Cursores/link.webp), auto;
        border-radius: 5px;
    }

.prev_button:hover, .next_button:hover{
    background-color: #292929d7;
}
    

    
    .display img{
        width: 100%;
        border-radius: 15px;
    }
    
    .display{
        display: flex;
        position: relative;
        left:0%;
        transition: 1.5s ease;
        height: 400px;
    }
    
    .carrousel_button{
        margin:10px;
        display: flex;
        position: relative;
        justify-content: center;
        background-color: #156EEB;
        padding:10px;
        border-radius: 5px;
    }
    
    .carrousel .next {
        background-color: #fff;
        border-radius: 25px;
        display: flex;
        position: relative;
        height: 20px;
        width: 20px;
        transition: 0.5s ease;
        cursor: url(imágenes/Cursores/link.webp), auto;
        margin-left: 10px;
        outline:2px #ccc solid;
    }
    
    .next:hover{
        background-color: #b8b8b8;
    }
    
}

@media (max-width:768px){
   .banner_buttons2{
    bottom: 6% !important;
   }
}