/* green: 		#80cbd3; */
/* lightgreen:	#c0e5e9; */

@font-face {
  font-family: Titillium;
  src: local("Titillium"), 
       url(titillium.otf);
}

#bg { position: absolute; top:0; left:0; right: 0; bottom: 0; width: 100%; height: 100%; }

h2 { font-size: 24px; font-weight: normal; }

div { font-family: 'Titillium','Gill sans','Myriad pro', Helvetica, Arial, sans-serif; }
input,textarea { font-family: Helvetica, Arial, Verdana; font-size: 12px; }
th { vertical-align: top; text-align: left; }

*,*:focus { outline: none; }

a img { border: none; }

html,body { margin: 0; padding: 0; height: 100%; font-size: 12px; color:#333; }
body { background: #313131; min-width: 1000px; min-height: 530px; height: 100%; overflow: hidden; }

#container { position: relative; margin: auto; padding: 0; height: 100%; width: 100%; }
#contentcontainer { height: 530px; width: 100%; overflow: hidden; position: relative; position: absolute; top: 50%; margin-top: -265px; }

h1#logo { margin: 0; padding: 0; position: absolute; left: 50%; margin-left: -500px; bottom: 0;  }
h1#logo a { width: 150px; height: 60px; display: block; text-indent: -999em; background: url(../images/logo.png) no-repeat; }
div#bubbles { position: absolute; left: 50%; margin-left: -500px; bottom: 60px;  }

div#content { position: relative; position: absolute; background: #FFF; width: 850px; left: 50%; margin-left: -350px; bottom: 60px; height: 410px; overflow: hidden; }

div#case 	{ position: relative; position: absolute; top: 30px; left: 38px; height: 350px; width: 640px; background: #80cbd3; overflow: hidden; }
div#slide   { position: relative; position: absolute; left: 0; top: 0; }
div#slide img { position: absolute; top: 0; left: 0; }
div#prev 	{ background: #000; height: 20px; width: 20px; position: absolute; top: 30px; left: 18px;   }
div#prev a 	{ display: block; height: 20px; text-indent: -999em; background: url(../images/prevnext.gif) top left; }
div#next 	{ background: #000; height: 20px; width: 20px; position: absolute; top: 30px; left: 678px;   }
div#next a 	{ display: block; height: 20px; text-indent: -999em; background: url(../images/prevnext.gif) top right; }
div#inloop  { color: #80cbd3; position: absolute; left: 705px; top: 30px; line-height: 20px; }

div#upsell { width: 128px; background: url(../images/minilogo.gif) no-repeat bottom left; position: absolute; bottom: 30px; left: 700px; padding-bottom: 40px;  }
div#upsell { line-height: 20px; font-size: 13px; letter-spacing:1px; }
div#upsell a { color: #000; text-decoration: none; } 
div#upsell strong{ color: #80cbd3; display: block; font-size: 18px; margin-top: 20px; }

ul#news { margin: 0; padding: 0; position: absolute; top: 30px; left: 38px; width: 675px; }
ul#news h2 { color: #80cbd3; margin-top: 0; }
ul#news li { width: 200px; height: 166px; margin: 0 20px 20px 0; overflow: hidden; float: left; position: relative; }
ul#news li img { width: 200px; height: 166px; }
ul#news li a { position: absolute; top: 0; left:0; padding: 20px 15px; display: block; width: 170px; height: 126px; background: #80cbd3; text-decoration: none; color: #FFF; font-size: 22px; }
ul#news li a span { color: #000; display: block; font-size: 14px; }

div#news { margin: 0; padding: 0; position: relative; position: absolute; top: 30px; left: 38px;  }
div#news img { width: 200px; height: 166px; position: absolute; top: 184px; left: 0; }
div#news div { position: absolute; top: 0; left:0; padding: 20px 15px; display: block; width: 170px; height: 126px; background: #80cbd3; text-decoration: none; color: #FFF; font-size: 22px; }
div#news div span { color: #000; display: block; font-size: 14px; }

div#newscontent { position: absolute; left: 268px; top: 30px; }
div#newscontent h2 { color:#000; }
div#newscontent strong { color: #80cbd3;}
div#newscontent a { color: #80cbd3; text-decoration:none; background: url(../images/arrow.gif) no-repeat left; padding-left:20px;}
div#newscontent a:hover { color: #666;}

div#newscontent #overflow { height: 350px; width: 340px; overflow: auto; overflow-x: none; padding-right: 60px; }
div#newscontent p { font-family: Helvetica, Arial, Verdana; font-size: 12px; line-height: 18px; }
div#newscontent #nooverflowie { height: 350px; width: 375px; overflow: auto; overflow-x: none; }
div#newscontent #nooverflow { height: 350px; width: 375px; }

div#newsback {  position: absolute; left:  700px; bottom: 30px;}
div#newsback a { text-decoration: none; color: #80cbd3; } 

form#contact { color: #FFF; padding: 10px 50px; }
form#contact th { width: 100px; }
form#contact .validation-advice { padding: 5px 0; }
form#contact .text { border: none; width: 250px; padding: 2px; }
form#contact textarea { border: none; width: 250px; height: 100px; padding: 2px; }

ul#submenu { width: 150px; margin: 0; padding: 0; list-style: none; position: absolute; top: 60px; left: 50%; margin-left: -500px; height: 410px; overflow: hidden; }
ul#submenu li { background: #80cbd3; margin-bottom: 5px; color: #FFF; }
ul#submenu li.kop { height: 60px; overflow: hidden; }
ul#submenu li.kop h2 { line-height: 70px; text-align: center; font-size: 30px; letter-spacing: 1px; text-transform: uppercase; font-weight: normal; margin: 0; padding: 0; color: #FFF; }
ul#submenu li.more { height: 25px; line-height: 25px; background: none; }
ul#submenu li.more ul { margin: 0; padding: 0; list-style: none; }
ul#submenu li.more ul li { margin: 0; text-align: center; float: left; }
ul#submenu li.more ul li a { display: block; color: #FFF; text-decoration: none; } 
ul#submenu li.more ul li.first { width: 73px; margin-right: 5px; } 
ul#submenu li.more ul li.second { width: 72px; } 
ul#submenu li.more ul li.selected { background: #c0e5e9; } 

ul#submenu li.list { height: 340px; } 
ul#submenu li.short { height: 310px; width: 150px; position: absolute; top: 95px; } 
ul#submenu li.list h3 { font-size: 18px; padding: 13px 13px 6px 13px; margin: 0; font-weight: normal; text-transform: uppercase; letter-spacing:1px; } 

ul#submenu li.list 	ul.items { width: 150px;  margin: 0; padding: 13px 0 0 0; overflow: hidden; } 
ul#submenu li.list 	ul.items li { margin: 0; float: left; display: block; width: 150px;  }
ul#submenu li.list 	ul.items li a { color: #FFF; padding: 0 0 0 13px; float: left; width: 150px; display: block; line-height: 21px; height:19px; font-size: 11px; letter-spacing:1px;  overflow:hidden; display: block; text-decoration: none; text-transform: uppercase; } 
ul#submenu li.list 	ul.items li a:hover { background: #c0e5e9; color: #FFF; }
ul#submenu li.list 	ul.items li a:active,
ul#submenu li.list 	ul.items li.selected a { background: #FFF; color: #80cbd3; }
 
ul#submenu li.short #overflow { height: 240px; width: 138px; padding: 0; margin-top: 13px; }
ul#submenu li.short #overflow li { width: 135px; }
ul#submenu li.short #nooverflowie { overflow: auto; overflow-x: none; }

ul#menu { width: 100px;  position: absolute; top: 0; left: 50%; margin: 0; padding: 0;  margin-left: -350px; overflow: hidden; }
ul#menu li { background: #80cbd3; color: #FFF; cursor: pointer; list-style: none; line-height: 30px; font-size: 14px; text-transform: uppercase; letter-spacing: 11px; }
ul#menu li a { color: #FFF; text-decoration: none; text-align: center; width: 112px; display: block; }
ul#menu li ul { margin: 0; padding: 0; background: #ccc; letter-spacing: 0; }
ul#menu li ul li { letter-spacing: 1px; font-size: 12px; text-transform: capitalize; display: inline; background: none;  }
ul#menu li ul li a { text-decoration: none; color: #000; width: 100px; line-height: 28px; }
ul#menu li ul li a:hover { background: #BBB; color: #000; }
ul#menu li ul li a:active,
ul#menu li ul li.selected a { background: #FFF; color: #80cbd3; }

a#beheer { background: #ccc; display: block; color: #000; text-decoration: none; height: 30px; line-height: 30px; padding: 0 16px;  position: absolute; top: 0; right: 0px; overflow: hidden; margin: 0; font-size: 14px; text-transform: uppercase; letter-spacing: 11px; width:140px;  }