:root {
  --sec-font: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  --Red: #ef4836;
  --dark-red: #c0392b;
  --Black: #231f20;
  --gray: #bbbdc0;
  --dark-gray: #343538;
  --header_height: 148px;
  --light-grey: #f1f1f1;
}

@media screen and (max-width: 1279px) {
  :root {
    --header_height: 180px;
  }
}

@media screen and (max-width: 1023px) {
  :root {
    --header_height: 108px;
  }
}

* {
  box-sizing: border-box;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

body {
  font-family: solomon, sans-serif;
  scroll-behavior: smooth;
}

.btn {
  font-family: var(--sec-font);
  padding: 15px;
  text-transform: none;
}

a.btn {
  transition: all 0.3s ease;
}

.btn_white {
  color: white;
}

.btn_white:hover {
  color: var(--Black);
}

.btn_red {
  background-color: var(--Red);
  color: white !important;
}

.border-red {
  border: 1px solid var(--Red);
}

a.border-red:hover,
button.border-red:hover {
  border-color: var(--Black);
}

.border-white {
  border: 1px solid white;
}

a.border-white:hover,
button.border-white:hover {
  border-color: var(--Red);
}

.swiper {
  overflow: hidden;
  width: 100%;
}

.swiper-full {
  margin-left: -60px;
  margin-right: -60px;
  padding-left: 60px;
  padding-right: 60px;
  width: calc(100% + 120px);
}

.swiper-pagination {
  display: flex;
  gap: 10px;
  padding: 10px;
}

.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--gray);
  opacity: 1;
  transition: all 0.3s ease;
}

.swiper-pagination-bullet-active {
  background-color: white;
}

.swiper-pagination-clickable .swiper-pagination-bullet:hover {
  background-color: var(--Red);
  cursor: pointer;
}

@media screen and (max-width: 1279px) {
  .swiper-full {
    margin-left: -40px;
    margin-right: -40px;
    padding-left: 40px;
    padding-right: 40px;
    width: calc(100% + 80px);
  }
}

@media screen and (max-width: 767px) {
  .swiper-full {
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding-right: 16px;
    width: calc(100% + 32px);
  }
}

.color-red {
  color: var(--Red);
}

.color-white {
  color: white;
}

pre {
  padding: 20px;
  overflow-x: auto;
  border-radius: 8px;
  font-size: 16px;
  border: 1px solid var(--Red);
}

.panel__close {
  z-index: 10;
}

.theme-white {
  color: white;
}

.theme-white .input {
  color: white;
  border-bottom: 1px solid white;
}

.theme-white .input::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

.theme-white label,
.theme-white .float1--focused .float1__label {
  color: white;
}

.theme-white label.checkbox [type="checkbox"]:not(:checked) + span:before {
  border: 1px solid white;
}

.js-close-popup * {
  pointer-events: none;
}

.file-input__wrapper {
  display: flex;
  gap: 20px;
  align-items: center;
}

.file-input__label {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  font-family: var(--sec-font);
  letter-spacing: 7%;
  padding: 15px;
  background-color: transparent;
  color: black;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  white-space: nowrap;
  border: 1px solid #bbbdc0;
}

.file-input__label svg path {
  stroke: currentColor !important;
  transition: all 0.3s ease;
}

.file-input__label:hover,
.file-input__label:focus {
  background-color: var(--Red);
  color: white;
}

.file-input__label_selected {
  background-color: var(--dark-red);
  color: white;
}

.file-input__field {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.file-input__text {
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 3%;
}

.nowrap {
  white-space: nowrap;
}
