/*
   monumententoezicht.css
   YPOS8 - monumenttoezicht
   
   Created by Ronald Werring on 2013-03-07.
   Copyright 2013 YPOS internettoepassingen BV. All rights reserved.
*/
body { margin:0; padding:0; color:#636363; color:#555; background:#b5b5b5; font:small Verdana }
div.wrapper { position:relative; margin:0 auto; width:980px; background:white; padding:0 0 60px }
div#webetui_bar { z-index:14 }

div.header { padding:24px 20px 20px 40px; height:76px }
div.header img.logo { display:block }
div.header img.erm { position:absolute; left:492px; top:23px }
div.header a.aantal { display:block; position:absolute; border:1px solid #e9e9e9; right:20px; margin:0; top:30px; padding:13px 40px 13px 13px; color:#636363; font-size:100%; text-decoration:none }
div.header a.aantal:hover { text-decoration:underline }
div.header a.aantal strong { display:block; position:absolute; text-align:center; right:4px; top:6px; width:30px; height:29px; padding:7px 0 0 0; background-image:url(../gfx/icon-toezichtsrapportage-large.png); background-repeat:no-repeat;  }
div.header a.selected strong { color:white; background-position:0 -114px }

h1 { color:#C1192B; font-weight:normal; margin:0 0 1em 20px; font-size:170% }
h2 { color:#544174; margin:30px 0 10px 20px; font-size:120% }
h3 { color:#544174; margin:0 0 10px 20px; font-size:100%}
h4 {}
h5 {}
  
p { line-height:1.5em; margin:0 0 1em  }


div.text>p { margin:0 40px 1.5em 20px }

div.text ul { margin:0 40px 1.5em 36px; padding:0 }
ol {}
div.text li { line-height:1.5em }

div.text table { margin:0 40px 1.5em 20px }
th { background:#aaa; color:white }
td, th { text-align:left; padding:5px 12px; vertical-align:top; font-size:90%; line-height:1.8em  }
tr.even td { background:#f4f4f4 }


a { color:#544174; outline:0; }
a:hover { }

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

div.clear { clear:both }

div.banner a { display:block; padding:16px 20px; margin:20px 20px 20px 20px; font:24px Times; color:white; background:#534173; text-decoration:none }
div.banner { display:block; padding:16px 20px; margin:20px 20px 20px 20px; font:24px Times; color:white; background:#534173; text-decoration:none }

div.intro { color:white; background:#b50013; padding:15px 40px 10px 40px; margin:0 20px 24px 0; min-height:94px; }
div.intro p { margin:0; line-height:22px }
div.intro p em { font-size:115%; line-height:1.5em; display:block; float:left; width:410px; margin:0 38px 0 0; color:rgba(255,255,255,1) }
/*body.index div.intro p { margin-left:458px }*/
body.index div.intro p  { width:420px; float:left }
body.index div.intro ul { margin:0 0 10px 450px; padding:0 0 0 0; font-size:90%; color:rgba(255,255,255,0.9); list-style-type:none }
body.index div.intro li { background-image:url(../gfx/bullet.png); padding:0 0 0 10px; background-repeat:no-repeat; background-position:0 7px }
body.index ul.menu2 { margin-bottom:0 }
body.index ul.breadcrumb { display:none }
/*body.index div.intro li:before { content:'. ' }*/

/*div.intro p { -moz-column-count:2;  -moz-column-gap:55px; -webkit-column-count:2;  -webkit-column-gap:55px; column-count:2;  column-gap:55px; }*/

div.menu { position:relative }
form#zoeken { display:block; position:absolute; width:24px; padding:6px 0 4px 6px; height:20px; right:20px; top:150px; }
form#zoeken input.text { display:block; float:left; border:0; height:16px; padding:1px; margin:0 4px 0 0; float:left; width:0px; display:none }
form#zoeken input.submit { display:block; width:19px; height:19px; border:0; background:transparent url(../gfx/search.png) no-repeat; background-position:0 -1px; cursor:pointer }
form#zoeken input.submit:hover, form#zoeken.selected input.submit { background-position:0 -30px; }

form#zoeken.selected { width:178px; background:rgba(132,132,132,0.95); }
form#zoeken.selected input.text { display:block; width:148px }

div.search_results h5 { margin:0 0 8px 20px }
div.search_results p { margin:0 0 20px 20px }

/* =========== */
/* = topmenu = */
/* =========== */

ul.menu3    {  position:absolute; right:20px; top:-32px; margin:0 auto; }
ul.menu3    {  margin:0; padding:0; display:inline; float:right; margin:0; }
ul.menu3 li {  background:url(../gfx/streepje_topmenu.gif) no-repeat; background-position:right 9px; display:block; float:left; margin:0; padding:0 0 12px; position:relative }

ul.menu3 li a { display:block; text-decoration:none; font-family:Verdana; font-size:12px; text-transform:uppercase; padding:7px 14px 0 14px; color:#3c3c3c; }
ul.menu3 li a:hover,
ul.menu3 li a.selected { color:#b50013; }

ul.menu3 li div.container { z-index:100; position:absolute; visibility:hidden; left:0; /*border:1px solid orange;*/ padding:0; overflow:hidden; top:30px; width:160px; margin-left:0; }
ul.menu3 li div.container ul { position:absolute; width:160px; margin:0; padding:0 }
ul.menu3 li div.container ul li { float:none; display:block; padding:0; margin:0; border:0; background:none; }
ul.menu3 li div.container ul a  { float:none; color:white; text-transform:none; text-align:left; border:0; height:22px; line-height:16px; background:rgba(132,132,132, 0.95); padding:6px 0px 0 20px; border-top:1px solid rgba(0,0,0,0.1); border-bottom:1px solid rgba(255,255,255,0.1)  }
ul.menu3 li div.container ul a:hover { background:#b5b5b5; color:#3c3c3c; }
ul.menu3 li div.container ul a.selected { background-position:0 -30px; color:#3c3c3c; }

/*div#menu1 ul li ul { display:none; }*/

/* =========== */
/* = submenu = */
/* =========== */
/*
div#menu1 ul li div.container { z-index:100; position:absolute; visibility:hidden; padding:0; overflow:hidden; top:38px; width:231px; margin-left:0; }
div#menu1 ul li div.container ul { position:absolute; width:160px; }
div#menu1 ul li div.container ul li { float:none; display:block; padding:0; margin:0; border:0; background:none; }
div#menu1 ul li div.container ul a  { float:none; text-transform:none; text-align:left; border:0; height:22px; line-height:16px; padding:6px 0 0 26px; background-image:url(../gfx/menu1_bg.png); background-color:transparent; background-position:0 0; }
div#menu1 ul li div.container ul a:hover { background-position:0 -30px; color:#b50013; }
div#menu1 ul li div.container ul a.selected { background-position:0 -30px; color:#b50013; }
*/
/* ======== */
/* = menu (grijs) = */
/* ======== */
div.menu img { display:block }
ul.menu2    { margin:0 20px 20px 0; height:30px; background-color:#b5b5b5; padding:0; }
ul.menu2 li { list-style-type:none; float:left; margin:0; border-right:1px solid #cbcbcb; width:auto; position:relative; }
ul.menu2 li:last-child { border-right:0; width:auto; }
ul.menu2 li a { height:23px; color:#3c3c3c; font-family:Verdana; font-size:12px; text-transform:uppercase; padding:7px 12px 0 12px; display:block; text-decoration:none; }
ul.menu2 li:hover a,
ul.menu2 li a:hover,
ul.menu2 li a.selected { color:white; background:rgba(132,132,132,0.95); }
ul.menu2 li a#feedback { color:white; border-right:1px solid #cbcbcb }

ul.menu2 li div.container { z-index:100; position:absolute; visibility:hidden; left:0; /*border:1px solid orange;*/ padding:0; overflow:hidden; top:30px; width:160px; margin-left:0; }
ul.menu2 li div.container ul { position:absolute; width:160px; margin:0; padding:0 }
ul.menu2 li div.container ul li { float:none; display:block; padding:0; margin:0; border:0; background:none; }
ul.menu2 li div.container ul a  { float:none; color:white; text-transform:none; text-align:left; border:0; height:22px; line-height:16px; background:rgba(132,132,132, 0.95); padding:6px 0px 0 20px; border-top:1px solid rgba(0,0,0,0.1); border-bottom:1px solid rgba(255,255,255,0.1)  }
ul.menu2 li div.container ul a:hover { background:#b5b5b5; color:#3c3c3c; }
ul.menu2 li div.container ul a.selected { background-position:0 -30px; color:#3c3c3c; }

/* ============== */
/* = breadcrumb = */
/* ============== */
ul.breadcrumb { margin:0 0 20px 20px; padding:0; list-style-type:none; font-size:115%; color:#999 }
ul.breadcrumb li { display:inline }
ul.breadcrumb span { color:#C1192B }
ul.breadcrumb a  { text-decoration:none; }

/* =================== */
/* = richtlijnenmenu = */
/* =================== */
div.text ul.menu1 { margin:0 20px 0 0; padding:0 0 0 20px; list-style-type:none; min-height:270px; background:white url(../gfx/menu1-bg.gif) repeat-x; border-top:1px solid #e9e9e9 }
ul.menu1 a { display:block; text-decoration:none; color:#636363; margin:0; line-height:1.1em }
ul.menu1>li>a { cursor:default }
ul.menu1>li { display:block; width:153px; padding:0; float:left }
ul.menu1>li ul { margin:0; padding:0; list-style-type:none }
ul.menu1>li>ul>li { padding:0; margin:0 0 0;  }
ul.menu1>li>a { color:#b80007; color:#544174; font-weight:bold; margin:0 0 0; padding:7px 0px 0 20px; height:23px;  }
ul.menu1>li>ul>li>a { text-transform:lowercase; border-bottom:1px solid #e9e9e9; padding:6px  0px 0 20px; height:23px; background:white url(../gfx/arrow.png) no-repeat; background-position:right 9px }
ul.menu1>li>ul>li>a:hover    { color:#544174; background-position:right -61px }
ul.menu1>li>ul>li>a.down     { color:#544174; background-position:right -128px }
ul.menu1>li>ul>li>a.selected { color:#544174; background-position:right -128px }
ul.menu1>li>ul>li>ul { display:none; position:absolute; left:0; margin:0; width:940px  }
ul.menu1>li>ul>li>ul>li { background:#f4f4f4; height:29px; padding-left:346px; margin:0; border-bottom:1px solid white;  }
ul.menu1>li>ul>li>ul>li a { text-transform:lowercase; padding:7px 0 0 14px; background-image:url(../gfx/arrow.png); background-repeat:no-repeat; background-position:-1px 9px; font-size:90% }
ul.menu1>li>ul>li>ul>li a:hover { color:#544174; background-position:-1px -61px }


/*div.index ul.menu1 { margin:0 20px 0 0; padding:0 0 0 0px; list-style-type:none; border-top:1px solid #e9e9e9 }
div.index ul.menu1 ul { display:none }
div.index ul.menu1 a { display:block; text-transform:lowercase; text-decoration:none; color:#636363; margin:0; line-height:1.1em }
div.index ul.menu1>li>a { border-bottom:1px solid #e9e9e9; padding:6px  0px 0 20px; height:23px; background:white url(../gfx/arrow.png) no-repeat; background-position:right 9px }
div.index ul.menu1>li>a:hover    { color:#544174; background-position:right -61px }
*/

/* ============= */
/* = richtlijn = */
/* ============= */

div.juridisch { margin:0 0 30px }
div.juridisch>h2,
div.technisch>h2 { color:white; background:#b70004; font-size:110%; font-weight:normal; padding:5px 0 0 10px; height:25px; margin:0px 20px 0 0; border-left:20px solid #940007  }

body.toezichtsrapportage div.technisch>h2,
body.toezichtsrapportage div.juridisch>h2 { background:#544174; border-left:20px solid #43345d }

div.richtlijn.bordertop { border-top:1px solid #e9e9e9 }
div.richtlijn { margin:0 20px 0 0; position:relative }
div.richtlijn h2 { color:#636363; margin:0; padding:4px 160px 5px 30px;  background:#fff url(../gfx/arrow.png) no-repeat; background-position:943px 9px; font-weight:normal; font-size:100%; line-height:1.5em; cursor:pointer; border-bottom:1px solid #d9d9d9; min-height:20px }

h2.move { position:absolute; color:#636363; margin:0; padding:4px 10px 5px 10px; background:#f2f2f2; font-weight:normal; font-size:100%; line-height:1.5em; border:1px solid #d9d9d9; min-height:20px; max-height:36px; overflow:hidden }

span.breadcrumb { font-size:85% }

div.richtlijn h2 strong { color:#636363; }
div.richtlijn h2 a.add { display:none; position:absolute; left:780px; top:4px; height:22px; background-image:url(../gfx/icon-toezichtsrapportage-small.png); background-repeat:no-repeat; text-decoration:none; width:130px; padding:0 0 0 22px; font-size:11px }
div.richtlijn h2 span.added { display:block; position:absolute; left:896px; top:3px; width:18px; height:22px; background-image:url(../gfx/icon-toezichtsrapportage-small.png); background-position:0 -78px }
div.richtlijn h2 a.add:hover { background-position:0 -78px }
div.richtlijn h2 a.del { position:absolute; left:896px; top:3px; width:18px; height:22px; background-image:url(../gfx/icon-toezichtsrapportage-small_verwijder.png) }
div.richtlijn h2 a.del:hover { background-position:0 -78px }

div.richtlijn div.actie { display:none; padding:15px 30px 15px 10px; border-left:20px solid #838383; font-size:85% }
div.richtlijn div.actie textarea { width:600px; height:90px; font:small Verdana; border:1px solid #bbb; display:block; }
div.richtlijn div.number { width:20px; color:#fff; font-size:100%; padding:4px 0 5px 0; text-align:center; background:#ccc; position:absolute; left:0; top:0;line-height:1.5em; border-bottom:1px solid #b1b1b1;   }
div.actie h3 { font-size:105%; font-weight:bold; color:#544174; margin:0 0 10px }
div.actie p  {  }

div.richtlijn div.actie div.foto { height:75px; margin:0 0 15px }
div.richtlijn div.actie div.foto br { display:none }
div.richtlijn div.actie img { display:block; height:75px; float:left; margin:0 10px 0 0; cursor:pointer }
div.richtlijn div.actie div.foto a.zoom { width:11px; height:10px; background-image:(../gfx/icon-zoom.png) }
div.richtlijn div.actie div.foto a.zoom.hover { background-position:}

div.text>div.foto { height:75px; margin:0 0 15px 20px }
div.foto br { display:none }
div.foto img { display:block; height:75px; float:left; margin:0 10px 0 0; cursor:pointer }

div.richtlijn.hover { background:#ebebeb }
div.richtlijn.hover h2 { background:#ebebeb url(../gfx/arrow.png) no-repeat; background-position:943px -61px; }
div.richtlijn.hover h2 strong {  }
div.richtlijn.hover div.number { color:white; background:#838383 }

div.richtlijn.selected { background:#f2f2f2 }
div.richtlijn.selected h2 { background:#f2f2f2 url(../gfx/arrow.png) no-repeat; background-position:941px -128px;  }
div.richtlijn.selected a.add { display:block }
div.richtlijn.selected h2 strong { }
div.richtlijn.selected div.number { color:white; background:#513e6e; border-color:#695c81 }

div.ja, div.nee { display:none; }
div.selected, div.selected { display:block }
div.antwoord h5 { color:white; background:#b70004; padding:6px 8px; min-height:29px; margin:0; float:left; font-size:100%; font-weight:normal; text-transform:uppercase; letter-spacing:1px; line-height:1.3em;  margin-right:12px }
div.antwoord p { min-height:29px; padding:6px; background:white; margin:10px 0 0 0; font-weight:normal; line-height:1.3em }
div.vraag { position:relative;  font-weight:bold; margin:10px 0 0 0; padding:10px 0px 10px 0; line-height:1.5em; border-top:1px solid #d9d9d9 }
div.vraag div.vtext { padding-right:100px }
div.vraagopm { font-weight:normal; width:740px; }

a.radio { display:block; position:absolute; top:10px; text-decoration:none; color:#636363; padding:0 0 0 20px; height:17px; background-image:url(../gfx/radiobutton.png); background-repeat:no-repeat; background-position:0 -27px  }
a.radio.selected { background-position:0 0 }
a.ja    { left:780px }
a.nee   { left:825px }

/* ============= */
/* = slideshow = */
/* ============= */
div.slideshow { width:960px; height:150px; margin:0 }
div.slideshow ul { display:none }
div.slideshow img { width:960px; height:150px;}

/* ============= */
/* = formulier = */
/* ============= */
form { margin:0; padding:0 }
div.formulier { margin:0 0 20px 20px }
body.toezichtsrapportage div.formulier { padding:40px 40px 8px 20px; position:relative; margin:0px 20px 40px 0; height:160px; color:white; background:#b50013 }
p.form  { margin:0 40px 1.5em 20px; }
body.toezichtsrapportage div.formulier div { float:left; width:230px; }
body.toezichtsrapportage div.formulier div.opmerkingen { float:left; width:690px; }
div.formulier label { display:block; font-size:85%; margin:0 0 4px; font-style:italic; }
div.formulier input.text, 
div.formulier textarea { font:small Verdana; border:1px solid #bbb; display:block; width:200px; margin:0 0 8px; padding:2px 4px }
div.formulier textarea { width:660px; height:70px }
div.formulier input.submit { font:11px Verdana; text-transform:uppercase; cursor:pointer }
div.formulier input.submit:hover { color:#b50013; }
body.toezichtsrapportage div.formulier div.submit { width:120px; padding:20px 0 0 0 }
body.toezichtsrapportage div.formulier div.error { position:absolute; left:20px; top:12px; width:800px }

/* ================ */
/* = mini-enquete = */
/* ================ */
div.enquete form.formulier { margin:40px 140px 20px 100px }
div.enquete form.formulier label { display:block; margin:0 0 4px; font-weight:bold; font-size:95%; line-height:1.5em }
div.enquete form.formulier input.text { display:block; margin:0 0 20px; width:500px; border:1px solid #b5b5b5; font:13px Verdana  }
div.enquete form.formulier textarea { display:block; margin:0 0 20px; width:500px; border:1px solid #b5b5b5; font:13px Verdana }

div.enquete form.formulier div.radiogroup { margin:10px 0 30px 0px }
div.enquete form.formulier div.radio_item { margin:0 0 8px 0 }
div.enquete form.formulier span.radio_label { font-size:95%; cursor:pointer; }
div.enquete form.formulier span.radio_label:hover { color:#C1192B; }

div.enquete form.formulier div.checkbox { margin:10px 0 30px 0px }
div.enquete form.formulier div.checkboxgroup div { margin:0 0 8px 0 }
div.enquete form.formulier span.checkbox_label { font-size:95%; cursor:pointer; }
div.enquete form.formulier span.checkbox_label:hover { color:#C1192B; }

div.enquete form.formulier div.andere label { display:none; }
div.enquete form.formulier div.andere input.text { margin:0; width:300px; position:absolute; margin:-48px 0 0 150px; }
div.enquete form.formulier div.andere { display:none; }

div.enquete form.formulier h2 { margin:10px 0 }
div.enquete form.formulier h3 { margin:30px 0 20px 0 }

div.enquete div.form_bedankt { margin:40px 140px 20px 100px; font-weight:bold; }
div.enquete div#error { color:#C1192B; margin:0 0 20px;}

/* ================= */
/* = film homepage = */
/* ================= */
div.film { display:none; position:absolute; left:180px; top:225px; background:#b50013; padding:40px; box-shadow:0 0 10px rgba(0,0,0,0.3) }
div.film a.close { display:block; position:absolute; right:8px; top:4px; font-size:24px; text-decoration:none; color:white }
a#film { position:absolute; display:block; right:36px; top:312px }

/* ========= */
/* = popup = */
/* ========= */
div.popup { position:absolute; z-index:100; width:900px; height:390px; background:white; box-shadow:0px 0px 8px rgba(0,0,0,0.3) }
div.popup h2 { margin:0 0 20px; padding:8px 0 0 20px; height:22px; font-size:100%; cursor:move; background:#b5b5b5; font-weight:normal; color:white; text-transform:uppercase; padding:6px 0 0 20px; height:24px }
div.view  { overflow:auto; position:relative; height:340px; width:900px;  }
div.fotos { position:absolute; padding-left:20px }
div.fotos div.foto { background:#f2f2f2; float:left; height:300px; max-width:320px; margin:0 20px 0 0 }
div.fotos div.foto img { display:block; height:240px }
div.fotos div.foto p { font-size:85%; padding:10px }
div.popup a.close { position:absolute; right:10px; top:10px; width:12px; height:12px; background-image:url(../gfx/x.png) }
div.popup a.close:hover { background-position:0 -88px }

div.feedback { width:360px; height:420px; right:20px; top:254px }
div.feedback h2 { background:#b5b5b5; font-weight:normal; color:white; text-transform:uppercase; padding:6px 0 0 20px; height:24px }
div.feedback form { margin:0; padding:10px 20px }
div.feedback form label { font-size:85%; display:block; margin:0 0 3px }
div.feedback form input.text { border:1px solid #999; width:310px; margin:0 0 10px; padding:2px 4px }
div.feedback form textarea { border:1px solid #999; width:310px; font:11px verdana; padding:2px 4px; margin:0 0 10px }
div.feedback form div.static { border:1px solid #999; background:#f1f1f1; width:310px; padding:2px 4px; margin:0 0 10px; font:11px verdana; }
div.feedback form div#error { color:#e00; font-weight:bold; margin:0 0 20px;}

/* ======= */
/* = FAQ = */
/* ======= */
body.faq h2 { font-size:90%; padding:0 0 0 20px; margin:0 0 10px 20px; cursor:pointer; background-image:url(../gfx/expand.gif); background-repeat:no-repeat; background-position:0 2px }
body.faq h2.expanded { background-position:0 -486px }
body.faq p { display:none; font-size:90%; margin:-7px 0 20px 40px }
body.faq div#webetui_body p { display:block }
body.faq p.expanded { display:block;  }

/* ==================== */
/* = melding homepage = */
/* ==================== */
div.melding { color:white; padding:0; position:absolute; right:48px; top:70px; padding:24px 0 0 0; z-index:14; width:124px; height:122px; text-align:center; background-image:url(../gfx/bg_melding.png); background-repeat:no-repeat; font:12px Arial }
