﻿/*  
    Note: the underscore "_" before an item allows 
    it to be read only by ie6.  A period can be read 
    by both ie6 and ie7, so by sequencing an underscored
    item after a period, ie6 can be targeted as well 
    as ie7. 
*/

#body 
{
    position: relative;
    .position: absolute;      
    text-align: center;
    .left: 1em;
}

/* Begin page layout*/
    #header
    {
        position: relative;      
        top: 1.3em;
        .right: .25em; 
        *right: 0px;
    }
    
    #links
    {
        position: relative;
        top: 1em;   
        width: 859px;
        margin: 0 auto;
        background-image: url(http://www.diamondbrightholidaylights.com/images/middle1.jpg);
        background-repeat: repeat-y;   
    }

    .banner
    {
        /*just a place holder for ie*/
        position: relative;
        right: 1px;
        *right: 0px;
    }
    
    .bannerie8
    {
        /*And now I have to fix it for ie8*/
        position: relative;
        right: -1px;
        *right:0px;
    }
    

    #center
    {
        position: relative;
        top: 1em;
        .top: 0em;
        width: 859px;
        margin: 0 auto;
        min-height: 350px;
        .min-height: 350px;
        background-image: url(http://www.diamondbrightholidaylights.com/images/middle1.jpg);
        background-repeat: repeat-y;
    }

    #footer
    {
        position:relative;
        bottom: 4px;
        .bottom: 0px;
    }   

    #bottombanner
    {
        position: relative;
        color: Navy;
        font-family: Arial;
        text-decoration: none;
    }
/*End page layout*/

/*Begin text stuff*/
    .text
    {
        position: relative; 
        top: -6em; 
        .top: -5.7em;
        left: 6.49em; 
        .left: -.1em;
        color: Gray;
        font-family: Arial;
        font-size: 1.2em;
        text-align: justify;
        width: 600px;
    }
    
    .text1
    {
        color: Gray;
        font-family: Arial;
        font-size: 1.2em;
        text-align: justify;
    }
        
    .text2
    {
        position: relative;
        top: -6em;
        .top: -4.7em;
        left: 6.49em;
        .left: -8.1em;
        color: Gray;
        font-family: Arial;
        font-size: 1.2em;
        text-align: justify;
        width: 290px;
    }

    .text3
    {
        position: relative;
        top: -5.2em;
        .top: -3.5em;
        left: 6.49em;
        .left: -.1em;
        color: Gray;
        font-family: Arial;
        font-size: 1.2em;
        text-align: justify;
        width: 600px;
        .padding-bottom: 1em;
    }

    .text4
    {
        position: relative;
        top: -2.4em;
        .top: -1.8em;
        _top:-1.7em;
        left: 1.4em;
        .left: 3.5em;
        color: White;
        font-family: Arial;
        font-size: 1.2em;
        text-align: justify;
        width: 818px;
        border: none;
        text-decoration: none;
    }

    .text5
    {
        position: relative;
        top: -2.6em;
        .top: -2.6em;
        _top: -2.5em;
        right: -27em;
        .right: -26.5em;
        color: White;
        font-family: Arial;
        font-size: 1.5em;
        text-align: justify;
        width: 818px;
    }
/*End text stuff*/

/*Begin hover buttons*/    
    /*Begin General Hover Button*/
        .general
        {
        position: relative;
        top:-2.75em;
        .top:-3em;
        left:-18.7em;
        font-family: arial, helvetica, sans-serif;
        background: url(http://www.diamondbrightholidaylights.com/images/generalglow.jpg) no-repeat;
        white-space: nowrap;
        display: block;
        width: 200px;
        height: 40px;
        margin: 0;
        padding: 0;
        }

        .general a
        {
        display: block;
        color: #000000;
        font-size: 11px;
        width: 200px;
        height: 40px;
        display: block;
        float: left;
        color: black;
        text-decoration: none;
        }

        .general img
        {
        width: 200px;
        height: 40px;
        border: 0
        }

        * html a:hover
        {
        visibility:visible
        }

        .general a:hover img
        {
        visibility:hidden
        }

        .general span
        {
        position: absolute;
        left: 35px;
        top: 15px;
        margin: 0px;
        padding: 0px;
        cursor: pointer;
        }
    /*End General Hover Button*/
    
    /*Begin Image Hover Button*/
        .image
        {
        position: relative;
        top:-5.25em;
        .top:-5.5em;
        left:-7em;
        font-family: arial, helvetica, sans-serif;
        background: url(http://www.diamondbrightholidaylights.com/images/imageglow.jpg) no-repeat;
        white-space: nowrap;
        display: block;
        width: 139px;
        height: 40px;
        margin: 0;
        padding: 0;
        }

        .image a
        {
        display: block;
        color: #000000;
        font-size: 11px;
        width: 139px;
        height: 40px;
        display: block;
        float: left;
        color: black;
        text-decoration: none;
        }

        .image img
        {
        width: 139px;
        height: 40px;
        border: 0
        }

        * html a:hover
        {
        visibility:visible
        }

        .image a:hover img
        {
        visibility:hidden
        }

        .image span
        {
        position: absolute;
        left: 35px;
        top: 15px;
        margin: 0px;
        padding: 0px;
        cursor: pointer;
        }
    /*End Image Hover Button*/ 
    
    /*Begin Contact Hover Button*/
        .contact
        {
        position: relative;
        top:-7.75em;
        .top:-8em;
        left: 2.4em;
        font-family: arial, helvetica, sans-serif;
        background: url(http://www.diamondbrightholidaylights.com/images/contactglow.jpg) no-repeat;
        white-space: nowrap;
        display: block;
        width: 102px;
        height: 40px;
        margin: 0;
        padding: 0;
        }

        .contact a
        {
        display: block;
        color: #000000;
        font-size: 11px;
        width: 102px;
        height: 40px;
        display: block;
        float: left;
        color: black;
        text-decoration: none;
        }

        .contact img
        {
        width: 102px;
        height: 40px;
        border: 0
        }

        * html a:hover
        {
        visibility:visible
        }

        .contact a:hover img
        {
        visibility:hidden
        }

        .contact span
        {
        position: absolute;
        left: 35px;
        top: 15px;
        margin: 0px;
        padding: 0px;
        cursor: pointer;
        }
    /*End Contact Hover Button*/       
/*End hover buttons*/

/*Begin other stuff*/
     img, div 
     {
        background: url(http://www.diamondbrightholidaylights.com/pages/css/iepngfix.htc)
     }
  
    #imageholder
    {
      position: relative;
      width: 600px;
      height: 158px;
      top: -115px;
      left: -6px;
      margin-left: auto;
      margin-right: auto;
    }
    
    #image1
    {
        position:relative;
        width: 300px;
        height: 160px;
        border: none;
        float: right;
    }

    #imagetext
    {
        position: relative;
        color: Gray;
        font-family: Arial;
        font-size: 1.2em;
        text-align: justify;
        width: 290px;
        height: 158px;
        float: left;
    }

    #image
    {
        position:relative;
        bottom: 25em;
        .top: 28em;
        right: -9.3em;
        .right: -9.8em;
        _right: -9.2em;
        width: 300px;
        height: 158px;
        border: none;
        float: right;
    }
  
    .phone
    {
        position: relative;
        top:-10.22em;
        .top:-10.5em;
        left: 20em;
        .left: 20em;
        font-family: arial, helvetica, sans-serif;
        white-space: nowrap;
        display: block;
        width: 140px;
        height: 40px;
        margin: 0;
        padding: 0;
    }

    .dot
    {
        position: relative;
        bottom: 40.3em;
        width: 20px;
    }
    
    #a
    {
        position: relative;
        top: -4em;
        left: 7.5em;
        .left: -10.5em;
        width: 200px;
        height: 150px;
    }
    
    #b
    {
        position: relative;
        top: -13.4em;
        _top:-13.6em;
        left: 33em;
        .left: 9em;
        width: 200px;
        height: 150px;
    }
    
    #c
    {
        position: relative;
        top: -8em;
        left: 7.5em; 
        .left: -10.5em;       
        width: 200px;
        height: 150px;
    }
    
    #d
    {
        position: relative;
        top: -17.4em;
        left: 33em; 
        .left: 9em;       
        width: 200px;
        height: 150px;
    }
    
    #e
    {
        position: relative;
        top: -12em;
        left: 7.5em;
        .left: -10.5em;
        width: 200px;
        height: 150px;
    }
    
    #f
    {
        position: relative;
        top: -21.3em;
        left: 33em;
        .left: 9em;
        width: 200px;
        height: 150px;
    }
    
    /* Not in use right now
    #g
    {
        position: relative;
        top: -17.4em;
        left: 33em;
        width: 200px;
        height: 150px;
    }
    */
    
    #picposition
    {
        position: relative; 
        top: -1em; 
        left: -.5em;
    }

/*End other stuff*/