html{scroll-behavior:smooth}*{margin:0;padding:0;text-decoration:none;list-style:none}body{font-family:'Roboto',sans-serif;background-color:#000;background-image:linear-gradient(147deg,#000 0%,#04619f 74%)}.header{background-color:rgba(102,102,102,.9)}.container{width:100%;max-width:1160px;margin:0 auto}nav{width:100%;height:80px;background:rgba(102,102,102,.9);position:fixed;z-index:555555555}nav img{width:150px;position:absolute;top:17px;left:5%}nav ul{float:right;margin-right:25px}nav ul li{display:inline-block;line-height:80px;margin:0 15px}nav ul li a{position:relative;color:#fff;font-size:18px;transition:.4s}nav ul li a:hover{transform:scale(1.2);font-size:24px}nav ul li a:before{position:absolute;content:'';left:0;bottom:0;height:3px;width:100%;background:#fff;transform:scaleX(0);transform-origin:right;background-color:#add8e6;transition:transform .4s linear}nav ul li a:hover:before{background-color:#add8e6;transform:scaleX(1);transform-origin:left}label #burger,label #no{color:#fff;font-size:30px;float:right;line-height:80px;margin-right:40px;cursor:pointer;display:none}#check{display:none}.act{font-size:18px;padding:5px 10px 5px 10px;margin:5px;background-color:rgba(0,0,0,0);border:none;color:#fff}.act:active{color:#ffa500}.carousel{padding-top:80px;width:100%;height:100vh;position:relative}.carousel ul{margin:0;padding:0;list-style:none}.slide{position:absolute;inset:0;opacity:0;transition:.2s opacity ease-in-out;transition-delay:.2s}.slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.slide[data-active]{opacity:1;z-index:221;transition-delay:0s}.carousel__button{position:absolute;z-index:222;background:none;border:none;font-size:2rem;top:50%;transform:translateY(-50%);color:rgba(0,0,0,.5);cursor:pointer;border-radius:.25rem;padding:0 .5rem;background-color:rgba(0,0,0,.2);opacity:0;transition:.3s;height:100%}.carousel__button:hover{color:#fff;background-color:rgba(0,0,0,.3);opacity:1}.carousel__button:focus{color:#fff;background-color:rgba(0,0,0,.3);opacity:1}.carousel__button.prev{left:1rem}.carousel__button.next{right:1rem}.about{display:flex;margin-top:20px;margin-bottom:20px}.about-text{padding:5px 5px 5px 5px;color:#fff;width:50%}.about-image{width:50%}.about-image img{width:100%;height:100%;border-radius:25px}.service{display:flex;flex-wrap:wrap;justify-content:center}.service__card{width:24%;min-width:240px;margin:5px;display:inline-block;background-color:#44d8e4;border:green;box-shadow:0 0 10px 0 rgba(0,0,0,1);border-radius:10px;opacity:0}.service__card.element-show{transition:.4s , opacity 1s;opacity:1}.service__title{font-size:23px;text-align:center;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;height:40px;padding-bottom:20px}.underlineBlock{height:0;width:50px;border-top:2px solid #ff0;transition:.4s}.service__img{text-align:center}.service__img img{width:100%;height:100%;max-width:200px;max-height:200px}.service__content{font-size:15px;padding:5px 5px 5px 5px}.service__card:hover{background-color:#00f;color:#fff;transform:scale(1.2)}.checkao{top:80px}.not-checkao{top:80px}.modal{position:fixed;left:0;top:0;width:100%;height:100%;z-index:2222222222222222222222222222;background-color:rgba(0,0,0,.7);display:grid;align-items:center;justify-content:center;overflow-y:auto;visibility:hidden;opacity:0;transition:opacity .4s , visibility .4s}.modal.active{visibility:visible;opacity:1}.modal-one-box{z-index:22222222222222222222222222222;margin:50px;max-width:500px;padding:45px;background-color:#fff;box-shadow:0 0 17px -7px rgba(34,60,80,.9);transform:scale(0);transition:transform .7s}.modal.active .modal-one-box{transform:scale(1)}.checkao{top:80px}.not-checkao{top:80px}.project-flex{margin-bottom:50px;color:#fff}.project-left{box-shadow:0 0 10px 0 rgba(0,0,0,1);display:block;width:45%;height:200px;margin-top: calc(-10% + 30px);margin-left:30px;position:relative}.project-right{box-shadow:0 0 10px 0 rgba(0,0,0,1);display:block;width:45%;height:200px;margin-left: calc(45% + 50px);margin-top: calc(-10% + 20px);position:relative}.project-left.ani-left{animation-name:move-left;animation-duration:1s;animation-fill-mode:forwards}.project-right.ani-right{animation-name:move-right;animation-duration:1s;animation-fill-mode:forwards}@keyframes move-left {
from{
transform: translateX(-500px);
}
to{
transform: translateX(0px);
}
}@keyframes move-right {
from{
transform: translateX(500px);
}
to{
transform: translateX(0px);
}
}.project-left img,.project-right img{width:100%;height:100%;border-radius:5px;transition:.4s}.project-left h1,.project-right h1{margin-top:-200px;padding-left:10px;position:relative;z-index:333;padding-top:10px;padding-bottom:10px}.project-left img:hover,.project-right img:hover{filter:blur(8px);transform:scale(1.2);z-index:335}.contact{display:flex}.contact__info{width:50%}.contact__map{text-align:center}.contact__address{text-align:center;width:100%;display:flex;justify-content:space-between;text-align:center}.detail{margin-bottom:15px}.contact__form{padding-top:10px;margin-left:5px;text-align:center;width:50%}.input__box input,.input__box textarea{background-color:#eef2f7;min-height:40px;width:100%;max-width:300px;border:none;border-radius:10px}.input__box textarea{resize:none;min-height:60px}.input__button{color:#fff;background-color:#25abd7;transition:.2s;padding:10px;border:none;border-radius:10px}.input__button:hover{background-color:#00f;transform:scale(1.2)}.footer{display:flex;justify-content:center;background-color:rgba(102,102,102,.9)}.ani-icon{font-size:24px;color:#add8e6;transition:.4s;margin-left:12px;padding:20px 0 20px 0}.ani-icon:hover{color:#00f;transform:translateY(-10px);font-size:30px}@media screen and (max-width:1015px){.container{width:100%;max-width:960px;margin:0 auto}.service__card{width:32%;display:inline-block;background-color:#44d8e4;border:green;opacity:0}.service__title{font-size:23px;text-align:center}.underlineBlock{height:0;width:50px;border-top:2px solid oranyellowge;transition:.4s}.service__content{font-size:15px}.contact{display:flex}}@media screen and (max-width:768px){.container{width:100%;max-width:720px;margin:0 auto}.header{position:fixed}nav ul{position:absolute;top:100%;z-index:222222222222222222;background-color:rgba(102,102,102,.9);width:100%;transition:transform 200ms;transform-origin:top;transform:scale(1,0)}nav ul li{line-height:20px;padding-top:5px;display:block;opacity:0;transition:opacity 1ms}label #burger{display:block}#check:checked ~ label #burger{display:none}#check:checked ~ label #no{display:block}#check:checked ~ div #lang{top:120px}#check:checked ~ ul {transform:scale(1,1);transition:transform 300ms}#check:checked ~ ul li {opacity:1;transition:opacity 200ms 200ms}.about{display:block;margin-top:20px;margin-bottom:20px}.about-text{text-align:center;color:#fff;width:100%}.about-image{width:100%}.about-image img{width:100%;height:100%;border-radius:25px}.checkao{top:210px;transition:300ms}.not-checkao{opacity:0;top:80px;transition:200ms}.service__card{width:48%;display:inline-block;background-color:#44d8e4;border:green;opacity:0}.service__title{font-size:23px;text-align:center}.underlineBlock{height:0;width:50px;border-top:2px solid #ffa500;transition:.4s}.service__content{font-size:15px}.project-left{box-shadow:0 0 10px 0 rgba(0,0,0,1);display:block;width:100%;height:300px;margin:0;margin-top:30px}.project-right{box-shadow:0 0 10px 0 rgba(0,0,0,1);display:block;width:100%;height:300px;margin:0;margin-top:30px}.contact{display:block}.contact__info{width:100%}.contact__form{width:100%}}@media screen and (max-width:576px){.container{width:100%;max-width:540px;margin:0 auto}.header{position:fixed}nav ul{position:absolute;top:100%;z-index:222222222222222222;transition:transform 200ms;transform-origin:top;transform:scale(1,0)}nav ul li{display:block;opacity:0;padding-top:5px;transition:opacity 1ms;line-height:20px;width:100%}label #burger{display:block}#check:checked ~ ul {transform:scale(1,1);transition:transform 300ms}#check:checked ~ ul li {opacity:1;transition:opacity 200ms 200ms}#check:checked ~ label #burger{display:none}#check:checked ~ label #no{display:block}.about{display:block;margin-top:20px;margin-bottom:20px}.about-text{text-align:center;color:#fff;width:100%}.about-image{width:100%}.about-image img{width:100%;height:100%;border-radius:25px}.about-l{animation-duration:3s;animation-name:slidein-l}.checkao{top:210px;transition:300ms}.not-checkao{opacity:0;top:80px;transition:200ms}@keyframes slidein-l {
from {
margin-right: 100%;
width: 300%;
}
to {
margin-right: 0%;
width: 100%;
}
}.about-r{animation-duration:3s;animation-name:slidein-r}@keyframes slidein-r {
from {
margin-left: 100%;
width: 300%;
}
to {
margin-left: 0%;
width: 100%;
}
}.service__card{width:99%;display:inline-block;background-color:#44d8e4;border:green;opacity:0}.service__title{font-size:23px;text-align:center}.underlineBlock{height:0;width:50px;border-top:2px solid #ffa500;transition:.4s}.service__content{font-size:15px}.project-left{box-shadow:0 0 10px 0 rgba(0,0,0,1);display:block;width:100%;height:300px;margin:0;margin-top:30px}.project-right{box-shadow:0 0 10px 0 rgba(0,0,0,1);display:block;width:100%;height:300px;margin:0;margin-top:30px}.contact{display:block}.contact__info{width:100%}.contact__form{width:100%}}