
/* style for homepage black-bar  */
*{
    font-family: "poppins",-apple-system,BlinkMacSystemFont,Roboto,"Arial",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

body{
    margin: 0px;
    background: linear-gradient(to right, #ffffff 40%, #ff99cc 100%);
}

#black-bar{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 40px;
    border: 1px solid #0F1B29;
    background-color: #0F1B29;
    color: rgb(164, 159, 159);
}
#black-bar>p{
    font-size: 15px;
    font-weight: 700;
}

/* style for homepage Manu-bar  */

#manu-bar{
    display: flex;
    width: 73%;
    height: 70px;
    border: 0px solid red;
    margin: auto;
    margin-top: 25px;
}
#manu-bar div:nth-child(1){
    width: 157px;
    height: 100%;
    border: 0px solid blue;
}
#manu-bar div:nth-child(1)>img{
    width: 100%;
    height: 100%;
}

/* Six menu style */
.optionfist{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 65px;
    height: 100%;
    border: 0px solid blue;
    margin-left: 80px;
    font-weight: 500;
    line-height: 80px;
    font-size: 15px;
    color: #0f1b29;
}
a {
    color: #0f1b29;
    text-decoration: none;
}

a:hover {
    color: #f07; 
    text-decoration:underline; 
    cursor:pointer;  
}
.opt:hover{
    color: #f07; 
    text-decoration:underline; 
    cursor:pointer; 
}
.option{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 157px;
    height: 100%;
    border: 0px solid blue;
    font-weight: 500;
    color: #0f1b29;
    font-size: 17px;
}
.option3{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 100%;
    border: 0px solid blue;
    font-weight: 500;
    color: #0f1b29;
    font-size: 17px;
}
.option4{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 125px;
    height: 100%;
    border: 0px solid blue;
    font-weight: 500;
    color: #0f1b29;
    font-size: 17px;
}
.option5{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 100%;
    border: 0px solid blue;
    font-weight: 500;
    color: #0f1b29;
    font-size: 17px;
}
.option6{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100%;
    border: 0px solid blue;
    font-weight: 500;
    color: #0f1b29;
    font-size: 17px;
}
.option7{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100%;
    border: 0px solid blue;
    font-weight: 500;
    color: #0f1b29;
    font-size: 17px;
    margin-left: 40px;
}
.btn{
    margin: auto;
    width: 120px;
    height: 65%;
    border-radius: 8px;
    margin-left: 0px;
    background-color: #0f1b29;
    color: white;
    font-weight: 600;
    font-size: 15px;
}


/* This part for single card style  */

#singlecard{
    display: grid;
    grid-template-rows: repeat(1,1fr);
    height: 270px;
    width: 45%;
    border: 0px solid red;
    margin: auto;
    margin-top: 100px;
    border-radius: 15px;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}
#readycont{
    width: 60%;
    text-align: center;
    margin: auto;
    margin-top: 20px;
}
#readycont>p{
    line-height: 25px;
    font-size: 17px;
    margin-bottom: 0px;
}
#childthree{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
    width: 90%;
    height: 70px;
    border: 0px solid red;
    margin: auto;
    margin-bottom: 40px;
    
}
.smallcard{
    border: 1px solid  gray;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    border-radius: 8px;
}
.smallcard>img{
    width: 20px;
}
.gittext{
    margin-left: 8px;
}
.smallcard:hover{
    border: 1px solid black;
    cursor: pointer;
}


/* Footer code style */

#footer{
    height: 510px;
    width: 100%;
    border: 1px solid black;
    margin-top: 110px;
    color: rgb(192, 189, 189);
    background-color: #132234;

}
#socialbox{
    display: grid;
    grid-template-columns: repeat(8,1fr);
    width: 32%;
    height: 60px;
    margin-top: 70px;
    margin-left: 200px;
}
.socialcard{
    border: 0px solid blue;
    display: flex;
    justify-content: center;
    align-items: center;
}
.socialcard>i{
  font-size: 27px;
}
.socialcard>i:hover{
    color: #fff;
    cursor: pointer;
  }
#footer-card{
    display: grid;
    grid-template-columns: repeat(6,1fr);
    width: 75%;
    height: 200px;
    margin-top: 80px;
    margin-left: 200px;
   
}
.footer-box{
    border: 0px solid blue;
}
.footer-box>h3{
    font-size: 16px;
    font-weight: 800;
    margin-top: 0px;
    margin-bottom: 25px;
    color: #fff;
}
.footer-menu{
    line-height: 10px;
    font-size: 14px;
}
.footer-menu>p:hover{
    color: #fff;
}

/* Bottom Footer style */
#bottom-footer{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    width: 76%;
    height: 60px;
    margin: auto;
   
}
#full-footer{
    width: 100%;
    height: 60px;
    border-top: 1px solid black;
    margin-top: 40px;
    background-color:  #0c1622;
}

.bottom-box{
    border: 0px solid blue;
    width: 100%;
}
#bottom-footer>div:nth-child(3){
    display: flex;
    justify-content: end;
}
#bottom-footer>div:nth-child(2){
    width: 400px;
}
#bottom-five{
    display: grid;
    grid-template-columns: repeat(5,1fr);
    height: 100%;
    width: 100%;
}
.bootom-fchild{
    border: 0px solid blue;
}
#bottom-five > div:nth-child(1){
    width: 150px;
}
.bottom-box >p:hover{
    color: #fff;
}
.bootom-fchild >p:hover{
    color: #fff;
}

/* Style Complete Done Home Page */


/* Style for Product Heading hear */
#title{
    text-align: center;
    font-weight: 850;
    font-size: 42px;
    margin-top: 60px;

}

/*This part para img style  */
.sec{
  display: grid;  
  grid-template-columns: repeat(2,1fr);
  gap: 20px;
  width: 70%;
  height: 350px;
  border: 0px solid red;
  margin: auto;
  margin-top: 130px;
}
.secpart{
    border: 0px solid blue;

}
#publ{
    width: 65%;
    margin-left: 60px;
}
.impac{
    line-height: 25px;
    font-size: 17px;
}
.imphed{
    font-weight: 800;
    font-size: 25px;
}
#readcl{
    color: #f07;
    font-size: 17px;
}
.beta{
    font-size: 15px;
    color: #f07;
}
#sarchimg>img{
    width: 85%;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.heiimg>img{
    width: 88%;
    box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;

}
#secpara{
    width: 65%;
}
.noshado>img{
    width: 85%;

}
#right1>img{
    width: 85%;
    width: 88%;
    border-radius: 10px;
    box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}

.sechig{
    display: grid;  
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
    width: 70%;
    height: 450px;
    border: 0px solid red;
    margin: auto;
    margin-top: 130px;
  }
  .secparthig{
      border: 0px solid blue;
  
  }
  #btwn{
    margin-top: 150px;
    margin-left: 50px;
    width: 65%;
  }
  #img11{
    width: 85%;
  }
  #high111{
    width: 63%;

  }
  #img121{
    width: 90%;
    
  }
 #wid141{
    width: 65%;
 }
 #img110>img{
    width: 450px;
 }
 #wid88{
    width: 68%;
    margin-top: 90px;
 }
 #imf66>img{
    width: 460px;
    border-radius: 10px;
    box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
 }
 #wid222{
    width: 65%;
    margin-top: 130px;
 }
 #img009>img{
    width: 500px;
    border-radius: 10px;
    
 }
 #wid89{
    width: 65%;
 }
 .beta{
    font-weight: 900;
    font-size: 12px;
 }

 #multi{
    width: 70%;
 }
 
 /* Styling Done for Product */