header {
	display: flex;
	width: 100%;
	background-color: #000000;
	text-align: center;
}

body {
	background-color: #000000;
	color: #aeffff;
	font-family: 'Times New Roman', Times, serif;
	text-align: center;
}


h1 {
	color: #4B0082;
	text-size: 75%;
	text-align: center;
	font-family: 'Bradley Hand', cursive;
	font-weight: italic;
}


h2 {
	color: #66ccff;
	text-align: center;
	font-family: 'Bradley Hand', cursive;
	font-weight: bold;
}


p {
	padding: 20 px;
	color: #aeffff;
	text-align: center;
	font-family: 'Times New Roman', Times, serif;
	font-weight: normal;
}


.menu {
	width: 25%;
	float: left;
	background-color: Indigo;
	border: 1px dashed;
	padding: 10px 20px;
	text-align: center;
	font-size: 16px;
	cursor: pointer;
}


.row {
	display: flex;
	flex-wrap: wrap;
	padding: 10px 20px;
	text-align: center;
}

/* Create four equal columns that sits next to each other */
.column {
	flex: 25%;
	max-width: 25%;
	padding: 10 20px;
	color: #aeffff;
	font-family: 'Times New Roman', Times, serif;
 	border: 1px dashed DarkMagenta;
	color: PaleTurquoise;
	text-align: center;
	font-family: 'Times New Roman', Times, serif;
	font-weight: normal;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-right: 20px;
	margin-left: 20px;
	clear: both;
}

.column img {
	margin-top: 20px;
	margin-bottom: 20px;
	margin-right: 20px;
	margin-left: 20px;
	vertical-align: center;
	width: 100%;
}


a:link {
	color: #d8bfd8;
	text-align: center;
}


a:visited {
	color: #9999ff;
	text-align: center;
}


a:hover {
	color: #00ff00;
	text-align: center;
}


button {
	text-align: center;
	
}


button1 {
	display: flex;
	background-color: Indigo;
	border: 1px dashed white;
	padding: 10px 20px;
	text-align: center;
	font-size: 16px;
}



/* for mobiles */
[class*=col-"] {
Width: 100%;
}

a:

@media only screen and (min-width: 600px) {
/* for tablets */
.col-s-1 {width: 8.33%;}
.col-s-2 {width: 16.66%;}
.col-s-3 {width: 25%;}
.col-s-4 {width: 33.33%;}
.col-s-5 {width: 41.66%;}
.col-s-6 {width: 50%;}
.col-s-7 {width: 58.33%;}
.col-s-8 {width: 66.66%;}
.col-s-9 {width: 75%;}
.col-s-10 {width: 83.33%;}
.col-s-11 {width: 91.66%;}
.col-s-12 {width: 100%;}
}


@media only screen and (min-width: 768px) {
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
}