/*
	Name: Smashing HTML5
	Date: July 2009
	Description: Sample layout for HTML5 and CSS3 goodness.
	Version: 1.0
	Author: Enrique Ramírez
	Autor URI: http://enrique-ramirez.com
*/

/* Imports */
/* @import url("reset.css");
@import url("global-forms.css");*/

/***** Global *****/
/* Body */
body {
	background: #606060;
	color: #FFFFFF;
	font-size: 87.5%;
	font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	line-height: 1.429;
	margin: 0;
	padding: 0;
	text-align: left;
}

/* Headings */
h2 {font-size: 1.571em}	/* 22px */
h3 {font-size: 1.429em}	/* 20px */
h4 {font-size: 1.286em}	/* 18px */
h5 {font-size: 1.143em}	/* 16px */
h6 {font-size: 1em}	/* 14px */

h2, h3, h4, h5, h6 {
	font-weight: 400;
	line-height: 1.1;
	margin-bottom: .8em;
}

/* Anchors */
a {outline: 0;}
a img {border: 0px; text-decoration: none;}
a:link, a:visited {
	color: #606060;
	padding: 0 1px;
	text-decoration: none;
	font-weight: bold;
}
a:hover, a:active {
	background-color: #fff;
	color: #98ea55;
	text-decoration: none;
	/*text-shadow: 1px 1px 1px #333;*/
}

/* Paragraphs */
p {margin-bottom: 1.143em;}
* p:last-child {margin-bottom: 0;}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

::-moz-selection {background: #51a0f0; color: #fff;}
::selection {background: #51a0f0; color: #fff;}

/* Lists */
ul {
	list-style: outside disc;
	margin: 1em 0 1.5em 1.5em;
}

ol {
	list-style: outside decimal;
	margin: 1em 0 1.5em 1.5em;
}

dl {margin: 0 0 1.5em 0;}
dt {font-weight: bold;}
dd {margin-left: 1.5em;}

/* Quotes */
blockquote {font-style: italic;}
cite {}

q {}

/* Tables */
table {margin: .5em auto 1.5em auto; width: 98%;}

	/* Thead */
	thead th {padding: .5em .4em; text-align: left;}
	thead td {}

	/* Tbody */
	tbody td {padding: .5em .4em;}
	tbody th {}

	tbody .alt td {}
	tbody .alt th {}

	/* Tfoot */
	tfoot th {}
	tfoot td {}

/* HTML5 tags */
header, navi, section; logo {
		display: block;
}

/***** Layout *****/
.home {clear: both; margin: 0 auto; min-width: 1000px;}
.body {clear: both; margin: 0 auto; width: 800px;}
img.right figure.right {float: right; margin: 0 0 2em 2em;}
img.left, figure.left {float: right; margin: 0 0 2em 2em;}

@font-face {
    font-family: 'depthcorepublicRegular';
    src: url('font/depthcore-webfont.eot');
    src: url('font/depthcore-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/depthcore-webfont.woff') format('woff'),
         url('font/depthcore-webfont.ttf') format('truetype'),
         url('font/depthcore-webfont.svg#depthcorepublicRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DistroBold';
    src: url('font/distrob_-webfont.eot');
    src: url('font/distrob_-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/distrob_-webfont.woff') format('woff'),
         url('font/distrob_-webfont.ttf') format('truetype'),
         url('font/distrob_-webfont.svg#DistroBold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*
	Header
*****************/
#banner {
	margin: 0 auto;
	padding: 2.5em 0 0 0;
	width: 350px;
	overflow: hidden;
}

logo {
	font-size: 6em;
	line-height: .3;
	font-family: 'depthcorepublicRegular';
	margin: 0 0 0 30px;
	z-index: 1000;
	float: left;
	width: 300px;
}

logo a:link, logo a:visited {
	color: #98ea55;
	display: block;
	font-weight: bold;
	/*margin: 0 0 .6em .2em;*/
	text-decoration: none;
}
logo a:hover, logo a:active {
	background: none;
	color: #93e353;
	text-shadow: none;
}

logo .text {
	color: #000;
	position: relative;
	left: -230px;
	top: -24px;
	font-family: 'distroBold';
}

pagename {
	float: left;
}

pagecontent {
	float: left;
	width: 50%;
	margin-top: 35px;
}

pagecontent ul li {
	list-style-type: none;
	margin-bottom: 10px;
}

pagecontent ul li.spaced {
	margin-bottom: 30px;
}

/*
	Body
*****************/
#content {
	background: #fff;
	color: #000;
	margin: 20px auto 20px;
	overflow: hidden;
	padding: 30px 30px;
	width: 800px;

	border-radius: 10px;
	box-shadow: 0px 0px 6px #333;
}
pagecontent a:link, pagecontent a:visited {
	color: #000;
}

copyright {
	color: #333;
	margin: 0 auto;
}
