* {
	outline: none;
}

html, body {
	margin: 0px;
	text-size-adjust: 100% !important;
	-webkit-text-size-adjust: 100%;
	max-height: 999999px;
	overflow: hidden;
	color: #333;
	background-color: #d1d9dd;
	width: 100%;
	height: 100%; 
	margin: 0; 
	padding: 0;
}

a img { 
	margin: 0; 
	padding: 0; 
	border-style: none; 
	border-width: 0;
	display: block;
}

.no-touchevents .legacy-notice-touch {
	display: none;
}

.touchevents .legacy-notice-safe {
	display: none;
}

.legacy-notice { 
	background-color: #bf5b5d; 
	position: absolute; 
	top: 0; 
	left: 0;
	width: 100vw; 
	height: 100%; 
	z-index: 3000;
	color: white;
	display: flex;
	align-items: center;
  	justify-content: center;
  	font-family: Arial, Helvetica, sans-serif;
  	line-height: 1.4em;
}

.legacy-notice a { 
	color: white;
	text-decoration: underline;
}

.confirm {
	background: #fff;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	line-height: 80px;
	text-align: center;
	color: #bf5b5d !important;
	display: inline-block;
	text-decoration: none !important;
	margin-top: 30px;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	letter-spacing: 1px;
}

.notice-inner {
	max-width: 620px;
	padding: 30px;
	text-align: center;
}

.legacy-notice img {
	width: 16px;
	display: inline-block;
	margin-bottom: 8px;
}

.loading { 
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100vw;
	height: 100vh;
	display: flex;
	align-items: center;
  	justify-content: center;
  	z-index: 2500;
  	background-color: #dddab1;
}

.loading img {
	width: 32px;
	height: 32px;
}

#wrapper {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}

#inner { 
	background-image: url(../graphics/background.jpg); 
	background-repeat: repeat; 
	width: 19300px; 
	height: 1500px; 
	position: relative;
	will-change: transform;
}

#menu-wrapper {
	position: fixed;
	z-index: 1000;
	bottom: 12px; 
	right: 12px;
	font-size: 12px;
}

#menu-wrapper a {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	font-size: 0.95em;
	letter-spacing: 0.08em;
	color: black;
	text-decoration: none;
	transition: 0.3s
}

#menu-links { 
	position: relative;
	background: #afae90;
	top: 0;
	height: 174px;
	border: 2px solid black;
	box-sizing: border-box;
	border-radius: 10px;
	padding-left: 100px;
	padding-right: 20px;
	vertical-align: top;
	margin-left: -87px;
	display: inline-flex;
	align-items: center;
}

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

#menu-links ul a { 
	border-bottom: 1px solid black;
	padding-bottom: 2px;
	padding-top: 2px;
	display: block;
}

#menu-links ul li:last-child a { 
	border-bottom: 0px;
	padding-bottom: 2px;
	padding-top: 2px;
}

.selected {
	color: #920d0d !important;
}

.title-name {
	position: relative;
	width: 174px;
	height: 174px;
	background: #dddab1;
	border-radius: 50%; 
  	align-items: center;
  	justify-content: center;
  	flex-direction: column;
  	border: 2px solid black;
  	box-sizing: border-box;
  	z-index: 1100;
  	display: inline-flex;
  	vertical-align: top;
}

.title-name::after {
	display: block;
	position: absolute;
	content: "";
	width: 166px;
	height: 166px;
	top: 2px;
	left: 2px;
	border-radius: 50%;
	border: 1px solid black;
	box-sizing: border-box;
}

.title-links {
	position: relative;
	z-index: 1001;
}

.title-name img {
	width: 130px;
	display: block;
	margin-top: 6px;
	margin-left: 6px;
}

.title-name a {
	display: inline-block;
	padding-left: 3px;
	padding-right: 4px;
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: 10px;
}

.title-name a:first-child {
	border-right: 1px solid black;
}

.about {
	transform: translateX(-2056px);
	transition: 2s;
}

.contact {
	transform: translateX(-14541px);
	transition: 2s;
}

.content1 {
	transform: translateX(-2056px);
	transition: 2s;
}

.content2 {
	transform: translateX(-3386px);
	transition: 2s;
}

.content3 {
	transform: translateX(-4681px);
	transition: 2s;
}

.content4 {
	transform: translateX(-6226px);
	transition: 2s;
}

.content5 {
	transform: translateX(-7515px);
	transition: 2s;
}

.content6 {
	transform: translateX(-9241px);
	transition: 2s;
}

.content7 {
	transform: translateX(-10541px);
	transition: 2s;
}

.content8 {
	transform: translateX(-11841px);
	transition: 2s;
}

.content9 {
	transform: translateX(-13241px);
	transition: 2s;
}

.content10 {
	transform: translateX(-16041px);
	transition: 2s;
}

.content10b {
	transform: translateX(-17466px);
	transition: 2s;
}

.hide {
	display: none !important;
}

a { 
	cursor: pointer !important; 
}

.control {
	display: block;
	width: 100%;
	height: 100%;
}

.inline-control {
	display: inline-block;
}

/* ABOUT/CONTACT */

#aboutTEXT {
	position: absolute;
	font-family: 'Special Elite', cursive;
	z-index: 10;
	left: 1180px;
	width: 440px;
	height: 700px;
	opacity: 0.75;
	top: 90px;
	transform: rotate(2deg);
	font-size: 12px;
	line-height: 20px;
}

#aboutIMG img {
	vertical-align: top;
}

#about { position: absolute; top: 0; left: 2056px; width: 1001px; height: 844px; }
#aboutIMG { position: absolute; top: 0; left: -700px; width: 1701px; height: 844px; }
#contact { background-image: url(../graphics/contact.jpg); background-repeat: no-repeat; background-position: 70px 0; position: absolute; top: 0; left: 14541px; width: 1400px; height: 531px; }
#creditlink { position: absolute; top: 38px; left: 101px; width: 50px; height: 300px;}
#social { background-image: url(../graphics/social.png); position: absolute; top: 250px; left: 330px; width: 122px; height: 128px; }
#facebook { position: absolute; top: 52px; left: 65px; width: 55px; height: 55px; }
#twitter { position: absolute; top: 35px; left: 10px; width: 50px; height: 50px;}
.twitter { width: 50px; height: 50px; }
.facebook { width: 55px; height: 55px; }

/* DO NOT SUCCUMB TO FEAR OF SHADOWS */

#succumb1 { background-image: url(../images/succumb/succummb-back.jpg); position: absolute; top: 0; left: 20px; width: 934px; height: 884px; }
#succumb-slides { position: absolute; top: 45px; left: 33px; width: 584px; height: 585px; }
#succumb-2 { background-image: url(../images/succumb/donot-2.jpg); position: absolute; top: 0; left: 1405px; width: 1294px; height: 818px; }
#suc-controls { position: absolute; top: 20px; left: 820px; }
#suc-play { background-image: url(../images/succumb/play.png); position: absolute; left: 40px; width: 50px; height: 20px; cursor: pointer; }
#suc-pause { background-image: url(../images/succumb/pause.png); position: absolute; left: 40px; width: 50px; height: 20px; cursor: pointer; display: block; }
#suc-next { background-image: url(../images/succumb/next.png); position: absolute; top: 20px; left: 40px; width: 50px; height: 20px; cursor: pointer; display: block; }
#suc-previous { background-image: url(../images/succumb/previous.png); position: absolute; top: 40px; left: 35px; width: 50px; height: 20px; cursor: pointer; display: block; }
#suc-goto2 { background-image: url(../images/succumb/goto2.png); position: absolute; top: 60px; left: 0; width: 81px; height: 30px; cursor: pointer; display: block; }
#suc-return { background-image: url(../images/succumb/backto1.png); position: absolute; top: 20px; left: 830px; width: 80px; height: 37px; cursor: pointer; display: block; }
#suc2-anch { position: absolute; left: 100px; }

/* IT REALLY DOESN'T MATTER */

#itreally { position: absolute; top: 50px; left: 113px; width: 888px; height: 457px; }
.it-1 { width: 459px; height: 358px; }
.it-2 { width: 403px; height: 457px; }
.it-3 { width: 888px; height: 358px; }
#itreally-controls { background-image: url(../images/itreally/itreally-control.png); position: absolute; top: -4px; right: -50px; width: 321px; height: 47px; }
#itreally-play { background-image: url(../images/itreally/itreally-play.png); position: absolute; top: 10px; left: 14px; width: 54px; height: 27px; cursor: pointer; }
#itreally-pause { background-image: url(../images/itreally/itreally-pause.png); position: absolute; top: 0; left: 10px; width: 70px; height: 34px; cursor: pointer; display: block; }
#itreally-next { background-image: url(../images/itreally/itreally-next.png); position: absolute; top: 0; left: 80px; width: 68px; height: 39px; cursor: pointer; display: block; }
#itreally-previous { background-image: url(../images/itreally/itreally-prev.png); position: absolute; top: -3px; left: 150px; width: 84px; height: 40px; cursor: pointer; display: block; } 

/* THE GRASS IS ALWAYS GREENER */

.the-grass-is-always-greener-container-mask {
	position: absolute;
	height: 290px; 
	width: 421px; 
	left: 98px; 
	top: 149px;
	z-index: 100;
	background-image: url(../graphics/the-grass-mask.png);
	background-repeat: no-repeat;
}

#thegrass { height: 290px; width: 421px; left: 98px; top: 149px; position: absolute; }
#controlGrass { position: absolute; top: 46px; left: 395px; width: auto; height: auto; }

/* HOME */

.home-mask { 
	height: 391px; 
	width: 526px; 
	left: 330px; 
	top: 20px; 
	position: absolute;
	z-index: 100;
	background-image: url(../graphics/home-mask.png);
	background-repeat: no-repeat;
}

#home { background-image: url(../graphics/home.jpg); height: 391px; width: 526px; left: 330px; top: 20px; position: absolute; }

/* I HAVE NOTHING TO SAY */

.i-have-nothing-to-say-mask { 
	height: 288px; 
	width: 439px; 
	left: 75px;
	top: 204px; 
	position: absolute;
	z-index: 100;
	background-image: url(../graphics/i-have-mask.png);
	background-repeat: no-repeat;
}

#IhaveMenu { position: absolute; top: 134px; left: 823px; width: 168px; height: 92px; }
#ihavenothing { height: 288px; width: 439px; left: 75px; top: 204px; position: absolute; }

/* NOSTALGIC CANNIBALSIM */

.nostalgic-mask { 
	position: absolute;
	top: 94px;
	left: 283px;
	width: 499px;
	height: 311px;
	z-index: 100;
	background-image: url(../graphics/nostalgic-mask.png);
	background-repeat: no-repeat;
}

.nostalgic-play {
	position: absolute;
	width: 33px;
	height: 61px;
	bottom: 3px;
	left: 0px;
} 

#nostalgic { position: absolute; top: 94px; left: 283px; width: 499px; height: 311px; }
#nostalgicMenu { position: absolute; top: 226px; left: 162px; width: 33px; height: 250px; }

/* IMPOSSIBILITY OF ESCAPASIM */

#impossibility { background-repeat: no-repeat; height: 670px; width: 494px; left: 20px; top: 0; position: absolute; }
#ImpossMenu2 { position: absolute; top: 269px; left: 768px; width: 155px; height: 105px; }

/* ZOO */

#zoo { height: 442px; width: 633px; left: -2px; top: 30px; position: absolute; }
#ZooMenu { position: absolute; top: 489px; left: 91px; width: 250px; height: 80px; }
#content6IMG { background-image: url(../graphics/zoo.jpg); background-repeat: no-repeat; position: absolute; top: 0; left: -1100px; width: 1787px; height: 636px; }

/* INDEXES */

#tea { background-image: url(../graphics/tea.jpg); position: absolute; top: 0; left: 894px; width: 376px; height: 429px; }
#theGrassIndex { background-image: url(../graphics/theGrassIndex.jpg); position: absolute; width: 931px; height: 628px; }
#impossibilityIndex { background-image: url(../graphics/ImpossIndexMenu.jpg); background-repeat: no-repeat; background-position: right 0; position: absolute; width: 931px; height: 628px; }
#ihaveIndex { background-image: url(../graphics/IhaveIndex2.jpg); position: absolute; width: 931px; height: 628px; }
#zooIndex { background-image: url(../graphics/zooIndex.jpg); position: absolute; width: 931px; height: 628px; }
#nostalgicIndex { background-image: url(../graphics/nostalgicIndex.jpg); position: absolute; width: 931px; height: 628px; }
#theGrassBack, #impossBack, #ihaveBack, #zooBack, #nostalgicBack { position: absolute; top: 230px; left: 735px; width: 145px; height: 60px; }
#impossIndexMenu { position: absolute; top: 94px; left: 735px; width: 99px; height: 85px;}
#foundIndex { background-image: url(../graphics/foundIndex.jpg); position: absolute; width: 931px; height: 628px; }
#objectIndex { background-image: url(../graphics/objectIndex.jpg); position: absolute; width: 931px; height: 628px; }
#prisonIndex { background-image: url(../graphics/prisonIndex.jpg); position: absolute; width: 931px; height: 628px; }
#ihaveIndexMenu { position: absolute; top: 94px; left: 764px; width: 110px; height: 60px; }
#ihaveIndex1 { background-image: url(../graphics/IhaveIndex1.jpg); position: absolute; width: 931px; height: 628px; }

/* CONTENT BLOCKS */

#content2 { background-image: url(../graphics/ihavenothing.jpg); position: absolute; top: 0; left: 3386px; width: 1295px; height: 582px; }
#content3 { background-image: url(../graphics/impossibility.jpg); position: absolute; top: 0; left: 4681px; width: 936px; height: 800px; }
#content4 { position: absolute; top: 0; left: 6226px; width: 931px; height: 628px; }
#content5 { background-image: url(../graphics/thegrass.jpg); height: 655px; width: 626px; left: 7515px; top: 0; position: absolute; }
#content6 { position: absolute; top: 0; left: 9241px; width: 100px; height: 100px; }
#content7 { background-repeat: no-repeat; background-position: 520px 0; position: absolute; top: 0; left: 10541px; width: 1000px; height: 400px; }
#content8 { background-image: url(../graphics/nostalgic.jpg); background-repeat: no-repeat; background-position: 115px 0; position: absolute; top: 0; left: 11841px; width: 1630px; height: 547px; }
#content9 { position: absolute; top: 0; left: 13241px; width: 1000px; height: 540px; }
#content10 { position: absolute; top: 0; left: 16041px; width: 1000px; height: 540px; }