body{
	background-color: #333;
	font-family: "Goudy Old Style";
	margin: 0px 2% 0px 2%;

}	

/*This section is for the menu bar*/
ul {
	position: sticky;
	position: -webkit-sticky; /*safari*/
	top: 0;
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #333;
}
	
li {
	float: right;
}
		
li a {
	display: block;
	color: white;
	text-align: center;
	padding: 10px 15px;
	text-decoration: none;
}

li a:hover {
	background-color: #111;
}

/*start of column coding */
 *{
    box-sizing: border-box;
}

/* Style the header */
.header {
    background-color: #f1f1f1;
    padding: 30px;
    text-align: center;
    font-size: 35px;  	
}

/* Create two unequal columns that floats next to each other */
.column {
	float: left;
   padding: 30px;
	width: 33.33%;
}

/* Leftcolumn */
.column.left {
	width: 40%;
	padding-left: 10%;
	padding-top: 0px;
}

/* Right column */
.column.right {
   width: 50%;
	float: right;
	padding-right: 10%
}

/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

/* Style the footer */
.footer {
    background-color: rgb(207,28,68);
    padding: 0px;
    text-align: center;
	 border-color: #333;
	 color: white;
	 
}

@media (max-width: 800px) {
   .column.right, .column.left {
        width: 100%;
	}
}
/* tables created for the footer*/
.col-container {
   display: flex; 
   width: 100%; 

}

.col {
   flex: 1; 
	padding: 16px;

}
@media only screen and (max-width: 800px) {
    .col { 
        display: block;
        width: 100%;
    }
}