happyeaster
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-AU">
<head>
<title>Happy Easter</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<style type='text/css'>
* {
padding: 0px;
margin: 0px;
}
html {
height: 100%;
}
body {
/* color: #F7B866; */
color: #6C5530;
font-family: arial;
height: 100%;
background: #9BCFF3;
overflow: visible;
}
/* HEADER */
.header {
position: relative;
text-align: center;
width: 100%;
height: 100px;
margin: 0 0 10px 0;
border-bottom: 5px solid #6C5530;
color: #8DDDD6;
background: url('happyeaster-images/header.png');
padding-top: 40px;
}
.header h1 {
font-family: serif;
color: #6C5530;
display: block;
height: 40px;
overflow: hidden;
background: url('happyeaster-images/header2.gif') center bottom no-repeat;
}
.header .slogan {
display: block;
position: relative;
bottom: -20px;
width: 200px;
height: 25px;
background: url('happyeaster-images/slogan.gif') center center no-repeat;
margin: 0 auto;
color: #fff;
padding-top: 15px;
font-size: 12px;
font-weight: bold;
}
/* CONTENT WRAPPER */
.wrapper {
display: block;
width: 50%;
margin: 0 auto;
padding-bottom: 0px;
//padding-bottom: 0px;
background: #226688;
position: relative;
min-height: 100%;
background: #fff;
border-left: 3px solid #1B5882;
border-right: 3px solid #1B5882;
}
* html .wrapper {
height: 100%;
}
/* LEFT */
.left {
float: left;
width: 95%;
padding: 15px 5px;
margin: 0 auto;
}
.entry {
width: 90%;
margin: 0 auto;
margin-bottom: 20px;
padding: 10px;
}
.entry h2 {
text-transform: uppercase;
text-decoration: underline;
padding-bottom: 10px;
color: #1B5882;
}
.entry p {
text-align: justify;
padding: 10px;
line-height: 20px;
}
.entry img {
float: left;
margin: 5%;
border: none;
}
.entry a img {
border: none;
}
.entry .preview {
display: block;
width: 20%;
margin: 2%;
border: 1px solid #3C2819;
padding: 5px;
}
.entry .preview a {
border: none;
text-decoration: none;
}
.entry .preview img {
width: 175px;
margin: 2px auto;
border: none;
float: none;
display: block;
}
form textarea {
widht: 100%;
margin: 0 auto;
}
/* RIGHT */
.right {
position: absolute;
top: 140px;
right: 9.5%;
width: 15%;
float: right;
padding: 10px 2px;
background: #1B5882;
color: #8DDDD6;
}
.links {
width: 80%;
margin: 0 auto;
font-weight: bold;
}
.right .links a {
display: block;
border-bottom: 1px solid #9BCFF3;
width: 80%;
padding: 10% 10%;
text-decoration: none;
color: #fff;
}
.right .links a:hover, .right .links a#active {
background: #072235;
}
.right .links ul, .right .links li {
list-style: none;
}
/* FOOTER */
.footer {
font-weight: bold;
color: #fff;
display: block;
height: 20px;
clear: both;
text-align: center;
width: 100%;
padding: 5px 0;
background: #1B5882;
position: relative;
margin-top: -30px;
}
.footer a {
color: #fff;
}
a {
color: #1B5882;
text-decoration: underline;
}
a:hover {
text-decoration: none;
}
.clear {
width: 100%;
clear: both;
}
.small {
font-size: small;
float: right;
margin-top: -10px;
width: 100%;
}
</style>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js"></script>
</head>
<body>
<div class="wrapper">
<div class="header">
<h1>Happy Easter</h1>
<div class="slogan">The Reason<br/>
For The Season</div>
</div>
<div class="clear"></div>
<div class="left">
<div class="entry">
<h2>Romans 6:8-11</h2>
<p>Now if we be dead with Christ, we believe that we shall also live with him:</p>
<p>Knowing that Christ being raised from the dead <a href="http://www.free-css.com/">dieth no more</a>; death hath no more dominion over him.</p>
<p>For in that he died, he died unto sin once: but in that he liveth, he liveth unto God.</p>
<p>Likewise reckon ye also yourselves to be dead indeed unto sin, but <a href="http://www.free-css.com/">alive unto God</a> through Jesus Christ our Lord.</p>
</div>
<div class="entry">
<h2>Christ the Lord Is Risen Today</h2>
<p>Christ the Lord is risen today, Alleluia! Earth and heaven in chorus say, Alleluia! Raise your joys and triumphs high, Alleluia! Sing, ye heavens, and earth reply, Alleluia!</p>
<p> <a href="http://www.free-css.com/">Love's redeeming work is done</a>, Alleluia! Fought the fight, the battle won, Alleluia! Death in vain forbids him rise, Alleluia! Christ has opened paradise, Alleluia! </p>
<p>Lives again our glorious King, Alleluia! Where, O death, is now thy sting? Alleluia! Once he died our <a href="http://www.free-css.com/">souls to save</a>, Alleluia! Where's thy victory, boasting grave? Alleluia! </p>
<p><span class="small">by:Charles Wesley</span></p>
</div>
<div class="entry">
<h2>Matthew 28:1-10</h2>
<p>In the end of the sabbath, as it began to dawn toward the first day of the week, came Mary Magdalene and the other Mary to see the sepulchre.</p>
<p>And, behold, there was a great earthquake: for the angel of the Lord descended from heaven, and came and rolled back the stone from the door, and sat upon it.</p>
<p>His countenance was like lightning, and his raiment white as snow:</p>
<p>And for fear of him the keepers did shake, and became as dead men.</p>
<p>And the angel answered and said unto the women, Fear not ye: for I know that ye seek Jesus, which was crucified.</p>
<p>He is not here: for he is risen, as he said. Come, see the place where the Lord lay.</p>
<p>And go quickly, and tell his disciples that he is risen from the dead; and, behold, he goeth before you into Galilee; there shall ye see him: lo, I have told you.</p>
<p>And they departed quickly from the sepulchre with fear and great joy; and did run to bring his disciples word.</p>
<p>And as they went to tell his disciples, behold, Jesus met them, saying, All hail. And they came and held him by the feet, and worshipped him.</p>
<p>Then said Jesus unto them, Be not afraid: go tell my brethren that they go into Galilee, and there shall they see me.</p>
<p>[ <a href="http://www.free-css.com/">READ MORE</a>]</p>
</div>
</div>
<div class="clear"></div>
</div>
<div class="right">
<div class="links"> <a id="active" href="http://www.free-css.com/">Home</a> <a href="http://www.free-css.com/">The Reason</a> <a href="http://www.free-css.com/">Graystatic</a> <a href="http://www.free-css.com/">PW2</a> <a href="http://www.free-css.com/">ABC's</a> </div>
</div>
<div class="footer">
<p>designed by <a href="http://graystatic.net">graystatic</a> | © 2007 </p>
</div>
</body>
</html>
Related examples in the same category