Ask Layout

<!-----------------------------------------
╭━━━┳╮╱╱╱╱╱╱╱╱╱╱╭╮╱╭━━━━┳╮
┃╭━╮┃┃╱╱╱╱╱╱╱╱╱╱┃┃╱┃╭╮╭╮┃┃
┃┃╱╰┫╰━┳━━┳━╮╭━━┫┃╱╰╯┃┃╰┫╰━┳━━┳╮╭┳━━┳━━╮
┃┃╱╭┫╭╮┃╭╮┃╭╮┫┃━┫┃╱╱╱┃┃╱┃╭╮┃┃━┫╰╯┃┃━┫━━┫
┃╰━╯┃┃┃┃╭╮┃┃┃┃┃━┫╰╮╱╱┃┃╱┃┃┃┃┃━┫┃┃┃┃━╋━━┃
╰━━━┻╯╰┻╯╰┻╯╰┻━━┻━╯╱╱╰╯╱╰╯╰┻━━┻┻┻┻━━┻━━╯

Please keep credit (✿◠‿◠)
----------------------------------------------->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<html>

<head>


<style type="text/css">

::-webkit-scrollbar {width: 8px; height: 4px; background: #fff; border-left: 1px solid #eee; }

::-webkit-scrollbar-thumb { background-color:#ccc; border-bottom: 1px solid #eee; border-top: 1px solid #eee; border-left: 1px solid
#eee; border-right: 1px solid #eee; }


body {
    background-image:url(http://fc01.deviantart.net/fs71/i/2012/072/2/e/clouds_background_by_sarah_the_ninja_101-d4snrqr.jpg);
background-attachment: fixed;
background-repeat: repeat;
background-size:cover;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;}

#wrapper {
margin-left:auto;
margin-right:auto;
margin-top:100px;
width:280px;
padding:20px;
border-width:1px;
-webkit-border-radius: 4px;
-moz-border-radius:4px;
border-radius: 4px;}

#inner {
width:280px;
margin-top:-34px;
background:white;
margin-left:370px;
border:6px double #eee;
overflow-y:scroll;
overflow-x:hidden;
height:425px;}

.body {
width:280px;}

#entry {
height:auto;
float:left;
font-size:0;}

#entry img {
opacity:.7;
-webkit-transition-duration:.4s;
width:64px;
height:64px;}

#entry img:hover {
opacity:1;
-webkit-transition-duration:.4s;}

#icon {
margin:0px 5px 5px 0px;
display:inline-block;}

#askk {
opacity: 1;
position:fixed !important;
width: 390px;
padding: 15px;
height: 250px;
overflow:auto;
font-size: 16px;
border: 6px double #eee;
background: white;
left: 440px;
margin-top: 140px;
transition: all 0.9s ease-out;
-o-transition-transition: all 0.9s ease-out;
-webkit-transition: all 0.9s ease-out;
-moz-transition: all 0.9s ease-out;
}
@font-face { font-family: "simon"; src: url('http://static.tumblr.com/loouiuu/Ttaloide6/halohandletter.ttf'); }
.box{
padding: 2px;
width: 250px;
padding-top:10px;
padding-bottom:15px;
height: 50px;
font-family: 'simon';
font-size: 50px;
color: #fff;
background:#c9e8fb;
text-align: center;
border:9px solid #fff;
display: inline-block;
z-index:9999999999;
}
.askers{
padding: 2px;
width: 382px;
height: 50px;
font-family: 'simon';
font-size: 50px;
color: #fff;
background:#c9e8fb;
text-align: center;
border:1px solid #c9e8fb;
display: inline-block;
z-index:9999999999;
}
.faqs{
padding: 2px;
width: 240px;
height: 50px;
font-family: 'simon';
font-size: 50px;
color: #fff;
background:#c9e8fb;
text-align: center;
border:1px solid #c9e8fb;
display: inline-block;
z-index:9999999999;
}
sub_header{
/*---Customize your subheader color here-----*/
color:#c9e8fb;
z-index:1;
font-family:simon;
font-size:40px;
}
div#faq{
margin-left:90px;
margin-top:-10px;
position:fixed;
text-align:left;
width:250px;
font-family:calibri;
overflow:auto;
border:6px double #eee;
height:400px;
padding:15px;
background:white;}

div#about{
margin-left:433px;
margin-top:-10px;
position:fixed;
text-align:left;
width:385px;
font-family:calibri;
overflow:auto;
border:6px double #eee;
height:100px;
padding:15px;
background:white;}


.abouts{
padding: 2px;
width: 382px;
height: 50px;
font-family: 'simon';
font-size: 50px;
color: #fff;
background:#c9e8fb;
text-align: center;
border:1px solid #c9e8fb;
display: inline-block;
z-index:9999999999;
}

.cred {
color: #000;
font-family: Calibri;
font-size:14px;
z-index: 99999999999999px;
line-height:14px;
background:#fff;
border: 1px #eee solid;
background-repeat:repeat;
padding:2px;
-webkit-border-radius:2px;
moz-border-radius:2px;
-o-border-radius:2px;
border-radius:2px;
}

.cred a { color: #000; }
</style>

<style type="text/css">{CustomCSS}</style>

</head>
<!-- Change title if you like-->
<title>Ask me anything!</title
<body>
<div id="about">
<div class="abouts">About Me:</div><div style="padding-bottom:10px;"></div>

<!-- Write about yourself here-->
about meee

</div>

<!-- Write your FAQ below-->

<div id="faq">
<div class="faqs">FAQ</div><div style="padding-bottom:10px;"></div>
place things in your faq here<br>
place things in your faq here<br>
place things in your faq here<br>
place things in your faq here<br>


<!-- Change your header to whatever you like-->
<sub_header>header:</sub_header><br>

place things in your faq here<br>
place things in your faq here<br>
place things in your faq here<br>
place things in your faq here<br>

<sub_header>header:</sub_header><br>
place things in your faq here<br>
place things in your faq here<br>
place things in your faq here<br>

<sub_header>header:</sub_header><br>

place things in your faq here<br>
place things in your faq here<br>
place things in your faq here<br>
 place things in your faq here<br>
place things in your faq here<br>
</div>


<div id="askk">
<div class="askers">Ask:</div><div style="padding-bottom:12px;"></div>
<Center><iframe frameborder="0" scrolling="no" src="http://www.tumblr.com/ask_form/INSERTURLHERE.tumblr.com" width="390" height="190"></iframe>


<!-- Replace INSERTURLHERE with your blog url for the ask to work-->

</center><p>

</div>


<div id="wrapper">

<div id="inner"><div class="body"><div id="entry">
<div class="box">Blogroll:</div><div style="padding-bottom:10px;"></div></br>
{block:Following}{block:Followed}
<div id="icon"><a target="_blank" href="{FollowedURL}" title="{FollowedName}"><img src="{FollowedPortraitURL-64}"/></a></div>
{/block:Followed}{/block:Following}

</div></div></div>

</div>

</body>
<!-- Please do not remove credit-->
 <div style="position: fixed; right:6px;bottom:10px;">
<span class="cred">
<a href="http://teenageblog.tumblr.com/" target="_blank">
☾
</a></span></div>
</html>