@media(max-width:992px){
    .header-nav{
        position: fixed;
        top: 0;
        left:-321px;
        width: 320px;
        height: 100vh;
        background: #fff;
        box-shadow: 0px 0px 10px #00000029;
        text-align: left;
        transition: all 0.3s ease-in-out;
    }
    .header-nav.open{
        left: 0;
    }
    .header-nav ul li{
        display: block;
        margin-bottom: 10px;
    }
    .benefit-content{
        text-align: center;
        margin-bottom: 30px;
    }
    .benefit-content h4{
        font-size: 20px;
        width: 100%;
    }
    .benefit-text p{
        font-size: 20px;
    }
    .section-pad {
        padding: 80px 0px;
    }
    .benefit-section {
        padding-top: 200px;
    }
    .superior-section::before , .superior-section.left::before{
        top: auto;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 50%;
        border-radius: 40px 40px 0px 0px;
    }
    .superior-section{
        padding: 40px 0px;
        margin: 0;
    }
    .superior-section .superior-content, .superior-section.left .superior-content{
        padding: 30px 0;
        margin-bottom: 30px;
    }
    .benefits-bx span{
        margin-left: 0;
    }
    .superior-img{
        padding: 30px 0px;
    }
    .footer-bx h4{
        font-size: 16px;
        margin-bottom: 15px;
    }
    .footer-bx{
        margin-bottom: 30px;
    }
    .footer-bx ul li {
        padding-bottom: 5px;
    }
    .footer-top{
        padding-bottom: 30px;
        margin-bottom: 40px;
    }
    .footer-bottom-content{
        margin-bottom: 20px;
    }
    .social-icon{
        text-align: left;
    }
    .inner-banner {
        padding: 120px 0px;
    }
    .knowledge-base-bx{
        margin-bottom: 30px;
    }
    .knowledge-base-bx h4 {
        font-size: 20px;
        margin-bottom: 10px;
    }
}

@media(max-width:767px){
    .home-banner {
        padding-top: 60px;
    }
    .home-banner-content h1{
        font-size: 40px;
    }
    .home-banner-content h4{
        font-size: 20px;
    }
    .benefits-bx-cont h4{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .benefit-text {
        margin-top: 20px;
    }
    .benefit-text p {
        font-size: 16px;
    }
    .pricing-bx{
        width: 100%;
        margin-bottom: 40px;
    }
    .pricing-includ-feature{
        width: 100%;
        height: auto;
    }
    .offer-label{
        right: 20px;
        z-index: 111;
    }
    .pricing-bx-area{
        width: 100%;
    }
    .superior-section::before, .superior-section.left::before{
        height: 40%;
    }
    .section-header h3{
        font-size: 30px;
    }
    .section-header h4{
        font-size: 14px;
    }
    .superior-content h4{
        font-size: 24px;
        margin-bottom: 20px;
    }
    .superior-content p{
        font-size: 14px;
    }
    .inner-banner {
        padding: 80px 0px;
    }
    .blog-bx h3{
        font-size: 20px;
    }
}

@media(max-width:580px){
    .superior-section::before, .superior-section.left::before{
        display: none;
    }
    .header-logo img {
        height: 35px;
    }
    .header {
        padding: 10px 0px;
    }
    .home-banner {
        padding-top: 40px;
    }
    .home-banner-content h1 {
        font-size: 30px;
    }
    .home-banner-content h4 {
        font-size: 16px;
    }
    .main-btn{
        font-size: 14px;
    }
    .benefit-content h4{
        font-size: 16px;
    }
    .benefits-bx{
        padding: 20px;
        border-radius: 15px;
        text-align: center;
        flex-direction: column;
        gap: 15px;
    }
    .benefits-bx-cont{
        width: 100%;
    }
    .section-pad {
        padding: 50px 0px;
    }
    .benefit-section {
        padding-top: 160px;
    }
    .benefits-bx-cont h4{
        font-size: 18px;
    }
    .section-header{
        margin-bottom: 20px;
    }
    .pricing-bx{
        padding-top: 20px;
        padding-right: 10px;
        padding-bottom: 30px;
        padding-left: 10px;
    }
    .pricing-bx-top-content p {
        font-size: 16px;
    }
    .offer-label{
        width: 100px;
        height: 100px;
    }
    .offer-label p{
        font-size: 12px;
    }
    .offer-label h4{
        font-size: 24px;
    }
    .pricing-includ-feature{
        padding: 30px 20px;
    }
    .contact-hosting-partner{
        padding: 20px;
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    .hosting-partner-content h4{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .hosting-partner-content p {
        font-size: 16px;
    }
    .section-header h3 {
        font-size: 24px;
    }
    .table th{
        font-size: 14px;
    }
    .table td{
        font-size: 12px;
    }
    .superior-section .superior-content, .superior-section.left .superior-content {
        padding: 0px;
        margin-bottom: 0px;
    }
    .superior-img{
        padding-bottom: 0px;
    }
    .superior-section{
        padding: 20px 0px;
    }
    .success-stories-content {
        padding: 20px 10px;
    }
    .success-stories-content h4{
        font-size: 18px;
        margin-bottom: 10px;
    }
    .success-stories-content h5{
        font-size: 14px;
    }
    .success-stories-content .btn{
        font-size: 14px;
        padding: 10px 20px;
    }
    .footer{
        padding: 40px 0px;
        border-radius: 20px 20px 0px 0px;
    }
    .footer-bx h4{
        margin-bottom: 10px;
    }
    .footer-bx ul li a{
        font-size: 12px;
    }
    .footer-top{
        padding-bottom: 0px;
        margin-bottom: 20px;
    }

    .footer-bottom-content h4{
        font-size: 12px;
    }
    .footer-bottom-content p{
        font-size: 10px;
    }
    .social-icon ul li a{
        font-size: 16px;
    }
    .pricing-bx-top-content h4{
        font-size: 40px;
    }
    .inner-banner {
        padding: 60px 0px;
    }
}