.fixed-icons {
  display: flex;                /* порядок = HTML */
  flex-direction: row;          /* слева → направо */
  animation: scale-in 3.5s ease-out;
}

.fixed-icons a {
  display: inline-block;
  width: 35px;
  height: 35px;
  background-size: cover;
  background-position: center;
  position: relative;
}

/* Язык */
.fixed-icons .icon-lang {
  background-image: url('https://xelement.vip/files-xelement/world-globe-white-icon.webp');
}

/* Телефон */
.fixed-icons .icon-phone {
  background-image: url('https://xelement.vip/files-xelement/phone_icon.png');
}

/* Телефон 2 */
.fixed-icons .icon-phone2 {
  background-image: url('https://xelement.vip/files-xelement/phone_icon.png');
}

/* WhatsApp */
.fixed-icons .icon-whatsapp {
  background-image: url('https://xelement.vip/files-xelement/whatsapp-trafictop.png');
}

/* Telegram */
.fixed-icons .icon-telegram {
  background-image: url('https://xelement.vip/files-xelement/Teleg.png');
}

/* Max */
.fixed-icons .icon-max {
  background-image: url('https://xelement.vip/files-xelement/max.png');
}

@keyframes scale-in {
  from { transform: scale(0); }
  to   { transform: scale(1); }
}

/* =======================
   GOOGLE TRANSLATE HIDE
======================= */
.goog-te-banner-frame.skiptranslate,
.goog-te-gadget-icon,
.goog-te-balloon-frame {
  display: none !important;
}

/* =======================
   LANGUAGE SELECTOR
======================= */
.custom-lang-selector {
  position: relative;
  width: 35px;
  height: 35px;
}

.lang-main-btn {
  all: unset;
  width: 100%;
  height: 100%;
  display: block;
  cursor: pointer;
}

/* Dropdown */
.lang-dropdown {
  display: none;
  position: absolute;
  top: 110%;
  left: 0;
  width: 35px;
  background: #160326;
  color: #fff;
  padding: 4px 0;
  margin: 0;
  list-style: none;
  border-radius: 6px;
  z-index: 9999;
}

.lang-dropdown li {
  height: 35px;
  font-size: 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lang-dropdown li:hover {
  background:
    radial-gradient(circle at top left, rgba(226,216,240,0.24), transparent 60%),
    linear-gradient(135deg, rgba(56, 3, 71,0.98), rgba(56, 3, 71,0.98));
	color: #e1d8f0;
}

.custom-lang-selector.open .lang-dropdown {
  display: block;
}

.bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5, .bgimg-6, .bgimg-7, .bgimg-8, .bgimg-10{
  position: relative;
  /*opacity: 0.65;*/
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}
.bgimg-1 {
  background-image: url("5-xelement-oil.jpg");
  min-height: 750px;
  background-position-x: center;
}

.bgimg-2 {
  background-image: url("7-xelement-oil.jpg");
  min-height: 850px;
  background-position-x: center;
}

.bgimg-3 {
  background-image: url("4-xelement-oil.jpg");
  min-height: 750px;
  background-position-x: center;
}

.bgimg-4 {
  background-image: url("2-xelement-oil.jpg");
  min-height: 750px;
  background-position: center;
}

.bgimg-5 {
  background-image: url("8-xelement-oil.jpg");
  min-height: 750px;
  background-position-x: center;
}

.bgimg-6 {
  background-image: url("0-xelement-oil.webp");
  min-height: 750px;
  background-position-x: center;
}

.bgimg-7 {
  background-image: url("1-xelement-oil.jpg");
  min-height: 750px;
  background-position: center;
}

.bgimg-8 {
  background-image: url("ye-katerina.jpg");
  min-height: 650px;
  background-position: 22%;
}


.bgimg-10 {
  background-image: url("energy-max-5.svg");
  min-height: 900px;
  background-position-x: 75%;
}

/*.caption {
  position: absolute;
  left: 0;
  top: 10%;
  width: 100%;
  text-align: center;
  color: #000;
}

.caption span.border {
  background-color: #111;
  color: #fff;
  /*padding: 18px;*/
  font-size: 40%;
  /*letter-spacing: 10px;
}*/

h3 {
  letter-spacing: 5px;
  text-transform: uppercase;
  font: 20px "Lato", sans-serif;
  color: #111;
}

/* Turn off parallax scrolling for tablets and phones */
/*@media only screen and (max-device-width: 1024px) {
    .bgimg-1, .bgimg-2, .bgimg-3 {
        background-attachment: scroll;
    }
}*/



#anim_block{position:absolute;width:100рх;top:50px;left:0; right:0; margin:auto; }

.pullUp{
    animation-name: pullUp;
    -webkit-animation-name: pullUp; 
 
    animation-duration: 3s; 
    -webkit-animation-duration: 3s;
 
    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    
 
    transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -webkit-transform-origin: 50% 100%;         
}
 
@keyframes pullUp {
    0% {
        transform: scaleY(0.1);
    }
    40% {
        transform: scaleY(1.02);
    }
    60% {
        transform: scaleY(0.98);
    }
    80% {
        transform: scaleY(1.01);
    }
    100% {
        transform: scaleY(0.98);
    }               
    80% {
        transform: scaleY(1.01);
    }
    100% {
        transform: scaleY(1);
    }                           
}
 
@-webkit-keyframes pullUp {
    0% {
        -webkit-transform: scaleY(0.1);
    }
    40% {
        -webkit-transform: scaleY(1.02);
    }
    60% {
        -webkit-transform: scaleY(0.98);
    }
    80% {
        -webkit-transform: scaleY(1.01);
    }
    100% {
        -webkit-transform: scaleY(0.98);
    }               
    80% {
        -webkit-transform: scaleY(1.01);
    }
    100% {
        -webkit-transform: scaleY(1);
    }       
}










body{margin:0;overflow-x:hidden}
header{position:fixed; top:0px; z-index:9999;width:100%;display:table;background-color:#160326; opacity:0.9; margin-bottom:50px}
.container{width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}
.container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.toggle-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    width: 30px;
    height: 30px;
    position: absolute; 
    padding: 3px;
}
/* Стиль специально для мобильных экранов (до 768px) */
@media (max-width: 768px) {
    .toggle-icon {
        padding: 0px; /* Уменьшенное значение для мобильных */
		top: 1px;
    }
}

.toggle-menu {
  margin-left: auto; /*  выталкивает вправо */
}
/*@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}*/
.scrollable-menu {
    max-height: calc(100vh - 50px); /* 50px ≈ высота header */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* плавный скролл на iOS */
}

#logo{float:left;font-size:5px;text-transform:uppercase;color:#fff;font-weight:600;text-decoration:none;padding:6px 0}
nav{width:auto;float:right;margin-top:7px}
nav ul{display:table;float:right;margin:0;padding:0px 10px;}/*центрв.меню*/
nav ul li{float:left;list-style-type:none}
nav ul li:last-child{padding-right:0;}
nav ul li a{color:#160326;font-size:19px;padding:0px 8px;display:inline-block;text-decoration:none}
nav ul li a:hover{background-color:#380347;color:#fff;text-decoration:underline}
input[type=checkbox],label{display:none}
@media only screen and (max-width: 3980px) {
header{padding:0px 0}
#logo{padding:0}
input[type=checkbox]{position:absolute;top:-9999px;left:-9999px;background:none}
input[type=checkbox]:fous{background:none}
label{float:right;display:inline-block;cursor:pointer;margin-right:65px}
input[type=checkbox]:checked ~ nav{display:block}
nav{display:none;position:absolute;right:0;top:40px;background-color:#160326;padding:0;z-index:99}
nav ul{width:auto}
nav ul li{float:none;padding:0;width:100%;display:table}
nav ul li a{color:#fff;font-size:23px;/*текст меню в десктопе*/
padding:10px 30px;display:block;border-bottom:1px solid rgba(225,225,225,0.1)}
}
@media only screen and (max-width: 360px) {
label{padding:5px 0;}
#logo{font-size:20px;text-shadow:3px 3px 2px #160326;}
nav{top:47px}
}
@media only screen and (max-width: 3980px) {
    nav ul li a {
        font-size: 18px;/*текст меню в мобилке*/
    }
}

.thumbnails
{
/* Компенсируем отступы между float-блоками, чтобы они занимали все доступное пространство */
margin: -3em 0 0 -2em;

/* Выравнивание по центру */
text-align: center;
}

.thumbnail
{
/* Убираем подчеркивание у элемента ins,
который был использован для совместимости со старыми версиями Internet Explorer */
text-decoration: none;

/* Следующее правило для Firefox 2 */
display: -moz-inline-box;

/* а это для остальных */
display: inline-block;

vertical-align: top;

/* Убираем выравнивание по центру */
text-align: center;

/* Отступы между блоками */
margin: 3em 0 0 2em;
}

.thumbnail .r
{
/* Если есть необходимость, то свойства padding, border, background и position со значением relative
лучше задавать у этого элемента -- это несколько расширит количество поддерживаемых версий браузеров */

/* Задаем минимальную ширину по тексту */
width: 10em;

/* Минимальная ширина в пикселях будет автоматически рассчитываться по ширине картинки */
float: left;
}

.r2
{
/* Если есть необходимость, то свойства padding, border, background и position со значением relative
лучше задавать у этого элемента -- это несколько расширит количество поддерживаемых версий браузеров */

/* Задаем минимальную ширину по тексту */
width: 14em;

/* Минимальная ширина в пикселях будет автоматически рассчитываться по ширине картинки */
float: left;
}



.round {
	background-color:#fff;
    border-radius: 20px; /* Радиус скругления */
    
   }



/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
  position: relative;
  margin-bottom: 60px;
  padding: 0;
  *zoom: 1;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.bx-wrapper img {
  max-width: 100%;
  display: block;
}
.bxslider {
  margin: 0;
  padding: 0;
}
ul.bxslider {
  list-style: none;
}
.bx-viewport {
  /*fix other elements on the page moving (on Chrome)*/
  -webkit-transform: translatez(0);
}
/** THEME
===================================*/
.bx-wrapper {
  -moz-box-shadow: 0 0 5px #ccc;
  -webkit-box-shadow: 0 0 5px #ccc;
  box-shadow: 0 0 5px #ccc;
  /*border: 5px solid #fff;*/
 /* background: #fff;*/
  border-radius: 20px;
  padding:10px 0px 0px 0px;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: -30px;
  width: 100%;
}
/* LOADER */
.bx-wrapper .bx-loading {
  min-height: 50px;
  background: url('https://xelement.vip/files-xelement/bx_loader.gif') center center no-repeat #fffff;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2000;
}
/* PAGER */
.bx-wrapper .bx-pager {
  text-align: center;
  font-size: .85em;
  font-family: Arial;
  font-weight: bold;
  color: #666;
  padding-top: 20px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background: #fff; /*белый цвет точек слайдера*/
  text-indent: -9999px;
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  outline: 0;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #160326; /*фиолетовый цвет точек слайдера*/
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
  *zoom: 1;
  *display: inline;
}
.bx-wrapper .bx-pager-item {
  font-size: 0;
  line-height: 0;
}
/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-prev {
  left: 10px;
  background: url('https://xelement.vip/files-xelement/controls.png') no-repeat 0 -32px;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
  background-position: 0 0;
}
.bx-wrapper .bx-next {
  right: 10px;
  background: url('https://xelement.vip/files-xelement/controls.png') no-repeat -43px -32px;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
  background-position: -43px 0;
}
.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 50%;
  margin-top: -16px;
  outline: 0;
  width: 32px;
  height: 32px;
  text-indent: -9999px;
  /*z-index: 9999;*/
}
.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
  display: block;
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url('https://xelement.vip/files-xelement/controls.png') -86px -11px no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
  background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
  display: block;
  text-indent: -9999px;
  width: 9px;
  height: 11px;
  outline: 0;
  background: url('https://xelement.vip/files-xelement/controls.png') -86px -44px no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
  background-position: -86px -33px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: left;
  width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  right: 0;
  width: 35px;
}
/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #666;
  background: rgba(90, 163, 2, 0.75);
  width: 100%;
}
.bx-wrapper .bx-caption span {
  color: #fff;
  font-family: Arial;
  display: block;
  font-size: .85em;
  padding: 10px;
}




.myvideo {
position:relative;
padding: 0 0 56.25% 0;
height:0;
overflow:hidden;
}
.myvideo iframe,.myvideo object,.myvideo embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}


.card_text_block:before {
    content: " ";
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 7px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
    background: #ff0303;
    background-image: initial;
    background-position-x: initial;
    background-position-y: initial;
    background-size: initial;
    background-repeat-x: initial;
    background-repeat-y: initial;
    background-attachment: initial;
    background-origin: initial;
    background-clip: initial;
    background-color: rgb(34, 34, 34);
    animation: template_wave_blink 1s infinite;
    animation-duration: 1s;
    animation-timing-function: ease;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: template_wave_blink;
    vertical-align: middle;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: -2px;}
@-webkit-keyframes name{0%{background:#ff0303}50%{background:#8dff00}100%{background:#ff0303}}@-moz-keyframes name{0%{background:#ff0303}50%{background:#8dff00}100%{background:#ff0303}}@-ms-keyframes name{0%{background:#ff0303}50%{background:#8dff00}100%{background:#ff0303}}@-o-keyframes name{0%{background:#ff0303}50%{background:#8dff00}100%{background:#ff0303}}@-moz-keyframes template_wave_blink{0%{background:#ff0303}50%{background:#8dff00}100%{background:#ff0303}}@-webkit-keyframes template_wave_blink{0%{background:#ff0303}50%{background:#8dff00}100%{background:#ff0303}}


/*блик*/
.preview-block__btn2 {
    max-width: 100%;
}
.custom-btn2 {
    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;
    position: relative;
    overflow: hidden;
    background: transparent;
	white-space: nowrap; /* Чтобы текст не переносился и не растягивал высоту */
    
    /* Интерактив */
    cursor: pointer;
 
}
.custom-btn2:after {
    content: ""; 
    width: 30px; /* толщина блика */
    height: 300px;
    margin-left: 30px;
    background: #fff;
    position: absolute;
    left: -40px;
    top: -150px;
    z-index: 1;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all 0.1s;
    transition: all 0.1s;
    -webkit-animation-name: slideme2;
    animation-name: slideme2;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-delay: 0.05s;
    animation-delay: 0.05s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

@-webkit-keyframes slideme2 { 0% { left: -30px; margin-left: 0px; }
  30% { left: 110%; margin-left: 80px; }
  100% { left: 110%; margin-left: 80px; } } 





/*подписная форма*/
.subscribe-embedded-form {
    font-size: 14px;
    background: linear-gradient(#fff, #380347, #380347, #12021f, #160326) fixed;
    font-family: "Play",Arial,Helvetica,Verdana,sans-serif;
    color: #333;
}
.subscribe-embedded-form p {
  margin-top: 0;
  margin-bottom: 15px;
}
.subscribe-embedded-form .form-group {
  margin-bottom: 20px;
}
.subscribe-embedded-form label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 0px;
  font-weight: bold;
}
.subscribe-embedded-form .form-control {
    display: block;
    width: 330px;
    height: 36px;
    padding: 7px 12px;
    font-size: 23px;
    line-height: 1.5384616;
    color: #160326;
    background-color: #fff; /*цвет полей*/
    background-image: none;
    border: 1px solid #ddd;
    border-radius: 30px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out .15s, 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;
}

.footer-copyright {
    text-align: center;
    color: #e2d8f0; /* Можно сразу добавить цвет */
    margin: 20px 0;
}