/* Alle Aussen- (Margins) und Innenabstände (Paddings) auf 0 setzen, wegen verschiedene darstellung Browser */
* {
	margin: 0px;
	padding: 0px;
}

body {
	background-color: #faf901;
	height: 100%;
	text-align: center;
	
	background-image: url('../img/bg-blue-3.png'), url('../img/bg-blue-3.png');
	background-repeat: repeat, repeat-x;
	background-position: -153px -399px, top right;
	width: 100%;
	height: 1029px;
	overflow-x:hidden;

}

.noborder {
	border: none !important;
}

/* *******************
-- start accessibility --
   ******************* */


/* accessibility divs are hidden by default text, screenreaders and such will show these */

.accessibility, hr {

   position: absolute;
   top: -999em;
   left: -999em;
}


/* definition tags are also hidden these are also used for menu links */

dfn {
   position: absolute;
   left: -1000px;
   top: -1000px;
   width: 0;
   height: 0;
   overflow: hidden;
   display: inline;
}


/* *******************
-- schriftformatierung --
   ******************* */
   
   
* {
	font-family: Verdana, Arial, "Tahoma", sans-serif;
	font-size: 1em;
}

a {
	text-decoration: none;
}

a.lang-switch {
	position: absolute;
	right: 0px;
	top:120px;
	background-color: #fff;
	color: #3983E9;
	z-index:9999;
	padding:1px 3px 1px 3px;
}

a.lang-switch:hover {
	background-color: #FAF901;
}


span {
	font-family: Verdana, "Tahoma", sans-serif;
	font-size: 13px;
	text-align: left;
	color: #000000;
}

h1.big {
	font-family: Impact, Arial, Verdana, "Tahoma", sans-serif;
	font-size: 82px;
	color: #ffffff;
	margin-top: 35px;
	
	-webkit-transform: rotate(-7deg);
	-moz-transform: rotate(-7deg);
	-ms-transform: rotate(-7deg);
	-o-transform: rotate(-7deg);
	transform: rotate(-7deg);
}

h1.small {
	font-family: Impact, Arial, Verdana, "Tahoma", sans-serif;
	font-size: 24px;
	color: #ffffff;
}

div.rip {
	padding-top: 134px;
	margin-left: -73px;
	-webkit-transform: rotate(-19deg);
	-moz-transform: rotate(-19deg);
	-ms-transform: rotate(-19deg);
	-o-transform: rotate(-19deg);
	transform: rotate(-19deg);
}

h2.rip {
	font-family: Impact, Arial, Verdana, "Tahoma", sans-serif;
	font-size: 30px;
	color: #ffffff;
	display: inline;
}

h2.rip.pink {
	color: #c500ac;
	/*text-decoration: underline;*/
}


/*
ITSI ---------------------------------------
*/

#itsi { 
	display: block;
	position: fixed;
	right: 0px;
	top: 0px;
	overflow: visible;
	margin: 0px;
	padding: 0px;
	z-index: 1;
	border: none;
	float: none;
	  
	background-image: url('../img/itsi-B.png');
	background-repeat: no-repeat;
	background-position: top left;
	width: 120px;
	height: 302px;
	z-index: 9;
	}
	
.web-1 {
	border-top: 1px solid #000;
	top: 100px;
	padding-left: 10px;
	right: -5px;
	position: fixed;
	display: block;
	width: 100%;
	overflow: visible;
	z-index: 1;
	
	-moz-transform: rotate(-7.5deg);  
       -o-transform: rotate(-7.5deg);  
  -webkit-transform: rotate(-7.5deg);  
      -ms-transform: rotate(-7.5deg);  
          transform: rotate(-7.5deg);  
             filter:  progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',  
                      M11=0.9914448613738104, M12=-0.13052619222005157,M21=0.13052619222005157, M22=0.9914448613738104); 
         -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9914448613738104, M12=-0.13052619222005157, M21=0.13052619222005157, M22=0.9914448613738104,sizingMethod='auto expand')"; 
                      
               zoom: 1;
}

/*
MARIBOU ---------------------------------------
*/

#maribou { 	  
	background-image: url('../img/maribou.png');
	background-repeat: no-repeat;
	background-position: top left;
	width: 395px;
	height: 529px;
	display: block;
	position: fixed;
	z-index: 99;
	bottom: 0px;
	left: -20px;
	}

/*
HOMO SAPIENS ---------------------------------------
*/

#homo-sapiens { 	  
	background-image: url('../img/hs.png');
	background-repeat: no-repeat;
	background-position: top right;
	width: 511px;
	height: 809px;
	right: 0px;

	display: block;
	position: fixed;
	z-index: 3;
	bottom: 0px;
	}


/*
CONTENT-WRAP ---------------------------------------
*/


#content-wrap {
	background-color: #fff;
	width: 550px;
	padding: 20px;
	z-index: 9;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	top: 50px;
	cursor: pointer;
	
	-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    0px 3px 10px rgba(0, 0, 0, 0.5);
	box-shadow:         0px 3px 10px rgba(0, 0, 0, 0.5);
	
	-webkit-transform: rotate(-7deg);
	-moz-transform: rotate(-7deg);
	-ms-transform: rotate(-7deg);
	-o-transform: rotate(-7deg);
	transform: rotate(-7deg);
	
	background-image: url('../img/zoom.png');
	background-repeat: no-repeat;
	background-position: right 3px;
}

#content-wrap.layer-im-vordergrund {
	z-index: 999;
	background-image: url('../img/zoom2.png');
	background-repeat: no-repeat;
	background-position: right 3px;
	}
	
.content-add {
	background-color: #fff;
	width: 560px;
	padding: 40px 20px 20px 20px;
	z-index: 8;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	top: 50px;
	cursor: pointer;
	
	-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    0px 3px 10px rgba(0, 0, 0, 0.5);
	box-shadow:         0px 3px 10px rgba(0, 0, 0, 0.5);
	
	background-image: url('../img/zoom.png');
	background-repeat: no-repeat;
	background-position: right 3px;
}

.content-add.layer-im-vordergrund {
	z-index: 999;
	background-image: url('../img/zoom2.png');
	background-repeat: no-repeat;
	background-position: right 3px;
	}


.content-dates {
	background-color: #fff;
	width: 550px;
	padding: 20px;
	z-index: 7;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	top: 50px;
	cursor: pointer;
	
	-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:    0px 3px 10px rgba(0, 0, 0, 0.5);
	box-shadow:         0px 3px 10px rgba(0, 0, 0, 0.5);
	
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	-ms-transform: rotate(4deg);
	-o-transform: rotate(4deg);
	transform: rotate(4deg);
	
	background-image: url('../img/zoom.png');
	background-repeat: no-repeat;
	background-position: right 3px;
}

.content-dates.layer-im-vordergrund {
	z-index: 999;
	background-image: url('../img/zoom2.png');
	background-repeat: no-repeat;
	background-position: right 3px;
	}


/*
ITSI THANKS ---------------------------------------
*/

.itsi-heart {
		display: block;
		position: fixed;
		right: 32px;
		top: 220px;
		overflow: visible;
		margin: 0px;
		padding: 0px;
		border: none;
		float: none;
		z-index: 99;
		
		width: 30px;
		height: 30px;
		background-image: url('../img/itsi-question.png');
		background-repeat: no-repeat;
		background-position: top right;
}

.itsi-heart span {
        opacity: 0;
        display: none;

}

.itsi-heart:hover span {
        opacity: 1;
}

.itsi-heart_active {
		display: block;
		position: fixed;
		right: 32px;
		top: 220px;
		overflow: visible;
		margin: 0px;
		padding: 0px;
		border: none;
		float: none;
		z-index: 99999;
		
		width: 30px;
		height: 30px;
		background-image: url('../img/itsi-heart.png');
		background-repeat: no-repeat;
		background-position: top right;
}

.itsi-heart_active span {
        position: absolute;
		font-size: 11px;
		background-color: #ffffff;
		top: 0px;
		right: 90px;
		opacity:1;
		
		width: 350px;
		padding: 20px;
		z-index: 99999;
		text-align: left;
		/*margin-left: auto;
		margin-right: auto;*/
		/*position: relative;*/
		/*top: 50px;*/
		cursor: pointer;
		
		-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
		-moz-box-shadow:    0px 3px 10px rgba(0, 0, 0, 0.5);
		box-shadow:         0px 3px 10px rgba(0, 0, 0, 0.5);
		
		/*-webkit-transform: rotate(-7deg);
		-moz-transform: rotate(-7deg);
		-ms-transform: rotate(-7deg);
		-o-transform: rotate(-7deg);
		transform: rotate(-7deg);*/
		
		background-image: url('../img/close.png');
		background-repeat: no-repeat;
		background-position: right 8px;
}



/*
PLASTIC INFO ---------------------------------------
*/

.info-plastic2 {
		display: block;
		position: fixed;
		right: 120px;
		bottom: 505px;
		overflow: visible;
		margin: 0px;
		padding: 0px;
		border: none;
		float: none;
		z-index: 9999;
		
		width: 23px;
		height: 19px;
		background-image: url('../img/infopoint.png');
		background-repeat: no-repeat;
		background-position: 3px top;
		cursor: pointer;
}

.info-plastic2 span {
        opacity: 0;
        display: none;
}


.info-plastic2.show-layer {
		display: block;
		position: fixed;
		right: 120px;
		bottom: 505px;
		overflow: visible;
		margin: 0px;
		padding: 0px;
		border: none;
		float: none;
		
		width: 23px;
		height: 19px;
		opacity:1;
		background-image: url('../img/close.png');
		background-repeat: no-repeat;
		background-position: 3px top;
}

.info-plastic2.show-layer span {
        position: absolute;
		font-size: 12px;
		background-color: #d7e6fa;
		top: 0px;
		right: 40px;
		opacity:1;
		
		width: 350px;
		padding: 20px;
		z-index: 999;
		text-align: left;
		cursor: pointer;
		display:block;
		
		-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
		-moz-box-shadow:    0px 3px 10px rgba(0, 0, 0, 0.5);
		box-shadow:         0px 3px 10px rgba(0, 0, 0, 0.5);
		
		/*-webkit-transform: rotate(-7deg);
		-moz-transform: rotate(-7deg);
		-ms-transform: rotate(-7deg);
		-o-transform: rotate(-7deg);
		transform: rotate(-7deg);*/
		
		background-image: url('../img/close.png');
		background-repeat: no-repeat;
		background-position: right 8px;
}

a.info {
	z-index:9999;
	color: #3983E9;
	font-size: 12px;
}

a.info:hover {
	text-decoration:underline;
}

.info-plastic2 ul {
	list-style-type: square;
	padding-left: 13px;
	font-size: 12px;
}

.info-plastic2 ul li {
	padding-left: 5px;
	padding-bottom: 7px;
}



/*
HOMO SAPIENS INFO ---------------------------------------
*/

.info-homosapiens {
		display: block;
		position: fixed;
		right: 130px;
		bottom: 63px;
		overflow: visible;
		margin: 0px;
		padding: 0px;
		border: none;
		float: none;
		z-index: 9999;
		
		width: 23px;
		height: 19px;
		background-image: url('../img/infopoint.png');
		background-repeat: no-repeat;
		background-position: 3px top;
		cursor: pointer;
}

.info-homosapiens span {
        opacity: 0;
        display: none;
}


.info-homosapiens.show-layer2 {
		display: block;
		position: fixed;
		right: 130px;
		bottom: 63px;
		overflow: visible;
		margin: 0px;
		padding: 0px;
		border: none;
		float: none;
		
		width: 23px;
		height: 19px;
		opacity:1;
		background-image: url('../img/close.png');
		background-repeat: no-repeat;
		background-position: 3px top;
}

.info-homosapiens.show-layer2 span {
        position: absolute;
		font-size: 12px;
		background-color: #d7e6fa;
		bottom: 0px;
		right: 40px;
		opacity:1;
		
		width: 350px;
		padding: 20px;
		z-index: 999;
		text-align: left;
		cursor: pointer;
		display:block;
		
		-webkit-box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.5);
		-moz-box-shadow:    0px 3px 10px rgba(0, 0, 0, 0.5);
		box-shadow:         0px 3px 10px rgba(0, 0, 0, 0.5);
		
		/*-webkit-transform: rotate(-7deg);
		-moz-transform: rotate(-7deg);
		-ms-transform: rotate(-7deg);
		-o-transform: rotate(-7deg);
		transform: rotate(-7deg);*/
		
		background-image: url('../img/close.png');
		background-repeat: no-repeat;
		background-position: right 8px;
}