body {
	background-color: #333333;
}


@font-face {
	/*font-family: 'Akzidenz-Grotesk Std';
	src: url('./fonts/Akzidenz-Grotesk') format('otf')
		url('AkzidenzGrotesk.otf') format ('opentype');*/
	font-family: Akzidenz;
	src: url('../../fonts/Akzidenz-Grotesk/AkzidenzGrotesk.otf');
}

#title {
	text-align: center;
	font-size: 80pt;
	/*top: 300;*/
	position: relative;
	width: 1300px;
	margin-right: auto;
	margin-left: auto;
	font-family: Akzidenz;
	font-weight: 500;
	max-width: 100%;
}

#replace {
	text-align: center;
	font-size: 80pt;
/*	top: 1000;
*/	position: relative;
	width: 1300px;
	margin-right: auto;
	margin-left: auto;
	font-family: Akzidenz;
	font-weight: 500;
	max-width: 100%;
	background-color: #333333;
	background: linear-gradient(to bottom, #333 90%, transparent);
}


#one {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 350;
	border-radius: 50% 50%;
	float: left;
	left: 30;
}

#one:hover {
	background-color: DarkRed;
	/*cursor: pointer;*/
}

#two {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 410;
	border-radius: 50% 50%;
	float: left;
	left: 30;
}

#two:hover {
	background-color: Gold;
	cursor: pointer;
}

#three {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 470;
	border-radius: 50% 50%;
	float: left;
	left: 30;
}

#three:hover {
	background-color: LightBlue;
	cursor: pointer;
}

#four {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 530;
	border-radius: 50% 50%;
	float: left;
	left: 30;
}

#four:hover {
	background-color: violet;
	cursor: pointer;
}

#five {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 590;
	border-radius: 50% 50%;
	float: left;
	left: 30;
}

#five:hover {
	background-color: LimeGreen;
	cursor: pointer;
}

.content {
	display: none;
}


#six {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 350;
	border-radius: 50% 50%;
	float: right;
	right: 30;
}

#six:hover {
	background-color: Coral;
	cursor: pointer;
}

#seven {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 290;
	border-radius: 50% 50%;
	float: right;
	right: 30;
	
}

#seven:hover {
	background-color: DarkTurquoise;
	cursor: pointer;
}

#eight {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 230;
	border-radius: 50% 50%;
	float: right;
	right: 30;
	
}

#eight:hover {
	background-color: Orange;
	cursor: pointer;
}

#nine {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 170;
	border-radius: 50% 50%;
	float: right;
	right: 30;
	
}

#nine:hover {
	background-color: LightSteelBlue;
	cursor: pointer;
}

#ten {
	width: 40px;
	height: 40px;
	background-color: #5A5A5A;
	position: fixed;
	top: 110;
	border-radius: 50% 50%;
	float: right;
	right: 30;
	
}

#ten:hover {
	background-color: yellow;
	cursor: pointer;
}


.contentTwo {
	display: none;
}


#container {
    border:none;
    display: inline-block;
    overflow-y: auto;
    overflow-x: hidden;
    margin-top: 1000px;
    margin-left: 100px;
    width: 90%;
    max-width: 200%;
    min-width: 30%;
    height: auto;
}
    
      
.imgContainer {
	float:left;
    padding: 20px;
}

img {
	max-width: 200%;
	height: auto;
}

/*#imgContainerAll {
	max-width: 100%;
	height: auto;
}*/

/*.arrow-left {
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid #5A5A5A;
	position: fixed;
	margin-top: 15;
	margin-left: 30;
}*/