html, body
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 10pt;
  height: 100%;
}

body
{
  text-align: center;
  background-color: white;
}

#container
{
  height: 100%;
}

a
{
  color:#B6101D;
}

img
{
  border: none;
}

h1 /* As defined by the profile */
{
  color:#B6101D;
  font-family:Arial,Helvetica,sans-serif;
  font-size:12pt;
  font-weight:bold;
  margin:0;
  padding:12pt 0 3pt;
  text-align:left;
}

div.header
{
  width:966px;
  height:338px;
  position: relative;
}
div.headerbg
{
  position:absolute;
  width:966px;
  height:364px;
  background: url(header.png) no-repeat;
}
div.mainmenu
{
  position:absolute;
  left:130px;
  top:262px;
  height:32px;
  width:600px;
}
div.mainmenu .sep
{
  display:block;
  float:left;
  line-height:32px;
  color:#ffffff;
}
div.mainmenu a
{
  color:#ffffff;
  text-decoration:none;
  font-size: 10pt;
  display:block;
  float:left;
  vertical-align:middle;
  line-height:32px;
  padding: 0 8px;
}
div.mainmenu a.selected
{
  background: url(mainmenuselected.gif);
  color:#000000;
}
div.submenu
{
  position:absolute;
  top:292px;
}
div.submenu a
{
  float:left;
  line-height:32px;
  padding: 0 8px;
  color: #707070;
  text-decoration:none;
  font-size: 10pt;
}
div.submenu a.selected
{
  color: #000000;
}
div.submenu .sep
{
  display:block;
  float:left;
  line-height:32px;
  color:#707070;
}

table.bodytable
{
  position:relative;
  z-index: +1;
  width:966px;
}
td.contentarea
{
  width: 743px;
  text-align: left;
  vertical-align: top;
}
div.contentarea
{
  padding: 0;
  width: 743px;
  position: relative;
}

body.homepage td.contentarea, body.programpage td.contentarea
{
  width: 526px;
}
body.homepage div.contentarea, body.programpage div.contentarea
{
  padding: 0 39px 0 26px;
  width: 461px;
}

div.footer
{
}



/* Linker kolom (bevat actueel, programma, foto) */
td.leftcolumn
{
  width:138px;
  text-align: left;
  vertical-align: top;
}
body.homepage td.leftcolumn, body.programpage td.leftcolumn
{
  width:243px;
}
td.leftcolumn div.actueeltop
{
  width: 243px;
  height: 7px;
  background: url(greyroundtop.png) no-repeat bottom;
}
td.leftcolumn div.actueelmiddle
{
  padding-left:15px;
  width: 228px;
  background: url(greyroundright.png) right repeat-y;
}
td.leftcolumn div.actueelbottom
{
  width: 243px;
  height: 7px;
  background: url(greyroundbottom.png) no-repeat top;
}
td.leftcolumn div.actueelhead
{
  font-size:11pt;
  font-weight:bold;
  padding: 4px 0 0 0;
}
td.leftcolumn a.item
{
  display: block;
  text-decoration: none;
  width: 212px;
  border-top: 1px #a7a7a7 solid;
  color: #707070;
  font-size:11pt;
  margin: 10px 0 0 0;
  padding: 8px 0 3px 0;
}

/* Rechterkolom */
td.rightcolumn
{
  width:85px;
  text-align: left;
  vertical-align: top;
}
body.homepage td.rightcolumn, body.programpage td.rightcolumn
{
  width:197px;
}
td.rightcolumn div.bgspacer
{
  height:16px;
}
td.rightcolumn div.spacer
{
  height:16px;
}
td.rightcolumn div.rightblocktop
{
  background: url(whiteroundtop.png) no-repeat bottom;
  width:197px;
  height:8px;
  margin: 12px 0 0 0;
  position: relative; /* allow label1/label2 to position */
}
td.rightcolumn div.rightblocktop div.label
{
  width: 86px;
  height: 38px;
  position:absolute;
  background: url(rightboxlabel.png);
  filter: progid: DXImageTransform. Microsoft. AlphaImageLoader (src='rightboxlabel.png', sizingMethod='crop');
  text-align: center;
  line-height:38px;
  color: #ffffff;
}
td.rightcolumn div.rightblocktop div.label1
{
  top:0;
  left:0;
  cursor: pointer;
}
td.rightcolumn div.rightblocktop div.label2
{
  top:0;
  left:86px;
  cursor: pointer;
}

td.rightcolumn div.rightblocktop div.selectedlabel
{
  background-image: url(rightboxselectedlabel.png);
}
td.rightcolumn div.rightblocklabelroom
{
  height:38px;
}
td.rightcolumn div.rightblockmiddle
{
  background: #cdcecf;
  padding: 0 0 0 8px;
}
td.rightcolumn div.rightblockbottom
{
  background: url(whiteroundbottom.png) no-repeat top;
  width:197px;
  height:8px;
}


.headerboven, .headeronder
{
  position:absolute;
  cursor: pointer;
}

.headerboven
{
  top: 99px;
  left: 799px;
  width: 122px;
  height: 102px;
  color: #000000;
}

.headeronder
{
  top: 234px;
  left: 757px;
  width: 120px;
  height: 107px;
  color: #ffffff;
}

table.centermiddle, table.centermiddle tr, table.centermiddle td
{
  width:100%;
  height:100%;
}
table.centermiddle td
{
  vertical-align: middle;
  text-align: center;
}

table.programtable td.time
{
  color: #707070;
  font-size: 10pt;
  padding: 0 8px 0 8px;
}
table.programtable td.item, table.programtable td.item a
{
  color: #707070;
  font-size: 10pt;
  text-decoration:none;
}
table.programtable td.selected, table.programtable td.selected a
{
  color: #b6101d !important;
}

table.programtable td.h1
{
  padding-bottom: 10px;
  color: #b6101d !important;
}

#banners .banneritem
{
  padding: 0 0 20px 0;
}


div#animatesponsorimagescontainer
{
  width: 197px;
  height: 72px;
  position: relative;
}

div#animatesponsorimages
{
  width: 197px;
  height: 72px;
  overflow:hidden;
  position:absolute;
  cursor: pointer;
}

div#sponsordesc
{
  font-weight: bold;
  text-align: center;
  padding: 5px 0 10px 0;
}



/*FIXME: Tollium doesn't understand that pulldowns other than gender need a class ..-required.
         Since every pulldown is required at the moment, we can use this workaround, which
         marks every pulldown yellow (= required) */
.tollium-pulldown
{
  background-color: #FFF8E2;
}


/* Tollium CSS */
.tollium-textedit-required, .tollium-pulldown-required, .tollium-textarea-required
{
  background-color: #FFF8E2;
}

.tollium-textedit, .tollium-pulldown
{
  border: 1px solid #7F9DB9;
}

/*FIXME: Tollium doesn't understand that pulldowns other than gender need a class ..-required.
         Since every pulldown is required at the moment, we can use this workaround, which
         marks every pulldown yellow (= required) */
.tollium-pulldown
{
  background-color: #FFF8E2;
}

.tollium-box
{
  margin: 4px 0 8px 0;
}

.tollium-textedit, .tollium-textarea
{
  width: 300px;
}
.tollium-textarea
{
  height: 70px;
}

#innoplayer
{
  margin-top:   20px;
  width:        243px;
  height:       180px;
}

/* The standard webpack CSS. This CSS is shared by all webpacks and
   modifying it allows you to easily adapt all webpack types to your
   site design. We recommend that you remove this CSS from the individual
   webpack demos, and instead move it to your site's central CSS files */

/* Global tag, containing the complete webpack item */
.whwp
{
  font-family: arial, helvetica, sans-serif;
}

/* Webpack item title */
.whwp .whwp-title
{
  font-weight: bold;
}

/* All links */
.whwp a
{
  color: #0000AA;
}

/* Characteristics shared between input and button style links */
.whwp .whwp-button, .whwp .whwp-button:hover
{
  width: 100px;
  background-color: #A0A0A0;
  text-align: center;
  color: #FFFFFF;
  border: outset 2px;
  border-right-color: #808080;
  border-bottom-color: #808080;
  margin: 3px 3px 3px 0px;
}

/* Links with an input button appearance */
.whwp a.whwp-button, .whwp a.whwp-button:hover
{
  display: block;
  text-decoration: none;
  vertical-align: middle;
  white-space: nowrap;
  padding: 2px 5px;
}

.whwp input.whwp-button
{
  /* IE/FF work around: first pointer, then hand */
  cursor: pointer;
  cursor: hand;
  font-family: arial, helvetica, sans-serif; /* Inherit font-family */
  font-size: 100%; /* Inherit font-size */
}

.whwp .whwp-questiongroup
{
  border: 1px #000000 solid;
  padding: 10px;
  margin: 20px 0px;
  background-color: #FFFFFF;
}

/* Individual questions */
.whwp .whwp-questiongroup .whwp-question
{
  margin: 10px 0px;
}

/* Individual question labels */
.whwp .whwp-questiongroup .whwp-question label,
.whwp .whwp-questiongroup .whwp-question
{
  font-style: italic;
  margin: 10px 0px 4px 0px;
}

.whwp .whwp-questiongroup .whwp-question input, .whwp .whwp-questiongroup .whwp-question textarea,
.whwp .whwp-questiongroup .whwp-question option, .whwp label input, .whwp label textarea,
.whwp .whwp-questiongroup .whwp-question .whwp-formgroup label
{
  font-size: 100%;
  font-family: Arial, Helvetica, sans-serif;
  font-style: normal;
}

.whwp .whwp-entry
{
  border: 1px solid #000000;
  margin: 10px 0px;
}

.whwp .whwp-entry .whwp-header
{
  background-color: #D0D0D0;
  font-weight: bold;
  padding: 4px;
}

.whwp .whwp-entry .whwp-message
{
  padding: 4px;
}

.whwp .whwp-entry .whwp-message blockquote
{
  margin-left: 1pt;
  border-left: 1pt solid #000000;
  padding-left: 5pt;
}

.whwp .whwp-entry .whwp-footer
{
  padding: 5px;
}

.whwp table.whwp-table
{
  border: solid 1px #000000;
  border-collapse: collapse;
  width: 100%;
  font-size: 100%; /* Ensure IE picks up the inherited font-size for this table */
}

.whwp table.whwp-table th
{
  text-align: left;
  padding: 2px 5px;
  background-color: #D0D0D0;
  vertical-align: top;
  white-space: nowrap;
  color: #000000;
}

.whwp table.whwp-table td
{
  text-align: left;
  padding: 2px 5px;
  vertical-align: top;
}

.whwp .whwp-odd
{
  background-color: #EEEEEE;
}

.whwp .whwp-even
{
  background-color: #FFFFFF;
}

.whwp .whwp-errors
{
  color: #FF0000;
}

.whwp table.whwp-attachments
{
  font-size: 100%;
}

/* End of the standard webpack CSS definitions */