
            body    
                    
                    {

                    margin: 0px;
                    min-height: 100vh;
                    display: flex;
                    flex-direction: column;
                    background-image: url('img/klausdie-mountains-862870_1920.jpg');
                    background-repeat: no-repeat;
                    background-attachment: fixed;
                    background-size: cover;
                    background-position: center;
                    font-family:"Atkinson Hyperlegible", sans-serif;
                    font-size: 22px;
                    padding-left: 0px;
                    padding-right: 0px;
                    color: white;
                                        
                }

            .Home

                    {

                    background-image: url('img/klausdie-mountains-862870_1920.jpg');
                    background-repeat: no-repeat;
                    background-attachment: fixed;
                    background-size: cover;
                    background-position: center;

                }

            .backround-ds

                    {
                    
                    background:#23282b;
                    background-repeat: no-repeat;
                    background-attachment: fixed;
                    background-size: cover;
                    background-position: center;

                }

                @font-face {
                            
                            font-family: "Atkinson Hyperlegible";
                            src: url("fonts/Atkinson-Hyperlegible-Bold-102a.woff2");
                            font-weight: 700;
                            font-style: normal;
                            font-display: swap;

                        }

                @font-face {
                            
                            font-family: "Atkinson Hyperlegible";
                            src: url("fonts/Atkinson-Hyperlegible-Italic-102a.woff2");
                            font-weight: 400;
                            font-style: italic;
                            font-display: swap;

                        }

                @font-face {
                            
                            font-family: "Atkinson Hyperlegible";
                            src: url("fonts/Atkinson-Hyperlegible-Regular-102a.woff2");
                            font-weight: 400;
                            font-style: normal;
                            font-display: swap;

                        }

                @font-face {
                            
                            font-family: "Atkinson Mono";
                            src: url("fonts/AtkinsonHyperlegibleMono-Bold.woff2");
                            font-weight: 700;
                            font-style: normal;
                            font-display: swap;

                        }

                @font-face {
                            
                            font-family: "Atkinson Mono";
                            src: url("fonts/AtkinsonHyperlegibleMono-BoldItalic.otf");
                            font-weight: 700;
                            font-style: italic;
                            font-display: swap;

                        }

                @font-face {
                            
                            font-family: "Atkinson Mono";
                            src: url("fonts/AtkinsonHyperlegibleMono-Regular.woff2");
                            font-weight: 400;
                            font-style: normal;
                            font-display: swap;

                        }

            code, .nav, .skip-link, .ex_link, .bottom-line
                
                    {

                    font-family: "Atkinson Mono", monospace;
                    letter-spacing: 0.05em;

                }

             .nav
                
                    {   

                    position: fixed;
                    top: 0px;
                    left: 0px;
                    width: 100%;
                    background-color: #da291c; 
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: center;
                    z-index: 1000;
                    text-align: center;
                    gap: 0.5rem;
                    padding: 0.5rem 1rem;
                    box-sizing: border-box;
                    font-size: 18px;
                    font-family: "Atkinson Mono", monospace;
                    padding-top: 0px;
                               
                }
            .skip-link 
            
                    {
                    position: absolute;
                    left: -9999px;
                    top: 2px;
                    background-color: #da291c;
                    color: #ffffff;
                    padding: 4px 14px;
                    z-index: 1000;
                    outline: 2px solid #ffffff;
                }

            .skip-link:focus

                    {
                
                        left: 10px;
                                            
                }

            .ex_link
            
                    {
                    
                    display: inline-flex;
                    align-items: center;
                    transform: translateY(-50%);    
                    height: 30px;
                    justify-content: center;
                    padding: 0.25rem;
                    margin: 0;
                
                }

            .ex_link img 
                    
                    {
                        height: 30px;
                        width: auto;
                        display: block;

                  }                
            a

                    {

                    color: #ffffff;
                    text-decoration: none;
                    margin-right: 16px;
                    display: inline-block;
                    padding: 8px 10px;

                }

            a:hover,
            a:focus 
                
                    {

                    background-color: #FF0000;
                    border: 1px solid #00FF00;
                    outline: 2px solid #ffffff;

                }

             main 
                    {

                    max-width: min(100% - 2rem, 900px);
                    margin: 0;
                    flex: 1; 

                }
             
              h1 
                
                    {

                    color: #EED202;
                    padding-top: 80px;
                    text-align: center;
                    font-size: 26px;

                }

             h2 
                
                    {

                    color: #FFDB58;
                    padding-top: 20px;
                    text-align: center;
                    font-size: 24px;

                }

             p

                    {

                    width: auto;
                    height: auto;
                    color: #ffffff;
                    font-size: 22px;
                    text-align: left;
                    padding-left: 80px;
                    padding-right: 80px;
                }

            .Data-Text

                    {

                    color: #dbd9d9;
                    font-size: 20px;
                    text-align: center;
                    width: 60%;
                    margin: 0 auto;
                    padding-top:15px;
                    
                }

            .ul-ds

                    {
                    
                    color: #ffffff;
                    font-size: 20px;
                    text-align: center;
                    padding-top:15px;  
                
                }

            .Ueberschrift
                
                    {
                 
                    width: 100%;
                    height: auto;
                    padding-left: 1rem;
                    padding-right: 1rem;
                    color: #ffffff;
                    font-size: 22px;
                    text-align: left;
                    padding-top: 80px;
                
                }
                
            .Haupttext
                
                    {

                    width: auto;
                    height: auto;
                    padding-left: 1rem;
                    padding-right: 1rem;
                    color: #FFFFFF;
                    font-size: 22px;
                    text-align: left;
                    padding-top: 10px;

                }

            .SIBU
                    {
                    color: #00ffff;
                    }
            
            .bottom-line
                
                    {

                    width: 100%;
                    bottom: 0px;
                    background-color: #da291c; 
                    padding: 8px 10px;
                    text-align: right;
                    font-size: 18px;

                }