*{margin:0;padding:0;box-sizing:border-box}body{background-color:#0e0b16;font-family:Montserrat,sans-serif;color:#e0e0e0;padding:20px;overflow-x:hidden}.glitch{font-size:3rem;font-weight:700;color:#e0e0e0;position:relative;text-transform:uppercase;margin-bottom:20px;animation:glitch-animation 2s infinite}.glitch:after,.glitch:before{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0e0b16;overflow:hidden;clip:rect(0,900px,0,0)}.glitch:before{left:2px;text-shadow:-2px 0 red;animation:glitch-animation-2 2s infinite linear alternate-reverse}.glitch:after{left:-2px;text-shadow:-2px 0 #00f;animation:glitch-animation-3 1.5s infinite linear alternate-reverse}@keyframes glitch-animation{0%{transform:translate(0)}20%{transform:translate(-2px,-2px)}40%{transform:translate(2px,-2px)}60%{transform:translate(-2px,2px)}80%{transform:translate(2px,2px)}100%{transform:translate(0)}}@keyframes glitch-animation-2{0%{clip:rect(0,900px,0,0)}100%{clip:rect(10px,900px,30px,0)}}@keyframes glitch-animation-3{0%{clip:rect(0,900px,0,0)}100%{clip:rect(10px,900px,20px,0)}}.container{max-width:1200px;margin:auto}header{text-align:center;margin-bottom:50px}header a{text-decoration:none}header .glitch{font-size:3rem;font-weight:700;color:#e0e0e0;text-transform:uppercase}header hr{border-color:#e0e0e0;margin:20px auto;width:50%}.projects{display:flex;flex-direction:column;gap:0}.project-item{display:flex;align-items:center;width:100vw;margin-left:calc(-50vw + 50%);padding:40px calc(50vw - 50%);background-color:transparent;border-radius:0}.project-item.left{flex-direction:row}.project-item.right{flex-direction:row-reverse}#project-hitmastery{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/hitmastery-bg.webp);background-size:cover;background-position:center;background-repeat:no-repeat;min-height:400px}#project-clickcorp{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/clickcorp-bg.png);background-size:cover;background-position:center;background-repeat:no-repeat;min-height:400px}#project-stillpine{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/stillpine2.png);background-size:cover;background-position:center;background-repeat:no-repeat;min-height:400px}#project-cityclicker{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/cityclicker-archive/cityclick4.png);background-size:cover;background-position:center;background-repeat:no-repeat;min-height:400px}#project-everydaythesamedream{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/everydaythesame-archive/C7DCD146-7CA1-4FC9-8234-87FD7A3EC0FA.png);background-size:cover;background-position:center;background-repeat:no-repeat;min-height:400px}#project-littlewhitey{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url(../images/lw-archive/littlewhitey-thumb.png);background-size:cover;background-position:center;background-repeat:no-repeat;min-height:400px}.project-images-container{width:50%;max-width:800px;margin-left:60px}.grid-navigation-wrapper{display:flex;align-items:center;gap:10px;width:900px}.grid-nav-btn{background-color:#fff;color:#000;border:none;width:40px;min-width:40px;height:40px;cursor:pointer;font-size:1.2rem;transition:all .3s;flex-shrink:0}.grid-nav-btn:hover{background-color:#f04848;color:#fff}.grid-nav-btn:disabled{opacity:.3;cursor:not-allowed}.image-toggle-buttons{display:flex;gap:10px;margin-bottom:20px;justify-content:center;width:900px}.toggle-btn{padding:10px 20px;background-color:#666;color:#000;border:none;cursor:pointer;font-family:Montserrat,sans-serif;font-size:.9rem;font-weight:700;transition:all .3s}.toggle-btn:hover{background-color:#888}.toggle-btn.active{background-color:#fff;color:#000}.project-images-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;flex:1}.grid-image{width:100%;height:200px;object-fit:cover;border:3px solid #3f3e49;cursor:pointer;transition:border .3s}.grid-image:hover{border:3px solid #fff}.project-image{width:40%;max-width:500px;margin:0 20px;border:3px solid #3f3e49;cursor:pointer}.project-image-temp:hover,.project-image:hover{border:3px solid #f04848}.project-image-temp{width:40%;max-width:500px;margin:0 20px;border:3px solid #3f3e49;height:300px;cursor:pointer}.project-details{flex:1}@font-face{font-family:Coolvetica;src:url(../fonts/coolvetica.otf) format('opentype');font-weight:400;font-style:normal}.project-title_HM{font-size:35px;font-weight:700;margin-bottom:10px;font-family:Coolvetica,Arial,sans-serif;text-transform:uppercase;color:#0e0b16;background:#fff;padding:5px 7px 5px 10px;width:215px;letter-spacing:1px}.project-title{max-width:200px;height:auto;margin-bottom:10px;display:block}h2.project-title{max-width:400px}#project-littlewhitey .project-title{max-width:400px}.project-description{font-size:1rem;color:#fff;margin-bottom:10px}.project-tech{font-size:1rem;font-weight:600;margin-bottom:5px}.tool-icons{padding-top:15px;border-top:2px solid #fff}.tool-icons i{font-size:1.5rem;margin-right:10px;color:#fff;transition:color .3s;margin-top:10px}.project-link a{font-size:1rem;color:#f04848;text-decoration:none;display:inline-flex;align-items:center;margin-top:15px}.project-link a:hover{color:#fff}.project-link i{margin-right:5px}.date-created{font-size:1rem;color:#fff;margin-bottom:15px;padding-bottom:15px;border-bottom:2px solid #fff}.hidden-images{display:none}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;backdrop-filter:blur(10px);background-color:rgba(0,0,0,.5)}.modal-content{margin:auto;display:flex;align-items:center;justify-content:center;width:100%;height:100%;text-align:center;position:relative}.modal-image{width:auto;max-width:90%;max-height:90vh;height:auto;border:5px solid #fff;display:block;position:relative;z-index:1000}.close{position:absolute;top:15px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s;z-index:1003}.close:focus,.close:hover{color:#bbb;text-decoration:none;cursor:pointer}.modal-date{position:fixed;background-color:rgba(0,0,0,.7);color:#e0e0e0;padding:10px 15px;border-radius:4px;font-size:1.2rem;font-weight:600;z-index:1003;pointer-events:none}.next,.prev{cursor:pointer;position:absolute;top:50%;width:50px;height:50px;margin-top:-25px;background-color:#fff;color:#000;border:none;font-size:1.5rem;transition:all .3s;user-select:none;display:flex;align-items:center;justify-content:center;z-index:1002}.next{right:30px}.prev{left:30px}.next:hover,.prev:hover{background-color:#f04848;color:#fff}input,textarea{caret-color:transparent}body{user-select:none}[contenteditable=true]{caret-color:transparent}.expand-btn{background:0 0;border:1px solid #e0e0e0;color:#e0e0e0;font-size:1.2rem;font-weight:700;width:30px;height:30px;cursor:pointer;margin-left:10px;border-radius:4px;transition:all .3s ease;vertical-align:middle}.expand-btn:hover{background-color:#e0e0e0;color:#0e0b16;transform:scale(1.1)}.collapsible-content{transition:all .3s ease}.project-item:has(.collapsible-content[style*="display: none"]){min-height:auto;padding:20px calc(50vw - 50%)}.project-item:has(.collapsible-content[style*="display: none"]) .project-details{margin-bottom:0}.project-item:has(.collapsible-content[style*="display: none"]) .project-title{margin-bottom:5px}.project-item:has(.collapsible-content[style*="display: none"]) .date-created{margin-bottom:0}.video-wrapper{position:relative;display:inline-block;max-width:800px;width:100%}.video-date{position:absolute;top:10px;left:10px;background-color:rgba(0,0,0,.7);color:#e0e0e0;padding:5px 10px;border-radius:4px;font-size:.9rem;font-weight:600;z-index:20;pointer-events:none}.spoiler-wrapper{cursor:pointer}.spoiler-wrapper .grid-image{border:3px solid #3f3e49;transition:border .3s}.spoiler-wrapper:hover .grid-image{border:3px solid #fff}.spoiler-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.95);display:flex;align-items:center;justify-content:center;z-index:15;transition:opacity .3s ease;backdrop-filter:blur(20px);border:3px solid #3f3e49;transition:border .3s}.spoiler-overlay:hover{border:3px solid #fff}.spoiler-wrapper.revealed .spoiler-overlay{opacity:0;pointer-events:none}.spoiler-label{color:#e0e0e0;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:3px}.spoiler-text{color:#e0e0e0;font-size:1.2rem;font-weight:600;text-transform:uppercase;letter-spacing:2px;border-radius:8px}.spoiler-wrapper:hover .spoiler-text{border-color:#a239ca;color:#be1616}.modal-spoiler-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:auto;max-width:90%;max-height:90vh;aspect-ratio:auto;background-color:rgba(0,0,0,.95);display:flex;align-items:center;justify-content:center;z-index:1001;transition:opacity .3s ease;backdrop-filter:blur(20px);cursor:pointer;border:5px solid #fff}.modal-spoiler-overlay.revealed{opacity:0;pointer-events:none}.modal-spoiler-overlay:hover .spoiler-text{color:#be1616}.modal-spoiler-overlay .spoiler-label{font-size:1.5rem;text-align:left}.modal-spoiler-overlay .spoiler-text{font-size:1.8rem}
/*# sourceMappingURL=projects.css.map */