/* The design described in this style sheet is the intellectual property of Biyang Hansen. No part of it may be copied, sold, given away, and/or re-distributed in any way without prior written permission from the author.

The authors contact information can be found at: http://www.biyanghansen.net/portfolio/contact


Copyright (c) 2008 by Biyang Hansen. All rights reserved.

  */

html
    {
        font-family: "Arial";
        
        color: inherit;
    


    }
    


a
    {
        text-decoration: none;
        color: inherit;
    }
    




#page-cover
    {
        text-align: center; /* IE hack */
        padding: 25px;

    }
    
#page
    {
        background-color: #ffffff;
        border: 1px solid #000000;
        width: 800px;
        margin: auto;
        text-align: left;
        position: relative;

    }

#header
    {
        background-color: #000000;
        position: relative;

        height: 5em;

        
    }
    

#header h1
    {
        position: absolute;
        top:10px;
        left: 15px;
        
        color: #ffffff;
        padding-bottom: 25px;
        letter-spacing: 0.4em;
        font-size: 30px;
        line-height: 30px;

        
        
    }
#header h2
    {
        position: absolute;
        top:10px;
        right: 10px;
        
        color: #ffffff;
        letter-spacing: 0.4em;
        line-height: 20px;

        font-size: 20px;




    }
    
#header h3
    {
        position: absolute;
        bottom: 10px;
        right: 10px;
        
        color: #ffffff;
        letter-spacing: 0.4em;
        line-height: 10px;
        font-size: 10px;
        text-align: right; 



    }
#header a
    {
        text-decoration: none;
        color: #ffffff;
        padding-right: 5px;
        padding-left: 5px;
    }

#header a.h1link:hover
    {
        border-left: 30px solid #ff0000;

        color: #ffffff;
    }
    
#header a.h3link:hover
    {
        border-right: 10px solid #ffffff;
        color: #ffffff;
    }


#content
    {
        min-height: 400px;
        background-color: #ffffff;
        
    }

#content.blackbackground
    {
        background-color: #000000;
    }



#footer
    {
        color: #cccccc;
        text-align: center;
        padding: 10px;
        
    }
    
.expmenu
    {
        height: 50px;
        border-top: 1px solid #000000;
        background-color: #ffffff;
        position: relative;
        font-weight: bold;

        
    }
    
.expmenu:hover
    {
        height: 100px;
        background-color: #ff0000;
      /*  color: #ffffff;   */
      /*  cursor: pointer; */
    }
    
/*    
.expmenu:active
    {
        height:100px;
        background-color: #ffffff;
        color: #ff0000;
    }

*/


.expmenu h4
    {
        font-variant: small-caps;
        line-height: 20px;
        padding: 5px;
        margin-bottom: 10px;

    }



.expmenu ul
    {
        position: relative;
        left: 0px;
        top: 10px; 
        font-variant: small-caps;
        font-size: 15px;
        margin: 0px;
        padding: 0px;
  
 


    }

.expmenu li
    {   
        display: inline-block; /* IE7 zoom hack */

    }
.expmenu li
    {
        display: inline;
        margin: 0px;
        padding: 20px;  /* required for IE7 to display hover border */
        padding-left: 25px;
        padding-right: 25px;
        

    }


.expmenu a
    {
        text-decoration: none;
        color: #000000;

       
    }
    
.expmenu a:hover
    {
        border-bottom: 10px solid #000000;
    }



.end
    {
        height: 50px;
        border-bottom: 1px solid #000000;
        background-color: #000000;
        position: relative;
        clear: both;
    }

    
.contentheader
    {
        border-top: 1px solid #ffffff;
        background-color: #000000;
    }
    
.contentheader h2
    {
        font-variant: small-caps;
        margin-right: 500px;
        background-color: #ffffff;

        border-bottom: 2px solid #000000;
    }
.contentheader h3
    {
        font-variant: small-caps;
        margin-left: 50px;
        margin-right: 250px;
        background-color: #ffffff;   
        border-bottom: 2px solid #000000;
    }


.contentheader a
    {
        color: #000000;
    }
    
    
.contentheader a:hover
    {
        color: #ff0000;
        border-left: 1em solid #ff0000;
    }
    
.contentfield
    {
        position: relative;
        background-color: #ffffff;
        padding: 0px;
        
      
        
        
    }

.contentfield h2
    {
        border-bottom: 10px solid #000000;
        margin-bottom: 10px;
        width: 250px;
        
    
    }
.contentfield h3
    {
        font-variant: small-caps;
        letter-spacing: 0.4em;

        padding-bottom: 10px;

    
    }

    
.contentfield p
    {
        padding: 25px;
        padding-top: 10px;

        line-height: 25px;
        font-style: italic;
   

        
    }

.contentfield sub
    {
        color: #555555;
        padding-left: 10px;
        padding-right: 10px;
        font-variant: normal; 
    }

.textfield
    {
        padding: 25px;
        line-height: 25px;
        font-size: 15px;
        background-color: #ffffff;
        
    
    }
    
.textfield a
    {
        padding-left: 5px;
        margin-left: 15px;
        color: #0000ff;
        font-weight: bold;
    }
.textfield a:hover
    {
        margin-left: 0px;
        border-left: 15px solid #0000ff;
    }
    
p.narrow
    {
        width: 450px;
        text-align: justify;
        
    }
    
strong
    {
        font-weight: bold;
    }
    
dl
    {
        padding: 0px;
        padding-left: 50px;
        margin: 0px;
        margin-bottom: 50px;
    }
    
    
dt
    {
        font-weight: bold;
    }

dd
    {
        font-style: italic;
        padding-left: 20px;
        border-left: 10px solid #000000;
    }

.aboutbox
    {
        border: 2px solid #000000;
        width: 350px;
        margin: auto;
        text-align: center;
        
    }
    
.aboutbox h4
    {
        font-variant: small-caps;
        padding: 25px;
        font-size: 15px;
        text-align: center;
    }

.aboutbox p
    {
        font-size: 15px;
        font-style: normal;
    }


#contentfooter
    {
        color: #ffffff;
        background-color: #000000;
        position: absolute;
        bottom: 5px;
        font-variant: small-caps;
        font-weight: bold;
        letter-spacing: 0.4em;
        font-size: 10px;
        line-height: 10px;
        
        width: 100%;
    }
    
#contentfooter a
    {
        text-decoration: none;
        color: #ffffff;
        padding-right: 5px;
        padding-left: 5px;
        float: left;
    }    
#contentfooter a:hover
    {
        border-left: 1em solid #ffffff;
    }

#email
    {
        position: absolute;
        right: 5px;
    }
    
a#copyrightnotice
    {
       font-size: 10px; 
       color: #cccccc;
    }
    
a:hover#copyrightnotice
    {
    
       text-decoration: underline;
       color: #999999; 
    }
    
    
#menu-photo
    {
        background-image: url('../menu-images/menubg-photo.jpg');
       
        
    }
#menu-conceptart
    {
        background-image: url('../menu-images/menubg-conceptart.jpg');
       
        
    }
#menu-film
    {
        background-image: url('../menu-images/menubg-film.jpg');
       
        
    }
#menu-webdesign
    {
        background-image: url('../menu-images/menubg-webdesign.jpg');
       
        
    }
    
#sitemap 
    {
       
        
    }
    
#sitemap td
    {


    }
    
#sitemap h3
    {
        text-align: right;

    }


.nested
    {
        margin-left: 50px;
        font-size: 10px;
        
    }
.nested a
    {
        margin-left: 10px;
        padding: 0px;
        padding-left: 5px;

    }
    
.nested a:hover
    {
        margin-left: 0px;
        border-left: 1em solid #0000ff;
    }

#validation-icons p
    {
        padding: 0px;
        margin: 0px;
    }
    
#validation-icons a
    {
        border: none;
        padding: 0px;
        margin: 0px;
    }
#validation-icons img
    {
        padding: 10px;
    }

#authorimgbuffer
    {
        position: absolute;
        bottom: 0px;
        right: 0px;
        
        width: 1px;
        height: 1px;
        
        background-image: url('../about/images/biyanghansen.jpg');
        
    }

#authorimg
    {
        position: absolute;
        top: 15px;
        right: 15px;
        width: 200px;
        display: block;
        background-color: #ffffff;
        background-image: url('../about/images/biyanghansen_thumb.jpg');
        background-position: top left;
        background-repeat: no-repeat;
        color: #000000;

        font-size: 15px;
        line-height: 15px;
        

        padding: 0px;
        margin: 0px;
        padding-top: 155px;
        padding-bottom: 1px;

        

    }

#authorimg:hover
    {
    
    }

#authorimg:active
    {
        top: 0px;
        right: 0px;
        width: 800px;

        background-image: url('../about/images/biyanghansen.jpg');
        background-position: top left;
        background-repeat: no-repeat;
        color: #ffffff;
        
        padding-top: 610px;
    }

acronym
    {
        border-bottom: 1px dotted #000000;
    }
    
.hr
    {
        width: 100%;
        border-bottom: 1px solid #000000;
        padding: 0px;
        margin: auto;
    }

p.notice
    {
        font-size: 10px;
        color: #555555;
        font-style: normal;
        line-height: 15px;
        
    }

.notice strong
    {
        font-weight: bold;
    }
.notice em
    {
        font-style: italic;
    }
    
sup
    {
        vertical-align: top;
        font-size: 6px;
        font-style: normal;
        
    }
    
a.imglink
    {
        border: 0px;
        padding: 10px;
        margin: 0px;
    }
a.imglink:hover
    {
        border: 0px;
        padding: 10px;
        margin: 0px;
    }