/* todo: smallcaps/petitecaps for navbar */

:root {
    /* v2 high contrast: https://paletton.com/#uid=73o1q0kllll3QPwcAu5u5cAPw3Q */
    --blue5: rgba(195,215,220,1);
    --blue5a: rgba(195,215,220,0.7);    
    --blue4: rgba( 92,137,149,1);
    --blue3: rgba( 38, 91,106,1);
    --blue2: rgba(  6, 50, 62,1);
    --blue1: rgba(  0, 15, 19,1);


    --purple5: rgba(218,198,224,1);
    --purple5a: rgba(218,198,224,0.7);
    --purple5b: rgba(218,198,224,0.4);
    --purple4: rgba(144, 99,159,1);
    --purple3: rgba( 95, 40,113,1);
    --purple2: rgba( 52,  6, 66,1);
    --purple1: rgba( 15,  0, 20,1);


    --green5: rgba(251,254,223,1);
    --green4: rgba(229,236,143,1);
    --green3: rgba(159,168, 56,1);
    --green2: rgba( 92, 99,  6,1);
    --green1: rgba( 28, 30,  0,1);


    --brown5: rgba(255,240,225,1);
    --brown5a: rgba(255,240,225,0.7);
    --brown5b: rgba(255,240,225,0.4);    
    --brown4: rgba(240,193,145,1);
    --brown3: rgba(170,114, 57,1);
    --brown2: rgba(100, 54,  6,1);
    --brown1: rgba( 30, 15,  0,1);
    
    /* v1 https://paletton.com/#uid=70-1q0kllll4FN0d0tFtFd0N04F Generated by Paletton.com © 2002-2014 */
    /* --brown5: rgba(255,237,218,1) ; */
    /* --brown4: rgba(236,189,140,1) ; */
    /* --brown3: rgba(170,114, 57,1) ; */
    /* --brown2: rgba(104, 56,  8,1) ; */
    /* --brown1: rgba( 37, 19,  0,1) ; */

    /* --green5: rgba(251,253,217,1) ; */
    /* --green4: rgba(226,233,138,1) ; */
    /* --green3: rgba(159,168, 56,1) ; */
    /* --green2: rgba( 95,102,  7,1) ; */
    /* --green1: rgba( 34, 37,  0,1) ; */

    /* --purple5: rgba(210,187,217,1) ; */
    /* --purple4: rgba(142, 95,156,1) ; */
    /* --purple3: rgba( 95, 40,113,1) ; */
    /* --purple2: rgba( 54,  7, 69,1) ; */
    /* --purple1: rgba( 19,  0, 25,1) ; */

    /* --blue5: rgba(183,206,213,1) ; */
    /* --blue4: rgba( 89,134,147,1) ; */
    /* --blue3: rgba( 38, 91,106,1) ; */
    /* --blue2: rgba(  7, 52, 64,1) ; */
    /* --blue1: rgba(  0, 18, 23,1) ; */
    /* --blue1a: rgba(  0, 18, 23,0.1); */

    --fs: 16px;
    --lh: calc(var(--fs)*1.618); /* refer to only while in literal font size above */
    
    --lw: calc(66.8*(var(--fs)/1.618)); /* first number is CPL */

    
    --space0: calc(var(--lh)*1.618*1.618);
    --space1: calc(var(--lh)*1.618);
    --space2: calc(var(--lh));
    --space3: calc(var(--lh)/1.618);
    --space4: calc(var(--lh)/1.618/1.618);
    --space5: calc(var(--lh)/1.618/1.618/1.618);
    --space6: calc(var(--lh)/1.618/1.618/1.618/1.618);

}

html {
    font-family: Helvetica Neue, Helvetica, -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, Adwaita Sans, Cantarell, Ubuntu, roboto, noto, helvetica, arial, sans-serif, Menlo, Consolas, Monaco, Adwaita Mono, Liberation Mono, Lucida Console, monospace;
    font-size:var(--fs);
    padding:0;
    margin:0;
    height:100%;
    text-align: left;
}

body {
 width: 100%;
 height:100%;
 padding:0;
 margin:0;
 font-size:var(--fs); /* everything but headlines */
}

.vafhje > span:nth-child(2) {
    display: none;
}


.content {
    /*! background-color:var(--blue2); */
    margin: 0 auto;
    color: var(--blue5);
    width:var(--lw);
    max-width:92%;
    text-align:left;
    line-height:calc(var(--fs)*1.618);
    /*! padding-top:var(--space3); */
    height:100%;
    padding-top: var(--space3);
}


header {
    padding:0;
    /*! padding-top:var(--space0); */

    margin: 0;
    /*! border-left: var(--space0) solid var(--blue5); */
    text-align: left;
    /*! margin-left: calc(-1*var(--space0) ); */
    width: fit-content;
    float: left;
    /*! background-color: var(--purple1); */
    /*! margin-right: var(--space2); */
}

.title {
    display:none;

}

h1.vistitle {
    text-align: left!important;
    display: inline-block;
    clear:both;
    text-decoration:none;
    color: var(--blue1);
    float: left;
    margin-bottom: var(--space0);
}

h1.vistitle a,
h1.vistitle a:visited,
h1.vistitle a:active {
    border: none;
}



h1 {
    font-weight: normal;
    font-size:1.618em;
    letter-spacing:calc(var(--space6)/1.618/1.618/1.618);
    line-height:calc(var(--fs)*1.618*1.618);
    margin:0;
    padding:0;
    font-variant-caps:all-petite-caps;

    padding-right: var(--space2);
}
h1 a, h1 a:visited, h1 a:active {
    text-decoration:none;
    color:unset;
}
nav {
    /*! padding-top:var(--space6); */
    /*! background-color:var(--blue2); */

    width: 100%;
    float: left;
    clear: right;
    /*! display: inline-block; */
}
.outline-2 {
    /*! margin-top:var(--space6); */ 
    width: 100%;
    display: inline-block;
    color: var(--purple1);
}

.outline-3 {
    margin:0 0 0 0;
}

#text-ling p {
    font-style: italic;
}

p {
    margin:var(--space6) 0 0 0;
    padding:0px;
}

h2 {
    font-weight: normal;
    border-bottom: var(--blue4) solid var(--space4);
padding: 0 var(--space1) 0 0;
}


h3 {
    font-size:calc(var(--fs));
    line-height:calc(var(--fs)*1.618);
    border-bottom: var(--blue4) solid var(--space6);
padding: var(--space2) var(--space3) 0 0;

}

ul {
    padding-left: var(--lh);
    text-align: left;
}



dd {
margin-left: var(--lh);
}

dt {
padding-left: var(--lh);    
margin-top: var(--lh);
width: max-content;
max-width: 85%;
text-align: left;
color: var(--brown1);
border-left: var(--blue2) 5px solid;
text-we: ;
font-weight: bold;
margin-left: -5px;
}

/* links inside a paragraph  */
a, a:visited, a:active, a:hover {
    text-decoration:none;
    color:var(--blue2); 
}

a, a:visited, a:active {
    border-bottom: var(--blue3) 2px solid;
}

a.buchen {
background: var(--blue4);
  color: white;
  font-size: 1.618em;
  padding: 10px 20px;
  font-variant: all-petite-caps;
  float: left;
  clear:left;
  border: none;
  margin-bottom: var(--space4);
}

a.buchen:hover,
a.buchen:active,
a.buchen:visited {
   background: var(--blue5);
   color: white;
   border-bottom: none;
}

a.buchen ~ p {
    clear: both;
}



/* links inside navigation bar */

@keyframes mycolor2 {
    0% {border-color:var(--brown2);}
    50% {border-color:var(--purple2);}
    100% {border-color:var(--green2);}
}

.current a, .current a:hover, .current a:visited, .current a:active {
    color:var(--blue5);
    animation: mycolor2 4s infinite alternate; 
    border-bottom: 2px solid;
    padding-top: 7px;
}
a:hover {
    color: var(--purple4);
    border-bottom: var(--purple4) 2px solid;
}


@keyframes mycolor {
    0% {border-bottom-color:var(--brown2);}
    50% {border-bottom-color:var(--purple2);}
    100% {border-bottom-color:var(--green2);}
}

nav ul li {
    margin: 0 var(--space6) 0 0;
    font-family: inherit;
}

nav ul li a,
nav ul li a:visited {
    animation: var(--blue3) 4s infinite alternate;
    font-family: inherit;    
    /*! border: none; */
}

footer {
    margin-top:var(--space1);
    padding-bottom:var(--space0);
}



footer ul li,
nav ul li {
  list-style: none;
  display: inline;
  line-height: calc(var(--fs)*1.618*1.618);
  float: left;
  margin-right: var(--space3);
}

footer ul,
nav ul {
    padding: 0;
    width:100%;
    clear:both;
}

/* links in file list */

@keyframes pdf {
    0% {border-bottom-color:var(--brown3);}
    100% {border-bottom-color:var(--purple3);}
}

@keyframes pdfhover {
    0% {border-bottom-color:var(--brown4);}
    100% {border-bottom-color:var(--purple4);}
}


h3 + div > ul li a,
h3 + div > ul li a:visited {
    border-bottom:solid 2pxy;
    animation:pdf 4s infinite alternate;
    
}

h3 + div > ul li a:hover {
    border-bottom:solid var(--space6);
    animation:pdfhover 4s infinite alternate;
}

h3 + div > ul {
    list-style:square;
    padding-left: var(--space3);
}




/* 	    #div1 {animation-timing-function: linear;} */
/* #div2 {animation-timing-function: ease;} */
/* #div3 {animation-timing-function: ease-in;} */
/* #div4 {animation-timing-function: ease-out;} */
/* #div5 {animation-timing-function: ease-in-out;} */

  /* border-image: radial-gradient(rgb(0,143,104), rgb(250,224,66)) 1; */


img {
float: right;
margin: 0 0 0 52px;
border: var(--blue4) solid 2px;
}


div.outline-3.portrait {
background: var(--blue4);
color: white;
padding-left: 20px;
margin-left: -20px;
padding-bottom: 2px;
}

.rating {
    color: orange;
    font-family: inherit;
}