html {
      overflow-y:scroll;
      overflow-x: hidden;
      scrollbar-face-color: #3E763E;
      scrollbar-highlight-color: #518451;
      scrollbar-3dlight-color: #899F89;
      scrollbar-darkshadow-color: #3A5F3A;
      scrollbar-shadow-color: #416A41;
      scrollbar-arrow-color: black;
      scrollbar-track-color: transparent;
      background-color:#568359;
      font-size: 100%;
      font-family: Georgia, 'Times New Roman', Times, serif;
      }

.page {
     width:100%;
     height:100%;
     border:0px solid black;
     background-color: black;
     left:0px;
     right:0px;
     top:0px;
     bottom:0px;    
     z-index:1;
 } 
 
img.centerX {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img.centerY {
    display: block;
    margin-top: auto;
    margin-bottom: auto;
}

	/*THIS IS THE START OF LINE 1*/

.ToplinePri { position: absolute; width:100%; height:400px; top: 0px; background-color: #FDFDE9; left: 0px; z-index: 2;}
.ToplineSec { position: absolute;  width:100%; height:400px; top:0px; background-color: #568359; left:600px; z-index: 3; text-align: left;}
.ToplineCurve{ position: absolute; width:400px; height:400px; top:0px; left:220px; z-index: 4;}

.ToplineLeft {
    position: absolute;
    width:100%;
    height:400px;
    left:0px;
    top:0px;
    z-index: 5;
}

.ToplineRight {
    position: absolute;
    width:600px;
    top:100px;
    left: 800px;
    z-index: 5;
    color:#FDFDE9;
}

.MidLine    {
        position: absolute;
        top: 400px;
        height: fit-content;
        left: 0px;
        right: 0px;
        color: white;
        z-index: 6;
    }

.BottomLine{
    position: relative;
    width:100%;
    background-color: #568359;
    color: white;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 6;
}

/* --- MOBILE RESPONSIVENESS --- */
@media screen and (max-width: 1000px) {
    .page {
        height: auto; /* Let the page grow with content */
        display: flex;
        flex-direction: column;
    }

    /* Reset all absolute lines to standard blocks */
    .ToplinePri, .ToplineSec, .ToplineLeft, .ToplineRight,.ToplineCurve,
    .MidLine, .BottomLine {
        position: relative;
        width: 100% !important;
        height: auto !important;
        left: 0 !important;
        top: 0 !important;
        padding: 20px;
        box-sizing: border-box;
    }

    /* Hide the decorative curves on mobile to save space */
    .t{
        display: none;
    }

    /* Center images and text for mobile */
    .ToplineLeft img {
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    h1 img {
        max-width: 100%;
        height: auto;
    }

    .ToplineRight, .MidLine, .BottomLine{
        text-align: center;
    }
    
    ul {
        text-align: left;
        display: inline-block;
    }
}