Links Page #1

<!DOCTYPE html>
<html>
<style>


    h1 {
        color:#fff;
        position:relative;
        top:-5px;
        left:30px;
        font-weight:normal;
        font-family:arial,sans-serif;
    }

    body {
        background-color:#003D67;
        max-width:800px;
        /*margin:0 auto;*/
    }

    li {
        color:#fff;
        display:inline;
        padding:10px;
        position:relative;
        top:-70px;
        float:right;
        font-family:arial;
    }

    .links a {
        color:#fff;
        text-decoration:none;
        text-transform:uppercase;
        font-size:10px;
    }

    .links a:hover {
        letter-spacing:3px;
        width:150px;
        -webkit-transition: all 0.4s ease-in-out;
        -moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        -ms-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        padding:8px;
    }

    ul a {
        color:#fff;
        text-decoration:none;
    }


    ul a:hover {
        font-weight:bold;
    }

    .line {
        height:3px;
        width:800px;
        background-color:#fff;
        margin:0 auto;
        position:relative;
        top:-20px;
    }

    /*
    #category {
        display:inline-block;
        padding:10px;
    }
    */

    .title {
        color:#fff;
        width:200px;
        height:15px;
        text-transform:uppercase;
        font-size:12px;
        font-family:arial;
        background-color:#bbb;
        text-align:center;
        /*margin:0 auto;*/
        display:block;
    }

    .links {
        width:200px;
        height:170px;
        font-size:17px;
        font-family:arial;
        background:#002d4d;
        text-align:center;
        padding-bottom:px;
        display:inline-block;
        border-bottom:2px solid white;
    }

    .fandoms {
        margin:10px;
        position:relative;
        height:200px;
        display:inline;
        left:100px;  /*don't worry, it looks fine normally!!*/
        top:0px;
    }

    .people {
        margin:5px;
        position:relative;
        height:200px;
        display:inline;
        left:320px;
        top:-187px;
    }

    .other {
        margin:10px;
        position:relative;
        height:200px;
        display:inline;
        left:540px;
        top:-374px;
    }

    #all {
        margin:0 auto;
    }
</style>
<div id="all">
<body>
    <h1>Tags</h1>
    <ul>
        <li><a href="/">back home</a></li>
        <li><a href="/">about</a></li>
        <li><a href="/">blogroll</a></li>
    </ul>
    <div class="line"></div>
    <div class="table">

        <div id="category">

        <div class="fandoms">
            <div class="title">title</div>

            <div class="links">

                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">link</a><br>

            </div>

            </div>
        </div>

        <div class="people">
            <div class="title">title</div>

            <div class="links">

                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">Link</a><br>


            </div>

            </div>
        </div>

        <div class="other">
            <div class="title">title</div>

            <div class="links">

                <a href="/">link</a><br>
                <a href="h/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">link</a><br>
                <a href="/">Link</a><br>

            </div>

            </div>
        </div>


        </div>
        </div>
</body>
</div>
</html>