Alexandrite Network/Faves Page by Ammetrine

<head>

<!-- start popup coding p1-->
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
//
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
return false;
});
$('a.close, #fade').live('click', function() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
<!-- end popup coding p1-->

<style>
a:hover {
letter-spacing:2px;
}
</style>

<link rel="shortcut icon" href="{favicon}">
<link rel="alternate" type="application/rss+xml" href="{rss}">

<style type="text/css">
/* start popup coding p2*/
#fade {
    display:none;
    background:#000;
    position:fixed;
    left:0; top:0;
    width:100%;
    height:100%;
    opacity:.80;
    z-index:9999; }
.popup_block {
    display:none;
    background:#fff;
    padding:10px;
    border:10px solid #ede5f3;
    float:left;
    font-size:10;
    position:fixed;
    top:50%; left:50%;
    z-index:99999;
}
img.btn_close {
    float:right;
    margin:3px 3px 0px 0px; }
*html #fade { position:absolute; }
*html .popup_block { position:absolute; }
/* end popup coding p2*/

body
{
font-family: courier;
font-size: 13px;
color: #aaa;
background-color:#fff;

}

a:link, a:active, a:visited
{
color: #dccbe7;
text-decoration: none;
}


#credit {
     position:fixed;
     right:10px;
     z-index:9999;
     bottom:5px;
} /*do not remove this - you will be reported if caught doing so*/


#all {
    margin:30;
    margin-left:330px;
}


#pannel {
    width:192px;
    height:220px;
    padding:3px;
    border:1px solid #aaa;
    background-color:#fff;
}

#poster {
    width:180px;
    height:180px;
    margin-top:10px;
    position: relative;
    background-color:#fff;
}

#poster img {
    width:180px;
    height:180px;

    padding:6px;
}


#about {
    text-align:left;
    padding:10px;
    padding-top:3px;
    margin-bottom:20px;
    position:absolute;
    width:170px;
    height:10px;
    font-family: courier;
    opacity:0;
    font-size:9px;
    background:white;
    color:#888;
}

#pannel:hover #about {
    opacity:1; /*decrease number to make faded -- eg. 0.6*/
    margin-top:0px;
    height:180px;
    -webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out; /*increase numbers to slow down the panel appearing - eg. 0.5s*/
}

#description {
     font-family: courier;
     font-size:10px;
     text-align:center;
     text-transform:lowercase;
}

#name {
    font-size:14px;
    color:{link colour};
    font-family: courier;
    letter-spacing: 1px;
    text-align:center;
    padding: 2 3 2 3;
    width: 180px;
    position: relative;
    margin-top: -5px;
}


#header {
    width:550px;
    height:auto;
    font-family: courier;
    font-size:11px;
    line-height:18px;
    padding:2px;
    margin-top: 50px;
    text-align:center;
    text-transform:lowercase;
    background-color:#fff;
}


#title {
    height:20px;
    color:#888888;
    font-family:courier;
    font-size:18px;
    text-align:center;
    letter-spacing:1px;
    text-transform:lowercase;
    padding:5px 10px;
}

</style>

<div id="credit"><a href="http://ammetrine.tumblr.com/" target="_blank" title="ammetrine's themes"><img src="http://38.media.tumblr.com/tumblr_lu2de5CqUh1qfoi4t.gif"></a></div> <!-- do not remove this - you will be reported if caught doing so -->

</div>
<div id="header">
<div id="title">{Title}</div>

<a href="url">admin</a>  //
<a href="#?w=400" rel="02" class="poplight">info</a>  //
<a href="http://ammetrine.tumblr.com">credit</a> <!--don't add any more links, it will throw off the positions of the title & links -->
</div>

<table id="all" border="0" cellpadding="0" cellspacing="20">


              <!-- start table (aka member spots) -->

<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>

put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>

</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want-->
</div>

</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<tr> <!-- end row -->


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<tr> <!-- end row -->


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<tr> <!-- end row -->


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>

<tr> <!-- end row -->


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>


<td><div id="pannel">
<div id="poster">
<div id="name"><a href="url"> name </a></div>
<div id="about">
<div id="description"><p>
put your description here
</div>
</div>
<img width="120px" src="http://40.media.tumblr.com/2ebc0f87ed961008da800a0a0d358bf5/tumblr_nrzr9pysKS1s6beoyo1_500.jpg"/><!--delete this url and replace with the url of the image you want -->
</div>
</div></td>
                         <!-- end table -->


</table>
</body>

<div id="02" class="popup_block">
<!-- start popup coding p3 -->
<center>
INFO GOES HERE
</center></div></div></div></div></div></div></div></div></div></div></div>
<!-- end popup coding p3 -->

</html>