html11

<head>

<title>Ask</title>

<!--------------------------------------------------------------------------
------------------------ Adrienne Law's navi page ------------------------------------------------Give credit where credit is due-------------------------------------------------------------------------------------------------->

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

<script src="http://code.jquery.com/jquery-1.10.0.min.js">
</script>
<script>
$(document).ready(function(){

 $(".one").click(function(){
  $(".1").toggle();
    $(".2,.3").hide();
 });
  $(".two").click(function(){
    $(".2").toggle();
    $(".1,.3").hide();
  });
  $(".three").click(function(){
    $(".3").toggle();
    $(".1,.2").hide();
  });
});
</script>

<style type="text/css">

::-webkit-scrollbar-thumb:vertical {
    background-color: #ccc; /*Change color of scroll bar*/
    height:5px;
}
::-webkit-scrollbar-corner {
    background-color: transparent;
}
::-webkit-scrollbar-thumb:horizontal {
	background-color: #ccc; /*Change color of scroll bar*/
	height:5px!important;
}

::-webkit-scrollbar {
	height:7px;
	width:5px;
}

iframe#tumblr_controls{
    position:fixed !important;
    right:0px !important;
    z-index:999;
}

html, body {
    background-color:white;
}

a {
    text-decoration:none;
    color:#0026FF;
}
a:hover{
    color:#D9DEFF;
}

.1, .2, .3 {display:none;}

#container {
    width:600px;
    height:auto;
    margin-top:120px;
    margin-left:auto;
    margin-right:auto;
}

#title {
    display:inline-block;
    width:360px;
    border:3px double #efefef;
    text-align:center;
    font-family:'raleway';
    color:#a7a7a8;
    margin-top:8px;
    margin-left:200px;
    padding:10px;
    position:absolute;
    font-weight:400;
}

#links{
    display:inline-block;
    width:366px;
    font-family:'raleway';
    color:#a7a7a8;
    margin-top:54px;
    margin-left:200px;
    padding:10px;
    position:absolute;
    font-size:12px;
    text-align:center;
    font-weight:100;
}
    #links a{
        width:80px;
        text-decoration:none;
        display:inline-block;
        color:#a7a7a8;
    }
    #links a:hover{
        color:#efefef;
        text-decoration:underline;
    }
#picture {
    display:inline-block;
    height:400px;
    border:1px solid #efefef;
    margin:8px;
    text-align:center;
    position:absolute;
    width:178px;

}
    #picture img {
        height:394px;
        padding:3px;
        width:172px;
    }

#content {
    display:inline-block;
    width:364px;
    height:298px;
    border:1px solid #efefef;
    font-family:'raleway';
    color:#a7a7a8;
    margin-top:90px;
    margin-left:200px;
    padding:10px;
    position:absolute;
    font-size:12px;
    overflow:hidden;
}

#links2 {
    width:364px;
    border-bottom:1px solid #efefef;
    text-align:center;
}
    #links2 a{
        display:inline-block;
        width:100px;
        padding:5px;
        text-decoration:none;
        color:#a7a7a8;
    }
    #links2 a:hover{
        color:#efefef;
    }

.current {
    background-color:#efefef;
}

#content2 {
    width:362px;
    height:264px;
    margin-top:8px;
    border:1px solid #efefef;
    font-weight:100;
    overflow:scroll;
}
#content3 {
    width:364px;
    height:264px;
    margin-top:8px;
    font-weight:100;
}

#credit a {
        display:inline-block;
        width:40px;
        background-color:#fff;
        color:gray;
        text-decoration:none;
        border-right:1px solid;
        border-left: 1px solid;
        border-color:#878787;
        padding: 2px 0px 2px 0px;
        -o-transition: all 1s ease-out;
        -webkit-transition: all 1s ease-out;
        -moz-transition: all 1s ease-out;
    }

    #credit a:hover {
        background-color:#667371;
        color:#fff;
        border-color:#fff;
        -o-transition: all 1s ease-out;
        -webkit-transition: all 1s ease-out;
        -moz-transition: all 1s ease-out;
    }

#credit {
    display:inline-block;
    font-size:10px;
    font-family: calibri;
    text-align:center;
    letter-spacing:1px;
    width:40px;
    height:15px;
    position: fixed;
    padding-top:1px;
    right:25px;
    bottom:10px;

}


</style>

<body>

<div id="container">

<!--- REPLACE URL WITH THAT OF ANOTHER PICTURE THAT YOU'D LIKE ON YOUR PAGE --->
    <div id="picture"><img src="https://31.media.tumblr.com/2cee8094958cbdde900fee937df68237/tumblr_n6ha6obmSY1two4qso1_r2_500.jpg"></div>
    <div id="title">Inquire</div>


<!--- CHANGE LINKS HERE --->

    <div id="links">
        <a href="/">Home</a>
        <a href="/me">About</a>
        <a href="/navigation">Navigation</a>
        <a href="/inquire">Inquire</a>
    </div><!-- end of div "links" -->


<!--- DON'T MESS WITH THESE --->

    <div id="content" class="1">
        <div id="links2">
            <a class="current">FAQ</a>
            <a class="two" href="#">Ask</a>
            <a class="three" href="#">Submit</a>
        </div><!-- end of div "links2" -->


<!--- FAQ TEXT HERE --->

        <div id="content2">
        <div style="padding-left:10px;font-weight:400;"><p>Please read the FAQ before asking me anything</p></div>
            <ul>
                <li type=square> Here's how
                <li type=square> to do
                <li type=square> square bullets
            </ul>
            <ul>
                <li> Here's how
                <li> to do
                <li> circle bullets
            </ul>
            <ol>
                <li> Here's how
                <li> to do
                <li> numbered lists
            </ol>
        </div><!-- end of div "content2" -->
    </div><!-- end of div "content" -->


<!--- DON'T MESS WITH THESE --->

    <div id="content" class="2" style="display:none;">
        <div id="links2">
            <a class="one" href="#">FAQ</a>
            <a class="current">Ask</a>
            <a class="three" href="#">Submit</a>
        </div><!-- end of div "links2" -->


<!--- HERE'S THE ASK BOX --->

        <div id="content3">
            <iframe frameborder="0" height="100%" id="ask_form" scrolling="no" src="http://www.tumblr.com/ask_form/YOURURLGOESHERE.tumblr.com" width="100%" style="background-color: transparent; overflow: hidden;"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]-->
        </div><!-- end of div "content2" -->
    </div><!-- end of div "content" -->


<!--- DON'T MESS WITH THESE --->

    <div id="content" class="3" style="display:none;">
        <div id="links2">
            <a class="one" href="#">FAQ</a>
            <a class="two" href="#">Ask</a>
            <a class="current">Submit</a>
        </div><!-- end of div "links2" -->


<!--- HERE'S THE SUBMIT BOX --->

        <div id="content2" style="border:none;">
            <iframe frameborder="0" scrolling="no" width="100%" height="400px" id="submit_form" src="http://www.tumblr.com/submit_form/YOURURLGOESHERE.tumblr.com" style="background-color:transparent; overflow:hidden;"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('submit_form').allowTransparency=true;</script><![endif]-->
        </div><!-- end of div "content2" -->
    </div><!-- end of div "content" -->


</div><!-- end of div "container" -->


<!-------------------------------------------------------------------------------- I don't care if you edit, but please for the love of god do not -----
-------------------- remove the credit on my stuff -------------------------
--------------------------------------------------------------------------->

<div id="credit">
    <div style="font-size:12; font-style:italic; text-align:center; padding-left:2px; padding-right:2px;"><a href="http://theleakycauldron.co.vu"> ---a---</a></div>
</div>

</body>