@charset "utf-8";
@font-face {
	font-family:"Font Awesome";
	src: url("src/fonts/fa-regular-400.ttf");
}
@font-face {
	font-family:"Lexend";
	src: url("src/fonts/Lexend.ttf");
}

* {
	margin: 0;
	padding: 0;
	font-family: "Lexend", Arial, sans-serif;
}
.mainWrapper {
	width: 100%;
    height: 100vh;
}
.logoFloat {
	position: absolute;
	top: 20px;
	right: 20px;
	max-width: 800px;
	width: calc(100% - 40px);
	z-index: 2;
}
.main {

padding: 100px 5% 0px 5%;
}
.sideWrapper {
	display: flex;
	flex-direction: row;
	flex-grow: 1;
	justify-content: space-between;
	align-content: stretch;
	margin-top: 5%;
}
.leftSide {
	width: 65%;
	padding: 0px 0px 40px 0px;
	color: #005a85;
	line-height: 50px;
	font-size: 20px;
	/* box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 41%); */
	background: #e7e7eb;
	position: relative;
	margin-right: 60px;
}
.rightSide {
	position: relative;
	width: 25%;
	padding: 20px;
	line-height: 30px;
	align-content: center;
}
h1 {
	width: 100%;
	font-size: 50px;
	margin-bottom: 20px;
	color: #005a85;
	/* background: #bcdd36; */
	display: inline;
	padding: 15px 5px;
}
h2 {
	font-size: 36px;
	font-weight: 600;
	color: #005a85;
	display: inline;
	background-color: #bcdd36;
	background-image: url("src/headings_ruler.png");
	background-size: cover;
	background-position: center left;
	padding: 15px 30px 15px 60px;
	/* font-weight: bold; */
	position: absolute;
	/* margin-top: -20px; */
	top: 15px;
	left: -40px;
	height: 52px;
	width: 324px;
	border: 1px solid white;
	display: inline-flex;
	align-items: center;
}
.contact {
	margin-left: 20px;
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: space-between;
	margin-top: 100px !important;
}
.contactBox {
	width: 100%;
}
.contact, .services {
	margin-top: 140px;
}
.services {

	margin-left: 110px;

/* -webkit-box-shadow: 0px 0px 8px 4px rgba(107,107,107,0.56); */

/* box-shadow: 0px 0px 8px 4px rgba(107,107,107,0.56); */
}
li:not(:last-child) {
   margin-bottom: 10px;
}
.impressum {
	width: 90%;
	margin: 100px auto 0 auto;
	text-align: center;
}
.bottomPic {
	z-index: -1;
	width: 100%;
	position:fixed;
	bottom: -50px;
}
ul {
	display: inline-block;
	width: 49.5%;
}
a {
    color: #0033cc;
}

h2::before {
	/* content: ''; */
	position: absolute;
	display: inline-block;
	/* z-index: 1; */
	vertical-align: middle;
	top: -20px;
	/* margin-top: -11px; */
	left: -8px;
	width: 0;
	border-width: 40px;
	border-style: solid;
	border-color: white #ffffff00 transparent #ffffff;
	visibility: unset !important;
	transform: rotate(352deg);
}
ul li:before {
	font-family: "Font Awesome";
	content: "\f54a";
	margin: 0 8px 0 -15px;
	color: #005a85;
	font-size: 30px;
	position: absolute;
	left: -30px;
}
ul li::marker {
	/* display: none !important; */
	color: transparent;
}
li {
	position: relative;
}
.rightSide h2 {
	color: white;
	width: 200px;
}


@media only screen and (max-width: 1800px){
	.logoFloat {
		top: 50px;
		width: 30%;
	}
	.services{
		margin-left:80px;
	}
	.leftSide{
		width: 70%;
	}
	.main {
		padding-right: 2%;
	}
	.contact {
		margin-left: 0;
	}
	ul {
		width: unset;
	}
	.firstList {
		margin-right: 80px;
	}
}

@media only screen and (max-width: 1400px){
	.mainWrapper {
		height: unset;
	}
	.logoFloat {
		top: 20px;
	}
	.sideWrapper {
		flex-direction: column;
	}
	.sideWrapper>div {
		width:94%;
	}
	.main {
		padding-right: 5%;
	}
	.rightSide {
		margin-top: 50px;
	}
	.contact {
		flex-direction: row;
	}
	.bottomPic {
		position: unset;
	}
	.services ul {
		width:40%;
	}
}
@media only screen and (max-width: 1000px){
	.services ul{
		width: 100%;
	}
	.secondList {
		margin-top: 10px;
	}
	h1 {
		font-size: 38px;
	}
	h2 {
		font-size: 34px;
	}
	.leftSide {
		width: 100% !important;
	}
}

@media only screen and (max-width: 800px){
	.services ul{
		width: 100%;
	}
	.leftSide, .firstList {
		margin-right: 0;
	}
}
@media only screen and (max-width: 550px){
	.services ul{
		width: 100%;
	}
	.leftSide, .firstList {
		margin-right: 0;
	}
	.contact {
		flex-direction: column !important;
	}
}