/* --- HEX LINKS --- */


#hexcontainer {
	position:relative;
	margin:40px 0;
	
	text-align:center
}

.hex1, .hex2 {
	position:relative;
	display:inline-block;
	height:220px;
	width:190px;
	overflow:hidden;
}

.hex1 {
	-webkit-transform:rotate(60deg);
	-moz-transform:rotate(60deg);
	-ms-transform:rotate(60deg);
	-o-transform:rotate(60deg);
	transform:rotate(60deg);
	margin:-20px 10px;
}

.hex2 {
	-webkit-transform:rotate(60deg);
	-moz-transform:rotate(60deg);
	-ms-transform:rotate(60deg);
	-o-transform:rotate(60deg);
	transform:rotate(60deg);
}

.hexlink {
	-webkit-transform:rotate(-120deg);
	-moz-transform:rotate(-120deg);
	-ms-transform:rotate(-120deg);
	-o-transform:rotate(-120deg);
	transform:rotate(-120deg);
	position:relative;
	display:inline-block;
	text-decoration:none;
	height:220px;
	width:190px;
	background-position:center center;
	background-size:cover;
	background:#ffc400;
}

.hexlink:hover{background:#0c355d;}
.hexlink:hover h3{color:#fff;}


/* --- OVERLAY --- */




.hexlink h3 {
	position:absolute;
	top:50%;
	-webkit-transform:translateY(-50%);
	-moz-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	-o-transform:translateY(-50%);
	transform:translateY(-50%);
	width:100%;
	margin:0;
	
	
	
	font-size:16px;
	font-weight:normal;
	word-spacing:5px;
	color:#000;
	cursor:pointer;
	opacity:1;
}