/**
     * main.css (Tobias Ouwejan, Oktober 2007)
     * This file contian the main styles definitions for the website of
     * Frans Ouwejan.
     *
     * colors:
     * dark gray: #838281
     * orange: #e77817
     */
    
    html, body {
        font-family:verdana;
        font-size:12px;
        padding:0;
        margin:0;
        background:#838281;
        text-align:center;
    }
    
    .page-layout {
        width:798px;
        height:532px;
        margin:12px auto 0 auto;
        overflow:hidden;
    }
    
    a {
        text-decoration:none;
        color:#000;
        cursor:pointer;
        cursor:hand;
    }
    
    .hide {
        display:none;
    }
    
    .gallery-menu-panel {
        margin:1px 0  3px 1px;
        
        width:797px;
    }
    .gallery-menu {
        color:#fff;
    }
    .carousel-component .carousel-list li.thumb {
        display:block;
        width:86px;
        height:86px;
        background:no-repeat center center;
        margin: 0 3px 3px 0;
        filter:alpha(opacity=60);
        -moz-opacity: 0.6;
        opacity: 0.6;
        cursor:pointer;
        cursor:hand;
    }
    .carousel-component .carousel-list li.thumb:hover{
        filter:alpha(opacity=100);
        -moz-opacity: 1.0;
        opacity: 1.0;
    }
    
    .menu {
        width:788px;
        height:20px;
        background: url(logo.jpg) center center no-repeat;
        background-color:#192021;
        /*
        z-index:15;
        position:absolute;*/
        text-align:left;
        font-size:11px;
        padding:3px 0 0 10px;
    }
    .menu ul {
        z-index:15;
        margin:0 0px 0 0 ;
        padding:0;
        padding-top:0px;
        color:#fff;
        width:100px;
        float:right;
        list-style:none;
    }
    .menu li {
        height:16px;
        padding:2px 5px;
        cursor:hand;cursor:pointer;
    }
    .menu ul ul {
        float:none;
        position:absolute;
    }
    .menu ul ul li {
        background-color:#e77817;
        margin:0;
        border-width:0;
        padding-left:10px;
    }
    .show-menu{
        /*position:absolute;*/
        background:url(arrow_down.png) left center no-repeat transparent;
        padding-left:15px;
        color:#fff;
        height:15px;
        behavior: url(styles/iepngfix.htc);
    }
    .stage {
        height:510px;
        width:798px;
    	background-color:#212223;
    }
    .stage .photo-panel {
        height:532px;
       
    }
    .stage .photo-panel .photo {
        width:798px;
        height:532px;
        background-color:#212223;
        text-align:center;
    }
    .footer {
        width:768px;
        height:20px;
        background-color:#101112;
        color:#fff;
        text-align:left;
        padding:5px 20px 0 10px;
        border-top:solid 1px #828282;
        margin:0 auto;
    }
    .footer .copyright {
        text-align:right;
    }
    .footer .model {
        font-weight:bold;
        margin-right:10px;
    }
    .footer .caption {
        font-style:italic;
    }
    .footer .info {
        cursor:pointer;
        cursor:hand;
        float:right;
    }
    .footer .photo-links-panel {
        margin:0;
        float:right;
        width:70px;
        font-size:11px;
    }
    .next,
    .previous {
        width:10px;
        height:14px;
        cursor:pointer;
        cursor:hand;
        display:-moz-inline-box;
        _margin-top:2px;
        behavior: url(styles/iepngfix.htc);
    }
    .previous {
        background:url(arrow_left.png) left bottom no-repeat transparent;
        margin-right:3px;
        float:left;
    }
    .next {
        background:url(arrow_right.png) left bottom no-repeat transparent;
        margin-left:5px;
        float:left;
        
    }
    .disabled {
        cursor:default;
        filter:alpha(opacity=0);
        -moz-opacity: 0.0;
        opacity: 0.0;
        
        float:left;
    }
    .gallery-menu-title,
    .photo-index {
        float:left;
    }
    .footer .photo-links-panel a.active {
        background-color:#fff;
        color:#e77817;
    }
    .info-panel {
        background-color:#fff;
        position:absolute;
        top:400px;
        margin-left:20px;
        color:#212223;
        width:200px;
        text-align:left;
        padding:8px;
        z-index:10;
        
        filter:alpha(opacity=60);
        -moz-opacity: 0.6;
        opacity: 0.6;
        
    }
    .info-panel .close-button {
        float:right;
        cursor:pointer;
        cursor:hand;
    }
    
    .content-panel {
        position:absolute;
        width:798px;
        height:485px;
        text-align:left;
        padding-top:30px;
    }
    
    /*
    Alpha PNG support for IE
    Self-removing expression trick from: http://dean.edwards.name/my/misbehaviors/
    OnAfterPrint doesn't seem worth the trouble; PNGs will look buggy after printing
    because IE has buggy PNG support.
    \*/
    * html img/**/ {
    filter:expression(
        this.napalmLoaded
        ? "" :
        (
         this.src.substr(this.src.length-4)==".png"
         ?
         (
         (!this.complete)
         ? "" :
         this.runtimeStyle.filter=
         ("progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+this.src+"')")+
         (this.onbeforeprint="this.runtimeStyle.filter='';this.src='"+this.src+"'").substr(0,0)+
         String(this.napalmLoaded=true).substr(0,0)+
         (this.src="templates/sa/media/transparent.gif").substr(0,0)
         )
         :
         this.runtimeStyle.filter=""
        )
    );
    }