:root {
    --green: #C74625;
    --brown: #444444;
    --white: #fff;
}
/* @media (min-width: 768px) and (max-width: 1200px){
    .mobile-shape-cover{
        display: none;
    }
}   */


/* ============= responsive css here ============== */





/* =========  Small devices (phones, up to 600px) ========= */
@media only screen and (max-width: 600px) {   
    
    .fiber-heading{
          margin: 0px 0px 130px 0;
}
        .side-claim p {
        margin-bottom: 0%;
        font-size: 10px;
        white-space: nowrap;
        }
        .perfect{
            margin-left:90px;
        }
        .perfect h2{
            margin-left:42px;
        }
        .plan-claim-conent{
            display: flex;
    justify-content: center;
    padding-top: 20px;
        }
        .side-claim h3 {
            font-size: 13px;
        }
        .claim {
            width: 17rem;
            top: -5rem;
            left: -5rem;
            /*display:none;*/
        }
        .claim .claim-box {
                   top: 43px;
        left: 30px;
        }
        .claim-box ul {
            margin-bottom: 4px;
                    font-size: 12px;
        }
        .claim-box h2 {
            font-size: 14px;
        }
       
        .fiber-heading h1 ,
        .fiber-heading h2 {
            color: #fff;
        }
        .fiber-heading h2 {
        margin-bottom: 50px;
                font-size: 11px;
            color: #fff;
            text-shadow: 3px 1px 10px black;
        }
        .sub-heading h2, .sub-heading2 h2 {
        padding: 10px 5px;
        }
        .claim {
            width: 162px;
           top: 118px;
        left: -31px;
            margin-top: 0;
        }
        .price-text{
            font-size: 1.2rem;
        }
        .btn-green {
    font-size: 13px;
    padding: 5px 31px;
        }
        ul {
    padding-left: 15px;
    }
   .shape-cover {
       width: 162px;
        top: 43px;
        left: -31px;
        margin-top: 0;
   }
   .shape-cover .side-claim {
    top: -116px;
    left: 46px;
}
        .sub-heading h2,
        .sub-heading2 h2{
            font-size: 12px;
        }
        .fiber-plans,
          .get-offer{
            background-position: 34%;
        }
    
        .get-offer-box p {
             font-size: 13px;
        }
        .benifits{
            padding-top: 50px;
        }
        .get-offer-box ul li,
        .plan-claim-conent ul li {
        font-size: 13px;
    }
    .fiber-heading {
         margin-top: 0; 
         margin-bottom: 140px;
    }
    .fiber-heading h1 {
        font-size: 19px;
                margin-bottom: 9px;
            text-shadow: 3px 1px 10px black;
    
    }
    
 
    .mobile-claim {
        position: relative;
        padding: 32px 0;
    }
    .claim-box {
        position: absolute;
        top: 7rem;
        left: 7rem;
        color: #fff;
    }
      .claim-box h2 {
        font-size: 9px;
        margin-bottom: 3px;
        }
        .price-text {
            font-size: 20px;
            font-weight: 700;
        }
        
        .mobile-claim .shape1 {
         position: absolute;
        left: 0;
        animation: rotate 18s linear infinite;
        }
        
        @keyframes rotate {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(360deg);
        }
    }
    .mobile-claim .shape2 {
              
        left: 0;
        animation: rotate2 18s linear infinite;
        }
        @keyframes rotate2 {
        from {
            transform: rotate(0deg);
        }
        to {
            transform: rotate(-360deg);
        }  
        }
        .side-claim {
        position: absolute;
        top: 7rem;
        left: 4rem;
        color: #fff;
        }
        .mobile-shape-cover .shape1 {
                animation: rotate 18s linear infinite;
        }
        .mobile-shape-cover .shape3 {
                margin-top: -312px;
                animation: rotate2 18s linear infinite;
        }
        .mobile-shape-cover{
                position: relative;
                
        }
        .mobile-shape-cover     .side-claim{
                position: absolute;
        }
        .plan-claim {
            padding-bottom: 50px !important;
        }   
        footer p {
    font-size: 11px;
}
        footer a {
    font-size: 11px;
}
    .footer-links {
        padding-top: 20px;
    }
    .fmail{
        font-size:13px;
        text-align: center;
    }
    .get-btn {
    text-align: center !important;
}
}

/* ========== Medium devices (tablets, 601px to 900px) ======= */
@media only screen and (min-width: 601px) and (max-width: 900px) {
    .mobile-claim{
        display: none;
    }
    
        .claim {
            top: -6rem;
        }
        .claim .claim-box {
            top: 71px;
            left: 62px;
        }
        .shape-cover .side-claim{
        top: -74px;
        left: 73px;
        }
        .plan-claim .sub-heading2 h2{
            margin-left: 35px;
        }
        .get-offer-box p i{
            color: var(--green);
        }
        .get-offer-box ul li::marker{
            color: var(--brown);
        }
        .benifits{
            padding-top: 100px;
        }
        .get-offer-box p{
        font-weight: 700;
         font-size: 1.2rem;
        }
        .get-offer-box ul li,
        .plan-claim-conent ul li {
            font-size: 1.2rem;
        }
        .mobile-claim {
            display: none;
        }
        .side-claim p {
            font-size: 16px;
        }
        .side-claim h3{
            font-size: 20px;
        }
        .fiber-heading {
    margin: 51px 0px 0 0;
    }
    .fiber-plans {
     background-position: center;   
    }
        .claim {
        top: -112px;
        left: -21px;
    }
    
}



/* ========== Large devices (desktops, 901px to 1200px) ======== */
@media only screen and (min-width: 901px) and (max-width: 1200px) {
    .mobile-claim{
        display: none;
    }
    .claim {
    margin-top: 250px;
    }
    .fiber-heading {
    padding-bottom: 200px;
    }
    .benifits {
        padding-top: 100px;
    }
}

/* ========== Extra large devices (large desktops, 1201px and up) ==== */
@media only screen and (min-width: 1201px) {
    /*.fiber-heading h1 {*/
    /*    font-size: 40px;*/
    /*font-weight: 700;*/
    /*color: #534234;*/
    /*}*/
    .fiber-plans,
    .get-offer {
        height: 780px;
    }
    .benifits{
        padding-top: 100px;
    }
    .shape-cover {
        left: 130px;
    }
      .mobile-claim {
    display: none;
}
.mobile-shape-cover{
        display: none;
    }
 
}