* {box-sizing: border-box;}

body {background-image: url(images/sg.jpg);
background-repeat: no-repeat;
background-attachment: fixed;}

header { color: white;
font-weight: bold;
font-size: 42pt;
padding-left: 375px;
animation: test 3s;
}
h1 {
    color: white;
    text-shadow: 4px 4px 6px #000000;
    animation: test 3s;
  }
.stainedglass {
height: 300px;
        margin-left:170px;
        margin-top: 40px;
        font-size:36pt;
        animation: test 3s;
        }
        @keyframes test {
          from { 
              transform: scale(2);}
          to {
              transform: scale(1);}
          }

        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            width: 110px;
            background-color: #f1f1f1;
          }
          
          li a {
            display: block;
            color: #000;
            padding: 8px 16px;
            text-decoration: none;
          }
          
          /* Change the link color on hover */
          li a:hover {
            background-color: #555;
            color: white;
          }

nav {float: left;
    color: white;
font-weight: bold;
font-size: 18pt;
width:100px;}
nav a{ text-decoration: none;}
nav a:link {animation: testc 2s infinite ease;
    animation-direction: alternate;}
nav a:visited {color:#f800c2;}
nav a:hover {color: #1a1919;
    transition: color .5s linear;}
@keyframes testc {
    from {color: #1a1919; } 
    to
        {color: #f800c2;}
    }
    h2 {text-align: center;
      color: white;
      text-shadow: 4px 4px 6px #000000;
    }

 .body {font-size: 18pt;
    float:right;
    margin-right: 600px;
        background-color: lightgrey;
        width: 800px;
        height: 1400px;
        border: 5px solid rgb(90, 87, 87);
       padding:40px;
      }

      .content  {font-size: 18pt;
        float:right;
        margin-right: 600px;
            background-color: lightgrey;
            width: 800px;
            height: 1000px;
            border: 5px solid rgb(90, 87, 87);
           padding:40px;
          }

      .body2 {font-size: 14pt;
        float:right;
        margin-right: 600px;
            background-color: lightgrey;
            width: 800px;
            height: 1500px;
            border: 5px solid rgb(90, 87, 87);
            padding:40px;
          }

          .body3 {font-size: 14pt;
            float:right;
            margin-right: 600px;
                background-color: lightgrey;
                width: 1100px;
                height: 1500px;
                border: 5px solid rgb(90, 87, 87);
                padding:10px;
              }

              .flex-container {
                float:right;
                margin-right: 300px;
                display:flex;
                background-color: lightgrey;
                border: 5px solid rgb(90, 87, 87);
                width:1200px;
                height: 1500px;
                flex-wrap: wrap;
                padding:30px;
                }

                img {padding-left: 200px;}
     
      .hcup {padding-left:5px;}

      .hcup2 {padding-left: 150px;}

      .hcup3 {padding-left: 150px;}
  
      .forms {text-align: center;
        font-size: 18pt;
        float:right;
        margin-right: 600px;
            background-color: lightgrey;
            width: 800px;
            height: 800px;
            border: 5px solid rgb(90, 87, 87);
           padding:40px;
          }
.results {color:black;
  text-align: center;
  font-size: 18pt;
  float:right;
  margin-right: 600px;
      background-color: lightgrey;
  width: 800px;
  height: 800px;
  border: 5px solid rgb(90, 87, 87);
  padding:40px;
}

.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: rgb(0, 0, 0);
   color: white;
   text-align: left;
}