Blue mirage

Layout Code

Copy and paste to Template HTML

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Blue Mirage</title>

body {
	background-color:#000000;
	background-image:url(http://cbimg6.com/layouts/10/07/36406ab.png);
	background-repeat:no-repeat;

}
#content {
	position:absolute;
	left:296px;
	top:215px;
	width:615px;
	height:414px;
	z-index:1;
	font-size:13px;
	color:#65696d;
	background-image:url(http://cbimg6.com/layouts/10/07/36406ac.png);
	background-repeat:no-repeat;
	background-position: top;
}
#topnav {
	position:absolute;
	left:350px;
	top:147px;
	width:506px;
	height:50px;
	z-index:2;
	overflow:hidden;
}

a.nav:active, a.nav:visited, a.nav:link {
    display:Inline-block;
	color:#424657;
    font-family:georgia;
	text-align: center;
    font-size:11px;
    font-weight:None;
    text-decoration:none;
    letter-spacing:1px;
    line-height:14px;
	width:80px;
	height:46px;
	background-image:url(http://cbimg6.com/layouts/10/07/36406ad.png);
}

a.nav:hover {
	display:Inline-block;
    color:#424657;
    font-family:georgia;
	text-align: center;
    font-size:11px;
    font-weight:normal;
    text-decoration: none;
    letter-spacing:1px;
    line-height:14px;
	width:80px;
	height:46px;
	background-image:url(http://cbimg6.com/layouts/10/07/36406ae.png);
	
}

a.link:active, a.link:visited, a.link:link {
	display: block;
    color:#3f4952;
    font-family:georgia;
	text-align: left;
    font-size:13px;
    text-decoration:none;
}

a.link:hover {
    display: block;
    color:#4d5760;
    font-family:georgia;
	text-align: left;
    font-size:14px;
	text-decoration:none;

}
blockquote {
	color:#637276;
	font-size:11px;
	border-bottom-width:1px;
	border-bottom-style: solid;
	border-bottom-color:#2e3134;
	border-left-width:1px;
	border-left-style:solid;
	border-left-color:#2e3134;
	border-right-width:1px;
	border-right-style:solid;
	border-right-color:#2e3134;
	border-top-width:1px;
	border-top-style:solid;
	border-top-color:#2e3134;
	background-image:url(http://cbimg6.com/layouts/10/07/36406af.png);
	background-repeat:no-repeat;
	background-position:bottom;
}

H1 {
	background-image:url(http://cbimg6.com/layouts/10/07/36406ag.png);
	width:615px;
	height:34px;
	font-size:18px;
	text-align:center;
	color:#788189;
}

H2 {
	color:#62676c;
	font-size:17px;
	text-align:left;
	width:150px;
	height:24px;
	background-image:url(http://cbimg6.com/layouts/10/07/36406ah.png);

}

#rightnav {
	position:absolute;
	left:917px;
	top:214px;
	width:169px;
	height:513px;
	z-index:3;
}
#SiteTitle {
	position:absolute;
	font-family:georgia;
	left:371px;
	top:71px;
	width:440px;
	height:77px;
	z-index:4;
	color:#383c48;
	letter-spacing:5px;
	font-size:25px;
	text-align: center;
	text-decoration:bold;
	background-image:url(http://cbimg6.com/layouts/10/07/36406ai.png);
}

-->
</style>
</head>

<blockquote>
<img src="http://cbimg6.com/layouts/10/07/36406aa.png" width="50" height="50" align="left"/>
This is a sample of a blockquote section.
<p>
tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque e

</blockquote>

<h1>Header Sample..</h1>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. </p>
  <p>Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
  
  <h1> Second thoughts?..</h1>
  
  
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. </p>
  <p>Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
</div>

<div id="topnav">
<a href="../link" class="nav">Clear</a>
<a href="../link" class="nav">Sitely</a>
<a href="../link" class="nav">Visitor</a>
<a href="../link" class="nav">Interact</a>
<a href="../link" class="nav">About</a>
<a href="http://justleah.createblog.com" class="nav">Designer</a>

</div>

<div id="rightnav">
<h2>Navigate</h2>
<a href="../link" class="link">Photos</a>
<a href="../link" class="link">Stock</a>
<a href="../link" class="link">Materials</a>
<a href="../link" class="link">Books</a>
<a href="../link" class="link">Others</a>
<a href="http://justleah.createblog.com" class="link">Designer</a>

<h2>Affiliates</h2>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>
<a href="../link" class="link">Linkage</a>

</div>

<div id="SiteTitle">
Blue Mirage

</div>
<p> </p>
<p> </p>
</html>

Layout Comments

Showing latest 5 of 5 comments

This is perfect... I don't have a big issue with reading the text, and the font color coupled with the background gives a very mYsTeRiOuS feel, I'm loving it.

By CuntBlog on Sep 19, 2010 7:02 pm

I agree with the others. Also, it wasn't centered on my screen, but I didn't really mind... it was close enough.

By emberfly on Aug 12, 2010 7:53 pm

Unique design :)

By volverene on Jul 28, 2010 2:18 pm

It looks good on the computer I'm on now but I viewed it earlier on a different computer and it was very dark - to the point where I had a hard time reading it. The design is great, though. :D

By schizo on Jul 26, 2010 11:37 pm

Thank you for sharing this with the rest of us but honestly, this is too dark...and kind of blurry. I can't really see what's under the light at center (but that's just me).

By Butterface89 on Jul 26, 2010 10:56 am

Layout Details

Designer	JustLeah
Submitted on	Jul 16, 2010
Page views	8,237
Favorites	15
Comments	5
Reviewer	Christy
Approved on	Jul 25, 2010

Blue mirage

Layout Code

Layout Comments

Layout Details

Layout Colors

Layout Tags

Layout Tools

Layout Affiliates