
@media (min-width:992px) {

}
@media(max-width:1500px) {

    .hero-banner {
      min-height: 530px;
  }
  .inner-banner .img-box img.real-img {mask-position: 0px -40px;}
  }
  @media(max-width:1399px) {
    h2 {
      font-size: 29px;
      line-height: 42px;
    }
    .header-btn .btn-primary {padding: 11px 20px;}
    #menu ul {gap: 25px;}
.top_news_sec .left h1 {font-size: 25px;}
.slider .owl-nav .owl-prev, .slider .owl-nav .owl-next {width: 40px;}
.slider .owl-nav {
  width: 111%;
  left: -5.4%;
}
.blog-main .blog-card .blog-content h4 {
  font-size: 16px;
}

  }
  @media(max-width:1299px) {

    .hero-banner {
      min-height: 470px;
  }
  .media-option {
    gap: 9px;
}


  }
  @media(min-width:1200px) and (max-width:1300px) {

  }
  @media (max-width:1199px) {
    h3 {font-size: 21px;line-height: 1.2;}
    h2 {font-size: 25px;line-height: 1.2;}

    .header-btn .btn-primary {padding-inline: 8px;gap: 6px;}
    #menu ul li a{font-size: 14px;}
    .right .blog-card .img-box img {
      min-width: 120px;
      width: 230px;
  }
  .top_news_sec .left h1 {
    font-size: 22px;
}
.left .blog-card .blog-content a {
  font-size: 16px;
}
.left .blog-card .blog-content a img {
  margin-right: 8px;
  max-width: 20px;
}
.blog-card .blog-content a {
  font-size: 14px;
}
.blog-card .effect span {
  font-size: 20px;
}
.btn-primary {font-size: 15px;padding: 11px 35px;}


.news-later.row {background-position: center right -70px !important;}
.blog-main .blog-card .blog-content h4{  display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow:ellipsis;}
.video_main .blog-card .img-box::after {width: 46px;font-size: 21px;}
.blog-main .blog-card .blog-content a:nth-last-child(1) {align-items: center;}


.news-later .form-control {height: 40px;margin-bottom: 10px;}

.news-later .form-control {
  height: 40px;
  margin-bottom: 10px;
  background: transparent;
  backdrop-filter: blur(5px);
  border-color: var(--primary);
}

.news-later.row {background-position: center right -50px !important;}
.inner-banner .img-box img.real-img {mask-position: 0px 0px;}
.inner-banner h1 {font-size: 38px;}
.detail-sec .thumbnail {
  /* height: 403px; */
  border-radius: 16px;
}
  }
  @media (max-width:1040px) {
    .slider .owl-nav {
      width: 103%;      left: -12px;  }
  }
  @media (max-width:1024px) {
    .detail-sec .thumbnail .user img {width: 65px;}
    .media-option {margin: 10px 0;}
  }
  @media(max-width:991px){
    header {position: relative;top: 0;left: 0;width: 100%; z-index: inherit;border: none;padding: 0;}
    .topbar {
      width: 100%;
      border-bottom: 1px solid transparent;
      border-image: linear-gradient(214deg, rgba(248, 179, 0, 1) 12%, rgba(115, 154, 255, 1) 52%, rgba(255, 34, 142, 1) 92%); border-image-slice: 1;  position: relative; z-index: 999;
      padding: 15px 0;  }
    .topbar .logo a{font-size: 32px;font-weight: 400;}
    header .logo{width: 210px;}
    .topbar ul.top_right_contents{padding:0 ;margin:8px 0 0 0;list-style:none;color: #000; text-align: center;}
    .topbar ul.top_right_contents li{vertical-align:middle; position:relative; display: inline-block; line-height: 1;text-align: end;}
    .topbar ul.top_right_contents li a.menu_open i {font-size: 30px;color: #000;}


    .topbar.sticky{margin:0;position:fixed;top:0;left:0;width:100%;z-index:999;animation-name:menu_sticky;animation-duration:.6s;animation-timing-function:ease-out;
      background-color: var(--white);}
    .topbar ul.top_right_contents{padding:0;margin:0;list-style:none; text-align: right;}
    .topbar ul.top_right_contents li{vertical-align:middle; position:relative; display: inline-block;
        margin-right: 20px;  line-height: 1;}
    .topbar ul.top_right_contents li:last-child {margin-right: 0;}
    .topbar ul.top_right_contents li a {color:#fff; line-height: 1;}
    .topbar ul.top_right_contents li a i {font-size: 26px;}
    .topbar ul.top_right_contents li a i.user { font-size: 34px;}
    .topbar ul.top_right_contents li a.menu_open img{width: 36px;}
    .menu_overlay {position: fixed; top:0; right:0; bottom:0; left:0; z-index:9999; background: rgba(0,0,0,0.75);}
    .menu_toggler {margin:15px 0 0;}
    .menu_toggler .icons {font-size:26px; color:#212121}
    .menu_head {background:#000;text-align: center; position: relative;color:#fff;}
    .menu_head a {color:#fff; padding:15px 10px; display: inline-block; font-weight: 500; font-size: 16px;}
    .menu_close {text-align: start; margin-bottom: 33px;padding: 0;}
    .menu_close i {font-size:20px; color: #fff;}
    .mobile_menu_wrap {position: fixed; top:0px; bottom: 0; right:-100%; z-index:99999; background:var(--primary); padding:0 0 75px; transition: all linear 0.2s; max-width: 80%; width: 300px; height: 100vh;}
    .mobile_menu_wrap .form-control{width: 80%;}
    .mobile_menu_wrap.menu_show {right:0;}
    .mobile_menu_wrap ul { margin:10px 0 0 0; list-style:none; font-size: 16px;font-weight: 400;}
    .mobile_menu_wrap ul.main_menu {margin-bottom:10px; padding:0 20px;}
    .mobile_menu_wrap ul.main_menu li{padding:0 ;color: var(--white);}
    .main_menu li.active a{font-weight: bold;}
    /* .main_menu li a:hover,.topbar .top-links a:hover{} */
    .mobile_menu_wrap ul.main_menu li a {font-size:17px; text-decoration: none;}
    .mobile_menu_wrap ul li a {position: relative; display: block;margin-top: 20px; width: 100%; color: var(--white);}
    .mobile_menu_wrap ul li.hassub {position: relative;width: 100%;display: inline-block;}
    .mobile_menu_wrap ul li.hassub .sub_menu_open {position: absolute;right: 0;top: 0;font-size: 18px;width: 100%;text-align: end;}
    .mobile_menu_wrap ul li.hassub ul {position: fixed; top:0; bottom:0; right:-100%; max-width: 80%; width: 220px;background-color: var(--primary); margin:0; transition: all linear 0.3s; padding:48px 0 100px; overflow: auto; z-index: 9; visibility:hidden; box-shadow: 0 4px 16px 0 #00000020;border-left:1px solid var(--dark2) ;padding-left: 20px;}
    .mobile_menu_wrap ul li.hassub ul.show_submenu {visibility: visible; right: 0;}
    .mobile_menu_wrap ul li.hassub ul li.back_to_mainmenu {position: absolute; top:0; width: 100%; background: var(--dark);left: 0;}
    .mobile_menu_wrap ul li.hassub ul li.back_to_mainmenu a {font-size:15px; color: #fff; padding:10px 20px;margin-top: 0px;}
    .mobile_menu_wrap ul li.hassub ul li.back_to_mainmenu a i.fa { margin-right: 5px;}
    .right .blog-card {
      gap: 16px;

  }
  .right hr {
    margin: 20px 0 !important;
}
.top_news_sec .left{margin-bottom: 30px;}
.slider .owl-nav {display: none;}
section {
  padding: 30px 0;
}
.slider .owl-dots {display: flex;align-items: center;justify-content: center;gap: 10px;}
.slider .owl-dots button{background-color: var(--primary);height: 10px;width: 10px;border-radius: 50%;}
.slider .owl-dots button.active{background-color: var(--secondary);}
footer * {
  text-align: center;
}
.social-icon {
  justify-content: center;
  margin: 20px 0;    gap: 22px;
}
.logo img {
  max-width: 160px;
}
footer hr {
  margin: 10px 0 28px !important;
}
.social-icon img {
  width: 24px;
}
h6 {font-size: 17px;}



.detail-sec .thumbnail .tags span {
  padding: 4px 26px;
  font-size: 15px;
}
.media-option {margin: 12px 0;}

.video-sec .ply-btn {width: 64px;height: 64px;}

.video-sec .ply-btn img {
  width: 19px;
}
.latest_sec .heading + hr {
  margin: 17px 0 !important;
}
.blog-main .blog-card .blog-content h4{min-height: 47px;}
.inner-banner .img-box{width: 100%;}
.inner-banner h1,.inner-banner p{color: var(--white);}
.inner-banner .col-lg-5{position: relative;z-index: 12;}
.inner-banner .img-box img{left: 0;object-position: right;opacity: .4;}
.inner-banner {   overflow: hidden; min-height: 200px;background-color: rgba(0, 0, 0, .8);}
.inner-banner::after{position: absolute;top:0;left: 0;content: "";width: 100%;height: 100%; background: rgba(0, 0, 0, .6); z-index: 2;   }
.news-later.row {overflow: hidden;margin: 0;background: linear-gradient(176deg, rgb(0 31 80) 0%, rgb(0 0 0) 100%) !important;}
.news-later.row .col-lg-6{position: relative;z-index: 12;}
.news-later.row *{color: white;}
.news-later h3{font-size: 24px;margin-bottom: 20px;}
.pro-box {display: none;}
.pro-box img{width: 80px !important;}
.pro-box.pro-box2{display: flex;margin-bottom: 10px;justify-content: start;}
.inner-banner .img-box img.real-img{mask-image: unset !important;}
.blog-card .effect{display: block;}
.img-box .effect-1,.img-box .effect-2{display: none;}

   }
  @media (max-width:767px) {
    .btn-primary {font-size: 14px;  padding: 9px 32px;}
    .news-later h2 {color: var(--white);}
    .news-later .form-control{color: var(--white);border-color:#d9267d7d ;}
    .news-later .form-control::placeholder{color: var(--white);}
    .blog-main .blog-card .blog-content {padding: 14px 11px;}
    .blog-card .blog-content h6 {font-size: 16px;}
    .right .blog-card .img-box img {min-width: 203px;}
    .top_news_sec .left h1 {font-size: 18px;}

    .left .blog-card .blog-content {
      position: absolute;
      bottom: 16px;
      left: 16px;
      padding: 20px;
      background-color: #FFFFFF38;
      backdrop-filter: blur(21px);
      border-radius: 6px;
      width: 90%;
  }


  .news-later.row .form-control::placeholder{color: black;}
  .news-later.row {border-radius: 16px;box-shadow: 0 0 10px 0 rgba(0,0,0,0.35);}
  .news-later {    padding: 60px 50px;    border-radius: 0;}
  .blog-main .blog-card .blog-content h4 {  font-size: 16px;min-height: 41px;}


  .inner-banner h1 {  font-size: 30px;}
  .blog-main .form-control {  padding: 9px 12px;  color: #1D1D1D4D;}
  .inner-content img {aspect-ratio: 1 / 0.4;}

.detail-sec .thumbnail .user {  right: 9px;  bottom: 8px;  gap: 6px;}
.detail-sec .thumbnail .user img {  width: 45px;}
.detail-sec .thumbnail .user span{font-size: 12px;}
.video-sec .user {justify-content: start !important;}
.detail-sec .thumbnail { height: unset; }
.detail-sec .thumbnail .tags{position: relative;left: unset;bottom: unset;margin: 15px 0;}
.detail-sec .thumbnail .user{position: relative;right: unset;bottom: unset;color: black;}

.detail-sec .thumbnail .user h6 a{color: black;}









  }
  @media (max-width:667px) {
    section {padding: 30px 0;}
    .blog-main .blog-card .blog-content h4{min-height:unset;}
  }
  @media (max-width:580px) {

  }
  @media (max-width:575px) {
    .inner-banner h1 {      font-size: 27px;  }
    h2 { font-size: 22px;   line-height: 27px;}
    .inner-banner {min-height: 160px;}
  .right .blog-card .img-box img {
    min-width: 133px;
}
.detail-sec .thumbnail {
  height: unset;
}

.detail-sec .thumbnail .tags {
  bottom: unset;
  left:unset;
  gap: 8px;
}
.video-sec .user{margin-top: 0;margin-bottom: 10px;}
.media-option{flex-wrap: wrap;}

.detail-sec .thumbnail .tags span {
  padding: 3px 9px;
  font-size: 10px;
  border-radius: 2px;
}
  .detail-sec .thumbnail {border-radius: 10px;}
  .video-sec .user h6 a{font-size: 14px;margin-bottom: 0;}
  .detail-sec .thumbnail .user h6 a{ font-size: 14px;  margin-bottom: 0;}
  .media-option img{max-width:12px;}
  .video-sec .user img {width: 60px;}
  .news-later form{flex-direction: column;}
  .detail-sec .thumbnail .effect{top: 18px;}
  .news-later .hs-button{padding: 8px 18px;}
  .news-later h3{font-size: 21px;}
}
@media (max-width:525px) {

  .logo img { max-width: 128px;  }
  .btn-primary { font-size: 13px; padding: 5px 23px;}
  .top_news_sec .left h1{  display: -webkit-box; -webkit-box-orient: vertical;  overflow: hidden;  -webkit-line-clamp: 2;}
}
  @media (max-width:500px) {
  }
  @media (max-width:480px) {

  }
  @media (max-width:450px) {
    .detail-sec p a {font-size: 14px;}
    .blog-main .form-control {width: 100%;}
    .news-later .form-control {font-size: 14px;}
    .left .blog-card .blog-content {padding: 16px 9px;}
    .news-later h2 {font-size: 18px;line-height: normal;}
    .media-option .title {padding: 3px 15px;font-size: 10px;}



  }
@media (max-width:414px) {
.blog-sec .blog-main.row {row-gap: 13px;}
section {padding: 25px 0;}
.blog-card .effect span {font-size: 17px;}
.news-later {padding: 20px 20px;}




}
  @media (max-width:400px) {

  }
  @media (max-width:375px) {

  }
  @media (max-width:360px) {

  }