@charset "UTF-8";

img, object, embed, video {
	max-width: 100%;
}
body {
	background-color: #FFF;
	background-image:
	  linear-gradient(
		to bottom,
		rgba(0,182,237,1)	0%,
		rgba(255,255,255,1) 100%
	  );
	background-attachment: fixed;
	overflow-x: hidden;
}
body::before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	height: 100vh;
	width: 100vw;
	z-index: -1;
	background: linear-gradient(to bottom, rgba(0,182,237,1) 0%, rgba(255,255,255,1) 100%);
}  
header {
	margin-top: 0em;
}
#navi_focus {
	color: #164194;
}
.container_navi {
	width: 95%;
	margin: auto;
}
#navi {
	top: 0;
	right: 0;
	position: fixed;
	z-index: 5;
}
/*
#hamburg {
	display: none;
}
#close {
	display: none;
}
#navi ul {
	position: relative;
	text-align: right;
	float: right;
	display: block;
}
#navi-icon {
	width: 4.5em;
	margin-top: -1.1em;
	transition: transform 0.6s ease-in-out;
}
#navi-icon:hover {
	transform: scale(1.05, 1.05);
}
#navi ul li {
    font-family: 'Rubik', sans-serif;
	font-size: 1.7em;
	font-weight: 900;
	text-transform: uppercase;
	text-shadow: 0 0 0.5em rgba(0,182,237,0.75);
	float: left;
	background-color: rgba(255,255,255,0);
	text-align: right;
	position: relative;
	top: 0;
	padding: 2em 1.5em 1em 1em;
	list-style: none;
}
*/
#hamburg {
    font-family: 'Rubik', sans-serif;
	font-size: 4em;
	font-weight: 900;
	color: #FFF;
	text-shadow: 0 0 0.5em rgba(0,182,237,0.75);
	position: fixed;
	top: -0.7em;
	right: 0.2em;
	transform: translateY(50%) scaleY(1);
	display: block;
	cursor: pointer;
	transition: transform 0.15s ease;
	display: block;
}
#hamburg.animate {
	transform: translateY(50%) scaleY(0);
}
#close {
    font-family: 'Rubik', sans-serif;
	font-size: 4em;
	font-weight: 900;
	color: #FFF;
	text-shadow: 0 0 0.5em rgba(0,182,237,0.75);
	position: fixed;
	top: -0.6em;
	right: 0.25em;
	transform: translateY(50%) scaleY(0);
	cursor: pointer;
	transition: transform 0.15s ease;
	display: block;
}
#close.animate {
	transform: translateY(50%) scaleY(1);
}
#hamburg.animate {
	transform: translateY(50%) scaleY(0);
}
#navi-icon {
	width: 4.5em;
	margin-top: -1.1em;
	transition: transform 0.6s ease-in-out;
}
#navi-icon:hover {
	transform: scale(1.05, 1.05);
}
#navi ul {
	position: fixed;
	text-align: right;
	float: none;
	top: 0em;
	right: 0em;
	bottom: 0;
	transform: translateY(-50%) scaleY(0);
	transition: transform 0.3s ease;
/*
	background: linear-gradient(to bottom, rgba(0,182,237,0.5) 0%, rgba(255,255,255,0.5) 100%);
	backdrop-filter: blur(1em);
	-webkit-backdrop-filter: blur(1em);
	box-shadow: 0 0 0.5em rgba(0,0,0,0.0);
	-webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 30%);
	mask-image: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 30%);
*/
}
#navi ul.show {
	transform: translateY(0) scaleY(1);
}
#navi ul li {
    font-family: 'Rubik', sans-serif;
	font-size: 1.7em;
	font-weight: 900;
	text-transform: uppercase;
	text-shadow: 0 0 0.5em rgba(0,182,237,0.75);
	float: none;
	background-color: rgba(255, 255, 255, 0);
	text-align: right;
	position: relative;
	top: 5em;
	padding: 5px 1em 1em 5.5em;
	list-style: none;
}
.intro {
	width: 100vw;
	height: 28.125vw; /* 16:9 Verhältnis */
	background-color: #FFF;
	background-image: url(bilder/LogoKerl.png);
	background-size: auto 80%;
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	overflow: hidden;
}
.intro-image {
	width: auto;
	height: auto;
}
.bgvideo {
	width: 100%;
	height: auto;
	object-fit: cover;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.motto {
	background-color: #164194;
	padding: 0.5em 0.7em 0.5em 0.7em;
	width: auto;
	margin-top: 0em;
	text-align: center;
	position: relative;
	z-index: 3;
	border-top: 0.2em solid #FFF;
	border-bottom: 0.2em solid #FFF;
	box-shadow: 0 0 0.5em rgba(22,65,148,0.75), inset 0 0 1em rgba(0,0,0,0.5);
}
.quality {
	width: auto;
	margin-top: 0em;
	text-align: center;
	position: relative;
	z-index: 3;
	font-family: 'Rubik', 'Arial Black', 'Arial', sans-serif;
	font-size: 3em;
	font-weight: 900;
	font-style: italic;
	text-shadow: 0 0 0.2em rgba(22,65,148,0.75);
	color: #FFF;
}
.team {
	width: auto;
	margin-top: 0.35em;
	text-align: center;
	position: relative;
	z-index: 3;
    font-family: 'Rubik', 'Arial', sans-serif;
	font-size: 1.5em;
	font-weight: 600;
	color: #164094;
}
.slogan {
	width: auto;
	margin-top: 0.95em;
	margin-bottom: 1.85em;
	text-align: left;
	position: relative;
	z-index: 3;
}
.container {
	width: 90%;
	max-width: 1400px;
	margin: auto;
}
.background-one {
	width: 100%;
	padding: 5em 0 5em 0;
	background-image:
	  linear-gradient(
		to bottom,
		rgba(0,182,237,0)	0%,
		rgba(255,255,255,0) 100%
	  );
	background-size: 100% 100%;
	background-repeat: no-repeat;
	overflow: hidden;
}
.background-two {
	width: 100%;
	padding: 5em 0 5em 0;
	background-color: rgba(255,255,255,1);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	overflow: hidden;
}
p {
    font-family: 'Rubik', 'Arial', sans-serif;
	font-size: 1.3em;
	font-weight: 400;
	color: #164194;
	line-height: 1.5em;
}
h1 {
	font-family: 'Rubik', 'Arial Black', 'Arial', sans-serif;
	font-size: 4em;
	font-weight: 900;
	text-transform: uppercase;
	color: #164194;
}
h2 {
	font-family: 'Rubik', 'Arial Black', 'Arial', sans-serif;
	font-size: 4em;
	font-weight: 900;
	text-transform: uppercase;
	text-shadow: 0 0 0.2em rgba(22,65,148,0.75);
	color: #FFF;
	hyphens: auto;
	overflow-wrap: break-word;
}
h3 {
    font-family: 'Rubik', 'Arial', sans-serif;
	font-size: 3em;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: #FFF;
	margin-top: -1em;
	hyphens: auto;
	overflow-wrap: break-word;
}
h4 {
    font-family: 'Rubik', 'Arial', sans-serif;
	font-size: 1.7em;
	font-weight: 600;
	color: #164194;
}
h5 {
	font-family: 'Rubik', 'Arial Black', 'Arial', sans-serif;
	font-size: 3em;
	font-weight: 900;
	font-style: italic;
	text-shadow: 0 0 0.2em rgba(0,0,0,0.75);
	color: #FFF;
}
h6 {
    font-family: 'Rubik', 'Arial', sans-serif;
	font-size: 1.5em;
	font-weight: 600;
	color: #FFF;
	margin-top: -3em;
}
#italic-unset {
	font-style: italic;
	text-transform: unset;
}
main {
	position: relative;
	z-index: 2;
}
.zoom-light {
	transition: transform 0.6s ease-in-out;
}
.zoom-light:hover {
	transform: scale(1.05, 1.05);
}
.zoom {
	transition: transform 0.6s ease-in-out;
}
.zoom:hover {
	transform: scale(1.1, 1.1);
}
.zoom-rot {
	rotate: 0deg;
	transition: transform 0.6s ease-in-out, rotate 0.6s ease-in-out;
	max-width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}
.zoom-rot:hover {
	rotate: 2deg;
	transform: scale(1.1, 1.1);
}
.img-zoom-top {
	width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.6s ease-in-out;
}
.img-zoom-top:hover {
    transform: scale(1.1);
  }
.img-zoom {
	width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.6s ease-in-out;
}
.img-zoom:hover {
    transform: scale(1.1);
  }
  .img-rad {
	border-radius: 100%;
	box-shadow: 0em 0.2em 0.5em rgba(0, 0, 0, 0.0);
	transition: transform 0.6s ease-in-out, box-shadow 0.6s ease-in-out;
}
.img-rad:hover {
	border-radius: 100%;
	transform: scale(1.05, 1.05);
	box-shadow: 0em 0.25em 1em rgba(0, 0, 0, 0);
}
.zettel {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0.5em;
	background: white;
	box-shadow: 0 0.3em 0.6em rgba(22, 65, 148, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	box-sizing: border-box;
}
.zettel:hover {
	transform: scale(1.075);
	box-shadow: 0 0.6em 1.2em rgba(22, 65, 148, 0.2);
}
.altbild {
	max-width: 100%;
	padding: 10%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}
.white {
	position: relative;
	isolation: isolate;
	z-index: 0;
	overflow: visible;
}
.white::before {
	content: "";
	position: absolute;
	inset: -10%;
	background: radial-gradient(
	  ellipse at center,
	  rgba(255,255,255,0.5) 0%,
	  rgba(255,255,255,0.5) 50%,
	  rgba(255,255,255,0) 75%
	);
	filter: blur(5em);
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: -2;
}
.turquoise {
	position: relative;
	isolation: isolate;
	z-index: 0;
	overflow: visible;
}
.turquoise::before {
	content: "";
	position: absolute;
	inset: -10%;
	background: radial-gradient(
	  ellipse at center,
	  rgba(0,175,203,0.5) 0%,
	  rgba(212,237,252,0.5) 50%,
	  rgba(212,237,252,0) 75%
	);
	filter: blur(5em);
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: -1;
}
.green {
	position: relative;
	isolation: isolate;
	z-index: 0;
	overflow: visible;
}
.green::before {
	content: "";
	position: absolute;
	inset: -10%;
	background: radial-gradient(
	  ellipse at center,
	  rgba(0,123,61,0.5) 0%,
	  rgba(196,219,155,0.5) 50%,
	  rgba(196,219,155,0) 75%
	);
	filter: blur(5em);
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: -1;
}
.violet {
	position: relative;
	isolation: isolate;
	z-index: 0;
	overflow: visible;
}
.violet::before {
	content: "";
	position: absolute;
	inset: -10%;
	background: radial-gradient(
	  ellipse at center,
	  rgba(166,33,75,0.5) 0%,
	  rgba(248,201,223,0.5) 50%,
	  rgba(248,201,223,0) 75%
	);
	filter: blur(5em);
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: -1;
}
.orange {
	position: relative;
	isolation: isolate;
	z-index: 0;
	overflow: visible;
}
.orange::before {
	content: "";
	position: absolute;
	inset: -10%;
	background: radial-gradient(
	  ellipse at center,
	  rgba(239,125,0,0.5) 0%,
	  rgba(253,213,165,0.5) 50%,
	  rgba(253,213,165,0) 75%
	);
	filter: blur(5em);
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: -1;
}
.box_single {
	width: 100%;
	margin-left: 0;
	float: left;
}
.box_double-l {
	width: 49%;
	margin-right: 2%;
	float: left;
}
.box_double-r {
	width: 49%;
	float: left;
}
.box_double-lr {
	width: 49%;
	margin-left: 2%;
	float: right;
}
.box_double-rl {
	width: 49%;
	float: right;
}
.box_triple-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	column-gap: 5%;
	row-gap: 2em;
}
.box_triple {
	width: 30%;
	display: flex;
	justify-content: flex-start;
}
.box_triple-l {
	width: 30%;
	margin-right: 5%;
	float: left;
	display: flex;
	justify-content: flex-start;
}
.box_triple-m {
	width: 30%;
	margin-right: 5%;
	float: left;
	display: flex;
	justify-content: center;
}
.box_triple-r {
	width: 30%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: flex-end;
}
.box_tripleduo {
	width: 60%;
	margin-right: 5%;
	margin-bottom: 1em;
	float: left;
}
.box_quad-1and3 {
	width: 23.5%;
	margin-top: 1em;
	margin-right: 2%;
	float: left;
}
.box_quad-2 {
	width: 23.5%;
	margin-top: 1em;
	margin-right: 2%;
	float: left;
}
.box_quad-4 {
	width: 23.5%;
	margin-top: 1em;
	float: left;
}
.box_quad_double-l {
	width: 48%;
	margin-right: 4%;
	float: left;
}
.box_quad_double-r {
	width: 48%;
	float: left;
}
.box_six-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	column-gap: 2%;
	row-gap: 1em;
}  
.box_six {
	width: 15%;
	display: flex;
	justify-content: center;
}
.box_bild {
    position: relative;
    display: inline-block;
    overflow: hidden;
	width: 100%;
	margin-top: 1em;
	margin-left: 0;
	text-align: center;
	float: left;
	max-height: 100%;
}
.box_produkt {
    position: relative;
    display: inline-block;
    overflow: visible;
	width: 100%;
	margin-top: 1em;
	margin-bottom: 1em;
	text-align: center;
	float: left;
	max-height: 100%;
}
.box_perso {
	width: 70%;
	margin-top: 1em;
	margin-left: 10%;
	text-align: center;
	float: left;
}
.box_head {
	width: 20em;
	margin-top: 1em;
	margin-left: calc(50% - 10em);
	text-align: center;
	float: left;
}
.headline {
	width: 100%;
	padding-top: 0;
	margin-top: 1em;
	margin-bottom: -1em;
	margin-left: 0;
	text-align: left;
	float: left;
}
.box_text {
	width: 100%;
	padding-top: 0;
	margin-top: 0;
	margin-bottom: 1.5em;
	margin-left: 0;
	margin-right: 0;
	text-align: left;
	float: left;
}
.box_text-s {
	width: 70%;
	padding-top: 0;
	margin-top: 0;
	margin-bottom: 1.5em;
	margin-left: 15%;
	margin-right: 0;
	text-align: left;
	float: left;
}
.box_text-c {
	width: 80%;
	padding-top: 0;
	margin-top: 0;
	margin-bottom: 1.5em;
	margin-left: 10%;
	margin-right: 0;
	text-align: center;
	float: left;
}
.box_text-lr {
	width: 100%;
	padding-top: 0;
	margin-top: 0;
	margin-bottom: 1.5em;
	margin-left: 0;
	margin-right: 0;
	text-align: right;
	float: left;
}
.border-container {
	position: relative;
	width: 80%;
	margin-left: 10%;
	height: 0;
	padding-bottom: 80%;
	overflow: hidden;
}
.border-rad {
	position: absolute;
	top: 0;
	left: 0;
 	width: calc(100% - 4px);
	height: calc(100% - 4px);
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
	border: 2px solid black;
	border-radius: 50%;
 	text-align: center;
}
.icon {
	width: 5em;
	margin-top: 3em;
}
.spacer {
	width: 100%;
	height: 2em;
	float: left;
}
.spacer-big {
	width: 100%;
	height: 4em;
	float: left;
}
.line {
	width: 100%;
	border-top: 0.2em solid #FFF;
	margin-top: 2em;
	float: left;
}
button {
	font-size: 1.3em;
    background-color: rgba(0,182,237,0.25);
    border: 2px solid rgba(255,255,255,0.00);
    color: #FFF;
    padding: 10px 20px;
	margin-bottom: 2em;
    border-radius: 0;
    cursor: pointer;
    transition: border 0.6s ease-in-out; /* Hover-Effekt */
}
button:hover {
    border: 2px solid rgba(255,255,255,1.00);
}
button:active {
    box-shadow: inset 0px 2px 10px rgba(0,0,0,0.25); /* Schatten nach innen beim Klicken */
}
.toggle-button {
	border: 2px solid #FFF;
	transition: color 0.6s ease-in-out;
}
.toggle-button:hover {
	color: #164094;
	transition: color 0.6s ease-in-out;
}
.button-turquoise {
	border: 2px solid #FFF;
	background-color: rgba(0,175,203,0.25);
	transition: background-color 0.6s ease-in-out;
}
.button-turquoise:hover {
	color: #FFF;
	background-color: rgba(0,175,203,0.75);
	transition: background-color 0.6s ease-in-out;
}
.button-green {
	border: 2px solid #FFF;
	background-color: rgba(0,123,61,0.25);
	transition: background-color 0.6s ease-in-out;
}
.button-green:hover {
	color: #FFF;
	background-color: rgba(0,123,61,0.75);
	transition: background-color 0.6s ease-in-out;
}
.button-violet {
	border: 2px solid #FFF;
	background-color: rgba(166,33,75,0.25);
	transition: background-color 0.6s ease-in-out;
}
.button-violet:hover {
	color: #FFF;
	background-color: rgba(166,33,75,0.75);
	transition: background-color 0.6s ease-in-out;
}
.button-orange {
	border: 2px solid #FFF;
	background-color: rgba(239,125,0,0.25);
	transition: background-color 0.6s ease-in-out;
}
.button-orange:hover {
	color: #FFF;
	background-color: rgba(239,125,0,0.75);
	transition: background-color 0.6s ease-in-out;
}
.toggle-content {
	overflow: hidden;
	transition: height 0.6s ease-in-out;
	height: 0;
	padding: 0 2em 0 2em;
	box-shadow: inset 0 0 0 0.2em rgba(255,255,255,0.25);
	background-color: rgba(255,255,255,0.25);
}
.toggle-content-turquoise {
	overflow: hidden;
	transition: height 0.6s ease-in-out;
	height: 0;
	padding: 0 2em 0 2em;
	box-shadow: inset 0 0 0 0.2em rgba(212,237,252,0.25);
	background: linear-gradient(
		90deg,
	  rgba(212,237,252,0.25) 50%,
	  rgba(212,237,252,0.25) 75%,
	  rgba(0,175,203,0.25) 100%
	);
}
.toggle-content-green {
	overflow: hidden;
	transition: height 0.6s ease-in-out;
	height: 0;
	padding: 0 2em 0 2em;
	box-shadow: inset 0 0 0 0.2em rgba(196,219,155,0.25);
	background: linear-gradient(
		90deg,
	  rgba(196,219,155,0.25) 50%,
	  rgba(196,219,155,0.25) 75%,
	  rgba(0,123,61,0.25) 100%
	);
}
.toggle-content-violet {
	overflow: hidden;
	transition: height 0.6s ease-in-out;
	height: 0;
	padding: 0 2em 0 2em;
	box-shadow: inset 0 0 0 0.2em rgba(248,201,223,0.25);
	background: linear-gradient(
		90deg,
	  rgba(248,201,223,0.25) 50%,
	  rgba(248,201,223,0.25) 75%,
	  rgba(166,33,75,0.25) 100%
	);
}
.toggle-content-orange {
	overflow: hidden;
	transition: height 0.6s ease-in-out;
	height: 0;
	padding: 0 2em 0 2em;
	box-shadow: inset 0 0 0 0.2em rgba(253,213,165,0.25);
	background: linear-gradient(
	  90deg,
	  rgba(253,213,165,0.25) 50%,
	  rgba(253,213,165,0.25) 75%,
	  rgba(239,125,0,0.25) 100%
	);
}
footer {
	width: 100%;
	background-color: #164194;
	background-size: 100% 100%;
	overflow: hidden;
}
footer ul {
	position: relative;
	float: left;
	left: 50%;
	margin-right: auto;
	margin-left: auto;
}
footer ul li {
    font-family: 'Rubik', sans-serif;
	font-size: 1em;
	font-weight: 400;
	color: #00B6ED;
	float: left;
	position: relative;
	right: 50%;
	margin-right: 10px;
	padding: 5px 10px;
	list-style: none;
	text-align: left;
}
.box_icon {
    width: 2.2em;
	padding-right: 1em;
	padding-left: 0em;
	float: left;
}
.icon-text {
    height: 1em;
	padding-right: 0.5em;
	margin-top: -0.25em;
	margin-bottom: 0em;
}
.box_contact {
	width: 100%;
	padding-top: 5em;
	padding-bottom: 5em;
	float: left;
	border-top: 0.2em solid #FFF;
	border-bottom: 0.2em solid #FFF;
	box-shadow: 0 0 0.5em rgba(22,65,148,0.75), inset 0 0 1em rgba(0,0,0,0.5);
}
.box_contact-triple {
	width: 100%;
    font-family: 'Rubik', sans-serif;
	font-size: 1.3em;
	font-weight: 400;
	color: #FFF;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
}
.box_legal {
	width: 100%;
	padding-top: 5em;
	padding-bottom: 5em;
	float: left;
	background-color: #0f265c;
}

@media only screen and (max-width: 1000px) {

	/*
#hamburg {
    font-family: 'Rubik', sans-serif;
	font-size: 4em;
	font-weight: 900;
	color: #FFF;
	text-shadow: 0 0 0.5em rgba(0,182,237,0.75);
	position: fixed;
	top: -0.7em;
	right: 0.2em;
	transform: translateY(50%) scaleY(1);
	display: block;
	cursor: pointer;
	transition: transform 0.15s ease;
	display: block;
}

#hamburg.animate {
	transform: translateY(50%) scaleY(0);
}
#close {
    font-family: 'Rubik', sans-serif;
	font-size: 4em;
	font-weight: 900;
	color: #FFF;
	text-shadow: 0 0 0.5em rgba(0,182,237,0.75);
	position: fixed;
	top: -0.6em;
	right: 0.25em;
	transform: translateY(50%) scaleY(0);
	cursor: pointer;
	transition: transform 0.15s ease;
	display: block;
}

#close.animate {
	transform: translateY(50%) scaleY(1);
}

#hamburg.animate {
	transform: translateY(50%) scaleY(0);
}
#navi ul {
	position: relative;
	text-align: right;
	float: none;
	top: 7em;
	right: 1em;
	transform: translateY(-50%) scaleY(0);
	transition: transform 0.3s ease;
}
#navi ul.show {
	transform: translateY(0) scaleY(1);
}
#navi ul li {
	float: none;
	background-color: rgba(255, 255, 255, 0);
	text-align: right;
	position: relative;
	top: 0;
	padding: 5px 6% 1em 1.5em;
	list-style: none;
}
*/
.box_double-l {
	width: 100%;
	margin-right: 0%;
	float: left;
}
.box_double-r {
	width: 100%;
	float: left;
}
.box_double-lr {
	width: 100%;
	margin-left: 0%;
	float: right;
}
.box_double-rl {
	width: 100%;
	float: right;
}
.box_triple-wrapper {
	column-gap: 5%;
	row-gap: 1em;
}
.box_triple {
	width: 47.5%;
}
.box_triple-l {
	width: 100%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: center;
}
.box_triple-m {
	width: 100%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: flex-end;
}
.box_triple-r {
	width: 100%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: center;
}
.box_six-wrapper {
	column-gap: 5%;
	row-gap: 0em;
}
.box_six {
    width: 30%;
}
.box_contact-triple {
	width: auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1em;
}

}

@media only screen and (max-width: 800px) {

html {
	font-size: 77%;
}
.box_double-l {
	width: 100%;
	margin-right: 0%;
	float: left;
}
.box_double-r {
	width: 100%;
	float: left;
}
.box_double-lr {
	width: 100%;
	margin-left: 0%;
	float: right;
}
.box_double-rl {
	width: 100%;
	float: right;
}
.box_triple-wrapper {
	column-gap: 5%;
	row-gap: 1em;
}
.box_triple {
	width: 47.5%;
}
.box_triple-l {
	width: 100%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: center;
}
.box_triple-m {
	width: 100%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: flex-end;
}
.box_triple-r {
	width: 100%;
	margin-right: 0%;
	float: left;
	display: flex;
	justify-content: center;
}
.box_six-wrapper {
	column-gap: 5%;
	row-gap: 0em;
}
.box_six {
    width: 30%;
}

}