.pageheader-block-basic {
position: relative;
color: #fff; display: flex;
align-items: center;
padding-top: var(--main-menu-height);
overflow: hidden; height: calc(100svh + 1px - var(--top-bar-height) - var(--main-menu-height));
}
.admin-bar .pageheader-block-basic {
height: calc(
100svh + 1px - var(--top-bar-height) - var(--wp-admin--admin-bar--height) -
var(--main-menu-height)
);
}
.pageheader-block-basic .container {
width: 100%;
}
.pageheader-block__background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover; z-index: -1; }
.pageheader-block__inner {
position: relative; max-width: 800px;
margin: 0 auto;
text-align: left;
z-index: 1;
} .pageheader-block-basic h1,
.pageheader-block-basic h2,
.pageheader-block-basic h3,
.pageheader-block-basic h4,
.pageheader-block-basic h5,
.pageheader-block-basic h6 {
font-size: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
}
.pageheader-block-basic .pageheader-block__subtitle {
font-size: 27px;
font-weight: 600;
color: #fff;
margin-bottom: 10px;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
.pageheader-block-basic.alt .pageheader-block__subtitle {
color: #00a44a;
}
.pageheader-block-basic .pageheader-block__title {
font-size: 58px;
font-weight: 600;
color: #fff;
margin-bottom: 10px;
font-family: "roc-grotesk", sans-serif;
line-height: 1;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
.pageheader-block-basic.alt .pageheader-block__title {
color: #00a44a;
}
.pageheader-block-basic p {
font-size: 22px;
line-height: 1.5em;
color: #fff;
margin: 0;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
.pageheader-block-basic.alt p {
color: #222623;
}
.pageheader-block-basic .scroll-down {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
background: none;
border-radius: 100px;
width: 60px;
height: 60px;
transition: 0.3s;
cursor: pointer;
}
.pageheader-block-basic .scroll-down:hover {
background: rgba(255, 255, 255, 0.3);
}
@media (max-width: 1920px) and (min-width: 1200px) {
.pageheader-block-basic .pageheader-block__inner {
max-width: calc(800 / 1920 * 100vw);
}
.pageheader-block-basic .pageheader-block__subtitle {
font-size: calc(27 / 1920 * 100vw);
margin-bottom: calc(10 / 1920 * 100vw);
}
.pageheader-block-basic .pageheader-block__title {
font-size: calc(58 / 1920 * 100vw);
margin-bottom: calc(10 / 1920 * 100vw);
}
.pageheader-block-basic p {
font-size: calc(22 / 1920 * 100vw);
}
.pageheader-block-basic .scroll-down {
bottom: calc(20 / 1920 * 100vw);
border-radius: calc(100 / 1920 * 100vw);
width: calc(60 / 1920 * 100vw);
height: calc(60 / 1920 * 100vw);
}
}.pageheader-block.pageheader-video-block {
position: relative;
color: #fff;
overflow: hidden;
}
.pageheader-video-block {
height: calc(
100svh + 1px - var(--top-bar-height) - var(--notowania-slider-height) -
var(--notifications-slider-height)
);
}
.admin-bar .pageheader-video-block {
height: calc(
100svh + 1px - var(--top-bar-height) - var(--wp-admin--admin-bar--height) -
var(--notowania-slider-height) - var(--notifications-slider-height)
);
} .pageheader-video-block .pageheader-video-block__poster {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
z-index: 2;
opacity: 1;
transition: opacity 0.5s ease; display: flex;
align-items: center;
}
.pageheader-video-block .pageheader-video-block__poster .container {
width: 100%;
} .video-playing .pageheader-video-block__poster {
opacity: 0;
} .pageheader-video-block h1,
.pageheader-video-block h2,
.pageheader-video-block h3,
.pageheader-video-block h4,
.pageheader-video-block h5,
.pageheader-video-block h6 {
font-size: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
} .pageheader-video-block .pageheader-block__subtitle {
font-size: 27px;
font-weight: 600;
color: #fff;
margin-bottom: 10px;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
} .pageheader-video-block .pageheader-block__title {
font-size: 58px;
font-weight: 600;
color: #fff;
margin-bottom: 10px;
font-family: "roc-grotesk", sans-serif;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
} .pageheader-video-block p {
font-size: 22px;
line-height: 1.5em;
color: #fff;
margin: 0;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
.pageheader-video-block .pageheader-block__footer-text {
display: flex;
align-items: center;
gap: 15px;
margin-top: 50px;
}
.pageheader-video-block .pageheader-block__footer-text img {
width: 45px;
height: 45px;
}
.pageheader-video-block .pageheader-block__footer-text span {
font-size: 30px;
font-weight: 700;
text-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
} .pageheader-video-block .pageheader-video-block__play-button {
display: inline-block;
background: none;
color: #fff;
padding: 0;
margin-bottom: 15px;
cursor: pointer;
border: none;
z-index: 3;
width: 75px;
height: 75px;
}
.pageheader-video-block__play-button img {
width: 75px;
height: 75px;
}
.pageheader-video-block__play-button:hover {
opacity: 0.7;
} .pageheader-video-block__video-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
background: #000;
opacity: 1;
transition: opacity 0.5s ease;
pointer-events: none; } .video-playing .pageheader-video-block__video-bg {
opacity: 1;
pointer-events: auto;
} .video-playing .pageheader-block__inner {
display: none;
} .pageheader-video-block__stop-button {
position: absolute;
bottom: 20px;
right: 20px;
background: rgba(0, 0, 0, 0.6);
color: #fff;
padding: 10px 15px;
cursor: pointer;
border: none;
font-size: 1rem;
font-weight: 600;
transition: opacity 0.5s ease;
z-index: 3;
opacity: 0; pointer-events: none; } .video-playing .pageheader-video-block__stop-button {
opacity: 1;
pointer-events: auto;
}
.pageheader-video-block__stop-button:hover {
background: rgba(255, 255, 255, 0.3);
}
.pageheader-video-block .scroll-down {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
background: none;
border-radius: 100px;
width: 60px;
height: 60px;
transition: 0.3s;
cursor: pointer;
}
.pageheader-video-block .scroll-down:hover {
background: rgba(255, 255, 255, 0.3);
}
@media (max-width: 1920px) and (min-width: 1200px) {
.pageheader-video-block .pageheader-video-block__subtitle {
font-size: calc(27 / 1920 * 100vw);
margin-bottom: calc(10 / 1920 * 100vw);
}
.pageheader-video-block .pageheader-block__title {
font-size: calc(58 / 1920 * 100vw);
margin-bottom: calc(10 / 1920 * 100vw);
}
.pageheader-video-block p {
font-size: calc(22 / 1920 * 100vw);
margin: 0;
}
.pageheader-video-block .pageheader-block__footer-text {
gap: calc(15 / 1920 * 100vw);
margin-top: calc(50 / 1920 * 100vw);
}
.pageheader-video-block .pageheader-block__footer-text img {
width: calc(45 / 1920 * 100vw);
height: calc(45 / 1920 * 100vw);
}
.pageheader-video-block .pageheader-block__footer-text span {
font-size: calc(30 / 1920 * 100vw);
}
.pageheader-video-block .pageheader-video-block__play-button {
width: calc(75 / 1920 * 100vw);
height: calc(75 / 1920 * 100vw);
margin-bottom: calc(15 / 1920 * 100vw);
}
.pageheader-video-block__play-button img {
width: calc(75 / 1920 * 100vw);
height: calc(75 / 1920 * 100vw);
}
.pageheader-video-block__stop-button {
bottom: calc(20 / 1920 * 100vw);
right: calc(20 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(15 / 1920 * 100vw);
font-size: calc(1rem / 1920 * 100vw);
}
.pageheader-video-block .scroll-down {
bottom: calc(20 / 1920 * 100vw);
border-radius: calc(100 / 1920 * 100vw);
width: calc(60 / 1920 * 100vw);
height: calc(60 / 1920 * 100vw);
}
}.icon-buttons-block {
display: inline-flex;
gap: 20px;
flex-wrap: wrap;
}
.icon-button {
display: inline-flex;
align-items: center;
border: 1px solid #000;
border-radius: 100px;
padding: 15px 50px;
text-decoration: none;
background: #fff;
gap: 15px;
line-height: 1;
transition: 0.3s;
cursor: pointer;
}
.icon-button:hover {
filter: invert(1);
border: 1px solid white;
}
.icon-button__icon {
width: 20px;
height: 20px;
}
.icon-button__label {
font-size: 22px;
color: #000;
font-weight: 500;
}
@media (max-width: 1920px) and (min-width: 1000px) {
.icon-buttons-block {
gap: calc(20 / 1920 * 100vw);
}
.icon-button {
border-radius: calc(100 / 1920 * 100vw);
padding: calc(15 / 1920 * 100vw) calc(50 / 1920 * 100vw);
gap: calc(15 / 1920 * 100vw);
}
.icon-button__icon {
width: calc(20 / 1920 * 100vw);
height: calc(20 / 1920 * 100vw);
}
.icon-button__label {
font-size: calc(22 / 1920 * 100vw);
}
}.swiper-container.scroll .swiper-slide {
height: auto;
}
.swiper-container.scroll {
height: 100px;
padding-right: 2rem;
margin-right: -2rem;
}
.swiper-scrollbar-drag {
background: #2226238a;
}
.scroll-wrapper {
display: flex;
flex-direction: column;
}
.swiper-container.scroll {
flex-grow: 1;
}
.swiper-container.scroll .swiper-slide {
height: auto;
}
.swiper-container {
position: relative;
max-height: 100%;
overflow: hidden;
--swiper-pagination-color: #efcc90;
}
.swiper-container:not(.scroll) {
padding-bottom: 70px;
margin-bottom: 40px;
}
.swiper-button-prev {
background-image: url(//worol.pl/wp-content/themes/oil/assets/images/arrow-circle-black.svg);
left: calc((100vw - 1640px) / 4 - 22.5px);
}
.swiper-button-next {
background-image: url(//worol.pl/wp-content/themes/oil/assets/images/arrow-circle-black.svg);
transform: rotate(180deg);
right: calc((100vw - 1640px) / 4 - 22.5px);
}
.swiper-button-prev,
.swiper-button-next {
width: 45px;
height: 45px;
background-size: contain;
background-repeat: no-repeat;
background-color: white;
border-radius: 100px;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after,
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
content: none;
}
.wp-block-codevly-blocks-slider {
padding-bottom: 0 !important;
}
.slider-tabs {
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
margin-bottom: 50px;
padding: 0;
}
.slider-tabs .slider-tab {
color: #88918a;
text-transform: uppercase;
font-size: 22px;
font-weight: 400;
cursor: pointer;
position: relative;
}
.slider-tabs .slider-tab::before {
content: "";
display: block;
width: calc(100% - 20px);
height: 2px;
background: #222623;
position: absolute;
top: 100%;
opacity: 0;
transition: 0.3s;
}
.slider-tabs .slider-tab:last-of-type::before {
width: 100%;
}
.slider-tabs .slider-tab.active,
.slider-tabs .slider-tab:hover {
color: #222623;
}
.slider-tabs .slider-tab.active::before,
.slider-tabs .slider-tab:hover::before {
opacity: 1;
}
.slider-tabs .slider-tab:not(:last-of-type):after {
content: "|";
display: inline-block;
margin-left: 15px;
color: #88918a;
}
.slider-tabs .slider-tab.active {
color: #222623;
}
@media (max-width: 1920px) and (min-width: 1000px) {
.swiper-container:not(.scroll) {
padding-bottom: calc(70 / 1920 * 100vw);
margin-bottom: calc(40 / 1920 * 100vw);
}
.swiper-button-prev {
left: 30px;
}
.swiper-button-next {
right: 30px;
}
.swiper-button-prev,
.swiper-button-next {
width: calc(45 / 1920 * 100vw);
height: calc(45 / 1920 * 100vw);
border-radius: calc(100 / 1920 * 100vw);
}
.slider-tabs {
gap: calc(15 / 1920 * 100vw);
margin-bottom: calc(50 / 1920 * 100vw);
}
.slider-tabs .slider-tab {
font-size: calc(22 / 1920 * 100vw);
}
}.team-block {
position: relative;
margin-top: 30px;
}
.team-block__tabs {
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
margin-bottom: 20px;
}
.team-block__tab {
color: #88918a;
text-transform: uppercase;
font-size: 22px;
font-weight: 400;
cursor: pointer;
position: relative;
}
.team-block__tab::before {
content: "";
display: block;
width: calc(100% - 25px);
height: 2px;
background: #222623;
position: absolute;
top: 100%;
opacity: 0;
transition: 0.3s;
}
.team-block__tab:last-of-type::before {
width: 100%;
}
.team-block__tab.active,
.team-block__tab:hover {
color: #222623;
}
.team-block__tab.active::before,
.team-block__tab:hover::before {
opacity: 1;
}
.team-block__tab:not(:last-of-type):after {
content: "|";
display: inline-block;
margin-left: 15px;
color: #88918a;
} .team-block__employee-tabs {
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
margin-bottom: 50px;
}
.team-block__employee-tab {
color: #88918a;
text-transform: uppercase;
font-size: 18px;
font-weight: 400;
cursor: pointer;
}
.team-block__employee-tab.active,
.team-block__employee-tab:hover {
color: #222623;
}
.team-block__employee-tab:not(:last-of-type):after {
content: "|";
display: inline-block;
margin-left: 15px;
color: #88918a;
}
.team-block__employee-department {
font-size: 22px;
text-transform: uppercase;
}
.team-block__employee-name {
font-size: 24px;
margin: 0; font-size: 56px;
line-height: 0.9;
color: #222623;
}
.team-block__employee-position {
font-size: 22px;
}
.team-block__employee-content {
font-size: 16px;
height: 200px !important;
flex-grow: 1;
margin-top: 15px; font-size: 22px;
}
.team-block__employee-content p {
margin-top: 0;
}
.team-block .alignwide {
display: flex;
gap: 90px;
}
.team-block .alignwide .left {
flex: 1;
flex-basis: 50%;
}
.team-block .alignwide .left img {
width: 100%;
}
.team-block .alignwide .right {
flex: 1;
flex-basis: 50%;
display: flex;
flex-direction: column;
}
.team-block__employee-contact {
display: flex;
gap: 20px;
padding-top: 25px;
}
.team-block__employee-contact a {
color: black;
text-decoration: none;
border: 1px solid black;
padding: 12px 40px;
line-height: 1;
display: block;
border-radius: 100px;
font-size: 20px;
}
.team-block__slider {
padding-bottom: 0 !important;
}
@media (max-width: 1920px) and (min-width: 1000px) {
.team-block {
margin-top: calc(30 / 1920 * 100vw);
}
.team-block__tabs {
gap: calc(15 / 1920 * 100vw);
margin-bottom: calc(20 / 1920 * 100vw);
}
.team-block__tab {
font-size: calc(22 / 1920 * 100vw);
}
.team-block__employee-tabs {
gap: calc(15 / 1920 * 100vw);
margin-bottom: calc(50 / 1920 * 100vw);
}
.team-block__employee-tab {
font-size: calc(18 / 1920 * 100vw);
}
.team-block__employee-department {
font-size: calc(22 / 1920 * 100vw);
}
.team-block__employee-name {
font-size: calc(56 / 1920 * 100vw);
line-height: 0.9;
}
.team-block__employee-position {
font-size: calc(22 / 1920 * 100vw);
}
.team-block__employee-content {
font-size: calc(22 / 1920 * 100vw);
height: calc(200 / 1920 * 100vw) !important;
margin-top: calc(15 / 1920 * 100vw);
}
.team-block .alignwide {
gap: calc(90 / 1920 * 100vw);
}
.team-block__employee-contact {
gap: calc(20 / 1920 * 100vw);
padding-top: calc(25 / 1920 * 100vw);
}
.team-block__employee-contact a {
padding: calc(12 / 1920 * 100vw) calc(40 / 1920 * 100vw);
border-radius: calc(100 / 1920 * 100vw);
font-size: calc(20 / 1920 * 100vw);
}
}.faq-wrapper {
margin: 20px 0;
color: #222623;
}
.faq-heading-wrapper {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #707070;
padding-bottom: 30px;
padding-left: 15px;
padding-right: 15px;
} .faq-section-title {
font-size: 30px;
margin-bottom: 15px;
font-weight: 700;
margin: 0;
} .faq-search {
display: block;
max-width: 300px;
padding: 10px 30px;
font-size: 22px;
border-radius: 100px;
border: 1px solid #575757;
background-image: url(//worol.pl/wp-content/themes/oil/assets/images/search.svg);
background-repeat: no-repeat;
background-position: center right 30px;
background-size: 24px;
outline: none !important;
font-family: "proxima-nova", sans-serif;
line-height: 1;
}
.faq-search::placeholder {
color: black;
font-style: italic;
} .faq-title {
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
}
.faq-title .faq-item-question {
font-size: 22px;
font-weight: bold;
margin: 0;
} .faq-toggle {
display: inline-flex;
align-items: center;
background-color: transparent;
border: 1px solid #efcc90;
border-radius: 100px;
font-weight: 600;
color: #575757;
cursor: pointer;
padding: 10px 30px;
font-size: 18px;
font-weight: 500;
line-height: 1;
transition: 0.3s;
}
.faq-toggle img {
width: 20px;
height: 20px;
margin-left: 8px;
transition: transform 0.3s ease;
} .faq-content {
overflow: hidden;
height: 0;
transition: height 0.3s ease, padding 0.3s ease;
padding-top: 0;
} .faq-item.active .faq-content { } .faq-item.active .faq-toggle img {
transform: rotate(180deg);
}
.faq-item.active .faq-toggle {
background: #f6f6f6;
} .faq-show-more {
display: block;
margin: 20px auto;
background-color: transparent;
border: 1px solid #efcc90;
border-radius: 100px;
font-weight: 400;
color: black;
cursor: pointer;
padding: 10px 70px;
font-size: 22px !important;
transition: 0.3s;
text-align: center;
font-family: "semplicitapro", sans-serif;
}
.faq-show-more:hover {
background: #efcc90;
} .faq-item {
border-bottom: 1px solid #efcc90;
padding: 15px;
transition: all 0.3s ease;
position: relative;
visibility: visible;
opacity: 1;
max-height: unset;
}
.faq-wrapper .invisible {
visibility: hidden;
opacity: 0;
max-height: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 1920px) and (min-width: 1000px) {
.faq-wrapper {
margin: calc(20 / 1920 * 100vw) 0;
}
.faq-heading-wrapper {
padding-bottom: calc(30 / 1920 * 100vw);
padding-left: calc(15 / 1920 * 100vw);
padding-right: calc(15 / 1920 * 100vw);
}
.faq-section-title {
font-size: calc(30 / 1920 * 100vw);
margin-bottom: calc(15 / 1920 * 100vw);
}
.faq-search {
max-width: calc(300 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(30 / 1920 * 100vw);
font-size: calc(22 / 1920 * 100vw);
border-radius: calc(100 / 1920 * 100vw);
background-position: center right calc(30 / 1920 * 100vw);
background-size: calc(24 / 1920 * 100vw);
}
.faq-title .faq-item-question {
font-size: calc(22 / 1920 * 100vw);
}
.faq-toggle {
border-radius: calc(100 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(30 / 1920 * 100vw);
font-size: calc(18 / 1920 * 100vw);
}
.faq-toggle img {
width: calc(20 / 1920 * 100vw);
height: calc(20 / 1920 * 100vw);
margin-left: calc(8 / 1920 * 100vw);
}
.faq-show-more {
margin: calc(20 / 1920 * 100vw) auto;
border-radius: calc(100 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(70 / 1920 * 100vw);
font-size: calc(18 / 1920 * 100vw);
}
.faq-item {
padding: calc(15 / 1920 * 100vw);
}
}
@media (max-width: 1000px) {
.faq-toggle span {
display: none;
}
.faq-toggle {
padding: 10px 10px;
}
.faq-toggle img {
margin-left: 0;
width: 15px;
height: 15px;
}
.faq-title .faq-item-question {
font-size: 16px;
}
.faq-item {
padding-left: 0;
padding-right: 0;
}
.faq-heading-wrapper {
flex-direction: column;
gap: 20px;
}
.faq-section-title {
font-size: 20px;
text-align: center;
}
.faq-search {
font-size: 16px;
}
}
.two-columns {
gap: 4%;
display: flex;
flex-wrap: wrap;
}
.faq-wrapper.two-columns .faq-item {
width: 48%;
}
.faq-wrapper.two-columns .faq-item:not(.invisible) {
padding: 10px 0;
}
.two-columns .faq-toggle span {
display: none;
}
.two-columns .faq-toggle {
border: none;
padding: 10px 0;
background: none !important;
}
.two-columns .faq-item {
border-bottom: none;
border-top: 1px solid #252728;
}
.two-columns .faq-title .faq-item-question {
font-size: 22px;
}
.faq-item .faq-content {
font-size: 22px;
}
.faq-show-more-wrapper {
width: 100%;
}
@media (max-width: 1920px) and (min-width: 1000px) {
.faq-wrapper {
margin: calc(20 / 1920 * 100vw) 0;
}
.faq-heading-wrapper {
padding-bottom: calc(30 / 1920 * 100vw);
padding-left: calc(15 / 1920 * 100vw);
padding-right: calc(15 / 1920 * 100vw);
}
.faq-section-title {
font-size: calc(30 / 1920 * 100vw);
margin-bottom: calc(15 / 1920 * 100vw);
}
.faq-search {
max-width: calc(300 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(30 / 1920 * 100vw);
font-size: calc(22 / 1920 * 100vw);
border-radius: calc(100 / 1920 * 100vw);
background-position: center right calc(30 / 1920 * 100vw);
background-size: calc(24 / 1920 * 100vw);
}
.faq-title .faq-item-question, .two-columns .faq-title .faq-item-question {
font-size: calc(22 / 1920 * 100vw);
}
.faq-toggle {
border-radius: calc(100 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(30 / 1920 * 100vw);
font-size: calc(18 / 1920 * 100vw);
}
.faq-toggle img {
width: calc(20 / 1920 * 100vw);
height: calc(20 / 1920 * 100vw);
margin-left: calc(8 / 1920 * 100vw);
}
.faq-show-more {
margin: calc(20 / 1920 * 100vw) auto;
border-radius: calc(100 / 1920 * 100vw);
padding: calc(10 / 1920 * 100vw) calc(70 / 1920 * 100vw);
font-size: calc(18 / 1920 * 100vw);
}
.faq-item {
padding: calc(15 / 1920 * 100vw);
}
.faq-item .faq-content {
font-size: calc(22 / 1920 * 100vw);
}
}