@charset "UTF-8";
*,
::before,
::after {
  box-sizing: border-box;
}

/**
 Убираем внутренние отступы слева тегам списков,
 у которых есть атрибут class
*/
:where(ul, ol):where([class]) {
  padding-left: 0;
  list-style: none;
}

/**
 Убираем внешние отступы body и двум другим тегам,
 у которых есть атрибут class
*/
body,
:where(blockquote, figure):where([class]) {
  margin: 0;
}

/**
 Убираем внешние отступы вертикали нужным тегам,
 у которых есть атрибут class
*/
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
dl {
  margin-block: 0;
}

:where(dd[class]) {
  margin-left: 0;
}

:where(fieldset[class]) {
  margin-left: 0;
  padding: 0;
  border: none;
}

/**
 Убираем стандартный маркер маркированному списку,
 у которого есть атрибут class
*/
:where(ul[class]) {
  list-style: none;
}

:where(address[class]) {
  font-style: normal;
}

/**
 Обнуляем вертикальные внешние отступы параграфа,
 объявляем локальную переменную для внешнего отступа вниз,
 чтобы избежать взаимодействие с более сложным селектором
*/
p {
  --paragraphMarginBottom: 12px;
  margin-block: 0;
}

/**
 Внешний отступ вниз для параграфа без атрибута class,
 который расположен не последним среди своих соседних элементов
*/
p:where(:not([class]):not(:last-child)) {
  margin-bottom: var(--paragraphMarginBottom);
}

/**
 Упрощаем работу с изображениями и видео
*/
img,
video {
  display: block;
  max-width: 100%;
  height: auto;
}

/**
 Наследуем свойства шрифт для полей ввода
*/
input,
textarea,
select,
button {
  font: inherit;
}

html {
  /**
   Пригодится в большинстве ситуаций
   (когда, например, нужно будет "прижать" футер к низу сайта)
  */
  /**
   Убираем скачок интерфейса по горизонтали
   при появлении / исчезновении скроллбара
  */
  scrollbar-gutter: stable;
}

/**
 Плавный скролл
*/
html,
:has(:target) {
  scroll-behavior: smooth;
}

body {
  /**
   Пригодится в большинстве ситуаций
   (когда, например, нужно будет "прижать" футер к низу сайта)
  */
  min-height: 100%;
  /**
   Унифицированный интерлиньяж
  */
  line-height: 1.5;
}

/**
 Нормализация высоты элемента ссылки при его инспектировании в DevTools
*/
a:where([class]) {
  display: inline-flex;
}

/**
 Курсор-рука при наведении на элемент
*/
button,
label {
  cursor: pointer;
}

/**
 Приводим к единому цвету svg-элементы
 (за исключением тех, у которых уже указан
 атрибут fill со значением 'none' или начинается с 'url')
*/
:where([fill]:not([fill=none],
[fill^=url])) {
  fill: currentColor;
}

/**
 Приводим к единому цвету svg-элементы
 (за исключением тех, у которых уже указан
 атрибут stroke со значением 'none')
*/
:where([stroke]:not([stroke=none],
[stroke^=url])) {
  stroke: currentColor;
}

/**
 Чиним баг задержки смены цвета при взаимодействии с svg-элементами
*/
svg * {
  transition-property: fill, stroke;
}

/**
 Приведение рамок таблиц в классический 'collapse' вид
*/
:where(table) {
  border-collapse: collapse;
  border-color: currentColor;
}

/**
 Удаляем все анимации и переходы для людей,
 которые предпочитают их не использовать
*/
@font-face {
  font-family: var(--font-main);
  src: url("../fonts/PublicSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: var(--font-main);
  src: url("../fonts/PublicSans-Light.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: var(--font-main);
  src: url("../fonts/PublicSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: var(--font-main);
  src: url("../fonts/PublicSans-ExtraBold.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: var(--font-main);
  src: url("../fonts/PublicSans-MediumItalic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}
:root {
  --font-main: "Public Sans", sans-serif;
  --max-width: 1920px;
  --background: linear-gradient(180deg, #390339 0%, #6D046D 100%);
  --background-head: rgba(29, 13, 13, 1);
  --background-foot: #0B0B0B;
  --text: #FFFFFF;
  --background-block: #420342;
  --color-text: #972AC5;
  --button: linear-gradient(180deg, #7825B3 0%, #A02BCB 50%, #7B25B2 100%);
  --button-hover: linear-gradient(180deg, #B04000 0%, #FD9402 47%, #A74300 95%);
  --button-active: linear-gradient(180deg, #AC242F 0%, #F44D50 47%, #AC2426 95%);
  --pop-up-background: rgba(255, 140, 0, 1);
  --pop-up-button: linear-gradient(180deg, #FFBB00 0%, #EFA700 47%, #C76E00 100%);
  --pop-up-button-active: linear-gradient(180deg, #D74100 0%, #FF9148 47%, #D74100 95%);
  --grey-text: rgba(51, 51, 51, 1);
  --background-mb: linear-gradient(180deg, #3C0E55 0%, #841FBB 100%);
  --background-png: url("../img/Frame433.png");
  --sort-svg: url("../img/Frame424.svg");
  --sort-arrow-down: url("../img/list.svg");
  --sort-arrow-up: url("../img/list2.svg");
  --radio-off: url("../img/radio2.svg");
  --radio-on: url("../img/radio.svg");
  --flag-green: url("../img/flag.svg");
  --h3-img: url("../img/bullet.png");
  --bg2: url("../img/Layer_1.png");
}

html {
  font-size: 20px;
  font-family: var(--font-main);
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 800px) {
  html {
    font-size: 16px;
  }
}

header {
  display: flex;
  width: 100%;
  background-color: var(--background-head);
  position: relative;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 64px;
  line-height: 40px;
  height: 100px;
}
@media (max-width: 820px) {
  header {
    font-weight: 900;
    font-size: 24px;
    line-height: 64px;
    height: 68px;
  }
}

a {
  text-decoration: none;
  color: var(--text);
}

body {
  display: flex;
  max-width: 1920px;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  background: var(--background);
  color: var(--text);
  margin: 0;
}

section {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 15%;
}
@media (max-width: 1770px) {
  section {
    padding: 0 10%;
  }
}
@media (max-width: 1550px) {
  section {
    padding: 0 5%;
  }
}
@media (max-width: 850px) {
  section {
    padding: 0 30px;
  }
}

img {
  display: inline-block;
}

h1 {
  font-weight: 900;
  font-size: 48px;
  line-height: 64px;
  text-align: center;
  margin-bottom: 12px;
}
@media (max-width: 820px) {
  h1 {
    margin-bottom: 30px;
    font-weight: 900;
    font-size: 20px;
    line-height: 27px;
    text-align: center;
  }
}

h3 {
  padding-left: 25px;
  background-image: var(--h3-img);
  background-repeat: no-repeat;
  background-position: left center;
  align-self: flex-start;
  font-weight: 700;
  font-size: 24px;
  line-height: 28.2px;
  margin-bottom: 20px;
}

h4 {
  margin-bottom: 20px;
}

p:where(:not([class])) {
  max-width: 778px;
  margin-bottom: 20px;
}

table {
  max-width: 496px;
  border-collapse: collapse;
  text-align: left;
  width: 100%;
}

th {
  background-color: rgb(69, 3, 93);
  color: white;
  padding: 10px;
}

td {
  padding: 10px;
}

footer {
  background-color: var(--background-foot);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 18.8px;
  color: rgb(130, 130, 130);
  padding: 34px 0;
}

footer div {
  display: flex;
  flex-wrap: wrap;
  min-width: 200px;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 915px) {
  footer div {
    padding-left: 20px;
    padding-right: 20px;
  }
}

ol {
  margin-bottom: 30px;
}

ul:where(:not([class])) {
  margin-bottom: 20px;
}

table {
  margin-bottom: 20px;
}

@media (min-width: 1250px) {
  .bg2 {
    background-image: var(--bg2);
    background-repeat: no-repeat;
    background-position: right -110px;
  }
}

.inf-dark {
  background-color: var(--background-block);
  align-items: start;
  padding-top: 40px;
  padding-bottom: 40px;
  position: relative;
  overflow-x: hidden;
  overflow-y: visible;
}

.inf {
  align-items: start;
  padding-top: 40px;
  padding-bottom: 40px;
}

.item__button {
  grid-area: button;
  font-weight: 800;
  font-size: 24px;
  line-height: 24px;
  background: var(--button);
  height: 74px;
  align-self: center;
  border: 8px solid rgba(255, 255, 255, 0.055);
  border-radius: 10px;
  color: white;
  max-width: 305px;
  width: 100%;
  justify-self: end;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px 0;
}
@media (max-width: 1250px) {
  .item__button {
    height: 49px;
    justify-self: center;
  }
}
@media (max-width: 650px) {
  .item__button {
    max-width: 100%;
  }
}

.item__button:hover {
  background: var(--button-hover);
}

.item__button:active {
  background: var(--button-active);
}

.pop-but-div {
  display: flex;
  justify-content: stretch;
  align-items: center;
  gap: 10px;
}

.pop-up__button {
  background: var(--pop-up-button);
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
  color: white;
  width: 100%;
  height: 52px;
  border: 8px solid var(--pop-up-button-background);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
@media (max-width: 450px) {
  .pop-up__button {
    height: auto;
  }
}
@media (max-height: 820px) {
  .pop-up__button {
    height: auto;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 5px;
  }
}

.pop-up__button:hover {
  background: var(--button-hover);
}

.pop-up__button:active {
  background: var(--pop-up-button-active);
}

.vio {
  background: var(--button);
  border: 8px solid rgba(255, 255, 255, 0.055);
}

.vio:hover {
  background: var(--button-hover);
}

.vio:active {
  background: var(--button-active);
}

.close-modal {
  position: absolute;
  top: 20px;
  right: 20px;
}

.item__img {
  grid-area: img;
  border-radius: 10px;
  width: 305px;
  height: 182px;
  object-fit: contain;
  background-color: black;
}
@media (max-width: 1250px) {
  .item__img {
    width: 179px;
    height: 89px;
  }
}

.grey {
  background-color: #20242C;
}

.gold {
  background-color: #B19661;
}

.blue {
  background-color: #154267;
}

.green {
  background-color: #242F16;
}

.dark-blue {
  background-color: #020A21;
}

.light-grey {
  background-color: #333333;
}

.payout {
  background-color: #05426F;
}

.paypal {
  background-color: #154267;
}

.slots {
  background-color: black;
}

.bg-img {
  position: absolute;
  top: -220px;
  right: -40px;
  transform: rotate(40deg);
}
@media (max-width: 1200px) {
  .bg-img {
    display: none;
  }
}

.modal {
  display: none; /* Скрываем по умолчанию */
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7); /* Полупрозрачный черный фон */
  justify-content: center;
  align-items: center;
}

/* Содержимое модального окна */
/*.modal-content {
  background-color: white;
  color: var(--grey-text);
  font-weight: 600;
  font-size: 20px;
  line-height: 23.5px;
  padding: 20px;
  border-radius: 10px;
  border: 6px solid var(--pop-up-background);
  text-align: center;
  max-width: 417px;
  box-shadow: 2px 0px 10px 0px rgba(0, 0, 0, 0.6);
}*/
.modal-content {
  background-color: white;
  color: var(--grey-text);
  font-weight: 600;
  font-size: 18px; /* немного уменьшаем размер шрифта */
  line-height: 21px;
  padding: 15px; /* уменьшаем внутренние отступы */
  border-radius: 8px; /* немного меньше радиус */
  border: 4px solid var(--pop-up-background); /* тоньше рамка */
  text-align: center;
  max-width: 90%; /* адаптивная максимальная ширина */
  max-height: 80vh; /* максимальная высота – 80% от высоты окна браузера */
  overflow-y: auto; /* если содержимого больше – появляется вертикальный скролл */
  box-shadow: 2px 0px 10px 0px rgba(0, 0, 0, 0.6);
}

.warn {
  margin-bottom: 20px;
}

/* Стили для модального окна сбора куки */
.cookie-modal {
  display: none; /* Скрываем по умолчанию */
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: white;
  color: var(--grey-text);
  border: 6px solid var(--pop-up-background);
  padding: 20px;
  padding-top: 45px;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  max-width: 417px;
  text-align: center;
  z-index: 10;
}
@media (max-width: 450px) {
  .cookie-modal {
    bottom: 5px;
    right: 30px;
    margin-left: 30px;
  }
}

/* Стили для модального окна предложения */
.offer-modal {
  display: none; /* Скрываем по умолчанию */
  background-color: var(--pop-up-background);
  border: 1px solid #ccc;
  padding: 44px 10px 10px 10px;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  max-width: 417px;
  min-width: 379px;
  z-index: 10;
  position: relative;
}
@media (min-aspect-ratio: 1/1) {
  .offer-modal {
    max-width: none;
    max-width: 1266px;
  }
}
@media (max-width: 450px) {
  .offer-modal {
    /*  margin-left: 30px; */
    /*  min-width: 330px;
      align-self: center;
    }*/
  }
  .offer-modal .modal-content {
    max-width: 90%;
    font-size: 16px;
    padding: 10px;
  }
}

.modal-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 8px;
}
@media (max-width: 450px) {
  .modal-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
}
@media (min-aspect-ratio: 1/1) {
  .modal-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
    justify-content: stretch;
    align-items: stretch;
  }
}

.pop-top {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  border-radius: 15px;
  background-color: white;
  justify-content: stretch;
  align-items: center;
  min-height: 188px;
}
@media (max-width: 450px) {
  .pop-top {
    min-height: 0;
    gap: 5px;
    padding: 5px;
  }
}
@media (max-height: 820px) {
  .pop-top {
    min-height: 0;
    gap: 5px;
    padding: 5px;
  }
}
@media (min-aspect-ratio: 1/1) {
  .pop-top {
    min-height: 221px;
    justify-content: end;
  }
}

.pop-top:nth-child(3) {
  grid-column: 1/3;
}
@media (max-width: 450px) {
  .pop-top:nth-child(3) {
    grid-column: auto;
  }
}

.pop-top__img-div {
  border-radius: 10px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: black;
}

.pop-top img {
  border-radius: 10px;
  height: 89px;
}
@media (max-width: 450px) {
  .pop-top img {
    max-height: 89px;
    height: auto;
  }
}
@media (max-height: 820px) {
  .pop-top img {
    max-height: 89px;
    height: auto;
  }
}
@media (min-aspect-ratio: 1/1) {
  .pop-top img {
    min-height: 182px;
    justify-content: end;
  }
}

.pop-top__bonus {
  color: black;
  margin: 0;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  text-align: left;
  align-self: flex-start;
}
@media (max-height: 820px) {
  .pop-top__bonus {
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 5px;
  }
}

.pop-top__img-div1 {
  border-radius: 10px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #000000;
}

.pop-top__img-div2 {
  border-radius: 10px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #000000;
}

.top-off {
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;
  margin-bottom: 10px;
}
@media (max-height: 820px) {
  .top-off {
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 5px;
  }
}

.modal h2 {
  font-weight: 800;
  font-size: 24px;
  line-height: 24px;
  color: rgb(51, 51, 51);
  margin-bottom: 10px;
}

.close-modal {
  font-size: 40px;
  cursor: pointer;
}

.custom-select {
  position: relative;
  width: 380px;
  align-self: flex-start;
  display: flex;
  gap: 10px;
  align-items: flex-end;
}

.custom-select-text {
  font-weight: 400;
  font-size: 20px;
  display: block;
  text-wrap: nowrap;
}

.select-selected {
  background-color: #ffffff;
  color: var(--grey-text);
  padding: 7px 10px;
  cursor: pointer;
  background-image: var(--sort-svg), var(--sort-arrow-down);
  background-repeat: no-repeat, no-repeat;
  background-position: left center, right center;
  text-align: center;
  border-radius: 10px;
  font-weight: 500;
  font-size: 20px;
  line-height: 23.5px;
  width: -webkit-fill-available;
}

.select-selected--active {
  background-image: var(--sort-svg), var(--sort-arrow-up);
}

.select-items {
  display: none;
  position: absolute;
  background-color: #ffffff;
  z-index: 99;
  width: 210px;
  margin-left: 120px;
  margin-top: 0px;
  border-radius: 10px;
  color: rgb(130, 130, 130);
  padding: 15px;
  font-weight: 500;
  font-size: 20px;
  line-height: 23.5px;
  top: 0px;
}

.select-items div {
  padding-left: 30px;
  cursor: pointer;
  border-radius: 5px;
  background-image: var(--radio-off);
  background-repeat: no-repeat;
  background-position: left center;
}

@media (max-width: 500px) {
  .custom-select {
    display: flex;
    width: 100%;
    gap: 5px;
  }
  .select-selected {
    width: 100%;
  }
  .select-items {
    top: 35px;
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
    margin-left: 0;
  }
}
.select-item--active {
  background-image: var(--radio-on) !important;
}

.select-items div:not(:last-child) {
  margin-bottom: 10px;
}

.select-items div:hover {
  background-color: #ddd;
}

.logo {
  margin: 0 16px;
}
@media (max-width: 820px) {
  .logo {
    height: 46px;
    margin: 0 8px;
  }
}

.top-block {
  width: 100%;
  display: flex;
  flex-direction: column;
  background-image: var(--background-png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  align-items: center;
  padding: 26px 30%;
  margin-bottom: 11px;
}
@media (max-width: 1205px) {
  .top-block {
    padding: 30px;
    background-image: none;
    background: var(--background-mb);
  }
}

.top-block__txt {
  max-width: 673px;
  background-color: rgba(17, 16, 16, 0.5);
  backdrop-filter: blur(4px);
  padding: 10px;
  text-align: center;
  font-weight: 500;
  font-size: 24px;
  line-height: 24px;
  text-align: center;
}

.top-casinos {
  width: 100%;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin-bottom: 116px;
}
@media (max-width: 820px) {
  .top-casinos {
    margin-top: 11px;
    margin-bottom: 61px;
  }
}

.bonus {
  display: none;
}

.com {
  display: none;
}

.top-casinos__item {
  width: 100%;
  background-color: #ffffff;
  padding: 20px;
  border-radius: 15px;
  color: var(--grey-text);
}
@media (max-width: 1250px) {
  .top-casinos__item {
    padding: 10px;
  }
}

.top-casinos__item:not(:last-child) {
  margin-bottom: 20px;
}

.item__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 1fr 2fr 1fr auto;
  gap: 10px;
  grid-template-areas: "img bonus bonus rating" "img about adventages button" "cas-name stat stat button" "bottom bottom bottom bottom";
}
@media (max-width: 1250px) {
  .item__grid {
    grid-template-columns: 0.6fr 0.4fr;
    grid-template-rows: auto 1fr 1fr auto 1fr auto auto;
    grid-template-areas: "img rating" "bonus bonus" "adventages adventages" "stat stat" "cas-name cas-name" "about about" "button button" "bottom bottom";
  }
}

.item__bonus {
  grid-area: bonus;
  font-weight: 700;
  font-size: 32px;
  line-height: 30px;
}
@media (max-width: 1250px) {
  .item__bonus {
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
  }
}

.item__about {
  grid-area: about;
  padding-top: 30px;
}
@media (max-width: 1250px) {
  .item__about {
    padding-top: 10px;
    margin-bottom: 10px;
  }
}

.item__about {
  position: relative;
}

.item__about__text {
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  border-left: 1px solid rgb(79, 79, 79);
  padding-left: 11px;
  overflow: hidden;
  transition: 0.3s ease;
  position: relative;
  max-height: 54px;
}

.item__about__text.has-overflow::after {
  content: "Show more";
  display: inline;
  color: var(--color-text);
  cursor: pointer;
  font-size: 16px;
  background: rgb(255, 255, 255);
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.4991246499) 0%, rgb(255, 255, 255) 20%);
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 0 15px;
  transition: 0.3s ease;
}

.item__about__text.expanded {
  max-height: none;
  transition: 0.3s ease;
}

.item__about__text.expanded::after {
  content: "Hide";
  position: static;
  padding: 0;
  transition: 0.3s ease;
}

.rate-inf {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-left: 18px;
}

.rate-inf span {
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
}

.huge-num {
  font-weight: 600;
  font-style: italic;
  font-size: 32px;
  line-height: 22px;
}

.rate-amount {
  font-weight: 400;
  font-style: italic;
  font-size: 18px;
  line-height: 16px;
}

.stars {
  display: flex;
}
@media (max-width: 1250px) {
  .stars {
    margin-bottom: 6px;
  }
}

.star {
  height: 31.8px;
}
@media (max-width: 1250px) {
  .star {
    height: 20px;
  }
}

.star:not(:last-child) {
  margin-right: 10px;
}
@media (max-width: 1250px) {
  .star:not(:last-child) {
    margin-right: 4px;
  }
}

.item__stat-ul {
  grid-area: stat;
  display: flex;
  justify-content: space-between;
  padding-right: 4%;
}
@media (max-width: 1250px) {
  .item__stat-ul {
    padding-right: 0;
  }
}

.item__stat-ul li {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgb(200, 200, 200);
  border-radius: 8px;
  width: 32.4%;
  height: 47px;
  padding: 2px;
}
@media (max-width: 1250px) {
  .item__stat-ul li {
    height: auto;
  }
}

.stat-name {
  margin-bottom: 0;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
}
@media (max-width: 1250px) {
  .stat-name {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
  }
}

.stat-bold {
  font-weight: 700;
  font-size: 20px;
  line-height: 20px;
}
@media (max-width: 1250px) {
  .stat-bold {
    font-weight: 700;
    font-size: 18px;
    text-align: center;
    line-height: 20px;
  }
}

.item__name {
  grid-area: cas-name;
  font-weight: 700;
  font-size: 24px;
  line-height: 20px;
  display: flex;
  align-items: center;
}

.item__adv-ul li {
  padding-left: 25px;
  font-weight: 400;
  font-size: 16px;
  line-height: 20px;
  display: flex;
  align-items: center;
}
@media (max-width: 1250px) {
  .item__adv-ul li {
    line-height: 16px;
  }
}

.item__adv-ul__li__img {
  display: flex;
  display: block;
  margin-right: 10px;
}

.item__adv-ul {
  grid-area: adventages;
  padding-top: 27px;
}
@media (max-width: 1250px) {
  .item__adv-ul {
    padding-top: 10px;
  }
}

.item__adv-ul__li__text {
  display: block;
}

.item__bottom-text {
  grid-area: bottom;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  padding-top: 9px;
  border-top: 1px solid rgb(178, 173, 173);
  color: rgb(130, 130, 130);
}
@media (max-width: 1250px) {
  .item__bottom-text {
    padding-top: 5px;
  }
}

.item__grid-second {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 0.8fr 1fr 1fr 1fr;
  gap: 10px;
  grid-template-areas: "img cas-name cas-name rating" "img stat stat rating" "img about adventages button" "img about adventages button";
}
@media (max-width: 1250px) {
  .item__grid-second {
    grid-template-columns: 0.6fr 0.4fr;
    grid-template-rows: auto;
    gap: 10px;
    grid-template-areas: "img rating" "cas-name cas-name" "adventages adventages" "stat stat" "about about" "button button";
  }
}

@media (max-width: 1250px) {
  .item__grid-second .item__stat-ul {
    margin-bottom: 5px;
  }
}

.logo-footer {
  margin-right: 20px;
  margin-bottom: 30px;
}

.mini-logos {
  margin-bottom: 20px;
}

.foot-part {
  display: flex;
}
@media (max-width: 915px) {
  .foot-part {
    flex-direction: column;
  }
}

.pink {
  background-color: rgba(255, 255, 255, 0.07);
}

.margin {
  margin-bottom: 20px;
  list-style: disc;
  padding-left: 20px;
}

/*# sourceMappingURL=style.css.map */