﻿/*------------------------------------------------------------------------------------
BASIC ELEMENTS
------------------------------------------------------------------------------------*/

html, body {
    padding: 20px 0 0 0;
    margin: 0;
}

p, h1, h4, a, span.copyright{
    color: #000000;
    font-family: Arial, Verdana, Trebuchet MS, Sans-Serif;
    font-size: 12px;
    padding: 0;
    margin: 0;
    text-decoration: none;
}

span.copyright{
    font-size: 10px
}

h1{
    font-size: 15px;
}

h4{
    font-size: 15px;
    color: #d51b1c;
}

div#wrapper{
    width: 850px;
    margin-left: auto;
    margin-right: auto;
    border: solid 0 #FF0000;
}

div.paging_wrap{
    padding: 2px 3px;
    margin-right: 2px;
    background: #cccccc
}

div.paging_wrap:hover{
    color: #FFFFFF;
    background: #000000
}

/*------------------------------------------------------------------------------------
HEADER ELEMENTS
------------------------------------------------------------------------------------*/

div#header{
    width: 850px;
    height: 68px;
    margin-left: auto;
    margin-right: auto;
    border: solid 0 #FF0000;
}

    div#logo{
        position: relative;
        top: 0;
        left: 0;
        width: 291px;
        height: 38px;
    }
    
    div#energy_nav{
        position: relative;
        top: 10px;
        left: 0;
        width: 291px;
        height: 20px;
    }
    
    div#header div#energy_nav a{
        font-size: 14px;
    }
    
    div#header div#energy_nav a:hover, div#header div#energy_nav a.selected{
        font-size: 14px;
        color: #d51b1c;
    }
    
    div#nav{
        position: relative;
        top: -58px;
        left: 350px;
        width: 502px;
        height: 68px;
    }
    
        div#box{
            position: absolute;
            top: 16px;
            left: -1px;
            width: 501px;
            height: 10px;
            border: solid 1px #000000;
        }  
        
        
        /*---------- nav news link -----------*/
    
        div#news_link_box, div#news_link_box_selected{
            position: absolute;
            top: 0px;
            left: 0px;
            width: 36px;
            height: 17px;
            border-width: 0 0 10px 0;
            border-color: #FFFFFF;
            border-style: solid;
        }
        
        div#news_link_box p, div#news_link_box_selected p{
            font-weight: bold
        }
        
        div#news_link_box:hover, div#news_link_box_selected{
            color: #d61b1b;
            border-width: 0 0 10px 0;
            border-color: #000000;
            border-style: solid;
        }
        
        div#news_link_box:hover p, div#news_link_box_selected p{
            color: #d61b1b;
        }
        
        /*---------- nav profile link background: #cccccc; -----------*/
    
        div#profile_link_box, div#profile_link_box_selected{
            position: absolute;
            top: 0px;
            left: 81px;
            width: 48px;
            height: 17px;
            border-width: 0 0 10px 0;
            border-color: #FFFFFF;
            border-style: solid;
        }
        
        div#profile_link_box p, div#profile_link_box_selected p{
            font-weight: bold
        }
        
        div#profile_link_box:hover, div#profile_link_box_selected{
            color: #d61b1b;
            border-width: 0 0 10px 0;
            border-color: #000000;
            border-style: solid;
        }
        
        div#profile_link_box:hover p, div#profile_link_box_selected p{
            color: #d61b1b;
        }
        
        /*---------- nav projects link background: #cccccc; -----------*/
    
        div#projects_link_box, div#projects_link_box_selected{
            position: absolute;
            top: 0px;
            left: 175px;
            width: 62px;
            height: 17px;
            border-width: 0 0 10px 0;
            border-color: #FFFFFF;
            border-style: solid;
        }
        
        div#projects_link_box p, div#projects_link_box_selected p{
            font-weight: bold
        }
        
        div#projects_link_box:hover, div#projects_link_box_selected{
            color: #d61b1b;
            border-width: 0 0 10px 0;
            border-color: #000000;
            border-style: solid;
        }
        
        div#projects_link_box:hover p, div#projects_link_box_selected p{
            color: #d61b1b;
        }
        
        
        /*---------- nav contact link background: #cccccc; -----------*/
    
        div#contact_link_box, div#contact_link_box_selected{
            position: absolute;
            top: 0px;
            left: 283px;
            width: 55px;
            height: 17px;
            border-width: 0 0 10px 0;
            border-color: #FFFFFF;
            border-style: solid;
        }
        
        div#contact_link_box p, div#contact_link_box_selected p{
            font-weight: bold
        }
        
        div#contact_link_box:hover, div#contact_link_box_selected{
            color: #d61b1b;
            border-width: 0 0 10px 0;
            border-color: #000000;
            border-style: solid;
        }
        
        div#contact_link_box:hover p, div#contact_link_box_selected p{
            color: #d61b1b;
        }
        
        /*---------- nav media link background: #cccccc; -----------*/
    
        div#media_link_box, div#media_link_box_selected{
            position: absolute;
            top: 0px;
            left: 384px;
            width: 36px;
            height: 17px;
            border-width: 0 0 10px 0;
            border-color: #FFFFFF;
            border-style: solid;
        }
        
        div#media_link_box p, div#media_link_box_selected p{
            font-weight: bold
        }
        
        div#media_link_box:hover, div#media_link_box_selected{
            color: #d61b1b;
            border-width: 0 0 10px 0;
            border-color: #000000;
            border-style: solid;
        }
        
        div#media_link_box:hover p, div#media_link_box_selected p{
            color: #d61b1b;
        }
        
        /*---------- nav home link background: #cccccc; -----------*/
    
        div#home_link_box, div#home_link_box_selected{
            position: absolute;
            top: 0px;
            left: 467px;
            width: 34px;
            height: 17px;
            border-width: 0 0 10px 0;
            border-color: #FFFFFF;
            border-style: solid;
        }
        
        div#home_link_box p, div#home_link_box_selected p{
            font-weight: bold
        }
        
        div#home_link_box:hover, div#home_link_box_selected{
            color: #d61b1b;
            border-width: 0 0 10px 0;
            border-color: #000000;
            border-style: solid;
        }
        
        div#home_link_box:hover p, div#home_link_box_selected p{
            color: #d61b1b;
        }
        
        
        
/*------------------------------------------------------------------------------------
CONTENT ELEMENTS
------------------------------------------------------------------------------------*/

div#content_left{
    width: 291px;
    height: 570px;
}

    div.post, div.post_selected{
        position: relative;
        left: -22px;
        margin-top: 10px;
        width: 293px;
        height: 45px;
        border-width: 0px 0px 0px 20px;
        border-color: #FFFFFF;
        border-style: solid
    }
    
    div.post:hover, div.post_selected{
        border-width: 0px 0px 0px 20px;
        border-color: #000000;
        border-style: solid;
        background: url("../Gfx/hoverbg.jpg") repeat-x
    }
    
        div.post img, div.post_selected img{
            margin-left: 2px;
            float: left
        }
        
        div.post span, div.post_selected span{
            margin-right: 7px;
            width: 200px;
            margin-left: 5px;
            float: right;
            font-size: 11px;
        }
        
        div.post span b, div.post_selected span b{
            font-size: 12px;
        }
        
  
  div.post2, div.post2_selected{
        position: relative;
        left: -22px;
        margin-top: 10px;
        width: 293px;
        height: 45px;
        border-width: 0px 0px 0px 20px;
        border-color: #FFFFFF;
        border-style: solid
    }
    
    div.post2:hover, div.post2_selected{
        border-width: 0px 0px 0px 20px;
        border-color: #000000;
        border-style: solid;
        background: url("../Gfx/hoverbg.jpg") repeat-x
    }
        
        div.post2 span, div.post2_selected span{
            float: left;
            margin-right: 7px;
            margin-left: 5px;
            width: 300px;
            font-size: 11px;
        }
        
        div.post2 span b, div.post2_selected span b{
            font-size: 12px;
        }
        
        div#paging{
            width: 291px;
        height: 20px;
        }
        
        div#paging div.paging, div#paging div.paging_s{
            float: left;
            width: 8px;
            padding: 2px 5px;
            background-color: #000000;
            margin-right: 1px
        }
        
            div#paging div.paging p, div#paging div.paging_s p{
                color: #FFFFFF
            }
        
        div#paging div.paging:hover, div#paging div.paging_s:hover{
            background-color: #d51b1c;
        }
   
    
    div#content_left ul{
        margin: 0;
        padding: 0;
    }
    
        div#content_left ul li{
            display: inline;
            margin-right: 1px;
        }
        
            div#content_left ul li a, div#content_left ul li a:visited, div#content_left ul li a.selected{
                background-color: #000000;
                color: #FFFFFF;
                font-family: Arial, Verdana, Trebuchet MS, Sans-Serif;
                font-size: 11px;
                padding: 2px 5px;
            }
            
            div#content_left ul li a:hover, div#content_left ul li a.selected{
                background-color: #d51b1c;
            }
    
    

div#content_right{
    width: 500px;
}
    
    div#media_fp{
        width: 100%;
        height: 281px;
        border: solid 1px #000000
    }
    
    div#media{
        width: 100%;
        height: 281px;
        border-width: 1px 1px 0 1px;
        border-color: #000000;
        border-style: solid
    }
    
    div#media_nav{
        width: 100%;
        height: 20px;
        border-width: 0 1px 1px 1px;
        border-color: #000000;
        border-style: solid
    }
    
    div#text{
        margin-top: 10px;
        width: 100%;
        height: 300px;
        overflow: auto;
        border: solid 1px #000000
    }
    
    div#text a:hover{
        text-decoration: underline;
        color: #d51b1c;
    }
    
    div#text h4, div#text p{
        margin: 10px;
    }
    
    div#media_nav ul{
        position: relative;
        top: 2px;
        left: 10px;
        padding: 0px;
        margin: 0px;
    }
    
        div#media_nav ul li{
            display: inline;
        }
        
            div#media_nav ul li a{
                padding: 1px 3px;
            }
            
            div#media_nav ul li a:hover{
                color: #d61b1b
            }
    
    
/*------------------------------------------------------------------------------------
FOOTER ELEMENTS
------------------------------------------------------------------------------------*/

div#footer{
    width: 850px;
    padding-top: 2px
}
    
    div#contact{
        position: relative;
        top: -15px;
        left: 0px;
        width: 291px;
        height: 15px;
    }
    
        div#contact a{
            float: left;
        } 
        
        div#contact p{
            float: right;
        }     
    
    div#copyright{
        position: relative;
        top: -15px;
        left: 352px;
        width: 500px;
        height: 15px;
    }
    
        div#copyright p, div#copyright a{
            font-size: 10px;
            float: right;
        } 

    
    



        
        
        
        
        
    
    
       



