@font-face {
   font-family: 'Oswald-Demi-BoldItalic';
   font-style: normal;
   font-weight: normal;
   src: url('fonts/Oswald-Demi-BoldItalic.ttf') format('woff2');
}

@font-face {
   font-family: 'Gagalin-Regular';
   font-style: normal;
   font-weight: normal;
   src: url('fonts/Gagalin-Regular.otf') format('woff2');
}

@font-face {
   font-family: 'Oswald-Light';
   font-style: normal;
   font-weight: normal;
   src: url('fonts/Oswald-Light.ttf');
}

body {
   background-image: url(../images/3.jpg);
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-size: 100% 100%;
   font-size: 200%;
   /* background-image: url(../images/fon.png);*/
   padding: 0px;
   margin: 0px;
   height: auto;
   width: 100%;
}

.logo {
   height: 90px;
}

.btn_start {
   position: fixed;
   right: 1%;
   top: 1%;
   border: 2px solid rgba(83, 89, 98, 0.5);
   background-color: rgba(185, 185, 185, 0.9);
   border-radius: 5px;
   font-size: 150%;
   font-family: 'Oswald-Demi-BoldItalic', Helvetica, Arial;
   z-index: 10;
   padding: 0px 25px;
   animation: blinker 2s linear infinite;
   user-select: none;
}

@keyframes blinker {
   50% {
      box-shadow: inset 0px 0px 15px 10px rgb(22, 189, 0);
   }
}

.btn_start:hover {
   color: rgb(35, 112, 35);
   background-color: rgba(185, 185, 185, 0.9);
   text-shadow: 2px 2px 10px #535353;
}

.carousel_label {
   position: absolute;
   top: 300px;
   left: 5%;
   width: 50%;
   font-family: 'Gagalin-Regular', Helvetica, Arial;
   z-index: 10;
   font-size: 50%;
   padding: 1% 2% 1% 1%;
   background-color: rgba(185, 185, 185, 0.9);
   transition: 2s;
   color: rgb(44, 44, 44);
   text-align: center;
   clip-path: polygon(0% 0%, 100% 0%, 95% 100%, 0% 100%);
   text-shadow: 3px 3px 5px #535353;
   user-select: none;
}

.carousel_label_out {
   position: absolute;
   top: 300px;
   left: -100%;
   width: 50%;
   padding: 10px;
   transition: 1s;
   background-color: rgba(185, 185, 185, 0.9);
   font-family: 'Gagalin-Regular', Helvetica, Arial;
   z-index: 10;
   text-align: center;
   clip-path: polygon(0% 0%, 100% 0%, 95% 100%, 0% 100%);
   user-select: none;
}

._shadow {
   box-shadow: 10px 10px 10px rgb(56, 56, 56);
}

.div_text {
   /*первоначальный текст*/
   width: 90%;
   margin: 0 auto;
   padding: 10px;
   text-align: center;
   font-family: 'Oswald-Demi-BoldItalic', Helvetica, Arial;
   border: 1px solid rgba(255, 255, 255, 0);
   border-radius: 10px;
   color: rgb(87, 87, 87);
}

._red {
   background-color: rgba(255, 196, 196, 0.5);
}

._blue {
   background-color: rgba(210, 232, 245, 0.5);
}

._left {
   text-align: left;
}

@media screen and (max-width: 1280px) {

   .carousel_label,
   .carousel_label_out {
      font-size: 100%;
      top: 110px;
   }

   .btn_start {
      font-size: 100%;
   }

   .div_text {
      font-size: 75%;
   }
}

@media screen and (max-width: 840px) {

   .carousel_label,
   .carousel_label_out {
      font-size: 70%;
      top: 70px;
   }
}

@media screen and (max-width: 580px) {

   .carousel_label,
   .carousel_label_out {
      font-size: 40%;
      top: 50px;
   }

   .btn_start {
      font-size: 70%;
   }

   .div_text {
      font-size: 40%;
   }
}

@media screen and (min-width: 1280px) {

   .carousel_label,
   .carousel_label_out {
      font-size: 150%;
      top: 200px;
   }
}


.span_text {
   /*переведенное слово*/
   font-size: 150%;
   margin: 2px 6px;
   font-family: 'Oswald-Light', Helvetica, Arial;
   color: rgb(63, 63, 63);
   border: 1px solid rgba(255, 255, 255, 0);
   border-radius: 5px;
}

p {
   padding: 0px;
   margin: 0px;
   height: 10px;
}

.decoration {

   text-decoration: underline;
}

h1,
h2 {
   font-size: 130%;
}


.swiper {
   width: 100%;
   height: 100%;
}

.swiper-slide {
   text-align: center;
   font-size: 18px;
   /*background: rgb(5, 5, 5);*/

   /* Center slide text vertically */
   display: -webkit-box;
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   -webkit-justify-content: center;
   justify-content: center;
   -webkit-box-align: start;
   -ms-flex-align: start;
   -webkit-align-items: start;
   align-items: start;
}

.swiper-slide img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.swiper {
   width: 100%;
   height: 300px;
   margin-left: auto;
   margin-right: auto;
}

.swiper-slide {
   background-size: cover;
   background-position: center;
}

.mySwiper2 {
   height: auto;
   width: 100%;
}

.mySwiper {
   height: auto;
   box-sizing: border-box;
   padding: 10px 0;
}

.mySwiper .swiper-slide {
   width: 25%;
   height: 100%;
   opacity: 0.4;
}

.mySwiper .swiper-slide-thumb-active {
   opacity: 1;
}

.swiper-slide img {
   display: block;
   width: 100%;
   height: 75%;
   object-fit: cover;
}

.swiper-wrapper {
   height: auto;
}