foo_shooting_club
<!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" xml:lang="no" lang="no-nb">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="My keywords" />
<meta name="description" content="Valid xhtml/css template by www.csstemplatesweb.com" />
<title>Foo Shooting Club</title>
<style type='text/css'>
?/* CSS Document by Svein Erik Storkaas - 2008 | www.csstemplatesweb.com */
* {margin: 0; padding: 0;}
body
{
background-image:url(foo_shooting_club-images/backgroundpattern.gif);
background-repeat:repeat-x;
}
#container {width: 950px;
margin: 10px auto;
border: 2px solid #ffffff;
background-color:#cdd6e7;
}
#header
{
height: 150px;
background-image:url(foo_shooting_club-images/header.jpg);
background-repeat:no-repeat;
}
#header h1
{
height:70px;
width:350px;
font-family:Arial;
font-size:50px;
color:#ffffff;
padding:20px 0px 0px 210px;
}
#header h2
{
height:120px;
width:250px;
font-family:Arial;
font-size:16px;
color:#8093a8;
padding:20px 90px 40px 720px;
}
#topmenu
{
height:50px;
background-repeat:no-repeat;
}
#rightColumn
{
width: 200px;
float: right;
padding-top:3px;
}
#footer
{
clear: both;
background: #fffffe;
text-align:center;
font-family:"trebuchet ms";
font-size:10px;
color:#000000;
border-bottom:dotted 1px #4b4b4b;
border-left:dotted 1px #4b4b4b;
border-right:dotted 1px #4b4b4b;
}
a {color:#434343;}
a:visited {color:#434343;}
a:active {color:#434343;}
a:hover {text-decoration:none;}
#content_wrapper {width: 718px; margin-left: 10px; margin-bottom:10px;}
#content_top {background: url(foo_shooting_club-images/content_top.png); height: 9px; width:718px; background-repeat: no-repeat}
#content_middle {background: url(foo_shooting_club-images/content_tile.png); width:718px; background-repeat:repeat-y; }
#content_bottom {background: url(foo_shooting_club-images/content_bottom.png); height: 8px; width:718px; background-repeat: no-repeat }
#content_wrapper p {margin-left:20px; margin-bottom:0px; margin-right:20px; font-family:"trebuchet ms", sans-serif; color:#3d3b3b; font-size:0.8em;}
#content_wrapper h2 {margin-left: 20px; font-family:"trebuchet ms", sans-serif; font-size:1.1em; color:#ffffff; }
.newsimages {
float: left;
margin-right: 10px;
margin-bottom: 2px;
margin-left:20px;
margin-top: 3px;
}
img
{
border:0;
}
/*TOP MENU*/
.menu1 {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fffffe url(foo_shooting_club-images/button1.gif); position:relative; border:1px solid #000; border-width:0 1px; border-bottom:1px solid #444;}
.menu1 li {float:left;}
.menu1 li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:11px; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;}
.menu1 li a b {float:left; display:block; padding:0 16px 0 8px;}
.menu1 li.current a {color:#fff; background:url(foo_shooting_club-images/button3.gif);}
.menu1 li.current a b {background:url(foo_shooting_club-images/button3.gif) no-repeat right top;}
.menu1 li a:hover {color:#fff; background:#000 url(foo_shooting_club-images/button2.gif);}
.menu1 li a:hover b {background:url(foo_shooting_club-images/button2.gif) no-repeat right top;}
.menu1 li.current a:hover {color:#fff; background:#000 url(foo_shooting_club-images/button3.gif); cursor:default;}
.menu1 li.current a:hover b {background:url(foo_shooting_club-images/button3.gif) no-repeat right top;}
/*END TOP MENU*/
/*SPEECH BUBBLES*/
#speechcontainer div:after {content: "."; display: block; height:11px; clear:both; visibility:hidden;}
#speechcontainer div {width:195px; height:auto; font-family:verdana; font-size:11px;}
b.tl {display:block; width:195px; height:8px; font-size:1px;}
b.tr {display:block; width:187px; height:8px; font-size:1px; float:right;}
b.bl {display:block; width:8px; height:8px; font-size:1px; float:left;}
b.br {display:block; width:187px; height:8px; font-size:1px; float:right; position:relative;}
b.point {display:block; font-size:1px; width:25px; height:14px;}
#speechcontainer div p {padding:8px; margin:0; border:3px solid #fff; border-width:0 3px; text-align:justify;}
div.two b.tl {background:url(foo_shooting_club-images/top_left2.gif) top left no-repeat;}
div.two b.tr {background:url(foo_shooting_club-images/top_right2.gif) top right no-repeat;}
div.two p {background:#e5ecc9;}
div.two b.bl {background:url(foo_shooting_club-images/bottom_left2.gif) top left no-repeat;}
div.two b.br {background:url(foo_shooting_club-images/bottom_right2.gif) top right no-repeat;}
div.two b.point {background:url(foo_shooting_club-images/point2.gif) top left no-repeat; margin:5px 0 0 125px;}
p.italic {margin:0 0 20px 0; font-weight:bold; font-style:italic;}
ul.list li {font-size:11px; margin:2px 0;}
/*END SPEECH BUBBLES*/
/*Right*/
#randomimagebox
{
margin-top:15px;
border:solid 3px #ffffff;
background-color:#e5ecc9;
font-family:"trebuchet ms", sans-serif;
font-size:15px;
text-align:center;
width:187px;
height:20px;
}
#randomimage
{
margin-top:5px;
}
#randomimage img
{
border:solid 5px #ececec;
}
#linksbox
{
margin-top:15px;
border:solid 3px #ffffff;
background-color:#e5ecc9;
font-family:"trebuchet ms", sans-serif;
font-size:15px;
text-align:center;
width:187px;
height:20px;
}
#links
{
margin:5px 0px 0px 20px;
}
#navlist
{
margin-left: 20px;
padding-bottom:10px;
padding-left: 0;
list-style: none;
}
#navlist li
{
padding-left: 12px;
background-image: url(foo_shooting_club-images/arrow.gif);
background-repeat: no-repeat;
background-position: 0 .5em;
}
/*End right*/
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>Foo Shooting</h1>
<h2>Shooting for fun!</h2>
</div>
<div id="topmenu">
<ul class="menu1">
<li class="current"><a href="index.html"><b>Item 1</b></a></li>
<li><a href="index.html"><b>Item 2</b></a></li>
<li><a href="index.html"><b>Item 3</b></a></li>
<li><a href="index.html"><b>Item 4</b></a></li>
<li><a href="index.html"><b>Item 5</b></a></li>
<li><a href="index.html"><b>Item 6</b></a></li>
</ul>
</div>
<div id="rightColumn">
<div id="speechcontainer">
<div class="two">
<b class="tl"><b class="tr"></b></b>
<p>Friday, 12 march, 2008</p>
<p>Nullam sed mauris. Aliquam facilisis velit ut risus. Donec placerat, diam nec vestibulum tempus, erat arcu ullamcorper dolor, ac aliquam nulla purus id enim.</p>
<b class="bl"></b><b class="br"><b class="point"></b></b>
</div>
</div>
<div id="randomimagebox">Random from gallery</div>
<div id="randomimage">
<img src="foo_shooting_club-images/random_pic.jpg" alt="Random picture" />
</div>
<div id="linksbox">Links</div>
<div id="links">
<div id="navcontainer">
<ul id="navlist">
<li><a href="index.html" title="home" >link number 1</a></li>
<li><a href="index.html" title="home" >link number 2</a></li>
<li><a href="index.html" title="home" >link number 3</a></li>
<li><a href="index.html" title="home" >link number 4</a></li>
<li><a href="index.html" title="home" >link number 5</a></li>
</ul>
</div>
</div>
</div>
<div id="content_wrapper">
<div id="content_middle">
<div id="content_top"></div>
<h2>It's floating</h2>
<img src="foo_shooting_club-images/bullets.png" class="newsimages" alt="bullets" /><p>Aenean pretium est et mauris. Nullam rutrum eleifend tellus. Mauris feugiat magna in eros. Quisque posuere. Maecenas adipiscing, justo non sagittis tempus, leo justo porttitor quam, et laoreet urna pede ut leo. Sed suscipit, nunc non malesuada adipiscing, lorem augue luctus velit, ac lacinia lacus turpis a nisl. Proin blandit. Proin pede turpis, posuere eu, tempus ut, tempus eu, dui. Sed ac orci. Fusce facilisis euismod orci. Curabitur feugiat, sapien quis nonummy porttitor, lorem urna condimentum elit, sit amet consectetuer nisl magna et felis. Sed risus neque, imperdiet nec, pretium eu, consequat quis, leo. Nunc placerat suscipit ipsum. Fusce varius pede vitae orci. Nunc et sapien. Morbi hendrerit euismod diam. Proin fermentum, nisi vel consectetuer ultricies, justo leo varius libero, id pellentesque lectus nibh nec dui.Duis ornare. Nam vitae arcu in diam pretium auctor. Cras et justo quis neque feugiat feugiat. Nunc dolor. Curabitur pharetra consectetuer purus. Ut cursus augue ut ante. Suspendisse potenti. Vestibulum sem. Maecenas accumsan arcu at arcu. Curabitur fermentum iaculis ante.</p>
<h2>Fusce vel nisl</h2>
<p>Vivamus imperdiet tincidunt eros. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam tempus nonummy turpis. Aliquam malesuada tellus vitae quam. In vitae eros fermentum dui varius pharetra. Sed mauris. Nullam eget purus. Morbi dignissim, purus nec adipiscing fringilla, ante lectus mattis nulla, at fringilla massa nisl nec nibh. Duis ornare. Nam vitae arcu in diam pretium auctor. Cras et justo quis neque feugiat feugiat. Nunc dolor. Curabitur pharetra consectetuer purus. Ut cursus augue ut ante. Suspendisse potenti. Vestibulum sem. Maecenas accumsan arcu at arcu. Curabitur fermentum iaculis ante.</p>
<h2>Lorem lipsum</h2>
<img src="foo_shooting_club-images/gunaim.png" class="newsimages" alt="aim" /><p>Proin lobortis mauris id quam. Praesent fermentum elit vel sem. Fusce sem tortor, commodo quis, lacinia at, euismod vel, nisi. Donec aliquam mauris et arcu. Mauris vitae purus. Sed pretium cursus erat. Etiam ac nunc. Vestibulum hendrerit augue ut augue. Aenean quis ante a justo interdum lacinia. Nunc at enim. Morbi faucibus molestie libero. Nullam justo. Mauris sit amet quam vitae felis egestas euismod. Integer nisi ante, elementum vitae, blandit vitae, tincidunt at, pede. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Curabitur posuere. Proin sapien. Vivamus a urna in est ullamcorper lacinia. Morbi pede arcu, dictum ac, lacinia in, cursus nec, purus. Suspendisse potenti.</p>
</div>
<div id="content_bottom"></div>
</div>
<div id="footer"><p>Created by Svein Erik Storkaas for <a href="http://www.csstemplatesWeb.com">CssTemplatesWeb</a> | <a href="http://free-templates.ru">freetemplates.ru</a> |2008</p></div>
</div>
</body>
</html>
Related examples in the same category