/* style.css */
html {
	font-family: alien;
}
body {
	background-color: #c5a582;
	font-family: alien;
		}

@font-face {
	font-family: alien;
	src: url(../font/ALIEN5.ttf);
	src: url(../font/ALIEN5.otf);
}

#index, #info, #resume, #interest, #course {
	display: inline-block;
	float: left;
	background-color: #612E35;
	padding: 10px; 
	margin: auto;
	text-align: center;
	}

#index {
	width: 28%;
	height: 300px;
	margin: 1.6%;
	background-image: url("../images/index.png");
	max-width: auto;
	max-height: auto;
	background-size: cover;
	background-repeat: no-repeat;
	
	}

#index:hover {
	width: 28%;
	background-color: #612E35;
	color: #92b5d9;
	background-image: none;
	max-width: 100%;
	max-height: 100%;
}
h1 {
	font-size: 34pt;
	visibility:hidden;
	}
h2 {
	font-size: 21pt;
	visibility:hidden;
	}
}

.text {visibility:hidden;}

#index:hover .text {visibility: visible;}
#resume:hover .text {visibility: visible;}
#interest:hover .text {visibility: visible;}
#course:hover .text {visibility: visible; font-size: 34pt;}
	
	
#info {
	width: 60.1%;
	height: 292px;
	background-color: #92b5d9;
	margin: 1.6%;
	border: 4px solid #612E35;
	overflow-y: scroll;

}
#info h3 {
	font-size: 21pt;
}
#info p {
	font-size: 16pt;
	line-height: 18pt;
}

#resume {
	width: 28%;
	height: 300px;
	margin: 1.6%;
	background-image: url("../images/resume.png");
	max-width: auto;
	max-height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	
}

#resume:hover {
	width: 28%;
	background-color: #612E35;
	color: #92b5d9;
	background-image: none;
	max-width: 100%;
	max-height: 100%;	
}
#interest {
	width: 28%;
	height: 300px;
	margin: 1.6%;
	background-image: url("../images/interest.png");
	max-width: auto;
	max-height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	}
#interest:hover {
	width: 28%;
	background-color: #612E35;
	color: #92b5d9;
	background-image: none;
	max-width: 100%;
	max-height: 100%;	
}


#course {
	width: 28%;
	height: 300px;
	margin: 1.6%;
	background-image: url("../images/course.png");
	max-width: auto;
	max-height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	
}
#course:hover {
	width: 28%;
	background-color: #612E35;
	color: #92b5d9;
	background-image: none;
	max-width: 100%;
	max-height: 100%;	
}

a:link, a:visited {
	text-decoration: none;
}