#myInput {
background-image: url('/css/searchicon.png'); background-position: 10px 12px; background-repeat: no-repeat; 
width: 70%; font-size: 14px; padding: 12px 20px 12px 40px; border: 5px solid hsla(270, 85%, 35%, 0.856); margin-bottom: 12px; 
margin-left: 15%;border-radius: 25px;margin-top: -5px;}


.section-p1 {padding: 1px 1px;}
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top:45px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url();
background-position: top 35% right 10%; height:180px;}
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 70%;}
.search button:hover{color: red;background-color: aqua; }
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 90%;}


@media screen and (max-width: 830px) {
.section-p1 {padding: 1px 1px;}
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top:55px; 
color: orangered;margin-bottom: -85px;background-color:#017575 ;background-image: url(.);
background-position: top 5% right 90%;height: 300px;width: 100%;}
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 70%;}
}

@media screen and (max-width: 800px) {
.section-p1 {padding: 1px 1px;}
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top:55px; 
color: orangered;margin-bottom: -85px;background-color:#017575 ;background-image: url(.);
background-position: top 5% right 90%;height: 300px;width: 100%;}
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 70%;}
}

@media screen and (max-width: 720px) {
.section-p1 {padding: 1px 1px;}
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top:45px; 
color: orangered;margin-bottom: -85px;background-color:#017575 ;background-image: url(.);
background-position: top 5% right 90%;height: 300px;width: 100%;}
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 70%;}
}

@media screen and (max-width: 650px) {
.section-p1 {padding: 1px 1px;}
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top:55px; 
color: orangered;margin-bottom: -85px;background-color:#017575 ;background-image: url(.);
background-position: top 5% right 90%;height: 300px;width: 100%;}
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 70%;}
}

@media screen and (max-width: 600px) {
.section-p1 {padding: 1px 1px;}
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top:55px; 
color: orangered;margin-bottom: -85px;background-color:#017575 ;background-image: url(.);
background-position: top 5% right 90%;height: 300px;width: 100%;}
.search button{font-size: 25px;font-weight: 800;padding: 15px 30px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 70%;}
}

@media screen and (max-width:550px) {
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top: 40px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 200px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   

@media screen and (max-width:500px) {
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top: 35px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 200px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   

@media screen and (max-width: 450px) {
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top: 35px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 180px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   

@media screen and (max-width: 400px) {
.search{text-align: center;font-size: 20px;font-family: 'calibri';font-weight: bold;margin-top: 45px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 200px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   

@media screen and (max-width: 360px) {
.search{text-align: center;font-size:16px;font-family: 'calibri';font-weight: bold;margin-top: 45px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 200px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   

@media screen and (max-width: 290px) {
.search{text-align: center;font-size:10px;font-family: 'calibri';font-weight: bold;margin-top: 20px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 200px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   

@media screen and (max-width: 250px) {
.search{text-align: center;font-size:10px;font-family: 'calibri';font-weight: bold;margin-top: 30px; color: orangered;
margin-bottom: -55px;background-color:#017575 ;background-image: url(.);
background-position: top 15% right 82%; height: 200px;}
.search button{font-size: 15px;font-weight: 800;padding: 10px 15px;color: #1a1a1a;background-color: violet;border-radius: 4px;cursor: pointer;border: none;outline: none;transition:0.2s;margin-left: 49%;}
.search button:hover{color: red;background-color: aqua; }
}   


#myUL {/* Remove default list styling */
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;
display: block;margin-left: 1.9%;margin-top: 10px;}

#myUL li{display: inline-block;height:auto;}

*{margin:0; padding:0;box-sizing: border-box;outline: none; border:none;text-decoration: none;transition: all .2s linear;text-transform: capitalize;}
html{overflow-x: hidden; }
body{background: #eee;}

.containers{margin:0 auto;padding:3rem 2rem;height:auto;margin-top: -5vh;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
gap:2rem;margin-bottom: 10px;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);}
.containers .products-containers .product:hover{outline: .2rem solid #222;outline-offset: 0;}
.containers .products-containers .product img{height: 11rem;}

.containers .products-containers .product h3{padding:.5rem 0;font-size: 1.5rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.5rem;color:#444;}

@media screen and (max-width: 900px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display:block;margin-left:0%;height: auto;}
#myUL li{margin-left:1%;width: 48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:1rem;margin-bottom: 10px;margin-left:-5%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}

}

@media screen and (max-width: 820px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top:50px;}
#myUL li{margin-left:1%;width: 32%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:1rem;margin-bottom: 10px;margin-left:2%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}
}


@media screen and (max-width: 800px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top:50px;}
#myUL li{margin-left:1%;width: 32%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:1rem;margin-bottom: 10px;margin-left:2%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}
}

@media screen and (max-width:720px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top: 40px;}
#myUL li{margin-left:1%;width: 32%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
gap:1rem;margin-bottom: 10px;margin-left:1%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 1px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}

}

@media screen and (max-width: 650px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top:40px;}
#myUL li{margin-left:1%;width:32%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-5%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}

}

@media screen and (max-width: 600px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: 
block;margin-left:0%;height: auto;margin-top: 40px;}
#myUL li{margin-left:1%;width: 32%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:1%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 1px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}

}


@media screen and (max-width: 550px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display:block;margin-left:0%;height: auto;}
#myUL li{margin-left:1%;width: 48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-3%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.4rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}
}

@media screen and (max-width: 500px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display:block;margin-left:0%;height: auto;}
#myUL li{margin-left:1%;width: 48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-3%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.3rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;border-radius: 10px;}
}

@media screen and (max-width: 420px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top: 20px;}
#myUL li{margin-left:1%;width: 48%;border:1px solid #040008;margin-bottom: 5px;height: 20rem;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-5%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 11px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.3rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 13rem;width:14rem;}
}

@media screen and (max-width: 390px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top: 20px;}
#myUL li{margin-left:1%;width:48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:1rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-1%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left:3px;margin-bottom: 5px;}
.containers .products-containers .product h3{padding:.2rem 0;font-size:1.3rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 11rem;width:11rem;border-radius: 10px;}
}

@media screen and (max-width: 360px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display: block;margin-left:0%;height: auto;margin-top: 10px;}
#myUL li{margin-left:1%;width:48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:1rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-4%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 10px;margin-bottom: 5px;}
.containers .products-containers .product h3{padding:.2rem 0;font-size:1.3rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 11rem;width:11rem;border-radius: 10px;}
}


@media screen and (max-width: 330px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display:block;margin-left:0%;height: auto;}
#myUL li{margin-left:1%;width:48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:1rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-1%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left:2px;margin-bottom: 5px;}
.containers .products-containers .product h3{padding:.2rem 0;font-size:1.2rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.3rem;color:#444;}
.containers .products-containers .product img{height: 11rem;width:11rem;border-radius: 10px;}
}

@media screen and (max-width: 290px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display:block;margin-left:0%;height: auto;margin-top: 10px;}
#myUL li{margin-left:1%;width: 48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:0%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 1.5px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.1rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.1rem;color:#444;}
.containers .products-containers .product img{height: 11rem;width:9rem;border-radius: 10px;}
}


@media screen and (max-width: 250px) {
#myUL {
list-style-type: none;padding: 0;margin: 2px;overflow: hidden;display:block;margin-left:0%;height: auto;}
#myUL li{margin-left:1%;width: 48%;border:1px solid #040008;margin-bottom: 5px;}
.containers{max-width: 1300px;margin:11px auto;padding:3rem 0rem;}
.containers .products-containers{display: grid;grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr));
gap:0.5rem;margin-bottom: 10px;margin-left:-1%;}
.containers .products-containers .product{text-align: center;padding:1rem 1rem;background: #fff;box-shadow: 0 .5rem 1rem rgba(0,0,0,.1);margin-left: 1px;}
.containers .products-containers .product h3{padding:.5rem 0;font-size:1.0rem;color:#444;}
.containers .products-containers .product:hover h3{color:#27ae60;}
.containers .products-containers .product .price{font-size: 1.0rem;color:#444;}
.containers .products-containers .product img{height: 11rem;width:8rem;border-radius: 10px;}
}