.gallery ul {
	list-style: none;
    padding-left: 0;
    list-style-position: inside;
	margin: 0;
	border: 0;
	padding:; 0;
}

.gallery ul li {
	display: inline-block;
	margin: 0 1px 10px 1px;
	padding 0;
	border: 1px solid black;
}

.gallery img ul li img {
	width: 250px;
	height: 250px;
	padding-bottom: 0;
}

.gallery ul li span {
	display: block;
	margin: 0 1px 0 1px;
	padding-bottom: 10px;
	padding-top: 0;
}

.gallery ul li a {
	color: black;
	font-size: 12px;
}

.fade {
   opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

.fade:hover {
	opacity: 0.5;
}

#fernModal {
 	width: 780px;
 	height: 800px;
}

.modal {
 	border: 1px solid black;
 	margin: 5px;
 	max-width: 100%;
  	max-height: 100%;
 	position: fixed;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	z-index: 1010;
  	background: white;
}

.modal .header {
  	padding: 10px;
  	border-bottom: 1px solid black;
}

.modal .header a.close {
 	text-decoration: none;
 	color: black;
}

.modal .header div:nth-child(2) {
   	font-size: 25px;
}

#fernModal .header div:nth-child(3) {
   	font-size: 15px;
}

.modal .body {
  	padding: 10px;
}

#fernModal .body div div {
  	display: inline-block;
  	top: 0; 
    vertical-align:top;
  	margin-bottom: 10px;
}

#fernModal .body div:nth-child(1) div:nth-child(1) {
  	width: 500px;
}

#fernModal .body div:nth-child(1) div:nth-child(2) {
  	width: 250px;
}

#fernModal .body div:nth-child(2) div:nth-child(1) {
  	padding-right: 10px;
}

#contactModal label {
	display: block;
}