 /* ------------------------
    Responsive Css
------------------------*/
 @media (min-width:1600px) {
     .header .container-fluid {
         padding: 0 12rem;
     }
 }

 @media (max-width:1600px) {
     .swiper-slide.swiper-slide-active .portfolio-item {
         margin: 40px;
     }
 }

 @media (max-width:1500px) {
     .hero-shape1 {
         transform: rotate(-10deg);
         top: -15%;
         right: -7%;
     }

     .banner-3 {
         padding: 220px 0 310px;
     }
 }

 @media (max-width:1200px) {
     .navbar-nav .nav-item {
         margin: 0 10px;
     }
 }

 @media (max-width:992px) {
     h1 {
         font-size: 60px;
         line-height: 70px;
     }

     h2 {
         font-size: 44px;
         line-height: 54px;
     }

     h3 {
         font-size: 30px;
         line-height: 40px;
     }

     h4 {
         font-size: 26px;
         line-height: 36px;
     }

     /*Header*/
     .header .themeht-btn {
         display: none;
     }

     .navbar-nav .nav-item {
         margin: 0;
     }

     .navbar-toggler {
         background: var(--themeht-white-color);
         height: 50px;
         width: 50px;
         padding: 0;
         border-radius: 10px;
         margin-left: auto;
     }

     .navbar-toggler:focus {
         box-shadow: none;
     }

     .ht-toggler svg {
         width: 40px;
         height: 40px;
         display: inline-block;
     }

     .ht-toggler .line {
         fill: none;
         stroke: var(--themeht-primary-color);
         stroke-width: 6;
         transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1), stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
     }

     .ht-toggler .line1 {
         stroke-dasharray: 60 207;
         stroke-width: 3;
     }

     .ht-toggler .line2 {
         stroke-dasharray: 60 60;
         stroke-width: 3;
     }

     .ht-toggler .line3 {
         stroke-dasharray: 60 207;
         stroke-width: 3;
     }

     .ht-toggler[aria-expanded="true"] .line1 {
         stroke-dasharray: 90 207;
         stroke-dashoffset: -134;
         stroke-width: 3;
     }

     .ht-toggler[aria-expanded="true"] .line2 {
         stroke-dasharray: 1 60;
         stroke-dashoffset: -30;
         stroke-width: 3;
     }

     .ht-toggler[aria-expanded="true"] .line3 {
         stroke-dasharray: 90 207;
         stroke-dashoffset: -134;
         stroke-width: 3;
     }

     .navbar-collapse {
         background: var(--themeht-white-color);
         max-height: 400px;
         left: 0;
         padding: 20px;
         position: absolute;
         z-index: 99;
         top: 100%;
         width: 100%;
         overflow: auto;
         box-shadow: 0px 10px 35px 0px rgba(0, 0, 0, 0.1);
         border-radius: 20px;
     }

     .navbar-nav .dropdown-toggle::after {
         position: absolute;
         top: 50%;
         right: 0;
         transform: translateY(-50%);
     }

     .navbar-nav .dropdown-submenu .dropdown-toggle::after {
         top: 18px;
     }

     .navbar-nav .nav-link {
         padding: 10px 0 !important;
         color: var(--themeht-text-color);
     }

     .navbar-nav .nav-item .nav-link.active,
     .navbar-nav .nav-item .nav-link:focus,
     .navbar-nav .nav-link.show {
         border-bottom: 1px solid var(--themeht-border-light-color);
         color: var(--themeht-primary-color);
     }

     .navbar-nav .dropdown-menu .dropdown-item {
         color: var(--themeht-text-color);
         display: block;
     }

     /*Banner*/
     .page-title {
         padding: 160px 0;
     }

     .page-title h1 {
         font-size: 40px;
         line-height: 50px;
     }

     .header-right {
         margin-left: 20px;
     }

     .banner {
         padding-bottom: 120px;
     }

     .img-bg-shape {
         width: 110%;
     }

     .banner-2,
     section {
         padding: 50px 0;
     }

     .banner-shape2 {
         width: 100%;
     }

     .hero-shape1 {
         transform: rotate(0);
         top: 0;
         right: 0;
     }

     .banner-3 {
         padding: 220px 0 150px;
     }

     .bg-effect::after {
         left: -20%;
         width: 110%;
     }

     /*Masonry*/
     .grid.columns-3 .grid-item,
     .masonry.columns-3 .masonry-brick {
         width: 50%;
     }

     /*Countdown*/
     .countdown>li span {
         font-size: 50px;
         line-height: 50px;
     }

     .countdown>li p {
         font-size: 18px;
     }

     .testimonial-box {
         padding: 20px;
     }

     .swiper-slide.swiper-slide-active .portfolio-item {
         margin: 0;
     }

     .testimonial.style-1 {
         padding: 30px;
         display: block;
     }

     .testimonial.style-1 .testimonial-img {
         margin-right: 0;
         margin-bottom: 30px;
     }

     .testimonial p {
         font-size: 20px;
         line-height: 34px;
     }

     .testimonial.style-2 {
         margin: 50px 10px;
     }

     .tab .nav-tabs .nav-link {
         margin-bottom: 20px;
     }

     .rocket-shade {
         top: -15%;
         width: 20%;
     }

     .testimonial.style-3 {
         padding: 60px 40px;
     }

     .testimonial.style-3 .testimonial-img {
         width: auto;
         position: inherit;
         left: 0;
         top: inherit;
         transform: inherit;
     }

     .testimonial.style-3 .testimonial-content {
         padding: 50px 30px;
     }

     .testimonial.style-3 .testimonial-img img {
         height: 600px;
     }

     .service-item.style-2 {
         padding: 40px 30px 70px;
     }

     .featured-item.style-3 {
         margin-left: 35px;
     }

     .featured-item.style-3.text-end {
         margin-left: 0;
         margin-right: 35px;
     }

     .tab.style-2 .nav-tabs .nav-link {
         width: 50%;
         padding: 20px 30px;
     }
 }

 @media (max-width:767px) {

     .logo img {
         max-height: 70px;
     }

     h2 {
         font-size: 34px;
         line-height: 44px
     }

     .theme-title h2 {
         font-size: 34px;
         line-height: 44px;
     }

     .page-title h1 {
         font-size: 30px;
         line-height: 30px;
     }

     .marquee-text span {
         font-size: 30px;
         line-height: 80px;
     }

     .marquee-wrap.style-2 {
         padding: 30px 0;
     }

     .banner h1 span {
         font-size: 70px;
     }

     .header-right {
         margin-left: 0;
         display: none !important;
     }

     /*Countdown*/
     .countdown {
         margin: 40px 0;
         padding: 40px 0;
     }

     .countdown>li span {
         font-size: 40px;
         line-height: 40px;
     }

     .countdown>li p {
         font-size: 16px;
     }

     .testimonial-carousel .controls li {
         width: 30% !important;
         text-align: center;
         margin-top: 1rem;
         position: relative;
         left: inherit !important;
         right: inherit !important;
         top: inherit !important;
         bottom: inherit !important;
     }

     .testimonial-carousel .controls li img {
         width: 60px;
     }

     .testimonial.style-3 .testimonial-img img {
         height: 300px;
     }

     /*Iframe*/
     .iframe-h {
         height: 300px !important;
     }

     blockquote {
         padding: 140px 40px 40px 40px !important;
     }

     blockquote:after {
         width: 100%;
         height: 100px;
     }

     .subscribe-btn {
         position: relative;
         right: inherit;
         top: inherit;
         width: 100%;
         margin-top: 10px;
     }

     .tab .nav-tabs .nav-link {
         margin-right: 0;
         font-size: 20px;
     }

     /*Portfolio*/
     .portfolio-filter {
         border-radius: 20px;
     }

     .portfolio-filter button {
         float: none;
         display: block;
     }

     .portfolio-filter button+button {
         margin-left: 0;
         margin: 5px 0
     }

     .grid.columns-2 .grid-item,
     .masonry.columns-2 .masonry-brick,
     .grid.columns-3 .grid-item,
     .masonry.columns-3 .masonry-brick {
         width: 100%;
     }

     .price-table.price-active {
         transform: inherit;
     }

     .mask-img {
         height: 332px;
     }

     .rocket-shade {
         display: none;
     }

     .bg-effect::after {
         left: 0;
         width: 100%;
         transform: inherit;
     }

     .post-card.style-2 {
         display: block;
     }

     .post-card.style-2 .post-desc {
         padding: 30px 0 0;
     }

     .step-item.style-2.left-side {
         text-align: center;
         display: block;
     }

     .step-item.style-2.left-side .step-icon {
         margin-bottom: 30px;
         margin-right: 0;
     }

     .banner-6 {
         padding: 170px 20px 120px;
     }
 }

 @media (max-width:576px) {

     /*Countdown*/
     .countdown {
         margin: 30px 0;
     }

     .countdown>li {
         padding: 0 10px;
     }

     .countdown>li p {
         font-size: 14px;
         line-height: 24px;
     }

     .post-comment li {
         display: block;
     }

     .author-img {
         margin-right: 0;
         margin-bottom: 30px;
     }

     .comment-reply {
         position: inherit;
         top: inherit;
         right: inherit;
         margin-top: 30px;
     }

     .service-item.style-4 {
         display: block;
     }

     .service-item.style-4 .service-icon {
         margin-right: 0;
         margin-bottom: 30px;
     }
 }