@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";:root{--white: #fff;--black: #111;--blue: #3a80e9;--grey: #888;--darkgrey: #1b1b1b;--green: #61c96f;--red: #f94141}html{scroll-behavior:smooth}body{margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--black);color:var(--white);font-family:Inter,sans-serif}::selection{background-color:var(--blue);color:var(--white)}::-webkit-scrollbar{width:.3rem}::-webkit-scrollbar-track{background:var(--black)}::-webkit-scrollbar-thumb{background:var(--blue);border-radius:3rem}a{color:var(--white);text-decoration:none}img{-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none}.grey-wrapper{display:block;width:90%;background-color:var(--darkgrey);margin:1.5rem auto;border-radius:.8rem;padding:1rem}.grey-wrapper h2,p{margin:1rem 0rem!important}.coin-days-flex{display:flex;justify-content:flex-start;align-items:center;margin:1.5rem;gap:2rem}html,body{height:100%;margin:0}.app-container{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 3rem;background-color:var(--black);position:sticky;top:0;left:0}.logo{font-size:1.2rem}.links{display:flex;justify-content:flex-end;align-items:center;gap:1.5rem}.link{color:var(--grey);font-weight:600;font-size:1rem}.link:hover{color:var(--white);transition:all .3s}.mobile-drawer{display:none}@media only screen and (max-width: 800px){.navbar{padding:1.5rem}.logo{font-size:1rem}.links{display:none}.mobile-drawer{display:block}.drawer-div{width:40vw;background-color:var(--black);height:100%;padding:1.5rem}}.btn{background-color:var(--blue);color:var(--white);padding:.5rem 1.5rem;border-radius:3rem;font-weight:600;cursor:pointer;border:2px solid var(--blue);text-align:center;min-width:100px;text-transform:capitalize}.btn:hover{box-shadow:5px 5px 10px #3a80e980;transition:all .3s}.outlined-btn{background-color:var(--black);color:var(--white);border:2px solid var(--blue);padding:.5rem 1.5rem;border-radius:3rem;font-weight:600;cursor:pointer;text-align:center;min-width:100px;text-transform:capitalize}.outlined-btn:hover{background-color:var(--blue)}.flex-info{display:flex;justify-content:space-between;align-items:start;padding:.5rem 3rem}.track-crypto-heading,.real-time-heading{font-size:6.5rem;margin:0}.track-crypto-heading{color:var(--white);-webkit-text-stroke-width:3px;-webkit-text-stroke-color:var(--white)}.track-crypto-heading:hover{color:var(--black);-webkit-text-stroke-color:var(--white);transition:all .3s}.real-time-heading{color:var(--blue)}.info-text{font-size:1rem;color:var(--grey)}.btn-flex{display:flex;justify-content:flex-start;gap:1.5rem;align-items:center;margin-top:2rem}.phone-container{width:50%;position:relative;padding:1rem}.iphone{position:absolute;z-index:100;min-width:300px;width:50%;right:0}.gradient{position:absolute;min-width:250px;width:40%;top:8rem;right:0}@media only screen and (max-width: 1200px){.track-crypto-heading,.real-time-heading{font-size:5rem;margin:0}}@media only screen and (max-width: 1000px){.iphone{min-width:250px;width:50%}.gradient{min-width:200px;top:6rem}}@media only screen and (max-width: 800px){.flex-info{flex-direction:column}.phone-container{display:block;margin:auto;margin-top:3rem}.iphone{left:-2rem}.gradient{left:20%}.left-component{width:100%}.track-crypto-heading,.real-time-heading{font-size:3rem;text-align:center}.track-crypto-heading{-webkit-text-stroke-width:1px}.info-text{text-align:center}.btn-flex{justify-content:center}}.footer{background-color:#1e3a8a;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:0 40px;width:100%;height:70px;border-top-left-radius:12px;border-top-right-radius:12px;box-sizing:border-box;margin-top:auto}.footer-left h2{margin:0;font-size:20px;font-weight:700}.footer-right{margin-right:20px;display:flex;gap:15px}.footer-right a{color:#fff;font-size:22px;transition:color .3s ease}.footer-right a:hover{color:#60a5fa}.grid-container{width:300px;background-color:var(--darkgrey);border:2px solid var(--darkgrey);border-radius:.75rem}.grid-container:hover{border-color:var(--green);transition:all .3s}.grid-container-red:hover{border-color:var(--red);transition:all .3s}.info-flex{display:flex;justify-content:flex-start;align-items:center;gap:1rem;margin:1.5rem}.coin-logo{height:3.5rem;width:3.5rem}.coin-symbol{color:var(--white);text-transform:uppercase;font-weight:600;font-size:1.2rem;margin:0}.coin-name{color:var(--grey);text-transform:capitalize;font-weight:light;font-size:1rem;margin:0}.chip-flex{display:flex;justify-content:flex-start;gap:1rem;align-items:center;margin:1rem 1.5rem}.price-chip{border:2px solid var(--green);border-radius:2rem;padding:.35rem 1.25rem;text-align:center;font-weight:600;color:var(--green);font-size:1.1rem;min-width:60px}.price-chip:hover,.icon-chip:hover{background-color:var(--green);color:var(--white);transition:all .3s}.icon-chip{border:2px solid var(--green);border-radius:50%;height:2rem!important;width:2rem!important;display:flex;justify-content:center;align-items:center;color:var(--green);font-size:1.1rem}.chip-red{border:2px solid var(--red)!important;color:var(--red)!important}.chip-red:hover{background-color:var(--red)!important;color:var(--white)!important;transition:all .3s!important}.info-container{margin:1.5rem}.coin-price{color:var(--green);font-size:1.2rem;font-weight:600}.total_volume{color:var(--grey);font-size:1rem;font-weight:500}.grid-flex{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:1.5rem;margin:1.5rem 2rem}.list-table{width:80%;display:block;margin-left:auto;margin-right:auto}.list-row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin:1.5rem;padding:1rem;border-radius:1rem}.list-row:hover{background-color:var(--darkgrey);transition:all .3s}.list-row td{text-align:left;width:18%}.td-image{width:3rem!important;margin-right:2rem}.td-center-align{text-align:center}.td-right-align{text-align:right}.mobile-td-mkt{display:none}.coin-symbol{font-size:clamp(.7rem,1.2vw,1rem);font-weight:600;text-transform:uppercase}.coin-name{font-size:clamp(.75rem,1.5vw,1.1rem);color:var(--grey)}.coin-price{font-size:clamp(.8rem,1.5vw,1.3rem);font-weight:700}.total_volume{font-size:clamp(.7rem,1.2vw,1rem);color:var(--white)}.price-chip{font-size:clamp(.7rem,1.2vw,1rem);padding:.3rem .6rem;border-radius:.5rem;font-weight:600}.icon-chip{font-size:1.2rem;margin-left:.3rem}@media only screen and (max-width: 1100px){.td-icon{display:none}}@media only screen and (max-width: 1200px){.td-total-volume{display:none}}@media only screen and (max-width: 800px){.desktop-td-mkt{display:none}.mobile-td-mkt{display:block}}@media only screen and (max-width: 800px){.list-row{margin:1rem;padding:.75rem}}.search-flex{display:flex;justify-content:flex-start;align-items:center;gap:1.5rem;padding:1rem 3rem;color:var(--grey);background-color:var(--darkgrey);width:80%;margin:1rem;margin-left:auto;margin-right:auto;border-radius:3rem;font-size:1.2rem}.search-flex input{background-color:var(--darkgrey);width:100%;font-family:Inter;font-size:1.2rem;color:var(--grey);border:none}.search-flex input:focus{outline:none}.pagination-component{display:flex;justify-content:center;align-items:center;margin:1.5rem 1.5rem 2.5rem}.loader-container{display:flex;justify-content:center;align-items:center;width:100vw;height:100vh;background-color:var(--black);color:var(--blue);position:fixed;z-index:1000;overflow-y:hidden;overflow-x:hidden}.back-top-top-btn{position:fixed;bottom:1.5rem;right:1.5rem;display:flex;justify-content:center;align-items:center;width:3rem;height:3rem;border:2px solid var(--blue);border-radius:50%;margin:1rem;cursor:pointer}.coin-info-desc{padding-bottom:1rem;cursor:pointer}.coin-info-heading{padding-top:1rem;padding-bottom:1rem}.coin-info-desc a{text-decoration:underline!important}.coin-info-desc a:hover{color:var(--blue)!important}.select-days{display:flex;justify-content:flex-start;align-items:center;gap:.5rem}.toogle-prices{display:flex;align-items:center;justify-content:center;margin:1rem}@media only screen and (max-width: 800px){.toggle-btn{font-size:.7rem!important;padding:.5rem!important}}.coin-flex{display:flex;justify-content:flex-start;align-items:center;gap:1.5rem;margin:1.5rem}
