@charset "UTF-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,700,800);    
 /* Basic reset and full height setup */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;
}
    
    h1{
        font-size: 20px;
        line-height: 50px;
        margin: 0px 0px 50px 0px;
        font-family: 'Open Sans', Arial, "sans-serif";
  font-weight: 700;
    }
    
        h2{
        font-size: 50px;
        line-height: 50px;
        margin: 0px 0px 50px 0px;
        font-family: 'Open Sans', Arial, "sans-serif";
  font-weight: 300;
    }
    
        p{
        font-size: 12px;
        line-height: 16px;
        margin: 0px 0px 5px 0px;
        font-family: 'Open Sans', Arial, "sans-serif";
  font-weight: 400;
    }

/* 
  1. Main container for the whole page 
  Uses Flexbox to arrange content vertically (logo area and footer)
*/
.page-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Ensures the container is at least the full height of the viewport */
}

/* 
  2. Content wrapper for the main logo area 
  'flex-grow: 1' makes this container take up all available space between the top and the footer
*/
.content-wrap {
    flex-grow: 1; 
    display: flex;
    justify-content: center; /* Horizontally centers the logo inside this container */
    align-items: center;     /* Vertically centers the logo inside this container */
    flex-direction: column;
}

/* 
  3. Styles for the logo image itself
*/
.center-logo {
    max-width: 100%; /* Ensures the logo scales down if the screen is small */
    height: auto;
    /* Optional: add some constraints to the logo size */
    width: 300px; 
    height: 100px;
}

/* 
  4. Styles for the footer
*/
.site-footer {
    background-color: #007cbf; /* Dark background for visibility */
    color: white;
    padding: 20px 0; /* Some padding top and bottom */
    width: 100%;
}
    
    .footer-content{
        max-width: 950px;
        margin: 0 auto;
        text-align: left;
        padding: 15px;
    }
