@charset "utf-8"; /* Theme Name: Versheid Theme URI: http://www.versheid.net/ Description: Online lifestyle magazine dat onbeperkt houdbaar is. Version: 2.0 Author: Kevin van der Wijst Author URI: http://www.remixdesign.nl/ */ /*------------------------------------------------------------------ [Table of Contents] 1. Body 2. Top / #top 3. Header / #header 3.1. Slider / #slider 3.2. Mosaic / #mosaic 3.X. Category 4. Content / #content 4.1. Overzicht / #overzicht 4.2. Feature / #feature 4.3. Artikel / #artikel 4.4. Pagina / #pagina 4.5. Gallery / #gallery-image 4.X. Sidebar / #sidebar 5. Reacties / #reacties 6. Shuffle / #shuffle 7. Footer / #footer X. Misc -------------------------------------------------------------------*/ /*------------------------------------------------------------------ [1. Body] */ 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 { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { background: #fff; -webkit-font-smoothing: antialiased; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 13px; color: #444; text-shadow: rgba(0, 0, 0, 0.0078125) 0px 0px 1px; min-height: 100%; position: relative; padding: 0 0 50px; } #background { position: absolute; width: 100%; height: 280px; z-index: -1; } #background img { display: none; position: fixed; } body#blue { background: #87d8e5 url(images/body/1.png) top left repeat; } body#classic { background: #efefef url(images/body/2.png) top left repeat; } body#clean { background: #afb4ad; } body#clean #background { background: url(images/body/3.png) top left no-repeat; height: 800px; } body#clean #background img.clean { display: block; width: 100%; height: 800px; } body#retro { background: #ffd562 url(images/body/4.png) top left repeat; } body#clouds { background: #e1edf2 url(images/body/5.png) top left repeat; } body#clouds #background { background: url(images/body/5-background.png) top left repeat-x; } body#redish { background: #dd3c2b url(images/body/6.png) top left repeat; } body#redish #background { background: url(images/body/6-background.png) top left repeat-x; } body#celebration { background: #bfe6ea url(images/body/7.png) top center repeat-x fixed; } img#wpstats { display: none; } #wrapper { background: url(images/wrapper.png) top center no-repeat; min-height: 190px; position: relative; z-index: 1; } #container { width: 960px; overflow: hidden; margin: 0 auto; } img { border: none; margin: 0; padding: 0; } a, a:visited { color: #00a3bb; text-decoration: none; } a:hover { color: #5cbb00; text-decoration: underline; } ul { list-style-position: inside; } ul li { list-style-position: inside; } ol { list-style-type: decimal; list-style-position: inside; } ol li { list-style-type: decimal; list-style-position: inside; } input { background: #fff; border: 1px solid #e6e6df; font-family: Arial, Helvetica, sans-serif; padding: 4px; font-size: 12px; color: #666; } textarea { background: #fff; border: 1px solid #e6e6df; padding: 3px 5px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #666; line-height: 17px; overflow: auto; } input:focus, textarea:focus { outline: none; } .no-input { background: none; border: none; width: auto; } button { background: #f4f4f4 url(images/button.png) 0 -2px repeat-x; border: 1px solid #bbb; border-top: none; border-left: none; border-radius: 5px; margin: 0; padding: 7px 13px 8px 14px; font-weight: bold; font-size: 11px; color: #666; text-transform: uppercase; -webkit-font-smoothing: antialiased; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; text-shadow: 1px 1px #fff; cursor: pointer; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25); -webkit-transition: -webkit-box-shadow .15s ease-in-out; -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25); box-shadow: 0 1px 2px rgba(0,0,0,0.25); -moz-transition: -moz-box-shadow .15s ease-in-out; } button:hover { background: #f4f4f4 url(images/button.png) 0 -33px repeat-x; color: #666; border: none; padding: 7px 13px 9px 14px; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.35); -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.35); box-shadow: 0 1px 2px rgba(0,0,0,0.35); } .left { float: left; display: inline; overflow: hidden; } .right { float: right; display: inline; overflow: hidden; } .wrap { overflow: hidden; } .clear { clear: both; font-size: 1px; } hr { height: 0; border: none; border-top: 1px solid #e6e6df; margin: 0 0 20px; } /*------------------------------------------------------------------ [2. Top / #top] */ #top { width: 960px; height: 150px; margin: 0 auto; position: relative; } #top #logo { width: 250px; height: 93px; position: relative; } #logo .label { width: 80px; height: 93px; position: absolute; top: 0; left: 0; } #logo .label a { background: #000 url(images/logo.png) 0 0 no-repeat; width: 80px; height: 93px; display: block; -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.26); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.26); } #logo .label a span { display: none; } #logo .versheid { width: 150px; height: 32px; position: absolute; top: 30px; left: 96px; } #logo .versheid a { background: url(images/versheid.png) 0 0 no-repeat; width: 150px; height: 32px; display: block; } #logo .versheid a span { display: none; } body#classic #logo .versheid a { background: url(images/versheid-black.png) 0 0 no-repeat; } #top #user { width: 360px; height: 60px; padding: 30px 0 0; position: absolute; top: 0; right: 0; overflow: hidden; } #user.ingelogd { opacity: 0; filter: alpha(opacity=0); } #user .opties { text-align: right; max-width: 320px; padding: 10px 15px 14px; margin: 0 10px 0 0; float: right; display: inline; overflow: hidden; -moz-border-radius: 5px; border-radius: 5px; } #user .opties h2 { font-size: 14px; font-weight: bold; color: #fff; padding: 0 0 4px; margin: 0; } #user .opties h2 a, #user .opties h2 a:visited { color: #fff; text-decoration: none; } #user .opties h2 a:hover { color: #fff; text-decoration: underline; } #user .opties p { font-size: 12px; color: #fff; } #user .opties p a, #user .opties p a:visited { font-weight: bold; color: #fff; opacity: 0.8; filter: alpha(opacity=80); text-decoration: none; } #user .opties p a:hover { color: #fff; opacity: 1.0; filter: alpha(opacity=100); text-decoration: none; } #user .opties p span { display: inline-block; padding: 0 5px; font-weight: bold; color: #fff; opacity: 0.5; filter: alpha(opacity=50); } #user .gravatar { float: right; display: inline; overflow: hidden; width: 60px; height: 60px; position: relative; } #user .gravatar img { width: 60px; height: 60px; -moz-border-radius: 5px; border-radius: 5px; position: absolute; z-index: 1; } #user .gravatar .shadow { background: url(images/top-user-shadow.png) top left no-repeat; width: 60px; height: 60px; display: block; position: absolute; z-index: 2; } #user .aanmelden { text-align: right; float: right; display: inline; overflow: hidden; padding: 4px 8px 7px; margin: 34px 0 0; -moz-border-radius: 5px; border-radius: 5px; } #user .aanmelden p a, #user .aanmelden p a:visited { font-weight: bold; color: #fff; opacity: 0.8; filter: alpha(opacity=80); text-decoration: none; } #user .aanmelden p a:hover { color: #fff; opacity: 1.0; filter: alpha(opacity=100); text-decoration: none; } #user .aanmelden p span { display: inline-block; padding: 0 5px; font-weight: bold; color: #fff; opacity: 0.5; filter: alpha(opacity=50); } body#blue #user .opties, body#blue #user .aanmelden { background: url(images/footer/blue.png) top left repeat; } body#classic #user .opties, body#classic #user .aanmelden { background: #363636; } body#clean #user .opties, body#clean #user .aanmelden { background: #474e51; } body#retro #user .opties, body#retro #user .aanmelden { background: url(images/footer/retro.png) top left repeat; } body#clouds #user .opties, body#clouds #user .aanmelden { background: url(images/footer/clouds.png) top left repeat; } body#redish #user .opties, body#redish #user .aanmelden { background: url(images/footer/redish.png) top left repeat; } body#celebration #user .opties, body#celebration #user .aanmelden { background: #59b4bd; } #top #beam { background: url(images/beam.png) top left no-repeat; width: 960px; height: 37px; margin: 20px 0 0; overflow: hidden; position: relative; z-index: 996; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); } #beam ul#nav { width: 550px; float: left; display: inline; overflow: hidden; list-style: none; position: relative; } ul#nav li { float: left; height: 37px; } ul#nav li a, ul#nav li a:visited { background: url(images/nav.png) top left no-repeat; display: block; height: 37px; font-size: 13px; color: #000; text-decoration: none; } ul#nav li a:hover { color: #fff; text-decoration: none; } ul#nav li a span { background: url(images/nav.png) bottom right no-repeat; padding: 0 14px 0 15px; height: 37px; display: block; } ul#nav li a .cufon-canvas { margin: 12px 0 0; } ul#nav li:hover { background: #777978; } ul#nav li.home:hover { background: #777978 url(images/navli.png) 0 0; } ul#nav li.music:hover { background: #38ae9d url(images/navli.png) 0 -37px; } ul#nav li.design:hover { background: #e82b57 url(images/navli.png) 0 -74px; } ul#nav li.fashion:hover { background: #ef6b06 url(images/navli.png) 0 -111px; } ul#nav li.tech:hover { background: #68ac26 url(images/navli.png) 0 -148px; } ul#nav li.lifestyle:hover { background: #1597ad url(images/navli.png) 0 -185px; } ul#nav li.shop:hover { background: #1597ad url(images/navli.png) 0 -222px; } ul#nav li:hover a { background: url(images/navhover.png) top right no-repeat; } #beam #zoeken { width: 185px; float: right; display: inline; overflow: hidden; padding: 0 7px 0 0; } #zoeken form input { background: transparent url(images/zoeken.png) top left no-repeat; border: none; width: 154px; height: 23px; margin: 6px 0 0; padding: 2px 4px 0 27px; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; color: #000; } /*------------------------------------------------------------------ [3. Header / #header] */ #header { background: #000; position: relative; width: 960px; height: 320px; margin: 0 auto; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); } #header .toggle { width: 34px; height: 28px; position: absolute; z-index: 9999; top: 275px; right: 18px; } #header .toggle span { display: none; } #header #mosaic-toggle a, #header #mosaic-toggle a:visited { background: url(images/header/toggle.png) bottom left no-repeat; width: 34px; height: 28px; display: block; opacity: 1.0; filter: alpha(opacity=100); text-decoration: none; cursor: pointer; } #header #mosaic-toggle a:hover { opacity: 0.7; filter: alpha(opacity=70); text-decoration: none; } #header #slider-toggle a, #header #slider-toggle a:visited { background: url(images/header/toggle.png) top left no-repeat; width: 34px; height: 28px; display: block; opacity: 1.0; filter: alpha(opacity=100); text-decoration: none; cursor: pointer; } #header #slider-toggle a:hover { opacity: 0.7; filter: alpha(opacity=70); text-decoration: none; } /*------------------------------------------------------------------ [3.1. Slider / #slider] */ #slider { width: 960px; height: 320px; overflow: hidden; } #slider ul, #slider li { margin: 0; padding: 0; list-style: none; } #slider li { width: 960px; height: 320px; overflow: hidden; position: relative; } #slider li img { position: absolute; z-index: 10; } #slider li .block { position: absolute; z-index: 20; top: 320px; width: 960px; height: 100px; } #slider li .block.music { background: url(images/header/music.png) top left repeat-x; } #slider li .block.design { background: url(images/header/design.png) top left repeat-x; } #slider li .block.fashion { background: url(images/header/fashion.png) top left repeat-x; } #slider li .block.tech { background: url(images/header/tech.png) top left repeat-x; } #slider li .block.lifestyle { background: url(images/header/lifestyle.png) top left repeat-x; } #slider li .block h1 { margin: 0; padding: 23px 30px 0; font-size: 24px; color: #fff; line-height: 21px; text-shadow: 0 -1px 1px rgba(0,0,0,0.4); } #slider li .block h1 a, #slider li .block h1 a:visited { color: #fff; text-decoration: none; opacity: 1.0; filter: alpha(opacity=100); } #slider li .block h1 a:hover { color: #fff; text-decoration: none; opacity: 0.8; filter: alpha(opacity=80); } #slider li .block p { font-size: 13px; color: #fff; opacity: 0.7; filter: alpha(opacity=70); margin: -8px 0 0; padding: 0 30px; } #prevBtn, #nextBtn, #slider1next, #slider1prev { display: none; } ol#controls { height: 28px; position: absolute; top: 279px; right: 60px; z-index: 9999; } ol#controls li { background: url(images/header/controls.png) -18px 0 no-repeat; margin: 0 0 0 4px; padding: 0; float: left; list-style: none; width: 18px; height: 21px; cursor: pointer; opacity: 0.9; filter: alpha(opacity=90); } ol#controls li:hover { opacity: 0.6; filter: alpha(opacity=60); } ol#controls li a { display: none; } ol#controls li.current { background: url(images/header/controls.png) 0 0 no-repeat; float: left; height: 21px; width: 18px; text-decoration: none; opacity: 1.0; filter: alpha(opacity=100); } ol#controls li.current:hover { opacity: 1.0; filter: alpha(opacity=100); } ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{ outline: none; } /*------------------------------------------------------------------ [3.2. Mosaic / #mosaic] */ #mosaic { background: #000; width: 960px; height: 320px; overflow: hidden; } #mosaic .tile { width: 320px; height: 160px; display: block; float: left; position: relative; } #mosaic .tile img { position: absolute; z-index: 5; } #mosaic .tile .hover { background: #000; width: 320px; height: 160px; display: none; position: absolute; z-index: 15; text-decoration: none; } #mosaic .tile .hover h1 { padding: 20px 28px 0; line-height: 25px; font-size: 15px; color: #fff; text-decoration: none; display: block; } #mosaic .tile .hover p { margin: -8px 0 0; padding: 0 28px; font-size: 12px; color: #fff; opacity: 0.7; filter: alpha(opacity=70); } #mosaic .tile.music .hover { background: transparent url(images/header/tile-music.png) top left repeat; } #mosaic .tile.design .hover { background: transparent url(images/header/tile-design.png) top left repeat; } #mosaic .tile.fashion .hover { background: transparent url(images/header/tile-fashion.png) top left repeat; } #mosaic .tile.tech .hover { background: transparent url(images/header/tile-tech.png) top left repeat; } #mosaic .tile.lifestyle .hover { background: transparent url(images/header/tile-lifestyle.png) top left repeat; } /*------------------------------------------------------------------ [3.X. Category] */ #header.category { height: 120px; position: relative; } #header.category .background { width: 960px; height: 120px; position: absolute; z-index: 50; } #header.category .background img { width: 960px; height: 120px; display: block; } #header.category .title { padding: 34px 35px; position: absolute; z-index: 51; } #header.category .title h1 { background: url(images/header-highlight.png) top left repeat-x; height: 52px; display: inline-block; font-size: 42px; font-weight: bold; color: #000; -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26); } /*------------------------------------------------------------------ [4. Content / #content] */ #content { background: #fff; width: 960px; margin: 20px auto 0; overflow: hidden; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); } #content.category { border-top: 10px solid #e1e2df; } #content.music { border-top: 10px solid #3ab19f; } #content.design { border-top: 10px solid #ef305c; } #content.fashion { border-top: 10px solid #fb7106; } #content.tech { border-top: 10px solid #74c229; } #content.lifestyle { border-top: 10px solid #1997b0; } #content .info { opacity: 0.5; filter: alpha(opacity=50); padding: 0; } #content .info .tags { background: url(images/icons/tags.png) 0 20px no-repeat; width: 570px; margin: 0 auto; padding: 17px 0 4px 30px; font-size: 13px; line-height: 23px; } #content .info .tags a, #content .info .tags a:visited { color: #777; text-decoration: none; } #content .info .tags a:hover { color: #777; text-decoration: underline; } #content .info .author { width: 600px; margin: 0 auto; padding: 20px 10px 10px; overflow: hidden; } #content .info .author .gravatar { background: #fafafa; width: 70px; height: 70px; float: left; display: inline; overflow: hidden; position: relative; } #content .info .author .gravatar img { position: absolute; z-index: 1; } #content .info .author .gravatar .shadow { background: url(images/info-shadow.png) top left no-repeat; position: absolute; z-index: 2; width: 70px; height: 70px; display: block; } #content .info .author .who { width: 510px; float: right; display: inline; overflow: hidden; } #content .info .author .who h3 { font-size: 15px; font-weight: bold; color: #000; padding: 0 0 7px; } #content .info .author .who h3 a, #content .info .author .who h3 a:visited { color: #000; text-decoration: none; } #content .info .author .who h3 a:hover { color: #000; text-decoration: underline; } #content .info .author .who p { font-size: 11px; color: #666; line-height: 21px; } #content .info .author .who .more { padding: 6px 0 0; font-size: 11px; } #content .info .author .who .more ul { list-style: none; } #content .info .author .who .more ul li { float: left; display: block; padding: 0 15px 0 0; } #content .info .author .who .more ul li a, #content .info .author .who .more ul li a:visited { color: #666; text-decoration: none; display: inline-block; padding: 3px 0 4px 24px; } #content .info .author .who .more ul li a:hover { color: #666; text-decoration: underline; } #content .info .author .who .more ul li.url { background: url(images/icons/website.png) 0 0 no-repeat; } #content .info .author .who .more ul li.twitter { background: url(images/icons/twitter.png) 0 0 no-repeat; } #content .artikel-navigatie { background: url(images/hr.png) 0 18px repeat-x; margin: 0 18px; padding: 10px 0 20px; font-size: 12px; overflow: hidden; } #content .artikel-navigatie .vorige { background: #fff; float: left; display: inline; overflow: hidden; } #content .artikel-navigatie .vorige a { background: url(images/artikel-navigatie.png) 0 3px no-repeat; padding: 0 12px 0 28px; } #content .artikel-navigatie .volgende { background: #fff; float: right; display: inline; overflow: hidden; } #content .artikel-navigatie .volgende a { background: url(images/artikel-navigatie.png) 116px -17px no-repeat; padding: 0 28px 0 12px; } #content .artikel-navigatie a, #content .artikel-navigatie a:visited { font-weight: bold; color: #666; display: inline-block; padding: 0 12px; text-decoration: none; } #content .artikel-navigatie a:hover { color: #666; text-decoration: underline; } /*------------------------------------------------------------------ [4.1. Overzicht / #overzicht] */ #overzicht { padding: 0; width: 630px; float: left; } #overzicht .head { width: 570px; min-height: 21px; overflow: hidden; padding: 23px 30px 10px; } #overzicht .head h1 { font-size: 20px; color: #000; float: left; display: inline; overflow: hidden; } #overzicht .head .controls { width: 37px; height: 14px; margin: 7px 0 0; float: right; display: inline; overflow: hidden; } #overzicht .head .controls .toggle { width: 37px; height: 14px; cursor: pointer; } #overzicht .head .controls .toggle span { display: none; } #overzicht .head .controls .toggle a { width: 37px; height: 14px; display: block; } #overzicht .head .controls .toggle#blocks-toggle a { background: url(images/content/toggle.png) bottom left no-repeat; } #overzicht .head .controls .toggle#items-toggle a { background: url(images/content/toggle.png) top left no-repeat; } #overzicht .nothing { padding: 7px 30px 0; clear: both; overflow: hidden; } #overzicht .nothing h1 { font-size: 20px; color: #000; padding: 13px 0 5px; } #overzicht .nothing p { font-size: 13px; color: #666; padding: 10px 0; line-height: 23px; } #overzicht #blocks { padding: 0 22px 22px 23px; clear: both; overflow: hidden; } #overzicht .block { background: #eee; width: 180px; height: 180px; margin: 7px 8px 8px 7px; padding: 0; float: left; display: block; overflow: hidden; position: relative; } #overzicht .block img { position: absolute; z-index: 4; left: -60px; } #overzicht .block .hover { background: #000; width: 180px; height: 180px; display: none; position: absolute; z-index: 14; text-decoration: none; text-shadow: rgba(0,0,0,0.26) -1px -1px 1px; } #overzicht .block .hover h1 { padding: 12px 18px 0; line-height: 21px; font-size: 15px; color: #fff; text-decoration: none; display: block; } #overzicht .block .hover p { padding: 5px 18px 0; font-size: 12px; font-weight: bold; color: #fff; opacity: 0.7; filter: alpha(opacity=70); } #overzicht .block .hover span { display: block; text-align: right; position: absolute; z-index: 24; bottom: 15px; right: 17px; font-size: 12px; font-weight: bold; color: #fff; } #overzicht .block.music .hover { background: transparent url(images/header/tile-music.png) top left repeat; } #overzicht .block.design .hover { background: transparent url(images/header/tile-design.png) top left repeat; } #overzicht .block.fashion .hover { background: transparent url(images/header/tile-fashion.png) top left repeat; } #overzicht .block.tech .hover { background: transparent url(images/header/tile-tech.png) top left repeat; } #overzicht .block.lifestyle .hover { background: transparent url(images/header/tile-lifestyle.png) top left repeat; } #overzicht #blocks .afterthree { margin: 7px 8px 6px 7px; float: left; display: block; } #overzicht #items, #overzicht #entries { padding: 7px 30px 0; clear: both; overflow: hidden; } #overzicht .item { width: 570px; margin: 0 0 30px; overflow: hidden; } #overzicht .item .image { width: 300px; height: 180px; float: left; display: inline; overflow: hidden; position: relative; } #overzicht .item.music .image { background: #1fa995; } #overzicht .item.design .image { background: #ef305c; } #overzicht .item.fashion .image { background: #ff5400; } #overzicht .item.tech .image { background: #6aae27; } #overzicht .item.lifestyle .image { background: #1097ab; } #overzicht .item .image img { position: absolute; z-index: 3; opacity: 1.0; filter: alpha(opacity=100); opacity: 1.0; -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; transition: all 0.2s ease-in; -webkit-backface-visibility: hidden; } #overzicht .item .image:hover img { opacity: 0.2; -webkit-transform: scale(1.075); -moz-transform: scale(1.075); -o-transform: scale(1.075); -ms-transform: scale(1.075); transform: scale(1.075); } #overzicht .item .image .categorie { position: absolute; bottom: 0; left: 0; z-index: 13; width: 105px; height: 28px; padding: 22px 0 0 15px; font-size: 13px; color: #fff; } #overzicht .item .image .categorie a, #overzicht .item .image .categorie a:visited { font-weight: bold; color: #fff; text-decoration: none; } #overzicht .item .image .categorie a:hover { color: #fff; text-decoration: underline; } #overzicht .item.music .image .categorie { background: url(images/content/categorie-music.png) top left no-repeat; } #overzicht .item.design .image .categorie { background: url(images/content/categorie-design.png) top left no-repeat; } #overzicht .item.fashion .image .categorie { background: url(images/content/categorie-fashion.png) top left no-repeat; } #overzicht .item.tech .image .categorie { background: url(images/content/categorie-tech.png) top left no-repeat; } #overzicht .item.lifestyle .image .categorie { background: url(images/content/categorie-lifestyle.png) top left no-repeat; } #overzicht .item .image .video { position: absolute; bottom: 0; right: 0; z-index: 13; width: 80px; height: 70px; } #overzicht .item .image .video span { display: none; } #overzicht .item.music .image .video { background: url(images/content/video-music.png) top left no-repeat; } #overzicht .item.design .image .video { background: url(images/content/video-design.png) top left no-repeat; } #overzicht .item.fashion .image .video { background: url(images/content/video-fashion.png) top left no-repeat; } #overzicht .item.tech .image .video { background: url(images/content/video-tech.png) top left no-repeat; } #overzicht .item.lifestyle .image .video { background: url(images/content/video-lifestyle.png) top left no-repeat; } #overzicht .item .entry { width: 250px; padding: 0 0 0 20px; float: right; display: inline; overflow: hidden; } #overzicht .item .entry .advertorial { font-size: 11px; color: #888; font-style: italic; padding: 0 0 7px; } #overzicht .item .entry h2 { font-size: 15px; font-weight: bold; color: #000; line-height: 21px; margin: 0 0 9px; } #overzicht .item .entry h2 a, #overzicht .item .entry h2 a:visited { color: #000; text-decoration: none; -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; transition: color 0.2s ease-in; } #overzicht .item .entry h2 a:hover { color: #555; text-decoration: none; } #overzicht .item.music .entry h2 a:hover { color: #1fa995; } #overzicht .item.design .entry h2 a:hover { color: #ef305c; } #overzicht .item.fashion .entry h2 a:hover { color: #ff5400; } #overzicht .item.tech .entry h2 a:hover { color: #6aae27; } #overzicht .item.lifestyle .entry h2 a:hover { color: #1097ab; } #overzicht .item .entry .datum { font-size: 11px; color: #888; } #overzicht .item .entry .excerpt { font-size: 12px; padding: 13px 0 0; } #overzicht .item .entry .excerpt p { line-height: 21px; color: #666; } #overzicht .item .entry .info { padding: 9px 0 0; font-size: 11px; overflow: hidden; opacity: 1.0; filter: alpha(opacity=100); } #overzicht .item .entry .info a, #overzicht .item .entry .info a:visited { font-weight: 500; color: #666; text-decoration: none; } #overzicht .item .entry .info a:hover { color: #888; text-decoration: none; } #overzicht .item .entry .info .left { float: left; display: inline; overflow: hidden; } #overzicht .item.music .entry .info .left a:hover { color: #1fa995; } #overzicht .item.design .entry .info .left a:hover { color: #ef305c; } #overzicht .item.fashion .entry .info .left a:hover { color: #ff5400; } #overzicht .item.tech .entry .info .left a:hover { color: #6aae27; } #overzicht .item.lifestyle .entry .info .left a:hover { color: #1097ab; } #overzicht .item .entry .info .right { float: right; display: inline; overflow: hidden; } #overzicht #items .afterthree, #overzicht #entries .afterthree { margin: 0 0 30px; } #overzicht .navigation { padding: 0 30px; min-height: 50px; font-size: 14px; font-weight: 500; overflow: hidden; } /*------------------------------------------------------------------ [4.2. Feature / #feature] */ #feature { border-top: 10px solid #e1e2df; padding: 0; } #feature.music { border-top: 10px solid #3ab19f; } #feature.design { border-top: 10px solid #ef305c; } #feature.fashion { border-top: 10px solid #fb7106; } #feature.tech { border-top: 10px solid #74c229; } #feature.lifestyle { border-top: 10px solid #1997b0; } #feature .title { padding: 20px 30px; text-align: center; } #feature .title p { font-size: 12px; color: #858585; line-height: 25px; } #feature .title h1 { font-size: 32px; color: #000; padding: 1px 0 9px; } #feature .title .category { background: url(images/hr.png) 0 8px repeat-x; width: 900px; margin: 0 auto; } #feature .title .category p { background: #fff; font-weight: bold; padding: 0 11px; display: inline-block; line-height: normal; color: #777; } #feature .title .category p span { display: inline-block; padding: 0 6px; font-weight: normal; color: #999; } #feature .title .category a, #feature .title .category a:visited { font-weight: bold; font-size: 13px; color: #666; text-decoration: none; } #feature .title .category a:hover { color: #666; text-decoration: underline; } #feature.music .title .category a { color: #1fa995; } #feature.design .title .category a { color: #ef305c; } #feature.fashion .title .category a { color: #ff5400; } #feature.tech .title .category a { color: #6aae27; } #feature.lifestyle .title .category a { color: #1097ab; } #feature.music h2 { color: #1fa995; } #feature.design h2 { color: #ef305c; } #feature.fashion h2 { color: #ff5400; } #feature.tech h2 { color: #6aae27; } #feature.lifestyle h2 { color: #1097ab; } #feature .media { width: 960px; padding: 0; margin: 0; text-align: center; } #feature .media img { padding: 0; margin: 0; border: none; } #feature .entry { width: 600px; font-size: 13px; color: #666; padding: 0 180px 20px; border-bottom: 1px solid #ddd; position: relative; } #feature .entry h1 { font-size: 25px; font-weight: bold; color: #000; margin: 7px 0 0; } #feature .entry h1 a, #feature .entry h1 a:visited { color: #000; text-decoration: none; -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; transition: all 0.2 ease-in; -webkit-backface-visibility: hidden; } #feature .entry h1 a:hover { text-decoration: none; } #feature.music .entry h1 a:hover { color: #1fa995; } #feature.design .entry h1 a:hover { color: #ef305c; } #feature.fashion .entry h1 a:hover { color: #ff5400; } #feature.tech .entry h1 a:hover { color: #6aae27; } #feature.lifestyle .entry h1 a:hover { color: #1097ab; } #feature .entry h2 { font-size: 16px; font-weight: 500; line-height: 31px; margin: 7px 0 0; } #feature .entry h3 { font-size: 14px; color: #000; margin: 10px 0 0; } #feature .entry p { width: 600px; margin: 0 auto; padding: 10px 0; text-align: justify; line-height: 25px; } #feature .entry p a { font-weight: 500; -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; transition: color 0.2s ease-in; } #feature .entry p a.button { margin: 0 0 15px; } #feature .entry .leftfull { margin-left: -180px; } #feature .entry .rightfull { margin-right: -180px; } #feature .entry blockquote { background: #eee url(images/blockquote.png) top left repeat-x; margin: 10px 0; padding: 3px 20px 6px; font-style: italic; color: #777; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); } #feature .entry blockquote p { width: auto; } #feature .entry blockquote.shift { background: none; margin: 0; padding: 0 25px; font-family: Helvetica, Arial, sans-serif; font-size: 20px; color: #444; font-style: normal; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #feature .entry blockquote.shift p { line-height: 31px; text-align: left; } #feature .entry ul { list-style-position: inside; list-style: none; margin: 10px 0 0; } #feature .entry ul li { background: url(images/list.png) 0 9px no-repeat; margin: 0 0 10px; padding: 0 0 0 18px; line-height: 23px; } #feature .entry ol { list-style-position: inside; margin: 10px 0 6px; } #feature .entry ol li { margin: 0 0 4px; line-height: 23px; } #feature .entry pre { margin: 10px; } #feature .entry .gallery { margin: 0 auto; padding: 15px 0 5px; width: 600px; } #feature .entry .gallery-item { background: #000; float: left; display: block; text-align: center; width: 150px; height: 150px; margin: 0; } #feature .entry .gallery img { width: 150px; height: 150px; margin: 0; border: none; opacity: 1.0; filter: alpha(opacity=100); } #feature .entry .gallery a, #feature .entry .gallery a:visited, #feature .entry .gallery a:hover { background: none; } #feature .entry .gallery-caption { margin: 0; } #feature .entry .coverhover { position: relative; width: auto; height: auto; margin: 10px auto; padding: 0; } #feature .entry .coverhover .blur { position: absolute; z-index: 6; top: 0; } #feature .entry .coverhover .cover { position: absolute; z-index: 7; top: 0; } #feature .entry .coverhover .cover img { opacity: 0; -webkit-transition: opacity 0.2s ease-in; -moz-transition: opacity 0.2s ease-in; -o-transition: opacity 0.2s ease-in; -ms-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; -webkit-backface-visibility: visible; } #feature .entry .coverhover:hover .cover img { opacity: 1.0; } #feature .entry .democracy { background: #f7f7f7; margin: 10px 0; padding: 20px 150px 20px; overflow: hidden; } #feature .entry .democracy h3 { padding: 0 0 7px; margin: 0 0 8px; border-bottom: 1px solid #edece6; } #feature .entry .democracy .dem-results { margin: 0; } #feature .entry .democracy .dem_vote_link { text-align: right; padding: 6px 0 0 !important; } #feature .entry .democracy ul { list-style: none; margin: 0 0 8px 0; padding: 0; } #feature .entry .democracy ul li { background: none; list-style: none; font-size: 11px; overflow: hidden; padding: 5px 0 0; } #feature .entry .democracy ul li input { margin: 4px 4px 8px 1px !important; } #feature .entry .democracy ul li label { margin: 0 0 12px 0 !important; padding: 0 0 2px; } #feature .entry .democracy .pollbar { background: url(images/pollbar.png) top left no-repeat; height: 14px; width: 300px; margin: 0 0 5px; clear: both; } #feature .entry .democracy .pollbar_full { background: url(images/pollbar-full.png) top left no-repeat; height: 14px; } #feature .entry .democracy .dem-graph, #feature .entry .democracy .dem-winner, #feature .entry .democracy .dem-voted-for-this { border: none; } #feature .entry .democracy .poll_answer { float: left; display: inline; overflow: hidden; padding: 0 10px 5px 0; width: 250px; font-size: 11px; } #feature .entry .democracy .poll_percent { font-size: 9px; color: #a1a1a1; float: right; display: inline; overflow: hidden; width: 40px; text-align: right; padding: 0 0 5px; margin: 0; } #feature .entry .democracy .poll_submit { float: right; display: inline; overflow: hidden; font-size: 11px; } #feature .entry #greet_block { padding: 0 0 10px; } #feature .entry .greet_block { background: #f5f5f5; border: none; font-size: 12px; } #feature .entry .greet_block .greet_text { font-size: 12px; color: #666; line-height: 21px; display: inline-block; padding: 8px; } #feature .entry .greet_block .greet_text .greet_image { padding: 0 15px 0 0; } #feature .entry .greet_block .greet_text .greet_image a, #feature .entry .greet_block .greet_text .greet_image a:visited, #feature .entry .greet_block .greet_text .greet_image a:hover { background: none; } #feature .entry .artikel-img { position: relative; width: 600px; } #feature .entry .artikel-img a { display: block; padding: 0; margin: 0; } #feature.music .entry .artikel-img > a { background: #3ab19f; } #feature.design .entry .artikel-img > a { background: #ef305c; } #feature.fashion .entry .artikel-img > a { background: #fb7106; } #feature.tech .entry .artikel-img > a { background: #74c229; } #feature.lifestyle .entry .artikel-img > a { background: #1997b0; } #feature .entry .artikel-img a > img { padding: 0; margin: 0 0 -3px; opacity: 1.0; -webkit-transition: all 0.25s ease-in; -moz-transition: all 0.25s ease-in; -o-transition: all 0.25s ease-in; -ms-transition: all 0.25s ease-in; -transition: all 0.25s ease-in; -webkit-backface-visibility: hidden; } #feature .entry .artikel-img a:hover > img { opacity: 0.2; } #feature .entry .artikel-img .clip { position: absolute; z-index: 1; bottom: -15px; left: -45px; } #feature .entry .artikel-img .clip a { display: block; } #feature .entry .artikel-img .clip img { -webkit-transform: rotate(0); -moz-transform: rotate(0); -o-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: center top; -moz-transform-origin: center top; -o-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; -webkit-transition: all 0.15s ease-in; -moz-transition: all 0.15s ease-in; -o-transition: all 0.15s ease-in; -ms-transition: all 0.15s ease-in; -transition: all 0.15s ease-in; webkit-backface-visibility: hidden; } #feature .entry .artikel-img .clip:hover img { opacity: 1.0; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -o-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } #feature .entry .artikel-img .clip.alt { left: -37px; bottom: 58px; } #feature .entry .artikel-img .clip.alt img { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); } #feature .entry .artikel-img .clip.alt:hover img { opacity: 1.0; -webkit-transform: rotate(-1deg); -moz-transform: rotate(-1deg); -o-transform: rotate(-1deg); -ms-transform: rotate(-1deg); transform: rotate(-1deg); } #feature .small-share { margin: 0 0 10px; padding: 0 0 20px 0; overflow: hidden; font-size: 11px; border-bottom: 1px solid #ddd; } #feature .small-share ul { background: url(images/small-share.png) 176px 17px no-repeat; overflow: hidden; list-style: none; padding: 16px 0 0 258px; } #feature .small-share ul li { float: left; display: block; } #feature .small-share ul li.twitter { padding: 0 5px 0 0; } #feature .small-share ul li.facebook { padding: 0 20px 0 0; height: 20px; } #feature .small-share ul li.google { padding: 0; } #feature .small-share a, #feature .small-share a:visited { padding: 2px 15px 3px 23px; display: inline-block; color: #666; text-decoration: none; } #feature .small-share a:hover { color: #666; text-decoration: underline; } #feature .giveaway { margin: 0 0 10px; padding: 20px 0; border-bottom: 1px solid #ddd; text-align: center; } #feature .giveaway .giveaway-share { width: 55px; margin: 0 auto; } #feature .giveaway h2 { font-size: 17px; font-weight: normal; line-height: 25px; padding: 20px 0 0; width: 600px; margin: 0 auto; } #feature .share { background: #f5f5f5 url(images/sidebar-block.png) top left repeat-x; width: 600px; margin: 10px auto; overflow: hidden; border-top: 1px solid #eee; -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #feature .share .wrap { border-bottom: 3px solid #dcdcdc; overflow: hidden; } #feature .share .wrap .text { background: url(images/share.png) center center no-repeat; width: 139px; min-height: 93px; border-top: 1px solid #fff; border-right: 1px solid #dcdcdc; float: left; display: inline; overflow: hidden; } #feature .share .wrap .social { width: 425px; min-height: 63px; border-top: 1px solid #fff; border-left: 1px solid #fff; padding: 15px 17px; float: right; display: inline; overflow: hidden; } #feature .share ul { overflow: hidden; list-style: none; margin: 0; padding: 12px 0 0 0; } #feature .share ul li { float: left; display: block; margin: 0; line-height: normal; } #feature .share ul li.twitter { padding: 0 5px 0 0; } #feature .share ul li.facebook { padding: 0 20px 0 0; height: 20px; } #feature .share ul li.facebook a, #feature .share ul li.facebook a:visited { background: url(images/icons/facebook-share-button.png) 0 0 no-repeat; display: block; width: 62px; height: 20px; padding: 0; text-decoration: none; } #feature .share ul li.facebook a:hover { background: url(images/icons/facebook-share-button.png) 0 -20px no-repeat; text-decoration: none; } #feature .share ul li.facebook a span { display: none; } #feature .share ul li.google { padding: 0; } #feature .share a, #feature .share a:visited { padding: 2px 15px 3px 23px; display: inline-block; color: #666; text-decoration: none; } #feature .share a:hover { color: #666; text-decoration: underline; } #feature .info { width: 960px; } #feature.music .button span { background: #45b1a9; background: -moz-linear-gradient(top, #2b6460, #6cdfd7 0%, #45b1a9 96%, #42c6bd); background: -webkit-gradient(linear, left top, left bottom, from(#2b6460), to(#6cdfd7), color-stop(0, #45b1a9), color-stop(0.96, #42c6bd)); -webkit-box-shadow: 0 3px 3px #1b9a91; -moz-box-shadow: 0 3px 3px #1b9a91; } #feature.music .button:hover span { background: -moz-linear-gradient(top, #2b6460, #6cdfd7 0%, #45b1a9 96%, #42c6bd); background: -webkit-gradient(linear, left top, left bottom, from(#2b6460), to(#6cdfd7), color-stop(0, #45b1a9), color-stop(0.96, #62d4cc)); } #feature.music .button:active { -webkit-box-shadow: 0 3px 0 #1b9a91, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #1b9a91, 0 6px 4px rgba(0,0,0,.3); } #feature.music .button:active span { -webkit-box-shadow: 0 1px 2px #1b9a91; -moz-box-shadow: 0 1px 2px #1b9a91; } #feature.design .button span { background: #da1d4d; background: -moz-linear-gradient(top, #9a1436, #f587a3 0%, #da1d4d 96%, #e93b68); background: -webkit-gradient(linear, left top, left bottom, from(#9a1436), to(#f587a3), color-stop(0, #da1d4d), color-stop(0.96, #e93b68)); -webkit-box-shadow: 0 3px 3px #9a1436; -moz-box-shadow: 0 3px 3px #9a1436; } #feature.design .button:hover span { background: -moz-linear-gradient(top, #9a1436, #f587a3 0%, #da1d4d 96%, #e93b68); background: -webkit-gradient(linear, left top, left bottom, from(#9a1436), to(#f587a3), color-stop(0, #da1d4d), color-stop(0.96, #f35b83)); } #feature.design .button:active { -webkit-box-shadow: 0 3px 0 #9a1436, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #9a1436, 0 6px 4px rgba(0,0,0,.3); } #feature.design .button:active span { -webkit-box-shadow: 0 1px 2px #9a1436; -moz-box-shadow: 0 1px 2px #9a1436; } #feature.fashion .button span { background: #ec5f01; background: -moz-linear-gradient(top, #a43b0d, #f6a95f 0%, #ec5f01 96%, #f47c0e); background: -webkit-gradient(linear, left top, left bottom, from(#a43b0d), to(#f6a95f), color-stop(0, #ec5f01), color-stop(0.96, #f47c0e)); -webkit-box-shadow: 0 3px 3px #a43b0d; -moz-box-shadow: 0 3px 3px #a43b0d; } #feature.fashion .button:hover span { background: -moz-linear-gradient(top, #a43b0d, #f6a95f 0%, #ec5f01 96%, #f47c0e); background: -webkit-gradient(linear, left top, left bottom, from(#a43b0d), to(#f6a95f), color-stop(0, #ec5f01), color-stop(0.96, #f79c1a)); } #feature.fashion .button:active { -webkit-box-shadow: 0 3px 0 #a43b0d, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #a43b0d, 0 6px 4px rgba(0,0,0,.3); } #feature.fashion .button:active span { -webkit-box-shadow: 0 1px 2px #a43b0d; -moz-box-shadow: 0 1px 2px #a43b0d; } #feature.tech .button span { background: #64a722; background: -moz-linear-gradient(top, #52891c, #a7cf69 0%, #64a722 96%, #78be33); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#a7cf69), color-stop(0, #64a722), color-stop(0.96, #78be33)); -webkit-box-shadow: 0 3px 3px #52891c; -moz-box-shadow: 0 3px 3px #52891c; } #feature.tech .button:hover span { background: -moz-linear-gradient(top, #52891c, #a7cf69 0%, #64a722 96%, #78be33); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#a7cf69), color-stop(0, #64a722), color-stop(0.96, #a0c948)); } #feature.tech .button:active { -webkit-box-shadow: 0 3px 0 #52891c, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #52891c, 0 6px 4px rgba(0,0,0,.3); } #feature.tech .button:active span { -webkit-box-shadow: 0 1px 2px #52891c; -moz-box-shadow: 0 1px 2px #52891c; } #feature.lifestyle .button span { background: #0e87a9; background: -moz-linear-gradient(top, #1f7591, #5ec4dd 0%, #0e87a9 96%, #2ba3c9); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#5ec4dd), color-stop(0, #0e87a9), color-stop(0.96, #2ba3c9)); -webkit-box-shadow: 0 3px 3px #1f7591; -moz-box-shadow: 0 3px 3px #1f7591; } #feature.lifestyle .button:hover span { background: -moz-linear-gradient(top, #1f7591, #5ec4dd 0%, #0e87a9 96%, #2ba3c9); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#5ec4dd), color-stop(0, #0e87a9), color-stop(0.96, #39b7d3)); } #feature.lifestyle .button:active { -webkit-box-shadow: 0 3px 0 #1f7591, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #1f7591, 0 6px 4px rgba(0,0,0,.3); } #feature.lifestyle .button:active span { -webkit-box-shadow: 0 1px 2px #1f7591; -moz-box-shadow: 0 1px 2px #1f7591; } /*------------------------------------------------------------------ [4.3. Artikel / #artikel] */ #artikel { padding: 0; overflow: hidden; } #artikel .top { overflow: hidden; padding: 0 0 15px; } #artikel .title { width: 600px; margin: 0; padding: 15px 20px 0; float: left; display: inline; overflow: hidden; text-align: center; } #artikel.music .title { border-top: 10px solid #3ab19f; } #artikel.design .title { border-top: 10px solid #ef305c; } #artikel.fashion .title { border-top: 10px solid #fb7106; } #artikel.tech .title { border-top: 10px solid #74c229; } #artikel.lifestyle .title { border-top: 10px solid #1997b0; } #artikel .title p { font-size: 12px; color: #858585; line-height: 25px; } #artikel .title h1 { font-size: 24px; color: #000; padding: 1px 0 9px; } #artikel .title .category { background: url(images/hr.png) 0 8px repeat-x; width: 600px; margin: 0 auto; } #artikel .title .category p { background: #fff; font-weight: bold; padding: 0 11px; display: inline-block; line-height: normal; color: #777; } #artikel .title .category p span { display: inline-block; padding: 0 6px; font-weight: normal; color: #999; } #artikel .title .category a, #artikel .title .category a:visited { font-weight: bold; font-size: 13px; color: #666; text-decoration: none; } #artikel .title .category a:hover { color: #666; text-decoration: underline; } #artikel.music .title .category a { color: #1fa995; } #artikel.design .title .category a { color: #ef305c; } #artikel.fashion .title .category a { color: #ff5400; } #artikel.tech .title .category a { color: #6aae27; } #artikel.lifestyle .title .category a { color: #1097ab; } #artikel .quick-share { border-top: 10px solid #e1e2df; width: 300px; padding: 27px 20px 0 0; text-align: center; float: right; display: inline; overflow: hidden; } #artikel .quick-share ul { list-style: none; overflow: hidden; width: 252px; margin: 0 auto; } #artikel .quick-share ul li { float: left; display: inline; overflow: hidden; padding: 0; width: 65px; height: 65px; } #artikel .quick-share ul li.twitter { padding: 0 17px 0 0; } #artikel .quick-share ul li.facebook { width: 105px; padding: 2px 0 3px; } #artikel .quick-share ul li.google { padding: 2px 0 3px; } #artikel .content { overflow: hidden; padding: 0 0 20px; border-bottom: 1px solid #ddd; } #artikel .artikel { padding: 0 20px; width: 600px; float: left; display: inline; overflow: hidden; } #artikel .entry { font-size: 13px; color: #666; } #artikel .entry h1 { font-size: 25px; font-weight: bold; color: #000; margin: 7px 0 0; -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; -o-transition: color 0.2s ease-in; -ms-transition: color 0.2s ease-in; transition: color 0.2 ease-in; } #artikel .entry h1 a, #artikel .entry h1 a:visited { color: #000; text-decoration: none; } #artikel .entry h1 a:hover { text-decoration: none; } #artikel.music .entry h1 a:hover { color: #1fa995; } #artikel.design .entry h1 a:hover { color: #ef305c; } #artikel.fashion .entry h1 a:hover { color: #ff5400; } #artikel.tech .entry h1 a:hover { color: #6aae27; } #artikel.lifestyle .entry h1 a:hover { color: #1097ab; } #artikel .entry h2 { font-size: 16px; font-weight: 500; line-height: 31px; margin: 7px 0 0; } #artikel .entry h3 { font-size: 14px; color: #000; margin: 10px 0 0; } #artikel .entry p { width: 600px; padding: 10px 0 3px; text-align: justify; line-height: 25px; } #artikel .entry p a { font-weight: 500; -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; transition: color 0.2s ease-in; } #artikel .entry p a.button { margin: 0 0 15px; } #artikel .entry blockquote { background: #eee url(images/blockquote.png) top left repeat-x; margin: 10px 0; padding: 3px 20px 6px; font-style: italic; color: #777; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); } #artikel .entry blockquote p { width: auto; } #artikel .entry ul { list-style-position: inside; list-style: none; margin: 10px 0 0; } #artikel .entry ul li { background: url(images/list.png) 0 9px no-repeat; margin: 0 0 10px; padding: 0 0 0 18px; line-height: 23px; } #artikel .entry ol { list-style-position: inside; margin: 10px 0 6px; } #artikel .entry ol li { margin: 0 0 4px; line-height: 23px; } #artikel .entry pre { margin: 10px; } #artikel .entry .gallery { margin: 0 auto; padding: 15px 0 5px; width: 600px; } #artikel .entry .gallery-item { background: #000; float: left; display: block; text-align: center; width: 150px; height: 150px; margin: 0; } #artikel .entry .gallery img { width: 150px; height: 150px; margin: 0; border: none; opacity: 1.0; filter: alpha(opacity=100); } #artikel .entry .gallery a, #artikel .entry .gallery a:visited, #artikel .entry .gallery a:hover { background: none; } #artikel .entry .gallery-caption { margin: 0; } #artikel .entry .democracy { background: #f7f7f7; margin: 10px 0; padding: 20px 150px 20px; overflow: hidden; } #artikel .entry .democracy h3 { padding: 0 0 7px; margin: 0 0 8px; border-bottom: 1px solid #edece6; } #artikel .entry .democracy .dem-results { margin: 0; } #artikel .entry .democracy .dem_vote_link { text-align: right; padding: 6px 0 0 !important; } #artikel .entry .democracy ul { list-style: none; margin: 0 0 8px 0; padding: 0; } #artikel .entry .democracy ul li { background: none; list-style: none; font-size: 11px; overflow: hidden; padding: 5px 0 0; } #artikel .entry .democracy ul li input { margin: 4px 4px 8px 1px !important; } #artikel .entry .democracy ul li label { margin: 0 0 12px 0 !important; padding: 0 0 2px; } #artikel .entry .democracy .pollbar { background: url(images/pollbar.png) top left no-repeat; height: 14px; width: 300px; margin: 0 0 5px; clear: both; } #artikel .entry .democracy .pollbar_full { background: url(images/pollbar-full.png) top left no-repeat; height: 14px; } #artikel .entry .democracy .dem-graph, #artikel .entry .democracy .dem-winner, #artikel .entry .democracy .dem-voted-for-this { border: none; } #artikel .entry .democracy .poll_answer { float: left; display: inline; overflow: hidden; padding: 0 10px 5px 0; width: 250px; font-size: 11px; } #artikel .entry .democracy .poll_percent { font-size: 9px; color: #a1a1a1; float: right; display: inline; overflow: hidden; width: 40px; text-align: right; padding: 0 0 5px; margin: 0; } #artikel .entry .democracy .poll_submit { float: right; display: inline; overflow: hidden; font-size: 11px; } #artikel .entry #greet_block { padding: 0 0 10px; } #artikel .entry .greet_block { background: #f5f5f5; border: none; font-size: 12px; } #artikel .entry .greet_block .greet_text { font-size: 12px; color: #666; line-height: 21px; display: inline-block; padding: 8px; } #artikel .entry .greet_block .greet_text .greet_image { padding: 0 15px 0 0; } #artikel .entry .greet_block .greet_text .greet_image a, #artikel .entry .greet_block .greet_text .greet_image a:visited, #artikel .entry .greet_block .greet_text .greet_image a:hover { background: none; } #artikel.music h2 { color: #1fa995; } #artikel.design h2 { color: #ef305c; } #artikel.fashion h2 { color: #ff5400; } #artikel.tech h2 { color: #6aae27; } #artikel.lifestyle h2 { color: #1097ab; } #artikel .share { background: #f5f5f5 url(images/sidebar-block.png) top left repeat-x; margin: 15px 0 5px; overflow: hidden; border-top: 1px solid #eee; -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #artikel .share .wrap { border-bottom: 3px solid #dcdcdc; overflow: hidden; } #artikel .share .wrap .text { background: url(images/share.png) center center no-repeat; width: 139px; min-height: 93px; border-top: 1px solid #fff; border-right: 1px solid #dcdcdc; float: left; display: inline; overflow: hidden; } #artikel .share .wrap .social { width: 425px; min-height: 63px; border-top: 1px solid #fff; border-left: 1px solid #fff; padding: 15px 17px; float: right; display: inline; overflow: hidden; } #artikel .share ul { overflow: hidden; list-style: none; padding: 12px 0 0 0; } #artikel .share ul li { float: left; display: block; } #artikel .share ul li.twitter { padding: 0 5px 0 0; } #artikel .share ul li.facebook { padding: 0 20px 0 0; height: 20px; } #artikel .share ul li.google { padding: 0; } #artikel .share a, #artikel .share a:visited { padding: 2px 15px 3px 23px; display: inline-block; color: #666; text-decoration: none; } #artikel .share a:hover { color: #666; text-decoration: underline; } #artikel .ads { width: 600px; margin: 0 auto; padding: 20px 0 0; text-align: center; } #artikel .side { width: 320px; padding: 10px 0 0; float: right; display: inline; overflow: hidden; } #artikel .side .advertentie { background: #eee; width: 300px; height: 250px; margin: 0 0 20px; } #artikel.music .button span { background: #45b1a9; background: -moz-linear-gradient(top, #2b6460, #6cdfd7 0%, #45b1a9 96%, #42c6bd); background: -webkit-gradient(linear, left top, left bottom, from(#2b6460), to(#6cdfd7), color-stop(0, #45b1a9), color-stop(0.96, #42c6bd)); -webkit-box-shadow: 0 3px 3px #1b9a91; -moz-box-shadow: 0 3px 3px #1b9a91; } #artikel.music .button:hover span { background: -moz-linear-gradient(top, #2b6460, #6cdfd7 0%, #45b1a9 96%, #42c6bd); background: -webkit-gradient(linear, left top, left bottom, from(#2b6460), to(#6cdfd7), color-stop(0, #45b1a9), color-stop(0.96, #62d4cc)); } #artikel.music .button:active { -webkit-box-shadow: 0 3px 0 #1b9a91, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #1b9a91, 0 6px 4px rgba(0,0,0,.3); } #artikel.music .button:active span { -webkit-box-shadow: 0 1px 2px #1b9a91; -moz-box-shadow: 0 1px 2px #1b9a91; } #artikel.design .button span { background: #da1d4d; background: -moz-linear-gradient(top, #9a1436, #f587a3 0%, #da1d4d 96%, #e93b68); background: -webkit-gradient(linear, left top, left bottom, from(#9a1436), to(#f587a3), color-stop(0, #da1d4d), color-stop(0.96, #e93b68)); -webkit-box-shadow: 0 3px 3px #9a1436; -moz-box-shadow: 0 3px 3px #9a1436; } #artikel.design .button:hover span { background: -moz-linear-gradient(top, #9a1436, #f587a3 0%, #da1d4d 96%, #e93b68); background: -webkit-gradient(linear, left top, left bottom, from(#9a1436), to(#f587a3), color-stop(0, #da1d4d), color-stop(0.96, #f35b83)); } #artikel.design .button:active { -webkit-box-shadow: 0 3px 0 #9a1436, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #9a1436, 0 6px 4px rgba(0,0,0,.3); } #artikel.design .button:active span { -webkit-box-shadow: 0 1px 2px #9a1436; -moz-box-shadow: 0 1px 2px #9a1436; } #artikel.fashion .button span { background: #ec5f01; background: -moz-linear-gradient(top, #a43b0d, #f6a95f 0%, #ec5f01 96%, #f47c0e); background: -webkit-gradient(linear, left top, left bottom, from(#a43b0d), to(#f6a95f), color-stop(0, #ec5f01), color-stop(0.96, #f47c0e)); -webkit-box-shadow: 0 3px 3px #a43b0d; -moz-box-shadow: 0 3px 3px #a43b0d; } #artikel.fashion .button:hover span { background: -moz-linear-gradient(top, #a43b0d, #f6a95f 0%, #ec5f01 96%, #f47c0e); background: -webkit-gradient(linear, left top, left bottom, from(#a43b0d), to(#f6a95f), color-stop(0, #ec5f01), color-stop(0.96, #f79c1a)); } #artikel.fashion .button:active { -webkit-box-shadow: 0 3px 0 #a43b0d, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #a43b0d, 0 6px 4px rgba(0,0,0,.3); } #artikel.fashion .button:active span { -webkit-box-shadow: 0 1px 2px #a43b0d; -moz-box-shadow: 0 1px 2px #a43b0d; } #artikel.tech .button span { background: #64a722; background: -moz-linear-gradient(top, #52891c, #a7cf69 0%, #64a722 96%, #78be33); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#a7cf69), color-stop(0, #64a722), color-stop(0.96, #78be33)); -webkit-box-shadow: 0 3px 3px #52891c; -moz-box-shadow: 0 3px 3px #52891c; } #artikel.tech .button:hover span { background: -moz-linear-gradient(top, #52891c, #a7cf69 0%, #64a722 96%, #78be33); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#a7cf69), color-stop(0, #64a722), color-stop(0.96, #a0c948)); } #artikel.tech .button:active { -webkit-box-shadow: 0 3px 0 #52891c, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #52891c, 0 6px 4px rgba(0,0,0,.3); } #artikel.tech .button:active span { -webkit-box-shadow: 0 1px 2px #52891c; -moz-box-shadow: 0 1px 2px #52891c; } #artikel.lifestyle .button span { background: #0e87a9; background: -moz-linear-gradient(top, #1f7591, #5ec4dd 0%, #0e87a9 96%, #2ba3c9); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#5ec4dd), color-stop(0, #0e87a9), color-stop(0.96, #2ba3c9)); -webkit-box-shadow: 0 3px 3px #1f7591; -moz-box-shadow: 0 3px 3px #1f7591; } #artikel.lifestyle .button:hover span { background: -moz-linear-gradient(top, #1f7591, #5ec4dd 0%, #0e87a9 96%, #2ba3c9); background: -webkit-gradient(linear, left top, left bottom, from(#52891c), to(#5ec4dd), color-stop(0, #0e87a9), color-stop(0.96, #39b7d3)); } #artikel.lifestyle .button:active { -webkit-box-shadow: 0 3px 0 #1f7591, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #1f7591, 0 6px 4px rgba(0,0,0,.3); } #artikel.lifestyle .button:active span { -webkit-box-shadow: 0 1px 2px #1f7591; -moz-box-shadow: 0 1px 2px #1f7591; } /*------------------------------------------------------------------ [4.4. Pagina / #pagina] */ #pagina { padding: 0; overflow: hidden; } #pagina .top { border-top: 10px solid #e1e2df; width: 960px; overflow: hidden; } #pagina .title { margin: 0; padding: 32px 40px; text-align: left; } #pagina .title p { font-size: 14px; color: #858585; line-height: 25px; } #pagina .title p a, #pagina .title p a:visited { color: #858585; text-decoration: none; } #pagina .title p a:hover { color: #858585; text-decoration: underline; } #pagina .title p span { display: inline-block; padding: 0 6px; color: #aaa; } #pagina .title h1 { font-size: 32px; color: #000; padding: 1px 0 0; } #pagina .tabs { background: url(images/pagina-tabs.png) top left repeat-x; padding: 0 40px; height: 53px; font-size: 14px; } #pagina .tabs ul { list-style: none; padding: 10px 0 1px; overflow: hidden; } #pagina .tabs ul li { float: left; display: block; position: relative; margin: 0 0 0 -6px; } #pagina .tabs ul li a, #pagina .tabs ul li a:visited { display: block; height: 44px; padding: 12px 16px 15px; color: #343434; text-decoration: none; } #pagina .tabs ul li a:hover { color: #777; text-decoration: none; } #pagina .tabs ul li.current { font-weight: bold; height: 50px; margin: 0 6px 0 0; } #pagina .tabs ul li.current a { background: #fff; border-right: 1px solid #d3d4d1; overflow: hidden; } #pagina .content { overflow: hidden; } #pagina .entry { width: 560px; float: left; display: inline; overflow: hidden; padding: 20px 20px 30px 40px; font-size: 13px; color: #666; } #pagina .entry h1 { font-size: 25px; font-weight: bold; color: #000; margin: 7px 0 0; } #artikel .entry h1 a, #artikel .entry h1 a:visited { color: #000; text-decoration: none; -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; -o-transition: color 0.2s ease-in; -ms-transition: color 0.2s ease-in; transition: color 0.2 ease-in; } #artikel .entry h1 a:hover { text-decoration: none; } #artikel.music .entry h1 a:hover { color: #1fa995; } #artikel.design .entry h1 a:hover { color: #ef305c; } #artikel.fashion .entry h1 a:hover { color: #ff5400; } #artikel.tech .entry h1 a:hover { color: #6aae27; } #artikel.lifestyle .entry h1 a:hover { color: #1097ab; } #pagina .entry h2 { font-size: 16px; font-weight: 500; line-height: 31px; margin: 7px 0 0; color: #444; } #pagina .entry h3 { font-size: 14px; color: #000; margin: 10px 0 0; } #pagina .entry p { padding: 10px 0 3px; text-align: justify; line-height: 25px; } #pagina .entry p a { font-weight: 500; -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; transition: color 0.2s ease-in; } #pagina .entry p a.button { margin: 0 0 15px; } #pagina .entry hr { margin: 20px 0 10px; padding: 0; } #pagina .entry blockquote { background: #eee url(images/blockquote.png) top left repeat-x; margin: 10px 0; padding: 3px 20px 6px; font-style: italic; color: #777; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); } #pagina .entry blockquote p { width: auto; } #pagina .entry ul { list-style-position: inside; list-style: none; margin: 10px 0 0; } #pagina .entry ul li { background: url(images/list.png) 0 9px no-repeat; margin: 0 0 10px; padding: 0 0 0 18px; line-height: 23px; } #pagina .entry ol { list-style-position: inside; margin: 10px 0 6px; } #pagina .entry ol li { margin: 0 0 4px; line-height: 23px; } #pagina .entry pre { margin: 10px; } #pagina .entry #greet_block { display: none; } #pagina .entry .cycle { width: 560px; height: 300px; margin: 20px 0; } #pagina .redactie { overflow: hidden; } #pagina .redactie ul { list-style: none; padding: 20px 0 0 10px; } #pagina .redactie ul li { background: none; list-style: none; display: block; padding: 0 0 30px; overflow: hidden; } #pagina .redactie .gravatar { width: 100px; height: 100px; float: left; display: inline; overflow: hidden; padding: 0 30px 0 0; } #pagina .redactie .user { width: 420px; float: left; display: inline; overflow: hidden; } #pagina .redactie .user h2 { margin: 0; padding: 2px 0 9px; font-size: 28px; font-weight: bold; color: #000; } #pagina .redactie .user h3 { margin: 0; padding: 2px 0 7px; font-size: 23px; font-weight: bold; color: #000; } #pagina .redactie .user .functie { font-size: 14px; color: #888; } #pagina .redactie .user .functie p { margin: 0; padding: 0 0 10px; } #pagina .redactie .user .beschrijving { font-size: 13px; color: #666; } #pagina .redactie .user .beschrijving p { margin: 0; padding: 0 0 10px; } #pagina .redactie ul li .links { clear: both; padding: 0 0 0 130px; } #pagina .redactie ul li .links ul { list-style: none; padding: 0; margin: 0; } #pagina .redactie ul li .links ul li { list-style: none; display: block; float: left; position: relative; padding: 0 20px 0 24px; font-size: 12px; color: #666; } #pagina .redactie ul li .links ul li a, #pagina .redactie ul li .links ul li a:visited { color: #666; text-decoration: none; } #pagina .redactie ul li .links ul li a:hover { color: #666; text-decoration: underline; } #pagina .redactie ul li .links ul li.website { background: url(images/icons/website-big.png) 0 1px no-repeat; } #pagina .redactie ul li .links ul li.twitter { background: url(images/icons/twitter-big.png) 0 1px no-repeat; } #pagina .redactie ul li .links ul li.email { background: url(images/icons/email-big.png) 0 1px no-repeat; text-transform: lowercase; overflow: hidden; } #pagina .redactie ul li .links ul li.email .email-name { float: left; display: inline; overflow: hidden; } #pagina .redactie ul li .links ul li.email .email-domain { background: url(images/redactie-email.png) 1px 6px no-repeat; width: 83px; height: 17px; float: left; display: inline; overflow: hidden; } #pagina .redactie hr { margin: -10px 0 0; padding: 0 0 40px; } #pagina .abonneren { overflow: hidden; } #pagina .abonneren .block { width: 160px; float: left; display: inline; overflow: hidden; padding: 40px 40px 0 0; } #pagina .abonneren .block a, #pagina .abonneren .block a:visited { color: #666; text-decoration: none; } #pagina .abonneren .block a:hover { color: #666; text-decoration: underline; } #pagina .abonneren .block.last { float: right; padding: 40px 0 0; } #pagina .abonneren .block.twitter { background: url(images/icons/abonneren-twitter.png) -5px 15px no-repeat; } #pagina .abonneren .block.twitter a { color: #0ab7e2; } #pagina .abonneren .block.facebook { background: url(images/icons/abonneren-facebook.png) 0 15px no-repeat; } #pagina .abonneren .block.facebook a { color: #305dab; } #pagina .abonneren .block.rss { background: url(images/icons/abonneren-rss.png) -2px 15px no-repeat; } #pagina .abonneren .block ul { list-style: none; } #pagina .abonneren .block ul li { background: url(images/icons/rss-bullet.png) 23px 2px no-repeat; padding: 0 0 0 43px; font-size: 12px; } #pagina .abonneren .block ul li.main { background: url(images/icons/rss-16.png) 0 3px no-repeat; padding: 0 0 0 26px; font-size: 13px; } #pagina .abonneren .block ul li.main a { font-weight: 500; color: #ff6c00; } #pagina .contact { overflow: hidden; } #pagina .contact form { margin: 30px 0 0; } #pagina .contact form fieldset { padding: 3px 0 7px; } #pagina .contact form label { padding: 8px 0 0; width: 140px; float: left; display: inline; overflow: hidden; cursor: text; } #pagina .contact form .input { background: #f7f7f7; padding: 3px; border-radius: 3px; float: left; display: inline; overflow: hidden; } #pagina .contact form input { background: #fff; margin: 0; padding: 4px; border: 1px solid #ddd; font-size: 16px; color: #888; width: 200px; } #pagina .contact form input:focus { color: #000; } #pagina .contact form select { background: #fff; width: 216px; height: 33px; margin: 0; border: 1px solid #ddd; font-size: 13px; color: #888; } #pagina .contact form .input.textarea { margin: 10px 0 0; padding: 3px 3px 0; } #pagina .contact form textarea { width: 410px; max-width: 401px; margin: 0; padding: 4px; min-height: 150px; max-height: 220px; } #pagina .contact form button { margin: 0 0 0 2px; } #pagina .contact form .submit-button { padding: 0 0 0 140px; } #pagina.spot { overflow: hidden; } #pagina.spot h2 { color: #f66500; } #pagina.spot .top { height: 230px; border: none; overflow: visible; background: lightgray; border-bottom: 10px solid #EF7925; } #pagina.spot .top .head { z-index: 1; position: absolute; } #pagina.spot .top .logo { width: 180px; padding: 30px 30px 0 30px; background: white; height: 120px; z-index: 2; position: relative; top: 90px; box-shadow: 0 2px 12px rgba(0,0,0,0.37); } #pagina.spot .top .logo img { width: 180px !important; height: 120px !important; border: none; } #pagina.spot .content { background: #fff; position: relative; z-index: 3; } #pagina.spot .content .entry { padding: 30px 0; width: 960px; } #pagina.spot .content .entry .store { overflow: hidden; margin: 0 0 30px; } #pagina.spot .content .entry .bottom { clear: both; } #pagina.spot .content .entry .title { margin: 0; padding: 0 28px 17px 30px; overflow: hidden; } #pagina.spot .content .entry .title h1 { margin: 0; padding: 0; } #pagina.spot .content .entry .title .left { width: 210px; } #pagina.spot .content .entry .title .mid { float: left; display: inline; overflow: hidden; padding: 10px 0 0; } #pagina.spot .content .entry .title .mid a, #pagina.spot .content .entry .title .mid a:visited { background: #f4f4f4 url(images/button.png) 0 -2px repeat-x; margin: 0 0 3px; border: 1px solid #bbb; border-top: none; border-left: none; border-radius: 5px; margin: 0; padding: 4px 9px 5px 10px; font-weight: bold; font-size: 10px; letter-spacing: 0.1em; color: #666; text-transform: uppercase; -webkit-font-smoothing: antialiased; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; text-shadow: 1px 1px #fff; cursor: pointer; display: inline-block; text-decoration: none; } #pagina.spot .content .entry .title .mid a:hover { background: #f4f4f4 url(images/button.png) 0 -33px repeat-x; color: #666; text-decoration: none; padding: 4px 9px 5px 10px; border: 1px solid #ddd; border-top: none; border-left: none; } #pagina.spot .content .entry .title .right { width: 300px; text-align: left; padding: 5px 0 0; } #pagina.spot .content .entry .information { float: left; width: 220px; clear: both; padding: 0 0 0 30px; width: 180px; margin: -3px 30px 0 0; } #pagina.spot .content .entry .information h1 { font-size: 26px; font-weight: bold; color: #000; margin: 0 0 1px; } #pagina.spot .content .entry .information h2 { margin: 15px 0 6px; } #pagina.spot .content .entry .information p { text-align: left; font-size: 12px; line-height: 25px; } #pagina.spot .content .entry .meta { width: 200px; margin: 0 0 12px; } #pagina.spot .content .entry .meta p { margin: 0; padding: 0; line-height: 23px; } #pagina.spot .content .entry .map { float: left; width: 360px; height: 360px; margin: 0 30px 0 0; } #pagina.spot .content .entry .brands { float: left; width: 300px; border: 1px solid #e5e5e5; box-shadow: 0 1px 1px rgba(0,0,0,0.26); border-radius: 4px; } #pagina.spot .content .entry .brands ul { list-style: none; margin: 0; padding: 5px; overflow: hidden; } #pagina.spot .content .entry .brands ul li { background: none; padding: 0; display: block; float: left; width: 133px; height: 133px; } #pagina.spot .content .entry .brands ul li.one { margin: 12px 0 0 12px; } #pagina.spot .content .entry .brands ul li.two { margin: 12px 12px 0 0; } #pagina.spot .content .entry .brands ul li.three { margin: 0 0 12px 12px; } #pagina.spot .content .entry .brands ul li.four { margin: 0 12px 12px 0; } #pagina.spot .content .entry .brands ul li a { width: 133px; height: 133px; display: block; } #pagina.spot .content .entry .brands ul li img { width: 129px; height: 129px; margin: 2px; -webkit-transform: scale(0.85); -moz-transform: scale(0.85); -o-transform: scale(0.85); -ms-transform: scale(0.85); transform: scale(0.85); -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transform: all 0.1s ease-in-out; -ms-transform: all 0.1s ease-in-out; transform: all 0.1s ease-in-out; -webkit-backface-visibility: hidden; } #pagina.spot .content .entry .brands ul li:hover img { -webkit-transform: scale(1); } #pagina.spot .content .entry .social { float: left; clear: both; margin: 39px 0 0 30px; width: 180px; } #pagina.spot .content .entry .social ul { background: url(images/share.png) -3px -18px no-repeat; list-style: none; margin: 0; padding: 39px 0 0; } #pagina.spot .content .entry .social ul li { padding: 0 0 8px; margin: 0; } #pagina.spot .content .entry .ad { float: right; margin: 39px 30px 0 0; width: 300px; height: 250px; } #pagina.spot .content .entry .ad .tag { background: #ededed; border: 1px solid #e3e3e3; border-bottom: 1px solid #f5f5f5; width: 298px; position: relative; z-index: 1; box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.03); -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } #pagina.spot .content .entry .ad .tag p { border-top: 1px solid #fafafa; border-bottom: 1px solid #e3e3e3; padding: 0; margin: 0; text-align: center; font-size: 8px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3em; color: #777; line-height: 15px; text-shadow: 0 1px 1px #fff; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } #pagina.spot .content .entry .ad .advertentie { position: relative; z-index: 2; } #pagina.spot .content .entry .gerelateerd { float: left; width: 360px; margin: 0 0 0 30px; /* height: 250px; */ } #pagina.spot .content .entry .gerelateerd h2 { margin: 0 0 8px; } #pagina.spot .content .entry .gerelateerd .block { background: #f5f5f5 url(images/sidebar-block.png) top left repeat-x; border-top: 1px solid #eee; padding: 0; -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #pagina.spot .content .entry .gerelateerd ul { list-style: none; margin: 0 !important; } #pagina.spot .content .entry .gerelateerd ul li { background: none !important; padding: 0 !important; margin: 0 !important; line-height: normal; border-top: 1px solid #fff; border-bottom: 1px solid #e5e5e5; width: 360px; font-weight: 500; -webkit-transition: background 0.2s ease-in; -moz-transition: background 0.2s ease-in; transition: background 0.2s ease-in; -webkit-backface-visibility: hidden; } #pagina.spot .content .entry .gerelateerd ul li a, .gerelateerd ul li a:visited { display: block; padding: 19px 20px 20px; color: #444; text-decoration: none; overflow: hidden; } #pagina.spot .content .entry .gerelateerd ul li a:hover { background: none; text-decoration: none; } #pagina.spot .content .entry .gerelateerd ul li:hover { background: #fdfdfd !important; border-top: 1px solid #f2f2f2; border-bottom: 1px solid #e5e5e5; } #pagina.spot .content .entry .gerelateerd ul li:first-child { -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } #pagina.spot .content .entry .gerelateerd ul li:last-child { -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } #pagina.spot .content .entry .gerelateerd ul li .thumb { background: #fff; width: 70px; height: 70px; float: left; display: inline; overflow: hidden; -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); } #pagina.spot .content .entry .gerelateerd ul li .info { width: 232px; float: right; display: inline; overflow: hidden; } #pagina.spot .content .entry .gerelateerd ul li .info h3 { font-size: 13px; font-weight: 500; color: #000; line-height: 19px; margin: 0; } #pagina.spot .content .entry .gerelateerd ul li .info p { font-size: 11px; font-weight: normal; color: #777; line-height: 25px; padding: 0; } #header.shop { margin-top: 20px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #header.shop, #header.shop .background, #header.shop .background img { height: 130px; } #header.shop .title { margin: 8px 0 0 3px; } #content.shop { margin-top: 0; } #content.shop #overzicht { width: 880px; padding: 40px; overflow: hidden; } #content.shop #overzicht .item { height: 420px; width: 420px; background: gray; float: left; display: inline; overflow: hidden; position: relative; } #content.shop #overzicht .item .mask { background: url(images/shop/item-shadow.png) 0 0 no-repeat; width: 420px; height: 420px; position: absolute; top: 0; left: 0; display: block; z-index: 10; } #content.shop #overzicht .item .info { background: url(images/shop/shirts-info.png) no-repeat center 330px; z-index: 20; position: absolute; width: 420px; height: 420px; text-indent: -9999px; opacity: 1.0; filter: alpha(opacity=100); overflow: hidden; } #content.shop #overzicht .item .images { position: absolute; } #content.shop #overzicht .item.shirts { margin-right: 40px; } #content.shop #overzicht .item.shirts .cycle { position: absolute; width: 420px; height: 420px; } #content.shop #overzicht .item.shirts .cycle .shirt { background: url(images/shop/shirts.jpg) no-repeat; display: block; width: 420px; height: 420px; } #content.shop #overzicht .item.shirts .cycle .shirt.shirtEen { background-position: 0 0; } #content.shop #overzicht .item.shirts .cycle .shirt.shirtTwee { background-position: -420px 0; } #content.shop #overzicht .item.shirts .cycle .shirt.shirtDrie { background-position: 0 -420px; } #content.shop #overzicht .item.shirts .cycle .shirt.shirtVier { background-position: -420px -420px; } #content.shop #overzicht .item.shirts .images .shirts-hover { background: url(images/shop/shirts-hover.jpg) 0 0 no-repeat; width: 420px; height: 420px; opacity: 0; position: absolute; z-index: 5; top: 0; left: 0; -webkit-transition: opacity 0.35s ease-in; -moz-transition: opacity 0.35s ease-in; -o-transition: opacity 0.35s ease-in; -ms-transition: opacity 0.35s ease-in; transition: opacity 0.35s ease-in; -webkit-backface-visibility: hidden; } #content.shop #overzicht .item.shirts:hover .images .shirts-hover { opacity: 1; } #content.shop #overzicht .item.caps { background: #d12c32 url(images/shop/caps.jpg) 0 0 no-repeat; } #content.shop #overzicht .item.caps .info { background-image: url(images/shop/caps-info.png); } #content.shop #overzicht .item.caps .meer { background: url(images/shop/caps-meer.png) 0 0 no-repeat; width: 170px; height: 50px; position: absolute; left: 50%; margin: 0 0 0 -85px; bottom: -10px; box-shadow: 0 1px 3px rgba(0,0,0,0.45); -webkit-transition: bottom 0.2s ease-in; -moz-transition: bottom 0.2s ease-in; -o-transition: bottom 0.2s ease-in; -ms-transition: bottom 0.2s ease-in; transition: bottom 0.2s ease-in; -webkit-backface-visibility: hidden; } #content.shop #overzicht .item.caps:hover .meer { bottom: -4px; } #content.shop #overzicht .item.caps .images .caps-hover { background: url(images/shop/caps.jpg) -420px 0 no-repeat; width: 420px; height: 420px; opacity: 0; position: absolute; z-index: 5; top: 0; left: 0; -webkit-transition: opacity 0.35s ease-in; -moz-transition: opacity 0.35s ease-in; -o-transition: opacity 0.35s ease-in; -ms-transition: opacity 0.35s ease-in; transition: opacity 0.35s ease-in; -webkit-backface-visibility: hidden; } #content.shop #overzicht .item.caps:hover .images .caps-hover { opacity: 1; } /*------------------------------------------------------------------ [4.5. Gallery / #gallery-image] */ #gallery-image { padding: 0; overflow: hidden; } #gallery-image .image { background: #333; width: 960px; } #gallery-image .image .title { background: #fff; width: 900px; padding: 20px 30px 25px; text-align: center; -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.6); -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.6); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.6); } #gallery-image .image .title h1 { font-size: 26px; font-weight: normal; color: #000; padding: 1px 0 9px; } #gallery-image .image .title p { font-size: 13px; } #gallery-image .image .title p a, #gallery-image .image .title p a:visited { background: #bbb; display: inline-block; padding: 3px 12px 6px; font-weight: 500; text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.15); color: #fff; text-decoration: none; -moz-border-radius: 15px; border-radius: 15px; } #gallery-image .image .title p a:hover { background: #999; color: #fff; text-decoration: none; } #gallery-image .image .img { text-align: center; width: 900px; margin: 0 auto; position: relative; } #gallery-image .image .img img { margin: 30px 0; -moz-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.75); -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.75); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.75); } #gallery-image .image .navigation { position: absolute; width: 870px; padding: 20px 45px 25px; overflow: hidden; top: 50%; margin: -25px 0 0; } #gallery-image .image .navigation .left { background: url(images/gallery-navigation.png) top left no-repeat; width: 50px; height: 50px; overflow: hidden; } #gallery-image .image .navigation .left:hover { background-position: bottom left; } #gallery-image .image .navigation .right { background: url(images/gallery-navigation.png) top right no-repeat; width: 50px; height: 50px; overflow: hidden; } #gallery-image .image .navigation .right:hover { background-position: bottom right; } #gallery-image .image .navigation a { text-align: center; display: block; width: 50px; height: 50px; } #gallery-image .image .navigation a img { display: none; } /*------------------------------------------------------------------ [4.X. Sidebar / #sidebar] */ #sidebar { width: 300px; float: right; } #sidebar.big { margin: 30px 30px 0 0; } #sidebar.small { margin: 10px 20px 0 0; } #sidebar.big .item { margin: 0 0 30px; } #sidebar.small .item { margin: 0 0 20px; } #sidebar .item h2 { font-size: 15px; font-weight: bold; color: #000; padding: 0 0 10px; } #sidebar .advertentie { background: #eee; width: 300px; } #sidebar .advertentie iframe { display: block; } #sidebar .block { background: #f5f5f5 url(images/sidebar-block.png) top left repeat-x; border-top: 1px solid #eee; padding: 20px; -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } #sidebar .social { padding: 0; } #sidebar .social .block { padding: 0; } #sidebar .social .block.shuffle { margin: 0 0 10px; } #sidebar .social ul { list-style: none; } #sidebar .social ul li { border-top: 1px solid #fff; border-bottom: 1px solid #e5e5e5; width: 300px; height: 50px; font-weight: 500; -webkit-transition-property: background, color; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease-in; -moz-transition-property: background, color; -moz-transition-duration: 0.2s; -moz-transition-timing-function: ease-in; transition-property: background, color; transition-duration: 0.2s; transition-timing-function: ease-in; -webkit-backface-visibility: hidden; } #sidebar .social ul li a, #sidebar .social ul li a:visited { display: block; padding: 15px 19px 20px 52px; color: #444; text-decoration: none; } #sidebar .social ul li a:hover { background: none; color: #666; text-decoration: none; } #sidebar .social ul li:hover { background: #fdfdfd; border-top: 1px solid #f2f2f2; border-bottom: 1px solid #e5e5e5; } #sidebar .social ul li.twitter { -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } #sidebar .social ul li.rss { -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } #sidebar .social ul li.shuffle a { background: url(images/icons/shuffle-32.png) 10px 9px no-repeat; } #sidebar .social ul li.twitter a { background: url(images/icons/twitter-32.png) 10px 9px no-repeat; } #sidebar .social ul li.facebook a { background: url(images/icons/facebook-32.png) 10px 9px no-repeat; } #sidebar .social ul li.rss a { background: url(images/icons/rss-32.png) 10px 9px no-repeat; } #sidebar .social .right { padding: 10px 0 0; font-size: 12px; } #sidebar .populair { padding: 0; } #sidebar .populair .block { padding: 0; } #sidebar .populair ul { list-style: none; } #sidebar .populair ul li { border-top: 1px solid #fff; border-bottom: 1px solid #e5e5e5; width: 300px; font-weight: 500; -webkit-transition-property: background, color; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease-in; -moz-transition-property: background, color; -moz-transition-duration: 0.2s; -moz-transition-timing-function: ease-in; transition-property: background, color; transition-duration: 0.2s; transition-timing-function: ease-in; -webkit-backface-visibility: hidden; } #sidebar .populair ul li a, #sidebar .populair ul li a:visited { display: block; padding: 19px 20px 20px; color: #444; text-decoration: none; overflow: hidden; } #sidebar .populair ul li a:hover { background: none; text-decoration: none; } #sidebar .populair ul li:hover { background: #fdfdfd; border-top: 1px solid #f2f2f2; border-bottom: 1px solid #e5e5e5; } #sidebar .populair ul li:first-child { -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } #sidebar .populair ul li:last-child { -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } #sidebar .populair ul li .thumb { background: #fff; width: 70px; height: 70px; float: left; display: inline; overflow: hidden; -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); } #sidebar .populair ul li .thumb img { margin: 0 0 0 -15px; min-height: 70px; } #sidebar .populair ul li .info { width: 172px; float: right; display: inline; overflow: hidden; } #sidebar .populair ul li .info h3 { font-size: 13px; font-weight: 500; color: #000; line-height: 19px; } #sidebar .populair ul li .info p { font-size: 11px; font-weight: normal; color: #777; line-height: 25px; } /*------------------------------------------------------------------ [5. Reacties / #reacties] */ #reacties { background: #fff; width: 960px; margin: 20px auto 0; overflow: hidden; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); } #reacties h1 { font-weight: bold; font-size: 18px; color: #000; } #reacties hr { margin: 0; } #comments { width: 600px; margin: 0 auto; padding: 30px 10px; } #comments .comment { margin: 20px 0 0; padding: 20px 0 0; border-top: 1px solid #ddd; overflow: hidden; } #comments .comment .gravatar { float: left; display: inline; overflow: hidden; width: 50px; height: 50px; padding: 0 20px 0 0; position: relative; } #comments .comment .gravatar img { position: absolute; z-index: 1; } #comments .comment .gravatar .shadow { background: url(images/comment-shadow.png) top left no-repeat; width: 50px; height: 50px; display: block; position: absolute; z-index: 2; top: 0; left: 0; } #comments .comment .info { width: 130px; padding: 0 20px 0 0; float: left; display: inline; overflow: hidden; } #comments .comment .info h2 { font-size: 14px; font-weight: bold; color: #555; padding: 0 0 4px; } #comments .comment .info h2 a, #comments .comment .info h2 a:visited { color: #000; text-decoration: none; } #comments .comment .info h2 a:hover { color: #5cbb00; text-decoration: none; } #comments .comment .info p { font-size: 11px; color: #777; line-height: 19px; } #comments .comment .reactie { width: 380px; float: right; display: inline; } #comments .comment .reactie p { font-size: 12px; color: #666; line-height: 23px; } #reply { padding: 28px 30px 30px; overflow: hidden; } #reply h1 { padding: 0 0 20px 153px; } #reply .reageren { float: left; display: inline; overflow: hidden; width: 570px; } #reply .reageren .connect { width: 120px; float: left; display: inline; overflow: hidden; padding: 4px 30px 0 0; text-align: right; } #reply .reageren .connect h2 { font-size: 14px; color: #000; padding: 0 0 10px; } #reply .reageren .form { width: 420px; float: right; display: inline; overflow: hidden; } #reply .reageren .form form { margin: 0; } #reply .reageren .form form fieldset { padding: 3px 3px 7px; } #reply .reageren .form form .input { background: #f7f7f7; padding: 3px; border-radius: 3px; float: left; display: inline; overflow: hidden; } #reply .reageren .form form input { width: 172px; margin: 0; padding: 4px; border: 1px solid #ddd; font-size: 16px; color: #888; } #reply .reageren .form form input:focus { color: #000; } #reply .reageren .form form label { padding: 8px 0 0 14px; float: left; display: inline; overflow: hidden; } #reply .reageren .form form .input.textarea { margin: 10px 0 0; padding: 3px 3px 0; } #reply .reageren .form form textarea { width: 410px; max-width: 401px; margin: 0; padding: 4px; min-height: 150px; max-height: 220px; } #reply .reageren .form form button { margin: 0 0 0 2px; } #reply .reageren .form form .emoticons { width: 420px; float: right; display: inline; overflow: hidden; line-height: 25px; padding: 15px 0 0; } #reply .reageren .form form .emoticons input { display: none; } #reply .reageren .form form .emoticons img { padding: 4px; height: 15px; } #reply .reageren .form form .emoticons img:hover { padding: 4px; height: 15px; } #reply .reageren .form form .emoticons a { color: #fff; text-decoration: none; } #reply .advertentie { background: #eee; width: 300px; height: 250px; float: right; display: inline; overflow: hidden; } /*------------------------------------------------------------------ [6. Shuffle / #shuffle] */ #shuffle { width: 960px; height: 760px; margin: 20px auto 0; position: relative; } #shuffle .item { background: #fff; padding: 8px; width: 298px; height: 178px; display: block; position: absolute; -moz-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -moz-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-backface-visibility: hidden; } #shuffle .item.one { -moz-transform: rotate(8deg); -webkit-transform: rotate(8deg); transform: rotate(8deg); z-index: 5; top: 30px; left: 35px; } #shuffle .item.two { -moz-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); z-index: 10; top: 60px; left: 320px; } #shuffle .item.three { -moz-transform: rotate(7deg); -webkit-transform: rotate(7deg); transform: rotate(7deg); z-index: 15; top: 35px; left: 610px; } #shuffle .item.four { -moz-transform: rotate(-5deg); -webkit-transform: rotate(-5deg); transform: rotate(-5deg); z-index: 4; top: 215px; left: 90px; } #shuffle .item.five { -moz-transform: rotate(2deg); -webkit-transform: rotate(2deg); transform: rotate(2deg); z-index: 9; top: 225px; left: 390px; } #shuffle .item.six { -moz-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); z-index: 6; top: 400px; left: 0; } #shuffle .item.seven { -moz-transform: rotate(5deg); -webkit-transform: rotate(5deg); transform: rotate(5deg); z-index: 11; top: 380px; left: 295px; } #shuffle .item.eight { -moz-transform: rotate(-1deg); -webkit-transform: rotate(-1deg); transform: rotate(-1deg); z-index: 16; top: 410px; left: 590px; } #shuffle .item.nine { -moz-transform: rotate(-6deg); -webkit-transform: rotate(-6deg); transform: rotate(-6deg); z-index: 7; top: 550px; left: 120px; } #shuffle .item:hover { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); z-index: 20; } #shuffle .tile { background: #eee; width: 298px; height: 178px; display: block; float: left; position: relative; overflow: hidden; } #shuffle .tile img { margin: -1px 0 0 -1px; position: absolute; z-index: 1; } #shuffle .tile .hover { background: #000; width: 300px; height: 180px; display: none; position: absolute; z-index: 2; top: -1px; left: -1px; text-decoration: none; } #shuffle .tile .hover h1 { padding: 20px 28px 0; line-height: 25px; font-size: 15px; color: #fff; text-decoration: none; display: block; } #shuffle .tile .hover p { margin: -8px 0 0; padding: 0 28px; font-size: 12px; color: #fff; opacity: 0.7; filter: alpha(opacity=70); } #shuffle .tile.music .hover { background: transparent url(images/header/tile-music.png) top left repeat; } #shuffle .tile.design .hover { background: transparent url(images/header/tile-design.png) top left repeat; } #shuffle .tile.fashion .hover { background: transparent url(images/header/tile-fashion.png) top left repeat; } #shuffle .tile.tech .hover { background: transparent url(images/header/tile-tech.png) top left repeat; } #shuffle .tile.lifestyle .hover { background: transparent url(images/header/tile-lifestyle.png) top left repeat; } #shuffle .refresh { width: 420px; padding: 25px 30px 30px; position: absolute; top: 595px; left: 480px; z-index: 1; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); } body#blue #shuffle .refresh { background: url(images/footer/blue.png) top left repeat; } body#classic #shuffle .refresh { background: #363636; } body#clean #shuffle .refresh { background: #474e51; } body#retro #shuffle .refresh { background: url(images/footer/retro.png) top left repeat; } body#clouds #shuffle .refresh { background: url(images/footer/clouds.png) top left repeat; } body#redish #shuffle .refresh { background: url(images/footer/redish.png) top left repeat; } body#celebration #shuffle .refresh { background: #59b4bd; } #shuffle .refresh p { font-weight: 500; font-size: 14px; color: #fff; line-height: 25px; text-shadow: rgba(0,0,0,0.26) -1px -1px; } /*------------------------------------------------------------------ [7. Footer / #footer] */ #footer { width: 960px; margin: 20px auto 0; overflow: hidden; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.26); } #footer .footer { overflow: hidden; } body#blue #footer { background: url(images/footer/blue.png) top left repeat; } body#classic #footer { background: #363636; } body#clean #footer { background: #474e51; } body#retro #footer { background: url(images/footer/retro.png) top left repeat; } body#clouds #footer { background: url(images/footer/clouds.png) top left repeat; } body#redish #footer { background: url(images/footer/redish.png) top left repeat; } body#celebration #footer { background: #59b4bd; } #footer h2 { font-weight: bold; font-size: 14px; color: #fff; padding: 0 0 6px; } #footer ul.list { list-style: none; font-size: 12px; padding: 0 0 25px; } #footer ul.list li { display: block; } #footer ul.list li a, #footer ul.list li a:visited { font-weight: 500; color: #fff; opacity: 0.8; filter: alpha(opacity=80); display: inline-block; padding: 5px 0 2px; text-decoration: none; } #footer ul.list li a:hover { color: #fff; opacity: 1.0; filter: alpha(opacity=100); text-decoration: none; } #footer #switch { list-style: none; padding: 0; width: 420px; } #switch li { width: 60px; height: 60px; float: left; display: block; } #switch li a, #switch li a:visited { background: #fff; width: 50px; height: 50px; display: block; padding: 0; text-decoration: none; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.26); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.26); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.26); cursor: pointer; } #switch li a:hover { text-decoration: none; } #switch li a img { width: 40px; height: 40px; padding: 5px; margin: 0; opacity: 1.0; filter: alpha(opacity=100); } #switch li a img:hover { opacity: 0.8; filter: alpha(opacity=80); } #footer .achtergrond { padding: 25px 5px 25px; width: 430px; float: left; display: inline; overflow: hidden; text-align: center; } #footer .achtergrond h2 { padding: 0 0 16px; } #footer .sitemap { background: url(images/footer/logo.png) 20px 20px no-repeat; padding: 25px 25px 0 115px; width: 125px; float: left; display: inline; overflow: hidden; } #footer .user { padding: 25px 25px 0 25px; width: 160px; float: right; display: inline; overflow: hidden; } #footer .copyright { background: url(images/footer/copyright.png) top left repeat-x; padding: 15px 18px 16px; color: #fff; } #footer .copyright a, #footer .copyright a:visited { font-weight: bold; color: #fff; text-decoration: none; } #footer .copyright a:hover { color: #fff; text-decoration: underline; } /*------------------------------------------------------------------ [X. Misc] */ ::-moz-selection { background: #87d8e5; color: #36565c; } ::selection { background: #87d8e5; color: #36565c; } .tooltip { position: absolute; top: 0; left: 0; z-index: 9999; display: none; padding: 0; margin: 0; font-size: 12px; font-weight: bold; color: #fff; text-decoration: none; } .button, .button span { display: inline-block; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; font-size: 16px; font-weight: bold; color: #fff; } .button { -webkit-box-shadow: 0 3px 0 #ccc, 0 6px 6px rgba(0,0,0,.3); -webkit-transition: -webkit-box-shadow .15s ease-in-out; -moz-box-shadow: 0 3px 0 #ccc, 0 6px 6px rgba(0,0,0,.3); -moz-transition: -moz-box-shadow .15s ease-in-out; } .button span { padding: 4px 14px 7px; text-shadow: 0 -1px 2px rgba(0,0,0,.2); background: #8f8f8f; background: -moz-linear-gradient(top, #737373, #c4c4c4 0%, #8f8f8f 96%, #adadad); background: -webkit-gradient(linear, left top, left bottom, from(#737373), to(#c4c4c4), color-stop(0, #8f8f8f), color-stop(0.96, #adadad)); -webkit-box-shadow: 0 3px 3px #737373; -webkit-transition: -webkit-transform .15s ease-in-out, -webkit-box-shadow .15s ease-in-out; -moz-box-shadow: 0 3px 3px #737373; -moz-transition: -moz-transform .15s ease-in-out, -moz-box-shadow .15s ease-in-out; } .button:active { -webkit-box-shadow: 0 3px 0 #ccc, 0 6px 4px rgba(0,0,0,.3); -moz-box-shadow: 0 3px 0 #ccc, 0 6px 4px rgba(0,0,0,.3); } .button:active span { -webkit-box-shadow: 0 1px 2px #737373; -webkit-transform: translate(0, 3px); -moz-box-shadow: 0 1px 2px #737373; -moz-transform: translate(0, 3px); } img.centered, img.aligncenter { display: block; margin-left: auto; margin-right: auto; } img.alignright { padding: 4px 0 0; margin: 0 0 2px 16px; display: inline; } img.alignleft { padding: 4px 0 0; margin: 0 16px 2px 0; display: inline; } .alignright { float: right; } .alignleft { float: left; } /* TEMP FIX FOR SAMSUNG AD */ #sidebar .advertentie embed { margin: -15px 0 -3px; }