/** * v0.5 * * Table of Contents * ================= * 1. Common Styling * 2. Header Styling * 3. Content/Main Styling * 4. Content/sub-nav Styling * 5. Content/modules Styling * 6. Search box * 7. Forms * 8. Footer Styling * * Colors * ====== * * Fonts * ----- * white : #fff * light-grey (a) : #bbb * grey (main) : #AEAEAE * green : #C6D848 * * Borders * ------- * * light-grey : #606060 * * Tables * ------ * * Backgrounds * ----------- * dark-grey : #313033 * light-grey : #535458 * */ /** * 1. Common Styling * ================= */ body {background:#313033; color: #AEAEAE;font: 0.84em/1.333 arial, sans-serif; margin:0 auto; padding: 0; width:100%; text-align: center} * {font-size: 100%; padding: 0; margin: 0} img{border: none} /* changed by marc on 2007-01-30 */ a{color: #D4D4D4;} a:hover{color: #C6D848;} /* a{color: #bbb;} a:hover{color: #bbb;} */ /* clear stuff */ div, ul, ol, li, table, td, th, tr, p, blockquote{margin: 0; padding: 0; border: none} /* to clear floated elements */ /* from http://www.positioniseverything.net/easyclearing.html */ .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden} .clearfix {display: inline-table;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ /* hide accessibility content from normal users - screenreaders can pick this up nicely */ .smartsurfer{display: block; width: 1px; height: 1px; position: absolute; top: -5000px} /*** main size * * 58em: max width on a 800x600 screen * if this changes, the search box and the crumb trail has to be repositioned */ body {width:71.25em; border-left: 1px solid #606060; border-right: 1px solid #606060; margin: 0 auto; text-align: left;} #container{width:auto; border-left:none; border-right:none; border-bottom: 1px solid #606060; position: relative; overflow: hidden; /* to keep opera and safari in control */} /** * 2. Header Styling * ================= */ #header{height:15.75em; background:#313033; background-image: none !important /* will override a custom provant banner image */; border-bottom:1px solid #606060;} #logo{display: none} #fotologo {position:absolute; background: #313033; top: 0px; left: 0px; } #fotologo a {display:block; text-align:center; width:17.85em; height:15.75em;} #modelogo{display: none;} /* photo banner ............................................................. */ #flashbanner-container{position: absolute; left: 17.85em; height:15.75em !important; } .flashbanner{float:left; display:inline; border:none; width:17.79em; overflow:hidden; height:15.75em !important; text-align:center; background:transparent url("http://www.provant.be/images/border.gif") repeat-y scroll left top;} .flashbanner span.image-block {display : block; overflow : hidden; height:145px; border-bottom : 1px solid #4B4B4B; margin : 0px 0px 0px 1px; background-color : #373639;} .flashbanner span.collection-title{color: #C6D848;} .flashbanner p{text-align: left; width:220px; font-size: 80%; padding: 0; display: block; margin:0.5em 1.2em;} /** 2.1 module navigation */ /**** for positioning see below */ /* changed by marc on 2008-01-30 */ #module-nav-lang{background:none; border-top:none; border-bottom:none;} #module-nav-lang ul {margin-left : 0px;/*4.5em;*/} #module-nav-lang ul li{display: block; float: left; text-align: center; margin: 0.8em 1em 0em 0em;} #module-nav-lang ul li.hide-separator-image{border-right: none;} #module-nav-lang ul li a{display: block; background: #737373; visibility: visible; width : 1.7em; line-height:1.7em; font-weight: 300; color: #161616; text-decoration: none; } #module-nav-lang ul li a abbr {border : none;} #module-nav-lang ul li a:hover{background : #C6D848; color: #000000} #module-nav-lang ul li a.active{color: #C6D848} #module-nav{display: none;} /* #module-nav-lang{background:none; border-top:none; border-bottom:none;} #module-nav-lang ul li{display: block; float: left; width:5em; padding-top: 3px; text-align: center; height:3.05em; line-height:3.05em; } #module-nav-lang ul li.hide-separator-image{border-right: none;} #module-nav-lang ul li span.language{visibility: hidden;} #module-nav-lang ul li span.language a{display: block; visibility: visible; width: 50px; font-weight: bold; color: black; text-decoration: none; } #module-nav-lang ul li span.language a.active{color: #C6D848} #module-nav{display: none;} */ /** 2.2 doormat & main navbar */ /*** general */ #nav{display:none;} /** 2.3 crumb trail */ #crumb-trail-container{overflow:hidden; background:#444447 url("http://www.provant.be/images/css_fomu_2column_bg.gif") 17.85em 0 repeat-y; height:auto; width:auto; border-bottom: 1px solid #606060; border-top:none; padding-top:0;} #crumb-trail-container ul {margin-left:17.85em; overflow:hidden; background:#535458 url("http://www.provant.be/images/border.gif") repeat-y scroll } #crumb-trail-container li {list-style:none; float:left; padding:1em 0.5em; padding-left:0; zoom:1;} #crumb-trail-container li.first {padding-left:1em;} #crumb-trail-container a{background:url("http://www.provant.be/images/css_fomu_subnav-bulletalt.gif") no-repeat scroll 100% 5px; padding-right: 10px; color: #C6D848; } /* changed by marc on 2007-01-30 */ #crumb-trail-container span{font-weight: 300;} /** 2.4 skip links */ .skiplist {margin: 0; padding: 0; list-style: none; } .skip {margin: 0; padding: 0; position: absolute; left: 2em; top: 0.3em; z-index: 1; width: 25em } .skip a {display: block; text-decoration:none; top: -700em; overflow: hidden; position: absolute;} .skip a:focus, .skip a:active {height: auto; width: auto; top: 0em; overflow: visible; color: #C7160E; background: #fff; border: 3px solid #C7160E; position: absolute;} .skip a:hover {cursor: default;} /** * 3. Content/Main Styling * =================== === */ /* grid two left ------------------------------------------------------------ */ .gridTwoLeft {padding-left:17.85em;} .gridTwoLeft .wrapper {} .gridTwoLeft .col-1 {float:left; width:17.85em; margin-left:-17.85em;} .gridTwoLeft .col-2 {float:right; width:100%;} /* grid two right ------------------------------------------------------------ */ .gridTwoRight .wrapper {margin-right:17.85em;} .gridTwoRight .col-1 {float:left; width:100%;} .gridTwoRight .col-2 {float:right; width:17.85em; margin-right:-17.85em;} #two-col-modules .gridTwoRight .col-2 #modules {margin-left:1em; width:auto;} * html .gridTwoRight .col-2 {position:relative; zoom:1;} /* three col ---------------------------------------------------------------- */ .gridThree {padding-left:17.85em; background:#313033;} .gridThree .wrapper2 {padding-right:17.75em; background:#535458 url("http://www.provant.be/images/border.gif") repeat-y scroll left top;} .gridThree .wrapper2 .wrapperIn {float:right; background:url("http://www.provant.be/images/border.gif") repeat-y scroll right top;} .gridThree .col-2 {float:left;} .gridThree .col-3 {float:right; width:17.75em; margin-right:-17.75em;} .gridThree .col-3 .gridOne {margin-top:0.5em;} .gridThree .col-1 {float:left; width:17.85em; margin-left:-17.85em;} #content{background-color: #535458; margin-top:0px; border-top:606060;}/* negative margin is needed for FF */ /*** minimum height on the #content div */ /* for understanding browsers */ #content {position:relative;} #content, #content-container {min-height:50em; height:auto;} /* for Internet Explorer */ /*\*/ * html #content, * html #content-container {height: 50em;} /**/ /* normal sidebar */ /*** valid for all body id types */ #three-col #content, #two-col-subnav #content, #two-col-modules #content, #two-col-leafnode #content, #two-col-facet #content, #two-col-facet-leafnode #content, #one-col #content{background:#313033 url("http://www.provant.be/images/css_fomu_2column_bg.gif") repeat-y scroll 17.85em 0;} /*** also include this for three col */ #two-col-modules #content-container{background:transparent url("http://www.provant.be/images/css_fomu_2column_bg.gif") repeat-y 35.49em 0em;} * html #three-col #content-container, * html #two-col-modules #content-container{background-position:35.5em 0em;} #two-col-leafnode #content-container {margin-left:18em;} #two-col-modules #content-container {margin-left:18em;} /** 3.1 Positioning of the columns * DO NOT TOUCH IF NOT NECESSARY OR THINGS *WILL* GET VERY VERY UGLY * * A few pointers: * * * If the width of the content-container changes: adapt the width that the crumb-trail has * */ /*** general */ #two-col-modules #content-container, #two-col-subnav #content-container, #two-col-leafnode #content-container, #two-col-facet #content-container, #two-col-facet-leafnode #content-container, #one-col #content-container{xmargin-left:17.85em;}/* contains #main, #modules*/ /*** three cols: three-col and two-col-modules */ #three-col #main, #two-col-modules #main{width:33.5em; padding: 0em 1em 2em 1em; float: left; display:inline;} #two-col-modules #modules{width:17.8em; float: right; padding:0; display:inline;} /*** two cols: two-cols-subnav, two-col-facet, two-col-leafnode, two-col-facet-leafnode, one-col */ #two-col-subnav #main, #two-col-leafnode #main, #two-col-facet #main, #two-col-facet-leafnode #main, #one-col #main{width:51.60em; padding: 0 1em; float: left; display:inline;} #two-col-subnav #sub-nav, #two-col-leafnode #sub-nav, #two-col-facet #sub-nav, #two-col-facet-leafnode #sub-nav{width:17.85em; float: left; display:inline;} /*** static components: lang-bar and searchbox */ #module-nav-lang {top:15.85em; left:0px; width:15.85em; padding:0em 1em; position:absolute; z-index:100;} #search-box{position: absolute; top:0em; right:0em; width:15.8em; padding:0.75em 1em; height:1.85em; z-index:10; background:url("http://www.provant.be/images/border.gif") left top repeat-y;} * html #search-box {top:0em;} /*** exceptions */ /** 3.2 Main styling */ /*** defaults */ /*** styling */ /**** padding/margin */ /**** text */ #main{overflow: hidden} #main h1{font-family: Arial, Helvetica, sans-serif;} #main h1{font-size : 150%; font-weight: normal; padding: 0.5em 0em; color: white;} #main h2{clear: both; font-weight: normal; font-size: 120%; width: auto; color: white; padding: 0.5em 0 0 0; margin-bottom: 5px} #main h3{clear: both; font-weight: bold; font-size: 100%; color: white; padding: 0.5em 0; margin-bottom: 3px;} #main ul, #main ol{margin: 1em 2em 1em 3em; clear: left} #main ul li{list-style: disc outside; color: #AEAEAE} #main ul.no_list_style{list-style: none; margin: 1em 2em 1em 10px;} #main ul.no_list_style li{list-style-image: none;} #main p{color: #AEAEAE; margin-bottom : 1em;} /* changed by marc on 2007-01-30 */ #main a{color: #D4D4D4;} #main a:hover{color: #C6D848;} /* #main a{color: #bbb;} #main a:hover{color: #bbb; text-decoration: none} */ /*#main .tekstsectie h2, #main .vergunning h2, #main .subsidie h2, #main .attest h2{clear: both;} #main .tekstsectie h3, #main .vergunning h3, #main .subsidie h3, #main .attest h3{clear: left;}*/ /* added by marc on 2008-01-30 */ /**** images */ /* caption: every image is contained within a span "image-block" * if there should be a caption, an inline style has to be placed on the caption span stating the width of the image minus 10px */ #main span.image-block span.caption{font-size: 80%; display: block; margin:0; padding: 0; text-align: left; } #main .indekijker span.fixedimage, #main .publicatie span.fixedimage, #main .tekstsectie span.fixedimage, #main .tekstblok span.fixedimage,#main .vergunning span.fixedimage, #main .subsidie span.fixedimage, #main .attest span.fixedimage, #main .calendar span.fixedimage, #main .news span.fixedimage{float: left; margin: 0em 0.8em 0.8em 0em;} #main span.image-block.emphasize img{border: 1px solid #9AB6CB;} #main div.tekstblok{clear:left}/* ensures that a 'tekstblok' stays a seperate entity */ /* ensures that divs will be layed out vertically */ #main div{width: 100%; } /* pager .................................................................... */ #main .paging {width:auto; padding-top:0.25em;} #main .paging .result {float:left; width:auto;} #main .paging .pager {float:right; width:auto;} #main .paging .pager ul, #main .paging .pager ul li {float:left; list-style:none; margin:0; margin-right:0.5em; } /* keywords */ #main span.keyword{border-bottom: 1px dotted black; cursor: help;} /*** tables */ #main table{background: #535458; border: 2px solid #666; margin: 10px 0; border-collapse: collapse; text-align: left;} * html #main table{border: 1px solid #666;} #main table th{background: #313033; font-weight: bold; border: 1px solid #606060; color: white;} #main table td{border: 1px solid #606060; vertical-align: top} #main table th, #main table td{padding: 0.3em; } #main table tr.alternate td{background: #606060} #main table.alignleft{text-align: left} #main table.aligncenter{text-align: center} #main table.alignright{text-align: right} #main table.valignmiddle td{vertical-align: middle} /**** custom: news page ****/ #main p.date{color: #619E1C; font-size: 105%} /**** custom: overview pages */ #two-col-facet #main div.searchsummary-container, #two-col-facet-leafnode #main div.searchsummary-container{width: 560px;} #three-col #main div.paging, #three-col #main div.paging table, #two-col-modules #main div.paging, #two-col-modules #main div.paging table{width: 380px;} #two-col-subnav #main div.paging, #two-col-subnav #main div.paging table, #two-col-leafnode #main div.paging, #two-col-leafnode #main div.paging table, #two-col-facet #main div.paging, #two-col-facet #main div.paging table, #two-col-facet-leafnode #main div.paging, #two-col-facet-leafnode #main div.paging table, #one-col #main div.paging, #one-col #main div.paging table{width: 560px;} #main div.summary span.result-count, #main div.summary span.rss{padding: 0.2em 0 0 0; margin: 0; color: #5B788E; font-weight: bold; } #main div.searchsummary-container{padding: 0px; border-bottom: 1px solid white; background: #606060;} #main div.summary{background: #535458;} #main div.summary p{display: block; margin: 0; padding: 0.2em;} #main div.summary span.result-count{float: left; color: #C6D848} #main div.summary span.rss{float: right;} #main div.facet-filter{border-top: 1px solid white; border-left: 1px solid white; border-right: 1px solid white; } #main div.facet-filter table{margin: 5px; border-collapse: collapse; table-layout: fixed; border: none; background: transparent; } #main div.facet-filter table col.column1{width: 150px;} #main div.facet-filter table col.column2{width: 200px;} #main div.facet-filter table col.column3{width: 200px;} #main div.facet-filter table th, #main div.facet-filter table td{border: none; border-bottom: 1px solid #777; background: transparent; vertical-align: top} #main div.facet-filter table tr.last th, #main div.facet-filter table tr.last td{border-bottom: none;} #main div.facet-filter ul.alphabet{position : relative; margin : 0.5em 0; padding : 0em; font-size: 85%; width : 100%; display: inline;} #main div.facet-filter ul.alphabet li{display: block; float: left; border-right: 1px solid white; color: #bbb; text-align: center; vertical-align: middle; width: 1.5em; margin: 0; font-weight: bold;} #main div.facet-filter ul.alphabet li.active{color: white; border: 1px solid #C6D848; margin-left: -1px; background: #606060} #main div.facet-filter ul.alphabet li.hide-separator-image{border-left: none} #main div.facet-filter ul.alphabet li.hide-separator-image.active{border-left: 1px solid #C6D848;} #main div.facet-filter ul.alphabet li.delete-item{width : 4em;} #main div.facet-filter ul.alphabet li.last{border-right: 2px solid black; padding-right: 2px;} #main div.facet-filter ul.alphabet li.last.active{padding-right: 0;} #main div.facet-filter ul.alphabet li a{text-decoration: none; font-weight: bold; color: #C6D848;} #main div.facet-filter ul.alphabet li a:hover{text-decoration: none; color: white} #main div.paging table{border: none; margin: 0; background: transparent} #main div.paging table td{border: none; margin: 0; padding: 0.2em 0em} #main div.paging table td.previous{text-align: left;} #main div.paging table td.results{text-align: center;} #main div.paging table td.next{text-align: right;} #main div.paging table col.column1{width: 35%} #main div.paging table col.column2{width: auto} #main div.paging table col.column3{width: 35%} #main div.paging.top {border-bottom: 1px solid white} #main div.paging.bottom {border-top: 1px solid white} #main div.paging a, #main div.paging a:hover{text-decoration: none; color: #C6D848; font-weight: bold; } #main table.search_results {width: 100%; border-collapse: collapse; table-layout: fixed;} #main table.search_results col.column1{width: 100%;} #main table.search_results.calendar col.column1{width: 58%;} #main table.search_results.newsletter col.column1{width: 78%;} #main table.search_results.calendar col.column2, #main table.search_results.news col.column2, #main table.search_results.newsletter col.column2{width: 21%;} #main table.search_results.calendar col.column3{width: 21%;} #main table.search_results, #main table.search_results tr th, #main table.search_results tr td {border: none; background: none;} #main table.search_results.calendar tr th, #main table.search_results.newsletter tr th {border-bottom: 1px solid white; color: #C6D848;} #main table.search_results.calendar tr td, #main table.search_results.newsletter tr td {border-bottom: 1px solid #777;} #main table.search_results.calendar tr.last th, #main table.search_results.calendar tr.last td, #main table.search_results.newsletter tr.last th, #main table.search_results.newsletter tr.last td{border-bottom: none; } #main table.search_results.address{margin: 0 0.5em} #main table.search_results.address tr td {border-bottom: 1px solid white; padding: 0.5em 0;} #main table.search_results.address tr.address-detail th, #main table.search_results.address tr.address-detail td{border-bottom: none;} #main table.search_results.address .address-detail-1{float: left; width: 49%} #main table.search_results.address .address-detail-2{float: right; width: 49%} #main table.search_results.address .address-detail-3{clear: both; display:block; padding-bottom: 1em;} #main table .date{color: #999; font-style: italic;} #main table.search_results span.title{color: white; font-weight: bold;} #modules div div {padding:0; border:none;} /**** custom: photo gallery */ #three-col #main div.photogallery table.photo-overview, #two-col-modules #main div.photogallery table.photo-overview{width: 380px;} #two-col-subnav #main div.photogallery table.photo-overview, #two-col-leafnode #main div.photogallery table.photo-overview, #two-col-facet #main div.photogallery table.photo-overview, #two-col-facet-leafnode #main div.photogallery table.photo-overview, #one-col #main div.photogallery table.photo-overview{width: 560px;} #main div.photogallery table.photo-overview, #main .photogallery table.photo-overview th, #main .photogallery table.photo-overview td{border: none; background: transparent; text-align: left;} #main div.photogallery table.photo-overview td a {border: none; display: block; margin: 0; padding: 0; text-align: left;} #three-col #main div.photogallery table.photo-overview a, #two-col-modules #main div.photogallery table.photo-overview a{width: 85px;} #two-col-subnav #main div.photogallery table.photo-overview a, #two-col-leafnode #main div.photogallery table.photo-overview a, #two-col-facet #main div.photogallery table.photo-overview a, #two-col-facet-leafnode #main div.photogallery table.photo-overview a, #one-col #main div.photogallery table.photo-overview a{width: 130px;} #three-col #main div.photogallery table.photo-overview span.caption, #two-col-modules #main div.photogallery table.photo-overview span.caption{width: 85px;} #two-col-subnav #main div.photogallery table.photo-overview span.caption, #two-col-leafnode #main div.photogallery table.photo-overview span.caption, #two-col-facet #main div.photogallery table.photo-overview span.caption, #two-col-facet-leafnode #main div.photogallery table.photo-overview span.caption, #one-col #main div.photogallery table.photo-overview span.caption{width: 130px} #main div.photogallery-detail p.image-detail, #main div.photogallery-detail p.image-description{text-align: center} #main div.photogallery-detail p.image-detail{margin-top: 1em;} #main div.photogallery-detail p.image-detail span.caption{text-align: center; margin: 0 5em;} #main div.photogallery-detail p.back a.less-link{margin-top: 1em; margin-bottom: 1em} /**** custom: related info */ #main div.inlinemodule {width : 100%; margin: 20px 0 0 0; padding: 0 0; background: #606060;} #main div.inlinemodule h2, #main div.inlinemodule h3, #main div.inlinemodule p, #main div.inlinemodule ul, #main div.inlinemodule table, #main div.inlinemodule ol, #main div.inlinemodule dl, #main div.inlinemodule blockquote {line-height : 1.2em;} #main div.inlinemodule h2 {font-size: 110%; line-height: 1.2em; padding: 5px 0; color: #C6D848; width: 100%; } #main div.inlinemodule h3 a{color: white; border-bottom: 1px dotted #C6D848; text-decoration: none;} #main div.inlinemodule h3 a:hover{color: #C6D848} #main div.inlinemodule h3{font-size: 100%; margin: 0em 0em 0.2em 0em; padding : 0 0 0 0; color: white;} #main div.inlinemodule p{margin: 0; padding-bottom : 0;} #main div.inlinemodule.multiple{margin-top: 0; padding-top: 5px; padding-bottom: 5px} #main div.inlinemodule span.tel, #main div.inlinemodule span.fax, #main div.inlinemodule span.prefix{float: left} #main div.inlinemodule span.more-link{background-position: 2px 5px; margin-top: 0.5em} #main div.inlinemodule span.prefix{width: 1.7em;} #main div.inlinemodule br{clear: both} /**** custom: banner */ #main div.banner{margin-left: -10px; margin-right: -10px; /* compensate for the padding on #main */} /**** misc ****/ /*** icons ***/ /** * 4. Content/Sub-nav Styling * ========================== * dark-grey : #313033 * light-grey : #535458 * green : #C6D848 */ #sub-nav {padding: 0; margin: 0; } /*#sub-nav h2, #sub-nav ul {display: none} */ #sub-nav ul.show-arrows-in-list, #sub-nav ul.show-arrows-in-list ul{display: block;}/* only show left navigation */ #sub-nav div.leftnav{overflow: hidden; } #sub-nav h2, #sub-nav h3{padding: 0.5em 1em; color: #C6D848; width:auto;} #sub-nav h2{margin-bottom: 0.5em; margin-top: 2em; border-top: 1px solid #606060; border-bottom: 1px solid #606060; background: #444447} #sub-nav p{margin: 1em;} #sub-nav a{color: #bbb; text-decoration: none; xwidth: 100%; } /* added by maxit on 2007-01-30 */ #sub-nav a:hover{color: #C6D848;} /* changed by marc on 2008-01-30 */ #sub-nav ul{list-style: none;} * html #sub-nav ul{list-style: none; width: 17em;} /* IE6 hack */ /*#sub-nav ul{list-style: none; width: 17em;}*/ #sub-nav ul.show-arrows-in-list li a{background: url("http://www.provant.be/images/css_fomu_subnav-bulletalt.gif") no-repeat 0px 7px; padding: 2px 0 2px 10px; display:block; } /* added by marc on 2007-01-30 */ #sub-nav ul.show-arrows-in-list li a.active{background: url("http://www.provant.be/images/css_fomu_subnav-bulletalt_active.gif") no-repeat 0px 7px; color : #D2DB5A;} #sub-nav li{width: auto; padding:0; padding-left:1em;} /* changed by marc on 2008-01-30 */ #sub-nav li.alternate{background: #373639;} #sub-nav ul li ul{list-style: none; background: #313033; width:auto; padding: 0 10px 0 20px; margin: 0.1em 0em 0.1em -1em;} #sub-nav ul li.alternate ul{background: #313033;} #sub-nav ul li ul li{border-left: 1px solid #C6D848; } #sub-nav ul li ul li.alternate{background: none; } #sub-nav ul li ul li ul{list-style: none; width: 157px; /*background: lime !important; */ padding: 0 10px; margin: 0 -10px;} #sub-nav ul li ul li ul li{border-left: none; list-style-type: disc} #sub-nav div.sticktotop h2{margin-top: 0em; border-top: none; } /**** custom: calendar widget */ #two-col-facet #sub-nav #calendar form#selectDate select{width: 165px; margin-left: 10px;} /***** sizing, margin, padding */ #sub-nav .calendarWidget{width: 219px; } #sub-nav .calbordered{margin-top: 1em;} #sub-nav .calheader{width:100%; margin-top: 1em; padding-bottom: 0.2em;} #sub-nav .calweekdaycell, #sub-nav td.calcell{height:1.5em; padding: 1px;} #sub-nav td.calcell a{display: block; width: 100%; padding: 0 !important; } #sub-nav div#dayCalendarContainer{margin:0; padding: 0; width: 14em;} /***** styling: borders */ #sub-nav .calendarWidget{text-align:center; border-spacing:0; table-layout:fixed; border-collapse: separate;} #sub-nav td.calcell, #sub-nav .calweekdaycell{border-left: 1px solid #606060; border-bottom: 1px solid #606060;} #sub-nav td.calcellleft{border-left: none; } #sub-nav td.calcell.selected { border: 1px solid #E06B5C; padding: 1px 0 0 1px; } #sub-nav td.calcell.today {border: 1px solid #C6D848; padding: 1px 0 0 1px; } /***** styling: colors */ #sub-nav .calbordered .title {color:#000; font-weight:bold; } #sub-nav .calhead {vertical-align:middle;} #sub-nav .calheader {background: transparent; color: white; } #sub-nav .calweekdaycell {color: white; font-weight:normal; background: #606060; } #sub-nav .calheader a {display:none}/* disable nav buttons */ #sub-nav .calfoot {background-color: #EEE;} #sub-nav td.calcell {background-color: transparent; color: #CCC} /* days without a link */ #sub-nav td.calcell a {color: #819198; text-decoration:none;} /* days with a link */ #sub-nav td.calcell.specialDate a{color: white} /* days with an event */ #sub-nav td.calcell.oom {cursor:default; color:#999; background-color: #444447; } /* days out of month scope */ #sub-nav td.calcell.selected {color: #003DB8; font-weight: bold; background: transparent; }/* selected days */ #sub-nav td.calcell.today, #sub-nav td.calcell.today a{background: transparent; color: #C6D848; font-weight: bold;}/* today */ /*#sub-nav td.calcell.today.selected{background: #fff; color: #313033}*/ #sub-nav td.calcell.calcellhover {cursor:pointer; background-color: #606060; } /* when hovering over a cell */ #sub-nav td.calcell.calcellhover a {color: #C6D848; } /* when hovering over a cell with a link*/ #sub-nav td.calcell.restricted {text-decoration:line-through;}/* inaccessible */ #sub-nav td.calcell.previous {color: #CCC;} /* days that have passed */ /** * 5. Content/Modules Styling * ========================== */ #modules{font-family: Arial, Helvetica, sans-serif;} #modules{padding: 0; margin:0.5em 0em; margin-top: 0;} #modules div div {padding:0.5em 1em; border-bottom: 1px solid #606060; width:auto; } #modules div div div {padding:0; border:none;} #modules div.noindex{border: none; margin: 0; padding: 0;} #modules div ul{margin:0.5em 0em; list-style-type: none} #modules div h2{padding: 0.25em 0em; font-size: 120%; border:none; color: #C6D848; } #modules div h3{margin:0; color: #C6D848} #modules div h3 a {color: #C6D848; text-decoration:none;} #modules div h3 a:hover {text-decoration:underline;} #modules div p, #modules div span.date{margin: 0em;} #modules a.more-link{margin-top: 0.8em; margin-bottom: 0.3em;} #modules div.indekijker{position: relative;} #modules div.indekijker span.image-block{position: absolute; width: 40px; bottom: 10px; right: 5px; text-align: center;} #modules div.indekijker div.content{width: 130px; border-bottom: none;} #modules div.nieuwsbrief{margin-left: 2px; margin-right: -2px; background: #313033;} #modules .vcard {margin:0.5em 0em;} #modules .vcard h3 {margin-bottom:0.5em;} /* nieuwsbrief */ #modules .nieuwsbriefModule form {margin:0.5em 0em;} #modules .nieuwsbriefModule h3 {margin-top:0.5em;} /** * 6. Search box * ============= */ #search-box input.search-textfield{width: 65%; } #search-box input.search-button{background:#313033; color:#BBBBBB; border:1px solid #606060; padding:0.15em; 0.25em;} #search-box p{display: none;} #search-box p.height-same-as-nav{display: block; padding: 5px 0 0 0;} /** * 7. Forms Styling * ================ */ /* sizing */ #two-col-subnav #main form.formStandard, #two-col-leafnode #main form.formStandard, #two-col-facet #main form.formStandard, #two-col-facet-leafnode #main form.formStandard, #one-col #main form.formStandard, #three-col #main form.formStandard, #two-col-modules #main form.formStandard{width: 560px; margin:0; padding: 0;} #two-col-subnav #main div.formButtons, #two-col-leafnode #main div.formButtons, #two-col-facet #main div.formButtons, #two-col-facet-leafnode #main div.formButtons, #one-col #main div.formButtons, #three-col #main div.formButtons, #two-col-modules #main div.formButtons{width: 560px; padding: 10px 0;} #main div.formButtonLeft{float: left; width: 360px;} #main div.formButtonRight{float: right; width: 200px;} #main form.formStandard{position: relative;} /* used for mandatory message */ /* form main styling */ #main form.formStandard{line-height : 1.3em; border: none; background: transparent; margin-top: -10px} /* form title & mandatory message */ #main form.formStandard h2{border: none; background: none; margin: 0 0 1em 0; color: white; width: 80%} #main form.formStandard span.MandatoryMessage{position: absolute; right: 2px; top: 2px; } #main form.formStandard span.MandatoryMessage span.mandatory{color: red;} #main form.formStandard table td span.mandatory{color: red; font-weight: bold; padding-left: 0.2em;} /* form tables*/ /** form tables column width */ #two-col-subnav #main form.formStandard table.formtable col.column1, #two-col-leafnode #main form.formStandard table.formtable col.column1, #two-col-facet #main form.formStandard table.formtable col.column1, #two-col-facet-leafnode #main form.formStandard table.formtable col.column1, #one-col #main form.formStandard table.formtable col.column1, #three-col #main form.formStandard table.formtable col.column1, #two-col-modules #main form.formStandard table.formtable col.column1{width: 150px} #two-col-subnav #main form.formStandard table.formtable col.column2, #two-col-leafnode #main form.formStandard table.formtable col.column2, #two-col-facet #main form.formStandard table.formtable col.column2, #two-col-facet-leafnode #main form.formStandard table.formtable col.column2, #one-col #main form.formStandard table.formtable col.column2, #three-col #main form.formStandard table.formtable col.column2, #two-col-modules #main form.formStandard table.formtable col.column2{width: 410px} /** form tables margin/padding */ #main form.formStandard table.formtable, #main form.formStandard table.formtable td, #main form.formStandard table.formtable td table.Form_embedded_basic, #main form.formStandard table.formtable td table.Form_embedded_basic td{margin: 0; padding: 0;}/*allow nested tables*/ #main form.formStandard table.formtable th, #main form.formStandard table.formtable tr.Field_Separator td{padding: 3px 0;} #main form.formStandard table.formtable tr.Field_standard td.WebFormData, #main form.formStandard table.formtable tr.Field_standard td.Label_standard{padding: 3px 0;} #main form.formStandard table.formtable tr.Field_standard td.Label_standard{padding-left: 0;} #main form.formStandard table.formtable img, #main form.formStandard table.formtable td span.form-readonly{padding: 3px 0; padding-left: 0; display: block;} #main form.formStandard table.formtable td table.Form_embedded_basic {padding: 0; border: none;} #main form.formStandard table.formtable td.WebFormData table.Form_embedded_basic {padding: 0;} #main form.formStandard table.formtable tr.Error_standard td{padding: 3px 0; padding-left: 0em;} /** form tables styling */ #main form.formStandard table.formtable{border-collapse: collapse; table-layout: fixed; width: 100%; border: none; background: transparent; vertical-align: top;} #main form.formStandard table.formtable td, #main form.formStandard table.formtable th{border: none; vertical-align:top; } #main form.formStandard table.formtable th, #main form.formStandard table.formtable tr.Field_Separator td{color: #C6D848; font-weight: bold; border-bottom: 1px solid #606060} #main form.formStandard table.formtable tr.Field_standard td.Label_standard {font-weight: normal; } #main form.formStandard table.formtable tr.Error_standard td{font-weight: bold; color: red;} #main form.formStandard table.Form_embedded_basic{border: none; background: transparent; } /* form tooltips */ #main form.formStandard table.formtable tr td.WebFormData input, #main form.formStandard table.formtable td.WebFormData select, #main form.formStandard table.formtable td.WebFormData textarea, #main form.formStandard table.formtable td table.Form_embedded_basic, #main form.formStandard table.Table_field_basic{float: left;} #main form.formStandard table.formtable td span.tooltip{float: right; margin-right: 0em; margin-top: 3px; cursor: help; } #main form.formStandard table.formtable td.WebFormData span.tooltip{margin-right: 0em; margin-top: 0em;}/* webforms 1.1 bugfix */ /* form buttons */ #main form.formStandard div.formButtons{border-top: 1px solid white} #main form.formStandard div.formButtonLeft input{width: 8em; margin-right: 0.5em;} #main form.formStandard div.formButtonRight{text-align: right} /** custom: table_field */ #main form.formStandard table.Table_field_basic{width: auto;} #main form.formStandard table.Table_field_basic{border: none; background: transparent; margin: 0; padding: 0} * html #main form.formStandard table.Table_field_basic{margin-left: 0em;} #main form.formStandard table.Table_field_basic th{border: none; background: transparent; padding: 0;} #main form.formStandard table.Table_field_basic th, #main form.formStandard table.Table_field_basic td{padding: 0.2em 0.5em 0.2em 0.1em;} /* overview page*/ /** tables column width */ #two-col-subnav #main form.formOverview table.formtable col.column1, #two-col-leafnode #main form.formOverview table.formtable col.column1, #two-col-facet #main form.formOverview table.formtable col.column1, #two-col-facet-leafnode #main form.formOverview table.formtable col.column1, #one-col #main form.formOverview table.formtable col.column1, #three-col #main form.formOverview table.formtable col.column1, #two-col-modules #main form.formOverview table.formtable col.column1{width: 150px;} #two-col-subnav #main form.formOverview table.formtable col.column2, #two-col-leafnode #main form.formOverview table.formtable col.column2, #two-col-facet #main form.formOverview table.formtable col.column2, #two-col-facet-leafnode #main form.formOverview table.formtable col.column2, #one-col #main form.formOverview table.formtable col.column2, #three-col #main form.formOverview table.formtable col.column2, #two-col-modules #main form.formOverview table.formtable col.column2{width: 410px;} /** margin & padding */ #main form.formOverview{margin: 0;} #main form.formOverview table.formtable{width: 100%} #main form.formOverview table.formtable, #main form.formOverview table.formtable td, #main form.formOverview table.formtable td table.Form_embedded_basic, #main form.formOverview table.formtable td table.Form_embedded_basic td{margin: 0; padding: 0;}/*allow nested tables*/ #main form.formOverview table.formtable tr.Field_standard td.WebFormData, #main form.formOverview table.formtable tr.Field_standard td.Label_standard{padding: 0.3em 0;} #main form.formOverview table.formtable th, #main form.formOverview table.formtable tr.Field_standard td.Label_standard, #main form.formOverview table.formtable td span.form-readonly{padding-left: 0;} #main form.formOverview table.formtable th{padding: 0.5em 0} #main form.formOverview table.formtable a.change, #main form.formOverview table.formtable img{margin-left: 0; display: block; padding-bottom: 1em; } /** styling */ #main form.formOverview table.formtable{border: none; background: transparent; border-collapse: collapse;} #main form.formOverview table.formtable th, #main form.formOverview table.formtable td{border: none; background: transparent;} #main form.formOverview table.formtable th{font-size: 100%; font-weight: bold; color: #C6D848;} #main form.formOverview table.formtable span.tooltip{display: none} #main form.formOverview table.formtable a.change{color: #C6D848} #main form.formOverview table.formtable a.change:hover{color: white} #main form.formOverview div.formButtonRight{text-align: right} #main form.formOverview table.formtable td table.Form_embedded_basic, #main form.formOverview table.formtable td table.Form_embedded_basic td{border: none;} #main form.formOverview table.formtable td span.form-readonly{display: block; padding-top: 0.3em; padding-bottom: 0.3em;} /** custom: table_field */ #main form.formOverview table.Table_field_basic{width: auto;} #main form.formOverview table.Table_field_basic{border: none; background: transparent; margin: 0; padding: 0} #main form.formOverview table.Table_field_basic th{border: none; padding: 0; font-size: 100%} #main form.formOverview table.Table_field_basic th, #main form.formOverview table.Table_field_basic td{padding: 0.2em 0.5em 0.2em 0.1em;} /* thank you page*/ #main div#ThankYouPage table.formtable, #main div#ThankYouPage table.formtable td{margin: 0; padding: 0;}/*allow nested tables*/ #main div#ThankYouPage table.formtable td{padding: 1em 0;} #main div#ThankYouPage table.formtable, #main div#ThankYouPage table.formtable td{border: none;} /* form help styling */ #two-col-subnav #main div#formHelpItem, #two-col-leafnode #main div#formHelpItem, #two-col-facet #main div#formHelpItem, #two-col-facet-leafnode #main div#formHelpItem, #one-col #main div#formHelpItem, #three-col #main div#formHelpItem, #two-col-modules #main div#formHelpItem{width: 560px;} #two-col-subnav #main div#formHelpItem div#formHelpContainer, #two-col-leafnode #main div#formHelpItem div#formHelpContainer, #two-col-facet #main div#formHelpItem div#formHelpContainer, #two-col-facet-leafnode #main div#formHelpItem div#formHelpContainer, #one-col #main div#formHelpItem div#formHelpContainer, #three-col #main div#formHelpItem div#formHelpContainer, #two-col-modules #main div#formHelpItem div#formHelpContainer{width: 540px; padding: 10px;} #main div#formHelpItem{text-align: right; border-bottom: 1px solid white; } #main div#formHelpItem ul, #main div#formHelpItem p{margin-bottom: 0; margin-top: 0; padding-top: 0.5em; padding-bottom: 0.5em;} #main div#formHelpItem span#formHelpLabel{color: #C6D848; text-decoration : none; cursor: pointer; font-weight : bold; background: url("http://www.provant.be/images/css_arrow_helpcontainer.gif") no-repeat 0em 0.3em; padding-left: 1em;} #main div#formHelpItem div#formHelpContainer{text-align: left; background: #606060; border-top: 1px solid white; border-bottom: 1px solid white; display: none;} #main div#formHelpItem.open span#formHelpLabel{background: url("http://www.provant.be/images/css_arrow_helpcontainer_act.gif") no-repeat 0em 0.3em; } #main div#formHelpItem.open{border-bottom: none;} #main div#formHelpItem.open div#formHelpContainer{display: block;} #two-col-facet #main div#formHelpItem.open{border-bottom: 1px solid #D3E0EA;} /* form-progress - fake module DISABLED FOR NOW */ #main div.form-progress{display: none;} /* tooltips */ .overlay {position:absolute;display:block;} .tt {visibility:hidden;position:absolute;color:#333;background-color:#FDFFB4;padding:2px;border:1px solid #FCC90D;font:100% sans-serif;width:auto;} /** * 8. Footer Styling * ================= */ #definitions{display: none} #footer{display: none;} #footer-print{display: none; } #footer-print p{margin: 1em 10px; } /* IE6 css fixer v0.4: Fri, 22 May 2009 14:15:56 +0200 */ /* ============================================= */ /* safe settings */ /* add display:inline to floated elements */ * html .flashbanner, * html #module-nav-lang ul li, * html #crumb-trail-container li, * html .gridTwoLeft .col-2, * html .gridThree .wrapper2 .wrapperIn, * html .gridThree .col-3, * html #three-col #main, * html #two-col-modules #main, * html #two-col-modules #modules, * html #two-col-subnav #main, * html #two-col-leafnode #main, * html #two-col-facet #main, * html #two-col-facet-leafnode #main, * html #one-col #main, * html #two-col-subnav #sub-nav, * html #two-col-leafnode #sub-nav, * html #two-col-facet #sub-nav, * html #two-col-facet-leafnode #sub-nav, * html #main .indekijker span.fixedimage, * html #main .publicatie span.fixedimage, * html #main .tekstsectie span.fixedimage, * html #main .tekstblok span.fixedimage, * html #main .vergunning span.fixedimage, * html #main .subsidie span.fixedimage, * html #main .attest span.fixedimage, * html #main .calendar span.fixedimage, * html #main .news span.fixedimage, * html #main div.summary span.result-count, * html #main div.summary span.rss, * html #main div.facet-filter ul.alphabet li, * html #main table.search_results.address .address-detail-1, * html #main table.search_results.address .address-detail-2, * html #main div.formButtonLeft, * html #main div.formButtonRight, * html #main form.formStandard table.formtable td span.tooltip, * html .gridTwoLeft .col-1, * html .gridThree .col-1, * html .gridThree .col-2, * html #main div.inlinemodule span.tel, * html #main div.inlinemodule span.fax, * html #main div.inlinemodule span.prefix, * html #main form.formStandard table.formtable tr td.WebFormData input, * html #main form.formStandard table.formtable td.WebFormData select, * html #main form.formStandard table.formtable td.WebFormData textarea, * html #main form.formStandard table.formtable td table.Form_embedded_basic, * html #main form.formStandard table.Table_field_basic {display:inline;} /* convert min height values */ * html #content, * html #content-container {height:50em;} /* add zoom:1 to overflow:hidden */ * html .flashbanner, * html #module-nav-lang ul li, * html #crumb-trail-container li, * html .gridTwoLeft .col-2, * html .gridThree .wrapper2 .wrapperIn, * html .gridThree .col-3, * html #three-col #main, * html #two-col-modules #main, * html #two-col-modules #modules, * html #two-col-subnav #main, * html #two-col-leafnode #main, * html #two-col-facet #main, * html #two-col-facet-leafnode #main, * html #one-col #main, * html #two-col-subnav #sub-nav, * html #two-col-leafnode #sub-nav, * html #two-col-facet #sub-nav, * html #two-col-facet-leafnode #sub-nav, * html #main .indekijker span.fixedimage, * html #main .publicatie span.fixedimage, * html #main .tekstsectie span.fixedimage, * html #main .tekstblok span.fixedimage, * html #main .vergunning span.fixedimage, * html #main .subsidie span.fixedimage, * html #main .attest span.fixedimage, * html #main .calendar span.fixedimage, * html #main .news span.fixedimage, * html #main div.summary span.result-count, * html #main div.summary span.rss, * html #main div.facet-filter ul.alphabet li, * html #main table.search_results.address .address-detail-1, * html #main table.search_results.address .address-detail-2, * html #main div.formButtonLeft, * html #main div.formButtonRight, * html #main form.formStandard table.formtable td span.tooltip, * html .gridTwoLeft .col-1, * html .gridThree .col-1, * html .gridThree .col-2, * html #main div.inlinemodule span.tel, * html #main div.inlinemodule span.fax, * html #main div.inlinemodule span.prefix, * html #main form.formStandard table.formtable tr td.WebFormData input, * html #main form.formStandard table.formtable td.WebFormData select, * html #main form.formStandard table.formtable td.WebFormData textarea, * html #main form.formStandard table.formtable td table.Form_embedded_basic, * html #main form.formStandard table.Table_field_basic {zoom:1;} /* fix negative margins */ * html .gridThree .col-3, * html #main div.facet-filter ul.alphabet li.active, * html #main div.banner, * html #sub-nav ul li ul, * html #sub-nav ul li ul li ul, * html #modules div.nieuwsbrief, * html #main form.formStandard, * html .gridTwoLeft .col-1, * html .gridThree .col-1 {position:relative; zoom:1;} /* add zoom:1 to pos:relative elements */ * html #container, * html #content, * html #main div.facet-filter ul.alphabet, * html #modules div.indekijker, * html #main form.formStandard {zoom:1;} * html #sub-nav ul.show-arrows-in-list {width:100%;} * html #sub-nav ul.show-arrows-in-list ul {width:auto;} * html #sub-nav li {zoom:1;} * html #sub-nav li a {zoom:1;} * html #crumb-trail-container {zoom:1;} *:first-child+html .gridThree .wrapper2 {zoom:1;} * html #search-box input.search-button {height:1.6em;} *:first-child+html #search-box input.search-button {height:1.6em;} * html .nieuwsbriefModule form input#email {float:left; margin-right:0.5em;} * html .nieuwsbriefModule form input#submitButton{height:1.6em;} *:first-child+html .nieuwsbriefModule form input#email {float:left; margin-right:0.5em;} *:first-child+html .nieuwsbriefModule form input#submitButton{height:1.6em;}