html {
    
}
*{margin: 0;
  padding: 0;
    
    scroll-behavior: smooth;
    background: transparent;
}       
body{
    
}
.container *{
    
    border: none;
    background: transparent;
    
}
body.index{
    color: #773344;
    background: transparent;
    
    
}
.container{
    background-color: #f5e9e2;
    display: flex;
    flex-direction: column;
    position: relative;
    scroll-behavior: smooth;
    width: 100%;
    position: relative;
    
}
.navbar{
    display: flex;
    justify-content: space-around;
     /*background-color: rgb(222, 236, 16);*/
     
    height: 75px;
    margin: 1px;
    align-items: center;
    color: #773344;
    border: none;
    background: transparent;
    margin-bottom: 30px;
}
.navbar ul{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    width: 70%;
    color: #773344;
    border: none;
    background: transparent;
    align-items: center;
}
.logo h1{
    width: 70px;
    height: 50px;
    border: none;
    background: transparent;
    font-size: 50px;
    font-weight: bolder;


}
.navbar.logo{
    width: 40%;

}
.navbar li{
    list-style-type: none;
    width: 100px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: bolder;
    color: #0b0014;
    height: 50px;
    font-size: x-large;
    color: #773344;
}
ul a{
    text-decoration: none;
    color: #000;
}

.nav-link li:hover{
    background-color: #773344;
    color: #e3b5a4;
    width: 80px;
    height: 40px;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.home-introBox{
    width: 100%;
    min-height: 300px;
    
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    
}
.home-info{
    width: 50%;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;

}
.home-info p{
    font: bolder;
    font-size: xx-large;
    
}
.home-img1{
    width: 40%;
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #773344;
    border-radius: 60%  30% 60% 30%;

}
.home-img1 img{
    height: 300px;
    width: 300px;
}
.chooseus{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    min-height: 500px;

}
.choose-ul{
    width: 40%;
    height: 500px;
    display: flex;
    flex-direction: column;
    font-size: x-large;
    align-items: flex-start;
    justify-content: space-evenly;
    padding-left: 20px;
    
    text-wrap: wrap;
}
.choose-ul ul{
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    font-size: small;
    font-weight: bolder;

}
.home-img2{
    width: 50%;
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #773344;
    border-radius: 10% 50% 30% 50%;

    
    
}
.home-img2 img{
    
        height: 300px;
        width: 300px;
}

.explore{
    color: #e3b5a4;
    background-color:#773344;
    width: 150px;
    height: 60px;
    border: none;
    border-radius: 30px;
    margin-bottom: 50px;
    cursor: pointer;
    font-size: larger;

}
body.contactpage{
    
    
    
background-color:#9e9e9e;
color: #ffc482;
     border: none;
     padding: 30px;
}
.contact-container{
   display: flex;
   flex-direction: column;
   scroll-behavior: smooth;
    
    align-items: center;
    color: #ffc482;
    background-color:rgb(219, 219, 219);
color: #d2a226;
     border: none;
     
    


}
.contact-ustitle{
    font-size:70px;
    color: #d2a226;
}
.contact-container *{
   
    

}
.contact-details{
    width: 100%;
    min-height: 400px;
   /* border: 5px solid rgb(49, 245, 0);*/
    display: flex;
    flex-direction: row;
    border: none;
    flex-wrap: wrap;
    padding-top: 30px;
    justify-content: space-around;
    margin-bottom: 25px;
    font-size: 30px;
    padding-left: 10px;
    margin-top: 30px;
    
}
.contact-details-conainer{
    

    width: 70%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;

    min-height: 500px;
    font-size: 40px;

}
.contact-details-conainer *{
    gap: 30px;
    margin-bottom: 24px;
}
.contact-details-img{
    width: 30%;
    height: 400px;
}
.contact-details-img img{
    width: 250px;
    height: 250px;
}
.whatsapp-btn{
    width: 150px;
    height: 60px;
    background-color: rgb(64, 235, 64);
    color: white;
    border: none;
    border-radius: 30px;
    font-size: 30px;
    font-weight: bolder;
    text-decoration: none;
}
.contact-details-conainer a{
    text-decoration: none;
}
.address-container{
    width: 100%;
    height: 250px;
   /* border: 5px solid rgb(184, 46, 46);*/
    display: flex;
    flex-direction: row-reverse;
    border: none;
    justify-content:space-around;
    align-items: center;
    margin-top: 30px;
    
    
}
.address{
    width: 50%;
    height: 245px;
    /*border: 2px solid yellow;*/
    text-align: center;
    padding-top: 5px;
    align-items: center;
    font-family: Arial, Helvetica, sans-serif;
    
}

.address-img{
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 245px;
    width: 50%;
    
}
.address-img img{
    width: 250px;
    height: 205px;
}

.address h1{
    margin-top: 20px;
    font-size: 80px;
    width: 100%;
    text-wrap: nowrap;
    text-align: center;
}
.address p{
    
    font-size: 40px;
    color: #d2a226;
    padding-top: 30px;
    width: 80%;
    padding-left: 20px;
}
.address-map-container{
    width: 100%;
    height: 245px;
   /* border: 2px solid rgb(143, 7, 255);*/
   margin-top: 50px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

}
.address-map iframe{
    border-radius: 10px;
}
.map-img{
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.map-img img{
    width: 250px;
    height: 250px;
}
.contact-details .mid-text{
    font-size: xx-large;
    font-weight: 900;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    margin-left: 20px;
    color: #d2a226;
    padding-left: 30px;
    
}
.large-text{
    font-size:55px ;
    font-weight: 900;
    font-family: monospace;
    color: #d2a226;
    padding: 30px;
    margin-bottom: 20px;
}

.contact-form{
    width: 100%;
    
   /* border: 5px solid rgb(240, 20, 123);*/
    display: flex;
    margin-top: 20px;
    
    border: none;
    color: #d2a226;
    font-weight: bolder;
    font-size: xx-large;
    justify-content: center;
    align-items: center;
   
}
form{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
}
.input-name,.input-num,.input-mail{
    width: 480px;
    height: 45px;
    border-radius: 20px;
    margin-top: 50px;
    border: #000 solid 1px;
    background-color: lightgray;
    
    /*border: 2px solid black;*/
}
.input-name,.input-num,.input-mail ::after{
    border: #000 solid 1px;
    
}
.input-msg{
    width: 480px;
    height: 150px;
    border-radius: 20px;

    border: #000 solid 1px;
    background-color: lightgray;
    
}
.input-name::placeholder{
    color: #d2a226;
    font-size: large;
    font-style: italic;
    text-align: center;

}
.input-num,::placeholder{
    color: #d2a226;
    font-size: large;
    font-style: italic;
    text-align: center;
  

}
.input-mail::placeholder{
    font-size: large;
    font-style: italic;
    color: #d2a226;
    text-align: center;

}
.input-msg::placeholder{
    font-size: large;
    font-style: italic;
    color: #d2a226;
    text-align: center;
}

label{
    padding: 10px;
}
.submit{
    width: 150px;
    height: 60px;
    color: rgb(0, 0, 0);
    border-radius: 30px;
    background-color: #d2a226;
    border: none;
    font-size: large;
    margin-top: 15px;
    margin-left: 40%;
}
.pricing-body{
   padding: 0px; 
   background-color: #6320ee;
   
}
.pricing-container{
    display: flex;
    flex-direction: column;
    color: #f8f0fb;
    padding: 0px; 
    background-color: #030303;
    scroll-behavior: smooth;
    -webkit-backdrop-filter: blur(50px);
    backdrop-filter: blur(10px);
    
}
.services-pageHeading{
    text-align: center;
    font-weight: bolder;
    font-size: 100px;
    margin-top: 30px;
    margin-bottom: 30px;
    
}
.fabric-cloths{
    width: 100%;
    min-height: 400px;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;

    
}
.service-info{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    
    height: 50px;
    font-style: italic;

}
.fabric-cloths p{
    font-size: x-large;
}
.fabric-cloths  h2{
    font-weight: bolder;
    font-size: xx-large;
}
.fabric-1{
    width: 20%;
    min-height: 200px;
    border: #141212 2px solid;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    padding: 15px;
    background-color: #1a1a1a;
   /* box-shadow: 10px 10px 20px rgba(110, 107, 107, 0.5);*/
}
.fabric-2{
    width: 20%;
    min-height: 200px;
    border: #141212 2px solid;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    padding: 15px;
    background-color: #1a1a1a;
   
    
}
.fabric-3{
    width: 20%;
    min-height: 200px;
    border: #141212 2px solid;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    padding: 15px;
    background-color: #1a1a1a;
 
    
}
.fabric-4{
    width: 20%;
    min-height: 200px;
    border: #141212 2px solid;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    padding: 15px;
    background-color: #1a1a1a;
    
}
.pricing{
    width: 100%;
    min-height: 250px;
   /* border:  2px solid rgb(255, 255, 255);*/
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    
}
.price-elements{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 20px;
    color: rgb(218, 218, 218);
    gap: 20px;
   
    
}
.pricing .pricing-title{
    text-align: center;
    margin-top: 15px;
    font-size: 80px;
    
}
.price-1{
    width: 30%;
    border: #141212 2px solid;
    background-color: #1a1a1a;
    min-height: 500px;
    border-radius: 5%;
    display: flex;
    flex-direction: column;
    gap: 25px;
    align-items: center;
    margin-right: 10px;
    justify-content: space-evenly;
  
    
}
.price-2{
    width: 30%;
   min-height: 500px;
   border: #141212 2px solid;
    background-color: #1a1a1a;
    border-radius: 5%;
    display: flex;
    flex-direction: column;
    gap: 25px;
    align-items: center;
    margin-left: 10px;
    justify-content: space-evenly;
  
}

.price-3{
    min-height: 500px;
    /*border: #141212 2px solid;*/
    background-color: #1a1a1a;
    border-radius:5%;
    display: flex;
    flex-direction: column;
    gap: 25px;
    align-items: center;
    justify-content: space-evenly;
    margin-left: 10px;
    width: 30%;
   
}
.price-color{
    text-align: center;
}
.price-description{
    font-size: large;
    width: 80%;
    text-align: center;
    letter-spacing: 2px;
}

.price-tagline{
    
    text-align: center;
    font-size: large;
}
.price-small{
    color: white;
    font-size: 30px;
    letter-spacing: 5px;
}
.price-mid{
    color: white;
    font-size: 30px;
    letter-spacing: 5px;
}
.price-large{
    color: white;
    font-size: 30px;
    letter-spacing: 5px;
}
.reviews{
    width: 1005;
    min-height: 250px;
    border:  2px solid rgb(255, 255, 255);
    display: none;
}
.footer{
    width: 100%;
    height: 200px;
    background-color: #d2a226;
    color: #f5e9e2;
    padding: 0px;
    margin: 0px;
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.footer h1{
    font-size: 40px;
    font-weight: bolder;
    margin-bottom: 30px;
}
.footer h2{
    margin-top: 10px;
    letter-spacing: 2px;
}
@media only screen and  (max-width:728px){
    .index{
        width: 100%;
        background-color: #030303;
    }
    .container{
      width: 100%;  

    }
    .navbar ul{
        display: none;
    }
    .logo{
        justify-content: start;
    }
    
}