body{margin:0;font-family:Arial,sans-serif;background:linear-gradient(to right,#fda,#520dc2);color:#333;text-align:center;-webkit-user-select:none;user-select:none}.content-container{min-height:900px}body::-webkit-scrollbar{display:none}.logo{pointer-events:none;height:150px}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:#ffffffbf;box-shadow:0 4px 6px #0000001a}.footer{background-color:#3c3c3c;color:#fff;text-align:center;padding:2rem 1rem;height:200px}.contact-logo-container{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:1rem}.contact-logo-wrapper{position:relative;cursor:pointer;border:none;background:none;padding:0}.contact-logo{width:40px;height:40px;transition:transform .2s ease,filter .2s ease}.contact-logo:hover{transform:scale(1.1);filter:brightness(1.3)}.tooltip{position:absolute;bottom:120%;left:50%;transform:translate(-50%);background-color:#333;color:#fff;padding:4px 8px;font-size:12px;white-space:nowrap;border-radius:4px;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:10}.contact-logo-wrapper:hover .tooltip{opacity:1}.copy-message{margin-top:1rem;color:#3cf67a;font-size:.9rem;animation:fadeOut 2s forwards}@keyframes fadeOut{0%{opacity:1}90%{opacity:1}to{opacity:0}}.nav-links{list-style:none;padding:0;display:flex;gap:1rem;font-size:24px}.nav-links a{text-decoration:none;color:#333;font-weight:700}.nav-links a:hover{color:#520dc2}.memory,.tictactoe{padding:2rem;background-color:#fffc;border-radius:10px;margin:2rem auto;max-width:600px}@media screen and (max-width: 600px){.header{flex-direction:column;padding:1rem;text-align:center}.contact-logo{width:35px;height:35px}.nav-links{flex-direction:column;gap:1rem;font-size:20px}.memory,.tictactoe{max-width:90%;margin:1rem auto}.logo{height:120px}.tooltip{bottom:110%;font-size:10px}}.Memory{max-width:860px;margin:40px auto}memory-btn{background:none;border:2px solid #fff;padding:6px 12px;border-radius:4px;color:#fff;font-weight:700;cursor:pointer;font-size:1em}memory-btn:hover{background-color:#c23866;color:#fff}.card-grid{margin-top:40px;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:20px}.card{position:relative}.card img{width:100%;display:block;border:2px solid #fff;border-radius:6px}.card .front{transform:rotateY(90deg);transition:all ease-in .2s;position:absolute}.flipped .front{transform:rotateY(0);transition-delay:.2s}.card .back{transition:all ease-in .2s;transition-delay:.2s}.flipped .back{transform:rotateY(90deg);transition-delay:0s}.game-container{text-align:center}h1{font-size:2.5em;margin-bottom:20px;color:#333}.board{display:flex;flex-direction:column;align-items:center}.board-row{display:flex}.square{width:100px;height:100px;background-color:#e0e0e0;border:2px solid #333;margin:5px;font-size:2em;font-weight:700;color:#333;border-radius:10px;transition:all .3s ease}.square:hover{background-color:#d3d3d3;cursor:pointer}.square:focus{outline:none}.status{margin-top:20px;font-size:1.5em;font-weight:700;color:#555}.restart-button{margin-top:20px;padding:10px 20px;font-size:1.2em;background-color:#4caf50;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.restart-button:hover{background-color:#45a049}@media (max-width: 600px){.square{width:80px;height:80px;font-size:1.5em}h1{font-size:2em}.status{font-size:1.2em}.restart-button{font-size:1em}}.wrapper{display:grid;grid-template-rows:repeat(2,100px);grid-auto-flow:column;grid-auto-columns:100px;justify-items:center;justify-content:center;align-items:center;gap:30px;padding-top:30px;padding-bottom:70px}.git,.html,.react,.javascript,.typescript,.figma,.ux,.css,.node,.aurelia,.devops{display:flex;justify-content:center;align-items:center;flex-direction:column;border-radius:10px;width:100px;height:100px;text-align:center}.git-img,.html-img,.react-img,.javascript-img,.typescript-img,.figma-img,.ux-img,.css-img,.node-img,.aurelia-img,.devops-img{width:70px;height:70px;pointer-events:none}.git-text,.html-text,.react-text,.javascript-text,.typescript-text,.figma-text,.ux-text,.css-text,.node-text,.aurelia-text,.devops-text{margin-top:10px;font-size:20px;color:#000}.myName{font-size:50px;font-family:Limelight,sans-serif;color:#fff;text-shadow:2px 2px 4px #520dc2}.utb-erf{font-family:Limelight,sans-serif}.start{margin-bottom:200px}.skills-title{margin-top:250px;font-size:25px;font-family:Limelight,sans-serif;color:#fff;text-shadow:2px 2px 4px #520dc2}.fastInfo{height:auto;width:100vw;margin:0 auto;background-color:#ffffff4a;padding:40px;font-family:Winky Rough,sans-serif;font-size:25px}#fastInfo{font-size:18px;margin:0 auto;width:50%}@media screen and (max-width: 600px){.wrapper{grid-template-rows:repeat(4,auto);gap:15px;padding-top:20px;padding-bottom:40px}.git,.html,.react,.javascript,.typescript,.figma,.ux,.css,.node,.aurelia,.devops{width:80px;height:80px}.git-img,.html-img,.react-img,.javascript-img,.typescript-img,.figma-img,.ux-img,.css-img,.node-img,.aurelia-img,.devops-img{width:50px;height:50px}.git-text,.html-text,.react-text,.javascript-text,.typescript-text,.figma-text,.ux-text,.css-text,.node-text,.aurelia-text,.devops-text{font-size:14px}.myName{font-size:30px}.skills-title{font-size:20px;margin-top:20px}.fastInfo{padding:20px;font-size:18px}#fastInfo{font-size:16px;width:90%}}*{box-sizing:border-box}body{background-color:#474e5d;font-family:Helvetica,sans-serif;justify-content:center}#utb-erf{font-family:Limelight,sans-serif}.timeline{position:relative;max-width:1200px;margin:0 auto}.timeline:after{content:"";position:absolute;width:6px;background-color:green;border:black 4px solid;top:0;bottom:0;left:50%;transform:translate(-50%);z-index:-1}.container{padding:10px 40px;position:relative;background-color:inherit;width:50%;opacity:0;transform:translateY(100px);transition:opacity 1s ease,transform 1s ease}.container.show{opacity:1;transform:translateY(0)}.left{left:0}.right{left:50%}.left:before{content:" ";height:0;position:absolute;top:22px;width:0;z-index:1;right:30px;border:medium solid #ffffffbf;border-width:10px 0 10px 10px;border-color:transparent transparent transparent #ffffffbf}.right:before{content:" ";height:0;position:absolute;top:22px;width:0;z-index:1;left:30px;border:medium solid #ffffffbf;border-width:10px 10px 10px 0;border-color:transparent #ffffffbf transparent transparent}.right:after{left:-13px}.content{padding:20px 30px;background-color:#ffffffbf;position:relative;border-radius:6px}.sunflower,.plant-pot{height:250px}.sunflower{position:absolute;top:-180px;left:50%;transform:translate(-50%);animation:sway 5s infinite ease-in-out;z-index:2}.plant-pot{height:200px;position:absolute;bottom:-160px;left:50%;transform:translate(-50%);z-index:-1}.timeline-header{display:flex;justify-content:space-around;font-size:50px;font-family:Winky Rough,sans-serif;color:#fff;text-shadow:2px 2px 4px #520dc2}@keyframes sway{0%,to{transform:translate(-50%) rotate(-3deg)}50%{transform:translate(-50%) rotate(3deg)}}#utb-erf{font-family:Limelight,sans-serif;text-shadow:2px 2px 4px #520dc2}#utb-erf-mobil{display:none}@media screen and (max-width: 600px){#utb-erf-mobil{margin-top:100px;margin-bottom:10px;display:flex;font-family:Limelight,sans-serif;text-shadow:2px 2px 4px #520dc2;font-size:30px}#utb-erf{display:none}.timeline:after{left:31px}.container{width:100%}.container:before{left:60px;border:medium solid #ffffffbf;border-width:10px 10px 10px 0;border-color:transparent #ffffffbf transparent transparent}.right{left:0%}.sunflower{display:flex;justify-content:center;margin:0 auto}.timeline:after,.right:before,.left:before,.plant-pot{display:none}body{width:100vw;margin:0}.content{width:90%;margin:0 auto;padding:30px 10px;justify-content:center}}
