html {
     -webkit-text-size-adjust: 100%;
     font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
     line-height: 1.5;
     tab-size: 4;
     scroll-behavior: smooth;
}
 body {
     font-family: inherit;
     line-height: inherit;
     margin: 0;
     height: 100vh;
}
 h1, h2, p, pre {
     margin: 0;
}
 *, ::before, ::after {
     box-sizing: border-box;
     border-width: 0;
     border-style: solid;
     border-color: currentColor;
}
 h1, h2 {
     font-size: inherit;
     font-weight: inherit;
}
 a {
     color: inherit;
     text-decoration: inherit;
}
 pre {
     font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
}
 .menu-pane-header {
     position: fixed;
     display: flex;
     flex-direction: column;
     justify-content: center;
     width: 100%;
     height: 4em;
     background-color: #000000;
     z-index: 100;
}
 .menu-pane-list {
     display: none;
     position: fixed;
     top: 2.68em;
     background-color: #000000;
     color: #ffffff;
     font-size: 1.5em;
     width: 10em;
     border: 1px solid #000000;
     -webkit-box-shadow: 10px 10px 14px -14px rgba(0,0,0,0.75);
     -moz-box-shadow: 10px 10px 14px -14px rgba(0,0,0,0.75);
     box-shadow: 10px 10px 14px -14px rgba(0,0,0,0.75);
     animation: 1s fadeIn;
}
 .menu-pane-list :hover {
     color: #000000;
     background-color: #ffffff;
     cursor: pointer;
}
 .menu-pane-list-element {
     display: flex;
     padding: 10px 10px 10px 20px;
     width: 100%;
}
 .menu-icon {
     width: 3em;
     font-size: 2em;
     color: #ffffff;
     padding: 20px;
}
 .menu-icon:hover {
     color: #fbbd7b;
     cursor: pointer;
}
 .page-container {
     margin: 0 auto;
     padding-top: 4em;
     min-height: 100vh;
}
 .logo-container {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 100%;
}
 .logo-container img {
     width: 20em;
}
 .title-container {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 100%;
     font-size: 18px;
     font-weight: 700;
}
 .title-container h1 {
     font-size: 3em;
     font-weight: 900;
}
 .container {
     display: flex;
     flex-direction: row;
     justify-content: center;
    padding-bottom: 2em;
    padding-top: 1em;
}
 .container .row {
     display: flex;
     flex-direction: column;
     width: 25em;
}
 .margin {
    margin-bottom: 2em;
}
 .right {
     text-align: right;
}
 .grey {
     background-color: #f6f6f6;
}
 .border-top {
     border-top: 1px solid #e2e2e2;
}
 .border-bottom {
     border-bottom: 1px solid #e2e2e2;
}
 .container .row span{
     padding-bottom: 12px;
}
 .container .row span a {
     color: #2c2c2c;
     text-decoration: underline;
}
 .container .row span a:hover {
     color: #000000;
}
 .container .iframe-container {
     width: 50em;
     height: 20em;
}
 .container .iframe-container iframe {
     width: 100%;
     height: 100%;
}
 .footer {
     width: 100%;
     background: black;
     height: 4em;
     color: #ffffff;
}
 .footer .footer-title {
     text-align: right;
     padding: 22px;
     font-size: 0.8em;
}
 .cta {
     width: 50em;
     background-color: #000;
     color: #fff;
     font-size: 18px;
     font-weight: 700;
     text-align: center;
     height: 48px;
     padding: 10px;
    -webkit-box-shadow: 1px 1px 14px -4px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 14px -4px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 14px -4px rgba(0,0,0,0.2);
}
 .cta:hover {
     background-color: #fff;
     color: #000;
     border: 1px solid #000;
     padding: 8px;
}
 @media (min-width: 320px) and (max-width: 999px) {
     .menu-pane-header {
         height: 8em;
    }
     .menu-icon {
         font-size: 4em;
    }
     .menu-pane-list {
        top: 2.5em;
        width: 100%;
        font-size: 3em;
    }
     .menu-pane-list-element {
         padding: 40px 40px 40px 20px;
    }
     .page-container {
         font-size: xx-large;
         width: 100%;
    }
    .container {
        width: 90%;
        margin: 0 auto;
    }
     .cta {
         font-size: xxx-large;
         height: 105px;
         width: 19em;
    }
     .footer {
         height: 8em;
    }
     .footer .footer-title {
         font-size: 1.8em;
         padding: 36px;
    }
    .title-container {
        font-size: xxx-large;
    }
}
