::selection {
	color: #fff;
	background: #075c97;
}

html,
body {
	width: 100%;
	height: 100%;
}

body {
	font: 1em/1.5em "Lato", "Open Sans", Helvetica, Arial, sans-serif;
	font-weight: 200;
	color: #313131;
	background: #fff;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	-webkit-font-smoothing: antialiased;
}

.wrapper {}

.clear {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}

.left {float: left;}
.block {display: block;}

a {color: #3c3c3c;}
a:hover {color: #3C3B34;}

h1, h2, h4, h5, h6 {
	font: 1.125em/1.2em "Lato", "Open Sans", Helvetica, Arial, sans-serif;
	font-weight: 500;
	padding-bottom: 3px;
	text-transform: uppercase;
	color: #313131;
}

h1 {font-size: 3em; font-weight: 900;}
h2 {font-size: 1.2em;}

/* Fonts
----------------------------------------------------------------------------- Fonts */

@font-face {
	font-family: 'Lato';
	src: url('../font/lato-regular-webfont.eot');
	src: url('../font/lato-regular-webfont.eot?#iefix') format('embedded-opentype'),
	url('../font/lato-regular-webfont.woff') format('woff'),
	url('../font/lato-regular-webfont.ttf') format('truetype'),
	url('../font/lato-regular-webfont.svg#meta_problack') format('svg');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Lato';
	src: url('../font/lato-heavy-webfont.eot');
	src: url('../font/lato-heavy-webfont.eot?#iefix') format('embedded-opentype'),
	url('../font/lato-heavy-webfont.woff') format('woff'),
	url('../font/lato-heavy-webfont.ttf') format('truetype'),
	url('../font/lato-heavy-webfont.svg#meta_problack') format('svg');
	font-weight: 900;
	font-style: normal;
}

/* Content
----------------------------------------------------------------------------- Content */
.box-header {
	width: 10%;
	background: #393636;
	height: 100%;
	position: fixed;
}

.box-header a {
	color: #fff;
	text-decoration: none;
}

#header {height: 100%;}
.box-header .logo {height: 40%;background: #383434;}
.box-header .logo a:hover{background: #322e2e;}
.box-header .logo a {padding: 0;display: block;height: 100%;text-align: center;}
.box-header .logo img {position: relative; top: 50%;}
.box-header div { height:50px;border-top: 1px solid #353131;}
.box-header div a {padding: 13px 0 13px 10px;display: block;}
.box-header div a:hover {background: #fff;color:#393636;transition: ease-out 200ms;}

.box-content {width: 90%;padding-left: 10%;min-height: 90%;}
#content {padding: 40px 0 0 40px;}
.box-footer {width: 100%;text-align: right;position: static;height: 60px;bottom: 0;}
.box-footer > p {right: 20px;padding-top: 20px;bottom: 20px;}

h2 > a {line-height: 1.4em;color: #42AA6C;text-decoration: none; border-bottom: 1px solid rgba(66, 170, 108, 0.5);transition: ease-out 200ms;}
h2 > a:hover {color: #393636;border-color: rgba(57, 54, 54, 0.5);}

.table-list {width: 450px;padding-top: 40px; }
.table-heading {border-bottom: 1px solid rgba(59, 55, 55, 0.5);font-weight: 900;}
.table-site {padding: 3px 0;font-size: 0.85em}
.table-site:hover {background: rgba(232, 255, 243, 1);}
.table-site a {color: #42AA6C;text-decoration: none; border-bottom: 1px solid rgba(66, 170, 108, 0.5);transition: ease-out 200ms;}
.table-site a:hover {color: #393636;border-color: rgba(57, 54, 54, 0.5);}
.table-site .heading-two {padding-left: 15px;width: 45px;}
.heading-one {width: 380px;display: inline-block;}
.heading-two {width: 60px;display: inline-block;}

.table-site .heading-one a {margin-left: 4px;}

@media only screen and (max-width: 1200px) {
	.box-header {width: 20%}
	.box-content {width: 80%;padding-left: 20%;}
	.box-footer {position: static;}
	.box-footer > p {bottom: auto;}
}

@media only screen and (max-width: 700px) {
	h1 {font-size: 2em;}
	h2 {font-size: 0.8em;	}
	.box-header div{font-size: 0.8em;	}
	.heading-one {width: 120px;}
	.table-list {width: 190px;}
	.box-header {width: 30%}
	.box-content {width: 70%;padding-left: 30%;}
}

@media only screen and (max-width: 350px) {
	h1 {font-size: 1.5em;}
	h2 {font-size: 0.7em;	}
	.box-header div{font-size: 0.6em;	}
	.heading-one {width: 120px;}
	.box-header .logo {height: 20%;}
	.box-header .logo img {width: 70px;}
	#content {padding-left: 10px}
}