@import url('https://fonts.googleapis.com/css2?family=Kantumruy+Pro:ital,wght@0,100..700;1,100..700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Winky+Rough:ital,wght@0,300..900;1,300..900&display=swap');


.menu {
  display: flex;
  gap: 55px;
  list-style: none;
  margin: 0 auto;
  width: 777px;
}

.menu-link {
  text-decoration: none;
  /* без риски */
  text-transform: uppercase;
  color: mediumaquamarine;
  font-size: 19px;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}

.menu-link:hover {
  color: rgb(47, 0, 255);
}

.main-title {
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  text-transform: uppercase;
}

.second-title {
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  text-align: center;
  margin-top: 30px;
}

.main-text {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  text-indent: 9px;
  line-height: 22px;
}

.vaids-item {
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

.vaids-link {
  text-decoration: none;
}

.username {
  font-family: Arial, Helvetica, sans-serif;
}

.asked-ansver {
  font-family: "Roboto Condensed", sans-serif;
}

.birthday {
  font-family: cursive;
}

.store {
  text-decoration: none;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;

}

.container {
  width: 700px;
  margin: 0 auto;
}

.vaids-of-lego {
  width: 300px;
  margin: 0 auto;
  text-align: center;
  list-style: none;
  margin-bottom: 30px;
}

.main-stroctoor {
  margin-top: 15px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  margin-bottom: 15px;
}

.special {
  margin-top: 15px;
  margin-bottom: 15px;
  font-size: 20px;
}

.super-specisl {
  font-size: 23px;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

.focus-in-expand-fwd {
  animation: focus-in-expand-fwd 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@keyframes focus-in-expand-fwd {
  0% {
    letter-spacing: -0.5em;
    transform: translateZ(-800px);
    filter: blur(12px);
    opacity: 0;
  }

  100% {
    transform: translateZ(0);
    filter: blur(0);
    opacity: 1;
  }
}

.rotate-scale-up {
  animation: rotate-scale-up 2s linear both;
}

@keyframes rotate-scale-up {
  0% {
    transform: scale(1) rotateZ(0);
  }

  50% {
    transform: scale(2) rotateZ(180deg);
  }

  100% {
    transform: scale(1) rotateZ(360deg);
  }
}

.had {
  background-image: url("https://png.pngtree.com/background/20230610/original/pngtree-lego-bricks-that-are-put-in-a-pile-picture-image_3020983.jpg ");
}

.skin {
  margin-top: -22px;
}

.incide-img-title {
  font-size: 22px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: rgb(238, 255, 0);
  position: absolute;
  margin-left: 128px;
  margin-top: 30px;
}

.incide-img {
  /* колір шривту */
  position: absolute;
  color: rgb(238, 255, 0);
  font-family: "Kantumruy Pro", sans-serif;
  font-size: 14px;
  margin-left: 10px;
  display: block;
  margin-top: 87px;
}

.body {
  /* задній фон */
  animation: color-change-5x 8s linear infinite alternate both;
}

@keyframes color-change-5x {
  0% {
    background: #19dcea;
  }

  20% {
    background: #b22cff;
  }

  40% {
    background: #ea2222;
  }

  60% {
    background: #f5be10;
  }

  80% {
    background: #3bd80d;
  }

  100% {
    background: rgb(0, 110, 255);
  }
}

.chack {
  /*картинка по середині*/
  display: block;
  margin: 0 auto;
}

.footer-text {
  font-family: "Caveat", cursive;
  font-size: 20px;
}

.incide-img-two {
  margin-top: -333px;
  margin-left: -466px;
  font-size: 33px;
}

.relative {
  position: relative;
}

.incide-p {
  margin-left: 200px;
  font-size: 22px;
}

.incide-img-three {
  margin-top: -300px;
  margin-left: 777px;
  font-size: 24px;
}

.incide-p-two {
  margin-left: 877px;
  font-size: 18px;
}

.form-button {
  padding: 10px 15px;
  border: none;
  border-radius: 15px;
  background-color: rgb(0, 191, 255);
}

.color {
  width: 10px;
  height: 10px;
  display: inline-block;
}

.red {
  background-color: red;
}

.bllue {
  background-color: blue;
}

.green {
  background-color: green;
}

.yellow {
  background-color: yellow;
}

.container-two {
  display: flex;
  margin-left: 43px;
}

.three-photo {
  display: flex;

}

.text-and-three-photo {
  padding-top: 200px;
  margin-top: 96px;
}

.section-zoom {
  display: flex;
  margin-bottom: 53px;
}

.zoom {
  height: 332px;
  background-color: rgb(128, 10, 175);
  color: gold;
  padding: 20px;
}

.rotate {
  color: rgb(18, 2, 255);
  background-color: yellow;
  padding: 20px;
  margin-top: 1px;
  height: 254px;
}

.section-rotate {
  display: flex;
}

.up {
  position: absolute;
}

.history-title {
  background-color: rgb(80, 248, 189);
  font-size: 46px;
  font-family: "Lexend", sans-serif;
}

.history-map {
  display: block;
  margin: 0 auto;
}

.two-block {
  display: flex;
  margin-left: 121px;
}

.hard-img {
  margin-top: 2px;
}

.incide-img-four {
  margin-top: 113px;
  position: absolute;
  margin-left: 12px;
  font-size: 18px;
  font-family: "Kantumruy Pro", sans-serif;
  color: darkblue;
}

.incide-img-title-two {
  position: absolute;
  color: darkblue;
  font-size: 27px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  margin-left: 192px;
  margin-top: 29px;
}

.two-photo {
  margin-left: 48px;
}

.second-title-zoom {
  margin-top: 105px;
}

.img-rotate {
  height: 295px;
  margin-top: 1px;
}

.lego-img {
  display: block;
  margin: 0 auto;
}

.Intereting-photo {
  margin-left: 133px;
}

.three-phon-two {
  margin-left: 115px;
}

.google-store {
  display: flex;
  margin-top: -205px;
  position: absolute;
  margin-left: 131px;
}

.build-plan {
  margin-top: -386px;
  position: absolute;
  margin-left: 163px;
  font-size: 32px;
}

.build-plan-two {
  margin-top: -300px;
  position: absolute;
  font-size: 18px;
  margin-left: 131px;
}

.heart {
  width: 30px;
  height: 30px;
  background-color: rgb(218, 218, 218);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.product-img {
  background-color: white;
  width: 245px;
}

.product-rating {
  display: flex;
  gap: 15px;
  list-style: none;
  padding-left: 0;
}

.product_list {
  list-style: none;
  padding-left: 0;
  display: flex;
  gap: 20px;
  font-family: "Roboto", sans-serif;
}

.product-item {
  width: 300px;
  background-color: white;
  padding: 5px;
}

.product-name {
  text-decoration: none;
  color: black;
  background-color: white;
}

.product-price {
  margin-top: 47px;
}

.product {
  background-color: white;
  width: 250px;
}

.btn-bag {
  border-radius: 30px;
  padding: 16px;
  border: none;
  background-color: #f47d20;
}

.btn-bag:hover {
  cursor: pointer;
  background-color: #be580a;
}

.btn-bag:active {
  background-color: #8b420a;
}

.title_of_history {
  margin-top: 30px;
}

.second_second-title {
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  font-family: "Roboto", sans-serif;
  margin: 0px;
}

.text_area {
  padding: 10px;
}

.good_class_wrapper {
  margin: 0 auto;
  width: 200px;
  margin-bottom: 32px;
}

.good_class {
  text-decoration: none;
  background-color: aqua;
  padding: 10px;
  border-radius: 30px;
  font-family: "Roboto", sans-serif;
  margin: 0 auto;
  color: black;
}


table caption {
  text-align: center;
}

table {
  border-collapse: collapse;
  font-size: 14px;
}

table td {
  padding: 10px;
  border: 1px solid #2a2a2a;
  width: 100%;
}

.board {
  background-image: url(/img/919779.png);
  padding: 10px 20px 30px 20px;
  font-family: "Roboto", sans-serif;
  margin: 70px 50px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border-style: solid;
}

.species_namess {
  padding: 10px;
  border: 1px solid #2a2a2a;
  width: 100%;
  font-weight: 444;
  font-size: 32px;
}

.names {
  padding: 10px;
  border: 1px solid #2a2a2a;
  font-size: 23px;
}

.pieces {
  padding: 10px;
  border: 1px solid #2a2a2a;
  font-size: 23px;
}

.high_board {
  font-size: 22px;
}

.second_high_board {
  font-size: 22px;
}

.title {
  font-size: 28px;
  color: rgb(51, 50, 50);
}


.pane {
  display: none;
  margin-top: 8px;

}

.pane.is-active {
  display: block;
}

.controls {
  display: flex;
  gap: 8px;
}

.chack_one {
  position: absolute;
  margin-left: 414px;
}

.chack_two {
  position: absolute;
  margin-left: 761px;
}

.chack_three{
  margin-left: 570px;
}

.tabs{
font-family: "Winky Rough", sans-serif;
}