@charset "utf-8"; /* ####### RESET CSS ####### */ /* v1.0 | 20080212 */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent} body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } /*html{overflow:scroll}*/ /* ####### RESET CSS ####### */ /* ####### DEFAULT CSS ####### */ html, body{height:100%} body{background:#fff url(/bg_clouds.png) top center repeat-x; font-size:12px; font-family:"Trebuchet Ms", Arial, Helvetica, sans-serif; color:#333} .italic{font-style:italic} .hover{cursor:pointer} a{text-decoration:underline; color:#666} a:hover{text-decoration:none; color:#333} abbr{cursor:help; border-bottom:dotted 1px #888} #content ul{list-style-type:square; padding-left:45px; line-height:18px; margin:10px 0} strong{color:#000} a.external{padding-right:12px; background:transparent url(/icon_external_link_8x8.gif) right center no-repeat} #product_slideshow a.external{padding:0; background:0} img.left{float:left; margin:0 10px 10px 0} img.right{float:right; margin:0 0 10px 10px} .mtop_25{margin-top:25px} #footer_wrapper {background:#dfdfdf url(/footer_bg.jpg) left top repeat-x; min-height:310px} #header{width:930px; margin:0 auto; padding-top:30px; position:relative; height:192px; background:transparent url(/paintings.jpg) 270px 58px no-repeat} #high_contrast{padding-left:18px; background:transparent url(/icon_contrast_13x13.gif) left center no-repeat; font-weight:bold; color:#000; text-decoration:none; line-height:15px; position:absolute; right:260px} #high_contrast:hover{text-decoration:underline} #top_links{float:left; position:absolute; right:100px} #top_links li{float:left; margin:0 6px} #lang_sel{float:left; position:absolute; right:0} #lang_sel li{float:left; margin:0 2px} #lang_sel a{width:19px; height:16px; color:#ccc; border:solid 1px #fff; display:block; text-align:center; font-size:11px; text-decoration:none; font-weight:bold; line-height:16px} #lang_sel a:hover{border-color:#ccc} #lang_sel a.sel, #lang_sel a.sel:hover{color:#000; border-color:#000} #d2d{width:180px; height:52px; position:absolute; left:21px; top:105px; display:block} #bird{position:absolute; width:90px; height:23px; left:-45px; top:60px; width:299px; height:85px; left:-75px; top:20px} #content_wrapper{width:930px; margin:0 auto; width:940px} #left_col{float:left; width:615px; padding:10px; margin-bottom:20px; background:transparent url(/leftcol_wbg.png) left top repeat} #right_col{float:left; width:305px} #content{padding:10px 10px 25px 10px; /*background:#fff;*/ border:solid 3px #eee; border-bottom-color:#ddd; border-left-color:#ddd; border-width:1px 1px 3px 1px} p{margin:10px 0; line-height:18px} h1{font-size:14pt; margin:5px 0 15px 0; color:#888} h2, #blog h1{background-color:#f6f6f6; padding:5px; color:#333; font-size:11pt; margin-bottom:0} h2.green{color:#79a738; padding-left:0; background:none; border-bottom:solid 1px #79a738} h2.orange{color:#d96624; padding-left:0; background:none; border-bottom:solid 1px #d96624} h2.blue{color:#1F4CA3} h2.red, h2.red a, #blog h1.red{color:#c2332b; padding-left:0; background:none; border-bottom:solid 1px #1F4CA3} h2.toggler{background:transparent url(/icon_toggler_orange.gif) right center no-repeat} h2.sel{background:none} #offer{width:615px; position:relative; height:224px; z-index:10} #offer div{background-position:left top; background-repeat:repeat-x; height:200px; width:97px; margin-right:1px; padding:12px; position:absolute; top:0} #offer a{text-decoration:none} #offer .web a:hover, #offer .creative a:hover, #offer .it a:hover, #offer .services a:hover{text-decoration:underline; color:#fff} #offer h2{font-size:15pt; color:#fff; background:none; padding:0; color:#fff} #offer ul{margin-top:15px} #offer li{line-height:18px} #offer .web{background-color:#c2332b; background-image:url(/offer_web_bg.jpg); left:0} #offer .creative{background-color:#1f4ca3; background-image:url(/offer_creative_bg.jpg); width:161px; left:122px} #offer .it{background-color:#d96624; background-image:url(/offer_it_bg.jpg); left:308px} #offer .services{background-color:#79a738; background-image:url(/offer_services_bg.jpg); width:161px; margin-right:0; left:430px} div#offer.hide{height:40px; /*overflow:hidden;*/ margin-bottom:10px} div#offer.hide div{height:20px; overflow:hidden} #offer .web a{color:#fdbebb} #offer .creative a{color:#abc5ea} #offer .it a{color:#f0d0ac} #offer .services a{color:#d4e9b7} #offer .web h2 a, #offer .creative h2 a, #offer .it h2 a, #offer .services h2 a{color:#fff} #nav{width:283px; border:solid 1px #ccc; background-color:#fff; margin-top:-20px; position:relative; z-index:1; height:112px; padding:9px} #nav .left_shadow{position:absolute; left:-10px; top:0} #nav .right_shadow{position:absolute; right:-10px; top:0} #nav a{color:#000; text-decoration:none} #nav .menu{width:130px} #nav .menu{list-style-image:url(/menu_arrow.gif); padding-left:20px} #nav .menu li{border-bottom:solid 1px #eee; line-height:18px} #nav .menu a{display:block; height:18px} #nav .menu a:hover{color:#37AAFF} #nav li.last{border:none} #nav li.sel a{color:#37AAFF} #customer_menu{float:right; background-color:#f6f6f6; padding:8px; width:110px} #customer_menu strong{color:#D83A2F} #customer_menu ul{margin:8px 10px 0 10px} #customer_menu li{line-height:15px} #customer_menu a:hover{text-decoration:underline} #customer_menu .progress{color:#bbb; font-style:italic} #showcase_slideshow{width:301px; border:solid 1px #ccc; background-color:#fff; height:175px; margin-top:10px; position:relative; overflow:hidden} #showcase_slideshow div{position:absolute; left:0; top:0; width:301px; height:175px; background-color:#fff} #showcase_slideshow img{display:block} #showcase_slideshow span{display:block; background-color:#ededed; text-align:center; color:#727272; font-weight:bold; line-height:29px; position:absolute; bottom:5px; right:0; width:290px} #showcase_slideshow a{color:#727272} #showcase_slideshow a:hover{text-decoration:none} #product_slideshow{width:301px; border:solid 1px #ccc; background-color:#fff; height:190px; margin-top:10px; position:relative} #product_slideshow .product{position:absolute; left:0; top:0; width:301px; height:190px; background-color:#fff} #product_slideshow .img{float:left; width:140px; height:100px; text-align:center} #product_slideshow .short_info{line-height:18px; margin-left:10px} #product_slideshow h3{margin:10px 10px 20px 10px; font-size:12pt} #product_slideshow .link{position:absolute; left:10px; bottom:5px; width:271px; border-top:solid 1px #ccc; line-height:25px; padding:0 5px} #product_slideshow .link ul{margin-left:35px} #product_slideshow .link li{width:95px; float:left; background-color:#fff} #product_slideshow .order_lnk{background:#fff url(/product_order_lnk.gif) left center no-repeat; padding-left:20px} #product_slideshow .more_lnk{background:#fff url(/product_more_lnk.gif) left center no-repeat; padding-left:20px} #showcase_recent{width:281px; border:solid 1px #ccc; background-color:#fff; margin-top:10px; position:relative; overflow:hidden; padding:10px} #showcase_recent h3{margin:10px 0} #conditions{margin-left:10px} #conditions ol{list-style-type:decimal-leading-zero; margin-left:25px; margin-bottom:25px; line-height:20px} #conditions ol ol{margin-top:25px} #conditions ol li{margin-bottom:10px} #conditions li{color:#c2332b; font-weight:bold} #conditions li li{color:#333; font-weight:normal} #footer{margin:0 auto; width:930px; position:relative; padding-bottom:25px} #wos{width:184px; background:transparent url(/wos_board.jpg) top center no-repeat; height:194px; position:relative; margin-left:15px} #wos .logos{position:absolute; top:35px; left:9px; width:120px; height:60px} #wos .logos a{display:block; width:120px; height:60px; text-align:center; position:absolute; left:0; top:0} #wos .foot{position:absolute; bottom:0; left:88px} #wos h2{font-size:14pt; text-align:center; padding-top:2px; color:#333; background:none} #wos h2 a{color:#000} #wos .bar_open{position:absolute; right:7px; top:35px; font-size:14pt; width:42px; height:60px} #wos .bar_open span{display:block; width:42px; text-align:center; font-weight:bold; height:30px; line-height:30px} #contact_us{background:transparent url(/contact_us_bg.gif) left top no-repeat; width:213px; height:78px; position:absolute; left:274px; top:18px; padding:20px 40px; text-align:center} #contact_us span{font-weight:bold; display:block; margin-top:10px; color:#666; font-size:14pt; line-height:17pt} #skype_us{position:absolute; right:0; top:33px; width:303px} #skype_us img{display:block} #skype_us .balloon_david{position:absolute; left:0; top:0} #skype_us .balloon_dimi{position:absolute; right:0; top:10px} #skype_us .cows{display:block; margin-top:57px; margin-left:20px} #cow_part2{margin-left:-2px} #footer_wrapper{margin-top:15px} #footer .info{margin-top:25px; position:relative; color:#666} #footer .info span{position:absolute; right:0; top:-7px} #footer .info span img{vertical-align:middle; margin-right:5px} #footer .bottom_links{text-align:right; margin-top:40px} #footer a{color:#666} #footer .bottom_links a{line-height:15px; margin:0 3px} #footer .bottom_links a.external{background:none; padding:0} #footer .bottom_links img{vertical-align:middle} #loc{margin-bottom:10px; padding-left:5px; padding-bottom:5px; padding-top:10px; clear:left} /* ------ INDEX ------ */ #latest_news{width:273px; background-color:#f6f6f6; height:160px; float:left; margin-top:10px; padding:15px; position:relative} #latest_news .date{display:block; font-weight:bold; color:#888; font-size:9pt} #latest_news h2{margin:10px 0; font-size:11pt; padding:0} #latest_news p{line-height:18px; margin:10px 0} #latest_news a.more{position:absolute; bottom:15px; right:15px} #latest_promo{width:272px; margin-left:10px; background-color:#aaa; height:160px; float:left; margin-top:10px; position:relative; padding:15px; z-index:11} #latest_promo h2{background:none; text-align:right; font-size:14pt} #latest_promo img{position:absolute; left:-35px; top:-35px} #latest_promo p, #rc_promo p{margin:10px; font-size:12pt; font-weight:bold; color:#fff; line-height:17pt} #rc_promo p{color:#555} #latest_promo .spacer1{float:left; display:block; width:75px; height:18px} #latest_promo .spacer2{float:left; display:block; clear:left; width:45px; height:18px} #latest_promo a.more{position:absolute; bottom:15px; right:15px; color:#000} #latest_promo a.more:hover{text-decoration:none} #rc_promo{width:281px; border:solid 1px #ccc; background-color:#fff; margin-top:10px; position:relative; padding:10px; z-index:11} #rc_promo img{position:absolute; right:-35px; top:-25px; z-index:12} #rc_promo .spacer1{float:right; display:block; width:75px; height:18px} #rc_promo .spacer2{float:right; display:block; clear:right; width:65px; height:18px} #rc_promo .spacer3{float:right; display:block; clear:right; width:35px; height:18px} #rc_promo a.more{display:block; margin-top:10px; text-align:right} #gototop {bottom:15px; display:none; font-weight:bold; position:fixed; right:15px} #gototop a{display:block; padding:7px 7px 7px 25px; color:#fff; text-decoration:none; width:110px; background:#de771b url(/icon_top_link_5x8.gif) 10px center no-repeat} #gototop a:hover{text-decoration:none; background-color:#f50f0f} /* ------ COMPANY ------ */ #company{margin-left:10px} #content #team ul{list-style-type:none; margin-left:10px; padding-left:0} #team h3{color:#d96624; padding-top:10px} #team li{background:transparent url(/team_cow.gif) left top no-repeat; padding-left:60px; margin:10px 0 30px 0; border-bottom:solid 1px #eee} #team li.last{border:none} #team .contact{padding-left:29px; background:transparent url(/icon_contact_team_21x13.gif) left center no-repeat} #team .vcard{padding:0 34px; background:transparent url(/icon_vcard_27x16.gif) left center no-repeat; margin-left:15px} /* ------ BLOG ------ */ .msg{background:#e9e9e9 url(/message_bg.jpg) left top repeat-x; padding:10px; margin-bottom:15px; border:solid 1px #bbb} .msg h1, .msg h2{background:none; padding:5px; color:#333; font-size:11pt; margin:0} .msg p{padding:0; margin:0 0 10px 5px} h2 a{text-decoration:none} #blog{margin-left:10px} #blog .post{margin-bottom:35px} #blog h2 a, #blog h2, #blog_archive h2, #blog .post h1{border-bottom:none} #blog .meta{overflow:hidden; margin:5px 0; border-bottom:solid 1px #c2332b; padding-bottom:5px; padding-left:0; list-style-type:none} #blog .meta li{float:left; font-size:11px; margin-right:5px; color:#1f4ca3; line-height:16px} #blog .tags{margin-left:10px; padding-left:28px; background:transparent url(/icon_tag_25x11.gif) left center no-repeat; padding-top:10px; padding-bottom:10px} #blog .intro{font-style:italic; font-weight:bold} #blog_archive{margin-top:10px; background-color:#eee; padding:10px; border:solid 1px #ccc} #blog_archive ul{margin:5px} #blog_archive ul ul{margin-left:25px} #blog_archive li{line-height:20px; border-bottom:solid 1px #ccc} #blog_archive li.last{border:none} #blog_archive li li{border:none; line-height:18px; background:none} #blog_archive li.closed ul{display:none} #blog_archive a.toggle{background:transparent url(/arrow_red_open.gif) left center no-repeat; padding-left:15px; line-height:24px} #blog_archive li.closed a.toggle{background:transparent url(/arrow_red.gif) left center no-repeat} #blog_archive ul ul a{background:transparent url(/archive_month_arrow.gif) left center no-repeat; padding-left:15px} #blog .red{color:#c2332b} #blog .orange{color:#d96624} #blog .blue{color:#1F4CA3} #blog .green{color:#79a738} #blog_cloud{background:#FFE1DF; border:1px solid #D4372E; margin-top:10px; padding:10px; text-align:center} #blog_cloud p{margin:10px 0 0 0; text-align:right} #latest_newsletter{padding:10px; border:1px solid #ccc; margin-top:10px; width:281px; background-color:#fff} #latest_newsletter h2.red{border:none; margin-bottom:10px} #latest_newsletter img{display:block} #latest_newsletter a.external{padding:0; background:none} #blog li.created{padding-left:20px; background:transparent url(/icon_calendar_15x11.gif) left center no-repeat} #blog span.more{background:#FFE1DF; padding:2px 4px} #blog .cloud{overflow:hidden} #blog .cloud li{float:left; font-size:11px; margin-right:5px; line-height:14px} /* ------ SHOWCASE ------ */ #showcase_recent ul, #showcase ul{list-style:none; margin:0; overflow:hidden; padding:15px 25px} #showcase_recent ul{padding:0} #showcase li{float:left; width:250px; margin-right:39px} #showcase_recent .offer li{float:left} #showcase h3{margin-bottom:5px} #showcase_recent li{padding-bottom:5px; border-top:solid 1px #79a738;} #showcase .full_list{margin:15px 0 0 0} #showcase .full_list li{padding-bottom:5px; border-top:solid 1px #79a738; margin-bottom:15px; padding-top:15px} #showcase .full_list li.firstrow, #showcase_recent li.firstrow{border:none; padding:0} #showcase .full_list li{width:160px; margin-right:29px} #showcase .full_list .left_col{clear:left} #showcase .full_list .right_col{margin-right:0} #showcase .full_list .more{text-align:right; position:absolute; right:0; bottom:-2px} .full_list .content{position:relative} #showcase .visual{background-color:#f6f6f6; padding:5px} #showcase .visual img{display:block} #showcase_recent .more, #showcase .more{display:block} #showcase .offer, #showcase_recent .offer{padding:0; margin:5px 0; line-height:15px} #showcase .offer li, #showcase_recent .offer li{background:transparent url(/offer_sprite.gif) no-repeat; width:15px; height:15px; margin:0; margin-right:5px; border:none; padding:0; min-height:15px} #showcase .offer .no_web, #showcase_recent .offer .no_web{background-position:0 -15px} #showcase .offer .no_creative, #showcase_recent .offer .no_creative{background-position:-15px -15px; width:14px} #showcase .offer .no_it, #showcase_recent .offer .no_it{background-position:-29px -15px; width:13px} #showcase .offer .no_services, #showcase_recent .offer .no_services{background-position:-42px -15px} #showcase .offer .web, #showcase_recent .offer .web{background-position:0 0} #showcase .offer .creative, #showcase_recent .offer .creative{background-position:-15px 0; width:14px} #showcase .offer .it, #showcase_recent .offer .it{background-position:-29px 0; width:13px} #showcase .offer .services, #showcase_recent .offer .services{background-position:-42px 0} /* ------ PARTNERS ------ */ #partners{margin:25px 15px 15px 15px} #partners dt{font-weight:bold; font-size:13px} #partners dd{overflow:hidden; border-bottom:solid 1px #ccc; padding:10px 0; margin-bottom:15px} #partners .last{border-bottom:none; margin-bottom:0} #partners .img{float:left; margin-right:15px; padding:2px; margin-top:10px; background-color:#ffffff; border:solid 1px #eee; display:block; width:100px; height:75px; text-align:center} #partners .desc p{margin-left:0} #partners a.external{background:none; padding:0} /* ------ FAQ ------ */ #faq{margin-left:10px} #faq .toggle_container{margin-top:15px} #faq .toggle_container p{margin:10px; margin-top:0; margin-bottom:20px} #faq h2.sel{color:#D96624} #content .fcats{margin:20px 10px; padding:0; list-style-type:none} #content .fcats li{margin:0 0 10px 0} #content .fcats a{display:block; padding:5px; border:solid 1px #efa87f; background-color:#ffddc9} #content .fcats a:hover{background-color:#D96624; color:#fff; font-weight:bold} #right_col .fcats{margin-top:10px; background-color:#eee; padding:10px; border:solid 1px #ccc} #right_col .fcats ul{margin:10px 5px} #right_col .fcats a{display:block; padding:5px; padding-left:15px; background:transparent url(/arrow_orange_blank.gif) left center no-repeat} #right_col .fcats .sel a{background:transparent url(/arrow_orange.gif) left center no-repeat} #right_col .fcats .green{border:none} /* ------ PRODUCT ------ */ #product{margin:10px 0 0 10px} #product dt{font-weight:bold; margin-bottom:5px} #product dd{overflow:hidden; padding-bottom:35px; margin-bottom:25px; border-bottom:solid 1px #ccc; position:relative} #product dd img{float:left; margin-right:15px} #product dd.last{border:none} #product .link{position:absolute; right:10px; bottom:0px; line-height:25px; padding:0 5px} #product .link ul{margin-left:35px; list-style-type:none; overflow:hidden} #product .link li{width:95px; float:left; background-color:#fff} #product .order_lnk{background:#fff url(/product_order_lnk.gif) left center no-repeat; padding-left:20px} #product .more_lnk{background:#fff url(/product_more_lnk.gif) left center no-repeat; padding-left:20px} #product .desc{margin-left:150px} #product .img{float:left; padding-right:35px} /* --- WOS --- */ #wos_txt{margin-left:10px} /* --- LINKS --- */ .links li{line-height:24px} /* --- SITEMAP --- */ #sitemap_wrapper{overflow:hidden} #sitemap_wrapper ul{margin:15px 0 15px 15px; padding-left:25px} #sitemap{width:320px; float:left} #sitemap_offers{width:225px; float:left} /* ------- CONTACT ------ */ #rc_cinfo, #map_canvas{width:281px; border:solid 1px #ccc; background-color:#fff; margin-top:10px; position:relative; padding:10px} #rc_cinfo ul{line-height:18px; margin-top:10px} #map{height:275px; width:281px} li.newline{margin-top:10px} .form_wrapper{overflow:hidden; margin-left:10px} .error, .success{border:solid 1px #d4372d; border-width:1px 1px 1px 4px; background-color:#fad5d3; padding:10px} .success{border-color:#41762e; background-color:#def5d5} .success ul, .error ul{margin:10px 10px 10px 35px} /* ZOEKEN */ #inline_search{margin:15px 0px; padding:5px; background-color:#eee} #inline_keywords{width:300px} #inline_search form{margin-left:45px} #inline_search label{margin:5px 15px 5px 5px; vertical-align:middle} #inline_search input{background-color:#f6f6f6; border:solid 1px #7b9bd8; color:#333; font-size:11px; padding:2px; font-style:italic; vertical-align:middle} #inline_search .submit{background:none; border:none; color:#FFF; padding:1px 2px; width:auto; margin-left:10px} #search_results h3{border-bottom:solid 1px #1F4CA3; padding:4px 2px} #search_results li{line-height:18px} #search_results ul{padding:5px 25px 5px 40px; background:#e9f1ff; margin-top:5px} /* NEWSLETTER */ #nl_overlay{width:100%; height:100%; background:transparent url(/bg_nl_overlay.png) left top repeat; position:absolute; left:0; top:0; z-index:40; visibility:hidden; opacity:0} #nl_wrapper{width:760px; position:absolute; z-index:41; left:50%; margin-left:-380px; background-color:#fff; border:solid 5px #DB9124} #nl_close{background:transparent url(/nl_close_btn.png) left top no-repeat; width:30px; height:30px; cursor:pointer; position:absolute; left:-16px; top:-16px} /* PROMO */ #promo{position:relative} #promo .img{padding:5px; background:#f6f6f6; margin-bottom:15px} #promo .img img{display:block} #promo .cta{position:absolute; right:10px; top:-25px} /* clearfix */ * html .clearfix {height: 1%} .clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden} /*.clearfix {display:inline-block}*/ /* Hide from IE Mac \*/ .clearfix {display:block} /* End hide from IE Mac */