Evangrace

Tutorials&Freebies(including Blogskins!)

Blogskin #9


*click on the pic for a larger view

the codes:
<html>
<head>
<title>galaxy ;</title>

  <link rel="stylesheet" type="text/css" href="http://tympanus.net/Development/CreativeLinkEffects/css/component.css" />
  <script src="http://tympanus.net/Development/CreativeLinkEffects/js/modernizr.custom.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://static.tumblr.com/5ojoydj/p9wmmzopi/jquery.style-my-tooltips.js"></script>
<script src="http://static.tumblr.com/5ojoydj/En2mmzorm/style-my-tooltips.css"></script>
<script language=JavaScript>
<!--
//Disable right click script III- By Renigade (renigade@mediaone.net)
//For full source code, visit http://www.dynamicdrive.com
var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
<script>
     (function($){
         $(document).ready(function(){
             $("[title]").style_my_tooltips({
    tip_follows_cursor:true,
    tip_delay_time:100,
    tip_fade_speed:100,
    attribute:"title"
});
         });
     })(jQuery);
 </script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">


<link href='http://fonts.googleapis.com/css?family=Averia+Sans+Libre' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Autour+One' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Short+Stack' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Rochester' rel='stylesheet' type='text/css'>

<style type="text/css">
::-webkit-scrollbar {
width:10px;
height:10px;
}
::-webkit-scrollbar {
width: 9px;
height: 8px;
}
::-webkit-scrollbar-track-piece  {
background-color: #ccc;
border: 3px solid #FFFFFF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-image:url(http://i.imgur.com/R2VIlhy.png);
border: 2px solid #bbb;
}
 #s-m-t-tooltip{
width:auto;
z-index:10;
margin:15px 10px 3px 10px;
padding:3px;
background-color:#fff;
font-family:'helvetica';
letter-spacing:2px;
font-size:7px;
line-height:7px;
color:#bbb;
text-transform:uppercase;
border:1px solid #bbb;
z-index:999999999;
}
::selection{background:#fafafa;color:#000;}
 ul
{
list-style-image:url('');
}
.tr-caption{font-size: 13px ; font-family:'short stack' ; color:#c0c0c0;padding-top: -3px;padding-bottom: 3px;}
#navbar-iframe {
display: none; }
#spacer { width: 100%; height: 90px; }
body {
cursor: url(http://cur.cursors-4u.net/others/oth-7/oth708.cur), progress!important;color: #808080; font-family:verdana;font-size:8pt;cursor: url(http://i932.photobucket.com/albums/ad167/DottyDita/1338348137_cursor-small.png),auto;
background-image: url(http://i.imgur.com/R2VIlhy.png);

}
#fade { /*--Transparent background layer--*/
 display: none; /*--hidden by default--*/
 background: #808080;
 position: fixed; left: 0; top: 0;
 width: 100%; height: 100%;
 opacity: .2;
 z-index: 9999;
}
.popup_block{
display: none;
background: #D3D3D3;
background-image: url(http://i.imgur.com/fGbedxJ.png);
padding: 10px;
font-family: "short stack";
float: left;
    color:#fff;
font-size: 10px;
position: fixed;
top: 50%; left: 50%;
z-index: 20000000;
border: 4px solid #fff;
-moz-box-shadow: 9px 9px 9px #eee;
-webkit-box-shadow: 0 0 15px #eee;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
img.btn_close {
 float: right;
 margin: -5px -5px 0 0;
width:25px;
border:none;
}
/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
 position: absolute;
}
*html .popup_block {
 position: absolute;
}
.title{
font-family:"rochester";
 font-size:20px;
  color: #fff;
             text-shadow: 1px 1px 1px #808080;
 }
 .sd {width: 230px; padding: 8px; background-color:#fff; color:#ccc; z-index: 100; text-align: justify; border-radius: 5px; -ms-border-radius: 5px; -moz-border-radius: 5px;
-webkit-border-radius: 5px; -khtml-border-radius: 5px;}
.ar {margin: 0 auto; width: 0; height: 0; margin-top:-10px;border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #fff;}
.box {
display:inline-block;
width:100px;
background:#fff;
color: #333;
text-align:center;
font-family:courier new;
font-size:11px;
letter-spacing:3px;
cursor:pointer;
padding:4px;
filter: alpha (opacity=60);
-moz-opacity: 0.60;
opacity: 0.60;
-webkit-transition-duration: .50s;}
.box:hover {
filter: alpha (opacity=90);
-moz-opacity: 0.90;
opacity: 0.90;
-webkit-transition-duration: .50s;
border-bottom:none;}
a:link, a:visited, a:active {
color: #afafaf; cursor: default; text-decoration: none; font-size: 10pt; -webkit-transition:1s;}
a:hover {
cursor: url('http://cur.cursors-4u.net/symbols/sym-6/sym579.cur'), auto;  color: #666; text-decoration:none; }
.wrapper {
margin: 0 auto; width: 760px;
background-color: #fff;
border:10px solid #eee;
border-radius:10px;
border-shadow: inset 0px 0px 9px 4px rgba(119, 119, 119, 0.2);
-moz-border-shadow: inset 0px 0px 9px 4px rgba(119, 119, 119, 0.2);
-webkit-box-shadow: inset 0px 0px 9px 4px rgba(119, 119, 119, 0.2);
box-shadow: 0px 0px 9px 4px rgba(119, 119, 119, 0.27);
-moz-box-shadow: 0px 0px 9px 4px rgba(119, 119, 119, 0.27);
-webkit-box-shadow: 0px 0px 9px 4px rgba(119, 119, 119, 0.27);
 padding: 7px;
}

.icon-circle-arrow-right {
color:#eee; }
.icon-circle-arrow-left {
color:#eee; }
.icon-circle-arrow-left:hover {
text-shadow: 1px 1px 1px #bbb; }
.icon-circle-arrow-right:hover {
text-shadow: 1px 1px 1px #bbb;}
.heyo {
background-image:url(http://i.imgur.com/ubcMmsV.gif);
width:750px; }
blockquote {
opacity: .5;
position:center;
border:5px double #fafafa;
border-radius:5px ;
background-repeat:repeat;
background-image: url(http://www.swimchick.net/resources/textures/newtextures/text133.jpg);
letter-spacing: 1px;
padding: 5px 5px 5px 5px;
width:400px;
height:70px;overflow:auto;
color:#fff;
overflow-x: hidden;
overflow-y: scroll;
}
.ha, .hb, .hc{
height:16px;
width:240px;
padding:4px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
text-align:center;
position:relative;
font-family : tahoma;
font-size:9px;
font-style:bold;
text-transform: uppercase;
background-image: url(http://i.imgur.com/R2VIlhy.png);
z-index:500;
border: solid 2px #fff;
   color: #fff;

}
footer{
height:auto;
width:580px;
font-size:9px;
font-family: tahoma;
padding:3px;
letter-spacing: 2px;
text-align:center;
position:relative;
border-radius: 10px;
font-style:bold;
text-transform: none;
background-image: url(http://i.imgur.com/R2VIlhy.png);
z-index:500;
border: solid 2px #fff;
   color: #fff;
}
h4 {
font-family: 'star';
                font-size: 30px;
                color: #fff;
                 text-shadow: 1px 1px 1px #808080;
                   -webkit-text-stroke-width: 0.5px;
   -webkit-text-stroke-color: #ddd; }
@font-face{font-family:star; src:url('http://static.tumblr.com/cpgw3dl/u7dmup8xr/lavanderia_regular.ttf');}
@font-face{font-family:south rose; src:url('http://static.tumblr.com/cpgw3dl/uvJmuos7j/southrose.ttf');}
</style>
</head>
<body>
<div style="width:auto; height: 150px; top:0px; overflow: hidden; background-image: url(http://static.tumblr.com/f5257a1065d4d68b3f5e0a77aab11970/cpgw3dl/HSPmuuv0t/tumblr_static_tumblr_mqjvi1vllr1qjv7quo1_1280.jpg); border-bottom: 5px solid #fff;box-shadow: 0px 0px 12px 5px rgba(189, 189, 189, 0.91);
-moz-box-shadow: 0px 0px 12px 5px rgba(189, 189, 189, 0.91);
-webkit-box-shadow: 0px 0px 12px 5px rgba(189, 189, 189, 0.91);"></div>
<center><div style="margin-top:-120px;"><div style="display:inline-block; ">
<nav class="cl-effect-1" id="cl-effect-1"><a style="color:#fff; font-weight:bold;" href="/">Home</a><a style="color:#fff; font-weight:bold;" href="#?w=300" rel="03" class="poplight" >About</a><a style="color:#fff; font-weight:bold;" href="#?w=300" rel="05" class="poplight">Tutorials</a><a style="color:#fff; font-weight:bold;" href="#?w=300" rel="04" class="poplight" >Freebies</a><a style="color:#fff; font-weight:bold;" href="#?w=300" rel="07" class="poplight">Cbox</a><a style="color:#fff; font-weight:bold;" href="http://www.blogskins.com/me/evangrace98" target="_blank">Blogskins</a><a style="color:#fff; font-weight:bold;" href="http://www.blogger.com/follow-blog.g?blogID= YOURBLOGID" target="_blank" >Follow</a></a></nav></div></div></center>
<br><br><br><br><div style="text-align: center; margin-top:-65px; margin-bottom: -55px;">
<img style="border: 5px solid #fff; box-shadow: 0px 0px 12px 5px rgba(189, 189, 189, 0.91);
-moz-box-shadow: 0px 0px 12px 5px rgba(189, 189, 189, 0.91);
-webkit-box-shadow: 0px 0px 12px 5px rgba(189, 189, 189, 0.91);border-radius: 100px 100px 100px 100px; width:110px;" src="http://i.imgur.com/2NatPe1.jpg"></div>
<div style="padding: 55 0 25 0; text-align: center;"><br>
<div style="margin: auto; margin-top: 0; width: 500px; color: #999; font: 12px courier new; text-align: center;"><h4>
"I wanna liberate my imaginations <div style="padding:5px;"></div><p>to go beyond the cosmos."</p></h4>
</div>
</div>
<br>
<div class="wrapper">
<Blogger>
<center><table cellspacing="1px" background-color="#fff">
<tr>
<td class="ha"><$BlogItemTitle$></td><td class="hc"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader></td><td class="hb"><a style="color: #fff; href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>>Leave a comment</a></BlogItemCommentsEnabled></td>
</tr></table></center>
<br>
<$BlogItemBody$><br><br><br>
</Blogger>
<center>
<span style="float:left;"><a class="pager" title="Newer posts" href=<$NewerPosts$>><i class="icon-circle-arrow-left icon-3x"></i></a></span>
<span style="float:right;"><a class="pager" title="Older Posts"  href=<$OlderPosts$>><i class="icon-circle-arrow-right icon-3x"></i></a></span>
<br><center><footer><span style="font-family: arial; font-size: x-small;color:#fff ;">Copyright ©.Layout by <a style="color:#aaa;" href="http://blogskins.com/me/evangrace98">Evangelista</a>.</span><span style="font-family: arial; font-size: x-small;color:#fff;">. All rights reserved 2011-infinity.</span></footer></center><br>
</div>
<br>
<div id="07" class="popup_block"><div style="width:auto;height:150px;overflow:auto; ">
    <Center><div class="title">Chatbox</div></center>
<br>
<center><div><iframe frameborder="0" width="230" height="75" src="http://www5.cbox.ws/box/?boxid=712646&amp;boxtag=zg4n92&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform5-712646" style="border: 5px solid #ddd;" id="cboxform5-712646"></iframe></div></center>
</div>
</div></div>
</div></div></div></div></div></div></div></div></div></div>

<div id="05" class="popup_block">
     <div style="width:auto;height:150px;overflow:auto; "><Center><div class="title">Tutorials for you</div></center>
<br>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
</div>
</div></div></div></div></div></div></div></div></div></div>
<div id="04" class="popup_block"><div style="width:auto;height:150px;overflow:auto; ">
    <Center><div class="title">Freebies for you</div></center>
<br>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
<ul><a class="thingi" href='/' >LINK</a></ul>
</div></div>
</div></div></div></div></div></div></div></div></div></div>
<div id="03" class="popup_block"><div style="width:auto;height:150px;overflow:auto; ">
    <Center><div class="title">Hello there!</div><br><center><img src="http://i.imgur.com/ftog37J.jpg" style="width:100px; border:8px solid #fff ;
 -moz-border-radius:0px 100px 100px 100px;
border-radius:100px 100px 100px 100px;
width:100px;
height:100px;"><br><br><div class="ar"></div>
<div class="sd">Blarara..your profile goes here..
</div></center></div>
</div></div></div></div></div></div></div></div></div></div>
</body>
</html>
<script src="http://static.tumblr.com/3ikgvxs/K16l80ow6/cufon-yui.js" type="text/javascript"></script>
<script src="http://static.tumblr.com/3driglx/PH8l1y75m/lorie_400.font.js" type="text/javascript"></script>
<script type="text/javascript">Cufon.replace('a:link');</script>
<script src="http://static.tumblr.com/3ikgvxs/K16l80ow6/cufon-yui.js" type="text/javascript"></script>
<script src="http://static.tumblr.com/3driglx/PH8l1y75m/lorie_400.font.js" type="text/javascript"></script>
<script type="text/javascript">Cufon.replace('');</script>
<script src="http://static.tumblr.com/3ikgvxs/K16l80ow6/cufon-yui.js" type="text/javascript"></script>
<script src="http://static.tumblr.com/3driglx/PH8l1y75m/lorie_400.font.js" type="text/javascript"></script>
<script type="text/javascript">Cufon.replace('');</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"><img src="http://www.blogskins.com/cachepic_s3.php?sid=400216&pic=http://static.tumblr.com/bc7znss/MN5ma27op/373813c8qyd2txyp.gif" class="btn_close" title="Close" alt="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>