/*! normalize.css v1.0.1 | MIT License | git.io/normalize */ /* ========================================================================== HTML5 display definitions ========================================================================== */ /* * Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3. */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; } /* * Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */ audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } /* * Prevents modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /* * Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3, * and Safari 4. * Known issue: no IE 6 support. */ [hidden] { display: none; } /* ========================================================================== Base ========================================================================== */ /* * 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using * `em` units. * 2. Prevents iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-size: 100%; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ } /* * Addresses `font-family` inconsistency between `textarea` and other form * elements. */ html, button, input, select, textarea { font-family: sans-serif; } /* * Addresses margins handled incorrectly in IE 6/7. */ body { margin: 0; } /* ========================================================================== Links ========================================================================== */ /* * Addresses `outline` inconsistency between Chrome and other browsers. */ a:focus { outline: thin dotted; } /* * Improves readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* ========================================================================== Typography ========================================================================== */ /* * Addresses font sizes and margins set differently in IE 6/7. * Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } h2 { font-size: 1.5em; margin: 0.83em 0; } h3 { font-size: 1.17em; margin: 1em 0; } h4 { font-size: 1em; margin: 1.33em 0; } h5 { font-size: 0.83em; margin: 1.67em 0; } h6 { font-size: 0.75em; margin: 2.33em 0; } /* * Addresses styling not present in IE 7/8/9, Safari 5, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /* * Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. */ b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } /* * Addresses styling not present in Safari 5 and Chrome. */ dfn { font-style: italic; } /* * Addresses styling not present in IE 6/7/8/9. */ mark { background: #ff0; color: #000; } /* * Addresses margins set differently in IE 6/7. */ p, pre { margin: 1em 0; } /* * Corrects font family set oddly in IE 6, Safari 4/5, and Chrome. */ code, kbd, pre, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; } /* * Improves readability of pre-formatted text in all browsers. */ pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } /* * Addresses CSS quotes not supported in IE 6/7. */ q { quotes: none; } /* * Addresses `quotes` property not supported in Safari 4. */ q:before, q:after { content: ''; content: none; } /* * Addresses inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /* * Prevents `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ========================================================================== Lists ========================================================================== */ /* * Addresses margins set differently in IE 6/7. */ dl, menu, ol, ul { margin: 1em 0; } dd { margin: 0 0 0 40px; } /* * Addresses paddings set differently in IE 6/7. */ menu, ol, ul { padding: 0 0 0 40px; } /* * Corrects list images handled incorrectly in IE 7. */ nav ul, nav ol { list-style: none; list-style-image: none; } /* ========================================================================== Embedded content ========================================================================== */ /* * 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3. * 2. Improves image quality when scaled in IE 7. */ img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ } /* * Corrects overflow displayed oddly in IE 9. */ svg:not(:root) { overflow: hidden; } /* ========================================================================== Figures ========================================================================== */ /* * Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11. */ figure { margin: 0; } /* ========================================================================== Forms ========================================================================== */ /* * Corrects margin displayed oddly in IE 6/7. */ form { margin: 0; } /* * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /* * 1. Corrects color not being inherited in IE 6/7/8/9. * 2. Corrects text not wrapping in Firefox 3. * 3. Corrects alignment displayed oddly in IE 6/7. */ legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ *margin-left: -7px; /* 3 */ } /* * 1. Corrects font size not being inherited in all browsers. * 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5, * and Chrome. * 3. Improves appearance and consistency in all browsers. */ button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ *vertical-align: middle; /* 3 */ } /* * Addresses Firefox 3+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ button, input { line-height: normal; } /* * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Corrects inability to style clickable `input` types in iOS. * 3. Improves usability and consistency of cursor style between image-type * `input` and others. * 4. Removes inner spacing in IE 7 without affecting normal text inputs. * Known issue: inner spacing remains in IE 6. */ button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; /* 4 */ } /* * Re-set default cursor for disabled elements. */ button[disabled], input[disabled] { cursor: default; } /* * 1. Addresses box sizing set to content-box in IE 8/9. * 2. Removes excess padding in IE 8/9. * 3. Removes excess padding in IE 7. * Known issue: excess padding remains in IE 6. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ } /* * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /* * Removes inner padding and search cancel button in Safari 5 and Chrome * on OS X. */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /* * Removes inner padding and border in Firefox 3+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* * 1. Removes default vertical scrollbar in IE 6/7/8/9. * 2. Improves readability and alignment in all browsers. */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ========================================================================== Tables ========================================================================== */ /* * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } /* * HTML5 Boilerplate * * What follows is the result of much research on cross-browser styling. * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, * Kroc Camen, and the H5BP dev community and team. */ /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ html, button, input, select, textarea { color: #222; } body { font-size: 1em; line-height: 1.4; } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection declarations have to be separate. * Customize the background color to match your design. */ ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* * Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */ img { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } /* ========================================================================== Chrome Frame prompt ========================================================================== */ .chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } /* ========================================================================== Author's custom styles ========================================================================== */ /* ========================================================================== Helper classes ========================================================================== */ /* * Image replacement */ .ir { background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; } .ir:before { content: ""; display: block; width: 0; height: 100%; } /* * Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* * Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element to be focusable * when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } /* ========================================================================== EXAMPLE Media Queries for Responsive Design. Theses examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */ @media only screen and (min-width: 35em) { /* Style adjustments for viewports that meet the condition */ } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) { /* Style adjustments for high resolution devices */ } /* ========================================================================== Print styles. Inlined to avoid required HTTP connection: h5bp.com/r ========================================================================== */ @media print { * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links for images, or javascript/internal links */ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; /* h5bp.com/t */ } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } }/* * System notifications ************************/ .system_notifications .notice, .system_notifications .success, .system_notifications .warning, .system_notifications .error, .system_notifications .validation { position: absolute; top: 0; left: 50%; width: 300px; margin-left: -150px; border: 1px solid; padding: 15px 10px 15px 50px; background-repeat: no-repeat; background-position: 10px center; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; behavior: url(/assets/third_party/pie/PIE.php); z-index: 9999999999; } .system_notifications div.title{ font-weight: bold; } .system_notifications .notice { color: #00529B; background-color: #BDE5F8; background-image: url('/assets/themes/default/img/icons/info.png'); } .system_notifications .success { color: #4F8A10; background-color: #DFF2BF; background-image:url('/assets/themes/default/img/icons/success.png'); } .system_notifications .warning { color: #9F6000; background-color: #FEEFB3; background-image: url('/assets/themes/default/img/icons/warning.png'); } .system_notifications .error { color: #D8000C; background-color: #FFBABA; background-image: url('/assets/themes/default/img/icons/error.png'); } body{ margin: 0; } #info_message{ display: none; width: 100%; height: 51px; position: absolute; top: 0; position: fixed; z-index: 50000; margin: 0; padding: 0; } .center_auto{ margin: 0 auto; width: 950px; padding: 15px 25px; } #info_message .message_area{ float: left; width: 98%; } #info_message .message_area span.link_ribbon{ color: #999999; text-decoration: underline; cursor: pointer; } #info_message .button_area{ float: left; width: 11px; height: 10px; margin-top: 3px; } .error_bg{ background: url('../img/notification/error_bg.png') 0 0 repeat-x; } .error_bg .message_area{ font:bold 14px arial; color: #a20510; text-shadow: 0 1px 0 #fff; } .error_bg .button_area{ background: url('../img/notification/error_close.png') 0 0 no-repeat; cursor: pointer; } .error_bg .info_more_descrption{ -moz-box-shadow: 0 0 5px #b2495b; -webkit-box-shadow: 0 0 5px #b2495b; box-shadow: 0 0 5px #b2495b; } .succ_bg{ background: url('../img/notification/succ_bg.png') 0 0 repeat-x; } .succ_bg .message_area{ font:bold 14px arial; color: #2f7c00; text-shadow: 0 1px 0 #fff; } .succ_bg .button_area{ background: url('../img/notification/succ_close.png') 0 0 no-repeat; cursor: pointer; } .info_bg{ background: url('../img/notification/info_bg.png') 0 0 repeat-x; } .info_bg .message_area{ font:bold 14px arial; color: #0d9a95; text-shadow: 0 1px 0 #fff; } .info_bg .button_area{ background: url('../img/notification/info_close.png') 0 0 no-repeat; cursor: pointer; } .warn_bg{ background: url('../img/notification/warn_bg.png') 0 0 repeat-x; } .warn_bg .message_area{ font:bold 14px arial; color: #a39709; text-shadow: 0 1px 0 #fff; } .warn_bg .button_area{ background: url('../img/notification/warn_close.png') 0 0 no-repeat; cursor: pointer; } .clearboth{ clear: both; } .info_more_descrption{ display: none; width: 950px; height: 300px; background: #fff; margin: 0 auto; padding: 10px; background: #fbfbfb; overflow: auto; } .succ_bg .info_more_descrption{ -moz-box-shadow: 0 0 5px #56a25e; -webkit-box-shadow: 0 0 5px #56a25e; box-shadow: 0 0 5px #56a25e; }/** * html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) * Richard Clark (http://richclarkdesign.com) * http://cssreset.com */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, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend, caption, 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:0; 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;}/* change colours to suit your needs */ins { background-color:#ff9; color:#000; text-decoration:none;}/* change colours to suit your needs */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;}/* change border colour to suit your needs */hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}input, select { vertical-align:middle;} html, body { height: 100%; font-family: 'Noto Serif', sans-serif; color: #3a3a3a !important; font-size: 15px !important; line-height: 22px; } #body-wrap { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -60px; } /*6a6a6a 3b3b3b*/ #body-push {height:60px;} body{background:url(../img/header-bg.png) 0 0 repeat-x;} h1, h2, h3, .container h1, .container h2, .container h3, .content h1, .content h2, .content h3{ color: #94AF26; font-family: "Noto Serif", sans-serif; } h1, .container h1, .content h1 { font-size: 26px; font-weight: 400; line-height: 30px; margin: 0 0 25px; } h2, .container h2, .content h2 { font-size: 20px; font-weight: 400; line-height: 25px; margin: 35px 0 10px; } h3, .container h3, .content h3 { font-size: 18px; font-weight: 400; line-height: 20px; padding: 15px 0 5px; } .content ul { margin: 0 0 0 20px; padding: 0; } .content li { margin: 0; padding: 0; } /* h3 */ h3{margin:0!important;padding:0;} .header h3 { color: #fff; font-size: 16px; font-weight: 400; text-align: center; } p { margin-bottom: 20px; } strong { color: #000000; font-weight: 700; } .floatleft {float:left;} .floatright {float:right;} .absolute {position:absolute;} .relative {position:relative;} .green, a {color:#94AF26;} .blue {color:#94AF26;} #technical-info .green {text-decoration:none;} .general { color: #000 !important; text-decoration:none; } .wrapper{width:960px;margin:0 auto;} /*margin between column and widget 40px;*/ .column{width:620px;} .widget-wrapper { margin: -41px 0 0 0; } .widget{ font-family: 'Arial', 'Helvetica', sans-serif; position: relative; width: 100%; min-height: 160px; background: url(../img/shadow_bg.png) 0 0 repeat-x #fff; margin: 0 0 41px 0; z-index: 100; } .widget.nobg { background: none; } .container { width: 65%; } .sidebar { width: 32.5%; } .widget > .content { font-family: 'Arial', 'Helvetica', sans-serif; padding: 40px; line-height: 25px; } .widget > .content-small { padding: 25px 7.5% 0; font-size: 15px; } .widget > .content-news { background: #fff; margin-top: 60px; } .widget > .header { min-height: 21px; padding: 10px; background: url(../img/widget-header.png) 0 0 repeat; } .widget .shadow-left { position: absolute; top: 5px; left: -5%; width: 5%; height: 210px; background: url(../img/shadow_left.png) right 0 no-repeat; } .widget .shadow-right { position: absolute; top: 5px; right: -5%; width: 5%; height: 210px; background: url(../img/shadow_right.png) left 0 no-repeat; } .widget img{ max-width: 100%; width: 100%; } .large { width: 100%; } .header.large { background: url(../img/largeheader.png); } .loader, .loader-image { position: relative; margin: 0 auto; width: 100%; height: 100%; } .loader-image { position: absolute; left: 0; right: 0; background: url(../img/opacity.png) repeat; z-index: 99; } .gif { width: 32px; height: 32px; background: url(../img/ajax-loader.gif); position: absolute; left: 50%; margin-left: -16px; top: 50%; margin-top: -16px; } .table_pgi { border-left: 1px solid #dedede; border-top: 1px solid #dedede; } .table_pgi td { border-right: 1px solid #dedede; border-bottom: 1px solid #dedede; color: #1b1b1b; padding: 8px; } #brochure { height: 600px; margin-top: 25px; } hr { width: 100%; border-bottom: 1px solid #dedede; border-top: none; border-left: none; border-right: none; } #menumain { display: block; } #menumain-mobile, #footer_text_mobile { display: none; } #404page { margin-top: 200px; } #pageBanners { background: #e6e6e6; padding: 40px 0 0; margin: 100px 0 0 0; } #subnav { background-color: #eee; padding: 2.5%; width: 95%; font-size: 15px; font-weight: 700; } #subnav > li { position: relative; list-style: none; float: none; text-align: center; width: 100%; margin-top: 2px; } #subnav > li:first-child { margin-top: 0; } #subnav > li a { background: #fff; display:block; height: 20px; padding: 10px; } #subnav li.active > a, #subnav li:hover > a { color: #94AF26; } #subnav li.active > a { text-decoration: underline; } #subnav li a { text-decoration: none; color: #6a6a6a; } blockquote { background: #e8e8e8; border-radius: 5px; padding: 20px; color: #000; font-family:'Noto serif', serif; font-style: italic; font-size: 110%; } blockquote:before { content: "“ "; } blockquote:after { content: " ”"; } #agreeLabel{ display: block; position: relative; margin-top: 10px; } #agreeLabel input{ display: inline; width: 20px; } #agreeText{ display: inline; }a.button { background-image: url("../img/button-right.png"); background-position: right top; background-repeat: repeat-x; color: #ffffff !important; display: block; font-family: "Noto Serif",arial,sans-serif; font-size: 100%; padding: 9px 10px 7px; text-decoration: none; font-weight: 400; /*text-shadow: 0px 1px 0px #607c2b; filter: dropshadow(color=#607c2b, offx=0, offy=1);*/ } a.button:hover { text-decoration: underline; } a.button span { background: url("../img/link_arrow.png") no-repeat scroll right 1px rgba(0, 0, 0, 0); display: block; float: right; height: 19px; width: 30px; } .link-arrow-b { background: url("../img/link_arrow_b.png") no-repeat scroll 0 center rgba(0, 0, 0, 0); display: block; float: right; height: 62px; width: 50px; } .default-form input[type="text"], .default-form input[type="email"], .default-form select { border: 1px solid #dddddd; padding: 8px 5%; background: url(../img/input-bg.png) repeat-x; margin: 0 0 10px 0; font-style: normal; color: #6A6A6A; } ::-webkit-input-placeholder { color:#6A6A6A !important; font-style: italic !important;} ::-moz-placeholder { color:#6A6A6A !important; font-style: italic !important;} /* firefox 19+ */ input:-moz-placeholder { color:#6A6A6A !important; font-style: italic !important;} textarea:-moz-placeholder { color:#6A6A6A !important; font-style: italic !important;} .default-form select { background: url(../img/select-bg.png) repeat-x; height: 40px; } .default-form select { width: 100%; } .default-form { width: 100%; } .default-form input { width: 90%; } .default-form textarea { width: 90%; padding: 5%; margin-bottom: 10px; font-style: normal; border: 1px solid #ddd; background: url(../img/input-bg.png) repeat-x #F0F0F0; } #technical-info tr { border-bottom: 1px solid #DDDDDD; } #technical-info tr td { padding: 6px 0 0 10px; } #technical-information { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #D4D4D4; min-height: 510px; padding: 20px; position: relative; width: 600px; z-index: 20; margin-bottom: 60px; } a.glued, a.nonglued { width: 49px; height: 36px; display: block; } a.glued { background: url(../img/arrow-right.png) bottom left; opacity: 0.8; } a.nonglued { background: url(../img/arrow-right.png) bottom left; } .hoverable:hover { background: url(../img/subnav-bg.png) repeat-y scroll 0 0 #FFFFFF; } #technical-list { position:absolute; z-index:999; width: 240px; } #technical-list li { list-style: none; border-bottom: 1px solid #dedede; padding: 5px; width: 220px; margin-left: 1px; } #technical-list li:hover { } #technical-list > li:hover, #technical-list > li.active { background: url(../img/subnav-bg.png) #fff repeat-y; border-bottom: 1px solid #dedede; width: 248px; margin-left: 0; border-left: 1px solid #dedede; } #technical-list li .grams { padding: 6px 35px 0 0; } #technical-list li .container-glued {padding-right:25px;min-width:49px;min-height:1px;} #technical-list li .container-nonglued {} .small-border { display: none; width: 30px; height: 1px; background: #dedede; position: absolute; top: -1px; right: 0; } #technical-list li:hover .small-border, #technical-list li.active .small-border { display: block; } #banner-wrapper { width: 100%; height: 140px; } #banner-wrapper .wrapper { width: 960px; } .banners { padding: 0 40px; margin: 0; } .banners li { list-style: none; padding: 0; width: 30%; margin: 0 5% 5% 0; float: left; } .banners li:nth-child(3) { margin-right: 0; } .banners li a { display: block; text-align: center; max-height: 160px; text-decoration:none; color: #fff; text-transform: uppercase; font-size: 20px; font-weight: 700; } .banners li img { margin: 0 auto; width: 100%; } .banners .pageBannerContent { position: absolute; top: 0; left: 0; right: 0; text-align: center; padding: 20px; text-shadow: 1px 0px 1px rgba(0, 0, 0, 1), 3px 0px 3px rgba(0, 0, 0, 1), 5px 0px 5px rgba(0, 0, 0, 1); } .banners li h2 { background: url(../img/single-banner-bg.png); margin: 0; padding: 0; font-size: 14px; } .banners li .button-arrow { position: absolute; background: url("../img/banner-button.png") repeat scroll left top rgba(0, 0, 0, 0); border: 1px solid white; display: block; width: 48px; height: 34px; bottom: 25px; left: 50%; margin-left: -24px; } .banners li a:hover .button-arrow { background-position: bottom left; background-color: #fff; -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75); box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75); } .bannerwidth { height: 100%; overflow: hidden; width: 100%; background: url("../img/single-banner-bg.png") repeat scroll 0 0 rgba(0, 0, 0, 0); } .banners li a:hover .bannerwidth{ background-position: bottom left; } #sidecolumn { margin: 0; } #sidecolumn ul { margin:0 0 25px 0;padding:0; list-style:none; } #sidecolumn h2 { padding: 0; /*text-shadow: 0px 1px 0px #607c2b; filter: dropshadow(color=#607c2b, offx=0, offy=1);*/ } #sidecolumn li { margin-bottom: 20px; } #sidecolumn li .lbg { display: block; width: 150px; padding: 20px 0; height: 74px; text-align: center; background: url(../img/single-banner-bg.png); text-decoration:none; color: #fff; list-style: none; } #sidecolumn ul li .button-arrow { top: 50%; left: 50%; margin-left: -24px; display: block; width: 49px; height: 36px; background: url(../img/banner-button.png) top left repeat; } #sidecolumn ul li .button-arrow:hover { background-position: bottom left; } #sidecolumn ul li:first-child .widget.nobg {margin-top: 0;} #sidecolumn ul li .widget.nobg {margin-top: 50px;} #sidecolumn .header { background: url("../img/widget-header.png") repeat-x scroll 0 0 rgba(0, 0, 0, 0); height: 41px; width: 100%; } a.playmovie { position: absolute; top: 50%; left: 50%; margin-left: -24px; margin-top: -10px; width: 48px; height: 34px; background: url(../img/playbutton.jpg); } .franksbanners li:first-child { width: 30%; margin: 0; } .franksbanners li{ width: 30%; margin: 0 0 0 5%; float: left; list-style: none; } .cycle-button { background-color: #6c6c6c; background-position: center center; background-repeat: no-repeat; height: 50px; margin-top: -25px; position: absolute; top: 50%; width: 60px; z-index: 200; } .cycle-button:hover { cursor: pointer; background-color: #94AF26; } .cycle-prev { left: 0; background-image: url("../img/link_arrow_left.png"); } .cycle-next { right: 0; background-image: url("../img/link_arrow.png"); } #pager-container { position: relative; z-index: 200; text-align: center; margin: -45px 0 0 0; } #portfolio-pager { display: inline-block; background: #006FB9; text-align: center; padding: 5px 0 0px 5px; } #portfolio-pager > a { display: inline-block; padding: 5px; background: #777; margin: 0 5px 5px 0; } #portfolio-pager > a.cycle-pager-active, #portfolio-pager > a:hover { background: #ccc; } #header { margin: 0 auto; width: 960px; height: 90px; z-index: 1000; position: relative; } #top-header { position: absolute; top: 0; right: 0; } a#logo{ position: absolute; top: 15px; left: 0; width: 162px; height: 75px; display: block; background: url(../img/logo.png) no-repeat left center; background-size:162px 70px; } #moodContainer { position:relative; width:100%; height:440px; overflow:hidden; } #mood{ position: absolute; width:1180px; left:50%; top:0; height: 440px; margin: 0 0 0 -590px; /* if no mood banners are set in CMS show default */ /*background: url(../img/rheigroup-visual.jpg) no-repeat;*/ background-color: whitesmoke; } #mood img { width: auto; } #menumain { bottom: 0px; height: auto; margin: 0 auto; padding: 0; position: absolute; right: -10px; font-size: 16px; } #menumain > li { position: relative; list-style: none; float: left; } #menumain > li:first-child { margin-left: 0; } #menumain li.active > a, #menumain li:hover > a { color: #94AF26; } #menumain li.active > a { text-decoration: underline; } #menumain > li a { display:block; height: 20px; padding: 10px; } #menumain li a { text-decoration: none; color: #6a6a6a; } #menumain li.hasSubs:hover { -webkit-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); } #menumain ul { display: none; position: absolute; top: 40px; left: 0; background: #fff; margin: 0; padding: 0; -webkit-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); box-shadow: 0px 2px 2px 0px rgba(50, 50, 50, 0.75); z-index: 1000; } #menumain > li:hover ul { display: block; } #menumain ul li { margin: 0; padding: 0; list-style: none; } #menumain ul li a { display: block; font-size: 14px; padding: 10px 20px; width: 220px; } #menumain ul li a:hover { background: #94AF26; color: #fff; } #menutop, #menutop li { float: left; margin: 0; padding:0 0 0 10px; list-style: none; } #menutop a { display: block; height: 20px; font-size: 13px; padding: 4px 0px 4px 10px; color: #6a6a6a; text-decoration: none; } #menutop li.active a, #menutop a:hover { color: #94AF26; } #languages { padding: 3px 0 0 0 ; background: #fff; float: left; margin: 0 0 0 10px; } #languages li { list-style: none; float: left; margin-left: 10px; } #languages li span, #languages li a{ display: block; padding-bottom: 5px; } #languages li span, #languages li a:hover{ display: block; padding-bottom: 5px; border-bottom:2px solid #222; } .flag_nl-NL, .flag_en-US,.flag_en-us,.flag_nl-nl, .flag_fr-fr, .flag_fr-FR, .flag_es-es, .flag_es-ES { display: block; width: 22px; height: 16px; margin-bottom: 10px; } .flag_en-US, .flag_en-us { background: url(../img/en-us.png) no-repeat; } .flag_nl-NL, .flag_nl-nl { background: url(../img/nl-nl.png) no-repeat; } .flag_fr-FR, .flag_fr-fr { background: url(../img/fr-fr.png) no-repeat; } .flag_es-ES, .flag_es-es { background: url(../img/es-es.png) no-repeat; } #toggle-mobile-menu{ background-color: #eee; display: none; float: right; height: 21px; margin-top: 12px; padding: 12px 5%; text-align: center; text-decoration: none; } #newswidget { margin-top: 20px; font-family: arial,sans-serif; font-size: 15px; line-height: 17.5px; } #newswidget li { list-style: none outside none; margin-bottom: 7.5px; } #newswidget li a{ text-decoration: none; width: 60%; } #newswidget li a:hover { text-decoration: underline; } #newswidget li span { border-right: 2px solid #999; float: left; margin-right: 5%; width: 50px; } #prefooter { padding: 30px 0 20px; font-family: 'Helvetica','arial',sans-serif; background: #94AF26; } #prefooter ul{ list-style: none; margin: 0 40px; } #prefooter li{ float: left; width: 30%; margin: 0 5% 5px 0; } #prefooter li:nth-child(3n+3){ margin-right: 0; } #prefooter a{ text-decoration: none; color: #eee; } #prefooter a:hover{ text-decoration: underline; } #footer { width: 960px; margin: 0 auto; height: 325px; border-top: 1px solid #eee; } #footer a { color: #eee; } #footer-bottom { font-size: 14px; height: 22px; padding: 15px 0; width: 100%; color: #222; overflow:hidden; } #xtra-digital-lion{ margin-top: -2px; background: url("../img/xtra-digital-agency-lion.png") repeat scroll 0 0 rgba(0, 0, 0, 0); height: 30px; width: 26px; display: none; } #footer_text_desktop { margin: 0 40px; text-align: center; display: block; } .footerlogos{ float:right; margin: 0; } /* * FancyBox - jQuery Plugin * Simple and fancy lightbox alternative * * Examples and documentation at: http://fancybox.net * * Copyright (c) 2008 - 2010 Janis Skarnelis * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated. * * Version: 1.3.4 (11/11/2010) * Requires: jQuery v1.3+ * * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html */ #fancybox-loading { position: fixed; top: 50%; left: 50%; width: 40px; height: 40px; margin-top: -20px; margin-left: -20px; cursor: pointer; overflow: hidden; z-index: 1104; display: none; } #fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url('fancybox.png'); } #fancybox-overlay { position: absolute; top: 0; left: 0; width: 100%; z-index: 1100; display: none; } #fancybox-tmp { padding: 0; margin: 0; border: 0; overflow: auto; display: none; } #fancybox-wrap { position: absolute; top: 0; left: 0; padding: 20px; z-index: 1101; outline: none; display: none; } #fancybox-outer { position: relative; width: 100%; height: 100%; background: #fff; } #fancybox-content { width: 0; height: 0; padding: 0; outline: none; position: relative; overflow: hidden; z-index: 1102; border: 0px solid #fff; } #fancybox-hide-sel-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; z-index: 1101; } #fancybox-close { position: absolute; top: -15px; right: -15px; width: 30px; height: 30px; background: transparent url('fancybox.png') -40px 0px; cursor: pointer; z-index: 1103; display: none; } #fancybox-error { color: #444; font: normal 12px/20px Arial; padding: 14px; margin: 0; } #fancybox-img { width: 100%; height: 100%; padding: 0; margin: 0; border: none; outline: none; line-height: 0; vertical-align: top; } #fancybox-frame { width: 100%; height: 100%; border: none; display: block; } #fancybox-left, #fancybox-right { position: absolute; bottom: 0px; height: 100%; width: 35%; cursor: pointer; outline: none; background: transparent url('blank.gif'); z-index: 1102; display: none; } #fancybox-left { left: 0px; } #fancybox-right { right: 0px; } #fancybox-left-ico, #fancybox-right-ico { position: absolute; top: 50%; left: -9999px; width: 30px; height: 30px; margin-top: -15px; cursor: pointer; z-index: 1102; display: block; } #fancybox-left-ico { background-image: url('fancybox.png'); background-position: -40px -30px; } #fancybox-right-ico { background-image: url('fancybox.png'); background-position: -40px -60px; } #fancybox-left:hover, #fancybox-right:hover { visibility: visible; /* IE6 */ } #fancybox-left:hover span { left: 20px; } #fancybox-right:hover span { left: auto; right: 20px; } .fancybox-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; } #fancybox-bg-n { top: -20px; left: 0; width: 100%; background-image: url('fancybox-x.png'); } #fancybox-bg-ne { top: -20px; right: -20px; background-image: url('fancybox.png'); background-position: -40px -162px; } #fancybox-bg-e { top: 0; right: -20px; height: 100%; background-image: url('fancybox-y.png'); background-position: -20px 0px; } #fancybox-bg-se { bottom: -20px; right: -20px; background-image: url('fancybox.png'); background-position: -40px -182px; } #fancybox-bg-s { bottom: -20px; left: 0; width: 100%; background-image: url('fancybox-x.png'); background-position: 0px -20px; } #fancybox-bg-sw { bottom: -20px; left: -20px; background-image: url('fancybox.png'); background-position: -40px -142px; } #fancybox-bg-w { top: 0; left: -20px; height: 100%; background-image: url('fancybox-y.png'); } #fancybox-bg-nw { top: -20px; left: -20px; background-image: url('fancybox.png'); background-position: -40px -122px; } #fancybox-title { font-family: Helvetica; font-size: 12px; z-index: 1102; } .fancybox-title-inside { padding-bottom: 10px; text-align: center; color: #333; background: #fff; position: relative; } .fancybox-title-outside { padding-top: 10px; color: #fff; } .fancybox-title-over { position: absolute; bottom: 0; left: 0; color: #FFF; text-align: left; } #fancybox-title-over { padding: 10px; background-image: url('fancy_title_over.png'); display: block; } .fancybox-title-float { position: absolute; left: 0; bottom: -20px; height: 32px; } #fancybox-title-float-wrap { border: none; border-collapse: collapse; width: auto; } #fancybox-title-float-wrap td { border: none; white-space: nowrap; } #fancybox-title-float-left { padding: 0 0 0 15px; background: url('fancybox.png') -40px -90px no-repeat; } #fancybox-title-float-main { color: #FFF; line-height: 29px; font-weight: bold; padding: 0 0 3px 0; background: url('fancybox-x.png') 0px -40px; } #fancybox-title-float-right { padding: 0 0 0 15px; background: url('fancybox.png') -55px -90px no-repeat; } /* IE6 */ .fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png', sizingMethod='scale'); } .fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png', sizingMethod='scale'); } .fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png', sizingMethod='scale'); } .fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; } .fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png', sizingMethod='scale'); } .fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png', sizingMethod='scale'); } .fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png', sizingMethod='scale'); } .fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame { height: expression(this.parentNode.clientHeight + "px"); } #fancybox-loading.fancybox-ie6 { position: absolute; margin-top: 0; top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px'); } #fancybox-loading.fancybox-ie6 div { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png', sizingMethod='scale'); } /* IE6, IE7, IE8 */ .fancybox-ie .fancybox-bg { background: transparent !important; } .fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png', sizingMethod='scale'); } .fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }/* RESPONSIVENESSNESS 1180, Voor de Sfeerbanner */ @media (max-width: 1180px) { } /* RESPONSIVENESSNESS 960 */ @media (max-width: 960px) { .wrapper{ width: 95% !important; } #header { width: 95% ; height: 120px; transition: height 0.2s; } #menumain { display: block; top: 80px; } #prefooter li{ width: 50%; margin: 0 0 5px 0; } .banners li{ width: 47.5% !important; padding: 0 !important; margin: 0 2.5% 2.5% 0 !important; } } .hide-on-desktop { display: none; } /* RESPONSIVENESSNESS 640 */ @media (max-width: 640px) { .hide-on-desktop { display: block; } .wrapper, .container{ margin: 0 auto; min-width: 280px; transition: width 0.2s; } #header { height: 70px; width: 90%; margin: 0 auto; transition: height 0.2s ease 0s; } a#logo { background-size: auto 50px ; height: 50px; /* margin-left: 5%; margin-top: 10px; transition: background-size 0.5s ease 0s, margin 0.2s ease 0s; */ } #top-header{ display: none; } #toggle-mobile-menu{ display: block; } #footer_text_desktop{ display: none; } #footer_text_mobile { display: block; } #menumain { background-color: #eee; padding: 2.5%; display: none; top: 70px; left:0; right:0; width: 95%; z-index: 220; height: auto; bottom: auto; } #menumain li:hover { box-shadow: none !important; } #menumain li { width: 100%; margin: 1px 0; text-align: center; } #menumain li a { background-color: white; display: block; height: 100%; padding: 10px 5%; } #menumain li ul { display: none !important; } #moodContainer { min-height: 200px; height: auto; width: 100%; transition: height 0.2s; position: relative; } #mood { height: auto; width: 100%; margin: 0 auto; left: 0; } #mood img { width: 100%; } .sidebar { width: 100%; } .widget { margin-left: auto; margin-right:auto; min-height: 240px; width: 95%; } .widget > .content { padding: 7.5%; overflow: hidden; width: 85%; } .floatleft, .floatright{ float: none; } .banners { width: 82.5%; margin: 0 auto 0 !important; padding: 5% 0 0 !important; } .banners li{ width: 100% !important; padding: 0 !important; margin: 0 0% 2.5% !important; } .banners li a { height: auto; } .banners li:first-child, .banners li:nth-child(2n+1){ margin: 0 5% 5% 0 !important; } .banners li .lbg { width: 100%; } .banners li:nth-child(4){ display: block; } .cycle-sentinel{ display: none !important; } #pager-container { margin: 0; } #portfolio-pager{ padding: 5px 0 0; } #portfolio-pager a{ margin: 0 0 5px; padding: 0; width: 100%; height: 100%; } #portfolio-pager img { height: 100%; width: 100%; } #banner-wrapper { height: auto !important; } #prefooter li{ width: 100%; text-align: center; } #footer-bottom { padding-left: 5% !important; padding-right: 5% !important; width: 90% !important; height: auto; line-height: 1.2; } #xtra-digital-lion{ display: none !important; } #footer_text_mobile { text-align: center; } #footer_text_desktop { text-align: center; } .footerlogos { display: block; float: none; margin: 15px 30% 0; } /* PAGINA NIEUWS*/ #newsitem-wrap{ display:none; } .newsitem-wrap-mobile-goto{ display: block !important; padding: 15px; text-align: center; } #newsitem { border-left: none !important; width: 90% !important; } /* PAGINA CONTACT*/ #menumain.hide-on-mobile { display: block; } #pageBanners { display: none; } }