/* ==================================================================================================================== Global Site CSS ==================================================================================================================== */ html, body{ width:100%; position:relative; margin:0px; } body{ background-color:#e3decd; color:#990000; font-family:arial,helvetica,sans-serif; font-size:12px; line-height:150%; } a{ color:#003399; } /* old: 004D99 */ #CONT{ position:relative; width:1200px; margin:10px auto; } #HEAD{ position:relative; height:150px; } #MID{ background:transparent url(./img/back_mid.png) repeat-y left top; padding:10px 20px 50px 20px; } #FOOT{ background:transparent url(./img/back_mid.png) repeat-y left top; padding:10px 20px; } #BOT{ background:transparent url(./img/back_foot.png) no-repeat left top; height:10px; } #LANG{ position:absolute; left:1010px; top:33px; width:160px; } #LANG a{ text-decoration:none; color:#990000; font-weight:bold; display:block; margin-bottom:20px; padding-left:30px; } #TOPMENU{ position:absolute; top:90px; left:6px; right:6px; height:30px; padding:0px 6px; } #TOPMENU ul{ margin:0px; padding:0px; } #TOPMENU li{ border:0px solid white; display:inline-block; margin-right:2px; padding-left:10px; height:30px; line-height:30px; background:transparent url(./img/menuitem_top.png) no-repeat left top; } #TOPMENU a{ text-decoration:none; border:0px solid red; color:#FFFFCC; font-weight:bold; letter-spacing:1px; font-size:13px; display:inline-block; cursor:pointer; padding:2px 15px 0px 5px; background:transparent url(./img/menuitem_top.png) no-repeat right top; } #TOPMENU li:hover, #TOPMENU li.SEL{ background:transparent url(./img/menuitem_top_over.png) no-repeat left top; } #TOPMENU li:hover a, #TOPMENU li.SEL a{ color:#990000; background:transparent url(./img/menuitem_top_over.png) no-repeat right top; } #TOPSUB{ position:absolute; top:121px; left:6px; right:6px; height:29px; padding:0px 6px; } #TOPSUB ul{ margin:0px; padding:0px; margin-left:10px; } #TOPSUB li{ display:inline-block; margin-right:10px; height:28px; line-height:28px; } #TOPSUB a{ text-decoration:none; color:#666666; font-weight:bold; letter-spacing:1px; font-size:12px; display:inline-block; cursor:pointer; padding:0px 10px; letter-spacing:0px; } #TOPSUB li:hover a, #TOPSUB li.SEL a{ color:#990000; } #FOOTMENU{ text-align:center; } #FOOTMENU span{ display:inline-block; vertical-align:top; text-align:left; margin:10px; line-height:125%; width:100px; font-size:12px; } #FOOTMENU a{ text-decoration:none; color:#990000; font-size:11px; } #FOOTINFO{ text-align:center; font-weight:bold; font-size:11px; letter-spacing:0px; } #LOGIN{ position:absolute; left:800px; top:23px; width:180px; height:90px; overflow:hidden; border:0px solid red; } #LOGIN div{ font-size:10px; } #XT{ text-align:right; font-size:10px; padding-right:20px; } #XT a{ text-decoration:none; color:#999999; } #DATA{ border:0px solid red; display:inline-block; width:960px; font-size:14px; line-height:150%; height:auto; } h1{ margin:0px; margin-bottom:10px; font-size:14px; text-align:center; color:#AA0000; } #PROMO{ border:0px solid red; display:inline-block; width:190px; vertical-align:top; } #PROMO .BOX{ margin-bottom:10px; padding:0px; background:transparent url(./img/textbox190.png) repeat-y left top; text-align:center; } #PROMO h2{ margin:0px 0px 0px 0px; padding:0px; height:30px; background:transparent url(./img/textbox190.png) no-repeat -190px top; text-align:center; line-height:30px; font-size:14px; } #PROMO h2 a{ line-height:30px; font-size:14px; text-decoration:none; color:#990000; } #PROMO .BOT{ margin-top:0px; padding:0px; height:10px; background:transparent url(./img/textbox190.png) no-repeat -190px bottom; } #PROMO .BOX img{ width:160px; border:0px; margin:10px 0px 0px 0px; } #TEXTBOX350, #TEXTBOX800{ position:relative; padding:50px 0px 10px 0px; margin:0px auto; } #TEXTBOX350 h2, #TEXTBOX800 h2{ position:absolute; margin:0px; top:0px; left:0px; height:40px; line-height:45px; color:#990000; font-size:16px; text-align:center; } #TEXTBOX350 .TEXTBOXBOT, #TEXTBOX800 .TEXTBOXBOT{ position:absolute; margin:0px; padding:0px; bottom:0px; left:0px; height:10px; } .TEXTBOXPIC{ display:inline-block; vertical-align:top; margin:10px 40px 0px 50px; } .TEXTBOXTXT{ display:inline-block; vertical-align:top; margin:10px 0px 0px 0px; } .TEXTBOXTXT h3{ font-size:14px; display:inline-block; color:#AA0000; font-weight:bold; margin:0px;} .TEXTBOXTXT .S50{ display:inline-block; width:50px; padding-right:20px; vertical-align:top; } .TEXTBOXTXT .S100{ display:inline-block; width:100px; padding-right:20px; vertical-align:top; } .TEXTBOXTXT .S160{ display:inline-block; width:160px; padding-right:20px; vertical-align:top; text-align:right; } .TEXTBOXFOOTER{ clear:both; text-align:center; font-weight:bold; margin:50px 20px;} #TEXTBOX350{ width:350px; background:transparent url(./img/textbox350.png) repeat-y left top; } #TEXTBOX350 h2{ width:350px; background:transparent url(./img/textbox350.png) no-repeat -350px top; } #TEXTBOX350 .TEXTBOXBOT{ width:350px; background:transparent url(./img/textbox350.png) no-repeat -350px bottom; } #TEXTBOX800{ width:800px; background:transparent url(./img/textbox800.png) repeat-y left top; } #TEXTBOX800 h2{ width:800px; background:transparent url(./img/textbox800.png) no-repeat -800px top; } #TEXTBOX800 .TEXTBOXBOT{ width:800px; background:transparent url(./img/textbox800.png) no-repeat -800px bottom; } #TEXTBOX800 .TEXTBOXTXT{ width:480px; color:#004D99; } #TEXTBOX800 #TARIF{ border:1px solid #990000; height:auto; font-size:12px; width:90%; padding:10px; } #TEXTBOX800 #TARIF td{ padding:2px; vertical-align:top; } #TEXTBOX800 #TARIF .BOR{ border:1px solid #CC0000; } .TEXTBOXCOL{ float:left; width:350px; margin:10px 20px; } .TEXTBOXPIC a{ display:block; text-align:right; width:150px; line-height:30px; text-decoration:none; color:#990000; } .TEXTBOXPIC a.SEL{ font-weight:bold; } /* ==================================================================================================================== Global Site Classes ==================================================================================================================== */ .HR, .HR2{ background-color:#CCCCCC; height:1px; margin:5px 20px 5px 0px; } .HR2{ background-color:#990000; } .HR3{ background-color:#CCCCCC; height:1px; margin:15px 0px 15px 20px; } .HR4{ background-color:#CCCCCC; height:1px; margin:15px 20px; } .HR5{ background-color:#CCCCCC; height:1px; margin:75px 0px 0px 0px; } .HR6{ background-color:#CCCCCC; height:1px; margin:20px 0px 20px 0px; } .AR{ text-align:right; } .AC{ text-align:center; } .CLEAR{ clear:both; } .RED{ color:#CC0000; } #DATA form span.RED{ padding:0px; } .TU{ text-decoration:underline; } .MSG{ text-align:center; color:#DD0000; font-weight:bold; margin-top:10px; } .NONE{ display:none; } .BLOCK{ display:block; } .IBLOCK{display:inline-block; } .W80{ width:80px; } .W100{ width:100px; } .W200{ width:200px; } .W260{ width:260px; } .W380{ width:380px; } .WP40{ width:40%; } .WP20{ width:20%; } .WP15{ width:15%; } .XT_NAV{ text-align:center; font-weight:bold; border:0px solid #CCCCCC; margin:0px auto; padding:0px 20px; } .XT_NAV span, .XT_NAV a{ padding:5px 20px; margin:0px 0px; line-height:25px; border:1px solid #FFFFFF; text-decoration:none; } .XT_NAV a:hover{ background-color:#FFFFCC; color:#990000; border:1px solid #660000; cursor:pointer; } /* ==================================================================================================================== FORM CONTROLS ==================================================================================================================== */ /* 28-12-2018 changed all form to fieldset => changed back on 28/8 for "mijn gegevens" !!!*/ #DATA form label, #DATA form div.label{ display:block; margin-bottom:10px; margin-top:0px; line-height:20px; vertical-align:middle; padding:0px; font-size:12px; } #DATA form label{ height:20px; } #DATA form div.label{ min-height:20px; } #DATA form span{ display:inline-block; width:140px; text-align:right; padding-right:10px; } #DATA form input{ vertical-align:top; } #DATA .TXT, #DATA .TXTMOD, #DATA select, #DATA .TXTOK, #DATA .TXTNOK { padding:0px 5px; font-size:12px; width:190px; height:20px; line-height:20px; border-width:0px; background:transparent url(./img/form_w200.png) no-repeat left -30px; } #DATA form .TXT[readonly]{ background-position: left -50px; } #DATA form .TXTMOD{ background-position: left -70px; cursor:pointer; padding-right:35px; width:160px; } #DATA form select{ width:200px; padding-right:0px; padding-top:1px; } #DATA form .TXTOK{ background-position: left -90px; padding-right:35px; width:160px; } #DATA form .TXTNOK{ background-position: left -110px; padding-right:35px; width:160px; } #DATA form .BUT, #DATA form .BUT2 { cursor:pointer; line-height:normal; font-size:12px; font-weight:bold; letter-spacing:1px; width:200px; height:25px; border-width:0px; background:transparent url(./img/form_w200.png) no-repeat left top; color:#FFFF99; } #DATA form .BUT2{ width:100px; background-position: left -135px;} #DATA form .BUT:disabled{ background:transparent url(./img/form_w200_disabled.png) no-repeat left top; cursor:default; } #DATA form input[type="button"]::-moz-focus-inner { border:0; } /* 28-12-2018 changed all form to fieldset ---STOP--- */ #PROMO label, #LOGIN label{ display:block; margin-bottom:7px; height:15px; line-height:15px; vertical-align:middle; padding:0px; } #PROMO label{ margin:10px 0px 0px 0px; } #PROMO span, #LOGIN span{ display:inline-block; width:75px; text-align:right; padding-right:5px; } #PROMO span{ width:40px; } #PROMO input, #LOGIN input{ vertical-align:top; } #PROMO .TXT, #LOGIN .TXT{ padding:0px 5px 0px 5px; font-size:10px; width:80px; height:15px; line-height:14px; border-width:0px; background:transparent url(./img/form_w90.png) no-repeat left top; } #PROMO .TXT[readonly], #LOGIN .TXT[readonly]{ background-position: left -45px; } #PROMO .BUT, #LOGIN .BUT{ vertical-align:middle; cursor:pointer; padding-bottom:1px; font-size:10px; font-weight:bold; letter-spacing:1px; width:90px; height:20px; border-width:0px; background:transparent url(./img/form_w90.png) no-repeat left -20px; color:#FFFF99; } form #MAILBOX label span{ line-height:25px; width:100px; font-weight:bold; } form #MAILBOX label span{ line-height:25px; width:100px; font-weight:bold; } form #MAILBOX label { height:auto; } /* ==================================================================================================================== Page specific elements ==================================================================================================================== */ #LOGINFORM{ width:350px; margin:0px auto; border:0px solid red; } #MAILBOXPIC{ width:100px; height:100px; margin:30px 50px; background:transparent url(./img/icons_mailbox.png) no-repeat 0px 0px; } #MAILBOXPIC.NEW{ background-position: 0px -100px; } #MAILBOXPIC.IN{ background-position: 0px 0px; } #MAILBOXPIC.OUT{ background-position: -100px 0px; } #MAILBOXPIC.DEL{ background-position: -100px -100px; } #MAILBOX table{ width:460px; border:0px solid #99CCFF; border-collapse:collapse; margin-top:10px; } #MAILBOX table th{ padding:0px 2px; text-align:left; } #MAILBOX table td{ padding:4px 3px; } #MAILBOX table tr:hover{ background-color:#FFFF66; } #MAILBOX .MAILDEL, #MAILBOX .MAILREAD, #MAILBOX .MAILREPLY, #MAILBOX .MAILTRASH { display:inline-block; vertical-align:middle; width:30px; height:20px; cursor:pointer; margin-right:10px; background:transparent url(./img/icons_mailbox_actions.png) no-repeat 0px 0px; } #MAILBOX .MAILDEL{ background-position:0px -20px; } #MAILBOX .MAILREAD{ background-position:0px 0px; } #MAILBOX .MAILREPLY{ background-position:0px -40px; } #MAILBOX .MAILTRASH{ background-position:0px -60px; } #ZOEKERTJESCONT .TEXTBOXPIC{ color:#004D99; margin:10px 40px; width:160px; line-height:200%; } #ZOEKERTJESCONT .TEXTBOXPIC a{ width:100%; color:#004D99; font-weight:bold; text-align:right;} #ZOEKERTJESCONT .TEXTBOXPIC a.SEL, #ZOEKERTJESCONT .TEXTBOXPIC a:hover{ color:#AA0000; } #ZOEKERTJESCONT .TEXTBOXPIC h3{ margin:0px; padding:0px; font-size:12px; } #ZOEKERTJESCONT .TEXTBOXTXT{ margin:10px 40px 10px 0px; width:500px; } #ZOEKERTJESCONT .TEXTBOXTXT h3{ display:block; text-align:center; margin:0px; margin-bottom:20px; padding:0px; font-size:12px; } .ZOEKERTJE1, .ZOEKERTJE2{ position:relative; width:500px; margin-bottom:30px; } .ZOEKERHEAD{ color:#FFFFCC; height:25px; background:transparent url(./img/zoekertje-box.png) no-repeat 0px 0px; font-weight:bold; line-height:25px; padding-left:20px; } .ZOEKERHEAD a{ display:inline-block; color:#FFFFCC; margin:0px 20px; font-size:13px; line-height:27px; } .ZOEKERDATA{ background:transparent url(./img/zoekertje-box.png) repeat-Y -500px 0px; vertical-align:top; } .ZOEKERFOTOS{ border:0px solid #CCCCCC; margin:0px 20px; padding:0px; font-size:11px; color:#AAAAAA; } .ZOEKERFOTOS img{ width:100px; margin:0px 10px; border:1px solid #CCCCCC; vertical-align:top; } .ZOEKERFOOT{ background:transparent url(./img/zoekertje-box.png) no-repeat 0px -50px; height:50px; } .ZOEKERREF{ text-align:right; padding-right:20px; padding-top:20px; font-size:10px; } .ZOEKERPIC{ border:0px solid red; margin:10px 0px 10px 10px; padding:0px; vertical-align:top; } .ZOEKERTJE1 .ZOEKERPIC{ display:inline-block; } .ZOEKERTJE2 .ZOEKERPIC{ margin-right:10px; } .ZOEKERPIC img{ display: block; padding:10px; border:1px solid #CCCCCC; margin:0px; } .ZOEKERTJE1 .ZOEKERPIC img{ width:180px; } .ZOEKERTJE2 .ZOEKERPIC img{ width:240px; margin:0px auto; } .ZOEKERTEKST{ display:inline-block; border:1px solid #CCCCCC; margin:10px; padding:10px 10px 20px 10px; } .ZOEKERTJE1 .ZOEKERTEKST{ width:246px; } .ZOEKERTJE2 .ZOEKERTEKST{ width:458px; margin-bottom:0px; } .SCHEMA{ margin:20px 50px; border-collapse:collapse; } #ORDER .SCHEMA{ margin:20px 0px; } .SCHEMA td{ text-align:center; color:#004D99; font-weight:bold; letter-spacing:auto; } .SCHEMA .STXT{ padding:10px 10px; width:180px; border:1px solid #999999; } #ORDER .SCHEMA .STXT{ width:150px; } #ORDER .SCHEMA .SARROW, .SCHEMA .SARROW{ display:block; width:50px; height:50px; background:transparent url(./img/arrow-right.png) no-repeat 0px 0px; vertical-align:center; } .SCHEMA .H50{ height:50px; padding:0px; } .SCHEMA .ITA{ font-style:italic; } .SCHEMA .RED{ color:#CC0000; } .SCHEMA a{ display:block; text-decoration:none; } #ORDER .SCHEMA span{ vertical-align:middle; padding:0px; text-align:center; display:inline; } #CONDITIONS{ margin:20px 50px; width:700px; color:#004D99; } #CONDITIONS a{ color:#CC0000; font-weight:bold; } /* RESET ORDER FIELDSET LABEL EXAMPLE BUT NOT WORKING #ORDER fieldset label{ background:none; border:none; bottom:auto; clear:none; cursor:default; /* didn't really know what the default for display should be*/ /*display:inline;*//* float:none; font-family:Arial, Helvetica, sans-serif; font-size:medium; font-style:normal; font-weight:normal; height:auto; left:auto; letter-spacing:normal; line-height:normal; max-height:none; max-width:none; min-height:0; min-width:0; overflow:visible; position:static; right:auto; text-align:left; text-decoration:none; text-indent:0; text-transform:none; top:auto; visibility:visible; white-space:normal; width:auto; z-index:auto; } */ #ORDER{ margin:0px 50px; width:700px; color:#004D99; } #ORDER fieldset{ border:1px solid #990000; padding:10px 20px 20px 20px; display:none; } #ORDER legend{ background-color:#990000; color:#FFFFCC; font-weight:bold; padding:5px 20px 5px 20px; } #ORDER fieldset div.label, #ORDER fieldset label{ height:auto; border:0px solid grey; margin:10px 0px; padding:0px; } #ORDER fieldset label{ border:0px solid red; margin:0px; } #ORDER fieldset span{ border:0px solid green; vertical-align:top; width:auto; text-align:left; line-height:180%; word-wrap: break-word; } #ORDER fieldset span.S1{ border:0px solid green; width:180px; text-align:right; padding-right:10px; } #ORDER fieldset span.S2{ border:0px solid green; width:380px; } #ORDER fieldset span.S3{ border:0px solid green; width:325px; } #ORDER fieldset span.S4{ border:0px solid green; display:inline-block; width:335px; } #ORDER .RADIO{ vertical-align:middle; margin-top:-2px; } #ORDER .MARK{ display:block; border:1px solid #660000; background-color:#DDDDDD; padding:2px; text-align:center; } #ORDER h3{ font-size:14px; margin:10px 0px 10px 0px; padding-left:50px; } #ORDER .MSG{ margin:0px 0px 10px 0px; } #ORDER #BUTS{ width:100%; display:none; } #ORDER #BUTS td{ width:50%; padding:0px; text-align:center; } #ORDER #PROGRESS{ visibility:hidden; } #ORDER #P5DETAIL{ background-color:#FFFFCC; } #ORDER #P5DETAIL label{ height:auto; display:block; margin:1px 0px 0px 0px; line-height:150%; border:0px solid red; } #ORDER #P5DETAIL span{ display:inline-block; width:400px; text-align:left; vertical-align:top; word-wrap: break-word; background-color:#FFFFFF; padding-left:10px; } #ORDER #P5DETAIL span.S1{ display:inline-block; width:180px; text-align:right; padding-right:10px; background-color:#FFFFCC; } #ORDER #P5DETAIL h3{ font-size:12px; margin:10px 0px 10px 0px; padding-left:50px; } #MISS { position:relative; } #MISS #STEM { border-collapse:collapse; margin-top:10px; margin-left:100px; } #MISS td { padding:0px; } #MISS .MISS_NR { font-weight:bold; font-size:18px; padding:6px; padding-left:20px; border:1px solid red; } #MISS .MISS_SELECT img{ height:30px; width:50px; height:50px; } #MISS .MISS_DEL { text-align:center; } #MISS #MISS_WINDOW{ border:0px solid #990000; margin-left:100px; padding:12px; position:relative; width:550px;} #MISS #MISS_PIC { width:200px; border:1px solid #FF0000; vertical-align:top; } #MISS #MISS_NEXT , #MISS #MISS_PREV { width:30px; vertical-align:top; margin-top:10px; } #MISS #MISS_ALL { border:0px solid #990000; display:inline-block; width:250px; height:400px; margin-left:20px; overflow:auto; font-size:12px; } #MISS #MISS_ALL .SEL{ background-color:#FF9999; } #MISS #MISS_ALL .MISS_KAN{ height:40px; padding:5px; margin:0px; } #MISS #MISS_ALL .MISS_KAN:hover{ background-color:#FFCCCC; cursor:pointer; } #MISS #MISS_ALL .MISS_KAN img{ width:40px; height:40px; vertical-align:middle; margin-right:15px; } #MISS #MISSHELP{ cursor:pointer; padding:12px; display:none; width:400px; background-color:#FFFFCC; }