body { 
overflow: hidden; 
color: #222; 
font-family: helvetica, arial; 
line-height: 1.2; } 

a:active { 
outline: none;}

.nextbutton { 
position: absolute; 
top: 0;
right:0; 
height: 100%; 
width: 10%; 
z-index:9;}

.backbutton {
position: absolute; 
top: 0;
left:0;
height: 100%; 
width: 10%; 
z-index:9;}

.nextbutton { 
cursor: url('right.png'), e-resize; right: 0; 
z-index:9;}

.backbutton { 
cursor: url('left.png'), w-resize; left: 0; 
z-index:9;}

.main { 
text-align: center;
padding: 0 50px; 
margin-top: 150px; 
font-size: 50px; 
font-family:verida;
color:#24C0E3;
text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;}

.sub { 
text-align: center;
padding: 0 50px;  
font-family:verida;
color:#24C0E3;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;}

img { 
margin: 0 auto; 
display: block; 
margin-top: 50px;}

table { 
display: table;
width:100px;
height:40px;
margin-left:45%;
border-collapse: collapse;
position: absolute;
left:0;
bottom:0;
z-index: 5000;
}

table a {
line-height: 54px;
font-family: helvetica, arial;
font-size: 20px;
font-weight: bold;
text-decoration: none;
color: #1240ab;
display: block;
text-align: center;
margin: 0;
background-color: #4671d5;
-moz-transition: all 1s; 
-webkit-transition: all 1s; 
-o-transition: all 1s; 
transition: all 1s; 
}

#a1:target #p1, #a2:target #p2, #a3:target #p3 { 
background-color:#1240ab; 
color: #4671d5; }

table a:hover {
background-color: #1240ab;
color:#4671d5;
-moz-transition: background 0s; 
-webkit-transition: background 0s; 
-o-transition: background 0s; 
transition: background 0s; 
}

.page { 
position: absolute; 
width: 100%; 
height: 100%; 
}

#i1 { 
left: 0%; 
background-image:url('atomcv.jpg');
background-size:100% 100%;}

#i1 { 
left: 100%;
background-image:url('atomcv.jpg');
background-size:100% 100%;}

#i2 { 
left: 200%; 
background-image:url('time.jpg');
background-size:100% 100%;}

#i3 { 
left: 300%; 
background-image:url('science.jpg');
background-size:100% 100%;}

.page { 
-webkit-transition: -webkit-transform 0.8s;
-moz-transition: -moz-transform 0.8s;
-o-transition: -o-transform 0.8s;
transition: transform 0.8s; }

#a1:target .page { 
-webkit-transform: translateX(-100%); 
-moz-transform: translateX(-100%); 
-o-transform: translateX(-100%); 
transform: translateX(-100%); }

#a2:target .page { 
-webkit-transform: translateX(-200%); 
-moz-transform: translateX(-200%); 
-o-transform: translateX(-200%); 
transform: translateX(-200%); }

#a3:target .page { 
-webkit-transform: translateX(-300%); 
-moz-transform: translateX(-300%); 
-o-transform: translateX(-300%); 
transform: translateX(-300%); }

.page { 
-webkit-transform: translateX(-100%); 
-moz-transform: translateX(-100%); 
-o-transform: translateX(-100%); 
transform: translateX(-100%); }

.button {
	-moz-box-shadow:inset 0px 0px 0px 0px #fceaca;
	-webkit-box-shadow:inset 0px 0px 0px 0px #fceaca;
	box-shadow:inset 0px 0px 0px 0px #fceaca;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffce79), color-stop(1, #eeaf41) );
	background:-moz-linear-gradient( center top, #ffce79 5%, #eeaf41 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffce79', endColorstr='#eeaf41');
	background-color:#ffce79;
	-webkit-border-top-left-radius:0px;
	-moz-border-radius-topleft:0px;
	border-top-left-radius:0px;
	-webkit-border-top-right-radius:0px;
	-moz-border-radius-topright:0px;
	border-top-right-radius:0px;
	-webkit-border-bottom-right-radius:0px;
	-moz-border-radius-bottomright:0px;
	border-bottom-right-radius:0px;
	-webkit-border-bottom-left-radius:0px;
	-moz-border-radius-bottomleft:0px;
	border-bottom-left-radius:0px;
	text-indent:0px;
	border:1px solid #eeb44f;
	display:inline-block;
	color:#ffffff;
	font-family:verida;
	font-size:21px;
	font-weight:bold;
	font-style:normal;
	height:50px;
	line-height:50px;
	width:150px;
	text-decoration:none;
	text-align:center;
	text-shadow:2px 2px 0px #ce8e28;
	cursor:pointer;
	z-index:5000;
}
.button:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #eeaf41), color-stop(1, #ffce79) );
	background:-moz-linear-gradient( center top, #eeaf41 5%, #ffce79 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeaf41', endColorstr='#ffce79');
	background-color:#eeaf41;
}.button:active {
	position:relative;
	top:1px;
}
