 :root {
     --white: #fff;
     --mkl-maincolor: #0a434d;
     --mkl-text: #888;
 }

 *,
 *::before,
 *::after {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 .invisible {
     border: 0;
     clip: rect(0 0 0 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
 }

 html,
 body {
     height: 100%;
 }



 body {
     margin: 0;
     padding: 0;
     font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
     font-size: 1.125em;
     color: #555;
     overflow-y: scroll;
 }



 #wrapper {
     margin: 0;
     padding: 0;
     height: 100%;
     min-height: 100%;
     display: grid;
     grid-template-rows: auto auto 1fr auto;
 }

 #header {
     background-color: var(--mkl-maincolor);
     color: var(--white);


 }


 #header .inside {
     margin: 0 auto;
     padding: 1.25em 6em;
     display: flex;
     align-items: baseline;
 }

 #header .inside .claim {
     font-size: clamp(1rem, -1.5rem + 5vw, 2rem);
     width: 70%;
     font-weight: 300;
 }

 #header .inside .logo {
     width: 200px;
     height: auto;
     margin-left: auto;
 }


 #footer {
     background-color: var(--mkl-maincolor);
     color: var(--white);

     & a {
         color: var(--white);
     }

 }

 #footer .inside {
     text-align: center;
     padding: 1em;
     font-size: .9rem;
 }


 #main {
     height: 100%;
 }


 #main .inside {
     width: 100%;
     max-width: 1280px;
     margin: 0 auto;
     padding-bottom: 2em;

 }


 .mod_article {
     padding: 0 40px;
 }


 h1 {
     font-size: clamp(2rem, -1.5rem + 8vw, 3rem);
     font-weight: 300;
     line-height: 1.2;
     padding: .5em 0;
     font-family: 'Times New Roman', Times, serif
 }

 h2 {
     font-size: clamp(1.5rem, -1.5rem + 6vw, 2rem);
     font-weight: 300;
     line-height: 1.2;
     padding: .5em 0;
     font-family: 'Times New Roman', Times, serif
 }


 p {
     line-height: 1.5;
 }

 img {
     width: 100%;
     height: auto;
     display: block;
     margin: 0;
     padding: 0;
 }

 .content {
     /*   outline: 1px solid red; */
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }

 .content:nth-child(odd) {
     flex-direction: row-reverse;
 }

 .content>div {
     flex: 1 1 calc(991px / 2);
 }

 .text {

     padding: 2em;
 }


 .ce_headline {
 /*    outline: 1px solid yellowgreen; */
    padding: 1em 0;
 }

 /* -------------Navigation----------------- */

 nav {

     border-bottom: 1px solid #e5e5e5;
     display: flex;
     justify-content: flex-end;
     padding: 1em 5em 1em 1em;

     & a {
         text-decoration: none;
     }
 }

 nav strong {
     font-weight: normal;
 }


 nav li {
     list-style: none;
     display: inline-block;
     padding: 0 1em;
     justify-content: flex-end;

 }


 @media (max-width: 1399px) {
     .ce_text {
         width: 100%;
         max-width: 1140px;
         margin: 0 auto;

     }

     #header .inside {
         margin: 0 auto;
         display: flex;
         align-items: baseline;
         padding: 1em 2em;
     }

     #header .inside .claim {
         font-size: clamp(1rem, -1.5rem + 5vw, 2rem);
         width: 70%;
         font-weight: 300;
     }
 }


 @media (max-width: 1199px) {
     .ce_text {
         width: 100%;
         max-width: 960px;

     }
 }


 @media (max-width: 991px) {
     .ce_text {
         width: 100%;
         max-width: 720px;

     }

     .text {
         /*         background-color: beige;  */
         padding: 1em 0 3em;
     }
 }

 @media (max-width: 767px) {
     .ce_text {
         width: 100%;
         max-width: 540px;

     }
 }
