*{
    margin: 0;
    font-family: Arial;
    border: border-box;
}
#navbar{
    height: 60px;
    background-color: #131a22;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    color: white;

}

#navbar-logo{
    /* background-color: pink; */
    height: 50px;
    width: 120px;
    display: flex;
    align-content: center;
    padding-left: 20px;
    padding-bottom: 5px;
}

#navbar-box2{
    /* background-color: pink; */
    height: 50px;
    align-content: center;
    width: 90px;
}
#navbar-logo-image-1{
    height: 45px;
    width: 100px;
    padding-top: 12px;
    /* background-color: red; */
}
#Pakistan{
    font-weight: bold;
    font-size: 0.9rem;

}
#deliverto{
    margin-left: 25px;
    font-size: 0.75rem;
    color: #CCCCCC;
}
#searchbar{
    height: 60px;
    width: 630px;
    display: flex;
    justify-content: center;
    align-items: center;
    
}
#selectbox{
    height: 42px;
    width: 52px;
    background-color: #E6E6E6;
    border: none;
    text-align: center;
    border-top-left-radius: 10%;
    border-bottom-left-radius: 10%;
    appearance: none;
}
#textarea{
    height: 40px;
    border: none;
    width: 83%;
    /* width: 350px; */
}
#buttondiv{
    width: 45px;
    height: 42px;
    background-color: rgb(255, 203, 107);
    display: flex;
    justify-content: center;
    align-items: center;
    border-top-right-radius: 10%;
    border-bottom-right-radius: 10%;
}
#searchbutton{
    width: 45px;
    height: 40px;
    border: none;
    background-color: rgb(255, 203, 107);
    
}
#glass{
    font-size: 1.25rem;
    color: rgba(0, 0, 0, 0.781);
}

#flagbox{
    height: 35px;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 15px;
    /* background-color: pink; */
    
}
#flagbox-image{
    height: 16.2px;
    width: 21.6px;
    margin-right: 4px;
}
#flagbox-text{
    padding-top: 6px;
    font-size: 14px;
}
#signinbox{
    padding-left: 10px;
    height: 50px;
    width: 130px;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* background-color: pink; */
    
}
.boldclass{
    font-weight: bold;
}
#signinbox-1{
    padding-top: 10px;
}
#signinbox-2{
    font-size: 14px;
}

#returnbox{
    height: 50px;
    width: 70px;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* background-color: pink; */
    
}
#returnbox-1{
    padding-top: 10px;
}
#returnbox-2{
    font-size: 14px;
}
#cartbox{
    height: 50px;
    width: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* background-color: pink; */
}
#cartbox-1{
    padding-top: 10px;
    font-size: 25px;
}
#cartbox-2{
    padding-top: 20px;
    font-size: 14px;
}
#navbar-main{
    height: 40px;
    background-color: #232f3e;
    color: white;
    display: flex;

}
#menu{
    width: 80px;
    display: flex;
    align-items: center;
    font-size: 14px;
}
#menu-icon{
    padding-left: 15px;
    font-size: 20px;
}

#list{
    display: flex;
    align-items: center;
    text-decoration: none;
}
a{
    text-decoration: none;
    color: white;
    padding-right: 20px ;
    font-size: 14px;
}

/* #mainbody{
    height: 1200px;
    background-color: pink;
}     */
#mainbody{
    height: 400px;
    background-size: cover;
    background-image: url(images/Backgroundimage.jpg);
    
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
#mainbody-heromessage{
    height: 40px;
    width: 1200px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    margin-bottom: 25px;

}
#anchor{
    color: blue;
}

#boxes{
    height: 410px;
    display: flex;
    justify-content: space-evenly;
    /* background-color: pink; */
    font-size: 21px;
    font-weight: bold;
    
}
.b{
    height: 350px;
    /* border: solid 2px; */
    width: 270px;
    background-color: white;
    padding-left: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}
.bluetext{
    color: rgb(88, 88, 254);
    
}
#pc{
    padding-top: 15px;
    height: 275px;
    width: 240px;
}
#box1{
    
}

#box2{

}
.box2-images{
    height: 100px;
    width: 110px;
}
.image-gap{
    display: flex;
    justify-content: space-evenly;
    height: 100px;
    width: 245px;
    /* background-color: pink; */
}
.text-gap{
    display: flex;
    justify-content: space-around;
    /* padding-top: 5px; */
    height: 20px;
    width: 250px;
    /* background-color: red; */
    font-size: 12px;
}
#Hello{
    padding-bottom: 25px;
}

#longbar{
    height: 200px;
    width: 270px;
    /* background-color: pink; */
}
#whole{
    height: 1925px;
    background-color: #e2e7e6;
}
.longbar{
    
    height: 280px;
    width: 1225px;
    background-color: white;
    margin-left: 20px;
    margin-right: 20px;
    
    /* padding-top: 20px;
    padding-left: 20px; */
}
.longbar-heading{
    font-size: 21px;
    font-weight: bold;
    padding-left: 20px;
    padding-top: 20px;
}
#longbar-images{
    display: flex;
    justify-content: space-evenly;
    
}
.longbar-imgsize{
    padding-top: 20px;
    height: 200px;
}
#headphone{
    padding-right: 70px;
}
#personalized{
    height: 190px;
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

}
#signin{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 30px;
    background-color:  rgb(255, 226, 2);
    border-radius: 100px;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 5px;
}
#newcustomer{
    font-size: 11px;
}
#backtotop{
    height: 50px;
    background-color: #37475A;
    font-size: 13px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}
#info{
    padding-top: 40px;
    height: 320px;
    background-color: pink;
    background-color: #232f3e;
    display: flex;
    justify-content: space-evenly;
    
}

.info-box{
    height: 300px;
    width: 202px;
    /* background-color: pink; */
    display: flex;
    flex-direction: column;
}
.info-box-heading{
    font-size: 16px;
    color: white;
    font-weight: bold;
    padding-bottom: 15px;
}
#div3{
    width: 250px;
}
.info-box-anchor{
    color: #DDDDDD;
    padding-bottom: 10px;
}
#div4{
    width: 160px;
}

#info-footerbar{
    height: 120px;
    border: solid 0.1px #dddddd5e;
    background-color: #232f3e;
    border-right: none;
    border-left: none;
    border-bottom: none;
    display: flex;
    justify-content: center;
    align-items: center;
}

.info-footerbar-box{
    height: 35px;
    width: 130px;
    border: solid 1px #dddddd5e;
    margin-right: 10px;
    border-radius: 5px;
    font-size: 13px;
    color: #dddddde3;
    display: flex;
    align-items: center;
    padding-left: 10px;
}
#info-footerbar-logo{
    margin-top: 20px;
    margin-right: 100px;
    width: 100px;
    height: 60px;
}
#info-footbar-flag{
    width: 17px;
    height: 12px;
}

#info-des{
    height: 470px;
    background-color: #131a22;
    
    padding-left: 120px;
    padding-right: 120px;
}
.info-boxdiv{
    height: 100px;
    width: 130px;
    /* background-color: bisque; */
    /* border: solid 1px; */
    margin-top: 35px;
}
.info-des-fontcolor{
    color: #dddddd98;
    font-size: 12px;
}

#info-longtextbar{
    height: 95px;
    width: 1050px;
    /* background-color: aqua; */
    display: flex;
    justify-content: space-evenly;
}
.barheading{
    font-size: 12px;
}

#footer-lastdiv{
    height: 90px;
    /* background-color: pink; */
}

#footer-lastdiv{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#footer-list{
    display: flex;
    list-style-type: none;
    padding-bottom: 5px;
}
.footer-anchor1{
    font-size: 12px;
}

.borderanimation:hover{
    border: solid 2px white;
}
