html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary { display: block; }
body {
  font-family: Courier, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #000;
  background-color: #ffffff;
  margin: 0;
}

body {
	width: 100%;
	height: 100%;
	/*background: transparent url(img/bg.jpg) top left no-repeat;*/
	background-size: contain;
}
#bg {
	background: transparent url(img/bg.jpg) top left;
	background-size: 100% 100%;
	position: fixed; 
  	top: 0; 
  	left: 0; 
	min-width: 100%;
  	min-height: 100%;
}

h1 {
	margin: 10px 0 0 0;
	font-size: 1.87em;
	line-height: 1.3em;
}
h2 {
	margin: 2px 0 0 0;
	font-size: 1.3em;
	line-height: .9em;
}
h4 {
	font-size: 1.2em;
	line-height: 1.1em;
	margin: 0 0 4px 0;
	font-weight: normal;
}

ul {
	margin: 3px 0 0 0;
	padding: 0 0 0 12px;
	list-style-type: none;
}

ul li:before{ content:"-"; position:relative; left:-5px;}
ul li{ text-indent:-5px; }

img { border:0; }

#container {
	position: absolute;
	width: 100%;
	top: 50%;
}

#stage {
	position: relative;
	width: 950px;
	height: 700px;
	margin: -350px auto 0;
}

.txtBlock {
	float: left;
	position: relative;
	font-size: .85em;
	line-height: 1.2em;
}

#logo {
	width: 32%;
	height: 140px;
	left: 5%;
	top: 1%;
	padding: 0 0 0 65px;
	/*background: transparent url(img/logo.png) no-repeat;*/
}
#logo .txt {
	font-style: italic;
	color: #6da7b5;
	padding: 16px 0 0 0;
	font-size: 1.1em;
	line-height: 1.2em;
}

#drehbuchberatung {
	width: 46%;
	height: 113px;
	left: 7.5%;
	top: 0%;
	padding: 44px 0 0 28px;
	background: transparent url(img/bg_drehbuchberatung.png);
	background-size: 100% 100%;
}
#drehbuchberatung h4, #drehbuchberatung ul {
}

#drehbuchrecherchen {
	width: 44.5%;
	height: 135px;
	left: 0%;
	top: 3%;
	padding: 44px 20px 0 20px;
	background: transparent url(img/bg_drehbuchrecherchen.png);
	background-size: 100% 100%;
}
#drehbuchrecherchen h4, #drehbuchrecherchen ul {
	transform: rotate(-1.5deg);
}

#locationscouting {
	width: 38%;
	height: 180px;
	left: 4%;
	top: 4%;
	background: transparent url(img/bg_locationscouting.png);
	background-size: 100% 100%;
}
#locationscouting div {
	transform: rotate(-1.2deg);
}
#locationscouting a {
	position: relative;
	left: 53%;
	top: 50px;
	font-size: 1.1em;
	color: #d74325;
	transform: rotate(-2deg);
}
#locationscouting a:hover {
	color: #f00;
}

#gebrauchstexte {
	width: 29%;
	height: 135px;
	left: 10.5%;
	top: 5%;
	padding: 42px 20px 0 20px;
	background: transparent url(img/bg_gebrauchstexte.png);
	background-size: 100% 100%;
}
#gebrauchstexte h4, #gebrauchstexte ul {
	transform: rotate(1deg);
}

#drehbuchlektorate {
	width: 17%;
	height: 35px;
	left: 11%;
	top: 6%;
	padding: 15px 0 0 50px;
	background: transparent url(img/bg_drehbuchlektorate.png);
	background-size: 100% 100%;
}
#drehbuchlektorate h4 {
	transform: rotate(1.5deg);
}

#dokumentationen {
	width: 44%;
	height: 35px;
	left: 13%;
	top: 6%;
	padding: 24px 0 0 55px;
	background: transparent url(img/bg_dokumentationen.png);
	background-size: 100% 100%;
}
#dokumentationen h4 {
	transform: rotate(-1.5deg);
}

#recherchen {
	width: 36%;
	height: 120px;
	left: 15.5%;
	top: 6.5%;
	padding: 28px 0 0 30px;
	background: transparent url(img/bg_recherchen.png);
	background-size: 100% 100%;
}
#recherchen h4, #recherchen ul {
	transform: rotate(1.5deg);
}

#impressum {
	width: 20%;
	height: 20px;
	left: 11.5%;
	top: 7.5%;
	clear: both;
}
#impressum a {
	color: #000;
	font-size: 1.1em;
}
#impressum a:hover {
	color: #f00;
}

#impressumTxt {
	position: relative;
	width: 80%;
	left: 11.5%;
	top: 5%;
	clear: both;
}

@media (max-width: 970px) {
	#stage {
		width: 768px;
	}
	#gebrauchstexte {
		left: 5%;
		padding-left: 40px;
		padding-right: 20px;
	}
	#drehbuchberatung {
		left: 12%;
	}
	#drehbuchlektorate {
		width: 22%;
		left: 7%;
	}
	#dokumentationen {
		width: 52%;
		left: 9%;
		height: 28px;
		background-size: 100%;
	}
	#recherchen {
		width: 50%;
		left: 9%;
		top: 8%;
	}
	.txtBlock {
		font-size: .8em;
		line-height: 1.2em;
	}
}

@media (max-width: 768px) {
	#container {
		top: 0;
	}
	h4 {
		font-size: 1.1em;
	}
	#stage {
		width: 100%;
		margin: 0 auto;
	}
	.txtBlock {
		font-size: .9em;
		line-height: 1.2em;
		float: none;
		clear: both;
	}
	#logo, #drehbuchberatung, #drehbuchrecherchen, #locationscouting, #gebrauchstexte, #drehbuchlektorate, #dokumentationen, #recherchen, #impressum {
		width: 79%;
		left: 0%;
	}
	#logo {
		padding: 0 0 0 10px;
	}
	#drehbuchberatung {
		height: 120px;
	}
	#drehbuchrecherchen {
		height: 185px;
	}
	#gebrauchstexte {
		width: 70%;
		padding-right: 30px;
	}
	#dokumentationen {
		padding-top: 14px;
		height: 45px;
		background-size: 100% 100%;
	}
	#drehbuchlektorate {
		width: 160px;
		background-size: 100% 100%;
	}
	#recherchen {
		top: 9%;
		height: 190px;
	}
	#drehbuchrecherchen, #gebrauchstexte, #recherchen {
		left: 5%;
	}
	#impressum {
		top: 15%;
		left: 5%;
		padding: 0 0 20px 0;
	}

}

.cc_container .cc_btn {
background-color: #e4e4e4 !important; /* Farbe des Buttons */
color: #000 !important; /* Textfarbe des Buttons */
font: 0.7em/182% !important;
padding:5px !important; margin:10px 10px 0 0 !important;
}
 
.cc_container {
background: #000 !important; /* Hintergrundfarbe des gesamten Bereichs */
color: #fff !important; /* Schriftfarbe des gesamten Bereichs */
font: 1.0em/182% !important;
}
 
.cc_message {
color: #ffffff !important; /* Schriftfarbe des gesamten Bereichs */
font: 1.0em/182% !important;
}
 
.cc_container a {
/*color: #31a8f0 !important; /* Textlink-Farbe "Mehr Infos" */
font: 1.0em/182% !important;
}