@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";*{margin:0;padding:0;box-sizing:border-box;text-decoration:none;border:none;outline:none;scroll-behavior:smooth;font-family:Nunito,sans-serif}:root{--bg-color:#191f36;--snd-bg-color: #262840;--text-color: #fff;--main-color:#5982F4}html{font-size:62.5%;overflow-x:hidden}body{background-color:var(--bg-color)}section{min-height:100vh;padding:10rem 9% 2rem}span{color:var(--main-color)}.main-img{display:block;margin:10px auto;border-radius:10px;box-shadow:0 4px 10px #0003;text-align:center}.heading{text-align:center;font-size:4.5rem}.project{background:var(--snd-bg-color)}.project-box{height:500px;width:350px}.project h2{margin-bottom:4rem;color:var(--text-color)}.project-container{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;gap:2.5rem;color:var(--text-color)}.project-container .project-box{position:relative;border-radius:2rem;box-shadow:0 0 1rem var(--bg-color);overflow:hidden;display:flex}.project-box img{width:100%;transition:.5 ease;opacity:.7}.project-box:hover img{transform:scale(1.1)}.project-box .project-layer{position:absolute;bottom:0;left:0;width:100%;height:100%;background:linear-gradient(rgba(0,0,0,.1),var(--main-color));display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;padding:0 4rem;transform:translateY(100%);transition:.5s ease}.project-box:hover .project-layer{transform:translateY(0)}.project-layer h4{font-size:3rem}.project-layer p{font-size:1.6rem;margin:.3rem 0 1rem}.project-layer a{display:inline-flex;justify-content:center;align-items:center;width:5rem;height:5rem;background:var(--text-color);border-radius:50%}.project-layer a i{font-size:2rem;color:var(--snd-bg-color)}@media (max-width: 768px){.project-container{grid-template-columns:1fr}.project-layer{padding:0 2rem}.project-layer h4{font-size:2.5rem}.project-layer p{font-size:1.4rem}}@media (max-width: 1200px){html{font-size:55%}}@media (max-width: 991px){.header{padding:2rem 3%}.section{padding:10rem 3%}.services{padding:7rem}.project{padding-bottom:7rem}.contact{min-height:auto}.footer{padding:2rem 3%}}@media (max-width: 768px){.project h2{margin-bottom:3rem}}@media (max-width: 450px){html{font-size:50%}}