diff --git a/index.html b/index.html index dcbb025..3594d7a 100644 --- a/index.html +++ b/index.html @@ -1 +1 @@ -Ruizo's Lair
\ No newline at end of file +Ruizo's Lair
\ No newline at end of file diff --git a/style.8283b4bb.css b/style.274c1488.css similarity index 82% rename from style.8283b4bb.css rename to style.274c1488.css index 9bdaa38..43333da 100644 --- a/style.8283b4bb.css +++ b/style.274c1488.css @@ -1,2 +1,2 @@ -html{scroll-snap-type:y mandatory;overflow-y:scroll}body{margin:0;cursor:none;height:100vh;background-color:#000}body a{text-decoration:none;color:#fff;cursor:none}@keyframes change{0%{opacity:.8}to{opacity:.25}}.child{height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:0 10%;scroll-snap-align:start}@font-face{font-family:Pixel;src:url(/VCROSDMono.43a29ccd.woff2)}.navbar{font-family:Pixel;position:fixed;width:100%;z-index:50;top:0;padding-top:20px;background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,.01))}.navbar ul{padding:0;margin:0;display:flex;flex-direction:row;align-items:center;justify-content:space-around;font-size:1.5em;text-transform:uppercase;letter-spacing:5px}.navbar ul i{display:none;margin:0}.navbar ul a{color:#b8b8b8;filter:contrast(500%);text-shadow:1px 1px 15px hsla(0,0%,100%,.918);transition:all .1s ease-in-out;margin:0}.navbar ul p{margin:0}.navbar ul a:after{content:"";position:absolute;width:100%;transform:scaleX(0);height:2px;bottom:-5px;left:0;background-color:#8a2be2;transform-origin:bottom right;transition:transform .55s ease-in-out}.navbar ul a:hover:after{transform:scaleX(1);transform-origin:bottom left}.gliched-text{color:#dbd8d8;font-family:Pixel,monospace;line-height:2em;font-size:2.15rem;text-transform:uppercase;transition:all .5s ease-in-out;text-shadow:.1em 0 0 rgba(255,0,0,.349),.1em .07em 0 rgba(0,128,0,.349),-.1em -.07em 0 rgba(0,0,255,.349)}.gliched-move{z-index:5;position:relative;color:#fff}.gliched-move span{position:absolute;left:0;z-index:1}.gliched-move span:first-child{position:inherit;animation:move .5s infinite}.gliched-move span:nth-child(2){animation:move .6s infinite;clip-path:polygon(0 20%,100% 0,100% 45%,0 45%);transform:translate(-.1em,-.025em)}.gliched-move span:last-child{animation:move .3s infinite;clip-path:polygon(0 55%,100% 45%,100% 100%,0 100%);transform:translate(.1em,.025em)}.gliched-move:hover span:first-child{position:inherit;animation:move .2s infinite}.gliched-move:hover span:last-child,.gliched-move:hover span:nth-child(2){clip-path:polygon(0 0,0 0,0 0,0 0)}@keyframes move{0%{text-shadow:.05em 0 0 rgba(255,0,0,.505),-.05em -.025em 0 rgba(0,255,0,.505),-.025em .05em 0 rgba(0,0,255,.505)}14%{text-shadow:.05em 0 0 rgba(255,0,0,.505),-.05em -.025em 0 rgba(0,255,0,.505),-.025em .05em 0 rgba(0,0,255,.505)}15%{text-shadow:-.05em -.025em 0 rgba(255,0,0,.505),.025em .025em 0 rgba(0,255,0,.505),-.05em -.05em 0 rgba(0,0,255,.505)}49%{text-shadow:-.05em -.025em 0 rgba(255,0,0,.505),.025em .025em 0 rgba(0,255,0,.505),-.05em -.05em 0 rgba(0,0,255,.505)}50%{text-shadow:.025em .05em 0 rgba(255,0,0,.505),.05em 0 0 rgba(0,255,0,.505),0 -.05em 0 rgba(0,0,255,.505)}99%{text-shadow:.025em .05em 0 rgba(255,0,0,.505),.05em 0 0 rgba(0,255,0,.505),0 -.05em 0 rgba(0,0,255,.505)}to{text-shadow:-.025em 0 0 rgba(255,0,0,.505),-.025em -.025em 0 rgba(0,255,0,.505),-.025em -.05em 0 rgba(0,0,255,.505)}}.skill-container{position:relative;width:100%;height:10px;border-radius:5px;background-color:rgba(78,77,77,.329);flex:7}.c{position:absolute;width:50%;height:100%;border-radius:5px 0 0 5px;background-color:#8a2be2;box-shadow:0 0 10px 3px #8a2be2}body::-webkit-scrollbar{width:1px}body::-webkit-scrollbar-thumb{background-color:rgba(201,10,207,.3);outline:1px solid #8a2be2}#cursor{transform:translate(-50%,-50%);height:20px;width:20px;transition:all 20ms ease;position:fixed;border:2px solid #fff;border-radius:50%;pointer-events:none;box-shadow:0 0 25px 0 #fff,inset 0 0 5px 0 #fff;z-index:100;transition:transform .25s ease-in-out;animation:beat 1s ease-in-out infinite}@keyframes beat{0%{box-shadow:0 0 25px 0 #fff,inset 0 0 5px 0 #fff}50%{box-shadow:0 0 10px 0 #fff,inset 0 0 1px 0 #fff}to{box-shadow:0 0 25px 0 #fff,inset 0 0 5px 0 #fff}}#overlay-back{position:fixed;left:0;right:0;bottom:0;z-index:-1;cursor:pointer;opacity:.25;pointer-events:none}#bg3,#overlay-back{width:100%;height:100%;top:0}#bg3{position:absolute;z-index:-500;display:none}#overlay-front:after{content:" ";display:block;top:0;left:0;right:0;background:linear-gradient(rgba(18,16,16,0) 50%,rgba(0,0,0,.25) 0),linear-gradient(90deg,rgba(255,0,0,.06),rgba(0,255,0,.02),rgba(0,0,255,.06));z-index:3;background-size:100% 2px,3px 100%}#overlay-bottom,#overlay-front:after{position:fixed;bottom:0;pointer-events:none}#overlay-bottom{width:100%;z-index:50;padding-top:90px;background:linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,.01))}#overlay-background{background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;cursor:pointer;opacity:1;filter:blur(5px);pointer-events:none}.icon-hero{height:auto;width:3em;align-self:center;justify-self:center;animation:icon-flick 1.5s infinite}.pulse{animation:pulse-flick 1.5s infinite}@keyframes pulse-flick{0%{filter:drop-shadow(0 0 0 #ffffff) blur(2px)}33%{filter:drop-shadow(0 0 45px #Ffffff) blur(0)}to{filter:drop-shadow(0 0 0 #Ffffff) blur(2px)}}@keyframes icon-flick{0%{filter:drop-shadow(0 0 0 #ffffff) blur(2px)}to{filter:drop-shadow(0 0 45px #Ffffff) blur(0)}}@keyframes scroll{0%{opacity:0}to{opacity:1}}input{cursor:none;background-color:rgba(0,0,0,.322);color:#fff;margin:2% 0;padding:12px;outline:none;border-radius:5px;font-size:1em;border:none}input:focus{z-index:10;background-color:rgba(0,0,0,.746)}input::placeholder{color:#fff;opacity:.8}textarea{margin:2% 0;cursor:none;outline:none;padding:10px;border-radius:5px;background-color:rgba(0,0,0,.382);color:#fff;border:none;resize:none;font-size:1.5em}textarea:focus{background-color:rgba(0,0,0,.746)}textarea::placeholder{color:#fff;opacity:.8}.submit{margin:2% 0;padding:2% 5%;outline:none;border-radius:15px;color:#fff;background-color:rgba(0,0,0,.644);font-size:1.25em;font-weight:bolder;text-transform:uppercase;border:none;z-index:10;cursor:none;transition:all .5s ease-in-out;font-family:Pixel,monospace}.submit:hover{color:#fff;background-color:rgba(0,0,0,.5);text-shadow:0 0 5px #fff;box-shadow:0 0 10px 0 #fff,inset 0 0 10px 0;transform:scale(1.25)}.social-items{font-size:1.2em;display:grid;grid-template-columns:1fr 1fr;row-gap:5em;column-gap:5em;text-align:center}i{margin-right:15px}.social-item{display:flex;flex-direction:row;justify-content:center;align-items:center}.social-item:hover{z-index:10;color:#fff;text-shadow:0 0 20px #d8d8d8}.container{display:grid;grid-template-columns:1fr 1fr;column-gap:5rem}@keyframes alert-ye{0%{box-shadow:0 0 10px 5px #bdbbbb;opacity:0}50%{opacity:.8}to{box-shadow:0 15px 35px -10px #bdbbbb}}.alert{opacity:0;position:absolute;top:-3em;border-radius:5px;box-shadow:0 15px 35px -10px #bdbbbb;width:100%;text-align:center;z-index:50;padding:10px;background-color:rgba(0,0,0,.5803921569);color:hsla(0,0%,100%,.767);font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif;transition:all .1s ease-in}.closebtn{margin-left:15px;color:#fff;font-weight:700;float:right;font-size:22px;line-height:20px;cursor:none;transition:.3s}.closebtn:hover{color:#000}.proj-element{display:grid;grid-template-columns:10fr 5fr 10fr;column-gap:5em;padding:0 5%}.proj-element .gliched-move a{font-size:3em;text-transform:none}.proj-element .gliched-move{margin:15% 0;text-align:center}.proj-element .info{font-size:1.5em}.proj-element .lang{word-spacing:15em}.scroll{bottom:10em;display:flex;justify-content:center;align-items:center}.chevron,.scroll{position:absolute}.chevron{width:2.1rem;height:.48rem;opacity:0;transform:scale(.3);animation:move-chevron 3s ease-out infinite}.chevron:first-child{animation:move-chevron 3s ease-out 1s infinite}.chevron:nth-child(2){animation:move-chevron 3s ease-out 2s infinite}.chevron:after,.chevron:before{content:"";position:absolute;top:0;height:100%;width:50%;background:#c1c1c2;box-shadow:0 0 15px 1px #fff}.chevron:before{left:0;transform:skewY(30deg)}.chevron:after{right:0;width:50%;transform:skewY(-30deg)}@keyframes move-chevron{25%{opacity:1}33.3%{opacity:1;transform:translateY(2.28rem)}66.6%{opacity:1;transform:translateY(3.12rem)}to{opacity:0;transform:translateY(4.8rem) scale(.5)}}@keyframes timeline{0%{box-shadow:inset 0 0 0 0 #fff;opacity:0}50%{box-shadow:inset 0 0 15px 0 #fff;opacity:1}to{box-shadow:inset 0 0 0 0 #fff;opacity:0}}.time-point{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border-radius:50%;background-color:#fff;box-shadow:0 0 10px 0 #fff;filter:blur(1px)}.time-point .line{height:80vh;border-radius:15px 15px 15px 15px}.time-point .line,.time-point .line-bottom{position:relative;border-left:5px solid hsla(0,0%,100%,.512);box-shadow:0 0 70px 0 #fff;filter:blur(3px)}.time-point .line-bottom{align-self:flex-end;height:40vh}.time-point .line-top{position:relative;align-self:flex-start;border-left:5px solid hsla(0,0%,100%,.512);filter:blur(3px);box-shadow:0 0 70px 0 #fff;height:50vh}.mid-point{background-color:#000;position:absolute;border-radius:50%;width:15px;height:15px;box-shadow:inset 0 0 8px 0 #fff;animation:timeline 1s infinite}.line-point{display:flex;position:relative;align-items:center;justify-content:center;width:25px;height:25px;border-radius:50%;background-color:#fff;box-shadow:0 0 10px 0 #fff;filter:blur(1px)}.line-point .line-bottom{position:absolute;align-self:flex-end;height:30vh}.line-point .line-bottom,.line-point .line-top{border-left:5px solid hsla(0,0%,100%,.512);box-shadow:0 0 70px 0 #fff;filter:blur(3px)}.line-point .line-top{position:relative;align-self:flex-start;height:35vh}#contact .p{font-size:1.5rem}.exp-element{display:grid;grid-template-columns:2.5fr 1fr 10fr 10fr;column-gap:3em;padding:0 5%}.exp-element .linkfade:hover{text-shadow:1px 1px 20px #f5f5f5}.exp-element .gliched-move{font-size:2em}.exp-element .info{font-size:1.5em}.skill-sec{display:flex;flex-direction:column}#pagination{z-index:10;position:fixed;top:50%;transform:translateY(-50%);right:30px;list-style:none}#pagination li{position:relative;margin:20px 0;background:#fff;border-radius:50%;width:8px;height:8px;transition:all .2s ease;filter:blur(1px)}#pagination li:hover{transform:scale(1.5)}#pagination a{position:absolute;text-decoration:none;left:0;top:0;color:inherit;width:100%;height:100%;border-radius:50%;box-shadow:0 0 5px 0 #fff}#main.page-1 #pagination li:first-of-type,#main.page-2 #pagination li:nth-of-type(2),#main.page-3 #pagination li:nth-of-type(3),#main.page-4 #pagination li:nth-of-type(4),#main.page-5 #pagination li:nth-of-type(5),#main.page-6 #pagination li:nth-of-type(6),#main.page-7 #pagination li:nth-of-type(7),#main.page-8 #pagination li:nth-of-type(8),#main.page-9 #pagination li:nth-of-type(9),#main.page-10 #pagination li:nth-of-type(10){transform:scale(2);box-shadow:0 0 15px 1px #fff;filter:blur(.25px)}@media only screen and (max-width:1880px){.gliched-text{font-size:1em}.gliched-move{font-size:.75em}.proj-element{justify-items:center;align-content:center;text-align:center}.proj-element .gliched-move{font-size:.75em}.exp-element{justify-items:center;align-content:center;text-align:center}.exp-element .gliched-move{font-size:1em}}@media only screen and (max-width:1300px){.gliched-text{font-size:1.7em}.gliched-move{font-size:1em}}@media only screen and (max-width:1150px){.exp-element{grid-template-columns:1fr 5fr 5fr}.exp-element .time-point{display:none}}@media only screen and (max-width:1000px){.gliched-move,.gliched-text{font-size:1em}.navbar{font-size:.8em}.child{height:90vh}#pagination{display:none}}@media only screen and (max-height:900px){.gliched-text{font-size:1.7em}.gliched-move{font-size:1em}}@media only screen and (max-width:900px){.exp-element{grid-template-columns:1fr 10fr 5fr}.exp-element .info{display:none}.proj-element{grid-template-columns:1fr;row-gap:1em}.proj-element .gliched-text p{word-spacing:normal}.proj-element .lang{margin:1%;font-size:1em;word-spacing:10px}.proj-element .info{font-size:1em}.proj-element .gliched-move{margin:0}.proj-element .line-point{display:none}}@media only screen and (max-width:850px){.gliched-text{font-size:1.5em}.gliched-move{font-size:1em}.social-items{grid-template-columns:1fr;row-gap:1rem}}@media only screen and (max-width:800px){.exp-element{grid-template-columns:1fr;row-gap:2em}}@media only screen and (max-width:680px){.gliched-text{font-size:1.3em}.gliched-move{font-size:1em}.navbar a:after,.navbar ul p{display:none}.navbar ul i{display:block}.navbar ul a{text-shadow:none}#cursor{display:none}}@media only screen and (max-width:580px){.gliched-move,.gliched-text{font-size:1em}.container{row-gap:2em;grid-template-columns:1fr}#contact{justify-content:flex-end}#contact .p{font-size:.55rem}.abt{padding-top:50px;justify-content:space-evenly}}@media only screen and (max-width:400px){.gliched-text{font-size:.75em}.gliched-move{font-size:1em}}@media only screen and (max-width:320px){#contact textarea{height:20px}} -/*# sourceMappingURL=/style.8283b4bb.css.map */ \ No newline at end of file +html{scroll-snap-type:y mandatory;overflow-y:scroll}body{margin:0;cursor:none;height:100vh;background-color:#000}body a{text-decoration:none;color:#fff;cursor:none}@keyframes change{0%{opacity:.8}to{opacity:.25}}.child{height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:0 10%;scroll-snap-align:start}@font-face{font-family:Pixel;src:url(/VCROSDMono.43a29ccd.woff2)}.navbar{font-family:Pixel;position:fixed;width:100%;z-index:50;top:0;padding-top:20px;background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,.01))}.navbar ul{padding:0;margin:0;display:flex;flex-direction:row;align-items:center;justify-content:space-around;font-size:1.5em;text-transform:uppercase;letter-spacing:5px}.navbar ul i{display:none;margin:0}.navbar ul a{color:#b8b8b8;filter:contrast(500%);text-shadow:1px 1px 15px hsla(0,0%,100%,.918);transition:all .1s ease-in-out;margin:0}.navbar ul p{margin:0}.navbar ul a:after{content:"";position:absolute;width:100%;transform:scaleX(0);height:2px;bottom:-5px;left:0;background-color:#8a2be2;transform-origin:bottom right;transition:transform .55s ease-in-out}.navbar ul a:hover:after{transform:scaleX(1);transform-origin:bottom left}.gliched-text{color:#dbd8d8;font-family:Pixel,monospace;line-height:2em;font-size:2.15rem;text-transform:uppercase;transition:all .5s ease-in-out;text-shadow:.1em 0 0 rgba(255,0,0,.349),.1em .07em 0 rgba(0,128,0,.349),-.1em -.07em 0 rgba(0,0,255,.349)}.gliched-move{z-index:5;position:relative;color:#fff}.gliched-move span{position:absolute;left:0;z-index:1}.gliched-move span:first-child{position:inherit;animation:move .5s infinite}.gliched-move span:nth-child(2){animation:move .6s infinite;clip-path:polygon(0 20%,100% 0,100% 45%,0 45%);transform:translate(-.1em,-.025em)}.gliched-move span:last-child{animation:move .3s infinite;clip-path:polygon(0 55%,100% 45%,100% 100%,0 100%);transform:translate(.1em,.025em)}.gliched-move:hover span:first-child{position:inherit;animation:move .2s infinite}.gliched-move:hover span:last-child,.gliched-move:hover span:nth-child(2){clip-path:polygon(0 0,0 0,0 0,0 0)}@keyframes move{0%{text-shadow:.05em 0 0 rgba(255,0,0,.505),-.05em -.025em 0 rgba(0,255,0,.505),-.025em .05em 0 rgba(0,0,255,.505)}14%{text-shadow:.05em 0 0 rgba(255,0,0,.505),-.05em -.025em 0 rgba(0,255,0,.505),-.025em .05em 0 rgba(0,0,255,.505)}15%{text-shadow:-.05em -.025em 0 rgba(255,0,0,.505),.025em .025em 0 rgba(0,255,0,.505),-.05em -.05em 0 rgba(0,0,255,.505)}49%{text-shadow:-.05em -.025em 0 rgba(255,0,0,.505),.025em .025em 0 rgba(0,255,0,.505),-.05em -.05em 0 rgba(0,0,255,.505)}50%{text-shadow:.025em .05em 0 rgba(255,0,0,.505),.05em 0 0 rgba(0,255,0,.505),0 -.05em 0 rgba(0,0,255,.505)}99%{text-shadow:.025em .05em 0 rgba(255,0,0,.505),.05em 0 0 rgba(0,255,0,.505),0 -.05em 0 rgba(0,0,255,.505)}to{text-shadow:-.025em 0 0 rgba(255,0,0,.505),-.025em -.025em 0 rgba(0,255,0,.505),-.025em -.05em 0 rgba(0,0,255,.505)}}.skill-container{position:relative;width:100%;height:10px;border-radius:5px;background-color:rgba(78,77,77,.329);flex:7}.c{position:absolute;width:50%;height:100%;border-radius:5px 0 0 5px;background-color:#8a2be2;box-shadow:0 0 10px 3px #8a2be2}body::-webkit-scrollbar{width:1px}body::-webkit-scrollbar-thumb{background-color:rgba(201,10,207,.3);outline:1px solid #8a2be2}#cursor{transform:translate(-50%,-50%);height:20px;width:20px;transition:all 20ms ease;position:fixed;border:2px solid #fff;border-radius:50%;pointer-events:none;box-shadow:0 0 25px 0 #fff,inset 0 0 5px 0 #fff;z-index:100;transition:transform .25s ease-in-out;animation:beat 1s ease-in-out infinite}@keyframes beat{0%{box-shadow:0 0 25px 0 #fff,inset 0 0 5px 0 #fff}50%{box-shadow:0 0 10px 0 #fff,inset 0 0 1px 0 #fff}to{box-shadow:0 0 25px 0 #fff,inset 0 0 5px 0 #fff}}#overlay-back{position:fixed;left:0;right:0;bottom:0;z-index:-1;cursor:pointer;opacity:.25;pointer-events:none}#bg3,#overlay-back{width:100%;height:100%;top:0}#bg3{position:absolute;z-index:-500;display:none}#overlay-front:after{content:" ";display:block;top:0;left:0;right:0;background:linear-gradient(rgba(18,16,16,0) 50%,rgba(0,0,0,.25) 0),linear-gradient(90deg,rgba(255,0,0,.06),rgba(0,255,0,.02),rgba(0,0,255,.06));z-index:3;background-size:100% 2px,3px 100%}#overlay-bottom,#overlay-front:after{position:fixed;bottom:0;pointer-events:none}#overlay-bottom{width:100%;z-index:50;padding-top:90px;background:linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,.01))}#overlay-background{background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;cursor:pointer;opacity:1;filter:blur(5px);pointer-events:none}.icon-hero{height:auto;width:3em;align-self:center;justify-self:center;animation:icon-flick 1.5s infinite}.pulse{animation:pulse-flick 1.5s infinite}@keyframes pulse-flick{0%{filter:drop-shadow(0 0 0 #ffffff) blur(2px)}33%{filter:drop-shadow(0 0 45px #Ffffff) blur(0)}to{filter:drop-shadow(0 0 0 #Ffffff) blur(2px)}}@keyframes icon-flick{0%{filter:drop-shadow(0 0 0 #ffffff) blur(2px)}to{filter:drop-shadow(0 0 45px #Ffffff) blur(0)}}@keyframes scroll{0%{opacity:0}to{opacity:1}}input{cursor:none;background-color:rgba(0,0,0,.322);color:#fff;margin:2% 0;padding:12px;outline:none;border-radius:5px;font-size:1em;border:none}input:focus{z-index:10;background-color:rgba(0,0,0,.746)}input::placeholder{color:#fff;opacity:.8}textarea{margin:2% 0;cursor:none;outline:none;padding:10px;border-radius:5px;background-color:rgba(0,0,0,.382);color:#fff;border:none;resize:none;font-size:1.5em}textarea:focus{background-color:rgba(0,0,0,.746)}textarea::placeholder{color:#fff;opacity:.8}.submit{margin:2% 0;padding:2% 5%;outline:none;border-radius:15px;color:#fff;background-color:rgba(0,0,0,.644);font-size:1.25em;font-weight:bolder;text-transform:uppercase;border:none;z-index:10;cursor:none;transition:all .5s ease-in-out;font-family:Pixel,monospace}.submit:hover{color:#fff;background-color:rgba(0,0,0,.5);text-shadow:0 0 5px #fff;box-shadow:0 0 10px 0 #fff,inset 0 0 10px 0;transform:scale(1.25)}.social-items{font-size:1.2em;display:grid;grid-template-columns:1fr 1fr;row-gap:5em;column-gap:5em;text-align:center}i{margin-right:15px}.social-item{display:flex;flex-direction:row;justify-content:center;align-items:center}.social-item:hover{z-index:10;color:#fff;text-shadow:0 0 20px #d8d8d8}.container{display:grid;grid-template-columns:1fr 1fr;column-gap:5rem}@keyframes alert-ye{0%{box-shadow:0 0 10px 5px #bdbbbb;opacity:0}50%{opacity:.8}to{box-shadow:0 15px 35px -10px #bdbbbb}}.alert{opacity:0;position:absolute;top:-3em;border-radius:5px;box-shadow:0 15px 35px -10px #bdbbbb;width:100%;text-align:center;z-index:50;padding:10px;background-color:rgba(0,0,0,.5803921569);color:hsla(0,0%,100%,.767);font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif;transition:all .1s ease-in}.closebtn{margin-left:15px;color:#fff;font-weight:700;float:right;font-size:22px;line-height:20px;cursor:none;transition:.3s}.closebtn:hover{color:#000}.proj-element{display:grid;grid-template-columns:10fr 5fr 10fr;column-gap:5em;padding:0 5%}.proj-element .gliched-move a{font-size:3em;text-transform:none}.proj-element .gliched-move{margin:15% 0;text-align:center}.proj-element .info{font-size:1.5em}.proj-element .lang{word-spacing:15em}.scroll{bottom:10em;display:flex;justify-content:center;align-items:center}.chevron,.scroll{position:absolute}.chevron{width:2.1rem;height:.48rem;opacity:0;transform:scale(.3);animation:move-chevron 3s ease-out infinite}.chevron:first-child{animation:move-chevron 3s ease-out 1s infinite}.chevron:nth-child(2){animation:move-chevron 3s ease-out 2s infinite}.chevron:after,.chevron:before{content:"";position:absolute;top:0;height:100%;width:50%;background:#c1c1c2;box-shadow:0 0 15px 1px #fff}.chevron:before{left:0;transform:skewY(30deg)}.chevron:after{right:0;width:50%;transform:skewY(-30deg)}@keyframes move-chevron{25%{opacity:1}33.3%{opacity:1;transform:translateY(2.28rem)}66.6%{opacity:1;transform:translateY(3.12rem)}to{opacity:0;transform:translateY(4.8rem) scale(.5)}}@keyframes timeline{0%{box-shadow:inset 0 0 0 0 #fff;opacity:0}50%{box-shadow:inset 0 0 15px 0 #fff;opacity:1}to{box-shadow:inset 0 0 0 0 #fff;opacity:0}}.time-point{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border-radius:50%;background-color:#fff;box-shadow:0 0 10px 0 #fff;filter:blur(1px)}.time-point .line{height:80vh;border-radius:15px 15px 15px 15px}.time-point .line,.time-point .line-bottom{position:relative;border-left:5px solid hsla(0,0%,100%,.512);box-shadow:0 0 70px 0 #fff;filter:blur(3px)}.time-point .line-bottom{align-self:flex-end;height:40vh}.time-point .line-top{position:relative;align-self:flex-start;border-left:5px solid hsla(0,0%,100%,.512);filter:blur(3px);box-shadow:0 0 70px 0 #fff;height:50vh}.mid-point{background-color:#000;position:absolute;border-radius:50%;width:15px;height:15px;box-shadow:inset 0 0 8px 0 #fff;animation:timeline 1s infinite}.line-point{display:flex;position:relative;align-items:center;justify-content:center;width:25px;height:25px;border-radius:50%;background-color:#fff;box-shadow:0 0 10px 0 #fff;filter:blur(1px)}.line-point .line-bottom{position:absolute;align-self:flex-end;height:30vh}.line-point .line-bottom,.line-point .line-top{border-left:5px solid hsla(0,0%,100%,.512);box-shadow:0 0 70px 0 #fff;filter:blur(3px)}.line-point .line-top{position:relative;align-self:flex-start;height:35vh}#contact .p{font-size:1.5rem}.exp-element{display:grid;grid-template-columns:2.5fr 1fr 10fr 10fr;column-gap:3em;padding:0 5%}.exp-element .linkfade:hover{text-shadow:1px 1px 20px #f5f5f5}.exp-element .gliched-move{font-size:2em}.exp-element .info{font-size:1.5em}.skill-sec{display:flex;flex-direction:column}#pagination{z-index:10;position:fixed;top:50%;transform:translateY(-50%);right:30px;list-style:none}#pagination li{position:relative;margin:20px 0;background:#fff;border-radius:50%;width:8px;height:8px;transition:all .2s ease;filter:blur(1px)}#pagination li:hover{transform:scale(1.5)}#pagination a{position:absolute;text-decoration:none;left:0;top:0;color:inherit;width:100%;height:100%;border-radius:50%;box-shadow:0 0 5px 0 #fff}#main.page-1 #pagination li:first-of-type,#main.page-2 #pagination li:nth-of-type(2),#main.page-3 #pagination li:nth-of-type(3),#main.page-4 #pagination li:nth-of-type(4),#main.page-5 #pagination li:nth-of-type(5),#main.page-6 #pagination li:nth-of-type(6),#main.page-7 #pagination li:nth-of-type(7),#main.page-8 #pagination li:nth-of-type(8),#main.page-9 #pagination li:nth-of-type(9),#main.page-10 #pagination li:nth-of-type(10){transform:scale(2);box-shadow:0 0 15px 1px #fff;filter:blur(.25px)}@media only screen and (max-height:600px),only screen and (max-width:320px){.gliched-move,.gliched-text,.navbar{font-size:.5em}.child{height:85vh}.container,.exp-element,.social-items{grid-template-columns:1fr;row-gap:1.5em}.proj-element{grid-template-columns:1fr}.gliched-text p{word-spacing:5px}#pagination{display:none}}@media only screen and (max-width:1880px){.gliched-text{font-size:1em}.exp-element .gliched-move,.gliched-move,.proj-element .gliched-move{font-size:.75em}.exp-element,.proj-element{justify-items:center;align-content:center;text-align:center}}@media only screen and (max-width:1300px){.gliched-text{font-size:1.7em}.gliched-move{font-size:1em}}@media only screen and (max-width:1150px){.exp-element{grid-template-columns:1fr 5fr 5fr}.exp-element .time-point{display:none}}@media only screen and (max-height:900px),only screen and (max-width:1000px){.gliched-move,.gliched-text{font-size:1em}.navbar{font-size:.8em}.child{height:90vh}#pagination{display:none}}@media only screen and (max-width:900px){.exp-element{grid-template-columns:1fr 10fr 5fr}.exp-element .info{display:none}.proj-element{grid-template-columns:1fr;row-gap:1em}.proj-element .gliched-text p{word-spacing:normal}.proj-element .lang{margin:1%;font-size:1em;word-spacing:10px}.proj-element .info{font-size:1em}.proj-element .gliched-move{margin:0}.proj-element .line-point{display:none}}@media only screen and (max-width:850px){.gliched-text{font-size:1.5em}.gliched-move{font-size:1em}.social-items{grid-template-columns:1fr;row-gap:1rem}}@media only screen and (max-width:800px){.exp-element{grid-template-columns:1fr;row-gap:2em}}@media only screen and (max-width:680px){.gliched-text{font-size:1.3em}.gliched-move{font-size:1em}.navbar a:after,.navbar ul p{display:none}.navbar ul i{display:block}.navbar a{text-shadow:none}#cursor{display:none}}@media only screen and (max-width:580px){.gliched-move,.gliched-text{font-size:1em}.container{row-gap:2em;grid-template-columns:1fr}#contact{justify-content:flex-end}#contact .p{font-size:.55rem}.abt{padding-top:50px;justify-content:space-evenly}}@media only screen and (max-width:400px){.gliched-text{font-size:.75em}.gliched-move{font-size:1em}} +/*# sourceMappingURL=/style.274c1488.css.map */ \ No newline at end of file diff --git a/style.274c1488.css.map b/style.274c1488.css.map new file mode 100644 index 0000000..c07f904 --- /dev/null +++ b/style.274c1488.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["style.scss"],"names":[],"mappings":"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","file":"style.274c1488.css","sourceRoot":"../src","sourcesContent":["html{\n scroll-snap-type: y mandatory;\n overflow-y:scroll;\n}\nbody{\n margin: 0px;\n cursor: none;\n height: 100vh;\n background-color: black;\n a{\n text-decoration: none;\n color: white;\n cursor: none;\n }\n \n}\n\n@keyframes change {\n 0%{\n opacity: 0.8;\n }\n 100%{\n opacity: 0.25;\n }\n \n}\n\n\n.child {\n height: 100vh;\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n padding: 0% 10%;\n scroll-snap-align: start;\n}\n\n@font-face {\n font-family: Pixel;\n src: url(\"./assets/VCROSDMono.woff2\");\n}\n\n.navbar{\n font-family: Pixel;\n position: fixed;\n width: 100%;\n z-index: 50;\n top: 0;\n padding-top: 20px;\n background: linear-gradient(180deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.01) 100%);\n\n ul{\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n font-size: 1.5em;\n text-transform: uppercase;\n letter-spacing: 5px;\n \n i{\n display: none;\n margin: 0px;\n }\n\n a{\n color: rgb(184, 184, 184);\n filter: contrast(500%);\n text-shadow: 1px 1px 15px rgba(255, 255, 255, 0.918);\n transition: all 100ms ease-in-out;\n margin: 0px;\n }\n \n\n p{\n margin: 0px;\n }\n\n a::after{\n content: '';\n position: absolute;\n width: 100%;\n transform: scaleX(0);\n height: 2px;\n bottom: -5px;\n left: 0;\n background-color: blueviolet;\n transform-origin: bottom right;\n transition: transform 550ms ease-in-out;\n }\n\n a:hover::after{\n transform: scaleX(1);\n transform-origin: bottom left;\n }\n \n }\n \n\n}\n\n\n\n.gliched-text{\n color: rgb(219, 216, 216);\n font-family: Pixel,monospace;\n line-height: 2em;\n font-size: 2.15rem;\n text-transform: uppercase;\n\n transition: all 500ms ease-in-out;\n\n text-shadow:0.1em 0 0 rgba(255, 0, 0, 0.349),\n 0.1em 0.07em 0 rgba(0, 128, 0, 0.349),\n -0.1em -0.07em 0 rgba(0, 0, 255, 0.349);\n}\n\n.gliched-move{\n z-index: 5;\n position: relative;\n color: rgb(255, 255, 255);\n\n span{\n position: absolute;\n left: 0;\n z-index:1;\n }\n\n span:first-child{\n position: inherit;\n animation: move 500ms infinite;\n }\n\n span:nth-child(2){\n animation: move 600ms infinite;\n clip-path: polygon(0 20%, 100% 0, 100% 45%, 0 45%);\n transform: translate(-0.1em, -0.025em);\n }\n\n span:last-child{\n animation: move 300ms infinite;\n clip-path: polygon(0 55%, 100% 45%, 100% 100%, 0 100%);\n transform: translate(0.1em, 0.025em);\n }\n}\n\n\n.gliched-move:hover{\n \n span:first-child{\n position: inherit;\n animation: move 200ms infinite;\n }\n\n span:nth-child(2){\n clip-path: polygon(0 0, 0 0, 0 0, 0 0);\n }\n\n span:last-child{\n clip-path: polygon(0 0, 0 0, 0 0, 0 0);\n }\n \n}\n\n@keyframes move{\n\n 0% {\n text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.505),\n -0.05em -0.025em 0 rgba(0, 255, 0, 0.505),\n -0.025em 0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 14% {\n text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.505),\n -0.05em -0.025em 0 rgba(0, 255, 0, 0.505),\n -0.025em 0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 15% {\n text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.505),\n 0.025em 0.025em 0 rgba(0, 255, 0, 0.505),\n -0.05em -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 49% {\n text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.505),\n 0.025em 0.025em 0 rgba(0, 255, 0, 0.505),\n -0.05em -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 50% {\n text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.505),\n 0.05em 0 0 rgba(0, 255, 0, 0.505), 0 -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 99% {\n text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.505),\n 0.05em 0 0 rgba(0, 255, 0, 0.505), 0 -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 100% {\n text-shadow: -0.025em 0 0 rgba(255, 0, 0, 0.505),\n -0.025em -0.025em 0 rgba(0, 255, 0, 0.505),\n -0.025em -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n}\n\n\n\n.skill-container{\n position: relative;\n width: 100%;\n height: 10px;\n border-radius: 5px;\n background-color: rgba(78, 77, 77, 0.329);\n flex: 7;\n}\n\n\n\n.c{\n position: absolute;\n width: 50%;\n height: 100%;\n border-radius: 5px 0px 0px 5px ;\n background-color: blueviolet;\n box-shadow: 0px 0px 10px 3px blueviolet;\n}\n\nbody::-webkit-scrollbar {\n width: 1px;\n}\n \nbody::-webkit-scrollbar-thumb {\n background-color: rgba(201, 10, 207, 0.3);\n outline: 1px solid blueviolet;\n}\n\n#cursor{\n transform: translate(-50%,-50%);\n height: 20px;\n width: 20px;\n transition: all 20ms ease;\n position: fixed;\n border: 2px solid;\n border-color: white;\n border-radius: 50%;\n pointer-events: none;\n box-shadow: 0px 0px 25px 0px white,\n inset 0px 0px 5px 0px white;\n z-index: 100;\n transition: transform 250ms ease-in-out;\n animation: beat 1s infinite ease-in-out;\n}\n\n@keyframes beat {\n 0%{\n box-shadow: 0px 0px 25px 0px white,\n inset 0px 0px 5px 0px white;\n }\n 50%{\n box-shadow: 0px 0px 10px 0px white,\n inset 0px 0px 1px 0px white;\n }\n 100%{\n box-shadow: 0px 0px 25px 0px white,\n inset 0px 0px 5px 0px white;\n }\n}\n\n#overlay-back{\n position: fixed;\n width: 100%;\n height: 100%;\n pointer-events: none;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: -1;\n cursor: pointer;\n opacity: 0.25;\n pointer-events: none;\n}\n\n#bg3{\n position: absolute;\n top: 0;\n z-index: -500;\n display: none;\n height: 100%;\n width: 100%;\n}\n\n#overlay-front::after{\n content: \" \";\n display: block;\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));\n z-index: 3;\n background-size: 100% 2px, 3px 100%;\n pointer-events: none;\n}\n\n#overlay-bottom{\n position: fixed;\n width: 100%;\n z-index: 50;\n bottom: 0;\n padding-top: 90px;\n background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.01) 100%);\n pointer-events: none;\n}\n\n\n\n#overlay-background{\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n position: fixed;\n pointer-events: none;\n top: 0;\n left: 0px;\n right: 0;\n bottom: 0;\n z-index: -1;\n cursor: pointer;\n opacity: 1;\n filter: blur(5px);\n pointer-events: none;\n}\n\n.icon-hero{\n height: auto;\n width: 3em;\n align-self: center;\n justify-self: center;\n animation: icon-flick 1.5s infinite; \n}\n\n.pulse{\n animation: pulse-flick 1500ms infinite;\n}\n\n@keyframes pulse-flick {\n 0%{\n filter: drop-shadow(0px 0px 0px #ffffff) blur(2px) ;\n }\n\n 33%{\n filter: drop-shadow(0px 0px 45px #Ffffff) blur(0px);\n }\n\n 100%{\n filter: drop-shadow(0px 0px 0px #Ffffff) blur(2px);\n }\n}\n\n@keyframes icon-flick {\n 0%{\n filter: drop-shadow(0px 0px 0px #ffffff) blur(2px) ;\n }\n 100%{\n filter: drop-shadow(0px 0px 45px #Ffffff) blur(0px);\n }\n}\n\n@keyframes scroll {\n 0%{\n opacity: 0;\n }\n 100%{\n opacity: 1;\n }\n}\n\n\ninput{\n cursor: none;\n background-color: rgba(0, 0, 0, 0.322);\n color: white;\n margin: 2% 0%;\n padding: 12px;\n outline: none;\n border-radius: 5px;\n font-size: 1em;\n border: none;\n}\ninput:focus{\n z-index: 10;\n background-color: rgba(0, 0, 0, 0.746);\n}\ninput::placeholder{\n color: #ffffff;\n opacity: 0.8;\n}\n\ntextarea{\n margin: 2% 0%;\n cursor: none;\n outline: none;\n padding: 10px;\n border-radius: 5px;\n background-color: rgba(0, 0, 0, 0.382);\n color: white;\n border: none;\n resize: none;\n font-size: 1.5em;\n}\n\ntextarea:focus{\n background-color: rgba(0, 0, 0, 0.746);\n}\n\ntextarea::placeholder{\n color: #ffffff;\n opacity: 0.8;\n}\n\n.submit{\n margin: 2% 0;\n padding:2% 5% ;\n outline: none;\n border-radius: 15px;\n color: rgb(255, 255, 255);\n background-color: rgba(0, 0, 0, 0.644);\n font-size: 1.25em;\n font-weight: bolder;\n text-transform: uppercase;\n border: none;\n z-index: 10;\n cursor: none;\n transition: all 500ms ease-in-out;\n font-family: Pixel,monospace;\n}\n\n.submit:hover{\n color: rgb(255, 255, 255);\n background-color: rgba(0, 0, 0, 0.5);\n text-shadow: 0px 0px 5px white;\n box-shadow: 0px 0px 10px 0px white,\n inset 0px 0px 10px 0px;\n transform: scale(1.25);\n}\n\n.social-items{\n font-size: 1.2em;\n display: grid;\n grid-template-columns: 1fr 1fr;\n row-gap: 5em;\n column-gap: 5em;\n text-align: center;\n}\n\ni{\n margin-right: 15px;\n}\n\n.social-item{\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n\n.social-item:hover{\n z-index: 10;\n color: #ffffff;\n text-shadow:0px 0px 20px #d8d8d8;\n}\n\n.container{\n display:grid; \n grid-template-columns: 1fr 1fr;\n column-gap: 5rem;\n}\n\n@keyframes alert-ye {\n 0%{\n box-shadow: 0px 0px 10px 5px rgb(189, 187, 187);\n opacity: 0;\n }\n 50%{\n opacity: 0.8;\n }\n 100%{\n box-shadow: 0px 15px 35px -10px rgb(189, 187, 187);\n }\n}\n\n.alert {\n opacity: 0;\n position: absolute;\n top: -3em;\n border-radius: 5px;\n box-shadow: 0px 15px 35px -10px rgb(189, 187, 187);\n width: 100%;\n text-align: center;\n z-index: 50;\n padding: 10px;\n background-color: #00000094;\n color: rgba(255, 255, 255, 0.767);\n font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;\n transition: all 100ms ease-in;\n}\n\n\n\n.closebtn {\n margin-left: 15px;\n color: white;\n font-weight: bold;\n float: right;\n font-size: 22px;\n line-height: 20px;\n cursor: none;\n transition: 0.3s;\n}\n\n.closebtn:hover {\n color: black;\n}\n\n.proj-element{\n display: grid;\n grid-template-columns: 10fr 5fr 10fr;\n column-gap: 5em;\n padding: 0% 5%;\n .gliched-move a{\n font-size: 3em;\n text-transform: none;\n }\n .gliched-move{\n margin: 15% 0;\n text-align: center;\n }\n .info{\n font-size: 1.5em;\n }\n .lang{\n word-spacing: 15em;\n }\n}\n\n\n\n\n$base: 0.6rem;\n\n.scroll {\n position: absolute;\n bottom: 10em;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.chevron {\n position: absolute;\n width: $base * 3.5;\n height: $base * 0.8;\n opacity: 0;\n transform: scale(0.3);\n animation: move-chevron 3s ease-out infinite;\n}\n\n.chevron:first-child {\n animation: move-chevron 3s ease-out 1s infinite;\n}\n\n.chevron:nth-child(2) {\n animation: move-chevron 3s ease-out 2s infinite;\n}\n\n.chevron:before,\n.chevron:after {\n content: '';\n position: absolute;\n top: 0;\n height: 100%;\n width: 50%;\n background: #c1c1c2;\n box-shadow: 0px 0px 15px 1px white;\n}\n\n.chevron:before {\n left: 0;\n transform: skewY(30deg);\n}\n\n.chevron:after {\n right: 0;\n width: 50%;\n transform: skewY(-30deg);\n}\n\n@keyframes move-chevron {\n 25% {\n opacity: 1;\n\t}\n 33.3% {\n opacity: 1;\n transform: translateY($base * 3.8);\n }\n 66.6% {\n opacity: 1;\n transform: translateY($base * 5.2);\n }\n 100% {\n opacity: 0;\n transform: translateY($base * 8) scale(0.5);\n }\n}\n\n@keyframes timeline {\n0%{\n box-shadow: inset 0px 0px 0px 0px white;\n opacity: 0;\n}\n50%{\n box-shadow: inset 0px 0px 15px 0px white;\n opacity: 1;\n}\n100%{\n box-shadow: inset 0px 0px 0px 0px white;\n opacity: 0;\n}\n\n}\n\n\n.time-point{\n display: flex;\n align-items: center;\n justify-content: center;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background-color: rgb(255, 255, 255);\n box-shadow: 0px 0px 10px 0px white;\n filter: blur(1px);\n\n .line{\n position: relative;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n box-shadow: 0px 0px 70px -0px white;\n filter: blur(3px);\n height: 80vh;\n border-radius: 15px 15px 15px 15px;\n }\n\n .line-bottom{\n position: relative;\n align-self: flex-end;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n box-shadow: 0px 0px 70px 0px white;\n filter: blur(3px);\n height: 40vh;\n }\n\n .line-top{\n position: relative;\n align-self: flex-start;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n filter: blur(3px);\n box-shadow: 0px 0px 70px 0px white;\n height: 50vh;\n }\n\n}\n\n.mid-point{\n background-color: black;\n position: absolute;\n border-radius: 50%;\n width: 15px;\n height: 15px;\n box-shadow: inset 0px 0px 8px 0px white;\n animation: timeline 1s infinite;\n}\n\n\n\n.line-point{\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background-color: rgb(255, 255, 255);\n box-shadow: 0px 0px 10px 0px white;\n filter: blur(1px);\n\n .line-bottom{\n position: absolute;\n align-self: flex-end;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n box-shadow: 0px 0px 70px 0px white;\n filter: blur(3px);\n height: 30vh;\n }\n\n .line-top{\n position: relative;\n align-self: flex-start;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n filter: blur(3px);\n box-shadow: 0px 0px 70px 0px white;\n height: 35vh;\n }\n\n}\n\n#contact{\n .p{\n font-size: 1.5rem;\n }\n}\n\n.exp-element{\n display: grid;\n grid-template-columns: 2.5fr 1fr 10fr 10fr;\n column-gap: 3em;\n padding: 0% 5%;\n\n .linkfade:hover{\n text-shadow: 1px 1px 20px whitesmoke\n }\n\n \n\n .gliched-move{\n font-size: 2em;\n }\n .info{\n font-size: 1.5em;\n }\n}\n\n\n.skill-sec{\n display: flex;\n flex-direction: column;\n}\n\n#pagination {\n z-index: 10;\n position: fixed;\n top: 50%;\n transform: translateY(-50%);\n right: 30px;\n list-style: none;\n\nli{\n position: relative;\n margin: 20px 0;\n background: #fff;\n border-radius: 50%;\n width: 8px;\n height: 8px;\n transition: all .2s ease;\n filter: blur(1px);\n \n &:hover {\n transform: scale(1.5);\n }\n}\n\na {\n position: absolute;\n text-decoration: none; \n left: 0;\n top: 0;\n color: inherit;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n box-shadow: 0px 0px 5px 0px white;\n}\n}\n\n#main{\n @for $i from 1 to 11 {\n &.page-#{$i} {\n #pagination li:nth-of-type(#{$i}) {\n @extend %active-dot;\n }\n }\n }\n}\n\n%active-dot {\n transform: scale(2);\n box-shadow: 0px 0px 15px 1px white;\n filter: blur(0.25px);\n}\n\n\n@media only screen and (max-height: 600px), only screen and (max-width: 320px) {\n .gliched-text, .gliched-move, .navbar {\n font-size: 0.5em;\n }\n\n .child {\n height: 85vh;\n }\n\n .exp-element, .container, .social-items {\n grid-template-columns: 1fr;\n row-gap: 1.5em;\n }\n\n .proj-element {\n grid-template-columns: 1fr;\n }\n\n .gliched-text p {\n word-spacing: 5px;\n }\n\n #pagination {\n display: none;\n }\n}\n\n@media only screen and (max-width: 1880px) {\n .gliched-text {\n font-size: 1em;\n }\n\n .gliched-move, .proj-element .gliched-move, .exp-element .gliched-move {\n font-size: 0.75em;\n }\n\n .proj-element, .exp-element {\n justify-items: center;\n align-content: center;\n text-align: center;\n }\n}\n\n@media only screen and (max-width: 1300px) {\n .gliched-text {\n font-size: 1.7em;\n }\n\n .gliched-move {\n font-size: 1em;\n }\n}\n\n@media only screen and (max-width: 1150px) {\n .exp-element {\n .time-point {\n display: none;\n }\n grid-template-columns: 1fr 5fr 5fr;\n }\n}\n\n@media only screen and (max-width: 1000px), only screen and (max-height: 900px) {\n .gliched-text, .gliched-move {\n font-size: 1em;\n }\n\n .navbar {\n font-size: 0.8em;\n }\n\n .child {\n height: 90vh;\n }\n\n #pagination {\n display: none;\n }\n}\n\n@media only screen and (max-width: 900px) {\n .exp-element {\n .info {\n display: none;\n }\n grid-template-columns: 1fr 10fr 5fr;\n }\n\n .proj-element {\n .gliched-text p {\n word-spacing: normal;\n }\n\n .lang {\n margin: 1%;\n font-size: 1em;\n word-spacing: 10px;\n }\n\n .info {\n font-size: 1em;\n }\n\n .gliched-move {\n margin: 0;\n }\n\n .line-point {\n display: none;\n }\n\n grid-template-columns: 1fr;\n row-gap: 1em;\n }\n}\n\n@media only screen and (max-width: 850px) {\n .gliched-text {\n font-size: 1.5em;\n }\n\n .gliched-move {\n font-size: 1em;\n }\n\n .social-items {\n grid-template-columns: 1fr;\n row-gap: 1rem;\n }\n}\n\n@media only screen and (max-width: 800px) {\n .exp-element {\n grid-template-columns: 1fr;\n row-gap: 2em;\n }\n}\n\n@media only screen and (max-width: 680px) {\n .gliched-text {\n font-size: 1.3em;\n }\n\n .gliched-move {\n font-size: 1em;\n }\n\n .navbar a::after {\n display: none;\n }\n\n .navbar ul p {\n display: none;\n }\n\n .navbar ul i {\n display: block;\n }\n\n .navbar a {\n text-shadow: none;\n }\n\n #cursor {\n display: none;\n }\n}\n\n@media only screen and (max-width: 580px) {\n .gliched-text, .gliched-move {\n font-size: 1em;\n }\n\n .container {\n row-gap: 2em;\n grid-template-columns: 1fr;\n }\n\n #contact {\n justify-content: flex-end;\n .p {\n font-size: 0.55rem;\n }\n }\n\n .abt {\n padding-top: 50px;\n justify-content: space-evenly;\n }\n}\n\n@media only screen and (max-width: 400px) {\n .gliched-text {\n font-size: 0.75em;\n }\n\n .gliched-move {\n font-size: 1em;\n }\n}\n"]} \ No newline at end of file diff --git a/style.8283b4bb.css.map b/style.8283b4bb.css.map deleted file mode 100644 index 6ff3ee7..0000000 --- a/style.8283b4bb.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["style.scss"],"names":[],"mappings":"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","file":"style.8283b4bb.css","sourceRoot":"../src","sourcesContent":["html{\n scroll-snap-type: y mandatory;\n overflow-y:scroll;\n}\nbody{\n margin: 0px;\n cursor: none;\n height: 100vh;\n background-color: black;\n a{\n text-decoration: none;\n color: white;\n cursor: none;\n }\n \n}\n\n@keyframes change {\n 0%{\n opacity: 0.8;\n }\n 100%{\n opacity: 0.25;\n }\n \n}\n\n\n.child {\n height: 100vh;\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n padding: 0% 10%;\n scroll-snap-align: start;\n}\n\n@font-face {\n font-family: Pixel;\n src: url(\"./assets/VCROSDMono.woff2\");\n}\n\n.navbar{\n font-family: Pixel;\n position: fixed;\n width: 100%;\n z-index: 50;\n top: 0;\n padding-top: 20px;\n background: linear-gradient(180deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.01) 100%);\n\n ul{\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n font-size: 1.5em;\n text-transform: uppercase;\n letter-spacing: 5px;\n \n i{\n display: none;\n margin: 0px;\n }\n\n a{\n color: rgb(184, 184, 184);\n filter: contrast(500%);\n text-shadow: 1px 1px 15px rgba(255, 255, 255, 0.918);\n transition: all 100ms ease-in-out;\n margin: 0px;\n }\n \n\n p{\n margin: 0px;\n }\n\n a::after{\n content: '';\n position: absolute;\n width: 100%;\n transform: scaleX(0);\n height: 2px;\n bottom: -5px;\n left: 0;\n background-color: blueviolet;\n transform-origin: bottom right;\n transition: transform 550ms ease-in-out;\n }\n\n a:hover::after{\n transform: scaleX(1);\n transform-origin: bottom left;\n }\n \n }\n \n\n}\n\n\n\n.gliched-text{\n color: rgb(219, 216, 216);\n font-family: Pixel,monospace;\n line-height: 2em;\n font-size: 2.15rem;\n text-transform: uppercase;\n\n transition: all 500ms ease-in-out;\n\n text-shadow:0.1em 0 0 rgba(255, 0, 0, 0.349),\n 0.1em 0.07em 0 rgba(0, 128, 0, 0.349),\n -0.1em -0.07em 0 rgba(0, 0, 255, 0.349);\n}\n\n.gliched-move{\n z-index: 5;\n position: relative;\n color: rgb(255, 255, 255);\n\n span{\n position: absolute;\n left: 0;\n z-index:1;\n }\n\n span:first-child{\n position: inherit;\n animation: move 500ms infinite;\n }\n\n span:nth-child(2){\n animation: move 600ms infinite;\n clip-path: polygon(0 20%, 100% 0, 100% 45%, 0 45%);\n transform: translate(-0.1em, -0.025em);\n }\n\n span:last-child{\n animation: move 300ms infinite;\n clip-path: polygon(0 55%, 100% 45%, 100% 100%, 0 100%);\n transform: translate(0.1em, 0.025em);\n }\n}\n\n\n.gliched-move:hover{\n \n span:first-child{\n position: inherit;\n animation: move 200ms infinite;\n }\n\n span:nth-child(2){\n clip-path: polygon(0 0, 0 0, 0 0, 0 0);\n }\n\n span:last-child{\n clip-path: polygon(0 0, 0 0, 0 0, 0 0);\n }\n \n}\n\n@keyframes move{\n\n 0% {\n text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.505),\n -0.05em -0.025em 0 rgba(0, 255, 0, 0.505),\n -0.025em 0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 14% {\n text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.505),\n -0.05em -0.025em 0 rgba(0, 255, 0, 0.505),\n -0.025em 0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 15% {\n text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.505),\n 0.025em 0.025em 0 rgba(0, 255, 0, 0.505),\n -0.05em -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 49% {\n text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.505),\n 0.025em 0.025em 0 rgba(0, 255, 0, 0.505),\n -0.05em -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 50% {\n text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.505),\n 0.05em 0 0 rgba(0, 255, 0, 0.505), 0 -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 99% {\n text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.505),\n 0.05em 0 0 rgba(0, 255, 0, 0.505), 0 -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n 100% {\n text-shadow: -0.025em 0 0 rgba(255, 0, 0, 0.505),\n -0.025em -0.025em 0 rgba(0, 255, 0, 0.505),\n -0.025em -0.05em 0 rgba(0, 0, 255, 0.505);\n }\n}\n\n\n\n.skill-container{\n position: relative;\n width: 100%;\n height: 10px;\n border-radius: 5px;\n background-color: rgba(78, 77, 77, 0.329);\n flex: 7;\n}\n\n\n\n.c{\n position: absolute;\n width: 50%;\n height: 100%;\n border-radius: 5px 0px 0px 5px ;\n background-color: blueviolet;\n box-shadow: 0px 0px 10px 3px blueviolet;\n}\n\nbody::-webkit-scrollbar {\n width: 1px;\n}\n \nbody::-webkit-scrollbar-thumb {\n background-color: rgba(201, 10, 207, 0.3);\n outline: 1px solid blueviolet;\n}\n\n#cursor{\n transform: translate(-50%,-50%);\n height: 20px;\n width: 20px;\n transition: all 20ms ease;\n position: fixed;\n border: 2px solid;\n border-color: white;\n border-radius: 50%;\n pointer-events: none;\n box-shadow: 0px 0px 25px 0px white,\n inset 0px 0px 5px 0px white;\n z-index: 100;\n transition: transform 250ms ease-in-out;\n animation: beat 1s infinite ease-in-out;\n}\n\n@keyframes beat {\n 0%{\n box-shadow: 0px 0px 25px 0px white,\n inset 0px 0px 5px 0px white;\n }\n 50%{\n box-shadow: 0px 0px 10px 0px white,\n inset 0px 0px 1px 0px white;\n }\n 100%{\n box-shadow: 0px 0px 25px 0px white,\n inset 0px 0px 5px 0px white;\n }\n}\n\n#overlay-back{\n position: fixed;\n width: 100%;\n height: 100%;\n pointer-events: none;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: -1;\n cursor: pointer;\n opacity: 0.25;\n pointer-events: none;\n}\n\n#bg3{\n position: absolute;\n top: 0;\n z-index: -500;\n display: none;\n height: 100%;\n width: 100%;\n}\n\n#overlay-front::after{\n content: \" \";\n display: block;\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));\n z-index: 3;\n background-size: 100% 2px, 3px 100%;\n pointer-events: none;\n}\n\n#overlay-bottom{\n position: fixed;\n width: 100%;\n z-index: 50;\n bottom: 0;\n padding-top: 90px;\n background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.01) 100%);\n pointer-events: none;\n}\n\n\n\n#overlay-background{\n background-position: center;\n background-repeat: no-repeat;\n background-size: cover;\n position: fixed;\n pointer-events: none;\n top: 0;\n left: 0px;\n right: 0;\n bottom: 0;\n z-index: -1;\n cursor: pointer;\n opacity: 1;\n filter: blur(5px);\n pointer-events: none;\n}\n\n.icon-hero{\n height: auto;\n width: 3em;\n align-self: center;\n justify-self: center;\n animation: icon-flick 1.5s infinite; \n}\n\n.pulse{\n animation: pulse-flick 1500ms infinite;\n}\n\n@keyframes pulse-flick {\n 0%{\n filter: drop-shadow(0px 0px 0px #ffffff) blur(2px) ;\n }\n\n 33%{\n filter: drop-shadow(0px 0px 45px #Ffffff) blur(0px);\n }\n\n 100%{\n filter: drop-shadow(0px 0px 0px #Ffffff) blur(2px);\n }\n}\n\n@keyframes icon-flick {\n 0%{\n filter: drop-shadow(0px 0px 0px #ffffff) blur(2px) ;\n }\n 100%{\n filter: drop-shadow(0px 0px 45px #Ffffff) blur(0px);\n }\n}\n\n@keyframes scroll {\n 0%{\n opacity: 0;\n }\n 100%{\n opacity: 1;\n }\n}\n\n\ninput{\n cursor: none;\n background-color: rgba(0, 0, 0, 0.322);\n color: white;\n margin: 2% 0%;\n padding: 12px;\n outline: none;\n border-radius: 5px;\n font-size: 1em;\n border: none;\n}\ninput:focus{\n z-index: 10;\n background-color: rgba(0, 0, 0, 0.746);\n}\ninput::placeholder{\n color: #ffffff;\n opacity: 0.8;\n}\n\ntextarea{\n margin: 2% 0%;\n cursor: none;\n outline: none;\n padding: 10px;\n border-radius: 5px;\n background-color: rgba(0, 0, 0, 0.382);\n color: white;\n border: none;\n resize: none;\n font-size: 1.5em;\n}\n\ntextarea:focus{\n background-color: rgba(0, 0, 0, 0.746);\n}\n\ntextarea::placeholder{\n color: #ffffff;\n opacity: 0.8;\n}\n\n.submit{\n margin: 2% 0;\n padding:2% 5% ;\n outline: none;\n border-radius: 15px;\n color: rgb(255, 255, 255);\n background-color: rgba(0, 0, 0, 0.644);\n font-size: 1.25em;\n font-weight: bolder;\n text-transform: uppercase;\n border: none;\n z-index: 10;\n cursor: none;\n transition: all 500ms ease-in-out;\n font-family: Pixel,monospace;\n}\n\n.submit:hover{\n color: rgb(255, 255, 255);\n background-color: rgba(0, 0, 0, 0.5);\n text-shadow: 0px 0px 5px white;\n box-shadow: 0px 0px 10px 0px white,\n inset 0px 0px 10px 0px;\n transform: scale(1.25);\n}\n\n.social-items{\n font-size: 1.2em;\n display: grid;\n grid-template-columns: 1fr 1fr;\n row-gap: 5em;\n column-gap: 5em;\n text-align: center;\n}\n\ni{\n margin-right: 15px;\n}\n\n.social-item{\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n}\n\n\n.social-item:hover{\n z-index: 10;\n color: #ffffff;\n text-shadow:0px 0px 20px #d8d8d8;\n}\n\n.container{\n display:grid; \n grid-template-columns: 1fr 1fr;\n column-gap: 5rem;\n}\n\n@keyframes alert-ye {\n 0%{\n box-shadow: 0px 0px 10px 5px rgb(189, 187, 187);\n opacity: 0;\n }\n 50%{\n opacity: 0.8;\n }\n 100%{\n box-shadow: 0px 15px 35px -10px rgb(189, 187, 187);\n }\n}\n\n.alert {\n opacity: 0;\n position: absolute;\n top: -3em;\n border-radius: 5px;\n box-shadow: 0px 15px 35px -10px rgb(189, 187, 187);\n width: 100%;\n text-align: center;\n z-index: 50;\n padding: 10px;\n background-color: #00000094;\n color: rgba(255, 255, 255, 0.767);\n font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;\n transition: all 100ms ease-in;\n}\n\n\n\n.closebtn {\n margin-left: 15px;\n color: white;\n font-weight: bold;\n float: right;\n font-size: 22px;\n line-height: 20px;\n cursor: none;\n transition: 0.3s;\n}\n\n.closebtn:hover {\n color: black;\n}\n\n.proj-element{\n display: grid;\n grid-template-columns: 10fr 5fr 10fr;\n column-gap: 5em;\n padding: 0% 5%;\n .gliched-move a{\n font-size: 3em;\n text-transform: none;\n }\n .gliched-move{\n margin: 15% 0;\n text-align: center;\n }\n .info{\n font-size: 1.5em;\n }\n .lang{\n word-spacing: 15em;\n }\n}\n\n\n\n\n$base: 0.6rem;\n\n.scroll {\n position: absolute;\n bottom: 10em;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.chevron {\n position: absolute;\n width: $base * 3.5;\n height: $base * 0.8;\n opacity: 0;\n transform: scale(0.3);\n animation: move-chevron 3s ease-out infinite;\n}\n\n.chevron:first-child {\n animation: move-chevron 3s ease-out 1s infinite;\n}\n\n.chevron:nth-child(2) {\n animation: move-chevron 3s ease-out 2s infinite;\n}\n\n.chevron:before,\n.chevron:after {\n content: '';\n position: absolute;\n top: 0;\n height: 100%;\n width: 50%;\n background: #c1c1c2;\n box-shadow: 0px 0px 15px 1px white;\n}\n\n.chevron:before {\n left: 0;\n transform: skewY(30deg);\n}\n\n.chevron:after {\n right: 0;\n width: 50%;\n transform: skewY(-30deg);\n}\n\n@keyframes move-chevron {\n 25% {\n opacity: 1;\n\t}\n 33.3% {\n opacity: 1;\n transform: translateY($base * 3.8);\n }\n 66.6% {\n opacity: 1;\n transform: translateY($base * 5.2);\n }\n 100% {\n opacity: 0;\n transform: translateY($base * 8) scale(0.5);\n }\n}\n\n@keyframes timeline {\n0%{\n box-shadow: inset 0px 0px 0px 0px white;\n opacity: 0;\n}\n50%{\n box-shadow: inset 0px 0px 15px 0px white;\n opacity: 1;\n}\n100%{\n box-shadow: inset 0px 0px 0px 0px white;\n opacity: 0;\n}\n\n}\n\n\n.time-point{\n display: flex;\n align-items: center;\n justify-content: center;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background-color: rgb(255, 255, 255);\n box-shadow: 0px 0px 10px 0px white;\n filter: blur(1px);\n\n .line{\n position: relative;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n box-shadow: 0px 0px 70px -0px white;\n filter: blur(3px);\n height: 80vh;\n border-radius: 15px 15px 15px 15px;\n }\n\n .line-bottom{\n position: relative;\n align-self: flex-end;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n box-shadow: 0px 0px 70px 0px white;\n filter: blur(3px);\n height: 40vh;\n }\n\n .line-top{\n position: relative;\n align-self: flex-start;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n filter: blur(3px);\n box-shadow: 0px 0px 70px 0px white;\n height: 50vh;\n }\n\n}\n\n.mid-point{\n background-color: black;\n position: absolute;\n border-radius: 50%;\n width: 15px;\n height: 15px;\n box-shadow: inset 0px 0px 8px 0px white;\n animation: timeline 1s infinite;\n}\n\n\n\n.line-point{\n display: flex;\n position: relative;\n align-items: center;\n justify-content: center;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background-color: rgb(255, 255, 255);\n box-shadow: 0px 0px 10px 0px white;\n filter: blur(1px);\n\n .line-bottom{\n position: absolute;\n align-self: flex-end;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n box-shadow: 0px 0px 70px 0px white;\n filter: blur(3px);\n height: 30vh;\n }\n\n .line-top{\n position: relative;\n align-self: flex-start;\n border-left: 5px solid rgba(255, 255, 255, 0.512);\n filter: blur(3px);\n box-shadow: 0px 0px 70px 0px white;\n height: 35vh;\n }\n\n}\n\n#contact{\n .p{\n font-size: 1.5rem;\n }\n}\n\n.exp-element{\n display: grid;\n grid-template-columns: 2.5fr 1fr 10fr 10fr;\n column-gap: 3em;\n padding: 0% 5%;\n\n .linkfade:hover{\n text-shadow: 1px 1px 20px whitesmoke\n }\n\n \n\n .gliched-move{\n font-size: 2em;\n }\n .info{\n font-size: 1.5em;\n }\n}\n\n\n.skill-sec{\n display: flex;\n flex-direction: column;\n}\n\n#pagination {\n z-index: 10;\n position: fixed;\n top: 50%;\n transform: translateY(-50%);\n right: 30px;\n list-style: none;\n\nli{\n position: relative;\n margin: 20px 0;\n background: #fff;\n border-radius: 50%;\n width: 8px;\n height: 8px;\n transition: all .2s ease;\n filter: blur(1px);\n \n &:hover {\n transform: scale(1.5);\n }\n}\n\na {\n position: absolute;\n text-decoration: none; \n left: 0;\n top: 0;\n color: inherit;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n box-shadow: 0px 0px 5px 0px white;\n}\n}\n\n#main{\n @for $i from 1 to 11 {\n &.page-#{$i} {\n #pagination li:nth-of-type(#{$i}) {\n @extend %active-dot;\n }\n }\n }\n}\n\n%active-dot {\n transform: scale(2);\n box-shadow: 0px 0px 15px 1px white;\n filter: blur(0.25px);\n}\n\n\n\n@media only screen and (max-width: 1880px){\n\n .gliched-text{\n font-size: 1em;\n }\n\n .gliched-move{\n font-size: 0.75em;\n }\n\n .proj-element{\n .gliched-move{\n font-size: 0.75em;\n }\n justify-items: center;\n align-content: center;\n text-align: center;\n\n }\n\n .exp-element{\n .gliched-move{\n font-size: 1em;\n }\n justify-items: center;\n align-content: center;\n text-align: center;\n }\n}\n\n\n\n@media only screen and (max-width: 1300px) {\n .gliched-text{\n font-size: 1.7em;\n }\n .gliched-move{\n font-size: 1em;\n }\n}\n\n@media only screen and (max-width: 1150px){\n .exp-element{\n .time-point{\n display: none;\n }\n grid-template-columns: 1fr 5fr 5fr;\n }\n}\n\n@media only screen and (max-width: 1000px) {\n .gliched-text{\n font-size: 1em;\n }\n .gliched-move{\n font-size: 1em;\n }\n .navbar{\n font-size: 0.8em;\n }\n .child{\n height: 90vh;\n }\n\n #pagination{\n display: none;\n }\n\n}\n\n@media only screen and (max-height: 900px) {\n .gliched-text{\n font-size: 1.7em;\n }\n .gliched-move{\n font-size: 1em;\n }\n}\n\n@media only screen and (max-width: 900px){\n \n .exp-element{\n .info{\n display: none;\n }\n grid-template-columns: 1fr 10fr 5fr;\n }\n\n .proj-element{\n .gliched-text p{\n word-spacing: normal;\n }\n .lang{\n margin: 1%;\n font-size: 1em;\n word-spacing: 10px;\n }\n .info{\n font-size: 1em;\n }\n .gliched-move{\n margin: 0;\n }\n .line-point{\n display:none;\n }\n grid-template-columns: 1fr;\n row-gap: 1em;\n }\n\n}\n\n@media only screen and (max-width: 850px){\n\n .gliched-text{\n font-size: 1.5em;\n }\n .gliched-move{\n font-size: 1em;\n }\n\n .social-items{\n grid-template-columns: 1fr;\n row-gap: 1rem;\n }\n\n}\n\n@media only screen and (max-width: 800px){\n .exp-element{\n grid-template-columns: 1fr;\n row-gap: 2em;\n }\n\n}\n\n\n@media only screen and (max-width: 680px) {\n\n .gliched-text{\n font-size: 1.3em;\n }\n .gliched-move{\n font-size: 1em;\n }\n\n .navbar{\n\n a::after{\n display: none;\n }\n\n ul{\n p{\n display: none;\n }\n\n i{\n display: block;\n }\n \n a{\n text-shadow: none;\n }\n\n }\n\n }\n\n #cursor{\n display: none;\n }\n}\n\n\n\n\n@media only screen and (max-width: 580px) {\n .gliched-text{\n font-size: 1em;\n }\n .gliched-move{\n font-size: 1em;\n }\n\n .container{\n row-gap: 2em;\n grid-template-columns: 1fr;\n }\n\n #contact{\n justify-content: flex-end;\n .p{\n font-size: 0.55rem;\n }\n }\n \n .abt{\n padding-top: 50px;\n justify-content: space-evenly;\n }\n\n}\n\n@media only screen and (max-width: 400px){\n\n .gliched-text{\n font-size: 0.75em;\n }\n\n .gliched-move{\n font-size: 1em;\n }\n\n}\n\n@media only screen and (max-width: 320px){\n\n#contact{\n textarea{\n height: 20px;\n }\n}\n\n}\n\n\n\n\n"]} \ No newline at end of file