/* FOR IE
CSS hacks
The following hacks to trigger haslayout have been well tested in IE7 and lower. John Gallant and Holly Bergevin published the Holly hack in 2003: from http://www.satzansatz.de/cssd/onhavinglayout.html
*/
/* \*/
* html .gainlayout { height: 1%; }
/* */
/* undohtml.css */
/* (CC) 2004 Tantek Celik. Some Rights Reserved. http://creativecommons.org/licenses/by/2.0 This style sheet is licensed under a Creative Commons License. */
/* Purpose: undo some of the default styling of common (X)HTML browsers */
* { margin: 0; padding: 0; }
/* link underlines tend to make hypertext less readable, because underlines obscure the shapes of the lower halves of words */
:link,:visited { text-decoration:none }
/* no list-markers by default, since lists are used more often for semantics */
ul,ol { list-style:none }
/* avoid browser default inconsistent heading font-sizes and pre/code too */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }
/* remove the inconsistent (among browsers) default ul,ol padding or margin / the default spacing on headings does not match nor align with normal interline spacing at all, so let's get rid of it. zero out the spacing around pre, form, body, html, p, blockquote as well */
/* form elements are oddly inconsistent, and not quite CSS emulatable. nonetheless strip their margin and padding as well */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0 }
/* whoever thought blue linked image borders were a good idea? */
a img,:link img,:visited img { border:none }
/* de-italicize address */
address { font-style:normal }
/* more varnish stripping as necessary... */
/*------------------------------------------------------------------------------------
Global Styles
------------------------------------------------------------------------------------*/
* { padding:0; margin:0;}
h1, h2, h3, h4, h5, h6, p, pre, blockquote, label, ul, ol, dl, fieldset, address { margin:1em 0; }
li, dd { margin-left:5%; }
fieldset { padding: .5em; margin:0; } legend { margin:0; padding:0; }
select option{ padding:0 5px; }
.hide, .print-logo, .close-button{ display:none; }
.left{ float:left; }
.right{ float:right; clear:both; }
.clear{ clear:both; height:1px; font-size:1px; line-height:1px; }
a img{ border:none; }
/*Clear defaults - inspired from Tantek Celik----------------*/
:link,:visited {text-decoration:none;}
ul,ol,dl {list-style:none;}
h1,h2,h3,h4,h5,h6,pre,code {font-size:1em; font-weight:normal;}
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,dl,dt,dd {margin:0; padding:0;}
a img,:link img,:visited img {border:none;}
address {font-style:normal;}
strong {font-weight:bold;}
em {font-style:italic;}
i {display:none;}
/* *********************
* ***** SPRITES *******
* ******************** */
DIV.slide DIV.text, DIV.slide DIV.text, DDIV.slide DIV.text, UL.list LI, DIV.submenu LI, SPAN.icon_telecats, SPAN.icon_interaction, SPAN.icon_communication,
SPAN.icon_langspeech, SPAN.prevlist, SPAN.nextlist
{ background-image:url("../images/sprite_general.gif"); background-position:0 0; background-repeat:no-repeat; }
DIV.menu, DIV.header
{ background-image:url("../images/sprite_hbg.gif"); background-position:0 0; background-repeat:no-repeat; }
DIV.products DIV.hover, UL#references LI, DIV.columns, DIV.columns DIV.outer, DIV.columns DIV.inner, DIV.columns DIV.one UL LI
{ background-image:url("../images/sprite_home.gif"); background-position:0 0; background-repeat:no-repeat; }
DIV.pagereferences, DIV.pagereferences DIV, DIV.pagereferences UL
{ background-image:url("../images/sprite_references.gif"); background-position:0 0; background-repeat:no-repeat; }
/* replaced icons */
SPAN.icon_telecats, SPAN.icon_interaction, SPAN.icon_communication, SPAN.icon_langspeech, SPAN.nextlist, SPAN.prevlist
{ font-size:0px; line-height:0px; display:inline-block; vertical-align:middle; cursor:pointer; }
/* **********************
* ***** GENERAL ********
* **********************/
BODY { font-size: 75%; margin:0; padding:0; text-align:center; }
BODY, TD, DIV, INPUT { font-family: Arial, Verdana, sans-serif; line-height:1.6em; color:#000000; }
TD, DIV, INPUT { text-align:left; }
A { color:#0497e3; font-weight:normal; text-decoration:none; } A:hover { text-decoration:underline; }
IMG { border:0px; }
.clear{ clear:both; line-height:0px; font-size:0; height:0px; }
.layout { width:960px; margin:0 auto; overflow:auto; }
UL.list LI { background-position:0 -547px; padding:0 0 0 13px; line-height:1.4em; margin:10px 0; }
SPAN.prevlist { background-position:center -723px; height:11px; width:290px; margin:0; }
SPAN.nextlist { background-position:center -745px; height:11px; width:290px; margin:0; }
/* ********************
* ******* TEXT *******
* ********************/
H1 { font-size:280%; line-height:1em; letter-spacing:0; font-weight:bold; margin:0 0 0px 0px; padding:0; font-family:"Helvetica Neue LT Std", Arial; }
H2 { font-size:190%; line-height:1em; letter-spacing:0; font-weight:bold; margin:8px 0 0px 0px; padding:0; font-family:"Helvetica Neue LT Std", Arial; color:#666666; }
H3 { font-size:160%; line-height:1em; letter-spacing:0; font-weight:bold; margin:15px 0 7px 0px; padding:0; font-family:"Helvetica Neue LT Std", Arial; }
H4 { font-size:130%; line-height:1em; letter-spacing:0; font-weight:bold; margin:5px 0 0px 0px; padding:0; }
.content H1 { font-size:220%; line-height:1em; letter-spacing:0; font-weight:bold; margin:7px 0 5px 0px; padding:0; }
.content H2 { font-size:190%; line-height:1em; letter-spacing:0; font-weight:normal; margin:20px 0 5px 0px; padding:0; }
.content H3 { font-size:160%; line-height:1em; letter-spacing:0; font-weight:normal; margin:15px 0 5px 0px; padding:0; }
.content H4 { font-size:130%; line-height:1em; letter-spacing:0; font-weight:bold; margin:0px 0 5px 0px; padding:0; }
.content H5 { font-size:120%; line-height:1em; letter-spacing:0; font-weight:bold; margin:20px 0 5px 0px; padding:0; }
.content H6 { font-size:100%; line-height:1em; letter-spacing:0; font-weight:bold; margin:20px 0 5px 0px; padding:0; }
.content BLOCKQUOTE { margin:10px; font-style:italic; }
.content UL { list-style:square; padding:0 10px; margin:15px 10px; }
.content UL LI, .content OL LI { margin:5px 0; }
.content OL { list-style-type: decimal; padding:0 10px; margin:15px 10px; }
.content TABLE { border-collapse:collapse; }
.content TABLE TR { border-bottom:1px solid #e7e7e7; }
.content TABLE TD, .content TABLE TH { padding:4px 5px; }
/* ********************
* ***** LAYOUT *******
* ********************/
DIV.logo { height:80px; width:960px; margin:0 auto; overflow:auto; }
DIV.logo IMG { float:left; margin:12px 0 0 0; }
DIV.logo DIV { color:#666666; float:right; text-align:right; }
DIV.menu { height:28px; background-repeat:repeat-x; padding:4px 20px 5px 0; margin:0 0 265px 0; }
DIV.menu UL { margin:0 0 0 20px; }
DIV.menu LI { float:left; padding:4px 4px 0 4px; margin:0 4px 0 4px; height:20px; overflow:none; }
DIV.menu LI.first { padding:4px 10px 0 10px; }
DIV.menu LI SPAN { letter-spacing:0; line-height:0.5em; font-weight:bold; font-family: "Helvetica Neue LT Std", Arial; }
DIV.menu LI A { font-weight:bold; color:#000; padding:0; padding:0 0 0 0; }
DIV.header { background-repeat:repeat-x; width:100%; height:260px; margin:0 0 0 0; overflow:hidden; position:absolute; top:112px; left:0; }
DIV.header DIV.layout { height:260px; position:relative; overflow:visible; }
DIV.slide { position:absolute; top:0; left:0; }
DIV.slide DIV.img { width:554px; height:260px; position:absolute; top:0; left:0; text-align:center; overflow:hidden; }
DIV.slide DIV.title { width:350px; position:absolute; margin:0 0 0 570px; top:84px; left:0; }
DIV.slide H2 { line-height:1em; font-size:280%; font-weight:normal; } DIV.slide H2 A { color:#000000; }
DIV.slide DIV.text { width:310px; position:absolute; margin:0 0 0 555px; top:170px; left:0; height:62px; float:left; padding:12px 20px 0 20px; color:#fff; font-size:120%; line-height:1.2em; }
DIV#slider-1 DIV.text { }
DIV#slider-2 DIV.text { background-position:0 -222px; } DIV#slider-2 DIV.text A { color:#61e5fd; }
DIV#slider-3 DIV.text { background-position:0 -296px; }
DIV#slider-1 { }
DIV#slider-2 { display:none; }
DIV#slider-3 { display:none; }
UL.itemslist { list-style-type:none; padding:0; margin:0; }
UL.itemslist LI { padding:0 0 0 115px; overflow:auto; width:100%; margin:0 0 25px 0; }
UL.itemslist LI IMG { float:left; margin:0 0 0 -115px; }
UL.itemslist H3 { margin:5px 0 2px 0; }
/* ******** SECTIONS ************ */
/* background header */
BODY.home DIV.header { background-position:0 -33px; }
BODY.green DIV.header { background-position:0 -293px; }
BODY.turqoise DIV.header { background-position:0 -552px; }
BODY.blue DIV.header { background-position:0 -813px; }
BODY.purple DIV.header { background-position:0 -1073px; }
/* grote tekst in header */
BODY.home DIV.slide DIV.title H2 { color:#000; }
BODY.green DIV.slide DIV.title H2 { color:#fff; }
BODY.turqoise DIV.slide DIV.title H2 { color:#fff; }
BODY.blue DIV.slide DIV.title H2 { color:#fff; }
BODY.purple DIV.slide DIV.title H2 { color:#fff; }
/* kleurblok in header */
BODY.home DIV.slide DIV.text { }
BODY.green DIV.slide DIV.text { background-position:0 -74px; }
BODY.turqoise DIV.slide DIV.text { background-position:0 -148px; }
BODY.blue DIV.slide DIV.text { background-position:0 -370px; color:#2b3f77; }
BODY.purple DIV.slide DIV.text { background-position:0 -444px; color:#5a3875; }
/* hoofdmenu kleuren */
BODY.green DIV.menu DIV.layout LI.current, BODY.green DIV.menu DIV.layout LI.section { background-color:#03744e; }
BODY.green DIV.menu DIV.layout LI.current A, BODY.green DIV.menu DIV.layout LI.section A { color:#fff; }
BODY.turqoise DIV.menu DIV.layout LI.current,BODY.turqoise DIV.menu DIV.layout LI.section { background-color:#557b8e; }
BODY.turqoise DIV.menu DIV.layout LI.current A, BODY.turqoise DIV.menu DIV.layout LI.section A { color:#fff; }
BODY.blue DIV.menu DIV.layout LI.current,BODY.blue DIV.menu DIV.layout LI.section { background-color:#2b3f77; }
BODY.blue DIV.menu DIV.layout LI.current A, BODY.blue DIV.menu DIV.layout LI.section A { color:#fff; }
BODY.purple DIV.menu DIV.layout LI.current,BODY.purple DIV.menu DIV.layout LI.section { background-color:#5a3875; }
BODY.purple DIV.menu DIV.layout LI.current A, BODY.purple DIV.menu DIV.layout LI.section A { color:#fff; }
BODY.home DIV.menu DIV.layout LI.current,BODY.turqoise DIV.menu DIV.layout LI.section { background-color:#557b8e; }
BODY.turqoise DIV.menu DIV.layout LI.current A, BODY.turqoise DIV.menu DIV.layout LI.section A { color:#fff; }
/* submenu kleuren */
BODY.green DIV.layout DIV.submenu LI.current { background-color:#03744e; } BODY.green DIV.layout DIV.submenu LI.current A { color:#fff; }
BODY.turqoise DIV.layout DIV.submenu LI.current { background-color:#557b8e; } BODY.turqoise DIV.layout DIV.submenu LI.current A { color:#fff; }
BODY.blue DIV.layout DIV.submenu LI.current { background-color:#2b3f77; } BODY.blue DIV.layout DIV.submenu LI.current A { color:#fff; }
BODY.purple DIV.layout DIV.submenu LI.current { background-color:#5a3875; } BODY.purple DIV.layout DIV.submenu LI.current A { color:#fff; }
/* sub submenu toegevoegd door Lars */
BODY.green DIV.layout DIV.submenu LI.subsubmenu_current { background-color:#03744e; } BODY.green DIV.layout DIV.submenu LI.subsubmenu_current A { color:#fff; }
BODY.turqoise DIV.layout DIV.submenu LI.subsubmenu_current { background-color:#557b8e; } BODY.turqoise DIV.layout DIV.submenu LI.subsubmenu_current A { color:#fff; }
BODY.blue DIV.layout DIV.submenu LI.subsubmenu_current { background-color:#2b3f77; } BODY.blue DIV.layout DIV.submenu LI.subsubmenu_current A { color:#fff; }
BODY.purple DIV.layout DIV.submenu LI.subsubmenu_current { background-color:#5a3875; } BODY.purple DIV.layout DIV.submenu LI.subsubmenu_current A { color:#fff; }
/* ******** ******************** */
DIV.submenu { width:247px; margin:15px 0 0 20px; float:left; }
DIV.submenu UL { border-top:1px solid #e7e7e7; }
DIV.submenu LI { border-bottom:1px solid #e7e7e7; padding:10px 10px 10px 25px; background-position:13px -535px; }
DIV.submenu LI.current { background-position:13px -773px; }
/* 3e laag navigatie , toegevoegd door lars */
DIV.submenu LI.subsubmenu_link { border-bottom:1px solid #e7e7e7; padding:10px 10px 10px 25px; background-position:13px -535px; margin-left:20px;}
DIV.submenu LI.subsubmenu_current { background-position:13px -773px; margin-left:20px;}
/* einde 3e laag navigatie */
DIV.submenu LI.mainmenu { border-bottom:1px solid #e7e7e7; padding:10px 10px 10px 15px; background:none; }
DIV.submenu LI.mainmenu A { font-size:120%; font-weight:bold; }
DIV.submenu UL LI SPAN { height:30px; width:30px; float:right; margin:-5px 0 0 0; }
DIV.submenu UL LI SPAN.icon_telecats { background-position:0 -680px; }
DIV.submenu UL LI.current SPAN.icon_telecats { background-position:0 -650px; }
DIV.submenu UL LI SPAN.icon_interaction { background-position:-34px -680px; }
DIV.submenu UL LI.current SPAN.icon_interaction { background-position:-34px -650px; }
DIV.submenu UL LI SPAN.icon_communication { background-position:-68px -680px; }
DIV.submenu UL LI.current SPAN.icon_communication { background-position:-68px -650px; }
DIV.submenu UL LI SPAN.icon_langspeech { width:32px; background-position:-102px -680px; }
DIV.submenu UL LI.current SPAN.icon_langspeech { width:32px; background-position:-102px -650px; }
DIV.content { width:453px; margin:15px 0 0 29px; _margin:15px 0 0 20px; float:left; }
DIV.sidebar { width:182px; margin:15px 0 0 29px; _margin:15px 0 0 15px; float:left; text-align:center; }
DIV.footer { border-top:1px solid #e8e8e8; color:#858484; width:960px; margin:15px auto 15px auto; overflow:auto; text-align:right; padding:10px 0 0 0; }
/* ******** HOMEPAGE ************ */
DIV.products { clear:both; width:960px; margin:0 auto; overflow:auto; }
DIV.products DIV { cursor:pointer; width:225px; float:left; padding:25px 10px 15px 75px; margin:0 13px 0 0; line-height:1.4em; } /* 310 */
DIV.products DIV#one.hover { background-color:#ebf0fa; } /* 310 */
DIV.products DIV#two.hover { background-color:#dae2e6; background-position:-3567px 0; } /* 310 */
DIV.products DIV#three.hover { background-color:#eee6f5; background-position:-3877px 0; } /* 310 */
DIV.products DIV IMG { width:60px; height:54px; float:left; margin:0 0 0 -70px; } /* 310 */
DIV.products DIV.three { margin:0px; }
DIV.columns { background-position:-1647px 0; background-repeat:repeat-y; clear:both; width:960px; margin:20px auto 0 auto; }
DIV.columns DIV.outer { background-position:-687px 0; padding:5px 0 0 0; }
DIV.columns DIV.inner { background-position:-2607px bottom; padding:0 0 25px 0; overflow:auto; width:100%; }
DIV.columns DIV.inner DIV { width:290px; float:left; margin:0 15px; _margin:0 11px; }
DIV.columns DIV.inner DIV.jCarouselLite { width:auto; margin:0; }
DIV.columns DIV.one { line-height:1.4em; }
DIV.columns DIV.one UL LI { background-position:-4197px -3px; line-height:1.4em; padding:5px 0 5px 15px; }
DIV.columns DIV.two { width:270px; margin:0 15px; }
DIV.columns DIV.two DIV.more { width:auto; float:none; margin:0; padding:4px 0; border-top:1px solid #e8e8e8; text-align:right; }
DIV.columns DIV.three H3 { margin:10px 0 0 0; }
DIV#jCarouselLite { margin:0px; }
UL#references { }
UL#references LI { background-position:-310px -20px; overflow:auto; padding:7px 0; height:41px; }
UL#references LI IMG { float:left; margin:0 10px 0 0; vertical-align:middle; }
/* ********************
* ***** FORMS (TOEGEVOEGD DOOR LARS) ********
* ********************/
FORM FIELDSET { border:1px solid #295097; padding:5px 15px; margin-top:10px; width:95%; }
FORM FIELDSET LEGEND { height:1px; font-size:0px; line-height:0px; }
FORM DIV.field { padding:4px 4px 6px 4px; width:95%; margin:3px 0px; clear:both; border-bottom:1px solid #295097; }
FORM LABEL.left { margin:0px; padding:2px 4px; width:150px; float:left; }
FORM SPAN.message { background:#fa2c2c; color:#FFFFFF; padding:3px 5px; margin-top:2px; }
FORM INPUT, FORM TEXTAREA { color:#333333; padding:3px; }
FORM DIV.Actions { text-align:right; margin:10px 0px;}
FORM DIV.Actions INPUT.action { margin:0px; color:#FFFFFF; font-weight:bold; padding:6px 12px; margin-left:3px;
background:url(../images/submit_bg.gif) top left repeat-x #90cfff; border-color:#81bcff; border-style:none solid; border-width:0 2px; }
FORM P.field {padding:4px 4px; width:100%;margin:3px 0px; }
FORM P.field INPUT { float:left; clear:both;}
FORM P.field LABEL.right { float:left; margin:0px; padding:0px 4px;width:400px; }
/* Toevoeging lars (dropdowns te licht) */
FORM select {color:#000000}
FIELDSET DIV.checkboxset DIV.middleColumn, FIELDSET DIV.optionset DIV.middleColumn { margin-left:138px; border:1px solid #000000; }
INPUT.checkbox, INPUT.radio, .checkbox INPUT { border:0px; }
/* ***** CAROUSSEL HOMEPAGE ***** */
/* ******** PAGE ************ */
DIV.pagereferences { background-position:-182px 0; background-repeat:repeat-y; width:auto; margin-bottom:20px;}
DIV.pagereferences H4 { color:#69808c; }
DIV.pagereferences DIV { background-position:0 0; padding:10px 0 0 0; }
DIV.pagereferences DIV UL { background-position:-364px bottom; padding:0 0 15px 0; }
DIV.pagereferences DIV UL LI { padding:0 20px 10px 20px; }
DIV.sidebar IMG.sidebarimage { margin-bottom:14px; }
/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.
Copyright 2006 – 2008 Mark Wubben,
Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben
See also and .
This software is licensed and provided under the CC-GNU LGPL.
See
****************************************************************************
@media screen {
.sIFR-flash { visibility: visible !important; margin: 0; padding: 0; }
.sIFR-replaced, .sIFR-ignore { visibility: visible !important; }
.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; }
.sIFR-replaced div.sIFR-fixfocus { margin: 0pt; padding: 0pt; overflow: auto; letter-spacing: 0px; float: none; }
}
@media print {
.sIFR-flash {
display : none !important;
height : 0;
width : 0;
position : absolute;
overflow : hidden;
}
.sIFR-alternate {
visibility : visible !important;
display : block !important;
position : static !important;
left : auto !important;
top : auto !important;
width : auto !important;
height : auto !important;
}
}
@media screen {
.sIFR-active h1 { font-size:190%; line-height:1em; letter-spacing:0; font-weight:normal; }
.sIFR-active H2 { font-size:190%; line-height:1em; letter-spacing:0; font-weight:normal; }
.sIFR-active H3 { font-size:160%; line-height:1em; letter-spacing:0; font-weight:normal; }
.sIFR-active H4 { font-size:130%; line-height:1em; letter-spacing:0; font-weight:bold; }
.sIFR-active .content H1 { font-size:220%; line-height:1em; letter-spacing:0; font-weight:normal; }
.sIFR-active div.menu li span, .sIFR-active div.menu li.current span
{ font-family: Verdana, Arial; line-height:0.4em; letter-spacing:0; font-size:100%; font-weight:bold; }
}
*/