html {
   scroll-behavior: smooth;
}





.header {}

.header__top {
   min-height: 104px;
}

.container {
   max-width: 1190px;
   padding: 0 10px;
   margin: 0 auto;
}

.header__top-iner {
   display: flex;
   justify-content: space-between;
}

.header__top--burger {
   display: none;
   position: relative;
   z-index: 2;
}

.logo {
   position: relative;
   z-index: 2;
}

.menu {
   margin-top: 40px;
}

.menu__list {
   display: flex;
}

.menu__list-link {
   padding: 0px 9px 29px 9px;
   font-family: 'Raleway';
   font-style: normal;
   font-weight: 700;
   font-size: 12px;
   color: #373A39;
}

.menu__list-item:hover {
   padding-bottom: 9px;
   border-bottom: 2px solid rgba(252, 187, 8, 1);
}

.menu__list>li+li {
   margin-left: 44px;
}

.header__content {
   background: url(../img/Header-bg.png) no-repeat;
   background-position: center center;

   background-size: cover;
}

.header__content--inner {
   height: calc(100vh - 104px);
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
}

.header__title {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 500;
   font-size: 72px;
   line-height: 88px;
   color: #FFFFFF;
   padding-top: 150px;
   margin-top: auto;
   margin-bottom: 18px;
}

.header__text {
   margin-bottom: auto;
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 16px;
   line-height: 20px;
   letter-spacing: 2.74286px;
   color: #FCBB08;
}

.header__mouse {
   margin-bottom: 40px;
}





.about {
   background-color: #F6F8FA;
   padding: 152px 0px 143px 0px;
}

.about__inner {
   display: flex;
   justify-content: space-between;
}

.title {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 60px;
   line-height: 75px;
   letter-spacing: -1.65px;
   padding-bottom: 14px;
   color: #242121;
   position: relative;
   height: 100%;
}

.title::after {
   content: "";
   position: absolute;
   width: 60px;
   height: 4px;
   bottom: 0;
   left: 0;
   background-color: #FCBB08;
}

.about__title {}

.abuot__text p {
   font-family: 'Montserrat';
   max-width: 770px;
   padding-bottom: 20px;
   font-size: 14px;
   line-height: 24px;
   color: #373A39;
}





.expertise {
   padding: 140px 0 160px;
}

.expertise__title {
   margin-bottom: 90px;
}

.expertise__inner {
   display: flex;
   margin-bottom: 110px;
   flex: none;
}

.expertise__info {
   min-width: 370px;
   margin-right: 30px;
}

.expertise__text p {
   margin-bottom: 25px;
}

.expertise__info-item {
   border-top: 2px solid #1d1d1d;
   padding: 2px 0px 28px 0px;
   text-transform: uppercase;
   font-weight: 400;
   font-size: 11px;
   line-height: 20px;
   letter-spacing: 1px;
   color: #1d1d1d;
   position: relative;
}

.expertise__info-item span {
   display: block;
   position: absolute;
   right: 7px;
   top: 0;
}

.expertise__info-item span::before {
   content: "";
   position: absolute;
   height: 2px;
   background-color: #f0f0f0;
   right: -7px;
   top: -2px;
   width: 100%;
}

.expertise__items {
   display: flex;
   justify-content: space-between;
   gap: 30px;
}

.expertise__item::before {
   position: absolute;
   left: 0;
   top: 0;
   width: 50px;
   height: 50px;
}

.expertise__item {
   max-width: 370px;
   padding-left: 80px;
   padding-top: 7px;
   position: relative;
}

.expertise__item--yy {
   background-image: url(../img/copy.svg);
   background-repeat: no-repeat;
}

.expertise__item--monit {
   background-image: url(../img/monitor.svg);
   background-repeat: no-repeat;
}

.expertise__item--xxx {
   background-image: url(../img/vector.svg);
   background-repeat: no-repeat;
}

.expertise__item-title {
   margin-bottom: 14px;
   font-family: 'Raleway';
   font-style: normal;
   font-weight: 700;
   font-size: 14px;
   line-height: 20px;
   color: #333333;

}

.expertise__item-text {
   font-family: 'Raleway';
   font-style: normal;
   font-weight: 400;
   font-size: 14px;
   line-height: 24px;
   color: #777777;
}






.magic {
   background: url(../img/img.png) no-repeat;

   background-size: 50%;
   background-color: #F6F8FA;
   min-height: 100%;

}

.magic__inner {
   max-width: 470px;
   margin-left: auto;
   margin-top: 101px;
   margin-bottom: 180px;
   padding-top: 60px;
   padding-bottom: 60px;

}

.magic__title {
   margin-bottom: 85px;
}

.magic__text p {
   margin-bottom: 25px;
}





.potfolio {
   padding: 140px 0px 165px 0px;
}

.container {}

.potfolio__top {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 120px;
}

.title {}

.potfolio__filter-btm {
   margin-right: 45px;
}

.potfolio__btn {
   margin-right: 25px;
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 600;
   font-size: 12px;
   line-height: 24px;
   letter-spacing: 2px;
   color: #333333;
   border: none;
   background: none;
   cursor: pointer;
   padding: 0px 5px 9px 5px;
}

.mixitup-control-active {
   border-bottom: 1px solid #FCBB08;
}

.potfolio__btn:active {}

.potfolio__content {
   column-count: 4;
   column-gap: 22px;
   margin-bottom: 50px;
}

.potfolio__item img {
   width: 100%;
}

.potfolio__item {

   margin-bottom: 22px;
   position: relative;
}

.potfolio__item p {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: rgba(61, 58, 58, 1);
   border: 12px solid rgba(113, 111, 111, 1);
   opacity: 0;
}

.potfolio__item p:hover {
   opacity: 1;
}



.more {
   height: 100px;
   background-color: #F6F8FA;
   display: flex;
}

.more__content {
   margin: auto;
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 14px;
   line-height: 17px;
   letter-spacing: 1.2px;
   color: #242121;
}


.sitat {
   padding: 130px 10px 140px 10px;
}

.sitat p {
   margin: 0 auto;
   max-width: 650px;
   margin-bottom: 50px;
   text-align: center;
   font-family: 'Merriweather';
   font-style: italic;
   font-weight: 300;
   font-size: 18px;
   line-height: 36px;
   color: #242121;
}

.sitat h5 {
   margin: 0 auto;
   max-width: 650px;
   text-align: center;
   font-family: 'Merriweather';
   font-style: italic;
   font-weight: 300;
   font-size: 14px;
   line-height: 32px;
   color: #9E9E9E;
}

.video__items {
   background: url(../img/bg.png) no-repeat center center;
   background-size: cover;
   height: 320px;
   display: flex;
   justify-content: center;
   align-items: center;
   margin-bottom: 165px;
}

.experience {
   display: flex;
   justify-content: space-around;
}

.done__namber {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 60px;
   line-height: 73px;
   align-items: flex-end;
   color: #242121;
   margin-bottom: 9px;
}

.done__text {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 14px;
   line-height: 19px;
   text-align: center;
   color: #333333;
}








.slider {
   background-color: #F8F6FA;
}

.slider__inner {
   min-height: 840px;
   position: relative;
}

.slick-prev {
   position: absolute;
   top: 50%;
   left: -70px;
   transform: translateY(-120%);
   border: none;
   background-color: transparent;
   cursor: pointer;
}

.slick-next {
   position: absolute;
   top: 50%;
   right: 0px;
   transform: translateY(-120%);
   border: none;
   background-color: transparent;
   cursor: pointer;
}

.slider__items-link-title {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 30px;
   line-height: 52px;
   color: #242121;
   margin-top: 360px;
   max-width: 570px;
   margin-bottom: 10px;
}

.slider__items-link-text {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 300;
   font-size: 14px;
   line-height: 24px;
   color: #373A39;
   max-width: 570px;
}

.slick-dots button {
   font-size: 0;
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: #D5D3D6;
   padding: 0;
   border: none;
   cursor: pointer;
   position: absolute;
   bottom: 100px;
}

.slick-dots {
   display: flex;
}

.slick-dots li+li {
   margin-left: 13px;
}

.slick-active button {
   width: 10px;
   height: 10px;
   background-color: #242121;
   margin-bottom: -2px;
   margin-left: -2px;
}

.slick-next {}


.team {
   padding: 120px 0px 130px 0px;
}

.team__title {
   margin-bottom: 120px;
}

.team__items {
   display: flex;
   justify-content: space-between;
}

.team__item {
   text-align: center;
}

.team__item img {
   margin-bottom: 35px;
}

.team__item h6 {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 14px;
   line-height: 17px;
   color: #333333;
   margin-bottom: 15px;
}

.team__item p {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 300;
   font-size: 12px;
   line-height: 16px;
   color: #373A39;
}






.pricing {
   padding: 145px 0px 160px 0px;
   background-color: #F6F8FA;
}

.title {}

.title__prising {
   margin-bottom: 109px;
}

.pricing__block {
   display: flex;
   justify-content: space-between;
   gap: 30px;
}

.pricing__items {
   background-color: #FFFFFF;
   width: 100%;
   position: relative;
   text-align: center;
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 300;
   font-size: 16px;
   line-height: 22px;
   color: #242121;
}

.pricing__items li {
   margin-bottom: 30px;
}

.pricing__items-categori {
   position: absolute;
   top: 24px;
   left: 25px;
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 700;
   font-size: 16px;
   line-height: 22px;
   color: #242121;
}

.pricing__items-price {
   margin-top: 54px;
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 300;
   font-size: 80px;
   line-height: 109px;
   color: #242121;
   padding-bottom: 20px;
}

.pricing__items-price sup {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 300;
   font-size: 40px;
   line-height: 54px;
   color: #242121;
}

.pricing__items-link {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 14px;
   line-height: 17px;
   letter-spacing: 1.2px;
   padding-top: 40px;
}

.pricing__items-link a {
   color: #242121;
}


.sponsor {
   min-height: 290px;
   padding-top: 65px;
}

.sponsor__item {
   display: flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
}




.contact {
   padding: 145px 0px 80px 0px;
   background: url(../img/map.png) no-repeat right;
   background-size: 40%;
   background-position: right center;

}

.container {}

.title__contact {
   margin-bottom: 80px;
}

.form {
   max-width: 570px;
}

.form input {
   width: 100%;
   border: none;
   border-bottom: 2px solid #373A39;
   margin: 16px 0;
}

.form input::placeholder {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 12px;
   line-height: 20px;
   letter-spacing: 3.70909px;
   color: #B8B8B8;
}

.form textarea {
   width: 100%;
   min-height: 156px;
   border: none;
   border-bottom: 2px solid #373A39;
   margin-top: 37px;
   margin-bottom: 40px;
   resize: none;
}

.form textarea::placeholder {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 12px;
   line-height: 20px;
   letter-spacing: 3.70909px;
   color: #B8B8B8;
}

.form button {
   padding: 17px 70px;
   background-color: #242121;
   color: #ffffff;
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 700;
   font-size: 11px;
   line-height: 13px;
   letter-spacing: 2px;
   cursor: pointer;
}





.footer {}

.footer__top {
   background-color: #292929;
   padding-top: 130px;
   padding-bottom: 50px;
}

.footer__logo {
   display: flex;
   justify-content: center;
   margin-bottom: 72px;
}

.logo {
   padding: 0px 31px 2px 31px;
   ;
   border-bottom: 2px solid #FCBB08;
}

ul.footer__contact {
   display: flex;
   justify-content: center;
   gap: 31px;
   padding-bottom: 65px;
}

.footer__contact-link {
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 300;
   font-size: 12px;
   line-height: 15px;
   letter-spacing: 4px;
   color: #FFFFFF;
}

.address {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 14px;
   line-height: 32px;
   text-align: center;
   color: #FFFFFF;
   margin-bottom: 12px;
}

.phone {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 14px;
   line-height: 32px;
   text-align: center;
   color: #FFFFFF;
   margin-bottom: 12px;
   display: block;
}

.email {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 14px;
   line-height: 32px;
   text-align: center;
   color: #FFFFFF;
   margin-bottom: 57px;
   display: block;
}

.logo-nav {
   display: flex;
   justify-content: center;
   margin-bottom: 60px;
}

.footer__copy {
   padding: 41px 0;
   background-color: #2A2C2B;
   display: flex;
   justify-content: center;
}

.footer__copy a {
   font-family: 'Open Sans';
   font-style: normal;
   font-weight: 400;
   font-size: 12px;
   line-height: 16px;
   color: #CCCCCC;
}

@media (min-width: 1400px) {
   .magic {
      background-position: left center;
   }
}

@media (max-width: 1400px) {
   .magic__inner {
      padding: 50px 0;
   }
}

@media (max-width: 1200px) {

   .about,
   .expertise {
      padding: 75px 0;
   }

   .about__inner {
      display: block;
   }

   .about__title {
      margin-bottom: 50px;
   }

   .abuot__text p {
      width: 100%;
   }

   .title {
      font-size: 48px;
      line-height: 65px;
   }

   .expertise__title {
      margin-bottom: 50px;
   }

   .potfolio__filter-btm {
      margin-right: 0;
   }

   .potfolio__btn {
      margin-left: 25px;
      margin-right: 0;
   }
}

@media (max-width: 992px) {
   .contact {
      background: none;
   }

   .expertise__inner {
      display: block;
      margin-bottom: 75px;
   }

   .expertise__info {
      width: 100%;
      margin-top: 10px;
      margin-bottom: 0;
   }

   .expertise__items {
      display: block;
   }

   .expertise__item {
      min-width: 100%;
      margin-bottom: 40px;
   }

   .magic {
      display: block;
      background-size: 100%;
      background-position: center;
      position: relative;
      background-color: rgba(113, 111, 111, 1);
   }

   .magic__inner {
      margin-left: 0px;
   }

   .magic__title {
      color: white;
      background-color: rgba(113, 111, 111, 0.3);
   }

   .magic__text {
      color: white;
      background-color: rgba(113, 111, 111, 0.3);
   }

   .potfolio__content {
      column-count: 3;
      margin-bottom: 40px;
   }

   .potfolio__top {
      display: block;
   }

   .potfolio__filter-btm {
      margin-top: 40px;
   }

   .potfolio__top {
      margin-top: 50px;
      margin-bottom: 50px;
   }
}

@media (max-width: 768px) {
   .footer__contact {
      flex-direction: column;
      align-items: center;
   }

   .menu__list {
      display: none;
      position: absolute;
      left: 0;
      right: 0;
      top: 0px;
      background: #000;
      display: block;
      text-align: center;
      transform: translateY(-200%);
      transition: all .5s;
   }

   ul.menu__list {
      padding: 100px 0 15px;
   }

   .menu__list>li+li {
      margin-left: 0;
   }

   .menu__list-link {
      display: block;
      padding: 15px 0;
      color: #ffffff;
   }

   .header__top--burger {
      display: block;
      background-color: transparent;
      border: none;
      padding: 0;
   }

   .header__top-iner.header__top-iner--active .menu__list {
      transform: translateY(0%);
   }

   .header__top-iner.header__top-iner--active path {
      fill: white;
      transition: all 5s;
   }

   .header__top-iner.header__top-iner--active .header__top--burger rect {
      fill: white;
      transition: all 5s;
   }

   .header__title {
      font-size: 50px;
      line-height: 65px;
      margin-bottom: 10px;
   }

   .header__text {
      font-size: 14px;
      line-height: 16px;
   }

   .title {
      font-size: 48px;
      line-height: 60px;
   }
}

@media (max-width: 620px) {
   .pricing {
      padding-bottom: 40px;
   }

   .experience {
      display: flex;
      flex-direction: column-reverse;
      align-items: center;
   }



   .slider__items-link-title {
      font-size: 20px;
      line-height: 35px;
   }

   .slick-next {
      left: -1000px;
   }

   .pricing__block {
      flex-direction: column;
   }
}

@media (max-width: 440px) {
   .header__title {
      font-size: 36px;
      line-height: 44px;
   }

   .header__text {
      font-size: 12px;
      line-height: 14px;
   }

   .title {
      font-size: 28px;
      line-height: 42px;
   }

   .sponsor__item {
      flex-direction: column;
   }
}

@media (max-width: 340px) {
   .expertise__item {
      padding-left: 0;
      padding-top: 60px;
   }

   .expertise__inner {
      margin-bottom: 25px;
   }

   .expertise__info {
      min-width: 100%;
   }


}