/* * { 
  border: 1px solid black; /* Красная граница для отладки */
/* } */ 

 /* header {
  border: 1px solid red;
  margin-top: 10px;
  margin-bottom: 10px;
}  */

/* div {
  border: 1px solid rgb(13, 146, 13);
}  */

/* nav {
  border: 1px solid orange;
} */

@font-face {
  font-family: 'Involve';
  src: 
    url('/Users/evgeniy.silov/Desktop/Сайт/шрифт для сайта/Involve-Regular.woff2') format('woff2'),
    url('/Users/evgeniy.silov/Desktop/Сайт/шрифт для сайта/Involve-Regular.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;  /* Не блокирует загрузку страницы */
}

@font-face {
  font-family: 'Involve';
  src: url('/Users/evgeniy.silov/Desktop/Сайт/шрифт для сайта/Involve-Bold.woff2') format('woff2'),
      url('/Users/evgeniy.silov/Desktop/Сайт/шрифт для сайта/Involve-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Involve Bold Oblique';
  src: url('Involve-BoldOblique.woff2') format('woff2'),
      url('Involve-BoldOblique.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Involve';
  src: url('Involve-Medium.woff2') format('woff2'),
      url('Involve-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
} 

@font-face {
  font-family: 'Involve Medium Oblique';
  src: url('Involve-MediumOblique.woff2') format('woff2'),
      url('Involve-MediumOblique.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Involve';
  src: url('Involve-SemiBold.woff2') format('woff2'),
      url('Involve-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Involve SemiBold Oblique';
  src: url('Involve-SemiBoldOblique.woff2') format('woff2'),
      url('Involve-SemiBoldOblique.woff') format('woff');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}


body {
  font-family: 'Involve', Arial, sans-serif;  /* Fallback на Arial, если Involve не загрузится */
  line-height: 1.5;
  color: #333;
  margin: 0;
}

.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;    /* Вертикальное выравнивание */
}

.logo {
  padding-top: 5px;
  padding-left: 20px;
}

.navigation {
  display: flex;
  justify-content: center; /* Горизонтальное выравнивание */
  align-items: center;    /* Вертикальное выравнивание */
  padding: 10px;
  gap: 20px;
}

.nav-link {
  color: inherit; /*наследует цвет текста от родителя */
  white-space: nowrap; /*запрещает перенос текста */
  display: flex;
  padding: 10px;
  gap: 30px;
}

.search-form {
  padding: 2px;
}

.no-underline {
  text-decoration: none; /* убирает подчёркивание в ссылке */
  color: inherit; /*наследует цвет текста от родителя */
  width: 100%;
  height: 100%;
  display: block;
}

/* Начало блока header с большой картинкой ФлораДома */

.flora-container {
  display: flex;
  /* width: 550px */
  justify-content: space-between;
  background-color: #F0E3D8;
 }

 .flora-subconteiner {
  display: flex;
  justify-content: center; /* Горизонтальное выравнивание */
  align-items: center;    /* Вертикальное выравнивание */
  margin: 30px;
 }

.flora-doma {
  width: 400px;
  height: auto;
  /* margin-right: auto; */
}

.flora-picture {
  margin-bottom: 0;
  margin-top: 0;
} 

/* Начало блока main про популярные */
.background-white {
  background-color: white;
}
.plants-section {
  margin-left: 30px;
  margin-right: 30px;
  margin-top: 0;
  padding-bottom: 50px;
  padding-top: 20px;
}

.plants-container {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  /* height: 250px; */
  /* padding: 10px; */
  margin-top: 10px;
  margin-bottom: 10px;
  gap: 20px;
}

.popular-plants {
  text-align: center;
  width: 170px;

}

/* .plant-card {
  max-height: 120px;
} */


.plant-image {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  border: 1px solid black;;
}

.plant-caption {
  margin: 0;
  padding: 0;
}

.background-gray {
  background-color: #F0E3D8;
}

.plants-section2 {
  margin-left: 30px;
  margin-right: 30px;
  margin-top: 0;
  padding-bottom: 50px;
  padding-top: 20px;
}


/* тут стили карточки */
.card-base {

}
.card {
  display: flex;
  justify-content: space-around; /* Горизонтальное выравнивание */
  align-items: center;    /* Вертикальное выравнивание */
  background-color: #F0E3D8;
}

.card-img {
}

.card-specifications {

}

.description-container {
  display: flex;
  justify-content: space-around;
  margin: 30px;
}

.description {

}
.advertisement {
  width: 300px;
  height: 100%;
  /*background-color: aquamarine;*/
}


/* здесь начинается каталог/справочник */

.catalog-container .letter{
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;

  /* flex-direction: column; */
}

/* .card-image {
  width: 500px;
  height: 500px;
} */

.letter {
  height: 1000px;
}

.list {
  display: flex;
  flex-wrap: wrap;
  min-height: auto;
}

.letter ul {
  list-style: none;
  padding: 10px;
  padding-left: 5px;

}

.alphabet {
  font-size: 40px;
  width: 35px;
  margin-top: 15px;

}
.list ul {
  width: 250px;
}

table {
  border: 2px solid black;
  border-collapse: collapse;
}
td {
  border: solid black;
  padding: 5px;
}