@media screen and (max-width: 920px) {
   .blackBar {
   display: none;
}
   .order {
      margin-left: 50%
   }

}

@media screen and (max-width: 768px) {

.navigation {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr ;
    padding-top: 0px;
    margin: auto;  
}

.bgImg {
    background-image:linear-gradient(rgba(0,0,0,0.65),rgba(0,0,0,0.65)),
     url(https://websitedemos.net/clothing-store-04/wp-content/uploads/sites/1538/2025/05/home-hero-bg.jpg);
    width: 100%;
    height: 60vh;
    background-repeat: no-repeat;
    background-size: cover;
    display: grid;
    align-items: center;
    }

 .contentBox {
        height: 300px;
        width: 100%;
        display: grid;
        align-items: center;

    }

    .contentHead {
        font-size: 1rem;
        text-align: center;
        padding-top: 40px;
    }
    
      .contentMessage {
        height: 100px;
        width: 90%;
        line-height: 1.5rem;
        padding-top: 10px;
        font-size: .9rem;
    }

     .firstBtn {
      margin-top: -10px;
        height: 50px;
        width: 260px;   
        display: grid;
        align-content: center;
    
    }

 .headBar2 {
        height: 280px;
        width: 90%;
        display: grid;
        grid-template-columns: 1fr;   
        text-align: center;
    }

     .head2, .head3{
            font-family: 'source 3', sans-serif;
            font-size: 1.45rem;
            padding-top: 60px;
            margin-bottom: 10px;

    }

    .head2 p {
      line-height: 1.5rem;
      font-size: 1rem;
      margin-top: 10px;
    }

     .elemenatorBtn {
   margin: auto;
   margin-top: -50px;
    }

}

@media screen and (max-width:550px){

     .product {
        display: grid;
        grid-template-columns: 1fr 1fr; 
    }

 .shoppingPage {
        height: 190vh;
    }
.shoppingPage2{
   height: 190vh;

}
     .box3 {
        margin-top: -180px;
    }


}

@media screen and (max-width:1275px){
    .adImg {

   margin-top: -100vh;


}  

}

@media screen and (Max-width:860px) {
    .adPage {
   display: grid;
   grid-template-columns: 1fr;

}

.bg1 {
   height: 0;
   width: 0;
}
.bg2 {
   height: 70vh;
   margin: 0 auto;
}

.adImg {
   
   display: grid ;
   grid-template-columns:1fr;
   margin-top: -95vh;
   height: 70vh;
   display: grid;
   align-items: center;
}

.imbox {
   width: 0; 
}
 .adcontentbox{
   height: 45vh;
   width: 90%;
   padding-right: 0;
   margin: 0 auto;
   margin-top: -10vh;
  
 }

 .msgBox h4 {
    font-size: 1.1rem;
 }

  .msgBox {
  margin:0;
  width: 95%;
   font-size: 15px;
  }

 .element-btn{
   margin: 0 auto;
   margin-top: 40px;
 }

 .msgBox{
   margin-top: 10px;
    text-align: center;
    line-height: 22px;  
 }         

 .msgBox h4 {
    margin-bottom: -10px;
 }

   .categary {
   height: 400vh;
 }

    .firstContainer,.secondContainer 
{  
   width: 95%;
   display: grid;
   grid-template-columns: 1fr;
}

.photos2,.photos4{
    margin-top: 50px;
}

}

@media screen and (max-width:1060px) {

   .about-msg{
   height: 150px;
   width: 100%;
}

.about-msg h2 {
    font-size: 1.875rem;
    font-weight: 700;
    font-family: 'Source Sans 3', sans-serif;
    margin-bottom: 20px;
}
   
}

@media  screen and (max-width:1190px) {

    .doctor-1,.doctor-3,.doctor-2 {
   height: 75%;
}
    
.doc-container {
   height: 100%;
   margin-top: -100px;
}

.doctor-details {
   height: 120vh;
   margin-top: -100px;
}

}

@media  screen and (max-width:825px) {

    .doc-container {
   height: 90%;
   display: grid;
   grid-template-columns: 1fr;
}
    
   .doctor-1,.doctor-3,.doctor-2 {
   height: 90%;
}

.doctor-1,.doctor-3{
    margin-top: 50px;
}

.doctor-details {
   height: 220vh;
}

}


@media  screen and (max-width:525px) {
   
   .doctor-1,.doctor-3,.doctor-2 {
   
   height: 95%;
}
}


@media  screen and (max-width:1002px) {

    .workBar {
   height: 43vh;
   
}
    
.ig-msgContainer {
   width: 30%;
}
}


@media  screen and (max-width:925px) {

    .workBar {
   height: 55vh;
}
    
.shop-workPage {
   height: 110vh;
   width: 100%;
   background-color:#f7eced;
}

}


@media screen and (max-width:830px){

   .work-container {
   height: 60vh;
    display: grid;
   grid-template-columns: 1fr;
}
  .workBar {
   height: 90vh;

}


.work-box1,.work-box2 {
   border-bottom: solid 1px rgba(0, 0, 0, 0.3);
   border-right: none;
}
   
.work-box1 {
   margin-top: -45px;
  height: 25vh;
}

.work-box2,.work-box3 {
   padding-top: 20px;
   height: 25vh;
}

.shop-workPage {
   height: 150vh;
}
}


@media screen and (max-width:1236px){
   .email-box button{
   height: 40px;
   width: 130px;
   margin: 0 auto;
}
   
.email-box {
   width: 50%;
 
   margin-top: 60px;
   height: 20vh;
   display: grid;
   align-items: center;
 

}

.offer-container {
   height: 65vh ;
   width: 100%;
}

}


@media  screen and (max-width:1020px) {

   .email-box input{
   height: 44px;
   width: 362px;
   margin:auto;
}

.email-box {
   width: 75%;
}

  .email-box button{
   height: 40px;
   width: 362px;
   margin: 0 auto;
}
   
}

@media  screen and (max-width:780px) {
    .order {
      margin-left: 30%
   }

   .instagram-page {
   height: 160vh;
   width: 100%;
   background-color: white;
 
}

.instagram-photos {
   height: 80%;
   width: 95%;
   display: grid ;
   grid-template-columns: 1fr 1fr;
}


.ig-photo1 img,.ig-photo2 img,.ig-photo3 img,.ig-photo4 img {
   width: 80%;
}

.ig-msgContainer {
   width: 60%;
   border: solid 1px red;
   margin-top: 30px;
}

.final-page {
   height: 200vh;
}

.final-container {
   display: grid;
   grid-template-columns: 1fr;
   margin-top: 20px
}

.final-box1 img {
   width: 200px;
   margin-top: 0%;
}

.final-box2 h6 ,.final-box3 h6,.final-box4 h6,.final-box5 h6{
   margin-top: 15px;
}

}


@media screen and (max-width:710px) {

 .last-msgBar,.cards {
   display: grid;
   grid-template-columns: 1fr;
}
   
.images img {
   float:none;
  display: flex;
  justify-self:center;
}

#last-msg {
    text-align: center;
}
}

@media  screen and (max-width:640px) {

   .ig-photo1 img,.ig-photo2 img,.ig-photo3 img,.ig-photo4 img {
   width: 95%;
}

 .order {
      margin-left: 20%
   }
   
}


@media  screen and (max-width:760px) {

.order-summary {
   height: 130vh;
   display: grid;
   grid-template-columns: 1fr;
}

.or-icn1,.or-icn2,.or-icn3,.or-icn4{
   margin-top: 5%;
}

.headBar3 {
        width: 50%;
      
    }
   
}


@media screen and (max-width:1020px){

   .productBar-1, .productBar-2, .productBar-3 {
        height: 550px;
        width: 95%;
        display: grid;
        margin: 0 auto;
       
    }
   
}


@media screen and (max-width:550px){

   .productBar-1, .productBar-2, .productBar-3 {
        height: 950px;
        width: 95%;
        display: grid;
        margin: 0 auto;
       
    }
   
}

@media screen and (max-width: 300px) {
   .bgImg {
    background-image:linear-gradient(rgba(0,0,0,0.65),rgba(0,0,0,0.65)),
     url(https://websitedemos.net/clothing-store-04/wp-content/uploads/sites/1538/2025/05/home-hero-bg.jpg);
    width: 100%;
    height: 40vh;
    background-repeat: no-repeat;
    background-size: cover;
    display: grid;
    align-items: center;
    }
.order {
   display: grid;
   grid-template-columns: 1fr;
   background-color: red;
   border: solid 1px red;
}
.navBar {
    height: 78px;
    width: 100%;
    margin: 0 auto;
    background-color: white;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

}