﻿.works{position:absolute;top:100%;width:100%;transition:.8s;background:url(img/Bred.png) #bc2c26;background-size:80px;padding:50px 0;z-index:2}.worksTab{position:absolute;top:0px;left:50%;width:50px;height:50px;color:#c98e50;line-height:1em;font-size:.9em;display:flex;margin-left:-85px;align-items:center;justify-content:center;cursor:pointer;user-select:none;z-index:1;animation:5s workT both;animation-timeline:--workT;view-timeline:--workT}@keyframes workT{0%{opacity:0}}.worksTab:nth-of-type(2){left:50%;margin-left:-25px}.worksTab:nth-of-type(3){left:50%;margin-left:35px}.works>u{position:absolute;background:#bf803d;width:10px;transition:.5s;height:5px;top:45px;left:20px;margin:0 20px;display:block;z-index:1;animation:5s workT both;animation-timeline:--workT;view-timeline:--workT}.scroll:nth-of-type(2) ~ .works .worksTab{position:fixed;left:20px;margin-left:0;top:25px}.scroll:nth-of-type(2) ~ .works .worksTab:nth-of-type(2){position:fixed;left:80px}.scroll:nth-of-type(2) ~ .works .worksTab:nth-of-type(3){position:fixed;left:140px}.scroll:nth-of-type(2) ~ .works>u{animation:d1 .5s;opacity:1;top:70px}.scroll:nth-of-type(2) ~ .works .worksTab:nth-of-type(1){animation:d1 .5s}.scroll:nth-of-type(2) ~ .works .worksTab:nth-of-type(2){animation:d1 .7s}.scroll:nth-of-type(2) ~ .works .worksTab:nth-of-type(3){animation:d1 .9s}#all:checked ~ .works .worksTab:nth-of-type(1),#uiux:checked ~ .works .worksTab:nth-of-type(2),#viad:checked ~ .works .worksTab:nth-of-type(3){color:#e9d4be}#all:checked ~  .works>u{left:50%;margin-left:-65px;position:absolute}#uiux:checked ~ .works>u{left:50%;margin-left:-5px;position:absolute}#viad:checked ~ .works>u{left:50%;margin-left:55px;position:absolute}#all:checked ~ .scroll:nth-of-type(2) ~ .works>u{position:fixed;left:40px;margin-left:0px}#uiux:checked ~ .scroll:nth-of-type(2) ~ .works>u{position:fixed;left:100px;margin-left:0px}#viad:checked ~ .scroll:nth-of-type(2) ~ .works>u{position:fixed;left:160px;margin-left:0px}#uiux:checked ~ .works .uiux{display:block}#uiux:checked ~ .works .viad{display:none}#viad:checked ~ .works .uiux{display:none}#viad:checked ~ .works .viad{display:block}#all:checked ~ .works .workLi *{animation:workAll 1s}#uiux:checked ~ .works .workLi *{animation:workUiux 1s}#viad:checked ~ .works .workLi *{animation:workViad 1s}@keyframes workAll{0%{opacity:0}}@keyframes workUiux{0%{opacity:0}}@keyframes workViad{0%{opacity:0}}.workLi{position:relative;height:80px;display:block;color:#fff;letter-spacing:.5px;font-weight:300;cursor:pointer;user-select:none;border-bottom:2px dotted rgba(212,140,105,0.5);text-align:justify;line-height:1.5em;padding:50px 0px 50px 90px;margin:0 30px;animation:5s workLi both;animation-timeline:--workLi;view-timeline:--workLi}@keyframes workLi{0%{transform:scale(.5);opacity:0;color:#e9b684;filter:blur(0px)}30%{transform:scale(1);opacity:1;filter:blur(0px)}75%{transform:scale(1);opacity:1;color:#fff}80%{transform:scale(.95);opacity:1;color:#fff;filter:blur(0px)}85%{transform:scale(.95);opacity:0;filter:blur(15px)}99.9%{transform:scale(.95);opacity:0;filter:blur(15px)}100%{opacity:1}}.workLi>b{font-size:.7em;font-weight:300;position:absolute;bottom:53px;transition:.5s}.workLi>b:nth-of-type(1){left:90px;color:#eecc95}.workLi>b:nth-of-type(2){right:0px;color:#eecc95}.workLi>s{position:absolute;width:65px;height:65px;transition:.5s;left:0px;top:55px;overflow:hidden;border-radius:99px;box-shadow:5px 5px 0 0 rgba(90,4,0,0.1)}.workLi>s img{position:absolute;transition:.5s;width:160px;top:-5px;left:-36px;filter:sepia(30%)}.workLi:nth-child(2n){padding:50px 90px 50px 0px}.workLi:nth-child(2n)>s{left:inherit;right:0px}.workLi:nth-child(2n)>b:nth-of-type(1){left:inherit;right:90px}.workLi:nth-child(2n)>b:nth-of-type(2){right:inherit;left:0px}.worksP::-webkit-scrollbar{width:0px;background:rgba(0,0,0,0)}.worksP{position:fixed;z-index:5;top:0px;left:0px;width:100%;height:0%;transition:.3s;overscroll-behavior:contain;overflow-y:scroll}#worksP:checked ~ .worksP{height:100%;transition:0s}#worksP:checked ~ .worksP iframe{opacity:1;height:100%;transition:.7s .45s}#worksP:checked ~ .worksP label{opacity:1;animation:2s d1}#worksP:checked ~ .works>label{border-bottom:2px dotted rgba(212,140,105,0);transition:1s}.worksTab{border-bottom:none!important}#worksP:checked ~ .works>label:nth-child(2n+1) *{opacity:0;transition:.5s!important}#worksP:checked ~ .works>label:nth-child(2n+2) *{opacity:0;transition:.8s .1s!important}#worksP:checked ~ .works>label:nth-child(2n+1){margin-bottom:100px}#worksP:checked ~ .works>label:nth-child(2n+2){margin-bottom:50px}.works>label:nth-child(2n+1){transition:.6s}.works>label:nth-child(2n+2){transition:.3s}.worksP iframe{position:absolute;width:100%;opacity:0;height:0%;top:0px;left:0px;transition:.7s}.worksP label{width:100%;height:60px;user-select:none;cursor:pointer;opacity:0;position:absolute;bottom:0px;color:#fff;font-size:1em;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,0.05);backdrop-filter:blur(10px);box-shadow:0 -.5px 0 0 rgba(0,0,0,0.2)}.worksT video{width:100%;height:auto;display:block}.worksT::-webkit-scrollbar{background:rgba(0,0,0,0);width:0px}.worksT{color:#fff;font-weight:300;letter-spacing:.5px;text-align:justify}.worksT img{display:block;width:100%;position:absolute;top:0px;left:0px}.worksT img:nth-of-type(1){position:inherit}.worksT h1{font-size:1.1em;padding:30px 0;margin:0 30px;box-shadow:0 -.5px 0 0 rgba(255,255,255,0.15) inset}.worksT ul li:nth-of-type(1){animation:d2 1.2s}.worksT ul li:nth-of-type(2){animation:d2 1.4s}.worksT ul li:nth-of-type(3){animation:d2 1.6s}.worksT ul li:nth-of-type(4){animation:d2 1.8s}.worksT ul li:nth-of-type(5){animation:d2 1.9s}.worksT ul li:nth-of-type(6){animation:d2 2.0s}.worksT ul li:nth-of-type(7){animation:d2 2.1s}.worksT ul li:nth-of-type(8){animation:d2 2.2s}@keyframes d2{0%{opacity:0}70%{opacity:0}}.worksT ul{margin:10px 30px}.worksT ul li{position:relative;padding:20px;font-size:.9em}.worksT ul li u{position:absolute;left:2.25px;width:.5px;background:rgba(255,255,255,0.5);height:100%;top:0px}.worksT ul li:first-of-type u{height:50%;top:50%}.worksT ul li:last-of-type u{height:50%}.worksT ul li i{position:absolute;background:#fff;width:5px;height:5px;left:0px;top:50%;margin-top:-2.5px}.worksT p{margin:0 30px;padding:20px 0;line-height:2.5em;font-size:.9em}.worksT a{position:relative;display:block;margin:30px;padding:20px;background:rgba(255,255,255,0.05);box-shadow:0 0 0 .5px rgba(0,0,0,0.1);user-select:none;cursor:pointer;overflow:hidden;border-radius:2px}.worksT a i{float:right}.worksT span{display:block;margin:60px 30px;font-size:.8em;color:rgba(255,255,255,0.5);text-align:center}.worksT span:last-of-type:before{content:"©2025 ZMY-DESIGN "}.worksT span:last-of-type{margin:60px 30px 120px 30px}.worksT:has(> img:nth-child(n+2)) img:nth-of-type(2){animation:worksTimg2_2 5s infinite}@keyframes worksTimg2_2{0%{opacity:0}35%{opacity:1}50%{opacity:1}75%{opacity:0}100%{opacity:0}}.worksT:has(> img:nth-child(n+3)) img:nth-of-type(2){animation:worksTimg3_2 10s infinite}@keyframes worksTimg3_2{0%{opacity:0}10%{opacity:0}20%{opacity:0}30%{opacity:0}40%{opacity:1}50%{opacity:1}60%{opacity:1}70%{opacity:0}80%{opacity:0}90%{opacity:0}100%{opacity:0}}.worksT:has(> img:nth-child(n+3)) img:nth-of-type(3){animation:worksTimg3_3 10s infinite}@keyframes worksTimg3_3{0%{opacity:0}10%{opacity:0}20%{opacity:0}30%{opacity:0}40%{opacity:0}50%{opacity:0}60%{opacity:0}70%{opacity:1}80%{opacity:1}90%{opacity:1}100%{opacity:0}}.worksT:has(> img:nth-child(n+4)) img:nth-of-type(2){animation:worksTimg4_2 15s infinite}@keyframes worksTimg4_2{0%{opacity:0}10%{opacity:0}20%{opacity:0}30%{opacity:1}40%{opacity:1}50%{opacity:0}60%{opacity:0}70%{opacity:0}80%{opacity:0}90%{opacity:0}100%{opacity:0}}.worksT:has(> img:nth-child(n+4)) img:nth-of-type(2){animation:worksTimg4_2 15s infinite}@keyframes worksTimg4_2{0%{opacity:0}10%{opacity:0}20%{opacity:0}30%{opacity:1}40%{opacity:1}50%{opacity:0}60%{opacity:0}70%{opacity:0}80%{opacity:0}90%{opacity:0}100%{opacity:0}}.worksT:has(> img:nth-child(n+4)) img:nth-of-type(3){animation:worksTimg4_3 15s infinite}@keyframes worksTimg4_3{0%{opacity:0}10%{opacity:0}20%{opacity:0}30%{opacity:0}40%{opacity:0}50%{opacity:1}60%{opacity:1}70%{opacity:0}80%{opacity:0}90%{opacity:0}100%{opacity:0}}.worksT:has(> img:nth-child(n+4)) img:nth-of-type(4){animation:worksTimg4_4 15s infinite}@keyframes worksTimg4_4{0%{opacity:0}10%{opacity:0}20%{opacity:0}30%{opacity:0}40%{opacity:0}50%{opacity:0}60%{opacity:0}70%{opacity:1}80%{opacity:1}90%{opacity:0}100%{opacity:0}}.worksI{background:#000}.worksI img{display:block;width:calc(100% - 50px);margin:25px auto;opacity:0;transition:1s .1s}.worksI span{font-weight:300!important;font-size:.8em;color:#fff;position:sticky;top:0px;display:block;margin-bottom:-55px;margin-left:30px;z-index:1;height:30px;width:60px;text-align:center;line-height:30px;border-radius:0px 0px 6px 6px}.imgScroll{opacity:1!important}.worksI img:nth-of-type(1){opacity:1;animation:d1 0.8s}.worksI img:nth-of-type(2){opacity:1;animation:d1 1.0s}.worksI img:nth-of-type(3){opacity:1;animation:d1 1.3s}.worksI img:nth-of-type(4){opacity:1;animation:d1 1.5s}.worksI .vH{display:block;width:calc(100% - 50px);margin:25px}.worksI .vW{display:block;width:calc(100% - 50px);margin:25px}