html, li {
	padding: 0;
	margin: 0;
	border: none;
}

body {
	padding: 0;
	margin: 0;
	font: 15px/20px helvetica, arial, sans-serif;
	color: #000;
	cursor: default;
	background: #eee;
	overflow: hidden;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

.parent {
	display: block;
	width: 100%;
	cursor: n-resize;
	height: 100%;
	top: 0;
	z-index: 2;
	position: fixed;
}

.border {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 4;
	margin: -300px 0 0 0;
	height: 600px;
	background-color: #fff;
	-webkit-box-shadow: 0 6px 60px #ccc;
	-moz-box-shadow: 0 6px 60px #ccc;
	box-shadow: 0 6px 60px #ccc;
}

.text {
	overflow: visible;
}

.text .border {
	cursor: pointer;
	width: 424px;
	margin-left: -424px;
	-webkit-transform-origin: center left;
	-moz-transform-origin: center left;
	-o-transform-origin: center left;
	transform-origin: center left;
}

.tressll img {
	position: absolute;
	top: 0;
	left: 20px;
}

.tressll .border p {
	padding: 0;
}

.text #text {
	position: absolute;
	width: 424px;
	z-index: 3;
	left: 50%;
	padding: 35px 0 34px 0;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

.tressll p span {
	position: absolute;
	width: 400px;
	left: 320px;
	top: 302px;
	display: block;
	text-align: right;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

.image .zoom {
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
}

.image .rotate {
	-webkit-transform: scale(1.5) rotate(180deg);
	-moz-transform: scale(1.5) rotate(180deg);
	-o-transform: scale(1.5) rotate(180deg);
	transform: scale(1.5) rotate(180deg);
}

.text .zoom {
	-webkit-transform: translate(106px, 0) scale(1.5);
	-moz-transform: translate(106px, 0) scale(1.5);
	-o-transform: translate(106px, 0) scale(1.5);
	transform: translate(106px, 0) scale(1.5);
}

.mordy img {
	position: absolute;
	width: 400px;
	height: 300px;
}

.mordy .zoom {
	-webkit-transform: scale(2);
	-moz-transform: scale(2);
	-o-transform: scale(2);
	transform: scale(2);
}

.front {
	z-index: 5;
}

.transparent {
	opacity: 0;
}

.mordy #mordy1 {
	left: 0;
	top: 0;
	-webkit-transform-origin: top left;
	-moz-transform-origin: top left;
	-o-transform-origin: top left;
	transform-origin: top left;
}

.mordy #mordy2 {
	left: 400px;
	top: 0;
	-webkit-transform-origin: top right;
	-moz-transform-origin: top right;
	-o-transform-origin: top right;
	transform-origin: top right;
}

.mordy #mordy3 {
	left: 0;
	top: 300px;
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	-o-transform-origin: bottom left;
	transform-origin: bottom left;
}

.mordy #mordy4 {
	left: 400px;
	top: 300px;
	-webkit-transform-origin: bottom right;
	-moz-transform-origin: bottom right;
	-o-transform-origin: bottom right;
	transform-origin: bottom right;
}

.main img {
	position: absolute;
}

.main .links a {
	display: block;
	background: url(img/hovers.png) no-repeat;
	opacity: 0;
	position: absolute;
}

.parallela .border a:hover, .about .border a:hover {
	opacity: 0.5;	
}

.main .links a:hover, .opaque {
	opacity: 1 !important;
}

#about {
	position: absolute;
	left: 0;
	top: 0;
	width: 800px;
	height: 600px;
	z-index: 4;
	-webkit-transition: opacity 0.4s;
	-moz-transition: opacity 0.4s;
	-o-transition: opacity 0.4s;
	transition: opacity 0.4s;
	opacity: 0;
}

.antibiosis img {
	position: absolute;
	left: 0;
	top: 0;
	width: 800px;
	height: 600px;
	image-rendering: -moz-crisp-edges;
	-ms-interpolation-mode: nearest-neighbor;
}

.antibiosis #about {
	background: url(img/antibiosis/antibiosis.png) center no-repeat;
}

.microcosm #about {
	background: url(img/parallela/microcosm.png) center no-repeat;
}

.macrocosm #about {
	background: url(img/parallela/macrocosm.png) center no-repeat;
}

.gallery .border {
	width: 600px;
	margin-left: -300px;
}

.error .border {
	width: 600px;
	margin-left: -300px;
	background: #fff url(img/error/background.png) center no-repeat;
}

.parallela .border, .about .border, .video .border, .tressll .border {
	width: 800px;
	margin-left: -400px;
}

.chrestomathy .border {
	width: 800px;
	margin-left: -400px;
	background: url(img/chrestomathy/hovers.png) 800px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
	background-color: #fff;
}

.chrestomathy .transitions {
	background: url(img/chrestomathy/hovers.png) 0 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .stringpuller {
	background: url(img/chrestomathy/hovers.png) -800px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .growth {
	background: url(img/chrestomathy/hovers.png) -1600px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .udara {
	background: url(img/chrestomathy/hovers.png) -2400px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .pluco {
	background: url(img/chrestomathy/hovers.png) -3200px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .rubbersoul {
	background: url(img/chrestomathy/hovers.png) -4000px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .treetrunk {
	background: url(img/chrestomathy/hovers.png) -4800px 0 no-repeat, url(img/chrestomathy/chrestomathy.png);
}

.chrestomathy .cancer {
	background: url(img/chrestomathy/hovers.png) -5600px 0, url(img/chrestomathy/chrestomathy.png);
}

.dwaal .border {
	background: url(img/dwaal/hovers.png) 600px 0 no-repeat, url(img/dwaal/dwaal.png);
	background-color: #fff;
}

.dwaal .kiahyrr {
	background: url(img/dwaal/hovers.png) 0 0 no-repeat, url(img/dwaal/dwaal.png);
}

.dwaal .eloember {
	background: url(img/dwaal/hovers.png) -600px 0 no-repeat, url(img/dwaal/dwaal.png);
}

.dwaal .einsameschnecke {
	background: url(img/dwaal/hovers.png) -1200px 0 no-repeat, url(img/dwaal/dwaal.png);
}

.vorago .border {
	background: url(img/vorago/hovers.png) 600px 0 no-repeat, url(img/vorago/vorago.png);
	background-color: #fff;
}

.vorago .queenofhearts {
	background: url(img/vorago/hovers.png) 0 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago .jackofhearts {
	background: url(img/vorago/hovers.png) -600px 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago .kingofhearts {
	background: url(img/vorago/hovers.png) -1200px 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago .queenofspades {
	background: url(img/vorago/hovers.png) -1800px 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago .jackofspades {
	background: url(img/vorago/hovers.png) -2400px 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago .kingofspades {
	background: url(img/vorago/hovers.png) -3000px 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago .vorago {
	background: url(img/vorago/hovers.png) -3600px 0 no-repeat, url(img/vorago/vorago.png);
}

.vorago2 .border {
	background: url(img/vorago/hovers2.png) 600px 0 no-repeat, url(img/vorago/vorago2.png);
	background-color: #fff;
}

.vorago2 .queenofclubs {
	background: url(img/vorago/hovers2.png) -3000px 0 no-repeat, url(img/vorago/vorago2.png);
}

.vorago2 .jackofclubs {
	background: url(img/vorago/hovers2.png) -2400px 0 no-repeat, url(img/vorago/vorago2.png);
}

.vorago2 .kingofclubs {
	background: url(img/vorago/hovers2.png) -1800px 0 no-repeat, url(img/vorago/vorago2.png);
}

.vorago2 .queenofdiamonds {
	background: url(img/vorago/hovers2.png) -1200px 0 no-repeat, url(img/vorago/vorago2.png);
}

.vorago2 .jackofdiamonds {
	background: url(img/vorago/hovers2.png) -600px 0 no-repeat, url(img/vorago/vorago2.png);
}

.vorago2 .kingofdiamonds {
	background: url(img/vorago/hovers2.png) 0 0 no-repeat, url(img/vorago/vorago2.png);
}

.vorago2 .vorago {
	background: url(img/vorago/hovers2.png) -3600px 0 no-repeat, url(img/vorago/vorago2.png);
}

.main #xenocryst {
	left: 92px;
	top: 156px;
}

.main #stalagmites {
	left: 622px;
	top: 206px;
}

.main #stalactites {
	left: 735px;
	top: 0;
}

.main #about1 {
	background-position: -1200px 0;
	width: 44px;
	height: 138px;
	left: 232px;
	top: 274px;
}

.main #stalagmites1 {
	background-position: 0 0;
	width: 43px;
	height: 87px;
	left: 631px;
	top: 220px;
}

.main #stalactites1 {
	background-position: -100px 0;
	width: 40px;
	height: 92px;
	left: 789px;
	top: 293px;
}

.main #antibiosis {
	left: 67px;
	top: 343px;
}

.main #chrestomathy {
	left: 402px;
	top: 237px;
}

.main #parallela {
	left: 626px;
	top: 0;
}

.main #antibiosis1 {
	background-position: -200px 0;
	width: 90px;
	height: 114px;
	left: 78px;
	top: 397px;
}

.main #chrestomathy1 {
	background-position: -300px 0;
	width: 100px;
	height: 107px;
	left: 429px;
	top: 259px;
}

.main #parallela1 {
	background-position: -500px 0;
	width: 120px;
	height: 86px;
	left: 727px;
	top: 217px;
}

.main #tressll {
	left: 54px;
	top: 200px;
}

.main #postillion {
	left: 271px;
	top: 159px;
}

.main #dwaal {
	left: 533px;
	top: 0;
}

.main #vorago {
	left: 744px;
	top: 95px;
}

.main #tressll1 {
	background-position: -700px 0;
	width: 77px;
	height: 148px;
	left: 86px;
	top: 224px;
}

.main #postillion1 {
	background-position: -800px 0;
	width: 82px;
	height: 109px;
	left: 298px;
	top: 171px;
}

.main #mordy1 {
	background-position: -900px 0;
	width: 83px;
	height: 94px;
	left: 368px;
	top: 317px;
}

.main #dwaal1 {
	background-position: -1000px 0;
	width: 94px;
	height: 111px;
	left: 547px;
	top: 254px;
}

.main #vorago1 {
	background-position: -1100px 0;
	width: 85px;
	height: 111px;
	left: 759px;
	top: 261px;
}

.tressll p, .einsameschnecke p {
	line-height: 40px;
	padding: 0 0 0 40px;
}

.kiahyrr p {
	text-align: center;
	line-height: 40px;
	padding: 0;
}

.eloember p {
	padding-left: 40px;
}

.antibiosis .border, .mordy .border {
	background-color: #000;
	width: 800px;
	margin-left: -400px;
}

.about .border a {
	position: absolute;
	z-index: 4;
	display: block;
	width: 800px;
	height: 300px;
	background: url(img/about/hovers.png) center top no-repeat;
	left: 0;
	top: 0;
}

.about .border p + a {
	top: 300px;
	background-position: center bottom;
}

.about .border div {
	width: 800px;
	height: 600px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 5;
	background: url(img/about/background.png) center no-repeat;
}

.parallela .border ul {
	width: 800px;
	height: 600px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 4;
	background: url(img/parallela/background.png) center no-repeat;
}

.parallela .border a {
	position: absolute;
	display: block;
	width: 400px;
	height: 600px;
	background: url(img/parallela/hovers.png) left top no-repeat;
	left: 0;
	top: 0;
}

.parallela .border li + li a {
	left: 400px;
	background-position: right top;
}

.animation div.object {
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -200px 0 0 -200px;
	width: 400px;
	height: 400px;
	background-position: center;
	background-repeat: no-repeat;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
}

#animation1 {
	z-index: 2;
	-webkit-animation-name: animation1;
	-webkit-animation-duration: 8s;
}

#animation2 {
	z-index: 3;
	-webkit-animation-name: animation2;
	-webkit-animation-duration: 5s;
}

.about #animation1 {
	background-image: url(img/about/about.png);
}

.parallela #animation1 {
	background-image: url(img/parallela/parallela.png);
}

.error #animation1 {
	background-image: url(img/error/left.png);
}

.error #animation2 {
	background-image: url(img/error/right.png);
}

.main .border {
	width: 960px;
	margin-left: -480px;
}

.antibiosis .border, .mordy .border, .tressll .border, .video .border {
	cursor: pointer;
}

.image .border {
	cursor: pointer;
	width: 424px;
	margin-left: -212px;
}

.rubbersoul .border {
	width: 600px;
	margin-left: -300px;
}

p {
	padding: 10px 0;
	margin: 0;
}

ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

img {
	display: block;
	padding: 0;
	margin: 0;
	border: none;
	-webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
	-moz-transition: -moz-transform 0.4s, opacity 0.4s;
	-o-transition: -o-transform 0.4s, opacity 0.4s;
	transition: transform 0.4s, opacity 0.4s;
}

video {
	display: block;
	padding: 0;
	margin: 0;
	border: none;
	image-rendering: -moz-crisp-edges;
	-ms-interpolation-mode: nearest-neighbor;
}

a {
	color: #000;
	cursor: pointer;
	font-weight: bold;
	text-decoration: none;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-o-transition: 0.4s;
	transition: 0.4s;
}

a:hover {
	color: #808080 !important;
}

.underline {
	text-decoration: underline;
}

.header, .nav, h2, h3, .about .border ul, .about .border p, a p, a span, .invisible, #about p, .error .border p {
	display: none !important;
}

.hidden {
	visibility: hidden;
}

@-webkit-keyframes animation1 {
	0% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(360deg);}
}

@-webkit-keyframes animation2 {
	0% {-webkit-transform: rotate(360deg);}
	100% {-webkit-transform: rotate(0deg);}
}