* {
box-sizing: border-box;
}
html {
background-image: url("Skyline.jpg");
background-size:cover;
width: 100%;
height: fit-content;
background-repeat: no-repeat;
}
body {
font-family: Georgia, 'Times New Roman', Times, serif;
}
.title{
height: 81px;
width: 559.75px;
}
/*Inside 1st Column*/
/* Container for flexboxes*/
.row {
display: -webkit-flex;
display: flex;
}
/* Create three equal columns that sits next to each other */
.column {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
padding: .2rem;
color: rgb(0,0,0);
}
.column1 {
padding: 0rem;
}
.column2 {
padding: 0rem;
}
.column3 {
padding: 0rem;
}
/*Inside second Column. Buttons for choices*/
/*Inside the 3rd column*/
/* Style the footer */


/*BUTTONS For navigating between webpages*/
.button {
display: block;
padding: 0.25rem 0.25rem;
margin: 0.25rem;
font-size: .9rem;
font-weight: 600;
text-decoration: none;
cursor: pointer;
text-align: center;
color: rgb(250, 250, 250);
background-color: rgb(0, 26, 255);
width: 8rem;
height: 2rem;
opacity: 1;
transition: 0.3s;
border: .1rem solid rgba(250,250,250,.5);
}
.button:hover {
opacity: .6;
font-weight: 900;
}
.button:active {
background-color: rgb(250, 250, 250);
color: rgb(0,0,0);
transform: translateY(3px);
}
.button[disabled]:hover {
cursor: not-allowed;
transform: none;
}

footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: rgba(0, 0, 0, 0.4);
text-align: center;
color: rgb(250,250,250);
font-weight: 900;
padding: .5rem;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 600px) {
.row {
-webkit-flex-direction: column;
flex-direction: column;
padding-bottom: 25%;
margin-bottom: 50%;
}
/*BUTTONS For navigating between webpages*/
.button {
font-size: .9rem;
font-weight: 600;
width: 6rem;
height: 1.5rem;
}
.title{
width: 279.875px;
height: 40.5px;}
}
@media (max-width: 600px) {
.column1 {
padding-bottom: 25%;
margin-bottom: 50%;

}
}