@import url(fonts.css);

@font-face {
	font-family: Champagne;
	src: url('fonts/Champagne.ttf') format('truetype');
}

@font-face {
    font-family: LemonMilk;
    src: url('fonts/LemonMilk.otf') format('opentype');
}

@font-face {
	font-family: GeosansLight;
	src: url('fonts/GeosansLight.ttf') format('truetype');
}

@font-face {
	font-family: CodeBold;
	src: url('fonts/CodeBold.otf') format('truetype');
}

@font-face {
    font-family: Opificio;
    src: url('fonts/Opificio.ttf') format('opentype');
}

body {
	font-family: GeosansLight;
	font-weight: bold;
	background-image: linear-gradient(to bottom right, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.9) 100%), url("images/background.gif");
    background-repeat: no-repeat;
	background-size: cover;
   /* background-color: lightblue;*/
	text-align : center;
}

table {
	font-size: 1.5em;
	margin: auto;
	width: 85%;
	border-collapse: collapse;
}

td,tr {
	border : 1px solid black;
	width: 25%;
	background-color : rgba(169,208,245,0.3)
}

.myTable td:hover {
	background-color: #F3E2A9;
	border: 2px solid rgba(255,191,0,1);
	/*width: 33%; */
}

img {
	padding-top: 8px;
}

td {
	padding: 15px;
}

h1{
	font-size: 3em;
	font-family: LemonMilk;
	text-align: center;
}

h2{
	font-family: CodeBold;
	font-size: 2em;
	background-color: rgba(255,191,0,1);
	width: 85%;
	margin: auto;
	margin-bottom: 1em;
	margin-top: 1em;
	padding : 0.2em;
}