@media (min-width:1024px) and (max-width:1200px){
.news-card {
    display: inline-block;
    width: calc(30.33% - 0px);
    max-width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    margin: 10px 10px 10px 10px;
    cursor: pointer;
}


}




@media screen and (max-width: 1024px) {

.mobtrilerbtn{
display: block;
padding: 15px 0;
    padding-top: 17px;
    text-align: center;
    cursor: pointer;
    background: #2575FC;
    color: #fff;
    width: 100%;
    font-size: 15px;
    border-radius: 3px;
    font-family: "font-1";
    position: relative;    
    border: none;
  }
    
.trailer-content {
    background: #222;
    padding: 4px;
    border-radius: 10px;
    position: relative;
    width: 90%;
    max-width: 800px;
}
    
    .borderi{
display: flex;
width: 100%;
border-bottom: 1px solid #3e414c9e;
padding-bottom: 10px;
}

 .message-menu {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #333;
    padding: 10px;
    border-radius: 8px;
    text-align: center;
}
 .message-menu span a{
    text-decoration: none;
}
   
    
    
.telegrambtn {
width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #0088cc; /* ტელეგრამის ფერი */
  color: white;
  padding: 10px 20px;
  border-radius: 5px;
  text-decoration: none;
  font-size: 16px;
  transition: background-color 0.3s;
}

.telegrambtn:hover {
  background-color: #006fa6; /* უფრო მუქი ფერი hover-ზე */
}

.telegram-icon {
  background-image: url('https://upload.wikimedia.org/wikipedia/commons/thumb/e/e3/Telegram_Logo.svg/1200px-Telegram_Logo.svg.png');
  background-size: contain;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  display: inline-block;
}
    
    
    
    
.content {
width: 100%;
float: left;
margin-left: 0px;
padding: 0px 0px;
}

.movie-info {
    background: #242731;
    color: #fff;
    padding: 20px;
    border-radius: 0px;
    font-family: font-1, sans-serif;
    width: 95%;
    margin: 20px auto;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.8;
}


.news-card {
    display: inline-block;
    width: calc(47.33% - 1px);
    max-width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    margin: 10px 10px 10px 10px;
    cursor: pointer;
    font-family: 'font-1';
}    
    
    
    



.newsimgbg{
width: 100%;
height: 290px;
position: relative;
}

.newsimgbg img{
width: 100%;
height: 100%;
object-fit: cover;
}
 
.header-top {
width: 100%;
height: 50px;
float: left;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0px 10px;
}

.form_submit {
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}
    
    
    
    
.slidertitle {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
margin-top: 50px;
padding: 10px;
background: #1A1C22;
color: white;
font-size: 15px;
border-radius: 5px;
position: relative;
}    


.slidericon{
display: flex;
align-items: center;
position: absolute;
left: 8px;
}

.header-top .logo{
width: 154px;
height: 22px;
}
        
.user-icon{
width: 35px;
height: 35px;
}

    
.user-icon img{
width: 100%;
padding: 3px;
}




/* მენიუს საერთო კონტეინერი */
.horizontal-menu {
    display: none; /* Default-ად დამალულია (მხოლოდ მობილურზე გამოჩნდება) */
    width: 100%; /* ეკრანის სრული სიგანე */
    height: 50px; /* მენიუს სიმაღლე */
    background: #242731;
    overflow-x: auto; /* ჰორიზონტალური სქროლი */
    overflow-y: hidden; /* ვერტიკალური სქროლი გაუქმებულია */
    -webkit-overflow-scrolling: touch; /* iOS smooth scrolling */
    scrollbar-width: none; /* Firefox-ში სქროლის დამალვა */
    -ms-overflow-style: none; /* IE Edge-სთვის სქროლის დამალვა */
    white-space: nowrap; /* Prevents items from wrapping */
}

/* Chrome და Safari-ში სქროლის დამალვა */
.horizontal-menu::-webkit-scrollbar {
    display: none;
}

/* მენიუს ელემენტების კონტეინერი */
.menu-list {
    display: flex;
    gap: 20px; /* ელემენტებს შორის სივრცე */
    padding-right: 10px;
   padding-left: 5px;
    margin: 0;
    list-style: none;
}

/* ინდივიდუალური მენიუს ელემენტი */
.menu-item {
    display: flex;
   align-items: center;
    justify-content: center;
    min-width: 90px; /* მინიმალური სიგანე - აიძულებს ჰორიზონტალურ განლაგებას */
    flex-shrink: 0; /* არ დაუპატარავდეს ელემენტები */
}

/* აიქონები */
.menu-item img {
display: flex;
align-items: center;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    margin-bottom: 2px;
}

/* ლინკები */
.menu-item a {
display: flex;
align-items: center;
    font-size: 14px;
    color: rgb(199, 190, 190);
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 0.5px;
}

.horizontal-menu {
    display: flex;
}


    



/* 🔹 ნავბარი გვერდიდან გაქრეს */
.sidebar {
display: none;
}

.auth-text{
display: none;
}


   

    /* 🔹 სლაიდერის სწორი ზომა */
    .slider-container {
        margin-top: 0px; /* მენიუს ქვეშ */
        width: 100%;
        height: auto;
    }

    .main-slider {
        width: 100%;
        height: 250px;
        position: relative;
        overflow: hidden;
    }

    .main-slide {
        width: 100%;
        height: 100%;
    }

    .main-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* 🔹 ქვედა ტექსტი სწორად განლაგდეს */
    .slide-info {
        position: absolute;
        bottom: 20px;
        left: 20px;
        color: white;
    }

    .movietitleslider {
        font-size: 20px;
    }

    .moviecategoria {
        font-size: 14px;
    }

    .rating {
        font-size: 14px;
        background-color: rgba(0, 0, 0, 0.5);
        padding: 5px 10px;
        border-radius: 5px;
    }

    /* 🔹 თუმბების ნაცვლად წრეები */
    .thumbnails {
        display: none; /* მინიატურები დავმალოთ */
    }

    .slider-dots {
        display: flex;
        justify-content: center;
        gap: 8px;
        
        position: absolute;
        bottom: 20px; /* ოდნავ მაღლა, რომ ბოლომდე არ მიეკრას */
        
        left: 50%; /* ჰორიზონტალურად ცენტრში */
        transform: translateX(-50%); /* ზუსტად ცენტრში */
    }
    

    .dot {
        width: 10px;
        height: 10px;
        background-color: #2575FC;
        border-radius: 50%;
        transition: background-color 0.3s;
    }

    .dot.active {
        background-color: white;
    }


.search-container{
display: none;
}


.slidericon span{
display: flex;
align-items: center;
justify-content: center;
width: 35px;
height: 35px;
float: left;
background: #2575FC;
border-radius: 5px;
margin-right: 10px;
padding: 0px;
}

.slider-serial{
width: 100%;
}
.slider-serial {
    overflow: hidden; /* მარცხენა მხარეს არ გამოჩნდეს */
    padding-right: 10px; /* მარჯვენა მხარეს რომ ნახევარი ფილმი გამოჩნდეს */
}

.slider-serial .slick-slide {
    transition: transform 0.3s ease-in-out; /* გლუვი ანიმაცია */
}

.slider-movie {
    overflow: hidden; /* მარცხენა მხარეს არ გამოჩნდეს */
    padding-right: 10px; /* მარჯვენა მხარეს რომ ნახევარი ფილმი გამოჩნდეს */
}

.slider-movie .slick-slide {
    transition: transform 0.3s ease-in-out; /* გლუვი ანიმაცია */
}




/* ძებნის ღილაკი */
.mobsearch {
display: flex;
align-items: center;
z-index: 1000;
}

.mobsearch img {
    width: 24px;
    height: 24px;
}

/* ძებნის ველი (თავდაპირველად დამალული) */
.search-container {
    position: fixed;
    top: 0;
    left: -100%;
    width: 88%;
   
    height: 45px;
   border-radius: 5px;
    display: flex;
    align-items: center;
    padding: 5px 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: left 0.3s ease-in-out;
    z-index: 999;
}

.search-container.active {
    left: 10%;
    top: 2px;
}

.search-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 16px;
    padding: 5px;
}

.close-search {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #555;
}
    
    
    
.movie-content {
    display: block;
    width: 100%;
    padding: 40px;
    position: relative;
    z-index: 300;
    height: auto;
    padding-top: 25px;
    
}

.movie-poster{
display: none;
}
.movie-video {
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

 .fulltitle{
display: flex;
align-items: center;
font-size: 16px;
justify-content: center;
margin-top: 20px;
padding: 0px 7px;
}
    
    
.box.story {
    max-width: 1300px;
    width: 100%;
    margin: 10px auto;
    background: #242731;
    border-radius: 0px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
 padding: 5px;
}
   
    

}











@media (min-width:560px) and (max-width:774px){
  
    
.news-card {
    display: inline-block;
    width: calc(49% - 16px);
    max-width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    margin: 10px 10px 10px 10px;
    cursor: pointer;
    font-family: 'font-1';
}    
    
    
    
    
    
}






@media (min-width:320px) and (max-width:560px){
.popup {
    background-color: #1A1C22;
    padding: 20px;
    max-width: 560px;
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    transform: translateY(-100%);
    opacity: 0;
    transition: transform 0.5sease-out, opacity 0.5sease-out;
}
    
    
    
 
element.style {
}
.close-btn {
    position: absolute;
  top: 10px;
 right: 11px;
    font-size: 30px;
    color: white;
    cursor: pointer;
    background: red;
    border-radius: 50%;
    display: flex;
    align-items: center;
    width: 35px;
    height: 35px;
    justify-content: center;
}   
    
   .usinf {
    display: grid;
    grid-template-columns: 2fr;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
} 
    
    
    
    
.slider-serial {
margin-top: 50px;
background-color: ;
background-image: linear-gradient(rgba(12, 12, 12, 0.3), rgba(26, 28, 34, 0.9)),
                  url("../images/serialbg.jpg");
background-size: cover;
background-size: cover;
background-position: center;
padding: 50px 0px;
background-attachment: fixed;
}
   
    
.news-card {
    display: inline-block;
    width: calc(100% - 20px);
    max-width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
    margin: 10px 10px 10px 10px;
    cursor: pointer;
    font-family: 'font-1';
}    
    
    
    
    
    
}