/*

	Bestandsnaam:	index.css
	Functie:		CSS hoofd-stijlblad
	Auteur:			Gustaaf Groenendaal
	Copyright:		2006 - 2010
	Licentie:		Licentie.txt
	Versie:			4.0
	
*/

body {
	background-color: rgb(243, 243, 243);
	color: rgb(163, 163, 163);
	margin: 0px;
}

/* Standaard onzin voor Gecko en Trident
browsers die een soort van rand toevoegen
aan plaatjes waar een link omheen staat */
a img {
	border: 0;
}

a:link, a:link:hover, a:link:active, a:link:visited {
	text-decoration: none;
}

.center {
	text-align: center;
}

.extras {
	color: blue;
	margin: 5px;
}

.fail_msg {
	color: red;
	text-align: center;
}

.genericbox {
	background-color: white;
	border-radius: 10px !important;
	box-shadow: #a3a3a3 0em 0em 1em inset !important;
	height: 100%;
	padding-top: 1px;
	width: 100%;
}

.genericboxcontent {
	margin-top: 0.8em !important;
}

.genericboxtitle {
	background: rgb(46, 63, 255) center;
	border-radius: 8px !important;
	color: white;
	font-weight: bold;
	height: 1.7em;
	margin: 4px;
	padding: 0.4em 1em 0;
	width: auto;
}

.leftbox {
	text-align: left;
}

.listclass {
	height: 26px;
}

.marginbox {
	margin: 1em;
}

.marginbox_small {
	margin: 0.5em 0.3em;
}

.refitem {
	height: 1.5em;
}

.rightbox {
	text-align: right;
}

.special_link {
	color: rgb(255, 153, 0);
	font-weight: bold;
}

.toplink {
	color: white;
	height: 18px;
	padding: 7px 0px;
	position: relative;
}

.user_ext {
	background-color: rgb(46, 63, 255);
	border-radius: 6px !important;
	color: rgb(255, 255, 255);
	font-weight: bold;
	text-decoration: none;
}

/*
De volgende wX elementenen geven een breedte aan
dit kan eventueel ook inline, maar het lijkt me
handiger om alle CSS in één bestand te houden.
*/

.w100 {
	width: 100%;
}

.w15 {
	width: 15%;
}

.w25 {
	width: 25%;
}

.w30 {
	width: 30%;
}

.w40 {
	width: 40%;
}

.w50 {
	width: 50%;
}

#advertising {
	height: 19em;
	left: 49.5em;
	position: absolute;
	top: 4em;
	width: 13.5em;
}

#column {
	height: 19em;
	left: 16.5em;
	position: absolute;
	top: 25em;
	width: 46.5em;
}

#column_text {
	column-count: 3;
	column-gap: 2.5em;
	font: italic 14.5px "Lucia Handwriting, Arial, monospace, Sans-Serif";
	height: 17em;
	left: 1em;
	margin-top: 0.8em;
	position: absolute;
	right: 1em;
	width: 49em;
}

#contact_submit {
	text-align: center;
}

#contact_text {
	height: 20em;
	overflow: hidden; /* Opera zet er graag een scrollbar bij, laten we die verwijderen */
	width: 90%;
}

#content {
	left: 50%;
	margin-left: -31.65em;
	position: absolute;
	width: 63.3em;
}

#error {
	background-color: rgb(243, 243, 243);
	height: auto;
	left: 50%;
	margin-bottom: 4em;
	margin-left: -17em;
	position: relative;
	top: 1.5em;
	width: 34em;
}

#errorbox {
	height: 90%;
	width: 34em;
}

#errorboxcontent {
	margin: 0.6em 6em;
}

#externallinks {
	height: 19em;
	position: absolute;
	top: 25em;
	width: 13.5em;
}

#extra_space {
	height: 2.5em;
	position: absolute;
	top: 44em;
	visibility: hidden;
	width: 2em;
}

#featurecontent {
	height: 19em;
	left: 33em;
	position: absolute;
	top: 4em;
	width: 13.5em;
}

#info_page {
	bottom: 2em;
	height: auto;
	left: 50%;
	margin-left: -16em;
	overflow-x: hidden;
	overflow-y: auto;
	padding-top: 2em;
	position: fixed;
	top: 3.4em;
	width: 47.4em;
}

#info_page_content {
	margin: -3.4em 3em 2em 0.5em;
}

#info_page_menu {
	height: 26em;
	left: 50%;
	margin-left: -31.4em;
	position: fixed;
	top: 3.5em;
	width: 13.5em;
	z-index: 1;
}

#memberlist {
	bottom: 2em;
	height: auto;
	overflow-x: hidden;
	overflow-y: auto;
	position: relative;
	top: 4em;
	width: auto;
}

#memberlist_content {
	margin: 0em 16em 6em 0em;
}

#personal {
	height: 19em;
	left: 16.5em;
	position: absolute;
	top: 4em;
	width: 13.5em;
}

#register {
	background-color: rgb(243,243, 243);
	height: auto;
	left: 50%;
	margin: 0em 0em 4em -15em;
	position: relative;
	top: 2em;
	width: 30em;
}

#registerbox {
	height: 90%;
	width: 30em;
}

#thissite {
	height: 19em;
	position: absolute;
	top: 4em;
	width: 13.5em;
}

#topbox {
	background-color: white;
	border-radius: 0px 0px 10px 10px !important;
	box-shadow: #a3a3a3 0em 0em 1em !important;
	height: 32px;
	width: 100%;
}

#topmenu {
	height: 32px;
	left: 50%;
	margin-left: -31.68em;
	position: fixed;
	top: 0px;
	width: 63em;
	z-index: 100;
}

#topboxtitle {
	background: rgb(46, 63, 255) center;
	border-radius: 0px 0px 8px 8px !important;
	color: white;
	font-weight: bold;
	height: 32px;
	text-align: center;
	text-decoration: none;
	width: auto;
}

#topboxtitle > ul {
    height: 32px;
    margin: 0;
    padding: 0;
}

#topboxtitle > ul > li {
    display: inline-block;
    height: 32px;
    position: relative;
    top: 7px;
}

#topboxtitle > ul > li:nth-child(1n+2):before {
    content: "|";
}

.moreitemscontainer {
    height: 15px;
    left: 0px;
    position: absolute;
    right: 0px;
    text-align: center;
    top: 25px;
}

.moreitemscontainer > div {
    background-color: rgb(46, 63, 255);
    display: inline-block;
    height: 10px;
    margin-left: 5px;
    position: relative;
    top: -9px;
    text-align: center;
    transform: rotate(45deg);
    width: 10px;
}

#topboxtitle > ul > li:hover .topmenu-submenu {
    display: block;
}

.topmenu-submenu {
    background: #2E3FFF;
    box-shadow: 0px 6px 7px 0px rgba(45, 45, 45, 0.3);
    border-bottom-right-radius: 7px;
    display: none;
    margin-left: 0px;
    list-style-type: none;
    padding: 0px;
    position: absolute;
    text-align: left;
    top: 25px;
    width: 200px;
    z-index: 20;
}

.topmenu-submenu > li {
    display: block;
    height: 26px;
    width: 200px;
}

.topmenu-submenu > li:hover {
    background-color: #122ADD;
}

.topmenu-submenu > li > a {
    height: 18px;
    padding: 4px 7px;
    position: absolute;
    transition: width 0.5s linear, padding-left 0.5s linear;
    width: 186px;
}

.topmenu-submenu > li:hover > a {
    padding-left: 12px;
    transition: width 0.5s linear, padding-left 0.5s linear;
    width: 181px;
}

.topmenu-submenu > li:last-child:hover {
    border-bottom-right-radius: 7px;
}

#top_warning {
	background-color: yellow;
	color: rgb(000, 000, 000);
	height: 1.5em;
	padding-top: 0.5em;
	position: fixed;
	text-align: center;
	top: 0px;
	width: 100%;
	z-index: 10;
}
