/* ------------------------------------------- project: Naam date: Datum ------------------------------------------- */ /* Reset (a mix of Eric Meyer's & Yahoo's reset) -------------------------------------------------------------- */ 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, 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-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } table { border-collapse:collapse;border-spacing:0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /* GENERAL ------------------------------------------- */ body { font-family: Tahoma, Arial, sans-serif; font-size: 13px; color: #fff; background: #000; line-height: 180%; } body.front { background: #222 url(../images/body-home-back.jpg) left top repeat-x; } a { color: #999; font-weight: bold; border-bottom: 1px solid #999; text-decoration: none; } a:hover { border-bottom: 0 none; } strong, b { font-weight: bold; } em,i { font-style: italic; } blockquote { margin: 10px 35px; font-style: italic; } p { margin: 0 0 20px 0; } abbr, acronym { border-bottom:1px dashed #ccc;} address { margin:0 0 1.5em;font-style:italic;} del { color:#666;} pre, code, tt { font:1em 'andale mono', 'lucida console', monospace;line-height:1.5; display:block;} code { background-color:#d5d2d8; display:block; padding:0px 2px 4px 26px; background:#fff url(code.jpg) no-repeat left top; line-height:1.67em;} pre { margin:1.5em 0;white-space:pre;} img { -ms-interpolation-mode: bicubic; } /* HEADINGS ------------------------------------------- */ h1 { font-family: ScalaSans, Tahoma, Arial, sans-serif; font-weight: normal; font-size: 30px; color: #333; line-height: 110%; margin: 0 0 30px 0; border-bottom: 1px solid #DFDFDF; padding: 0 0 15px 0; position: relative; z-index:2; } #veneers h1, #whitening h1, #whitening_wat h1, #whitening_formulation h1, #whitening_boost h1, #contact h1, #media h1, #advies-jonger h1, #advies-steps h1, #advies-tips h1, #advies h1 { margin:0; border:0 none; } h1 a { border-bottom: none; color: #333; } h2 { color:#A6C96B; font-size:28px; font-weight:normal; line-height: 110%; margin: 0 0 20px 0; } #footer h2 { color:#000000; font-size:14px; font-weight:bold; } h3 { font-size: 16px; font-weight: bold; margin: 0 0 10px 0; } h4 { color:#A6C96B; font-size: 15px; font-weight: bold; margin: 0 0 10px 0; } h5 { font-size: 18px; color: #666666; margin: 0 0 10px 0; } /* TABS --------------------------------------*/ #tabs ul{} #tabs h1{ font-family: ScalaSans, Tahoma, Arial, sans-serif; font-weight: normal; font-size: 30px; color: #333; line-height: 110%; margin: 0 0 0px 0; border-bottom: 0px solid #DFDFDF; padding: 0 0 15px 0; position: relative; z-index:2; } .hline{ margin: 0 0 30px 0; border-bottom: 1px solid #DFDFDF; position: relative; z-index:2; } /* HELPERS ------------------------------------------- */ .bold {font-weight: bold;} .normal {font-weight: normal;} .smaller {font-size: 11px;} .bigger {font-size: 14px;} .greentxt {color:#A6C96B; } .font-replace { font-family: ScalaSans, Tahoma, Arial, sans-serif; } .invisible { display: none; } .left { float:left; display: inline; } .right { float:right; display: inline; } .hide { display:none; } .align_right { text-align:right;} .align_left { text-align:left;} .align_center { text-align:center;} .align_justify { text-align:justify;} img.left { float: left; display: inline; margin: 0 10px 10px 0; } img.right { float: right; display: inline; margin: 0 0 10px 10px; } hr { border: 0 none; border-bottom: 1px solid #e2e2e2; background: transparent; height: 1px; margin: 20px 0; padding:0; } hr.seperate { border: 0 none; } a.button { display: block; position: relative; background: url(../images/button.jpg) left top no-repeat; width: 264px; height: 54px; line-height: 54px; text-align: center; font-family: ScalaSans, Tahoma, Arial, sans-serif; font-size: 18px; text-transform: uppercase; color: #ccc; border-bottom: 0 none; } #contact.fr a.button { width:360px; background-image:url(../images/button2.jpg);} a.button:hover { border-bottom: 0 none; } a.button:active { top: 1px; border-bottom: 0 none; } a.image { border: none; } .padding { padding-bottom: 20px; } .border { padding-bottom: 20px; border-bottom: 1px solid #ddd; } /* LAYOUT ------------------------------------------- */ .wrap { color: #999999; margin: 0 auto; position: relative; width: 960px; } #header { background: url(../images/header-back3.jpg) center top repeat-x; } .front #header { background: none; } #header .wrap { background: url(../images/header-back.jpg) left top no-repeat; height: 203px; } .front #header .wrap { background: url(../images/header-home-back.jpg) left 70px no-repeat; height: 385px; border-top: 6px solid #A3C568; } #header #logo { position: absolute; left:10px; top: 0; } .front #header #logo { position: absolute; left:30px; top: 30px; z-index: 5; } #header #logo a, #header #logo a img { float: left; display: inline; border-bottom: 0; } #header #logo a span { display: none; } .front .visual { clear: both; margin: 0 35px 0 0; text-align: right; } .front .visual img.left { position: absolute; left: 0; z-index: 0; } .front .visual .visual_text { padding-top: 110px; float: right; width: 360px; } .front .visual .visual_text h2 { font-size: 31px; margin:0 0 10px 0; line-height: 120%; position: relative; z-index: 1; color: white; } .front .visual .visual_text h2 strong { color: #fff; } .front .visual .visual_text h3.subtitle { color: #A3C568; font-weight: normal; font-size: 26px; top: 150px; } .front .visual .visual_text a.button { background: url(../images/home-intro-button.png) no-repeat; color: white; text-transform: none; width: 230px; height: 45px; font-weight: normal; line-height:40px; float: right; margin: 15px 0 0; font-family:Tahoma,Arial,sans-serif; } .front .visual .visual_text a.button:hover { color: #A3C568; } ul.language { clear: both; float: right; display: inline; height: 35px; margin: 0 20px 39px 0; background: url(../images/flag-global.jpg) left 12px no-repeat; padding-left: 30px; } .front ul.language { position: absolute; z-index: 9; left: 40px; top: 230px; float: left; display: inline; height: 35px; margin: 0 20px 39px 0; } ul.language span{ float: left; display: inline; font-size: 11px; line-height: 120%; margin: 15px 7px 0 0; padding: 0 7px 0 0; border-right: 1px solid #999; } ul.language li { float: left; display: inline; font-size: 11px; line-height: 120%; margin: 15px 0 0 0; text-transform: uppercase; } ul.language li a, ul.language li a:visited { float: left; display: inline; font-weight: normal; color: #999; } ul.language li a:hover, ul.language li a:active, ul.language li.selected a { border-bottom: 0 none; } ul.mainnav { clear: both; float: right; display: inline; height: 33px; line-height: 33px; margin: 0 20px 0 0; position: relative; z-index: 2; } .front ul.mainnav { margin: 15px 20px 0 0; } ul.mainnav li { float: left; display: inline; font-size: 17px; margin: 0 0 0 28px; } ul.mainnav li a, ul.mainnav li a:visited { float: left; display: inline; color: #fff; border-bottom: 0 none; font-weight: normal; } ul.mainnav li a:hover, ul.mainnav li a:active, ul.mainnav li.selected a { color: #A6C96B; } #breadcrumbs { clear: both; padding: 5px 0 0 190px; font-size: 11px; line-height: 120%; } #breadcrumbs a { font-weight: normal; } #main { background: #f8f8f8 url(../images/footer-top.png) left bottom repeat-x; padding: 0 0 50px 0; } .front #main { background: transparent none; } /* grid */ .row { display: block; clear: both; margin: 0 0 40px 0; position: relative; } .col { float: left; display: inline; margin-bottom: 40px; position: relative; } .col_2 { width: 455px; margin: 0 0 40px 50px; } /* 1:2 */ .block .col_2 { margin:0; width: 425px; margin: 0 0 20px 50px; } .block_grey .col_2 { margin:0; width: 405px; margin: 0 0 20px 50px; } .col_3 { width: 310px; margin: 0; border-left: 1px solid #DFDFDF; }/* 1:3 */ .col_3 .col_inner { padding: 0 25px; }/* 1:3 */ .col_4 { width: 240px; margin: 0; }/* 1:4 */ .first_col, .block .first_col { margin-left:0; border-left: 0 none; } .block { padding: 0 0 17px 0; margin: 0 0 40px 0; position: relative; } .block_inner { padding: 30px 30px 13px 30px; position: relative; } .block_white { background: url(../images/block-white.png) right bottom no-repeat; } .block_white .block_inner { background: url(../images/block-white.png) left top no-repeat; } .block_green { background: url(../images/block-green.png) right bottom no-repeat;} .block_green .block_inner { background: url(../images/block-green.png) left top no-repeat; } .block_grey { background: url(../images/block-grey.png) right bottom no-repeat; } .block_grey .block_inner { background: url(../images/block-grey.png) left top no-repeat; padding: 45px 50px 33px 50px; } .block_black { background: url(../images/block-black.png) right bottom no-repeat; color: #ccc; } .block_black .block_inner { background: url(../images/block-black.png) left top no-repeat; padding: 45px 50px 33px 50px; margin:0; } .col_2 .block { padding: 0 0 12px 0; } .col_2 .block_inner {} .col_2 .block_white { background: url(../images/block-white2.png) right bottom no-repeat; } .col_2 .block_white .block_inner { background: url(../images/block-white2.png) left top no-repeat; } .col_2 .block_green { background: url(../images/block-green2.png) right bottom no-repeat; } .col_2 .block_green .block_inner { background: url(../images/block-green2.png) left top no-repeat; } .col_2 .block_grey { background: url(../images/block-grey2.png) right bottom no-repeat; } .col_2 .block_grey .block_inner { padding: 20px 25px 13px 25px; } /* footer */ #footer { background: #A6C96B url(../images/footer-bottom.png) left bottom repeat-x; padding: 20px 0 0 0; } #footer .col { float: left; display: inline; border-left: 1px solid #C1D998; font-size: 11px; margin: 0 0 20px 0; height: 125px; } #footer h2 { padding: 0 25px; margin: 0; color: #fff; font-size: 22px; font-weight: normal; } #footer ul, #footer .links { padding: 0 20px; margin: 15px 0; line-height: 140%;position: relative; } #footer ul li, #footer .links a { background: url(../images/bullet-footer.png) 0 5px no-repeat; padding: 0 0 5px 15px; font-weight: bold; font-size: 13px; color: #000;position: relative; border: none; } #footer .col ul li a, #footer .col .links a { color: #030; font-weight: normal;position: relative; } #footer .col .links a { display: block; } #footer .col ul li a:hover, #footer .col .links a:hover { color: #fff; font-weight: normal; border-bottom: 0 none; } #footer .col a { font-weight: normal; color: #fff; border-bottom: 0 none } #footer .col a:hover { font-weight: normal; color: #fff;border-bottom: 1px solid #fff; } #footer .col_test { width: 230px; border-left: 0 none; } #footer .col_test h2 { padding: 0 0 5px 0; } #footer .col_test ul { padding: 0; margin: 5px 0; } #footer .col_test ul li { padding: 0; background: none; } #footer .col_test ul li a, #footer .col_test ul li a img { display: block; position: relative; } #footer .col_test ul li a:hover { border-bottom: 0 none; } #footer .col_test ul li a:active { top: 1px; border-bottom: 0 none; } #footer .col_advies { border: 0 none; width: 167px; } #footer .col_producten { width: 190px; } #footer .col_producten h2 { padding: 0 0 0 20px; } #footer .col_producten ul { padding: 0 20px; } #footer .col_jobs { width: 145px; } #footer .col_jobs h2 { padding: 0 0 0 20px; } #footer .col_jobs ul { padding: 0 20px; } #footer .col_franchise { position: relative; width: 350px; } #footer .col_franchise h2 { padding: 0 0 0 20px; } #footer .col_franchise ul { padding: 0 20px; } #river8_link { position: absolute; top: 0; right: 0; } #river8_link:hover { border: none !important; } #footer .col_about {border: 0; width: 265px; } #footer .col_about h2 { padding: 0 0 18px 30px; } #footer .col_about p { font-family: 'Century Gothic', 'Apple Gothic', sans-serif; float: left; display: inline; padding: 0 0 0 30px; font-size:14px; color: #000; } #footer .col_about a { float: left; display: inline; margin-top:-25px; } #footer .col_about a:hover { border-bottom: none; } #footer .col_afspraak { width: 250px;} #footer .col_afspraak ul { padding: 0 0 0 25px; margin: 15px 0; } #footer .col_afspraak ul li { padding: 0; background: none; } #footer .col_afspraak ul li a { display: block; position: relative; background: url(../images/button-afspraak.jpg) left top no-repeat; width: 264px; height: 54px; line-height: 54px; text-align: center; } #footer .col_afspraak ul li a span { font-family: ScalaSans, Tahoma, Arial, sans-serif; font-size: 18px; text-transform: uppercase; color: #ccc; } #footer .col_afspraak ul li a:hover { border-bottom: 0 none; } #footer .col_afspraak ul li a:active { top: 1px; border-bottom: 0 none; } #footer #siteinfo { clear: both; text-align: center; font-size: 11px; height: 28px; line-height: 28px; } #footer #siteinfo p { margin: 0; } #footer #siteinfo a { font-weight: normal; } /* ELEMENTS ------------------------------------------- */ /* lists */ #main ul { margin: 0 0 20px 0; position: relative; } #main ul li { padding: 0 0 5px 12px; background: url(../images/bullet-grey.png) 0 7px no-repeat; line-height: 140%; position: relative; } #main ul.more, #data ul.more, #main div.more { margin: 20px 0; position: relative; } #main ul.more li, #main div.more a, #data ul.more li { padding: 0 0 0 15px; margin: 0 0 5px 0; background: url(../images/bullet-more.png) 0 7px no-repeat; line-height: 140%; position: relative; } #main div.more a { border: none; text-decoration: underline; display: block; } #main div.more a:hover { text-decoration: none; } #main ul.subnav { position: relative; z-index: 3; float: right; display: inline; margin: -71px 0 0 0; } #veneers #main ul.subnav, #whitening #main ul.subnav, #whitening_wat #main ul.subnav, #whitening_formulation #main ul.subnav, #whitening_boost #main ul.subnav, #media #main ul.subnav, #advies-jonger #main ul.subnav, #advies-steps #main ul.subnav, #advies-tips #main ul.subnav {margin: -40px 0 0 0; } #contact #main ul.subnav {margin: -64px 0 0; } #main ul.subnav li { background: none; float: left; display: inline; font-family: 'Century Gothic', 'Apple Gothic', Tahoma, Arial, sans-serif; font-size: 15px; border-left: 1px solid #dfdfdf; margin: 0 0 0 15px; padding: 0 0 0 15px; line-height: 25px; height: 25px; } #main ul.subnav li.first-child { border-left: 0px none; margin: 0; padding: 0; } #main ul.subnav li a { float: left; display: inline; font-weight: normal; border-bottom: 0 none; } #main ul.subnav li a:hover, ul.subnav li a:active, ul.subnav li.selected a { color: #A6C96B; } #main ul.subnav li.action { border-left: 0 none; padding: 0; margin:0 0 0 15px; } #main ul.subnav li.action a { position: relative; background: url(../images/btn-action.png) left -25px no-repeat; padding: 0 0 0 5px; color: #fff; cursor: hand; cursor: pointer; } #main ul.subnav li.action a:hover {} #main ul.subnav li.action a:active { top: 1px; } #main ul.subnav li.action a span { float: left; display: inline; position: relative; background: url(../images/btn-action.png) right top no-repeat; padding: 0 15px 0 10px; } #main ul.subnav li.newsletter { height: 50px; border-left: 0 none; padding: 0; margin:0 0 0 15px; } #main ul.subnav li.newsletter a { position: relative; background: url(../images/btn-newsletter.png) left bottom no-repeat; padding: 18px 0 0 60px; color: #fff; cursor: hand; cursor: pointer; font-size:16px;} #main ul.subnav li.newsletter a:hover {} #main ul.subnav li.newsletter a:active { top: 1px; } #main ul.subnav li.newsletter a span { float: left; display: inline; height: 32px; position: relative; background: url(../images/btn-newsletter.png) right -18px no-repeat; padding: 0 15px 0 0px; line-height: 32px; } #contact-info form .form-field { float: right; display: inline; margin: 0; padding:0; width:310px; } #contact-info form br { clear:both } #contact-info .form-label { display: inline; float: left; padding: 5px 0 0 0; margin: 0; } #contact-info .form-label.compact{ padding: 0; } #contact-info select.day, #contact-info select.month, #contact-info select.year { float: left; display: inline; margin: 0 10px 0 0; } #contact-info select.day { width: 50px; } #contact-info select.month { width: 100px; } #contact-info select.year { width: 100px; } #contact-info span.invalid { display: block; clear: both; color: red; } #home #btn-newsletter { } #home #btn-newsletter a {display: block; border-bottom: 0; background: url(../images/btn-newsletter-home.png) left top no-repeat; height: 66px; position: relative; } #home #btn-newsletter a:active { top:1px; } #home #btn-newsletter h2 {display: block;font-size: 22px; color: #A6C96B; padding: 24px 15px 0 80px; margin:0; } #home #btn-newsletter a:hover h2 { color: #fff; } #home #btn-newsletter a:active h2 { color: #EAF1DE; } #main ul.imagelist { padding: 0; margin: 0; } #main ul.imagelist li { background: transparent none; padding: 0; margin: 0; float: left; display: inline; } #main ul.imagelist li a { float: left; display: inline; border-bottom: 0 none; } #main ul.imagelist li a:hover { opacity:0.7;filter:alpha(opacity=70) } #main ul.imagelist li a img { margin: 0 10px 10px 0; float: left; display: inline; } #main ul.greenlist { float: left; display: inline; width: 197px; position: relative; } #main ul.greenlist li { float: left; display: inline; width: 197px; padding: 0; margin: 0 0 10px 0; background: none; font-weight: bold; color:#A6C96B; } #main ul.social { display: block; margin: 0 0 20px 0; } #main ul.social li { float: left; display: inline; background: none; padding:0; margin: 0 10px 0 0; } #main ul.social li a { float: left; display: inline; width: 32px; height: 32px;text-indent: -9999px; border-bottom: 0 none; } #main ul.social li.facebook a { background: url(../images/icon-facebook.jpg) left top no-repeat; } #main ul.social li.twitter a { background: url(../images/icon-twitter.jpg) left top no-repeat; } #main ul.social li.mappy a { background: url(../images/icon-mappy.jpg) left top no-repeat; width: 69px; } #main .list-links-grey { margin: 0px 0px 20px; position: relative; } #main .list-links-grey a { display: block; padding: 0px 0px 5px 12px; line-height: 140%; background: url(../images/bullet-grey.png) no-repeat 0px 7px; color: #999; font-weight: bold; text-decoration: underline; border: none; } #main .list-links-grey a:hover { text-decoration: none; } /* speciale links */ a.image_lightbox, #fancybox-wrap a { border-bottom: 0 none; } a.image_lightbox:hover { } a.action { position: relative; display: block; height: 25px; background: url(../images/btn-action.png) no-repeat 0 -25px; border: none; padding: 0 0 0 5px; color: #fff; font-family: 'Century Gothic', 'Apple Gothic', Tahoma, Arial, sans-serif; font-size: 15px; font-weight: normal; cursor: pointer; } a.action:active { top: 1px; } a.action span { float: left; display: inline; position: relative; height: 25px; background: url(../images/btn-action.png) no-repeat right top; padding: 0 15px 0 10px; } /* Extra */ .video-button-title { position:relative;text-align:center;top:-70px;color:#a6c96b;width:450px; font-weight:normal; font-family:Arial, Helvetica, sans-serif; font-size:24px; text-transform:uppercase;} /* Homepage */ .front .row { background: url(../images/home-row.png) left top no-repeat; margin: 0 0 20px 0; padding: 0 15px 0 20px; height: 104px; } .front .row img { margin: 15px 0 0 0; } .front .row .left { width:475px; padding: 25px 0 0 0; } .front .row h2 { float: left; display: inline; padding:0; margin: 0; color: #fff; font-size: 36px; width: 475px; } .front .row h2 a { color: #fff; border-bottom: 0; font-weight: normal; } .front .row p { float: left; display: inline; color: #000; font-size: 17px;width:226px; } .front .row p a { color: #000; border-bottom:0; font-weight: normal; } #block-light { background-image: url(../images/block-droomglimlach.jpg); background-position: right bottom; width: 465px; margin-bottom: 20px; } #block-light .block_inner { background-image: url(../images/block-droomglimlach.jpg); background-position: left top; min-height: 308px; height: auto !important; _height: 342px; padding-right: 190px; padding-bottom: 1px; } #block-light .block_inner img { position: absolute; right:-1px; top:0; height:351px; } #block-light .block_inner p { line-height: 180%; } #block-light .block_inner ul.more, #block-light .block_inner div.more { line-height: 180%; margin-bottom:0; } #main .block-dark { background-image: url(../images/block-dark.jpg); background-position: right bottom; width: 471px; padding-bottom: 9px; } #main .block-dark .block_inner { background-image: url(../images/block-dark.jpg); background-position: left top; padding: 25px 25px 16px 25px; } #main .block-dark h2 { font-size: 20px; margin: 0 0 10px 0; padding: 0 0 10px 0; } #main .block-dark .left { width: 228px; } #main .block-dark p { line-height: 130%; color: #fff; } #main .block-dark .form-row { overflow: hidden; width: 421px; } #main .block-dark input { float: left; display: inline; margin: 0 10px 0 0; } #main .block-dark input.form-text { border:1px solid #000; background: #F1F1F1; width: 145px; padding: 4px; } #main .block-dark input.form-submit { } #main .block-dark ul.more li a { color: #A6C96B; border-bottom: 1px solid #A6C96B; } #main .block-dark ul.more li a:hover { border-bottom: 0 none; } #block-dark { width: 471px; margin-bottom: 0px; padding-bottom: 0px; } #block-dark .block_inner { background: url(../images/home-block-studio.jpg) no-repeat left top; height:412px; padding: 25px 25px 0 25px; } #block-dark .left { width: 260px; } #block-dark h3 { color: #ccc; } #block-dark p { line-height: 180%; color: #fff; } #block-dark ul.more li a, #block-dark div.more a { color: #fff; border-bottom: 0 none; text-decoration: none; } #block-dark ul.more li a:hover { border-bottom: 1px solid #fff; } #block-dark div.more a:hover { text-decoration: underline; } #block-grey { background: #333 url(../images/home-block-grey-bottom.png) no-repeat bottom left; width:956px; } #block-grey .block { background: #333 url(../images/home-block-grey-top.png) no-repeat top left; } #block-grey .block h2 { margin-bottom: 15px; } #block-grey .block ul.more, #block-grey .block div.more { margin: 0; } #block-grey .block ul.more li, #block-grey .block div.more a { margin-top: 10px; } #block-grey .block ul.more li a, #block-grey .block div.more a { color: white; border: none; text-decoration: none; } #block-grey .block ul.more li a:hover { border-bottom: 1px solid #fff; } #block-grey .block div.more a:hover { text-decoration: underline; } #block-grey .block p { margin: 0px; } .front .col_2 { width: 471px; margin-left: 20px; } .front .first_col { width: 465px; margin-left:0; } /* Contact */ #main #block-newsletter-contact { } #main #block-newsletter-contact .block_inner { padding:0; } #main #block-newsletter-contact h2 { } #main #block-newsletter-contact .form-row { overflow: hidden; width: 421px; } #main #block-newsletter-contact input { float: left; display: inline; margin: 0 10px 0 0; } #main #block-newsletter-contact input.form-text { border:1px solid #ccc; background: #fff; width: 145px; padding: 4px; } #main #block-newsletter-contact input.form-submit { } #main #block-map { } #main #block-map .block_inner { padding:0; } /* Veneers */ #banner-veneers { font-size: 24px; } #banner-veneers .block_inner { font-size: 24px; padding: 17px 0 0 0; } #banner-veneers span { font-size: 23px; color: #A6C96B; } #intro-veneers-home { position: relative; height: 162px; } #intro-veneers-home h2 {font-size: 34px; color:#000; margin: 0 0 10px 0; padding: 30px 0 0 0; position: relative; line-height: 140%; } #intro-veneers-home img { position: absolute; left: 40px; top: -90px; margin: 0; } #intro-veneers-home h2 img { position: relative; left: 0; top: 0; float: right; margin: 0 65px 0 0; } #intro-veneers-home div { margin: 0 0 0 380px; } #verkleuring ul { position: relative; } #verkleuring ul li { padding: 10px 0 16px 5px; margin: 0; border-bottom: 1px solid #e6e6e6; font-size: 13px; font-weight: normal; color: #666; background: none; position: relative; } #verkleuring ul li img { float: right; } #verkleuring ul li span { font-size: 12px;} #veneers #data { width: 800px; } #veneers #data img.logo { position: absolute; left:0; bottom: 0; } #veneers #data h3 { text-align: center; color: #A6C96B; } #veneers #data h3 .voor { float: right; display: inline; width: 140px; } #veneers #data h3 .na { float: right; display: inline; width: 140px; margin-left: 20px; } #veneers #data ul { clear:both; color: #000; padding: 0 0 30px 100px;} #veneers #data ul li { text-align: right; padding: 15px 0 0 5px; margin: 0; height: 70px; /*border-bottom: 1px solid #e6e6e6;*/ font-size: 18px; font-weight: normal; color: #666; background: none; float: right; width: 600px; } #veneers #data ul li img { float: right; margin-left: 20px; } #veneers #data ul li span { font-size: 16px;} #intro-veneers-hoe { position: relative; height: 209px; } #intro-veneers-hoe h2 {margin: 0 0 10px 0; padding: 10px 0 0 0; } #intro-veneers-hoe img { position: absolute; left: 119px; top: -109px; margin: 0; z-index:2; } #intro-veneers-hoe div { margin: 0 20px 0 440px; } #intro-veneers-hoe a { color: #A6C96B; border-bottom: 1px solid #A6C96B; } #intro-veneers-faq { position: relative; height: 219px; } #intro-veneers-faq img { position: absolute; left: 609px; top: -20px; margin: 0; } /* Smile video voor & na */ .video { margin: 0 0 20px 0;} .video a { border-bottom: 0 none; } #content-veneers-hoe-video { width: 320px; margin: 0 auto 20px auto; } #content-veneers-hoe-video a { display: block; } #veneers_voorna #main .col_2 { width:475px; } #veneers_voorna #main .first_col { width:405px; margin-left: 15px; } #veneers_voorna_video { background: url(../images/smilevideo-back.jpg) left top no-repeat; width:475px; } #veneers_voorna_video .text { height: 260px; } #content-veneers-voorna-video { padding: 20px 0 20px 0px;} #content-veneers-voorna-video a { border-bottom: 0; } #main #doedetest { width: 860px; overflow: hidden; } #main #doedetest li { float: left; display:inline; padding: 0; margin: 0 0 10px 0; width: 860px; height: 98px; clear: both; background: #fff none;overflow: hidden; } #main #doedetest li h3 { float: left; display:inline; padding: 10px; margin: 0; width: 200px; height: 98px; font-weight: normal; font-size: 16px; line-height:150%; overflow: hidden; } #main #doedetest li span { /*float: left; display:inline;*/ clear: both; font-size: 14px; } #main #doedetest li a { float: left; display:inline; padding: 10px 0; margin: 0 10px 0 0; width: 150px; border-bottom: 0; position: relative; } #main #doedetest li img { float: left; display:inline; padding: 0; margin: 0; width: 150px; height: 78px; } #main #doedetest li img.foto1 { position: absolute; left:0; top:10px; } /* Whitening */ #whitening .col_3 { min-height: 200px; } #intro-whitening { background: url(../images/whitening_home.jpg) left top no-repeat; width:960px; height:428px; margin: 0 0 30px 0; } #intro-whitening .left { padding: 310px 0 0 225px; text-align: left; width:285px; } #intro-whitening .right { padding: 310px 185px 0 0; text-align: right; width:265px; } #intro-whitening a { border-bottom: 0 none; } #intro-whitening h3 { font-size: 23px; margin:0 0 5px 0; color: #000; font-weight: normal; line-height: 115%; } #intro-whitening h4 { font-size: 18px; margin:0; color: #A6C96B; font-weight: normal; } #intro-whitening-wat .block_inner { height: 366px; } #intro-whitening-wat img { position: absolute; left:0; top: 10px; z-index: 1; } #intro-whitening-wat .description { position: relative; z-index:2; padding: 20px 0 0 370px; font-size: 50px; line-height: 120%; } #intro-whitening-wat .description span { text-transform: uppercase; } #intro-whitening-wat h2 { position: relative; z-index:2; padding: 20px 0 0 370px; } #intro-whitening-wat p { position: relative; z-index:2; padding: 0 80px 0 370px; } .fr #intro-whitening-wat .description { padding: 0px 0 0 330px; } .fr #intro-whitening-wat h2 { padding: 10px 0px 0 330px; } .fr #intro-whitening-wat p { padding: 0 0px 0 330px; } #intro-whitening-formulation-content {} #intro-whitening-formulation-content .block_inner { padding: 0; } #intro-whitening-formulation-content img { margin: 0; } #intro-whitening-formulation-content h2 { padding: 60px 20px 0 50px; } #intro-whitening-formulation-content p, #intro-whitening-formulation-content ul { padding: 0 20px 0 50px; } #intro-whitening-wie-content { padding-bottom: 0;} #intro-whitening-wie-content .block_inner { padding: 0; } #intro-whitening-wie-content img { margin: 0; } #intro-whitening-wie-content h2 { padding: 60px 20px 0 50px; } #intro-whitening-wie-content p, #intro-whitening-formulation-content ul, #intro-whitening-formulation-content div { padding: 0 400px 0 50px; } #intro-whitening-boost {background: url(../images/whitening_boost.jpg) left top no-repeat; width:960px; height:400px; margin: 0 0 30px 0; } #intro-whitening-boost h3 { font-size:30px; font-weight:normal; font-style: italic; color: #000; position: relative; z-index:2; padding: 50px 0 10px 50px; } #intro-whitening-boost h2 { font-size:40px; position: relative; z-index:3; padding: 0px 0 0 50px; } #contact-info {float: left; width: 900px;} #contact-info h3 { margin: 20px 0; } #contact-info input.styled, #contact-info textarea { width: 300px; padding: 4px; background: #F1F1F1; border-left: 1px solid #CCC; border-top: 1px solid #CCC; border-right: 0px solid #CCC; border-bottom: 0px solid #CCC; margin-bottom: 10px; margin-top: 5px; } #contact-info select { width: 310px; padding: 4px; margin-bottom: 10px; margin-top: 5px; } #contact-adres {float: left; margin-left:30px;} #contact-map {float: left; width: 420px; height: 280px; color:#666666; border: 0px solid black;} /* Media */ #intro-glambassador { width: 960px; overflow: hidden; } #intro-glambassador .block_inner { padding: 0; } #intro-glambassador .block_inner .left { width: 489px; position: relative; } #intro-glambassador .block_inner .left img { position: absolute; top:0; left:0; } #intro-glambassador .block_inner .right { width: 393px; padding: 80px 20px 0 42px; position: relative; } #intro-glambassador h2 { font-size: 50px; color: #fff; font-family: ScalaSans, Tahoma, Arial, sans-serif; line-height: 100%; margin: 0 0 5px 0; } #intro-glambassador h2 span { color: #A6C96B; } #in-de-media-intro { margin: 0 0 40px 0; padding: 20px 0 0 0; } #in-de-media-intro .left { width: 345px; margin: 0 30px 0 0; } #in-de-media-intro .left img { display: block; margin: 0 auto; } #in-de-media-intro .right { width: 525px; } /* Smile advies */ #advies .subnav { top:31px; } #advies #intro-smile-advies { height:222px;} #advies #intro-smile-advies h2 { font-size: 35px; } #advies #intro-smile-advies .left { width: 310px; position: relative; z-index: 2; } #advies #intro-smile-advies .right { width: 240px; position: relative; z-index: 2; } #advies #intro-smile-advies img { position: absolute; left: 260px; bottom:-20px; z-index: 1; } a.block-link { display: block; border-bottom: 0 none; font-weight: normal; cursor: hand; cursor: pointer; } #advies .block_grey .block_inner { height: 190px; padding-bottom: 0; } #advies .teaser-jonger .block_inner { height: 165px; } #advies a.block-link h2 { font-size: 35px; } #advies a.block-link h2, #advies a.block-link p { padding: 0 0 0 325px; } #advies a.block-link img { position: absolute; left:-1px; top:0; } #advies a.block-link:hover img { /*opacity:0.7;filter:alpha(opacity=70);*/ } #advies a.block-link:hover p { color: #666; } #intro-jonger { position: relative; height: 168px;} #intro-jonger img { position: absolute; left:60px; top: -85px; z-index: 1;} #intro-jonger h2 { position: relative; z-index:2; padding: 20px 0 0 470px; margin: 0 0 8px 0; font-size: 50px; font-family: ScalaSans, Tahoma, Arial, sans-serif; } #intro-jonger p { position: relative; z-index:2; padding: 0 0 0 470px; } #advies-steps .block_grey .block_inner { padding-bottom: 0; } #intro-steps { position: relative; height: 200px;} #intro-steps img { position: absolute; right:-60px; top: -35px; z-index: 1; margin: 0; display: block; } #intro-steps h2 { position: relative; z-index:2; padding: 0 240px 0 0; margin: -10px 0 20px 0; font-size: 40px; font-family: ScalaSans, Tahoma, Arial, sans-serif; } #intro-steps p { position: relative; z-index:2; padding: 0 340px 0 0; } #intro-gebit { position: relative; /*height: 167px;*/ overflow: visible; } #intro-gebit img { position: absolute; right:-60px; top: -25px; z-index: 1;} #intro-gebit h2 { position: relative; z-index:2; padding: 0 260px 0 0; margin: -10px 0 8px 0; font-size: 38px; font-family: ScalaSans, Tahoma, Arial, sans-serif; } #intro-gebit p { position: relative; z-index:2; padding: 0 260px 0 0; margin-bottom:0; } #intro-makeup .left { width: 569px; } #intro-makeup img { margin: 0 ;} #intro-makeup h2 { padding: 0 80px 0 0; font-size: 40px; font-family: ScalaSans, Tahoma, Arial, sans-serif; } #intro-makeup p { padding: 0 80px 0 0; } /* Studio */ #studio .block_white .block_inner { padding: 48px; } #studio #header-image { margin-bottom: 30px; } #studio .left { width: 410px; } #studio .right { width: 410px; margin-left: 40px; } #studio #studios { width: 900px; } #studio #studios ul li { float: left; width: 185px; height: 110px; margin: 0 40px 30px 0; padding: 0; border: none; background: #000; } #studio #studios ul li a { border: none; padding: 0; color: #fff; } #studio #studios ul li a span { position: absolute; width: 165px; text-align: center; padding: 40px 10px; color: #fff; font-size: 21px; font-weight: normal; text-transform: uppercase; } #studio #studios ul li a img { filter:alpha(opacity=40); opacity:0.4; } #studio #studios ul li a:hover span { display: none; } #studio #studios ul li a:hover img { filter:alpha(opacity=100); opacity:1.0; } /* 404 */ #intro-404 { width: 960px; height: 348px; position: relative; text-align: right; } #intro-404 img { position: absolute; top:0; left:0;} #intro-404 h3 { font-size: 25px; text-transform: uppercase; color: #A5C96B; padding: 190px 30px 10px 0; } #intro-404 h3 span { color: #fff; } #intro-404 h2 { font-size: 52px; padding: 0 30px 0 0;} /* Jobs */ #intro-jobs { position: relative; padding:0; height: 273px;} #intro-jobs img { position: absolute; right:-50px; top: -35px; z-index: 1; margin: 0; display: block; } #intro-jobs h2 { position: relative; z-index:2; padding: 0 240px 0 0; margin: -10px 0 8px 0; font-size: 40px; font-family: ScalaSans, Tahoma, Arial, sans-serif; } #intro-jobs p { position: relative; z-index:2; padding: 0 240px 0 0; } /* fancybox */ #fancybox-left-ico { left: 20px !important; } #fancybox-right-ico { left: auto !important; right: 20px; } /* lightbox */ #lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #222222 url(../images/intro_bg.png) top left repeat-x; z-index: 999999; } #lightbox .footer { position: absolute; width: 100%; bottom: 0px; text-align: center; font-size: 12px; color: #999999; z-index: 1; } #lightbox .footer p { margin-bottom: 5px; } #lightbox .footer a { color: #999999; border: none; font-weight: normal; } #lightbox .footer a:hover { text-decoration: underline; } /* choose country */ #choose_country { position: absolute; width: 970px; height: 520px; top: 50%; left: 50%; margin: -260px 0 0 -485px; background: url(../images/intro.png) center center no-repeat; z-index: 10; font-size: 11px; } #choose_country .wrap { position: absolute; left: 0; bottom: 0; padding: 0 20px 20px; width: 350px; } #choose_country .wrap .col { float: left; width: 155px; margin: 0 0 0 20px; color: #fff; line-height: 0.9; } #choose_country .wrap .col .flag { height: 24px; } #choose_country .wrap .col .flag img { margin: 8px 5px -4px 0; } #choose_country .wrap .col a { color: #fff; font-size: 12px; text-decoration: none; border: none; font-weight: normal; } #choose_country .wrap .col a:hover { text-decoration: underline; } /* Browser Fixes -------------------------------------------------------------- */ .clearfloat { clear: both; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix {height: 1%; }