::Infatuation::

Designer's Comments

Look carefully for specific instructions

Please do not change the images in any way. DO NOT REMOVE THE CREDIT. You can edit the navigation/content/etc as you want. :) Tested in Firefox and Internet Explorer, and it should work in most screen resolutions. (made in 1200 x 800 Firefox)

Oh, pls check out my little website. :)

---------------------
Credits
Resources used from Kiho-Chan, Appendixsquared , Aethereality Gallery, CrazyKira, and Fairytaled. Images found on Pink Pistol and Elegance Pixelfied.

Layout Code

Copy and paste to Template HTML

Help

<title>::Infatuation::</title>

#content A, #content A:link, #content A:visited {font-family: georgia; text-decoration: none; color:#719b89; cursor: crosshair; font-size: 8pt; border-bottom: 1px dotted #a3ccd4; font-weight: bold;}
#content A:hover {font-family: georgia; text-decoration:none; color:#c6416b; cursor: crosshair; font-size: 8pt; border-bottom: 1px dotted #86b9c3; font-weight: bold;}

#navigation A, #navigation A:link, #navigation A:visited {cursor: crosshair; font-family: century; font-size:9pt; color: #8dac9f; background-color:#3c2e33; line-height:9px; display: block; text-decoration: none; padding: 7px 0px 4px 12px;}
#navigation A:hover {color:#c7738a; display: block; text-decoration: none; padding: 6px 0px 5px 12px;}

b {font-weight: bold; color: #975279;}
i {font-style: italic; color: #386a81;}
u {text-decoration: underline; color: #54754e; border-bottom: 1px dashed #deb083;}

p {margin-bottom: -5px; _margin-bottom: -10px;}

#main_nav {
	list-style: none; 
	padding-left: 0px; 
	padding: 0px;
	width: 100%;
	margin-left: 40px;
	margin-top: -50px;}

#main_nav li {
	display: inline;
	text-align: center;
	padding-right: 15px;}

#main_nav a:link, #main_nav a:visited {text-decoration: none;  color: #a5ce9e; font-family: "georgia"; font-weight: bold; text-transform: uppercase; font-size: 11px; cursor: ne-resize; padding: 3px;}
#main_nav a:hover {text-decoration: none; color: #b17080; background-color: #500000; font-family: "georgia"; font-weight: bold; text-transform: uppercase; font-size: 11px; cursor: ne-resize;}

body {
	background: #bdaf8a;
	text-align: center;
   	min-width: 620px;
}

div.wrapper {
  	 text-align: left;
  	 margin-left: auto;
  	 margin-right: auto;
}
#container {
	background: url(http://cbimg9.com/layouts/08/10/31939aa.jpg) repeat-y; 
	width: 620px; 
	margin: 0 auto;}

#header1 {width: 620px; height: 100px; background: url(http://cbimg9.com/layouts/08/10/31939ab.jpg) no-repeat;}
#header2 {width: 620px; height: 100px; background: url(http://cbimg9.com/layouts/08/10/31939ac.jpg) no-repeat;}
#header3 {width: 620px; height: 100px; background: url(http://cbimg9.com/layouts/08/10/31939ad.jpg) no-repeat;}
#header4 {width: 620px; height: 100px; background: url(http://cbimg9.com/layouts/08/10/31939ae.jpg) no-repeat;}
#header5 {width: 620px; height: 67px; background: url(http://cbimg9.com/layouts/08/10/31939af.jpg) no-repeat;}

#footer {
	clear: both;
	height: 41px;
	background: url(http://cbimg9.com/layouts/08/10/31939ag.jpg) no-repeat;;
	margin: 0;
	_margin-bottom: -60px;
}
#content {
	width: 380px;
	float: left;
	margin-top: 10px;
	margin-left: 30px;
	text-align: justify;
}
#navigation {
	width: 156px;
	float: left;
	text-align: center;
	margin-top: 10px;
	margin-left: 25px;
}

#zone1 {    /* imagemap */
float: left;
width : 111px;
height: 14px;
margin-left: 8px;
margin-top: 86px;
text-decoration: none;
border: none;
cursor: help;
}
body {color:#49363c;font-family: arial; font-size: 8pt; line-height: 14px;}

h1 { display: block; margin-left: auto; margin-right: auto;  text-align: center; font-family: "palatino linotype"; font-size: 11pt; color: #b90e3b; text-decoration: none; height: 11px; margin-bottom: -6px; _margin-bottom: -15px; padding-bottom: 4px; background: #c5b498; padding-top: 2px;}
h2 { display: block; margin-left: auto; margin-right: auto;  text-align: center; font-family: "palatino linotype"; font-size: 12pt; color: #fff; text-decoration: none; height: 18px; margin-bottom: -5px; _margin-bottom: -1px; padding-bottom: 6px; background: url(http://cbimg9.com/layouts/08/10/31939ah.png) no-repeat;}

</style></head>
<body>
<div id="container">
<div id="header1"></div><div id="header2"></div><div id="header3"></div><div id="header4"><a id="zone1" href="http://dreamgurl36.createblog.com" title="Designed & Coded By: dreamgurl36"></a></div><div id="header5"></div>
<div class="wrapper">

<ul id="main_nav" >
            <li><a href="#">Home</a></li>
            <li><a href="#">About Me</a></li>
            <li><a href="#">Content</a></li>
            <li><a href="#">Guestbook</a></li>
            <li><a href="#">Affliliates</a></li>
            <li><a href="#">More Links?</a></li>
     </ul>

<h2>Sidebar Title</h2>
<a href="#">Link Name</a>
<a href="#">Link Name</a>
<a href="#">Link Name</a>
<a href="#">Link Name</a>
<a href="#">Link Name</a>
<a href="#">Link Name</a>

<h2>Affiliates</h2>
<a href="#">Affiliate Links</a>
<a href="#">Affiliate Links</a>
<a href="#">Affiliate Links</a>
<a href="#">Affiliate Links</a>
<a href="#">Affiliate Links</a>
<a href="#">Affiliate Links</a>

<h2>More Links?</h2>
<a href="#">One link</a>
<a href="#">Two Links</a>
<a href="#">Three Links</a>
<a href="#">Four Links</a>
<a href="#">Five Links</a>

</div>

<h1>About This Layout :: Infatuation</h1>

<p><b>Infatuation</b>: <i>the state of being completely carried away by unreasoned passion or love; addictive love. Infatuation usually occurs at the beginning of a relationship. It is characterized by urgency, intensity, desire, and/or anxiety, in which there is an extreme absorption in another.</i> </p>

<p>I must say... I love how the banner turned out. X] Of course it took me <i>forever</i> to make everything fit in place, and figuring out what to add onto it. Originally I had the main image of the couple and wanted to use it on a grungy love-themed layout. Oh, and also that red <b>heart</b> with black wings too! I drew that in Physics class, hahaha. Thought it'd look good on a layout. So yeah... from those two things, I added more elements onto the banner. The banner's made up of mostly <u>various textures</u> and no brushes at all. I'm also into graffiti-style text as well. I worked hard on this layout, and hope you enjoy it!</p>

<p>So... this is where your main content will go~! Fill up as much or as little as you want! XD It's all up to you! Please do NOT change the images/layout in any way. And it goes without saying.... <b>do not remove the credit</b>. I mean... I've taken the ultra long time to code this, so the least you can do is leave the credit there. But of course.... you may edit the navigation, contents, and such to suit your website needs. ^^ I think you'd need some basic knowledge of <u>html and css</u> to be able to fully make use of this layout. But it's nothing too complicated. There are plenty of tutorials on the web, and even some on <a href="http://www.createblog.com" target="_blank">CreateBlog</a> too.

<p>This layout was tested in both Internet Explorer and Firefox. In Firefox, the font of the text will be slightly different. Other than that, it works perfectly fine, <u>compatible in both browsers</u>. ^^ Oh, and it works in all resolutions too. :) Hope you enjoy it!</p>

<p><b>bold text</b>, <i>italic text</i>, <u>underlined text</u>, <a href="#">a link</a></p>

<h1>Header Title Goes Here</h1>
<p>content content content content content content content content content content content content content content content content content content content content content content content content  content content content content content content content content content content content content</p>

<p>content content content content content content content content content content content content content content content content content content content content content content content content  content content content content content content content content content content content content</p>

</div>