/*
Theme Name: NewViva Theme
Author: Batix Schweiz AG
Description: Custom theme developed for the NewViva project
Version: 1.3.3
*/
/* FONTS start */
/* raleway */
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Black.eot');
src: url('assets/fonts/raleway/Raleway-Black.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Black.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Black.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Black.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Black.svg#Raleway-Black') format('svg');
font-weight: 900;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-BlackItalic.eot');
src: url('assets/fonts/raleway/Raleway-BlackItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-BlackItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-BlackItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-BlackItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-BlackItalic.svg#Raleway-BlackItalic') format('svg');
font-weight: 900;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-ExtraBold.eot');
src: url('assets/fonts/raleway/Raleway-ExtraBold.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-ExtraBold.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-ExtraBold.woff') format('woff'),
url('assets/fonts/raleway/Raleway-ExtraBold.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-ExtraBold.svg#Raleway-ExtraBold') format('svg');
font-weight: 800;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-ExtraBoldItalic.eot');
src: url('assets/fonts/raleway/Raleway-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-ExtraBoldItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-ExtraBoldItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-ExtraBoldItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-ExtraBoldItalic.svg#Raleway-ExtraBoldItalic') format('svg');
font-weight: 800;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Bold.eot');
src: url('assets/fonts/raleway/Raleway-Bold.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Bold.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Bold.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Bold.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Bold.svg#Raleway-Bold') format('svg');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-BoldItalic.eot');
src: url('assets/fonts/raleway/Raleway-BoldItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-BoldItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-BoldItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-BoldItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-BoldItalic.svg#Raleway-BoldItalic') format('svg');
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-SemiBold.eot');
src: url('assets/fonts/raleway/Raleway-SemiBold.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-SemiBold.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-SemiBold.woff') format('woff'),
url('assets/fonts/raleway/Raleway-SemiBold.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-SemiBold.svg#Raleway-SemiBold') format('svg');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-SemiBoldItalic.eot');
src: url('assets/fonts/raleway/Raleway-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-SemiBoldItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-SemiBoldItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-SemiBoldItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-SemiBoldItalic.svg#Raleway-SemiBoldItalic') format('svg');
font-weight: 600;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Medium.eot');
src: url('assets/fonts/raleway/Raleway-Medium.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Medium.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Medium.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Medium.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Medium.svg#Raleway-Medium') format('svg');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-MediumItalic.eot');
src: url('assets/fonts/raleway/Raleway-MediumItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-MediumItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-MediumItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-MediumItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-MediumItalic.svg#Raleway-MediumItalic') format('svg');
font-weight: 500;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Regular.eot');
src: url('assets/fonts/raleway/Raleway-Regular.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Regular.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Regular.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Regular.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Regular.svg#Raleway-Regular') format('svg');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Italic.eot');
src: url('assets/fonts/raleway/Raleway-Italic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Italic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Italic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Italic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Italic.svg#Raleway-Italic') format('svg');
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Light.eot');
src: url('assets/fonts/raleway/Raleway-Light.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Light.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Light.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Light.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Light.svg#Raleway-Light') format('svg');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-LightItalic.eot');
src: url('assets/fonts/raleway/Raleway-LightItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-LightItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-LightItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-LightItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-LightItalic.svg#Raleway-LightItalic') format('svg');
font-weight: 300;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-ExtraLight.eot');
src: url('assets/fonts/raleway/Raleway-ExtraLight.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-ExtraLight.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-ExtraLight.woff') format('woff'),
url('assets/fonts/raleway/Raleway-ExtraLight.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-ExtraLight.svg#Raleway-ExtraLight') format('svg');
font-weight: 200;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-ExtraLightItalic.eot');
src: url('assets/fonts/raleway/Raleway-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-ExtraLightItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-ExtraLightItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-ExtraLightItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-ExtraLightItalic.svg#Raleway-ExtraLightItalic') format('svg');
font-weight: 200;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-Thin.eot');
src: url('assets/fonts/raleway/Raleway-Thin.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-Thin.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-Thin.woff') format('woff'),
url('assets/fonts/raleway/Raleway-Thin.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-Thin.svg#Raleway-Thin') format('svg');
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Raleway';
src: url('assets/fonts/raleway/Raleway-ThinItalic.eot');
src: url('assets/fonts/raleway/Raleway-ThinItalic.eot?#iefix') format('embedded-opentype'),
url('assets/fonts/raleway/Raleway-ThinItalic.woff2') format('woff2'),
url('assets/fonts/raleway/Raleway-ThinItalic.woff') format('woff'),
url('assets/fonts/raleway/Raleway-ThinItalic.ttf') format('truetype'),
url('assets/fonts/raleway/Raleway-ThinItalic.svg#Raleway-ThinItalic') format('svg');
font-weight: 100;
font-style: italic;
font-display: swap;
}
/* bumper sticker */
/* URL for license file: assets/fonts/bumper_sticker/Web Font EULA 2.0.txt */
@font-face {
font-family: 'bumper_sticker';
src: url('assets/fonts/bumper_sticker/bumper_sticker-webfont.woff2') format('woff2'),
url('assets/fonts/bumper_sticker/bumper_sticker-webfont.woff') format('woff');
font-weight: normal;
font-style: normal
/*
font-display: swap;
*/
}
[data-font-style="decorative"],
.data-font-style-decorative {
font-family: 'bumper_sticker';
}
/* agriviva icon font */
@font-face {
font-family: 'agriviva_icon_set';
src: url('assets/fonts/icon_font/agriviva_icon_set.eot?fm0wn0');
src: url('assets/fonts/icon_font/agriviva_icon_set.eot?fm0wn0#iefix') format('embedded-opentype'),
url('assets/fonts/icon_font/agriviva_icon_set.ttf?fm0wn0') format('truetype'),
url('assets/fonts/icon_font/agriviva_icon_set.woff?fm0wn0') format('woff'),
url('assets/fonts/icon_font/agriviva_icon_set.svg?fm0wn0#agriviva_icon_set') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="agriviva-"], [class*=" agriviva-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'agriviva_icon_set' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.agriviva-newviva-heart:before {
content: "\e900";
/*color: #c92a4a;*/
}
.agriviva-newviva-user:before {
content: "\e901";
/* color: #c92a4a; */
}
.agriviva-phone:before {
content: "\e902";
/* color: #c92a4a; */
}
.agriviva-pig:before {
content: "\e903";
}
.agriviva-plus:before {
content: "\e904";
/* color: #c92a4a; */
}
.agriviva-rabbit:before {
content: "\e905";
}
/* */
.agriviva-radio-active .path1:before {
content: "\e906";
/* color: rgb(201, 42, 74); */
}
.agriviva-radio-active .path2:before {
content: "\e907";
margin-left: -1em;
color: rgb(255, 255, 255);
}
.agriviva-rasen-graeser:before {
content: "\e908";
/* color: #c8eb24; */
}
.agriviva-replay:before {
content: "\e909";
/* color: #c92a4a; */
}
.agriviva-search:before {
content: "\e90a";
/* color: #c92a4a; */
}
.agriviva-tiktok:before {
content: "\e90b";
/* color: #c92a4a; */
}
.agriviva-user:before {
content: "\e90c";
/* color: #c92a4a; */
}
/* */
.agriviva-whatsapp .path1:before {
content: "\e90d";
/* color: rgb(201, 42, 74); */
}
.agriviva-whatsapp .path2:before {
content: "\e90e";
margin-left: -1em;
/* color: rgb(201, 42, 74); */
}
.agriviva-whatsapp .path3:before {
content: "\e90f";
margin-left: -1em;
/* color: rgb(255, 255, 255); */
}
.agriviva-alert-circle:before {
content: "\e910";
}
.agriviva-alp:before {
content: "\e911";
}
.agriviva-apple-logo:before {
content: "\e912";
}
.agriviva-bell:before {
content: "\e913";
/* color: #c92a4a; */
}
.agriviva-calf:before {
content: "\e914";
}
.agriviva-cat:before {
content: "\e915";
}
/* */
.agriviva-check-active .path1:before {
content: "\e916";
/* color: rgb(201, 42, 74); */
}
.agriviva-check-active .path2:before {
content: "\e917";
margin-left: -1em;
color: rgb(255, 255, 255);
}
.agriviva-check:before {
content: "\e918";
/* color: #c92a4a; */
}
/* should be identical to .agriviva-check-active */
/* */
.agriviva-check-active1 .path1:before {
content: "\e919";
/* color: rgb(201, 42, 74); */
}
.agriviva-check-active1 .path2:before {
content: "\e91a";
margin-left: -1em;
color: rgb(255, 255, 255);
}
/* */
.agriviva-chevron-circle .path1:before {
content: "\e91b";
/* color: rgb(242, 242, 242); */
}
.agriviva-chevron-circle .path2:before {
content: "\e91c";
margin-left: -1em;
/* color: rgb(55, 55, 55); */
}
.agriviva-chevron-down:before {
content: "\e91d";
/* color: #c92a4a; */
}
.agriviva-chicken:before {
content: "\e91e";
}
.agriviva-children:before {
content: "\e91f";
}
.agriviva-cow:before {
content: "\e920";
}
.agriviva-dog:before {
content: "\e921";
}
.agriviva-emergency:before {
content: "\e922";
/* color: #c92a4a; */
}
.agriviva-exit:before {
content: "\e923";
/* color: #c92a4a; */
}
.agriviva-facebook:before {
content: "\e924";
/* color: #c92a4a; */
}
/* */
.agriviva-facebook-logo .path1:before {
content: "\e925";
color: rgb(24, 119, 242);
}
.agriviva-facebook-logo .path2:before {
content: "\e926";
margin-left: -1em;
color: rgb(255, 255, 255);
}
.agriviva-farm:before {
content: "\e927";
}
.agriviva-field:before {
content: "\e928";
}
.agriviva-filter:before {
content: "\e929";
/* color: #c92a4a; */
}
.agriviva-fruits-vegetables:before {
content: "\e92a";
}
.agriviva-globe:before {
content: "\e92b";
/* color: #c92a4a; */
}
.agriviva-glocke-v01:before {
content: "\e92c";
/* color: #f8f4e9; */
}
.agriviva-glocke-v02:before {
content: "\e92d";
/* color: #f8f4e9; */
}
.agriviva-goat:before {
content: "\e92e";
}
/* */
.agriviva-google-logo .path1:before {
content: "\e92f";
color: rgb(251, 187, 0);
}
.agriviva-google-logo .path2:before {
content: "\e930";
margin-left: -1em;
color: rgb(81, 142, 248);
}
.agriviva-google-logo .path3:before {
content: "\e931";
margin-left: -1em;
color: rgb(40, 180, 70);
}
.agriviva-google-logo .path4:before {
content: "\e932";
margin-left: -1em;
color: rgb(241, 67, 54);
}
.agriviva-grain:before {
content: "\e933";
}
.agriviva-grapes:before {
content: "\e934";
}
.agriviva-heart:before {
content: "\e935";
/* color: #c92a4a; */
}
.agriviva-help-circle:before {
content: "\e936";
}
/* */
.agriviva-horse .path1:before {
content: "\e937";
/* color: rgb(55, 55, 55); */
}
.agriviva-horse .path2:before {
content: "\e938";
margin-left: -1em;
/* color: rgb(55, 55, 55); */
}
.agriviva-horse .path3:before {
content: "\e939";
margin-left: -1em;
/* color: rgb(55, 55, 55); */
}
.agriviva-horse .path4:before {
content: "\e93a";
margin-left: -1em;
/* color: rgb(255, 255, 255); */
}
.agriviva-house-garden:before {
content: "\e93b";
}
.agriviva-info:before {
content: "\e93c";
}
.agriviva-instagram:before {
content: "\e93d";
/* color: #c92a4a; */
}
.agriviva-lamb:before {
content: "\e93e";
}
.agriviva-linkedin:before {
content: "\e93f";
/* color: #c92a4a; */
}
.agriviva-tiktok:before {
content: "\e90b";
/* color: #c92a4a; */
}
.agriviva-youtube:before {
content: "\e94f";
/* color: #c92a4a; */
}
.agriviva-mail:before {
content: "\e940";
/* color: #c92a4a; */
}
.agriviva-map-pin:before {
content: "\e941";
/* color: #c92a4a; */
}
.agriviva-market:before {
content: "\e942";
}
.agriviva-menu:before {
content: "\e943";
/* color: #c92a4a; */
}
.agriviva-milk:before {
content: "\e944";
}
.agriviva-arrow-corner:before {
content: "\e945";
/* color: #c8eb24; */
}
.agriviva-arrow-down-large:before {
content: "\e946";
/* color: #c8eb24; */
}
.agriviva-arrow-left-large:before {
content: "\e947";
/* color: #c8eb24; */
}
.agriviva-arrow-long:before {
content: "\e948";
/* color: #c8eb24; */
}
.agriviva-arrow-right-large:before {
content: "\e949";
/* color: #c8eb24; */
}
.agriviva-arrow-short:before {
content: "\e94a";
/* color: #c8eb24; */
}
.agriviva-arrow-spiral-1:before {
content: "\e94b";
/* color: #c8eb24; */
}
.agriviva-arrow-spiral-2:before {
content: "\e94c";
/* color: #c8eb24; */
}
.agriviva-arrow-sprial-2:before {
content: "\e94d";
/* color: #c8eb24; */
}
.agriviva-arrow-up-large:before {
content: "\e94e";
/* color: #c8eb24; */
}
/* FONTS end */
/* GENERAL start */
.editor-styles-wrapper,
html,
body {
height: 100%;
margin: 0;
padding: 0;
font-variant-numeric: lining-nums;
}
.editor-styles-wrapper,
body {
/*
font-family: Arial, sans-serif;
*/
font-family: 'Raleway', sans-serif;
color: #373737;
overflow-x: hidden;
}
figure {
margin: 0;
}
.block-editor-iframe__scale-container iframe {
height: 1200px !important;
}
.first-element {
padding-top: 200px !important;
}
/* WP EDITOR start */
html :where(.wp-block) {
max-width: 90%;
}
.hero.wp-block {
/* margin-top: 28px; */
margin-bottom: 28px;
}
.wp-block .container {
padding: 0 5%;
}
.editor-styles-wrapper p {
white-space: normal !important;
}
html body .wp-block.no-margin-auto {
margin-left: unset !important;
margin-right: unset !important;
}
.no-margin-auto {
margin-left: unset !important;
margin-right: unset !important;
}
.no-margin {
margin: unset !important;
}
.max-width-100 {
max-width: 100%;
}
.editor-styles-wrapper .hero-placeholder {
display: none;
}
.editor-styles-wrapper .all-testimonials .testimonial img {
transform: unset;
}
/* WP EDITOR end */
/* CONTAINER start */
.container {
width: 100%;
margin-right: auto;
margin-left: auto;
}
/* CONTAINER end */
/* TITLE & TEXT start */
h1:not(.hero h1):not(h1.components-truncate):not(h1.media-frame-menu-heading):not(h1.media-attachments-filter-heading):not(h1.block-editor-block-card__title):not(.media-frame-title h1):not(.filebird-app-wrapper h1):not(.attachment-details h1):not(.our-team h1):not(.help-and-faq h1):not(.emergency h1):not(h1.block-editor-inserter__panel-title):not(h1.interface-complementary-area-header__title):not(h1.notice-yoast__header-heading):not(h1.components-modal__header-heading):not(.components-modal__content h1),
h2:not(h2.components-truncate):not(h2.media-frame-menu-heading):not(h2.media-attachments-filter-heading):not(h2.block-editor-block-card__title):not(.media-frame-title h2):not(.filebird-app-wrapper h2):not(.attachment-details h2):not(.our-team h2):not(.help-and-faq h2):not(.emergency h2):not(h2.block-editor-inserter__panel-title):not(h2.interface-complementary-area-header__title):not(h2.notice-yoast__header-heading):not(h2.components-modal__header-heading):not(.components-modal__content h2) {
font-size: 3rem;
}
/* TITLE & TEXT end */
/* COLORS */
:root {
--newviva-background-black: #373737;
--newviva-background-darkgrey: #5B5B5B;
--newviva-background-veryDarkGrey: #F2F2F2;
--newviva-background-sand: #F8F4E9;
--newviva-background-green: #C8EB24;
--newviva-background-red: #C92A4A;
--newviva-accent-red: #C92A4A;
--newviva-font-black: #373737;
--newviva-font-sand: #F8F4E9;
--newviva-font-red: #C92A4A;
--newviva-font-green: #C8EB24;
--newviva-icon-grey: #9b9b9b;
--newviva-icon-red: #C92A4A;
--newviva-icon-green: #C8EB24;
--newviva-border-black: #373737;
}
/* BACKGROUND AND FONT COLORS start */
.bg-beige {
background-color: var(--newviva-background-sand);
}
.bg-green {
background-color: var(--newviva-background-green);
}
.bg-red {
background-color: var(--newviva-background-red);
}
.bg-white {
background-color: white;
}
/* BACKGROUND COLORS end */
/* DIVIDER start */
.divider {
height: calc(100vw * tan(4deg));
}
.divider.hide {
display: none;
}
.divider p,
.divider div {
content: "";
display: block;
/* Height wird anhand der Screenbreite und des Winkels von 4° berechnet */
height: calc(100vw * tan(4deg) + 0.5%);
clip-path: polygon(0% 100%, 100% 100%, 100% 0%);
border: none;
margin: unset;
padding: unset;
max-width: unset;
}
body .divider p,
body .divider div {
content: "";
display: block;
/* Height wird anhand der Screenbreite und des Winkels von 4° berechnet */
height: calc(100vw * tan(4deg) + 0.5%);
clip-path: polygon(0% 100%, 100% 100%, 100% 0%);
border: none;
margin: unset;
padding: unset;
max-width: unset;
}
.has-plum-background-color {
background-color: #C92A4A !important;
border-color: #C92A4A !important;
}
.has-green-background-color {
background-color: #C8EB24 !important;
border-color: #C8EB24 !important;
}
.has-black-newviva-background-color {
background-color: #373737 !important;
border-color: #373737 !important;
}
.has-dark-grey-background-color {
background-color: #5B5B5B !important;
border-color: #5B5B5B !important;
}
.has-grey-background-color {
background-color: #F2F2F2 !important;
border-color: #F2F2F2 !important;
}
.has-sand-background-color {
background-color: #F8F4E9 !important;
border-color: #F8F4E9 !important;
}
.has-white-newviva-background-color {
background-color: #FFFFFF !important;
border-color: #FFFFFF !important;
}
.has-white-50-background-color {
background-color: rgba(255, 255, 255, 0.5) !important;
border-color: rgba(255, 255, 255, 0.5) !important;
}
.has-plum-color {
color: #C92A4A !important;
}
.has-green-color {
color: #C8EB24 !important;
}
.has-black-newviva-color {
color: #373737 !important;
}
.has-dark-grey-color {
color: #5B5B5B !important;
}
.has-grey-color {
color: #F2F2F2 !important;
}
.has-sand-color {
color: #F8F4E9 !important;
}
.has-white-newviva-color {
color: #FFFFFF !important;
}
.has-white-50-color {
color: rgba(255, 255, 255, 0.5) !important;
}
/* BACKGROUND AND FONT COLORS end */
/* DIVIDER start */
.divider {
height: calc(100vw * tan(4deg));
}
.divider p,
.divider div {
content: "";
display: block;
/* Height wird anhand der Screenbreite und des Winkels von 4° berechnet */
height: calc(100vw * tan(4deg));
clip-path: polygon(0% 100%, 100% 100%, 100% 0%);
border: 1px solid #373737;
margin: unset;
padding: unset;
max-width: unset;
}
/* DIVIDER end */
/* TITLE start */
[data-h2="red"],
.h2-red {
text-align: center;
font-size: 3rem;
/* 3rem = 48px */
margin: 0;
}
[data-h2="red"],
.h2-red {
color: #C92A4A;
}
[data-h3="red"],
.h3-red {
text-align: center;
font-size: 2rem !important;
/* 3rem = 48px */
margin: 0;
}
[data-h3="red"],
.h3-red {
color: #C92A4A;
}
[data-h2="green"],
.h2-green {
color: #C8EB24;
}
/* TITLE end */
/* HEADLINE start */
.headline {
font-size: 1.5rem;
font-weight: 700;
}
.page-headline .subcontainer {
margin: unset !important;
max-width: 100%;
padding: 100px 0 40px 60px;
}
.page-headline h1,
.page-headline h2,
.page-headline h3
.page-headline h4,
.page-headline h5 {
margin: unset;
text-align: left;
line-height: 62.4px;
color: var(--newviva-font-red);
font-size: 3rem;
margin-bottom: 24px;
}
.page-headline p {
font-weight: 600;
line-height: 1.5;
margin: 20px 0 0;
max-width: 50%;
}
/* editor styles */
.editor-styles-wrapper .page-headline h1,
.editor-styles-wrapper .page-headline h2,
.editor-styles-wrapper .page-headline h3,
.editor-styles-wrapper .page-headline h4,
.editor-styles-wrapper .page-headline h5 {
margin: 0;
}
.editor-styles-wrapper .page-headline p {
margin: 16px 0;
}
.editor-styles-wrapper .page-headline .container {
margin: 0;
}
.editor-styles-wrapper .page-headline .divider {
margin: 0;
}
/* HEADLINE end */
/* BUTTONS start */
button {
font-family: 'Raleway', sans-serif;
color: #373737;
}
[data-button-primary],
[data-button-secondary],
.data-button-secondary,
.data-button-primary {
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
}
[data-button-primary] img,
[data-button-secondary] img,
.data-button-secondary img,
.data-button-primary img {
top: 4px;
position: relative;
}
[data-button-primary]:hover img,
.data-button-primary:hover img {
transform: rotate(4deg);
}
[data-button-primary],
.data-button-primary {
border: none;
}
[data-button-primary="red"],
.data-button-primary-red {
color: white;
background-color: #C92A4A;
}
[data-button-primary="green"],
.data-button-primary-green {
color: #373737;
background-color: #C8EB24;
text-align: center;
line-height: 1.5;
display: inline-block;
word-break: break-word;
}
.data-button-primary-green:hover {
rotate: 4deg;
}
[data-button-primary="white"],
.data-button-primary-white {
color: #373737;
background-color: white;
}
[data-button-secondary],
.data-button-secondary {
background-color: unset;
}
[data-button-secondary="black"],
[data-button-secondary="black-icon"],
.data-button-secondary-black {
color: #373737;
border: 2px solid #373737;
}
[data-button-secondary="white"],
[data-button-secondary="white-icon"],
.data-button-secondary-white {
color: white;
border: 2px solid white;
}
[data-button-tertiary="white"] .button-banner > div,
.data-button-tertiary-white .button-banner > div {
background-color: white;
}
[data-button-tertiary="beige"] .button-banner > div,
.data-button-tertiary-beige .button-banner > div {
background-color: #F8F4E9;
transition: background-color 0.5s ease-in-out;
}
[data-button-tertiary="beige"]:hover .button-banner > div,
.data-button-tertiary-beige:hover .button-banner > div {
background-color: #C8EB24;
}
[data-button-tertiary],
.data-button-tertiary {
text-decoration: none;
color: #373737;
display: block;
cursor: pointer;
}
[data-button-tertiary] .cover > div,
.data-button-tertiary .cover > div {
overflow: hidden;
height: auto;
display: block;
}
[data-button-tertiary] .cover img,
.data-button-tertiary .cover img {
height: 100%;
width: 100%;
object-fit: cover;
object-position: center center;
transition: transform 0.5s ease-in-out;
display: block;
}
[data-button-tertiary]:hover .cover img,
.data-button-tertiary:hover .cover img {
transform: scale(1.1);
}
.data-button-tertiary:hover .cover figure {
overflow: hidden;
}
.data-button-tertiary .button-banner {
width: 100%;
display: block;
pointer-events: none;
}
[data-button-tertiary] .button-banner > div,
.data-button-tertiary .button-banner > div {
display: flex;
transform: translate(-15px, -64px);
padding: 15px 30px 0;
height: 67px;
justify-content: space-between;
align-items: center;
}
.data-button-tertiary .button-banner > div > div {
width: 100%;
margin: unset;
}
[data-button-tertiary] p,
.data-button-tertiary p {
font-weight: 600;
text-decoration: none;
margin: unset;
}
[data-button-tertiary] .button-title,
.data-button-tertiary .button-title {
font-weight: 700;
font-size: 1.438rem;
}
.editor-styles-wrapper .works [data-button-tertiary] .button-title,
.editor-styles-wrapper .works .data-button-tertiary .button-title {
max-width: 100%;
line-height: 1.1;
}
[data-button-tertiary] .button-banner img,
[data-button-tertiary] .button-banner .agriviva-arrow-right-large,
.data-button-tertiary .button-banner img,
.data-button-tertiary .button-banner p:has(>.agriviva-arrow-right-large) {
width: 28px;
height: 28px;
font-size: 1.75rem;
color: #C8EB24;
transform: translateY(-4px);
transition: all 0.5s ease-in-out;
margin: unset;
}
[data-button-tertiary]:hover .button-banner img,
[data-button-tertiary]:hover .button-banner .agriviva-arrow-right-large,
.data-button-tertiary:hover .button-banner figure img,
.data-button-tertiary:hover .button-banner p:has(>.agriviva-arrow-right-large) {
transform: translate(10px, -4px);
color: #373737;
}
.data-button-tertiary > div,
.cover,
.cover figure,
.cover a {
display: block;
height: 100%;
}
[data-centered],
.data-centered {
display: flex;
justify-content: center;
}
/* BUTTONS end */
/* PAGE END CTA start */
.page-end-cta .subcontainer > div {
display: flex;
column-gap: 81px;
padding: 122px 122px 84px 122px;
}
.page-end-cta .subcontainer > div div {
flex: 1
}
.page-end-cta h2 {
margin: unset;
text-align: left;
}
.page-end-cta .arrow {
transform: translate(362px, 24px);
}
.page-end-cta .headline {
margin: unset;
}
.page-end-cta .data-button-primary {
display: inline-block;
}
.page-end-cta .button-container a {
font-size: 1rem;
display: flex;
align-items: center;
width: fit-content;
width: -moz-fit-content;
padding: 11px 45px 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
background-color: white;
color: var(--newviva-font-black);
border: none;
line-height: 1.2;
}
.page-end-cta .button-container .button-arrow {
position: absolute;
right: 14px;
pointer-events: none;
}
.page-end-cta .button-container > div:hover figure,
.page-end-cta .button-container > div:focus figure {
transform: rotate(4deg);
}
.page-end-cta h1,
.page-end-cta h2,
.page-end-cta h3,
.page-end-cta h4,
.page-end-cta h5 {
margin: unset;
text-align: left;
font-size: 3rem;
color: var(--newviva-font-red);
width: fit-content;
width: -moz-fit-content;
}
.page-end-cta .headline {
line-height: 1.3;
}
.page-end-cta .headline img {
top: 0;
}
.page-end-cta .title-container > div {
position: relative;
width: fit-content;
width: -moz-fit-content;
}
.page-end-cta .title-container figure {
position: absolute;
transform: translate(152px, 92px);
bottom: 0;
right: 0;
left: unset;
height: 69px;
width: 153px;
}
.page-end-cta [data-button-primary] img,
.page-end-cta .data-button-primary img {
margin-left: 10px;
}
.page-end-cta .button-container {
margin-top: 53px;
width: fit-content;
width: -moz-fit-content;
}
.page-end-cta .button-container > div {
position: relative;
display: flex;
align-items: center;
}
.page-end-cta .button-container p {
margin: 0;
}
/* editor styles */
.editor-styles-wrapper .page-end-cta .subcontainer {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .page-end-cta .title-container,
.editor-styles-wrapper .page-end-cta .text-container {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .page-end-cta figure > div {
max-width: 100% !important;
max-height: 100% !important;
width: 100% !important;
height: 100% !important;
}
.editor-styles-wrapper .page-end-cta .button-container {
margin: 53px 0 0 0 !important;
}
.editor-styles-wrapper .page-end-cta .button-container p {
margin: 0;
}
/* PAGE END CTA end */
/* GENERAL end */
/* HEADER start */
header {
position: absolute;
width: 100%;
}
header[data-header-position="relative"] {
position: relative;
}
.header {
position: relative;
z-index: 100;
/* overflow: hidden;
height: 180px; */
}
section.header .subcontainer {
overflow: hidden;
height: 200px;
position: relative;
z-index: 100;
}
.main-navigation {
position: relative;
padding-top: 1em;
}
.white-rectangle {
transform: translate(-1vw, -71px) rotate(-4deg);
position: absolute;
background-color: white;
height: 193px;
width: 84vw;
z-index: -2;
}
.main-navigation[data-header-version="shadow"] .white-rectangle {
box-shadow: 5px 5px 17px rgba(0, 0, 0, 0.1);
}
section.header .main-nav {
display: flex;
align-items: center;
margin-left: 45px;
}
section.header .main-nav a.logo {
margin-right: 50px;
transform: translateY(10px);
}
.main-navigation ul {
margin-top: 0;
padding-top: 16px;
}
.main-navigation ul li a {
color: #373737;
text-decoration: none;
font-weight: 700;
}
.main-navigation ul li.special-item.data-button-primary-green.data-button-primary {
padding: unset;
background: unset;
}
.main-navigation ul li.special-item.data-button-primary-green.data-button-primary a {
padding: 11px 15px;
background-color: var(--newviva-background-green);
}
/* .main-navigation ul li:first-child a {
display: block;
margin: 0 30px 0 45px;
} */
.main-navigation img {
width: 120px;
}
/* .main-navigation ul li:not(:first-child) {
margin-top: unset;
transform: translateY(-15px);
} */
.main-navigation ul li:not(li.special-item) a:hover,
.main-navigation ul li:not(li.special-item) a:focus {
border-bottom: 2px solid var(--newviva-accent-red);
}
.main-navigation ul,
.mini-navigation nav > ul {
list-style: none;
display: flex;
flex-direction: row;
column-gap: 30px;
padding: unset;
align-items: center;
}
.mini-navigation nav > ul {
column-gap: 23px;
margin: 0;
}
.burger-menu {
display: none;
font-size: 1.5rem;
color: var(--newviva-accent-red);
cursor: pointer;
}
.burger-menu .icons {
display: flex;
align-items: center;
justify-content: center;
}
.burger-menu span.agriviva-exit {
display: none;
}
.burger-menu .icons.open span.agriviva-exit {
display: block;
}
.burger-menu .icons.open span.agriviva-menu {
display: none;
}
.mini-navigation {
/* transform: translateX(calc(100vw - 487px)) translateY(-153px); */
position: absolute;
height: 61px;
width: 487px;
color: white;
right: 0;
top: 8px;
display: flex;
align-items: center;
justify-content: end;
}
.mini-navigation[data-header-version="beige"] {
color: var(--newviva-font-black);
}
.red-rectangle {
transform: translate(1px, -14px) rotate(-4deg);
position: absolute;
background-color: #C92A4A;
height: 98px;
width: 528px;
z-index: -1;
}
.mini-navigation[data-header-version="beige"] .red-rectangle {
background-color: var(--newviva-background-sand);
}
.mini-navigation nav {
display: flex;
align-items: center;
margin: 0;
column-gap: 23px;
}
.mini-navigation-container {
padding: 2px 45px 15px 0;
}
/* .mini-navigation nav > ul {
column-gap: 24px;
margin-top: 2px;
align-items: center;
margin-right: 45px;
} */
.mini-navigation ul li,
.mini-navigation ul li a {
color: inherit;
text-decoration: none;
display: flex;
font-weight: 600;
align-items: center;
/* transition: color 100ms ease-in-out; */
}
.mini-navigation ul.language-menu li a {
color: white;
}
.mini-navigation[data-header-version="beige"] ul.language-menu li a {
color: var(--newviva-font-black);
}
/* .mini-navigation ul li img {
transition: filter 150ms ease-in-out;
} */
.mini-navigation[data-header-version="beige"] ul li img {
filter: contrast(0.1) brightness(0.5);
}
.mini-navigation ul li .icon {
margin: 2px 8px 0 0;
}
.mini-navigation .chevron {
font-size: 0.375rem;
margin: 3px 0px 0px 3px;
transform: rotate(0deg);
transition: transform 100ms ease-in-out;
}
.mini-navigation ul li:last-child {
position: relative;
}
.language-toggle-button,
.language-toggle-button-mobile {
background-color: unset;
border: unset;
font-size: 1rem;
display: flex;
align-items: center;
cursor: pointer;
color: inherit;
font-weight: 600;
padding: 0;
/* transition: color 100ms ease-in-out; */
}
.language-toggle-button.show {
color: white;
}
.language-toggle-button.show .chevron {
transform: rotate(180deg);
}
section.header .dropdown #language-toggle-button-mobile {
column-gap: 6px;
}
#language-toggle-button-mobile span:not(span.lang-slug-mobile) {
font-size: 0.5rem;
transform: rotate(-90deg);
transition: transform 100ms ease-in-out;
}
#language-toggle-button-mobile.show span:not(span.lang-slug-mobile) {
transform: rotate(90deg);
}
.language-toggle-button span.lang-slug {
text-transform: capitalize;
}
#language-menu {
display: none;
flex-direction: column;
align-items: start;
position: absolute;
top: 22px;
right: 0;
background: #c92a4a;
padding: 15px 25px;
line-height: 24px;
row-gap: 4px;
box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.2);
}
.mini-navigation[data-header-version="beige"] #language-menu {
background: var(--newviva-background-sand);
}
#language-menu-mobile {
display: none;
flex-direction: row;
align-items: center;
justify-content: unset;
position: absolute;
background: transparent;
width: 100%;
row-gap: 0;
column-gap: 12px;
padding: 0;
margin: 0;
top: 0;
left: 0;
border-top: unset;
border-left: 1px solid white;
padding-left: 14px;
transform: translateX(93px);
}
#language-menu-mobile li {
width: 100%;
}
#language-menu-mobile li > a {
justify-content: unset;
column-gap: unset;
/* align-items: center; */
}
#language-menu.show,
#language-menu-mobile.show {
display: flex;
}
/* mini navigation hover header default version START */
.mini-navigation nav:hover a,
.mini-navigation nav:hover button {
color: rgba(255, 255, 255, 0.5);
}
.mini-navigation nav:hover img,
.mini-navigation nav:hover img {
opacity: 0.5;
}
.mini-navigation nav a:hover,
.mini-navigation nav .language-toggle-button:hover {
color: rgba(255, 255, 255, 1);
}
.mini-navigation nav:has(ul.language-menu.show:hover) {
color: rgba(255, 255, 255, 0.5);
}
.mini-navigation .language-toggle-button.show {
color: white;
}
.mini-navigation nav:has(ul.language-menu.show) ul {
color: rgba(255, 255, 255, 0.5);
}
.mini-navigation nav:has(ul.language-menu.show) img {
opacity: 0.5;
}
.mini-navigation nav:has(ul.language-menu.show:hover) img {
opacity: 0.5;
}
/* mini navigation hover header default version END */
/* mini navigation hover header beige version START */
.mini-navigation[data-header-version="beige"] nav:hover a,
.mini-navigation[data-header-version="beige"] nav:hover button {
color: rgba(0, 0, 0, 0.3);
}
.mini-navigation[data-header-version="beige"] nav:hover img,
.mini-navigation[data-header-version="beige"] nav:hover img {
opacity: 0.3;
}
.mini-navigation[data-header-version="beige"] nav a:hover,
.mini-navigation[data-header-version="beige"] nav .language-toggle-button:hover {
color: rgba(0, 0, 0, 0.95);
}
.mini-navigation[data-header-version="beige"] nav:has(ul.language-menu.show:hover) {
color: rgba(0, 0, 0, 0.3);
}
.mini-navigation[data-header-version="beige"] .language-toggle-button.show {
color: var(--newviva-font-black);
}
.mini-navigation[data-header-version="beige"] nav:has(ul.language-menu.show) ul {
color: rgba(0, 0, 0, 0.3);
}
.mini-navigation[data-header-version="beige"] nav:has(ul.language-menu.show) img {
opacity: 0.3;
}
.mini-navigation[data-header-version="beige"] nav:has(ul.language-menu.show:hover) img {
opacity: 0.3;
}
/* mini navigation hover header beige version END */
.mini-navigation li.mini-nav-spacer a {
display: none;
}
[data-header="beige"] ul li a,
[data-header="beige"] #language-toggle-button {
color: #373737;
}
[data-header="beige"] .red-rectangle,
[data-header="beige"] #language-menu {
background-color: #F8F4E9;
}
[data-header-shadow="true"] {
box-shadow: 4px 4px 20px 4px #ececec
}
section.header .dropdown {
position: absolute;
left: 0;
width: 100vw;
height: 100dvh;
background: var(--newviva-accent-red);
opacity: 0;
pointer-events: none;
z-index: 10;
top: 0;
transform: translateY(-30px);
transition: opacity 150ms ease-in-out, transform 150ms ease-in-out;
}
section.header .dropdown[data-burger-menu="open"],
section.header .dropdown.open {
opacity: 1;
pointer-events: auto;
transform: translateY(0px);
}
section.header .dropdown nav {
margin: unset;
height: 100%;
}
section.header .dropdown ul {
list-style: none;
margin: 0;
padding: 0;
row-gap: 24px;
color: white;
font-weight: 600;
font-size: 2rem;
height: 100%;
display: flex;
flex-direction: column;
padding: 200px 30px 60px 30px;
}
section.header .dropdown ul a {
text-decoration: none;
color: inherit;
display: flex;
column-gap: 10px;
}
.header .dropdown ul li.data-button-primary-green {
margin-top: auto;
}
.header .dropdown ul li.data-button-primary-green a {
font-size: 1rem;
width: -webkit-fill-available;
width: auto;
align-items: center;
justify-content: center;
color: var(--newviva-font-black);
}
section.header .dropdown ul li:has([data-button-primary="green"]) {
display: none;
}
section.header .dropdown ul li.mini-link a {
font-size: 1rem;
}
section.header .dropdown ul .divider,
section.header .dropdown ul .mobile-dropdown-divider {
width: 100%;
height: 1px;
border-top: 1px solid white;
opacity: 0.25;
}
section.header .dropdown ul .mobile-dropdown-divider a,
section.header .dropdown ul .mobile-nav-language > a {
display: none;
}
section.header .mini-link {
width: fit-content;
width: -moz-fit-content;
position: relative;
}
/* HEADER end */
/* HOME PAGE start */
/* HERO start */
.hero {
/* transform: translateY(-180px); */
transform: unset;
position: relative;
overflow: hidden;
/* position: absolute;
top: 0;
right: 0;
width: 100%; */
}
.hero .image-container {
position: relative;
margin: 0;
}
.hero .image-container .divider {
width: 100%;
position: absolute;
bottom: 0;
background-color: transparent;
max-width: unset;
margin: 0;
}
.hero .image-container .divider::after {
border-color: white;
background-color: white;
}
.hero .image-container .divider p,
.hero .image-container .divider div {
background-color: white;
border-color: inherit;
border: none;
}
.hero-img img {
width: 100% !important;
height: 92vh !important;
object-fit: cover;
object-position: center center;
}
.hero-content > div {
color: white;
position: absolute;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
max-width: 1320px;
left: 50%;
bottom: calc(0% + 2%);
transform: translateX(-50%);
/* gap: 127px; */
/* margin: 129px 107px; */
}
.hero h1 {
font-size: 5.25rem;
font-weight: 400;
width: unset;
max-width: 708px;
line-height: 79.8px;
transform: rotate(-4deg) skew(-4deg);
white-space: unset !important;
overflow-wrap: normal !important;
margin: 0;
}
.hero p:has(a.data-button-primary) {
max-width: unset !important;
line-height: 0.5;
}
.hero-content a {
position: unset;
transform: unset;
line-height: normal;
}
.hero-content img {
height: 100px !important;
width: unset !important;
position: absolute;
transform: translate(447px, -301px);
}
.hero-content p.hero-arrow span {
transform: unset;
font-size: 3.875rem;
}
.hero-content p.hero-arrow {
height: unset;
width: unset;
position: absolute;
transform: translate(457px, -346px) rotate(-36deg);
font-size: 3.875rem;
color: var(--newviva-icon-green);
pointer-events: none;
}
.hero-content .primary-button-container {
width: fit-content;
width: moz-fit-content;
position: absolute;
transform: translate(484px, -340px);
bottom: unset;
left: unset;
margin: 0;
}
.hero-content .wp-block-button__link {
box-shadow: unset;
font-size: unset;
color: white;
background-color: #C92A4A;
border: none;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
font-size: 1rem;
}
.headlines {
/* width: 438px; */
line-height: 31.2px;
display: grid;
row-gap: 14px;
max-width: 424px;
transform: translateY(-30px);
}
/* .headlines:has(p.block-editor-block-list__block) {
transform: translateY(-40px);
} */
.headlines > div {
display: grid;
row-gap: 14px;
max-width: 424px;
}
.headlines > div p {
max-width: 100%;
}
.hero .headline {
margin: 0;
line-height: 31.2px;
}
.white-hero-rectangle {
transform: translateY(-58px) rotate(-4deg);
position: absolute;
background-color: white;
height: 124px;
width: 110vw;
}
.headline-mobile {
display: none;
}
.hero-placeholder .subcontainer {
height: calc(92vh - 180px);
}
.hero .primary-button-container a {
color: white;
background-color: #C92A4A;
border: none;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
white-space: nowrap;
font-size: 1rem;
}
.hero .primary-button-container p {
margin: 0;
}
.hero .components-resizable-box__handle {
display: none !important;
}
/* editor styles */
.editor-styles-wrapper .hero-content > div {
bottom: calc(0% + 19px);
}
.editor-styles-wrapper .hero-content p.hero-arrow span {
transform: unset;
}
.editor-styles-wrapper .hero-content p.hero-arrow {
transform: translate(461px, -301px) rotate(-36deg);
}
.editor-styles-wrapper .hero figure > div {
max-width: 100% !important;
}
.editor-styles-wrapper .hero .primary-button-container a {
background-color: var(--newviva-background-red) !important;
}
.editor-styles-wrapper .hero .hero-img > div {
max-height: 100% !important;
height: unset !important;
}
.editor-styles-wrapper .hero .hero-img {
height: 92vh !important;
}
.editor-styles-wrapper .hero .primary-button-container p {
margin: 0;
}
.editor-styles-wrapper .hero-content .primary-button-container {
transform: translate(484px, -319px);
}
/* HERO end */
/* WORKS start */
.works {
transform: unset;
padding-top: 70px;
/* padding-bottom: 70px; */
}
.works .subcontainer {
margin-bottom: 70px;
}
/* .works .components-resizable-box__container {
max-width: 259px !important;
} */
.works .title-container {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 70px;
}
.works h1,
.works h2,
.works h3,
.works h4,
.works h5 {
margin: 0;
max-width: 800px;
text-align: center;
line-height: 1.3;
color: var(--newviva-font-red);
}
.works-container > div {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 40px;
}
.works-container * {
display: inline;
}
.works-container [data-button-tertiary],
.works-container .data-button-tertiary {
height: 320px;
width: 288px;
height: unset;
width: unset;
position: relative;
}
.works-container {
/* display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
row-gap: 50px;
justify-items: center; */
/* ---------------- */
/* display: flex;
flex-wrap: wrap;
row-gap: 50px;
justify-content: space-between; */
}
.works .button-banner > div {
position: absolute;
width: 78%;
clip-path: polygon(0% 0%, 100% 18.5391%, 100% 100%, 0% 100%);
}
.works .button-banner .description {
transform: translateY(-4px);
}
.works .cover {
height: 100%;
display: block;
}
.works .cover > div {
height: 100%;
}
.works .button-banner figure {
transform: translateY(-3px);
min-width: 32px;
padding-left: 10px;
transition: transform 0.5s ease-in-out;
}
.works .button-banner figure img {
transform: unset;
}
.works figure > div {
/* height: 100% !important; */
max-width: 100% !important;
}
.works .button-banner .divider {
width: 100%;
position: absolute;
left: 0;
top: -17px;
height: calc(27vw * tan(2deg));
background-color: transparent;
}
.works .button-banner .divider::after {
height: calc(27vw * tan(2deg));
background-color: #F8F4E9;
border-color: #F8F4E9;
clip-path: polygon(100% 100%, 0% 100%, 0% 0%);
}
.works [data-button-tertiary]:hover .button-banner img,
.works [data-button-tertiary]:focus .button-banner img,
.works .data-button-tertiary:hover .button-banner img,
.works .data-button-tertiary:focus .button-banner img {
transform: unset;
}
.works .data-button-tertiary-beige:hover .button-banner figure,
.works .data-button-tertiary-beige:focus .button-banner figure {
transform: translate(10px, -3px);
}
.works [data-button-tertiary="beige"] .button-banner .divider::after,
.works .data-button-tertiary-beige.button-banner .divider::after {
transition: border-color 500ms ease-in-out, background-color 500ms ease-in-out;
}
.works [data-button-tertiary="beige"]:hover .button-banner .divider::after,
.works [data-button-tertiary="beige"]:focus .button-banner .divider::after,
.works .data-button-tertiary-beige:hover .button-banner .divider::after,
.works .data-button-tertiary-beige:focus .button-banner .divider::after {
background-color: #C8EB24;
border-color: #C8EB24;
}
.works .divider p,
.works .divider div {
height: calc(100vw * tan(4deg) + 0.3%);
}
.works .carousel-assets-mobile {
display: none;
}
.works .carousel-assets-mobile > div {
display: flex;
flex-direction: row;
justify-content: unset;
width: 100%;
margin-top: 38px;
column-gap: 32px;
}
.works .carousel-assets-mobile p {
font-size: 32px;
color: var(--newviva-font-black);
margin: 0;
}
.works .carousel-assets-mobile p.arrow-left-carousel-mobile {
margin-left: auto;
}
.works .carousel-assets-mobile p.arrow-right-carousel-mobile {
margin-right: auto;
}
.works .carousel-assets-mobile .pagination-work > div {
display: flex;
flex-direction: row;
align-items: center;
column-gap: 10px;
height: 100%;
}
.works .carousel-assets-mobile .pagination-work img {
filter: contrast(0.1) brightness(1.3);
width: 12px;
height: 12px;
}
.works .carousel-assets-mobile .pagination-work img.active {
filter: contrast(0.1) brightness(0);
width: 16px;
height: 16px;
}
/* editor styles */
.editor-styles-wrapper .works {
padding-top: 30px;
}
.editor-styles-wrapper .works .subcontainer {
margin: 0 0 70px 0;
width: 100%;
max-width: 100%;
}
.editor-styles-wrapper .works .works-container {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .works .components-resizable-box__side-handle {
display: none;
}
.editor-styles-wrapper .works .title-container {
max-width: 100%;
}
.editor-styles-wrapper .works-container .data-button-tertiary {
margin: 0;
}
.editor-styles-wrapper .works .button-banner > div {
width: 86%;
}
.editor-styles-wrapper .works figure > div {
max-height: 100% !important;
height: 100% !important;
}
.editor-styles-wrapper .works .cover > div {
max-width: 100% !important;
}
.editor-styles-wrapper .works figure {
max-width: 100%;
}
.editor-styles-wrapper .works .cover {
margin: 0;
}
.editor-styles-wrapper .works .carousel-assets-mobile {
display: none;
}
/* WORKS end */
/* TESTIMONIALS start */
.testimonials {
/* transform:translateY(-65px); */
transform: unset;
background-color: #C92A4A;
}
.testimonials-bg {
transform: translate(-90px, -137px) rotate(-4deg);
position: absolute;
background-color: #C92A4A;
height: 1000px;
width: 110vw;
z-index: -2;
}
/* .testimonials .container {
max-width: 100%;
} */
.testimonials .container > div {
margin: auto;
}
.testimonials .subcontainer,
.testimonial .slides-container {
margin: unset;
max-width: 100%;
}
.slides-container {
padding-top: 80px;
}
.slides-container > div {
display: flex;
justify-content: space-between;
padding-top: unset;
}
.slides-container .right-arrow,
.slides-container .left-arrow {
cursor: pointer;
margin: auto 0;
height: 23.5px;
width: 23.5px;
min-width: 23.5px;
}
.testimonials .testimonial {
background: white;
width: auto;
padding: 100px 85px 100px 85px;
display: flex;
flex: 100%;
margin: 0 70px;
display: none;
}
.testimonials .testimonial > div {
display: flex;
flex-direction: row;
column-gap: 85px;
}
.testimonial-container {
max-width: 50%;
}
.testimonials div.testimonial:first-of-type {
display: flex;
}
.testimonials .headline {
line-height: 1.4;
margin-bottom: 16px;
}
.attribution {
margin-bottom: 50px;
}
.attribution > div {
position: relative;
}
.attribution,
.attribution a {
color: #C92A4A;
font-weight: 600;
}
.testimonials .testimonial .person {
transform: unset;
position: relative;
max-width: 100%;
right: unset;
top: unset;
height: 100%;
}
.testimonials .testimonial .person img {
height: 100%;
object-fit: cover;
}
.testimonials .person-container,
.testimonials .person-container > div {
position: relative;
width: 100%;
height: 100%;
}
.testimonials .image-container {
max-width: 100%;
width: 100%;
height: 430px;
transform: translateY(-145px);
position: absolute;
right: 0;
top: 0;
}
.testimonials .image-container > div {
height: 100%;
}
.testimonials .person-container .divider {
position: absolute;
bottom: 0;
width: 100.02%;
height: calc(100vw * tan(1deg) - 0.1%);
}
.testimonials .person-container .divider .block-list-appender {
display: none;
}
.testimonials .person-container .divider > div,
.testimonials .person-container .divider p {
height: calc(100vw * tan(1deg) - 0.1%);
color: transparent;
width: 100.02%;
}
.testimonials .person-container .divider p {
background-color: white;
}
.testimonials .testimonial .arrow {
transform: unset;
position: absolute;
z-index: 1;
width: 257px;
height: 92px;
bottom: -50px;
right: 0;
left: unset;
transform: translateX(55%);
}
.editor-styles-wrapper .paginations {
display: none;
}
.paginations > div {
gap: 8px;
margin-top: 44px;
height: 21px;
display: flex;
justify-content: center;
}
.paginations img {
width: 10px;
opacity: 20%;
cursor: pointer;
margin: auto 0;
}
.paginations img.active {
width: 16px;
opacity: unset;
}
.testimonials [data-centered] p,
.testimonials p.data-centered {
margin: unset;
padding: 66px 0;
white-space: nowrap !important;
max-width: 100%;
}
.testimonials .data-button-secondary:hover,
.testimonials .data-button-secondary:focus {
text-decoration: none;
color: white;
}
.testimonials .button-container a {
color: white;
border: 2px solid white;
background-color: unset;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
font-size: 1rem;
}
p.testimonial-button a {
color: #373737;
background-color: #C8EB24;
border: none;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
}
.testimonial-button:hover {
width: fit-content;
rotate: 4deg;
}
/* editor styles */
.editor-styles-wrapper .testimonials .slides-container {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .testimonials .testimonial {
max-width: 100%;
}
.editor-styles-wrapper .testimonial-container {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .testimonial-container .headline {
max-width: 100%;
margin: 24px 0 16px 0;
line-height: 1.4;
}
.editor-styles-wrapper .testimonial-container .attribution {
max-width: 100%;
margin: 0 0 50px 0;
}
.editor-styles-wrapper .testimonial-container .attribution p {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .arrow:after {
display: none;
}
.editor-styles-wrapper .testimonials .components-resizable-box__handle {
display: none;
}
.editor-styles-wrapper .testimonial-button {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .testimonials figure.person > div {
max-width: 100% !important;
}
.editor-styles-wrapper .testimonials .testimonial .arrow {
margin: 0;
}
.editor-styles-wrapper .testimonials .slides-container .right-arrow,
.editor-styles-wrapper .testimonials .slides-container .left-arrow {
padding-top: 120px;
}
.editor-styles-wrapper .testimonials .person-container .divider {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .testimonials .person-container {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .testimonials .image-container {
height: 430px;
}
.editor-styles-wrapper .testimonials .testimonial .person,
.editor-styles-wrapper .testimonials .testimonial .person img {
height: 430px;
}
.editor-styles-wrapper .testimonials .button-container a {
line-height: 1.2;
}
/* TESTIMONIALS end */
/* REQUIREMENTS start */
.requirements {
padding: 60px 0 0 0;
background-color: #C8EB24;
}
.requirements-bg {
background-color: #C8EB24;
transform: translate(-90px, -99px) rotate(-4deg);
position: absolute;
height: 678px;
width: 110vw;
z-index: -2;
}
.requirements .subcontainer {
display: flex;
/* margin-right: 153px; */
margin-right: unset;
column-gap: 130px;
margin-bottom: 60px;
}
.requirements .subcontainer > div {
flex: 1;
position: relative;
row-gap: 20px;
}
.requirements .text-container h1,
.requirements .text-container h2,
.requirements .text-container h3,
.requirements .text-container h4,
.requirements .text-container h5 {
margin: unset;
text-align: left;
font-size: 3rem;
color: var(--newviva-font-red);
}
.requirements .text-bubbles h2,
.requirements .text-bubbles h3,
.requirements .text-bubbles h4,
.requirements .text-bubbles h5 {
font-size: 1.5rem;
font-weight: 700;
color: var(--newviva-font-black);
}
.requirements .arrow {
width: unset;
height: unset;
position: absolute;
bottom: 0;
right: 0;
transform: translate(85px, 100px);
}
.requirements .no-margin-top {
margin-top: unset;
}
.requirements .bigger-margin-top {
margin-top: 35px;
}
.requirement {
background-color: white;
border-radius: 24px;
padding: 12px 20px;
margin-bottom: 14px;
display: inline-flex;
column-gap: 15px;
font-weight: 600;
}
.requirement p,
.requirements .text-container p {
line-height: 1.4;
flex: 1;
}
.requirements .check-icon img {
width: 16px;
height: 16px;
}
/* editor styles */
.editor-styles-wrapper .requirements .container {
margin: 0;
}
.editor-styles-wrapper .requirements .subcontainer,
.editor-styles-wrapper .requirements .subcontainer > div {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .requirements .subcontainer {
margin: 0 0 30px 0;
}
.editor-styles-wrapper .requirements p {
max-width: 100%;
}
.editor-styles-wrapper .requirements .text-container h1,
.editor-styles-wrapper .requirements .text-container h2,
.editor-styles-wrapper .requirements .text-container h3,
.editor-styles-wrapper .requirements .text-container h4,
.editor-styles-wrapper .requirements .text-container h5,
.editor-styles-wrapper .requirements .text-container p {
line-height: 1.3;
max-width: 100%;
}
.editor-styles-wrapper .requirements .text-bubbles h2,
.editor-styles-wrapper .requirements .text-bubbles h3,
.editor-styles-wrapper .requirements .text-bubbles h4,
.editor-styles-wrapper .requirements .text-bubbles h5 {
max-width: 100%;
margin: 0 0 24px 0;
}
.editor-styles-wrapper .requirements .text-bubbles > div > div {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .requirements .text-bubbles > div > div {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .requirements .text-bubbles > div > div:not(:last-of-type) {
margin: 0 0 35px 0;
}
.editor-styles-wrapper .requirements .arrow {
left: unset;
}
/* REQUIREMENTS end */
/* INSTRUCTIONS start */
.instructions {
padding: 80px 0 0 0;
}
.instructions .subcontainer {
margin-bottom: 30px;
}
.instructions h1,
.instructions h2,
.instructions h3,
.instructions h4,
.instructions h5 {
margin-bottom: 80px;
color: var(--newviva-font-red);
text-align: center;
font-size: 3rem;
}
.steps > div {
display: flex;
column-gap: 37px;
padding: 0 104px 0;
align-items: flex-start;
margin-top: unset;
}
.step {
background-color: #F8F4E9;
flex: 1;
padding: 0 37px 42px;
position: relative;
font-weight: 600;
font-size: 1rem;
line-height: 24px;
color: #C92A4A;
}
.number {
transform: translateY(-18px);
}
.first-step {
z-index: 4;
}
.second-step {
transform: translateY(94px);
z-index: 3;
}
.third-step {
z-index: 2;
}
.fourth-step {
transform: translateY(20px);
z-index: 1;
}
.step .arrow-1 {
position: absolute;
transform: translate(81px, 14px);
z-index: 1;
top: 0;
right: 0;
}
.step .arrow-2 {
position: absolute;
transform: translate(85px, -40px);
z-index: 1;
bottom: 0;
right: 0;
}
.step .arrow-3 {
position: absolute;
transform: translate(55px, -20px);
z-index: 1;
top: 0;
right: 0;
}
.instructions [data-centered],
.instructions .data-centered {
padding-top: 178px;
}
.instructions .button-container p a {
color: var(--newviva-font-black);
border: 2px solid var(--newviva-border-black);
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
background-color: unset;
}
/* editor styles */
.editor-styles-wrapper .instructions .container {
margin: 0;
}
.editor-styles-wrapper .instructions .subcontainer,
.editor-styles-wrapper .instructions .subcontainer > div {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .instructions .subcontainer {
margin: 0 0 30px 0;
}
.editor-styles-wrapper .instructions .steps,
.editor-styles-wrapper .instructions .steps > div {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .instructions .step {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .instructions .step p {
margin: 1em 0;
line-height: 1.5;
}
.editor-styles-wrapper .instructions .button-container {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .instructions .button-container p {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .instructions .step > div {
position: unset;
}
/* INSTRUCTIONS end */
/* SPOTLIGHTS start */
.spotlights {
background-color: var(--newviva-background-sand);
padding: 100px 0 0 0;
}
.spotlight-bg {
background-color: #F8F4E9;
transform: translate(-90px, -186px) rotate(-4deg);
position: absolute;
height: 1036px;
width: 110vw;
z-index: -2;
}
.spotlights .subcontainer {
margin-bottom: unset;
padding-bottom: 24px;
}
.spotlights .divider {
margin-top: unset;
}
.spotlights .title-container > div {
display: flex;
justify-content: center;
}
.spotlights h1,
.spotlights h2,
.spotlights h3,
.spotlights h4,
.spotlights h5 {
margin-bottom: 76px;
color: var(--newviva-font-red);
text-align: center;
font-size: 3rem;
max-width: 750px;
line-height: 1.3;
}
.spotlights-container > div {
/* display: grid;
grid-template-columns: 1fr 1fr 1fr;
justify-items: center; */
display: flex;
flex-direction: row;
justify-content: space-between;
column-gap: unset;
}
.spotlights .button-container p:hover {
rotate: 4deg;
}
.spotlights-container .data-button-tertiary > div {
height: 425px;
width: 397px;
position: relative;
}
.spotlight-card .cover > div {
height: 100%;
}
.spotlights-container .button-banner > div {
padding-top: 15px;
position: absolute;
width: 83%;
clip-path: polygon(0% 0%, 100% 18.5391%, 100% 100%, 0% 100%);
}
.spotlight-card .button-banner > div {
height: 84px;
transform: translate(-15px, -78px);
}
.spotlight-card .button-banner p:has(>.agriviva-arrow-right-large) {
transform: translateY(2px);
}
.spotlight-card:hover .button-banner p:has(>.agriviva-arrow-right-large),
.spotlight-card:focus .button-banner p:has(>.agriviva-arrow-right-large) {
transform: translate(10px, 2px);
}
.spotlights-container .location-container {
background-color: #373737;
color: white;
border-radius: 22px;
padding: 6px 12px;
line-height: 24px;
width: fit-content;
white-space: nowrap;
position: absolute;
bottom: 58px;
left: 11px;
}
.spotlights-container .location-container > div {
display: flex;
align-items: center;
column-gap: 6px;
}
.spotlights-container .location-container p {
display: inherit;
}
.spotlights-container .location img {
margin-right: 0;
transform: unset;
}
.spotlights [data-centered],
.spotlights .data-centered {
padding-top: 88px;
}
.spotlights .button-container a {
color: var(--newviva-font-black);
background-color: var(--newviva-background-green);
border: none;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
}
.spotlights .carousel-assets-mobile {
display: none;
}
.spotlights .carousel-assets-mobile > div {
display: flex;
flex-direction: row;
justify-content: unset;
width: 100%;
margin-top: 38px;
column-gap: 32px;
}
.spotlights .carousel-assets-mobile p {
font-size: 32px;
color: var(--newviva-font-black);
margin: 0;
}
.spotlights .carousel-assets-mobile p.arrow-left-carousel-mobile {
margin-left: auto;
}
.spotlights .carousel-assets-mobile p.arrow-right-carousel-mobile {
margin-right: auto;
}
.spotlights .carousel-assets-mobile .pagination-spotlight > div {
display: flex;
flex-direction: row;
align-items: center;
column-gap: 10px;
height: 100%;
}
.spotlights .carousel-assets-mobile .pagination-work img {
filter: contrast(0.1) brightness(1.3);
width: 12px;
height: 12px;
}
.spotlights .carousel-assets-mobile .pagination-work img.active {
filter: contrast(0.1) brightness(0);
width: 16px;
height: 16px;
}
.spotlights .carousel-assets-mobile .pagination-spotlight img {
filter: contrast(0.1) brightness(1.3);
width: 12px;
height: 12px;
}
.spotlights .carousel-assets-mobile .pagination-spotlight img.active {
filter: contrast(0.1) brightness(0);
width: 16px;
height: 16px;
}
/* editor styles */
.editor-styles-wrapper .spotlights .subcontainer,
.editor-styles-wrapper .spotlights .subcontainer > div {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .spotlights .spotlights-container,
.editor-styles-wrapper .spotlights .spotlights-container > div {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .spotlights .spotlight-card {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .spotlights .spotlight-card .cover,
.editor-styles-wrapper .spotlights .spotlight-card .cover figure,
.editor-styles-wrapper .spotlights .spotlight-card .button-banner {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .spotlights .spotlight-card .cover figure > div {
height: 100% !important;
max-width: unset !important;
max-height: unset !important;
}
.editor-styles-wrapper .spotlights .spotlight-card .button-banner p {
max-width: 100%;
margin: 0;
line-height: 1.3;
}
.editor-styles-wrapper .spotlights .spotlight-card .location {
font-size: 1rem;
}
.editor-styles-wrapper .spotlight-card .button-banner > div {
height: 96px;
}
.editor-styles-wrapper .spotlights .button-container,
.editor-styles-wrapper .spotlights .button-container p {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .spotlights .container,
.editor-styles-wrapper .spotlights .container > div {
overflow: unset;
}
.editor-styles-wrapper .spotlights .components-resizable-box__handle {
display: none !important;
}
.editor-styles-wrapper .spotlights .carousel-assets-mobile {
display: none;
}
/* SPOTLIGHTS end */
/* FORM ASSOCIATION MEMBER start */
.form-association-member {
padding: 0 0 0 0;
background-color: none;
}
.form-association-member-bg {
background-color: none;
transform: translate(-90px, -99px) rotate(-4deg);
position: absolute;
height: 678px;
width: 110vw;
z-index: -2;
}
.form-association-member .amount-container {
display: flex;
align-items: flex-start;
width: 100%;
}
.amount {
color: var(--newviva-font-black);
margin-right: 30px;
}
.amount-row {
display: flex;
align-items: flex-start;
gap: 16px; /* adjust as needed */
}
.form-association-member .amount-container .association-text {
flex: 1;
display: block;
color: var(--newviva-font-black);
margin-bottom: 8px;
overflow-wrap: break-word;
word-break: break-word;
margin-bottom: 0;
position: relative;
}
.form-association-member .amount-container > .amount,
.form-association-member .amount-container > .association-text {
margin-bottom: 0;
flex-shrink: 0;
}
.form-association-member .subcontainer {
display: flex;
/* margin-right: 153px; */
margin-right: unset;
column-gap: 130px;
margin-bottom: 60px;
}
.form-association-member .subcontainer > div {
flex: 1;
position: relative;
row-gap: 20px;
}
.form-association-member .text-container h1,
.form-association-member .text-container h2,
.form-association-member .text-container h3,
.form-association-member .text-container h4,
.form-association-member .text-container h5 {
margin: unset;
text-align: left;
font-size: 3rem;
color: var(--newviva-font-red);
}
.form-association-member .text-bubbles h2,
.form-association-member .text-bubbles h3,
.form-association-member .text-bubbles h4,
.form-association-member .text-bubbles h5 {
font-size: 1.5rem;
font-weight: 700;
color: var(--newviva-font-black);
}
.form-association-member .no-margin-top {
margin-top: unset;
}
.form-association-member .bigger-margin-top {
margin-top: 35px;
}
.form-association-member .check-icon img {
width: 16px;
height: 16px;
}
/* editor styles */
.editor-styles-wrapper .form-association-member .container {
margin: 0;
}
.editor-styles-wrapper .form-association-member .subcontainer,
.editor-styles-wrapper .form-association-member .subcontainer > div {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .form-association-member .subcontainer {
margin: 0 0 30px 0;
}
.editor-styles-wrapper .form-association-member p {
max-width: 100%;
}
.editor-styles-wrapper .form-association-member .text-container h1,
.editor-styles-wrapper .form-association-member .text-container h2,
.editor-styles-wrapper .form-association-member .text-container h3,
.editor-styles-wrapper .form-association-member .text-container h4,
.editor-styles-wrapper .form-association-member .text-container h5,
.editor-styles-wrapper .form-association-member .text-container p {
line-height: 1.3;
max-width: 100%;
}
.editor-styles-wrapper .form-association-member .text-bubbles h2,
.editor-styles-wrapper .form-association-member .text-bubbles h3,
.editor-styles-wrapper .form-association-member .text-bubbles h4,
.editor-styles-wrapper .form-association-member .text-bubbles h5 {
max-width: 100%;
margin: 0 0 24px 0;
}
.editor-styles-wrapper .form-association-member .text-bubbles > div > div {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .form-association-member .text-bubbles > div > div {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .form-association-member .text-bubbles > div > div:not(:last-of-type) {
margin: 0 0 35px 0;
}
.editor-styles-wrapper .form-association-member .arrow {
left: unset;
}
/* FORM ASSOCIATION MEMBER end */
/* CTA AND ABOUT AGRIVIVA start */
.cta-and-about-agriviva {
position: relative;
}
.cta-and-about-agriviva .button-container a:hover {
rotate: 4deg;
}
.cta-and-about-agriviva .divider-special {
position: absolute;
top: -1px;
left: 0;
z-index: 10;
width: 100%;
}
.cta-and-about-agriviva .divider-special p,
.cta-and-about-agriviva .divider-special > div {
clip-path: polygon(100% 0%, 0% 100%, 0% 0%);
}
.cta-and-about-agriviva > img {
z-index: -3;
position: relative;
width: 100vw;
height: 100vh;
object-fit: cover;
}
.cta-and-about-agriviva .fluid-image {
height: 935px;
}
.cta-and-about-agriviva .fluid-image img {
height: 100%;
max-width: 100%;
width: 100%;
object-fit: cover;
}
.call-to-action {
padding: 64px 100px;
transform: translateY(-150px);
position: relative;
left: 0;
top: 0;
width: 100%;
min-height: unset;
max-height: unset;
}
.call-to-action h1,
.call-to-action h2,
.call-to-action h3,
.call-to-action h4,
.call-to-action h5 {
margin: 0 0 35px;
text-align: center;
font-size: 3rem;
color: var(--newviva-font-red);
line-height: 1.3;
}
.call-to-action .headline {
line-height: 1.3;
text-align: center;
margin-bottom: 40px;
}
.cta-and-about-agriviva .button-container a {
color: var(--newviva-font-black);
background-color: var(--newviva-background-green);
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
border: none;
display: flex;
}
.cta-and-about-agriviva .button-container-secondary {
display: flex;
}
.cta-and-about-agriviva [data-centered],
.cta-and-about-agriviva .data-centered {
padding-top: unset;
}
.cta-and-about-agriviva .bg-red .subcontainer {
display: flex;
justify-content: center;
padding-bottom: 0;
margin-bottom: 0;
}
.cta-and-about-agriviva .bg-red .subcontainer > div {
max-width: 1190px;
position: relative;
width: 100%;
}
.about-agriviva {
transform: translateY(0);
}
.about-agriviva img {
max-width: unset;
}
.about-agriviva > div {
color: white;
display: flex;
column-gap: 119px;
}
.about-agriviva .logo-container > div {
position: relative;
}
.about-agriviva .arrow {
position: absolute;
right: 0;
top: 0;
transform: translate(80px, 69px);
width: max-content;
height: max-content;
}
.about-agriviva h1,
.about-agriviva h2,
.about-agriviva h3,
.about-agriviva h4,
.about-agriviva h5 {
margin: unset;
text-align: left;
font-size: 3rem;
line-height: 1.4;
color: var(--newviva-font-green);
}
.about-agriviva .headline {
line-height: 1.4;
margin-bottom: 28px;
}
.about-agriviva .button-container {
margin: 40px 0 150px;
}
.cta-and-about-agriviva .button-container {
padding-top: unset;
}
.cta-and-about-agriviva .button-container p {
margin: 0;
}
.cta-and-about-agriviva > div > .divider:not(.divider-special) {
background-color: var(--newviva-background-red);
}
.cta-and-about-agriviva .button-container-secondary a {
color: white;
border: 2px solid white;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
background-color: transparent;
}
.cta-and-about-agriviva .bg-red {
position: relative;
height: unset;
padding-bottom: 60px;
}
.cta-and-about-agriviva.no-space-bottom .bg-red {
padding-bottom: 0;
}
.cta-and-about-agriviva .bg-red .divider {
position: absolute;
width: 100%;
top: 0;
transform: translateY(-100%);
background: transparent;
}
.cta-and-about-agriviva .bg-red .divider p {
background: var(--newviva-background-red);
}
/* editor styles */
.editor-styles-wrapper .cta-and-about-agriviva .divider-special span {
display: none;
}
.editor-styles-wrapper .cta-and-about-agriviva .image-fluid {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .about-agriviva .arrow {
margin: 0;
max-width: 100%;
left: unset;
}
.cta-and-about-agriviva .fluid-image > div {
max-width: 100% !important;
}
.editor-styles-wrapper .cta-and-about-agriviva:not(.cta-logo) .bg-red {
margin: 0;
}
.editor-styles-wrapper .bg-red .container,
.editor-styles-wrapper .bg-red .container > div {
margin-bottom: 0;
margin-top: 0;
}
.editor-styles-wrapper .cta-and-about-agriviva .bg-red .divider {
margin: 0;
width: 100%;
}
.editor-styles-wrapper .cta-and-about-agriviva .bg-red .subcontainer {
margin: 0 0 0 0;
}
.editor-styles-wrapper .cta-and-about-agriviva .call-to-action {
margin: 0;
max-height: unset;
z-index: 10;
}
.editor-styles-wrapper .cta-and-about-agriviva .button-container {
margin: 0;
}
.editor-styles-wrapper .cta-and-about-agriviva .button-container p {
margin: 0;
}
.editor-styles-wrapper .cta-and-about-agriviva .about-agriviva {
margin: 0;
}
.editor-styles-wrapper .cta-and-about-agriviva .button-container-secondary,
.editor-styles-wrapper .cta-and-about-agriviva .button-container-secondary p {
margin: 0;
max-width: 100%;
display: flex;
}
.editor-styles-wrapper .cta-and-about-agriviva .button-container-secondary a {
font-size: 1rem;
line-height: 1.3;
}
.editor-styles-wrapper .cta-and-about-agriviva > div > .divider {
margin: 0;
}
.editor-styles-wrapper .cta-and-about-agriviva .fluid-image > div {
height: 100% !important;
max-height: 100% !important;
}
/* CTA AND ABOUT AGRIVIVA end */
/* CTA LOGO start */
.cta-logo .subcontainer {
display: flex;
justify-content: center;
padding: 60px 0;
}
.cta-logo.no-space-top .subcontainer {
padding-top: 0;
}
.cta-logo .subcontainer > div {
max-width: 1190px;
}
.cta-logo h1,
.cta-logo h2,
.cta-logo h3,
.cta-logo h4,
.cta-logo h5,
.cta-logo h6 {
margin: unset;
text-align: left;
font-size: 3rem;
line-height: 1.3;
color: var(--newviva-font-green);
}
/* editor styles */
.editor-styles-wrapper
/* CTA LOGO end */
/* INSTAGRAM start */
.instagram .title-container {
display: flex;
justify-content: center;
}
.instagram h1,
.instagram h2,
.instagram h3,
.instagram h4,
.instagram h5 {
margin: 0;
color: var(--newviva-font-red);
text-align: center;
font-size: 3rem;
}
.instagram [data-centered],
.instagram .data-centered {
margin-top: 120px;
}
.up-arrow {
display: flex;
justify-content: end;
}
.instagram .subcontainer {
margin-bottom: 30px;
}
/* editor styles */
.editor-styles-wrapper .instagram .data-centered {
margin-bottom: 0;
}
.editor-styles-wrapper .instagram .title-container,
.editor-styles-wrapper .instagram .title-container > div,
.editor-styles-wrapper .instagram .title-container h1,
.editor-styles-wrapper .instagram .title-container h2,
.editor-styles-wrapper .instagram .title-container h3,
.editor-styles-wrapper .instagram .title-container h4,
.editor-styles-wrapper .instagram .title-container h5 {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .plugin-container,
.editor-styles-wrapper .plugin-container > div {
margin: 0;
max-width: 100%;
}
/* INSTAGRAM end */
/* NEW CODE */
/* LOGO CAROUSEL start */
@keyframes infinite-scroll {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%); /* Nur bis zur Hälfte scrollen */
}
}
.logo-carousel {
background-color: var(--newviva-background-veryDarkGrey);
}
.logo-carousel > div {
height: unset;
background-color: unset;
display: unset;
align-items: unset;
overflow: unset;
}
.logo-carousel .subcontainer {
height: 450px;
display: flex;
align-items: center;
overflow: hidden;
}
.logo-carousel .logos {
/* overflow: hidden; */
display: flex;
align-items: center;
animation: infinite-scroll 50s linear infinite;
/* height: fit-content; */
}
.logo-carousel .logos > div {
display: flex;
}
.logos figure {
display: flex;
align-items: center;
justify-content: center;
width: 230px;
height: 100px;
margin: 0 60px;
overflow: hidden;
}
.logos figure a {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
.logos figure img {
height: 100%;
width: 100%;
object-fit: contain;
}
.logo-carousel .logos:hover,
.logo-carousel .logos:focus {
animation-play-state: paused;
}
/* editor styles */
.editor-styles-wrapper .logo-carousel > div {
height: unset;
padding: 0;
display: grid;
}
.editor-styles-wrapper .logo-carousel .logos {
animation-play-state: paused;
}
.editor-styles-wrapper .logo-carousel .subcontainer {
max-width: 100%;
margin: 0;
padding: 20px;
height: unset;
}
.editor-styles-wrapper .logo-carousel .logos {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .logos figure {
background: grey;
border: 1px solid white;
}
.editor-styles-wrapper .logo-carousel .logos > div {
column-gap: 20px;
row-gap: 20px;
flex-wrap: wrap;
}
.editor-styles-wrapper .logo-carousel .logos > div {
background: rgba(255, 0, 0, 0.2);
}
.editor-styles-wrapper .logo-carousel .logos > div:first-of-type {
background: rgba(73, 93, 71, 0.8);
}
.editor-styles-wrapper .logo-carousel .logos > div:not(:first-of-type) {
opacity: 0.3;
}
.editor-styles-wrapper .logo-carousel .divider {
margin: 0;
width: 100%;
}
/* LOGO CAROUSEL end */
/* KOPIE VON PME PROJEKT */
/* REFERENCE LOGOS start */
/* section.reference-logos .subcontainer {
background-color: var(--newviva-background-darkgrey);
}
.logo-container {
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.marquee-wrapper {
text-align: center;
overflow: hidden;
}
.marquee-block {
height: 130px;
overflow: hidden;
box-sizing: border-box;
position: relative;
margin: 20px auto;
padding: 30px 0;
}
.marquee-inner {
display: block;
width: 200%;
position: absolute;
animation: logo-carousel-animation 30s linear infinite;
}
.marquee-inner span {
float: left;
width: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.marquee-item {
width: 230px;
height: auto;
display: inline-block;
margin: 0 55px;
float: left;
transition: all .2s ease-out;
filter: grayscale(1);
-webkit-filter: grayscale(1);
-moz-filter: grayscale(1);
}
.marquee-item a {
display: flex;
justify-content: center;
align-items: center;
}
.marquee-item a img {
max-height: 70px;
max-width: 140px;
height: 70px;
width: 140px;
object-fit: contain;
}
@keyframes logo-carousel-animation {
0% {
left: 0;
}
100% {
left: -100%;
}
} */
/* REFERENCE LOGOS end */
/* HOME PAGE end */
/* ALL TESTIMONIALS PAGE start */
.all-testimonials {
background-color: var(--newviva-background-sand);
}
.all-testimonials .bg-beige {
padding: 48px 0 120px;
}
.all-testimonials [data-h2] {
margin: 0 24%;
}
.all-testimonials .subcontainer > div {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 45px;
align-items: start;
}
.all-testimonials .testimonial {
background-color: white;
padding: 42px;
position: relative;
margin-top: 240px;
}
.all-testimonials .testimonial > div {
display: flex;
flex-direction: column;
align-items: center;
}
.all-testimonials .testimonial .image-container {
width: fit-content;
width: -moz-fit-content;
position: absolute;
top: 0;
transform: translateY(-146px);
width: 260px;
height: 280px;
}
.all-testimonials .testimonial .image-container > div,
.all-testimonials .testimonial .image-container figure {
height: 100%;
}
.all-testimonials .testimonial .image-container .divider {
position: absolute;
width: 100%;
bottom: 0;
}
.all-testimonials .testimonial .image-container .divider,
.all-testimonials .testimonial .image-container .divider > div,
.all-testimonials .testimonial .image-container .divider p {
height: calc(100vw * tan(1deg) - 0.5%);
}
.all-testimonials .testimonial .image-container .divider p {
background-color: white;
}
.all-testimonials .testimonial img {
width: 100%;
height: 100%;
object-fit: cover;
transform: unset;
left: unset;
position: unset;
}
.all-testimonials .testimonial .text {
font-weight: 600;
margin: 118px 0 16px;
}
.all-testimonials .testimonial p {
line-height: 1.4;
}
.all-testimonials .attribution {
margin-bottom: 40px;
}
.all-testimonials .attribution p {
margin: 0;
}
.all-testimonials .button-container {
display: flex;
width: 100%;
}
.all-testimonials .button-container a {
flex: 1;
text-align: center;
}
.all-testimonials .button-container > div {
width: 100%;
}
.all-testimonials .button-container p {
display: flex;
margin: 0;
width: 100%;
}
.all-testimonials .button-container p a {
color: var(--newviva-font-black);
background-color: var(--newviva-background-green);
border: none;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
font-size: 1rem;
}
/* editor styles */
.editor-styles-wrapper .all-testimonials .subcontainer {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .all-testimonials .column {
margin: 0;
}
.editor-styles-wrapper .all-testimonials .button-container p a {
line-height: 1.3;
}
.editor-styles-wrapper .all-testimonials .divider span {
display: none;
}
.editor-styles-wrapper .all-testimonials .divider {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .all-testimonials .components-resizable-box__handle {
display: none;
}
.editor-styles-wrapper .all-testimonials figure {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .all-testimonials figure > div {
max-width: 100% !important;
height: 100% !important;
max-height: 100% !important;
}
.editor-styles-wrapper .all-testimonials .testimonial {
margin-bottom: 0;
}
.editor-styles-wrapper .all-testimonials .attribution {
margin-top: 0;
}
.editor-styles-wrapper .all-testimonials .button-container {
margin: 0;
}
.editor-styles-wrapper .all-testimonials .testimonial .image-container {
margin: 0;
transform: translateY(-185px);
}
.editor-styles-wrapper .all-testimonials .testimonial .image-container > div {
height: 100%;
}
/* ALL TESTIMONIALS PAGE end */
/* ADDITIONAL TESTIMONIALS start */
.additional-testimonials .title-container {
display: flex;
justify-content: center;
}
.additional-testimonials .title-container h1,
.additional-testimonials .title-container h2,
.additional-testimonials .title-container h3,
.additional-testimonials .title-container h4,
.additional-testimonials .title-container h5 {
color: var(--newviva-font-red);
text-align: center;
font-size: 3rem;
max-width: 750px;
line-height: 1.3;
margin: 0;
}
/* ADDITIONAL TESTIMONIALS END */
/* TESTIMONIAL DETAIL PAGE start */
.testimonial-detail {
padding: 119px 0 0 0;
color: white;
position: relative;
}
.testimonial-detail .subcontainer {
padding: 50px 30px 24px;
}
.testimonial-detail :is(div, .container, .subcontainer) {
position: relative;
}
.testimonial-detail [data-button-primary],
.testimonial-detail .data-button-primary {
padding: unset;
}
.testimonial-detail [data-button-primary] img,
.testimonial-detail .data-button-primary img {
padding-right: 10px;
}
.testimonial-detail p {
font-size: 2rem;
font-weight: 700;
line-height: 1.4;
max-width: 680px;
}
.testimonial-detail p:not(.atribution):not(:first-of-type) {
margin: 24px 0 32px 0;
}
.testimonial-detail p:first-of-type:not(.divider p) {
margin: 0;
font-size: unset;
font-weight: unset;
line-height: unset;
max-width: unset;
width: fit-content;
width: -moz-fit-content;
}
.testimonial-detail p a {
font-size: 1rem;
}
.testimonial-detail .atribution {
font-weight: 600;
font-size: 1rem;
margin: 0;
}
.testimonial-detail a {
color: white;
user-select: none;
}
.testimonial-detail .back-button {
cursor: pointer;
}
.testimonial-detail .image-container {
position: absolute;
top: 0;
right: 0;
z-index: 10;
}
.testimonial-detail .person {
position: unset;
width: 395px;
height: 425px;
}
.testimonial-detail .person img {
width: 100%;
height: 100%;
object-fit: cover;
}
.testimonial-detail .subcontainer .divider {
position: absolute;
width: 100%;
bottom: 0;
}
.testimonial-detail .subcontainer .divider,
.testimonial-detail .subcontainer .divider > div,
.testimonial-detail .subcontainer .divider p {
height: calc(100vw * tan(1deg) + 0.2%);
}
.testimonial-detail .subcontainer .divider p {
background-color: var(--newviva-background-red);
}
/* editor styles */
.editor-styles-wrapper .testimonial-detail {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .testimonial-detail .container {
max-width: 90%;
}
.editor-styles-wrapper .testimonial-detail .subcontainer {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .testimonial-detail p a.back-button {
display: flex;
}
.editor-styles-wrapper .testimonial-detail .image-container {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .testimonial-detail .person {
top: unset;
right: unset;
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .testimonial-detail .person > div {
width: 100% !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
}
.editor-styles-wrapper .testimonial-detail p:not(.attribution):not(:first-of-type) {
margin: 24px 0 32px 0;
}
.editor-styles-wrapper .testimonial-detail p:last-of-type {
margin: 0 !important;
}
.editor-styles-wrapper .testimonial-detail .divider {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .testimonial-detail .subcontainer .divider span {
display: none;
}
.editor-styles-wrapper .block-list-appender {
display: none !important;
}
.editor-styles-wrapper .components-resizable-box__handle {
display: none !important;
}
/* TESTIMONIAL DETAIL PAGE start */
/* TEXT WALL start */
.text-wall .subcontainer {
margin: 0 200px;
line-height: 24px;
font-size: 1rem;
font-weight: 600;
padding: 100px 0 20px 0;
}
.text-wall .image-container {
margin: 50px 0;
}
.text-wall h1,
.text-wall h2,
.text-wall h3,
.text-wall h4,
.text-wall h5 {
line-height: 1.1;
}
.text-wall figure {
max-height: 500px;
height: 500px;
max-width: 100%;
margin: 0;
overflow: hidden;
}
.text-wall img {
margin: 0;
object-fit: cover;
width: 100%;
height: 100%;
}
.text-wall strong {
font-weight: 700;
}
.text-wall p {
margin: 16px 0;
}
.text-wall a {
color: var(--newviva-font-red);
}
/* editor styles */
.editor-styles-wrapper .text-wall .image-container {
margin: 50px 0;
max-width: 100%;
}
.editor-styles-wrapper .text-wall h1,
.editor-styles-wrapper .text-wall h2,
.editor-styles-wrapper .text-wall h3,
.editor-styles-wrapper .text-wall h4,
.editor-styles-wrapper .text-wall h5 {
margin-left: 0;
margin-right: 0;
}
.editor-styles-wrapper .text-wall p {
margin: 16px 0;
max-width: 100%;
}
.editor-styles-wrapper .text-wall ul,
.editor-styles-wrapper .text-wall ul li {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .text-wall figure,
.editor-styles-wrapper .text-wall figure > div {
max-width: 100%;
}
.editor-styles-wrapper .text-wall figure > div {
max-width: 100% !important;
max-height: 100% !important;
width: 100% !important;
height: 100% !important;
}
/* TEXT WALL end */
/* ABOUT US PAGE start */
.about-us .subcontainer > div {
padding: 100px 0 108px;
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 70px;
column-gap: 50px;
justify-items: center;
}
.about-us .data-button-tertiary {
width: 616px;
height: 425px;
}
.about-us .button-banner {
width: 98%;
}
.about-us .button-banner > div {
clip-path: polygon(0% 0%, 100% 18.5391%, 100% 100%, 0% 100%);
height: 100px;
transform: translate(-15px, -95px);
}
.about-us .button-title {
margin-top: 4px;
}
.about-us .button-banner img {
transform: translateY(7px);
}
.about-us .link-card {
width: 100%;
max-width: 635px;
}
.about-us .link-card:hover .button-banner img,
.about-us .link-card:focus .button-banner img {
transform: translate(10px, 7px);
}
.about-us .subcontainer > div > :nth-last-child(1):nth-child(odd) {
grid-column: span 2;
}
.about-us .data-button-tertiary .cover > div {
height: 100%;
}
/* editor styles */
.editor-styles-wrapper .about-us .subcontainer {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .about-us .link-card .cover,
.editor-styles-wrapper .about-us .link-card .cover figure {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .about-us .link-card .cover figure > div {
max-width: 100% !important;
max-height: 100% !important;
width: 100% !important;
height: 100% !important;
}
.editor-styles-wrapper .about-us .link-card {
margin: 0;
}
.editor-styles-wrapper .about-us .data-button-tertiary .cover > div {
max-width: 100%;
}
.editor-styles-wrapper .about-us .button-banner {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .about-us .button-banner p {
max-width: 100%;
margin: 0;
line-height: 1.2;
}
.editor-styles-wrapper .about-us .button-banner p.button-title {
margin: 4px 0 0;
}
/* ABOUT US PAGE end */
/* OUR TEAM PAGE start */
.our-team {
padding: 0;
}
.our-team > div {
padding: 0;
}
.our-team .subcontainer {
padding: 84px 0 136px;
}
.our-team .menu {
column-gap: 30px;
}
.our-team .contacts > div {
display: grid;
gap: 40px;
grid-template-columns: 1fr 1fr 1fr;
padding-top: unset;
}
.our-team h1,
.our-team h2,
.our-team h3,
.our-team h4,
.our-team h5 {
font-size: 2rem;
font-weight: 700;
text-align: left;
margin: 88px 0 80px;
}
.our-team .card-front h2,
.our-team .card-front h3,
.our-team .card-front h4,
.our-team .card-front h5,
.our-team .card-front h6 {
font-size: 1.5rem;
margin: unset;
line-height: 1.3;
text-align: left;
max-width: calc(100% - 67px);
}
.our-team .card-back h2,
.our-team .card-back h3,
.our-team .card-back h4,
.our-team .card-back h5,
.our-team .card-back h6 {
font-size: 1rem;
margin: unset;
line-height: 1.3;
text-align: left;
}
.our-team .contact {
position: relative;
}
.our-team .contact > div {
height: 100%;
}
.card-front,
.card-back {
transition: transform 0.25s ease-in-out;
min-height: 322px;
height: 100%;
}
.card-front {
padding: 24px 24px 24px 24px;
}
.our-team h4 {
margin: unset;
font-size: 1.5rem;
line-height: 31.2px;
}
.our-team .adress {
padding: 20px 0 24px;
}
.our-team p {
font-weight: 600;
line-height: 1.5;
margin: unset;
}
.our-team p:not(.link-container p):not(.divider p) {
max-width: calc(100% - 67px);
}
.our-team .link-container {
margin-bottom: 17px;
}
.our-team .link-container > div {
display: flex;
flex-direction: row;
column-gap: 10px;
align-items: center;
}
.our-team .link-container figure {
display: flex;
}
.our-team a {
font-weight: 700;
color: #373737;
line-height: 19.2px;
display: block;
margin-bottom: 0;
width: auto;
}
.our-team .contact a:hover {
color: #C92A4A;
}
.our-team a img {
padding-right: 10px;
}
.our-team .data-button-primary {
position: absolute;
top: 24px;
right: 24px;
height: 40px;
width: 40px;
padding: unset;
margin-bottom: 8px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.card-back {
display: none;
padding: 24px;
}
.our-team .data-button-primary img {
padding: unset;
top: unset;
}
.our-team .card-back h4 {
font-size: 1rem;
}
.our-team .personen-container > div {
display: flex;
gap: 30px;
justify-content: space-between;
padding-top: 50px;
}
.our-team .card-back figure:not(figure.data-button-primary) {
margin-bottom: 8px;
width: 160px;
height: 110px;
}
.our-team .card-back figure img:not(figure.data-button-primary img) {
object-fit: cover;
object-position: center center;
width: 100%;
height: 100%;
}
.our-team .card-back p {
font-size: 0.75rem;
line-height: 1.5;
}
.our-team .card-back .position {
font-size: 0.75rem;
color: rgba(55, 55, 55, 0.5);
}
.contact.shrinking .card-front,
.contact.shrinking .card-back {
transform: scaleY(0);
}
.contact.expanding .card-front,
.contact.expanding .card-back {
transform: scaleY(1);
}
.contact.flip .card-front {
display: none;
}
.contact.flip .card-back {
display: block;
}
/* editor styles */
.editor-styles-wrapper .our-team .subcontainer {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .our-team .menu {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .our-team .content {
display: block !important;
}
.editor-styles-wrapper .our-team .contents,
.editor-styles-wrapper .our-team .content,
.editor-styles-wrapper .our-team .contacts,
.editor-styles-wrapper .our-team .contact,
.editor-styles-wrapper .our-team .card-front,
.editor-styles-wrapper .our-team .card-back,
.editor-styles-wrapper .our-team .adress,
.editor-styles-wrapper .our-team .adress p,
.editor-styles-wrapper .our-team p:has(a),
.editor-styles-wrapper .our-team .personen-container,
.editor-styles-wrapper .our-team .personen-container div,
.editor-styles-wrapper .our-team .personen-container figure,
.editor-styles-wrapper .our-team .personen-container p {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .our-team .personen-container figure {
margin-bottom: 8px;
}
.editor-styles-wrapper .our-team h1,
.editor-styles-wrapper .our-team h2,
.editor-styles-wrapper .our-team h3,
.editor-styles-wrapper .our-team h4,
.editor-styles-wrapper .our-team h5 {
margin: 88px 0 80px 0;
}
.editor-styles-wrapper .our-team .card-front h2,
.editor-styles-wrapper .our-team .card-front h3,
.editor-styles-wrapper .our-team .card-front h4,
.editor-styles-wrapper .our-team .card-front h5,
.editor-styles-wrapper .our-team .card-front h6,
.editor-styles-wrapper .our-team .card-back h2,
.editor-styles-wrapper .our-team .card-back h3,
.editor-styles-wrapper .our-team .card-back h4,
.editor-styles-wrapper .our-team .card-back h5,
.editor-styles-wrapper .our-team .card-back h6 {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .our-team .data-button-primary-green {
margin: 0;
}
.editor-styles-wrapper .card-front > div,
.editor-styles-wrapper .card-back > div {
position: unset;
}
.editor-styles-wrapper .card-back figure:not(.data-button-primary-green) > div {
max-width: 100% !important;
max-height: 100% !important;
width: 100% !important;
height: 100% !important;
}
.editor-styles-wrapper .link-container {
margin: 0 0 17px 0;
max-width: 100%;
}
.editor-styles-wrapper .link-container > div,
.editor-styles-wrapper .link-container figure {
margin: 0;
max-width: 100%;
}
/* OUR TEAM PAGE end */
/* HELP & FAQ PAGE start */
.help-and-faq {
padding: 0;
}
.help-and-faq .subcontainer {
padding: 84px 0 136px;
}
.help-and-faq .menu {
column-gap: 30px;
}
.menu .wp-block-button__link {
background: none;
border-radius: unset;
border: none;
margin: unset;
cursor: pointer;
font-weight: 700;
font-size: 1rem;
padding: unset;
color: #373737;
}
.menu .wp-block-button.active .wp-block-button__link {
border-bottom: 2px solid #C92A4A
}
.content {
display: none;
}
.content.active {
display: block;
}
.help-and-faq .content h1,
.help-and-faq .content h2,
.help-and-faq .content h3,
.help-and-faq .content h4,
.help-and-faq .content h5,
.help-and-faq .content h6 {
font-size: 2rem;
text-align: center;
margin: 82px 0 48px;
}
.accordion {
width: 67%;
margin: 0 auto;
background-color: white;
padding: 17px 45px;
}
.accordion-content ul {
padding-left: 20px;
}
.accordion-button > div {
width: 100%;
padding: 25px 0;
background-color: white;
text-align: left;
border: none;
cursor: pointer;
font-size: 1rem;
font-weight: 700;
display: flex;
align-items: center;
justify-content: space-between;
}
.help-and-faq .accordion-button p {
margin: 0;
}
.accordion-item:not(:first-child) .accordion-button {
border-top: 1px solid #F2F2F2;
}
.accordion-content {
padding-bottom: 9px;
display: none;
font-weight: 600;
line-height: 24px;
}
.accordion-content p {
margin-top: unset
}
.accordion-content a {
color: var(--newviva-font-red);
}
/* editor styles */
.editor-styles-wrapper .help-and-faq .subcontainer {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .help-and-faq .menu,
.editor-styles-wrapper .help-and-faq .contents,
.editor-styles-wrapper .help-and-faq .content,
.editor-styles-wrapper .help-and-faq .accordion-item,
.editor-styles-wrapper .help-and-faq .accordion-item > div,
.editor-styles-wrapper .help-and-faq .accordion-button,
.editor-styles-wrapper .help-and-faq .accordion-button figure,
.editor-styles-wrapper .help-and-faq .accordion-content {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .help-and-faq .accordion-content ul {
margin: 1em 0;
}
.editor-styles-wrapper .help-and-faq .accordion-content ul li {
margin: 0;
max-width: 100%;
font-size: 1rem;
}
.editor-styles-wrapper .help-and-faq .accordion-content p {
margin: 0 0 1em 0;
line-height: 1.5;
font-size: 1rem;
}
.editor-styles-wrapper .help-and-faq .accordion {
max-width: 100%;
width: 80%;
}
.editor-styles-wrapper .help-and-faq .accordion > div {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .help-and-faq strong {
font-weight: 700;
}
/* HELP & FAQ PAGE end */
/* CONTACT PAGE start */
.contact-page {
position: relative;
}
.contact-page .page-headline a {
font-weight: 700;
line-height: 24px;
display: block;
color: #373737;
width: max-content;
}
.contact-page .page-headline a:hover {
color: #C92A4A;
}
.contact-page .link-container > div {
display: flex;
align-items: center;
flex-direction: row;
column-gap: 10px;
width: fit-content;
width: -moz-fit-content;
position: relative;
}
.contact-page .link-container figure {
display: flex;
}
.contact-page .link-container p {
margin: 0;
}
.contact-page .link-container:not(.emergency .link-container):first-of-type {
margin: 20px 0 0;
}
.contact-page strong {
font-weight: 700;
}
.contact-page .page-headline img {
margin-right: 0;
top: 0;
position: relative;
}
.emergency {
background-image: url('assets/images/bell.svg');
position: absolute;
top: 0;
right: 0;
width: 660px;
height: 533px;
transform: translate(-140px, 99px);
}
.block-editor-block-list__layout .block-editor-block-list__block.emergency {
margin: unset !important;
}
.emergency-content {
text-align: center;
transform: translate(-6px, 175px) rotate(-4deg);
}
.emergency-content div figure.info-circle {
margin-top: 3px;
}
.emergency-content div figure img {
margin: auto;
}
.emergency-content a {
margin-bottom: 7px;
display: inline-block;
color: white;
background-color: var(--newviva-background-red);
border: none;
padding: 11px 15px;
text-decoration: none;
font-weight: 700;
border-radius: 2px;
}
.emergency h2,
.emergency h3,
.emergency h4,
.emergency h5,
.emergency h6 {
font-size: 1.5rem;
color: var(--newviva-font-red);
margin: 24px;
}
.emergency .link-container {
margin-bottom: 18px;
position: unset;
display: grid;
justify-content: center;
}
.emergency .link-container figure {
position: absolute;
left: 10px;
pointer-events: none;
}
.emergency .data-button-primary {
margin-bottom: 0;
display: inline-block;
}
.contact-page .emergency a {
margin-bottom: 0;
display: inline-block;
padding-left: 36px;
}
.contact-page .emergency-content {
display: flex;
flex-direction: column;
justify-content: center;
}
.emergency .data-button-primary img {
margin-right: 10px;
top: 2px;
}
.emergency p {
font-weight: 600;
line-height: 1.5;
margin: 11px;
font-size: 1rem;
}
.contact-page .page-end-cta .arrow {
transform: translate(362px, -27px);
}
/* editor styles */
.editor-styles-wrapper .contact-page {
margin-top: 0;
}
.editor-styles-wrapper .contact-page .subcontainer {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .contact-page .page-headline {
max-width: 100%;
margin: 0;
}
.editor-styles-wrapper .contact-page .container {
padding: 0;
}
.editor-styles-wrapper .contact-page .emergency {
position: absolute;
transform: translate(-140px, -33px);
}
.editor-styles-wrapper .contact-page .emergency-content {
margin: 0;
max-width: 100%;
}
.editor-styles-wrapper .contact-page .link-container:not(.emergency .link-container) {
margin-bottom: 0;
}
.editor-styles-wrapper .emergency h2,
.editor-styles-wrapper .emergency h3,
.editor-styles-wrapper .emergency h4,
.editor-styles-wrapper .emergency h5,
.editor-styles-wrapper .emergency h6 {
font-size: 1.5rem;
color: var(--newviva-font-red);
margin: 18px auto 20px auto;
}
.editor-styles-wrapper .contact-page .emergency a {
white-space: nowrap;
}
.editor-styles-wrapper .emergency-content .rich-text:focus *[data-rich-text-format-boundary] {
background-color: var(--newviva-background-red);
}
/* CONTACT PAGE end */
/* FOOTER start */
.footer {
overflow: hidden;
position: relative;
color: white;
line-height: 24px;
background-color: unset;
padding: unset;
z-index: 10;
}
.footer .footer-top {
border-bottom: 1px solid var(--newviva-border-black);
}
.footer .footer-bottom {
border-top: 1px solid var(--newviva-border-black);
}
.footer .footer-top,
.footer .footer-bottom {
background: var(--newviva-background-black);
}
.footer .divider {
background-color: transparent;
}
.footer .divider > div {
background-color: var(--newviva-background-black);
border-color: var(--newviva-border-black);
}
.footer-title {
display: inline-block;
font-size: 1.125rem;
font-weight: 700;
margin-bottom: 14px;
margin: unset;
margin-bottom: 16px;
}
/* .space-bottom {
margin-bottom: 12px;
} */
.footer-contact-links {
margin-top: 12px;
display: grid;
row-gap: 4px;
margin-bottom: 12px;
}
.footer ul {
list-style-type: none;
padding: unset;
margin: unset !important;
max-width: 100%;
}
.footer-top ul li,
.footer-bottom ul li:not(:first-child):not(.copyright-automatic) {
margin: unset !important;
max-width: 100%;
}
.footer a,
.footer-bottom span {
color: #9b9b9b;
text-decoration: none;
display: inline-block;
}
.footer a.contact-link {
display: flex;
align-items: center;
column-gap: 10px;
}
.footer .agriviva-whatsapp .path3:before {
color: var(--newviva-background-black);
}
.footer a.contact-link span {
font-size: 1.063rem;
}
.footer a.social-media {
font-size: 1.5rem;
color: var(--newviva-icon-grey);
}
/* footer a.social-media:hover,
footer a.social-media:focus {
text-decoration: none;
color: var(--newviva-icon-red);
outline: none;
} */
.footer a:hover {
color: white;
}
.footer-top,
.footer-bottom,
.footer-bottom .wp-block-list {
width: 100%;
}
.footer-top .subcontainer {
margin: unset;
padding: 25px 45px 50px 45px;
display: flex;
justify-content: space-between;
}
.footer-top .subcontainer > a {
margin: 22px 30px 22px 0;
}
.footer-top .subcontainer .contact.item {
margin-right: 10px; /* Applies only to .contact.item */
margin-left: 250px;
}
.footer-top .subcontainer .quick-access.item {
margin-left: 0;
margin-right: 250px;
}
.e-mail {
display: flex;
margin-bottom: 0;
margin-top: 0;
}
.e-mail p {
margin: unset;
}
.e-mail input,
.e-mail .text-container {
height: 40px;
padding: 0 12px;
border: unset;
border-radius: 2px 0 0 2px;
}
.e-mail input {
width: 226px;
font-size: 1rem;
}
.e-mail input:focus {
border: none;
outline: none;
box-shadow: none;
}
.e-mail .text-container {
width: 250px;
font-size: 0.75rem;
background-color: #C92A4A;
font-weight: 600;
line-height: 18px;
display: flex;
align-items: center;
}
.e-mail button {
height: 40px;
width: 48px;
background-color: #C8EB24;
border: unset;
border-radius: 0 2px 2px 0;
display: flex;
align-items: center;
justify-content: center;
}
.e-mail button:hover {
cursor: pointer;
}
.e-mail button:hover img {
transform: rotate(4deg);
}
.e-mail .icon-container {
width: 48px;
background-color: #C92A4A;
border-radius: 0 2px 2px 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
}
.social-media ul {
padding-top: 40px;
font-size: 1.875rem;
display: flex;
column-gap: 20px;
}
.social-media li {
display: inline;
margin-right: 10px;
}
.footer-bottom .subcontainer {
padding: 4px 45px 16px 45px;
}
.footer-bottom ul {
font-size: 0.875rem;
padding: unset;
display: flex;
justify-content: flex-end;
column-gap: 30px;
}
.footer-bottom ul li:first-child,
.footer-bottom ul li.copyright-automatic {
margin-right: auto;
margin-left: unset;
}
.footer-bottom ul li.copyright-automatic a {
display: none;
}
.footer-bottom li {
display: inline;
}
/* FOOTER end */
/* 404 start */
.error-logo {
display: block;
width: max-content;
margin: 32px 45px;
}
.error-logo img {
width: 120px;
}
.error-content {
display: flex;
column-gap: 73px;
margin-top: unset;
margin-left: unset;
padding-top: 182px;
padding-left: 110px;
}
.error-content > img {
margin-top: 78px;
}
h1 {
font-size: 3rem;
margin-bottom: 25px;
}
.error-content p {
line-height: 24px;
margin-bottom: 44px;
font-weight: 600;
}
.error-404 .divider p,
.error-404 .divider div {
background-color: var(--newviva-background-black);
}
.meadow {
width: 100%;
height: 66px;
background-image: url('assets/images/rasen-graeser.svg');
background-repeat: repeat-x;
transform: translateY(-66px);
position: relative;
margin-bottom: 150px;
}
.green {
width: 100%;
height: 500px;
background-color: #C8EB24;
transform: unset;
z-index: 1;
position: absolute;
top: 60px;
}
.error-404 .divider {
z-index: 100;
position: relative;
}
/* 404 end */
/* RESPONSIVENESS start */
/* container */
@media screen and (max-width: 576px) {
.container {
max-width: calc(100vw - 60px) !important;
}
.editor-styles-wrapper .container,
.editor-styles-wrapper .container > div {
max-width: 100%;
}
}
@media screen and (min-width: 576px) {
.container {
max-width: 540px;
}
.editor-styles-wrapper .container,
.editor-styles-wrapper .container > div {
max-width: 100%;
}
}
@media screen and (min-width: 768px) {
.container {
max-width: 720px;
}
.editor-styles-wrapper .container,
.editor-styles-wrapper .container > div {
max-width: 100%;
}
}
@media screen and (min-width: 992px) {
.container {
max-width: 960px;
}
.editor-styles-wrapper .container,
.editor-styles-wrapper .container > div {
max-width: 100%;
}
}
@media screen and (min-width: 1200px) {
.container {
max-width: 1140px;
}
.editor-styles-wrapper .container,
.editor-styles-wrapper .container > div {
max-width: 100%;
}
}
@media screen and (min-width: 1400px) {
.container {
max-width: 1320px;
}
.editor-styles-wrapper .container,
.editor-styles-wrapper .container > div {
max-width: 100%;
}
}
/*** only if necessary and included in the budget | nur falls nötig und im Budget ***/
/*
@media screen and (min-width: 1600px) {
.container {
max-width: 1500px;
}
}
@media screen and (min-width: 1800px) {
.container {
max-width: 1680px;
}
}
@media screen and (min-width: 2000px) {
.container {
max-width: 1860px;
}
}
*/
/* tablet */
@media screen and (max-width: 992px) {
/* GLOBAL start */
/* title */
[data-h2],
.h2-red,
.h2-green {
font-size: 2.375rem;
}
/* TITLE & TEXT start */
h1:not(.hero h1):not(h1.components-truncate):not(h1.media-frame-menu-heading):not(h1.media-attachments-filter-heading):not(h1.block-editor-block-card__title):not(.media-frame-title h1):not(.filebird-app-wrapper h1):not(.attachment-details h1):not(.our-team h1):not(.help-and-faq h1):not(.emergency h1):not(h1.block-editor-inserter__panel-title):not(h1.interface-complementary-area-header__title):not(h1.notice-yoast__header-heading):not(h1.components-modal__header-heading):not(.components-modal__content h1),
h2:not(h2.components-truncate):not(h2.media-frame-menu-heading):not(h2.media-attachments-filter-heading):not(h2.block-editor-block-card__title):not(.media-frame-title h2):not(.filebird-app-wrapper h2):not(.attachment-details h2):not(.our-team h2):not(.help-and-faq h2):not(.emergency h2):not(h2.block-editor-inserter__panel-title):not(h2.interface-complementary-area-header__title):not(h2.notice-yoast__header-heading):not(h2.components-modal__header-heading):not(.components-modal__content h2) {
font-size: 2.375rem;
}
/* TITLE & TEXT end */
.first-element {
padding-top: 150px !important;
}
body .divider p,
body .divider div {
height: calc(100vw * tan(4deg) + 1.0%);
}
/* GLOBAL end */
/* HEADER / NAVIGATION start */
section.header .subcontainer {
/* height: 154px; */
height: 200px;
}
section.header .main-nav {
justify-content: space-between;
margin: 0 30px;
}
.main-navigation img {
width: 90px;
}
.main-navigation ul {
/* column-gap: 24px;
padding: 10px 30px 0 30px; */
display: none;
}
.main-navigation ul li:first-child a {
margin: 0;
}
.main-navigation ul li:not(:first-child) {
transform: translateY(-21px);
}
.main-navigation ul li a {
font-size: 0.938rem;
}
section.header .white-rectangle {
height: 174px;
width: 102vw;
}
.main-navigation ul li:not(:first-child):not(li:has(a[data-button-primary="green"])):not(li:has(div.burger-menu)) {
display: none;
}
.main-navigation ul li {
display: none;
}
.main-navigation ul li:has(a[data-button-primary="green"]) {
margin-left: auto;
}
.burger-menu {
display: flex;
transform: translateY(-11px);
}
.mini-navigation {
display: none;
}
/* HEADER / NAVIGATION end */
/* HERO ELEMENT start */
.hero-content > div {
max-width: 720px;
bottom: calc(0% + 0.5%);
}
.hero .divider::after {
height: calc(95vw * tan(4deg));
}
.hero .headlines {
max-width: 229px;
transform: translateY(-83px);
}
.hero .headline {
font-size: 1.188rem;
line-height: 1.4;
}
.hero h1 {
font-size: 3.188rem;
line-height: 52px;
max-width: 400px;
}
.hero-content img {
transform: translate(277px, -232px);
}
.hero-content p.hero-arrow {
transform: translate(285px, -257px) rotate(-36deg);
}
.hero-content a {
transform: translate(307px, -279px);
}
.white-hero-rectangle {
transform: translateY(-38px) rotate(-4deg);
}
.hero-content .primary-button-container {
transform: translate(314px, -252px);
}
.hero .image-container .divider p,
.hero .image-container .divider div {
height: calc(100vw * tan(4deg) + 1%);
}
/* HERO ELEMENT end */
/* DIVIDER start */
.divider {
height: calc(100vw * tan(4deg));
}
/* DIVIDER end */
/* WORKS start */
.works {
transform: unset;
margin-top: 0;
}
.works [data-button-tertiary] .button-title,
.works .data-button-tertiary .button-title {
font-size: 1.313rem;
}
.works [data-button-tertiary] .button-banner img,
.works [data-button-tertiary] .button-banner .agriviva-arrow-right-large,
.works .data-button-tertiary .button-banner img,
.works .data-button-tertiary .button-banner p:has(>.agriviva-arrow-right-large) {
width: 24px;
height: 24px;
}
.works [data-button-tertiary] .button-banner > div,
.works .data-button-tertiary .button-banner > div {
column-gap: 5px;
}
.works h1,
.works h2,
.works h3,
.works h4,
.works h5 {
max-width: 650px;
}
.works .divider p,
.works .divider div {
height: calc(100vw * tan(4deg) + 0.7%);
}
/* WORKS end */
/* TESTIMONIAL SPOTLIGHT start */
.testimonials .testimonial {
padding: 58px;
margin: 60px 32px 0 32px;
}
.testimonials .testimonial > div {
flex-direction: column-reverse;
column-gap: 48px;
}
.testimonials .headline {
margin-top: 0;
font-size: 1.5rem;
line-height: 1.3;
}
.testimonial-container {
max-width: 100%;
margin-top: 264px;
}
.testimonials .image-container {
height: 366px;
transform: translateY(-130px);
position: absolute;
}
.testimonials .testimonial .person {
display: flex;
justify-content: center;
}
.testimonials .testimonial .arrow {
display: none;
}
.attribution {
margin-bottom: 40px;
}
p.testimonial-button a {
width: 100%;
display: flex;
justify-content: center;
}
/* TESTIMONIAL SPOTLIGHT end */
/* REQUIREMENTS start */
.requirements .subcontainer {
flex-direction: column;
}
.requirements .arrow {
display: none;
}
.requirements .text-container h1,
.requirements .text-container h2,
.requirements .text-container h3,
.requirements .text-container h4,
.requirements .text-container h5 {
font-size: 2.375rem;
}
.requirements .text-container > p {
font-size: 1.313rem;
margin-bottom: 0;
}
.requirements .text-container > p:first-of-type {
font-size: 1.313rem;
margin-bottom: 0;
}
.requirements .text-container > p:last-of-type {
font-size: 1.313rem;
margin-bottom: 32px;
}
.requirements .text-bubbles h2,
.requirements .text-bubbles h3,
.requirements .text-bubbles h4,
.requirements .text-bubbles h5 {
font-size: 1.313rem;
}
.requirements .divider p,
.requirements .divider div {
height: calc(100vw * tan(4deg) + 1.3%);
}
/* REQUIREMENTS end */
/* INSTRUCTIONS start */
.instructions .subcontainer {
margin-bottom: 40px;
}
.instructions h1,
.instructions h2,
.instructions h3,
.instructions h4,
.instructions h5 {
font-size: 2.375rem;
}
.instructions .steps > div {
flex-direction: column;
row-gap: 44px;
}
.instructions .step .arrow-1,
.instructions .step .arrow-2,
.instructions .step .arrow-3 {
display: none;
}
.instructions .step {
width: 100%;
}
.instructions .second-step,
.instructions .third-step,
.instructions .fourth-step {
transform: unset;
}
.instructions .button-container {
padding-top: 60px;
}
/* INSTRUCTIONS end */
/* SPOTLIGHTS start */
.spotlights {
padding: 80px 0 0 0;
}
.spotlights h1,
.spotlights h2,
.spotlights h3,
.spotlights h4,
.spotlights h5 {
font-size: 2.375rem;
margin-bottom: 66px;
}
.spotlights-container .spotlight-card {
display: none;
}
.spotlights-container .spotlight-card:first-of-type {
display: block;
}
.spotlights .carousel-assets-mobile {
display: block;
}
.spotlights-container > div {
justify-content: center;
}
.spotlights-container .data-button-tertiary > div {
height: 450px;
width: 435px;
}
.spotlights .carousel-assets-mobile > div {
margin-top: 56px;
}
.spotlights .button-container {
padding-top: 38px;
}
.spotlights .divider p,
.spotlights .divider div {
height: calc(100vw * tan(4deg) + 0.8%);
}
/* SPOTLIGHTS end */
/* CTA AND ABOUT AGRIVIVA start */
.cta-and-about-agriviva.big-image .call-to-action {
padding: 40px 50px;
}
.cta-and-about-agriviva .fluid-image {
height: 600px;
}
.cta-and-about-agriviva.big-image .divider p,
.cta-and-about-agriviva.big-image .divider div {
height: calc(100vw * tan(4deg) + 1.4%);
}
.cta-and-about-agriviva.big-image .call-to-action h1,
.cta-and-about-agriviva.big-image .call-to-action h2,
.cta-and-about-agriviva.big-image .call-to-action h3,
.cta-and-about-agriviva.big-image .call-to-action h4,
.cta-and-about-agriviva.big-image .call-to-action h5 {
font-size: 2.375rem;
line-height: 1.1;
}
.cta-and-about-agriviva.big-image .call-to-action .headline {
line-height: 1.4;
font-size: 1.313rem;
font-weight: 600;
}
/* CTA AND ABOUT AGRIVIVA end */
/* CTA LOGO start */
.cta-logo .about-agriviva > div {
flex-direction: column;
}
.cta-logo .logo-container figure:not(.arrow) {
display: flex;
justify-content: center;
margin-bottom: 80px;
}
.cta-logo .logo-container figure:not(.arrow) img {
width: 300px;
line-height: 1.1;
}
.cta-logo h1,
.cta-logo h2,
.cta-logo h3,
.cta-logo h4,
.cta-logo h5,
.cta-logo h6 {
font-size: 2.375rem;
}
.about-agriviva .headline {
font-size: 1.313rem;
}
.about-agriviva .arrow {
right: unset;
left: 0;
top: unset;
bottom: 0;
transform: translate(80px, 69px);
}
/* CTA LOGO start */
.cta-logo.no-space-top .subcontainer {
padding-top: 40px;
}
/* CTA LOGO end */
/* INSTAGRAM start */
.instagram h1,
.instagram h2,
.instagram h3,
.instagram h4,
.instagram h5 {
font-size: 2.375rem;
line-height: 1.2;
}
.instagram .agriviva-hash img {
width: 276px;
}
.instagram [data-centered],
.instagram .data-centered {
margin-top: 80px;
}
.instagram .up-arrow {
display: none;
}
.instagram .subcontainer {
margin-bottom: 80px;
}
.instagram .divider p,
.instagram .divider div {
height: calc(100vw * tan(4deg) + 1.0%);
}
/* INSTAGRAM end */
/* LOGO-CAROUSEL start */
.logo-carousel .subcontainer {
height: 376px;
}
.logos figure {
margin: 0 35px;
}
.logo-carousel .divider p,
.logo-carousel .divider div {
height: calc(100vw * tan(4deg) + 1%);
}
/* LOGO-CAROUSEL end */
/* HEADLINE start */
.page-headline .subcontainer {
padding: 64px 0 20px 0;
}
.page-headline h1,
.page-headline h2,
.page-headline h3,
.page-headline h4,
.page-headline h5 {
margin-bottom: 12px;
}
.page-headline:not(.contact-page .page-headline) p {
max-width: unset;
margin: 0 0 30px;
}
/* HEADLINE end */
/* ALL TESTIMONIAL start */
.all-testimonials .subcontainer > div {
grid-template-columns: unset;
}
.all-testimonials .bg-beige {
padding: 12px 0 60px;
}
.all-testimonials .testimonial {
margin-top: 148px;
}
.all-testimonials .testimonial .image-container {
width: 210px;
height: 235px;
transform: translateY(-96px);
}
/* ALL TESTIMONIALS end */
/* ADDITIONAL TESTIMONIALS start */
.additional-testimonials .title-container h1,
.additional-testimonials .title-container h2,
.additional-testimonials .title-container h3,
.additional-testimonials .title-container h4,
.additional-testimonials .title-container h5 {
margin-top: 20px;
}
/* ADDITIONAL TESTIMONIALS end */
.additional-testimonials .bg-beige {
padding: 40px 0 76px;
}
.additional-testimonials .subcontainer > div {
row-gap: 10px;
}
/* TESTIMONIAL INTRO start */
.testimonial-detail .subcontainer {
padding: 50px 0 24px;
}
.testimonial-detail.first-element {
padding-top: 160px !important;
}
.testimonial-detail p {
max-width: unset;
}
.testimonial-detail .person {
width: 320px;
height: 352px;
transform: translateY(125px);
}
.testimonial-detail .image-container {
position: relative;
top: unset;
width: unset;
margin-top: -80px;
z-index: 2;
}
.testimonial-detail .image-container > div {
display: flex;
justify-content: center;
}
.testimonial-detail .subcontainer .divider {
display: none;
}
.testimonial-detail h1,
.testimonial-detail h2,
.testimonial-detail h3,
.testimonial-detail h4,
.testimonial-detail h5 {
margin-bottom: 10px;
}
/* TESTIMONIAL INTRO end */
/* TEXT-WALL start */
.text-wall .subcontainer {
padding: 60px 0 40px 0;
}
.text-wall .subcontainer {
margin: 0 0;
}
/* TEXT-WALL end */
/* ABOUT US start */
.about-us .subcontainer > div {
padding: 80px 0 84px;
}
.about-us .link-card {
max-width: 335px;
height: 320px;
}
/* ABOUT US end */
/* PAGE END CTA start */
.page-end-cta .subcontainer > div {
padding: 80px 0 60px 0;
flex-direction: column;
}
.page-end-cta h1,
.page-end-cta h2,
.page-end-cta h3,
.page-end-cta h4,
.page-end-cta h5 {
margin-bottom: 16px;
}
.page-end-cta h1 br,
.page-end-cta h2 br,
.page-end-cta h3 br,
.page-end-cta h4 br,
.page-end-cta h5 br {
display: none;
}
.page-end-cta .title-container figure {
display: none;
}
.page-end-cta .headline {
font-size: 1.313rem;
}
.page-end-cta .button-container {
margin-top: 32px;
}
/* PAGE END CTA end */
/* OUR TEAM start */
.our-team .subcontainer {
padding: 80px 0 80px;
}
.our-team h1,
.our-team h2,
.our-team h3,
.our-team h4,
.our-team h5 {
margin: 60px 0 58px;
}
.our-team .personen-container > div {
flex-direction: row;
gap: unset;
row-gap: 20px;
}
.our-team .contacts > div {
grid-template-columns: 1fr 1fr;
}
.our-team .card-back figure:not(figure.data-button-primary) {
width: 137px;
}
.our-team .link-container:last-of-type {
margin-bottom: 0;
}
.card-front,
.card-back {
min-height: unset;
}
.card-front {
padding: 24px 24px 30px 24px;
}
.card-back {
padding: 24px 24px 30px 24px;
}
/* OUR TEAM end */
/* HELP AND FAQ start */
.help-and-faq .subcontainer {
padding: 80px 0 80px;
}
.help-and-faq .content h1,
.help-and-faq .content h2,
.help-and-faq .content h3,
.help-and-faq .content h4,
.help-and-faq .content h5,
.help-and-faq .content h6 {
margin: 60px 0 40px;
}
.accordion {
width: 100%;
}
/* HELP AND FAQ end */
/* CONTACT start */
.emergency {
position: unset;
transform: unset;
margin: 0 auto 50px auto;
}
.emergency h2,
.emergency h3,
.emergency h4,
.emergency h5,
.emergency h6 {
margin: 24px 0 24px 0;
}
/* CONTACT end */
/* FOOTER start */
.footer-top .subcontainer {
padding: 40px 30px 50px 30px;
}
.footer-bottom .subcontainer {
padding: 4px 20px 16px 20px;
}
.footer-top .subcontainer .contact.item {
/*margin-right: 10px;*/ /* Applies only to .contact.item */
margin-left: 0;
}
.footer-top .subcontainer .quick-access.item {
margin-left: 0;
margin-right: 50px;
}
.footer-top .subcontainer > a {
margin: unset;
display: flex;
align-items: center;
justify-content: center;
}
.footer-top .subcontainer > a img {
width: 130px;
}
.footer-title {
font-size: 1rem;
}
.footer ul {
font-size: 0.938rem;
}
.e-mail input {
font-size: 0.938rem;
width: 160px;
height: 35px;
}
.e-mail button {
height: 35px;
}
/* FOOTER end */
/* ERROR-PAGE start */
.error-logo {
margin: 32px 35px;
}
.error-logo img {
width: 100px;
}
.error-404 h1 {
margin-bottom: 10px;
}
.error-content {
padding-left: 35px;
padding-right: 35px;
}
.error-content > img {
width: 405px;
}
.meadow {
height: 66px;
transform: translateY(-66px);
margin-bottom: 75px;
}
.green {
bottom: 0;
transform: unset;
height: 305px;
}
.error-content div:has(h1) {
transform: translateY(-30px);
}
/* ERROR PAGE end */
}
/* smartphone */
@media screen and (max-width: 768px) {
/* HEADER / NAVIGATOPN start */
.header .dropdown ul {
margin-top: 190px;
padding: 0 30px;
}
/* HEADER / NAVIGATION end */
/* HERO ELEMENT start */
.hero-content > div {
max-width: 540px;
bottom: calc(0% + 1%);
}
.hero .divider::after {
height: calc(93vw * tan(4deg));
}
.hero-content a {
transform: translate(56px, -311px);
}
.hero-content img {
transform: translate(185px, -312px) rotate(-78deg);
height: 121px;
}
.hero-content p.hero-arrow {
transform: translate(209px, -330px) rotate(-116deg);
}
.hero-content p.hero-arrow span {
font-size: 4.813rem;
}
.hero-content .primary-button-container {
transform: translate(71px, -266px);
}
.hero .headlines {
display: none;
}
.hero .headline-mobile {
position: relative;
display: flex;
justify-content: center;
width: 100%;
display: none;
}
.hero .headline-mobile p {
margin: 0;
max-width: 540px;
font-size: 1.313rem;
font-weight: 600;
margin-top: 26px;
line-height: 1.4;
}
.white-hero-rectangle {
transform: translateY(-34px) rotate(-4deg);
}
/* HERO ELEMENT end */
/* WORKS start */
.works .works-container [data-button-tertiary] {
/* height: 270px; */
height: unset;
}
.works [data-button-tertiary] .button-banner > div {
height: 68px;
transform: translate(0, -68px);
}
.works [data-button-tertiary] .button-title {
font-size: 1.188rem;
}
.works .button-banner > div {
width: 76.5%;
}
.works-container {
gap: 34px;
}
.works [data-h2] {
margin: 0px 90px 60px;
font-size: 2rem;
}
/* WORKS end */
/* TESTIMONIAL SPOTLIGHT start */
.testimonials .testimonial {
padding-bottom: 32px;
}
/* TESTIMONIAL SPOTLIGHT end */
/* INSTRUCTIONS start */
.instructions .steps > div {
padding: 0 36px 0;
}
/* INSTRUCTIONS end */
/* CTA LOGO start */
.about-agriviva .arrow {
transform: translate(28px, 65px);
}
.cta-logo .divider p,
.cta-logo .divider div {
height: calc(100vw * tan(4deg) + 1.0%);
}
/* CTA LOGO end */
/* LOGO-CAROUSEL start */
.logo-carousel .subcontainer {
height: 310px;
}
.logos figure {
margin: 0 18px;
width: 179px;
height: 72px;
}
/* LOGO-CAROUSEL end */
/* TESTIMONIAL INTRO start */
.testimonial-detail {
margin-bottom: 20px;
}
/* TESTIMONIAL INTRO end */
/* PAGE HEADLINE start */
.page-headline .subcontainer {
padding: 58px 0 20px 0;
}
/* PAGE HEADLINE end */
/* ABOUT US start */
.about-us .subcontainer > div {
padding: 72px 0 66px;
row-gap: 54px;
column-gap: 40px;
}
.about-us .link-card {
max-width: 250px;
height: 226px;
}
.about-us .button-title {
font-size: 1.125rem;
}
.about-us .button-banner > div {
height: 76px;
transform: translate(-15px, -76px);
}
/* ABOUT US end */
/* PAGE END CTA start */
.page-end-cta .subcontainer > div {
padding: 60px 0 60px 0;
}
/* PAGE END CTA end */
/* OUR TEAM start */
.our-team .subcontainer {
padding: 76px 0 76px;
}
.our-team h1,
.our-team h2,
.our-team h3,
.our-team h4,
.our-team h5 {
font-size: 1.75rem;
}
.our-team .contacts > div {
grid-template-columns: 1fr;
}
.our-team .personen-container > div {
justify-content: unset;
column-gap: 24px;
}
/* OUR TEAM end */
/* HELP AND FAQ start */
.help-and-faq .subcontainer {
padding: 76px 0 76px;
}
.help-and-faq .content h1,
.help-and-faq .content h2,
.help-and-faq .content h3,
.help-and-faq .content h4,
.help-and-faq .content h5,
.help-and-faq .content h6 {
font-size: 1.75rem;
margin: 60px 0 34px;
}
/* HELP AND FAQ end */
/* CONTACT start */
.emergency {
background: transparent;
width: unset;
height: unset;
max-width: 540px;
margin: 0 auto 30px auto;
}
.emergency-content {
transform: unset;
}
.emergency-content div figure.info-circle {
margin-top: 10px;
}
.info-circle {
text-align: left;
border-top: 1px solid var(--newviva-border-black);
padding-top: 26px;
}
.emergency h2,
.emergency h3,
.emergency h4,
.emergency h5,
.emergency h6 {
margin: 0 0 24px 0;
text-align: left;
}
.emergency .link-container {
justify-content: start;
}
.emergency p {
text-align: start;
margin: 11px 0 11px 0;
}
.info-circle img {
display: none;
}
/* CONTACT end */
/* FOOTER start */
.footer-top .subcontainer {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 10px;
padding: 55px 30px 50px 30px;
}
.footer-top .subcontainer > a {
justify-content: start;
width: fit-content;
width: -moz-fit-content;
margin-bottom: 15px;
}
.e-mail input {
width: 35%;
}
.item:nth-child(1),
.item:nth-child(4) {
grid-column: 1 / 3;
}
.item:nth-child(2),
.item:nth-child(3) {
grid-column: span 1;
}
.footer-bottom .subcontainer {
padding: 4px 30px 16px 30px;
}
/* FOOTER end */
/* ERROR-PAGE start */
.error-logo {
margin: 32px 30px;
}
.error-404 h1 {
margin-bottom: 10px;
}
.error-content {
flex-direction: column-reverse;
column-gap: 50px;
padding-left: 30px;
padding-right: 30px;
}
.error-content p {
margin-bottom: 32px;
}
.error-content > img {
width: 405px;
margin-top: 30px;
}
.meadow {
height: 66px;
transform: translateY(-66px);
margin-bottom: 60px;
}
.green {
bottom: 0;
transform: unset;
height: 305px;
}
.error-content div:has(h1) {
transform: translateY(-30px);
}
/* ERROR PAGE end */
}
@media screen and (max-width: 576px) {
/* TITLE & TEXT start */
h1:not(.hero h1):not(h1.components-truncate):not(h1.media-frame-menu-heading):not(h1.media-attachments-filter-heading):not(h1.block-editor-block-card__title):not(.media-frame-title h1):not(.filebird-app-wrapper h1):not(.attachment-details h1):not(.our-team h1):not(.help-and-faq h1):not(.emergency h1):not(h1.block-editor-inserter__panel-title):not(h1.interface-complementary-area-header__title):not(h1.notice-yoast__header-heading):not(h1.components-modal__header-heading):not(.components-modal__content h1),
h2:not(h2.components-truncate):not(h2.media-frame-menu-heading):not(h2.media-attachments-filter-heading):not(h2.block-editor-block-card__title):not(.media-frame-title h2):not(.filebird-app-wrapper h2):not(.attachment-details h2):not(.our-team h2):not(.help-and-faq h2):not(.emergency h2):not(h2.block-editor-inserter__panel-title):not(h2.interface-complementary-area-header__title):not(h2.notice-yoast__header-heading):not(h2.components-modal__header-heading):not(.components-modal__content h2) {
font-size: 2rem;
}
/* TITLE & TEXT end */
.first-element {
padding-top: 108px !important;
}
body .divider p,
body .divider div {
height: calc(100vw * tan(4deg) + 5.0%);
}
/* HEADER / NAVIGATION start */
section.header .subcontainer {
height: 136px;
}
.main-navigation img {
width: 70px;
}
.main-navigation ul {
padding: 3px 30px 0 30px;
}
section.header .white-rectangle {
height: 155px;
}
.main-navigation ul li:not(:first-child) {
transform: translateY(-14px);
}
section.header .dropdown nav {
margin: unset;
}
section.header .dropdown ul {
padding: 160px 30px 50px 30px;
}
section.header .white-rectangle {
transform: translate(-2vw, -71px) rotate(-4deg);
}
/* NAVIGATION / HEADER end */
/* HERO ELEMENT start */
.hero .divider {
height: calc(100vw * tan(4deg));
}
.white-hero-rectangle {
transform: translateY(-25px) rotate(-4deg) !important;
}
.hero-content > div {
max-width: unset;
margin: 0 30px;
bottom: calc(0% + 0.5%);
}
.hero .headline-mobile p {
max-width: unset;
margin: 26px 30px 0 30px;
display: none;
}
.hero h1 {
font-size: 2.563rem;
line-height: 45px;
}
.white-hero-rectangle {
transform: translateY(-18px) rotate(-4deg);
}
.hero-content a {
transform: translate(72px, -270px);
}
.hero-content .primary-button-container {
transform: translate(57px, -228px);
}
.hero-content p.hero-arrow {
transform: translate(186px, -275px) rotate(-101deg);
}
.hero-content p.hero-arrow span {
font-size: 4.063rem;
}
.hero-content img {
transform: translate(177px, -259px) rotate(-59deg);
}
.hero .image-container .divider p,
.hero .image-container .divider div {
height: calc(100vw * tan(4deg) + 2%);
}
/* HERO ELEMENT end */
/* WORKS start */
.works {
transform: unset;
margin-top: 0;
padding-top: 50px;
}
.works .works-container [data-button-tertiary] {
height: unset;
}
.works [data-button-tertiary] .button-banner > div {
height: 68px;
transform: translate(0, -68px);
}
.works [data-button-tertiary] .button-title {
font-size: 1.188rem;
}
.works .button-banner > div {
width: calc(100vw - 119px);
}
.works-container {
gap: 34px;
}
.works .title-container {
margin-bottom: 40px;
}
.works [data-h2] {
margin: 0px 40px 50px;
font-size: 2rem;
}
.works h1,
.works h2,
.works h3,
.works h4,
.works h5 {
line-height: 1.1;
max-width: 450px;
font-size: 2rem;
}
.works .divider p,
.works .divider div {
height: calc(100vw * tan(4deg) + 4.8%);
}
.works-container > div {
display: flex;
flex-direction: row;
gap: 0;
}
.works-container > div .data-button-tertiary:first-of-type {
display: block;
}
.works-container > div .data-button-tertiary {
display: none;
width: 100%;
}
.works .carousel-assets-mobile {
display: block;
}
/* WORKS end */
/* DIVIDER start */
.divider {
height: calc(104vw * tan(4deg));
}
/* TESTIMONIAL SPOTLIGHT start */
.testimonials .slides-container {
position: relative;;
}
.testimonials .testimonial {
padding: 30px;
margin: 60px 0 0;
}
.testimonial-container {
margin-top: 188px;
}
.slides-container .left-arrow {
position: absolute;
bottom: 0;
left: 0;
z-index: 10;
width: 32px;
height: 32px;
transform: translate(calc(100% + 30px), 69px);
}
.slides-container .right-arrow {
position: absolute;
bottom: 0;
right: 0;
z-index: 10;
width: 32px;
height: 32px;
transform: translate(calc(-100% - 30px), 69px);
}
.testimonials .attribution p {
line-height: 1.5;
}
.testimonials .testimonial-button {
margin: 0;
}
p.testimonial-button a {
width: auto;
}
.testimonials .image-container {
height: 286px;
}
.testimonials .button-container {
display: none;
}
.testimonials .divider p,
.testimonials .divider div {
height: calc(100vw * tan(4deg) + 5.2%);
}
.testimonials .paginations {
margin-bottom: 50px;
}
/* TESTIMONIAL SPOTLIGHT end */
/* REQUIREMENTS start */
.requirements .subcontainer {
flex-direction: column;
}
.requirements .arrow {
display: none;
}
.requirements .text-container h1,
.requirements .text-container h2,
.requirements .text-container h3,
.requirements .text-container h4,
.requirements .text-container h5 {
font-size: 2rem;
}
.requirements .text-container > p {
font-size: 1.5rem;
margin-bottom: 52px;
}
.requirements .text-bubbles h2,
.requirements .text-bubbles h3,
.requirements .text-bubbles h4,
.requirements .text-bubbles h5 {
font-size: 1.5rem;
}
.requirements .divider p,
.requirements .divider div {
height: calc(100vw * tan(4deg) + 5.3%);
}
.requirements .text-bubbles > div > .is-vertical {
row-gap: 16px;
}
/* REQUIREMENTS end */
/* INSTRUCTIONS start */
.instructions .subcontainer > div {
display: grid;
justify-items: center;
}
.instructions .steps > div {
padding: 0 0 0;
}
.instructions .divider p,
.instructions .divider div {
height: calc(100vw * tan(4deg) + 5.5%);
}
.instructions h1,
.instructions h2,
.instructions h3,
.instructions h4,
.instructions h5 {
font-size: 2rem;
max-width: 340px;
margin-bottom: 52px;
}
.instructions .button-container {
padding-top: 44px;
}
/* INSTRUCTIONS end */
/* SPOTLIGHTS start */
.spotlights .subcontainer {
padding-bottom: 40px;
}
.spotlights h1,
.spotlights h2,
.spotlights h3,
.spotlights h4,
.spotlights h5 {
font-size: 2rem;
margin-bottom: 44px;
max-width: 380px;
}
.spotlights-container .data-button-tertiary > div {
width: 100%;
height: unset;
max-height: unset;
aspect-ratio: 1 / 1.1;
}
.spotlights .divider p, .spotlights .divider div {
height: calc(100vw * tan(4deg) + 5.2%);
}
.spotlights .button-container {
padding-top: 44px;
}
/* SPOTLIGHTS end */
/* CTA AND ABOUT AGRIVIVA start */
.cta-and-about-agriviva.big-image .call-to-action {
padding: 30px;
}
.cta-and-about-agriviva.big-image .call-to-action h1,
.cta-and-about-agriviva.big-image .call-to-action h2,
.cta-and-about-agriviva.big-image .call-to-action h3,
.cta-and-about-agriviva.big-image .call-to-action h4,
.cta-and-about-agriviva.big-image .call-to-action h5 {
font-size: 2rem;
margin: 0 0 18px;
}
.cta-and-about-agriviva.big-image .call-to-action .headline {
font-size: 1rem;
margin-bottom: 26px;
}
.cta-and-about-agriviva .fluid-image {
height: 550px;
}
.cta-and-about-agriviva.big-image .divider p,
.cta-and-about-agriviva.big-image .divider div {
height: calc(100vw * tan(4deg) + 5%);
}
/* CTA AND ABOUT AGRIVIVA end */
/* CTA LOGO start */
.about-agriviva .arrow {
transform: translate(28px, 65px);
}
.cta-logo .divider p,
.cta-logo .divider div {
height: calc(100vw * tan(4deg) + 5.0%);
}
.cta-logo h1,
.cta-logo h2,
.cta-logo h3,
.cta-logo h4,
.cta-logo h5,
.cta-logo h6 {
font-size: 2rem;
line-height: 1.2;
font-weight: 700;
}
.cta-logo .logo-container figure:not(.arrow) {
margin-bottom: 100px;
}
.about-agriviva .arrow {
transform: translate(5px, 81px);
}
/* CTA LOGO end */
/* INSTAGRAM start */
.instagram h1,
.instagram h2,
.instagram h3,
.instagram h4,
.instagram h5 {
font-size: 2rem;
line-height: 1.1;;
}
.instagram .agriviva-hash img {
width: 236px;
}
.instagram .divider p,
.instagram .divider div {
height: calc(100vw * tan(4deg) + 5.0%);
}
/* INSTAGRAM end */
/* LOGO-CAROUSEL start */
.logo-carousel .subcontainer {
height: 260px;
}
.logos figure {
margin: 0 5px;
width: 162px;
height: 72px;
}
.logo-carousel .divider p,
.logo-carousel .divider div {
height: calc(100vw * tan(4deg) + 5.0%);
}
.logo-carousel .logos > div {
margin: 0 10px;
}
/* LOGO-CAROUSEL end */
/* ADDITIONAL TESTIMONIALS start */
.additional-testimonials .title-container h2 {
margin: 0;
}
.additional-testimonials .bg-beige {
padding: 50px 0 76px;
}
.additional-testimonials .subcontainer > div {
row-gap: 0;
}
/* ADDITIONAL TESTIMONIALS end */
/* TESTIMONIAL INTRO start */
.testimonial-detail {
margin-bottom: 30px;
}
.testimonial-detail.first-element {
padding-top: 120px !important;
}
.testimonial-detail p {
font-size: 1.625rem;
}
/* TESTIMONIAL INTRO end */
/* TEXT-WALL start */
.text-wall .image-container {
margin: 36px 0;
}
.text-wall figure {
max-height: unset;
height: 345px;
}
/* TEXT-WALL end */
/* PAGE HEADLINE start */
.page-headline:not(.contact-page .page-headline) p {
margin: 0 0 20px;
}
/* PAGE HEADLINE end */
/* ABOUT US start */
.about-us .subcontainer > div {
display: flex;
flex-direction: column;
justify-content: center;
padding: 60px 0 66px;
}
.about-us .link-card {
max-width: unset;
height: unset;
aspect-ratio: 1 / 0.1;
max-height: 324px;
}
/* ABOUT US end */
/* OUR TEAM start */
.our-team .subcontainer {
padding: 64px 0 64px;
}
.our-team h1,
.our-team h2,
.our-team h3,
.our-team h4,
.our-team h5 {
font-size: 1.625rem;
margin: 36px 0 36px;
}
.our-team .card-front h2,
.our-team .card-front h3,
.our-team .card-front h4,
.our-team .card-front h5,
.our-team .card-front h6 {
font-size: 1.313rem;
}
.our-team .contacts > div {
grid-template-columns: 1fr;
}
.our-team .personen-container > div {
justify-content: unset;
column-gap: 24px;
}
/* OUR TEAM end */
/* HELP AND FAQ start */
.help-and-faq .subcontainer {
padding: 64px 0 64px;
}
.help-and-faq .menu {
column-gap: 20px;
}
.help-and-faq .content h1,
.help-and-faq .content h2,
.help-and-faq .content h3,
.help-and-faq .content h4,
.help-and-faq .content h5,
.help-and-faq .content h6 {
font-size: 1.625rem;
margin: 48px 0 32px;
text-align: left;
}
.accordion {
padding: 17px 28px;
}
.accordion-button > div {
column-gap: 10px;
}
/* HELP AND FAQ end */
/* CONTACT start */
.emergency {
max-width: calc(100vw - 60px) !important;
margin: 0 auto 30px auto;
}
.contact-page .page-headline p {
max-width: unset;
}
/* CONTACT end */
/* FOOTER start */
.footer-top .subcontainer {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 30px;
padding: 55px 30px 50px 30px;
}
.e-mail input {
width: 100%;
}
.item:nth-child(1),
.item:nth-child(4) {
grid-column: 1 / 3;
}
.item:nth-child(2),
.item:nth-child(3) {
grid-column: span 1;
}
.footer-bottom ul {
flex-direction: column-reverse;
row-gap: 6px;
}
.footer-bottom ul li:first-of-type {
margin-top: 22px;
}
/* FOOTER end */
/* ERROR PAGE start */
.error-logo img {
width: 80px;
}
.green {
transform: unset;
}
.error-content > img {
width: 304px;
}
/* ERROR PAGE end */
}
@media screen and (max-width: 375px) {
/* GLOBAL start */
.first-element {
padding-top: 96px !important;
}
/* GLOBAL end */
/* NAVIGATION / HEADER start */
section.header .subcontainer {
height: 128px;
}
.main-navigation {
padding-top: 0.75em;
}
.main-navigation img {
width: 70px;
}
.main-navigation ul li:not(:first-child) {
transform: translateY(-6px);
}
.main-navigation li a[data-button-primary="green"] {
display: none;
}
section.header .dropdown ul {
font-size: 1.625rem;
}
.header .dropdown ul li:has([data-button-primary="green"]) {
display: block;
color: var(--newviva-font-black);
}
.header .dropdown ul a[data-button-primary="green"] {
width: -moz-fit-content;
width: fit-content;
}
.header .dropdown ul {
margin-top: 150px;
padding: 0 30px;
}
.burger-menu {
transform: translateY(-2px);
}
/* NAVIGATION / HEADER end */
/* HERO ELEMENT start */
.hero .divider {
height: calc(100vw * tan(4deg));
}
.hero-content > div {
bottom: 0%;
}
.hero h1 {
font-size: 2.125rem;
line-height: 41px;
max-width: 250px;
}
.hero-content img {
transform: translate(135px, -258px) rotate(-59deg);
}
.hero-content .primary-button-container {
transform: translate(16px, -220px);
}
.hero-content p.hero-arrow {
transform: translate(147px, -269px) rotate(-102deg);
}
.hero-content a {
transform: translate(28px, -270px);
}
.hero .image-container .divider p,
.hero .image-container .divider div {
height: calc(100vw * tan(4deg) + 2%);
}
/* HERO ELEMENT end */
/* WORKS start */
.works [data-h2] {
margin: 0px 0 40px;
font-size: 1.875rem;
}
.works .divider p,
.works .divider div {
height: calc(100vw * tan(4deg) + 6%);
}
.works .carousel-assets-mobile p {
font-size: 1.625rem;
}
.works .carousel-assets-mobile > div {
column-gap: 23px;
}
.works .carousel-assets-mobile .pagination-work > div {
column-gap: 7px;
}
/* WORKS end */
/* TESTIMONIAL SPOTLIGHT start */
.testimonials .headline {
font-size: 1.313rem;
}
.testimonial-button {
margin: 0;
}
.testimonials .testimonial {
padding: 21px;
}
.testimonials .attribution {
margin-bottom: 28px;
}
.testimonials .image-container {
height: 225px;
}
.testimonial-container {
margin-top: 118px;
}
.slides-container .left-arrow {
transform: translate(calc(100% + 5px), 69px);
}
.slides-container .right-arrow {
transform: translate(calc(-100% - 5px), 69px);
}
/* TESTIMONIAL SPOTLIGHT end */
/* SPOTLIGHTS start */
.spotlights .carousel-assets-mobile p {
font-size: 1.625rem;
}
.spotlights .carousel-assets-mobile > div {
column-gap: 23px;
}
.spotlights .carousel-assets-mobile .pagination-spotlight > div {
column-gap: 7px;
}
/* SPOTLIGHTS end
/* SPOTLIGHTS start */
.spotlights-container .data-button-tertiary > div {
aspect-ratio: 1 / 1.05;
}
.spotlights .button-container {
padding-top: 32px;
}
/* SPOTLIGHTS end */
/* CTA AND ABOUT AGRIVIVA start */
.cta-and-about-agriviva.big-image .call-to-action h1,
.cta-and-about-agriviva.big-image .call-to-action h2,
.cta-and-about-agriviva.big-image .call-to-action h3,
.cta-and-about-agriviva.big-image .call-to-action h4,
.cta-and-about-agriviva.big-image .call-to-action h5 {
font-size: 1.5rem;
}
/* CTA AND ABOUT AGRIVIVA end */
/* CTA LOGO start */
.cta-logo .logo-container figure:not(.arrow) img {
width: 245px;
}
.about-agriviva .arrow {
transform: translate(0px, 89px);
}
/* CTA LOGO end */
/* ALL TESTIMONIALS start */
.all-testimonials .testimonial {
padding: 32px;
margin-top: 124px;
}
.all-testimonials .testimonial .image-container {
width: 196px;
height: 208px;
transform: translateY(-76px);
}
/* ALL TESTIMONIALS end */
/* ADDITIONAL TESTIMONIALS start */
.additional-testimonials .bg-beige {
padding: 50px 0 60px;
}
/* ADDITIONAL TESTIMONIALS end */
/* TESTIMONIAL INTRO start */
.testimonial-detail.first-element {
padding-top: 100px !important;
}
.testimonial-detail .person {
width: 320px;
height: 264px;
}
/* TESTIMONIAL INTRO end */
/* TEXT-WALL start */
.text-wall .image-container {
margin: 20px 0;
}
.text-wall figure {
height: 250px;
}
/* TEXT-WALL end */
/* ABOUT US start */
.our-team .subcontainer {
padding: 60px 0 60px;
}
.about-us .link-card {
max-height: 256px;
}
.our-team .card-front h2,
.our-team .card-front h3,
.our-team .card-front h4,
.our-team .card-front h5,
.our-team .card-front h6 {
word-break: break-all;
}
.our-team a {
word-break: break-all;
}
/* ABOUT US end */
/* OUR TEAM start */
.our-team .personen-container > div {
flex-direction: column;
}
/* OUR TEAM end */
/* HELP AND FAQ start */
.help-and-faq .subcontainer {
padding: 60px 0 60px;
}
/* HELP AND FAQ end */
/* CONTACT start */
.emergency {
max-width: calc(100vw - 60px) !important;
margin: 0 auto 40px auto;
}
.contact-page .page-headline p {
max-width: unset;
}
/* CONTACT end */
/* FOOTER start */
.footer-top .subcontainer {
display: grid;
grid-template-columns: 1fr;
grid-gap: 30px;
padding: 55px 30px 50px 30px;
}
.item:nth-child(1),
.item:nth-child(4) {
grid-column: unset;
}
.item:nth-child(2),
.item:nth-child(3) {
grid-column: unset;
}
/* FOOTER end */
/* ERROR PAGE start */
.error-content > img {
width: 260px;
}
.meadow {
margin-bottom: 40px;
}
.green {
transform: unset;
}
/* ERROR PAGE end */
}
/* laptop & desktop */
@media screen and (min-width: 992px) {
}
@media screen and (min-width: 992px) and (max-width: 1200px) {
/* HEADER / NAVIGATION start */
section.header .main-nav {
margin-left: 35px;
}
section.header .main-nav a.logo {
margin-right: 0;
}
.main-navigation img {
width: 90px;
}
.main-navigation ul {
column-gap: 17px;
padding-top: 10px;
}
.main-navigation ul li:first-child a {
margin: 0 0 0 20px;
}
.main-navigation ul li:not(:first-child) {
transform: unset;
}
.main-navigation ul li a {
font-size: 0.938rem;
}
section.header .white-rectangle {
height: 174px;
}
.mini-navigation nav {
margin: 0;
column-gap: 15px;
}
.mini-navigation-container {
padding: 2px 35px 15px 0;
}
.mini-navigation nav > ul {
column-gap: 15px;
margin-right: 0;
font-size: 0.938rem;
}
.mini-navigation > ul.language-menu {
font-size: 0.938rem;
}
.mini-navigation .red-rectangle {
transform: translate(87px, -19px) rotate(-4deg);
}
#language-menu {
right: 13px;
}
/* HEADER / NAVIGATION end */
/* HERO ELEMENT start */
.hero-content > div {
max-width: 960px;
bottom: calc(0% + 0%);
}
.hero .divider::after {
height: calc(97vw * tan(4deg));
}
.hero .headlines {
max-width: 336px;
transform: translateY(-24px);
}
.hero .headline {
font-size: 1.188rem;
line-height: 1.4;
}
.hero h1 {
font-size: 4.188rem;
line-height: 66px;
max-width: 400px;
}
.hero-content img {
transform: translate(376px, -272px);
}
.hero-content p.hero-arrow {
transform: translate(372px, -313px) rotate(-36deg);
}
.hero-content a {
transform: translate(398px, -318px);
}
.white-hero-rectangle {
transform: translateY(-47px) rotate(-4deg);
}
.hero-content .primary-button-container {
transform: translate(404px, -307px);
}
.hero .image-container .divider p,
.hero .image-container .divider div {
height: calc(100vw * tan(4deg) + 0.5%);
}
/* HERO ELEMENT end */
/* WORKS start */
.works [data-button-tertiary] .button-title {
font-size: 1.313rem;
}
.works [data-button-tertiary] .button-banner img,
.works [data-button-tertiary] .button-banner .agriviva-arrow-right-large {
width: 24px;
height: 24px;
}
.works [data-button-tertiary] .button-banner > div {
column-gap: 5px;
}
.works .divider p,
.works .divider div {
height: calc(100vw * tan(4deg) + 0.6%);
}
/* WORKS end */
/* TESTIMONIAL SPOTLIGHT start */
.testimonials .testimonial {
padding: 58px;
margin: 0 32px;
}
.testimonials .testimonial > div {
column-gap: 48px;
}
.testimonials .headline {
margin-top: 0;
font-size: 1.313rem;
line-height: 1.3;
}
.testimonials .image-container {
height: 366px;
transform: translateY(-105px);
}
/* TESTIMONIAL SPOTLIGHT end */
/* REQUIREMENTS start */
.requirements .divider p,
.requirements .divider div {
height: calc(100vw * tan(4deg) + 0.5%);
}
/* REQUIREMENTS end */
/* INSTRUCTIONS start */
.instructions .steps > div {
padding: 0 36px 0;
}
.instructions .step {
padding: 0 22px 15px;
}
.instructions .fourth-step {
transform: translateY(54px);
}
/* INSTRUCTIONS start */
/* SPOTLIGHTS start */
.spotlights {
padding: 80px 0 0 0;
}
.spotlights-container .data-button-tertiary > div {
height: 325px;
width: 298px;
}
.spotlights-container .button-banner > div {
width: 77%;
}
/* SPOTLIGHTS end */
/* CTA AND ABOUT AGRIVIVA start */
.cta-and-about-agriviva.big-image .call-to-action {
padding: 60px 60px;
}
.cta-and-about-agriviva .fluid-image {
height: 700px;
}
.cta-and-about-agriviva.big-image .divider p,
.cta-and-about-agriviva.big-image .divider div {
height: calc(100vw * tan(4deg) + 0.8%);
}
/* CTA AND ABOUT AGRIVIVA end */
/* CTA LOGO start */
.cta-logo.no-space-top .subcontainer {
padding-top: 25px;
}
/* CTA LOGO end */
/* HEADLINE start */
.page-headline .subcontainer {
padding: 64px 0 34px 60px;
}
.page-headline p {
margin-bottom: 25px;
max-width: 70%;
}
/* HEADLINE end */
/* ALL TESTIMONIAL start */
.all-testimonials .bg-beige {
padding: 40px 0 120px;
}
.all-testimonials .testimonial {
margin-top: 164px;
}
.all-testimonials .testimonial .image-container {
width: 210px;
height: 235px;
transform: translateY(-96px);
}
/* ALL TESTIMONIALS end */
/* ADDITIONAL TESTIMONIALS start */
.additional-testimonials .title-container h1,
.additional-testimonials .title-container h2,
.additional-testimonials .title-container h3,
.additional-testimonials .title-container h4,
.additional-testimonials .title-container h5 {
margin-top: 20px;
}
/* ADDITIONAL TESTIMONIALS end */
.additional-testimonials .bg-beige {
padding: 40px 0 76px;
}
/* TESTIMONIAL INTRO start */
.testimonial-detail.first-element {
padding-top: 160px !important;
}
.testimonial-detail p {
max-width: 520px;
}
.testimonial-detail .person {
width: 320px;
height: 352px;
}
.testimonial-detail .image-container {
top: 64px;
}
/* TESTIMONIAL INTRO end */
/* TEXT-WALL start */
.text-wall .subcontainer {
padding: 60px 0 40px 0;
}
.text-wall .subcontainer {
margin: 0 100px;
}
/* TEXT-WALL end */
/* ABOUT US start */
.about-us .link-card {
max-width: 454px;
}
/* ABOUT US end */
/* PAGE END CTA start */
.page-end-cta .subcontainer > div {
padding: 110px 0 84px 0;
}
.page-end-cta .title-container figure {
width: 118px;
transform: translate(127px, 92px);
}
.page-end-cta .divider p,
.page-end-cta .divider div {
height: calc(100vw * tan(4deg) + 0.8%);
}
/* PAGE END CTA end */
/* OUR TEAM start */
.our-team .subcontainer {
padding: 84px 0 100px;
}
.our-team h1,
.our-team h2,
.our-team h3,
.our-team h4,
.our-team h5 {
margin: 76px 0 68px;
}
.our-team .personen-container > div {
flex-direction: column;
gap: unset;
row-gap: 20px;
}
.our-team .card-back figure:not(figure.data-button-primary) {
width: 137px;
}
/* OUR TEAM end */
/* HELP AND FAQ start */
.help-and-faq .subcontainer {
padding: 84px 0 100px;
}
.help-and-faq .content h1,
.help-and-faq .content h2,
.help-and-faq .content h3,
.help-and-faq .content h4,
.help-and-faq .content h5,
.help-and-faq .content h6 {
margin: 76px 0 48px;
}
.accordion {
width: 80%;
}
/* HELP AND FAQ end */
/* CONTACT start */
.emergency {
transform: translate(-60px, 99px);
}
/* CONTACT end */
/* FOOTER start */
.footer-top .subcontainer {
padding: 40px 35px 50px 35px;
}
.footer-bottom .subcontainer {
padding: 4px 20px 16px 20px;
}
.footer-top .subcontainer > a {
margin: unset;
display: flex;
align-items: center;
justify-content: center;
}
.footer-top .subcontainer > a img {
width: 130px;
}
/* FOOTER end */
/* ERROR-PAGE start */
.error-logo {
margin: 32px 35px;
}
.error-content {
padding-left: 77px;
}
.error-content > img {
width: 500px;
}
.meadow {
height: 66px;
transform: translateY(-66px);
margin-bottom: 80px;
}
.green {
bottom: 0;
transform: unset;
height: 400px;
}
.error-content div:has(h1) {
transform: translateY(-30px);
}
/* ERROR PAGE end */
}
@media screen and (min-width: 1200px) and (max-width: 1400px) {
/* HEADER / NAVIGATION start */
section.header .main-nav {
margin-left: 40px;
}
.main-navigation img {
width: 100px;
}
section.header .subcontainer {
/* height: 164px; */
height: 200px;
}
.main-navigation ul {
column-gap: 25px;
}
/* .main-navigation ul li:first-child a {
margin: 0 15px 0 50px;
} */
/* .main-navigation ul li:not(:first-child) {
transform: translateY(-9px);
} */
.white-rectangle {
height: 180px;
}
.mini-navigation nav {
margin: 0;
}
.mini-navigation-container {
padding: 2px 40px 15px 0;
}
.mini-navigation nav > ul {
column-gap: 24px;
margin-right: 0;
}
.mini-navigation .red-rectangle {
transform: translate(4px, -14px) rotate(-4deg);
}
#language-menu {
right: 11px;
}
/* HEADER / NAVIGATION end */
/* HERO ELEMENT start */
.hero-content > div {
max-width: 1140px;
/* bottom: -1.1%; */
}
.hero .divider::after {
height: calc(96vw * tan(4deg));
}
.hero .headlines {
max-width: 377px;
}
.hero .headline {
font-size: 1.313rem;
line-height: 1.4;
}
.hero h1 {
font-size: 4.75rem;
line-height: 73px;
}
.white-hero-rectangle {
transform: translateY(-52px) rotate(-4deg);
}
.hero-content .primary-button-container {
transform: translate(442px, -309px);
}
.hero-content p.hero-arrow {
transform: translate(418px, -315px) rotate(-36deg);
}
/* HERO ELEMENT end */
/* WORKS start */
.works [data-button-tertiary] .button-title {
font-size: 1.313rem;
}
.works [data-button-tertiary] .button-banner img,
.works [data-button-tertiary] .button-banner .agriviva-arrow-right-large {
width: 24px;
height: 24px;
font-size: 1.5rem;
}
.works [data-button-tertiary] .button-banner > div {
height: 76px;
transform: translate(-17px, -63px);
}
.works-container [data-button-tertiary] .button-title, .data-button-tertiary .button-title {
font-size: 1.313rem;
}
/* WORKS end */
/* TESTIMONIAL SPOTLIGHT start */
.testimonials .testimonial {
padding: 88px 85px 88px 85px;
margin: 0 32px;
}
.testimonials .headline {
margin-top: 0;
}
/* TESTIMONIAL SPOTLIGHT end */
/* REQUIREMENTS start */
.requirements .divider p,
.requirements .divider div {
height: calc(100vw * tan(4deg) + 0.5%);
}
/* REQUIREMENTS end */
/* INSTRUCTIONS start */
.instructions .steps > div {
padding: 0 36px 0;
}
/* INSTRUCTIONS end */
/* SPOTLIGHTS start */
.spotlights-container .data-button-tertiary > div {
height: 380px;
width: 355px;
}
/* SPOTLIGHTS end */
/* CTA AND ABOUT AGRIVIVA start */
.cta-and-about-agriviva.big-image .call-to-action {
padding: 60px 80px;
}
.cta-and-about-agriviva .fluid-image {
height: 800px;
}
/* CTA AND ABOUT AGRIVIVA end */
/* HEADLINE start */
.page-headline .subcontainer {
padding: 64px 0 34px 60px;
}
.page-headline p {
margin-bottom: 20px;
max-width: 60%;
}
/* HEADLINE end */
/* ALL TESTIMONIAL start */
.all-testimonials .bg-beige {
padding: 40px 0 80px;
}
/* ALL TESTIMONIALS end */
/* ADDITIONAL TESTIMONIALS start */
.additional-testimonials .title-container h1,
.additional-testimonials .title-container h2,
.additional-testimonials .title-container h3,
.additional-testimonials .title-container h4,
.additional-testimonials .title-container h5 {
margin-top: 20px;
}
/* ADDITIONAL TESTIMONIALS end */
/* TESTIMONIAL INTRO start */
.testimonial-detail.first-element {
padding-top: 180px !important;
}
/* TESTIMONIAL INTRO end */
/* TEXT-WALL start */
.text-wall .subcontainer {
padding: 100px 0 40px 0;
}
/* TEXT-WALL end */
/* ABOUT US start */
.about-us .link-card {
max-width: 545px;
}
/* ABOUT US end */
/* PAGE END CTA start */
.page-end-cta .subcontainer > div {
padding: 122px 50px 84px 50px;
}
/* PAGE END CTA end */
/* OUR TEAM start */
.our-team .subcontainer {
padding: 84px 0 100px;
}
.our-team h1,
.our-team h2,
.our-team h3,
.our-team h4,
.our-team h5 {
margin: 80px 0 72px;
}
.our-team .personen-container > div {
gap: unset;
}
.our-team .card-back figure:not(figure.data-button-primary) {
width: 137px;
}
/* OUR TEAM end */
/* HELP AND FAQ start */
.help-and-faq .subcontainer {
padding: 84px 0 100px;
}
.help-and-faq .content h1,
.help-and-faq .content h2,
.help-and-faq .content h3,
.help-and-faq .content h4,
.help-and-faq .content h5,
.help-and-faq .content h6 {
margin: 80px 0 48px;
}
/* HELP AND FAQ end */
/* FOOTER start */
.footer-top .subcontainer {
padding: 25px 40px 50px 40px;
}
.footer-bottom .subcontainer {
padding: 4px 40px 16px 40px;
}
/* FOOTER end */
/* ERROR-PAGE start */
.error-content > img {
width: 500px;
}
.meadow {
height: 66px;
transform: translateY(-66px);
margin-bottom: 110px;
}
.green {
bottom: 0;
transform: unset;
height: 500px;
}
.error-content div:has(h1) {
transform: translateY(-30px);
}
/* ERROR PAGE end */
}
@media screen and (min-width: 1400px) {
/* HEADER / NAVIGATION start */
.header .subcontainer {
height: 187px;
}
/* HEADER / NAVIGATION end */
/* HERO ELEMENT start */
.hero {
/* transform: translateY(-187px); */
transform: unset;
}
.hero .divider::after {
height: calc(97vw * tan(4deg));
}
.editor-styles-wrapper .hero-content > div {
bottom: calc(0% + 19px);
}
.hero-content > div {
bottom: calc(0% + 2%);
}
.white-hero-rectangle {
transform: translateY(-71px) rotate(-4deg);
}
.hero-placeholder .subcontainer {
height: calc(92vh - 187px);
}
/* HERO ELEMENT end */
/* REQUIREMENTS start */
.requirements .divider p,
.requirements .divider div {
height: calc(100vw * tan(4deg) + 0.5%);
}
/* REQUIREMENTS end */
}
@media screen and (min-width: 1800px) {
/* NAVIGATION / HEADER start */
section.header .subcontainer {
max-width: 1600px;
margin-left: auto;
margin-right: auto;
}
.white-rectangle {
max-width: 86%;
}
/* NAVIGATION / HEADER end */
/* FOOTER start */
.footer-top .subcontainer,
.footer-bottom .subcontainer {
max-width: 1600px;
margin: 0 auto 0;
}
/* FOOTER end */
}
@media screen and (min-width: 1600px) and (max-width: 1700px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 3%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 1700px) and (max-width: 1800px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 3%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 1800px) and (max-width: 1900px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 3.5%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 1900px) and (max-width: 2000px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 4%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 2000px) and (max-width: 2100px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 4.5%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 2100px) and (max-width: 2200px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 5%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 2200px) {
/* HERO ELEMENT start */
.hero-content > div {
bottom: calc(0% + 5.5%);
}
/* HERO ELEMENT end */
}
@media screen and (min-width: 1400px) and (max-width: 1600px) {
}
@media screen and (min-width: 1600px) and (max-width: 1920px) {
}
@media screen and (min-width: 1920px) and (max-width: 2500px) {
}
/* RESPONSIVENESS end */