/* Start of CMSMS style sheet 'screen + projection met achtergrond' */
/**
 * Stylesheet for screen media 
 */

/**
 * Font sizes
 */
/*
html > body, html > body th, html > body td, html > body select, html > body input, html > body  button, html > body textarea, html > body h2, html > body h3, html > body h4, html > body h5, html > body h6
    {font-size: 14px;}
html > body h1
    {font-size: 16px;}
html > body #news span, html > body .NewsSummary div span, html > body #cal-calendar td li, html > body .breadcrumbs, html > body #sidebar .calendar-date-from, html > body #content
    {font-size: 12px;}
html > body #footer, html > body #fotoinfo
    {font-size: 10px;}
*/

/**
 * General
 */
body
  {color: #000; background: #ddd;}
ins
    {font-style: italic;}
address
   {margin: 1em 0;}
input[type=submit]
    {margin: .3em 0;}
.accessibility
    {display: none;}
.clear
  {clear: both;}
.component
  {filter:alpha(opacity=90); -moz-opacity: .9; opacity: .9; margin-bottom: 20px;}
.component .top, .component .bottom
  {display: block; overflow: hidden; padding-top: 5px;}
.component .body
  {padding: 0 10px; margin: 0;}
.narrow
  {width: 200px;}
.narrow .top
  {background: transparent url(uploads/images/layout/boxes/white-simple-narrow.gif) no-repeat left top;}
.component .body
  {padding: 1em; background: #fff;}
.narrow .bottom
  {background: transparent url(uploads/images/layout/boxes/white-simple-narrow.gif) no-repeat left bottom;}
a, a:link
  {color: #028; text-decoration: underline;}
a:visited
  {color: #357;}
a:hover
  {color: #028; text-decoration: none;}

/**
 * Main content
 */
#main
  {position: absolute; top: 20px; left: 240px; width: 600px;}
#main .top
  {background: transparent url(uploads/images/layout/boxes/white-simple-wide.gif) no-repeat top left;}
#main .bottom
  {background: transparent url(uploads/images/layout/boxes/white-simple-wide.gif) no-repeat left bottom;}
#main h1, #main h2, #main h3, #main h4, #main h5, #main h6
  {color: #028; margin: 1em 0;}
#main p
  {margin: 1em 0;}
#main ul
  {margin: 1em 0 1em 1em; padding-left: 1em}
#contentmenu
    {clear: both; display:block;  height: 20px; color: #300;}
#contentmenu div
    {margin: 5px;}
.menubuttons
    {float: right;}
.breadcrumbs
    {float: left; text-transform: lowercase;  color: #777; font-family: "Dejavu Serif","Bitstream Vera Serif", georgia, palatino, times, serif; border: 1px solid #aaa; background: #eee; padding: 0 .3em;}
.breadcrumbs a, .breadcrumbs a:link
    {color: #333 !important; text-decoration: underline; padding: 0 1px;}
.breadcrumbs a:hover, .breadcrumbs a:focus
    { text-decoration: none;}
.breadcrumbs a:visited
    {color: #777 !important;}
#content
    {padding: 0 10px 10px 10px; border-top: 2px solid #fff; background-color:  #6af; color: #026; line-height: 1.4em; position:relative;}
#content img
    {margin: 5px; padding: 5px; border: 1px solid #ccc; background: #fff; margin-right: 5px; filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1; }
#content h1
    {font: bold medium "Dejavu Sans", "Bitstream Vera Sans", Helvetica, Arial, sans-serif; margin: 0 -10px 10px -10px; padding: 0 10px; color: #fff; background: #f60; border-bottom: 2px solid #fff;}
#main .component .body
   {margin: 0; padding: 0; border-left: 5px solid #fff; border-right: 5px solid #fff;}

/**
 * Media links
 */
#content a[href$=".pdf"]
    {background: url(uploads/images/layout/icons/pdf.gif) no-repeat scroll 0 50%;padding: 1px 0 1px 18px;}
#content a[href$=".odt"], #content a[href$=".doc"], #content a[href$=".docx"]
    {background: url(uploads/images/layout/icons/doc.gif) no-repeat scroll 0 50%; padding: 1px 0 1px 18px;}
#content a[href$=".ods"], #content a[href$=".xls"], #content a[href$=".xlsx"]
    {background: url(uploads/images/layout/icons/spreadsheet.gif) no-repeat scroll 0 50%;padding: 1px 0 1px 18px;}
#content a[href$=".odp"], #content a[href$=".pps"], , #content a[href$=".ppt"], #content a[href$=".pptx"]
    {background: url(uploads/images/layout/icons/pps.gif) no-repeat scroll 0 50%; padding-left:18px;}
#content a[href$=".gz"], #content a[href$=".tgz"], #content a[href$=".bz2"], #content a[href$=".zip"], , #content a[href$=".rar"],  #content a[href$=".7z"]
    {background: url(uploads/images/layout/icons/zip.gif) no-repeat scroll 0 50%; padding-left:18px;}
#content a[href$=".ogg"], #content a[href$=".mp3"]
    {background: url(uploads/images/layout/icons/sound.gif) no-repeat scroll 0 50%;padding: 1px 0 1px 18px;}
#content a[href$=".mp4"], #content a[href$=".mpg"], #content a[href$=".wmv"]
    {background: url(uploads/images/layout/icons/video.gif) no-repeat scroll 0 50%;padding: 1px 0 1px 18px;}
#content a[href$=".mov"]
    {background: url(uploads/images/layout/icons/quicktime.gif) no-repeat scroll 0 50%; padding: 1px 0 1px 18px;}

/**
 * Modules
 */
#main .NewsSummary
    {margin-bottom: 1em; padding: 0 0 1em 0; border-bottom: 1px dotted #333;}
#news h2
    {margin: 0;}
#news .NewsSummary
    {margin: 0 1em;  padding: 1em 0; border: 0;}
#news .NewsSummary div span
    {color: #777;}
#news .NewsSummaryPostdate
    {font-weight: normal;}
#news .body div.more
    {padding-left: 15px; padding-bottom: 10px;}
#cal-calendar
    {width: 100%; border-top: 1px solid #aaa; border-right: 1px solid #aaa;}
#cal-calendar caption
    {padding: .3em 0;}
#cal-calendar th
    {padding: .3em; border-left: 1px solid #aaa; background: #eee; border-bottom: 1px solid #aaa; text-align: center;}
#cal-calendar td
    {padding: .3em; border-left: 1px solid #aaa; background: #fff; border-bottom: 1px solid #aaa;}
.cal-upcominglist, .cal-upcominglist .calendar-event
    {margin: 1em 0;}
#sidebar .calendar-date-from
    {color: #777;}
table.pagetable th, table.pagetable td
    {padding-right: 1em;}

/**
 * Formulieren
 */
form div.formbuilderform div
    {line-height: 2em; clear: left;}
form div.formbuilderform label
    {float: left; clear: left; display: block; width: 200px;}
form div.formbuilderform div div label
    {clear: none; display: inline; margin: 0;}
form div.formbuilderform input[type=submit]
    {margin: 1em 0 1em 200px;}

/**
 * Sidebar
 */
#sidebar
  {position: absolute; top: 20px; left: 20px;}
#nav dfn
   {display: none;}
#nav ul
   {clear: left; display:block; width: 170px; list-style: none; margin: 0; overflow: hidden;}
#nav li
    {float: left; clear: left; width: 170px;}
#nav li ul
    {float: left; clear: left; width: 170px; background: #fff; margin: 0;}
#nav li li
    {margin-left: 14px; width: 156px;}
#nav a, #nav a:link
    {display: block; color: #f60; font-weight: bold; text-decoration: none; padding: 0 1px;}
#nav a:visited
    {color: #f83;}
#nav a:hover, #nav a:focus, #nav a:active
    {color: #fff !important; background: #f60;}
#nav .currentpage h3
    {color: #fff; background: #f60; font-weight: bold; padding: 0 1px; font-family: "Dejavu Sans","Bitstream Vera Sans", verdana, helvetica, arial, sans-serif; }
#nav li .currentpage h3
    {background: #f60 url(uploads/images/layout/icons/sidebar-bullet-hover.gif) no-repeat 0 1px; padding-left: 10px;}
#nav li li a, #nav li li a:link
    {padding-left: 10px; background: transparent url(uploads/images/layout/icons/sidebar-bullet.gif) no-repeat 0 1px;}
#nav li li a:hover
    {padding-left: 10px; background: #f60 url(uploads/images/layout/icons/sidebar-bullet-hover.gif) no-repeat 0 1px;}
#logo
  {width: 200px; height: 130px; overflow: hidden;}
#logo .body
  {padding: 0; background: #fff;}
#logo a
  {display: block; height: 120px; text-indent: -999px; background: transparent url(uploads/images/layout/logo.gif) no-repeat 50% 0;}
#footer a, #footer a:link
    {color: #f60; text-decoration: underline;}
#footer a:hover, #footer a:focus
    {text-decoration: none;}
#fotoinfo
    {margin: 0 10px;}

/**
 * IE6
 */
* html #main .component
  {width: 600px;}
* html #content div, * html #content img
    {position: relative;}
* html #nav li li
    {margin-left: 7px; width: 156px;}

/**
 * IE7
 */
*+html div.component .top
  {height: 5px; padding: 0;}
*+html div.component .bottom
  {padding-top: 5px !important; background-position: 0 -5px !important;}

/* End of 'screen + projection met achtergrond' */

