/* CSS Document */

@font-face {
	font-family: 'Cantarell-Regular';
	src: url('fonts/Cantarell-Regular-webfont.eot');
	src: local('?'), 
	url('fonts/Cantarell-Regular-webfont.woff') format('woff'), 
	url('fonts/Cantarell-Regular-webfont.ttf') format('truetype'), 
	url('fonts/Cantarell-Regular-webfont.svg#webfontnDp1DDKc') format('svg');
	font-weight: normal;
	font-style: normal;
}

* {margin:0; padding:0;}
  
html,body {
	background-color: #ffffff;
	height: 100%;
	width: 100%;
	font-family:"'Cantarell-Regular";
	font: 16px 'Cantarell-Regular', Arial, sans-serif;
}

a {outline: none;}
div {position: relative;}

#mainDiv {
	width: 100%;
	height: 100%;
}

#mainDiv div.centerDiv {
	width: 80%;
	height: 100%; 
	margin: 0px auto;
} 

.centerDiv {
	top:0px;
	left:0px;
	height: 100%;
}

.titleSpace{
	width: 100%;
	height: 20%;
	top: 0;
	left: 0;
}

.title{
	width: 100%;
	top: 0;
	left: 0;
	color: #58595b;
	text-align: center;
	font-variant: small-caps;
}
.line{
	width: 100%;
	height: 1px;
	top: 0;
	left: 0;
	border-bottom: 1px solid black;
	font-size:0px;
}

.link1, .link2 {}

.spaceHolder{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.nameHolder{
	position:absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}
.name1, .name2 {}

a:link{text-decoration: none; font-size: 1.25em;}
a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
a:active{text-decoration: none;}

a.nameLinks:link .name1, a.nameLinks:link .name2 {color: #42a4ae;}
a.nameLinks:visited .name1, a.nameLinks:visited .name2 {color: #42a4ae;}
a.nameLinks:hover .name1, a.nameLinks:hover .name2 {color: #42a4ae;}
a.nameLinks:active .name1, a.nameLinks:active .name2 {color: #42a4ae;}

a.nameLinks span{color: #000000; visibility: hidden; font-size: .571em;}
a.nameLinks:visited span{color: #000000; visibility: hidden;}
a.nameLinks:hover span{color: #000000; visibility: visible;}
a.nameLinks:active span{color: #000000; visibility: visible;}

@media screen and (max-width: 39em) {
	.title{font-size: 1.875em;}
	.link1, .link2 {
		width: 100%;
		min-height: 5em;
		height: 21%;
		text-align: center;
	}
	.name1, .name2 {margin: 0;}
}
@media screen and (min-width: 39.0625em) {
	.titleSpace{height: 25%;}
	.title{font-size: 3.5em;}
	.link1, .link2 {
		width: 49%;
		min-height: 12em;
		height: 21%;
	}
	.link1 {
		float: left;
		text-align: right;
	}
	.link2 {
		float: left;
		text-align: left;
	}
	.name1{margin-right: 9.375%;}
	.name2{margin-left: 9.375%;}
	a:link{text-decoration: none; font-size: 2em;}
}
@media screen and (max-device-width: 64em) {
	.titleSpace{height: 20%;}
	.title{font-size: 1.875em;}
	.link1, .link2 {min-height: 5em;}
	a:link{text-decoration: none; font-size: 1.25em;}
    a.nameLinks span{color: #000000; visibility: visible; font-size: .571em;}
	a.nameLinks:visited span{color: #000000; visibility: visible;}
}