body, html{
	padding:0px;
	margin:0px;
	height:100%;
	width:100%;
}
div.homepage{
	background-image:url("../images/Homepage.jpg");
	height:1100px;
	background-repeat: no-repeat;
	background-size:cover;
	position:relative;
	margin:auto;
	/*max-width:1400px;
	min-width:1300px;*/
}
div.dream_level1{
	background-image:url("../images/dream_level1.jpg");
	height:1000px;
	background-repeat: no-repeat;
	background-size:cover;
	position:relative;
	margin:auto;

	/*max-width:1400px;
	min-width:1300px;*/
}
div.dream_level2{
	background-image:url("../images/dream_level2.jpg");
	height:1000px;
	background-repeat: cover;
	background-size:auto 100%;
	position:relative;
	margin:auto;
	/*max-width:1400px;
	min-width:1300px;*/
}
div.dream_level3{
	background-image:url("../images/dream_level3.jpg");
	height:100%;
	background-repeat: no-repeat;
	background-size:cover;
	position:relative;
	margin:auto;
	/*max-width:1400px;
	min-width:1300px;*/
}
div.dream_levellimbo{
	background-image:url("../images/dream_level_limbo.jpg");
	height:100%;
	background-size:cover;
	background-repeat: no-repeat;
	/*background-size:auto 100%;*/
	position:relative;
	margin:auto;
	max-width:1400px;
	min-width:1300px;
}
div.dot{
    animation-name: pulse;
    animation-duration: 2s;
    animation-iteration-count:infinite;
    z-index:5;
    position:absolute;
	height:15px;
	width:15px;
	border-radius: 50%;
	background-color:red;

}
div.dot_1{
    animation-name: pulse_1;
    animation-duration: 2s;
    animation-iteration-count:infinite;
    z-index:5;
    position:absolute;
	height:15px;
	width:15px;
	border-radius: 50%;

}
div.dot_2{
	 animation-name: pulse_2;
    animation-duration: 2s;
    animation-iteration-count:infinite;
    z-index:5;
    position:absolute;
	height:15px;
	width:15px;
	border-radius: 50%;
}
@keyframes pulse {
    0%   {background-color:red;}
    25%  {background-color:rgba(255, 0, 0, .25);}
    50%  {background-color:rgba(0, 0, 0, 0); }
    55%  {background-color:rgba(255, 0, 0, 100);
    		}
    100% {background-color:red;}
}
@keyframes pulse_1{
    0%   {background-color:rgb(153, 206, 255);}
    25%  {background-color:rgba(153, 206, 255, .25);}
    50%  {background-color:rgba(0, 0, 0, 0); }
    75%  {background-color:rgba(153, 206, 255, ..25);
    		}
    100% {background-color:rgb(145, 175, 186)}
}
@keyframes pulse_2{
    0%   {background-color:rgb(1252, 131, 70);}
    25%  {background-color:rgba(252, 131, 70, .25);}
    50%  {background-color:rgba(0, 0, 0, 0); }
    75%  {background-color:rgba(252, 131, 70, ..25);
    		}
    100% {background-color:rgb(252, 131, 70)}
}
h2{
	font-family: 'Aldrich', sans-serif;
	font-size:75px;
	color:rgba(255,255,255,.5);
	padding: 20px 0px 0px 30px;

}

#info_cobbs{
	top:626px;
	left:520px;
}
#info_cobbs:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#info_cobbs .container{
	opacity:0;
	transition:all .5s;
	height:180px;
	width:450px;
	margin:0px;
	position:absolute;
	top:-200px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(255,255,255,.5);
}
#info_cobbs:hover .container {
	display:block;
}
#info_ariadne{
	top:676px;
	left:643px;
}
#info_ariadne:hover .container{
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#info_ariadne .container{
	opacity:0;
	transition:all .5s;
	height:180px;
	width:470px;
	margin:0px;
	position:absolute;
	top:-238px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(255,255,255,.5);
}
#info_ariadne:hover .container {
	display:block;
}

#info_arthur{
	top:680px;
	left:920px;
}
#info_arthur:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#info_arthur .container{
	opacity:0;
	transition:all .5s;
	height:180px;
	width:330px;
	margin:0px;
	position:absolute;
	top:-238px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(255,255,255,.5);
}
#info_arthur:hover .container {
	display:block;
}
/*#info_arthur:hover {
	height:180px;
	width:330px;
	margin:0px;
	position:absolute;
	top:543px;
	left:920px;
	color:#021b23;
	border-radius:5%;
	background-color:rgba(255,255,255,.5);
	animation-iteration-count: 0;
	animation-play-state: paused;
}*/
#info_eames{
	top:665px;
	left:776px;
}
#info_eames:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#info_eames .container{
	opacity:0;
	transition:all .5s;
	height:180px;
	width:410px;
	margin:0px;
	position:absolute;
	top:-240px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(255,255,255,.5);
}
#info_eames:hover .container {
	display:block;
}
#info_yusuf{
	top:665px;
	left:372px;
}
#info_yusuf:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#info_yusuf .container{
	opacity:0;
	transition:all .5s;
	height:180px;
	width:410px;
	margin:0px;
	position:absolute;
	top:-250px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(255,255,255,.5);
}
#info_yusuf:hover .container {
	display:block;
}
#info_mr_saito{
	top:650px;
	left:140px;
}#info_mr_saito:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#info_mr_saito .container{
	opacity:0;
	transition:all .5s;
	height:180px;
	width:370px;
	margin:0px;
	position:absolute;
	top:-240px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(255,255,255,.5);
}
#info_mr_saito :hover .container {
	display:block;
}
#level1{
	position:absolute;
	height:20px;
	width:20px;
	border-radius:50%;
	top:350px;
	left:750px;
}
/*#info_cobbs {
	top:666px;
	left:520px;
	z-index:5;
}
#info_cobbs:hover {
	height:180px;
	width:410px;
	margin:0px;
	position:absolute;
	top:508px;
	left:517px;
	color:#021b23;
	border-radius:12px;
	background-color:rgba(255,255,255,.5);
	animation-iteration-count: 0;
	animation-play-state: paused;
}
#info_cobbs .container{
	display:none;

}
#info_cobbs:hover .container {
	display:block;
}*/
h1{
	font-size:40px;
	font-family: 'Aldrich', sans-serif;
	font-weight:medium;
	margin:20px 0px 20px 20px;
}

/*DREAM LEVEL 1*/


#d_level1{
	top:300px;
	left:750px;
}
#d_level1:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#d_level1 .container{
	opacity:0;
	transition:all .5s;
	height:250px;
	width:410px;
	margin:0px;
	position:absolute;
	top:-235px;
	left:0px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(145, 175, 186,.5);
}
/*#d_level1 :hover .container {
	display:block;
}*/

/*Dream Level 2*/




/*#d_level2_1{
	top:390px;
	left:410px;
}

#d_level2_1:hover {
	height:230px;
	width:410px;
	margin:0px;
	position:absolute;
	top:390px;
	left:25px;
	color:#021b23;
	border-radius:5%;
	background-color:rgba(252, 131, 70, .5);
	animation-iteration-count: 0;
	animation-play-state: paused;
}
#d_level2_1 .container{
	display:none;

}
#d_level2_1:hover .container {
	display:block;
}*/


#d_level2_1{
	top:390px;
	left:410px;
}

#d_level2_1:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#d_level2_1 .container{
	opacity:0;
	transition:all .5s;
	height:230px;
	width:410px;
	margin:0px;
	position:absolute;
	top:100px;
	left:-150px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(198, 122, 69, .75);
	transform:rotate(44deg);
}
/*dream level 2 plotbox 2*/

#d_level2_2{
	top:375px;
	left:1020px;
}

#d_level2_2:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#d_level2_2 .container{
	opacity:0;
	transition:all .5s;
	height:200px;
	width:410px;
	margin:0px;
	position:absolute;
	top:-287px;
	left:-274px;
	color:#021b23;
	border-radius:20px;
	background-color:rgba(198, 122, 69, .75);
	transform:rotate(44deg);
}
/*Dream Level 3*/

#d_level3{
	top:235px;
	left:874px;
}
#d_level3:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#d_level3 .container{
	opacity:0;
	transition:all .5s;
	height:200px;
	width:410px;
	margin:0px;
	position:absolute;
	top:-182px;
	left:-5px;
	border-radius:20px;
	background-color:rgba(102, 80, 97,.5);

}

/*LIMBO*/

#d_limbo{
	top:600px;
	left:872px;
}
#d_limbo:hover .container {
	opacity:1;
	/*animation-iteration-count: 0;
	animation-play-state: paused;*/
}
#d_limbo .container{
	opacity:0;
	transition:all .5s;
	height:140px;
	width:400px;
	margin:0px;
	position:absolute;
	top:-125px;
	left:-5px;
	border-radius:20px;
	background-color:rgba(255, 255, 255,.5);

}


h3{

}
p.info{
	font-size:18px;
	font-family: 'Cabin', sans-serif;
	font-weight:bolder;
	letter-spacing:.5px;
	line-height: 25px;
	margin:0px 20px 0px 20px;
}
div.link{
	font-family: 'Aldrich', sans-serif;
	font-weight: bold;
	position:absolute;
	bottom: 126px;
	right:32px;
	width:100px;
	text-align:center;
	color:white;
}
a.arrow{
	position:absolute;
	bottom: 29px;
	right:49px;
	font-size:100px;
	margin:0px;
	color:gray;
	font-weight:thin;
	text-decoration:none;
	display:inline-block;
	/*transform:rotate(30deg);*/
}
a.arrow:hover{
	color:white;
	font-size:100px;
}
a.arrow_level1{
	position:absolute;
	top: 600px;
	left:950px;
	font-size:80px;
	margin:0px;
	color:rgb(108, 122, 127);
	font-weight:thin;
	text-decoration:none;
	max-width:1300px;
	transform:rotate(45deg);
}
a.arrow_level1:hover{
	color:white;
	
}
a.arrow_level2{
	position:absolute;
	bottom: 187px;
	right:470px;
	font-size:70px;
	margin:0px;
	color:#c0cace;
	font-weight:thin;
	text-decoration:none;

}
a.arrow_level2:hover{
	color:white;
	
}
a.arrow_level3{
	position:absolute;
	bottom: 130px;
	right:175px;
	font-size:150px;
	margin:0px;
	color:#c67a45;
	font-weight:thin;
	text-decoration:none;
	transform:rotate(-45deg)
}
a.arrow_level3:hover{
	color:white;
	
}
a.arrow_level4{
	position:absolute;
	top: 420px;
	left:705px;
	font-size:70px;
	margin:0px;
	color:#665e4d;
	font-weight:thin;
	text-decoration:none;
}
a.arrow_level4:hover{
	color:white;
	
}
a.arrow_level5{
	position:absolute;
	top: 20px;
	right:50px;
	font-size:70px;
	margin:0px;
	color:#e2e2bc;
	font-weight:thin;
	text-decoration:none;
}
a.arrow_level5:hover{
	color:white;
	
}
div.link2{
	font-family: 'Aldrich', sans-serif;
	font-weight: bold;
	position:absolute;
	top: 100px;
	right:20px;
	width:100px;
	text-align:center;
	color:white;
}


