@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{background-color:#b2d3a8;font-family:Roboto,sans-serif}ul{list-style:none}a{text-decoration:none}.header{background-color:#bfc4be;box-shadow:1px 1px 5px #0000004d;position:sticky;top:0;width:100%;height:60px;z-index:2}.logo{display:inline-block;color:#212121;font-size:2rem;padding:.7rem;font-weight:700}.hamb{cursor:pointer;float:right;padding:1.8rem 1rem}.hamb-line{background:#fff;display:block;height:3px;position:relative;width:25px}.hamb-line:before,.hamb-line:after{background:#fff;content:"";display:block;height:100%;position:absolute;transition:all .2s ease-out;width:100%}.hamb-line:before{top:6px}.hamb-line:after{top:-6px}.nav{width:100%;height:100%;position:fixed;background-color:#00000067;overflow:hidden;max-height:0;transition:max-height .5s ease-out;display:flex;flex-direction:column}.menu{display:flex;flex-direction:column;justify-content:center;align-items:center}.menu a{display:block;padding:1.3rem;color:#fff;transition:all .3s ease-in-out}.menu a:hover{background-color:#fff;color:#212121}.side-menu{display:none}.side-menu:checked~nav{max-height:100%}.side-menu:checked~.hamb .hamb-line{background:transparent}.side-menu:checked~.hamb .hamb-line:before{transform:rotate(-46deg);top:0}.side-menu:checked~.hamb .hamb-line:after{transform:rotate(46deg);top:0}.menu-cart-container{display:flex;flex-direction:row;justify-content:space-between;width:60px;height:50px;margin-right:1rem;padding:.4rem 0}.menu-cart-image{width:30px;height:30px}.menu-cart-image:hover{background-color:#ccc3c3}.menu-cart-count-container{width:22px;height:22px;background-color:#30537a;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:.4rem;right:1.5rem;transition:all .3s ease-in-out}.menu-cart-count-container:hover{background-color:#212121}.menu-cart-container:hover{cursor:pointer}.menu-cart-count{color:#fff}@media (min-width: 768px){.nav{max-height:none;top:0;position:relative;float:right;width:fit-content;background-color:transparent}.menu{flex-direction:row}.menu li{float:left}.menu a:hover{background-color:transparent;color:#fff}.hamb{display:none}}.contenedor{display:grid;grid-template-columns:repeat(3,1fr);padding:20px 0}.btn{display:flex;justify-content:flex-end}.close-btn{position:relative;top:110px;right:45px;border-radius:50%;background-color:#6b6a6a;border:none;font-size:20px;cursor:pointer;width:30px;height:32px;color:red}.close-btn:hover{background-color:red;color:#fff}.slidercontent{display:flex;justify-content:center;align-items:center;margin:10px;padding:10px;border-radius:10px;background-color:#fff;box-shadow:0 0 10px #0003;transition:all .3s ease-in-out;overflow:hidden}.cartContainer{display:flex;justify-content:center;align-items:center;flex-direction:column;margin:10px;padding:10px;border-radius:10px;background-color:#fff;box-shadow:0 0 10px #0003;transition:all .3s ease-in-out;overflow:hidden}.cardCartContainer{display:grid;grid-template-columns:repeat(3,1fr);padding:20px 0}.cart{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;padding:20px;text-align:center;border-radius:10px;box-shadow:0 0 10px #0003;transition:all .3s ease;border:2px solid #bac0c7;margin:20px;width:80%}.cart img{width:100%;object-fit:cover;cursor:pointer}.cart h3{font-size:1.5rem;font-weight:700;color:#333;cursor:pointer}.cart p{font-size:1rem;font-weight:400;color:#333;padding:2px}.btnAdd{background-color:#30537a;border:none;border-radius:5px;margin:2px;padding:10px 20px;font-size:1rem;font-weight:700;color:#fdfdfd;cursor:pointer;transition:all .3s ease}.btnAdd:hover{background-color:#2f88ee;color:#fff}.btnDecrease{background-color:#30537a;border:none;border-radius:5px;margin:2px;padding:10px 20px;font-size:1rem;font-weight:700;color:#fdfdfd;cursor:pointer;transition:all .3s ease}.btnDecrease:hover{background-color:red;color:#fff}.btnRemove{background-color:red;border:none;border-radius:5px;padding:10px 20px;font-size:1rem;font-weight:700;color:#fdfdfd;cursor:pointer;transition:all .3s ease}.btnRemove:hover{background-color:#25292c;color:#fff}.cartView{display:flex;justify-content:space-between;align-items:center;flex-direction:row;margin:10px;padding:10px;border-radius:10px;transition:all .3s ease-in-out;overflow:hidden;width:100%}.totalCart{margin:2px;padding:10px 20px;font-size:1rem;font-weight:700;color:#161616;transition:all .3s ease;font-size:20px}@media screen and (max-width: 768px){.contenedor{display:flex;flex-direction:column}.close-btn{position:relative;top:20px;right:0;margin:0 auto 10px}}input{width:100%;height:40px;border:1px solid #ccc;border-radius:5px;padding:0 10px;font-size:16px;color:#333;box-sizing:border-box;outline:none;transition:all .3s ease;background:#fff}.container:hover input{background:#ccc;border-color:#666}.container input.error{border-color:red}.container input.error:focus{border-color:red}.container.active input:focus{border-color:#666}.container.active input{width:100%;height:40px;border:1px solid #ccc;border-radius:5px;font-size:16px;color:#333;box-sizing:border-box;outline:none;transition:all .3s ease;background:#fff}.card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;padding:20px;text-align:center;border-radius:10px;box-shadow:0 0 10px #0003;transition:all .3s ease;border:2px solid #bac0c7;margin:20px;width:80%}.card img{width:100%;object-fit:cover;cursor:pointer}.card h3{font-size:1.5rem;font-weight:700;color:#333;cursor:pointer}.card p{font-size:1rem;font-weight:400;color:#333;padding:2px}.card span{padding:2px;margin:2px;color:#b91295}.card button{background-color:#30537a;border:none;border-radius:5px;padding:10px 20px;font-size:1rem;font-weight:700;color:#fdfdfd;cursor:pointer;transition:all .3s ease}.card:hover{box-shadow:0 0 10px #00000080;transform:scale(1.02)}.card button:hover{transition:all .3s ease;background-color:#1d2d44;box-shadow:0 0 10px #0003}.card-detail{display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center;align-content:center;background-color:#fff;padding:20px;text-align:center;border-radius:10px;box-shadow:0 0 10px #0003;transition:all .3s ease;border:2px solid #bac0c7;margin:20px}.card-detail button{background-color:#30537a;border:none;border-radius:5px;padding:10px 20px;font-size:1rem;font-weight:700;color:#fdfdfd;cursor:pointer;transition:all .3s ease}.card-detail img{width:60%;margin:0 auto;object-fit:cover;cursor:pointer}.card-detail h3{font-size:1.5rem;font-weight:700;color:#333;cursor:pointer}.card-detail p{font-size:1rem;font-weight:400;color:#333;padding:2px}.card-detail span{padding:2px;margin:2px;color:#b91295}.text-centered{text-align:center;margin:20px;font-weight:700}@media screen and (min-width: 768px){.card-detail img{width:100%;margin:0 auto;object-fit:cover}.card{flex-direction:column}}@keyframes spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner-container{display:flex;justify-content:center;align-items:center}.load-spinner{width:50px;height:50px;border:8px solid #f3f3f3;border-top:8px solid #3498db;border-radius:50%;animation:spinner 1.5s linear infinite}.slider{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center}.previous,.next{display:flex;align-items:center;justify-content:center;position:absolute;top:1.6rem;width:30px;height:40px;color:red;border:none;background-color:#000;opacity:.8;overflow:hidden;transition:all .3s ease-in-out;border-radius:.5rem}.previous{left:0}.next{right:0}.previous:active,.previous:hover,.next:active,.next:hover{background-color:#fff;color:#000}.category{display:flex;justify-content:center;align-items:center;flex-direction:column;margin:10px;padding:10px;transition:all .3s ease-in-out}.categorycontain{display:flex;justify-content:center;align-items:center;flex-direction:column;margin:2px;padding:10px 20px;border-radius:10px;background-color:#30537a;color:#fff;box-shadow:0 0 10px #0003;transition:all .3s ease-in-out;overflow:hidden}.categorycontain:hover{background-color:red;color:#fff}.close-btn{position:relative;top:90px;right:45px;border-radius:50%;background-color:#6b6a6a;border:none;font-size:20px;cursor:pointer;width:30px;height:32px;color:red}.text-centered{margin:0 auto;text-align:center}.btnCheckout{background-color:green;border:none;border-radius:5px;margin:2px;padding:10px 20px;font-size:1rem;font-weight:700;color:#fdfdfd;cursor:pointer;transition:all .3s ease}.btnCheckout:hover{background-color:#2f88ee;color:#fff}.form-cart{display:flex;justify-content:center;align-items:center;flex-direction:column-reverse}.form-container{width:50vh;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:33rem;margin-top:1rem}.checkout-title{font-size:2rem;margin-bottom:1rem}.form-group{width:100%;display:flex;flex-direction:column;margin-bottom:1rem;position:relative}.form-group label{font-size:1.2rem;color:#333;transition:all .3s ease-in-out}.form-group input{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:.5rem;font-size:1rem}.btn-submit{width:100%;margin-top:1rem}.btn-submit,.btn-submit:active{background-color:#f0c040;color:#fff;border:none;border-radius:.5rem;padding:.5rem;font-size:1rem;cursor:pointer}.btn-submit:focus{outline:none}.btn-submit:hover{background-color:#28c528;color:#fff}.checkoutCartContainer{width:50vh;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:1.5rem;margin-top:1rem}.checkoutTitle{font-size:2rem;margin-bottom:1rem}.cart{display:flex;flex-direction:column;background-color:#fff;padding:20px;text-align:center;border-radius:10px;box-shadow:0 0 10px #0003;transition:all .3s ease;border:2px solid #bac0c7;margin:20px;align-content:center;justify-content:space-between;flex-wrap:wrap}.success{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:1rem}.btn-shopping{background-color:#f0c040;color:#fff;border:none;border-radius:.5rem;padding:.5rem;font-size:1rem;cursor:pointer;margin-top:1rem}