/*-------------------панель на
вигации -------------------------*/ 
 /* работает и для  меню header и для меню футер, т.к. используется 
 одно и тоже меню "navbar-nav" и одни и теже хуки */
  ul.navbar-nav { 
   display:flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
#footer-nav ul.navbar-nav {
  margin-left: 20px;
}
.navbar-text {
 color: var(--bs-info);
 color: #0d6efd;
 font-size: 1.1em;
 }
 .navbar-nav a {
  padding-top: 0px;
  padding-bottom: 0px;
  font-size: 1.1em;  
 } 
 .myactive a  {
  color: var(--bs-navbar-active-color);  
  font-weight: 500;
 }
/*--------------------------------------------------------------
Hero-img
--------------------------------------------------------------*/
body {
 /* border: 1px solid red;*/
 
}
/*html, body { height: 100vh;}*/

 
#major .hero-img,
#contactPage .hero-img,
#interesting .hero-img, 
#humor .hero-img,
#mansion .hero-img,
.hero-img
{
   background-size: cover;
 /* background-repeat: no-repeat;*/
  height: 100vh;  
  padding-top: 35vh;
 padding-bottom: 9vh;
  /*padding-bottom: 20vh;*/
  display: flex;
 justify-content: center; }
.hero-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
    align-content: flex-end;
    padding-bottom: 60px;  
    background: none;
    flex-wrap: nowrap;       
     }
.hero-slogan {
  animation-name: fadeIn;
  animation-duration: 3s;
  animation-fill-mode: forwards;
  animation-delay: 1s;
  opacity: 0;
  justify-content: center;  
   background: none;  
   width: 100%;
}
/* 
 Назначаем одной из групп в обложке дополнительный класс
и корректируем текст в slog. id в теге body отменяем */
.about .slog {
            color: darkmagenta;
            text-shadow: -1px 1px 0px darkorange;
 }
 .nature .slog {
           color: white;
            text-shadow: -2px 2px 0px green;
 }
 .major .slog {
           color: white;
            text-shadow: -1px 1px 0px blue;
 }
 .mansion .slog {
  text-shadow: -2px 2px 0px green;
 }
 /*  назначаем дополнительный клас всей навигации и 
 дополнительный класс пункту меню, чтобы выделить текущий пункт меню
 белым цветом */
 .interesting .interesting {
  color: white;
 }
 .contact .contact,
 .nature .nature,
 .about .about,
 .major .major,
 .mansion .mansion {
  color: white;
 }
 .slog { 
  text-align: left;
  font-weight: 500; 
 }
 @media (min-width: 767px) {
  .slog {
     text-align:center;
    }
}
  
.hero-btn {
   text-align: center;  
  width: 95vw;
  padding: 0px;
  margin: 0px;
  display: flex;
  justify-content: center;  
 }
 .mybtn > * {
   padding: 0px;
  margin: 0px;
  width:95%;
  padding-left: 48px;
  padding-right: 48px;
  padding-bottom: 10px;
  padding-top: 10px;
  font-family: Arial, Helvetica, sans-serif;
 background-color:var(--bs-primary);
 }
.mybtn > *:hover {
 background-color:var(--bs-link-hover-color);     
}
@keyframes fadeIn {
from { opacity: 0; }
   to { opacity: 1;
  /* transform: scale(1.2);*/
   font-size: 1.5rem;
  }
 }
/*@media (max-width: 768px) {
  .hero-slogan {
    font-size: 0.7rem;
  } 
}*/
/** расширяем надпись на обертке на всю ширину страницы *******/
/* если используем 1-ой способ расширения обертки  ************/
/*.wp-block-cover {
    padding: 0px;  
}
.wp-block-cover >* {
    padding: 0px;       
}
  .hero-wrap {   
   width: 100%;
 } */
/**************************************************************/
/*****  если используется 2-ой способ расширения обертки ******/
.entry-content {
  padding: 0px; 
}
.entry-content >* {
    padding: 0px;         
}
/*--------------------------------------------------------------
# Global Sections
--------------------------------------------------------------*/
section,
.section {
  color: var(--default-color);
  background-color: var(--background-color);
  padding: 20px 0;
  scroll-margin-top: 100px;
  overflow: clip;
 }

@media (max-width: 1199px) {

  section,
  .section {
    scroll-margin-top: 66px;
  }
}

/*--------------------------------------------------------------
# Gallery Section
--------------------------------------------------------------*/
.gallery {
  padding-top: 0px;
  margin-top: 10px;
}
.gallery .gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  display: flex;
 /* background-color: #000000;*/
 
 }

.gallery .gallery-item img {
  transition: 0.3s;
  
 }
.gallery .gallery-item:hover img {
  transform: scale(1.1);
  opacity: 0.6;
   
}
/*#nature  .gallery .gallery-item a, #mansion .gallery .gallery-item a,
#interesting .gallery .gallery-item a, #about .gallery .gallery-item a {
  display: flex
}  */
.gallery .gallery-item a {
 text-decoration: none;
 display: flex;
   }

/******************************************************************/
/*** добавляем свойства класса gallery-item к тегу figure 
/* генерируемогу wordpress при вставке изображения             ***/
section#gallery figure {
 height: 100%; 
    position: relative;
  overflow: hidden;
  border-radius: 10px;
  display: flex;
}

/*--------------------------------------------------------------
# Секция О нас
--------------------------------------------------------------*/
.main-about {
background: #ebead5;
padding-bottom: 0px;
color:#2b4258; 
color: color-mix(in srgb, #212529, transparent 20%);
margin-bottom: 0px;  
}
.textabout {
  font-weight: 500; 
  margin-bottom: 0px;
}  
.textabout p {
  text-indent: 3em;  
}
.main-about .fst-italic {
   font-size: 1.1em;
}  
.main-about h2 {
  font-weight:600;
  font-size: 25px; 
}

.main-about h3 {
  font-weight: 700;
  font-size: 23px;  
}
 /*#about h2 {
  font-weight:600;
  font-size: 25px;  
} */
 #about img {
            margin-top: 30px;
  }
.archi img {
   max-width: 100%;
   height: auto;
   border-top-left-radius: var(--bs-border-radius-pill) !important;
   border-top-right-radius: var(--bs-border-radius-pill) !important;
   border-bottom-right-radius: var(--bs-border-radius-xxl) !important;
   border-bottom-left-radius: var(--bs-border-radius-xxl) !important;
}  
.musia img {
  max-width: 100%;
  height: auto;
  border-radius: 50% !important;
}  

/*****************  секция усадьба *************************************/
  .gdesc-open .gslide-media {
            opacity: 1;
        }

        .glightbox-clean .gslide-desc {
            text-align: justify;
        }

        .glightbox-container .gdesc-inner {
            padding-bottom: 8px;
            padding-top: 8px;
        }

        .glightbox-mobile .glightbox-container .gdesc-inner {
            padding-bottom: 30px;
            padding-top: 22px;
        }

        .glightbox-clean .gslide-desc {
            font-size: 1em;
        }

        .glightbox-clean .gslide-desc .title {
            margin-bottom: 1px;
            color: #000;
            font-weight: 600;
        }

        .glightbox-mobile .glightbox-container .gslide-desc {
            color: white;
        }

        .glightbox-mobile .glightbox-container .gslide-desc .title {
            color: white;
            margin-bottom: 19px;
            font-weight: normal;
        }

        .glightbox-mobile .glightbox-container .gslide-desc .desc-text {
            color: #f3dede;
        }

        .glightbox-clean .gslide-desc .desc-text {
            font-size: 0.9em;
        }

        .gdesc-inner {
            margin-bottom: 8px;
           }      
/******* Дополнительные свойства ********/
.card figure {
  margin-bottom: 0px;   
}
.card p { 
margin: 0px;
padding: 7px;
padding-left: 15px;
}
/******* секция интересное ********************************************/
.glightbox, .glightbox-container, .glightbox-mobile {
  margin: 0px;
  padding: 0px;
}
/* =========================================================
        ContactPage-STYLE 
        стили полей письма шаблона gardenia
============================================================ */
.contact-section .form-section {
 margin-top: 30px; 
}
 .contact-section .form-section .form-group {
    margin-bottom: 20px; }
    @media only screen and (max-width: 991px) {
      .contact-section .form-section .form-group {
        margin-bottom: 20px; } }
    @media only screen and (max-width: 767px) {
      .contact-section .form-section .form-group {
        text-align: left; } }
    .contact-section .form-section .form-group .text {
      font-family: "Poppins", sans-serif;
      font-size: 24px;
      font-weight: 500;
      color: #3f4c5d; }
      @media only screen and (max-width: 991px) {
        .contact-section .form-section .form-group .text {
          font-size: 22px; } }
      @media only screen and (max-width: 767px) {
        .contact-section .form-section .form-group .text {
          font-size: 16px; } }
    .contact-section .form-section .form-group .form-control {
      border: 2px solid #d1d7e0;
      border-radius: 8px;
      padding: 21px 15px;
      margin-top: 10px; }
      @media only screen and (max-width: 767px) {
        .contact-section .form-section .form-group .form-control {
          padding: 16px 15px; } }
    .contact-section .form-section .form-group .btn {
      font-family: "Poppins", sans-serif;
      font-size: 22px;
      border: 2px solid #6cbe03;
      padding: 12px 65px;
      margin-top: 30px;
      margin-bottom: -20px; }
      @media only screen and (max-width: 991px) {
        .contact-section .form-section .form-group .btn {
          margin-top: 20px; } }
      @media only screen and (max-width: 767px) {
        .contact-section .form-section .form-group .btn {
          margin-top: 10px;
          font-size: 18px;
          padding: 6px 45px; } }
/* =========================================================
 переобозначение бутстрап как бутстрап шаблона гардения,
 такой стиль полей письма нравится больше
 =========================================================*/        
          .form-control {
            display:block;
            width:100%;
            height:34px;
            padding:6px 12px;
            font-size:14px;
            line-height:1.42857143;
            color:#555;
            background-color:#fff;
            background-image:none;
            border:1px solid #ccc;
            border-radius:4px;
            -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
            box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
            -webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
            -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;
            transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s
        }
        .form-control:focus {
            border-color:#66afe9;
            outline:0;
            -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
            box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
        }
        .form-control::-moz-placeholder {
            color:#999;opacity:1
        }
        .form-control:-ms-input-placeholder {
            color:#999
        }
        .form-control::-webkit-input-placeholder {
            color:#999
        }
        .form-control::-ms-expand{background-color:transparent;border:0
        }
        .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { 
            background-color:#eee;opacity:1
        }
        .form-control[disabled],fieldset[disabled] .form-control {
            cursor:not-allowed
        }
        textarea.form-control {
            height:auto
        }
        input[type=search] {
            -webkit-appearance:none
        }
        @media screen and (-webkit-min-device-pixel-ratio:0) {
            input[type=date].form-control,input[type=time].form-control,input[type=datetime-local].form-control,input[type=month].form-control { 
                line-height:34px
            }}
   #resMessage {
      color: red;
      font-size: 1.5rem;
    }
/***************************   footer  ****************************/
.footer-logo {
            font-size: 25px;
            font-family: Arial, Helvetica, sans-serif;
        }
.footer-logo ul {
            font-size: 0.5em;
            font-family: Verdana, Geneva, Tahoma, sans-serif;
            list-style-type: none;
            padding-left: 0px;
            margin-top: 8px;
            color: var(--bs-gray-700);
        }
 .b-example-divider {
            width: 100%;
            background-color: var(--bs-gray-100);
            border: solid rgba(0, 0, 0, .15);
            border-width: 1px 0;
            box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
            font-size: 0.8em;
        }
/************************* эксперимент *********************************/
/* убираем пустую верхнюю точку в firefox  */
header#masthead p {
  margin: 0px; 
  padding: 0px; 
}
.entry-content {
  margin: 0px;
}
/*--------------------------------------------------------------
# Scroll Top Button
--------------------------------------------------------------*/
.scroll-top {
            position: fixed;
            visibility: hidden;
            opacity: 0;
            right: 15px;
            bottom: -15px;
            z-index: 99999;
            background-color: #27a776;
            width: 44px;
            height: 44px;
            border-radius: 50px;
            transition: all 0.4s;
        }
.scroll-top i {
            font-size: 24px;
            color: #fafafa;
            line-height: 0;
        }
.scroll-top:hover {
            background-color: color-mix(in srgb, #27a776, transparent 20%);
        }
 .scroll-top.active {
            visibility: visible;
            opacity: 1;
            bottom: 15px;
        }
