Rivergronrps theme #7 "CANNONBALL"

<!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">

    <head><title>{Title}</title>
    <link rel="shortcut icon" href="{Favicon}">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">
    {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}

     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".inside").hide();
$(".label").click(function(){
$(this).next(".inside").slideToggle('fast');
});
});
</script>


   <!---
Theme #7 'Cannonball' | by Stephanie @ Rivergronrps
            .
           .|.
           |||
           |||
           |||
           |||
           j_I  K&M4E
          .)_(.
          |===|
          /___\
         //___\\
        /=======\
       / .-"""-. \
      |__|     |__|

 Please fill free to edit to your liking, just please don't remove the credit or redistrube it. My inbox is always open if you have any questionss or problems with the theme.
--->

  <script type="text/javascript" src="http://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>


<meta name="color:Background" content="#ffffff"/>
<meta name="color:Scrollbar" content="#000000"/>
<meta name="color:ScrollbarBg" content="#ffffff"/>


<meta name="color:bbar" content="#a8a8a8"/>
<meta name="color:topbar background" content="#65253f"/>
<meta name="color:topbar text" content="#a8a8a8"/>
<meta name="color:topbar links" content="#a8a8a8"/>
<meta name="color:grad" content="#a8a8a8"/>


<meta name="color:Sidebar Links" content="#fbf8f8"/>
<meta name="color:Sidebar Links hover" content="#000000"/
<meta name="color:Hover" content=""/>

<meta name="color:post background" content=""/>
<meta name="color:text" content=""/>
<meta name="color:post title" content=""/>
<meta name="color:Post links" content=""/>

<meta name="image:Sidebar 1" content=""/>
<meta name="image:Sidebar 2" content=""/>
<meta name="image:Background" content=""/>

<meta name="if:gradient" content="1"/>

<meta name="text:title" content="" />
<meta name="text:subtitle" content="" />
<meta name="text:home link title" content="refresh" />
<meta name="text:ask link title" content="fanmail" />
<meta name="text:question title" content="wondered" />
<meta name="text:link 1" content="" />
<meta name="text:link 1 text" content="" />
<meta name="text:link 2" content="" />
<meta name="text:link 2 text" content="" />
<meta name="text:link 3" content="" />
<meta name="text:link 3 text" content="" />
<meta name="text:link 4" content="" />
<meta name="text:link 4 text" content="" />
<meta name="text:tag symbol" content="" />




<style type="text/css">


    /*CREDIT! YOU CAN MOVE IT AROUND IF YOU ASK FIRST, BUT DONT REMOVE IT*/


#cred a {
position:fixed;
z-index:99;
color:{color:Sidebar Links};
font-size:16px;
font-family:arial;
background-color:{color:sidebar links hover};
font-weight: bold;
text-shadow:0px 1px 0px black;
border:1px solid {color:bbar};
padding: 4px 4px 4px 4px;
bottom:6px;
right:6px;
-webkit-transition: all 0.5s ease-in; -moz-transition: all 0.5s ease-in; transition: all 0.5s ease-in
}

#cred a:hover{
    background:{color:Sidebar Links};
    color:{color:sidebar links hover};
    font-style:none;
    border:1px solid {color:background};
}



::-webkit-scrollbar-thumb {
height:auto;
background-color:{color:Scrollbar};
}

::-webkit-scrollbar {
height:9px;
width:8px;
background-color:{color:ScrollbarBg};
}

body {
background:{color:background};
margin:0px;
color:{color:text};
font-family:century gothic;
font-size:10px;
line-height:100%;
letter-spacing:0.5px;
text-align:justify;
background-image:url('{image:Background}');
background-attachment:fixed;
background-size:110%;
background-size: cover;

}

a {
text-decoration:none;
outline:none;
-moz-outline-style:none;
color:{color:Post Links};
-moz-transition-duration:0.7s;
-webkit-transition-duration:0.7s;
-o-transition-duration:0.7s;
}

a:hover {
    -moz-transition-duration:0.7s;
-webkit-transition-duration:0.7s;
-o-transition-duration:0.7s;
}

img {
    border:none;
}

pre {
    background:{color:background};
    height:12px;
    overflow:hidden;
    font-size:11px;
    padding:4px;
    letter-spacing:1px;
    font-style:italic;
    color:{color:post title};
    font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, sans-serif;
}

div#qTip {
display: none;
text-align: center;
position :absolute;
letter-spacing: 0.5px;
text-transform: uppercase;
margin-top:10px;
left:5px;
z-index: 5;
font-size:9.5px;
font-family: arial;
font-style:italic;
padding:2px; color: {color:text};
background: {color:post background};
border: 1px solid {color:border}}

blockquote {
padding-left:5px;
border-left:2px solid;
}

blockquote blockquote {
padding-left:5px;
border-left:2px solid;
}

h1 {
letter-spacing:1px;
font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, sans-serif;
font-weight:bold;
text-transform:uppercase;
font-size:23px;
text-shadow: 1.5px 1.5px 0px {color:background};
line-height:29px;
text-align:left;
font-style:italic;
color:{color:post title};
}

h2 {
letter-spacing:1px;
font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, sans-serif;
font-weight:bold;
text-transform:uppercase;
font-size:20px;
text-shadow: 1.5px 1.5px 0px {color:background};
line-height:20px;
font-style:italic;
color:{color:post title};
}

a:hover {
color:#000000;
-moz-transition-duration:0.3s;
-webkit-transition-duration:0.3s;
-o-transition-duration:0.3s;
}


/*ENTRIES*/

#entries {
width:500px;
padding:10px;
margin-left:425px;
margin-top:130px;
font-size:11px;
line-height:12px;
font-family:'arial';
letter-spacing:0.5px;
float: center;
text-align: justify;
}


#post {
width:500px;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
margin-top:5px;
margin-left:-1px;
background-color:{color:post background};
text-align: justify;
overflow:hidden;
color:{color:text};

}


#entrybar {
width:518px;
padding-bottom: 5px;
height:auto;
margin-left:0px;
margin-top:20px;
border: 1px solid {color:bbar};
background-image:url('{image:bbar}');
background-color:{color:bbar};

}


/*SIDEBAR*/

#image {
position:fixed;
background:black;
top:135px;
left:15px;
width:275px;
height:500px;
overflow:hidden;
border: 6px solid {color:bbar};
background-repeat: no-repeat;
 background-image: url({image:sidebar 1});
  -webkit-transition: all 0.7s linear;
  -moz-transition: all 0.7s linear;
  -o-transition: all 0.7s linear;
  -ms-transition: all 0.7s linear;
  transition: all 0.7s linear;
}

#image:hover{
 background-repeat: no-repeat;
 background-image: url({image:sidebar 2});
  -webkit-transition: all 0.7s linear;
  -moz-transition: all 0.7s linear;
  -o-transition: all 0.7s linear;
  -ms-transition: all 0.7s linear;
  transition: all 0.7s linear;
}


/* TOPBAR */

#title {
position:fixed;
left:395px;
top:60px;
font-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
text-transform:uppercase;
font-size:25px;
letter-spacing:1px;
width:650px;
font-style:italic;
font-weight:800;
text-shadow: 1.5px 1.5px 0px {color:background};
color:{color:topbar text};
z-index: 99;
}

#subtitle {
position:fixed;
left:365px;
top:35px;
ont-family: 'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
font-size:12.5px;
color:{color:topbar text};
z-index: 99;
}


#hor {
position:fixed;
width:100%;
height:6px;
top:110px;
background-color: {color:bbar};
z-index: 99;
}




#topbar {
position:fixed;
background-color:{color:topbar background};
width:100%;
top:0px;
left:0px;
Height:115px;
z-index: 98;
{block:Ifgradient}
background: -webkit-linear-ient(left, {color:topbar background}, {color:grad});
background: -o-linear-gradient(right, {color:topbar background}, {color:grad});
background: -moz-linear-gradient(right, {color:topbar background},{color:grad});
background: linear-gradient(to right, {color:topbar background} , {color:grad}); /* must be last */
{/block:Ifgradient}
}


#descbox {
position:fixed;
padding:5px;
top:0px;
left:15px;
z-index: 99;
}

#description {
text-align:justify;
font-family:'Arial';
font-size:10px;
position:fixed;
text-transform:none;
padding-left:5px;
padding-right:5px;
padding-top:px;
color:{color:topbar text};
line-height:11px;
letter-spacing:0.5px;
width:290px;
height:100px;
overflow-y:auto;
}

#description a {
    color:{color:topbar links};
    -moz-transition-duration:0.7s;
-webkit-transition-duration:0.7s;
-o-transition-duration:0.7s;

}

#description a:hover{
 color:{color:text};
    -moz-transition-duration:0.7s;
-webkit-transition-duration:0.7s;
-o-transition-duration:0.7s;

}

/* LINKS */

#nav {
font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, sans-serif;
font-weight:600;
padding: 4px;
text-align:center;
text-transform:uppercase;
position:fixed;
left:310px;
top:245px;
}


#nav a {
width:94px;
padding:3px;
font-size:30px;
letter-spacing:2px;
line-height:40px;
color:{color:Sidebar Links};
text-shadow: 2px 2px 0px {color:sidebar links hover};
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}

#nav a:hover {
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
color:{color:sidebar links hover};
text-shadow: 2px 2px 0px {color:Sidebar Links};
font-style:italic;
}




/*POST INFO*/

#info {color:{color:text};
font-size:9px;
text-transform:lowercase;
width:523px;
margin-left:-6px;
margin-top:0px;
background: {color:topbar background};
padding:4px;
padding-top:4px;
padding-bottom:4px;
overflow:hidden;
color:{color:topbar text};
text-align:center;
{block:Ifgradient}
background: -webkit-linear-gradient(left, {color:topbar background}, {color:grad});
background: -o-linear-gradient(right, {color:topbar background}, {color:grad});
background: -moz-linear-gradient(right, {color:topbar background},{color:grad});
background: linear-gradient(to right, {color:topbar background} , {color:grad}); /* must be last */
}
{/block:Ifgradient}
}

#tags {
color:{color:topbar links};
font-size:9px;
text-transform:lowercase;
width: 514px;
margin-bottom:0px;
margin-top: 3px;
{color:posts};
text-align: right;
padding:3px;
border:1px {color:bbar} solid;
    overflow:hidden;
}

#info a {
color:{color:topbar links};
-moz-transition-duration:0.7s;
-webkit-transition-duration:0.7s;
-o-transition-duration:0.7s;
}

#info a:hover {
color:{color:text};
-moz-transition-duration:0.7s;
-webkit-transition-duration:0.7s;
-o-transition-duration:0.7s;
}



/* IMESSAGE CHAT POST */
.answer span,.convo li{margin:0 0 5px;border-radius:1em;padding:.5em 10px;max-width:75%;clear:both;position:relative}.answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{float:left;background:{color:bbar};color:#000;left:3px}.me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid {color:bbar};border-bottom-right-radius:1em .5em}.answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{right:3px;float:right;background-color:{color:background};color:white}.them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{content:"";position:absolute;right:-.5em;bottom:0;width:.5em;height:1em;border-left:.5em solid {color:background};border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}



        .convo {
            overflow: hidden;
            list-style-type: none;
            padding: 0;
            margin: 0;
        }




/* QUESTIONS */

#person {
padding-top:10px;
text-align: right;
text-transform:uppercase;
font-size:18px;
font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, sans-serif;
letter-spacing:2px;
font-weight:bold;
font-style:italic;
text-shadow: 1.5px 1.5px 0px {color:background};
color:{color:topbar text};
}

#person a {
 text-shadow: 1.5px 1.5px 0px {color:background};
color:{color:topbar text};
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}

#person a:hover {
text-shadow: 1.5px 1.5px 0px {color:topbar text};
color: {color:background};
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}

#inquiry {
    background-color: {color:topbar background};
    color:{color:topbar text};
    text-align: justify;
    font-family: 'arial';
    font-size: 10px;
    font-style:none;
    margin-left: 70px;
border-radius:1em;padding:.7em 10px;max-width:75%;clear:both;position:relative
}

#portrait {
    width:50px;
    height:50px;
    margin-top:0px;
    margin-left:-6px;
    position: absolute;}

#portrait img {
    border:solid 4px {color:bbar};
}

#inquiryarrow {
content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid {color:topbar background};border-bottom-right-radius:1em .5em
}

#reaction {
    padding-top:12px;
    text-align: justify;
    margin-top: 8px;
}

#reactionbar {
    width:auto;
    height:auto;
    padding:7px;
    margin-left:0px;
    margin-top:0px;
    margin-bottom:3px;
    background-color:{color:answer backg};
    background-image:url('{image:bbar}');


/*CREDIT! DO NOT TOUCH*/


#cred a {
position:fixed;
font-size:16px;
font-family:arial;
background-color:{color:post background};
font-weight: bold;
text-shadow:0px 1px 0px black;
padding: 4px 4px 4px 4px;
bottom:6px;
right:6px;
-webkit-transition: all 0.5s ease-in; -moz-transition: all 0.5s ease-in; transition: all 0.5s ease-in
}

#cred a:hover{
    background:{color:links background};
}




{CustomCSS}</style></head><body>





<div id="topbar"></div>

  <div id="subtitle">{text:subtitle}</div>
 <div id="title">{text:title}</div>

 <div id="descbox"><div id="description">{description}</div></div>

<div id="image" align="center"></div>

<div id="nav">
<a href="/" title="{text:home link title}">01.</a><br/>
<a href="/ask" title="{text:ask link title}">02.</a><br/>
<a href="{text:link 1}" title="{text:link 1 text}">03.</a><br/>
<a href="{text:link 2}" title="{text:link 2 text}">04.</a><br/>
<a href="{text:link 3}" title="{text:link 3 text}">05.</a><br/>
<a href="{text:link 4}" title="{text:link 4 text}">06.</a><br/>
{block:NextPage}<a href="{NextPage}">»</a>{/block:NextPage}<br/>{block:PreviousPage}<a href="{PreviousPage}">«</a><br/>{/block:PreviousPage}

</div></div>


<div id="entries">
{block:Posts}
<div id="entrybar">
<div id="post">



{block:text}
<h1>{block:Title}{Title}{/block:Title}</h1>
{Body}{/block:text}

{block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}</p>
{block:Caption}{Caption}{/block:Caption}{/block:Photo}

{block:Photoset}{Photoset-500}{block:Caption}{Caption}
{/block:Caption}{/block:Photoset}

{block:Quote}<h2>"{Quote}"</h2>
{block:Source}<div style ="text-align:right; letter-spacing:1px; padding-bottom:10px"> — {Source}</div>
{/block:Source}{/block:Quote}

{block:Link}<h1><span style ="letter-spacing:3px;">{text:tag symbol}</span><a href="{URL}" {Target}>{Name}</a></h1>{block:Excerpt}<blockquote>{excerpt}</blockquote>{/block:Excerpt}{block:Description}{Description}{/block:Description}{/block:Link}

{block:Chat}
<div class="posting">
{block:Title}<h1>{Title}</h1>{/block:Title}<br>
<ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
{Line}</li>{/block:Lines}</ul>
</div>
{/block:Chat}


{block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}

    {block:Audio}
    {block:AlbumArt}
    <img src="{AlbumArtURL}" width="100px">{/block:AlbumArt}
     {block:AudioPlayer}<span style="float:right; width:350px">{AudioPlayerWhite}</span>{/block:AudioPlayer}

    <span style="margin-left:50px; width:400px; margin-top:30px; position:absolute; line-height:16px; font-size:13px">
{block:TrackName}<span style="font-size:14px; letter-spacing:3px">{text:tag symbol}</span>{TrackName}{/block:TrackName}<br>
{block:Artist}<span style="font-size:14px; letter-spacing:3px">{text:tag symbol}</span>{Artist}{/block:Artist}<br>
{block:Album}<span style="font-size:14px; letter-spacing:3px">{text:tag symbol}</span>{Album}{/block:Album}<br>
<span style="font-size:14px; letter-spacing:3px">{text:tag symbol}</span>{PlayCountWithLabel}
</span>

    {block:Caption}
    {Caption}
    {/block:Caption}
    {/block:Audio}


{block:Answer}
<div id="reactionbar">
<div id="portrait"><span style="width:48px;height:48px;"><img src="{AskerPortraitURL-48}"></span></div>

<div id="inquiry"><div id="inquiryarrow"></div><strong><span style="text-transform:uppercase;">{asker} {text:question title}:</span></strong> {Question}</div></div>

<div id="reaction">{Answer}</div>

{/block:Answer}</div>

{block:Date}<div id="info">
posted <a href="{Permalink}">{TimeAgo}</a>
{block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}{/block:NoteCount}{block:RebloggedFrom} via <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:ContentSource} <a href="{SourceURL}"></a>{block:ContentSource}{/block:RebloggedFrom}<br>{block:HasTags} {block:Tags}<a href="{TagURL}"><span style="font-size:12px; letter-spacing:2px">{text:tag symbol}</span>{Tag}</a> {/block:Tags}{/block:HasTags}</div>{/block:Date}
</div>


{/block:Posts}

{block:PostNotes}{PostNotes}{/block:PostNotes}</div>

 <div id="hor"></div></div>


<div id="cred">
<a href="http://rivergronrps.tumblr.com/tagged/my-themes">✈</a>
</div>
</div>





    </body></html>