/*
  stylesheet: Plata Foundation
  versie: 1.3 ~ 2010.10.12
  Lodewijk Schutte ~ Low
  freelance@loweblog.com
*/

/*  http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
-------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}

body {
  color: black;
  background-color: white;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}

blockquote, q {
  quotes: "" "";
}

/*  Basis
-------------------------------------------- */
html body {
  font:12px/1.5 Verdana, Arial, sans-serif; 
  color:#333;
  background:#939393 url(../images/bg-body.gif) 50% 0 repeat-y;
}

#kader {
  width:785px;
  margin:0 auto;
  position:relative;
  background:url(../images/logo-plata-print.gif) 40px 0 no-repeat;
}

/*
-- Logo - bovenste balk
---------------------------------*/
#logo {
  height:7.5em;
  background:#777;
  margin-bottom:2.5em;
  overflow:hidden;
  border-bottom:2px solid #fff;
}

  #logo a {
    display:block;
    width:254px;
    height:71px;
    background:url(../images/logo-plata2.gif) no-repeat;
    text-indent:-9999px;
    overflow:hidden;
    margin-left:40px
  }

/*
-- Social
--------------------------------- */

#social {
	position:absolute;
	top:0;
	right:40px;
}

#social li {
	float:left;
	margin-left:5px;
}

#social a, #social img {
	display:block;
}

  
/*
-- Hoofdmenu
--------------------------------- */

#menu {
  border-top:2px solid #fff;
  border-bottom:2px solid #fff;
  background:#44a0e5 url(../images/bg-menu.gif) 0 0 repeat-x;
  position:absolute;
  width:100%;
  top:7.5em;
  line-height:2.5em;
}

  #menu ul { margin-left:45px;  }  
  #menu li { display:inline;margin-right:2em; }
  #menu a  { font:bold 1em Arial,sans-serif;text-transform:uppercase;text-decoration:none;color:#fff; }
  #menu a:hover, #menu .active a { color:#cce32e; }

/*
-- Zoeken
---------------------------------*/
#zoeken {
  position:absolute;
  top:7.5em;
  right:40px;
  width:20em;
  min-width:200px;
  text-align:right;
  margin-top:2px;
  line-height:2.5em;
  z-index:100;
}

  #zoeken fieldset label { font:bold 1em Arial,sans-serif;text-transform:uppercase;text-decoration:none;color:#fff;margin-right:.5em }
  #zoeken fieldset span { background:#fff url(../images/bg-zoek-top.gif) 50% 0 no-repeat;padding-top:2px; }
  #zoeken fieldset input { background:#fff url(../images/bg-zoek-bottom.gif) 50% 100% no-repeat;border:none;width:114px;padding:0 3px 2px 3px; }
  #zoeken fieldset button { display:none; }

/*
-- Nieuws blokken
---------------------------------*/
#nieuws {
  position:absolute;
  top:10em;
  width:100%;
  padding-bottom:30px;
  background:url(../images/bg-item-fade.gif) bottom center no-repeat;
  margin-top:4px;
}
  #nieuws ul {
    position:relative;
    bottom:0;
    width:100%;
    height:11em;
    text-align:center;
    background:#59B43B none bottom center; /* url(../images/bg-nieuws.jpg) */ 
    overflow:hidden;
  }

  #nieuws ul li {
    position:absolute;
    bottom:0;
    height:9.5em;
    width:233px;
    padding:10px;
    padding-bottom:0;
    background:url(../images/bg-nieuws-item.png) top center no-repeat;
  }
  
  #nieuws ul li#item1 {left:13px}
  #nieuws ul li#item2 {left:50%;margin-left:-126px}
  #nieuws ul li#item3 {right:13px}
  
  #nieuws .item h2   { font:bold 1.25em/1em arial,sans-serif;margin:1em 12px;color:#e88600; }
  /*#nieuws .item h2 a { color:#e88600;text-decoration:none; }
  #nieuws .item h2 a:hover { color:#fd0; }*/
  #nieuws .item p    { font-size:.916em;line-height:1.363em;margin:0 12px; }


/*
-- Submenu
---------------------------------*/
  
#submenu {
  position:absolute;
  width:200px;
  top:25em;
  left:30px;
  padding-bottom:2em;
  background:#fff;
}
  
#submenu #buttons    { margin:0;}
#submenu #buttons li { padding:0;background:url(../images/bg-nav-grey.gif) no-repeat;margin-bottom:.5em;width:165px;height:23px;overflow:hidden;}
#submenu #buttons li.blue {background-image:url(../images/bg-nav-blue.gif)}
#submenu #buttons li.orange {background-image:url(../images/bg-nav-orange.gif)}
#submenu #buttons a  { padding-left:5px;color:#fff;line-height:23px;white-space:nowrap;display:block;word-spacing:-1px;}
#submenu #buttons a:hover  { text-decoration:none }
  
  #submenu h2 { font-weight:bold;color:#e88600;margin:1.5em 0 0 11px; }
  #submenu ul { margin-left:11px; }
  #submenu li { font-size:.916em;line-height:1.636em;padding-left:11px;background:url(../images/bg-sub-li.gif) 1px .5em no-repeat;  }
  
  #submenu a         { color:#5d5d5d;text-decoration:none; }
  #submenu a:hover,
  #submenu .active a { color:#44a0e5;text-decoration:underline; }
  
  
  
  #submenu #banners { margin-top:1.5em; }
  
/*
-- Content
---------------------------------*/

#content {
  position:absolute;
  width:500px;
  top:25em;
  right:40px;
  z-index:100;
  padding-bottom:2em;
  background:#fff;
}

#content h1 { color:#44a0e5;font-weight:bold; } 
#content h2 { color:#44a0e5;font-weight:bold;font-size:.916em;line-height:1.636em; }

#content p,
#content ul,
#content ol,
#content dl,
#content table,
#content fieldset {
  margin-bottom:1.636em;
  font-size:.916em;
  line-height:1.636em;
}

#content ul {list-style:square outside;margin-left:2em;}
#content ol {list-style:decimal outside;margin-left:2em;}

#content strong { font-weight:bold;color:#555; }
#content em { font-style:italic; }

/*#content img {margin:1em;}*/

/* links */
a {color:#44a0e5;text-decoration:underline;}
a:visited {color:#555}
a:active  {color:#f00}
a:hover   {color:#155d95}

#content a.actie {float:right;margin-left:1em;}
#content a.actie img {margin:0}

#content p#blurb {
 color:#666;
 text-transform:uppercase;
 font-family:'trebuchet ms',sans-serif;
 font-weight:bold;
 word-spacing:2px;
}


/*
-- Content blok
---------------------------------*/
.blok { margin:1.5em 0;background:#e5e5e5 url(../images/bg-blok-top.gif) 50% 0 no-repeat;width:500px; }
.blok div { background:url(../images/bg-blok-bottom.gif) 50% 100% no-repeat;padding:1.636em;padding-bottom:1px }
.blok div .clr {display:block;clear:both;}

#content .blok ul {list-style:none;margin-left:0}
#content .blok li {padding-left:11px;background:url(../images/bg-blok-li.gif) 1px .6em no-repeat;  }
#content .blok li a {font-weight:bold;}


/*
-- Form elements
---------------------------------*/
input, select, textarea, button { font:.916em/1.636em Verdana, Arial, sans-serif; }

button {border:0;padding:0;margin-top:1.636em;cursor:pointer;background:transparent;}
label  {cursor:pointer;}

#content label, .label {float:left;width:13.5em;}
#content label span, .label span, .alert {color:red}
form h2,
#content fieldset br {clear:both;}
#content .text {font-size:1em;padding:0px;width:16.5em;border:1px solid #ccc;}
#content input.radio {font-size:1em;margin:0;padding:0;vertical-align:middle}
#content input.hidden {visibility:hidden;}

#content .options {margin-left:13.5em;width:16.5em;}
#content .options label {display:block;float:none;}

#content button img {margin:0;}

.note {font-size:.909em;line-height:1.8em;color:#555;clear:both;}

#content ul#keuzes {list-style:none;margin:0 0 1.636em 0;float:left;}
#content ul#keuzes li {float:left;width:30em}
#content ul#keuzes li span {float:right;}
#content ul#keuzes li span em {margin-right:1em;text-transform:uppercase;font-style:normal;}
#keuzes em.vol {color:red;}
#keuzes em.open{color:#44a0e5;}
#content ul#keuzes li label {width:24em}

/*
-- Tables
---------------------------------*/
#trainingsdata caption,
.blok caption {display:none;}
.space td     {padding-bottom:1.636em;}
.blok th      {width:115px;padding-right:10px;color:#44a0e5;font-weight:bold;}
td span       {display:block;}


#trainingsdata th { font-weight:bold;color:#44a0e5; }
#trainingsdata td, #trainingsdata th { padding:3px 10px; border:1px solid #ccc; }

/*
-- Misc
---------------------------------*/
a.edit {font-size:.916em;line-height:1.636em;display:block;margin-bottom:1.636em;text-decoration:none;font-weight:bold;color:#f00;clear:both}
a.edit:hover {background:#f00;color:#fff;}

.pagination {float:left;width:100%;}
.pagination span {float:right;}
.pagination a {margin:3px;}

#content img.trainer, #content img.boek {float:left;margin:0 1em 1.636em 0;}
/*div.boek {margin-left:150px;}*/

#stats {position:fixed;left:0;top:0;background:#ccc;padding:0 2px;font:11px consolas;}

.blocks {float:left;width:100%;}

#content .blokje {
 float:left;
 margin:0 2.454em 2.454em 0;
 width:205px;
 background:url(../images/bg-smallblock-top.gif) 0 0 no-repeat;
}
#content .blokje p {
 background:url(../images/bg-smallblock-bottom.gif) 0 100% no-repeat;
 margin:0;
 padding:1em;
 text-align:center;
}
#content .blokje a {
  font:bold 1.25em/1em arial,sans-serif;
  color:#fff;
  text-decoration:none;
}

#content .groen {background-color:#59B43B;}
#content .blauw {background-color:#22a0e1;}
#content .grijs {background-color:#7c8989;}
#content .citaat p {text-align:left;padding:0;}
#content .citaat p em {display:block;text-align:right}

.hidden {display:none}