*{
   padding: 0;
   margin: 0;
   border: 0;
}
*,*:before,*:after{
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}
:focus,:active{outline: none;}
a:focus,a:active{outline: none;}
nav,foother,header,aside{display: block;}
html,body{
   height: 100%;
   width: 100%;
   font-size: 100%;
   line-height: 1;
   font-size: 14px;
   -ms-text-size-adjust: 100%;
   -moz-text-size-adjust:100%;
   -webkit-text-size-adjust: 100%;
}
input,button,textarea{font-family:inherit;}
input::-ms-clear{display: none;}
button{cursor: pointer;}
button::-moz-focus-inner {padding:0;border:0;}
a, a:visited{text-decoration: none;color: #FFFFFF;}
a:hover{text-decoration: none;}
ul li{list-style: none;}
img{vertical-align: top;}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight: 400;}
/*__________________________*/
html{
   scroll-behavior: smooth;
}
.open{
   display: flex !important;
}
body{
   background-color: #2F343A;
   font-family: "Roboto";
   font-weight: 400;
   color: #FFFFFF;
   line-height: 14px;
}

.no-scroll{
   overflow: hidden;
   height: 100%;
}

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

.header {
   background-color: #C8A35F;
   font-size: 12px;
   padding: 16px 0px;
}

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

.swich-lg {
   display: flex;
}

.swich-lg__item {
   text-transform: uppercase;
   color: #FFFFFF;
   opacity: 0.5;
   background: none;
}
.swich-lg__item:hover{
   opacity: 1;
}

.swich-lg__item + .swich-lg__item {
   margin-left: 10px;
}

.swich-lg__item.active {
   opacity: 100%;
}

.header__tel:hover,.header__mail:hover{
   text-decoration: underline;
}

.header-menu{
   padding: 27px 0px;
}

.header-menu__column {
   display: flex;
   justify-content: space-between;
}
.menu-info {
   display: flex;
}
.menu-info__line {
   width: 1px;
   height: 46px;
   background-color: #F2F2F2;
   margin: 0px 30px;
}
.menu-info__ofice{
   align-self: center;
}
.menu-info__ofice:hover .menu-info__ofice_link{
   color: #C8A35F;
}
.menu-info__ofice_link {
   display: flex;
   align-items: center;
   font-size: 14px;
   line-height: 16px;
   letter-spacing: 0.05em;
}
.menu-info__ofice_img {
   margin-right: 10px;
}
.menu {
   align-self: center;
}
.menu-list {
   display: flex;
}
.menu-list__item {
   margin-right: 30px;
}
.menu-list__item:last-child{
   margin-right: 0px;
}
.menu-list__item_link{
   font-size: 14px;
   line-height: 16px;
   letter-spacing: 0.05em;
   text-transform: uppercase;
}
.menu-list__item_link:hover{
   color: #C8A35F;
}

.burger{
   display: none;
   position: relative;
   z-index: 50;
   align-items: center;
   justify-content: flex-end;
   width: 30px;
   height: 18px;
   align-self: center;
}

.burger span{
   height: 2px;
   width: 100%;
   transform: scale(1);
   background-color: #F2F2F2;
}

.burger::before, .burger::after{
   content: '';
   position: absolute;
   height: 2px;
   width: 100%;
   background-color: #F2F2F2;
   transition: all 0.3s ease 0s;
}

.burger::before{
   top:0;
}

.burger::after{
   bottom: 0;
}

.burger.active span {
   transform: scale(0);
}

.burger.active::before{
   top: 50%;
   transform: rotate(-45deg) translate(0, -50%);
}

.burger.active::after{
   bottom: 50%;
   transform: rotate(45deg) translate(0, 50%);
}
.main {
   background: url("../img/main.jpg") no-repeat center center;
   background-attachment: fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   padding: 155px 0px 220px;
}
.main__border {
   max-width: 921px;
   max-height: 320px;
   margin: 0 auto;
   border: 1px solid #C8A35F;
   padding: 45px 0px;
}
.main__title {
   font-weight: 700;
   font-size: 64px;
   line-height: 75px;
   text-align: center;
   letter-spacing: 0.05em;
   text-transform: uppercase;
}
.main__text {
   font-size: 18px;
   line-height: 28px;
   text-align: center;
   margin-top: 25px;
}
.slaid{
   margin-bottom: 268px;
}
.block-left {
   position: absolute;
   width: 39.32%;
   height: 561px;
   background-color: #393F47;
   left: 0;
}
.block-right {
   position: absolute;
   width: 39.32%;
   height: 561px;
   background-color: #393F47;
   right: 0;
}
.slaid__column {
   position: relative;
    display: flex;
    justify-content: space-between;
}
.line{
   width: 90px;
   height: 6px;
   background-color: #C8A35F;
}
.slaid__line {
   margin: 120px 0px 40px;
}
.title{
   font-weight: 700;
   font-size: 40px;
   line-height: 49px;
   letter-spacing: 0.05em;
   text-transform: uppercase;
}
.slaid__title {
   max-width: 390px;
   margin-bottom: 30px;
}
.slaid__text {
   max-width: 318px;
   font-size: 18px;
   line-height: 28px;
   margin-bottom: 69px;
}
.slaid__link {
   padding: 19px 48px;
   background-color: #C8A35F;
   font-size: 16px;
   line-height: 25px;
   text-align: center;
   letter-spacing: 0.1em;
   text-transform: uppercase;
   transition: all 0.3s ease 0s;
}
.slaid__link:hover{
   position: relative;
   font-size: 18px;
   padding: 18px 41px;
}
.slaid__right {
   display: flex;
   max-width: 635px;
}
.slaid__imgs {
   width: 445px;
   height: 266px;
   margin-top: 166px;
   margin-right: 29px;
   display: flex;
   justify-content: center;
   align-items: center;
   overflow: hidden;
}
.slaid__img {
   display: none;
   width: 100%;
   height: 100%;
   object-fit: contain;
}
.slaid__img.active{
   display: block;
}
.slaid-buttons {
   max-width: 25%;
   margin-top: 156px;
}
.slaid-button {
   background: none;
   transition: all 0.3s ease 0s;
}
.slaid-button + .slaid-button{
   margin-top: 245px;
}
.slaid-button__text {
   font-size: 16px;
   line-height: 25px;  
   letter-spacing: 0.1em;
   text-transform: uppercase;
   color: #C8A35F;
}
.slaid-text__up{
   margin-right: 30px;
}
.slaid-text__down{
   margin-left: 30px;
}
.slaid-button__up:hover .slaid-button__text{
   font-size: 18px;
   margin-right: 24px;
}
.slaid-button__down:hover .slaid-button__text{
   font-size: 18px;
}

.services__title {
   margin: 40px 0px 60px;
}
.services__string {
   display: flex;
   justify-content: space-between;
}
.services__string + .services__string{
   margin-top: 1px;
}
.services-string__block {
   width: 100%;
   height: 180px;
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: #393F47;
   transition: all 0.3s ease 0s;
}
.services-string__block + .services-string__block{
   margin-left: 1px;
}
.services-string__img {
   width: 30px;
   height: 30px;
   background-size: cover;
   margin: 0 auto;
   margin-bottom: 43px;
}
.services-string__img--air{
   background: url("../img/airplane-flight.svg") no-repeat center center;
}
.services-string__img--truck{
   background: url("../img/TruckW.svg") no-repeat center center;
}
.services-string__img--train{
   background: url("../img/TrainW.svg") no-repeat center center;
}
.services-string__img--ship{
   background: url("../img/ShipW.svg") no-repeat center center;
}
.services-string__img--delivery{
   background: url("../img/DeliveryW.svg") no-repeat center center;
}
.services-string__img--crane{
   background: url("../img/craneW.svg") no-repeat center center;
}
.services-string__img--medal{
   background: url("../img/medalW.svg") no-repeat center center;
}
.services-string__img--express{
   background: url("../img/ExpressW.svg") no-repeat center center;
}
.services-string__block:hover{
   background-color: #C8A35F;
}
.services-string__block--air:hover .services-string__img--air{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/airplane-flight-black.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--truck:hover .services-string__img--truck{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/TruckB.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--train:hover .services-string__img--train{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/TrainB.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--ship:hover .services-string__img--ship{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/ShipB.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--delivery:hover .services-string__img--delivery{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/DeliveryB.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--crane:hover .services-string__img--crane{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/craneB.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--medal:hover .services-string__img--medal{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/medalB.svg") no-repeat center center;
   background-color: #FFFFFF;
}
.services-string__block--express:hover .services-string__img--express{
   width: 70px;
   height: 70px;
   border-radius: 50px;
   margin-bottom: 23px;
   background: url("../img/expressB.svg") no-repeat center center;
   background-color: #FFFFFF;
}

.services-string__text {
   font-size: 18px;
   line-height: 22px;
   letter-spacing: 0.05em;
   text-transform: uppercase;
   display: block;
   text-align: center;
}
.company {
   margin: 120px 0px 202px;
}
.company__background {
   position: absolute;
   width: 410px;
   height: 482px;
   margin-left: 350px;
   background-color: #393F47;
}
.company__column {
   position: relative;
   display: flex;
   justify-content: space-between;
}
.company__info_left {
   max-width: 445px;
}
.company-info__line {
   margin: 80px 0px 40px;
}
.company-info__title {
   margin-bottom: 30px;
}
.company-info__text {
   font-size: 16px;
   line-height: 23px;
}
.company-cards {
   display: flex;
   flex-wrap: wrap;
   max-width: 100%;
   margin-top: 80px;
   margin-left: 25px;
}
.company-cards__item {
   background-color: #FFFFFF;
   width: 200px;
   height: 160px;
   border: #C8A35F solid 0.25px;
}
.company-cards__title {
   font-size: 64px;
   font-weight: 700;
   line-height: 75px;
   text-align: center;
   letter-spacing: 0.05em;
   text-transform: uppercase;
   color: #2F343A;
   margin-top: 9px;
}
.company-cards__text {
   font-size: 18px;
   line-height: 21px;
   text-align: center;
   letter-spacing: 0.05em;
   color: #000000;
   margin: 10px 0px 15px;
}
.company-cards__subtext{
   font-size: 12px;
   line-height: 14px;
   text-align: center;
   color: #000000;
}
.company-cards__img {
   width: 200px;
   height: 160px;
   border: #C8A35F solid 0.25px;
}
.company-cards__img img{
   max-width: 100%;
}

.location{
   max-width: 100%;
   height: 450px;
}
.location__map{
   width: 100%;
   height: 100%;
}

.footer {
   background-color: #C8A35F;
   padding: 58px 0px;
}
.footer__column {
   display: flex;
   align-items: end;
}
.footer__info {
   margin: 0px 89px 0px 30px;
}
.footer__location {
   font-size: 14px;
   line-height: 16px;
   color: #F2F2F2;
   opacity: 0.8;
   margin-bottom: 10px;
}
.footer__mail {
   font-size: 14px;
   line-height: 16px;
   color: #2F343A;
}
.footer__mail:hover{
   text-decoration: underline;
}
.footer_telefons {
   display: flex;
   flex-direction: column;
}
.footer__tel {
   font-size: 14px;
   line-height: 16px;
   color: #F2F2F2;
}

.footer__tel:hover{
   text-decoration: underline;
}

.footer__tel + .footer__tel{
   margin-top: 10px;
}

@media (max-width: 1200px) {
   .company-cards {
      margin-left: 115px;
   }
}

@media (max-width: 1024px) {
   .slaid__imgs{
      margin-right: 0px;
   }
   .slaid-buttons {
      max-width: 27%;
   }
   .company {
      margin: 100px 0px;
   }
   .company-info__line {
      margin: 50px 0px 40px;
   }
   .company-cards {
      margin-top: 50px;
      margin-left: 80px;
  }
}

@media (max-width: 960px) {
   .burger{
      display: flex;
   }
   .burger.active{
      position: absolute;
      top: 50px;
      right: 50px;
   }
   .menu{
      display: none;
      flex-direction: column;
      position: fixed;
      height: 100%;
      width: 100%;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 50;
      overflow-y: auto;
      padding: 50px 40px;
      background-color: #2F343A;
      animation: burgerAnimation 0.4s;
   }
   .menu-list{
      flex-direction: column;
      row-gap: 30px;
      align-items: center;
   }
   .menu-list__item {
      margin-right: 0px;
   }
   .main{
      background-attachment: scroll;
   }
   .main__border {
      padding: 45px 40px;
   }
   .main__title {
      font-size: 55px;
   }
   .slaid {
      margin-bottom: 70px;
   }
   .block-left {
      width: 100%;
      height: 390px;
   }
   .block-right {
      display: none;
   }
   .slaid__column {
      flex-direction: column;
   }
   .slaid__line {
      margin: 70px 0px 40px;
   }
   .slaid__title {
      max-width: 100%;
   }
   .slaid__text {
      max-width: 100%;
   }
   .slaid__right {
      max-width: 100%;
      justify-content: center;
  }
  .slaid__imgs {
   max-width: 100%;
   margin-top: 60px;
   margin-right: 29px;
  }
  .slaid-buttons {
   max-width: 21%;
   margin-top: 40px;
  }
  .slaid-button + .slaid-button {
   margin-top: 200px;
   }
   .services__string {
      max-width: 553px;
      flex-wrap: wrap;
      justify-content: space-between;
      margin: 0 auto;
   }
   .services-string__block {
      width: 276px;
   }
   .services__string + .services__string {
      margin-top: 0px;
  }
   .services-string__block + .services-string__block {
   margin-left: 0px;
   }
   .services-string__block{
      margin-bottom: 1px;
   }
   .company {
      margin: 80px 0px;
   }
   .company__column {
      flex-direction: column;
   }
   .company__info_left {
      max-width: 100%;
  }
  .company-info__line {
   margin: 0px 0px 40px;
   }
}

@media (max-width: 768px) {
   .menu-info__line{
      display: none;
   }
   .menu-info__ofice{
      display: none;
   }
   .main__border {
      padding: 30px;
   }
   .main__title {
      font-size: 36px;
      line-height: 50px;
  }
  .main__text {
   font-size: 16px;
   }
   .block-left {
      height: 430px;
  }
  .slaid__line {
   margin: 50px 0px 40px;
   }
   .slaid__right {
      flex-direction: column;
   } 
   .slaid__imgs {
      margin-top: 80px;
      margin-right: 0px;
      width: 100%;
   }
   .slaid-buttons{
      display: flex;
      max-width: 100%;
      justify-content: space-between;
      margin-bottom: 30px;
   }
   .slaid-button__up{
      order: 2;
   }
   .slaid-button + .slaid-button {
      margin-top: 0px;
   }
   .services__string {
      max-width: 100%;
      justify-content: center;
   }
   .services__string + .services__string {
      margin-top: 0px;
   }
   .services-string__block + .services-string__block {
      margin-left: 1px;
   }
   .company__background {
      width: 270px;
      margin-left: 140px;
   }
   .company-cards {
      margin-left: 0px;
   }
   .footer__column {
      flex-wrap: wrap;
      justify-content: space-between;
   }
   .footer__link {
      margin: 0px 20px 0px 0px;
   }
   .footer__info {
    margin: 0px 20px 0px 0px;
   }
}

@media (max-width: 628px){
   .footer {
    padding: 40px 0px;
   }
   .footer__link {
      margin: 0px 20px 20px 0px;
   }
   .footer__column {
    align-items: baseline;
   }
}

@media (max-width: 511px){
   .footer__link {
      margin-bottom: 20px;
   }
   .footer__column {
    align-items: baseline;
   }
   .footer__info{
      margin: 0px 20px 20px 0px;
   }
}

@media (max-width: 420px) {
   .header-container{
      flex-direction: column-reverse;
   }
   .swich-lg{
      order: 1;
   }
   .header__tel,.header__mail {
      display: flex;
      align-self: end;
   }
   .header__mail {
      order: 2;
   }
   .main__border {
      padding: 20px;
   }
   .main__title {
      font-size: 30px;
   }     
   .slaid__title {
      font-size: 33px;
   }
   .slaid__imgs {
      height: 193px;
   }
   .services-string__block + .services-string__block {
        margin-left: 0px;
   }
   .company__background {
      width: 230px;
      margin-left: 100px;
      height: 410px;
   }
   .company-cards {
      margin-top: 35px;
   }
   .company-cards__item {
      width: 160px;
   }
   .company-cards__img {
      width: 160px;
   }
   .company-cards__img img {
      height: 100%;
   }
   .location {
      height: 350px;
   }
}

@media (max-width: 340px) {
   .main {
    padding: 140px 0px 170px;
   }
   .main__border {
        padding: 15px;
    }
   .main__title {
        font-size: 22px;
    }
   .main__text {
      font-size: 11px;
      margin-top: 10px;
   }
   .slaid__title {
      font-size: 26px;
      line-height: 40px;
   }
   .slaid__text {
      font-size: 16px;
      line-height: 27px;
      margin-bottom: 40px;
   }
   .slaid__link{
      display: block;
      margin: 0 auto;
   }
   .slaid-button{
      display: flex;
   }
   .slaid-button__down{
      flex-direction: column-reverse;
   }
   .slaid-button__up{
      flex-direction: column;
   }
   .slaid-text__down {
      margin-left: 18px;
   }
   .slaid-text__up {
      margin-right: 16px;
   }
   .company__background {
   width: 200px;
   margin-left: 60px;
   height: 350px;
   }
   .company-info__title {
      font-size: 35px;
      margin-bottom: 20px;
   }
   .company-info__text {
      font-size: 14px;
   }
   .company-cards{
   justify-content: center;
   }
   .company-cards__item{
      width: 200px;
   }
   .company-cards__img{
      width: 200px;
   }
   .footer__info{
      margin: 0px 0px 20px 0px;
   }
}

@keyframes burgerAnimation {
   from { opacity: 0;}
   to {opacity: 1;}
}