@import '/stylesheets/reset.css';

/* Base elements
-------------------------------------------------------------- */
body       {background:#fff; color:#000; font-family:Georgia, "Times New Roman", serif; font-size:100%; line-height:1.125em; margin:0;}

h1, h2, h3, h4, h5, h6 {font-weight:bold;}
h1         {font-size:1.375em; line-height:1.636em; margin:0;}
h2         {font-size:0.9375em; margin:.5334em 0;}
h3         {font-size:0.8125em; margin:.1.286em 0 0 0;}
h4         {font-size:0.8125em; font-weight:normal; font-style:italic; margin:0;}
h3 span    {color:#999; font-weight:normal;}
h3.product_title span {color:#000;}
h2 span    {font-weight:normal;}
h3 span.caps,
h2 span.caps {color:#000; font-weight:bold;}

p          {font-size:0.8125em; margin:0 0 1.286em 0;}
ol, ul     {font-size:0.8125em; margin:0 0 1.286em 0;}

ul ul      {font-size:1em;}

a,
a:active,
a:link     {text-decoration:none; color:#587e96;}
a:visited  {text-decoration:none;}
a:hover    {color:#000; border-bottom:1px solid;}

a.tag,
a.target,
a.topic    {color:#545e65; border-bottom:1px solid #545e65;}

a.tag:hover,
a.target:hover,
a.topic:hover {color:#000; border-bottom:1px solid #000;}

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

.kap       {font-family:Verdana, sans-serif; text-transform:uppercase; font-size:9px;}
p.kap      {font-size:9px}
.link      {text-align:right;}
.highlight {background:#daebc1; padding:2px 5px;}

/* Structure
-------------------------------------------------------------- */
#layout        {width:958px; margin:0 auto; border:1px solid #000; border-top:none; position:relative;}
#header        {height:177px; background:#fff url(/images/header_bg.png); position:relative; margin-bottom:12px;}

.column        {float:left; margin-right:14px;}

.first         {margin-left:48px;}
.last          {margin-right:48px;}

.span-1        {width:132px;}
.span-2        {width:278px;}
.span-3        {width:424px;}
.span-4        {width:570px;}
.span-5        {width:716px;}
.span-6        {width:862px;}

.clearer       {display:block; clear:both; float:none;}
.clear         {display:inline-block;}
.clear:after,
#layout:after  {content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html .clear  {height:1%;}
.clear         {display:block;}

/* Logo
--------------------------------------------------------------- */
#header h1      {position:absolute; margin:0; top:29px; left:43px; text-indent:-9999em; display:block; background-repeat:no-repeat; background-color:transparent;}
#header h1 span {display:block; width:196px; height:114px; overflow:hidden; border-bottom:none; background:url(/images/vsc.png) no-repeat;}

/* Search
--------------------------------------------------------------- */
#search       {position:absolute; top:36px; right:48px;}
#search form  {padding:0; margin:0;}
#search #q    {display:block; width:268px; font-size:.8125em; font-family:Verdana, sans-serif; padding:3px; margin-top:3px;}

/* Navigation
--------------------------------------------------------------- */
#navigation         {position:absolute; left:339px; top:123px; width:585px; height:41px; background:#94c308 url(/images/navigatie.png) no-repeat;}
#navigation ol      {margin:0;}
#navigation ol li   {margin:0; padding:0; position:absolute; top:0; list-style-type:none;}

#navigation ol li,
#navigation ol a    {height:41px; display:block; border:none;}
#navigation ol li a {text-indent:-9999px; text-decoration:none;}

#nav_home           {left:   0px; width:126px;}
#nav_leden          {left: 146px; width:126px;}
#nav_over           {left: 292px; width:126px;}
#nav_onderwijs      {left: 438px; width:126px;}

#navigation    a:hover {background:#94c308 url(/images/navigatie.png);}
#nav_home      a:hover {background-position:    0px -41px;}
#nav_leden     a:hover {background-position: -146px -41px;}
#nav_over      a:hover {background-position: -292px -41px;}
#nav_onderwijs a:hover {background-position: -438px -41px;}

.home      #nav_home      a {background:#94c308 url(/images/navigatie.png); background-position:    0px -41px;}
.leden     #nav_leden     a {background:#94c308 url(/images/navigatie.png); background-position: -146px -41px;}
.over      #nav_over      a {background:#94c308 url(/images/navigatie.png); background-position: -292px -41px;}
.onderwijs #nav_onderwijs a {background:#94c308 url(/images/navigatie.png); background-position: -438px -41px;}


/* Homepage
--------------------------------------------------------------- */
#agendanews        {background:#fff url(/images/photos/winter.jpg) no-repeat; padding-top:208px;}
#about             {background:#fff url(/images/kaart_klein.png) no-repeat; padding-top:208px;}

#uitgelicht_asset  {height:208px; background:#fff url(/images/photos/winter.jpg) no-repeat center center;}

.home h2           {margin:0 0 0.4667em 0; padding:0; text-indent:-9999em; display:block; background-repeat:no-repeat; background-color:transparent;}
.home h2 span      {display:block; width:278px; height:26px; overflow:hidden;}
h2.agenda,
h2.uitgelicht,
h2.wiezijnwij      {margin-top:-14px;}
h2.actueel,
h2.aanbodvsc,
h2.aanbodbij       {margin-top:1.8667em;}

h2.agenda     span {background:url(/images/accolades/header_agenda.png) no-repeat;}
h2.actueel    span {background:url(/images/accolades/header_actueel.png) no-repeat;}
h2.uitgelicht span {background:url(/images/accolades/header_uitgelicht.png) no-repeat;}
h2.aanbodbij  span {background:url(/images/accolades/header_aanbod.png) no-repeat;}
h2.aanbodvsc  span {background:url(/images/accolades/header_aanbodvsc.png) no-repeat;}
h2.wiezijnwij span {background:url(/images/accolades/header_wiezijnwij.png) no-repeat;}

.group_col         {margin-bottom:0.875em; padding-bottom:0.875em; border-bottom:1px solid #94c308;}
.group_col_last    {border:none; margin-bottom:0; padding-bottom:0;}
.group_col p,
.group_col_last p  {margin:0;}
.group_col h2,
.group_col_last h2 {margin-top:0;}

.uitgelicht p      {margin:0;}

.group_col p.onderregel,
.group_col_last p.onderregel {color:#666; margin:0 0 .5643em 0;}

.home h3.title {margin-bottom:.6154em}

/* Organisation / product display
--------------------------------------------------------------- */
p.logo                     {float:right; margin-top:.5em;}
.vcard                     {margin-bottom:1.125em;}
.vcard p                   {margin-bottom:0;}
.vcard .telecommunications {margin-top:1.125em;}

.product                   {margin-bottom:1.125em; padding-bottom:1.125em; border-bottom:1px solid #94c308; clear:both; float:none;}
.product_last              {border:none; margin-bottom:0; padding-bottom:0; clear:both; float:none;}
.product p,
.product_last p            {margin:0; width:702px;}
.product h2,
.product_last h2           {margin-top:0; width:702px;}

p.thumb                    {float:right; width:132px; margin-top:1em; margin-bottom:.5em;}

/* Product headers */
#bezoekers, #onderwijs     {position:relative; margin:2.250em 0 1.125em 0; padding:0; width:862px; height:26px; clear:both; float:none;}
#bezoekers                 {background:url(/images/accolades/header_publieks_producten.png) no-repeat}
#onderwijs                 {background:url(/images/accolades/header_educatie_producten.png) no-repeat}

#bezoekers li,
#onderwijs li              {text-indent:-9999px; display:block; margin:0; padding:0; list-style-type:none; position:absolute; top:0;}
#bezoekers a, #onderwijs a {text-indent:-9999px; height:26px; display:block; border:none;}

#bezoekers li              {left:220px; width:218px;}
#bezoekers a:hover         {background:url(/images/accolades/header_publieks_producten.png); background-position:-220px -26px;}
#onderwijs li              {left:223px; width:215px;}
#onderwijs a:hover         {background:url(/images/accolades/header_educatie_producten.png); background-position:-223px -26px;}

#product_details p         {margin:0;}
#product_details h2        {margin-top:0;}
#product_details .desc     {margin:1.125em 0 0;}
#product_details .desc p   {margin:0 0 1.125em 0;}

#flash_content             {margin-bottom: 1.125em;}

/* Pages
--------------------------------------------------------------- */
.pages ul  {list-style-type:circle; margin-left:1.5em;}
.pages ol  {list-style-type:decimal; margin-left:1.5em;}

.pages ol li ol {list-style-type:lower-alpha; font-size:1em;}

.page      {width:588px}

.page p,
.page h2,
.page h3,
.page h4,
.page ol,
.page ul   {padding-right:98px;}

.plaatje   {float:right; margin-right:-376px; width:278px;}
#adres     {float:right; margin-right:-278px; width:278px; padding-right:0; list-style-type:none; margin-left:0;}

/* Footer
--------------------------------------------------------------- */
#footer           {padding-top:14px; margin:0 41px 30px 41px; font-size:0.6875em; clear:both;}
#footer th        {white-space:nowrap; padding-right:.5em; padding-left:17px;}
#footer td        {padding-right:17px;}
#footer th,
#footer td        {padding-bottom:17px;}
#footer .top      {background:transparent url(/images/footer_bg.png) top left no-repeat; display:block; padding:0 6px;}
#footer .bottom   {background:transparent url(/images/footer_bg.png) bottom left no-repeat; display:block; padding:0 6px;}
#footer .top th,
#footer .top td   {padding-top:17px;}
#footer .top th   {padding-right:.6em;}


/* Bottom Navigation
--------------------------------------------------------------- */
#bottom_nav            {width:960px; margin:0 auto; padding-bottom:3em; text-align:center;}
#bottom_nav ol         {font-family:Verdana, sans-serif; color:#587e96; font-size:.75em; line-height:1em; padding-top:1em;}
#bottom_nav ol li      {display:inline; padding:0 5px; border-right:1px solid #587e96;}
#bottom_nav ol li.last {border-right:0;}

