/** Aikioniemi.fi CSS **/
/** **/
/**	Author: Juha Aikioniemi **/
/**	Responsive front page for http://aikioniemi.fi **/
/** **/

body {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-size: 0.9em;
	line-height: 1.6em;
	background-color: #222;
	color: #FFF2C7;
	font-family: 'Bitter', serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility !important;
	-webkit-font-smoothing: antialiased !important;
}
a {
	text-decoration:none;
	color:#BF2B0A;
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

a:hover {
	color:#FFF2C7;
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

h1,h2,h3,h4,h5,h6 {
	font-family:'Berkshire Swash',cursive;
	font-weight: 700;
	color: #BF2B0A;
	font-size: 10em;
	line-height: 100%;
	margin: 0 0 10px 0;
	padding: 0;
}
h2 {
	font-family: 'Bitter', serif;
	font-size: 1.2em;
	line-height: 1.2em;
	margin: 5px 0 3px 0;
}

p {
	margin: 0 0 1em 0;
	padding: 0;
}

#container {
	margin: auto;
	text-align: center;
}

#content {
	margin: auto;
	max-width: 750px;
	padding: 0 4em 0 4em;
}

#header {
	margin: 12% 0 0 0;
	padding: 0 4em 0 4em;
	text-align:center;
}

.nav {
	font-size:1em;
	text-align:center;
}

.button {
	display: inline-block;
	padding: 0.6em 1em 0.6em 1em;
	border-radius:4px;
	background-color:#000;	
	margin: 0.5em;
	text-align:center;
}

.hide {
	display: none; visibility: hidden;
}

.info {
	visibility: hidden; font-size: 0.6em;
}

.info:hover {
	visibility: show;
}
.row {
	clear: both;
	text-align: left;
}
.left {
	float: left;
	width: 45%;
}
.right {
	float: right;
	width: 45%;
}

@media (max-width: 1400px ) {
	#header h1 {
		font-size: 7em;
	}
	#header {
		margin: 15% 0 0 0;
	}
}

@media (max-width: 1175px ) {
	#header h1 {
		font-size: 5em;
	}
	#header {
		margin: 20% 0 0 0;
		padding: 0 3em 0 3em;
	}
}

@media (max-width: 640px ) {
	#header h1 {
		font-size: 4em;
	}
	#header {
		margin: 25% 0 0 0;
		padding: 0 1em 0 1em;
	}
	.left, .right {
		clear: both;
		width: 100%;
	}
}

@media (max-width: 420px ) {
	#header h1 {
		font-size: 3em;
	}
	#header {
		margin: 20% 0 0 0;
		padding: 0;
	}
	p {
		font-size: 0.8em;
	}
}

@media (max-width: 420px ) {
	#header h1 {
		font-size: 3em;
	}
	#header {
		margin: 15% 0 0 0;
		padding: 0;
	}
	#content {
	margin: auto;
	padding: 0 1em 0 1em;
	}
	
}