@media (max-width: 768px) {
body{
    overflow-x: hidden;
}
html{
    overflow-x: hidden;
}

.wa{
    display: none;
}
.headtwotwo{
    display: none;
}
.headtwoone{
    width: 100%;
}
.breaking{
    display: none;
}
.title{
    padding-left: 0px;
    font-size: 34px;
    width: 100%;
    justify-content: center;
    display: flex;
}
.break{
    flex-direction: column;
}
.breakone{
    width: 100%;
    display: flex;
    flex-direction: column;
}
.breakoneone{
    width: 100%;
}

.login{
    padding-left: 0px;
}
.search-box{
    display: none;
}
.breakonetwo{
    width: 100%;
}
.bodyy {
    padding: 0px 20px;
}
.ournetwork {
   
    padding: 30px 20px;
}
.cbody

 {
    padding: 0px 20px;
}
.breaktwo{
    width: 100%;
   display: flex;
   gap: 10px;
}
.breaktwoimg{
    width: 30%;
}
.breaktwoimgg{
    width: 70%;
}
.politicsonetwotwo {
    width: 70%;
}
.politicsonetwoone {
    width: 30%;
}
.what{
    flex-direction: column;
    
}
.whatone{
    gap: 40px;
    width: 100%;
}

.whattwo{
    display: flex;
    width: 100%;
    gap: 10px;
    border-left: 0px;
}
.whatthree{
    width: 100%;
    border-left: none;
    border-right: none;
}
.whatfour{
    width: 100%;
}


.breakone {
    border-bottom: none;
}
.breaktwo {
border-left: none;
}
.court{
    flex-direction: column;
}
.courtone{
    width: 100%;
    display: flex;
    gap: 10px;
}
.courttwo{
    width: 100%;
     display: flex;
    gap: 10px;
    border-left: none;
    border-right: none;

}
.courtthree{
    width: 100%;
     display: flex;
    gap: 10px;
    border-right: none;
}
.courtfour{
    width: 100%;
     display: flex;
    gap: 10px;
    flex-direction: column;
}
.politics{
    flex-direction: column;
}
.politicsonetwo{
    border-left: none;
    border-right: none;
}
.politicsone{
    flex-direction: column;
    width: 100%;
}
.politicsoneone {
    width: 100%;
   display: flex;
}

.politicsonetwo{
    width: 100%;
}
.politicsonethree{
    width: 100%;
}
.politicstwo{
    width: 100%;
}
.craig{
    width: 100%;
}
.promotion{
    flex-direction: column;
}
.promotionone{
    width: 100%;
}
.promotiontwo{
    flex-direction: column;
    width: 100%;
}
.promotiontwoone
 {
    width: 100%;
}
.promotiontwotwo{
    width: 100%;
}
.promotiontwothree{
    width: 100%;
}
.ber{
    display: flex;
    gap: 10px;
}
.uplatetwo{
    border-left: none;
    border-right: none;
}
.ber .breaktwoimg{
    width: 40%;
}
.ber .breaktwoimgg{
    width: 60%;
}
.promotion .breaktwoimg {
    width: 100%;
}
.right-border {
    width: 100%;
}
.whatrepeat .breaktwoimg{
    width: 100%;
}
.courtrepeat .courtone{
    display: flex;
}
.courtrepeat .courtfour{
    display: flex;
  
}
.courtrepeat .courtfour .breaktwoimg{
    width: 100%;
  
}
.courtrepeat .courtfour .breaktwoimgg{
    width: 100%;
  
}
.uplate{
    flex-direction: column;
}
.uplateone
 {
    width: 100%;
}
.uplatetwo
 {
    display: flex;
    width: 100%;
    gap: 10px;
}

.uplateone .breakoneone

 {
    width: 100%;
}
.uplateone .breakonetwo {
    width: 100%;
}
.uplateone .breakone {
gap: 30px;
}

.uplatethree{
    width: 100%;
    display: flex;
    gap: 10px;
}
.lifestyle .courtone{
    flex-direction: column;
}
.lifestyle .courtone .breaktwoimg{
    width: 100%;
}
.courtstwo{
    display: none;
}
.opinion .courtfour{
    flex-direction: column;
}
.wafl .courtone{
    flex-direction: column;
}
.wafl .courtone .breaktwoimg{
    width: 100%;
}
.yourmoney .courtfour{
    flex-direction: row;
}
.property .courtfour .breaktwoimg{
    width: 100%;
}
.food .courtone{
    flex-direction: column;
}
.food .courtone .breaktwoimg{
    width: 100%;
}
.brandd .courtthree{
    display: flex;
    flex-direction: column;
}
.brandd .courtthree .breaktwoimgg{
   width: 100%;
}
.brandd .courtfour .breaktwoimg{
   width: 100%;
}
.educationn .courtfour .breaktwoimg{
    width: 100%;
}
.educationn .courtfour .breaktwoimgg{
    width: 100%;
}
.motoring{
flex-direction: column;
}
.motoringone{
    width: 100%;
}
.motoringtwo{
    width: 100%;
}
.motoringthree{
    width: 100%;
}
.motoringfour{
    width: 100%;
}
.motoring .breaktwoimg{
    width: 100%;
}
.from{
    flex-direction: column;
}
.fromone{
    width: 100%;
}
.fromtwo{
    width: 100%;
}
.fromthree{
    width: 100%;
}
.fromfour{
    width: 100%;
}
.from .breaktwoimg{
    width: 100%;
}
.ournetwork{
    flex-direction: column;
}
.ournetworkone{
    width: 100%;
}
.ournetworktwo{
    width: 100%;
}
.ournetworkthree{
    width: 100%;
}
.ournetworkfour{
    width: 100%;
}
.food .courtthree{
    flex-direction: column;
}
.food .courtthree .breaktwoimg{
    width: 100%;
}
.food .courtone .breaktwoimgg{
    width: 100%;
}
.lifestyle .courtthree{
    flex-direction: column;
}
.lifestyle .courtthree .breaktwoimg{
    width: 100%;
}
.lifestyle .courtthree .breaktwoimgg{
    width: 100%;
}
.wafl .courtthree{
    flex-direction: column;
}
.wafl .courtthree .breaktwoimg{
    width: 100%;
}
.wafl .courtthree .breaktwoimgg{
    width: 100%;
}
.educationn .courtfour{
    flex-direction: column;
}
.educationn .courtfour .breaktwoimg{
    width: 100%;
}
.educationn .courtfour .breaktwoimgg{
    width: 100%;
}




/* category page */

.cbody .breaktwo{
    border-bottom: none;
}

.cbody .whatone{
    display: flex;
    gap: 10px;
}
.cbody .what .rba {
    border-top: none;
}
.cbody .whattwo{
    flex-direction: row;
}
.cbody .whatthree{
   
    gap: 10px;
}
.cnbconeone img {
    width: 100px;
}
.cbody .courtfour{
    flex-direction: row;
}
.cbody .courtrepeat .courtfour .breaktwoimg {
        width: 30%;
    }
    .cbody .courtrepeat .courtfour .breaktwoimgg {
        width: 70%;
    }
    .cbody .courtfour .rba{
        border-top: none;
    }
    .cbody .cnbconetwo a{
        font-size: 1rem;
    }
        .cbody .cnbconetwo svg{
      width: 20px;
      height: 20px;
    }

    /* detailed page */
    .devery{
        flex-direction: column;
    }
    .deveryone{
        width: 100%;
    }
    .deverytwo{
        width: 100%;
    }
    .devery h1 {
       font-size: 1.5rem;
    font-weight: 400;
    color: rgb(43, 44, 45);
    line-height: 1.2;
    }
    .dadrianoneone{
        display: none;
    }
    .dadriantwoo{
        display: none;
    }
    .dbody {
    padding: 0px 10px;
}
.ddelivery{
    flex-direction: column;
}
.ddeliveryone{
    flex-direction: row;
}
.ddeliverytwo {
    width: 100%;
}
.ddeliveryone {
    width: 100%;
}
/* .ddamone img {
    width: 100px;
    height: 100px;
} */
 .ddamtwotwo{
font-size: 1rem;
padding: 5px 0px;
}
.ddamtwothree {
    font-size: 0.90rem;
}
.dget{
    flex-direction: column;
    align-items: start;
    gap: 20px;
}
.dtoo{
    flex-direction: column;
    align-items: start;
}
.dtoooone{
    width: 100%;
}
.dtootwo{
    width: 100%;
    border-right: none;
}
.dtoothree{
    width: 100%;
}
.dtoofour{
    width: 100%;
}
.dfroma{
    flex-direction: column;
}
.dfromaone {
    width: 100%;
}
.dfromatwo {
    width: 100%;
}
.courttwoo{
    width: 100%;
}
.cooo {
        display:none /* Hide entire .cooo div on mobile */
    }

    .cooo .titlee {
        display: block; /* Only show .titlee on mobile */
    }
     .titlee {
        display: block; /* Show .titlee outside its parent .cooo on mobile */
    }
}


@media only screen and (min-width: 820px) and (max-width: 1180px) {

    .bodyy .title{
        font-size: 50px;
    }
    .bodyy .headtwotwo{
        display: none;
    }
     .wa {
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px;
    justify-content: flex-start;
  }

  .wa p {
    display: inline-block;
    white-space: nowrap;
  }

  .breaking a{
    align-items: center;
    font-size: 1.25rem;
  }
  .break{
    flex-direction: column;
  }
  .breakone{
    width: 100%;
  }
 .bodyy .breaktwo{
    display: flex;
    width: 100%;
    gap: 30px;
 }
 .break .breaktwoimg{
    width: 30%;
 }
  .break .breaktwoimgg{
    width: 70%;
 }
 .what{
    flex-direction: column;
 }
 .whatone{
    width: 100%;
 }
  .whattwo{
    width: 100%;
    display: flex;
    gap: 20px;
    border-left: none;
 }
 .breaktwo{
    border-left: none;
 }
  .whatthree{
    width: 100%;
 }
 .whattwo .breaktwoimg{
    width: 30%;
 }
 .whatthree{
    border-left: none;
    border-right: none;
 }
 .whattwo .breaktwoimgg{
    width: 70%;
 }
  .whatfour{
    width: 100%;
 }
 
.politics{
    flex-direction: column;
}
.politicsone{
    width: 100%;
}
.politicstwo{
    width: 100%;
}
.rbaa a

 {
    font-size: .75rem;
}
.politics .pa{
    width: 300px;
    margin: 0 auto;
}
.craig{
    width: 100%;
}



/* category */

  .cbody .title{
        font-size: 50px;
    }
    .cbody .headtwotwo{
        display: none;
    }
   .cbusi .breaktwo{
    width: 100%;
    display: flex;
    gap: 20px;
   }

   /* detailed */
   .dbody .head .headtwoone .title{
    font-size: 50px;
}
.dbody .today{
    font-size: 0.65rem;
}
.dget{
    flex-direction: column;
}


}