html{
	background-color: rgb(95, 114, 93);
    text-align: center;
}

body {
	background-color: rgb(95, 114, 93);
    text-align: center;
    padding: 30px;
	margin: 60px;
	height: 100%;

	border: 5px rgb(66, 78, 63) solid;
    border-radius: 20px;
	box-shadow: rgb(255, 255, 255) 0px 0px 30px;

	background-color: rgb(211, 217, 189);
}

header {	/* tital */
	font-family: Verdana;
    font-size: 42px;
	font-weight: bolder;
    color: rgb(211, 217, 189);
    
    padding: 10px;
	margin: 10px;
    
	border-radius: 20px;
	
    background-color: rgb(69, 96, 75);
}

article {	/* text */
    font-size: 20px;
    color: rgb(69, 96, 75);

	margin: 10px;
    padding: 10px;
    
	border: 5px rgb(69, 96, 75) solid;
	border-radius: 20px;

	background-color: rgb(211, 217, 189);
}

footer {	/* special text */
	font-size: 16px;
	font-family: Times;
    color: rgb(179, 136, 73);

    padding: 10px;
	margin: 0px auto;
}

.button {
	font-family: Verdana;
	font-size: 24px;
	font-weight: bolder;
	text-decoration: none;

	border-radius: 15px;
	border: none;

	cursor: pointer;
}

.box {
	margin: auto;
    padding: 10px;
	max-width: 1000px;
	height: auto;

	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: space-between;
}
	.box article {
		font-size: 18px;
		max-width: 450px;
    	padding-bottom: 10px;
	}
	#fire {
		color: rgb(156, 56, 34);
		border: 5px rgb(156, 56, 34) solid;
		background-color: rgb(237, 200, 194);
	}
		#fire .button {
			color: rgb(237, 200, 194);
			background-color: rgb(156, 56, 34);
		}
		#fire .button:hover {
			color: rgb(156, 56, 34);
			border: 5px rgb(156, 56, 34) solid;
			background-color: rgb(237, 200, 194);
		}

	#water {
		color: rgb(34, 123, 156);
		border: 5px rgb(34, 123, 156) solid;
		background-color: rgb(194, 226, 237);
	}
		#water .button {
			color: rgb(194, 226, 237);
			background-color: rgb(34, 123, 156);
		}
		#water .button:hover {
			color: rgb(34, 123, 156);
			border: 5px rgb(34, 123, 156) solid;
			background-color: rgb(194, 226, 237);
		}
	#air {
		color: rgb(34, 156, 148);
		border: 5px rgb(34, 156, 148) solid;
		background-color: rgb(210, 238, 236);
	}
		#air .button {
			color: rgb(210, 238, 236);
			background-color: rgb(34, 156, 148);
		}
		#air .button:hover {
			color: rgb(34, 156, 148);
			border: 5px rgb(34, 156, 148) solid;
			background-color: rgb(210, 238, 236);
		}
	#earth {
		color: rgb(129, 96, 56);
		border: 5px rgb(129, 96, 56) solid;
		background-color: rgb(231, 218, 199);
	}
		#earth .button {
			color: rgb(231, 218, 199);
			background-color: rgb(129, 96, 56);
		}
		#earth .button:hover {
			color: rgb(129, 96, 56);
			border: 5px rgb(129, 96, 56) solid;
			background-color: rgb(231, 218, 199);
		}