/* 
//    Created on : 31.01.2021, 
//    Author     : H.-Christoph Hentze
// */

a { text-decoration:none;}

div#spalte12,div#spalte11,div#spalte10,div#spalte9,
div#spalte8,div#spalte7,div#spalte6, div#spalte5,
 div#spalte4,div#spalte3, div#spalte2, div#spalte1
 {
    display:block;
    float:left;
    top: 0em;
     padding-bottom:0px;
     font-size: 11pt;
 }
 
div.bgjoint {  background: url(../images/jointlynks.gif) 3px center no-repeat;}

div#spalte0 {   /* flex-container um die spalten */
    display:flex;
    flex-direction:row;
  /*  flex-wrap: wrap;   */
     width:900px; 
     position:relative;
}
div.spalte0 {     /* flex-container um die spalten */
    background-color:#76A8FF;    
}

div.spalte { /* class für die Spalten */
    display:flex;
    flex-direction:column;
    background-color: #76A8FF ; 
}
   
div#zeile0{ /* flex-container um die Zeilen */
     display:flex;
     flex-direction:column;  /* entweder column ohne wrap */
     flex-wrap: wrap;   /* oder row mit wrap -> liefern das gleiche Ergebnis */
       /* im Letzteren Fall können die Inhalts-Container in einer csv-Datei gespeichert werden.
       Nach 6-Linkboxen erfolgt der Umbruch!! Siehe fertiges Layout  */
     width:900px;
      position:relative;
 }
 div.zeile{
    display:flex;
    flex-direction:row;
     flex-wrap: wrap; 
    padding-bottom: 3px;
    margin-top:-2px;
     position:relative;
 }
 /* Die Hintergrundfarbe der Kopfzeilen entspricht der Farbe der gewählten Reiter */
 div.colorkat0{ background-color:  #0000FF; /* blauton */ }
div.colorkat1{background-color:  #8100FF; /* blauton */ }
div.colorkat2{ background-color: #FD00FF; }
div.colorkat3{ background-color: #FF0081; }
div.colorkat4{ background-color:  #FF0000; }
div.colorkat5{ background-color:  #FF7D00; }
div.colorkat6{ background-color:  #FFD700; }
div.colorkat7{ background-color:  #81FF00; }
div.colorkat8{ background-color:  #00FF77; }
div.colorkat9{ background-color:  #00FFBF; }

div.liboxradius{
    border-radius: 7px;
    margin-bottom: 1px ;
 }
 
 div.linkboxumzu,
div.linkboxumzu_zeile{
    display:block;
    float:left;
    position:relative;
    top:2px;
    width:150px;
    min-height: 43px;   
 }
 div.umzudbl {
    padding-bottom:0.2em;   
 }
 div.linkboxumzu span.kinfo{
     display: inline-block;
     background-color: #FFDE20;
     padding-top: 0.1em;
     padding-left:0.1em;
     padding-right:0.1em;
     font-size: 0.8em;
     margin-top:3px;
     margin-left:6px;
     margin-right:6px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom: 1px solid transparent;
}

#linkboxumzu10,
#linkboxumzu11{ }

.dblclickaccord,
.oneclickaccord{
    /* leer, wird aber für js Funktionalität benötigt und genutzt  */
}

.blankbox{
    float:left;
    width:16px;
    height: 20px;
    background-color: lightgreen;  
}
div.anaus  {
    z-index:10;
    display: block;
    position:absolute;  
    top:1px;
    left:2px;
    width:14px;
    height:14px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    line-height: 9pt;
    font-size: 12pt;
    font-style: oblique;
    vertical-align: middle;
    background-color: lightblue;
    border: 1px solid silver;
    border-radius: 50%;
}
div.goomaps  {
    z-index:10;
    display: block;
    position: absolute;  
    top:0px;
    left: 134px;
    width:14px;
    height:14px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    line-height: 8pt;
    font-size: 11pt;
    font-weight: bold;
    background-color: lightblue;
    border: 1px solid blue;
    border-top:1px solid lightblue;
    border-right:1px solid silver;
    border-bottom-left-radius:  50%;
    border-bottom-right-radius:  50%;
    border-top-left-radius:  50%;
}

.langleer {
    visibility : hidden;
}
.anaus:hover {
    z-index:100;
    background-color: yellow;   /* #FDF8F2;  */
}
div.fa_url_dummy,
div.fa_url{
    display:block;
    position:relative;
    top:5px;
    left:6px;
    width:138px;
    height: 30px;                /* 27px; bis 21.3. */
    text-align:center;
    background-color: white;
}
div.fa_url{
     border-bottom: 1px solid grey;  
    border-top: 1px solid grey; 
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}
div.fa_url_dummy{
    border-top: 1px solid transparent; 
    border-bottom: 1px solid transparent;
}
div.fa_url_dummy a,
div.fa_url a{
    display:inline-block;
    line-height:21pt;
     vertical-align:  middle;
    font-size: 10pt ; 
     width:135px;     
     color: black;
     border-top: 1px dotted transparent;
}

div.fa_url_select{
    display:block;
    position:relative;
    float:left;    
    left:4px;
    top:6px;
    width:142px;
    padding-left: 1px;
    padding-top: 1px;
    height: 28px;         
    vertical-align: middle;
   text-align:center;
    background-color: #76A8FF;
    border-radius: 5px;
}

a.a_margin_top{
    /* steuert die Lage des Link-Textes, wenn Langinfo true */
/*    margin-top:-1.5em;  */
}

div.fa_url:hover {
    background-color: #00407E !important;
}

div.fa_url a:hover {
    color: yellow !important;
    text-decoration: none;
}

div.formstyle{
   padding-top:5px;
   margin-top: 5px;
}

.kurzinfo_hide{
}

div.kurzinfo{
    z-index:0;  /* ehemals 50 */
    display:block;
    position: absolute;
    top:26px;
    background-color: #ffffcc;
    text-align: center;
    font-size: 0.7em;
    line-height:0.5em;
    overflow: hidden;
    width:138px;
    height:7px;
    padding-top: 3px;
    padding-bottom: 1px;
  /*  border-top: 1px dotted silver;  */
    border-bottom: 1px solid silver;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}   
.bottom_radius{
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}
a.a_margin_toplangkurz{ /* steuert die Lage des Link-Textes, wenn Langinfo und kurzinfo true */
    margin-top:-1px;
}
.langinfo_dispnone,
.kurzinfo_dispnone{
    border:0px;
    margin-top: -5px; 
    display:none;
}
div.fa_url_dummy div.kurzinfo{
    z-index: 50;
    position: absolute;
    top:26px;
    height: 7px;  
     overflow: hidden;
    width:138px;
    padding-top: 3px;
    padding-bottom: 1px;
    background-color: yellow ;
    border-bottom: 1px solid silver;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.fa-url-ecke-unten{
    border-bottom-right-radius: 5px; 
}
.anaus-ecke-unten{
   border-bottom-left-radius: 5px;
}

div.langinfo{
    display:none;
    position:relative;
    z-index:50;        /* ehemals 150 */
    top:0px;  
    list-style: none;
    cursor: pointer;
    text-align: left;
 /*   font-size: 8pt;  */
    font-size: 10pt;
    font-weight: bold;
     width:190px;
     left:-47px; 
   padding-left: 0.3em;
    padding-right: 0.1em;
    padding-top: 0em;
    padding-bottom: 0.2em;
    min-height: 1.8em;
    overflow: hidden;
    border-radius: 5px;
   border: 7px solid  steelblue;      
    opacity: 0.95;
    background-color: honeydew; /*  linen;    */
}

div.langinfo ul{
    list-style-type: none;
    margin-left:-20px;
    margin-top:0.2em;
}
div.langinfo li{
    margin-left:-20px;
}

#spalte6 div.langinfo{
       left:-40px;  /**/
}
#spalte7 div.langinfo{
       left:-78px;  /**/
}

#spalte1 div.langinfo{
       left:-6px;  /**/
}
#spalte2 div.langinfo{
       left:-40px;  /**/
}
#spalte3 div.langinfo{
       left:-30px;  /**/
}
#spalte4 div.langinfo{
       left:-35px;  /**/
}
div.fa_url.img_ohnelang{
    margin-top:-15px;
}
div.fa_url.img_kurzmitlang{
    margin-top:-15px;
}
div.fa_url.kurzundlang{
    top:3px;        /* gilt auch für gesetztes maps, 2px vor 21.3.  */
}
div.fa_url.nurkurz{
  top:3px;          /* 2px bis 21.3.*/
}

div.langinfo p{
    margin-top:0.2em;
    margin-bottom: 0.2em;
}
span.grot{
    color:#EA4335;
}
span.gblau{
    color:#4285F4;
}
span.ggold{
    color:#FBBC05;
}
span.ggruen{
    color:#34A853;
}
span.weiss{
    color:white ;
}
span.ftklein{
    font-size: 6pt;
}
span.ft_7 {
    font-size: 7pt !important;
}
span.ft_8 {
    font-size: 8pt !important;
    font-size:  small  ;
}
span.pt11 {
    font-size: 11pt !important;
   /* font-size:  small  ; */
}
span.pt6{
    font-size: 6pt !important;
}
span.pt5{
    font-size: 5pt !important;
}

/* ################ Ab hier cookietesterei  ######### */
#cookie_info,
div#cookie_test {
    display:block;
    position: absolute;
    z-index: 1000;
    top: 50px;
    left:600px;
    width: 300px;
    height: 50px;
    background-color: yellow;
}

#cookie_info{
    left:0px;
}

button#button{
    display:box;
    position:relative;
    float:left;
    top:0px;
    left:0px;
}

.styled {
    border: 0;
    line-height: 1.5em;
    padding: 0 5px;
    font-size: 1rem;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 10px;
    background-color: rgba(220, 0, 0, 1);
    background-image: linear-gradient(to top left,
                                      rgba(0, 0, 0, .2),
                                      rgba(0, 0, 0, .2) 30%,
                                      rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, .6),
                inset -2px -2px 3px rgba(0, 0, 0, .6);
}

.styled:hover {
    background-color: rgba(255, 0, 0, 1);
}

.styled:active {
    box-shadow: inset -2px -2px 3px rgba(255, 255, 255, .6),
                inset 2px 2px 3px rgba(0, 0, 0, .6);
}