<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}
<meta name="image:Background" content=""/>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<script>
if(window.location.pathname == '/') location.replace('/home');/*replace /faq with whatever your page is!*/
</script>
body{
color:black;
font-family:verdana;
font-size:15pt;
text-align: left;
text-justify: inter-word;
margin: 0 !important;
padding: 0 !important;
background: /* linear-gradient(to bottom, rgba(225, 225, 225, 0.1), rgba(225, 225, 225, 0.1)), */ url('http://static.tumblr.com/lnnbuse/ep7nw7pon/shattered.png') repeat fixed;
#masterhead{
  font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;
  text-align: center;
  width:100%;
  color:#202020;
#cent{
width:100%;
position:relative;
float:center;
text-align: left;
}
h1{
  font-size:35pt;
  font-family: "Gill Sans MT", Century Gothic,CenturyGothic,AppleGothic,sans-serif;
  font-weight: bold;
  color: #404040;
  margin-top: 0px;
}
h1{
  font-family: "Gill Sans MT", Century Gothic,CenturyGothic,AppleGothic,sans-serif;
  font-weight: bold;
  color: #404040;
  margin-top: 0px;
}
#post{
font-family: "segoe ui", Century Gothic,CenturyGothic,AppleGothic,sans-serif;
text-align: left;
padding-top:2%;
background-color:#fff;
max-width:700px;
float:center;
margin:0px;
color: #404040;
text-size: 3vw;
padding-left:2%;
padding-right:2%;
padding-bottom:2%;
margin-bottom:2%;
}
#title{
  float:center;
  position:relative;
  font-size:60pt;
}
//*
#description{
font-family: Helvetica, sans-serif;
text-align: center;
width: 100%;
position:fixed;
}
*//
.nav-wrap {
border-top:1px solid #eeeeee;
padding-bottom: 1px;
}
ul {
  min-width: 200px;
  width: 30%;
  display: table;
  table-layout: fixed;
  padding-left: 0px;
  padding-bottom: 10px !important;
  padding-top: 10px !important;
  background-color:white;
  margin-right: 0px;
  margin-bottom: 0px;
  }
ul li {
  display: table-cell;
}
ul li a {
  display: block;
}
/* unvisited link */
a:link {
  font-size: 2.5vh;
  color: #404040 ;
  text-decoration: none;
}
/* visited link */
a:visited {
  color: #404040 ;
/* mouse over link */
a:hover {
  color: #A4A4A4;
  -webkit-transition:all 0.3s;
-moz-transition:all 0.3s;
-ms-transition:all 0.3s;
-o-transition:all 0.3s;
transition:all 0.3s;
/* selected link */
a:active {
  color: #00B0F0;
}
/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
 position: relative;
 z-index: 2;
 cursor: pointer;
 color:white;
}
/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
 visibility: hidden;
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
 opacity: 0;
 pointer-events: none; Â
}
/* Position tooltip above the element */
[data-tooltip]:before {
 position: absolute;
 top: 100%;
 right: 50%;
 margin-top: 10px;
 margin-right: -80px;
 padding: 7px;
 width: 160px;
 /*-webkit-border-radius: 20px;
 -moz-border-radius: 20px;
 border-radius: 20px;*/
 background-color: #000;
 background-color: hsla(0, 0%, 20%, 0.3);
 color: #fff;
 content: attr(data-tooltip);
 text-align: center;
 font-size: 14px;
 line-height: 1.2;
 color:white;
}
/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
 visibility: visible;
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
 opacity: 1;
  color:white;
}
/*==============================================================*/
/* Add this attribute to the element that needs a tooltip */
[data-info] {
 position: relative;
 z-index: 2;
 cursor: pointer;
 color:white;
}
/* Hide the tooltip content by default */
[data-info]:before,
[data-info]:after {
 visibility: hidden;
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
 opacity: 0;
 pointer-events: none; Â
}
/* Position tooltip above the element */
[data-info]:before {
 position: absolute;
 margin-top: 0px;
 margin-right: 0px;
 padding: 0px;
 width: 200px;
 height: 200px;
 -webkit-border-radius: 200px;
 -moz-border-radius: 200px;
 border-radius: 200px;
 background-color: #000;
 background-color: hsla(0, 0%, 20%, 0.3);
 color: #fff;
 content: attr(data-info);
 text-align: center;
 font-size: 14px;
 line-height: 1.2;
 color:white;
}
/* Show tooltip content on hover */
[data-info]:hover:before,
[data-info]:hover:after {
 visibility: visible;
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
 opacity: 1;
  color:white;
}
.DivRow {width:100%;height:100%; background:#fff;}
.DivRow div {width: 233px ;height:300px; float:left;padding-left:0;padding-right:0;text-align: justify;text-justify: auto; background:#fff;float:center;}
<div id="masterhead">
<div id="title">
<img src="http://static.tumblr.com/lnnbuse/D9xnwp3a0/logo.png" alt="TEAM ECHO" style="max-width:30%; min-width:300px; padding: 1%;">
</div>
<!--
<div id="description">
</div>
-->
<div class="nav-wrap">
<center>
<ul class="group" id="example-one">
<li class="current_page_item"><a href="/" data-tooltip="HOME"><i class="fa fa-home"></i></a>
<li> <a href="/bio" data-tooltip="TEAM BIO"><i class="fa fa-users"></i></a>
<li><a href="/news" data-tooltip="NEWS"><i class="fa fa-newspaper-o"></i></a></li>
<li><a href="/plan" data-tooltip="PROJECT PLAN"><i class="fa fa-map-o"></i></a></li>
<li><a href="/docs" data-tooltip="PUBLIC DOCUMENTS"><i class="fa fa-file-text-o"></i></a></li>
<li><a href="/ask" data-tooltip="PUBLIC DOCUMENTS"><i class="fa fa-comment"></i></a></li>
<li><a href="http://swanseateamech0.tumblr.com/" data-tooltip="PRIVATE"><i class="fa fa-lock"></i></a></li>
</center>
</div></ul>
<div id="cent">
<center>
{block:Posts}
<h1>{block:Title}{Title}{/block:Title}</h1>
{block:Text}{Body}{/block:Text}
{block:Photo}
<a href="{permalink}"><img src="{PhotoURL-500}"/></a>
{/block:Photo}
{block:Photoset}
{PhotoURL-500}
{/block:Photoset}
{block:Quote}
{Quote}
<div align="right">
{block:Source}-{Source}{/block:Source}
</div>
{/block:Quote}
{block:Video}
{Video-500}<br>
{PlayCountWithLabel}
{/block:Video}
{block:Link}
<a href="{URL}" class="link" {Target}>{Name}</a><BR>
{block:Description}{Description}{/block:Description}
{/block:Link}
{block:Chat}
{block:Lines}
{block:Label}
<br>{Label}
{/block:Label}
 {Line}
{/block:Lines}
{/block:Chat}
{block:Audio}
{AudioPlayerGrey}
<br><div align="right">{block:Artist}
Artist: {Artist}</div>
{/block:Artist}<br>
{block:Caption}{Caption}{/block:Caption}
{/block:Audio}
{block:Answer}
{Asker} asked <b>{Question}</b><Br>
{Answer}
{/block:Answer}
{block:PermalinkPage}
{block:Caption}
{Caption}
{/block:Caption}
<br>
{block:NoteCount}
{NoteCount} notes
{/block:NoteCount}
<Br>
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage}
</div>
{/block:Posts}
</center>
</div>