@charset "UTF-8";
@import url("root.animation.css");
@import url("fonts/onefont.css");

/*  SOME RIGHT RESERVED - Creative Commons Attribution-Share Alike 2.0 Belgium License   */
/*  All contents by Nick & Koen from oneDot only */
/*  part of onedotonly.be */


/* ELEMENTS */

* {
	margin: 0; padding: 0; border: 0;
}

header, footer, address, section, aside, nav, article { display: block; }

body	{
	background-color:#f7f7f6;
	background: -webkit-gradient( radial, 50% -102, 400, 50% -2084, 2400, color-stop( 0, #cdcdc5 ), color-stop( 1, #f7f7f6 ));
	font: 12px 'Helvetica Neue',Helvetica, Verdana, sans-serif; font-weight: 200;
}

ul	{
	list-style:none; margin: 0; 
}

strong	{ color:black; }	

a	{
	color: #834b02; text-shadow: 0 1px  0 white; text-decoration: none; font-weight: 500;
}

i { color: #777; }

h1, h2, h3	{
	margin: 10px 0; color: #523411; font-family: onefont, georgia;
}

h1 { font-size: 24px; color: #222; }
h2 { font-size: 18px; }
h3 { font-size: 1.2em; }


/* STRUCTURE ELEMENTS */

header	{
	width: 100%; height: 158px; padding-top: 142px; margin-bottom: 60px; background: white;
	background: -webkit-gradient( radial, 50% 1060, 800, 50% 1060, 1000, color-stop( 0, #ffffff ), color-stop( 1, #fafafa ));
	box-shadow: 0 1px 1px #ddd; -moz-box-shadow: 0 1px 1px #ddd;
}
header > a img	{ display:block; width: auto; margin: 0 auto; }

header .tagline {
	width:300px; margin:0px auto; padding-left: 20px;
	font-family:Georgia, "Times New Roman", Times, serif; color:#999; font-size: 1.2em; font-style:italic;
}

header .plus	{
	width: 24px; height: 18px; float:left; clear: both; background: #fafafa url( img/icon.cross.png ) no-repeat center 2px; border: 1px solid #ddd; border-top: 0;
	border-radius: 4px; border-top-left-radius: 0; border-top-right-radius: 0;
}
header .plus:hover	{ background-color: #ccc; }

section	{ width: 780px; min-height: 50px; margin: 12px auto; }

aside	{
	float: right; width: 250px; min-height: 50px; margin-right: 7%;
}

aside h1	{ font-size: 18px; color: #770000; }
aside h2	{ font-size: 17px; }

footer	{
	clear: both; padding: 12px 0; margin-top: 50px; background-color: #4d5454; box-shadow: inset 0 3px 8px -2px rgba( 0,0,0, .24 ); border-top: 2px solid white;
}

footer address	{
	padding: 6px 0 0 208px; background: url(img/onedotonly_embed.png) no-repeat;
	font-style: normal; font-size: 11px; color: #888; line-height: 16px; 
}
footer address a	{
	color: #aaa; text-shadow: 0 -1px 0 #333;
}
footer address a:hover	{ color: white; }

footer aside:before	{
	content: "*"; font-size: 20px; font-weight: 800;
}
footer aside	{
	margin-top: 40px; color: #999; font: 12px onefont, georgia; font-style: italic; 
}


/* NAVIGATION ELEMENTS */

nav	{
	width: 84%; margin: 48px auto 0; padding: 0;
}
nav #html5	{
	width: 60px; height: 25px; padding:12px 0 0; cursor: pointer;
}
nav #html5 h1	{
	margin: 4px 0 0; line-height: 12px;
}
nav .icons	{ float: right; }
nav .icons > a	{ display: block; float: left; }
nav .icons img	{ padding: 2px 16px; }

nav .icons img		{
	opacity: 1; -webkit-transition: opacity 1s; transition: opacity 1s;
}
nav .icons img:hover, nav #html5:hover span	{
	opacity: .5; -webkit-transition: opacity .2s; transition: opacity .2s;
}

nav .icons .mod, nav #html5 .mod	{
	position: absolute; overflow: hidden; width: 240px; padding: 0px 18px; background: white; border: 1px solid white; margin: 3px -200px;
	opacity: 0; max-height: 0; -webkit-transition: opacity .24s, max-height .2s, padding .5s .2s; transition: opacity .24s, max-height .2s, padding .5s .2s;
	font-size: 11px; color: #464540; cursor: default;
	border-radius: 4px; -webkit-box-shadow: 0 2px 3px rgba( 0,0,0, .12 ), inset 0 -8px 24px #fafafa;
}

nav #html5 .mod	{ margin: 12px 28px; }
nav .icons a:hover .mod, nav #html5:hover .mod	{ opacity: .98; max-height: 1000px; padding: 12px 18px; }


/* STYLING CLASSES */

/* COLUMN & MOD CLASSES */

.mod	{ margin: 12px 0 24px; }

.mod.white, .mod.striped	{
	background: white; border-radius: 5px; border: 1px solid rgba( 0,0,0, .12 ); box-shadow: 0 1px 3px rgba( 0,0,0, .1 );
}

nav .mod	{
	font-weight: 400;
}

nav h1	{
	color: #222; font-size: 14px; 
}