<!DOCTYPE html>
<html>
<head>
<style>
.p1 {
  font-family: "Times New Roman", Times, serif;
}

.p2 {
  font-family: Arial, Helvetica, sans-serif;
}

.p3 {
  font-family: "Lucida Console", "Courier New", monospace;
}

.p4
{
  font-family: Arial, sans-serif;
}

#wrapper{
	display: block;
	margin-bottom: 100px;
}

.button.one:before, a.button.one:after{
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;
	transition: all 0.3s ease;
}
.button.one:before{
	top: -2.5%;
	left: -1%;
	border-top: 2px solid white;
	border-left: 2px solid white;
}
.button.one:after{
	bottom: -2.5%;
	right: -1%;
	border-bottom: 2px solid white;
	border-right: 2px solid white;
}
.button.one:hover:before, a.button.one:hover:after{
	width: 100%;
	height: 100%;
	transition: all 0.3s ease;
}
</style>
</head>
