Network #2

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

<!---- Network #2 by Sofi (castiiel.tumblr.com). DON'T REMOVE THE CREDIT OR CLAIM THE THEME AS YOURS. DON'T USE IT AS A BASE --->

<script type="text/javascript">
  WebFontConfig = {
    google: { families: [ 'Lato:400,300:latin' ] }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
      '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })(); </script>

<style type="text/css">


::-webkit-scrollbar {width: 4px; height: 4px; background: #eee; }
::-webkit-scrollbar-thumb { background-color: #ccc; -webkit-border-radius: 0ex; }

body {
    background:#fff;
    margin:0px;
    color:#1b1919;
    font-family:times;
    font-size:9px;
    line-height:110%;
    letter-spacing: 0.5px;
}

body, a, a:hover {cursor: url(http://media.tumblr.com/tumblr_lqs4idHqTZ1qfoi4t.png), auto;}

a {
    text-decoration:none;
    outline:none;
    -moz-outline-style:none;
    color:#b8b8b8;
}

img {
    border:none;
}

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

h1 {
    font-size:16px;
    font-family:'Lato', sans-serif;
    font-weight: 300;
    letter-spacing: 1.5px;
    line-height: 130%;
}

#sidebar {
    height: 100%;
    width: 350px;
    background-color: #f0f0f0;
    background-image:url("http://static.tumblr.com/bfthosw/9Yxn4tayo/dsc_1072.jpg"); /*change here the sidebar background picture*/
    top: 0px;
    left: 0px;
    position: fixed;
    background-position:center bottom;
    background-size:cover;
}

#title {
    padding: 20px;
    font-family: 'Lato', sans-serif;
    font-size: 25px;
    letter-spacing: 1px;
    font-weight: 300;
    color: #5a5a5a;
    text-align: center;
    margin-top: 150px;
    line-height: 135%;
}

#links {
    text-align: center;
    padding-top: 18px;
    border-top: 1px solid #999;
    margin-top: -8px;
    font-family: 'Lato', sans-serif;
    font-size: 10px;
    letter-spacing: .8px;
    text-transform: uppercase;
}

#links a {
    text-align: center;
    margin-left: 5px;
    margin-right: 5px;
    padding-bottom: 3px;
    color: #5a5a5a;
    -moz-transition-duration:0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;
}

#links a:hover {
    border-bottom: #5a5a5a solid 1px;
    -moz-transition-duration:0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;
}

#description {
    padding: 22px;
    font-family: 'Lato', sans-serif;
    font-size: 10px;
    text-align: center;
    line-height: 140%;
}

#con {
    width: 720px;
    margin-left: 475px;
    margin-top: 50px;
}

#pannel {
    margin: 18px;
    display:inline-block;
}

#pannel img {
    width: 170px;
    height: 170px;
    padding: 15px;
    border: solid #ccc 1px;
    border-radius: 5px;
}

#pannel:hover #about {
    opacity: 1;
    -moz-transition-duration:0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;
}

#about {
    width: 150px;
    height: 150px;
    overflow: auto;
    margin: 16px;
    background:rgba(255,255,255, 0.9);
    position: absolute;
    padding: 10px;
    opacity: 0;
    text-align: center;
    font-family: georgia;
    font-size: 10px;
    line-height: 140%;
    letter-spacing: 0.8px;
    color: #5a5a5a;
    -moz-transition-duration:0.5s;
    -webkit-transition-duration:0.5s;
    -o-transition-duration:0.5s;
}

#url {
    width: 150px;
    padding: 5px;
    word-wrap:break-word;
    margin: -5px;
    margin-bottom: 10px;
    padding-top: 7px;
    padding-bottom: 7px;
    border-bottom: solid 1px #999;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    text-align: center;
    letter-spacing: 0.8px;
}

#url a {
    color: #1b1919;
}

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

<div id="sidebar">

<div id="title">Network title</div>

<div id="links">
<a href="http://tumblr.com">dash</a>
<a href="/">apply</a>
<a href="/">admin</a>
<a href="/">chat</a>
</div>

<div id="description">
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>. You can also add links, pictures, pixels and dividers, and make it as long as you want.
</div>

</div>

<div id="con">

<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>



<div id="pannel">
<div id="about">
<div id="url">
<a href="/">HERE GOES NAME/URL</a>
</div>
In the description you can use <b>bold</b>, <u>underline</u>, <i>italics</i> and <s>strike</s>.<br> You can also add links, pixels and dividers, and make it as long as you want because it scrolls.
</div>
<img src="http://static.tumblr.com/bfthosw/xeYn4rlig/tumblr_mrj5rej8be1rckdh5o3_500.jpg">
</div>

</div>

<div style="font-size:8px; font-family:georgia; letter-spacing:2px; background-color:#fff; padding:5px; border:1px solid #e9e9e9; position:fixed; right:15px; bottom:10px;"><a href="http://www.castiiel.tumblr.com">221b</a></div>

</body></html>