@import"https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";html,body,#root{height:100%;margin:0;padding:0}:root{--blue: #24242e;--black: #171718;--white: #fff;--page-bg: var(--white);--text-color: var(--black)}.dark{--page-bg: var(--blue);--text-color: var(--white)}body{font-family:DM Sans,serif;font-size:16px;background-color:var(--page-bg)}.App{min-height:100%;display:flex;flex-direction:column}.container{max-width:1200px;padding:0 30px;margin:0 auto}.main{flex:1}*{padding:0;margin:0;border:none}*,*:before,*:after{box-sizing:border-box}a,a:link,a:visited,a:hover{text-decoration:none}aside,nav,footer,header,section,main{display:block}h1,h2,h3,h4,h5,h6,p{font-size:inherit;font-weight:inherit}ul,ul li{list-style:none}img{vertical-align:top}img,svg{max-width:100%;height:auto}address{font-style:normal}input,textarea,button,select{font-family:inherit;font-size:inherit;color:inherit;background-color:transparent}input::-ms-clear{display:none}button,input[type=submit]{display:inline-block;box-shadow:none;background-color:transparent;background:none;cursor:pointer}input:focus,input:active,button:focus,button:active{outline:none}button::-moz-focus-inner{padding:0;border:0}label{cursor:pointer}legend{display:block}.header{padding:20px 0;background-color:#171718;position:fixed;width:100%;z-index:100}.header__content{display:flex;justify-content:space-between;align-items:center;gap:20px;transition:opacity .2s ease-in-out}.header__content.fade{opacity:1}.header__title{font-family:Poppins,serif;font-weight:700;font-size:24px;line-height:100%;color:var(--white)}.header__title span{font-weight:400}.header__nav{display:flex;justify-content:space-between;gap:40px}.header__nav-link{font-family:Poppins,serif;font-weight:500;font-size:16px;color:#fff;border-bottom:3px solid transparent}.header__nav-link--active{border-bottom:3px solid #5c62ec}.header__nav-link:hover{border-bottom:3px solid #5c62ec;opacity:.6}.header .dark-mode-btn{display:flex;justify-content:center;width:51px;height:26px;border-radius:50px;background-color:#fff;padding:5px;z-index:1;text-align:center}@media (max-width: 700px){.header__content{column-gap:5px}.header__title{font-size:20px}.header__nav{gap:15px}.header__nav-link{font-size:13px}}@media (max-width: 450px){.header__content{column-gap:5px}.header__title{font-size:15px}.header__nav{gap:5px}.header__nav-link{font-size:10px}}.name{background-color:#171718;background-image:url(./../img/Abstract.svg);background-repeat:no-repeat;background-position:center center;background-size:cover;padding:200px 0}.name__title{font-weight:700;font-size:60px;line-height:140%;letter-spacing:-.01em;text-align:center;color:#fff}.name__title span{font-size:40px}.name__title i{color:#5c62ec;font-style:normal}.name__paragrap{font-weight:500;font-size:18px;line-height:133%;letter-spacing:-.03em;text-align:center;color:#fff}@media (max-width: 600px){.name__title{font-size:40px}.name__title span{font-size:20px}}.project{padding:75px 0}.project__title{margin-bottom:60px;font-weight:700;font-size:60px;line-height:130%;letter-spacing:-.01em;text-align:center;color:#5c62ec}.project__title a{color:#5c62ec}.project__card-wraper{display:flex;justify-content:center}.project__content{display:grid;grid-template-columns:1fr 1fr 1fr;justify-content:center;gap:30px}.project__card{border-radius:10px;box-shadow:0 5px 35px #00000040;background:var(--page-bg);transition:transform .3s;position:relative;display:grid;grid-template-rows:1fr .2fr .3fr}.project__card:hover{transform:translateY(-10px);box-shadow:0 5px 35px #5c62ec}.project__card-img{border-radius:10px;object-fit:cover;width:370px;height:278px}.project__card-title{padding:15px 0;font-weight:700;font-size:24px;line-height:130%;letter-spacing:-.02em;color:var(--text-color);text-align:center}.project__text{padding:0 5px;font-weight:500;font-size:18px;text-align:center;color:var(--text-color)}@media (max-width: 1000px){.project__content{display:grid;grid-template-columns:1fr 1fr;justify-content:center;gap:30px}}@media (max-width: 600px){.project__content{grid-template-columns:1fr;column-gap:15px}.project__card{display:inline-block}.project__card-img{width:100%;height:100%}}.desc{padding:75px 0 0}.desc__title{font-weight:700;font-size:60px;line-height:140%;letter-spacing:-.01em;text-align:center;color:#5c62ec}.desc__about{font-weight:500;font-size:30px;line-height:133%;letter-spacing:-.03em;text-align:center}.desc__about span{color:#5c62ec;text-decoration:underline}@media (max-width: 600px){.desc__title{font-size:40px}.desc__about{font-size:20px}}.footer{padding:55px 0;background-color:#171718;margin-top:auto}.footer__social{display:flex;justify-content:center;align-items:center;gap:30px;margin-bottom:27px}.footer__copirater{font-weight:400;font-size:16px;line-height:150%;letter-spacing:-.03em;text-align:center;color:#fff}.skils{padding:80px 0}.skils__title{margin-bottom:40px;font-weight:700;font-size:60px;line-height:130%;letter-spacing:-.01em;text-align:center;color:#5c62ec}.skils__title2{margin-bottom:20px;font-weight:700;font-size:40px;line-height:130%;letter-spacing:-.01em;text-align:center;color:var(--text-color)}.skils__paragrap2{font-weight:400;font-size:18px;line-height:150%;letter-spacing:-.03em;text-align:center;color:var(--text-color);margin-bottom:40px}.project__content-info{display:flex;flex-direction:column;align-items:center}.project__paragraf-info{margin:40px 0 30px;font-weight:700;font-size:24px;line-height:130%;letter-spacing:-.02em;text-align:center;color:var(--text-color)}.project__btn-info{border:1px solid var(--text-color);border-radius:5px;padding:12px 20px;display:flex;gap:10px;font-weight:500;font-size:16px;line-height:150%;letter-spacing:.01em;text-align:center;color:var(--text-color);transition:opacity .3s ease-in}.project__btn-info:hover{opacity:.5}.project__img-info{border-radius:10px;box-shadow:0 5px 35px #00000040;transition:transform .3s}.project__img-info:hover{transform:translateY(-10px);box-shadow:0 5px 35px #5c62ec}
