@media (min-width: 1800px) {
    .desktop-responsive{
        display: block;
    }
   .mobile-responsive{
       display: none;
   }
   .tab-responsive{
       display: none;
   }
}
@media (min-width: 1601px) {
    .desktop-responsive{
        display: block;
    }
   .mobile-responsive{
       display: none;
   }
   .tab-responsive{
       display: none;
   }
}

@media (max-width: 1600px) {
    .differentes-area {
        margin-top: 65px;
    }
    .desktop-responsive{
        display: block;
    }
    .tab-responsive{
        display: none;
    }
   .mobile-responsive{
       display: none;
   }
   .sec-body {
    overflow: hidden;
}
    .gradient-img {
        height: 500px;
        width: 408px;
    }
    .dots-img {
        height: 313px;
        width: 338px;
    }
    .banner-img {
        height: 409px;
        width: 353px;
    }
    .banner-main {
        margin-top: 75px;
        align-items: flex-start;
    }
    .form-area {
        margin-left: 190px;
        max-width: 350px;
    }
    .green-box {
        top: 40px;
        right: -24px;
    }
    .banner-left .text-area h3 {
        font-size: 38px;
    }
    .banner-left .text-area p {
        font-size: 16px;
    }
    .comment-area .heading-area h4 {
        font-size: 28px;

    }
    .comment-area .num-count .num {
        height: 45px;
        width: 45px;
    }   
    .template-sec .heading-area h5 {
        font-size: 32px;
    }
    .template-sec .heading-area p {
        font-size: 16px;
        line-height: 16px;
    }
    .container {
        max-width: 1180px;
    }
    header {
        padding-top: 15px;
    }
    .banner-left {
        margin-top: 50px;
    }
  
    .img-box {
        max-width: 370px;
    }
    .img-box .tags-area ul li a {
        font-size: 12px;
    }
    .map-area ul li {
        font-weight: 500;
        font-size: 14px;
    }
    .package-box {
        max-width: 370px;
        margin-right: 20px;
    }
    .package-body {
        padding: 25px;
    }
    .package-name h3 {
        font-size: 18px;
    }
    .package-name p {
        font-size: 14px;
    }
    .package-price h2 {
        font-size: 20px;
    }
    .package-offers li {
        padding-left: 32px;
        margin-bottom: 10px;
    }
    .btn{
        height: 40px !important;
    }
    .sec-body .text-area h1 {
        font-size: 30px;
        line-height: 40px;
    }
    .partout-area {
        margin-top: 25px;
        max-width: 65%;
    }
    .template-sec {
        padding: 50px 0;
    }
    .temp-box {
        margin-right: 10px;
    }
    .stories .heading-area h3 {
        font-size: 17px;
        line-height: 21px;
    }
    .modal-dialog {
        width: 100%;
        max-width: 90%;
    }
    .story {
        margin-right: 9px;
    }
    .stories h5 {
        font-size: 12px;
    }
    .temp-box p {
        max-width: 75%;
    }
    .banner-sec {
        padding: 70px 0;
    }
}
@media (max-width: 1400px) {
    .desktop-responsive{
        display: block;
    }
   .mobile-responsive{
       display: none;
   }
   .tab-responsive{
    display: none;
}
}

@media (max-width: 1199px) {
    .desktop-responsive{
        display: block;
    }
   .mobile-responsive{
       display: none;
   }
   .banner-left {
    max-width: 48%;
}
.banner-left .text-area h3 {
    font-size: 24px;
}
.container {
    max-width: 950px;
}
.form-area {
    margin-left: 66px;
}
.green-box {
    top: 40px;
    right: 40px;
}
.calender::after,.camera-man::after,.media::after{
    display: none;
}
.partout-area {
    margin-top: 25px;
    max-width: 58%;
}
.differentes-area {
    margin-top: 25px;
}
.packages-area {
    margin-top: 50px;
    display: flex;
    flex-wrap: wrap;
}
.package-box{
    margin-bottom: 20px;
}
.comment-sec {
    background: #FFFFFF;
    padding: 70px 0;
}
.sec-body {
    margin-top: 50px;
}
.tab-responsive{
    display: none;
}
.map-area ul li {
    font-weight: 500;
    font-size: 13px;
    margin-bottom: 25px;
}
.map-img {
    margin-top: -42px;
    height: 248px;
}
.map-area {
    margin-top: 49px;
    display: flex;
    justify-content: space-between;
    max-width: 90%;
}
}
@media (max-width: 991px) {
    .desktop-responsive{
        display: block;
    }
    .tab-responsive{
        display: block;
    }
   .mobile-responsive{
       display: none;
   }
   .packages-area {
    flex-wrap: wrap;
    justify-content: center;
}
.partout-area {
    margin-top: 25px;
    max-width: 95%;
}
.gradient-img,.dots-img,.banner-img,.green-box,.form-area{
    display: none;
}
.banner-left,.templates-area,.comment-area {
    max-width: 100%;
}
.img-box {
    max-width: 100%;
    width: 100%;
}
.img-box .img-area img{
    width: 100%;
}
.package-box {
    margin-bottom: 20px;
    max-width: 47%;
}
.package-divider {
    width: 100%;
}
.container {
    max-width: 700px;
}
.banner-main {
    margin-top: 0;
}
.comment-sec {
    background: #FFFFFF;
    padding: 70px 0;
}
.map-area ul li {
    margin-bottom: 30px;
}
.sec-body {
    margin-top: 50px;
}
.banner-left .btn-area{
    margin-top: 35px;
}
.contact-modal{
    display: block !important;
}
.contact-modall .banner-main {
    margin-top: 0;
    justify-content: center !important;
}
.modal.contact-modall  .modal-dialog {
    width: 100%;
    max-width: 55%;
}
.contact-modall .modal-body{
    padding: 0;
}
.contact-modall .form-area h1{
    font-weight: bold;
font-size: 24px;
line-height: 36px;

color: #32324E;
}
.card-template {
    display: flex;
    flex-wrap: wrap;
}
.modal-divider{
    display: none;
}
.video-detail {
    max-width: 99%;
}
.close-area{
    display: none;
}
.modal-content-cust {
    width: 100%;
}
.heading-detail{
    display: flex;
    justify-content: space-between;
}
}
@media (max-width: 767px) {
    .desktop-responsive{
        display: none;
    }
   .mobile-responsive{
       display: block;
   }
   .tab-responsive{
       display: none;
   }
    .map-area ul,.gradient-img,.banner-img,.dots-img,.green-box,.banner-right,.calender::after,.camera-man::after,.media::after{
        display: none;
    }
    .banner-left {
        margin-top: 0;
        max-width: 100%;
    }
    .banner-main {
        margin-top: 35px;
    }
    .comment-area,.templates-area,.partout-area {
        max-width: 100%;
    }
     
    .img-box {
        max-width: 100%;
        width: 100%;
        margin-right: 0;
    }
    .img-box .img-area img{
        width: 100%;
    }
    .map-area {
        margin-top: 50px;
        justify-content: center;
    }
    .map-img {
        margin-top: 0;
        height: 308px;
    }
    .differentes-area {
        margin-top: 50px;
    }
    .packages-area {
        margin-top: 50px;
        display: flex;
        flex-wrap: wrap;
    }
    .package-box {
        max-width: 100%;
        margin-right: 0px;
        width: 100%;
    }
    .package-box .img-area img{
        width: 100%;
    }
    .package-box{
        margin-bottom: 25px;
    }
    .sec-body::after{
        background: url(../images/bottom-img-mob.svg) no-repeat;
        height: 124px;
        width: 125px;
        position: absolute;
        right: -12px;
        bottom: -11px;
        top: auto;
    }
    .banner-left .text-area h3 {
        font-size: 32px;
    }
    .banner-left .btn-area{
        margin-top: 48px;
    }
    .banner-sec {
        padding: 100px 0 48px;
    }
    .comment-sec {
        padding: 48px 0;
    }
    .comment-area .heading-area h4 {
        font-size: 24px;
    }
    .comment-area .num-count .dashes-divider {
        margin: 30px auto;
       
    }
    .comment-area .num-count .num {
        height: 48px;
        width: 48px;
    }
    .template-sec .heading-area h5 {
        font-size: 24px;
        line-height: 36px;
    }
    .img-box .tags-area ul li a {
        font-size: 14px;
    }
    .package-body {
        padding: 32px 40px 40px 40px;
    }
    .package-name h3 ,.package-name p,.package-price h2{
        font-size: 16px;
    }
    .sec-body .text-area h1 {
        font-size: 20px;
        line-height: 40px;
    }
    .btn {
        height: 48px !important;
    }
    .sec-body{
        margin-top: 16px;
    }
    .img-box .tags-area ul li {
        margin-right: 4px;
    }
    .card-template {
        display: block;
    }
    .video-detail {
        max-width: 100%;
    }
    .modal-body {
        padding: 0 20px 20px;
    }
    .video-detail h1 {
        font-size: 16px;
    }
    .temp-box p {
        max-width: 90%;
    }
    .temp-box {
        margin-right: 10px;
        height: 178px;
    }
    .stories .heading-area h3 {
        font-size: 20px;
        line-height: 21px;
    }
    .story-3{
        margin-top: 20px;
    }
    .story-1 img {
        height: 200px;
        width: 169px;
    }
    .story-2 img {
        width: 283px;
        height: 200px;
    }
    .story-3 img {
        width: 455px;
        height: 200px;
    }
    .story-area {
        display: flex;
        flex-wrap: wrap;
    }
    .modal-content-cust {
        width: 100%;
    }
    .contact-modall .banner-right{
        display: block;
    }
    .modal.contact-modall .modal-dialog {
        width: 100%;
        max-width: 74%;
    }
    .modal-header h5{
        font-weight: bold;
    font-size: 16px;
    line-height: 150%;
    
    color: #32324E;
    
    }
   
    .map-text {
        position: absolute;
        top: 43%;
        left: 44%;
    }
    .map-text h3{
        font-weight: bold;
font-size: 24px;
line-height: 36px;
text-align: center;
color: #32324E;
    }
    .map-text a{
        font-weight: 500;
font-size: 16px;
line-height: 150%;
text-align: center;
display: block;
color: #1087FE;
    }
    .map-area{
        position: relative;
    }
    .contact-modall .form-area {
        margin-left: 0px;
     padding: 30px 0;
    box-shadow: none;
    }
}
@media (max-width: 575px) {
    .desktop-responsive{
        display: none;
    }
    .map-text {
        position: absolute;
        top: 43%;
        left: 40%;
    }
    .modal.contact-modall .modal-dialog {
        width: 100%;
        max-width: 95%;
    }
    .tab-responsive{
        display: none;
    }
   .mobile-responsive{
       display: block;
   }
   .story-1 img{
    height: 144px;
    width: 114px;
}
.story-2 img {
    width: 162px;
    height: 144px;
}
.story-3 img{
    width: 300px;
    height: 140px;
}
.modal.show .modal-dialog {
    width: 100%;
    max-width: 90%;
    margin: 25px auto;
}
.template-sec .heading-area h5 {
    font-size: 24px;
    line-height: 26px;
}
.template-sec .heading-area p {
    padding: 10px 0;
}
.packages-area {
    margin-top: 25px;
    display: flex;
    flex-wrap: wrap;
}
.contact-modall .form-area {
    margin-left: 0px;
    padding: 30px 15px;
    box-shadow: none;
}
}
@media (max-width: 374px) {
    .desktop-responsive{
        display: none;
    }
   .mobile-responsive{
       display: block;
   }
   .tab-responsive{
    display: none;
}

}