body
{margin:0;
padding:0;
overflow:hidden;}

#box
{position:fixed;
top:85%;
left:80%;
list-style-type:none;
text-align:center;
z-index:99;}

#box li
{display:inline;
float:left}

#box a
{display:block;
padding:12px 10px;
margin:1px;
background:#555;
text-decoration:none;
color:#fff;
font:10px 'Century Gothic';
-moz-transition:all 0.5s;
transition:all 0.5s;}

#box a:hover
{background:#00b3d4;}

#i1 h1
{text-align:center;
margin-top:80px;
color:#fff;
font: 70px rockwell;}

#i1 p
{width:60%;
margin-left:20%;
text-align:center;
color:#fff;
font:25px Rockwell;
line-height:180%;}

#i2 h1, #i3 h1, #i0 h1
{width:35%;
margin-left:15%;
margin-top:80px;
color:#fff;
font:70px 'Century Gothic';}

#i2 p, #i3 p
{float:left;
width:40%;
margin-left:15%;
color:#fff;
font:25PX 'Century gothic';
line-height:180%;}

.page
{position: absolute;
width: 100%;
height: 100%;
-webkit-transition: -webkit-transform 0.8s;
-moz-transition: -moz-transform 0.8s;
-o-transition: -o-transform 0.8s;}

#i1
{left: 0%; background-color: transparent;}

#i1
{left: 100%; background-color: transparent;}

#i2
{left: 200%; background-color: transparent;}

#i3
{left: 300%; background-color: transparent;}

#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%);}