@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box;text-decoration:none;border:none;outline:none;scroll-behavior:smooth;font-family:Poppins,sans-serif}:root{--second-bg-color: #323946;--text-color: #fff}html{font-size:62.5%;overflow-x:hidden}body{background:#1f242d;color:var(--text-color)}section{min-height:100vh;padding:10rem 10% 2rem}.header{position:fixed;top:0;left:0;width:100%;padding:2rem 10%;display:flex;justify-content:space-between;align-items:center;z-index:100;background:#1f242d}.languages{display:flex;align-items:center;justify-content:center;gap:16px}.languages .tr,.languages .en{display:flex;align-items:center;justify-content:center;gap:6px;font-size:1.2rem;cursor:pointer}.languages img{width:2rem;height:2rem;border-radius:100%;object-fit:cover}.languages .tr img{object-position:20%}.navbar a{font-size:1.7rem;color:var(--text-color);margin-left:4rem;transition:.3s;cursor:pointer}.navbar a.active,.navbar a:hover{color:#40e0d0}.menu-button{display:none}#menu-icon{font-size:3.6rem;color:var(--text-color)}.home{display:flex;justify-content:center;align-items:center}.home-content h3,.home-content .home-title{font-size:3.2rem;font-weight:700}span{color:#40e0d0}.home-content h3{margin-bottom:2rem}.home-content h1{font-size:5.6rem;font-weight:700;line-height:1.3}.home-content p{font-size:1.6rem}.social-media a{display:inline-flex;justify-content:center;align-items:center;width:4rem;height:4rem;background:transparent;border:.2rem solid turquoise;border-radius:50%;font-size:2rem;color:#40e0d0;margin:3rem 1.5rem 3rem 0;transition:.5s ease}.social-media .social-icon{fill:#40e0d0;transition:fill .5s ease}.social-media a:hover .social-icon{fill:#323946}.social-media a:hover{background-color:#40e0d0;color:var(--second-bg-color);box-shadow:0 0 1rem #40e0d0}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.btn{display:inline-block;padding:1rem 2.8rem;background:#40e0d0;border-radius:4rem;box-shadow:0 0 1rem #40e0d0;font-size:1.6rem;color:var(--second-bg-color);letter-spacing:.1rem;font-weight:600;transition:.5s ease}.btn:hover{box-shadow:none}.about{display:flex;justify-content:center;align-items:center;gap:2rem}.about-img img{width:35vw;border-radius:2rem}.heading{text-align:center;font-size:4.5rem}.about-content h2{text-align:left;line-height:1.2}.about-content h3{font-size:2.6rem}.about-content p{font-size:1.6rem;margin:2rem 0 3rem}.services h2{margin-bottom:5rem}.services-container{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:2rem}.services-container .services-box{flex:1 1 30rem;background:var(--second-bg-color);padding:3rem 2rem 4rem;border-radius:2rem;text-align:center;border:.2rem solid turquoise;height:375px}.services-container .services-box:hover{border-color:#40e0d0;transform:scale(1.02);transition:.5s ease}.services-box .services-icon{font-size:7rem;fill:#40e0d0}.services-box h3{font-size:2.6rem}.services-box p{font-size:1.6rem;margin:1rem 0 3rem}.portfolio h2{margin-bottom:4rem}.portfolio-container{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;gap:2.5rem}.portfolio-container .portfolio-box{position:relative;border-radius:2rem;box-shadow:0 0 1rem #1f242d;overflow:hidden;display:flex}.portfolio-box img{width:100%;transition:.5s ease}.portfolio-box:hover img{transform:scale(1.1)}.portfolio-box .portfolio-layer{position:absolute;bottom:0;left:0;width:100%;height:100%;background:linear-gradient(#0000001a,#40e0d0);display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;padding:0 2rem;transform:translateY(100%);transition:.5s ease}.portfolio-box:hover .portfolio-layer{transform:translateY(0)}.portfolio-layer h4{font-size:3rem;line-height:3.2rem;text-shadow:0 0 5px black}.portfolio-layer p{font-size:1.6rem;line-height:2rem;margin:.3rem 0 1rem;text-shadow:0 0 5px black}.portfolio-layer a{display:inline-flex;justify-content:center;align-items:center;width:5rem;height:5rem;background:var(--text-color);border-radius:50%}.portfolio .project-btn{margin-top:20px;text-align:center}.contact h2{margin-bottom:3rem}.contact form{max-width:70rem;margin:1rem auto 3rem;text-align:center}.contact form .input-box{display:flex;justify-content:space-between;flex-wrap:wrap}.contact form .input-box input,.contact form textarea{width:100%;padding:1.5rem;font-size:1.6rem;color:var(--text-color);background:var(--second-bg-color);border-radius:.8rem;margin:.7rem 0}.contact form .input-box input{width:49%}.contact form textarea{resize:none}.contact form .btn{margin-top:2rem;cursor:pointer}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:2rem 9%;background:var(--second-bg-color)}.footer-text p{font-size:1.6rem}.footer-iconTop button{display:inline-flex;justify-content:center;align-items:center;padding:.8rem;background:#40e0d0;border-radius:.8rem;transition:.5s ease;cursor:pointer}.footer-iconTop button:hover{box-shadow:0 0 1rem #40e0d0}button.btn[disabled]{opacity:.7;cursor:not-allowed}@media (max-width: 1200px){html{font-size:55%}}@media (max-width: 991px){.header{padding:2rem 5%}section{padding:10rem 5% 2rem}.services{padding-bottom:7rem}.services-container .services-box{height:340px}.portfolio{padding-bottom:7rem}.contact{min-height:auto}.footer{padding:2rem 3%}}@media (max-width: 768px){.menu-button{display:block}.navbar{position:absolute;top:100%;left:0;width:100%;padding:1rem 3%;background:#1f242d;border-top:.1rem solid rgba(0,0,0,.2);box-shadow:0 .5 1rem #0003;display:none}.navbar.active{display:block}.navbar a{display:block;font-size:2rem;margin:3rem 0}.home{flex-direction:column}.home-content h3,.home-content .home-title{font-size:2.6rem}.home-content h1{font-size:5rem}.home-img img{width:70vw;margin-top:4rem}.about{flex-direction:column-reverse}.about img{width:70vw;margin-top:4rem}.services h2{margin-bottom:3rem}.services-container .services-box{height:320px}.portfolio h2{margin-bottom:3rem}.portfolio-container{grid-template-columns:repeat(2,1fr)}}@media (max-width: 617px){.portfolio-container{grid-template-columns:1fr}}@media (max-width: 576px){html{font-size:50%}.contact form .input-box input{width:100%}}@media (max-width: 450px){.home-img img{width:90vw}.services-container .services-box{height:auto}.about-img img{width:90vw}.footer{flex-direction:column-reverse}.footer p{text-align:center;margin-top:2rem}}
