/* ################################ für karlbrandstetter.at homepage 
  
    ##############################################
    ##      allgemeine Einstellungen            ##
    ##    für alle mobile & PC                  ##
    ##############################################
*/
body {
    background-color: rgb( 34, 34, 34);    
}
/* info wird benötigt zum debuggen */
#info {
    display:none; /* hier einschalten block / none */
    position: absolute; top: 110px; left: 390px; padding:10px; 
    background-color: rgba(245, 245, 220, 0.2); 
    font-size: 10pt; line-height: 14pt;
    font-family: "Comic Sans MS", Georgia, Times ;
    text-decoration: none; color: rgb(222,120,0);
    }
/* folgende wird nur die Reihenfolge definiert */
#SideBar { z-index:920; }
#SideBarBanner { z-index:921; }
#accordion { z-index:930; }
#overlay { z-index:7; }
#FotoBereich { z-index:5; }
#info { z-index:999; }
/* -- */ 
.mail { 
    position: absolute; 
    top: 5px; left: 10px; height: 30px; width: 80px;  
    border: px solid red;
    background-repeat: no-repeat;
    background-position: 50px 0px;
    font-size: 12pt; line-height: 16pt;
    font-family: "Comic Sans MS", Georgia, Times ;
    text-decoration: none; color: rgb(222,120,0);
    }
.mail { background-image: url("othermail.gif"); }
.Mac .mail { background-image: url("applemail.gif"); }
.Windows .mail { background-image: url("outlook.gif"); }
.Linux .mail { background-image: url("thunderbird.gif"); }

#noscript {
    position: absolute; top: 60px; left: 10%; color: gold;
    }
#overlay {
    display: none;
    background: rgba( 34, 34, 34,0);    
    font-family: "Comic Sans MS", Georgia, Times ;
    font-size: 16pt; line-height: 20pt;
    text-align:center;
    text-decoration: none; 
    color: yellow;
    text-shadow:  2px 3px 4px black;
}
#content_effect
{
    display:block; position:fixed; overflow:hidden;
    left:0; top:0; height:100%; width:100%;
    background: transparent url(overlay2.png) repeat;
}

#SideBarBanner { 
    font-size: 10pt; 
    line-height: 14pt;
    font-family: "Comic Sans MS", Georgia, Times ;
    text-decoration: none; color: rgb(222,120,0);
}

/* hier wird das acordion menu definiert*/
#accordion {
    font-family: "Comic Sans MS", Georgia, Times ;
    list-style: none;
}
#accordion div {
    font-size:12pt; line-height:16pt; 
    color: orange;
    padding: 5px 0px 5px 20px;
}
#accordion ul {
    list-style: none;
    padding: 0px 0px 3px 40px;
}
#accordion a {
    text-decoration: none;
    font-size:10pt; line-height:10pt; 
    color: gold;
}
/* ----------------- */

    
    
.mobil #fb_style { display:none; }
.mobil #dldiv { display:none; }
.mobil #SideBarBanner { display:none; }
.mobil #content_effect { display:none; }
.mobil #SideBar {
    position: absolute; 
    top: 35px; width: auto; left: 0px; 
    background-color: rgb(34,34,34); 
    color: rgb(255,215,0);
    border: 0px solid rgb(255,204,102); 
     }
.mobil #info {
    display:none; /* hier einschalten block / none */
    position: absolute; top: 250px; left: 10px; padding:10px; 
    color: rgb(200, 200, 200); background-color: rgba(245, 245, 220, 0.2); 
    }
.mobil body {
    max-width: 480px ;
    max-height: 480px ;
    min-width: 400px;
}
/* ----------------- */
.mobil #accordion a {
    text-decoration: none;
 /*   font-size:12pt; line-height:18pt;  */
    font-size: 160%;
    line-height:130%;
    color: gold;
}
.mobil #accordion div {
    top: 65px;
    font-size: 160%;
}
.mobil #accordion ul li {
    font-weight: normal;
    padding: 22px 0px 22px 0px;
}




/* button zur auswahl von flash bzw. noflash simpleviewer */
.PC #fb_style { 
    display:none; /* hier einschalten block / none */
    position: absolute; 
    top: 2px; left: 200px; 
    height: 30px; width: 120px; 
    background-color: rgba(64,64,64,0.6);
    border:1px solid rgb(92,64,34); border-radius: 15px;
    }
.Explorer #fb_style { 
    border:0px; 
    }
.PC #fb_style .text { 
    position:relative; top: 3px; left: 40px;
    font-size:12pt; line-height:16pt; color: rgb(222,120,0); 
    }

/* button zum download aller fotos  */
.PC #dldiv { 
    display:none;
    position: absolute; 
    top: 2px; left: 340px; 
    height: 30px; width: 120px; 
    background-color: rgba(64,64,64,0.6);
    border:1px solid rgb(92,64,34); border-radius: 15px;
    }
.Explorer #dldiv { 
    border:0px; 
    }

.PC #dl { 
    position:relative; top: 3px; left:15px;
    font-size:12pt; line-height:16pt; color: rgb(222,120,0);	
    }
/* ----------------- */

/* übergeordnetes div, dass auch das hintergund bild beinhaltet*/
.PC #content {
    position: absolute; 
    top: 0%; left: 0%; height: 100%; width: 100%; */ 
    background-attachment:fixed;
    background-image: url(""); 
    background-repeat: no-repeat;
    background-position: center center; 
/*    top: 5%; left: 5%; height: 90%; width: 90%; */
/*    border: 1px solid cyan;            /*      nur zum einrichten      */
    }
.PC #content.hoch { background-size: auto 100%; }
.PC #content.quer { background-size: 100% auto; }
/* ----------------------- */ 

/*
    ##############################################
    ##   für alle  Browser im fixed mode        ##
    ##  SideBar wird links fix dargestellt      ##
    ##############################################
*/

/* hier alles zur SideBar */
.fixed #SideBar {
    position: absolute; 
    top: 40px; bottom: 40px; width: 280px; left: -20px; 
    background: rgb(34,34,34);               /* Fallback for web browsers that doesn't support RGBa */
    background: rgba(34,34,34,0.6);         /* RGBa with 0.6 opacity */
    filter: alpha(opacity = 80);
    color: rgb(255,215,0);
    }
.fixed #SideBarBanner {
    display:none; 
}
/* ----------------------- */ 

/* hier werden die simple viewer eingebedded */
.fixed #FotoBereich {
    position: absolute; 
    top: 40px; bottom: 40px; left: 270px; right: 0px;
    background:transparent;
    overflow-y: hidden;
    overflow-x: hidden;
/*    border: 1px solid red;                /*      nur zum einrichten      */
   }
/* ----------------------- */ 

/* hier wird das acordion menu definiert*/
.fixed #accordion {
    width: 250px; height-min: 80%; 
    border: 0px solid red;    
}
.fixed #accordion div {
    display: block;
    cursor: pointer;
}
.fixed #accordion ul li {
    font-weight: normal;
    padding: 3px 0px 3px 0px;
}
/* ----------------------- */ 

/* zeigt kurz eine welcome seite*/
.fixed #overlay {
    position: absolute; 
    top: 30%; left: 30%; height: 50%; width: 50%; 
   }
/* ----------------------- */ 


/*
    ##############################################
    ##   für alle  Browser                      ##
    ##  SideBar wird von links eingeblendet     ##
    ##############################################
*/
/* hier alles zur SideBar */
.slide #SideBar {
    position: absolute; 
    top: 45px; bottom: 45px; width: 350px; left: -320px; 
    background: rgba(34,34,34,0.6); 
    color: rgb(255,215,0);
    border: 2px solid rgb(255,204,102); 
    -moz-box-shadow: 0px 4px 3px rgba(34,34,34,0.8);
    -webkit-box-shadow: 0px 4px 3px rgba(34,34,34,0.8);
    }
.slide .Explorer #SideBar {
    background: rgba(34,34,34,0.6); 
}
.slide #SideBarBanner {
    position: absolute; top: 40px; right: -5px; font-size:12pt; 
    -webkit-transform: rotate(90deg);
    -sand-transform: rotate(90deg);    
    -moz-transform: rotate(90deg);    
}
.slide .roundcorner {
    border-radius: 15px;
    -moz-border-radius:15px;
    -webkit-border-radius: 15px;
}
/* ----------------------- */ 

/* hier werden die simple viewer eingebedded */
.slide #FotoBereich {
    position: absolute; 
    top: 40px; bottom: 40px; left: 40px; right: 40px;
    background:transparent;
    overflow-y: hidden;
    overflow-x: hidden;
/*    border: 1px solid green;                /*      nur zum einrichten      */
   }
/* ----------------------- */ 

/* hier wird das acordion menu definiert*/
.slide #accordion {
    width: 300px; min-height: 80%; 
/*    border: 1px solid red;                  /*      nur zum einrichten      */
}
.slide #accordion div {
    display: block;
    cursor: pointer;
}
.slide #accordion ul{
    display: none;
}
.slide #accordion ul li {
    font-weight: normal;
    padding: 3px 0px 3px 7px;
}
.slide #accordion a:hover {
    text-decoration: underline;
}
/* ----------------------- */ 

/* zeigt kurz eine welcome seite*/
.slide #overlay {
    position: absolute; 
    top: 30%; left: 20%; height: 50%; width: 50%; 
 /* ----------------------- */