/*для отображения в строку даты создания материала и кол-ва просмотров*/
.article-info dd {
   padding: 0;
   display: inline-block;
   margin-right: 1em;
}

/*@media screen and (prefers-color-scheme: dark) {*/
/* для переопределения цветов, плагине Dark Magic */
:root {
   --website-color-1: #6A5ACD;
   --website-color-2: #D95F69;
   --cassiopeia-color-primary: var(--website-color-1) !important;
   --cassiopeia-color-link: var(--website-color-1) !important;
   --cassiopeia-color-hover: var(--website-color-2) !important;
   --cassiopeia-color-gradient-end: var(--website-color-1) !important;
   --cassiopeia-color-gradient-start: var(--website-color-2) !important;
}

.btn-primary {
   background-color: var(--website-color-1) !important;
}

.btn-primary:focus, .btn-primary:hover {
   background-color: var(--website-color-2) !important;
}

.back-to-top-link {
   color: --website-color-2/*white*/ !important;
}

#cf_1 { /* Convert Forms так же используют CSS переменные */
   --background-color: rgba(0, 0, 0, 0.9) !important;
}

h1,.h1,h2,.h2,h6,.h6 {
  color: purple;
}

body {
  background-color: #B0E0E6;
}

.image-container {
   display: grid; /* Включаем CSS Grid */
   grid-template-columns: 1fr;
   margin: 0px;
   margin-left: 0em;
   margin-right: auto;
   width: 100%;
   height: 50vh;
   gap: 10px; /* 10px Пространство между изображениями */
}

/*скрыть капчу
.grecaptcha-badge { 
  opacity: 0; 
  transition: opacity .5s; 
}

.grecaptcha-badge:hover { 
  opacity: 1;
}*/

/* Дополнительные стили для изображений */
.image-container img {
   width: 100%; /* Изображение занимает всю ширину своего контейнера */
   height: 90%; /*auto; *//* Высота подстраивается автоматически */
   margin: 0px;
   /* display: block;*/ /* Убирает лишние отступы под изображением */
}

.full-width-image-container {
   position: relative; 
   /* Позиционирование для наложения текста */
   /* margin: 0px;
    border: 1px solid #999999;
    background-color: #04AA6D;*/
   color: black !important;
   width: 100vw !important; /*width: 100%*/
   height: 90vh /*!important*/;
   /* не Полная высота экрана */
   margin-left: -2em;
   margin-right: 0em;
   display: block; /*inline-block*/
   block-size:auto;
   /* table-cell; vertical-align : middle;
   inline-block inline  */
   color: black !important;
   overflow: none; /*hidden  Скрывает все, что выходит за пределы контейнера */
}

.full-width-image {
   width: 100%; /* Картинка на всю ширину */
   height: 100%;
   /*max-inline-size: 100%;
     aspect-ratio: 2/1;
    object-position: top center;  */
   object-position: center center;
   block-size: auto;
   object-fit: contain;
}

.leftimg {
   float:left; /* Выравнивание по левому краю */
   margin: 7px 7px 7px 0; /* Отступы вокруг картинки */
   width: "132";
   height:"174";
}

.rightimg  {
   float: right; /* Выравнивание по правому краю  */ 
   margin: 7px 0 7px 7px; /* Отступы вокруг картинки */
   width: "132";
   height:"174";
}

.flex-container {
   display: flex;
   align-items: left; /* Выравнивает элементы по центру по вертикали */
}

.left.item-image {
   width: 100%;
   margin:0;
}
.left.item-image img {
   width: 100%;
}

.text-overlay {
   position: absolute; /* Позиционирование поверх картинки */
   top: 30%;
   left: 50%;
   transform: translate(-50%, -50%); /* Центрирование текста */
   text-align: center;
   /*block-size: auto;
     object-position: center center;*/
   color: black; /* white; /* Цвет текста */
   /* Другие стили, например, размер шрифта, фон и т.д. */
   font-size: 30px;
   background-color: none; /*lightblue; /* background color */
   /*box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);*/ /* Тень для лучшей читаемости */
}

.colors1 {
  --website-color-primary: 37, 143, 167;
  --website-color-hover: 242, 48, 48;
  --cassiopeia-color-primary: rgba(var(--website-color-primary),0.5);
  --cassiopeia-color-hover: rgb(var(--website-color-hover));
  --cassiopeia-color-link: rgb(var(--website-color-primary));
}
@media (max-width: 992px) {
  nav.navbar {order: -1;}
}

.button-primary {
/*padding: 3px 10px;
background: #6A5ACD;
color: #FFFFFF;*/
  background-color: #04AA6D;
  border: none;
  color: white;
  padding: 10px 42px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 11px;
  margin: 4px 2px;
  cursor: pointer;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 
  rgba(0,0,0,0.19); 
}

.contbtnimg {
  position: relative; width: 100%; max-width: 400px; 
} 
.contbtnimg img {
  width: 100%; height: auto; 
} 
.contbtnimg .btn {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);     background-color: #f1f1f1; 
  color: black; font-size: 8px; 
  padding: 10px 15px; 
  border: none; cursor: pointer; border-radius: 5px; 
  text-align: center; 
} 
.contbtnimg .btn:hover { 
  background-color: black; color: white; 
}

.btnanim {
   position: absolute; /* Позиционирование поверх картинки */
   top: 80%;
   left: 50%;
   transform: translate(-50%, -50%); /* Центрирование текста */
   text-align: center;
   padding: 10px 15px;
   font-size: 28px;
   cursor: pointer;
   text-align:center;
   text-decoration: none;
   outline: none;
   color: black;
   background-color: #04AA6D;
   border: none;
   border-radius: 10px;
   box-shadow: 0 2px #999;
}

.btnanim:hover {background-color: #3e8e41}

.btnanim:active {
   background-color: #3e8e41;
   box-shadow: 0 1px #666;
   /*transform: translateY(4px);*/
}

/* Медиазапрос для мобильных устройств (например, < 768px) */
@media (max-width: 768px) {
    .full-width-image-container {
        block-size: auto;
    }
    .text-overlay {
       font-size: 16px;
    }
    .btnanim {
      font-size: 13px;
    }
}

.text-sigplus-row {
   float: left;
   margin-right: 20px; /* Отступ слева от текста */
   margin-top: 20px; /* Отступ снизу margin-left: 50px; */
   text-align: justify;
    /*color: black; background-color: none;*/
   font-size: 18px;
   line-height: 2;
}

.text-sigplus-row img {
  margin: -5px 85px 0px 0px !important;
}