html, body {
    height: 100%;
}

#structure {
    display: flex;
	flex-direction: column;
    height: 100%;
}

#main-area {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

h2 {
	padding-top: 5em;
	font-size:1rem;
	padding-bottom: 1em;
}
h3 {
	padding-bottom: 5em;
	padding-top: 1em;
	font-size: 1rem;
}

img{
    height: auto; 
    width: 100%; 
    max-width: 500px; 
    max-height: 500px;
    margin: auto;
 }

 /* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {  
  h2 {font-size:1.5rem;}
  h3 {font-size:1.5rem;}
}
 
/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  
  h2 {font-size:2rem;} /*1rem = 16px*/
}