/*
FOR OLD COMPUTERS OR 21INCH MONITORS
*/
@media only screen and (min-width: 4560px) {
    .container {
        max-width: 1100px;
        width: 100%;
    }

    header .logo {
        min-width: 200px;
        width: 200px;
        margin-top: -37px;
       
    }

    .header_iconic {
        min-width: 200px;
    }

    .intro_img.img_2 {
        /* left: 30px;
        bottom: -300px !important;
        max-width: 170px; */
        left: 30px;
        width:25%;
        top: 360px;
    }

    .intro_img.img_2_bg {
        z-index: 9;
        animation: imgintro2 4s cubic-bezier(0.5, 0, 0, 0.5) infinite;
        width: 100px;
        top: 500px;
    }

    .intro_img.img_1 {
        right: -250px;
    }

    .cloud_img {
        width: 250px;
    }

    .cl_2 {
        width: 250px;
    }

    .tagline_col1 {
        padding: 10px;
    }

    .tagline_hd.hd_2 {
        right: -70px;
        top: 0;
    }

    .tagline_hd.hd_1 {
        left: 0;
        top: 350px;
    }

    .tagline_col2 {
        padding: 20px;
    }

    .aboutbox_col1 {
        padding: 20px;
    }

    .circles {
        flex-wrap: wrap;
    }

    .circles li {
        margin: 6px;
    }

    .vidthumb>a>small {
        margin: 15px;
        padding: 3px 10px;
    }

    .sec.tagline.productpage {
        padding: 160px 0 0;
    }

    .product_preview_eff {
        max-width: 700px;
    }

    .product_preview_eff.eff1 {
        right: -105%;
    }

    .product_preview_eff.eff2 {
        left: -110%;
    }

    .top_winners li aside {
        flex-wrap: wrap;
    }

    .winner_list li aside strong {
        text-align: right;
        font-size: 15px;
    }

    .top_winners li aside {
        padding: 15px 90px 15px 100px;
    }

}





/*
FOR MINI PC OR LAPTOPS
*/






/*
FOR TABLEEEEEEEEEEEEEEEEEEEEEET
*/
@media only screen and (max-width: 1280px)  {
    body{
        padding:0;
    }

    header {
        padding: 10px;
    }
    
    
    
    
    
    
    
    
    .custom-card {  
            background-color: #d1d3d4;   
            max-width: 130px;   
            border-radius: 60px 60px 60px 60px; /* افزایش قوس‌های بالا و پایین */  
            /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);  */ 
            border: 3px solid #ffff; 
            text-align: center !important;   
            margin: 7px;   
            padding-bottom: 5px;   
            position: relative; 
            opacity: 0.8;
            
        }  

        .circle {  
            max-width: 100px;   
            max-height: 100px;   
            border-radius: 50%;   
            margin: 10px auto important;   
            margin-bottom:10px;
            overflow: hidden;   
            border: 4px solid white;   
            opacity:1 !important;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }  

        .circle img {  
            width: 100%;  
            height: 100%;   
            object-fit: cover; 
            opacity: 5;
        }  

        .card-title {  
            font-size: 12px !important;   
            font-weight: bold;  
            margin: 5px 0 !important; 
            margin-top: 2px !important;
            margin-bottom: 2px !important;
            text-align:center;
            opacity: 5;
            color: black !important;
        }  

        .size {  
            font-size: 12px !important;   
            margin: 5px 0;   
            text-align:center;
           opacity: 100%;
            color: black;
            
        }  

        .btnn {  
            border: none;   
            background-color: white !important;   
            color: #00174a;   
            padding: 1px 25px 1px 25px;   
            border-radius: 10px;   
            cursor: pointer;   
            font-size: 13px; 
            margin-top: 10px !important; 
            margin-bottom:30px !important; 
            text-align:center !important;
            width:100%;
            opacity: 10 !important;
        }  

        .btnn:hover {  
            background-color: #00174a !important;   
            color: white;
        } 
        
        hr.line {
            border: 1px solid black !important;
            border-radius: 2px;
            margin: 5px 10px 5px 10px !important;
            margin-bottom:10px !important;
            text-align:center;
            opacity: 5;
        }  
        
        .subtitle{
            color:black; 
            margin-top:5px !important; 
            margin-bottom:10px !important; 
            text-align: center;
            font-size: 12px;
        }
    
    
    
    
    
    
    
    
    
    .doors {
        margin-right: -300px;
        margin-top: 150px;
    }

    .charkh {
        margin-right: -220px;
    }
    
     .flower {
        margin-right: -220px;
        margin-top: -100px;
    }


.tagline_col1 {
        padding-right: 280px !important;
    }
    
    .myimg_1 {
        position: absolute;
        right: 280px;
        top: 80px;
        width: 100px;
        animation: imgintro2 9s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_2 {
        right: 200px;
        top: -20px;
        max-width: 100px;
        animation: imgintro2 10s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_3 {
        right: 290px;
        top: -10px;
        max-width: 100px;
        animation: imgintro2 11s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_4 {
        right: 50px;
        top: -20px;
        max-width: 100px;
        animation: imgintro2 12s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_5 {
        right: 150px;
        top: 100px;
        max-width: 100px;
        animation: imgintro2 13s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_6 {
        right: 250px;
        top: 50px;
        max-width: 100px;
        animation: imgintro2 14s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_7 {
        right: 70px;
        top: 120px;
        max-width: 100px;
        animation: imgintro2 15s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    
    
    .myimg_text1 {
        right: 250px;
        top: 250px;
        max-width: 100px;
        animation: imgintro2 16s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_text2 {
        right: 260px;
        top: 260px;
        max-width: 100px !important;
        animation: imgintro2 17s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    

    .navbar-nav.headermenu {
        position: fixed;
        right: -100%;
        top: 0;
        bottom: 0;
        background: var(--color-white);
        padding: 90px 40px;
        width: 100%;
        display: block;
        text-align: right;
        z-index: 999;
        transition: all 1000ms cubic-bezier(1, 0, 0, 1);
    }

    .navbar-nav.headermenu>.nav-item {
        display: block;
        width: 100%;
        float: none;
    }

    .navbar-nav.headermenu.show {
        right: 0;
        transition: all 500ms cubic-bezier(1, 0, 0, 1);
    }

    .mainmenu .headermenu .dropdown-menu {
        position: relative !important;
        transform: none !important;
        padding: 15px 20px;
        margin: 0 !important;
    }

    .header_iconic {
        min-width: 130px;
        float: left;
    }

    .navbar-nav.headermenu .nav-item a {
        text-align: right;
    }

    html::after,
    .sq {
        display: none;
    }

    .navbar-toggler.hd-menu {
        display: block;
        position: relative;
        float: left;
        padding: 6px;
    }

    .intro_title h1 {
        font-size: 60px;
    }

    .container {
        max-width: 100%;
        width: 100%;
    }

    .intro {
        min-height: 950px;
    }

    .intro_title {
        max-width: 90%;
        top: 150px;
    }

    .intro_motion {
        min-width: 100%;
    }

    
    .cloud_img.cl_1 {
        width: 70px;
        left: 150px;
        top: 550px;
    }

    .cl_2 {
        right: 0;
        left: 0;
    }

    .intro_img.img_1 {
        right: 180px;
        top: 600px;
        max-width: 90px;
        animation: imgintro1 5s cubic-bezier(0.5, 0, 0, 0.5) infinite;
    }
    
    .intro_img.img_2 {
        left: 50px;
        max-width: 200px;
        top: 400px;
    }

    .intro_img.img_2_bg {
        z-index: 9;
        animation: imgintro2 4s cubic-bezier(0.5, 0, 0, 0.5) infinite;
        width: 150px;
        top: 600px;
    }

    .tagline_col2 .circles {
        display: none;
    }

    

    

    /* .tagline_hd.hd_2,
    .tagline_hd.hd_1 {
        display: none; 
    } */

    .tagline_hd {
        position: absolute;
        width: 350px;
    
    }
    
    
    
    .tagline_hd.hd_1 {
        right: 300px !important;
        top: 100px;
        width: 280px;
       /*  animation: cloud-line 25s cubic-bezier(1, 0, 0, 1) infinite; */
    }
    
    .tagline_hd.hd_2 {
        position: absolute;
        width: 150px;
        right: 360px;
        top: 165px;
        z-index:9;
        animation: anim_img1_m_0 12s cubic-bezier(1, 0, 0, 1) infinite;
        border-radius: 50px;
    }
    
    .about_title h2 {
        font-size: 35px;
    }

    .aboutbox_hd {
        position: relative;
        width: 200px;
    
    }

    .aboutbox_hd.hd_1 {
        margin-right: 150px;
    }

    .fixmarq {
        display: none;
    }
    
    
    
    

    .cats {
        margin: 25px 10px;
    }

    .scroller {
        overflow: auto;
        margin: 0 -10px;
        -webkit-overflow-scrolling: touch !important;
        -webkit-overflow-scrolling: auto !important;
    }

    .scroller>* {
        width: -moz-max-content !important;
        width: -webkit-max-content !important;
        width: -o-max-content !important;
        width: -ms-max-content !important;
        min-width: 100%;
    }

    .categories_grid .swiper-slide {
        width: 33%;
        float: right;
    }

    .categories_grid {
        margin: 30px auto;
    }

    .videos_grid {
        flex-wrap: wrap;
    }

    .newthumb>a>span {
        font-size: 14px;
    }

    footer {
        padding: 50px 15px 20px;
    }

    .footer_col_logo,
    .col_footer_title {
        display: none !important;
    }

    .col_social {
        padding: 20px;
        max-width: 100%;
        width: 100%;
    }

    .footer_col_menu {
        min-width: 100%;
        padding: 20px;
    }

    .footer_col_menu ul li {
        width: auto;
        float: right;
        margin-left: 20px;
    }

    .footer_col_menu.footer_col_double ul {
        max-height: 10000px;
        display: block;
        column-width: unset;
        column-count: 1;
    }

    .container.footer_menus {
        margin: 0;
    }

    .copyright.container {
        padding: 20px;
        margin: 0;
    }

    .sec.innersec {
        margin-top: 125px;
        margin-bottom: 50px;
    }

    .title h2.subtitle {
        font-size: 17px !important;
        max-width: 90%;
        line-height: 1.5em;
        margin: 0 auto;
        font-weight: bold;
    }

    .grd_new .swiper-slide.smallitems {
        width: 50%;
    }

    .grd_new .swiper-slide.smallitems .vidthumb>a>h2 {
        -webkit-line-clamp: 2;
        height: 60px !important;
        font-weight: bold;
        font-size: 18px;
    }

    .tvplayer {
        height: 75vh;
        margin-bottom: -80px;
    }


    .headbtns li a img {
        height: 50px;
    }

    .post_connections,
    .post_information {
        margin: 20px auto;
        max-width: 100%;
        padding: 0 15px;
    }

    .post_information {
        margin-bottom: 50px;
    }

    .post_get_circles a {
        max-width: 70px;
        width: 70px;
        border-radius: 15px;
        padding: 5px;
    }

    .socials.shareit li a svg {
        width: 25px;
        height: 25px;
    }

    .title.maintitle h2, .title.maintitle h1 {
        font-size: 30px;
    }


    .tvplayer {
        animation: none !important;
        -webkit-animation: none !important;
    }

    .video-js .vjs-control-bar {
        margin: 10px 0;
        flex-wrap: nowrap;
        left: 0;
        right: 0;
        max-width: 100% !important;
    }

    .video-js .vjs-control {
        width: 3em;
    }

    .grd_comments .swiper-slide {
        max-width: 50%;
        width: 50%;
    }

    .comment_prev {
        padding: 25px;
        font-size: 14px;
    }

    .comment_prev>b {
        font-size: 18px;
        margin-bottom: 10px;
        height: 27px;
    }

    .productpage .headbtns {
        padding: 0 50px;
    }

    .headbtns li a:hover {
        transform: none !important;
    }

    .swp-nav {
        display: none !important;
    }

    .sw_slideshow {
        max-width: 100%;
        width: 1400px;
        margin: 0 auto;
    }


    .topslider-slide a, .topslider-slide a:hover {
        padding: 5px;
        margin: 5px;
        transform: none !important;
        transition: none !important;
    }

    #bottomNavClose {
        position: fixed;
    }

    .grd_gallery .swiper-slide {
        width: 50%;
    }

    .gform_confirmation_wrapper>div {
        line-height: 1.5em;
        font-size: 20px;
    }
    
    

    .intro_img.img11 {
        right: 200px;
        width:15%;
        top: 490px;
    }
    
    
    
    
    .myimg_1_2 {
    right: 180px;
    top: 120px;
    max-width: 350px;
    animation: imgintro2 9s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_2_2 {
    left: 5px;
    top: 100px;
    max-width: 350px;
    animation: imgintro2 10s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_3_2 {
    left: -120px;
    top: 70px;
    max-width: 350px;
    animation: imgintro2 11s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_4_2 {
    right: 50px;
    top: 90px;
    max-width: 350px;
    animation: imgintro2 12s cubic-bezier(1, 0, 0, 1) infinite;
}




.myimg_5_2 {
    left: 150px;
    top: 530px;
    max-width: 100px;
    animation: cloud-line 9s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_6_2 {
    left: 200px;
    top: 550px;
    max-width: 80px;
    animation: cloud-line 8s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_7_2 {
    left: 160px;
    top: 570px;
    max-width: 50px;
    animation: cloud-line 10s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_text1 {
    left: -20px;
    top: 250px;
    max-width: 100px;
    animation: imgintro2 16s cubic-bezier(1, 0, 0, 1) infinite;
}

.myimg_text2 {
    left: -20px;
    top: 300px;
    max-width: 100px;
    animation: imgintro2 17s cubic-bezier(1, 0, 0, 1) infinite;
}

 .tagline_img.tg_1 {
        width: 15%;
    margin-top:100px;
     margin-right: 200px !important;
}
    
  
  
  
  .aboutbox_hd.hd_8 {
    animation: anim_img1_m 7s cubic-bezier(1, 0, 0, 1) infinite;
    width: 15%;
    right: -100px;
    bottom: 12px;
}  

    
    .anim_img202 {
        animation: anim_img1_m 7s cubic-bezier(1, 0, 0, 1) infinite;
        max-width: 100px;
        right: 100px;
        bottom: 100px;
    }
    
    .footer a {
        color: white;
        text-decoration: none;
        margin-top: 50px;
        padding: 10px !important;
    }
    
    .footer-logo img {
        max-width: 125px;
        margin-top: 25px;
    }
    
    .footer li {
    padding: 4px !important;
}

.footer h4{
    font-size:20px !important;
    margin-right:-20px !important;
}

.search-bar-container {
    position: relative;
    max-width: 200px;
    margin: auto;
}

.search-bar {
    width: 100%;
    padding: 8px 40px 8px 12px;
    border: none;
    border-radius: 5px;
}

.search-icon {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    font-size: 18px;
    color: #333;
}

.footer-bottom {
    background-color: #404041;
    padding: 5px 0;
    text-align: center;
    /* margin-top: 20px; */
}

.footer-bottom {
    padding: 5px 0;
    color: #fff;

}

.footer-bottom p {
    text-align: center !important;
    margin-top: 5px;
}

    header .logo {
        min-width: 150px;
        width: 150px;
        margin-top: 2px;
    }

}






/*
/////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////
FOR MOBILEEEEEEEEEEEEEEEEEEEEE
*/
@media screen and (max-width: 768px)  {
    
    .vid1 , .vid2 {
        margin-top:100px;
        max-width: 200px;
    }
    
    .column {
        flex: 0 0 40%; /* کوچیک‌شون کن تا تو یه ردیف جا بشن */
        font-size: 12px; /* اختیاری: کوچیک‌تر کردن متن */
        padding: 5px; /* اختیاری: کم کردن فاصله داخلی */
      }
      
      .column100{
          flex:0%;
      }
    
      .row {
        gap: 5px; /* کمتر کردن فاصله بین ستون‌ها */
      }
  
  
  
  
  
    body {
        padding:0;
        
    }
    
    .doors {
        max-width: 100%; 
        width: 100%; 
        min-height: 300px;
        margin:50px -1;
        right:-25px;
    }

    .charkh {
        max-width: 1000px; 
        width: 300; 
        min-height: 300px;
        margin:50px -1;
    }
    
     .flower {
        margin-top: 50px;
        text-align: center;
    }
    
    .door{
        margin-top: 100px; justify-content: center !important;  align-items: center !important; align-content: center !important; text-align:center !important;
    }
    
    .anim_img202 {
        animation: imgintro2 7s cubic-bezier(1, 0, 0, 1) infinite;
        max-width: 100px;
        right: -10px;
    }
    
    .tagline_hd.hd_2 {
        position: absolute;
        width: 150px;
        right: 170px;
        top: 80px;
        animation: anim_img1_m_0 12s cubic-bezier(1, 0, 0, 1) infinite;
        border-radius: 50px;
    }
    
    .tagline_hd.hd_1 {
        right: 100px !important;
        top: 0;
        width: 300px;
       /*  animation: cloud-line 25s cubic-bezier(1, 0, 0, 1) infinite; */
    }
    
    .tagline_hd.hd_1_1 {
        right: -10px !important;
        top: 0;
        width: 300px;
       /*  animation: cloud-line 25s cubic-bezier(1, 0, 0, 1) infinite; */
    }
    
    .tagline_img.tg_1 {
        width: 15%;
        margin-right: 5px !important;
        margin-top: -5px !important;
}
    
    .aboutbox_hd.hd_1 {
        margin-right: 100px;
    }
    
        .custom-card {  
            background-color: #d1d3d4;   
            max-width: 130px;   
            border-radius: 60px 60px 60px 60px; /* افزایش قوس‌های بالا و پایین */  
            /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);  */ 
            border: 3px solid #ffff; 
            text-align: center !important;   
            margin: 7px;   
            padding-bottom: 5px;   
            position: relative; 
            opacity: 0.8;
            
        }  

        .circle {  
            max-width: 100px;   
            max-height: 100px;   
            border-radius: 50%;   
            margin: 10px auto important;   
            margin-bottom:10px;
            overflow: hidden;   
            border: 4px solid white;   
            opacity:1 !important;
            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }  

        .circle img {  
            width: 100%;  
            height: 100%;   
            object-fit: cover; 
            opacity: 5;
        }  

        .card-title {  
            font-size: 12px !important;   
            font-weight: bold;  
            margin: 5px 0 !important; 
            margin-top: 2px !important;
            margin-bottom: 2px !important;
            text-align:center;
            opacity: 5;
            color: black !important;
        }  

        .size {  
            font-size: 12px !important;   
            margin: 5px 0;   
            text-align:center;
           opacity: 100%;
            color: black;
            
        }  

        .btnn {  
            border: none;   
            background-color: white !important;   
            color: #00174a;   
            padding: 1px 25px 1px 25px;   
            border-radius: 10px;   
            cursor: pointer;   
            font-size: 13px; 
            margin-top: 10px !important; 
            margin-bottom:30px !important; 
            text-align:center !important;
            width:100%;
            opacity: 10 !important;
        }  

        .btnn:hover {  
            background-color: #00174a !important;   
            color: white;
        } 
        
        hr.line {
            border: 1px solid black !important;
            border-radius: 2px;
            margin: 5px 10px 5px 10px !important;
            margin-bottom:10px !important;
            text-align:center;
            opacity: 5;
        }  
        
        .subtitle{
            color:black; 
            margin-top:5px !important; 
            margin-bottom:10px !important; 
            text-align: center;
            font-size: 12px;
        }
    
    
    /*.product_preview{
        margin-top:30px !important;
        min-height: 100px !important;
        margin-left:50px  !important;
        margin-right:40px  !important;
    }*/
    
    .videoboxproduct{
        margin-top:-150px;
    }
    
     .tagline_col111{
        margin-top:200px !important;
        width:100%;
        height: 100%;
        text-align:center !important;
        align-content:center !important;
        align-items:center !important;
        margin-left:40 auto !important;
        margin-right:40 auto !important;
        
    }
    
    
    
    
    


    .hidemob {
        display: none !important;
    }

    .intro_title h1 {
        font-size: 35px;
    }

    .intro_title {
        top: 170px;
    }

    .intro_title h2 {
        font-size: 14px;
    }

    .intro_link, .intro_link:hover {
        max-width: 160px;
        margin: 20px auto 0;
        font-size: 17px;
        padding: 10px;
    }

    .intro_title {
        max-width: 90%;
    }

    .intro {
        min-height: 700px;
    }
    
    .aboutbox_hd .hd_1 {
        left: 200px !important;
        top: 0;
        text-align:center;
        /*z-index:9;
         animation: cloud-line 25s cubic-bezier(1, 0, 0, 1) infinite; */
    }
    
    .hd_1 {
        right: 120px !important;
        top: 0;
        text-align:center;
        z-index:9;
         width: 250px;
       /*  animation: cloud-line 25s cubic-bezier(1, 0, 0, 1) infinite; */
    }
    
    .aboutbox_hd.hd_8 {
        animation: anim_img1_m 7s cubic-bezier(1, 0, 0, 1) infinite;
        width: 13%;
        right: -220px ;
        bottom: 12px;
    } 


    .aboutbox_col2{
        padding-right: 40px;  
        padding-left:40px;
        max-width: 300px; 
        width: 85%; 
        min-height: 500px;
    }

    .aboutbox{
        margin-top: -200px;
    }

    .aboutbox_col1{
        margin-top: 120px;
        /* margin-bottom: 200px; */
    }

    .myimg_1_2 {
        right: -10px;
        top: 120px;
        max-width: 350px;
        animation: imgintro2 9s cubic-bezier(1, 0, 0, 1) infinite;
    }

    .myimg_2_2 {
        left: -10px;
        top: 100px;
        max-width: 350px;
        animation: imgintro2 10s cubic-bezier(1, 0, 0, 1) infinite;
    }


    .tagline{
        top: -220px;
    }


    .myimg_1 {
        position: absolute;
        right: 280px;
        top: 80px;
        width: 100px;
        animation: imgintro2 9s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_2 {
        right: 200px;
        top: -20px;
        max-width: 100px;
        animation: imgintro2 10s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_3 {
        right: 290px;
        top: -10px;
        max-width: 100px;
        animation: imgintro2 11s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_4 {
        right: 50px;
        top: -20px;
        max-width: 100px;
        animation: imgintro2 12s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_5 {
        right: 150px;
        top: 100px;
        max-width: 100px;
        animation: imgintro2 13s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_6 {
        right: 250px;
        top: 50px;
        max-width: 100px;
        animation: imgintro2 14s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_7 {
        right: 70px;
        top: 120px;
        max-width: 100px;
        animation: imgintro2 15s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    
    
    .myimg_text1 {
        right: 250px;
        top: 250px;
        max-width: 100px;
        animation: imgintro2 16s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_text2 {
        right: 260px;
        top: 260px;
        max-width: 100px !important;
        animation: imgintro2 17s cubic-bezier(1, 0, 0, 1) infinite;
    }



    .intro_img.img11 {
        right: 50px;
        width:20%;
        top: 400px;
        
    }

    .cl_2 {
        right: 0;
        left: 0;
        /* filter: blur(5px); */
        bottom: -50px;
        width: 100px;
        right: -70px;
        left: auto;
    }

    /* .cl_1 {
        display: none;
        left:30px;
    } */

    .intro_img.img_1 {
        right: 20px;
        top: 500px;
        max-width: 80px;
        animation: imgintro1 5s cubic-bezier(0.5, 0, 0, 0.5) infinite;
    }

    .intro_img.img_2 {
        /* left: 30px;
        bottom: -300px !important;
        max-width: 170px; */
        left: 30px;
        width:25%;
        top: 360px;
    }

    .intro_img.img_2_bg {
        z-index: 9;
        animation: imgintro2 4s cubic-bezier(0.5, 0, 0, 0.5) infinite;
        width: 100px;
        top: 500px;
    }



    .tagline {
        padding-top: 90px;
    }

    .tagline .container {
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    .tagline_col1, .tagline_col2 {
        width: 100%;
        max-width: 100%;
    }
    
    .tagline_col1, .tagline_col1 {
        width: 100%;
        max-width: 100%;
        margin-top:-100px !important;
        /*display: flex; justify-content: center; align-items: center;*/
    }
    
    .mytag_1{
        width: 100% !important;
        max-width: 100% !important;
        margin-right:200px;
    }
    
    .mytag_2{
        width: 85% !important;
        max-width: 85% !important;
        margin-top:200px !important;
        margin-right:20px !important;
    }
    
    .tagline .container {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }
    
    .mytag_2 .tagline_title{
        display: flex;
        align-content: center;
        align-items: center;
        flex-wrap: wrap;
        padding: 40px;
        }

    .aboutbox .container {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }


    .aboutbox_col2, .aboutbox_col1 {
        width: 100%;
        max-width: 100%;
    }

    .pro_chat {
        display: none !important;
    }


    .newthumb:hover>a,
    .prothumb:hover .proimg_multi .image_bg_pros:nth-child(2),
    .prothumb:hover .proimg_multi .image_bg_pros:nth-child(1),
    .prothumb:hover .proimg_multi .promain_img {
        filter: none !important;
        transform: none !important;
        transition: none !important;
    }

    .categories_grid .swiper-slide {
        width: 50%;
    }

    .prothumb:hover .proimg_multi .image_bg_pros:nth-child(1),
    .proimg_multi .image_bg_pros:nth-child(1) {
        right: 0;
        left: 0;
        transform: translateX(40px) translateY(0) scale(0.8) !important;
    }

    .prothumb:hover .proimg_multi .image_bg_pros:nth-child(2),
    .proimg_multi .image_bg_pros:nth-child(2) {
        right: 0;
        left: 0;
        transform: translateX(-40px) translateY(0) scale(0.8) !important;
    }



    .aboutbox_col1 {
        padding: 40px;
    }

    .about_title h2 {
        font-size: 35px;
    }

    .about_title h3 {
        font-size: 17px;
    }

    .vidthumb>a,
    .vidthumb .widback {
        width: 100%;
        border-radius: 15px;
    }

    .vidthumb>a>small {
        display: none;
    }

    .blogbox,
    .videobox,
    .pcategories,
    .aboutbox,
    .tagline {
        padding: 50px 0;
    }


    .vidthumb>a>h2 {
        font-size: 18px;
        max-width: 100%;
        margin: 10px 0;
        height: 56px;
    }

    .swiper-wrapper {
        margin-bottom: 4px;
    }

    .title.bigtitle h2, .title.bigtitle h1 {
        font-size: 30px;
    }

    .title.bigtitle {
        margin: 0 0 30px;
    }

    .posdet li {
        font-size: 13px;
    }


    .videomode {
        width: 25px;
        height: 25px;
        padding: 5px;
        margin: 10px;
    }

    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 0 !important;
    }

    .mainpost {
        padding: 5px;
    }

    .mainpost>* {
        max-width: 100%;
        font-size: 15px;
        line-height: 1.5em;
    }

    .title h2, .title h1 {
        font-size: 30px;
    }

    .contactpage .col-md-7, .contactpage .col-md-5 {
        max-width: 100%;
        width: 100%;
    }

    .contactlist {
        padding: 0;
    }

    .contactlist li svg {
        width: 45px;
        min-width: 45px;
        height: 45px;
        margin: 8px;
        padding: 10px;
    }

    .contactlist li b {
        font-size: 15px;
        margin-bottom: 0;
    }

    .morelink, .btn, .nbs>label, .btn-primary, .bt-sample-link, input[type="submit"], button.submit, input[type="button"], button {
        margin: 0;
    }


    blockquote {
        font-size: 15px !important;
        padding: 20px;
        line-height: 1.7em !important;
    }

    .grd_new .swiper-slide {
        max-width: 100%;
        width: 100%;
    }

    .cats li>label {
        padding: 9px 0 10px 20px;
        font-size: 15px;
    }

    .cats li a:hover, .cats li a {
        font-size: 15px;
        padding: 10px 15px;
        font-weight: bold;
    }

    .topsearch {
        padding: 5px;
        margin: 10px 0 0;
    }


    .grd_new .swiper-slide.smallitems {
        width: 100%;
    }

    .smallitems .vidthumb>a>h2 {
        font-size: 17px;
        height: 58px;
        font-weight: bold;
    }

    .vidthumb>a>h2 {
        padding: 0 15px;
        font-weight: bold;
    }

    .prothumb h2 {
        font-size: 16px;
        line-height: 1.5em;
        padding: 0 10px;
    }

    .prothumb.singleprothumb {
        padding: 5px;
    }



    .cloud_img.cl_1 {
        width: 70px;
        left: 50px;
        top: 500px;
    }

    .cloud_img.ci_2 {
        top: 20px;
        left: -400px;
        right: 0;
    }

    .cloud_img.ci_3 {
        left: 0;
        right: -200px;
    }

    .cloud_img.ci_4 {
        left: -300px;
        top: 240px;
        right: 0;
        max-width: 550px;
    }

    .cloud_img.ci_5 {
        display: none;
    }


    .tagline_img .tg_1 {
        width: 20%;
        left: 200px;
        margin-right: 30px;
        /* transform: rotate(10deg) translateY(-5px) translateX(-10px);
        animation: imgtag1 15s cubic-bezier(1, 0, 0, 1) infinite;
        border-radius: 50px; */
    }

    .newthumb>a>h2 {
        max-width: 100%;
    }

    .newthumb .jobst {
        padding: 4px 10px;
        font-size: 13px;
    }


    .hd-player .navbar-brand {
        max-width: 90px;
    }

    .tvplayer {
        height: 50vh;
        margin-bottom: -80px;
    }

    .post_connections, .post_information {
        flex-wrap: wrap;
        padding: 0;
    }

    .headbtns {
        width: 100%;
        justify-content: center;
    }

    .headbtns li {
        padding: 5px;
    }


    .post_get_circles {
        width: 100%;
        justify-content: center;
    }

    .post_get_circles li {
        padding: 3px;
    }

    .post_items {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        justify-content: center;
    }

    .post_items li svg {
        width: 20px;
        height: 20px;
        margin-left: 3px;
    }

    .post_items li span, .post_items li a, .post_items li a:hover {
        font-size: 12px;
    }

    .socials.shareit {
        align-content: center;
        justify-content: center;
        margin: 5px auto;
        width: 100%;
    }

    .socials.shareit li a svg {
        margin: 0 10px;
    }


    .sec.singlebook .container {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column-reverse;
    }

    .comments {
        padding: 20px 10px 50px;
    }

    .erroricon {
        height: 50px;
    }

    .errorbox h1 {
        font-size: 30px;
    }

    .title.maintitle h2, .title.maintitle h1 {
        font-size: 25px;
    }


    .grd_comments .swiper-slide {
        max-width: 100%;
        width: 100%;
    }


    .sec.tagline.productpage {
        padding: 120px 0 0;
    }

    .sec.tagline.productpage .container:nth-child(1) {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
    }

    .product_col1 .shareit {
        max-width: 50px;
        padding-top: 0;
    }

    .product_col1 .socials.shareit li a svg {
        width: 25px;
        height: 25px;
        margin: 7px !important;
    }

    .product_preview_eff {
        max-width: 500px;
    }

    .product_preview_eff.eff1 {
        right: -110%;
        filter: blur(5px);
    }

    .product_preview_eff.eff2 {
        left: -110%;
        filter: blur(5px);

    }

    .tagline_col2.product_col2 {
        padding: 0 60px;
        z-index: 9;
    }

    .post_information.product_information {
        max-width: 100%;
        margin: 15px 0;
    }

    .product_col2 .tagline_title h2 {
        font-size: 25px;
        text-align: center;
    }

    .product_col2 .product_excerpt>p {
        text-align: center;
    }

    .product_col2 .post_get_circles {
        justify-content: right;
    }

    .circlesline .circles li {
        width: 77px;
        height: 77px;
        margin: 2px;

    }

    .circlesline .circles li b {
        font-size: 16px;
        line-height: 16px;
        margin-top: -10px;
    }

    .productpage .headbtns {
        padding: 0;
        display: flex;
        flex-wrap: wrap;
    }

    .source_inner {
        padding: 15px;
    }


    .shahreman .cloud_img.ci_1 {
        right: -400px;
        top: 450px;
    }

    .shahreman .cloud_img.ci_4 {
        left: -300px;
        top: 382px;
    }


    .winner_list li {
        margin: 10px;
    }

    .top_winners li::before {
        font-size: 25px;
        padding: 10px;
        top: 10px;
    }

    .top_winners li aside {
        padding: 15px 55px 15px 80px;
    }

    .winner_list li aside div {
        flex-wrap: wrap;
    }

    .winner_list li aside div label b {
        margin-bottom: 8px;
    }

    .top_winners li aside::after {
        top: 20px;
    }

    .other_winners li::before {
        font-size: 14px;
        margin-left: 10px;
    }

    .top_winners li:nth-child(1) aside::after {
        width: 90px;
        height: 90px;
        top: 12px;
        left: 18px;
    }

    .winner_list.other_winners li aside div {
        flex-wrap: nowrap;
    }

    .winner_list.other_winners li aside div label b, .winner_list.other_winners li aside div label {
        font-size: 14px;
        text-align: center;
        margin: 0;
    }

    .winner_list.other_winners li aside div label {
        padding: 0 5px;
        width: auto;
    }

    .winner_list.other_winners li aside div label:nth-child(1) {
        width: 100%;
    }

    .winners_title>i {
        font-size: 30px;
    }

    #winner_table tr {
        padding-right: 60px;
    }


    #winner_table tr::before {
        font-size: 18px;
        padding: 12px 0;
    }
    
    h2{
        font-size: 18px !important;
        font-weight: bold !important;
    }
    
   .tagline_title {
        margin-right: -40px;
        margin-left: -40px;
        margin-top: -20px
    }

}


/*
/////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////
FOR 567px
*/
@media screen and (max-width: 576px){

      
      
      
      
      
    body{
        padding:0;
    }
    
    .multicolor, .circles {
        display: none;
    }
}






/*
/////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////
FOR 430px
*/
@media screen and (max-width: 430px){
      
      
      
      
    body {
        padding:0;
    }
    
    .doors {
        max-width: 100%; 
        width: 100%; 
        min-height: 300px;
        margin:50px -1;
        right:-1px;
        top: -100px;
    }

    .charkh {
        max-width: 1000px; 
        width: 700px; 
        min-height: 300px;
        margin:50px -1;
    }
    
     .marbel {
        margin-top: -200px;
        text-align: center;
        margin-right: -30px;
    }
    
    .myimg_4 {
        right: 120px;
        top: 0;
        max-width: 100px;
        animation: imgintro2 12s cubic-bezier(1, 0, 0, 1) infinite;
    }

    .myimg_1 {
        position: absolute;
        right: 250px;
        top: 80px;
        width: 100px;
        animation: imgintro2 9s cubic-bezier(1, 0, 0, 1) infinite;
    }

    .myimg_6 {
        right: 200px;
        top: 50px;
        max-width: 100px;
        animation: imgintro2 14s cubic-bezier(1, 0, 0, 1) infinite;
    }

    .myimg_3 {
        right: 270px;
        top: 0;
        max-width: 100px;
        animation: imgintro2 11s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    .myimg_7 {
        right: 70px;
        top: 100px;
        max-width: 100px;
        animation: imgintro2 15s cubic-bezier(1, 0, 0, 1) infinite;
    }
    
    h2{
        font-size:20px;
    }
    
    span{
        font-size:19px !important;
    }
    
    .myimg_text1 {
        right: 250px;
        top: 250px;
        width: 15px !important;
    }

    .myimg_text2 {
        right: 260px;
        top: 260px;
        width: 20px !important;
    }
    
    .tagline_hd.hd_1_1 {
        right: 100px !important;
        top: 0;
        width: 300px;
       /*  animation: cloud-line 25s cubic-bezier(1, 0, 0, 1) infinite; */
    }
    
        .anim_img202 {
            bottom:20px;
        }
}