/*
	Stylesheet for 28minuten.nl, by Reinder de Vries
	28 november 2009, copyright (c) 2009 by Reinder de Vries
*/

body {
	margin: 0;
	padding: 0;
	font-family: Verdana, sans-serif;
	font-size: 11px;
	color: #333333;
	background-color: #009ee0;
}

img { border: none; }


/* Container and shadow */

div.container {
	margin: 0 auto;
	width: 935px;
	height: 920px;
	margin-top: 17px;
	margin-bottom: 50px;
	background-color: white;
}

div.container #logo {
	width: 175px;
	height: 128px;
	float: left;
	margin-top: 3px;
	margin-left: 17px;
}

a.logo:hover img {
	margin-top: 1px;
	margin-left: 1px;
}

/* Top right corner buttons (3) */

div#button-container {
	float: right;
	margin-top: 3px;
	margin-right: 10px;
}

.button {
	display: inline-block;
}

.button a {
	display: block;
	width: 146px;
	height: 70px;
	background-image: url('img/button_map.png');
}

/* NEW BUTTONS!!! */

/* Over ons */
.button-over-ons a { background-position: 0 -280px; }
.button-over-ons a:hover { background-position: 0 -350px; }
.button-over-ons-active a { background-position: 0 -420px; }
.button-over-ons-active a:hover { background-position: 0 -490px; }

/* Tips om te stoppen */
.button-tips a { background-position: 0 -560px; }
.button-tips a:hover { background-position: 0 -630px; }
.button-tips-active a { background-position: 0 -700px; }
.button-tips-active a:hover { background-position: 0 -770px; }

/* Meer informatie */
.button-informatie a { background-position: 0 0px; }
.button-informatie a:hover { background-position: 0 -70px; }
.button-informatie-active a { background-position: 0 -140px; }
.button-informatie-active a:hover { background-position: 0 -210px; }


/* Top and bottom dotted rulers */

div#top-ruler {
	width: 100%;
	height: 17px;
	float: left;
	text-align: center;
}

div#bottom-ruler {
	width: 100%;
	height: 17px;
	float: left;
	text-align: center;
	margin-top: 20px;
}

/* Vuistregel */

div#vuistregel {
	float: left;
	margin-left: 140px;
	margin-top: 30px;
	margin-bottom: 30px;
}

/* Home content containers */
div#content-container {
	float: left;
	width: 100%;
}

div#content-container div#home-tekst-container {
	float: left;
	background-color: #5f6061;
	width: 536px;
	height: 400px;
	margin-left: 23px;
}

div#content-container div#home-tekst-container div#title_home {
	margin: 15px;
}

div#content-container div#home-tekst-container div#tekst {
	margin: 0 15px 0 15px;
	color: white;
}

div#content-container div#home-rekenmodule-container {
	float: right;
	background-color: #009ee0;
	width: 332px;
	height: 400px;
	margin-right: 23px;
}

div#content-container div#home-rekenmodule-container div#rekenmodule {
	margin: 0 15px 0 15px;
}

div#content-container div#home-rekenmodule-container div#title_rekenmodule {
	margin: 15px;
}

div#rekenmodule div#leader {
	font-weight: bold;
}

/* Banner */
div#banner {
	float: left;
	background: black;
	width: 888px;
	height: 108px;
	margin: 23px;
}

/* Flash container */

div#flash-container {
	float: left;
	margin-top: 25px;
	margin-left: 25px;
	width: 300px;
}

div#flash-title {
	width: 300px;
	margin-bottom: 15px;
	float: left;
}

/* Andere pagina's content container */

div#content-lange-tekst {
	float: left;
	width: 880px;
	margin-left: 25px;
	margin-right: 25px;
	margin-top: 25px;
}

/* Resultaat pagina content containers */

div#resultaat-container {
	width: 100%;
	float: left;
}

div#content-resultaat-container {
	float: left;
	margin-left: 25px;
	margin-top: 25px;
	height: 500px;
}

div#content-resultaat-container div#resultaat-tekst-container {
	background: #ddd;
	width: 535px;
	height: 410px;
	float: left;
}

div#content-resultaat-container div#resultaat-tekst-container div#tekst {
	float: left;
	margin: 0 15px 0 15px;
}

div#content-resultaat-container div#resultaat-tekst-container div#title_resultaat {
	margin: 15px;
}

/* Rekenmodule formulier */

div#rekenmodule table#form_container {
	border-spacing: 0 10px;
}

.webkit table#form_container {
	border-spacing: 0 5px;
}

a.button-submit {
	display: block;
	background-image: url('img/button_rekenmodule_map.png');
	background-position: 0 84px;
	width: 246px;
	height: 42px;
}

a.button-submit:hover {
	background-position: 0 42px;
}

/* Tekst en link opmaken */

span.header {
	font-weight: bold;
	font-size: 14px;
}

span.bigger {
	font-size: 12px;
}

span.blue {
	color: #009ee0;
}

span.error {
	color: red;
	font-weight: bold;
}

a.black,
a {
	color: black;
	text-decoration: underline;
}

a.black:hover,
a:hover {
	text-decoration: none;
}

a.menu {
	text-decoration: none;
	color: black;
}

a.menu:hover {
	text-decoration: underline;
	color: black;
}

a.white {
	color: white;
	text-decoration: underline;
}

a.white:hover {
	text-decoration: none;
}

a.important {
	color: #009ee0;
	text-decoration: underline;
}

a.important:hover {
	text-decoration: none;
}

/* Tell a friend */

a#button-facebook {
	display: inline-block;
	background-image: url('img/button_map.png');
	background-position: 0 224px;
	width: 233px;
	height: 70px;
}

a#button-facebook:hover {
	background-position: 0 154px;
}

div#facebook-icon {
	display: inline-block;
}

/* Twitter buttons */
a#button-twitter { 
	display: inline-block;
	background-image: url('img/twitter_button_map.png');
	background-position: 0 0px;
	width: 233px;
	height: 70px;
}

a#button-twitter:hover { 
	background-position: 0 -70px;
}

/* Modal Dialog Box */

div#blind {
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	opacity: .75; /* Standard: FF gt 1.5, Opera, Safari */
	filter: alpha(opacity=75); /* IE lt 8 */
	-ms-filter: "alpha(opacity=75)"; /* IE 8 */
	-khtml-opacity: .75; /* Safari 1.x */
	-moz-opacity: .75; /* FF lt 1.5, Netscape */
	background: black;
}

div#dialog-container {
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
}

div#dialog-container div#dialog {
	width: 480px;
	height: 460px;
	margin: 0 auto;
	margin-top: 100px;
}

div#dialog #frame {
	width: 100%;
	height: 100%;
	border: none;
}