-
Notifications
You must be signed in to change notification settings - Fork 0
/
style.mini.css
1 lines (1 loc) · 20.4 KB
/
style.mini.css
1
@import url(https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300&display=swap);@import url(https://fonts.googleapis.com/css2?family=Redacted+Script:wght@300&display=swap);@import url(https://fonts.googleapis.com/css2?family=Bangers&display=swap);@font-face{font-family:'WallSmith';src:url(./assets/Wallsmith-Regular.ttf);font-style:normal}*{font-size:62.5%;margin:0;padding:0;box-sizing:border-box;font-family:"M PLUS Rounded 1c",sons-serif;-webkit-user-select:none;user-select:none;cursor:url(./assets/cursor.png),auto}html{font-size:62.5%;scroll-behavior:smooth}body{overflow:hidden;transition:background-color 1s ease;background-color:rgba(20,21,22,255);background-image:repeating-linear-gradient(rgb(7,7,7),rgb(9,36,71),rgb(7,7,7))}.container{margin:0;display:none;justify-content:center;align-items:center;min-height:100vh;padding-top:10vmax;padding-left:10vw;padding-right:10vw;padding-bottom:50px}section p{color:rgb(245,245,245);font-size:1.5vmax;text-align:center}section:last-of-type{height:100vh}.hero-img,.service-img{min-width:80px;width:40vw}.section-heading p{text-transform:uppercase;font-family:'Bangers',cursive;background-image:url(./assets/text-bg.jpg);-webkit-background-clip:text;background-clip:text;color:transparent;animation:text 30s linear infinite;opacity:.5;font-size:4vmax;padding:10px}#header{display:flex;position:fixed;width:100%;top:0;z-index:1;padding:0 1.5rem;min-height:4.5vmax;justify-content:space-between;align-items:center;background-color:rgba(255,255,255,.02)}.logo{background:url(./assets/ig.jpg);font-family:'Redacted Script',cursive;-webkit-background-clip:text;color:transparent;background-clip:text;animation:text 30s linear infinite;transition:all 0.25s ease-in-out 0.1s;font-size:3vmax}@keyframes text{form{background-position:0% 50%}to{background-position:100% 100%}}.navbar-list{display:flex;gap:2vw;list-style:none;padding-right:3vw}.navbar-link{display:inline-block;cursor:pointer;text-transform:uppercase;text-decoration:none;color:rgba(240,248,255,.397);font-family:"M PLUS Rounded 1c",sons-serif;font-size:1.2vw;font-weight:800;padding:.8vw;transition:all 0.3s ease-in-out 0.1s}.navbar-list .active{display:flex;padding-left:.8vw;padding-right:.8vw;margin-top:.6vw;padding-top:0;padding-bottom:0%;color:#ffd900a5;transform:scale(1.1);border-radius:50px;cursor:default;background-color:rgba(245,245,245,.089)}.resume{position:relative;display:inline-block;padding:1vmax .7vmax;color:#fff;font-size:1vmax;font-family:sans-serif;text-decoration:none;text-transform:uppercase;overflow:hidden;transition:.5s;letter-spacing:.3rem}.resume:hover{color:rgb(255,224,86);transform:scale(1.1)}.resume span{position:absolute;display:block}.resume span:nth-child(1){top:0;left:-100%;width:100%;height:2px;background:linear-gradient(90deg,transparent,#ffe137);animation:btn-anim1 1s linear infinite}@keyframes btn-anim1{0%{left:-100%}50%,100%{left:100%}}.resume span:nth-child(2){top:-100%;right:0;width:2px;height:100%;background:linear-gradient(180deg,transparent,#ffe137);animation:btn-anim2 1s linear infinite;animation-delay:.25s}@keyframes btn-anim2{0%{top:-100%}50%,100%{top:100%}}.resume span:nth-child(3){bottom:0;right:-100%;width:100%;height:2px;background:linear-gradient(270deg,transparent,#ffe137);animation:btn-anim3 1s linear infinite;animation-delay:.5s}@keyframes btn-anim3{0%{right:-100%}50%,100%{right:100%}}.resume span:nth-child(4){bottom:-100%;left:0;width:2px;height:100%;background:linear-gradient(360deg,transparent,#ffe137);animation:btn-anim4 1s linear infinite;animation-delay:.75s}.resume:hover span:nth-child(1){background:linear-gradient(90deg,transparent,#ffe137)}.resume:hover span:nth-child(2){background:linear-gradient(180deg,transparent,#ffe137)}.resume:hover span:nth-child(3){background:linear-gradient(270deg,transparent,#ffe137)}.resume:hover span:nth-child(4){background:linear-gradient(360deg,transparent,#ffe137)}@keyframes btn-anim4{0%{bottom:-100%}50%,100%{bottom:100%}}@media (hover:hover){.navbar-link:hover{text-underline-offset:6px;color:aliceblue;transform:scale(1.1);cursor:url(./assets/click.png),auto}.navbar-link.active:hover{text-decoration:none;color:rgba(255,217,0,.648);cursor:url(./assets/cursor.png),auto}}.mobile-nav-icon{padding-top:5px;width:4vmax;height:4vmax;color:rgb(231,183,119)}.mobile-navbar-btn{display:none;background:transparent;cursor:pointer}.mobile-nav-icon[name="close-outline"]{display:none}#home{background-size:cover;justify-content:space-between;min-height:100vh;padding-top:10vmax;padding-left:10vw;padding-right:10vw;padding-bottom:50px}.right-home-div{text-align:center;padding:20px}.left-home-div{min-width:5%;padding-top:10vmin;padding-bottom:10vmin}.profile-img{border-radius:50%;min-width:20px;width:70vmin;max-width:100%}.profile-txt{color:whitesmoke;font-size:3.4vmax;text-align:left;padding-bottom:10px}.profile-me{color:whitesmoke;font-size:2.4vmax}.aboutme{text-align:left;font-size:1.1vmax;padding-bottom:20px}.hello-img{width:3vmax}.my-name{background-image:url(./assets/ig.jpg);-webkit-background-clip:text;background-clip:text;color:transparent;font-family:'Bangers',cursive;font-size:3.4vmax;letter-spacing:.4vw}.social-menu ul{display:flex;gap:2vmax;max-width:100%;margin-left:-10px}.social-menu ul li{list-style:none}.social-menu ul li .fab{font-size:2.5vmax;line-height:4vmax;transition:.3s;color:#fff}.social-menu ul li .fab:hover{color:#fff}.social-menu ul li a{position:relative;display:block;width:4vmax;height:4vmax;border-radius:50%;text-align:center;transition:.6s}.social-menu ul li a:hover{transform:translate(0,-10%)}.social-menu ul li:nth-child(1) a:hover{background-color:#014970}.social-menu ul li:nth-child(2) a:hover{background-color:#323131}.social-menu ul li:nth-child(3) a:hover{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%)}.social-menu ul li:nth-child(4) a:hover{background-color:#e93939}#skills{flex-direction:column;min-height:100vh;padding-top:10vmax;padding-left:10vw;padding-right:10vw;padding-bottom:50px}#skills img{max-width:100%;width:4vmax;height:4vmax;margin:auto}.section-heading{display:flex;position:absolute;margin-bottom:40vmax;max-height:100%}.skill-div{display:flex;flex-direction:column;align-items:center;width:75vmax;height:35vmax;background:rgba(15,15,15,.097);border-bottom:1px solid rgba(245,222,179,.255);border-top:1px solid rgba(245,222,179,.255);border-radius:1vmax}.first-col,.second-col{margin:auto;display:flex;gap:3vmax;transition:all 0.6s ease-in-out .4}.first-col div,.second-col div{display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,rgba(255,255,255,.093),rgba(255,255,255,0));box-shadow:0 8px 32px 0 rgba(0,0,0,.37);width:15vmax;height:12vmax;border-radius:1vmax;transition:all 0.3s ease-in-out 0.1s}.first-col p,.second-col p{font-size:1.5vmax;color:#f1f1f17f}@media (hover:hover){.first-col div:hover,.second-col div:hover{transition:all 0.2s ease-in-out 0.1s;width:15.5vmax;height:12.5vmax}}.project-heading{margin-bottom:40vmax}.project-container{display:flex;width:100%;height:35vmax;background:rgba(15,15,15,.097);border-top:1px solid rgba(245,222,179,.255);border-radius:1vmax;flex-wrap:nowrap;overflow-x:scroll;overflow-y:hidden;scroll-behavior:smooth;padding-top:5.5vmax;padding-bottom:0;padding-left:0;margin:0 auto;-webkit-transition:all;transition:all}.project-div p{font-size:2vmax;font-style:italic;background-image:url(./assets/text-bg.jpg);-webkit-background-clip:text;background-clip:text;animation:text 30s linear infinite;color:transparent;opacity:.6}.slides{min-width:20%;height:25vmax;padding-right:50vmax;border-radius:.8vmax;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;display:flex;justify-content:center;flex-direction:column;flex-wrap:nowrap;margin-right:10px;background-size:cover}.slides:first-child:hover{transform:translate3d(0,-2vmax,0);margin-right:20px}.slides:not(:first-child):hover{transform:translate3d(0,-2vmax,0);margin-left:10px;margin-right:20px}.tab5{background-position:center}.slides span{display:flex;justify-content:center;flex-direction:column;text-align:center;font-family:'WallSmith';color:rgba(255,255,255,.664);text-transform:uppercase;border-radius:.8vmax;width:50.1vmax;height:25vmax}.tab1 span,.tab2 span,.tab3 span,.tab4 span{font-size:7vmax}.tab5 span{font-size:5vmax}.otherDevice span{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background-color:rgba(0,0,0,.735);-webkit-transition:ease-in-out 0.1s;transition:ease-in-out 0.1s}.otherDevice:hover span{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);-webkit-transition:ease-in-out 0.1s;transition:ease-in-out 0.1s;font-size:0;width:0;padding:0}.android span{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.android:hover span{display:none}.ios span{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}.ios:hover span{-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transform:scale(0)}.src-btn{display:inline-block;font-family:"Helvetica","Arial",sans-serif;font-size:0;padding:0;width:0;opacity:0;bottom:1vmax;background-color:#fff0;color:rgb(255,255,255);border-width:1px;border-color:#fff;position:fixed}.src-btn:hover{background-color:rgb(255,255,255);box-shadow:0 0 .5vmax #fff;color:#000;border-width:1px}.src-btn:active{transform:scale(.9);background-color:#fff;box-shadow:0 2px 25px rgba(255,255,255,.2)}.slides:hover .src-btn{opacity:1;transition:all 0.1s ease-in-out 0.1s;width:8vmax;padding:.5vmax;font-size:1vmax;bottom:1.5vmax;left:6vmax}#portfolio-link-btn{left:5vmax}#portfolio-code-btn{left:14vmax}#weather-link-btn{left:5vmax}#weather-code-btn{left:14vmax}#calci-link-btn{left:5vmax}#calci-code-btn{left:14vmax}#quizzer-link-btn{left:5vmax;background-color:#323131}#quizzer-code-btn{left:14vmax;background-color:#323131}#-code-btn{left:14vmax}.project-container::-webkit-scrollbar{height:1px}.project-container::-webkit-scrollbar-thumb{background-color:goldenrod}.edu-div{flex-direction:column;align-items:center;width:79vw;height:38vmax;background:rgba(15,15,15,.097);border-bottom:1px solid rgba(245,222,179,.255);border-top:1px solid rgba(245,222,179,.255);border-radius:1vmax;display:flex}.edu-subdiv{margin-top:2vmax;display:flex;background:linear-gradient(135deg,rgba(255,255,255,.093),rgba(255,255,255,0));box-shadow:0 8px 32px 0 rgba(0,0,0,.37);width:75vw;height:16vmax;border-radius:1vmax;transition:all 0.3s ease-in-out 0.1s;gap:30px}.edu-subdiv div{margin:auto;margin-left:20px;margin-right:20px}.edu-subdiv p{text-align:left}.edu-div span{color:rgba(245,245,245,.607);font-size:.8vmax}.default-status{font-size:1vmax;background-color:rgba(1,252,10,.139);width:max-content;padding-left:1vmax;padding-right:1vmax;border-radius:1vmax}.persuing{background-color:rgba(238,53,53,.412);font-weight:400;font-size:1vmax}.edu-heading{margin-bottom:42.5vmax}.edu-heading p{font-size:3.5vmax}.edu-img{margin-top:auto;margin-bottom:auto;width:9.5vmax;height:9vmax;background-color:#fff;padding:1vmax;border-radius:1vmax}.edu-p{font-weight:600;font-size:1.6vmax}.edu-about{font-size:1.3vmax}#certificates{flex-direction:column;min-height:100vh;padding-top:10vmax;padding-left:10vw;padding-right:10vw;padding-bottom:50px}#certificates a{text-decoration:none;font-size:1.3vmax;color:#757036}.view-link{transform:scale(1.1);cursor:url(./assets/click.png),auto}.certificate-div{display:flex;flex-direction:column;align-items:center;width:75vmax;height:35vmax;background:rgba(15,15,15,.097);border-bottom:1px solid rgba(245,222,179,.255);border-top:1px solid rgba(245,222,179,.255);border-radius:1vmax}.first-line,.second-line{margin:auto;display:flex;gap:3vmax;transition:all 0.6s ease-in-out .4}.first-line div,.second-line div{display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,rgba(255,255,255,.093),rgba(255,255,255,0));box-shadow:0 8px 32px 0 rgba(0,0,0,.37);width:15vmax;height:12vmax;border-radius:1vmax;transition:all 0.3s ease-in-out 0.1s;padding-top:1vmax}.first-line p,.second-line p{font-size:1.3vmax;color:#ffffffce}.first-line h2,.second-line h2{font-size:1.5vmax;align-self:center;font-weight:bolder;color:#ffffffce}@media (hover:hover){.first-line div:hover,.second-line div:hover{transition:all 0.2s ease-in-out 0.1s;width:15.5vmax;height:12.5vmax}}#experience a{text-decoration:none;font-size:1.2vmax;color:#fff}.edu-p-sm{font-weight:600;font-size:1.2vmax;color:#fff}.certificate-btn{margin-left:3vmax;padding:.3vmax .7vmax}#contact{background-image:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0),rgb(5,75,133));flex-direction:column;justify-content:space-evenly}.contact-div{display:flex;justify-content:space-evenly;gap:5vw}.contact-image-div{min-width:50%;margin-left:auto}.contact-img{width:30vmax}.mail-div{display:flex;flex-direction:column;gap:3vmax;min-width:50%}.mail-form{top:50%;width:40vw;height:30vmax;padding:2vmax;background:rgba(0,0,0,.5);box-sizing:border-box;box-shadow:0 15px 25px rgba(0,0,0,.6);border-radius:1vmax}.mail-form .user-box{position:relative}.mail-form .user-box input,textarea{width:100%;padding:1vmax 0;font-size:1vmax;color:#fff;margin-bottom:3vmax;border:none;border-bottom:1px solid #fff;outline:none;background:transparent;-webkit-user-select:text;user-select:text}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0 1000px rgb(0,0,0) inset!important;box-shadow:0 0 0 1000px rgb(0,0,0) inset!important;background-clip:content-box!important}.mail-form .user-box label{position:absolute;top:0;left:0;padding:1vmax 0;font-size:1vmax;color:#fff;pointer-events:none;transition:.5s}.mail-form .user-box input:valid~label,.mail-form .user-box input:focus~label,.mail-form .user-box textarea:focus~label,.mail-form .user-box textarea:valid~label{top:-2vmax;left:0;color:#ffd900a5;font-size:.8vmax}.errorMessage{color:#fff;min-width:12vmax;max-width:100%;padding-left:1vmax;padding-right:1vmax;padding-top:.7vmax;padding-bottom:.7vmax;margin-left:20vw;background-color:rgba(30,30,30);visibility:hidden;border-radius:.5vmax;position:relative;font-size:.9vmax}.errorMessage.top-arrow:after{content:" ";position:absolute;right:9vw;top:-1vmax;border-top:none;border-right:.8vmax solid transparent;border-left:.8vmax solid transparent;border-bottom:1vmax solid rgba(30,30,30)}#nameError{top:-22vmax}#emailError{top:-18.3vmax}#messageError{top:-13vmax}.mail-form form a{position:relative;display:inline-block;padding:1vmax 2vmax;color:#fff;font-size:1vmax;font-family:sans-serif;text-decoration:none;text-transform:uppercase;overflow:hidden;transition:.5s;margin-top:2vmax;letter-spacing:.3rem}.mail-form a:hover{background:#fff;color:rgba(0,0,0,.788);box-shadow:0 0 1vmax #fff}.mail-form a span{position:absolute;display:block}.mail-form a span:nth-child(1){top:0;left:-100%;width:100%;height:2px;background:linear-gradient(90deg,transparent,white);animation:btn-anim1 1s linear infinite}@keyframes btn-anim1{0%{left:-100%}50%,100%{left:100%}}.mail-form a span:nth-child(2){top:-100%;right:0;width:2px;height:100%;background:linear-gradient(180deg,transparent,white);animation:btn-anim2 1s linear infinite;animation-delay:.25s}@keyframes btn-anim2{0%{top:-100%}50%,100%{top:100%}}.mail-form a span:nth-child(3){bottom:0;right:-100%;width:100%;height:2px;background:linear-gradient(270deg,transparent,#ffffff);animation:btn-anim3 1s linear infinite;animation-delay:.5s}@keyframes btn-anim3{0%{right:-100%}50%,100%{right:100%}}.mail-form a span:nth-child(4){bottom:-100%;left:0;width:2px;height:100%;background:linear-gradient(360deg,transparent,#ffffff);animation:btn-anim4 1s linear infinite;animation-delay:.75s}.mail-form a:hover span:nth-child(1){background:linear-gradient(90deg,transparent,rgb(0,0,0))}.mail-form a:hover span:nth-child(2){background:linear-gradient(180deg,transparent,rgb(0,0,0))}.mail-form a:hover span:nth-child(3){background:linear-gradient(270deg,transparent,rgb(0,0,0))}.mail-form a:hover span:nth-child(4){background:linear-gradient(360deg,transparent,rgb(0,0,0))}@keyframes btn-anim4{0%{bottom:-100%}50%,100%{bottom:100%}}#snackbar{visibility:hidden;background-color:#333;color:#fff;text-align:center;border-radius:.5vmax;padding:16px;position:fixed;z-index:1;bottom:80vh;left:15vmax;font-size:1.2vmax}#snackbar.show{visibility:visible;-webkit-animation:fadein 0.5s,fadeout 0.5s 4.5s;animation:fadein 0.5s,fadeout 0.5s 4.5s}@-webkit-keyframes fadein{from{left:0;opacity:0}to{left:15vmax;opacity:1}}@keyframes fadein{from{left:0;opacity:0}to{left:15vmax;opacity:1}}@-webkit-keyframes fadeout{from{left:15vmax;opacity:1}to{left:0;opacity:0}}@keyframes fadeout{from{left:15vmax;opacity:1}to{left:0;opacity:0}}@media screen and (max-width:1360px){#education{padding-left:4vw;padding-right:4vw}.edu-heading{margin-bottom:86vmax}.edu-div{width:90vmin;height:77vmax}.edu-subdiv{margin-top:3vmax;width:87vmin;height:34vmax}}@media (max-width:920px){.mobile-navbar-btn{display:block;z-index:999}.navbar{width:100%;height:100vh;position:absolute;top:0;left:0;padding-top:4.5vmax;padding-bottom:4.5vmax;display:flex;justify-content:center;align-items:center;transform:translate(100%);transition:all 0.5s;overflow-y:scroll}.navbar-list{gap:12vmax;flex-direction:column;align-items:center}#header{height:7vmax}.active .navbar{background-color:rgb(51,46,46);background:linear-gradient(135deg,rgb(26,25,25),rgb(8,8,8));opacity:.99;transform:translateX(0);visibility:visible;pointer-events:auto}.navbar-link{font-size:2.5vmax}.navbar-list .active{padding-left:2vw;padding-right:2vw}.active .mobile-navbar-btn .mobile-nav-icon[name="close-outline"]{display:block}.active .mobile-navbar-btn .mobile-nav-icon[name="menu-outline"]{display:none}.logo{font-size:5vmax}}@media screen and (max-width:830px){#education{padding-left:4vw;padding-right:4vw}.edu-heading{margin-bottom:86vmax}.edu-div{width:90vmin;height:77vmax}.edu-subdiv{margin-top:3vmax;width:87vmin;height:34vmax}}@media screen and (max-width:650px){#header{height:14vmin}.profile-img{max-width:100%}.profile-txt{font-size:8vmin}.aboutme{font-size:3.5vmin}.my-name{font-size:8vmin}.hello-img{width:8vmin}.social-menu ul li a{width:6vmin;height:6vmin}.social-menu ul{display:flex;gap:6vmin;margin-left:0}.social-menu ul li .fab{font-size:6vmin;line-height:6vmin}#home{flex-direction:column;justify-content:center;padding-top:9vw}.skill-div{flex-direction:row;width:90vmin;height:70vmax}.skill-heading{margin-bottom:80vmax}.first-col,.second-col{flex-direction:column;gap:7vmin}#education{padding-left:5vw;padding-right:5vw}.edu-heading{margin-bottom:86vmax}.edu-div{width:90vmin;height:74vmax}.edu-subdiv{margin-top:3vmax;width:88vmin;height:43vmax}.certificate-div{flex-direction:row;width:90vmin;height:70vmax}.certificate-heading{margin-bottom:80vmax}.first-line,.second-line{flex-direction:column;gap:7vmin}.contact-div{flex-direction:column}.contact-div{align-items:center}.contact-img{margin:0;padding-bottom:20px}.contact-div .social-menu{display:flex;justify-content:center}.mail-div{gap:50px}.mail-form{width:80vw;height:42vmax}.mail-form .user-box input,textarea{padding:1.5vmax 0;font-size:2vmax;color:#fff;margin-bottom:3vmax;border:none;border-radius:0;border-bottom:1px solid #fff}.mail-form .user-box label{position:absolute;top:0;left:0;padding:1vmax 0;font-size:1.5vmax;color:#fff;pointer-events:none;transition:.5s}.mail-form .user-box input:valid~label,.mail-form .user-box input:focus~label,.mail-form .user-box textarea:focus~label,.mail-form .user-box textarea:valid~label{top:-2vmax;left:0;color:#ffd900a5;font-size:1.4vmax}#nameError{top:-28.8vmax}#emailError{top:-22.7vmax}#messageError{top:-13.4vmax}#snackbar{text-align:center;padding:16px;position:fixed;bottom:70vh;left:10%;right:10%;font-size:1.6vmax}.errorMessage{visibility:hidden;width:28vw;margin-left:43vw;font-size:1vmax}.errorMessage.top-arrow:after{right:18vw;top:-1vmax;border-right:.8vmax solid transparent;border-left:.8vmax solid transparent;border-bottom:1vmax solid rgba(30,30,30)}@-webkit-keyframes fadein{from{left:0;opacity:0}to{left:10%;opacity:1}}@keyframes fadein{from{left:0;opacity:0}to{left:10%;opacity:1}}@-webkit-keyframes fadeout{from{left:10%;opacity:1}to{left:0;opacity:0}}@keyframes fadeout{from{left:10%;opacity:1}to{left:0;opacity:0}}#projects{padding:0vmax}@supports (-webkit-touch-callout:none){#nameError{top:-30.5vmax}#emailError{top:-24vmax}#messageError{top:-14.5vmax}}}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{box-shadow:rgb(0,0,0,.3);background:#f1f1f1}::-webkit-scrollbar-thumb{background:goldenrod}::-webkit-scrollbar-thumb:hover{background:goldenrod}