body     {
         background-color: #555555;
         margin: 0px;
         font-family: 'Noto sans TC', sans-serif;
         font-size: 100.01%;
         }

.gesamt  {
         max-width: 1100px;
         margin-left: auto;
         margin-right: auto;
         margin-bottom: 4px;
         margin-top: 0px;
         padding: 0px 0px 0px 0px;
         background-color: #555555;
         font-family: 'Noto Sans TC', sans-serif;
         position: relative;
         z-index: 1;
         }

.header {
         position: relative;
         width: auto;
         height: 120px;
         margin: 0px;
         padding: 20px 0px 0px 10px;
         background-image: linear-gradient(0deg, #888888, #4d4d4d );
         font-family: 'Boogaloo', sans-serif;
         font-style: normal;
         text-align: left;
         line-height: 1.0;
         }

nav    {
         margin: 0px 0px 0px 0px;
         padding: 70px 10px 0px 0px;
         height: 2.0em;
         display: flex;
         flex-direction: row;
         justify-content: flex-end;
         flex: 1 1 0%;
         text-align: center;
         }

nav .submenu   {
         margin: 0px;
         padding: 0px;
         height: 1.7em;
         background-color: transparent;
         }

nav > ul {
         list-style: none;
         margin: 0;
         padding: 0px;
         background-color: inherit;
         display: flex;
         flex-direction: row;
         justify-self: end;
         align-content: flex-end;
         height: 1em;
         z-index: 1000;
         }

nav li {
        display: inline-block;
        position: relative;
        margin: 0;
        }

nav a   {
        display: block;
        list-style-type: none;
        padding: 7px 4px 6px 4px;
        margin: 0;
        color: #fff;
        font-family: 'Noto sans TC', sans-serif;
        font-size: 1.0em;
        font-weight: 400;
        text-decoration: none;
        border-radius: 2px;
        }

nav .submenu a {
        display: block;
        list-style-type: none;
        width: auto;
        padding: 7px 7px 6px 7px;
        margin: 0;
        color: #fff;
        font-family: 'Noto sans TC', sans-serif;
        font-size: 0.9em;
        font-weight: 400;
        text-decoration: none;
                }

nav a:hover,
nav a:focus {
        color: #222;
        font-weight: 400;
        text-decoration: none;
        background-color: #eeeeee;
        transition: all ease 0.4s;
                }

nav .submenu a:hover,
nav .submenu a:focus {
        color: #222;
        font-weight: 400;
        text-decoration: none;
        background-color: #ffffff;
        transition: all ease 0.4s;
        }

/*     submenu navigation links      */

nav .submenu {
        visibility: hidden;
        height: 0;
        z-index: 10;
        }

nav .submenu li {
        display: block;
        z-index: 10;
        /* width: 15em; */
         }

/**     Show the submenu on hover, focus     **/

nav li:hover .submenu,
nav li:active .submenu,
nav li:focus .submenu {
        visibility: visible;
        height: auto;
        z-index: 10;
        }

nav li:focus-within .submenu {
        visibility: visible;
        height: auto;
        z-index: 10;
        }

.content1  {
         display: grid;
         grid-template-columns: repeat(1, 1fr);
         grid-gap: 0em;
         background-color: transparent;
         border-left: 1px solid #777777;
         border-right: 1px solid #777777;
         vertical-align: top;
         margin: 0px 0px 0px 0px;
         padding: 20px 20px 20px 20px;
         font-weight: 400;
         font-size: 16px;
         line-height: 1.5;
         text-align: left;
         z-index: 2;
         }

.c01      {
         position: relative;
         padding: 20px;
         margin: 5px 0px 5px 0px;
         background-color: #ffcc77;
         border-radius: 3px;
         box-shadow: 0px 0px 9px 3px #aaaaaa;
         z-index: 3;
         }

.c02      {
         position: relative;
         padding: 20px;
         margin: 5px 0px 5px 0px;
         background-color: #ffdd99;
         border-radius: 3px;
         box-shadow: 0px 0px 9px 3px #aaaaaa;
         z-index: 3;
         }

.c03      {
         position: relative;
         padding: 20px;
         margin: 5px 0px 5px 0px;
         background-color: #ff9955;
         border-radius: 3px;
         box-shadow: 0px 0px 9px 3px #aaaaaa;
         z-index: 3;
         }

.c04      {
         position: relative;
         padding: 0px;
         margin: 5px 0px 5px 0px;
         background-color: inherit;
         border-radius: 3px;
         box-shadow: 0px 0px 9px 3px #aaaaaa;
         z-index: 3;
         }

.footer  {
         position: relative;
         display: grid;
         grid-template-columns: 100%;
         grid-row-gap: 10px;
         grid-column-gap: 0px;
         vertical-align: top;
         background-color: #4d4d4d;
         min-height: 50px;
         margin: 0px;
         padding: 16px 20px 12px 20px;
         text-align: left;
         color: #efefef;
         z-index: 2;
         }

.footer1  {
         position: relative;
         margin: 0px;
         padding: 0px 4px 0px 0px;
         text-align: left;
         font-family: 'Roboto', sans-serif;
         font-weight: normal;
         font-size: 15px;
         line-height: 1.3;
         border-top: 0px solid #07b;
         }

.footer2  {
         position: relative;
         margin: 0px 1px 0px 1px;
         padding: 0px 4px 0px 4px;
         text-align: left;
         font-family: 'Roboto', sans-serif;
         font-weight: normal;
         font-size: 15px;
         line-height: 1.3;
         border-top: 0px solid #07b;
         }

.footer3  {
         position: relative;
         margin: 0px 0px 0px 1px;
         padding: 0px 0px 0px 4px;
         text-align: left;
         font-family: 'Roboto', sans-serif;
         font-weight: normal;
         font-size: 15px;
         line-height: 1.3;
         border-top: 0px solid #07b;
         }

p        {
         margin: 11px 0px 11px 0px;
         }

b, strong  {
         font-weight: 700;
         }

i, em    {
         font-family: 'Lato';
         font-size: 110%;
         }

u        {
         text-decoration-color: #006299;
         text-decoration-style: single;
         }

small    {
         font-size: 80%;
         }

code    {
        font-family: inherit;
        font-weight: 700;
        color: #004269;
        }

h1       {
         font-family: 'Boogaloo', sans-serif;
         font-size: 30px;
         color: #333333;
         font-weight: 400;
         text-align: left;
         line-height: 1.0;
         padding: 0px;
         margin: 0px 0px 10px 0px;
         }

h2       {
         font-family: 'Boogaloo', sans-serif;
         font-style: normal;
         font-size: 27px;
         font-weight: 400;
         line-height: 1.0;
         color: #333333;
         letter-spacing: 0.3px;
         padding: 0px;
         margin: 24px 0px 12px 0px;
         border-bottom: 0px solid #5bc;
         }

h3       {
         font-family: 'Boogaloo', sans-serif;
         font-style: normal;
         font-size: 23px;
         font-weight: 400;
         line-height: 1.3;
         color: #444444;
         padding: 0px;
         margin: 14px 0px 5px 0px;
         }

h4       {
         font-family:  'Roboto', sans-serif;
         font-size: 18px;
         font-weight: 400;
         line-height: 1.3;
         color: #222222;
         padding: 0px;
         margin: 16px 0px 5px 0px;
         }

h5       {
         font-family:  'Roboto', sans-serif;
         font-size: 17px;
         text-decoration: none;
         font-weight: 400;
         line-height: 1.3;
         color: #222222;
         padding: 0px;
         margin: 0px;
         }

.header a {
         text-decoration: none;
         }

.text a,
.text3li a,
.text3mi a,
.text3re a,
.text2li a,
.text2re a {
         color: inherit;
         font-family: 'Lato';
         font-style: italic;
         font-weight: 700;
         font-size: inherit;
         color: #06a;
         text-decoration: none;
         padding: 0px 2px 0px 2px;
         transition: all ease 0.6s;
         }

.footer a {
         color: inherit;
         font-family: 'Lato';
         font-style: italic;
         font-weight: 700;
         font-size: inherit;
         color: #fee;
         text-decoration: none;
         padding: 0px 2px 0px 2px;
         transition: all ease 0.6s;
         }

.text a:hover,
.textli a:hover,
.textmi a:hover,
.textre a:hover {
         font-family: 'Lato';
         font-style: italic;
         font-weight: 700;
         font-size: inherit;
         color: #fee;
         background-color: #006289;
         text-decoration: none;
         padding: 0px 2px 0px 2px;
         }

.footer a:hover
         {
         font-family: 'Lato';
         font-style: italic;
         font-weight: 700;
         font-size: inherit;
         color: #fee;
         background-color: #004269;
         text-decoration: none;
         padding: 0px 2px 0px 2px;
         }

ul       {
         display: inline-block;
         margin-block-start: 0em;
         margin-block-end: 0em;
         margin-inline-start: 0px;
         margin-inline-end: 0px;
         padding-inline-start: 5px;
         }

li       {}

table    {
         width: 100%;
         margin: 7px 0px 0px 0px;
         background-color: transparent;
         padding-top: 0px;
         border-collapse:seperate;
         border-spacing: 4px;
         }

th       {
         font-family: 'Roboto';
         font-style: normal;
         font-size: 17px;
         font-weight: 700;
         color: #005279;
         background-color: transparent;
         text-align: left;
         padding: 4px 9px 4px 0px;
         border-top: 0px solid #fff;
         border-bottom: 1px solid #099;
         }

td       {
         vertical-align: top;
         font-size: 16px;
         line-height: 1.3;
         text-align: left;
         color: #441122;
         padding: 4px 9px 4px 0px;
         border-top: 0px solid #eee;
         border-bottom: 0px solid #eee;
         }

img      {
         padding: 0px;
         margin: 0px;
         border: 0px solid #fff;
         }

img.right {
         margin: 0px 0px 40px 60px;
         align: right;
         float: right;
         }

img.left {
         margin: 0px 60px 40px 0px;
         align: left;
         float: left;
         }

.bild    {
         width: 100%;
         height: auto;
         }

hr       {
         width: 95%;
         border: 0;
         height: 2px;
         margin: 20px auto;
         background: #006289;
         background-image: linear-gradient(to right, #f3fbff, #005299, #f3fbff);
         }



@media (min-width: 45em){
       .header  {
       padding: 20px 0px 0px 50px;
       }
       .content1  {
         display: grid;
         grid-template-columns: repeat(2, 1fr);
         grid-gap: 1em;
         margin: 0px 0px 0px 0px;
         padding: 50px 50px 30px 50px;
         font-weight: 400;
         font-size: 16px;
         line-height: 1.5;
         text-align: left;
         z-index: 2;
         }
         nav    {
         padding: 70px 50px 0px 0px;
         }
       .footer  {
         grid-template-columns: 34% 32% 34%;
         grid-row-gap: 0px;
         grid-column-gap: 0px;
         padding: 16px 50px 12px 50px;
        }
        .footer3  {
        text-align: right;
        }
         }

@media (min-width: 60em){
       .content1  {
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         grid-gap: 1em;
         margin: 0px 0px 0px 0px;
         padding: 50px 50px 30px 50px;
         font-weight: 400;
         font-size: 16px;
         line-height: 1.5;
         text-align: left;
         z-index: 2;
         }
       nav    {
         padding: 70px 50px 0px 0px;
         }
       .footer {
        padding: 16px 50px 12px 50px;
        }
         }