@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Hind:wght@500&family=Mukta:wght@200;300;400;500;600;700;800&display=swap');

* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    font-family: "Mukta", sans-serif;
}

/* bar1 */
.imain {
    background-image: linear-gradient(90deg, rgb(113, 238, 255), #f5fefd, rgb(113, 238, 255));

}

.bar1 {
    width: 100%;
    height: 10vh;
    position: sticky;
    top: 0px;
    /* display: grid;
    grid-template-columns: auto auto auto; */
    /* background-image: linear-gradient(120deg,navy, skyblue 8%, navy); */

}

.bar1rap {
    width: 100%;
    height: 10vh;
    margin: auto;
    background: linear-gradient(90deg, rgb(170, 245, 255),  rgb(170, 245, 255));
    display: grid;
    grid-template-columns: auto auto 11% 19%  auto;
    /*  */
}

.logo h1 {
    padding-top: .5vh;
    padding-left: 40px;
    /* position: absolute; */
    /* border: 1px solid; */

}

/* .search p{
    float: middle;
    position: absolute;
} */
.menu {

    float: right;
    padding-top: 14px;
}
.searchbox{
    background: white;
    border-radius: 28px;
    padding-left: 20px;
    margin-top: 1.5vh;
}

.search input {
    width: 250px;
    height: 6vh;
    border-radius: 20px;
    padding-left: 3px;
    border: none;
    outline: none;
    /* padding-bottom: -1vh; */


}
.dropdown{
    display: inline-block;
    
    
}
.dropdown button{
    background-color: transparent;
    color: black;
    padding: 10px 15px;
    border: none;
    cursor: pointer;
    border-radius: 10px;
    margin-top: 6px;
    font-size: 15px;
    margin-left: 30px;
    /* border: 1px solid skyblue; */

}
.dropdown a{
    display: block;
    color: black;
    text-decoration: none;
    padding: 10px 15px;

}
.dropdown .content{
    display: none;
    position: absolute;
    background: linear-gradient(90deg, rgb(170, 245, 255),  rgb(170, 245, 255));
    min-width: 100px;
    box-shadow: 2px 2px 5px hsla(0, 0%, 0%,0.8);

}

.dropdown:hover .content{
    display: block;
}
.dropdown :hover button{
    background-color: hsl(0, 0%, 70%);
}
.dropdown a:hover {
    background: linear-gradient(90deg,  rgb(75, 234, 255),  rgb(75, 234, 255));
    color: white;
}
.dropdown:hover button{
    box-shadow: 1px 1px   5px hsla(0, 0%, 0%,0.8);
}
.menu ul li i {
    font-size: 19px;
    color: black;
    padding-right: 1vh;



}

.menu ul li {
    display: inline;
    /* text-decoration: none;
    padding: 7px;
    padding-top: 10px;
    font-size: 20px;
    border-radius: 20px;
    border: 2px solid blue;
    margin: 0vh 5vh;
    padding-right: 30px; */

}

.menu ul li a {
    text-align: center;
    text-decoration: none;
    /* padding: 1vh; */
    color: black;
    padding: 25px;

}

.menu ul li :hover {

    /* text-decoration: underline; */
    color: green;
    background-size: 100%;
    border-radius: 20px;

}

/* barmid */
.barmid{
    height: 6vh;
    width: 100%;
    background: linear-gradient(90deg, rgb(170, 245, 255),  rgb(170, 245, 255));
    /* border-top: 1px solid black; */
}
.barmidrap{
    height: 6vh;
    width: 98%;
    margin: auto;

}
.barmidrap ul{
    padding-top: .5vh;
}
.barmidrap ul li{
    
    display: inline;
    padding-left: 90px;
    font-size: 14px;
    
}
.barmidrap ul li a{
    text-decoration: none;
    color: black;
}
.barmidrap  ul li :hover {

    /* text-decoration: underline; */
    color: green;
    background-size: 100%;
    border-radius: 20px;

}


/* bar2 */
.bar2 {
    width: 100%;
    height: 24vh;
    /* border: 2px solid black; */
    /* background-image: linear-gradient(240deg,navy, skyblue 8%, navy); */
}


.bar2rap {
    width: 98%;
    height: 22vh;

    /* border: 2px solid black; */
    margin: auto;

    margin-top: 2vh;
    display: grid;
    grid-template-columns: auto auto auto auto auto auto auto auto;
    /* border: 1px solid; */
    background: linear-gradient(90deg, rgb(170, 245, 255),  rgb(170, 245, 255));
}

.box {
    /* border: 2px solid black; */
    height: 20vh;
}

.box img {
    /* padding: 50px; */
    /* background-color: green; */
    transition: transform .1s;
    /* width: 200px;
    height: 200px; */
    margin: 0 auto;
}

.box:hover img {
    -ms-transform: scale(1.2);
    /* IE 9 */
    -webkit-transform: scale(1.1);
    /* Safari 3-8 */
    transform: scale(1.1);
    
}

.box img {
    margin-top: 10px;
    /* border: 2px solid black; */
    /* border-radius: 60px; */

}

.box a {
    text-decoration: none;
    color: black;
}

.box h2 {
    text-align: start;
    padding-left: 45px;
    font-size: 15px;
    text-align: left;
}

/* between banner */
.bban {
    width: 100%;
    height: 130vh;
    /* border: 2px solid black; */
    background-image: url(./image/bban6.jpg);
    background-repeat: no-repeat;
    background-size: cover;

}

.bbanrap {
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, (90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246)) 10%, red, (90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246)10%));
}

/* middle2 */
.mid2 {
    width: 100%;
    height: 69vh;
    display: grid;
    grid-template-columns: auto auto;
    /* border: 2px solid black; */
}

.mid2rap {
    width: 98%;
    margin: auto;

    height: 61vh;
    display: grid;
    grid-template-rows: auto auto;
    background: linear-gradient(90deg, rgb(170, 245, 255), #f5fefd, rgb(170, 245, 255));
}

.mid2rap h2 {
    font-size: 35px;
    padding-top: 1vh;
    padding-left: 30px;
    text-align: left;

}

.box11 img {
    padding-top: 2vh;
}


.scroll-container1 {
    height: 55vh;
    background-color: transparent;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;

}




/* middle 3 */
.mid3 {
    width: 100%;
    height: 110vh;

}

.mid3rap {
    width: 98%;
    height: 110vh;
    margin: auto;
    margin-top: 2vh;
    display: grid;
    grid-template-columns: auto auto auto;
    /* grid-gap: 5px; */
    grid-column-gap: 10px;
    grid-row-gap: 6px;
    background: linear-gradient(90deg, rgb(170, 245, 255), #f5fefd, rgb(170, 245, 255));


}

.mid3rap a {
    border-radius: 20px;
    /* border: 2px solid; */
    height: 48vh;
    margin-top: 2vh;
}

.mid3rap img {
    border-radius: 20px;
    /* border: 2px solid; */
}

.boxi h2 {
    padding-top: 1vh;
    font-size: 20px;
    text-align: center;

}

.scroll-container {
    background-color: transparent;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;
}

.scroll-container img {
    padding: 10px;
}


/* middle4 */
.mid4 {
    width: 100%;
    height: 155vh;
    padding-top: 2vh;
    /* border: 1px solid; */
}

.mid4rap {
    width: 97%;
    height: 150vh;
    padding-top: 1vh;
    margin: auto;
    margin-top: 5vh;
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 12px;
    /* border: 1px solid; */
    background: linear-gradient(90deg, rgb(170, 245, 255), #f5fefd, rgb(170, 245, 255));
}

.box41 {

    display: grid;
    grid-template-rows: 10% 88%;
    grid-row-gap: 12px;

}

.box411 {

    padding-top: 1.5vh;
    text-align: center;
}

.box411 a {

    text-decoration: none;
    color: black;

}

.box412 {
    /* border: 1px solid; */
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}

.box4121 {
    /* border: 2px solid silver; */
    padding: 7px;

}

.box4121 h2 {

    padding-top: 9px;
    text-transform: uppercase;
    font-size: 17px;
}

.box4121 h3 {
    color: green;
    font-size: 15px;
}


.box412i img{
    border-radius: 10px;
}

/* .box412i a :hover{
    transition-property: all;
} */

.box42 {

    height: 96vh;
}
.box412i  {
    margin-top: 2vh;
    /* padding: 50px; */
    /* background-color: green; */
    transition: transform .1s;
    /* width: 200px;
    height: 200px; */
    margin: 0 auto;
  }
  
  .box412i:hover  {
    -ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.1); /* Safari 3-8 */
    transform: scale(1.1);
    /* box-shadow: 2px 2px 5px hsla(0, 0%, 0%,0.8);  */
  }



/* middle 5 */
.mid5 {
    height: 100vh;
    width: 100%;
}

.mid5rap {
    height: 98vh;
    width: 96%;
    margin: auto;
    display: grid;
    grid-template-rows: 13% 98%;
    grid-row-gap: 6px;
    /* border: 1px solid; */
}

.box51 {
    padding: 10px;

    font-size: 24px;


}

.box51 a {
    text-decoration: none;
    color: black;
}

.box52 {
    height: 83vh;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-column-gap: 6px;
    /* border: 1px solid; */
}



/* middle6 */

.mid6 {
    width: 100%;
    height: 100vh;
    border: 2px solid black;
}

.mid6rap {
    width: 100%;
    height: 100vh;
    margin: auto;
}

/* .scroll-container1 {
    background-color: transparent;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;
}

.scroll-container1 img {
    padding: 10px;
} */




/* footer1 */
/* .foot1{
    width: 100%;
    height: 100vh;
}
.foot1rap{
    width: 90%;
    height: 100vh;
    margin: auto;
    margin-top: 10vh;
}
.foot1 a{
    text-decoration: none;
} */


/* footere2 */
.foot2 {
    width: 100%;
    height: 68vh;
    background-color: rgb(7, 7, 7);
}

.foot2rap {
    width: 96%;
    height: 40vh;
    margin: auto;
    /* margin-top: 1vh; */

    padding: 7px;
    padding-top: 4vh;
    /* background-color: rgb(7, 7, 7); */
    display: grid;
    grid-template-columns: auto auto auto min-content auto auto;
    grid-column-gap: 8px;
}

.foot2rap h2 {
    font-size: 18px;
    color: rgba(206, 199, 199, 0.644);

}

.foot2rap p {
    color: white;


}

.foot2rap a {
    text-decoration: none;
    color: white;
}

.boxf21 {
    border-left: 1px solid rgba(206, 199, 199, 0.644);
    ;
    padding-left: 20px;
}

.boxf21 ul li {
    display: inline;
    text-decoration: none;
    font-size: 29px;
    padding: 8px;
    color: white;
}



/* footer3 */
.foot3 {
    width: 100%;
    height: 10vh;
    background-color: black;
    border-top: 1px solid rgba(206, 199, 199, 0.644);
}

.foot3rap {
    width: 96%;
    height: 10vh;
    margin: auto;
    color: white;
    display: grid;
}

.foot3rap ul {
    padding-top: 2.5vh;
}

.foot3rap ul li {
    display: inline;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 20px;


}

.boxf3 ul li {
    display: inline;
    padding: 4px;
}





.lmid1 {
    width: 100%;
    height: 80vh;
    /* background-image: url(./image/feacherd.jpg);
    background-size: cover; */
}

.lmid1rap {
    width: 80%;
    height: 80vh;
    margin: auto;
    background-image: url(./image/lp3.png);
    background-size: cover;


}

.lbox10 {
    margin-top: 6vh;
    margin-left: 100vh;
    padding: 5vh;
    border-left: 2.5px solid;
    border-right:2.5px solid ;
    border-top: .5px solid;
    border-bottom:.5px solid ;
    /* background: rgba(0, 0, 0, 0.5); */
    position: absolute;
    /* border: 2px solid green; */
    border-radius: 10px;
    width: 330px;
    /* text-align: center; */
}

.lbox10 h1 {
    font-size: 36px;
    text-transform: capitalize;
    text-align: center;
}

.lbox10 p {
    font-size: 17px;
    text-align: justify;
    
}
.lbox10 h3{
    padding-top: 10px;
    font-size:16px;
    border-top: 1px solid;
    
}
.lbox10 i{
    float: right;
    font-size: 19px;
    padding-top: 4px;
    padding-right: 24px;
}

.lbox102 input {
    color: black;
    width: 260px;
    height: 5vh;
    font-size: 15px;
    border-radius: 10px;
    padding-left: 20px;
    /* cursor: pointer; */


}

.lbox10 a {
    text-decoration: none;
}

.lbox101 input {
    color: deeppink;
    width: 100px;
    height: 5vh;
    font-size: 15px;
    text-align: center;
    border-radius: 20px;
    /* padding-left: 20px; */
    cursor: pointer;
    margin-left: 85px;
}
















/* fashion */
.fmain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));
}

.fban1 {
    width: 100%;
    height: 120vh;
    background-image: url(./product/fp10.jpg);
    background-size: 100%;

}


.fban2 {
    width: 100%;
    height: 50vh;
    background-image: url(./product/fb3.png);
    background-size: 100%;
}

.fmid1 {
    width: 100%;
    height: 170vh;
    display: grid;
    grid-template-rows: auto auto;
    /* border: 1px solid; */

}

.fmid1rap {
    width: 96%;
    height: 80vh;
    margin: auto;
    display: grid;
    grid-template-rows: 10% 78%;
    grid-row-gap: 4%;
    background: linear-gradient(90deg, rgb(170, 245, 255), #f5fefd, rgb(170, 245, 255));
    /* border: 2px solid red */

}

.fmid2rap {
    width: 96%;
    height: 80vh;
    margin: auto;
    display: grid;
    grid-template-rows: 10% 78%;
    grid-row-gap: 4%;
    background: linear-gradient(90deg, rgb(170, 245, 255), #f5fefd, rgb(170, 245, 255));
    /* border: 2px solid red; */
}

.fbox1 {
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    grid-column-gap: 4px;
}

.fbox10 {
    /* border: 2px solid; */
    border-radius: 20px;
    padding: 2vh;

}

.fbox10 img {
    /* padding: 50px; */
    /* background-color: green; */
    transition: transform .1s;
    /* width: 200px;
    height: 200px; */
    margin: 0 auto;
}

.fbox10:hover img {
    -ms-transform: scale(1.2);
    /* IE 9 */
    -webkit-transform: scale(1.1);
    /* Safari 3-8 */
    transform: scale(1.1);
}

.fbox10 a {
    text-decoration: none;
}

.fbox10 h2 {
    color: grey;
    padding-left: 4px;

}

.fbox10 h3 {
    padding-left: 4px;
}

.fbox10 u {
    padding-left: 4px;
    text-decoration: line-through;

}

.fbox10 b {
    color: green;
    padding-left: 4px;
}

.fbox10 h5 {
    color: green;
    /* padding-left: 4px; */
    margin-left: 4px;
    font-size: 20px;
    padding: 3px;
    margin-right: 140px;
    background-color: aquamarine;
    position: relative;

}

.fbox10 img {
    border-radius: 20px;
    /* height: 2px; */
    /* width: 2px; */
    /* transition: all 3s; */

}

/* .fbox10 img :hover {
    border-radius: 0px;
    background-color: rgba(0, 0, 0, 0.5);
    color: rgba(0, 0, 0, 0.5)
} */


.fbban1 {
    padding-top: 4vh;
    height: 80vh;
    width: 99%;
    margin: auto;
    /* border: 2px solid; */
}

.fscroll-container1 {
    background-color: transparent;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;
}

.scroll-container img {
    padding: 10px;
}

/* width */
::-webkit-scrollbar {
    width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: linear-gradient(to left, skyblue, transparent, skyblue);
    background: linear-gradient(to left, transparent, skyblue, transparent);
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(to left, transparent, skyblue, transparent);
    background: linear-gradient(to left, skyblue, transparent, skyblue);
}



/* grocery */
.gmain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));
}

.gban {
    width: 100%;
    height: 100vh;
    background-image: url(./product/g4.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
}

.gbanrap {
    width: 100%;
    height: 100vh;
    margin: auto;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.801) 50%, transparent);
}

.gbanrap h1 {
    margin-left: 28vh;
    margin-top: 3vh;
    padding: 25.5vh 3vh;
    font-size: 50px;
    background-color: rgba(255, 255, 255, 0.5);
    position: absolute;
    border-left: 4px solid greenyellow;
    border-right: 4px solid greenyellow;
    border-radius: 10px;
    color: greenyellow;
}


.gbban1 {
    width: 100%;
    height: 20vh;

}

.gbban1rap {
    width: 90%;
    height: 15vh;
    margin: auto;
    margin-top: 3vh;
    background-image: url(./product/gp1.jpg);
    background-repeat: no-repeat;
    background-size: 100%;
}

/* middle1 */
.gmid1 {
    width: 100%;
    height: 100vh;

}

.gmid1 img {
    border-radius: 20px;
    border: 2px solid greenyellow;
}

.gmid1rap {
    width: 96%;
    height: 80vh;
    margin: auto;
    /* background-image: url(./product/gp1.jpg);
    background-repeat: no-repeat;
    background-size: 100%; */
    display: grid;
    grid-template-columns: auto auto;
}

.gbox2 {
    display: grid;
    grid-template-rows: auto auto;

}

.gbban2 {
    height: 80vh;
    width: 100%;
}

.gscroll-container1 {
    background-color: transparent;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;
}

.gscroll-container1 img {
    padding: 10px;
    border-radius: 20px;
    border: 2px solid greenyellow;
}

/* .scroll-container img :hover{
    opacity: 0.3;
} */





/* home and furnichers */

.hmain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));

}

.hban1 {
    width: 100%;
    height: 70vh;
    background-image: url(./product/hb1.jpg);
    background-size: 100%;
}



.hban1rap {
    width: 100%;
    height: 70vh;
    /* margin: auto; */
    padding: 6vh 2vh 0px 100px;
    color: green;
    /* border: 2px solid; */
    background: linear-gradient(to right, rgba(0, 0, 0, 0.801) 20%, transparent);
    

}

.hban1rap h1 {
    /* margin-top : 1vh; */
    padding: 1vh 0vh 2vh 2vh;

    margin-right: 150vh;
    font-size: 30px;
    background-color: rgba(255, 255, 255, 0.5);
    position: absolute;
    border-left: 4px solid rgb(134, 96, 37);
    border-right: 4px solid rgb(134, 96, 37);
    color: rgb(134, 96, 37);
    border-radius: 20px;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

.hban1rap h1 :hover {
    background-color: rgba(0, 0, 0, 0.5);
    border-left: 4px solid rgb(12, 12, 12);
    border-right: 4px solid rgb(8, 8, 8);
}

.hbban1 {
    padding-top: 4vh;
    height: 75vh;
    width: 99%;
    margin: auto;
    /* border: 2px solid; */
}

.hscroll-container1 {
    background-color: #333;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;
}

.hscroll-container {
    padding: 10px;
}




/* travel */
.trmain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));
}

.tmid1 {
    height: 100vh;
    width: 99%;
    background-image: url(./product/tp1.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    margin: auto;
    border-radius: 20px;
    margin-top: 1vh;
}

.tmid1 h1 {
    text-align: center;
    color: white;
    font-size: 36px;
}

.tmid1rap {

    padding-top: 50vh;
    height: 30vh;
    width: 90%;
    margin: auto;
    /* background-color: rgba(0, 0, 0, 0.5); */
    border-radius: 10px;
}

.tbox1 {
    margin: auto;
    height: 20vh;
    border: 2px solid;
    border-radius: 30px;
    background-color: rgba(0, 0, 0, 0.5);
    display: grid;
    grid-template-columns: auto auto auto auto auto auto;

}

.tbox1 input {
    margin-left: 3vh;
    margin-top: 8vh;
    border-radius: 15px;
    height: 5vh;
    text-align: center;
}

.tbox14 input {
    background-color: blue;

}

.tbox1 ::placeholder {
    color: #333;
}

.tbox14 input {
    /* padding-left: 3vh;
    padding-right: 3vh; */
    padding: 1vh 5vh;
    color: #ffffff;

}

.tmid2 {
    height: 50vh;
    width: 99%;
    margin: auto;
    margin-top: 1vh;
    padding-bottom: 1vh;
}

.tmid2 img {
    border-radius: 20px;
}



/* accessories */
.amain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));
}

.aban {
    height: 100vh;
    width: 100%;
    background-image: url(./product/ap1.jpg);
    background-size: 100%;
}





/* phones */
.pmain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));
}

.pbban1 {

    height: 110vh;
    width: 100%;
    margin: auto;
    /* border: 2px solid; */
}

.pscroll-container1 {
    background-color: transparent;
    overflow: auto;
    white-space: nowrap;
    padding: 10px;
}

.pscroll-container1 img {
    padding: 10px;
}



/* electronics */
.emain {
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));
}

.ebban {
    width: 100%;
    height: 90vh;
    background-image: url(./product/ep3.png);
    background-size: 100%;
}

.ebban h1 {
    padding-left: 40px;
    padding-top: 15vh;
    font-size: 36px;
}

.ebban h2 {
    padding-left: 40px;
    /* padding-top: 10vh; */
    font-size: 30px;
}

.ebban b {
    color: green;
}

.ebban a {
    margin-left: 40px;
    margin-top: 15vh;
    /* padding-top: 10vh; */
    font-size: 40px;
    color: white;
    background-color: transparent;
    border: 2px solid;
    padding: 2vh 5vh;
    border-radius: 20px;
    position: absolute;
    border-color: lightgoldenrodyellow;
    text-decoration: none;

}

.ebban a:hover {

    background-color: rgba(253, 249, 17, 0.5);
    color: rgb(32, 160, 0);
    /* background-image: url(./logo.png); */

    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-blend-mode: difference;
    border: 0.5px solid green;
    /* border: 0.5px solid red; */
    border-radius: 20px;

}


/* toys */
.tybban {
    width: 100%;
    height: 95vh;
    background-image: url(./product/t2.jpg);
    background-size: 100%;
}

.tybban h1 {
    padding-left: 40px;
    padding-top: 15vh;
    font-size: 36px;
}

.tybban h2 {
    padding-left: 40px;
    /* padding-top: 10vh; */
    font-size: 30px;
}

.tybban b {
    color: green;
}

.tybban a {
    margin-left: 40px;
    margin-top: 15vh;
    /* padding-top: 10vh; */
    font-size: 40px;
    color: white;
    background-color: transparent;
    border: 2px solid;
    padding: 2vh 5vh;
    border-radius: 20px;
    position: absolute;
    border-color: lightgoldenrodyellow;
    text-decoration: none;

}

.tybban a:hover {

    background-color: rgba(253, 249, 17, 0.5);
    color: rgb(32, 160, 0);
    /* background-image: url(./logo.png); */

    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-blend-mode: difference;
    border: 0.5px solid green;
    /* border: 0.5px solid red; */
    border-radius: 20px;

}
.tybban1{
    height: 120vh;
    width: 100%;
}




/* Cart */
.cmid {
    width: 100%;
    height: 100vh;
    background-image: linear-gradient(90deg, rgb(185, 239, 246), #f5fefd, rgb(185, 239, 246));

}

.cmidrap {
    width: 80%;
    height: 100vh;
    margin: auto;
    background-color: rgb(255, 255, 255);

}

.boxc {
    padding-top: 25vh;
    width: 30%;
    height: 60vh;
    margin: auto;
    /* border: 1px solid; */
    /* display: grid;
    grid-template-rows: auto; */

}

.boxc img {
    width: 100%;
    height: 40vh;
    margin: auto;
}

.boxc h1 {
    text-align: center;
    text-transform: capitalize;
}

.boxc h3 {
    text-align: center;
    text-transform: capitalize;
}

.boxc button {
    margin-top: 5vh;
    margin-left: 18vh;
    text-align: center;
    padding: 10px 20px;
    background-color: rgba(9, 137, 243, 0.74);

}

.boxc button a {
    text-decoration: none;
    color: white;
}

.foot4 {
    
    padding-top: 2vh;
    height: 9vh;
    border-top: 1px solid grey;
    text-align: center;
    background-color: black;
    color: white;
    font-size: 13px;
}


/* bas */
.basmid{
    height: 100vh;
    width: 80%;
    margin: auto;
    background-image: url(./image/bban16.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}