/*
768 ipad old
810 ipad new
960 max
1060 container
*/

@font-face {
    font-family: 'Rajdhani';
    src: url("Rajdhani-Light.ttf");
    font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: 'Rajdhani';
    src: url("Rajdhani-Regular.ttf");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: 'Rajdhani';
    src: url('Rajdhani-SemiBold.ttf');
    font-style: normal;
    font-weight: 600;
}
@font-face {
    font-family: 'Rajdhani';
    src: url('Rajdhani-Bold.ttf');
    font-style: normal;
    font-weight: 700;
}

:root {
	--body: #000000;
	
	--szNormal: 16px;
	--szSmaller: 14px;
	--szLarger: 18px;
	--szMedium: 20px;
	--szMediumLarge: 20px;
	--szLarge: 25px;
	--szReallyLarge: 36px;
	--szVeryLarge: 40px;
	--szEvenLarger: 45px;
	--szHuge: 50px;
	--szMassive: 60px;
	
	--wFull: 1060px;
	--w1col: 360px;
	--w2col: 700px;
	--w3col: 1060px;
	--wGap: 20px;
	
	--vpLarge: 1060px;
	--vpMedium: 810px;
	--vpSmall: 640px;

	--fontSans: "Rajdhani";
	
	--bgGrey: #ebebeb;
	--bgFooter: #555;
	
	--colorRed: #e0191a;
	
	--colorGP: #1d1d1b;
	--colorGPonHilite: white;
	--colorHilite: #e30613;
	--colorHilite2: #f31623;
	--colorLine: #1d1d1b;
	--overlayGP: rgba(29,29,27,0.55);
	--overlayHoverGP: rgba(29,29,27,0.85);
	/*
	--colorGP: #062650;
	--colorHilite: #FFED00;
	--colorLine: #062650;
	
	
	--overlayGP: rgba(6,38,80,0.55);
	--overlayHoverGP: rgba(6,38,80,0.85);
	*/
	
	
}
@media screen and (max-width:768px) {
	:root {
		--szMassive: 46px;
		--szHuge: 36px;
		--szLarge: 20px;
		--szQuiteLarge: 24px;
		--szVeryLarge: 28px;
	}
	
}

/* Box-Sizing immer inkl. padding */
* {
	box-sizing:border-box;
}

html { 
	margin:0;
	padding:0;
	scroll-behavior:smooth;
}
body {
	font-family: Rajdhani,sans-serif,serif;
	font-weight:300;
	font-size:var(--szNormal);
	line-height:1.3;
	margin:0;
	padding:0;
	color:var(--body);
	text-rendering:optimizeLegibility;
}

main,footer,section,header,p,figure,aside {
	margin:0;padding:0;
	display:block;
}
section,footer {
	position:relative;
}
figure {
	display:inline-block;
}
table {
	border-collapse:collapse;
	width:100%;
}
td {
	padding:5px;
	vertical-align:top;
}
a {
	color: inherit;
	text-decoration:none;
	border:none;
	outline:none;
}
a img {
	border:none;
	outline:none;
}
b,strong {
	font-weight:600;
}
h1,h2,h3,h4,h5 {
	font-family:inherit;
	margin:0;padding:0;
	line-height:1.1;
	font-weight:400;
}
h1 { font-size:var(--szVeryLarge); hyphens:auto; }
h2 { font-size:var(--szLarge; hyphens:auto); }
h3 { font-size:var(--szMediumLarge); }
h4 { font-size:var(--szNormal); }
h5 { font-size:var(--szNormal); }

address {
	font-style:normal;
	font-size:inherit;
	font-weight:inherit;
	font-family:inherit;
}

/* -- layout -- */
.container {
	width:100%;
	max-width:var(--wFull);
	margin:0 auto;
	position:relative;
}
@media all and (max-width:1059px) {
	.container {
		padding:0 1rem;
	}
}

.container-layer {
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	z-index:500;
}
.flex-container {
	display:flex;
	height:100%;
}
.flex-container.text-center {
	flex-direction:column;
	align-items:center;
	justify-content:center;
}
.row {
	display:flex;
	flex-wrap:nowrap;
	justify-content:flex-start;
	align-items:stretch;
}
.row.wrap {
	flex-wrap:wrap;
}
.row.middle {
	align-items:center;
}
.row.bottom {
	align-items:flex-end;
}
.col {
	flex:1 1 100%;
}
.column {
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;
}
.center-column,
.column-center {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
}

.col-1,.col-md-1,.col-sm-1 { flex:1 0 8.33334%; }
.col-2,.col-md-2,.col-sm-2 { flex:0 0 16.66667%; }
.col-3,.col-md-3,.col-sm-3 { flex:0 0 25%; }
.col-4,.col-md-4,.col-sm-4 { flex:0 0 33.33334%; }
.col-5,.col-md-5,.col-sm-5 { flex:0 0 41.6667%; }
.col-6,.col-md-6,.col-sm-6 { flex:0 0 50%; }
.col-7,.col-md-7,.col-sm-7 { flex:0 0 58.33334%; }
.col-8,.col-md-8,.col-sm-8 { flex:0 0 66.66667%; }
.col-9,.col-md-9,.col-sm-9 { flex:0 0 75%; }
.col-10,.col-md-10,.col-sm-10 { flex:0 0 83.33334% }
.col-11,.col-md-11,.col-sm-11 { flex:0 0 91.66667%; }
.col-12,.col-md-12,.col-sm-12 { flex:0 1 100%; }

img.picture {
	max-width:100%;
	height:auto;
}
img.backdrop {
	width:100%;
	height:auto;
}