html, body {
	margin : 0;
	padding : 0;
}
body {
font-family: Verdana, "sans-serif";
    font-size : 1.2em;
	color : #EEEEEE;
	width : 100%;
    margin: 0 auto;
    max-width: 1200px;
	background-color: #323232;
}

a, a:link, a:visited, a:active {
    text-decoration: none;
	color: rgba(255,255,255,0.8);
    -webkit-transition: all 0.3s ease-in 0s;
	-moz-transition: all 0.3s ease-in 0s;
	-ms-transition: all 0.3s ease-in 0s;
	-o-transition: all 0.3s ease-in 0s;
	transition: all 0.3s ease-in 0s;
}
a:hover {
	color : rgba(0,186,198,1.00);
    font-size: 101%;
    -webkit-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
}
p {
	padding: 0px;
	margin-bottom: 4px;
}

h1 {
	color: rgba(204,255,0,0.8);
	margin-top: 0px;
	margin-bottom: 12px;
	text-decoration: none;
	font-size: 142%;
	padding: 0px;
	text-shadow: 5px 1px 10px rgba(232,255,84,0.8);
	line-height: 100%;
	letter-spacing: 0.03em;
	font-weight: lighter;
}

h2 {
	font-size: 96%;
	/*color: rgba(76,76,76,1.00);*/
    color: rgba(0,255,255,1);
	font-weight: normal;
	margin: 0px;
	font-style: normal;
	padding-bottom: 5px;
	text-shadow: 0px 1px 0px rgba(0,0,0,0.8);
	line-height: 114%;
	letter-spacing: 2px;
}
h2 a:hover {
	color: rgba(0,255,255,1);
	text-shadow: 0px 0px 5px rgba(255,255,255,1);
}
h3 {
	font-size: 80%;
	color: rgba(204,255,0,0.8);
	margin: 0;
	font-style: normal;
    font-weight: 300;
	padding: 0 0 2px 0;
	line-height: 140%;
	letter-spacing: 0.1em;
	/*text-shadow: 3px 3px 10px rgba(255,0,253,0.80);*/
}
h3 a {
	text-shadow: 1px 1px 10px rgba(0,0,0,0.4);
	color: rgba(204,255,0,1);
	-webkit-transition: all 0.5s ease-in 0s;
	-moz-transition: all 0.5s ease-in 0s;
	-ms-transition: all 0.5s ease-in 0s;
	-o-transition: all 0.5s ease-in 0s;
	transition: all 0.5s ease-in 0s;
}
h3 a:hover {
	text-shadow: 0px 0px 5px rgba(255,255,255,1);
	color: rgba(175,59,0,1);
	-webkit-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
	font-size: 120%;
}

.links h3, .links p {
	margin: 2.4em 0 2.2em 0 !important;
	padding: 0 1em;
	line-height: 220% !important;
}

#header {
	text-align: center;
	font-size : 0.8em;
	color : #fff;
	width: 90% !important;
	padding: 2em 0 0.3em 0;
	display: block;
	margin: 5px auto 0px auto;
	position: relative;
	font-style: normal;
	clear: both;
}
#inner-1 {
	text-align: center;
	width: 420px;
	height: 330px;
	top: 16%;
	left: 10%;
	position: relative;
	float: left;
	margin: 0 auto;
	background-color: rgba(51,255,0,0);
	padding: 5px;
}
#textbottom {
	text-align: center;
	font-size : 0.8em;
	color : #999999;
	width: 90% !important;
	padding: 10px;
	display: block;
	margin: 2em auto 0px auto;
	position: relative;
	font-style: normal;
	clear: both;
}

#outer-red {
	border-radius: 20px;
	margin: 0 auto;
	width: 960px;
	height: 450px;
    z-index: -999!important;
	background: #F33E4F; /* Old browsers */

background: -moz-linear-gradient(top,  #F33E4F 0%, #FF7F50 100%); /* FF3.6+ */

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F33E4F), color-stop(100%,#FF7F50)); /* Chrome,Safari4+ */

background: -webkit-linear-gradient(top,  #F33E4F 0%,#FF7F50 100%); /* Chrome10+,Safari5.1+ */

background: -o-linear-gradient(top,  #F33E4F 0%,#FF7F50 100%); /* Opera 11.10+ */

background: -ms-linear-gradient(top,  #F33E4F 0%,#FF7F50 100%); /* IE10+ */

background: linear-gradient(to bottom,  #F33E4F 0%,#FF7F50 100%); /* W3C */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F33E4F', endColorstr='#FF7F50',GradientType=0 ); /* IE6-9 */

	padding: 4px;
	margin-top: 20px;
	box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-webkit-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-moz-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-ms-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}

/* Fade in animation (Webkit only) */
@keyframes slideIn {
    from { opacity: 0; left:-320px; transform:scale(0.8);}
    to   { opacity: 1; transform:scale(1);}
}
/* Firefox */
@-moz-keyframes slideIn {
    from { opacity: 0; left:-320px; -moz-transform:scale(0.8);}
    to   { opacity: 1; -moz-transform:scale(1);}
}
/*Safari and Chrome*/
@-webkit-keyframes slideIn {
    from { opacity: 0; left:-320px; -webkit-transform:scale(0.8);}
    to   { opacity: 1; -webkit-transform:scale(1);}
}


#orange {
	border-radius: 20px;
	margin: 0 auto;
	width: 100%;
	max-width: 960px;
	height: auto;
    min-height: 420px;
	background-color: rgba(255,89,0,0.80);
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}
.inner {
    margin: 0;
}
.inner h1 {padding: 40px 0 20px 0;}
.innerlinks {
    line-height: 200%;
    font-size: 110%;
    word-break: normal;
    word-spacing: 0.03em;
    padding:20px;
}
.inner a {break-after: always;}
.inner p {color:rgba(255,255,255,1.00) !important;
padding-bottom: 6%;}

#outerdef {
	margin: 0 auto;
	width: 96%;
	max-width: 1200px;
	height: auto;
    min-height: 420px;
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}
#innerimp {
    margin: 20px auto;
	text-align: center;
	font-size : 0.8em;
	color : #FFFFFF;
	max-width: 1200px;
	width: 96%;
	padding: 30px;
	background-color: rgba(255,51,0,0.0);
	line-height: 1.4em;
}

#outer-blue {
	border-radius: 20px;
	margin: 0 auto;
	width: 960px;
	height: 450px;
	background: #8A2BE2; /* Old browsers */
background: -moz-linear-gradient(top,  #0078EF 0%, #8A2BE2 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0078EF), color-stop(100%,#8A2BE2)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #0078EF 0%,#8A2BE2 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #0078EF 0%,#8A2BE2 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #0078EF 0%,#8A2BE2 100%); /* IE10+ */
background: linear-gradient(to bottom,  #0078EF 0%,#8A2BE2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0078EF', endColorstr='#8A2BE2',GradientType=0 ); /* IE6-9 */
	padding: 4px;
	margin-top: 20px;
	box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-webkit-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-moz-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-ms-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);	
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}
#outer-green {
	border-radius: 20px;
	margin: 0 auto;
	width: 960px;
	height: 450px;
	background: #7FFF00; /* Old browsers */
background: -moz-linear-gradient(top,  #7FFF00 0%, #00BD61 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7FFF00), color-stop(100%,#00BD61)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #7FFF00 0%,#00BD61 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #7FFF00 0%,#00BD61 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #7FFF00 0%,#00BD61 100%); /* IE10+ */
background: linear-gradient(to bottom,  #7FFF00 0%,#00BD61 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7FFF00', endColorstr='#00BD61',GradientType=0 ); /* IE6-9 */
	padding: 4px;
	margin-top: 20px;
	box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-webkit-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-moz-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-ms-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);	
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}
#outer-orange {
	border-radius: 20px;
	margin: 0 auto;
	width: 95%;
	max-width: 960px;
	height: auto;
	background-color: rgba(255,89,0,0.80);
	padding: 4px 4px 4px 40px;
	/*box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-webkit-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-moz-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-ms-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);*/
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}

#outer_pat-blue {
	border-radius: 20px;
	margin-right: auto;
	margin-left: auto;
	width: 960px;
	height: 450px;
	background:url(data:bilder/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAANUlEQVQIHWNgePf/P8NXID56+T8DE9N/BoYvQM75u/8ZIhMggmAZEAckCJIEKwMpB2kDagcADyQmyzFo8w4AAAAASUVORK5CYII=);
	padding: 4px;
	margin-top: 40px;
	box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-webkit-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-moz-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	-ms-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
	
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}
#outer-grau {
    border-radius: 20px;
    margin-right: auto;
    margin-left: auto;
    width: 960px;
    height: auto !important;
    background-color: #666666;
    padding: 4px;
    margin-top: 40px;
    /*box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
    -webkit-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
    -moz-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
    -ms-box-shadow: 2px 2px 20px rgba(0,0,0,0.8);
    animation: slideIn 0.5s;
    -webkit-animation: slideIn 0.5s;
    -moz-animation: slideIn 0.5s;*/
}
#logo-l {
	width: 390px;
	height: 330px;
	top: 12%;
	left: 6%;
	position: relative;
	float: left;
	border-style: none;
	background-color: rgba(255,0,255,0);
	opacity: 0.3;
	-webkit-transition: all 0.5s ease-in 0s;
	-moz-transition: all 0.5s ease-in 0s;
	-ms-transition: all 0.5s ease-in 0s;
	-o-transition: all 0.5s ease-in 0s;
	transition: all 0.5s ease-in 0s;
	clear: both;
}
#logo-l:hover {
	-webkit-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
}


#outer-index {
	margin-right: auto;
	margin-left: auto;
	width: 1000px;
	height: 600px;
	background-attachment: scroll;
	background-image: url(bilder/ic-back-01.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	margin-top: 30px;
		animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}

#outer {
	margin-right: auto;
	margin-left: auto;
	width: 1000px;
	height: auto;
	background-attachment: scroll;
	background-image: url(bilder/ic-back-referenzen.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	margin-top: 30px;
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}

#outer-links {
	margin-right: auto;
	margin-left: auto;
	width: 1000px;
	height: 600px;
	background-attachment: scroll;
	background-image: url(bilder/ic-back-links.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	margin-top: 30px;
	
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}

#outer-ref {
	margin-right: auto;
	margin-left: auto;
	width: 1000px;
	background: url(bilder/ic-back-ref.jpg) no-repeat scroll center top;
	height: auto;
	margin-top: 30px;
	
	animation: slideIn 0.5s;
	-webkit-animation: slideIn 0.5s;
	-moz-animation: slideIn 0.5s;
}

#outer-goodies {
	margin-right: auto;
	margin-left: auto;
	width: 1000px;
	background: url(bilder/ic-back-goodies.jpg) no-repeat scroll center top;
	height: 600px;
	margin-top: 30px;
}

.textinner {
	text-align: center;
	font-size : 0.8em;
	color : #FFFFFF;
	max-width: 960px;
	width: 96%;
	padding: 10px;
	background-color: rgba(255,51,0,0.0);
	line-height: 1.4em;
	margin-top: 20px;
}
.textinnerfull {
	text-align: center;
	font-size : 0.8em;
	color : #FFFFFF;
	width: 960px;
	background-color: rgba(255,51,0,0.0);
	margin: -50px 0 0 0;
}
.apple{
	left: 730px;
	top: 230px;
	position: relative;
}
.textinner1 {
	text-align: center;
	font-size : 0.8em;
	color : #ffffff;
	width: 464px;
	top: 111px;
	position: absolute;
	left: 602px;
	height: 270px;
}
.textinner1 a {
	color : #ffffff;
}
.textinner1 a:hover {
	color : #F39;
}
.textinnerlinks {
	text-align: left;
	font-size : 1.0em;
	color : #FFFFFF;
	max-width: 960px;
	width: 90%;
	padding: 100px 10px 10px 60px;
    word-spacing: 0.0em;
	word-break: keep-all;
	-webkit-transition: all 1s linear .5s;
	-moz-transition: all 1s linear .5s;
	-ms-transition: all 1s linear .5s;
	-o-transition: all 1s linear .5s;
	transition: all 1s linear .5s;
}


ul{
	background: none;
	list-style: disc;
	margin-bottom : 1px;

}

ul ul{
 list-style-type: disc;
	background: none;
}

ul ul ul{
 list-style-type: none;
}

#inner{
	background: #FFFFFF;
	border-bottom: 1px solid #cccccc;
}

#topper{
	margin: 0px 0px 0px 0px;
	color: #333333;
	padding: 0px 0px 0px 0px;
} 

#logo {
	padding: 5px 10px 0px 10px;
	margin: 10px 0px 0px 0px;
}

#logo img {
	border-style: none;
}

#webdesign {
	padding: 10px 10px 0px 10px;
	margin: 10px 0px 0px 0px;
	background: url(bilder/ic-webdesign.jpg);
	background-repeat: no-repeat;
	width: 780px;
	height: 307px;
	color: #ffffff;
	text-align: center;
}

#backblue {
	padding: 200px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	background: url(bilder/ic-blau-chrom01.jpg) center top;
	background-repeat: no-repeat;
	color: #ffffff;
	text-align: center;
	height: 1140px;
}

#webdesign a {
	color: #ffffff;
	font-weight: bold;
}

#webdesign a:hover {
	color: rgba(255,204,0,1);
	font-weight: bold;
}

#text {
	text-align: center;
   font-size : 0.8em;
   color : #ff6600;
}

.textmini {
	text-align: center;
   font-size : 0.6em;
   color : #ff6600;
}

#content {
	width: 1017px;
	text-align: left;
	margin: 5px 0px 0px;
	background-image: url(bilder/ic2008bodyback.jpg);
	background-repeat: repeat-y;
	background-position: center;
	height: auto;
}

#contentprint {
	width: 530px;
	text-align: justify;
	margin: 5px 0px 0px 0px;
	background: #FFFFFF;
}
.adim {
    display:block;
	background-image: url(bilder/adim-assets/adim.png);
	background-repeat: no-repeat;
	width:800px; 
	height:60px;
	margin: 10px auto 0 auto;
}
.movie {text-align:center;}
.imgleft {
	position:relative;
	float: left;
margin: 2px 10px 2px 0;}
.textcenter {text-align:center;
width: 60%;
margin: 4px auto 4px auto;
}
/* /////// MOBILE /////// */
@media screen and (max-width : 842px ){
	body {
    max-width:842px;
	font-size : 1.3em;
	width : 100%;
}

.umbruch::after {
content: '\A';
white-space: pre;    
}

#header {
	text-align: center;
	font-size : 0.8em;
	color : #fff;
	width: 90% !important;
	padding: 2em 0 0.3em 0;
	display: block;
	margin: 5px auto 0px auto;
	position: relative;
	font-style: normal;
	clear: both;
    
}
#inner-1 {
	font-size:100%;
	text-align: center;
	width: 100%;
	top: -200px !important;
	left: 0!important;
	position: relative;
	float: left;
	margin: 0 auto;
	padding:0px;
}
    #logo-l {
	display: block;
	width: 80%;
	margin: 0 auto 10px auto;
	position: relative;
	border-style: none;
	opacity: 0.1;
	-webkit-transition: all 0.5s ease-in 0s;
	-moz-transition: all 0.5s ease-in 0s;
	-ms-transition: all 0.5s ease-in 0s;
	-o-transition: all 0.5s ease-in 0s;
	transition: all 0.5s ease-in 0s;
}
    #textbottom {
	text-align: center;
	line-height: 200%;
	color : #999999;
	width: 90% !important;
	padding: 20px 15px 10px 15px;
	margin: 0 auto 10px auto;
	position: absolute;
	top: 60%;
	left: 0px;
	font-style: normal;
	float:left;
	clear: both;
	z-index: 9999;
	word-spacing: 0.3em;
	word-break: keep-all;
}
a:hover {
	color : rgba(0,0,0,1.00);
	text-decoration : none;
}
#outer-red, #outer-orange, #outer_pat-blue, #outer-green, #outer-grau, #outer-green, #outer-blue {
	position: absolute;
	width:95% !important;
	min-height: 1800px;
	height: 100% !important;
	max-width: 100% !important;
	top: 0px;
	margin: 0 auto;
    padding: 10px;
	border-radius: 0;
}
#textbottom span{
display:block;
}
.textinner {
	text-align: center;
	font-size : 0.8em;
	color : #FFFFFF;
	display:block;
	width: 50%;	
	max-width: 1200px;
	padding: 0 0 800px 0;
	position: relative;
	top: 6%;
	margin: 10px auto;
	background-color: rgba(255,51,0,0.0);
}
.textinnerlinks {
	text-align: center;
	font-size : 1.0em;
	color : #FFFFFF;
	display:block;
	width: 50%;	
	max-width: 800px;
	padding: 0;
	position: relative;
	top: 9%;
	margin: 10px auto 10px auto;
}
h1, h2, h3 {	
	line-height: 160%;
	text-align: center;
}
.textinnerfull {
	text-align: center;
	font-size : 0.8em;
	color : #FFFFFF;
	width: 90%;	
	padding-top: 10px;
	position: relative;
	top: 7%;
	margin: 10px auto 10px auto;
	background-color: rgba(255,51,0,0.0);
}

.adim {
	background-image: url(bilder/adim-assets/adim-mobil.png);
	background-repeat: no-repeat;
	width:375px; 
	height:150px;
	margin: 0 auto 0 auto;
	}
}
@media screen and (max-width : 480px){
    body {
    max-width:480px;
	font-size : 1.3em;
	color : #999;
	width : 100%;
} 
    #header {
	text-align: center;
	font-size : 0.5em;
	color : #fff;
	width: 90% !important;
	padding: 2em 0 0.3em 0;
	display: block;
	margin: 5px auto 0px auto;
	position: relative;
	font-style: normal;
	clear: both;
    
}
#inner-1 {
	font-size:100%;
	text-align: center;
	width: 100%;
	top: -120px !important;
	left: 0!important;
	position: relative;
	float: left;
	margin: 0 auto;
	padding:0px;
}
    #logo-l {
	display: block;
	width: 120%;
	margin: -4em auto 10px -3em;
	position: relative;
	border-style: none;
	opacity: 0.1;
	-webkit-transition: all 0.5s ease-in 0s;
	-moz-transition: all 0.5s ease-in 0s;
	-ms-transition: all 0.5s ease-in 0s;
	-o-transition: all 0.5s ease-in 0s;
	transition: all 0.5s ease-in 0s;
}
    #textbottom {
	text-align: center;
	line-height: 200%;
	color : #999999;
	width: 90% !important;
	padding: 20px 15px 10px 15px;
	margin: 0 auto 10px auto;
	position: absolute;
	top: 90%;
	left: 0px;
	font-style: normal;
	float:left;
	clear: both;
	z-index: 9999;
	word-spacing: 0.3em;
	word-break: keep-all;
}

    h1 {font-size: 2em!important;}
    h2 {line-height: 180%!important;}

}
@media screen and (max-width : 320px){
    body {
    max-width:320px;
	font-size : 1.4em;
	color : #999;
	width : 100%;
} 
    #inner-1 {
	text-align: center;
    display: block;
	width: 100%!important;
	height: auto;
    min-height: 600px;
	top: 160px!important;
        font-size: 80% !important;
    left:-20px!important;
	position: absolute;
	float:inherit;
	margin: 0 auto;
	padding: 20px!important;
}
}