body{
    margin:auto;
}

a{
   text-decoration: none;
   color:black;
}
a:hover{
   color:rgb(197, 194, 194);
}
#location{
    height:50px;
    display: flex;
    justify-content: center;
    padding:5px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    border:2px solid rgb(211, 209, 209);
    background-color: white;
  
}

#location>img{
    width:30px;
    position: relative;
    right:5px;
}
#location>p{
    position: relative;
    left:10px;
}
#location>button{
        background-color: rgb(36, 35, 35);
        color:white;
        padding:2px 15px;
        font-weight: bolder;
        border-radius:45px 50px;
        position: relative;
        left:20px;      
}

#nevBarContainer{ 
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: white;
    border:2px solid rgb(211, 209, 209);
}

#nevBarContainer>div:nth-child(1){
    display:flex;
    width:40%;
    align-items: center;
    justify-content: space-around;
}

#nevBarContainer>div:nth-child(2){
    display:flex;
    width:40%;
    align-items: center;
    justify-content: space-around;
 
}

#nevBarContainer>div:nth-child(1)>img{
   width:auto;
}

#nevBarContainer>div:nth-child(1)>h3{
   margin-left:-30%;
}
#nevBarContainer>div:nth-child(2)>img{
   width:15%;
}

#nevBarContainer>div:nth-child(2)>h3,span{
   margin-right:-60%;
}



/* TO STICKY THE TOP SECTION */
 .sticky{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 23px;
    /* overflow: hidden; */
}   


 #first-Div{
    background-color: rgb(22, 22, 22);
    text-align:center;
    /* width:50%;
    margin:auto; */
    padding:20px;
    color:white;
    display: flex;
    justify-content: center;
    margin-top:200px;
 }

 #first-Div>button{
    padding: 0px 25px;
    border-radius: 25px 25px;
    background-color: rgb(252, 21, 21);
    color:white;
    font-size: 20px;
    margin-left:20px;
    /* position: relative; */
    /* left: 10px; */
 }

#second-Div{
    height:350px;
}
 #second-Div>img{
    width: 100%;
    height:100%;
 }
/* number can be done here for slide-img */

/* welcome div */
 #Welcome-dev{
    padding:5px;
    background-color: rgb(252, 245, 238);
 }
 #Welcome-dev>p{
    font-size:30px;
    font-weight: bolder;
    margin-left:100px;
 }
 #Welcome-dev span{
   font-size:small;
   color:red;
 }

 /* browser in first page */

  #browse{
    width:100%;
    margin:10px;
    display:flex;
    justify-content: space-around;
     margin-bottom: 60px;
 } 
 #browse>h2{
       position:relative;
       top:25px;  
 }
 #browse>div{
    border-bottom:2px solid rgb(87, 86, 84);
    width:60%;
   
 }

 /* browser imgs in first page */
 #Browser-parents{
    display:grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    gap:20px;
    text-align: center;
    margin: 20px 80px;
    background-color: rgb(247, 245, 243);
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    font-weight: bolder;
 }
 #Browser-parents>div:nth-child(n)>img{
    width:100%;
 }
 
 #Browser-parents>div{
    background-color: rgb(247, 245, 243);
    box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
 }



 /* footer of first page */

#footerParents{
   height:auto;
   margin-top:80px;
   background-color: rgb(20 20 20);
   color:white;
   padding:25px;
   padding-top:50px;
}

#offers{
      display:flex;
      justify-content: space-evenly;
}

#footerImgCont{
   display: grid;
   grid-template-columns: repeat(4,1fr);
   grid-template-rows: auto;
   gap:25px;
   margin:30px;
}

#footerImgCont>div:nth-child(n){
   border-radius: 5%; 
   text-align: center;
   background-color: aliceblue;
   color:rgb(37, 37, 37);
}

#footerImgCont>div:nth-child(n)>h1{
   color:red;
   font-weight: bolder;;
}

#footerImgCont>div:nth-child(n)>img{
   width:100%;
   border-radius: 5%;
}

.Details{
   display:flex;
   justify-content: space-evenly;
   box-sizing: border-box;
   margin:4px;
   padding:10px 25px;
   position:relative;
   bottom:30px;
   /* z-index: 600; */
}

.Details>button:nth-child(1){
   border:0px;
   border-bottom: 2px solid black;
   background-color: aliceblue;
   font-size: medium;
   font-weight: bolder;
   color:rgb(71, 70, 70);
}

.Details>button:nth-child(2){
   background-color: aliceblue;
   font-size: medium;
   font-weight: bolder;
   color:rgb(71, 70, 70);
   margin-left:50px;
   border-radius: 25px 25px;
   padding:15px;
}

#FooterBottom{
   width:90%;
   margin:0 70px;
   color:white;
   display:flex;
   justify-content: space-around;
   font-weight: bolder;
   font-size:large;
}

#FooterBottom>div>ul{
   list-style: none;
   line-height: 35px;
}


#FooterBottom>div:last-child{
   display:flex;
   justify-content:center;
   align-items: center;
}

#FooterBottom>div:last-child>img{
   width:25px;
   margin-right:10px;
}

#footerParents>p{
  margin:auto;
  text-align: center;
  padding:30px;
}

 


