.carrossel-title {
    font-size: 1.8rem;
    margin-bottom: 20px;
    text-align: center;
    color: #4dabf7;
}
        
.owl-carousel {position: relative;}
        
.item {           
    overflow: hidden;
    /* margin: 10px; */
    transition: all 0.3s ease;
    position: relative;
     background: linear-gradient(to top, #2E1C86, #2C28C7);     
    height: 500px; 
     display: flex;
     flex-direction: column;      
    }        
        
.item-content {
   width: 1200px;
   height: 100%;
   margin: auto;
   padding: 30px 0;
    position: relative;      
    }
    
.bg_wifi {
   width: 250px;
   height: 250px;
   position: absolute;
   left: 5px;
   bottom: -50px;   
    background-image: url(../img/bg_wifi.png);
    background-repeat: no-repeat;
    background-size: 100%;         
}

.item-content .img_ban{
    position: absolute;
    right: 0;
   top: 0px;    
}

.item-content .img_ban img{height: 530px;}

.texto_itn{
    /* background-color: #0f1b3a; */
    float: left;
    margin: 100px 0 0 100px;   

}

.item h3 {
    font-size: 40px;
    color: #fff;
    font-weight: 100;
    margin: 0;
    letter-spacing: 1px;
    display: block;
}   
        
.item h2 {
     font-size: 45px;
     color:#fff;
     margin-top: 10px;
     display: block;
}
         
 #carrossel .btn_itn {
       background: none;
        color: #fff;
        border: 1px solid #fff;
            padding: 4px 15px;
            border-radius: 30px;
            font-weight: 100;
            transition: all 0.3s ease;
            letter-spacing: 1px;
            font-size: 16px;
            margin-top: 60px;
            float: left;
        }       
        
 #carrossel .btn:hover {
    background: #339af0;
    transform: scale(1.05);
}
        
.owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
        padding: 0 20px;
    }
        
        .owl-prev, .owl-next {
            background: rgba(0, 0, 0, 0.3) !important;
            width: 50px;
            height: 50px;
            border-radius: 50% !important;
            display: flex !important;
            justify-content: center;
            align-items: center;
            font-size: 1.5rem !important;
            color: #fff !important;
            transition: all 0.3s ease;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
            
        }
        
        .owl-prev:hover, .owl-next:hover {
            background: rgb(255, 174, 0) !important;
            transform: scale(1.1);
        }
        
.owl-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
}
        
.owl-dot span {
   width: 20px!important;
    height: 8px!important;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
    }
        
        .owl-dot.active span {
            background: #ffc600 !important;
            transform: scale(1.2);
        }
        
        .carousel-info {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 15px;
            padding: 0 10px;
        }
        
        .image-counter {
            font-size: 1rem;
            opacity: 0.8;
        }
        
        
        
@media (max-width: 768px) {
    
    .item {   
    height: 200px;        
    }

    .bg_wifi {
        width: 10%;
        height: 10%;
        left: 5px;
        bottom: -50px;   
           
}
    
    .item-content {
        width: 100%;
        height: 100%;
        margin: auto;
        padding: 30px 0;
        position: relative;      
    }

    .item-content .img_ban{
        position: absolute;
        right: 0;
        bottom: 0px;
        height: 100%;    
    }

    .item-content .img_ban img{
        height: 100%;
    }
    
    .bg_wifi {display: none;}

    .texto_itn{
    position: absolute;
    z-index: 2;
    margin: 0;   
    left: 30px;
    top: 25%;
    }
            
    .item h3 {font-size: 20px;}           
    .item h2 {font-size: 20px; line-height: 15px; }

    #carrossel .btn_itn {
       padding: 4px 15px;
            border-radius: 20px!important;
            font-weight: 400;            
            letter-spacing: 1px;
            font-size: 13px;
            margin: 20px 0 0 10px;
            float: left;
        } 

     .owl-dots {
        bottom: 8px;
     }
     .owl-dot span {
        width: 15px!important;
        height: 6px!important;
        border-radius: 10px!important;
    }
            
    .owl-nav {
        position: absolute;
        top: 60%;
        width: 100%;
         transform: translateY(-50%);
        padding: 0 0px!important;
       
    }
            
            .owl-prev, .owl-next {
                width: 20px;
                height: 20px;
                font-size: 1rem !important;
            }
        }