@charset "UTF-8";
/* CSS Document */

* {
	margin: 0px;
	padding: 0px;
}

html {
	scroll-behavior: smooth;
}

body {
	background-color: #0D0D0D;
	color: #D9D9D9;
	margin-left: auto;
	margin-right: auto;
	cursor: url(../images/_cursor/_cursor_base.png) 10 10, auto;
}

a {
	height: inherit;
}

h1 {
	font-family: 'Barlow', sans-serif;
	font-weight: 700;
	text-align: left;
	font-size: 4.5vw;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-left: -0.25vw;
}

h2 {
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	text-align: left;
	letter-spacing: 3px;
	font-size: 2vw;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

h3 {
	font-family: 'Barlow', sans-serif;
	font-weight: 500;
	text-align: left;
	font-size: 1vw;
	line-height: 1.2;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	word-spacing: 0.1em;
}

h3.skillbubbles {
	text-align: center;
}

h4 {
	font-family: 'Barlow', sans-serif;
	font-weight: 500;
	text-align: left;
	font-size: 0.75vw;
	line-height: 1.2;
	letter-spacing: 0.1em;
	word-spacing: 0.1em;
}

p {
	font-family: 'Barlow', sans-serif;
	font-weight: 500;
	text-align: left;
	font-size: 2vw;
	line-height: 1.5;
	word-spacing: 2px;
}

strong {
    font-weight: 800;
}

a:link, a:visited {
	color: inherit;
    text-decoration: none;
    cursor: url(../images/_cursor/cursor_klick.png) 10 10, auto;
	font-family: 'Barlow', sans-serif;
}

a:link:active, a:visited:active {
	color: inherit;
	font-family: 'Barlow', sans-serif;
}

video {
	resize: inherit;
}



.logo {
	background-color: #0D0D0D;
	padding-left: 5vw;
	padding-right: 5vw;
	padding-top: 2vw;
	padding-bottom: 2vw;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	height: 3vw;
	top: 0;
	z-index: 100;
}

.logobox {
	background-image: url("../images/_corporate/aaronhahn_logo.svg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	float: right;
	height: 3vw;
	position: -webkit-relative;
	position: relative;
	width: 22.5vw;
	z-index: 100;
}

.boxtothetop {
	position: fixed;
	z-index: 10;
	right: 1.5vw;
	top: 1.5vw;
}

.boxarrowtop {
	background-image: url("../images/_corporate/animated-arrows.gif");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 3vw;
	height: 3vw;
}

.boxarrowback {
	background-image: url("../images/_corporate/animated-arrows_back.gif");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 6vw;
	height: 6vw;
	cursor: url(../images/_cursor/cursor_zurueck.png) 10 10, auto;
}

.trennlinie {
	height: 0.2vw;
	background-color: #D9D9D9;
}

.abstandbox {
	height: 1vw;
	background-color: transparent;
}

.spacer {
	height: 5vw;
	background-color: transparent;
}

.nav {
	background: rgba(255, 255, 255, 1.0);
	margin-bottom: 5vw;
	position: relative;
	z-index: 90;
}

.footer {
	position: sticky;
	margin-top: 5vw;
	max-width: 100vw;
}

.linkbox {
	height: 2.75vw;
	padding-top: auto;
	padding-left: 5vw;
	background-color: #0D0D0D;
	transition: 0.15s;
}

.linkbox:hover {
	background-color: #D9D9D9;
	color: #0D0D0D;
	padding-left: 6vw;
}

.content {
	margin-left: 5vw;
	margin-right: 5vw;
}

.projekte {
	display: table;
}

.textbox {
	width: 90vw;
}

.logokachelgruppe {
	height: 27vw;
}

.outlinebox {
	/* border-style: dashed;
	border-width: 0.05vw;
	border-color: #D9D9D9; */
	width: 8.9vw;
	height: 8.9vw;
	margin-bottom: 1vw;
	margin-right: 1vw;
	float: left;
}

.logokachel {
	width: 7vw;
	height: 7vw;
	margin-left: 1vw;
	margin-right: 1vw;
	margin-top: 1vw;
	margin-bottom: 1vw;
	opacity: 0.25;
	transition-duration: 0.25s;
}

.logokachel:hover {
	opacity: 1;
}

.bildkachel {
	width: 29vw;
	height: 29vw;
	margin-bottom: 1vw;
	margin-right: 1vw;
	float: left;
	transform: scale(1);
	transition-duration: 0.25s;
}

.bildkachel:hover {
	transform: scale(1.03);
}

.bildbox {
	width: 90vw;
	height: 50.625vw;
	margin-bottom: 1vw;
}

.bildboxthin {
	width: 90vw;
	height: 25.3125vw;
}

.bildboxbalken {
	width: 90vw;
	height: 0.2vw;
	margin-top: 0.5vw;
	margin-bottom: 0.5vw;
}

.textBoxLink {
	transition: 0.15s;
	display: inline;
}

.textBoxLink:hover {
	padding-left: 1vw;
}
