RedLight : Red « Templates « HTML / CSS






RedLight

  

<html>
  <!--
      Title: RedLight
      Made By: KDJ
      Site: http://www.twitter.com/kdjgcm
   -->
  <head>
    <title>
      RedLight Template
    </title>
<style type='text/css'>
body
  {
    background-color:#a10000;
    background-image:url('images/img_01.gif');
    background-repeat:repeat-x;
    background-attachment:fixed;
    text-align:center;
    font-family:Arial;
  }

p    { color:#fff; }
a    { color:#dbdbdb; text-decoration:none; }
a:hover { text-decoration:underline; }
h2    { color:#dbdbdb; }

img    { border:1px SOLID #ededed; }
#container 
  {
    background-image:url('images/img_02.png');
    background-repeat:repeat-x;
    margin-left:auto;
    margin-right:auto;
    position: relative;
    width:900px;
    height:680px;
    padding:0px 0px 10px 0px;
  }
#header
  {
    background-image:url('images/img_04.png');
    text-align:center;
    width:900px;
    height:190px;
  }
#header h2
  {
    color:#fff;
    font-family:Impact, sans-serif;
    font-size:50px;
    padding:70px 0px 0px 20px;
    font-weight:lighter;
  }
#header p
  {
    color:#fff;
    margin-top:-20px;
  }
#sidebar
  {
    background-image:url('images/img_03.png');
    background-repeat:repeat-x;
    min-height:400px;
    background-color:#fbfbfb;
    padding:10px 0px 10px 5px;
    text-align:left;
    width:244px;
    border-right:1px SOLID #575757;
    height:auto;
    float:left;
    border-bottom:1px SOLID #575757;
  }
#sidebar h2 { color:#ed0c0c; }
#sidebar p { color:#a00; }
#sidebarmenu {font-size:0.75em; width:100%;}
#sidebarmenu ul {margin:0px; padding:0px;}
#sidebarmenu li {list-style: none;} 

ul.sidebar-menu li 
  {
    border-bottom: #fff solid;
    border-top: #fff solid;
    border-width: 1px;
  }

#sidebarmenu a 
  {
    color: #a4a4a4;
    cursor: pointer;
    display:block;
    height:22px;
    line-height: 22px;
    text-indent: 10px;
    text-decoration:none;
    width:100%;
  }
#sidebarmenu a:hover
  {
    text-decoration:underline;
    color:#fff;
  }

#sidebarmenu li:hover 
  {
    color:#fff;
    background: #ff0000;
    position: relative;
  }


#content
  {
    background-color:#a10000;
    padding:10px 0px 0px 5px;
    width:645px;
    text-align:left;
    height:auto;
    float:right;
  }
#topmenu ul
  {
    padding-left: 0;
    margin-left: 0;
    padding:10px 0px 0px 0px;
    color: #fff;
    width: 900px;
    height:10px;
    font-weight:lighter;
    font-family: arial, helvetica, sans-serif;
  }

#topmenu ul li 
  { 
    display: inline; 
  }

#topmenu ul li a
  {
    padding: 0.2em 1em;
    font-weight:600;
    font-size:18px;
    color: #fff;
    text-decoration: none;
    float: left;
  }

#topmenu ul li a:hover
  {
    text-decoration:underline;
  }
  
.text
  {
    border-bottom:1px SOLID #fff;
    height:auto;
    width:100%;
    padding:10px 0px 2px 0px;
  }


</style>


  </head>
  <body>
  
      <div id="container">

            <div id="topmenu">
                <ul>
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Page 2</a></li>
                    <li><a href="#">Page 3</a></li>
                    <li><a href="http://twitter.com/#!/kdjgcm/">Follow KDJ</a></li>
                </ul>
            </div>
            <div id="header">
                <h2>RedLight</h2>
                <p>Slogan Goes Here</p>
            </div>
            <div id="sidebar">
                
                <h2>Sidebar</h2>
                <div id="sidebarmenu">
                    <ul class="sidebar-menu">
                        <li><a href="#">Home</a></li>
                        <li><a href="http://www.twitter.com/kdjgcm">Follow KDJ</a></li>
                        <li><a href="#">Link 3</a></li>
                        <li><a href="#">Link 4</a></li>
                    </ul>
                </div>
                
            </div> 
            <div id="content">
                
                <div class="text">
                    <h2>Show Support</h2>
                    <p>To Show your supports you dont have to pay anything, You should know that this site is free for commercial use, well all I ask of you is if you are going to use this template as commercial use then please email at kirkster97@live.com saying that your going to use this template, and state your comments about the template, and if you please so add the url of the site your going to use this template on, And you can always follow me for more information on more templates <a href="http://twitter.com/#!/kdjgcm/">@kdjgcm</a>. Thank You</p>
                </div>
                
                <div class="text">
                    <h2>Lorem ipsum dolor</h2>
                    <p><a href='#'>Lorem</a> ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. <a href='#'>Phasellus porta</a>. Fusce suscipit varius mi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio.</p>
                </div>
                
                <div class="text">
                    <h2>Lorem ipsum dolor</h2>
                    <p><a href='#'>Lorem</a> ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. <a href='#'>Phasellus porta</a>. Fusce suscipit varius mi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio.</p>
                </div>
                
            </div>  

      </div>
      
  </body>
</html>

   
    
  








Related examples in the same category

1.metamorph_blackandred
2.metamorph_blackonred
3.metamorph_red
4.metamorph_redandblack_lt
5.metamorph_reddie
6.metamorph_redfirm
7.metamorph_redflowers_lt
8.metamorph_redinfinity
9.metamorph_redmadness
10.metamorph_redornament
11.metamorph_redstorm
12.All_The_Reds
13.freecss_lightred
14.simplyred
15.sleek-red
16.red haze
17.red-accent
18.red-round
19.redalert
20.redavenue
21.redBull
22.redbusiness
23.redcrazycss
24.reddy
25.Redfire2
26.redflex
27.redhaze
28.redhive
29.redish
30.redline
31.RedOneTemplate
32.redpassion
33.redpepper
34.redplanet
35.redroses
36.redsnow
37.RedSquareShadow
38.red_city
39.Red_Hot
40.Red_Hot_Brazil
41.red_music
42.Red_Splash
43.Red_Tube_Simple
44.Red 2