html{
     scroll-behavior: smooth; 
}

body{
    background-color: #FFFFCC;
    font-family: "Lucida Sans Unicode";
}

img{
    max-width: 100%;
	border: 0;
}
table{
	width: 100%;
	border-collapse: collapse;
}


.auto-style1 {
	font-family: "Lucida Sans Unicode";
}
.auto-style2 {
	font-size: x-small;
}
.header{
	background-color: #73fa6b;
	color: #000;
	font-size: 2.5rem;
	text-shadow: 3px 3px 10px rgba(0,0,0,0.3);
	display: grid;
	justify-content: center;
	align-content: center;
	max-width: 800px;
	margin: 0.5rem auto;
	padding: 0.5rem;
	text-align: center;
	line-height: 1;
}
td{
	vertical-align: top;
}
.mainpicture{
	display: grid;
	gap: 1rem; 
	margin: 1rem auto;
	max-width: 600px;
}


@media only screen and ( max-width: 640px ) {
td, th{
	display: block;
	width: unset !important;
}
} 



@media only screen and ( min-width: 641px ) {

.mainpicture{
	grid-template-columns: auto auto;
}

}