ftdgalaxy : Natural « Templates « HTML / CSS






ftdgalaxy

    

<!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">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>FlashTemplatesDesign.com Free Css Templates</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<style type='text/css'>
/*
Design by FlashTemplatesDesign.com
http://www.flashtemplatesdesign.com/
Released for free under a Creative Commons Attribution 2.5 License
*/


*
{
border: 0;
margin: 0;
}

img
{
border: 0px;
}


a{
  color: #000000;
  text-decoration: underline;
}

a:hover{
  text-decoration:none;
  color: #000000;
}

body{
  font: 12px Arial, Helvetica, sans-serif;
  color: #000000;
  line-height:19px;
  background: url(ftdgalaxy-images/bg.gif) #000000;
}

#main_bg{
  width: 1042px;
  margin: 0px auto;
  padding: 0px 0px 0px 0px;
  background: url(ftdgalaxy-images/bg_lr.jpg) center repeat-y #000000;
}

#main {
  width: 1014px;
  margin-left: 14px;
  background: url(ftdgalaxy-images/main.jpg) top no-repeat;
}


#header { 
width:1014px;
padding: 0px 0px 0px 0px;
height: 525px;
}

#logo {  font-family:Georgia, "Times New Roman", Times, serif;
    color:#FFFFFF;
    font-size:18px;
    font-style:italic;
    padding: 58px 0px 0px 125px;
    height: 381px;
}

#logo a {
  text-decoration: none;
  text-transform: lowercase;
  font-style: italic;
  font-size: 16px;
  color: #ffffff;
  font-weight: bold;
}


#logo H2 a{
  font-size: 12px;
  font-family: Arial, Helvetica, sans-serif;
  text-transform: none;
}

#buttons{
  width: 932px;
  height: 70px;
  background: url(ftdgalaxy-images/bg_but.gif) bottom repeat-x;
  text-align:center;
  margin-left: 0px;
  padding-left: 82px
}

#buttons ul {
    padding-left: 0px;
    margin: 0px;
}

#buttons li {
  display: inline;
}

#buttons a {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 18px;
  font-weight:normal;
  display: block;
  float: left;
  width: 122px;
  height: 34px;
  text-decoration: none;
  color: #FFFFFF;
  padding-top: 17px;
  text-align: center;
  background: url(ftdgalaxy-images/but.jpg) 0px 5px no-repeat;  
}


#buttons a:hover {
  text-decoration: none;
  background: url(ftdgalaxy-images/but_ov.png) left top no-repeat;
}

#content{
  width: 1014px;
  padding: 0px 0px 0px 0px;
  background:  #FFFFFF;
  margin: 0px 0px 0px 0px;
  min-height: 425px;
}

#right{
  width: 306px;
  margin: 0px 10px 0px 0px;
  float: right;
}

.right_b {  background: url(ftdgalaxy-images/fish.jpg) 2px 16px no-repeat;
    padding-left: 29px;
    padding-top: 10px;
    width: 277px;}

.text{
  padding: 10px 9px 0px 9px;
}

.img {  float:left;
    margin: 7px 12px 2px 0px;
}

span {  color:#153268;
    font-weight:bold;
}

.dat { text-decoration: underline;
    color:#153268;
    line-height: 30px}

.read { text-align:right;
    padding-right: 10px;
    padding-top: 4px;
    height:24px;}

#right H1{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size:18px;
  font-weight: 100;
  color: #08295A;
  padding-bottom: 5px;
  padding-left: 8px;
  padding-top: 12px;
  text-align: left;
  background: url(ftdgalaxy-images/tit.gif) bottom repeat-x;
}

#left H2{
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size:18px;
  font-weight: 100;
  color: #08295A;
  padding-bottom: 5px;
  padding-left: 8px;
  padding-top: 12px;
  text-align: left;
  background: url(ftdgalaxy-images/tit.gif) bottom repeat-x;
}

#left{
float: left;
width: 681px;
background: url(ftdgalaxy-images/bg_left.jpg) left 25px repeat-x;
margin-left: 9px;
padding: 0px 0px 0px 0px;
}


.col_l {float:left;
    width:270px;
    margin-left:0px;
    margin-top:5px;
    }

.col_r {float: left;
    width:270px;
    margin-left:110px;
    margin-top:5px;
    }
    
#left ul {
padding-left: 0px;
list-style:none;}
#left li {
padding-left: 18px;
background: url(ftdgalaxy-images/fish_bot.gif) 4px 5px no-repeat;}

#footer{
  height: 53px;
  width: 100%;
  font-size: 12px;
  color: #FFFFFF;
  text-align: center;
  clear:both;
  padding: 16px 0px 0px 0px;
  background: #000000;
}

#footer a{
  color: #FFFFFF;
  font-size: 12px;
  text-decoration: none;
}

#footer a:hover{
  color: #FFFFFF;
  font-size: 12px;
  text-decoration: underline;
}

</style>


</head>
<body>

<div id="main_bg">
<div id="main">
<!-- header begins -->
<div id="header">
  <div id="logo"><a href="#">ftdgalaxy</a>
        <h2><a href="#">Small Company Slogan Goes Here</a></h2>
    </div>
    <div id="buttons">
        <ul>
          <li class="first"><a href="#"  title="">Home</a></li>
          <li><a href="#" title="">Blog</a></li>
          <li><a href="#" title="">Gallery</a></li>
          <li><a href="#" class="last_b" title="">About us</a></li>
          <li ><a href="#" title="" class="last_b">Contact us</a></li>
        </ul>
    </div>
</div>
<!-- header ends -->
    <!-- content begins -->
      <div id="content">
          <div id="right">
              <h1>Company News</h1>
                <div class="tit_bot">
                  <div class="right_b"><span class="dat">05-01-2010</span><br /><img src="ftdgalaxy-images/img2.jpg" class="img" width="82" height="63" alt="" /><span class="col_b">Duis eu dolor dolor, eu feugiat risus.</span><br />
                  Proin nunc mi, vestibulum vel tincidunt nec, auctor ut nulla.<br />
                  eget interdum nunc elit ut purus. Vestibulum... </div>
                    <div class="read"><a href="#"><img src="ftdgalaxy-images/b_read.gif" alt="" /></a></div><br />
                 </div>
                <div class="tit_bot">
                  <div class="right_b"><span class="dat">05-01-2010</span><br /><img src="ftdgalaxy-images/img3.jpg" class="img" width="82" height="63" alt="" /><span class="col_b">Duis eu dolor dolor, eu feugiat risus.</span><br />
                  Proin nunc mi, vestibulum vel tincidunt nec, auctor ut nulla.<br />
                  eget interdum nunc elit ut purus. Vestibulum... </div>
                    <div class="read"><a href="#"><img src="ftdgalaxy-images/b_read.gif" alt="" /></a></div><br />
                 </div>   
           </div>  
            <div id="left">
                    <h2>Quisque elementum auctor erat</h2>
                    <div class="text">
                      <img src="ftdgalaxy-images/img1.jpg" width="202" height="152" class="img" alt="" />
                        <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. </span><br />
                        Vivamus est quam, imperdiet quis blandit eget, bibendum eget elit. Sed nunc ligula, ornare quis varius ut, porttitor non eros. Morbi sed erat at ipsum fermentum accumsan in vel erat. Ut pharetra pulvinar enim eu vestibulum. Suspendisse at eros semper enim porttitor convallis nec vel dolor. Nulla facilisi. Sed quis nulla et felis eleifend tincidunt quis eget ligula. Maecenas facilisis enim et nibh pellentesque placerat. Maecenas vel leo eget mi convallis porttitor vitae at mauris. Proin mattis est eget felis commodo tincidunt. Quisque elementum auctor erat, id dapibus eros bibendum ac. Donec feugiat scelerisque lacus ac euismod. <br />
                        Maecenas dictum tempor elit ac cursus. Nunc rutrum orci id erat aliquam pharetra id et leo. Aenean vel tellus eu leo gravida dapibus. Praesent fermentum ligula vitae dui egestas non dignissim nisl feugiat. Mauris a diam magna, vitae... 
                      <div class="read"><a href="#"><img src="ftdgalaxy-images/b_read.gif" alt="" /></a></div>
                  </div>
                    <h2>Free Website Templates</h2>
                    <div class="text">
                      <div class="col_l">
                          <ul>
                              <li><a href="">Duis eu dolor dolor, eu feugiat risus. </a></li>
                                <li><a href="">In blandit varius lectus eget ullamcorper.  </a></li>
                                <li><a href="">Ut ut nulla sapien, ut aliquet odio. </a></li>
                                <li><a href="">Quisque ultrices scelerisque interdum.  </a></li>
                            </ul>
                        </div>
                        <div class="col_r">
                          <ul>
                              <li><a href="">Duis eu dolor dolor, eu feugiat risus. </a></li>
                                <li><a href="">In blandit varius lectus eget ullamcorper.  </a></li>
                                <li><a href="">Ut ut nulla sapien, ut aliquet odio. </a></li>
                                <li><a href="">Quisque ultrices scelerisque interdum.  </a></li>
                            </ul>  
                        </div>
                        <div style="clear: both"><img src="ftdgalaxy-images/spaser.gif" alt="" width="1" height="1" /></div>
                </div> <br />
                <div style="clear: both"><img src="ftdgalaxy-images/spaser.gif" alt="" width="1" height="1" /></div>
                </div><br />
    <!-- content ends -->
    <!-- footer begins -->
    <div id="footer">
  Copyright  2011. Designed by <a href="http://www.flashtemplatesdesign.com/" title="Free Flash Templates">Free Flash Templates</a><br />
    <a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a> | <a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional"><abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" title="This page validates as CSS"><abbr title="Cascading Style Sheets">CSS</abbr></a></div>
<!-- footer ends -->
</div>
</div>
</div>
</body>
</html>

   
    
    
    
  








Related examples in the same category

1.metamorph_fullmoon
2.metamorph_leaf
3.metamorph_island
4.metamorph_lake
5.metamorph_landscape
6.metamorph_orchid
7.metamorph_orchids
8.metamorph_naturalistic
9.metamorph_naturefield
10.metamorph_grass
11.metamorph_farm
12.metamorph_earth
13.metamorph_planet
14.metamorph_aftertherain
15.metamorph_bythelake
16.metamorph_bamboo
17.alaskan-lake
18.metamorph_valley
19.metamorph_vanillasky_lt
20.metamorph_mountain
21.metamorph_hills
22.metamorph_garden
23.bamboo
24.metamorph_dropsongrass
25.metamorph_shiningearth
26.metamorph_spring
27.metamorph_smallake
28.metamorph_japanesegarden
29.barnyard
30.dawntodark
31.design-garden
32.grass
33.grasse
34.grassy
35.freecss_natural
36.ftdgreenature
37.natural-blues
38.naturalbeauties
39.natural_blues
40.nature-theme
41.nature
42.naturescharm
43.Nature_Green
44.countryside
45.environment-brand
46.EcoMania
47.eco-design
48.ecologyportal
49.a_leaf
50.plantation
51.ocean
52.Oceanic
53.oceanlife
54.organic-beauty
55.organic-moss
56.OrganicFruits2
57.organicrhythm
58.snowcrystals
59.thewild
60.thewildwest
61.landscape
62.leaf
63.leafaroma