p { font-family: "Lucida Console", "Verdana", "Trebuchet MS", sans-serif }
/*p { font-family: "Georgia", "Times New Roman", serif }*/
/*best 'typewriter' font: Andale Mono*/

body { font-family: "Lucida Console", "Verdana", "Trebuchet MS", sans-serif; 
    font-size: 1em;
}

h1 { font-family: "Lucida Console";
     font-size: 2em;
}

h2 { font-family: "Georgia";
     font-size: 2em;
}

figcaption { font-family: "Georgia";
    font-size: 0.75em;
}

section {
  box-sizing: border-box;
/*  border: 1px solid blue; */
  width: 100%;
    margin-right: auto;
    margin-left: auto;
/*  float: left;*/
}

/* "Responsive two column layout" on W3Tools */
/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 31%;
    height: 350px; /*Should be removed. Only for demonstration */
    padding-left: 1%;
    padding-right: 1%;
}

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

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
}

button {
    box-shadow:0 6px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    padding:15px 32px;
}
button:hover{
    box-shadow:0 12px 16px 0 rgba(0,0,0,0.44), 0 12px 30px 0 rgba(0,0,0,0.19);
    background-color:white;
}


.centerit {
    margin: auto;
    width: 900px;
    padding:10px 20px 1px 20px;
    text-align: center;
}

.centercenter {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    border: 1px solid black;
}

.notcent {
    margin: auto;
    width: 500px;
    border: 3px solid green;
    padding:20px;
}

.image_off, #home:hover .image_on{
    display:none
}
.image_on, #home:hover .image_off{
    display:block
}