/** * * Colors used: * #99d0e2 blue background color * #727171 gray text general, quote name * #1d8ecd blue h2 * #f47929 orange required text * #cb0202 red form error label * #ababab gray quote time * * #63b2ca blue links - main menu links * #ff7a23 orange breadcrumb text * * #ca2026 red form errors block * */ /********************************************************************************************************************* * BASE BACKGROUND *********************************************************************************************************************/ html { overflow-y: scroll; } #main-wrapper { width: 100%; margin: 0 auto; } body { font-size: 62.5%; color: #727171; font-family: Trebuchet MS, Helvetica, Arial; background-color: #97d2e4; } #main-wrapper { padding-bottom: 40px; position: relative; } #page-wrapper { width: 930px; margin: auto; position: relative;} #top-wrapper { position:relative; height: 180px; } #top-wrapper .top-banner { width: 930px; height: 106px; display: block; background: url('../img/template/background/bg-top-banner.png') no-repeat center top; } #top-wrapper .top-logo { position:absolute; top:0px; left:0px; width:307px; height:88px; background: transparent url('../img/template/background/logo.png') no-repeat center; } #top-wrapper .top-menu-wrapper { height: 74px; background: url('../img/template/background/bg-menu-banner.jpg') no-repeat center top; } #content-wrapper { padding: 0 20px; background: #ffffff url('../img/template/background/bg-top-content.gif') no-repeat center top; overflow: hidden; } #footer { padding: 0 20px; height: 115px; background: url('../img/template/background/footer.png') no-repeat center top; } .top-wrapper-home { height: 250px !important; } .top-wrapper-home .top-banner { height: 176px !important; background-image: url('../img/template/background/bg-top-banner-home.png') !important; } /********************************************************************************************************************* * MAIN STYLES *********************************************************************************************************************/ h1,h2,h3 { font-size: 1.3em; font-weight: bold; color: #5698ac; } h4, h5, h6 { font-size: 1.2em; font-weight: bold; } a { color: #63b2ca; text-decoration: none; } a:link {} a:hover { text-decoration: underline; } a:visited {} a:active {} p { padding: 0 0 14px 0; font-size: 1.3em; line-height:1.3em;} ul { } ul li { } table { border-collapse: collapse; border-spacing: 0; } .right { float: right; } .ie6extramargin { margin-bottom: 0; line-height: 0; height: 0; } .ie6extramargin-small { margin-bottom: 0; line-height: 0; } /********************************************************************************************************************* * TOP / MAIN MENU / BREADCRUMB *********************************************************************************************************************/ .top-banner { height: 190px; } .main-menu-wrapper { height: 45px; } .main-menu { padding: 0 0 0 20px; overflow: hidden; } .main-menu li { float: left; display: block; height: 34px; font-size: 1.2em; margin-right:5px; } .main-menu li a { display: block; height: 21px; padding: 9px 0 0 10px; } .main-menu li a:hover { color: #bb1453; } .main-menu li a.active:hover { color: #ffffff; } .main-menu li.home a { width:40px; } .main-menu li.alleactiviteiten a { width:100px; } .main-menu li.vraagenantwoord a { width:114px; } .main-menu li.aanbod a { width:114px; } .main-menu li.nieuwsbrief a { width:52px; } .main-menu li.hetsizocentre a { width:100px; } .main-menu li.agenda a { width:55px; } .main-menu li.contact a { width:55px; } .main-menu li.links a { width:44px; } .main-menu li.home .active { background: url('../img/template/menu/bg-home.gif'); } .main-menu li.alleactiviteiten .active { background: url('../img/template/menu/bg-alleactiviteiten.gif'); } .main-menu li.vraagenantwoord .active { background: url('../img/template/menu/bg-vraagenantwoord.gif'); } .main-menu li.aanbod .active { background: url('../img/template/menu/bg-aanbod.gif'); } .main-menu li.nieuwsbrief .active { background: url('../img/template/menu/bg-nieuwsbrief.gif'); } .main-menu li.hetsizocentre .active { background: url('../img/template/menu/bg-sizocentre.gif'); } .main-menu li.agenda .active { background: url('../img/template/menu/bg-contact.gif'); } .main-menu li.contact .active { background: url('../img/template/menu/bg-contact.gif'); } .main-menu li.links .active { background: url('../img/template/menu/bg-links.gif'); } .main-menu a { color: #63b2ca; } .main-menu a.active { color: #ffffff; } .main-menu a:hover { text-decoration: none; } .breadcrumb { padding: 0 0 0 15px; overflow: hidden; } .breadcrumb li { padding: 0 0 0 5px; float: left; font-weight: bold; color: #ff7a23; font-size: 1.1em; } .breadcrumb a { padding: 0 9px 0 0; font-weight: normal; background: url('../img/template/breadcrumb-divider.gif') no-repeat right 6px; } /********************************************************************************************************************* * SUBMENU *********************************************************************************************************************/ .submenu { float: left; width: 135px; } .submenu ul { width: 125px; } .submenu ul li { width: 125px; height: 75px; font-size: 1.4em;} .submenu ul li a { padding: 30px 15px 0 10px; width: 100px; height: 35px; display: block; color: #ffffff; background: url('../img/template/submenu/submenu-bg-1.gif') no-repeat left top; } .submenu ul li a:hover { text-decoration: none; } .submenu ul li a.item-2 { background-image: url('../img/template/submenu/submenu-bg-2.gif'); } .submenu ul li a.item-3 { background-image: url('../img/template/submenu/submenu-bg-3.gif'); } .submenu ul li a.item-4 { background-image: url('../img/template/submenu/submenu-bg-4.gif'); } .submenu ul li a.item-5 { background-image: url('../img/template/submenu/submenu-bg-5.gif'); } .submenu ul li.active a.item-1 { background-image: url('../img/template/submenu/submenu-bg-active-2.gif'); } .submenu ul li.active a.item-2 { background-image: url('../img/template/submenu/submenu-bg-active-2.gif'); } .submenu ul li.active a.item-3 { background-image: url('../img/template/submenu/submenu-bg-active-3.gif'); } .submenu ul li.active a.item-4 { background-image: url('../img/template/submenu/submenu-bg-active-4.gif'); } .submenu ul li.active a.item-5 { background-image: url('../img/template/submenu/submenu-bg-active-5.gif'); } /********************************************************************************************************************* * TITLES *********************************************************************************************************************/ .title { padding: 20px 25px 0 25px; font-size: 1.4em; color: #ffffff; height: 21px; display: block; } .title-large-left, .title-large-right { width: 695px; } .title-medium-left, .title-medium-right { width: 415px; } .title-small-left, .title-small-right { width: 210px; } .title-large-left { background: url('../img/template/titles/overlay-large-left.png') no-repeat left top; } .title-large-right { text-align: right; background: url('../img/template/titles/overlay-large-right.png') no-repeat left top; } .title-medium-left { background: url('../img/template/titles/overlay-medium-left.png') no-repeat left top; } .title-medium-right { text-align: right; background: url('../img/template/titles/overlay-medium-right.png') no-repeat left top; } .title-small-left { background: url('../img/template/titles/overlay-small-left.png') no-repeat left top; } .title-small-right { text-align: right; background: url('../img/template/titles/overlay-small-right.png') no-repeat left top; } .title-text-yellow { color: #D5C421; } .title-text-pink { color: #C30A4D; } .title-text-orange { color: #EC5400; } .title-text-green { color: #85B701; } .title-blue { background-color: #63b2ca; } .title-yellow { background-color: #f3db12; color: #ae7430; } .title-pink { background-color: #c30a4d; } .title-red { background-color: #c30a4d; } .title-cat1 { background-color: #ad0844; } /* leraren */ .title-cat2 { background-color: #f15d22; } /* 12-65 jaar */ /* original color not websafe */ .title-cat3 { background-color: #99ca3c; } /* 8-12 jaar */ /* original color not websafe */ .title-cat4 { background-color: #e6cd03; } /* MBO/HBO */ /********************************************************************************************************************* * FORMS *********************************************************************************************************************/ .form-item { padding: 0 0 6px 0; } .form-item label { padding-bottom: 6px; display: block; color: #5698ac; font-weight: bold; font-size: 1.2em; } .form-item label .required { color: #f47929; } .form-error label { color: #cb0202; } .fields-required-text { padding-bottom: 5px; color: #f47929; float:left; width:200px; } .input-text { padding: 3px; width: 169px; height: 14px; font-size: 1.1em; border: none; color: #727171; background: url('../img/template/form-textfield.gif') no-repeat left top; } textarea { padding: 3px; width: 219px; height: 108px; font-size: 1.1em; border: none; color: #727171; font-family: Trebuchet MS, Helvetica, Arial; background: url('../img/template/form-textarea.gif') no-repeat left top; } .large-textarea { width:408px !important; background:url(../img/template/large-textarea-bg.gif) no-repeat top left !important; } .input-button { padding: 0 0 0 7px; font-size: 1.1em; color: #63b2ca; cursor: pointer; float: right; background: transparent url('../img/template/list-arrow.gif') no-repeat 0px 6px; border: none; } .form-item .day, .form-item .month, .form-item .year { width: 49px; margin-right: 4px; background-image: url('../img/template/form-textfield-date.gif'); } .default-value { font-style: italic; } .form-left { width: 190px; float: left; } .form-right { width: 220px; float: left; position:relative;} .form-description { width: 230px; float: left; margin-right:15px; } .form-content { width: 450px; float: left; } .content .form-errors-block { color: #ffffff; margin-bottom: 15px; } .content .form-errors-block h6 { padding: 2px 0 0 0; } .content .form-errors-block ul { padding: 15px 0 13px 0; } .content .form-errors-block ul li { padding-left: 10px; background: url('../img/template/arrow-white.gif') no-repeat 0px 7px; } .new-activity .form-description { width: 425px; float: left; margin-right:15px; } .new-activity .form-content { width: 255px; float: left; } .new-activity .fields-required-text { padding-top: 20px; } .rightAligned { float:right; display:inline-block; } .greenBtn { background: url('../img/block-button-bg_green.gif') no-repeat left top !important; } /********************************************************************************************************************* * BLOCKS *********************************************************************************************************************/ .content-block { margin: 0 0 10px; width: 100%; clear:both; } .content-block .top-border-wrapper, .content-block .bottom-border-wrapper { height: 2px; } .content-block .top-left, .content-block .top-right, .content-block .bottom-left, .content-block .bottom-right { margin: 0; padding: 0; height: 2px; width: 50%; float: left; line-height: 1px; font-size: 1px; } .content-block .top-left { background: url('../img/template/blocks/content-block-top-left.gif') no-repeat left top; } .content-block .top-right { background: url('../img/template/blocks/content-block-top-right.gif') no-repeat right top; } .content-block .bottom-left { background: url('../img/template/blocks/content-block-bottom-left.gif') no-repeat left top; } .content-block .bottom-right { background: url('../img/template/blocks/content-block-bottom-right.gif') no-repeat right top; } .content-block .inner-content { padding: 15px 15px 1px; overflow: hidden; position:relative; border-left: 1px solid #ededed; border-right: 1px solid #ededed; } .body-content-block-outer-top { background-image: url('../img/template/blocks/body-content-block-outer-top.png'); background-repeat: repeat-x; } .body-content-block-outer-bottom { background-image: url('../img/template/blocks/body-content-block-outer-bottom.png'); background-repeat: repeat-x; background-position: bottom; } .body-content-block-outer-left { background-image: url('../img/template/blocks/body-content-block-outer-left.png'); background-repeat: repeat-y; } .body-content-block-outer-left-corner { background-image: url('../img/template/blocks/body-content-block-outer-left-corner.png'); background-repeat: no-repeat; background-position: left bottom; } .body-content-block-outer-left-top { background-image: url('../img/template/blocks/body-content-block-outer-left-top.png'); background-repeat: no-repeat; background-position: left top; } .body-content-block-outer-right { background-image: url('../img/template/blocks/body-content-block-outer-right.png'); background-repeat: repeat-y; background-position: right; } .body-content-block-outer-right-corner { background-image: url('../img/template/blocks/body-content-block-outer-right-corner.png'); background-repeat: no-repeat; background-position: right top; } .body-content-block-outer-right-bottom { background-image: url('../img/template/blocks/body-content-block-outer-right-bottom.png'); background-repeat: no-repeat; background-position: right bottom; } .body-content-block-inner { padding:20px; padding-bottom: 57px; text-align: left; min-height:80px; height: auto !important; height: 80px; margin-bottom:10px;} .big-border-block { margin:10px 0 0 0; width: 100%; } .big-border-block .top-border-wrapper, .big-border-block .bottom-border-wrapper { height: 4px; } .big-border-block .top-left, .big-border-block .top-right, .big-border-block .bottom-left, .big-border-block .bottom-right { margin: 0; padding: 0; height: 4px; width: 50%; float: left; line-height: 1px; font-size: 1px; } .big-border-block .top-left { background: url('../img/template/blocks/big-border-block-top-left.gif') no-repeat left top; } .big-border-block .top-right { background: url('../img/template/blocks/big-border-block-top-right.gif') no-repeat right top; } .big-border-block .bottom-left { background: url('../img/template/blocks/big-border-block-bottom-left.gif') no-repeat left top; } .big-border-block .bottom-right { background: url('../img/template/blocks/big-border-block-bottom-right.gif') no-repeat right top; } .big-border-block .inner-content { padding: 15px 12px 1px; clear:both; overflow: hidden; border-left: 3px solid #ededed; border-right: 3px solid #ededed; } .body-content-block-outer-top { margin-bottom: 10px; background: url('../img/template/blocks/body-content-block-outer-top.png') repeat-x; } .body-content-block-outer-bottom { background-image: url('../img/template/blocks/body-content-block-outer-bottom.png'); background-repeat: repeat-x; background-position: bottom; } .body-content-block-outer-left { background-image: url('../img/template/blocks/body-content-block-outer-left.png'); background-repeat: repeat-y; } .body-content-block-outer-left-corner { background-image: url('../img/template/blocks/body-content-block-outer-left-corner.png'); background-repeat: no-repeat; background-position: left bottom; } .body-content-block-outer-left-top { background-image: url'(../img/template/blocks/body-content-block-outer-left-top.png'); background-repeat: no-repeat; background-position: left top; } .body-content-block-outer-right { background-image: url('../img/template/blocks/body-content-block-outer-right.png'); background-repeat: repeat-y; background-position: right; } .body-content-block-outer-right-corner { background-image: url('../img/template/blocks/body-content-block-outer-right-corner.png'); background-repeat: no-repeat; background-position: right top; } .body-content-block-outer-right-bottom { background-image: url('../img/template/blocks/body-content-block-outer-right-bottom.png'); background-repeat: no-repeat; background-position: right bottom; } .body-content-block-inner { padding: 20px 25px 57px; text-align: left; min-height:80px; overflow: hidden;} .body-content-block-inner h1, h2, h3, h4, h5, h6 { text-align: left; } .body-content-block-r-outer-left-corner { background-image: url('../img/template/blocks/body-content-block-r-outer-left-corner.png'); background-repeat: no-repeat; background-position: left top; } .body-content-block-r-outer-right-bottom { background-image: url('../img/template/blocks/body-content-block-r-outer-right-bottom.png'); background-repeat: no-repeat; background-position: left bottom; } .body-content-block-r-outer-right-corner { background-image: url('../img/template/blocks/body-content-block-r-outer-right-corner.png'); background-repeat: no-repeat; background-position: right bottom; } .form-errors-block { background-color: #ca2026; } .form-errors-block .top-left { background: url('../img/template/blocks/form-errors-block-corner.gif') no-repeat left top; } .form-errors-block .top-right { background: url('../img/template/blocks/form-errors-block-corner.gif') no-repeat right top; } .form-errors-block .bottom-left { background: url('../img/template/blocks/form-errors-block-corner.gif') no-repeat left bottom; } .form-errors-block .bottom-right { background: url('../img/template/blocks/form-errors-block-corner.gif') no-repeat right bottom; } .form-errors-block .inner-content { padding-left: 50px; border: none; background: url('../img/template/form-errors-icon.gif') no-repeat 15px 15px; } .activity-2cols .top-border-wrapper, .activity-2cols .bottom-border-wrapper { height: 2px; line-height: 1px; font-size: 1px; } .activity-2cols .top-border-wrapper { background: url('../img/template/blocks/2col-activity-block-top.gif') no-repeat left top; } .activity-2cols .bottom-border-wrapper { background: url('../img/template/blocks/2col-activity-block-bottom.gif') no-repeat left top; } .activity-2cols .inner-content { overflow: hidden; background: url('../img/template/blocks/2col-activity-block-content.gif') repeat-y left top; } /********************************************************************************************************************* * CONTENT *********************************************************************************************************************/ .content { padding: 0 0 60px 10px; width: 745px; float: left; } .pagesplitter-left-column { float:left; width:465px; margin-right:20px; } .pagesplitter-right-column { float:left; width:260px; } .content h2 { padding-bottom: 12px; } .content ul { padding-bottom: 14px; clear: both; } .content ul li { padding: 0 0 0 26px; font-size: 1.3em; line-height: 1.65em; background: url('../img/template/list-bullet.gif') no-repeat 16px 6px; } .content ul li li { font-size: 1em; } .content ul.linklist li { background: url('../img/template/list-arrow.gif') no-repeat 16px 7px; } .arrow-link { padding: 0 0 0 10px; font-weight: bold; background: url('../img/template/list-arrow.gif') no-repeat left 6px; font-size:12px; } .calendarblock .arrow-link { font-weight:bold; font-size:1.2em; color:#2e5ebe; display:inline-block; } .back-link { padding: 0 0 0 10px; font-size: 1.1em; font-weight: bold; background: url('../img/template/arrow-back.gif') no-repeat left 6px; } .block-button { padding: 4px 0 0 10px; width: 190px; height: 21px; background: url('../img/template/block-button-bg.gif') no-repeat left top; } .block-button .arrow-link { font-size:1.2em; color: #ffffff; background: url('../img/template/arrow-white.gif') no-repeat 0px 6px; } .content-text { float: left; width: 450px;} .content-image { margin: 0 0 0 15px; float: right; } .skip { color:#fff !important; } .skip:hover { text-decoration:none; color:#fff !important; } .white-heading { color:#fff !important; } /********************************************************************************************************************* * HOMEPAGE *********************************************************************************************************************/ .homepage { } .home-intro-block { padding: 15px 15px 10px 20px; width: 431px; height: 80px; background: url('../img/template/blocks/home-intro-block.gif') no-repeat left top; } .home-intro-block h2 { padding-bottom: 6px; font-size: 1.6em; } .home-intro-block h2 span.letter-s { color: #b00845; } .home-intro-block h2 span.letter-i { color: #df4f00; } .home-intro-block h2 span.letter-z { color: #c7b520; } .home-intro-block h2 span.letter-o { color: #95c13d; } .home-media-wrapper { margin-bottom: 10px; } .home-activity-block { margin-bottom: 10px; position:relative; padding: 1px; width: 198px; height: 90px; float: left; text-align: left; background: url('../img/template/homepage/activity-border.gif') no-repeat left top; } .homepage .odd-block { margin-right: 10px; } .home-activity-block .img-wrapper { padding: 0; width: 198px; height: 90px; } .home-activity-block .img-overlay { width: 198px; height: 90px; } .home-activity-block .link-wrapper { padding: 3px 9px; top: -41px; left: 2px; width: 152px; height: 29px; display: block; position: relative; background: url('../img/template/homepage/activity-link.gif') no-repeat left top; } .home-activity-block a { color: #727171; } .home-activity-block a:hover { color: #63b2ca; text-decoration: none; } .top5-block { margin-bottom: 10px; } .top5-block .arrow-link { font-size: 1.2em; } .content .top5 li { padding: 5px 0 5px 10px; width: 200px; background: none; overflow: hidden; } .content .top5 .no1 { padding: 0 0 5px 0; } .content .top5 .no2, .content .top5 .no4 { background-color: #ededed; } .content .top5 .top5-text { padding: 0 0 0 18px; float: left; width: 135px; text-align: left; line-height: 1.3em; } .content .top5 .top5-text .date { font-size:1em; } .content .top5 .no1 .top5-text { padding: 10px 0 0 8px; } .top5 .image { float: left; width: 31px; height: 29px; display: block; background: url('../img/template/homepage/no2.gif') no-repeat left top; } .top5 .no1 .image { width: 51px; height: 49px; background-image: url('../img/template/homepage/no1.gif') } .top5 .no3 .image { background-image: url('../img/template/homepage/no3.gif') } .top5 .no4 .image { background-image: url('../img/template/homepage/no4.gif') } .top5 .no5 .image { background-image: url('../img/template/homepage/no5.gif') } .featured-project { padding-top: 4px; padding-left: 5px; padding-right: 0; text-align: left;} .home-tabs { overflow: hidden; } .content .home-tabs li { padding: 10px 0; background: none; float: left; cursor: pointer; color: #63b2ca; } .content .home-tabs li.tab-left { padding-left: 20px; width: 119px; background: url('../img/template/homepage/tab-inactive-left.gif') no-repeat left bottom; } .content .home-tabs li.tab-right { padding-left: 14px; width: 97px; background: url('../img/template/homepage/tab-inactive-right.gif') no-repeat left bottom; } .content .home-tabs li.active { background: none; font-weight: bold; } .featured-project .tabcontent { padding: 5px 15px 0 10px; overflow: hidden; } .featured-project .tabcontent .arrow-link { font-size: 1.2em;} .featured-project #tab-left .text-wrapper { padding: 0 0 0 10px; float: left; width: 110px; } .featured-project .tabcontent img { float: left; } .featured-project #tab-right { display: none; width: 220px; } /********************************************************************************************************************* * REACTIONS *********************************************************************************************************************/ .intro-content, .quote-open, .quote-close, .quote-date { color: #63b2ca; } .quote-date { float: right; font-size: 1.1em; } .quote-date span { color: #ababab; } .quote-name { color: #727171; } .quote-open { padding: 0 4px 0 0; } .quote-close { padding: 0 0 0 4px; } .quote-top-link { margin-bottom: 10px; } .reaction-link { font-size: 1.1em; } /********************************************************************************************************************* * ACTIVITIES *********************************************************************************************************************/ .content .activities-legend { display: block; background: url('../img/template/activities/legend-bg.png'); padding: 0; min-height: 30px; margin: 0 0 20px; } .content .activities-legend li { background: none; float: right; list-style: none; height: 30px; line-height: 30px; cursor: pointer; font-size: 11px; } .content .activities-legend li.cat, .content .activities-legend li.nocat { padding: 0 13px 0 28px; background: url('../img/template/activities/legend-checkboxes.png') no-repeat 9px 0; border-left: 1px solid #dadada; } .content .activities-legend li.nocat { float: left; } .content .activities-legend li.active { background-image: url('../img/template/activities/legend-checkboxes-checked.png'); } .content .activities-legend li.cat1 { background-position: 9px -30px; } .content .activities-legend li.cat2 { background-position: 9px -60px; } .content .activities-legend li.cat3 { background-position: 9px -90px; } .content .activities-legend li.cat4 { background-position: 9px -120px; } .activities-block { width: 695px; } .activities-block .inner-content { padding: 10px 0 10px 10px; } .activities-block .img-wrapper { width: 198px; height: 68px; float: left; } .activities-block .img-overlay { width: 199px; height: 69px; } .activities-block .activity-text { padding: 0 15px; width: 445px; float: left; } .activities-block .activity-text h2 { padding-bottom: 5px; } .activities-block .activity-text p { line-height: 1.3em; } .activities-block .activity-text .arrow-link { display:block; } .img-wrapper { padding: 1px; position: relative; } .img-wrapper .img-overlay { position: absolute; left: 0; top: 0; z-index: 20; display: block; } .cat1-block .img-overlay { background: transparent url('../img/template/activities/overlay-cat1.png') no-repeat right bottom; } .cat1-block h2 a , .activity-cat1 h1, h2.cat1-title { color: #bf074a; } .cat2-block .img-overlay { background: transparent url('../img/template/activities/overlay-cat2.png') no-repeat right bottom; } .cat2-block h2 a , .activity-cat2 h1, h2.cat2-title { color: #e55525; } .cat3-block .img-overlay { background: transparent url('../img/template/activities/overlay-cat3.png') no-repeat right bottom; } .cat3-block h2 a , .activity-cat3 h1, h2.cat3-title { color: #90c501; } .cat4-block .img-overlay { background: transparent url('../img/template/activities/overlay-cat4.png') no-repeat right bottom; } .cat4-block h2 a , .activity-cat4 h1, h2.cat4-title { color: #bdad31; } /********************************************************************************************************************* * LINKS *********************************************************************************************************************/ .link-block { width: 338px; float: left; padding: 1px; } .link-block .inner-content { padding: 10px 0 10px 10px; } .link-odd { width: 333px; margin-right: 10px; } .link-block img { float: left; } .link-block .link-text { padding: 5px 15px;width: 170px; float: left; } .link-block .link-text h2, .link-block .link-text p { padding-bottom: 6px; } .link-block .arrow-link { float: right; font-size: 1.1em; } /********************************************************************************************************************* * CONTACT INFO *********************************************************************************************************************/ .contactinfo-wrapper { height:144px; } .contact-form { min-height:220px; } /* too bad for ie... */ .contact-form h3 { margin-bottom: 15px; } .about-sizo .intro { font-weight: bold; } /********************************************************************************************************************* * REACTION FORM *********************************************************************************************************************/ .reaction-form { min-height: 235px; } /* too bad for ie... */ .verify { width: 50px; margin: 6px 0 8px 0; background-image: url('../img/template/form-textfield-verify.gif'); } .captcha { margin-right: 15px; } /********************************************************************************************************************* * FAQ *********************************************************************************************************************/ .faq-left {width:338px; float:left; margin-right:20px;} .faq-right {width:337px; float:left;} .faq-cat-header h2 {font-size:1.6em;padding-bottom:5px;} .faq-cat-footer {margin:10px 0 35px 0;} .faq-item-info {font-weight:bold;font-size:1.2em;} .faq-item-info span{font-weight:normal; color: #B8B8B8; } .title-text-faq1 { color: #C30A4D; } /* red */ .title-faq1 { background-color: #C30A4D; } .title-text-faq2 { color: #85B701; } /* green */ .title-faq2 { background-color: #85B701; } .title-text-faq3 { color: #D5C421; } /* orange */ .title-faq3 { background-color: #D5C421; } .title-text-faq4 { color: #EC5400; } /* yellow */ .title-faq4 { background-color: #EC5400; } .faq-inner-content { clear:both; overflow: hidden; border-left: 1px solid #ededed; border-right: 1px solid #ededed; } .faq-cat-header { padding: 5px 15px 1px; } .faq-content { padding: 5px 15px 1px; } .faq-seperator { border-top: 1px solid #ededed; height: 1px; width: 100%; margin-top: 10px; margin-bottom:5px; } .faq-cat-footer { padding-bottom: 20px; } .faq-item-link .arrow-link { font-weight: normal; font-size: 1.2em; } .faq-cat-footer .arrow-link { font-size: 1.2em; } .form-small-text { clear: both; font-size: 0.9em; color:#B8B8B8; padding-top:10px; } .your-question-left { float:left; width:220px; margin-right:15px; } .your-question-right { float:left; width:460px; } .inner-content.your-question-left-blok, .inner-content.your-question-right-blok { min-height: 270px; } .arrow-overview { float: left; margin-bottom:10px; width:100%; } .faq-item-left { float: left; width: 326px; border-right: 1px solid #ededed; border-top: 1px solid #ededed; padding: 10px; } .faq-item-right { float: left; width: 326px; border-top: 1px solid #ededed; padding: 10px; } /********************************************************************************************************************* * ACTIVITY *********************************************************************************************************************/ /* top block left col */ .activity-left { width: 220px; float: left; } .image-border { padding: 1px; width: 198px; height: 148px; background: url('../img/template/activities/image-border.gif') no-repeat left top; } .buttons { padding: 10px 0 5px; } .inner-content .buttons { padding: 0 0 5px; margin: -5px 0 0; } .buttons .block-button { margin-bottom: 5px; } .activity-left .big-border-block { width: 200px; } .activity-left .comment { font-size: 1em; line-height: 1.3em; padding-top: 5px; padding-bottom: 5px; text-align: left; } /* date overview table */ .date-overview { width: 160px; margin: 12px auto; } .date-overview td { padding: 0; width: 80px; height: 63px; } .date-overview .day-number { font-size: 3.5em; color: #d9c62c; font-weight: bold; } .date-overview .month { height: 12px; display: block; font-weight: bold; color: #727171; } .date-overview .year { position: relative; top: -17px; color: #727171; } .date-overview a { padding: 6px 10px; width: 61px; height: 51px; display: block; text-decoration: none; } .date-overview a:hover { background: url('../img/template/date-overview/overview-bg.gif') no-repeat left top;} .date-overview .firstrow .left-col a:hover { background-image: url('../img/template/date-overview/overview-bg-top-left.gif');} .date-overview .firstrow .right-col a:hover { background-image: url('../img/template/date-overview/overview-bg-top-right.gif');} .date-overview .lastrow .left-col a:hover { background-image: url('../img/template/date-overview/overview-bg-bottom-left.gif');} .date-overview .lastrow .right-col a:hover { background-image: url('../img/template/date-overview/overview-bg-bottom-right.gif');} .date-overview .left-col { border-right: 1px solid #e9e9e9; } .date-overview td { border-top: 1px solid #e9e9e9; } .date-overview .firstrow td { border-top: none; } /* Top block right col */ .activity-right { width: 475px; float: left; } .activity-right .inner-content { padding-top: 12px; } .activity-right h1 { font-size: 1.6em; } .activity-right .intro { padding-top: 7px; font-weight: bold; } .activity-right .column { padding: 0 15px; width: 200px; float: left; } .activity-right .column h3 { padding-bottom: 4px; margin-bottom:0; } .activity-right .column p { padding-bottom: 14px; } .activity-right .left { margin-right: 10px; } .activity-right ul li { padding-left: 12px; background-image: url('../img/template/list-bullet-gray.gif'); background-position: 1px 6px; } /* experience block */ .experience-block { padding: 1px; margin-bottom: 10px; width: 693px; } .experience-block .inner-content { padding: 10px 0 10px 10px; } .experience-block img { width: 98px; height: 98px; float: left; } .experience-block .experience-text { padding: 11px 15px; width: 550px; min-height: 76px; height: auto !important; height: 76px; float: left; } .experience-block .experience-text h2 { padding-bottom: 9px; } .experience-block .experience-text p { padding-bottom: 9px; } .experience-block .experience-signature { font-size: 1.1em; color: #008fd8; font-style: italic; } .experience-block .experience-signature span { font-weight: bold; } /* related links */ .related-links { padding-bottom: 47px; } .related-links h2.related-links-title { font-size: 1.6em; clear: both;} .related-links .related-link { padding: 0 23px 0 0; width: 216px; float: left; text-align: left; } .related-links .related-link .img-wrapper { width: 216px; height: 79px; float: left; background: url('../img/template/activities/activity-related-block.png') no-repeat left top; } .related-links .related-link .img-overlay { width: 216px; height: 79px; z-index: 10; } .related-links .related-link ul.linklist { padding: 2px 0; margin: 0 0 15px; } .related-links .related-link ul.linklist li { padding-left: 10px; background-position: 2px 6px; font-weight: bold; line-height: 1.4em; } .related-links .related-link-row-last { padding: 0; clear: right; } /* activity match */ .activity-match { padding: 0 13px 0 0; width: 126px; float: left; text-align: left; } .activity-match .img-wrapper { width: 126px; height: 69px; float: left; background: url('../img/template/activities/activity-match-block.gif') no-repeat left top; } .activity-match .img-overlay { width: 126px; height: 69px; } .activity-match ul.linklist { padding: 2px 0; } .activity-match ul.linklist li { padding-left: 10px; background-position: 2px 6px; font-weight: bold; line-height: 1.4em; } /* overview category */ .overview-categories .overview-category { width: 215px; margin: 0 22px 20px 0; float: left; text-align: left; border: 1px solid #ececec; position: relative; } .overview-categories .overview-category-last { margin: 0 0 20px 0; clear: right; } .overview-categories .overview-category a:hover { text-decoration: none; } .overview-categories .overview-category a img { border-bottom: 1px solid #ececec; } .overview-categories .overview-category a h2 { display: block; position: absolute; left: 4px; top: 79px; width: 187px; height: 25px; overflow: hidden; background-color: black; color: white; padding: 10px; font-size: 12px; line-height: 12px; font-weight: bold; } .overview-categories .overview-category div { padding: 10px; min-height: 108px; } .overview-categories .overview-category ul.linklist { padding: 2px 0; } .overview-categories .overview-category ul.linklist li { padding-left: 10px; background-position: 2px 6px; line-height: 1.4em; } .overview-categories .cat1-block a h2 { background-color: #c30a4d; } .overview-categories .cat2-block a h2 { background-color: #e55525; } .overview-categories .cat3-block a h2 { background-color: #90c501; } .overview-categories .cat4-block a h2 { background-color: #f3db12; color: #ae7430; } /********************************************************************************************************************* * FOOTER *********************************************************************************************************************/ #footer { font-size: 1.1em; } #footer a.footer-link { color: #ababab; } .footer-menu { overflow: hidden; float: right; } .footer-menu li { float: left; } .footer-menu a { padding: 0 9px 0 10px; font-weight: normal; background: url('../img/template/footer-menu-divider.gif') no-repeat left 4px; } .footer-menu li.first-item a { padding-left: 0; background: none; } .footer-menu li.last-item a { padding-right: 0; } /********************************************************************************************************************* * AGENDA *********************************************************************************************************************/ .agenda-table { font-size: 1.1em; width: 705px; background-color: #EDEDED; margin-bottom: 20px;} .agenda-table th { color: #63B2CA; padding: 10px; background-color: #fff; border-right: 1px solid #bebebe; } .agenda-table td { padding: 10px; color: #4e4e4e; text-align: left; vertical-align: top; border-right: 1px solid #bebebe; border-bottom: 1px solid #ffffff; } .agenda-table tr { background-color: #e9e9e9; } .agenda-table tr.row-full td { color: #ADADAD; } .agenda-table td a { color: blue; } .agenda-table td.options a { background: url('../img/template/arrow-gray.gif') no-repeat 0 5px; padding-left: 8px; } .agenda-table .cursus { width: 149px; font-weight: bold; } .agenda-table .date { width: 58px; } .agenda-table .time { width: 57px; } .agenda-table .targetgroup { width: 70px; } .agenda-table .availability { width: 98px; } .agenda-table .location { width: 65px; } .agenda-table .options { width: 68px; border-right: none; } .agenda-table .full { color: #c30a4d; font-weight: bold; } .agenda-table th.cursus, .agenda-table th.date, .agenda-table th.time, .agenda-table th.targetgroup, .agenda-table th.availability { cursor: pointer; } /********************************************************************************************************************* * PAGE HEADER BACKGROUND IMAGE WITH OVERLAY *********************************************************************************************************************/ .background-with-overlay { width: 465px; height: 260px; margin-bottom:10px; } .background-with-overlay .overlay-image { background-image: url('../img/template/image-overlay.png'); background-repeat:no-repeat; width: 465px; height: 260px; position: absolute; z-index: 999; } .background-with-overlay .overlay-image-agenda { background-image: url('../img/template/image-overlay-agenda.png'); background-repeat:no-repeat; width: 465px; height: 260px; position: absolute; z-index: 999; } .background-with-overlay .overlay-image-agenda strong { font-size:1.4em; margin:15px 0 0 25px; color:#C30A4D; display:block; width:300px; } /********************************************************************************************************************* * CAPTCHA *********************************************************************************************************************/ .input-text verify { width: 50px; } /********************************************************************************************************************* * Datepicker calendar *********************************************************************************************************************/ .calendar-wrapper { margin: -10px 10px 10px 0; width: 210px; height: 160px; padding: 0 0 8px 0; border-bottom: 1px solid #e9e9e9; background: url('../img/template/calendar/calendar-back.gif') no-repeat 0px 10px; position:relative; } #calendar { } #calendar .datepicker { font-family: Trebuchet MS, Helvetica, Arial; font-size: 11px; } #calendar .datepickerContainer { position: relative; left: 0px; width: 230px !important; } #calendar .datepickerContainer table { width: 210px; } #calendar th, #calendar td { width: 30px; height: 20px; } #calendar .datepickerWeek { display: none; width: 0px; } /* hide weeks*/ #calendar .datepickerMonth a { color: #ffffff; } #calendar th { text-align: center; color: #5698ac; font-weight: bold; } #calendar td a { color: #727171; } #calendar td.datepickerSelected a { color: #ffffff; font-weight: bold; } #calendar .datepickerGoPrev a, #calendar .datepickerGoNext a { color: #ff7a23; font-size: 0.8em; cursor: pointer; } #calendar .datepickerNotInMonth a { color: #cccccc; } .calendar-cat1 td.datepickerSelected { background-color: #ad0844 !important; } .calendar-cat2 td.datepickerSelected { background-color: #f15d22 !important; } .calendar-cat3 td.datepickerSelected { background-color: #99ca3c !important; } .calendar-cat4 td.datepickerSelected { background-color: #e6cd03 !important; } /********************************************************************************************************************* * NEWSLETTER *********************************************************************************************************************/ .newsletter-subscribe, .newsletter-unsubscribe { width: 340px; float: left; } .newsletter-subscribe { margin-right: 15px; } .newsletter-subscribe .form-item, .newsletter-unsubscribe .form-item { float: left; width: 185px; } .newsletter-subscribe .input-button, .newsletter-unsubscribe .input-button { float: left; } .newsletter-link { font-size: 1.1em; margin-bottom: 10px; } .newsletter-block .arrow-link { font-size: 1.1em; } .newsletter-block .inner-content { padding-bottom: 15px; } /* links */ ul.links { } ul.links li { width:333px; /* min-height:125px; height:auto !important; */ height:98px; padding:0; float:left; background:url(../img/template/links-li-top-bg.gif) no-repeat top left; position:relative; margin:0 10px 10px 0; } ul.links li span.bottom-border { z-index:2; display:block; width:333px; height:2px; background:url(../img/template/links-li-bottom-bg.gif) no-repeat top right; position:absolute; bottom:-1px; left:0; font-size:1px; line-height:1px; z-index:1; } ul.links li .img-holder { width:125px; height:98px; overflow:hidden; position:absolute; top:1px; left:1px; } ul.links li h2 { font-size:100%; padding:10px 10px 0 145px; line-height:120%; } ul.links li p { font-size:100%; padding:10px 10px 10px 145px; line-height:120%; } ul.links li a { float:right; margin:0 10px 0 0; } .body-content-block-inner h3 { margin:10px 0 20px 0; color:#c30a4d; font-size:1.4em; } select.select-datum { display:block; width:227px; border:1px solid #bfbfbf; padding:1px; font-size: 1.2em; color: #727171; } /* data wrapper */ .data-wrapper { width:695px; background:url(../img/template/data-wrapper-bg.gif) no-repeat top left; position:relative; } .data-wrapper span.border-bottom { display:block; width:695px; height:2px; background:url(../img/template/data-wrapper-bottom-bg.gif) no-repeat top left; font-size:1px; line-height:1px; position:absolute; bottom:0; left:0; } .data-wrapper table td { vertical-align:middle; font-size:120%; padding:0 10px; height:40px; border-bottom:1px solid #fff; border-right:1px solid #bebebe; } .data-wrapper tr.head td { color:#63b2ca; font-weight: bold;} .data-wrapper tr.data td { background-color:#e9e9e9; color:#4e4e4e; } td.cursus-naam { font-weight:bold; width:138px; padding:0 0 0 10px; } td.datum { width:84px; padding:0 0 0 10px; } td.tijdstip { width:86px; padding:0 0 0 10px; } td.doelgroep { width:97px; padding:0 0 0 10px; } td.beschikbaarheid { width:125px; padding:0 0 0 10px; } td.locatie { width:99px; padding:0 0 0 10px; } .data-wrapper table td.last { border-right:none; } a.return-link { display:block; margin:0 0 10px 0; font-size:1.2em; background:url(../img/template/link-terug-bg.gif) no-repeat top left; padding:0 0 0 10px; float:right; } img.align-left { margin:0 10px 45px 0; } .inner-content ol { float:right; width:465px; } .inner-content ol li { font-size:120%; background:transparent url(../img/template/list-bullet.gif) no-repeat 0 6px; padding:0 0 0 15px;} /* news */ .news-articles { width:465px; float:left; } .news-articles .article, .news-articles .archive { width:430px; background:url(../img/news-article-bg.gif) no-repeat top left; position:relative; min-height:125px; height:auto !important; height:125px; padding:10px; margin:0 0 10px 0; } .news-articles .article span.bottom-bg, .news-articles .archive span.bottom-bg { clear:both; display:block; width:450px; height:2px; background:url(../img/news-article-bottom-bg.gif) no-repeat top left; font-size:1px; line-height:1px; position:absolute; bottom:-2px; left:0; } .article h2, .article em, .article p, .article a.arrow-link { margin:1px 0 1px 140px; padding:0; } .article em { font-weight:bold; font-size:1.1em; } .article p { padding:0 0 10px 0;} .article a.arrow-link { background:url(../img/news-link-bg.gif) no-repeat top left; padding:0 0 0 7px; font-size:1.2em; font-weight:bold; } .article img { position:absolute; top:10px; left:10px; } .newsletter-archive { float:left; width:210px; background:url(../img/newsletter-archive-bg.gif) no-repeat top left; position:relative; padding:10px; } .newsletter-archive span.bottom-bg { clear:both; display:block; width:230px; height:2px; background:url(../img/newsletter-archive-bottom-bg.gif) no-repeat bottom left; font-size:1px; line-height:1px; position:absolute; bottom:-2px; left:0; } .newsletter-archive h3 { padding:0 0 10px 0; margin:0; } .newsletter-archive p { font-weight:bold; } .newsletter-archive fieldset { border:none; margin:0 0 10px 0; } .newsletter-archive fieldset legend { width:210px; display:block; } .newsletter-archive fieldset .input-button { float:none; margin:10px 0 0 10px; text-align:left; } .newsletter-archive ul, .archive ul { background:url(../img/newsletter-archive-ul-bg.gif) repeat top left; margin:0; padding: 0px; border-bottom: 16px solid white; } .newsletter-archive ul li, .archive ul li { background:none; padding:0; margin:0; line-height:20px; } .newsletter-archive ul li a, .archive ul li a { background:url(../img/news-link-bg.gif) no-repeat top left; margin:0 10px; padding:0 10px; font-weight:normal; font-size:1em; } .newsletter-archive ul li a:hover, .archive ul li a:hover { } .newsletter-archive a { font-weight:bold; font-size:1.2em; margin:0 0 0 10px; } .news-article-full { width:675px; background:url(../img/news-article-full-bg.gif) no-repeat top left; position:relative; padding:10px; margin:0 0 0 0; } .news-article-full span.bottom-bg { clear:both; width:695px; height:2px; background:url(../img/news-article-full-bottom-bg.gif) no-repeat top left; display:block; position:absolute; bottom:-2px; left:0; font-size:1px; line-height:1px; } .news-article-full h2 { margin:0; padding:0; } .news-article-full em { font-weight:bold; font-style:normal; font-size:1.1em; display:block; padding:0 0 10px 0; } .news-article-full img { margin:0 10px 10px 0; border:1px solid #e9e9e9; } .moreInfoToggle { padding-bottom:10px; display:inline-block; } .closeInfoToggle { position:absolute; top:5px; right:10px; display: none; } .moreInfoWrap { display:none; } .hide-on-expand { } .moreInfoOpened .moreInfoWrap { display:block; } .moreInfoOpened .hide-on-expand { display:none; } .moreInfoOpened .moreInfoToggle { display:none; } .moreInfoOpened .closeInfoToggle { display:block; } .booked { color:#C30A4D; font-weight: bold;} .bookedOverlay { display:none; } .bookedFull .bookedOverlay { display:block; width:208px; height:138px; font-size:1px; line-height:1px; background:url(../img/overlay_booked.png) no-repeat 0 0; position:absolute; top:30px; left:1px; } .btn { cursor: pointer; float: right; display: none; background: transparent url('../img/button-versturen.gif') center center no-repeat; width: 59px; height: 12px; border: 0 none; text-indent: -20px; font-size: 1px; color: #fff; } .brochureList { padding:0 20px 0 0; } .brochureList li { position:relative; background:#63b2ca url(../img/brochure_list_bg.png) no-repeat 0 0 !important; padding:0 10px !important; margin:0 0 5px 0; } .brochureList a { display:block; width:180px; height:auto; background:url("../img/template/arrow-white.gif") no-repeat scroll 0 10px transparent; color:#FFFFFF; text-decoration:none; vertical-align:top; line-height:1.2em; font-weight:bold; padding:5px 0 5px 10px; } .bottomCorners { display:block; width:200px; height:2px; font-size:1px; line-height:1px; position:absolute; bottom:0; left:0; }