/*
Theme Name: PEUGEOT
Theme URI: #
Author: JimmyT
Author URI: #
Tags: 
Description: Тема PEUGEOT специально для GBS
Version: 1.0
License: Proprietary
License URI: #
Text Domain: PEUGEOT.md

*/
/****************/
/*header*/
/****************/
@media (max-width:1279px) {
  .header.sticky {
    position: fixed;
    top: 0;
    background-color: #000;
  }
  .header .mobile-nav {
    height: 120px;
    -webkit-transition: height .3s ease-in-out .3s;
    transition: height .3s ease-in-out .3s;
  }
  .header.sticky .mobile-nav {
    height: 50px;
  }
  .header.sticky .logo img {
    max-height: 40px;
  }
  .header .logo-section {
    position: static;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: auto;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 100%;
    flex: 1 0 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  .header .logo-section::before {
    margin-right: 1.6rem;
  }
  .header .logo-section::after {
    margin-left: 1.6rem;
  }
  .header .logo-section::before, .header .logo-section::after {
    content: '';
    -webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    height: 1px;
    background-color: #fff;
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
  }
  .header.sticky .logo-section::before, .header.sticky .logo-section::after {
    opacity: 0;
  }
  .header .actions-section {
    position: static;
    width: auto;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.1875rem 0;
    -ms-flex-item-align: start;
    align-self: flex-start;
  }
  .header {
    padding: 0;
    background-color: transparent;
    -webkit-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
  }
  .header .logo img {
    padding-right: 0;
  }
    
}
/****************/
/* sticky menu  */
/****************/
 .sticky-menu{
        width: 100%;
     margin-bottom: 2.1875rem
        
    }
.sticky-menu li{
    text-transform: uppercase;
}
.sticky-menu li a{
    padding: 1.5625rem 0 1.25rem;
    margin: 0 1.5rem;
    color: #000;
    font-size: .725rem;
    line-height: .725rem;
    text-align: center;
    border: none;
    text-transform: uppercase;
    -webkit-transition: text-shadow .3s ease-in-out;
    transition: text-shadow .3s ease-in-out
}
.sticky-menu li a:hover:not(span){
    -webkit-box-shadow: inset 0 -0.3125rem 0 #0074e8;
    box-shadow: inset 0 -0.3125rem 0 #0074e8;
    font-weight: 400;
    text-shadow: 0 0.0625rem 0 #000;
}
.sticky-menu.sticky {
  width: 100%;
  position: fixed;
  top: 0px;
  background: var(--color-white);
}
@media (max-width:1279px){
    .sticky-menu{overflow-x: scroll;}
    .sticky-menu.sticky {
  position: fixed;
  top: 50px;
  background: var(--color-white);
}
}
/****************/
/* pricing*/
/****************/
#pricing {}
#pricing .block-title {
  font-family: "Peugeot Bold";
  font-size: 1.2rem;
  color: var(--color-secondary);
}
/****************/
/*menus*/
/****************/
/*#header .navbar ul li.menu-item-has-children ul {
    position: absolute;
    padding: 0;
    left: -18px;
    top: 70px;
  
    display: none;
    width: 240px;
    background: #fff;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
    list-style: none;
    text-decoration: none;
}
.navbar > ul > li.current-menu-item > a:before{
    visibility: visible;
    width: 100%;    
}*/
/****************/
/* Buttons*/
/****************/
.btn {
  text-transform: uppercase;
  border-radius: 0;
  font-size: .625rem;
  font-weight: 700;
}
.btn-link {
  text-decoration: none;
  text-transform: uppercase;
  display: block;
  font-size: 14px;
}
.btn-primary, .btn-secondary {
  padding-left: 1.375rem;
  padding-right: 1.375rem;
  max-width: 19.375rem;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-transform: uppercase;
  height: 2.8125rem;
}
.btn-primary:hover {
  background: var(--color-secondary);
  border-color: var(--color-secondary);
}
.btn-secondary {
  background: var(--color-white);
  color: var(--color-default);
}
.btn-secondary:hover {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}
@media (max-width:768px) {
  .btn-primary {
   /* max-width: none;*/
  }
}
a#scroll-btn {
  position: absolute;
  height: 10rem;
  width: 4rem;
  margin: auto;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
}
a#scroll-btn i {
  color: var(--color-white);
  font-size: 3rem;
  animation: move-down 2s infinite;
}
@keyframes move-down {
  10% {
    opacity: 0.5;
  }
  100% {
    transform: translateY(2.3em);
    opacity: 0;
  }
}
@media (max-width:768px) {
  a#scroll-btn {
    display: none;
  }
}
/***********/
/*Sliders */
/***********/
#home-slider {
  position: relative;
}
.picture {
  position: relative;
  width: auto;
}
.picture img {
  max-height: 100vh;
  -o-object-fit: cover;
  object-fit: cover;
}
.slider_content {
  position: absolute;
  bottom: 10%;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.slider_text {
  text-transform: uppercase;
  color: var(--color-white);
}
.slider_text h1, .slider_text h3 {
  color: var(--color-white);
}
.owl-carousel .owl-nav {
  position: absolute;
  top: 40vh;
  width: 100%;
}
.owl-carousel .owl-nav div {
  font-size: 25px !important;
  height: 2.5rem;
  width: 2.5rem;
  background-color: #000 !important;
  opacity: .7;
  color: #fff !important;
  -webkit-transition: opacity .3s ease-out !important;
  transition: opacity .3s ease-out !important;
  cursor: pointer;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 0 !important;
  margin: 0 !important;
}
.owl-carousel .owl-nav .owl-next {
  right: 0;
  left: auto;
}
@media (max-width:768px) {
  .owl-carousel .owl-nav {
    display: none;
  }
  .slider_content {
    bottom: 0;
    padding: 30px;
  }
  .slider_text {
    margin-left: 0 !important;
  }
}
/*************/
.section_slide {
  font-size: .875rem;
}
@media (max-width:768px) {
  .section_slide .row {
    flex-direction: column-reverse;
  }
}
.media_container {
  position: relative;
}
.text_container {
  position: relative;
}
.slide_counter {
  color: var(--color-primary);
}
.section_text {
  overflow: hidden;
}
.section_name {
  text-transform: uppercase;
  color: var(--color-secondary);
  font-size: .937rem;
}
.media_title {
  right: 0;
  left: auto;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  position: absolute;
}
.media_title span {
  -webkit-writing-mode: vertical-lr;
  -ms-writing-mode: tb-lr;
  writing-mode: vertical-lr;
  -webkit-transform: scale(-1);
  transform: scale(-1);
  text-transform: uppercase;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  color: #fff;
  margin: 0;
  font-weight: 700;
  text-align: right;
}
.text-vertical {
  position: absolute;
  height: 100%;
  top: 0;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}
.custom-direction {
  position: relative;
  display: inline-block;
}
.custom-direction a {
  padding: 10px 20px;
  display: inline-block;
  color: var(--color-default);
  font-size: 1.1rem;
}
/*********************/
/*pages */
/*********************/
#header-blog {
  background-color: var(--color-white);
}
#header-blog .media_container {
  padding-top: 157px;
  background-color: var(--color-secondary);
}
#header-blog img {
  width: 100%;
  overflow: hidden;
  object-fit: contain;
  max-height: 100vh;
  -o-object-fit: cover;
  object-fit: cover;
}
#header-blog .page_title {
  font-family: 'Peugeot Bold', sans-serif;
  text-transform: uppercase;
  padding: 1.85rem 0;
}
#feature-box {
  position: relative;
  display: block;
  overflow: hidden;
}
#feature-box img:before {
  position: absolute;
  background: #ccc;
}
#feature-box img {
  width: 100%;
  overflow: hidden;
  object-fit: contain;
  max-height: 100vh;
  -o-object-fit: cover;
  object-fit: cover;
}
#feature-box .image-overlay {
  background-image: linear-gradient(180deg, rgba(17, 17, 17, 0.75) 0%, rgba(0, 0, 0, 0) 50%);
  /*background-image: linear-gradient(135deg, #6a6a6a 0%, rgba(0,0,0,0) 50%);*/
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
#feature-box .box_content {
  color: #fff;
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, 0);
  width: 90%;
  max-width: 1400px;
  margin: 0 auto;
  z-index: 2;
}
@media (max-width:768px) {
  #feature-box .box_content {
    position: relative;
    background: #000;
    transform: none;
    left: auto;
    width: auto;
    padding-bottom: 20px;
  }
    #feature-box .page_title{
        line-height: 2.875rem;
    }
}
#feature-box .page_title {
  font-family: 'Peugeot Bold', sans-serif;
  text-transform: uppercase;
  font-size: 18px;
  color: #FFFFFF;
  padding: 1.85rem 0;
}
#feature-box .page_title span {
  border-bottom: 4px solid #0074e8;
  padding-bottom: 0.5rem;
  line-height: 2.1875rem;
}
#feature-box .page-description {
  /*   backdrop-filter: blur(5px);*/
  padding: 10px 5px;
  /*  background: rgba(17,17,17,0.15);*/
  /*    position: absolute;
    bottom: 30px;
    padding: 5px 15px;
    color: #fff;*/
}
/*****************/
/*Page models*/
/*****************/
.model_section {
  margin: 0;
  background-color: #f7f7f7;
}
.model_row {
  position: relative;
  margin-bottom: 1rem;
}
.vehicle_block {
  float: left;
  list-style: none;
}
.vehicle_block a {
 /* max-width: none;*/
}
.vehicle_block a:hover .model_title {
  color: var(--color-primary);
}
.model_title {
  text-transform: uppercase;
  font-family: var(--font-default);
  text-align: center;
}
.vehicle_details_link {
  cursor: pointer;
  line-height: 1.4;
  background-color: transparent;
  border: none;
  margin-bottom: 0;
  padding-bottom: 0.9375rem;
  text-decoration: none;
  border-bottom: 3px solid transparent;
  text-align: center
}
.vehicle_details_link:hover {
  border-bottom-color: #0074e8;
  background-color: transparent;
}
.vehicle_details {
  /*display: none;*/
  overflow: hidden;
}
/******************/
/*News page*/
/******************/
.feature-box {
  padding: 25px 15px;
}
.bradcrumbs {
  font-size: 12px;
  text-transform: uppercase;
}
.bradcrumbs a {
  background-color: var(--color-primary);
  color: var(--color-white);
  padding: 10px 15px;
  margin-right: 5px;
  display: inline-flex;
}
.bradcrumbs a:hover {
  background-color: var(--color-secondary);
}
.bradcrumbs span {
  color: var(--color-secondary);
  padding: 10px 15px;
  display: inline-flex;
}
.article_title {
  margin-top: 15px;
  height: 50px;
  overflow: hidden;
}
.blog .btn-primary{
    margin: auto;
}
.blog article {
  padding: 0 3rem;
}

/* полоса прокрутки (скроллбар) */
.sticky-menu::-webkit-scrollbar {
    background-color: var(--color-primary);
}

/* ползунок скроллбара */
.sticky-menu::-webkit-scrollbar-thumb {
    background-color: var(--color-primary);
    border-radius: 9em;
    box-shadow: inset 1px 1px 5px var(--color-primary);
}

.sticky-menu::-webkit-scrollbar-thumb:hover {
    background-color: var(--color-primary);
}
.sticky-menu::-webkit-scrollbar-track{
    border-top: 7px solid #fff;
    border-bottom: 7px solid #fff;
    background-color: #adaeb2;
}
.sticky-menu:hover::-webkit-scrollbar-track, .sticky-menu.active::-webkit-scrollbar-track{
    border-radius: 7px;
}
/*Google maps */
.map-wrapper {
    position: relative;
    width: 100%;
    height: 550px;
    /*margin-bottom: 60px;*/
}
.map-wrapper .map-canvas {
    position: absolute;
    width: 100%;
    height: 100%;
}