HTML
<!DOCTYPE html>
<html>
<head>
<div style= padding-left:55px>
<div style= margin:35px>
<ul id="roles">
<li><a href=roles.html>Roles</a></li>
<li><a href=roles.html>Customizations</a></li>
<li><a href=roles.html>Settings</a></li>
<li><a href=paint.html>Painting</a></li>
</div>
</div>
</head>
<html>
<title>
City Against Gang
</title>
<h2>
Welcome
</h2>
</div>
<div>
<h1>
City Against Gang
</h1>
</div>
<h3>
<br><br><br><br><br><br><br><br><br><br><br><br>
City Against Gang is a game that is based off of the game "Mafia". This game is placed in a modern day scenario with more practical role. This game is a great way to develop some good tactics, be mischevious, and most importantly have fun!
</h3>
<h4>
If your ready click below!!!!
</h4>
</div>
<div>
<br>
<div id= "play">
<button>
Play Now
</button>
</div>
<br>
<br><br>
</div>
<body></body>
</html>
<style>
h1 {
text-align:center;
font-size:42px;
color:white;
}
h2 {
text-align:center;
font-size:42px;
color:Red;
}
h3 {
text-align:center;
font-size:30px;
}
h4 {
text-align:center;
font-size:30px;
color:White;
}
body {
background-image: url(http://i.imgur.com/0kW1ICL.jpg);
}
Button {
-moz-box-shadow: 3px 4px 0px 0px #000000;
-webkit-box-shadow: 3px 4px 0px 0px #000000;
box-shadow: 3px 4px 0px 0px #000000;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ff1500), color-stop(1, #8a1911));
background:-moz-linear-gradient(top, #ff1500 5%, #8a1911 100%);
background:-webkit-linear-gradient(top, #ff1500 5%, #8a1911 100%);
background:-o-linear-gradient(top, #ff1500 5%, #8a1911 100%);
background:-ms-linear-gradient(top, #ff1500 5%, #8a1911 100%);
background:linear-gradient(to bottom, #ff1500 5%, #8a1911 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1500', endColorstr='#8a1911',GradientType=0);
background-color:#ff1500;
-moz-border-radius:18px;
-webkit-border-radius:18px;
border-radius:18px;
border:1px solid #000000;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:28px;
padding:12px 25px;
text-decoration:none;
text-shadow:0px 4px 0px #000000;
}
#play {
text-align:center;
}
#roles {
padding:0;
padding-left:2px;
}
#roles li {
display:inline;
}
#roles li a {
background-color:Gray;
color:white;
padding:10px 20px;
text-decoration:none;
border-radius:4px 4px 0 0;
}
#roles li a:hover {
background-color:orange;
}
#custom {
padding:0;
padding-left:2px;
}
#custom li {
display:inline;
}
#custom li a {
background-color:Gray;
color:white;
padding:10px 20px;
text-decoration:none;
border-radius:4px 4px 0 0;
}
#custom li a:hover {
background-color:orange;
}
</style>