@import url(https://fonts.googleapis.com/css2?family=Grand+Hotel&display=swap);header{min-height:70px;width:100%;overflow:hidden;display:flex;flex-wrap:wrap;justify-content:space-around;align-items:center;position:fixed;background:var(--secondary);z-index:99;box-shadow:var(--shadows)}header .logo{flex:1 1;padding-left:10px;margin-top:-5px}.logo a{font-size:20px;font-family:"Grand Hotel",cursive}.logo a,ul a{text-transform:uppercase;color:var(--primary)}ul a{font-size:15px;font-family:monospace;font-weight:700}header ul li{display:inline-block;padding:0 15px}header ul li:hover{opacity:1}.nav-icon{color:var(--primary);margin-bottom:-3px;font-size:18px;margin-right:4px}.menu{display:none}.cart-icon{position:relative;margin-right:40px;margin-top:5px}.cart-icon a{color:var(--primary);font-size:25px}.cart-icon span{background:var(--crimson);border-radius:20px;color:var(--primary);position:absolute;top:-10px;right:-10px;padding:5px 7px;font-size:10px}@media (max-width:878px){header ul a{font-size:10px}header .logo{min-width:115px;flex:none}header ul{padding:10px 0}}@media (max-width:720px){header ul{position:fixed;top:0;left:-100%;width:100%;height:100vh;background:var(--secondary);display:flex;flex-direction:column;line-height:90px;align-items:center;opacity:.98;z-index:999;transition:.5s ease-in-out;padding-top:60px}header .menu{display:block;cursor:pointer;color:var(--primary);font-size:30px;padding-left:10px}header ul li .menu{position:absolute;top:20px;right:20px}header{justify-content:space-between}}@media screen and (max-width:425px){.cart-icon{margin-right:20px;font-size:28px}}@media screen and (max-width:375px){header ul{padding-top:50px;overflow:auto}}.footer{display:grid;overflow-x:hidden;background:var(--footer);grid-template-columns:repeat(1,1fr);padding:20px 60px 40px;margin-top:0}.footer-left{padding:0 20px}.footer-left>h4{color:var(--crimson);font-family:monospace;font-size:18px}.footer-left p{color:var(--primary);font-family:Tahoma;font-size:14px}.footer-left .copyright{margin-top:15px;color:var(--lemon);font-size:13px;margin-bottom:20px}.footer-middle{padding:0 20px}.footer-middle>h4{color:var(--crimson);font-family:monospace;font-size:18px}.footer-middle p{color:var(--primary);font-family:Tahoma}.footer input{border:none;outline:none;width:100%;margin-top:5px;margin-bottom:20px}.footer input::-webkit-input-placeholder{color:var(--secondary)}.footer input::placeholder{color:var(--secondary)}.footer-right{padding:0 20px;text-align:center}.footer-right>h4{color:var(--crimson);font-family:monospace;font-size:18px}.footer-right p{color:var(--primary);font-family:Tahoma}.footer-right .icons{color:var(--primary);font-size:18px;display:flex;justify-content:space-evenly;width:50%;margin:20px auto}.footer-right small{color:var(--lemon);margin-bottom:20px}@media screen and (min-width:769px){.footer{grid-template-columns:repeat(3,1fr);padding:40px 20px 60px;margin-top:50px}}@media screen and (max-width:425px){.footer{padding:20px 15px 40px;text-align:center}}@media screen and (max-width:375px){.footer{padding:20px 0 40px}}@media screen and (max-width:425px){.footer{padding:20px 20px 40px;text-align:center}}.notfound{padding:120px 0}.not-center{width:100%;max-width:900px;margin:0 auto;text-align:center;border-radius:10px;padding:70px 0}.not-center>h1{font-size:85px}.not-center>h1,.not-center h2{font-family:cursive;color:#dc143c}.not-center h2{font-size:35px}.not-center h3{color:#38023b;margin-top:10px}.not-center h3 span{color:red;font-size:15px}.product_card{max-width:200px;overflow:hidden;height:280px;box-shadow:var(--shadow);margin:10px 0;position:relative;background:var(--primary);transition:all 1s linear;border-radius:5px;border:1px solid var(--tetiary)}.product_card:hover{cursor:pointer;box-shadow:var(--shadows)}.card-top{padding:10px}.product-image{width:100%;height:210px;display:block;object-fit:cover;transition:all 1s linear;padding:15px}.product_card:hover .product-image{-webkit-transform:scale(1.2);transform:scale(1.2)}.product_card:hover .product_box{background:var(--primary);color:var(--secondary)}.product_card:hover .product_box h2{color:var(--secondary)}.product_box{background:var(--secondary);padding:5px;height:70px;transition:all 1s linear}.product_box h2{width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-transform:capitalize;cursor:pointer;color:#fff;font-weight:400;font-size:15px}.product_card span{color:var(--lemon);padding-top:5px;font-size:15px}.row_btn{position:absolute;bottom:50px;right:0;transition:all 1s linear;width:100%;display:flex;justify-content:space-between;-webkit-transform:translateX(105%);transform:translateX(105%)}.product_card:hover .row_btn{-webkit-transform:translate(0);transform:translate(0)}.row_btn a{width:50%;text-align:center;text-transform:uppercase;color:var(--primary);font-weight:600;letter-spacing:2px;padding:6px}#btn_buy{background:var(--secondary);border-radius:.5rem .5rem 0 0;margin-right:5px;font-size:.8rem}#btn_buy:hover{background:var(--hover)}#btn_view{background:var(--footer);margin-left:5px;border-radius:.5rem .5rem 0 0;font-size:.8rem}#btn_view:hover{background:var(--hover)}.product_card input{position:absolute;width:25px;height:25px}.checkbox{z-index:999}@media screen and (max-width:320px){.product_card{max-width:290px;height:320px}.product-image{height:250px}#btn_buy,#btn_view{padding:10px}}@media screen and (max-width:375px) and (min-width:321px){.product_card{max-width:310px;height:320px}.product-image{height:250px}#btn_buy,#btn_view{padding:10px}.product_box h2,.product_card span{font-size:16px}}@media screen and (max-width:425px) and (min-width:376px){.product_card{max-width:350px;height:350px}.product-image{height:280px}#btn_buy,#btn_view{padding:10px}.product_box h2,.product_card span{font-size:16px}}.products{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));justify-items:center;margin:20px 0}.delete-all{text-align:right;margin:20px}.delete-all input{height:25px;width:25px;-webkit-transform:translateY(5px);transform:translateY(5px);margin:0 15px}.delete-all span{text-transform:uppercase;color:#03a5ce;letter-spacing:1.3px}.delete-all button{border:1px solid #dc143c;padding:10px 25px;color:#dc143c;text-transform:uppercase}.filter_menu{width:100%;min-height:40px;overflow:hidden;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:90px 30px 20px;background:var(--primary)}.filter_menu select,input{border:none;outline:none;height:40px;padding:0 5px;box-shadow:2px 2px 5px 2px rgba(0,0,0,.2);background:#fff;border-radius:10px}.filter_menu input{flex:1 1;margin:0 10px}.load_more{text-align:center}.load_more button{padding:10px 25px;margin-bottom:20px;border:1px solid #555;text-transform:capitalize}@media screen and (max-width:500px){.products{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.filter_menu select,input{border:1px solid #ccc;outline:none;height:40px;padding:10px;width:90vw;margin:0 auto}.filter_menu select{margin:5px auto}.filter_menu input{flex:1 1;margin:0}.filter_menu{display:flex;flex-direction:column;padding:80px 0 0}}.detail{width:100%;padding:100px 50px;font-size:150%;display:flex;justify-content:space-around;flex-wrap:wrap}.detail img{max-width:400px;width:100%;margin:20px;height:450px;object-fit:cover;display:block}.box-detail{max-width:500px;width:100%;margin:120px 20px}.box-detail .row{display:flex;justify-content:space-between;align-items:center}.box-detail h2{text-transform:uppercase;color:var(--crimson);letter-spacing:2px;font-weight:2rem;font-family:"Akaya Telivigala",cursive}.box-detail p{line-height:1.5;margin:10px 0;opacity:.8;font-size:15px;color:var(--crimson)}.box-detail span{color:var(--secondary);font-weight:700}.box-detail h3{color:var(--footer)}.box-detail .carte{background:var(--secondary);color:var(--primary);margin-top:10px;padding:10px 25px;display:inline-block;text-transform:uppercase;letter-spacing:2px;font-size:16px;cursor:pointer}.box-detail .carte:hover{background:var(--crimson)}.related>h2{background:var(--footer);padding:10px;color:var(--primary)}@media screen and (max-width:425px){.detail{padding:100px 10px}.box-detail{margin:20px 10px}}.login{padding:120px 0;height:100%}.login-page{max-width:500px;background:var(--primary);border-radius:5px;padding:20px;margin:auto;box-shadow:var(--shadows)}.login .toaster{margin-top:75px}.login-page h2{text-transform:uppercase;letter-spacing:2px;color:var(--crimson);text-align:center;font-family:"Akaya Telivigala",cursive}.login-box div{margin-top:10px;margin-bottom:10px}.login-page form button,.login-page form input{width:100%;height:50px;margin:10px 0;padding:0 5px;outline:none;color:var(--crimson);font-weight:700;font-size:13px}.login-page form .row{display:flex;justify-content:space-between;flex-wrap:wrap-reverse;align-items:flex-start}.login-page form button{width:100%;background:var(--secondary);color:var(--primary);text-transform:uppercase;letter-spacing:2px;margin-bottom:20px}.login-page form button:hover{background:var(--crimson)}.login-page form a{color:var(--footer);letter-spacing:1.3px;font-size:13px;font-family:cursive}.login-page p,a{font-family:monospace;font-weight:700}.forgot{padding:100px 0 50px}.fg_pass h2{color:red;text-transform:uppercase;text-align:center;font-size:2rem;margin:50px 0;letter-spacing:1.3px}.fg_pass .row{max-width:500px;margin:auto;padding:0 10px}.fg_pass .row input{width:100%;height:45px;border:1px solid #dc143c;outline:none;padding:0 15px;border-radius:3px;margin:5px 0;font-size:13px}.fg_pass .row button{width:100%;height:40px;margin:10px 0;padding:0 5px;background:#dc143c;border:1px solid #38023b;color:#fff}.login-page .hr{margin:0;color:var(--crimson);text-align:center;font-family:Tahoma;font-size:14px}.login-page .social{width:100%;margin:20px 0;height:50px;font-size:14px;font-weight:200;text-transform:capitalize;letter-spacing:1.3px;box-shadow:var(--shadows);text-align:center;padding:10px;border-radius:15px;cursor:pointer}.social .button{padding:0;border:none!important;text-align:center;color:var(--secondary)!important;box-shadow:none!important;margin-top:-1px}.login-page .socials{width:100%;margin:20px 0;height:50px;letter-spacing:1.3px;box-shadow:var(--shadows);text-align:center;border-radius:15px;cursor:pointer;background:#00f}.buttons{background:none;width:100%;color:var(--primary);font-size:16px;margin-top:5px}@media screen and (max-width:500px){.login{padding:120px 10px}}.profile{padding:100px 10px;height:100%}.profile-column{max-width:700px;margin:0 auto}.profile-column h2{text-align:center;font-size:1.7rem;text-transform:uppercase;color:var(--secondary);margin:10px 0}.profile-column .avatar{width:150px;height:150px;overflow:hidden;position:relative;margin:15px auto;border:1px solid #dc143c;border-radius:50%;cursor:pointer}.profile-column .avatar img{width:100%;height:100%;display:block;object-fit:cover}.avatar span{bottom:-30%;height:50%;background:#dc143c;text-align:center;font-weight:400;text-transform:uppercase;color:#fff;transition:.3s ease-in-out;padding:3px}.avatar #file_up,.avatar span{position:absolute;left:0;width:100%}.avatar #file_up{top:0;height:100%;cursor:pointer;opacity:0}.avatar .camera{font-size:25px}.profile-column label{display:block;margin-top:5px;color:var(--secondary)}.profile-column input{width:100%;height:40px;margin:5px 0;border:none;outline:none;background:var(--primary);padding:0 5px;color:var(--crimson)}.profile-column .em{margin:10px 0}.profile-column button{background:#dc143c;color:#fff;padding:15px 25px;text-transform:uppercase;letter-spacing:1.4px;margin:20px 0;width:100%;height:50px;font-weight:700}.profile-column button:hover{background:var(--secondary)}.loading{height:80px;width:80px;margin:30px auto}.profile-column .toaster{margin-top:50px}.carting{padding-top:100px}.cart{position:relative;border:1px solid #ccc;-webkit-transform:scaleY(.98);transform:scaleY(.98);width:95%;margin:0 auto;border-radius:10px;box-shadow:2px 2px 5px 2px rgba(0,0,0,.2)}.amount span{color:var(--crimson);padding:0 20px}.amount button{width:40px;height:40px;border:1px solid var(--crimson);border-radius:150px;font-size:25px;color:var(--crimson);cursor:pointer}.amount button:hover{background:var(--secondary);color:var(--primary)}.delete{position:absolute;top:20px;right:20px;color:var(--crimson);font-weight:900;cursor:pointer}.total{width:95%;height:50px;display:flex;align-items:center;justify-content:space-between;margin:20px auto}.total h3{color:var(--crimson);font-size:25px}.empty{padding:100px 0;height:100vh}.empty>h2{font-family:cursive;color:var(--secondary)}.check>h3{font-size:18px;text-align:center}.history-page{overflow-x:auto;padding:120px 20px}.history-page h2,h4{text-align:center;margin:20px;text-transform:uppercase;letter-spacing:1.2px;color:var(--secondary)}.history-page table{margin:auto;width:100%}.history-page table,td,th,tr{box-shadow:var(--shadow);border-collapse:collapse;color:var(--crimson);font-family:Tahoma;border-radius:15px}td,th{text-align:center;padding:15px;font-size:14px}table a{color:#03a5ce}.history-page img{width:70px;height:100px;object-fit:cover}.categories{max-width:700px;display:flex;flex-wrap:wrap;justify-content:space-around;margin:auto;padding:150px 0;height:100%}.categories form{width:290px;margin-bottom:20px}.categories label{display:block;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px}.categories input,button{height:35px;border:none;outline:none}.categories input{width:210px}.categories button{width:70px;background:#dc143c;color:#fff;margin-left:10px}.categories .row{min-width:290px;display:flex;justify-content:space-between;align-items:center;padding:10px;margin-bottom:10px;border:1px solid #ccc}@media screen and (min-width:1024px){.categories{padding:150px 0 30%}}@media screen and (max-width:600px){.categories form{width:290px;margin-bottom:20px;width:100%;text-align:center}}@media screen and (max-width:375px){.categories{padding:130px 20px}}@media screen and (max-width:320px){.categories .cat-button{width:100%;background:#dc143c;margin-left:0}.categories input{margin-bottom:20px;width:100%}}.create_product{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-around;padding-top:100px}.upload{max-width:300px;height:500px;border:1px solid #ddd;padding:15px;margin:-150px 10px 0}#file_up,.upload{width:100%;position:relative}#file_up{height:100%;outline:none}#file_up:before{content:"+";background:var(--primary);color:var(--crimson);font-size:17rem;text-align:center;cursor:pointer;margin:0 auto}#file_img,#file_up:before{position:absolute;width:100%;height:100%;top:0;left:0}#file_img img{width:100%;height:100%;display:block;object-fit:cover}#file_img .span{position:absolute;top:-13px;right:-13px;cursor:pointer;font-size:25px;color:var(--crimson)}.create_product form{max-width:350px;min-width:290px;width:100%;margin:15px 10px}.create_product form .row{width:100%;margin:15px 0}.create_product .row label{color:var(--secondary);font-size:14px;margin-left:5px}.create_product form input,textarea{width:100%;min-height:40px;padding:0 5px;resize:none}.text{box-shadow:var(--shadows);border:none;border-radius:15px}.create_product form button{width:100%;height:40px;background:var(--crimson);color:var(--primary);text-transform:uppercase;letter-spacing:2px;font-weight:700}.select{width:50%;margin:15px 30px;padding:10px;border:none;background:var(--primary);box-shadow:(--shadows);border-radius:15px;color:var(--crimson);outline:none}@media screen and (min-width:1050px){.upload{max-width:450px;height:500px;width:100%;padding:15px;margin:0 20px;position:relative}.create_product form{max-width:500px;min-width:290px;width:100%;margin:15px 30px}}@media screen and (max-width:690px){.upload{max-width:450px;height:500px;width:100%;position:none;margin:10px auto 0}.create_product form{width:100%;margin:15px 0}}@media screen and (max-width:425px){.create_product{padding:80px 10px}.upload{max-width:420px}.create_product form{width:100%}#file_img .span{top:-3px;right:-3px;background:var(--crimson);color:var(--primary);padding:10px;font-size:45px}}.errMsg{color:red}.errMsg,.successMsg{text-align:center;padding:10px 0;letter-spacing:1.3px;font-weight:700;font-size:25px}.successMsg{color:greem}*{padding:0;box-sizing:border-box;margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--primary:#fff;--secondary:#730071;--tetiary:#f1ebeb;--shadows:2px 2px 5px 2px rgba(0,0,0,0.2);--shadow:15px 15px 25px #ddd;--hover:#ec1641;--crimson:#dc143c;--lemon:#0f0;--footer:#350234}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.App{max-width:100%;min-height:100vh;box-shadow:0 0 35px #eee}a{text-decoration:none}ul li{list-style:none}button{border:none;outline:none;background:transparent;cursor:pointer}.toaster{margin-top:60px}@media screen and (max-width:500px){.toaster{margin-top:50px}}.pay-button{background:#dc143c;background:var(--crimson);padding:10px 25px;color:#fff;font-weight:700;cursor:pointer}.load-page{background:#fff;overflow:hidden}.loader{width:200px;height:200px;margin:auto}.loader div{width:calc(100% - 15px);height:calc(100% - 15px);border:2px solid #fff;border-top-color:#00f;border-radius:50%;animation:rotate 10s linear infinite alternate-reverse}@-webkit-keyframes rotate{50%{-webkit-transform:rotate(80deg);transform:rotate(80deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotate{50%{-webkit-transform:rotate(80deg);transform:rotate(80deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.activation{padding-top:80px;height:120vh}.activation-center{border:1px solid red;max-width:700px;border-radius:6px;text-align:center;padding:30px 0;position:absolute;top:120px;left:25%;right:25%}.active-div{line-height:40px}.active-div h2{color:#38023b}@media screen and (max-width:425px){.activation-center{width:100%;left:0;right:0}}.users{padding:100px 0;height:100%}.users .users-center{padding:0 10px;flex:1 1;width:100%}.users-center h2{font-size:1.7rem;text-transform:uppercase;color:var(--secondary);margin:10px 0;text-align:center;font-family:cursive}.customers{border-collapse:collapse;width:100%;border:none}.customers td,.customers th{padding:8px;min-width:100px}.customers tr:nth-child(2n){background:var(--primary)}.customers th{padding-top:12px;padding-bottom:12px;text-align:center;background:var(--secondary);color:var(--primary)}.customers i{cursor:pointer}.customers .check{color:green}.customers .times{color:red}.customers .trash{color:red;cursor:pointer}