/* !-----------yaris*/

.header-card-img-head-yaris-entry{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 2rem;
}
.header-card-img-car-yaris-entry{
  width: 50%;
  height: 500px;
  margin: 1rem 0;
  overflow: hidden;
  padding-top: .5rem;
}
.card_img_model_yaris_entry_1{
  background-image: url(../imgs/yaris/4.webp);
  height: 80%;
  background-size: cover;
  background-position: center;
  width: 100%;
}
.card_title_yaris_entry_1{
  text-align: center;
  margin-bottom: 1rem;
}

@media (max-width: 640px) {
  .header-card-img-car-yaris-entry{
      width: 100%;
      height: 360px;
  }
  .card_img_model_yaris_entry_1{
      width: 100%;
      height: 300px;
  }
  section{
      padding: 0px 0;
  }
}


.colors_yaris_entry_1{
  display: flex;
  justify-content: center;
  align-items: center;
}

.yaris_color_1{
  background: rgb(170, 15, 23);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_2{
  background-color: rgb(14, 114, 173);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_3{
  background-color: rgb(191, 191, 191);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_4{
  background-color: rgb(56, 57, 60);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_5{
  background-color: rgb(0, 0, 0);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_6{
  background-color: rgb(255, 255, 255);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  cursor: pointer;
}

/* !-----------yaris sport*/
.card_img_model_yaris_entry_2{
  background-image: url(../imgs/yaris/sport_1.webp);
  height: 80%;
  background-size: cover;
  background-position: center;
  width: 100%;
}
.card_title_yaris_entry_2{
  text-align: center;
  margin-bottom: 1rem;
}

@media (max-width: 640px) {
  .header-card-img-car-yaris-entry{
      width: 100%;
      height: 360px;
  }
  .card_img_model_yaris_entry_2{
      width: 100%;
      height: 300px;
  }
  section{
      padding: 0px 0;
  }
}


.colors_yaris_entry_2{
  display: flex;
  justify-content: center;
  align-items: center;
}

.yaris_color_sport_1{
  background: rgb(170, 15, 23);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_sport_2{
  background-color: rgb(14, 114, 173);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_sport_3{
  background-color: rgb(191, 191, 191);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_sport_4{
  background-color: rgb(56, 57, 60);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_sport_5{
  background-color: rgb(0, 0, 0);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_sport_6{
  background-color: rgb(255, 255, 255);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  cursor: pointer;
}


/* !-----------yaris premium*/
.card_img_model_yaris_entry_3{
  background-image: url(../imgs/yaris/premium_1.webp);
  height: 80%;
  background-size: cover;
  background-position: center;
  width: 100%;
}
.card_title_yaris_entry_3{
  text-align: center;
  margin-bottom: 1rem;
}

@media (max-width: 640px) {
  .header-card-img-car-yaris-entry{
      width: 100%;
      height: 360px;
  }
  .card_img_model_yaris_entry_3{
      width: 100%;
      height: 300px;
  }
  section{
      padding: 0px 0;
  }
}


.colors_yaris_entry_3{
  display: flex;
  justify-content: center;
  align-items: center;
}

.yaris_color_premium_1{
  background: linear-gradient(-45deg, rgb(227, 228, 228), rgb(227, 228, 228) 49%, rgb(227, 228, 228) 49%, rgb(0, 0, 0) 51%, rgb(0, 0, 0) 51%);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_premium_2{
  background: linear-gradient(-45deg, rgb(170, 15, 23), rgb(170, 15, 23) 49%, rgb(170, 15, 23) 49%, rgb(0, 0, 0) 51%, rgb(0, 0, 0) 51%);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_premium_3{
  background: linear-gradient(-45deg, rgb(14, 114, 173), rgb(14, 114, 173) 49%, rgb(14, 114, 173) 49%, rgb(0, 0, 0) 51%, rgb(0, 0, 0) 51%);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_premium_4{
  background-color: rgb(227, 228, 228);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_premium_5{
  background-color: rgb(191, 191, 191);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_premium_6{
  background-color: rgb(56, 57, 60);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  margin-right: 1rem;
  cursor: pointer;
}
.yaris_color_premium_7{
  background-color: rgb(0, 0, 0);
  border: #ccc 1px solid;
  display: block;
  overflow: hidden;
  width: 39px;
  height: 39px;
  border-radius: 39px;
  cursor: pointer;
}