/*
   span.css
   YPOS8 - span-europe
   
   Created by Ronald Werring on 2013-09-17.
   Copyright 2013 YPOS internettoepassingen BV. All rights reserved.
*/

html { height:100% }
body { margin:0; padding:0; color:#464646; height:100%; background:#053c72 url(../gfx/bg.gif) no-repeat;  background-position:center; background-attachment:fixed; background-size:cover; font:small "Open Sans", sans serif; }
div.wrapper { position:relative; margin:0 auto; width:960px; position:relative }

h1 { font-size:160%; color:#f5a714; margin:0 0 0.8em }
h2 { font-size:115%; color:#f5a714; margin:0 0 0.5em}
h2 a { color:#f5a714; }
h3 { font-size:100%; color:#777; margin:0 0 0.5em}
h4 {}
h5 {}
p { line-height:1.5em; margin:0 0 1.5em }
p.link { margin:-1.5em 0 1.5em 0; }

a img { border:0 }

ul { margin:0 0 1.5em 0; padding:0; list-style-type:none }
ol {}
div.text li, div.column li { line-height:1.5em; padding:0 0 0 13px; margin:0 0 0.7em; background-image:url(../gfx/bullet.png); background-repeat:no-repeat; background-position:0 8px }
div.text li ul li { margin-bottom:0.3em }
div.column li { margin-bottom:0 }
div.find li { margin-bottom:0.2em }
div.find li a { color:#053c72}
div.kader { font-size:90%; border:1px solid #eee; border-radius: 8px; padding:14px 20px; margin:0 0 15px; background:#fff8e5}
div.kader p { margin:0}

a { color:#053c72; color:#0062c2; text-decoration:none; outline:0; }
a:hover { text-decoration:underline }
div.column { display:none }

img { border:0; }
img.left  { float:left; margin-right:10px; }
img.right { float:right; margin-left:10px; }


img.logo { display:block; padding:35px 0}
img.llp { position:absolute; right:0; top:44px }
/*div.rechts { float:right; margin:0 0 70px 70px; width:200px }*/

/* ======== */
/* = text = */
/* ======== */
div.text { background:white; border-radius:8px; padding:20px 27px; margin:0 0 40px }
body.manager div.text { padding-right:200px }
div.manager img { display:block; margin:0; border-radius:5px }
div.manager { /*font-style:italic;*/ float:right; width:150px; margin:30px 10px }

/* ======== */
/* = menu = */
/* ======== */
ul.menu { height:30px; margin:0 0 20px; padding:0 0 0 10px; background:#fcb406 url(../gfx/bg-menu.png) repeat-x; list-style-type:none; border-radius:8px }
ul.menu li a { display:block; float:left; color:black; text-decoration:none; border-right:1px solid #fcc758; height:20px; padding:4px 18px 5px 18px; font-size:110% }
ul.menu li.hover a { background:rgba(255,206,114,0.95); border-bottom:1px solid #ffd88e; }
ul.menu li a:hover,
ul.menu li a.selected { color:white }

/* pulldown menu */
ul.menu>li { position:relative; float:left; }
ul.menu li div.container { z-index:100; position:absolute; visibility:hidden; left:0; padding:0 10px 10px 10px; overflow:hidden; top:30px; width:180px; min-height:200px; margin-left:-10px; border-bottom-left-radius:8px; border-bottom-right-radius:8px }
ul.menu li div.container ul { position:absolute; width:170px; margin:0; padding:0; border-bottom-left-radius:8px; border-bottom-right-radius:8px; box-shadow:0 2px 10px rgba(0,0,0, 0.3)  }
ul.menu li div.container ul li { float:none; display:block; padding:0; margin:0; border:0; background:none; }
ul.menu li ul li ul { display:none }
ul.menu li div.container ul a  { font-size:100%; float:none; color:black; text-transform:none; text-align:left; border:0; /*height:24px;*/ height:auto; border-bottom:1px solid #ffd88e; line-height:16px; color:#000; background-color:rgba(255,206,114,0.95); padding:7px 0px 7px 18px; background-image:url(../gfx/menu-arrow.gif); background-repeat:no-repeat; background-position:155px 10px }
ul.menu li div.container ul li:last-child a { border-bottom-left-radius:8px; border-bottom-right-radius:8px }
ul.menu li div.container ul a:hover { background-color:rgba(253,195,86,0.95); background-position:155px -80px; color:white; }
ul.menu li div.container ul a.selected { color:white }


/* ============ */
/* = language = */
/* ============ */
ul.language { margin:0; padding:0; list-style-type:none; position:absolute; width:225px; top:56px; right:0 }
ul.language li { float:left; display:block; height:44px }
ul.language li.selected { background-image:url(../gfx/icon-flag-arrow.gif); background-repeat:no-repeat; background-position:14px bottom }
ul.language a { font-size:1px; text-indent:-100px; overflow:hidden; display:block; width:35px; height:35px; float:left; margin:0 10px 0 0; background-image:url(../gfx/icon-flag-en.png) }
ul.language a:hover { background-position:0 -64px }
ul.language a#fr { background-image:url(../gfx/icon-flag-fr.png) }
ul.language a#du { background-image:url(../gfx/icon-flag-de.png) }
ul.language a#en { background-image:url(../gfx/icon-flag-en.png) }
ul.language a#nl { background-image:url(../gfx/icon-flag-nl.png) }
ul.language a#es { background-image:url(../gfx/icon-flag-es.png) }

/* ======== */
/* = find = */
/* ======== */
body.about span.datum { display:none }

/* ======== */
/* = home = */
/* ======== */
body.index div.text { margin-right:315px }
body.index div.column { display:block; position:absolute; top:198px; right:0; width:295px }
body.index div.column div.item { background:#d0dae5; background:rgba(255,255,255,0.75); border-radius:8px; margin:0 0 20px; padding:20px }
div.column h1, div.column h2, div.column h3, div.column p, div.column li, div.column a { color:#053c72 }
div.column h1 { font-weight:normal }
div.column h2 { margin:0 0 0.5em }
div.column a { color:#0062c2 }

/* ============= */
/* = formulier = */
/* ============= */
form label { display:block; width:150px; float:left; display:block; padding:2px 0; color:#053c72 }
form input.text, form textarea { display:block; padding:2px; width:240px; border:1px solid #053c72; display:block; margin:0 0 12px; font:12px "Open Sans"  }
form p { color:#777; font-size:85%; padding:4px 150px }
form input.submit { display:block; margin:12px 150px; background:#fcb406 url(../gfx/bg-menu.png) repeat-x; border:0; color:black; cursor:pointer; height:30px; font-size:13px; padding:4px 14px; border-radius:8px }
form input.submit:hover { color:white }
form div#error { }

/* ========== */
/* = zoeken = */
/* ========== */
form#zoeken { position:absolute; background:white; padding-left:2px; height:20px; width:150px; top:153px; right:10px; border-radius:3px }
form#zoeken input.text { border:0; width:130px; padding:1px 1px 1px 3px; font-size:11px; float:left }
form#zoeken input.submit { display:block; width:14px; height:14px; background-color:transparent; background-image:url(../gfx/icon-zoek.png); border:0; padding:0; margin:3px 0 0 0; background-position:0 1px }
form#zoeken input.submit:hover { background-position:0 bottom }
form#zoeken input.text.dimmed { color:#999; font-style:italic }

/* ============= */
/* = slideshow = */
/* ============= */
div.slideshow { position:relative; width:600px; height:540px }
div.slideshow img { position:absolute; top:0; left:0; z-index:8 }
div.slideshow img.bovenop   { z-index:10 }
div.slideshow img.erachter  { z-index:9 }
div.slideshow div.buttons   { position:absolute; left:x; bottom:y }
div.slideshow div.buttons a { display:inline-block; width:10px; height:10px; background:url(../gfx/xxx.gif) }


