Alice where are you??

Moi moi

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas bibendum scelerisque posuere. Nulla facilisi. Sed venenatis, ante et egestas convallis, metus ipsum ultricies risus, vitae scelerisque neque erat vitae lacus. Aliquam erat volutpat. Sed sit amet risus at sapien semper dictum. Nunc imperdiet sagittis tellus at luctus. Sed laoreet dapibus mattis.

Aenean dignissim lacus sit amet augue posuere sed aliquet enim aliquam. Vivamus cursus lobortis egestas. Sed laoreet commodo libero, quis volutpat lacus consectetur vel. Phasellus erat felis, cursus id pretium at, facilisis nec est. Nam posuere magna nec purus mattis auctor. Fusce id arcu arcu, a sagittis purus. Pellentesque aliquet consequat lectus, faucibus ultrices diam iaculis rhoncus. Maecenas sagittis risus eget urna venenatis et ultricies dolor molestie. Suspendisse potenti. Etiam ullamcorper dignissim lacus, vel porta ante laoreet non. Proin sit amet urna ipsum, at pharetra augue. Fusce semper viverra leo ac venenatis. Aliquam magna lorem, elementum eu fringilla vel, feugiat eu nisl. Sed suscipit volutpat tortor pulvinar tincidunt.

Hei hei

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse neque arcu, consequat in feugiat nec, pulvinar at arcu. Cras ut libero porta quam viverra consequat quis sit amet sapien. Sed vulputate ornare odio, elementum accumsan nulla pretium.

Asennus

IMG:

VF_n20.jpg | alicebg.jpg | alice.jpg | alicenav.png | alicenav2.png

CSS:

Name your CSS-folder alice.css.

body { background: url(http://i835.photobucket.com/albums/zz275/nameless_X3/layots/VF_n20.jpg) repeat 0 0 fixed; margin: 0; color: #EEE; font-family: Georgia, Serif; font-size: 12px; letter-spacing: 0.02em; word-spacing: 4px; } a:link, a:visited { color: #B79363; } a:hover { text-decoration: none; } #main { background: url(http://i835.photobucket.com/albums/zz275/nameless_X3/layots/alicebg.jpg) repeat-y; width: 700px; min-height: 200px; } #main .header { background: url(http://i835.photobucket.com/albums/zz275/nameless_X3/layots/alice.jpg) no-repeat; height: 420px; padding: 30px 20px 0 0; text-align: right; } #main .header h1 { color: white; font-family: Georgia, Serif; font-size: 30px; font-weight: normal; letter-spacing: 2px; word-spacing: 6px; margin: 0; } #main .header h2 { margin: 0; font-size: 15px; font-weight: normal; font-style: italic; letter-spacing: 2px; word-spacing: 6px; } #main .navi { margin: -80px 20px 20px 20px; } #main .text { padding: 0 25px 40px; text-align: justify; } #main h1 { color: #1F3B3C; font-family: Georgia, Serif; font-weight: normal; font-size: 20px; letter-spacing: 4px; } #main h1:before { background: url(kuvasese) no-repeat; } #main h2 { color: #B79363; font-size: 16px; font-weight: normal; letter-spacing: 2px; padding-left: 40px; } #main h2:before { content: " - "; color: #1F3B3C; } #main .copyt { padding: 10px 0 0; text-align: center; font-size: 10px; color: #CCC; } a:link.nav, a:visited.nav { background: url(http://i835.photobucket.com/albums/zz275/nameless_X3/layots/alicenav.png) repeat; text-decoration: none; padding: 5px 10px; font-family: Garamond, Serif; font-size: 14px; letter-spacing: 2px; color: #1F3B3C; } a:hover.nav { color: #BFA280; background: url(http://i835.photobucket.com/albums/zz275/nameless_X3/layots/alicenav2.png) repeat; } input, select, textarea { color: #B79363; border: 1px solid #313131; background: transparent; font-family: Tahoma, Sans-serif; font-size: 12px; padding: 10px; }

HTML:

<!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" lang="fi" xml:lang="fi"> <head> <title>White Rabbit</title> <link href="alice.css" type="text/css" rel="stylesheet" /> </head> <body> <center> <div id="main"> <div class="header"> <h1>Site's title</h1> <h2>Diipadaapa daa</h2> </div> <div class="navi"> <a href="#" class="nav">Alice</a> <a href="#" class="nav">where</a> <a href="#" class="nav">are</a> <a href="#" class="nav">you??</a> </div> <div class="text"> <h1>Moi moi</h1> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas bibendum scelerisque posuere. Nulla facilisi. Sed venenatis, ante et egestas convallis, metus ipsum ultricies risus, vitae scelerisque neque erat vitae lacus. Aliquam erat volutpat. Sed sit amet risus at sapien semper dictum. Nunc imperdiet sagittis tellus at luctus. Sed laoreet dapibus mattis. </p> <p> Aenean dignissim lacus sit amet augue posuere sed aliquet enim aliquam. Vivamus cursus lobortis egestas. Sed laoreet commodo libero, quis volutpat lacus consectetur vel. Phasellus erat felis, cursus id pretium at, facilisis nec est. Nam posuere magna nec purus mattis auctor. Fusce id arcu arcu, a sagittis purus. Pellentesque aliquet consequat lectus, faucibus ultrices diam iaculis rhoncus. Maecenas sagittis risus eget urna venenatis et ultricies dolor molestie. Suspendisse potenti. Etiam ullamcorper dignissim lacus, vel porta ante laoreet non. Proin sit amet urna ipsum, at pharetra augue. Fusce semper viverra leo ac venenatis. Aliquam magna lorem, elementum eu fringilla vel, feugiat eu nisl. Sed suscipit volutpat tortor pulvinar tincidunt. </p> <h2>Hei hei</h2> <p> Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse neque arcu, consequat in feugiat nec, pulvinar at arcu. Cras ut libero porta quam viverra consequat quis sit amet sapien. Sed vulputate ornare odio, elementum accumsan nulla pretium. </p> <div class="copyt"> Design ©<a href="">Namuless</a> Image ©<a href="http://www.flickr.com/photos/brandoncwarren/">Brandon Christopher Warren</a> Pattern ©<a href="http://www.piccolecreazioni.com/velvetfactory/">Velvet Factory</a> </div> </div> </div> </center> </body> </html>