@charset "UTF-8";

@font-face{ 
	font-family: 'KGAllofMe';
	src: url('../fonts/KGAllofMe.eot');
	src: url('../fonts/KGAllofMe.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/KGAllofMe.woff') format('woff'),
		 url('../fonts/KGAllofMe.ttf') format('truetype'),
		 url('../fonts/KGAllofMe.svg#webfont') format('svg');
}

/*BASIC LAYOUT*/

html {
	width: 100%;
	height: 100%;
	}

body {
	width: 100%;
	height: 100%;
	font-family: 'KGAllofMe' !important;
	font-weight: normal;
	font-style: normal;
	line-height: 1.7;
	letter-spacing: 0.06em;
	color: #F3F3F3;
	background: #03060f;
	-webkit-font-smoothing: subpixel-antialiased;
	-webkit-text-size-adjust: none;
	}

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

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, picture, section {
	display: block;
	}

h1, h2, h3, h4, h5, h6 {
	font-size: 22px;
	font-weight: 400;
	margin: 15px 0 8px 0;
	text-align: left;
	}

fieldset {
  border: none;
  }

a {
  text-decoration: none;
  color: #bda87b;
  outline: none;
  }

a:hover {
  color: #ded1b6;
  }

img {
	max-width: 100%;
	height: auto;
	border: none;
	}

address {
	font-style: normal;
	}

.mobile {
	display: none;
	}

#wrap {
	position: absolute;
	width: 100%;
	height: auto !important;
	height: 100%;
	min-height: 100%;
	}

/* HEADER AREA */

#header {
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 1;
	}

#header #header-belt {
	position: relative;
	width: 100%;
	height: 100px;
	background: url(../Images/header.svg) repeat-x center;
	background-size: contain;
	background-color: #2a2a2a;
	z-index: 2;
	}
	
#header figure#label {
	position: relative;
	background: url(../Images/traktorkestar.svg) no-repeat center;
	background-size: contain;
	margin: 0 auto;
	width: 500px;
	height: 100px;
	}

#header figure#label a#homelink {
	display: block;
	width: 100%;
	height: 100%;
}
	
/* NAVIGATION */

nav#mainmenu {
	position: absolute;
	text-align: center;
	width: 100%;
	margin: -60px 0 0 0;
	padding: 0 0 5px 0;
	background: url(../Images/navigation.svg) no-repeat center;
	background-size: contain;
	height: 120px;
	}

nav li {
	display: inline;
	}

nav .container {
	margin: 58px 0 0 0;
	}

nav .container li {
	font-size: 22px;
	}

nav#mainmenu .firstitem {
	}

nav#mainmenu .item {
	}
	
nav#mainmenu .lastitem {
	}

nav#mainmenu .item:before, nav#mainmenu .lastitem:before {
	content: "*";
	padding: 0 6px 0 6px;
	}

nav a {
	color: #F3F3F3;
	}

nav a:hover, nav a.active {
	color: #bda87b;
	}

/* MAIN CONTENT */

main {
	position: relative;
	overflow: hidden;
	margin: 160px auto 0 auto;
	width: 80%;
	max-width: 900px;
	}
	
/*
main section:before {
	content: ' ';
	display: block;
	height: 160px;
	}
*/
	
main .frame {
	position: relative;
	margin: 40px 0 0 0;
	background:url(../Images/content_bg.png) repeat;
	padding: 5px 20px 10px 20px;
	border-style: solid;
	border-width: 5px;
	-moz-border-image: url(../Images/border.png) 20 repeat;
	-webkit-border-image: url(../Images/border.png) 20 repeat;
	-o-border-image: url(../Images/border.png) 20 repeat;
	border-image: url(../Images/border.png) 20 repeat;
	}

main .frame p {
	margin-bottom: 10px;
	}

main .frame .shoptext {
	position: absolute;
	left: 360px;
	bottom: 32px;
	}

main .mask-live .live {
	margin-bottom: 10px;
}

main .mask-live .live p {
	margin-bottom: unset;
}


/* FOOTER */

#padding-bottom {
	height: 180px;
	}
	
footer {
	position: fixed;
	width: 100%;
	bottom: 0;
	height: 100px;
	background: url(../Images/footer.svg) repeat-x center;
	background-size: contain;
	background-color: #2a2a2a;
	}

footer #footer-belt {
	position: relative;
	margin: 0 auto;
	max-width: 860px;
	}

footer a, footer figure {
	float: left;
	}

footer #footer-overlay {
	width: 260px;
	height: 86px;
	margin: 4px 0 0 40px;
	background: url(../Images/footer-overlay.svg) no-repeat center;
	background-size: contain;
	}

@media screen and (max-width: 800px) {
	footer #footer-overlay {
		display: none;
		}
	}

footer a {
	width: 60px;
	height: 60px;
	margin: 20px 0 0 40px;
	}

@media screen and (max-width: 900px) {
	footer a {
		margin: 20px 0 0 20px;
		}
	}

@media screen and (max-width: 600px) {
	footer a {
		width: 40px;
		height: 40px;
		margin: 30px 0 0 20px;
		}
	}

@media screen and (max-width: 400px) {
	footer a {
		margin: 30px 0 0 10px;
		}
	}

footer a#facebook {
	background: url(../Images/facebook.svg) no-repeat center;
	background-size: contain;
	margin: 20px 0 0 0;
	}

@media screen and (max-width: 900px) {
	footer a#facebook {
		margin: 20px 0 0 20px;
		}
	}

@media screen and (max-width: 600px) {
	footer a#facebook {
		margin: 30px 0 0 20px;
		}
	}

@media screen and (max-width: 400px) {
	footer a#facebook {
		margin: 30px 0 0 10px;
		}
	}

footer a#facebook:hover {
	background: url(../Images/facebook_on.svg) no-repeat center;
	}

footer a#instagram {
	background: url(../Images/insta.svg) no-repeat center;
	background-size: contain;
	}

footer a#instagram:hover {
	background: url(../Images/insta_on.svg) no-repeat center;
	}

footer a#youtube {
	background: url(../Images/youtube.svg) no-repeat center;
	background-size: contain;
	}

footer a#youtube:hover {
	background: url(../Images/youtube_on.svg) no-repeat center;
	}

footer a#spotify {
	background: url(../Images/spotify.svg) no-repeat center;
	background-size: contain;
	}

footer a#spotify:hover {
	background: url(../Images/spotify_on.svg) no-repeat center;
	}

footer a#apple_music {
	background: url(../Images/apple_music.svg) no-repeat center;
	background-size: contain;
	}

footer a#apple_music:hover {
	background: url(../Images/apple_music_on.svg) no-repeat center;
	}

footer a#newsletter {
	background: url(../Images/newsletter.svg) no-repeat center;
	background-size: contain;
	}

footer a#newsletter:hover {
	background: url(../Images/newsletter_on.svg) no-repeat center;
	}

/* BACKGROUND SLIDER */

#bg-slider {
	position: fixed;
	top: 100px;
	width: 100%;
	height: 100%;
	z-index: -1;
	}

/* STARTPAGE POPUP */

.startpage-popup {
	display: none;
	}

/*MOBILE DEVICES*/

@media screen and (max-width: 725px) {
	.desktop {
		display: none;
		}
	
	.mobile {
		display: block;
		}
		
	body {
		background: #03060f url(../Images/bg_mob.svg) repeat;
		background-size: 0.4em;
		}
		
	#header {
		position: absolute;
		}
	
	#mobilemenubar {
		text-align: center;
		height: 40px;
		}

	span#mobilemenutext {
		font-size: 22px;
		cursor: pointer;
		cursor: hand;
		}
	
	nav#mobilemenu {
		text-align: center;
		background: #2a2a2a;
		}

	nav#mobilemenu:after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		height: 4px;
		background: url(../Images/mobilenavigation.svg) repeat-x bottom;
		background-size: contain;
		}
	
	nav#mobilemenu .container {
		display: none;
		margin: 0 0 0 0;
		padding: 0 0 10px 0;
		background-color: #2a2a2a;
		}
	
	nav li {
		display: list-item;
		list-style: none;
		}
		
	main {
		width: auto;
		}
	
	main section:before {
		display: none;
		}
	
	main .frame {
		background: none;
		padding: 0 0 0 0;
		margin: 0 10px 0 10px;
		border: none;
		}
	
	main .frame .shoptext {
		position: inherit;
		left: inherit;
		bottom: inherit;
		}
	
	footer {
		position: absolute;
		}
	}

@media screen and (max-width: 500px) {
	
	#header #header-belt, #header figure#label {
		padding-bottom: 20%;
		height: 0;
		}
	
	#header figure#label {
		width: 100%;
		}
	
	nav#mainmenu:after {
		padding-bottom: 0.8%;
		height: 0;
		}
		
	main {
		
		}
	
	#padding-bottom {
		height: 240px;
		}
	}

/* TYPO3 CONTENT */

.csc-mailform {
  padding: 15px 0 0 0;
  }

.csc-mailform ol {
  list-style: none;
  }

.csc-mailform ol li label {
  line-height: 25px;
  }

/* NOSCRIPT INFO */

noscript {
  font-size: 22px;
  }