/* Index 
	1) Header
	2) First Section
	3) Card Section
	4) Footer
*/

/* 
turqoise: #52A9A4
turquoise Dark: #499893



*/
html,
body {
	max-width: 100%;
	overflow-x: hidden;
}

a,
p,
h3,
h4 {
	color: #404040;
}


body {
	font-family: 'Ubuntu', sans-serif;
	font-weight: 300;
	font-size: 1rem;
	color: #212529;
}

.bg-arrow {
	position: absolute;
	left: -56vw;
	top: 0;
	z-index: 1;
	width: 120vw;
	height: 380vh;
	background: url(../img/bg-arrow.png) no-repeat;
	background-size: 100% auto;
	opacity: 25%;
	/* opacity: 100%; */
	transform: rotate(2deg);
}

p {
	line-height: 21pt;
	font-family: 'Roboto Slab', serif;
	font-size: 14pt;
	margin-top: 10px;
}

a {
	color: #212529;
	text-decoration: none;
}


.clearFloat {
	clear: both;
}

.turquoise-color {
	color: #52A9A4;
}

/* 1) Header */

/* Navigation */
#navigation {
	background-color: #499893;
	padding: 20px 0px 20px;

}


.navbar-nav {
	margin-left: auto;
	color: white;
}

.navbar-nav .active {
	border-bottom: 5px solid rgb(241 230 16);
}

.navbar-nav .nav-link {
	color: white;
}

#navigation .nav-link {
	padding: 0px;
	margin: 5px 15px 5px;
	font-weight: bold;
	font-size: 20px;
}

.navbar-toggler {
	color: rgba(0, 0, 0, .55);
	border: none
}

.navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.header-box {
	height: 50vh;
	background-color: #52A9A4;
	position: relative;
}

.header-box h2 {
	display: block;
	margin-top: 70px;
}

.header-box .deko {
	width: 230px;
	height: 30vh;
	position: absolute;
	right: 0px;
	top: 10vh;
	z-index: 1;
	background: url("../img/deko-1.svg") no-repeat center left;
	background-size: auto 100%;
}

.header-box .container {
	padding-top: 2vh;
	position: relative;
	z-index: 2;
}

h1 {
	margin: 0px auto;
	width: 700px;
	height: 220px;
	margin-bottom: 60px;
	overflow: hidden;
	text-indent: -9999px;
	background: url("../img/logo-mint.svg") no-repeat;
	background-size: 100% auto;
}

h2 {
	color: #FFF;
	font-weight: 500;
	font-size: 1.8rem;
}

h2 span {
	padding: 0px 5px;
	position: relative;
	z-index: 2;
}

.subline {
	position: absolute;
	display: block;
	bottom: 60px;
	color: #FFF;
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: 2px;
	z-index: 2;
	color: #52A9A4;
	background-color: white;
	font-size: 23px;
	padding-left: 5px;
	padding-right: 5px;
	right: 50%;
	margin-right: -210px;
}

/* Strategy */
#strategy-container {
	padding-top: 120px;
	text-align: center;
}

#strategy-boxes {
	position: relative;
	color: #404040;
}

#strategy-boxes h4 {
	font-size: 21.1pt;
	line-height: 23.9pt;
}

#strategy-container h3 {
	margin-bottom: 40px;
	color: #404040;
}

#whyMint {
	padding: 5vh 0 5vh 0;
	background-color: transparent;
}

#strategy-container,
#whyMint span {
	color: #52A9A4;
}

#whyMint h3 {
	font-size: 49.3pt;
	margin-top: 0;
}

#mint {
	z-index: 2;
}

#whyMint p {
	font-size: 15pt;
	margin-top: 14.4mm;
	line-height: 21pt;
}

#strategy-container .col-md-4 {
	width: 108mm;
	height: 120mm;
}

.strategy-box #white-bok {
	background-color: white;
	z-index: 1;
}

#strategy-boxes .col-md-4 {
	z-index: 1;
}

#strategy-boxes {
	margin-top: 70px;
}

.strategy-box {
	border: 2px solid #52A9A4;
	height: 412px;
	padding: 20px;
	background-color: white;
}

.strategy-box.bg-turquoise {
	background-color: #52A9A4;
}

.strategy-box.bg-turquoise p,
.strategy-box.bg-turquoise h4 {
	color: white !important;
}

.strategy-box.bg-turquoise hr {
	border-top: 2px solid white;
	margin-top: 16px;
}

.strategy-box.bg-turquoise {
	color: white;
}

.strategy-box img {
	height: 100px;
	margin-top: 27px;
}

.strategy-box hr {
	border-top: 1.4px solid #52A9A4;
}



/* 2) First Section */
.col-md-8 h3 {
	padding-top: 126px;
	font-size: 58px;
	text-align: center;
	margin-bottom: 3rem;
}

.col-12 h3 {
	font-size: 3rem;
	margin-bottom: 7rem;
	text-align: center;
}

.white-box h3 b {
	color: #52A9A4;
}

.white-box p {
	letter-spacing: 1.25px;
	text-align: center;
}


.white-box {
	padding: 20vh 0 25vh 0;
	background-color: white;
	position: relative;
	z-index: 3;
}

#mint-quadrants {
	padding-bottom: 90px;
}

.mint-quadrant {
	width: 50%;
	float: left;
	padding: 50px 20px 50px;
	height: 350px;
}

.mint-quadrant h4 {
	margin: 20px 0px 20px;
	font-size: 20pt;
}

.mint-quadrant img {
	height: 100px;
}

.mint-quadrant p {
	display: block;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	font-size: 15pt;
	line-height: 21pt;
	font-family: 'Roboto Slab', serif;
}

.yellowBar {
	height: 3.5mm;
	background-color: rgb(241 230 16);
	width: 100%;
	margin: -30px auto 15px auto;
}

.yellowBarMath {
	width: 44mm;
}

.yellowBarInformatik {
	width: 41mm;
}

.yellowbarNature {
	width: 75.4mm;
}

.yellowBarTech {
	width: 31.4mm;
}

.yellowBarEventsCol1 {
	height: 10px;
	background-color: rgb(241 230 16);
	margin-top: -18px;
	width: 145px;
}

.yellowBarEventsCol2 {
	height: 10px;
	background-color: rgb(241 230 16);
	margin-top: -18px;
	width: 81px;
}



.col-md-8 p {
	color: #404040;
}

.mint-quadrant:nth-child(1) {
	border-right: 0.9px solid lightgrey;
	border-bottom: 0.9px solid lightgrey;
}

.mint-quadrant:nth-child(2) {
	border-bottom: 0.9px solid lightgrey;
}

.mint-quadrant:nth-child(3) {
	border-right: 0.9px solid lightgrey;
}



/* 3) Card Section */
.green-boxx {
	background-color: #52A9A4;
	padding: 20vh 0 0 0;
	overflow: hidden;
	position: relative;
}

.green-boxx .container-fluid {
	padding-left: 0px;
}

.green-boxx h3 {
	font-size: 49.3pt;
	color: #FFF;
	text-transform: uppercase;
	font-weight: 700;
	margin-bottom: 40px;
	z-index: 3;
	position: relative;
}


.card {
	/* padding-bottom: 30px; */
	position: relative;
	z-index: 2;
}

.card,
.card img {
	border-radius: 0px;
}

.card-body h4 {
	color: #52A9A4;
	padding-left: 33px;
	font-size: 19pt;
}

.card-top {
	padding: 40px 40px 0px 40px;
}

.card-title p {
	letter-spacing: 1.25px;
}

.card-text {
	padding: 4px 47px 0px 32px;
	line-height: 26px;
}

.card-body {
	margin-top: 10px;
}

.card-img-top {
	width: 100%;
	position: relative;
	border-radius: 0px;
}

.btn {
	color: #52A9A4;
	border-color: #52A9A4;
	border-radius: 0px;
	font-size: 1.1rem;
	text-transform: uppercase;
	padding: .5rem .9rem
}

.btn-outline-primary:hover {
	background-color: #52A9A4;
	border-color: #52A9A4;
	color: white;
}



/* carousel */

/* carousel */
.caroussel-item {
	width: 15%;
	position: relative;
	z-index: 3;
	padding-top: 35px;
}

#carousel {
	width: 4000px;
	margin: 50px auto 50px auto;
}

#carousel .col-md-3 {
	position: relative;
	z-index: 1;
}

#prev {
	position: absolute;
	left: 0%;
	top: 45%;
	height: 10vh;
	z-index: 4;
	width: 400px;
	cursor: pointer;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
	display: inline-block;
	background-size: 20% 20%;
	background-repeat: no-repeat;
	background-position: center;
	background-color: rgba(0, 0, 0, 0);
	margin-top: auto;
	margin-bottom: auto;
	height: 200px;
}

#next {

	position: absolute;
	right: 0%;
	height: 10vh;
	top: 45%;
	z-index: 4;
	width: 400px;
	cursor: pointer;
	display: inline-block;
	background-size: 20% 20%;
	background-repeat: no-repeat;
	background-position: center;
	background-color: rgba(0, 0, 0, 0);
	margin-top: auto;
	margin-bottom: auto;
	height: 200px;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E")
}

article#downloads {
	background-color: unset;
	padding-top: 50px;
	padding-bottom: 100px;
}

article#downloads span {
	color: #52A9A4;
}

article#downloads p {
	margin-bottom: 40px;
	color: #404040;
}

article#downloads a {
	display: inline;
	margin: 0px;
	-webkit-appearance: button-bevel;
	/*background-color: yellow;*/
	text-transform: uppercase;
	font-weight: 400;
	margin-top: 50px !important;
}

article#downloads svg {
	color: black;
	font-weight: bold;
	margin-right: 5px;
}




#carousel .card {
	padding: 0px;
	margin: 30px;
	height: auto;
	background-color: white;
	border: none;
}

.caroussel-item-big {
	padding-top: 0px !important;
	height: 630px !important;
}

.caroussel-item-big .card-item {
	padding-bottom: 80px !important;
}

.caroussel-item-big .card-content {
	padding-top: 0px !important;
}

#carousel .card-content {
	background-color: rgba(255, 255, 255, .8);
	padding: 0px;
	text-align: left;
	height: 35%;
	padding-top: 0px;
	margin-top: -88px;
}

#carousel .card-content h4 {

	font-size: 14pt;
	font-family: 'Ubuntu', sans-serif;
	padding-top: 30px;
	padding-bottom: 20px;
	padding-left: 25px;
	padding-right: 22px;
}

#carousel .caroussel-item-big .card-content h4 {
	font-size: 18pt;
}

#carousel .card-content div {
	height: 100%;
	background-color: white;
	padding: 30px;
}


#button-center {
	width: 105px !important;
	height: 105px !important;
}

#carousel #first {
	/*height: 153.3mm;
	width: 109.3mm;*/
}

/* 
#carousel #first p{
	font-size: 12pt;
	font-family: 'Roboto Slab', sans-serif;
	line-height: 17pt;
} */
#carousel .img-first {
	height: auto;
	width: 1093mm;
}

#carousel #second {
	height: 174mm;
	width: 109.3mm;
}

#carousel #second p {
	font-size: 12pt;
	font-family: 'Roboto Slab', sans-serif;
	line-height: 17pt;
}

#carousel p {
	display: none;
}

#carousel #second .img-second {
	width: 122.8mm !important;
}


#carousel .card-img {
	height: auto;
}

#carousel .card-img img {
	width: 100%
}

#carousel .button-yellow {
	margin-top: 7px;
}

#carousel .caroussel-item-big .button-yellow {
	margin: 30px 0px 30px calc(50% - 80px);
}

#beitrittButton {
	padding: 20px 37px;
	font-size: 18px;
}

.button-yellow {
	background-color: rgb(241 230 16);
	margin: 30px 0px 30px calc(50% - 131px);
	color: #404040;
	padding: 10px;
	border: none;
	display: none;
}

#whyMint .button-yellow {
	position: absolute;
	left: 0;
	margin: 30px 0px 70px calc(50% - 78px);
	height: 14.5mm;
	width: 56.9mm;
	font-size: 16pt;
	font-family: 'Barlow', sans-serif;
}

.carousel-control-next,
.carousel-control-prev {
	z-index: 2;
}



.carousel-control-prev {
	left: 170px;
}

.carousel-control-next {
	right: 170px;
}

video {
	margin-top: 100px;
}

@media (max-width: 767px) {
	.carousel-inner .carousel-item>div {
		display: none;
	}

	.carousel-inner .carousel-item>div:first-child {
		display: block;
	}
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
	display: flex;
}

/* current Events */

.eventsImageAndBox {
	position: relative;
}

.eventsContainer {
	margin-top: 120px;
}

.eventsCol {
	padding: 50px;
	text-align: left;
}



#currentEvents {
	position: relative;
	margin-top: 120px;
}

#currentEvents img {
	width: 100%;
}

#currentEvents #currentEventsBox {
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 170mm;
	height: 56mm;
	text-align: center;
	top: calc(50% - 70px);
	background-color: rgba(255, 255, 255, 0.8);
	padding-top: 64px;
}

#currentEvents .yellowBar {
	height: 20px;
	width: 77%;
	background-color: rgb(241 230 16);
	z-index: 1;
	padding-top: 0;
	bottom: -18px;
}

#currentEvents div h3 {
	position: relative;
	z-index: 2;
	font-size: 58px;
	line-height: 71px;
}

#impressions {
	padding-top: 140px;
	padding-bottom: 160px;
	/*	background: url("../img/deko-2.svg") no-repeat bottom;*/
	background-size: 50%;
}

#impressions img {
	width: 100%;
	margin-bottom: 20px;
}

#impressions h3 {
	text-align: center;
	font-size: 49.3pt;
	margin-bottom: 100px;
	overflow-wrap: break-word;
}

#impressions span {
	color: #52A9A4;
}

#impressions button {
	padding: 15px 25px;
}



#sponsoren {
	padding-top: 140px;
	padding-bottom: 160px;
	background: url("../img/deko-2.svg") no-repeat bottom;
	background-size: 50%;
}

#sponsoren img {
	max-height: 120px;
	margin: 30px auto 30px auto;
	max-width: 100%;
	display: block;

}

#sponsoren div[class^='col'] {

	margin: 30px 30px 30px 30px;
}

#sponsoren h3 {
	text-align: center;
	font-size: 49.3pt;
	margin-bottom: 100px;
	overflow-wrap: break-word;
}

#sponsoren span {
	color: #52A9A4;
}

#sponsoren hr {
	margin-bottom: 70px;
}


/* 4) Footer */
footer {

	padding-top: 40px;
	line-height: 18px;
	background-size: 50vw auto;
	padding-bottom: 0px;
	background-color: #52A9A4;
	padding-bottom: 100px;
}

footer p.downloads {
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 1.1px;
}

footer a {
	color: white;
	margin: 10px;
}

footer p {
	color: white;
	margin: 10px;
}

footer a:hover {
	transition: 0.6s;
	color: #404040;
}

.font-bold {
	font-weight: bold;
}

footer hr {
	margin-top: 70px;
	color: white;
}


footer .socials img {
	width: 100%;
}

footer .logos img {

	height: auto;
	width: 80px;
}


footer h4 {
	font-size: 2rem;
}



.mynet {
	width: 122px;
	margin-top: -47px;
}

.ematric {
	width: 122px;
	margin-top: -47px;
}

.bg img {
	width: 50%;
	margin-top: -30px;
}




.wine-section {
	padding: 20px 0;
}

.wine-section .card {
	height: 100%;

	.row {
		height: 100%;
	}
}

.wine-card {
	margin-bottom: 20px;
	min-height: 300px;
}

.wine-card img {
	max-height: 350px;
	background-color: #c3c3c3;
}

.wine-card .card-body {
	justify-content: space-between;
	align-items: center;
	height: 100%;
}

.wine-card .wine-info {
	flex: 1;
}

.wine-card .wine-price {
	font-size: 2.5rem;
	margin-top: auto;
	word-wrap: normal;
}

.wine-card h5 {
	font-size: 3rem;
}


.wine-section span {
	color: #52A9A4;
}

.wine-section h3 {
	font-size: 49.3pt;
	margin-top: 0;
}

.wine-card .wine-hersteller {}

.wine-card .wine-title {
	word-break: break-word;
}

.wine-card .wine-jahrgang {}

.wine-card .wine-text {}

.wine-card .img-container {
	max-width: 100%;
	height: auto;
	background-color: #c3c3c3;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.wine-card .center-block {
	display: block;
	margin: auto;
}