@font-face{
    font-family:AlumniSans-Regular;
    src:  url('../Font/AlumniSans-Regular.ttf?18dows');
    src:  url('../Font/AlumniSans-Regular.ttf?18dows#iefix') format('truetype'),

    url('Font/AlumniSans-Regular.ttf?18dows') format('truetype'),
}

@font-face{
    font-family:OpenSansCondensed-Bold;
    src:  url('../Font/OpenSansCondensed-Bold.ttf?18dows');
    src:  url('../Font/OpenSansCondensed-Bold.ttf?18dows#iefix') format('truetype'),

    url('../Font/OpenSansCondensed-Bold.ttf?18dows') format('truetype'),
}

@font-face{
    font-family:OpenSansReg;
    src:  url('../Font/OpenSansReg.ttf?18dows');
    src:  url('../Font/OpenSansReg.ttf?18dows#iefix') format('truetype'),

    url('../Font/OpenSansReg.ttf?18dows') format('truetype'),
}

iframe {
  width: 100%;
  height: 100%;
}

body {
    margin: 0;
    padding: 0;
}

p, h1, h2, h3, h4 {
    padding: 0;
    margin: 0;
}

.main_container {
  max-width: 1920px;
  margin: 0 auto;
  width: 90%;
}

.main_content {
    padding-top: 4%;
}

.top_breadcrumbs {
    display: none;
}
.pt-3{
    display: none;
}

.main_block {
    background: url(../images/main_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: -32px;

}

.first_block {
    padding-top: 60px;
    background: rgba(255, 255, 255, 0.15);
    box-shadow: inset 0px 0px 11px #FFFFFF;
    backdrop-filter: blur(8px);
    border-radius: 10px;
    -webkit-backdrop-filter: blur(8px);
}

@-moz-document url-prefix() {
    .first_block{
        background: rgba(168, 182, 239, 0.8);
    }
}


.first_block h1 {
  font-family: AlumniSans-Regular;
  font-size: 180px;
  line-height: 144px;
  font-weight: 400;
  color: #fff;
  text-transform: uppercase;
  max-width: 1200px;
}

.det_h1_block {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: flex-start;
}

.mouse_or_string {
  text-align: center;
  padding-bottom: 40px;
  margin-top: -4%;
}

#top_string {
  display: none;
  height: 12px;
}

.soc_icones {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-start;
  align-items: center;
  margin-left: -11%;
}

.mouse_or_string img {
  max-height: 50px;
}

.det_h1_block img {
    width: auto;
    height: 40px;
  padding-left: 30px;
}

.first_block_content {
    max-width: 95%;
    margin: 0 auto;
}

.program_choise {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    margin-top: -8%;
    padding-bottom: 1%;
}

.program_choise img {
    max-width: 55%;
}

#btn1 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    font-family: OpenSansCondensed-Bold;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    font-size: 24px;
    padding-top: 100px;
}

#btn2 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
  font-family: OpenSansCondensed-Bold;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 24px;
  margin-top: 175px;
  margin-left: 136px;
  max-width: 220px;
}

#btn3 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
  font-family: OpenSansCondensed-Bold;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 24px;
  margin-top: 291px;
  margin-left: 164px;
  max-width: 220px;
}

#btn4 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-between;
  align-items: center;
  font-family: OpenSansCondensed-Bold;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  font-size: 24px;
  margin-top: 225px;
  margin-left: 130px;
  max-width: 220px;
}

#btn2 img {
  max-width: 150px;
}

#btn3 img {
  max-width: 150px;
}

#btn4 img {
  max-width: 150px;
}

#mBtn {
    opacity: 0;
    margin-left: -34px;
    transition: .9s;
}

#mBtn2 {
  opacity: 1;
  margin-left: -34px;
  transition: .7s;
  font-size: 42px;
}

#mBtn3 {
  opacity: 1;
  margin-left: -34px;
  transition: .7s;
  font-size: 42px;
}

#mBtn4 {
  opacity: 1;
  margin-left: -34px;
  transition: .7s;
  font-size: 42px;
}

#mBtn2 img {
  max-width: 150px;
}


#mBtn3 img {
  max-width: 150px;
}

#mBtn4 img {
  max-width: 150px;
}

#btn1:hover #mBtn { 
    opacity: 1;
    transition: .9s;
}

/* #btn2:hover #mBtn2 { 
  opacity: 1;
  transition: .9s;
} */

.second_block {
    margin-top: 15%;
}

.second_block h2 {
    font-family: OpenSansCondensed-Bold;
    color: #193683;
    font-size: 48px;
    line-height: 47px;
    font-weight: 700;
    max-width: 777px;
}

.second_block p {
    font-family: OpenSansReg;
    color: #193683;
    max-width: 710px;
    padding-top: 24px;
    font-size: 24px;
    line-height: 38px;
}

.third_block {
    margin-top: -147px;
    position: relative;
    overflow: hidden;
    height: 804px;
    width: 100%;
}

#jaguar {
  height: auto;
  max-width: 100%;
}

#steklo {
  position: absolute;
  top: 17%;
  left: 47%;
}

#klimat {
  position: absolute;
  top: 23%;
  left: 37%;
}

#kozha {
  position: absolute;
  bottom: 73%;
  left: 68%;
}
#tekstil {
  position: absolute;
  top: 21%;
  left: 62%;
}

#lkp {
  position: absolute;
  top: 27%;
  left: 24%;
}

#plastik {
  position: absolute;
  top: 25%;
  left: 47%;
}

#chrom {
  position: absolute;
  top: 20%;
  left: 77%;
}

#kapot {
  position: absolute;
  top: 49%;
  left: 7%;
}

#kuzov {
  position: absolute;
  top: 47%;
  left: 53%;
}

#koleso {
  position: absolute;
  top: 64%;
  left: 38%;
}

.fourth_block {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-end;
    align-items: flex-start;
}

.fourth_block img {
    margin-top: -110px;
    padding-right: 40px;
}

.fourth_block_text h2 {
    font-family: OpenSansCondensed-Bold;
    color: #193683;
    font-size: 48px;
    line-height: 47px;
    font-weight: 700;
    max-width: 777px;
}

.fourth_block_text p {
    font-family: OpenSansReg;
    color: #193683;
    max-width: 825px;
    padding-top: 24px;
    font-size: 24px;
    line-height: 38px;
}

#bubble2 {
    margin-top: -120px;
}

.fifth_block {
    display: block;
    margin-top: -324px;
}

.fifth_block img {
    margin-top: -110px;
}

.fifth_block_text h2 {
    font-family: OpenSansCondensed-Bold;
    color: #193683;
    font-size: 48px;
    line-height: 47px;
    font-weight: 700;
    max-width: 777px;
}

.fifth_block_text p {
    font-family: OpenSansReg;
    color: #193683;
    max-width: 825px;
    padding-top: 40px;
    font-size: 24px;
    line-height: 38px;
}

.car_button {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    font-family: OpenSansCondensed-Bold;
    color: #fff !important;
    font-weight: 700;
    text-decoration: none !important;
    font-size: 14px;
}

.car_button_span {
    opacity: 0;
    margin-left: -10px;
    transition: .9s;
}

.car_button:hover .car_button_span { 
    opacity: 1;
    transition: .9s;
}

.two_programms {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: flex-start;
    padding: 85px 0 0 0;
}

.for_lifeH {
  display: flex;
  justify-content: center;
  padding-left: 400px;
  padding-bottom: 120px;
}

  .icon1 {
    position: relative;
    background: url(../images/exterior_bubble.png);
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    height: 700px;
    width: 700px;
  }

  .ext_links img {
    max-height: 100px;
  }

  .ext_links2 img {
    max-height: 100px;
  }

  .ext_links li {
    list-style: none;
  }

  .ext_links2 li {
    list-style: none;
  }

  .ext_links a {
    color: #fff;
    text-decoration: none;
    font-family:OpenSansCondensed-Bold;
    font-size: 16px;
    text-transform: uppercase;
    line-height: 24px;
    transition: .7s;
  }

  .ext_links2 a {
    color: #fff;
    text-decoration: none;
    font-family:OpenSansCondensed-Bold;
    font-size: 16px;
    text-transform: uppercase;
    line-height: 24px;
    transition: .7s;
  }

  #p_koleso {
    max-width: 100px;
    position: absolute;
    right: 6%;
    top: -9%;
    text-align: center;
  }

  #p_kuzov {
    max-width: 104px;
    position: absolute;
    right: -9%;
    top: 6%;
    text-align: center;
  }

  #p_lkp {
    max-width: 100px;
    position: absolute;
    right: -16%;
    top: 27%;
    text-align: center;
  }

  #p_plastic {
    max-width: 116px;
    position: absolute;
    right: -16%;
    top: 52%;
    text-align: center;
  }

  #p_steklo {
    max-width: 104px;
    position: absolute;
    right: -9%;
    top: 74%;
    text-align: center;
  }

  #p_kapot {
    max-width: 104px;
    position: absolute;
    right: 4%;
    top: 90%;
    text-align: center;
  }

.ext_links { 
    opacity: 0;
    transition: .7s;
}

.ext_links2 { 
  opacity: 0;
  transition: .7s;
}

  .icon1:hover .ext_links { 
    opacity: 1;
    transition: .7s;
}

.icon2:hover .ext_links2 { 
  opacity: 1;
  transition: .7s;
}

/* .icon1:hover #mBtn2 {
  color: #899dd2;
  transition: .7s;
} */

/* .icon2:hover #mBtn3 {
  color: #899dd2;
  transition: .7s;
} */

/* .icon3:hover #mBtn4 {
  color: #899dd2;
  transition: .7s;
} */

.ext_links a:hover {
  color: #193683;
  transition: .7s;
}

.ext_links2 a:hover {
  color: #193683;
  transition: .7s;
}

.icon2 {
  position: relative;
  background: url(../images/interior_bubble.png);
  background-repeat: no-repeat;
  margin-top: -24%;
  background-size: contain;
  cursor: pointer;
  height: 750px;
  width: 750px;
}

.icon3 {
  position: relative;
  background: url(../images/LifeH.png);
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  height: 600px;
  width: 600px;
  margin-top: -15%;
}

#p_tekstil {
  max-width: 100px;
  position: absolute;
  left: -10%;
  bottom: 17%;
  text-align: center;
}

#p_plast_in {
  max-width: 100px;
  position: absolute;
  left: 1%;
  bottom: 0%;
  text-align: center;
}

#p_kozha {
  max-width: 100px;
  position: absolute;
  left: 17%;
  bottom: -12%;
  text-align: center;
}

#p_kondey {
  max-width: 100px;
  position: absolute;
  left: 36%;
  bottom: -18%;
  text-align: center;
}



/* index1 */

.whl_bg {
  background: url(../images/wheels_page.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  height: 500px;
}

/* index1 end */

/* Max-width 1200px and Min-width 320px */
@media (max-width: 1720px) and (min-width: 360px) {
  .first_block h1 {
      font-size: calc(59px + (180 - 59) * ((100vw - 360px) / (1720 - 360)));
      line-height: calc(52px + (154 - 52) * ((100vw - 360px) / (1720 - 360)));
  }
  #btn1 {
    font-size: calc(24px + (24 - 16) * ((100vw - 360px) / (1720 - 360)));
  }
  .second_block h2 {
    font-size: calc(30px + (48 - 30) * ((100vw - 360px) / (1720 - 360)));
    line-height: calc(29px + (47 - 29) * ((100vw - 360px) / (1720 - 360)));
  }
  .second_block p {
    font-size: calc(13px + (24 - 13) * ((100vw - 360px) / (1720 - 360)));
    line-height: calc(20px + (38 - 20) * ((100vw - 360px) / (1720 - 360)));
  }
  .fourth_block_text h2 {
    font-size: calc(30px + (48 - 30) * ((100vw - 360px) / (1720 - 360)));
    line-height: calc(29px + (47 - 29) * ((100vw - 360px) / (1720 - 360)));
  }
  .fourth_block_text p {
    font-size: calc(13px + (24 - 13) * ((100vw - 360px) / (1720 - 360)));
    line-height: calc(20px + (38 - 20) * ((100vw - 360px) / (1720 - 360)));
  }
  .fifth_block_text h2 {
    font-size: calc(30px + (48 - 30) * ((100vw - 360px) / (1720 - 360)));
    line-height: calc(29px + (47 - 29) * ((100vw - 360px) / (1720 - 360)));
  }
  .fifth_block_text p {
    font-size: calc(13px + (24 - 13) * ((100vw - 360px) / (1720 - 360)));
    line-height: calc(20px + (38 - 20) * ((100vw - 360px) / (1720 - 360)));
  }
}

@media (max-width: 1720px) {
  .program_choise img {
    max-width: 50%;
}
#steklo {
  top: 16%;
}
#kapot {
  top: 47%;
}
#lkp {
  top: 27%;
}
#klimat {
  top: 21%;
}
#plastik {
  top: 25%;
}
#kozha {
  top: auto;
  bottom: 74%;
}
#tekstil {
  top: auto;
  bottom: 79%;
}
#chrom {
  bottom: 76%;
  top: auto;
}
#kuzov {
  top: 35%;
}
#koleso {
  top: 57%;
}
.third_block {
  margin-top: -97px;
  height: 677px;
}
.main_block {
  background: url(../images/main_bg_1720.jpg);
  background-repeat: no-repeat;
  background-size: cover;
}
.second_block {
  margin-top: 8%;
}
.icon1 {
  height: 500px;
  width: 500px;
}
.icon2 {
  height: 550px;
  width: 550px;
  margin-top: -17%;
}
.icon3 {
  height: 500px;
  width: 500px;
  margin-top: -7%;
}
#p_kapot {
  right: 48%;
  top: 103%;
}
#p_steklo {
  right: 23%;
  top: 101%;
}
#p_plastic {
  right: -2%;
  top: 92%;
}
#p_lkp {
  right: -19%;
  top: 66%;
}
#p_kuzov {
  right: -24%;
  top: 36%;
}
#p_koleso {
  right: -20%;
  top: 7%;
}
#p_kondey {
  bottom: -24%;
}
#p_kozha {
  bottom: -20%;
}
#p_plast_in {
  left: 0%;
  bottom: -9%;
}
#p_tekstil {
  left: -15%;
  bottom: 10%;
}
#btn2 {
  margin-top: 172px;
  margin-left: 105px;
}
#btn3 {
  margin-top: 234px;
  margin-left: 129px;
}
#btn4 {
  margin-top: 167px;
  margin-left: 110px;
}
#mBtn2 {
  font-size: 37px;
}
#mBtn3 {
  font-size: 37px;
}
#mBtn4 {
  font-size: 37px;
}
}

@media (max-width: 1520px) {
  .third_block {
    margin-top: -70px;
    height: 587px;
}
.icon2 {
  margin-top: -11%;
}
.two_programms {
  margin-bottom: 130px;
}
.program_choise img {
  max-width: 48%;
}
.third_block {
  margin-top: -41px;
  height: 560px;
}
#steklo {
  top: 13%;
  left: 49%;
}
#plastik {
  top: 26%;
  left: 48%;
}
}

@media (max-width: 1320px) {
  .third_block {
    margin-top: -42px;
    height: 519px;
}
.icon1 {
  height: 350px;
  width: 350px;
}
.icon2 {
  height: 400px;
  width: 400px;
  margin-top: 0;
}
.icon3 {
  height: 350px;
  width: 350px;
  margin-top: -6%;
}
#btn2 img {
  max-width: 120px;
}
#btn3 img {
  max-width: 120px;
}
#btn4 img {
  max-width: 120px;
}
#mBtn2 {
  margin-left: -25px;
  font-size: 30px;
}
#mBtn3 {
  margin-left: -25px;
  font-size: 30px;
}
#mBtn4 {
  margin-left: -25px;
  font-size: 30px;
}
#btn2 {
  margin-top: 110px;
  margin-left: 59px;
}
#btn3 {
  margin-top: 167px;
  margin-left: 79px;
}
#btn4 {
  margin-top: 120px;
  margin-left: 63px;
}
.main_container {
  max-width: 97%;
}
.two_programms {
  justify-content: space-around;
}
#p_kapot {
  right: 98%;
  top: 60%;
  width: 99px;
}
#p_steklo {
  right: 71%;
  top: 92%;
}
#p_plastic {
  right: 32%;
  top: 102%;
}
#p_lkp {
  right: -3%;
  top: 94%;
}
#p_kuzov {
  right: -29%;
  top: 59%;
}
#p_koleso {
  right: -31%;
  top: 19%;
}
#p_kondey {
  bottom: -24%;
  left: 75%;
}
#p_kozha {
  bottom: -33%;
  left: 46%;
}
#p_plast_in {
  left: 17%;
  bottom: -30%;
}
#p_tekstil {
  left: -9%;
  bottom: -15%;
}
.two_programms {
  padding: 40px 0 0 0;
}
.for_lifeH {
  padding-left: 0;
}
}

@media (max-width: 1120px) {
  .third_block {
    margin-top: -42px;
    height: 400px;
}
#steklo {
  top: 9%;
  left: 49%;
}
#kuzov {
  top: auto;
  bottom: 55%;
}
.two_programms {
  display: grid;
  flex-wrap: wrap;
  justify-content: center;
}
.icon1 {
  margin-bottom: 40%;
}
.ext_links a {
  color:#193683;
}
.icon2 {
  margin-bottom: 18%;
}

}

@media (max-width: 920px) {
  .fourth_block {
    display: grid;
}

.fourth_block img {
  display: none;
}
.fourth_block_text {
  z-index: 10;
}
.car_button img {
  width: 40px;
}
.car_button {
  font-size: 12px;
}
.third_block {
  height: 383px;
  margin-top: -18px;
}
.second_block {
  margin-top: 15%;
}
#top_string {
  display: initial;
  height: 12px;
}
#mouse {
  display: none;
}
.mouse_or_string {
  padding-bottom: 22px;
  margin-top: 0;
}
.soc_icones {
  display: none;
}

}

@media (max-width: 769px) {
  .first_block h1 {
    font-size: 52px;
    line-height: 45px;
  }
  .first_block {
    padding-top: 30px;
  }
  .program_choise {
    display: grid;
  }
  #top_for_mob {
    max-width: 70px !important;
  }
  .program_choise img {
    max-width: 100%;
}
#btn1 {
  padding-top: 50px;
  padding-bottom: 30px;
  justify-content: left;
  font-size: 20px !important; 
}
#mBtn {
  margin-left: -16px;
}
.car_button img {
  width: 20px;
}
.third_block {
  height: 326px;
  margin-top: -11px;
}
#steklo {
  top: 11%;
  left: 49%;
}
#klimat {
  top: 22%;
  left: 40%;
}
.car_button {
  font-size: 8px;
}
.car_button_span {
  margin-left: -4px;
}
#lkp {
  top: 30%;
  left: 20%;
}
#plastik {
  top: 26%;
  left: 48%;
}
#kapot {
  bottom: 50%;
  top: auto;
}
}

@media (max-width: 569px) { 
  .third_block {
    height: 227px;
    margin-top: 45px;
}
#koleso {
  top: auto;
  bottom: 46%;
  left: 36%;
}
#lkp {
  top: auto;
  left: 18%;
  bottom: 67%;
}
#klimat {
  top: 15%;
  left: 39%;
}
#plastik {
  top: 22%;
  left: 47%;
}
.icon1 {
  height: 300px;
  width: 300px;
}
.ext_links img {
  max-height: 80px;
}
#p_koleso {
  right: 77%;
  top: -30%;
}
.icon2 {
  height: 300px;
  width: 300px;
}
.ext_links a {
  font-size: 12px;
  line-height: 12px;
}
#p_kuzov {
  right: 35%;
  top: -38%;
}
.two_programms {
  padding: 140px 0 0 0;
}
#p_lkp {
  right: -4%;
  top: -30%;
}
#p_plastic {
  right: -4%;
  top: 97%;
}
#p_steklo {
  right: 35%;
  top: 103%;
  z-index: 10000;
}
#p_kapot {
  right: 74%;
  top: 97%;
}
#btn2 img {
  max-width: 100px;
}
#btn2 {
  margin-top: 102px;
  margin-left: 43px;
  justify-content: center;
}
#mBtn2 {
  margin-left: -20px;
  font-size: 27px;
}
.ext_links2 img {
  max-height: 80px;
}
.ext_links2 a {
  font-size: 12px;
  line-height: 12px;
  color: #193683;
}
#p_tekstil {
  left: -10%;
  bottom: 88%;
}
#p_kondey {
  bottom: 88%;
  left: 80%;
}
#p_plast_in {
  left: 20%;
  bottom: 101%;
}
#p_kozha {
  bottom: 101%;
  left: 49%;
}
#btn3 {
  margin-top: 102px;
  margin-left: 43px;
  justify-content: center;
}
#mBtn3 {
  margin-left: -20px;
  font-size: 27px;
}
#btn3 img {
  max-width: 100px;
}
.icon3 {
  height: 300px;
  width: 300px;
  margin-top: 0;
}
.two_programms {
  margin-bottom: 0;
}
#mBtn4 {
  margin-left: -20px;
  font-size: 27px;
}
#btn4 img {
  max-width: 100px;
}
#btn4 {
  margin-top: 102px;
  margin-left: 43px;
  justify-content: center;
}
.second_block {
  margin-top: 32%;
}
#bubble2 {
  margin-top: 0;
  max-height: 268px;
}
.fifth_block {
  margin-top: -150px;
}
}

@media (max-width: 360px) { 


}