@import "https://fonts.googleapis.com/css2?family=Ubuntu:wght@300&display=swap";
@import "https://fonts.googleapis.com/css2?family=Acme&family=Source+Sans+Pro:wght@200&family=Ubuntu:wght@300&display=swap";
:root{--bg-active:whitesmoke;--font-primary:"Acme",sans-serif;--font-secondary:"Ubuntu",sans-serif}.forest-theme-colors{--primary-color:darkgreen;--secondary-color:#25ad25;--bg-img:url(/img/forest.webp);--bg-img-mobile:url(/img/forest-mobile.jpg);--slider-img0:url(/img/forestPhotos/img0.JPG);--slider-img1:url(/img/forestPhotos/img1.jpg);--slider-img2:url(/img/forestPhotos/img2.jpg);--slider-img3:url(/img/forestPhotos/img3.jpg);--slider-img4:url(/img/forestPhotos/img4.jpg);--slider-img5:url(/img/forestPhotos/img5.jpg);--paragraph-bg:rgba(0,100,0,.824);--bg-before:linear-gradient(to top left,rgba(0,0,0,.376),rgba(37,173,73,.25))}.royal-theme-colors{--primary-color:#041653;--secondary-color:#cc4b5b;--bg-img:url(/img/royal.jpg);--bg-img-mobile:url(/img/royal-mobile.jpg);--slider-img0:url(/img/royalPhotos/royal0.jpg);--slider-img1:url(/img/royalPhotos/royal1.jpg);--slider-img2:url(/img/royalPhotos/royal2.jpg);--slider-img3:url(/img/royalPhotos/royal3.jpg);--slider-img4:url(/img/royalPhotos/royal4.jpg);--slider-img5:url(/img/royalPhotos/royal5.jpg);--paragraph-bg:rgba(4,22,83,.75);--bg-before:linear-gradient(to top right,rgba(204,75,91,.5),rgba(4,22,83,.5) 75%)}.garden-theme-colors{--primary-color:#a57587;--secondary-color:#de6f83;--bg-img:url(/img/garden.webp);--bg-img-mobile:url(/img/garden-mobile.jpg);--slider-img0:url(/img/gardenPhotos/flower0.jpg);--slider-img1:url(/img/gardenPhotos/flower1.jpg);--slider-img2:url(/img/gardenPhotos/flower2.jpg);--slider-img3:url(/img/gardenPhotos/flower3.jpg);--slider-img4:url(/img/gardenPhotos/flower4.jpg);--slider-img5:url(/img/gardenPhotos/flower5.jpg);--paragraph-bg:rgba(165,117,135,.875);--bg-before:linear-gradient(to top left,rgba(190,61,61,.5),rgba(0,0,0,.5))}html,body{color:#f5f5f5;min-height:100%}h1{text-align:center;letter-spacing:.275rem;font-size:xx-large;font-family:var(--font-primary)}h2{margin:5px}h3{letter-spacing:.1rem;font-size:22.5px;font-family:var(--font-primary);margin:5px 0}address{color:#000;letter-spacing:.05rem;width:35%;font-style:normal;font-family:var(--font-primary);margin:auto 0}audio{display:none}body{-webkit-user-select:text;-moz-user-select:text;user-select:text;caret-color:transparent;background-blend-mode:multiply;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;background-attachment:fixed;background-image:var(--bg-img);margin:0 0 0 205px;transition:all 1s;position:relative}.loadingScreen{z-index:9999;color:#f5f5f5;background-image:url(/img/loading.gif);background-position:50%;background-repeat:no-repeat;background-size:cover;justify-content:center;align-items:center;width:100%;height:100dvh;font-size:xx-large;transition:all .5s;display:flex;position:fixed;top:0;left:0}.loader{height:inherit;justify-content:center;align-items:center;display:flex}.section-placeholder-large{min-height:282.5dvh}.section-placeholder-medium{min-height:100.75dvh}body:after{content:"";z-index:-1;background:var(--bg-before);width:100%;height:100%;transition:all .75s;position:fixed;top:0;left:0}.wave-svg{transition:all .5s;position:absolute;bottom:-2px}.wave-svg path{fill:var(--secondary-color);transition:all .5s}.wave-svg-bottom{position:absolute}.wave-svg-bottom path{fill:var(--secondary-color);transition:all .5s}section{z-index:10;box-sizing:border-box;flex-direction:column;justify-content:center;min-height:100dvh;padding:37.5px 0;transition:all .5s;display:flex;position:relative}.fade-in{opacity:1;transition:opacity 1s ease-out .5s,transform 1s ease-out .5s;transform:translateY(0)}.hidden{opacity:0;transition:opacity 1s ease-out .5s,transform 1s ease-out .5s;transform:translateY(20px)}.landing-hidden{opacity:0;height:100dvh;transition:opacity 1s ease-out .5s,transform 1s ease-out .5s;transform:translateY(20px)}.hide{display:none}.section-title,.section-title2{text-align:center;letter-spacing:.275rem;font-size:xx-large;font-family:var(--font-primary);text-decoration:overline}.section-title2{width:47.5%;padding:15px 0}.container{height:100dvh}.flex-container{flex-wrap:wrap;justify-content:space-evenly;align-items:center;gap:.5rem;display:flex}.fadeIn{animation:.5s ease-in fade-in}.fadeOut{animation:1s ease-out fade-out}.secondary-bg{background:var(--secondary-color)}.sidebar{background:var(--primary-color);align-items:center;width:205px;height:100dvh;transition:all .5s;display:flex;position:fixed;top:0;left:0}.sidebar .nav-text{opacity:1;letter-spacing:.075rem;width:40%;transition:all 1s;display:inline-block}.sidebar .nav-text.hide{opacity:0;width:0;transition:all 1s}.sidebar-animation{width:150px}.body-compress{margin-left:150px}.arrow{cursor:pointer;font-size:27.5px;transition:all .5s;position:absolute;top:15px;right:10px}.arrow:hover{color:var(--secondary-color)}.arrow-animation{transform:rotate(-180deg)}.sb-list{width:100%;font-size:16px;font-family:var(--font-primary);flex-direction:column;gap:4rem;list-style-type:none;display:flex}.sb-list li{white-space:nowrap;transition:all .5s}.sb-list li:not(:last-child):hover{scale:.9}.sb-list li a,.footer-content a{color:#f5f5f5;text-decoration:none}.sb-list li a.active-link{background:var(--bg-active);color:var(--secondary-color);border-radius:32px;padding:10px;transition:all .75s;position:relative;left:-8px}.select{z-index:10;position:relative}.sb-list select{-webkit-appearance:base-select;-moz-appearance:base-select;appearance:base-select;border:none;padding:0 5px}.sb-list select::picker(select){color:#f5f5f5;-webkit-appearance:base-select;-moz-appearance:base-select;appearance:base-select;font-size:13.25px;font-family:var(--font-primary);background:0 0;border:none;border-radius:8px}option{padding:7.5px 5px}.sb-list select:focus{outline:none}.sb-list select:hover{background:0 0}.theme-changer{display:flex}select,option{cursor:pointer}.forest-option{background:#006400}.forest-option:hover{color:#006400;background:#f5f5f5;transition:all .5s}.royal-option{color:#cc4b5b;background:#041653;transition:all .5s}.royal-option:hover{color:#041653;background:#cc4b5b}.garden-option{background:#a57587;transition:all .5s}.garden-option:hover{background:#de6f83}#bars:checked~.sidebar{left:0}.headshot{opacity:1;content:var(--headshot);border:5px solid var(--secondary-color);border-radius:50%;width:325px;height:325px;transition:opacity .5s ease-in-out;position:absolute;top:10px;right:10px}.headshot-swiper{border-radius:50%}.headshot.fade{opacity:0;visibility:hidden;transition:opacity .5s visibility .5s ease-in-out}.landing-title{flex-wrap:wrap;place-content:center;width:100%;height:100%;display:flex;position:absolute}.skill-container{flex-wrap:wrap;grid-template-columns:repeat(3,30%);place-content:center;gap:.25rem;width:100%;height:87.5dvh;display:grid}.skills{perspective:1000px;color:#f5f5f5;box-sizing:border-box;border:5px solid #f5f5f5;border-radius:4px;flex-wrap:wrap;place-content:center;width:100%;margin:auto;display:flex}.skills-img{width:150px;height:150px;padding:12.5px}.skills-name{text-transform:capitalize;letter-spacing:.1rem}.flip-card-inner{text-align:center;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s;position:relative;box-shadow:0 4px 8px rgba(0,0,0,.2)}.flip-card-front{flex-wrap:wrap;place-content:center;display:flex}.flip-card:hover .flip-card-inner{transform:rotateY(180deg)}.flip-card-front,.flip-card-back{-webkit-backface-visibility:hidden;backface-visibility:hidden;width:100%;height:185px;position:absolute}.flip-card-back{height:185px;font-size:larger;font-family:var(--font-primary);background-color:var(--secondary-color);flex-flow:column wrap;place-content:center;display:flex;position:relative;transform:rotateY(180deg)}.home-projects-container{flex-wrap:wrap;place-content:center space-evenly;height:85dvh;display:flex}.home-projects{text-align:center;width:33%;margin:auto}.home-projects img{cursor:pointer;border-radius:16px;width:100%;transition:all .5s}.home-projects img:hover{border-radius:50%;scale:95%}.slider-container,.slider-container2{opacity:1;width:56.375%;transition:opacity .5s ease-in-out}.slider-container.fade{opacity:0;visibility:hidden;transition:opacity .5s visibility .5s ease-in-out}.swiper .slider{opacity:0;border-radius:16px;height:30rem}.swiper .swiper-slide-active{opacity:1;height:30rem}.swiper .swiper-slide-prev,.swiper .swiper-slide-next{opacity:.65;height:30rem}.swiper .swiper-pagination-bullet-active{background:var(--secondary-color)}.slider-img0,.slider-img1,.slider-img2,.slider-img3,.slider-img4,.slider-img5{background-position:50%;background-size:100% 100%;border-radius:50%;transition:all .5s}.slider-img0{background-image:var(--slider-img0)}.slider-img1{background-image:var(--slider-img1)}.slider-img2{background-image:var(--slider-img2)}.slider-img3{background-image:var(--slider-img3)}.slider-img4{background-image:var(--slider-img4)}.slider-img5{background-image:var(--slider-img5)}.paragraph,.paragraph2,.paragraph3{letter-spacing:.1rem;justify-content:center;align-items:center;width:27.5%;height:27.5rem;padding:25px;font-size:15.5px;font-weight:700;line-height:1.5rem;transition:all .5s;display:flex}.paragraph{text-align:left;background:var(--paragraph-bg);font-family:var(--font-secondary);border-radius:16px;margin:12.5px}.paragraph2{text-align:right;font-family:var(--font-secondary)}.paragraph3{text-align:left;font-family:var(--font-secondary);overflow-y:scroll}.paragraph3 p{height:100%}.playlist-container ul{scrollbar-color:var(--secondary-color);height:300px;margin:3.5px;padding:0 10px;overflow-y:scroll}::-webkit-scrollbar-thumb{opacity:.5;background:var(--primary-color);border-radius:4px;transition:all .5s}::-webkit-scrollbar{width:10px}.swiper .swiper-button-next,.swiper .swiper-button-prev{color:#f5f5f5;margin:-16px;position:absolute;scale:.75}.playlist-info{min-width:65%;position:relative}.playlist-container ul li{letter-spacing:.1rem;font-weight:700;font-family:var(--font-secondary);list-style-type:none}.playlist-container ul li:nth-child(2n){background:var(--primary-color);border-radius:4px}.playlist-header{background:var(--primary-color);border-radius:8px;justify-content:space-between;align-items:stretch;gap:1rem;padding:17.5px;display:flex}.playlist-header img{width:150px;height:150px}.playlist-header+div{letter-spacing:.1rem;flex-direction:column;justify-content:space-between;display:flex}.full-playlist{color:#f5f5f5;letter-spacing:.1rem;font-size:large;font-weight:bolder;font-family:var(--font-primary);transition:font-size .5s ease-in-out}.full-playlist:hover{font-size:15px}label{transition:all .5s}svg[data-name=pause-play]{cursor:pointer;transition:all .5s;position:absolute;bottom:0;right:0}div.track{justify-content:space-between;align-items:center;max-height:100px;padding:.75rem;display:flex}.track-info p{white-space:nowrap;text-overflow:ellipsis;max-width:300px;overflow:hidden}.preview-container{position:relative}.preview-container svg{opacity:.75;justify-content:center;align-items:center;display:flex;position:absolute;top:25%;left:22.5%}#track-~label[data-name=play]{opacity:1;transition:all .5s}#playlist-play~label[data-name=pause]{opacity:0;pointer-events:none;transition:all .5s}#playlist-play:checked~label[data-name=play]{opacity:0;transition:all .5s}#playlist-play:checked~label[data-name=pause]{opacity:1;cursor:pointer;transition:all .5s}.playlist{justify-content:space-evenly;align-items:center;height:100dvh;display:flex}.song-container{align-items:center;gap:.5rem;height:85px;display:flex;position:relative}.songs{grid-template-columns:repeat(2,1fr);gap:1.5rem;padding:15px;display:grid}.song{justify-content:center;align-items:center;gap:1rem;display:flex}.song-btn{cursor:pointer;transition:all .5s}.musician-container{overflow-wrap:anywhere;width:17.5%}.musician-name,.music-rank{letter-spacing:.1rem;font-weight:700;font-family:var(--font-primary)}.song-btn:hover{scale:1.25}.first-song{z-index:1;opacity:1;border:none;width:-moz-fit-content;width:fit-content;height:85px;transition:all .75s;position:relative}.second-song{opacity:1;z-index:0;border:none;width:-moz-fit-content;width:fit-content;height:85px;margin:auto;transition:all .75s;position:absolute;left:0}.hide-song{opacity:0;pointer-events:none}input[type=checkbox]{display:none}.playlist>*{flex-direction:column;gap:1rem;width:42.5%;display:flex}.playlist-total{letter-spacing:.1rem;font-weight:700;font-family:var(--font-primary);position:absolute;bottom:0}.playlist-slider .swiper-slide-prev,.playlist-slider .swiper-slide-next{opacity:1;height:auto}.playlist-img img{border-radius:8px;width:100%}.playlist-slider .swiper-slider{height:100px}.swiper{width:100%;height:100%}.swiper-slide{opacity:0;background-position:50%;background-repeat:no-repeat;background-size:cover}.playlist-slider{width:100%;height:500px}.thumbnail-slider{height:125px;padding:10px 0}.thumbnail-slider .swiper-slide{opacity:.4;width:25%;height:100%}.thumbnail-slider .swiper-slide-thumb-active{opacity:1}.swiper-slide img{cursor:pointer;object-fit:cover;border-radius:8px;width:100%;display:block}.swiper .swiper-horizontal>.swiper-pagination-bullets,.swiper .swiper-pagination-bullets.swiper-pagination-horizontal{width:50%;left:25%}.tv-shows,.movies,.animes{box-sizing:border-box;grid-template-columns:repeat(2,1fr);align-items:center;gap:1rem;width:47.5%;height:85dvh;font-size:x-large;display:grid}.media{justify-content:center;gap:1rem;display:flex}.media span{font-family:var(--font-primary);font-weight:700}.media img{cursor:pointer;border-radius:8px;width:175px;height:auto;transition:all .75s}.media img:hover{cursor:pointer;filter:saturate(1.5);border-radius:50%;transform:scale(.95)}.media-favorites,.media-favorites.movie-container{box-sizing:border-box;align-items:center;gap:1rem;width:100%;padding:25px;display:flex}.media-favorites.movie-container{flex-direction:row-reverse}dialog{background:0 0;border:none;padding:0;left:205px}dialog svg{cursor:pointer;color:var(--primary-color);transition:all .5s;position:fixed;top:15px;right:15px}dialog svg:hover{rotate:270deg;scale:1.25}dialog::backdrop{background:var(--bg-before)}.yt-clip{border:none;border-radius:8px;outline:none;width:900px;height:508px}.trending-media{box-sizing:border-box;width:100%;padding:75px 75px 0}td img{border-radius:8px;width:125px;height:auto}.table-container{overflow:auto}table{letter-spacing:.1rem;font-family:var(--font-primary);margin:auto;padding-bottom:25px}th,td{padding:10px}td{text-align:center}tr:nth-child(2n){background:var(--primary-color)}tr:nth-child(odd){background:var(--bg-before)}small{letter-spacing:.1rem;font-weight:700;font-family:var(--font-secondary)}.popup-container{flex-wrap:wrap;justify-content:space-around;width:100%;display:flex}.popup-container img{border-radius:8px;width:50%}.popup-container a{width:100%}.popup-container span{color:#000;font-size:medium;font-weight:700;font-family:var(--font-secondary);padding:15px 10px;transition:all .5s}.popup-container span:hover{color:var(--primary-color);font-size:14px}.map{border-radius:16px;width:600px;height:400px}.map-btns{grid-template-columns:repeat(3,1fr);gap:1rem;width:40%;display:grid}.map-btns button{cursor:pointer;width:100%;height:100px;color:var(--primary-color);font-family:var(--font-primary);background:#f5f5f5;border:none;border-radius:8px;transition:all .5s}.map-btns button:hover{color:#f5f5f5;background:var(--primary-color);scale:1.1}.map-btns button.active{color:#f5f5f5;background:var(--primary-color);scale:1.05}p.project-paragraph{text-align:center;font-family:var(--font-primary)}footer{background:var(--bg-before);display:flex}.footer-section{box-sizing:border-box;width:33%;padding:5px 10px}.footer-section h3{border-bottom:2px solid #f5f5f5}.footer-content.socials{display:flex}.footer-content a{font-family:var(--font-secondary);transition:all .5s;display:flex}.footer-content span{letter-spacing:.175rem;transition:all .5s}.footer-content span:hover{color:var(--secondary-color);scale:.9}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1;display:inline-block}to{opacity:0;display:none}}@media screen and (max-width:1440px){.paragraph,.paragraph2,.paragraph3{line-height:normal}}@media screen and (max-width:1286px){.skills-img{width:100px;height:100px}.java{width:200px;height:100px}.thumbnail-slider{height:100px}.paragraph,.paragraph2,.paragraph3{font-size:13.75px;line-height:1.15rem}.swiper .slider,.swiper .swiper-slide-active,.swiper .swiper-slide-prev,.swiper .swiper-slide-next{height:25rem}.trending-media{padding:25px 25px 0}.playlist-info{min-width:60%}}@media screen and (max-width:1232px){.map-btns{width:600px;padding:12.5px}.playlist>*{width:47.5%}}@media screen and (max-width:1148px){.slider-container,.slider-container2{width:85%;margin:auto}.playlist{flex-direction:column;gap:1.5rem;height:85dvh}.playlist-slider{width:100%;height:415px}.playlist-container ul{height:225px}.playlist-header img{width:125px;height:125px}.track-info p{font-size:small}.playlist>*{width:60%}.flex-container{gap:initial}.section-title,.section-title2{font-size:27.5px}.paragraph,.paragraph2,.paragraph3{width:80%;height:25%;padding:15px;line-height:1.5rem}.paragraph3{margin-top:25px}.paragraph3 p{height:250px}.tv-shows,.movies,.animes,.section-title2{width:75%}.yt-clip{width:775px}.ff-container{flex-direction:column-reverse}}@media screen and (max-width:1048px){.musician-name{display:none}.yt-clip{width:725px}}@media screen and (max-width:1024px){.slider-container,.slider-container2{width:60%}.footer-content span{font-size:15px}}@media screen and (max-width:992px){.footer-section{width:100%}.yt-clip{width:650px}}@media screen and (max-width:968px){.songs{grid-template-columns:auto;justify-content:center}.song{gap:0}.musician-container{gap:1rem;display:flex}.musician-name{display:block}}@media screen and (max-width:900px){.swiper .slider,.swiper .swiper-slide-active,.swiper .swiper-slide-prev,.swiper .swiper-slide-next{height:20rem}.media-favorites,.media-favorites.movie-container{flex-direction:column}.yt-clip{width:575px}.track-info p{max-width:225px}}@media screen and (max-width:832px){.yt-clip{width:425px;height:350px}.map{width:500px;height:333.34px;padding:10px}.track-info p{max-width:175px}.playlist>*{width:75%}.paragraph,.paragraph2,.paragraph3{font-size:small}}@media screen and (max-width:768px){.slider-container,.slider-container2{width:75%}.tv-shows,.animes,.movies{justify-content:center;width:90%}.media img{width:125px}.playlist-info{min-width:57.5%}}@media screen and (max-width:748px){table{font-size:x-small}.playlist-info{min-width:52.5%}}@media screen and (max-width:700px){.map{width:400px;height:266.67px}footer{flex-wrap:wrap}.footer-section{width:50%}.playlist-info{min-width:50%}footer .footer-section:last-child{width:100%}}@media screen and (max-width:670px){h1{text-align:center;margin:72px auto;font-size:24px}.headshot{margin:auto;position:relative;top:0;right:0}.landing-title{height:auto}.sb-list li{text-align:center}.musician-name{display:none}.bars{z-index:50;background:var(--primary-color);border-bottom-right-radius:24px;padding:10px;position:fixed}.sidebar{z-index:100;width:100%;left:-100%}.x-sb{position:absolute;top:10px;right:5px}body{margin:0}dialog{left:0}.trending-media{width:92.5%}.playlist-info{min-width:65%}.home-projects-container{flex-direction:column}}@media screen and (max-width:648px){.playlist-info{min-width:60%}.track-info p{font-size:x-small}.paragraph,.paragraph2,.paragraph3{font-size:small}}@media screen and (max-width:620px){h3{font-size:20px}.yt-clip{width:100%}}@media screen and (max-width:450px){body{background-image:var(--bg-img-mobile)}main.content-wrapper{-webkit-overflow-scrolling:touch;height:100vh;overflow-y:scroll}.flip-card-front,.flip-card-back{height:150px}.headshot{width:325px;height:325px}.select{width:100px}option{padding:12.5px}.playlist>*{width:90%}h2{font-size:xx-large}h3{font-size:large}.full-playlist{font-size:medium}.playlist-total{font-size:small}.paragraph,.paragraph2,.paragraph3{text-align:justify;box-sizing:border-box;width:100%;line-height:1.15rem}small{font-size:xx-small}td img{width:75px}th,td{text-align:start;padding:3.25px;font-size:9.5px}address{font-size:x-small}.section-placeholder-large{justify-content:start;min-height:265dvh}.trending-media{width:95%;padding:0}.songs{height:100dvh;overflow-y:scroll}.playlist{height:102.5dvh}.playlist-info{min-width:55%}.popup-container img{width:42.5%}.popup-container span{font-size:small}.popup-container span:hover{font-size:smaller}.swiper .swiper-horizontal>.swiper-pagination-bullets,.swiper .swiper-pagination-bullets.swiper-pagination-horizontal{width:80%;left:10%}}@media screen and (max-width:375px){h3,.full-playlist,.playlist-total{letter-spacing:.05rem}}
