/* open-sans-300 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300;
	src: url('../fonts/open-sans-v36-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* open-sans-300italic - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 300;
	src: url('../fonts/open-sans-v36-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v36-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/open-sans-v36-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-600 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 600;
	src: url('../fonts/open-sans-v36-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* open-sans-600italic - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 600;
	src: url('../fonts/open-sans-v36-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
/* open-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/open-sans-v36-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/open-sans-v36-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
html {
	scroll-behavior: smooth;
}
html,
body{
	margin:0;
	padding:0;
	width: 100%;
	height: 100%;
	font-family: 'Open Sans';
	overflow-x:hidden;
	color:#7F7F7F;
	font-size: 1em;
	line-height: 1.6;
}

h1,h2,h3{
	font-weight: 300;
	text-transform: uppercase;
	line-height: 120%;
	margin:0px;
}
h1 {
	font-size:4em;
}
h2{
	font-size: 3em;
}
h3 {
	font-size: 1.5em;
}
h4 {
	font-size:1.2em;
	font-weight: 300;
	line-height: 120%;
	margin:0px;
}
b, strong {
font-weight:600;
}

p{
	margin:5px 0;
} 
.more-cta{
	height: 2.5vw;
}
.bold-text {
	font-weight: 700;
	margin:10px;
}

#header{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:10vh;
	background:#262626;
	z-index: 100;
	text-align:center;
	color:#ffffff;
	border-bottom: 2px solid #262626;
}
.header-start{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:10vh;
	background: transparent !important;;
	z-index: 100;
	text-align:center;
	color:#ffffff;
	border-bottom: 2px solid #ffffff!important;
}
.iframe-pages {
	position: sticky!important;

}
.iframe-content {
	position: absolute;
	top:0px;
}

#header img{
	margin:0 auto;
    height: 10vh;
	padding:3vh;
	box-sizing: border-box;
}

#header .button{
	position: absolute;
	right: 150px;
	color:#ffffff;
}

#header .lang{
	position: absolute;
	right:30px;
	color:#ffffff;
}

iframe{
	width:100vw;
	height:100vh;
	margin:0;
	padding:0;
}


.button{
	border:2px solid #ffffff;
	padding:10px 15px;
	margin:25px;
	-webkit-transform: skew(-25deg);
	-moz-transform: skew(-25deg);
	-ms-transform: skew(-25deg);
	-o-transform: skew(-25deg);
	transform: skew(-25deg);
	letter-spacing: 2px;
	text-transform: uppercase;
	font-weight: 700;
	text-decoration: none;
}
.button span {
	display: block;
	-webkit-transform: skew(25deg);
	-moz-transform: skew(25deg);
	-ms-transform: skew(25deg);
	-o-transform: skew(25deg);
	transform: skew(25deg);
	letter-spacing: 2px;
	text-transform: uppercase;
	font-weight: 400;
	text-decoration: none;
}
.lang{
	padding:10px 15px;
	margin:25px;
}
#content {
	padding-top:10vh;
}
.box{
	width:25%;
	float:left;
	height:45vh;
	background:transparent;
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	background-position: 50%;
	background-size:cover;
}

.box span{
	position: absolute;
	left:-15px;
	bottom:50px;
	background:transparent;
	border:2px solid #ffffff;
	padding:10px 30px;
	-webkit-transform: skew(-25deg);
	-moz-transform: skew(-25deg);
	-ms-transform: skew(-25deg);
	-o-transform: skew(-25deg);
	transform: skew(-25deg);
}

.box span h3 {
	transform: skew(25deg);
	-moz-transform: skew(25deg);
	-ms-transform: skew(25deg);
	-o-transform: skew(25deg);
	transform: skew(25deg);
	text-transform: uppercase;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 2px;
	text-decoration: none;
	color:#ffffff;
	margin:0;
}

/*Unterseiten*/
.flex-container-left {
    display: flex;
    justify-content: flex-start; 
    align-items: center;    
    gap: 5px;
}
.flex-container-right {
    display: flex;
    justify-content: flex-end; 
    align-items: center;    
    gap: 5px;
}

.flex-container-left.h-100, .flex-container-right.h-100, .flex-container-center.h-100{
	width: 100vw;
    aspect-ratio: 16 / 9;
}

.flex-container-left.h-66,.flex-container-right.h-66,.flex-container-center.h-66{
	width: 100vw;
    aspect-ratio: 16 / 6;
}

.flex-container-left  > div.w-40,.flex-container-right > div, .flex-container-center >div.w-40{
    box-sizing: border-box;
	padding:5%;
}

.flex-container-left  > div.w-25,.flex-container-right > div.w-25,.flex-container-center >div.w-25{
	width: 25%;
	text-align: right;
}

.flex-container-left  > div.w-33,.flex-container-right > div.w-33,.flex-container-center >div.w-33{
	width: 33%;
	padding:5%;
}

.flex-container-left  > div.w-40,.flex-container-right > div.w-40,.flex-container-center >div.w-40{
	width: 40%;
}
/* Einkauf*/ 
.einkauf-header {
	background-image:url("../img/einkauf/einkauf-header.jpg");
	background-repeat: no-repeat;
	background-size: 100%;
}
.einkauf-2 {
	background-image:url("../img/einkauf/einkauf-2.jpg");
	background-repeat: no-repeat;
	background-size: 100%;
	aspect-ratio: 16 / 9;
	justify-content: center;
	color:#ffffff;
	display: flex;
	flex-direction: column;
}
.flex-container {
    display: flex;
    justify-content: space-evenly; 
    gap: 5px;	
	max-width:90vw;
	margin: 0 auto;
}
.flex-container-sm {
    display: flex;
    justify-content: space-evenly; 
	flex-direction: column;
    gap: 5px;	
	max-width:90vw;
	margin: 0 auto;
	padding: 50px 0;
}
.flex-container-center {
    display: flex;
    justify-content: center; 
    align-items: center;    
    gap: 5px;
}
.col-12 {
	flex-grow: 1;
	width:100%;
	padding:5vw 3vw 0;

}
.col-4 {
	flex-grow: 1;
	width: 33%;
	padding:0 3vw 2vw;
}
.col-4-sm {
	flex-grow: 1;
	width: 20vw;
	padding:0px;
	text-align: center;
}
.col-3 {
	flex-grow: 1;
	width: 25%;
}
.img-ansprechpartner {
	padding-bottom:20px;
	width:100%;
}
/* Startups*/ 
.rytle{
	background-image:url("../img/startups/startups-rytle.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.section-headline {
	padding-left:5vw;
}
.fernride{
	background-image:url("../img/startups/fernride.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}

.startups-header{
	background-image:url("../img/startups/header-startups.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.antrieb{
	background-image:url("../img/startups/startups-antrieb.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
	justify-content: center;
	color:#ffffff;
}
.agforce {
	background-image:url("../img/startups/startups-ag-force.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.organic-garden {
	background-image:url("../img/startups/startups-organic-garden.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.farmers-first {
	background-image:url("../img/startups/startups-farmers-first.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.visometry {
	background-image:url("../img/startups/startups-visometry.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.trailer-dynamics {
	background-image:url("../img/startups/startups-trailer-dynamics.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.recalm {
	background-image:url("../img/startups/startups-recalm.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.quote {
	font-style: italic;
	font-weight: 300;
	font-size: 1.5em;
	line-height: 1.5;
	text-transform: none;
	padding: 40px 0;
}
.quote-person {
	text-transform:none;
	padding-bottom:40px;
}
/* Nachhaltigkeit*/ 
.nachhaltigkeit-header {
	background-image:url("../img/nachhaltigkeit/nachhaltigkeit_bg-section-1.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.nachhaltigkeit-2 {
	background-image:url("../img/nachhaltigkeit/nachhaltigkeit_bg-section-2.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
	aspect-ratio: 16 / 9;
	justify-content: center;
	color:#ffffff;
	display: flex;
	flex-direction: column;
}
.nachhaltigkeit-sektion-3 {
	background-image:url("../img/nachhaltigkeit/nachhaltigkeit_bg_section-3.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.nachhaltigkeit-sektion-4 {
	background-image:url("../img/nachhaltigkeit/nachhaltigeit_bg_section-4.jpg");
	background-size: 100%;
}
.nachhaltigkeit-sektion-5 {
	background-image:url("../img/nachhaltigkeit/nachhaltigkeit_bg_section-5.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.nachhaltigkeit-sektion-6 {
	background-image:url("../img/nachhaltigkeit/nachhaltigkeit_bg_section-6.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.nachhaltigkeit-sektion-7 {
	background-image:url("../img/nachhaltigkeit/nachhaltigkeit_bg_section-7.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
}
.highlight-headline {
	color:#ffffff;
	width: 66vw;
	display: flex;
	justify-content: center;
	align-content: center;
	text-align: center;
}
/* Big Picture*/ 
.wrapper.big-picture.en {
	background-image:url("../img/big-picture/BigPictureIAA.jpg");
	background-repeat: no-repeat;
    background-size: contain;
	display: flex;
    justify-content: flex-end; 
    align-items: center;    
	width: 100vw;
    aspect-ratio: 16 / 9;
	margin-top:10vh;
}
.wrapper.big-picture.de {
	background-image:url("../img/big-picture/big-picture-de.jpg");
	background-repeat: no-repeat;
    background-size: contain;
	display: flex;
    justify-content: flex-end; 
    align-items: center;    
	width: 100vw;
    aspect-ratio: 16 / 9;
	margin-top:10vh;
}

.video-js .vjs-big-play-button {
    font-size: 3em!important;
    line-height: 3em!important;
    height: 3em!important;
    width: 3em!important;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    padding: 0;
    margin-top: -0.81666em;
    margin-left: -1.5em;
    cursor: pointer;
    opacity: 1;
    border: 0.06666em solid #fff;
    background-color: black!important;
    border-radius: 100px!important;
    transition: all 0.4s;
}
.my-video-2-dimensions {
    width: 100%;
    height: 300px;
}
.my-video-3-dimensions {
    width: 100%;
    height: 300px;
}
.my-video-4-dimensions {
    width: 100%;
    height: 300px;
}
.my-video-5-dimensions {
    width: 100%;
    height: 300px;
}

/* Start */ 
.background-video {
	width: 100vw;
	height: 100vh;
	object-fit: cover;
	position: fixed; left: 0;
	right: 0; 
	top: 0; 
	bottom: 0;
	z-index: -1;
}
.start {
	flex-direction: column;
	height: 100vh;
}
.start:after {
	background-image: linear-gradient(135deg, rgba(0,99,159,0.5) 0%, rgba(74,119,41,0.5) 100%);
	border-radius: inherit;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
}
.start-content {
	display: flex;
	justify-content: center;
	width:100%;
	color:#ffffff;
	text-align: center;
	letter-spacing: 2px;
	font-weight: 600;
	z-index: 99;
}
.start-polygon {
	width: fit-content;
    background: #fff;
    clip-path: polygon(3% 0%, 100% 0%, 97% 100%, 0 100%);
    -webkit-clip-path: polygon(5% 0%, 100% 0%, 95% 100%, 0 100%);
    padding: 5px 20px!important;
	font-style: italic;
	text-align: center;
	font-weight: 100;
	z-index: 99;
	font-size: 1em!important;
}
.start-polygon h2 {
	font-size:2em;
}
.start-icon {
	z-index: 99;
	padding-top:80px;
}
.lg-download {
	display: none!important;
}
.lg-counter {
	display: none!important;
}
#lightgallery a {
	flex:50%;
}

.back-to-button {
	background: #262626;
    padding: 10px;
    position: absolute;
    bottom: 50px;
    left: 20px;
    border-radius: 100px;
    width: 100px;
    text-align: center;
    color: white;
    text-transform: uppercase;
    box-shadow: 11px 10px 30px 0px rgba(0,0,0,0.3);
}

.btn {
	color:#7f7f7f;
	font-weight: 600;
    text-transform: uppercase;
	border:2px solid #7f7f7f;
	border-radius:50px;
	padding: 10px 40px;
	text-align: center;
	transform:none;
	display: block;
	width: 140px;
	margin:0px;
	text-decoration: none;

}
.btn:hover {
	background-color: #7F7F7F;
	color:#ffffff;
}