/************************************************************** ** Algemeen ***************************************************************/ .pngfix{ behavior: url(/Includes/iepngfix.php);} HTML{ height: 100.01%;} BODY{ height: 100%; text-align: center; background: url(../../Images/body_bg.gif) #FFF repeat-x 0 0;} HTML, BODY{ margin: 0; padding: 0; font-size: 11px; color: #616161; line-height: normal; font-family: Verdana, Arial, Helvetica, sans-serif;} A{ color: #e65044; text-decoration: none;} A:hover{ color: #5a5fb0;} A *{ cursor: pointer;} A:focus, INPUT:focus, IMG:focus{ outline: none;} P{ margin: 0 0 10px 0;} IMG{ border: none;} FORM{ margin: 0;} TABLE{ border-collapse: collapse; margin-bottom: 10px;} TABLE P{ margin: 0 0 5px 0;} UL, OL{ margin: 0 0 10px; padding: 0 0 0 18px;} LI{ padding-bottom: 5px;} LI LI{ padding-bottom: 2px;} H1{ font-size: 40px; line-height: 42px;} H2{ font-size: 34px; line-height: 36px;} H3{ font-size: 26px; line-height: 28px;} H4{ font-size: 18px; line-height: 20px;} H5{ font-size: 14px; line-height: 16px;} H6{ font-size: 12px; line-height: 14px;} H1, H2, H3, H4, H5, H6{ margin: 0 0 5px 0; font-family: Verdana, Arial, Helvetica, sans-serif; color: #616161;} INPUT.form_text{ float: left; padding: 3px 2px 2px; font-size: 11px; font-weight: normal; color: #FFF; background-color: #b33540; border: solid; border-color: #671716 #cd5257 #cd5257 #671716; border-width: 2px 1px 1px 1px; margin: 0; font-family: Verdana, Arial, Helvetica, sans-serif;} INPUT.tagged{ color: #e37c82; font-style: italic; background-color: #9a1e26; border: solid; border-color: #671716 #cd5257 #cd5257 #671716; border-width: 2px 1px 1px 1px;} INPUT.form_btn{ float: left; margin: 0; font-size: 13px; color: #FFF; font-family: Verdana, Arial, Helvetica, sans-serif;} INPUT.form_box{ float: left; width: 13px; height: 13px; margin: 3px 3px 0 0;} SELECT.form_text{ padding: 0; font-size: 12px;} TEXTAREA{ font-family: Arial, Helvetica, sans-serif; font-size: 11px; border: #82A9EC 1px solid;} BR.clearer{ margin: 0; padding: 0; line-height: 0; font-size: 1px; height: 0; clear: both;} .clear-element:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden;} .ie_clearer{ content: "."; display: inline; height: 0; font-size: 1px; clear: both; visibility: hidden;} .spamcontrole { width: 5px; visibility: hidden;} .hidden{ visibility: hidden;} DIV.vastTeken{ position: relative;} DIV.vastTeken LABEL{ float: left; margin-left: 5px; margin-right: -20px; position: relative; color: #000; display: block;} DIV.vastTeken INPUT.form_text{ padding-left: 14px; width: 188px;} BUTTON{ margin: 0px 3px 0 0; padding: 0px; border: none; position: relative; background-color: transparent; cursor: pointer; text-align: center; white-space: normal; float: left; overflow: visible;} *:first-child+html button[type]{ width: 1;} /* IE7 */ BUTTON SPAN{ background: transparent url(../../Images/btn_right.png) no-repeat scroll right top; display: block; position: relative; float: left; height: 21px; line-height: 18px; white-space: nowrap; padding: 0px 5px 0px 0px; margin: 0px; } BUTTON SPAN SPAN{ background: transparent url(../../Images/btn_left.png) no-repeat; color: #FFFFFF; padding: 1px 5px 0px 10px; font-weight: normal; font-size: 10px; line-height: 18px; display: block; white-space: nowrap; text-transform: uppercase; text-decoration: none; } /************************************************************** ** Inhoud v/d ***************************************************************/ .container{ width: 920px; margin: 0 auto; text-align: left;} .row{ width: 100%; float: left; clear: left;} .corner_small{ width: 8px; height: 8px; font-size: 1px; z-index: 999; position: absolute; background: url(../../Images/corners_small.png) no-repeat;} .tl{ top: 0; left: 0; background-position: 0 0;} .tr{ top: 0; right: 0; background-position: 100% 0;} .bl{ bottom: 0; left: 0; background-position: 0 100%;} .br{ bottom: 0; right: 0; background-position: 100% 100%;} /************************************************************** ** Header ***************************************************************/ .header_container{ width: 100%; float: left; clear: left; position: relative; z-index: 10;} .header_foto{ width: 100%; float: left; clear: left; position: relative;} .header_foto IMG{ float: left;} .header{ width: 100%; position: absolute; left: 0; top: 0;} DIV.header_top{ width: 100%; height: 166px; float: left; clear: left; position: relative;} DIV.header_top DIV.logo{ width: 155px; height: 157px; float: left; display: inline; margin: 0 0 0 35px;} DIV.header_top DIV.logo IMG{ float: left;} DIV.header_top DIV.slogan{ position: absolute; bottom: 0px; right: 35px;} DIV.header_bottom{ width: 100%; float: left; clear: left;} DIV.title_bar{ margin: 0 15px; height: 50px; position: relative; background: url(../../Images/header_balk_bg.gif) repeat-x 0 0;} DIV.title_bar DIV.left{ width: 8px; height: 50px; font-size: 1px; position: absolute; left: -5px; top: 0; background: url(../../Images/header_balk_left.png) no-repeat 0 0;} DIV.title_bar DIV.right{ width: 8px; height: 50px; font-size: 1px; position: absolute; right: -5px; top: 0; background: url(../../Images/header_balk_right.png) no-repeat 100% 0;} DIV.title_bar DIV.title_bar_content{ position: relative; overflow: hidden;} DIV.title_bar DIV.title_bar_content DIV.naam_vereniging{ float: left; margin-top: 3px; display: inline; margin-left: 3px;} DIV.title_bar DIV.title_bar_content DIV.naam_vereniging IMG{ float: left;} DIV.title_bar DIV.title_bar_content DIV.welkom{ float: left; padding: 25px 10px 0; display: inline;} DIV.title_bar DIV.title_bar_content DIV.welkom H6{ color: #FFF; font-weight: normal;} DIV.title_bar_content DIV.zoeken{ float: right; width: 215px; margin-top: 15px; position: relative;} DIV.title_bar_content DIV.zoeken INPUT.form_text{ float: left; margin-top: 1px; width: 137px;} DIV.title_bar_content DIV.zoeken BUTTON{ float: right;} /************************************************************** ** Menu ***************************************************************/ .menu{ margin: 0 16px; height: 56px; position: relative; z-index: 20; background: url(../../Images/menu_bg.gif) repeat-x 0 0;} .menu DIV.left{ width: 8px; height: 56px; font-size: 1px; position: absolute; z-index: 100; left: -6px; top: 0; background: url(../../Images/menu_left.png) no-repeat 0 0;} .menu DIV.right{ width: 8px; height: 56px; font-size: 1px; position: absolute; z-index: 100; right: -6px; top: 0; background: url(../../Images/menu_right.png) no-repeat 100% 0;} .menu_content{ background: url(../../Images/menu_border.gif) repeat 0 0;} .menu_content UL{ width: 100%; margin: 0; padding: 0; list-style: none; clear: both;} .menu_content UL LI{ float: left; display: inline; border-left: #c9c9c7 1px solid; padding: 0; margin: 8px 0 5px; position: relative; z-index: 0;} .menu_content UL LI DIV.menuitem_wrapper{ border-left: #e6e6e6 1px solid; padding: 0 5px 0 0; float: left; display: inline; position: relative;} .menu_content UL LI A{ white-space: nowrap; color: #616161; font-size: 13px; display: block; float: left; margin: -3px 0 -2px 0; height: 20px; line-height: 20px; padding: 0 10px 0 13px; position: relative; z-index:} .menu_content UL LI A SPAN.right{ display: block; height: 20px; width: 5px; font-size: 1px; position: absolute; right: -5px; top: 0;} .menu_content UL LI A.over{ background: url(../../Images/menu-item_over_left.png) no-repeat 0 0; color: #FFF; padding: 0 0 0 23px;} .menu_content UL LI A.over SPAN.right{ background: url(../../Images/menu-item_over_right.png) no-repeat 0 0;} .menu_content UL LI A.aan{ background: url(../../Images/menu-item_aan_left.png) no-repeat 0 0; color: #FFF; padding: 0 0 0 23px;} .menu_content UL LI A.aan SPAN.right{ background: url(../../Images/menu-item_aan_right.png) no-repeat 0 0;} .submenu{ width: 215px; position: absolute; left: -999em; top: 17px; z-index: 999; display: inline; border: 0; margin: 0; padding-bottom: 24px; background-color: #F00; background: url(../../Images/submenu_bottom.gif) no-repeat 0 100%;} .submenu DIV.submenu_outer{ float: left; width: 100%; display: inline; position: relative; margin-top: 5px; background: url(../../Images/submenu_bg.gif) repeat-y 0 0;} .submenu DIV.submenu_inner{ float: left; width: 100%; display: inline; margin: -5px 0 -25px; background: url(../../Images/submenu_top.gif) no-repeat 0 0;} .submenu UL{ width: 100%; margin: 0; padding: 0; position: relative;} .submenu UL LI{ width: 190px; display: block; float: left; clear: left; display: inline; border: 0; padding: 0; margin: 0 0 0 25px; color: #616161; position: relative;} .submenu UL LI A{ display: block; width: 150px; font-size: 11px; padding: 4px 25px 4px 5px; margin: 1px 10px 1px 0; height: 20px; line-height: 20px; position: relative; overflow: hidden; color: #616161; text-decoration: none;} .submenu UL LI A:hover{ color: #FFF; background: url(../../Images/submenu_item_over.gif) no-repeat 0 4px;} /************************************************************** ** Content ***************************************************************/ .content_container{ width: 100%; float: left; clear: left; position: relative; z-index: 1;} .content_container DIV.content_col{ width: 700px; float: left; display: inline;} .content_container DIV.right_col{ width: 220px; float: left; display: inline;} .content_col DIV.titel{ background-color: #d55b5f;} .content_col DIV.titel DIV{ height: 100%; background-color: #5e5d9d; margin-right: 8px;} .content_col DIV.titel DIV DIV{ background: url(../../Images/titel_ico.gif) no-repeat #FFF 100% 8px; margin-right: 10px;} .content_col DIV.titel DIV DIV H1{ margin: 0; background: url(../../Images/border.png) no-repeat 50% 100%; font-size: 20px; line-height: 25px; padding: 5px 35px 10px 5px; font-weight: normal;} .content_col DIV.banners TABLE{ width: 680px; margin: 0 10px;} .content_col DIV.banners TABLE TD{ width: 50%; vertical-align: middle;} .content_col DIV.banners TABLE TD IMG{ border: #c9c9c7 1px solid;} .venster{ width: 100%; float: left; padding-bottom: 15px; margin-top: 25px; margin-bottom: 20px; background: url(../../Images/groot_venster_bottom.png) no-repeat 0 100%;} .venster DIV.venster_outer{ float: left; width: 100%; position: relative; background: url(../../Images/groot_venster_shadow.png) repeat-y 0 0;} .venster DIV.venster_inner{ float: left; width: 100%; padding-top: 15px; margin: -15px 0 -1px; background: url(../../Images/groot_venster_top.png) no-repeat 0 0;} .venster DIV.venster_wrapper{ margin: 0 10px; padding: 5px 10px; position: relative; z-index: 2; min-height: 80px; height: auto !important; height: 80px; background: url(../../Images/groot_venster_bg.gif) #FFF repeat-x 0 100%;} DIV.meer_btn{ position: absolute; right: 20px; bottom: -26px; line-height: 18px; z-index: 1; background: url(../../Images/meer_btn_bg.gif) repeat-x 0 0;} DIV.meer_btn DIV.wrapper{ padding: 0 10px; float: left; height: 20px; position: relative;} DIV.meer_btn A{ font-weight: bold; color: #616161; text-transform: uppercase; font-size: 10px;} DIV.meer_btn A:hover{ text-decoration: underline; color: #616161;} .plus-titel DIV.venster_inner{ background: url(../../Images/groot_kleurvenster_top.png) no-repeat 0 0;} .plus-titel DIV.venster_wrapper{ padding: 0;} /************************************************************** ** Breadcrumbs ***************************************************************/ .breadcrumbs{ width: 100%; float: left; clear: left; margin-bottom: -5px;} .breadcrumbs UL{ margin: 10px 15px 0; padding: 0; list-style: none;} .breadcrumbs UL LI{ padding: 0; float: left; display: inline; padding: 0 2px;} .breadcrumbs UL LI A{ color: #616161; text-decoration: underline;} .breadcrumbs UL LI A:hover{ text-decoration: none;} /************************************************************** ** Content Kolom ***************************************************************/ .nieuws DIV.titel H1{ width: 212px;} .nieuws DIV.foto{ width: 400px; height: 300px; overflow: hidden; float: left; display: inline; margin: 0 5px; position: relative;} .nieuws DIV.nieuws_container{ width: 270px; float: left; display: inline;} .nieuws A.nieuwsitem{ width: 100%; float: left; clear: left; display: block; color: #616161; padding-bottom: 3px; background: url(../../Images/border.png) no-repeat 50% 100%;} .nieuws A.nieuwsitem SPAN.datum{ display: block; float: left; width: 40px; margin-right: 5px; text-align: center; font-size: 10px; line-height: 11px; height: 40px; color: #FFF; background: url(../../Images/datum_btn.png) no-repeat 100% 0;} .nieuws A.nieuwsitem SPAN.datum STRONG{ color: #616161; font-size: 13px; padding-top: 5px; line-height: 18px; height: 18px; display: block;} .nieuws A.nieuwsitem SPAN.txt{ display: block; float: left; margin-top: 3px; width: 200px; margin-right: 5px; font-size: 10px; line-height: 11px;} .nieuws A.nieuwsitem SPAN.btn{ display: block; float: left; width: 15px; height: 15px; margin-top: 20px; background: url(../../Images/datum_btn.png) no-repeat 100% 100%;} .nieuws A.nieuwsitem_aan{ color: #5a5fb0;} .nieuws A.nieuwsitem_aan SPAN.datum{ background-position: 0 0;} .nieuws A.nieuwsitem_aan SPAN.txt STRONG{ color: #e65044;} .nieuws A.nieuwsitem_aan SPAN.btn{ background-position: 0 100%;} .nieuws A.nieuwsitem_over{ color: #5a5fb0;} .nieuws A.nieuwsitem_over SPAN.datum{ background-position: 0 0;} .nieuws A.nieuwsitem_over SPAN.txt STRONG{ color: #e65044;} .nieuws A.nieuwsitem_over SPAN.btn{ background: url(../../Images/datum_btn.png) no-repeat 0 100%;} .nieuws .carousel_inhoud{ display: none;} .nieuws #carousel_inhoud_1{ display: block;} .bericht_titel{ width: 360px; cursor: pointer; padding: 10px 20px; background: url(../../Images/nieuwsbericht_titel_bg.png) repeat-y 0 0; position: absolute; left:0; bottom: 0;} .bericht_titel H4{ font-weight: bold; color: #e65044; font-size: 16px; cursor: pointer;} .bericht_titel H6{ font-weight: bold; color: #5a5fb0; font-size: 11px; cursor: pointer;} .content_venster{ padding: 0 !important;} .content_venster DIV.titel{ margin-left: 10px;} .content_venster DIV.titel H1{ background: url(../../Images/big_border.png) no-repeat 50% 100% !important;} .content_venster DIV.venster_content{ padding: 10px 15px;} .foto{ float: left; position: relative;} .foto IMG{ float: left;} .fotoboek_foto{ float:left; width:110px; height:83px; margin:5px 3px 5px 5px; overflow:hidden; vertical-align:top; text-align:center; } .fotoboek_foto IMG{ border:0px; max-width:110px; max-height:83px; } /************************************************************** ** Carousel ***************************************************************/ DIV.sidescroller_container{ width: 620px; float: left; padding: 10px 20px; position: relative;} DIV.sidescroller{ width: 620px; float: left; position: relative; overflow: hidden;} DIV.sidescroller DIV.scroll_area{ position: relative;} DIV.sidescroller DIV.scroll_area UL{ position: relative; margin: 0; padding: 0; list-style: none;} DIV.sidescroller DIV.scroll_area UL LI{ position: relative; float: left; padding: 0; width: 100px; height: 75px; margin-right: 3px;} DIV.sidescroller_container A.prev{ width: 15px; height: 15px; font-size: 1px; position: absolute; left: 0; top: 42px; background: url(../../Images/slider_controls.gif) no-repeat 0 0;} DIV.sidescroller_container A.next{ width: 15px; height: 15px; font-size: 1px; position: absolute; right: 0; top: 42px; background: url(../../Images/slider_controls.gif) no-repeat 100% 0;} /************************************************************** ** Rechter Kolom ***************************************************************/ .right_col DIV.titel{ background-color: #d55b5f; padding: 0; margin: 0;} .right_col DIV.titel DIV{ background-color: #5e5d9d; margin-right: 8px; padding: 0;} .right_col DIV.titel DIV DIV{ background: url(../../Images/titel_ico.gif) no-repeat #FFF 100% 8px; margin-right: 10px;} .right_col DIV.titel DIV DIV H2{ margin: 0; background: url(../../Images/border.png) no-repeat 50% 100%; font-size: 20px; position: relative; line-height: 25px; padding: 5px 35px 10px 10px; font-weight: normal;} .right_col DIV.venster{ width: 100%; float: left; padding-bottom: 15px; margin-top: 25px; margin-bottom: 0; background: url(../../Images/klein_venster_bottom.png) no-repeat 0 100%;} .right_col DIV.venster DIV.venster_outer{ float: left; width: 100%; position: relative; background: url(../../Images/klein_venster_shadow.png) repeat-y 0 0;} .right_col DIV.venster DIV.venster_inner{ float: left; width: 100%; padding-top: 15px; margin: -15px 0 -1px; background: url(../../Images/klein_venster_top.png) no-repeat 0 0;} .right_col DIV.venster DIV.venster_wrapper{ margin: 0 10px; padding: 5px 10px; position: relative; min-height: 80px; height: auto !important; height: 80px; background: url(../../Images/klein_venster_bg.gif) #FFF repeat-x 0 100%;} .right_col DIV.plus-titel DIV.venster_inner{ background: url(../../Images/klein_kleurvenster_top.png) no-repeat 0 0;} .right_col DIV.plus-titel DIV.venster_wrapper{ padding: 0;} .right_col DIV.plus-titel DIV.venster_content{ padding: 5px 10px 0; clear: left;} .right_col DIV.nieuwsbrief{ background: url(../../Images/klein_venster_bottom_rood.png) no-repeat 0 100%;} .right_col DIV.nieuwsbrief_formulier{ width: 180px; padding: 10px 10px 0; height: 74px; overflow: hidden; float: left; clear: left; background: url(../../Images/klein_venster_bg_rood.gif) #b11d27 repeat-x 0 100%;} .right_col DIV.nieuwsbrief_formulier DIV.row{ margin-bottom: 3px;} .right_col DIV.nieuwsbrief_formulier INPUT.form_text{ width: 172px;} .right_col DIV.nieuwsbrief_formulier BUTTON{ float: right; margin-right: 0;} .right_col DIV.banners{ width: 220px;} .right_col DIV.banners UL{ width: 220px; padding: 0; margin: 0; list-style: none;} .right_col DIV.banners UL LI{ width: 220px; float: left; clear: left; text-align: center; padding-bottom: 10px; margin-top: 10px; background: url(../../Images/border.png) no-repeat 50% 100%;} UL.submenu_rechts{ width: 100%; margin: 0; padding: 0; list-style: none;} UL.submenu_rechts LI{ width: 180px; display: block; float: left; clear: left; padding: 0;} UL.submenu_rechts LI A{ width: 150px; display: block; position: relative; padding: 4px 25px 4px 5px; margin: 1px 0; height: 20px; line-height: 20px;} UL.submenu_rechts LI A:hover{ color: #FFF; background: url(../../Images/submenu_item_over.gif) no-repeat 0 4px;} .right_col DIV.nieuwsitem{ padding-bottom: 5px; margin-bottom: 5px; background: url(../../Images/border.png) no-repeat 50% 100%;} .right_col DIV.nieuwsitem SPAN.datum{ font-size: 10px; color: #5A5FB0;} /************************************************************** ** Footer ***************************************************************/ .footer{ width: 100%; float: left; clear: left; padding: 10px 0;} .footer_menu{ margin: 0 15px; height: 56px; position: relative; background: url(../../Images/footer_menu_bg.gif) repeat-x 0 0;} .footer_menu DIV.left{ width: 8px; height: 56px; font-size: 1px; position: absolute; left: -5px; top: 0; background: url(../../Images/footer_menu_left.png) no-repeat 0 0;} .footer_menu DIV.right{ width: 8px; height: 56px; font-size: 1px; position: absolute; right: -5px; top: 0; background: url(../../Images/footer_menu_right.png) no-repeat 100% 0;} .footer_menu DIV.footer_menu_content{ background: url(../../Images/menu_border.gif) repeat 0 0;} .footer_menu DIV.footer_menu_content UL{ width: 100%; margin: 0; padding: 0; list-style: none; clear: both;} .footer_menu DIV.footer_menu_content UL LI{ float: left; display: inline; border-left: #c9c9c7 1px solid; padding: 0; margin: 8px 0 5px;} .footer_menu DIV.footer_menu_content UL LI DIV{ border-left: #e6e6e6 1px solid; padding: 0 5px 0 0; float: left; display: inline;} .footer_menu DIV.footer_menu_content UL LI A{ white-space: nowrap; color: #616161; font-size: 13px; display: block; float: left; margin: -3px 0 -2px 0; height: 20px; line-height: 20px; padding: 0 10px 0 13px; position: relative;} .footer_menu DIV.footer_menu_content UL LI A:hover, .footer_menu DIV.footer_menu_content UL LI A.aan{ text-decoration: underline;} .footer_bottom{ margin: 0 15px; height: 40px; position: relative; background: url(../../Images/footer_bg.gif) repeat-x 0 0;} .footer_bottom DIV.left{ width: 8px; height: 40px; font-size: 1px; position: absolute; left: -5px; top: 0; background: url(../../Images/footer_left.png) no-repeat 0 0;} .footer_bottom DIV.right{ width: 8px; height: 40px; font-size: 1px; position: absolute; right: -5px; top: 0; background: url(../../Images/footer_right.png) no-repeat 100% 0;} .footer_bottom UL{ padding: 15px 0 0 0; margin: 0; list-style: none; text-align: center;} .footer_bottom UL LI{ display: inline; color: #FFF; font-size: 10px;} .footer_bottom UL LI A{ color: #FFF; text-decoration: underline;}