/** * RESET // last updated 30.05.2011 */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline: 0px; font-size:100%; vertical-align:baseline; background:transparent; } body { line-height:1; } article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; } nav ul { list-style:none; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; } ins { background-color:#ff9; color:#000; text-decoration:none; } mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; } del { text-decoration: line-through; } abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; } table { border-collapse:collapse; border-spacing:0; } hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:5px 0; padding:0; } textarea:focus, input:focus, a:focus { outline:none; } input[type='button'] { width:auto; overflow:visible; } ul { list-style:none; margin:0px; } ol { list-style-type: decimal; margin:0 0 0 20px; } .whitespace { margin:0 0 20px; } .clearfix:after { content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0; } .clearfix { display:inline-block; } html[xmlns] .clearfix { display:block; } * html .clearfix { height:1%; } /** * STYLES AND GLOBAL SETTINGS */ body { font:normal 11px/20px arial, helvetica, sans-serif; color:#959594; background:#edece9; } .noflow { overflow:hidden; padding:0 40px 0 23px; } .misc { -ms-overflow-y:scroll; overflow:-moz-scrollbars-vertical; overflow-y:scroll; } a, a.visited { color: #959594; text-decoration:none; } a:hover { color:#3c3c3c; } span.blue { color:#118bbe; text-decoration:underline; cursor:pointer; } h1 { font-size:24px; line-height:36px; font-weight:bold; } h2 { font-size:20px; line-height:30px; font-weight:normal; } h3 { font-size:15px; font-weight:bold; margin:0 0 10px;} h4 { font-size:14px; font-weight:normal; } h5 { font-size:13px; } textarea { padding:5px; border:1px solid #d9d9d9; font:normal 13px/20px Arial, sans-serif; color:#959594; } .input-container { position:relative; } .description-label { position:absolute; top:6px; left:7px; } .default { color:#ccc; font-style:italic; } input[type='text'] { padding:6px; border:1px solid #d9d9d9; } ul.list li { padding:3px 5px; } ul.list li input[type="radio"] { margin:0 7px 3px 0; } ul.list li label { font-size:14px; } /** * BUTTONS */ input[type='submit'], input[type='button'] { padding:6px 20px; background:#e4f5fc; border:1px solid #98cbe1; color:#686767; font: bold 11px/11px arial,helvetica,sans-serif; cursor:pointer; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } input[type='submit']:hover, input[type='button']:hover { background:#98cbe1; border:1px solid #80abbe; color:#fff; } .div-button { padding:8px 20px; background:#e4f5fc; border:1px solid #98cbe1; color:#686767; font: bold 11px/11px arial,helvetica,sans-serif; text-align:center; cursor:pointer; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } .div-button:hover { background:#98cbe1; border:1px solid #80abbe; color:#fff; } a.div-button { display:block; } .grey { background:#f5f5f5; border:1px solid #d9d9d9; color:#7e7e7e; /* color:#959594; */ } a.grey { color:#7e7e7e; } .grey:hover { background:#fff; color:#333; border:1px solid #d9d9d9; } .greyed-out { background:#fff; color:#333; border:1px solid #d9d9d9; } .greyed-out:hover { background:#f5f5f5; border:1px solid #d9d9d9; color:#7e7e7e; } .fixed_55 { float:left; width:55px; margin:10px 0 0; } input[type='submit'].red, input[type='button'].red, .red { background:#faeaea; border:1px solid #ec8181; color:#555; } input[type='submit'].red:hover, input[type='button'].red:hover, .red:hover { background:#cf1b1b; border:1px solid #cf1b1b; color:#fff; } /** * ERROR / ALERT */ .error-message { padding:10px 20px; background:#e4f5fc; border:1px solid #98cbe1; color:#686767; font: bold 12px/18px arial,helvetica,sans-serif; text-align:center; } #alertbg { position:fixed; top:0; left:0; width:100%; height:100%; background:#000; -moz-opacity:.60; filter:alpha(opacity=60); opacity:.60; z-index:21; } #alertbox-container { position:fixed; top:0; left:0; width:100%; height:100%; z-index:22; } #alertbox { width:300px; margin:60px auto; padding:10px 20px 20px; opacity:1; background:#fff; font-size:13px; line-height:24px; color:#555; box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); } #report-item { height:200px; } #alertbox .title { margin:0 0 5px; font-weight:bold; } #alertbox .text { margin:0 0 10px; line-height:16px; } #alertbox .buttons { float:right; } #alertbox textarea { width:288px; height:150px; margin:0 0 10px; resize:none; } /** * HEADER */ #header { position:relative; width:896px; margin:0 auto; } #header #headercontent { display:block; margin:0 5px 0; padding:0 10px 10px; background:#fff; } #header #headercontent #logo { float:left; width:164px; height:46px; margin:7px 0 0; background:url('../images/logo.png') 0 0 no-repeat; } #header #headercontent h2 { float:left; margin:23px 0 0 10px; color:#626262; font-size:14px; font-weight:normal;} div.login_button { float:left; } div.login_button a { display:block; height:14px; padding:7px 20px; margin:0 10px 0 0; background:#e4f5fc; border:1px solid #98cbe1; color:#686767; font: bold 11px/14px arial,helvetica,sans-serif; text-align:center; cursor:pointer; } div.login_button a:hover { display:block; background:#98cbe1; border:1px solid #80abbe; color:#fff; } #top-search { float:left; margin:0 5px 0 0; padding: 0px;} #top-search .searchbox-container { float:left; height:24px; margin:0; padding:2px; background:#fff; border-style:solid; border-color:#d9d9d9; border-width:1px 0 1px 1px; border-radius:3px 0 0 3px; } #top-search .searchbox-container #zoekBox { padding:4px 5px 2px; color:#bbb; vertical-align:top; border:0; width:120px; font:normal 12px/12px arial, helvetica, sans-serif; } #top-search #submit-search { height:34px; width:38px; border:0; background:url('../images/top-search.gif') 0 0 no-repeat; vertical-align:top; cursor:pointer; border-radius:0 3px 3px 0; } #top-nav { position:absolute; top:16px; right:20px; z-index:9; font-size:11px; } #top-nav #add { float:left; margin:0 10px 0 0; border:1px solid #d9d9d9; border-radius:3px; } #top-nav #add a { display:block; padding:4px 14px; color:#7e7e7e; font-weight:bold; background:#f5f5f5; } #top-nav #add a:hover { background:#fff; } #top-nav ul#top-menu { float:left; margin:0; padding:0; border-color:#d9d9d9; border-style:solid; border-width:1px; cursor:pointer; border-radius:0 3px 3px 0; } #top-nav ul#top-menu li { position:relative; float:left; margin:0; padding:0; background:#f5f5f5; font-weight:bold; border-right:1px solid #d9d9d9; } #top-nav ul#top-menu li a { float:left; padding:4px 14px; color:#7e7e7e; } #top-nav ul#top-menu li.parent { background:#f5f5f5 url('../images/top-menu-arrow.gif') right center no-repeat; } #top-nav ul#top-menu li.parent:hover { background:#fff url('../images/top-menu-arrow.gif') right center no-repeat; } #top-nav ul#top-menu li.parent a { padding:4px 30px 4px 14px; } #top-nav ul#top-menu li.last { border:0; } #top-nav ul#top-menu li#topnav2 { border:0; } #top-nav ul#top-menu li ul { position:absolute; top:28px; left:-1px; border:1px solid #d9d9d9; display:none; } #top-nav ul#top-menu li ul.left { left:-70px; } #top-nav ul#top-menu li ul:hover { display:block; } #top-nav ul#top-menu li ul li { padding:0; border:0; } #top-nav ul#top-menu li ul li a { display:block; width:102px; padding:4px 14px; background:#f5f5f5; } #top-nav ul#top-menu li ul li a:hover { background:#fff; color:#555; } #top-nav ul#top-menu li.parent:hover ul { display:block; } #user-loggedin { position:relative; float:left; height:28px; background:#f5f5f5 url('../images/top-menu-arrow.gif') right center no-repeat; border-color:#d9d9d9; border-style:solid; border-width:1px 0 1px 1px; border-radius:3px 0 0 3px; } #user-loggedin:hover { background:#fff url('../images/top-menu-arrow.gif') right center no-repeat; border-radius:3px 0 0 0; } #user-loggedin a { color:#7e7e7e; } #user-loggedin .thumb-small { float:left; } .thumb-small img { height:20px; width:20px; margin:4px; } #user-loggedin .name { float:left; padding:4px 20px 4px 2px; font-size:11px; font-weight:bold; } #user-loggedin .name span { display:block; width:80px; white-space:nowrap; overflow:hidden; } #user-loggedin ul { position:absolute; top:28px; left:-1px; border:1px solid #d9d9d9; display:none; } #user-loggedin:hover ul { display:block; } #user-loggedin ul li a { display:block; width:112px; padding:4px 14px; background:#f5f5f5; font-weight:bold; } #user-loggedin ul li a:hover { background:#fff; } #top-nav .blinkit-button { float:left; padding:4px 14px; background:#e4f5fc; border:1px solid #98cbe1; color:#686767; font-weight:bold; text-align:center; cursor:pointer; border-radius:0 3px 3px 0; } #top-nav .blinkit-button:hover { background:#98cbe1; border:1px solid #80abbe; color:#fff; } #sub-header { height:30px; margin:0px 5px 0; padding:10px 15px; background:#f4f3f1; border-bottom:1px solid #fff; } #sub-header .title { float:left; padding:5px 0 0; } #sub-header a.featured { font-size:13px; } #sub-header .buttons { float:right; } #sub-header a { font-size:18px; padding:0 20px 0 0; text-decoration:underline; color:#1689bb; } #sub-header a:hover { padding:0 20px 0 0; text-decoration:underline; color:#035579; } #sub-header a.active { color:#3c3c3c; text-decoration:none; } #sub-header a.subheader-button { float:left; margin:0 0 0 5px; padding:4px 14px; font-weight:bold; /* background:#f5f5f5; border:1px solid #d9d9d9; -grey- */ font-size:11px; text-align:center; color:#7e7e7e; text-decoration:none; cursor:pointer; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } #sub-header a.subheader-button:hover { background:#fff; color:#3c3c3c; } /** * FOCUS */ #focus { margin:0 auto; } #focus-inner { position:relative; height:294px; min-width:870px; margin:0 5px; padding:15px 0 15px 15px; background:#454545; } #focus-inner #video-container { float:left; width:522px; background:#fff; z-index:0; box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.35), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.35), 0 5px 4px -3px rgba(0, 0, 0, 0.06); } #col-videothumbs { float:left; width:125px; height:295px; background:#000; box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.20), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.20), 0 5px 4px -3px rgba(0, 0, 0, 0.06); } #col-videothumbs #viewport { position:relative; height:281px; overflow:hidden; } #col-videothumbs #thumb-container { position:absolute; top:0; left:0; } #col-videothumbs .videothumb { width:115px; height:58px; padding:5px; border-bottom:1px solid #4d4d4d; } #col-videothumbs .videothumb .view { width:115px; height:58px; overflow:hidden; } #col-videothumbs .videothumb img { width:115px; margin:-10px 0 0; cursor:pointer; } #scrollVideoThumbsButton { cursor:pointer; } #focus-close { position:absolute; top:15px; right:15px; height:20px; width:20px; background:url('../images/focus_close.png') 0 0 no-repeat; cursor:pointer; } #focus-close:hover { background:url('../images/focus_close.png') 0 -43px no-repeat; } #focus .col { float:left; height:295px; margin:0; padding:2px 0 0; } #focus .generic { width:204px; padding:2px 0 0 20px; } #focus #col-info { margin:0; } #focus #intro { width:205px; padding:0 0 0 18px; } #focus #col3 { } #focus .signup { display:block; height:34px; width:118px; margin:0 0 5px; background:url('../images/signup_focus.png') 0 0 no-repeat; border:1px solid #626160; cursor:pointer; } #focus .fb { background-position:-3px -3px; } #focus .twitter { background-position:-3px -48px; } #focus .live { background-position:-3px -91px; } #focus .signup:hover { border:1px solid #ccc; box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.20), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.20), 0 5px 4px -3px rgba(0, 0, 0, 0.06); } #focus a#like { display:block; height:75px; width:160px; background:url('../images/like_on_fb.png') 0 0 no-repeat; cursor:pointer; } #focus table td { padding:0 10px 12px 0; vertical-align:top; font-size:14px; color:#fff; } #focus table td a { color:#78cbef; text-decoration:underline; } /** * HOME / FLOW */ #container { width:896px; margin:20px auto 30px; } .blink { float:left; width:214px; margin:0 5px 10px; background:#fff; } .blink a { font-weight:bold; color:#888; } .blink .flow-image { margin:0 0 5px; padding:7px 7px 0; cursor:pointer; text-align:center; } .blink .flow-image .item .video-play { position:absolute; left:79px; height:65px; width:65px; background:url('../images/video_play_overlay.png') 0 0 no-repeat; } .blink .title { width:190px; padding:0 7px; font-weight:bold; color:#3c3c3c; line-height:15px; overflow:hidden; } .blink .reaction .comment { line-height:15px; } .blink .flow-social-container { width:200px; padding:0 7px 5px; } .blink .flow-social-container .flow-social { float:left; margin:0 8px 0 0; } .blink .reaction { position:relative; width:200px; padding:7px; border-top:1px solid #fff; background:#f6f2ef; } .blink .addcomment .thumb, .blink .reaction .thumb { float:left; height:35px; width:35px; margin:0 10px 0 0; } .blink .reaction .thumb img { height:30px; width:30px; } .blink .reaction .info { position:relative; float:left; width:155px; padding:0px 0 0; line-height:15px; } .blink .addcomment { width:200px; padding:7px; border-top:1px solid #fff; background:#f6f2ef; } .blink .addcomment .info { width:200px; padding:0; line-height:15px; } .blink .addcomment .info textarea { width:149px; height:30px; margin:0 0 7px; padding:2px; font-size:11px; line-height:14px; } .blink .addcomment .info input[type='button'] { float:right; padding:2px 10px; font-weight:normal; } .blink .social-buttons { position:absolute; top:12px; left:12px; display:none; z-index:99; } .blink .social-buttons .sbtn { float:left; padding:1px; /* background:#f5f5f5; border:1px solid #d9d9d9; -grey- */ text-align:center; cursor:pointer; font-weight:bold; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } .blink .social-buttons .sbtn:hover { background:#fff; color:#3c3c3c; } .blink .social-buttons .reblink { width:50px; } .blink .social-buttons .like { width:32px; margin:0 5px 0 26px; } .blink .social-buttons .comment { width:65px; } .delete-comment { position:absolute; top:5px; right:5px; display:block; height:8px; width:8px; background:url('../images/delete-comment.png') 0 0 no-repeat; } .view-list { padding:15px; border-top:2px solid #3c3c3c; } .view-list a { padding:0 10px 0 0; text-decoration:underline; color:#1689bb; line-height:28px; /*font-size:13px;*/} .cld1 { font-size:8px; } .cld2 { font-size:9px; } .cld3 { font-size:11px; } .cld4 { font-size:12px; } .cld5 { font-size:16px; } .cld6 { font-size:18px; } .cld7 { font-size:20px; } .cld8 { font-size:24px; } .cld9 { font-size:28px; } .cld10 { font-size:34px; } #scroll-to-top { position:fixed; bottom:0; right:20px; height:20px; width:80px; padding:10px; background:#fff; font-weight:bold; text-align:center; z-index:999; display:none; border-left:1px solid #ccc; border-top:1px solid #ccc; border-right:1px solid #ccc; -moz-border-radius:3px 3px 0 0; -webkit-border-radius:3px 3px 0 0; border-radius:3px 3px 0 0; } /** * ACCOUNT / ADMIN / HUISHOUDELIJKE PAGINA'S */ .misc { font:normal 13px/20px Arial, sans-serif; color:#555; } .misc #header { width:860px; } .misc #headercontent { width:830px; } .misc #headercontent h2 { display:none; } .misc #container { width:860px; } .misc #container #inner { margin:0 5px; background:#fff; border-top:2px solid #3c3c3c; } .misc #container #inner .title { padding:15px 25px; font-size:18px; border-bottom:1px solid #ebe8e3; color:#555; } .misc #container #inner .content { padding:25px; } .misc #container #inner .content .settings { float:left; width:550px; } .misc #container #inner .content a { color:#1689bb; text-decoration:underline; } .misc #container #inner .content a:hover { color:#035579; } .follow-list { width:500px; } .follow-list .user { padding:10px 0 0; border-bottom:1px solid #ebe8e3; } .follow-list .thumb-medium { float:left; width:60px; height:50px; margin:0 0 10px; } .follow-list .name { float:left; width:340px; height:50px; } .terms-ul { float:left; margin:10px 0 10px 20px; list-style:none; } .terms-ordner { float:left; width:30px; } .terms-definition { float:left; width:730px; } .terms-contact { padding:15px 0 10px 50px; } /** * SEARCH */ .xsearchNavbarContainer { height:25px; padding:20px 0 0; } .xsearchNavbarContainer a { float:left; padding:2px 7px; margin:0 5px 0 0; border:1px solid #d9d9d9; } .xsearchNavbarContainer a.navbarActivePageNumber { color:#fff; background:#959594; border:1px solid #959594 } .xsearchResult { margin:0 0 10px; padding:10px 0; border-bottom:1px solid #d9d9d9; } #xsearchResultMessage { margin:10px 0; } .xsearchHighlightedKeyword { background:#e4f5fc; } .navbarDots { float:left; margin:0 5px 0 0; padding:5px 5px 0; } .search-result-items-title { font-size:20px; line-height: 30px; } .search-result-items-title a { font-size:12px; } .xsearchSearchboxContainer { margin:0 0 20px; } .xsearchSearchboxContainer .searchButton, #formGlobalSearch .button { height:30px; width:38px; border:0; background:url('../images/top-search.gif') 0 0 no-repeat; cursor:pointer; } .xsearchSearchboxContainer .searchButton:hover, #formGlobalSearch .button:hover { height:30px; width:38px; border:0; background:url('../images/top-search.gif') 0 0 no-repeat; cursor:pointer; } .xsearchResultsContainer { padding:10px 0 0; } .search-result-item { width:500px; padding:10px 0; border-bottom:1px solid #eee; } .search-result-item h3 { margin:0; } .search-result-item-left { float:left; height:50px; width:50px; margin:0 10px 0 0; } .search-result-item-right { float:left; width:440px; } .truncate_more_link { padding:0 0 0 5px; font-size:10px; } /** * VERVOLG */ .view-overview { width:200px; padding:7px; background:#fff; } .view-overview .title { width:198px; margin:0 0 7px; line-height:14px; color:#555; font-weight:bold; overflow:hidden; white-space:nowrap; } .view-overview .thumbs { height:225px; margin:0 0 10px; } .view-overview .thumbs img { float:left; margin:0 3px 3px 0; } .vervolg { font-size:12px; color:#3c3c3c; } .vervolg #header { width:860px; } .vervolg #header #headercontent { width:860px; margin:0; } .vervolg #header #headercontent #top-nav { right:0; } .vervolg #container { width:860px; } .vervolg #container #side-left { float:left; width:230px; margin:0 15px 0 0; } .vervolg #container #main { float:left; width:615px; background:#fff; } .vervolg #container #main a { color:#118bbe; text-decoration:underline; font-weight:bold; } .vervolg #item { padding:30px; } .vervolg #item .social-buttons { float:left; margin:0 0 15px; } .vervolg #item .backlink { float:left; width:300px; margin:11px 0 0; padding:0 5px; text-align:right; } .vervolg #item .prev-next { float:left; margin:11px 0 0; } .vervolg #item .prev-next a { float:left; height:18px; width:31px; background:url('../images/prev-next.gif') 0 0 no-repeat; } .vervolg #item .prev-next a.prev { margin:0 5px 0 10px; } .vervolg #item .prev-next a.next { background-position:-61px 0; } .vervolg #item .info { padding:15px 30px 0; } .vervolg #item .description { margin:0 0 5px; } .vervolg .reaction { width:555px; padding:15px 30px 30px; border-top:1px solid #e7e7e7; } .vervolg .reaction .thumb-medium { float:left; margin:0 10px 0 0; } .vervolg .reaction .add-comment textarea { width:480px; margin:0 0 10px; } .vervolg .reaction .add-comment .button { float:right; margin:0 2px 0 0; } .vervolg #likes-container { padding:15px 30px; border-top:1px solid #e7e7e7; } .vervolg #likes-container td.left { width:60px; font-weight:bold; vertical-align:top; } .vervolg #likes-container td.right a { float:left; margin:0 3px 3px 0; } .vervolg #likes-container td.right { width:490px; } .vervolg #reblinks-container { padding:15px 30px; border-top:1px solid #e7e7e7; } .vervolg #reblinks-container td.left { width:60px; font-weight:bold; vertical-align:top; } .vervolg #reblinks-container .reblink { width:490px; margin:0 0 10px; } .vervolg #reblinks-container .reblink .thumb-medium { float:left; margin:0 10px 0 0; } .vervolg #reblinks-container .reblink .info { margin:10px 0 0; } /** * WHITEBOX */ .itemview { background:#fff; } #mainframe { position:relative; margin:0 auto; background:#fff; } #mainframe a { color:#118bbe; text-decoration:underline; font-weight:bold; } #mainframe #item { position:relative; padding:0 10px 10px; } #item #next { position:absolute; top:200px; right:-110px; height:100px; width:100px; background:url('../images/prev-next.png') -135px 33px no-repeat; cursor:pointer; } #item #prev { position:absolute; top:200px; left:-110px; height:100px; width:100px; background:url('../images/prev-next.png') 35px 33px no-repeat; cursor:pointer; } #item .backlink { padding:0 5px 10px; text-align:right; } #item .afbeelding { position:relative; float:left; width:765px; min-height: 100px; background:#eee; text-align:center; } #item .video { float:left; width:765px; min-height: 100px; background:#eee; } #item .video .social-buttons { position:relative; padding:10px 0 0; } #item .social-buttons { position:absolute; bottom:5px; left:5px; } #item .social-buttons .sbtn { float:left; height:29px; background:url('../images/custom-buttons.png') 0 0 no-repeat; cursor:pointer; } #item .social-buttons .reblink { width:88px; margin:0 522px 0 0; background-position:-78px 0; } #item .social-buttons .reblink:hover { background-position:-78px -37px; } #item .social-buttons .like { width:69px; margin:0 5px 0 0; } #item .social-buttons .like:hover { background-position:0 -37px; } #item .social-buttons .comment { width:71px; background-position:-174px 0; } #item .social-buttons .comment:hover { background-position:-174px -37px; } #item .info { float:left; width:495px; margin:0 20px 0 0; padding:10px 0; } #item .info .description { margin:0 0 15px; } #item .user { float:left; width:250px; padding:14px 0 10px; } #item .user .thumb-medium { float:left; margin:0 10px 0 0; } #item .user .username { float:left; width:190px; margin:0 0 5px; font-size:16px; white-space:nowrap; overflow:hidden; } #item .user .viewscount { margin:0 5px 0 0; } #item .interact { margin:5px 0 0; border-top:1px solid #e7e7e7; font-size:11px; text-decoration:underline; cursor:pointer; } .reaction { width:495px; padding:15px 0 20px; border-top:1px solid #e7e7e7; } .reaction .thumb-medium { float:left; margin:0 10px 0 0; } .reaction .thumb-medium img { height:30px; width:30px; } .reaction .comment { float:left; width:150px; padding:0 0 0px; } .info .reaction .comment { position:relative; width:430px; } .info .reaction .thumb { float:left; margin:0 10px 0 0; } .info .reaction .thumb-medium img { height:50px; width:50px; } .reaction .add-comment { float:left; width:424px; } .reaction .add-comment textarea { width:422px; margin:0 0 10px; } .reaction .add-comment .button { float:right; margin:0 2px 0 0; } .comment-save { -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } #likes-container { padding:10px 0; border-top:1px solid #e7e7e7; } #likes-container td.left { width:60px; font-weight:bold; vertical-align:top; } #likes-container td.right a { float:left; margin:0 3px 3px 0; } #likes-container td.right { width:435px; } #reblinks-container { padding:10px 0; border-top:1px solid #e7e7e7; } #reblinks-container td.left { width:60px; font-weight:bold; vertical-align:top; } #reblinks-container .reblink { width:435px; margin:0 0 10px; } #reblinks-container .reblink .thumb-medium { float:left; margin:0 10px 0 0; } #reblinks-container .reblink .info { width:370px; margin:5px 0 0; } .expandingArea { position:relative; border:1px solid #d9d9d9; background:#fff; } .expandingArea > textarea, .expandingArea > pre { margin:0; padding:5px; background:transparent; white-space:pre-wrap; word-wrap:break-word; outline:0; border:0; } .expandingArea > textarea { /* The border-box box model is used to allow * padding whilst still keeping the overall width * at exactly that of the containing element. */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; width: 100%; /* This height is used when JS is disabled */ height: 100px; } .expandingArea.active > textarea { /* Hide any scrollbars */ overflow:hidden; position:absolute; top:0; left:0; height:100%; /* Remove WebKit user-resize widget */ resize:none; } .expandingArea > pre { display:none; } .expandingArea.active > pre { display:block; /* Hide the text; just using it for sizing */ visibility:hidden; } #addBlink_input-url { padding:15px 0; } #addBlink_get-images { margin:15px 0 0; border-color:#d9d9d9; border-style:solid; border-width:1px 0 0 1px; display:none; } #addBlink_get-images .image-container { position:relative; float:left; width:180px; height:180px; padding:10px; border-color:#d9d9d9; border-style:solid; border-width:0 1px 1px 0; } #addBlink_get-images .image-container img { max-width:180px; max-height:180px; } #addBlink_get-images .size-container { text-align:center; } #addBlink_get-images .blink-handler { position:absolute; top:65px; left:65px; background:#e4f5fc; border:1px solid #98cbe1; box-shadow:0 2px 5px #000; font-weight:bold; display:none; } #addBlink_get-images .blink-handler a { display:block; padding:5px 20px; } #addBlink_get-images .blink-handler:hover a { color:#fff; } #addBlink_get-images .blink-handler:hover { background:#98cbe1; border:1px solid #80abbe; color:#fff; cursor:pointer; } #addBlink_get-images .image-container:hover .blink-handler { display:block; } #addBlink_submit-blink { padding:15px 0; display:none; } #addblink-url { width:467px; margin:0 5px 0 0; padding:6px 5px 5px; color:#bbb; } #close-whitebox { position:absolute; top:10px; right:10px; height:30px; width:140px; cursor:pointer; z-index:0; background:url('../images/whitebox_close.png') -11px 7px no-repeat; } #close-whitebox:hover { background-position:-11px -30px; } /** * FRIENDS */ .friends { font-size:12px; color:#3c3c3c; } .friends #header { width:860px; } .friends #header #headercontent { width:860px; margin:0; } .friends #header #headercontent #top-nav { right:0; } #friend-list { width:500px; } #friend-list td.top { padding:15px; font-size:18px; } #friend-list td { background:#fff; vertical-align:top; border-bottom:1px solid #ebe8e3; } #friend-list td.image { width:35px; padding:10px 0; } #friend-list td.image .thumb { float:left; } #friend-list td.info { padding:10px; line-height:17px; } #friend-list td.info a { color:#118bbe; text-decoration:underline; } #friend-list td.follow { width:60px; padding:15px 5px 0 0; } #friend-list td.last { padding:15px 0; border:0; } /** * USER */ #user-container { float:left; width:213px; margin:0px 5px 5px; } #user { padding:7px; background:#fff; color:#3c3c3c; border-top:2px solid #3c3c3c; } #user .name { margin:0 0 5px; font-size:18px; } #user a.name { display:block; margin:0 0 5px; font-size:18px; text-decoration:underline; color:#118bbe; } #user .connections { margin:0 0 15px; } #user .connections a { margin:0 10px 0 0; color:#118bbe; font-weight:bold; text-decoration:underline; } #user img { margin:0 0 15px; } #user .description { padding:15px 0; } #user .about { padding:10px 0; } #user .socialmedia-buttons { width:203px; } #user .socialmedia-buttons .smbtn { float:left; height:0; width:15px; margin:0 5px 0 0; padding:15px 0 0; background:url('../images/social-buttons.gif') 0 0 no-repeat; overflow:hidden; } #user .socialmedia-buttons .twitter { background-position:-86px 0px; } #user .socialmedia-buttons .facebook { background-position:-22px 0; } #user .socialmedia-buttons .rss { background-position:-44px 0; } #user .socialmedia-buttons .linkedin { background-position:-65px 0; } #user .socialmedia-buttons .youtube { background-position:-106px 0; } #user .socialmedia-buttons .hyves { background-position:-127px 0; } #views { float:left; } #views #sub-header { margin:0px 5px 10px; padding:10px 15px; font-size:18px; color:#3c3c3c; border:0; } #views .view-overview { float:left; margin:0 5px 5px; } #recent-activities { padding:15px 0 0; } .recent-activity { float:left; width:200px; margin:0 0 20px; line-height:16px; } .recent-activity .thumb { float:left; margin:0 5px 0 0; } #user .recent-activity .thumb img { margin:0; } .recent-activity .info a { color:#555; font-weight:bold; } #send-message-text { width:186px; height:20px; padding:5px; } #send-message-button { float:right; margin:5px 0 0; display:none; } /** * EDIT */ #edit-new table td { width:200px; padding:0 0 15px; } #edit-new table td .name { width:370px; } .placeholder { float:left; height:100px; width:210px; height:294px; margin:0 5px 5px; border:2px dotted #98cbe1; background:#e4f5fc; } #sub-header .buttons .active { } #views-container .active { box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); cursor:move; } /** * EDIT PROFILE */ #edit-profile td { padding:5px 0; vertical-align:top; } #edit-profile td.label { width:125px; } #edit-profile td.input { width:345px; } #edit-profile td.input input { width:300px; } #edit-profile td.input input[type="radio"] { width:10px; } #edit-profile td.input textarea { width:302px; height:80px; } #edit-profile td.input select { padding:5px; border:1px solid #d9d9d9; } #edit-profile td.input img.userimage { float:left; width:145px; margin:0 10px 0 0; padding:3px; border:1px solid #d9d9d9; } #edit-profile td.input .buttons { float:left; width:150px; } #edit-profile td.input .buttons .info { margin:0 0 10px; font-size:12px; color:#959594; } #edit-profile td.input .mail { width:345px; padding:5px 0; } #edit-profile td.input .setting { float:left; width:254px; padding:5px 0 0; } #edit-profile td.input .switchcontainer { padding:5px 0; } #edit-profile td.input .switch { position:relative; float:left; width:60px; height:21px; margin:4px 0 0; overflow:hidden; cursor:pointer; } #inner #edit-profile td.input .switch a.div-button { padding:4px; text-decoration:none; font-size:9px; color:#686767; } #inner #edit-profile td.input .switch a.div-button:hover { color:#fff; } #edit-profile td.input .switch .viewport { position:absolute; top:0; left:0; width:60px; height:21px; background:url('../images/yes_no_slider_viewport.png') 0 0 no-repeat; z-index:1; } #edit-profile td.input .switch .yesno { position:absolute; top:0; left:0; width:120px; height:27px; background:url('../images/yes_no_slider.gif') 0 0 no-repeat; } #edit-profile td.input .setting-options { float:left; } #edit-profile .liner { width:313px; margin:0 0 5px; padding:4px 0 0; border-bottom:1px solid #ebe8e3; } /** * BOOKMARKLET BROWSER UITLEG */ .browserbookmarklet { margin:0 0 20px; } /** * WHITEBOX / REBLINKBOX */ .overlaybg { position:fixed; top:0; left:0; width:100%; height:100%; background:#fff; -moz-opacity:.75; filter:alpha(opacity=75); opacity:.75; z-index:11; } .overlay { position:fixed; top:0; left:0; width:100%; height:100%; overflow:auto; z-index:12; } .whitebox { width:785px; margin:30px auto; padding:10px; background:#fff; opacity:1; font-size:13px; line-height:24px; color:#555; box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); } .reblinkbox { width:605px; margin:30px auto; padding:15px 20px 20px 20px; background:#fff; opacity:1; box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.25), 0 1px 5px 3px rgba(0, 0, 0, 0.05), 0 5px 4px -3px rgba(0, 0, 0, 0.06); } h2.reblink { position:relative; width:605px; font-size:18px; color:#3c3c3c; margin:0; } #close-reblink { position:absolute; top:6px; right:4px; height:22px; width:22px; z-index: 10; background:url('../images/custom-buttons.png') -264px -4px no-repeat; cursor:pointer; } #close-reblink:hover { background-position:-264px -41px; } h2.add { position:relative; width:605px; margin:0 0 30px; font-size:20px; text-transform:uppercase; text-align:center; color:#1689bb; font-weight:bold; } #add { font-size:13px; color:#4b4b4b; } #add .left { float:left; width:292px; padding:20px 10px 0 0; } #add .right { float:left; width:282px; padding:20px 0 0 20px; border-left:1px solid #d9d9d9; } #add .title { margin:0 0 30px; font-size:20px; color:#1689bb; text-align:center; } #add .action { margin:0 0 20px; } #add #addBlink { float:left; } #add .action .button { float:left; height:31px; width:87px; margin:7px 0 0; cursor:move; } #add .action .browse { cursor:pointer; } #add .action .arrow { float:left; height:40px; width:40px; background:url('../images/add_arrow.gif') 0 6px no-repeat; } #add .action .description { float:left; width:150px; } #add .info { font-style:italic; } /** * POPUP */ #popup { position:relative; width:605px; height:340px; margin:15px auto 0; font:normal 13px/20px Arial, sans-serif; color:#959594; } #popup .section { float:left; } #popup .left { width:220px; margin:0 20px 0 0; } #popup .left .image-container { min-height:200px; padding:10px; background:#fff; border:1px solid #d9d9d9; } #popup .left .url { white-space:nowrap; overflow:hidden; font-size:11px; text-align:center; } #popup .right { width:365px; position:relative; padding:0 0 10px; } #popup .right #selected-view { width:340px; margin:0 0 10px; padding:5px 10px; border:1px solid #d9d9d9; background:#fff url('../images/top-menu-arrow.gif') right center no-repeat; cursor:pointer; } #popup .right #options { position:absolute; top:0; left:0; height:263px; width:361px; background:#fff; box-shadow:0 2px 5px #bbb; z-index:1; display:none; } #popup .right #options ul { width:360px; height:210px; overflow:auto; border:1px solid #d9d9d9; } #popup .right #options ul li { padding:5px 10px; } #popup .right #options ul li.active-view { background:#f6fafc; } #popup .right #options ul li:hover { background:#e4f5fc; color:#3c3c3c; cursor:pointer; } #select-category { width:360px; background:#fff; box-shadow:0 2px 5px #bbb; z-index:1; } #select-category .title { padding:10px 10px 0; } #newview-categories { padding:10px; color:#1689bb; } #newview-categories li { float:left; padding:0 10px 10px 0; text-decoration:underline; cursor:pointer; } #newview-categories li:hover { color:#035579; } #popup .right #add-view-container { width:340px; padding:10px; border-color:#d9d9d9; background:#f9f9f9; border-style:solid; border-width:0 1px 1px; } #popup .right #add-view-container input[type='text'] { width:245px; margin:0 5px 0 0; } #popup .right textarea { width:350px; height:125px; margin:0 0 10px; } #popup .right .blinkcheck { position:relative; float:left; margin:0 10px 0 0; } #popup .right .blinkcheck input[type="checkbox"] { float:left; } #popup .right label.social { float:left; width:20px; background: url('../images/blinkit_sbtn.gif') 0 0 no-repeat; } #btnBlinkIt { float:left; } #blinkit_action { float:left; margin: 17px 0 0 10px; display:none; } #popup .right #chck_fb { background-position:0px 2px; } #popup .right #chck_t { background-position:-46px 2px; } #popup .right #chck_h { background-position:-92px 2px; } #input-description { position:relative; } #connectToTwitterDialog { display:none; position:absolute; top:-96px; left:-42px; width:118px; padding:10px 10px 22px 10px; background:url('../images/connect_to_twitter.gif') top center no-repeat;} #connectToTwitterDialog span { display:block; height:37px; line-height:16px; font-size:12px; color:#fff; text-align:center;} #connectToTwitter { width:108px; padding:7px 4px; } #connectToFacebookDialog { display:none; position:absolute; top:-96px; left:-57px; width:148px; padding:10px 10px 22px 10px; background: url('../images/connect_to_twitter.gif') top center no-repeat;} #connectToFacebookDialog span { display:block; height:37px; line-height:16px; font-size:12px; color:#fff; text-align:center;} #connectToFacebook { width:138px; padding:7px 4px; } #popup .right .button { margin:10px 0 0; } #blinkedSucces { width:400px; margin:100px auto 0; text-align:center; cursor:pointer; } /** * ERROR-PAGE */ #error-container { width:535px; margin:100px auto 0; padding:0 0 30px; background: url('../images/error-bottom.png') 0 bottom no-repeat; font-size:13px; } #error-inner { padding:20px; background:#fff; } #error-inner h2 { margin:0 0 10px; color:#626262; font-size:35px; line-height:40px; } #error-inner a { color:#1689bb; text-decoration:underline; } #error-inner a:hover { color:#035579; } #error-inner #leave-comment-container { margin:15px 0 0; padding:15px 0 0; border-top:1px solid #edece9; } #error-inner .thumb-medium { float:left; margin:1px 10px 0 0; } #error-inner #leave-comment textarea { width:422px; } #error-inner #leave-comment .button { float:right; margin:10px 1px 10px 0; } /** * ISOTOPE */ /* Start: Recommended Isotope styles */ /**** Isotope Filtering ****/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /**** Isotope CSS3 transitions ****/ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; transition-property: transform, opacity; } /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; transition-duration: 0s; } /* End: Recommended Isotope styles */ /* disable CSS transitions for containers with infinite scrolling*/ .isotope.infinite-scrolling { -webkit-transition: none; -moz-transition: none; transition: none; } #infscr-loading { position: fixed; text-align: center; bottom: 30px; left: 42%; z-index: 100; background: white; background: hsla( 0, 0%, 100%, 0.9 ); padding: 20px; color: #222; font-size: 15px; font-weight: bold; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } /** * MEDIAQUERIES */ @media only screen and (min-width: 244px), only screen and (max-width: 915px) { #header h2 { display:none; } #views { width:672px; } #col2, #col3, #col4 { display:none; } } @media screen and (min-width: 916px){ #header, #focus, #container { width:896px; } header h2 { display:none; } #col2, #col3, #col4 { display:none; } } @media screen and (min-width: 1140px){ #header, #focus, #container { width:1120px; } #views { width:896px; } #header h2 { display:block; } #col2 { display:block; } #col3, #col4 { display:none; } } @media screen and (min-width: 1364px){ #header, #focus, #container { width:1344px; } #views { width:1120px; } #col2, #col3 { display:block; } #col4 { display:none; } } @media screen and (min-width: 1590px){ #header, #focus, #container { width:1570px; } #views { width:1344px; } #col2, #col3 { display:block; } #col4 { display:none; } } @media screen and (min-width: 1815px){ #header, #focus, #container { width:1795px; } #views { width:1570px; } #col2, #col3, #col4 { display:block; } }