html,
body {
width: 100%;
height: 100%;
}
html {
font-size: 6.944444444444445vw;
scroll-behavior: smooth;
}
body {
padding: 0;
margin: 0;
font: 0.16rem var(--font-primary), sans-serif;
line-height: 1.5;
background: #fff;
}
div,
p,
a,
span,
em,
strong,
img,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
li,
dl,
dt,
dd,
table,
td,
tr,
form,
fieldset,
label,
select,
input,
textarea,
header,
nav,
section,
article,
aside,
footer,
blockquote {
padding: 0;
margin: 0;
outline: none;
list-style: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
header,
nav,
section,
article,
aside,
footer {
display: block;
}
select,
input,
textarea {
font: italic 0.14rem var(--font-primary), sans-serif;
color: #e5e5e5;
vertical-align: middle;
}
textarea {
vertical-align: top;
resize: none;
}
:focus {
outline: none;
}
input[type="submit"],
button {
cursor: pointer;
}
img,
fieldset {
border: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a {
font: 0.14rem var(--font-primary), sans-serif;
color: #58595b;
text-decoration: none;
}
a:hover {
text-decoration: none;
}   div > img {
display: block;
width: 100%;
}
.text p {
margin: 0.1rem 0px;
overflow: hidden;
}
.text p:first-of-type {
margin: 0px 0px 0.1rem;
}
.text p:only-of-type {
margin: 0px;
} :lang(en-US) .menu-item-114,
:lang(en-US) .last-news,
:lang(en-US) .mobile-nav-menu-bottom-list > li:first-child {
display: none;
}
:root {
--color-primary: #FFF;
--color-black: #000;
--color-error: #a70000;
--font-primary: "Manrope";
}
.main-header {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: .2rem .4rem;
position: absolute;
top: 0;
left: 0;
z-index: 10;
opacity: 0;
transition: background-color 0.5s, box-shadow 0.5s, opacity .5s; }
.isLoaded .main-header {
opacity: 1;
}
.main-header.fixed {
position: fixed;
background: var(--color-black);
box-shadow: 0 0.01rem 0.2rem rgba(0, 0, 0, 0.06);
}
.main-logo {
display: block;
}
.main-logo img,
.main-logo svg {
display: block;
width: auto;
max-width: 100%;
}
.main-logo img.main-logo__black {
display: none;
}
.main-menu-list {
display: flex;
}
.main-menu-list > li:last-child {
margin-left: auto;
}
.main-menu-list > li a,
.main-menu__link {
display: block;
font-weight: 600;
font-size: 0.12rem;
line-height: 0.22rem;
font-weight: 700;
line-height: normal;
letter-spacing: 1px;
text-transform: uppercase;
color: #fff;
padding: 0.1rem;
position: relative;
}
.main-menu-list > li a::after,
.main-menu__link::after {
content: "";
display: block;
width: 0;
height: 0.02rem;
position: absolute;
bottom: -1px;
left: 0;
background: var(--color-primary);
transition: width 0.5s;
}
.main-menu-list > li a:hover::after,
.main-menu__link:hover::after,
.main-menu-list > li:not(.menu-item-115).current_page_item a::after,
.main-menu-list > li.current-menu-item-parent a::after {
width: 100%;
}
.main-menu-list > li.menu-item-112 a::after {
background: #0facf3;
}
.mobile-burger-btn,
.mobile-menu-container {
display: none;
}
@media only screen and (min-width: 767px) {
.language-chooser {
width: 0.54rem;
position: absolute;
top: 0.12rem;
right: 0.2rem;
display: flex;
flex-direction: column;
overflow: hidden;
}
.language-chooser::after {
content: "";
display: block;
width: 0.12rem;
height: 0.24rem;
position: absolute;
top: 0.1rem;
right: 0;
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/icon-arrow.svg);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.language-chooser > li {
order: 3;
}
.language-chooser > li.active {
order: 1;
}
.language-chooser > li a {
display: block;
font-weight: 600;
font-size: 0.14rem;
line-height: 0.22rem;
color: #fff;
}
.language-chooser > li:first-child a {
padding: 0.12rem 0.3rem 0.12rem 0.12rem;
}
.language-chooser > li:not(.active):nth-of-type(2) a,
.language-chooser > li:not(.active):nth-of-type(3) a {
padding: 0.08rem 0.16rem 0.04rem 0.17rem;
background: #fff;
color: #1d1d1f;
}
.language-chooser > li:nth-of-type(2) a {
border-top-left-radius: 0.1rem;
border-top-right-radius: 0.1rem;
}
.language-chooser > li:nth-of-type(3) a {
border-bottom-left-radius: 0.1rem;
border-bottom-right-radius: 0.1rem;
}
.language-chooser > li:nth-of-type(2),
.language-chooser > li:nth-of-type(3) {
opacity: 0;
transition: opacity 0.5s;
}
.language-chooser:hover li {
opacity: 1;
}
} @media only screen and (max-width: 767px) {
.main-header {
position: fixed;
background-color: #fff;
height: 0.7rem;
padding: 0.15rem .2rem;
}
.main-header.fixed {
background-color: #fff;
}
.main-nav,
.main-lang-list,
.main-menu__contact-link {
display: none;
}
.main-header .language-chooser {
display: none;
}
.main-logo {
width: 1.1rem;
}
.main-logo img {
width: 100%;
}
.main-logo svg > g path {
fill: #000;
}
.main-logo img.main-logo__white {
display: none;
}
.main-logo img.main-logo__black {
display: block;
}
.main-title {
max-width: 100%;
font-size: 0.22rem;
line-height: 0.32rem;
top: 1.2rem;
left: 0.35rem;
}
.mobile-burger-btn {
width: 0.5rem;
height: 0.5rem;
border-radius: 50%;
background-position: center;
background-repeat: no-repeat; background-size: 0.2rem 0.16rem;
position: absolute;
top: .1rem;
right: 0.1rem;
transition: top 0.5s, background 0.5s;
z-index: 10;
display: flex;
justify-content: center;
align-items: center;
} .mobile-burger-btn path {
transition: stroke 0.3s;
}
.mobile-burger-btn path {
stroke: #1d1d1b;
} .mobile-menu-container {
display: block;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 100%;
z-index: 11;
background: #FFF;
color: var(--color-black);
transition: -webkit-transform 1s;
transition: transform 1s;
transition: transform 1s, -webkit-transform 1s;
}
.mobile-menu-container.active {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
.mobile-menu-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.15rem 0.1rem 0.15rem 0.25rem;
}
.close-mobile-menu-btn {
width: 0.5rem;
height: 0.5rem;
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/close-menu.svg);
background-position: center;
background-repeat: no-repeat;
background-size: 0.14rem;
position: absolute;
top: .1rem;
right: 0.1rem;
}
.mobile-nav-menu-container {
padding: 1.5rem 0.25rem 0.5rem 0.25rem;
}
.mobile-nav-menu-container li > a,
.mobile-nav-menu-container .main-menu__link {
display: block; font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 1px;
text-transform: uppercase;
color: var(--color-black);
padding: 0.1rem;
}
.mobile-nav-menu-container .main-menu__link::after {
display: none;
}
.mobile-nav-menu-top-list {
margin-bottom: 0.5rem;
}
.gas-menu-item {
margin-bottom: 0.06rem;
}
.mobile-nav-menu-top-list > li > a {
padding: 0.15rem 0.15rem 0.15rem 0.57rem;
overflow: hidden;
position: relative;
}
.mobile-nav-menu-top-list > li > a::before {
content: "";
display: block;
width: 0.54rem;
height: 0.54rem;
position: absolute;
top: 0;
left: 0;
background-position: center;
background-repeat: no-repeat;
}
.gas-menu-item a::before {
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/gas-mobile-icon.svg);
}
.electro-menu-item a::before {
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/electro-mobile-icon.svg);
}
.mobile-nav-menu-bottom-list {
display: flex;
justify-content: space-between;
}
.mobile-nav-menu-bottom-list > li {
width: 49%;
text-align: center;
}
.language-chooser {
display: flex;
justify-content: flex-end;
padding: 0 0.25rem 0 0;
}
.language-chooser > li:not(:last-child) {
margin-right: 0.06rem;
}
.language-chooser > li a {
padding: 0.15rem;
background: rgba(255, 255, 255, 0.08);
border-radius: 0.1rem;
font-weight: 600;
font-size: 0.15rem;
line-height: 0.24rem;
text-align: center;
color: #ffffff;
}
.language-chooser li.active a {
border: 0.01rem solid #ffffff;
}
}
.main-footer {
padding: .8rem 0 .3rem;
background: var(--color-black);
}
.main-footer h2 {
margin-bottom: .5rem;
color: #FFF;
text-align: center;
}
.main-footer__container {
display: flex;
justify-content: space-between;
margin-bottom: 60px;
padding-right: 1rem;
}
.main-footer__icon {
width: .6rem;
height: .6rem;
background: #343434;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: .15rem;
}
.main-footer__icon img {
width: auto;
max-width: 100%;
}
.main-footer__title {
font-size: .16rem;
line-height: .26rem;
color: #fff;
margin-bottom: .1rem;
}
.main-footer__text {
max-width: 1.95rem;
font-weight: 400;
font-size: .15rem;
line-height: .24rem;
color: #FFFFFF;
display: block;
font-style: normal;
}
.main-footer__text:not(:last-child) {
margin-bottom: .1rem;
}
.main-footer__schedule > div {
display: flex;
gap: .24rem;
}
.copyright {
font-weight: 400;
font-size: .16rem;
line-height: .26rem;
text-align: center;
color: #FFFFFF;
opacity: 0.5;
} @media only screen and (max-width: 767px) {
.main-footer {
padding: 0.5rem 0;
flex-direction: column;
}
.main-footer .wrapper,
.main-footer__container {
flex-direction: column;
gap: 20px;
}
}
.form-layout-container,
.map-layout-container {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0, 0, 0, 0.6);
z-index: 11;
transition: opacity 0.3s;
opacity: 0;
pointer-events: none;
}
.form-layout-container.active,
.map-layout-container.active {
opacity: 1;
pointer-events: all;
}
.form-container {
width: 5.6rem;
padding: 0.8rem 0.6rem 0.54rem 0.6rem;
background-color: #fff;
border-radius: 0.4rem;
position: relative;
-webkit-transform: translateY(15%);
transform: translateY(15%);
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
.form-layout-container.active .form-container {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.close-form-btn {
display: block;
width: 0.6rem;
height: 0.6rem;
border-radius: 50%;
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/icon-close.svg);
background-position: center;
background-repeat: no-repeat;
background-size: 0.16rem;
cursor: pointer;
position: absolute;
top: 0.1rem;
right: 0.1rem;
z-index: 1;
background-color: #fff;
transition: transform 0.3s;
will-change: transform;
}
.close-form-btn:hover {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.inputs-wrapper label,
.inputs-wrapper input {
display: block;
width: 100%;
}
.inputs-wrapper label {
padding: 0 0 0.06rem 0.2rem;
font-size: 0.14rem;
line-height: 0.22rem;
color: #1e1e1e;
}
.inputs-wrapper input {
border: none;
outline: none;
background: #f2f2f2; padding: 0.14rem 0.2rem;
font-size: 0.16rem;
line-height: 0.22rem;
font-style: normal;
color: #1e1e1e;
transition: background 0.3s, color 0.3s;
}
.inputs-wrapper input.invalid {
background: rgba(167, 0, 0, 0.22);
color: var(--color-error);
}
.inputs-wrapper {
margin-bottom: 0.2rem;
}
#form_submit_btn {
display: block;
width: 100%;
padding: 0.19rem 1.4rem;
text-align: center; pointer-events: none;
opacity: .5;
}
#form_submit_btn.active {
pointer-events: all;
opacity: 1;
}
#form_submit_btn.active:hover {
box-shadow: rgba(0, 0, 0, 0.2) 0px 0.1rem 0.2rem -0.05rem;
-webkit-transform: translateY(-0.02rem);
transform: translateY(-0.02rem);
}
.success-mssg {
width: 3.7rem;
margin: auto;
display: none;
}
.success-mssg h6 {
font-weight: 600;
font-size: 0.15rem;
line-height: 0.26rem;
text-align: center;
color: #1e1e1e;
margin-bottom: 0.06rem;
}
.success-mssg p {
font-size: 0.15rem;
line-height: 0.24rem;
text-align: center;
color: #1e1e1e;
}
.form-container.sending {
padding: 1rem 0.93rem;
}
.form-container.sending .success-mssg {
display: block;
}
.form-container.sending #form_submit {
display: none;
}
.req-input,
#email-to {
display: none;
}
.map-container {
width: 8.6rem;
height: 4.68rem;
border-radius: 0.4rem;
position: relative;
overflow: hidden;
border-radius: 0.1rem;
border-top-right-radius: 0.4rem;
}
#map {
height: 100%;
}
#map iframe {
width: 100%;
height: 100%;
}
.map-container-address {
width: 2.6rem;
background: #ffffff;
border-radius: 0.4rem;
padding: 0.08rem 0.3rem;
font-size: 0.14rem;
line-height: 0.22rem;
color: #1c1d1e;
position: absolute;
bottom: 0.1rem;
left: 0.1rem;
z-index: 1;
}
.map-container-address address {
font-style: normal;
}
.docs-layout-container {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0, 0, 0, 0.6);
z-index: 11;
transition: opacity 0.3s;
opacity: 0;
pointer-events: none;
}
.docs-layout-container.active {
opacity: 1;
pointer-events: all;
}
.docs-container {
width: 9rem;
height: 100%;
border-radius: .3rem;
background: #FFF;
padding: .5rem .6rem;
transform: translateY(15%);
transition: transform 0.3s;
}
.docs-layout-container.active .docs-container {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.docs-container__title {
font-size: .26rem;
font-style: normal;
font-weight: 800;
line-height: .33rem;
margin-bottom: 0.35rem;
}
.docs__row {
height: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
gap: .6rem;
}
.docs-list {
height: 100%;
display: flex;
flex-direction: column;
gap: .1rem;
overflow: auto;
padding-bottom: 0.2rem;
}
.docs-list__item > a {
display: flex;
align-items: center;
padding: .05rem .06rem;
gap: .08rem;
font-size: .13rem;
font-style: normal;
font-weight: 500;
line-height: normal;
color: #000;
}
.docs-list__item > a:hover {
text-decoration: underline;
}
.docs-list__item img {
display: block;
width: 0.2rem;
height: 0.2rem;
object-fit: contain;
} @media only screen and (max-width: 767px) {
.docs-container {
width: 100%;
height: 100%;
border-radius: 0;
padding: .2rem .2rem .5rem;
}
.close-docs-btn {
width: 0.5rem;
height: 0.5rem;
}
.docs-container__title {
font-size: 0.22rem;
margin-bottom: 0.4rem;
}
.docs__row {
grid-template-columns: 1fr;
gap: .4rem;
}
.docs-list {
gap: .05rem;
}
}
.page-home {
padding-bottom: 1rem;
} .intro {
position: relative;
height: 100vh;
padding: 2.9rem 0 .3rem;
}
.intro__preloader {
width: 100%;
height: 100%;
position: absolute;
z-index: 2;
top: 0;
left: 0;
object-fit: cover;
transition: opacity 1s;
transition-delay: 1s;
}
.isLoaded .intro__preloader {
opacity: 0;
pointer-events: none;
}
.photo-mob,
.mobile-video {
display: none !important;
}
.swiper.intro-slider {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.intro-slider__img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.intro-slider__img video,
.intro-slider__img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.swiper.intro-slider .swiper-slide {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
position: relative;
opacity: 0 !important;
}
.swiper.intro-slider .swiper-slide.swiper-slide-active {
opacity: 1 !important;
}
.swiper.intro-slider .swiper-slide::after {
content: "";
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.30) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.00) 100%);
z-index: 1;
}
.swiper-slide__content {
max-width: 6.6rem;
position: absolute;
z-index: 2;
color: #FFF;
text-align: center;
}
.intro-slider__title {
font-size: 0.54rem;
font-style: normal;
font-weight: 800;
line-height: .6rem;
margin-bottom: 0.12rem;
opacity: 0;
transform: translateY(10%);
transition: transform 1s, opacity 1s;
transition-delay: .5s;
}
.intro-slider__description {
font-size: .2rem;
font-style: normal;
font-weight: 500;
line-height: .3rem;
opacity: 0;
transform: translateY(10%);
transition: transform 1s, opacity 1s;
transition-delay: .7s;
}
.isLoaded .intro-slider__title,
.isLoaded .intro-slider__description,
.isLoaded .intro__nav.intro__nav {
opacity: 1;
transform: translateY(0);
}
.intro .container {
height: 100%;
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.intro__title {
font-size: 80px;
font-style: normal;
font-weight: 800;
line-height: .9rem;
color: #FFF;
text-align: center;
max-width: 7.9rem;
margin: 0 auto 2rem;
}
.intro__nav.intro__nav {
max-width: 8.4rem;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
gap: 1rem;
position: absolute;
bottom: 0 !important;
left: auto !important;
opacity: 0;
transform: translateY(10%);
transition: transform 1s, opacity 1s;
transition-delay: 1s;
}
.intro__nav_item.intro__nav_item {
width: auto !important;
height: auto !important;
display: inline-flex;
position: relative;
padding: .1rem 0;
font-size: .15rem;
font-style: normal;
font-weight: 700;
line-height: .36rem;
color: rgba(255, 255, 255, 0.50);
position: relative;
background: none;
margin: 0 !important;
opacity: 1 !important;
transition: color .3s;
}
.intro__nav_item.intro__nav_item:hover {
color: #FFF;
}
.intro__nav_item.intro__nav_item.swiper-pagination-bullet-active {
color: #FFF;
}
.autoplay-progress {
content: "";
width: 0;
height: 0.04rem;
background-color: #fff;
position: absolute;
top: 0;
left: 0;
transition: width .3s;
}  .blocks {
padding: 0 0 1rem 0;
display: flex;
flex-direction: column;
gap: 1rem;
}
.block {
border-radius: 0.6rem;
background: var(--color-bg);
position: relative;
padding: 5.3rem 1rem .6rem;
overflow: hidden;
color: #FFF;
}
.block__img {
width: 100%;
height: 6rem;
position: absolute;
top: 0;
left: 0;
border-radius: 0.6rem;
overflow: hidden;
}
.block__img img,
.block__video {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.block__img::after {
content: "";
width: 100%;
height: 35%;
background: linear-gradient(180deg, rgba(1, 1, 1, 0.00) 0%, var(--color-bg) 100%);
position: absolute;
bottom: 0;
left: 0;
}
.block__top {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: .4rem;
}
.block__description {
width: 6rem;
}
.block__btns {
display: flex;
flex-direction: column;
gap: .1rem;
}
.block__title {
font-size: .36rem;
font-style: normal;
font-weight: 800;
line-height: .43rem;
margin-bottom: .1rem;
}
.block__top .text {
font-size: .17rem;
font-style: normal;
font-weight: 400;
line-height: .27rem;
}
.block__info {
max-width: 5rem;
opacity: 0.6;
color: #FFF;
font-size: .12rem;
font-style: normal;
font-weight: 400;
line-height: 18px;
margin-top: 0.42rem;
}
.block__info a {
color: #FFF;
font-size: .12rem;
font-style: normal;
font-weight: 400;
line-height: 18px;
text-decoration: underline;
}
.advantages-list {
width: 90%;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
}
.advantages-list__icon {
display: block;
max-width: 1rem;
margin-bottom: .2rem;
}
.advantages-list__title {
font-size: .18rem;
font-style: normal;
font-weight: 700;
line-height: .28rem;
margin-bottom: 0.05rem;
}
.advantages-list__description,
.advantages-list__description a {
font-size: .14rem;
font-style: normal;
font-weight: 400;
line-height: .22rem;
color: var(--color-white);
}
.advantages-list__description a {
text-decoration: underline;
}
.agrocultures-list {
width: 95%;
display: flex;
flex-wrap: wrap;
gap: 50px;
}
.agrocultures-list__icon {
width: .9rem;
height: .9rem;
border-radius: 50%;
border: .04rem solid rgba(255, 255, 255, 0.25);
}
.agrocultures-list__icon img {
height: 100%;
object-fit: cover;
}
.agrocultures-list > li {
display: flex;
flex-direction: column;
align-items: center;
gap: .1rem;
}
.agrocultures-list__title {
font-size: .13rem;
font-style: normal;
font-weight: 500;
line-height: normal;
} .about {
padding: 1rem 0;
}
.about-list {
max-width: 9.8rem;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
}
.about-list__item {
width: 5rem;
padding: .4rem;
background-color: #F1F1F7;
border-radius: .2rem;
position: relative;
}
.about-list__item::after {
content: "";
position: absolute;
width: 0.62rem;
height: 0.62rem;
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/angle-decor.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
z-index: 1;
}
.about-list__item:nth-of-type(odd) {
align-self: flex-start;
}
.about-list__item:nth-of-type(odd)::after {
right: 0;
bottom: 0;
}
.about-list__item:nth-of-type(even) {
align-self: flex-end;
margin-top: -0.2rem;
}
.about-list__item:nth-of-type(even)::after {
top: 0;
left: 0;
transform: rotate(180deg);
}
.about-list__item:not(:last-child):nth-of-type(even) {
margin-bottom: 0.2rem;
}
.about-list__title {
font-size: .13rem;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: .01rem;
text-transform: uppercase;
margin-bottom: 0.1rem;
}
.about-list__description {
font-size: .24rem;
font-style: normal;
font-weight: 700;
line-height: .3rem;
}
.about-list-new {
max-width: 8.3rem;
margin: 0 auto;
display: flex;
align-items: center;
gap: 1.2rem;
}
.about-list-new__item {
padding-left: 0.3rem;
position: relative;
}
.about-list-new__item::before {
content: "";
width: 0.09rem;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.about-list-new__item:first-child:before {
background-color: #0656B2;
}
.about-list-new__item:last-child:before {
background-color: #FFDA33;
}
.about-list-new__title {
font-size: .13rem;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 1px;
text-transform: uppercase;
color: #000;
margin-bottom: 0.14rem;
}
.about-list-new__description {
color: #000;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 30px;
} .contacts {
padding: 1rem;
background-color: #fff;
border-radius: .6rem;
background: #152435;
color: #FFF;
}
.contacts__top {
margin-bottom: 0.4rem;
max-width: 3rem;
}
.contacts__title {
font-size: .36rem;
font-style: normal;
font-weight: 800;
line-height: .43rem;
margin-bottom: 0.1rem;
}
.contacts__text {
font-size: .17rem;
font-style: normal;
font-weight: 400;
line-height: .27rem;
color: #FFF;
}
.contacts__row {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 1rem;
}
.contact-title {
font-size: .12rem;
font-style: normal;
font-weight: 500;
line-height: normal;
letter-spacing: .01rem;
text-transform: uppercase;
color: #8A919A;
margin-bottom: 0.06rem;
}
.contacts__col {
display: flex;
flex-direction: column;
gap: .4rem;
}
.contacts__innerRow {
display: grid;
grid-template-columns: 1fr 1fr;
gap: .7rem;
}
.contacts__bg {
margin-top: 1rem;
}
.contacts__bg  img{
max-width: 100%;
object-fit: contain; 
} @media only screen and (max-width: 767px) {
.page-home {
padding-bottom: 0;
} .desktop-video,
.photo-desk {
display: none !important;
}
.photo-mob,
.mobile-video {
display: block !important;
}
.swiper-slide__content {
padding: 0 .2rem;
}
.intro-slider__title {
font-size: .34rem;
line-height: 0.4rem;
margin-bottom: 0.1rem;
}
.intro-slider__description {
font-size: .17rem;
line-height: .25rem; 
}
.intro__nav.intro__nav {
gap: .15rem;
}
.intro__nav_item span {
display: none;
}
.intro__nav_item.intro__nav_item {
width: 0.1rem !important;
height: 0.1rem !important;
border-radius: 50%;
background-color: #fff;
padding: 0 !important;
opacity: 0.5 !important;
transition: opacity .3s;
}
.intro__nav_item.intro__nav_item.swiper-pagination-bullet-active {
opacity: 1 !important;
} .blocks {
padding: 0;
width: calc(100% + .4rem);
margin-left: -0.2rem;
gap: 0;
}
.block {
border-radius: 0;
padding: 4rem .2rem 0.5rem;
}
.block__top {
flex-direction: column;
align-items: flex-start;
margin-bottom: 0.3rem;
}
.block__description {
width: 100%;
margin-bottom: 0.4rem;
}
.block__btns {
width: 100%;
}
.block__info {
margin-top: 0.3rem;
max-width: 100%;
}
.advantages-list {
width: 100%;
grid-template-columns: 1fr;
gap: .3rem;
}
.agrocultures-list {
margin-top: 0.2rem;
width: 100%;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: .4rem .3rem;
}
.block__img {
border-radius: 0;
} .about {
padding: .6rem 0;
}
.about-list {
gap: .2rem;
}
.about-list__item {
width: 100%;
padding: .25rem;
}
.about-list__title {
font-size: 0.12rem;
}
.about-list__description {
font-size: 0.2rem;
}
.about-list__item:nth-of-type(even) {
align-self: flex-start;
margin-top: 0;
}
.about-list__item::after {
display: none !important;
}
.about-list-new {
flex-direction: column;
gap: 60px;
}
.about-list-new__title {
font-size: 0.12rem;
margin-bottom: 0.1rem;
}
.about-list-new__description {
font-size: 0.2rem;
line-height: 0.26rem;
} .contacts {
width: calc(100% + .4rem);
margin-left: -0.2rem;
padding: .5rem .2rem;
border-radius: 0;
}
.contacts__bg {
display: none;
}
.contacts__top {
margin-bottom: 0.3rem;
}
.contacts__text {
font-size: 0.2rem;
}
.contacts__col {
gap: .25rem;
}
.contacts__row {
grid-template-columns: 1fr;
gap: .4rem
}
.contacts__innerRow {
grid-template-columns: 1fr;
gap: .25rem;
}
}
.page-template-page-consumers-template .main-header,
.post-type-archive .main-header {
position: fixed;
background: #1d1d1b;
box-shadow: 0 0.01rem 0.2rem rgba(0, 0, 0, 0.06);
}
.consumers-page {
padding: 1.3rem 0 1.2rem 0;
background-color: #fafafa;
}
.intro-consumers {
margin-bottom: 1rem;
}
.back-btn {
display: inline-block;
padding: 0.19rem 0.3rem 0.19rem 0.28rem;
position: relative;
margin-bottom: 0.6rem;
font-weight: bold;
font-size: 0.15rem;
line-height: 0.22rem;
color: #242423;
}
.back-btn::before {
content: "";
display: block;
width: 0.28rem;
height: 0.6rem;
position: absolute;
top: 0;
left: 0;
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/icon-arrow-left.svg);
background-position: center left;
background-repeat: no-repeat;
transition: -webkit-transform 0.5s;
transition: transform 0.5s;
transition: transform 0.5s, -webkit-transform 0.5s;
}
.back-btn:hover::before {
-webkit-transform: translateX(-0.03rem);
transform: translateX(-0.03rem);
}
.intro-consumers {
max-width: 6.2rem;
}
.intro-consumers h1 {
margin-bottom: 0.16rem;
}
.intro-consumers p {
font-size: 0.16rem;
line-height: 0.26rem;
color: #1e1e1e;
}
.consumers-section {
margin-bottom: 0.8rem;
}
.consumers-title {
font-size: 0.28rem;
line-height: 0.38rem;
color: #1e1e1e;
margin-bottom: 0.3rem;
}
.consumers-docs-list {
display: -ms-grid;
display: grid;
grid-gap: 0.2rem;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
}
.cons-doc-link {
height: 100%;
display: block;
padding: 0.2rem 0.3rem;
background-color: #fff;
border-radius: 0.2rem;
box-shadow: 0 0.04rem 0.5rem rgba(17, 17, 17, 0.05);
}
.cons-doc-title {
font-weight: 600;
font-size: 0.16rem;
line-height: 0.26rem;
color: #1e1e1e;
margin-bottom: 0.02rem;
transition: color 0.5s;
}
.cons-doc-type {
display: block;
font-weight: 600;
font-size: 0.16rem;
line-height: 0.26rem;
color: #999999;
}
.cons-doc-link:hover .cons-doc-title {
color: #f4b268;
}
.blog-wrapper {
width: 7.6rem;
margin: auto;
}
.blog-content {
padding: 1.5rem 0 1.6rem 0;
}
.blog-content .last-news-list > li {
margin-bottom: 0.4rem;
}
.blog-single {
padding: 1.3rem 0 1.5rem 0;
}
.blog-article-date-publicate {
font-size: 0.15rem;
line-height: 0.24rem;
color: #999999;
margin-bottom: 0.1rem;
}
.blog-article-title {
width: 6.6rem;
margin-bottom: 0.2rem;
}
.single-blog-editor p {
font-size: 0.18rem;
line-height: 0.3rem;
color: #1e1e1e;
}
.single-blog-editor a {
text-decoration: underline;
font-size: 0.18rem;
line-height: 0.3rem;
color: #1e1e1e;
}
.single-blog-editor h2 {
font-size: 0.3rem;
line-height: 0.4rem;
color: #1e1e1e;
margin-bottom: 0.2rem;
margin-top: 0.2rem;
}
.single-blog-editor h3 {
font-size: 0.24rem;
line-height: 0.34rem;
color: #1e1e1e;
margin-bottom: 0.2rem;
margin-top: 0.2rem;
}
.single-blog-editor img {
display: block;
width: 100%;
height: auto;
margin: 0.3rem 0;
}
.single-blog-editor h4 {
font-size: 0.18rem;
line-height: 0.28rem;
color: #1e1e1e;
margin-bottom: 0.2rem;
margin-top: 0.2rem;
}
.single-blog-editor h5 {
font-size: 0.14rem;
line-height: 0.24rem;
color: #1e1e1e;
margin-bottom: 0.2rem;
margin-top: 0.2rem;
}
.single-blog-editor ul,
.single-blog-editor ol {
padding: 0 0 0 0.2rem;
margin: 0 0 0.2rem 0;
}
.single-blog-editor ul > li {
list-style: disc;
font-size: 0.18rem;
line-height: 0.3rem;
margin-bottom: 0.02rem;
}
.single-blog-editor ol > li {
list-style: decimal;
font-size: 0.18rem;
line-height: 0.3rem;
margin-bottom: 0.02rem;
}
.single-blog-editor {
margin-bottom: 0.6rem;
}
.share-post {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
padding: 0.15rem;
background: #3b5998;
border-radius: 0.1rem;
font-weight: 600;
font-size: 0.12rem;
line-height: 0.22rem;
letter-spacing: 0.01rem;
color: #ffffff;
text-align: center;
transition: opacity 0.5s;
}
.share-post:hover {
opacity: 0.8;
}
.share-post-icon {
display: inline-block;
width: 0.5rem;
height: 0.5rem;
padding: 0.12rem;
background-image: url(//nrukraine.com/wp-content/themes/gasoil-theme/img/elements/facebook_icon.svg);
background-position: center;
background-size: 0.26rem;
background-repeat: no-repeat;
margin-right: 0.06rem;
}
.also-read {
padding: 1.5rem 0 0 0;
}
.also-read h2 {
font-size: 0.3rem;
line-height: 0.4rem;
text-align: center;
color: #1e1e1e;
margin-bottom: 1rem;
} .page-wrapper {
padding-top: 0.6rem;
}
.wrapper {
max-width: 12rem;
padding: 0 0.3rem;
margin: 0 auto;
}
.container {
padding: 0 .2rem;
max-width: 12.80rem;
margin: 0 auto;
} .main-btn {
background: none;
border: none;
outline: none;
display: inline-block;
padding: 0.12rem 0.16rem;
font-family: var(--font-primary);
font-weight: 700;
font-size: 0.12rem;
text-align: center;
line-height: normal;
letter-spacing: 1px;
text-transform: uppercase;
background: var(--color-primary);
color: var(--color-black);
transition: transform 0.3s, box-shadow 0.3s;
}
.main-btn:hover {
box-shadow: rgb(0 0 0 / 20%) 0px 0.1rem 0.2rem -0.05rem;
-webkit-transform: translateY(-0.02rem);
transform: translateY(-0.02rem);
}
.main-btn.grey {
background: rgba(255, 255, 255, 0.10);
color: #FFF;
}
.main-btn.black {
background: var(--color-black);
color: #FFF;
}
.main-btn.light {
box-shadow: 0px 100px 80px rgba(0, 105, 149, 0.08),
0px 41.7776px 33.4221px rgba(0, 105, 149, 0.0575083),
0px 22.3363px 17.869px rgba(0, 105, 149, 0.0476886),
0px 12.5216px 10.0172px rgba(0, 105, 149, 0.04),
0px 6.6501px 5.32008px rgba(0, 105, 149, 0.0323114),
0px 2.76726px 2.21381px rgba(0, 105, 149, 0.0224916);
color: #242423;
background-color: #fff;
}
.main-btn.dark {
color: #fff;
background: #1d1d1f;
} .section-title {
font-size: 0.36rem;
line-height: 0.46rem;
color: #1e1e1e;
}
.bg-var,
.last-news {
transition: background 0.5s;
}
.page-home.dark {
background: #0a0a0a;
}
.page-home.light {
background: #f0f0f0;
}@media only screen and (max-width: 767px) {
html {
font-size: 26.666666666666668vw;
} .wrapper,
.cooperation-wrapper {
width: 100%;
padding: 0 0.2rem;
}
.about-resources {
padding: 0 0 0.5rem 0;
}
.about-resources-container {
width: 100%;
padding: 0 0.3rem 0.8rem;
display: flex;
flex-direction: column-reverse;
border-radius: 0;
}
.about-resources .resources-wrapper {
flex-direction: column;
}
.resources-wrapper {
padding: 0;
}
.about-gas {
background: #efefef;
}
.about-gas-img-cont {
position: initial;
width: 100%;
height: 3.8rem;
border-radius: 0;
top: auto;
transform: translateY(-0.5rem);
}
.about-resources-left-col {
padding: 0;
box-shadow: none;
width: 100%;
margin-left: 0;
}
.about-resources-left-col::after {
content: "";
display: block;
width: 100%;
height: 2.8rem;
background: linear-gradient(
180deg,
rgba(240, 240, 240, 0) 55.18%,
rgba(240, 240, 240, 0.6) 87.5%
),
linear-gradient(180deg, rgba(240, 240, 240, 0) 0%, #f0f0f0 100%);
position: absolute;
bottom: 0;
left: 0;
z-index: 1;
}
.resources-wrapper > div {
width: 100%;
}
.resources-wrapper,
.about-electro .resources-wrapper {
padding: 0 0.25rem;
}
.about-resources-right-col {
margin: -0.4rem 0 0.3rem 0;
position: relative;
z-index: 1;
padding: 0;
}
.about-resources-right-col h2 {
font-size: 0.26rem;
line-height: 0.36rem;
margin-bottom: 0.1rem;
}
.about-resources-descr {
font-size: 0.15rem;
margin-bottom: 0.25rem;
}
.about-resources-adv-list > li {
width: 100%;
display: flex;
align-items: center;
padding: 0.1rem 0 0.1rem 0;
}
.about-resources-adv-list > li:not(:last-child) {
margin-right: 0;
}
.about-resources-adv-icon-cont {
margin-bottom: 0;
margin-right: 0.2rem;
}
.about-resources-adv-descr {
max-width: 2rem;
}
.about-resources-adv-list {
width: 100%;
flex-direction: column;
}
.resources-btns-container {
flex-direction: column;
}
.resources-btn {
width: 100%;
text-align: center;
}
.resources-btns-container > a:not(:last-child) {
margin-right: 0;
margin-bottom: 0.2rem;
}
.about-resources-descr-cont {
padding: 0.35rem 0.25rem;
background: #fff;
box-shadow: 0 0.04rem 0.5rem rgba(17, 17, 17, 0.05);
border-radius: 0.2rem;
}
.about-electro .about-resources-right-col {
padding: 0;
}
.about-electro .about-resources-left-col::after {
display: none; } .about-gas .about-resources-container {
flex-direction: column;
}
.last-news {
padding: 1rem 0 0 0;
}
.last-news .wrapper {
padding: 0;
}
.last-news h2 {
font-size: 0.26rem;
line-height: 0.36rem;
margin-bottom: 0.6rem;
}
.last-news-mobile-wrapper {
overflow: auto;
padding: 0 0 0 0.15rem;
}
.last-news-list {
flex-wrap: nowrap;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
}
.last-news-list > li {
width: 3.25rem;
margin: 0 0.15rem 0 0;
}
.last-news-list > li:nth-of-type(3n-1) {
margin: 0 0.15rem 0 0;
}
.read-more-btn-container {
margin-top: 0.36rem;
padding: 0 0.25rem 0 0;
}
.cooperation {
padding: 0.4rem 0 1rem 0;
}
.cooperation .about-item-descr {
max-width: 100%;
}
.cooperation .about-icon-cont {
display: none;
}
.cooperation-heading {
padding: 0.1rem 0;
margin-bottom: 0.2rem;
}
.cooperation .wrapper {
flex-direction: column;
}
.section-title {
font-size: 0.26rem;
line-height: 0.36rem;
}
.cooperation-wrapper {
padding: 0.4rem 0.25rem 0 0.25rem;
height: auto;
flex-direction: column;
}
.coop-item-left-col {
margin-right: 0;
}
.cooperation-left-col {
margin-bottom: 0.4rem;
}
.back-btn {
display: none;
}
.consumers-page {
padding: 1.2rem 0 0.4rem 0;
}
.intro-consumers {
max-width: 100%;
margin-bottom: 0.6rem;
padding: 0 0.25rem;
}
.intro-consumers p {
font-size: 0.15rem;
}
.consumers-section {
padding: 0 0.15rem;
margin-bottom: 0.6rem;
}
.consumers-title {
font-size: 0.2rem;
line-height: 0.3rem;
margin-bottom: 0.3rem;
padding: 0 0.1rem;
}
.consumers-docs-list {
grid-gap: 0.1rem;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
.cons-doc-link {
padding: 0.15rem;
}
.cons-doc-title {
font-weight: bold;
font-size: 0.14rem;
line-height: 0.24rem;
}
.post-type-archive {
background: #f0f0f0;
}
.post-type-archive .main-header {
box-shadow: none;
}
.blog-content {
padding: 0.85rem 0 1rem 0;
}
.blog-content .last-news-list {
width: 100%;
flex-direction: column;
flex-wrap: wrap;
}
.blog-content .last-news-list {
padding: 0 0.15rem;
}
.blog-content .last-news-list > li {
width: 100%;
margin-bottom: 0.2rem;
}
.news-item-thumb-container {
height: 2rem;
}
.news-item-descr {
position: initial;
}
.news-item-title {
max-width: 2.5rem;
}
.blog-wrapper,
.blog-article-title {
width: 100%;
}
.blog-wrapper {
padding: 0 0.25rem;
}
.also-read {
display: none;
}
.blog-single {
padding: 1rem 0;
}
.blog-article-date-publicate {
font-size: 0.13rem;
line-height: 0.22rem;
margin-bottom: 0.1rem;
}
.single-blog-editor p,
.single-blog-editor ul > li,
.single-blog-editor ol > li {
font-size: 0.17rem;
line-height: 0.28rem;
}
.text p.img-cont {
margin: 0;
}
.img-cont,
.single-blog-editor img {
width: calc(100% + 0.5rem) !important;
margin-left: -0.25rem !important;
}
.single-blog-editor h2 {
font-size: 0.2rem;
line-height: 0.3rem;
}
.single-blog-editor h3 {
font-size: 0.18rem;
line-height: 0.28rem;
}
.single-blog-editor h4 {
font-size: 0.15rem;
line-height: 0.24rem;
}
.single-blog-editor {
margin-bottom: 0.4rem;
}
.share-post {
padding: 0.05rem;
}
.form-container {
width: calc(100% - 0.3rem);
padding: 0.8rem 0.2rem 0.2rem;
border-radius: 0.2rem;
}
#form_submit_btn {
padding: 0.14rem 0.5rem;
}
.success-mssg {
width: 100%;
padding: 0 0 0.6rem;
}
.map-container {
width: calc(100% - 0.2rem);
height: calc(100% - 0.2rem);
border-radius: 0.1rem;
}
}.js-ticker{overflow:hidden}.js-ticker-track{white-space:nowrap}.js-ticker-item{white-space:normal;height:100%;vertical-align:top;display:inline-block;position:relative}@supports ((display: -webkit-box) or (display: flex)){.js-ticker-track{position:relative;white-space:normal;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.js-ticker-item{height:auto;display:block;-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto}.js-ticker.active .js-ticker-track{display:-webkit-box;display:-ms-flexbox;display:flex}.js-ticker.active .js-ticker-item{-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto}}