faq page

<!DOCTYPE html>
<head>

<!---faq page by eurhipides. basic theme rules apply, visit elisionthemes if you have any questions. enjoy!--->

    <title>frequently asked questions</title><!---page title--->
    <link rel="shortcut icon" href="{Favicon}">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>

<script>

(function($){

$(document).ready(function(){

$("a[title]").style_my_tooltips({

tip_follows_cursor:true,

tip_delay_time:100,

tip_fade_speed:300,

attribute:"title"

});

});

})(jQuery);

</script>

<link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

    <style type="text/css">

#s-m-t-tooltip { /*edit the tooltips*/
    max-width:150px;
    padding:5px 8px;
    margin:20px 14px 7px 10px;
    background-color:#fff;
    font-family:Calibri;
    font-size:10px;
    line-height:11px;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#16a085;
    z-index:99999999;
}

::-webkit-scrollbar {
    height:6px;
    width:6px;
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #8FE9D7; /*scrollbar color*/
    border-right:4px solid #fff;
    border-top:4px solid #fff;
    border-bottom:4px solid #fff;
}

body {
    background-color: #16a085; /*page background*/
    font-family:arial;
    font-size:12px;
    margin:0px;
}

a {
    text-decoration: none;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
    color: #16a085; /*link color*/
}

a:hover {
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    transition: 0.5s;
    color: #8FE9D7; /*link hover*/
}

.con {
    width:780px;
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin:auto;
    height:500px;
    background:#fff; /*box color*/
}

.content {
    position:absolute;
    top:25px;
    left:25px;
    right:25px;
    bottom:25px;
    padding:25px;
    overflow:auto;
    border:4px solid #1abc9c; /*border color*/
    font-family:'Montserrat', sans-serif;
}

.title {
    font-size:22px;
    text-transform:uppercase;
    font-weight:bold;
    margin-bottom:15px;
    color:#1abc9c; /*color of both titles*/
}

.q {
    font-size:14px;
    color:#777; /*question color*/
}

.a {
    margin-top:5px;
    font-size:14px;
    margin-bottom:15px;
    font-style:italic;
    margin-left:20px;
    color:#999;/*answer color*/
}

.links {
    position:absolute;
    right:20px;
    bottom:-25px;
    font-family:'Montserrat', sans-serif;
}

.links a {
    color:#fff; /*color of four bottom links*/
    margin:0px 5px;
    text-transform:capitalize;
}

</style>
</head>
<body>

<div class="con">
    <div class="content">
        <div class="title">frequently asked questions</div> <!---title--->

        <div class="q">This is what a question looks like?</div>
        <div class="a">This is what an answer looks like. <a href="/">Link</a>, <b>bolded</b>, <u>underlined</u>.</div>

        <!----to add a new question copy and paste from here--->
        <div class="q">This is what a question looks like?</div>
        <div class="a">This is what an answer looks like.</div>
        <!---to here--->

        <div class="q">This is what a question looks like?</div>
        <div class="a">This is what an answer looks like.</div>

        <div class="q">This is what a question looks like?</div>
        <div class="a">This is what an answer looks like.</div>

        <div class="q">This is what a question looks like?</div>
        <div class="a">This is what an answer looks like.</div>

        <div class="title" style="margin-top:25px">Contact</div><!---title-->

        <iframe frameborder="0" scrolling="no" width="100%" height="260" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="overflow:auto; margin-top:10px" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]-->

    </div>

    <div class="links">
        <a href="http://astraeus.co.vu" title="eurhipides">credit</a>
        <a href="http://tumblr.com/dashboard">dash</a>
        <a href="/">link 1</a><!---first link-->
        <a href="/">link 2</a><!---second link--->
    </div>


</div><!---con--->


</body>
</html>