I have no clue how to fix this at all.
Forum: virtuous-realms.board-directory.net
HTML Link: http://virtuous-realms.board-directory.net/h5-welcome-page
Forum: virtuous-realms.board-directory.net
HTML Link: http://virtuous-realms.board-directory.net/h5-welcome-page
- Code:
<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>
<style type="text/CSS">
body {
background: url(http://fc08.deviantart.net/fs71/f/2014/356/5/4/hompagebackground_by_shadesofjay-d8avfb7.jpg) no-repeat center top fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: 1296px 700px;
font-size: 11px;
font-family: Courier;
letter-spacing: 0.02in;
}
.box {
margin-left: 70%;
margin-top: 54%;
width: 400px;
background-image: url(http://i.imgur.com/0lzIxXu.png);
text-align: center;
}
.forumotion{
opacity: 0.0;
bottom: 0px;
left: 0px;
width: 3oopx;
background-image: url(http://i.imgur.com/0lzIxXu.png);
text-align: center;
}
.sitename {
text-align: center;
font-family: Georgia;
font-variant: small-caps;
font-size: 30px;
letter-spacing: 5px;
color: #FFF;
text-shadow: 0px 0px 10px;
}
a:link {
color: #a294b5;
text-decoration: none;
}
a:visited {
color: #a294b5;
text-decoration: none;
}
a:hover, a:active {
color: #fff;
text-decoration: none;
text-shadow: 0px 0px 3px;
transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-webkit-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
}
@import url(http://weloveiconfonts.com/api/?family=entypo);
@import url(http://fonts.googleapis.com/css?family=Alef);
/* entypo */
[class*="entypo-"]:before { font-family: 'entypo', sans-serif }
*{-webkit-font-smoothing:antialiased;}
body {
background: url(http://subtlepatterns.com/patterns/cream_pixels_@2X.png);
/*background-size*/
background-size: 160px;
font-family: Alef;
}
#nav {
width: 180px;
margin: 100px auto;
}
ul {
list-style: none;
padding: 0;
margin: 0;
width: 180px;
}
ul a {
display: block;
width: 100%;
height: 44px;
background: #E7533C;
color: #fafafa;
text-decoration: none;
text-align: left;
line-height: 2;
padding-left: 10px;
font-size: 1.4em;
border-bottom: 3px solid #cc4531;
}
ul a span {
float: right;
display: block;
margin: 0;
width: 44px;
height: 44px;
font-size: 1.4em;
text-align: center;
line-height: 1.5;
}
ul li {
width: 0;
height: 0px;
background: #E7533C;
clear: both;
}
ul li a {
color: transparent;
height: 0;
/*box-shadow*/
box-shadow: 0 2px 2px rgba(0,0,0,.1);
padding-left: 0;
}
ul li a span {
font-size: .9em;
line-height: 2.4;
}
ul:hover li a { padding-left: 10px }
ul:hover span { background: #cc4531 }
ul:hover li span { background: transparent }
ul li:hover > a { background: #cc4531 }
ul li:hover {
margin-top: 8px;
margin-bottom: 8px;
}
ul li:nth-child(1) {
transition: all 0s ease;
}
ul li:nth-child(2) {
transition: all 0s ease;
}
ul li:nth-child(3) {
transition: all 0s ease;
}
ul li:nth-child(4) {
transition: all 0s ease;
}
ul a:hover > span { background: #cc4531 }
ul:hover > li a {
color: #fff;
height: 44px;
}
ul li a:hover { border-bottom: 3px solid #9d3323 }
ul:hover li:nth-child(2) {
width: 100%;
height: 44px;
transition: all .1s ease;
}
ul:hover li:nth-child(3) {
width: 100%;
height: 44px;
transition: all .1s ease .1s;
}
ul:hover li:nth-child(4) {
width: 100%;
height: 44px;
transition: all .1s ease .2s;
}
ul:hover li:nth-child(5) {
width: 100%;
height: 44px;
transition: all .1s ease .3s;
}
</style>
</head>
<body>
<div id="nav">
<ul>
<li style="list-style: none; display: inline">
<a href="#">Menu<span class="entypo-right-open-big"></span></a>
</li>
<li>
<a href="#">Forum<span class="entypo-doc-text"></span></a>
</li>
<li>
<a href="#">Blog<span class="entypo-pencil"></span></a>
</li>
<li>
<a href="#">About Us<span class="entypo-info"></span></a>
</li>
<li>
<a href="#">Contact Us<span class="entypo-mail"></span></a>
</li>
</ul>
</div>
<table align="center" width="70%">
<tr>
<td valign="middle">
<div class="box">
<div class="sitename">
Virtuous-Realms
</div>
<a href=
"http://www.virtuous-realms.board-directory.net/forum">click
here to enter the forum</a>
</div>
<div class="forumotion">
<a href="http://www.forumotion.com" target=
"_blank">forumotion.com</a>
</div>
</td>
</tr>
</table>
</body>
</html>