﻿/*-----------------------------------------

CLEAR BREEZE DESIGN WEBSITE
LAYOUT CONTROL
VERSION 1
ENQUIRIES@CLEARBREEZEDESIGN.COM

-----------------------------------------*/



body 
{
    margin: 0;
    background-color: #ffffff;
    background-image: url('../images/bodybg.jpg');
    background-position: top center;
    background-repeat: repeat-y;
    color: #666666
}

div.clearleft   
{
    clear: left;
}

div.clearboth   
{
    clear: both
}

h1  
{
    color: #666666;
    margin-bottom: 20px;
    padding: 0;
}

h2  
{
    color: #666666;
    margin-bottom: 10px;
    padding: 0;
}

img 
{
    border: 0
}

img.picleft 
{
    float: left;
    margin-right: 20px
}

img.picright    
{
    float: right;
    margin-left: 20px
}



/*---------------------------
TOP LEVEL NAVIGATION BAR 
---------------------------*/

div.nav
/* Sets the background image for the bar to act as a wrapper that extends the width of the browser */   
{
    background-image: url('../images/navbg.gif');
    background-position: top;
    background-repeat: repeat-x;
    min-height: 38px;
    background-color: #000000
}

    div.nav ul  
    {
        width: 980px;
        margin: auto;
        padding-top: 8px;
        padding-bottom: 10px;
        text-align: right;
        padding-left: 0;
    }
    
        div.nav ul li   
        {
            display: inline;
            padding-left: 15px;
            padding-right: 15px
        }
        
        div.nav ul li.selected  
        {
            border: 1px solid #838382
        }
        
            div.nav ul li a 
            {
                text-decoration: none;
                color: #e7e7e7
            }
            
            div.nav ul li a:hover   
            {
                color: #ffffff
            }


/*---------------------------
SECOND LEVEL NAVIGATION BAR 
---------------------------*/

ul.secondlevnav 
{
    background-color: #eeeeee;
    width: 980px;
    margin: auto;
    padding-left: 0;
    padding-right: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: right;
    border-bottom: 1px solid #d5d5d5;
    border-left: 1px solid transparent;
    background-image: url('../images/secondlevmenbg.gif');
    background-position: top;
    background-repeat: repeat-x;
}

    ul.secondlevnav li 
    {
        display: inline;
        padding-right: 15px;
        padding-left: 15px;
        border-right: 1px solid #cccccc
    }
    
    ul.secondlevnav li.last 
    {
        border-right: none
    }
    
    ul.secondlevnav li.subselected 
    {
        font-weight: bold
    }
    
        ul.secondlevnav li a    
        {
            color: #666666;
            text-decoration: none
        }
        
        ul.secondlevnav li a:hover  
        {
            color: #333333
        }



/*---------------------------
PAGE
---------------------------*/


div.wholepage   
{
    width: 980px;
    margin: auto;
}

    
    
    
   /*---------------------------
    TOP BANNER
    ---------------------------*/ 
    
    div.wholepage div.topbanner 
    {
        height: 130px;
        width: 980px;
        background-image: url('../images/topbanner.gif');
        background-position: top right;
        background-repeat: no-repeat;
        border-left: 1px solid transparent
    }
    
        div.wholepage div.topbanner div.login   
        {
            float: right;
            text-align: right;
            background-image: url('../images/loginbgtop.gif');
            background-position: top left;
            background-repeat: no-repeat;
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 10px;
            margin-top: 10px
        }
        
            div.wholepage div.topbanner div.login fieldset  
            {
                border: 0;
                background-image: url('../images/loginbgbottom.gif');
                background-position: bottom right;
                background-repeat: no-repeat;
                padding-left: 0;
                padding-right: 20px;
                padding-bottom: 15px;
                padding-top: 0
            }
            
                div.wholepage div.topbanner div.login fieldset p    
                {
                    margin-bottom: 0;
                    margin-top: 5px
                }
                
                div.wholepage div.topbanner div.login fieldset input    
                {
                    width: 130px;
                    border: 1px solid #cccccc
                }
                
                div.wholepage div.topbanner div.login fieldset input.button 
                {
                    width: 57px;
                    border: 0
                }
    
    
    
 
    /*---------------------------
    MAIN CONTENT  
    ---------------------------*/
 
    
    /* silverlight animation container */
    
    div.wholepage div.maincopy div#silverlightcontainer 
    {
        width: 350px;
        height: 350px;
        float: left;
        margin-right: 10px;
        margin-bottom: 10px;
        border: 1px solid #666666;
        background-image: url('../images/homepic.jpg');
        background-repeat: no-repeat
    }
    
    
    div.wholepage div.maincopy  
    {
        float: left;
        padding-left: 20px;
        padding-right: 20px;
        width: 940px;
        padding-top: 20px;
    }
    
        div.wholepage div.maincopy a    
        {
            color: #f58321
        }
        
        div.wholepage div.maincopy a:hover  
        {
            color: #72abe5
        }
    
        div.wholepage div.maincopy h2   
        {
            
        }
        
        div.wholepage div.maincopy p.intro  
        {
            margin-top: 30px;
            color: #435974
        }
        
        div.wholepage div.maincopy p.introquery  
        {
            background-image: url('../images/tdbg.gif');
            background-position: top;
            background-repeat: repeat-x;
            background-color: #ededed;
            border: 1px solid #e6e6e6;
            padding-top: 5px;
            padding-left: 10px;
            padding-right: 10px;
            padding-bottom: 5px;
        }
        
        /* button style link */
      
        div.wholepage div.maincopy a.button  
        {
            background-image: url('../images/button_reminderbg.jpg');
            background-position: top;
            background-repeat: repeat-x;
            border-top: 1px solid #f79e51;
            border-left: 1px solid #f79e51;
            border-right: 1px solid #f79e51;
            border-bottom: 1px solid #e67d22;
            background-color: #f79e51;
            padding-top: 4px;
            padding-bottom: 3px;
            color: #ffffff;
            padding-left: 10px;
            padding-right: 10px;
            text-decoration: none;
        }
        
    
    /* table */
    
    div.wholepage div.maincopy table    
    {
        background-image: url('../images/tdbg.gif');
        background-position: top;
        background-repeat: repeat-x;
        background-color: #ededed;
        border: 1px solid #e6e6e6
    }
    
        div.wholepage div.maincopy table td 
        {
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 5px;
            padding-bottom: 5px;
            border-bottom: 1px solid #ffffff
            /*background-color: #ededed;;
            border-top: 1px solid #e6e6e6;
            border-bottom: 1px solid #ffffff;
            background-image: url('../images/tdbg.gif');
            background-position: top;
            background-repeat: repeat-x*/
        }
        
        div.wholepage div.maincopy table tr.tableheader 
        {
            
        }
        
            div.wholepage div.maincopy table tr.tableheader td   
            {
                background-color: #666666;
                color: #ffffff;
                background-image: url('../images/tableheadbg.gif');
                background-position: top;
                background-repeat: repeat-x;
            }
        
        
     
     /* table used for introducing query */
     
     div.wholepage div.maincopy table.tableintroquery td    
     {
         border-bottom: 0
     }
     
     
     /* report */
     
     div.wholepage div.maincopy div.report  
     {
         width: 450px;
         margin-top: 20px;
     }
     
        div.wholepage div.maincopy div.projects  
        {
            float: left;
        }
        
        div.wholepage div.maincopy div.projecttype  
        {
            float: right;
        }
        
        div.wholepage div.maincopy div.report table 
        {
            background-color: #ffffff;
            background-image: none;
            border: 0;
            width: 100%;
            margin-top: 10px;
            color: #333333
        }
        
            div.wholepage div.maincopy div.report table tr.tableheader  
            {
                vertical-align: top
            }
            
                div.wholepage div.maincopy div.report table tr.tableheader td   
                {
                    background-color: #666666;
                    color: #ffffff;
                    background-image: url('../images/tableheadbg.gif');
                    background-position: top;
                    background-repeat: repeat-x;
                }
            
            div.wholepage div.maincopy div.report table tr.total 
            {
                font-weight: bold
            }
            
                div.wholepage div.maincopy div.report table tr.total td 
                {
                    border-bottom: 1px solid #999999;
                    border-top: 1px solid #cccccc;
                }
            
            div.wholepage div.maincopy div.report table td  
            {
                text-align: right;
                vertical-align: top;
                border-bottom: 1px solid #cccccc;
                background-image: url('../images/tablecellbg.gif');
                background-position: bottom;
                background-repeat: repeat-x;
                padding-left: 5px;
                padding-right: 5px
            }
            
            div.wholepage div.maincopy div.report table td.title  
            {
                text-align: left
            }
     
     
        /*  customer report */
         
        div.wholepage div.maincopy div.customerrep
        {
            width: 438px;
            float: left
        }
        
            div.wholepage div.maincopy div.customerrep table 
            {
                background-color: #ffffff;
                background-image: none;
                border: 0;
                margin-top: 10px;
                color: #333333;
                width: 400px
            }
            
                div.wholepage div.maincopy div.customerrep table tr.tableheader  
                {
                    vertical-align: top
                }
                
                    div.wholepage div.maincopy div.customerrep table tr.tableheader td   
                    {
                        background-color: #666666;
                        color: #ffffff;
                        background-image: url('../images/tableheadbg.gif');
                        background-position: top;
                        background-repeat: repeat-x;
                    }    
            
                    div.wholepage div.maincopy div.customerrep table td  
                    {
                        vertical-align: top;
                        border-bottom: 1px solid #cccccc;
                        background-image: url('../images/tablecellbg.gif');
                        background-position: bottom;
                        background-repeat: repeat-x;
                        padding-left: 5px;
                        padding-right: 5px;
                    }
                    
                    div.wholepage div.maincopy div.customerrep table td.title  
                    {
                        text-align: left
                    }
        
        div.wholepage div.maincopy div.customergraph
        {
            width: 500px;
            float: left;
            margin-top: 10px;
        }
     
     
     
     /*div.wholepage div.maincopy table.report    
     {
         
     } 
     
        div.wholepage div.maincopy table.report td  
        {
            background-color: #ffffff;
            background-image: none;
            padding: 0;
            border: 0
        } */ 
    
    
    
    
    
    
    
    
    
    
    
    
    
    /*---------------------------
    PASSWORD REMINDER TABLE/REGISTRATION FORM  
    ---------------------------*/
    
    table.form  
    {
        background-image: url('../images/table_reminderbg.jpg');
        background-repeat: repeat-y;
        color: #000000;
        border-collapse: collapse;
        margin-bottom: 40px;
    }
    
        table.form td
        {
            padding-right: 20px;
            padding-left: 10px;
            padding-bottom: 5px;
            padding-top: 7px;
            border-bottom: 1px solid #ffffff
        }
        
        input[type=submit]  
        {
            background-image: url('../images/button_reminderbg.jpg');
            background-position: top;
            background-repeat: repeat-x;
            border: 1px solid #ffffff;
            background-color: #f79e51;
            padding-top: 8px;
            padding-bottom: 5px;
            color: #ffffff;
        }
    
    
    
    
    
    /*---------------------------
    FOOTER  
    ---------------------------*/ 
    
    
    div.wholepage div.footer 
    {
        clear: both;
        padding-top: 60px;
        padding-left: 20px;
        padding-right: 20px
    }
    
        div.wholepage div.footer p  
        {
            margin-top: 10px
        }
        
   
