/** * Table of Contents * ------------------------------------------------- * 00 Sprite Images * 01 CSS Normalize * 02 Fonts * 03 Mixins * 04 Icons * 05 Themes * 06 Reset Elements * 07 Reusable Patterns * 08 Basic Structure * 09 Third Party Library * 10 Header * 11 Components * 12 Footer * 99 Overriding * ------------------------------------------------- */ .sprites-sprite, .icon-readmore, .icon-more-up-indicator, .icon-more-down-indicator, a:hover .icon-readmore, .tagline-banner.short-banner .wrap .banner .banner-image, .tagline-banner .wrap .banner .banner-image, .tagline-banner.new-layout .wrap .banner .banner-image, .calendar .fc-content .fc-event.fc-event-end:after, .calendar .fc-content .fc-event.fc-event-start:before, .custom-chosen .chosen-container-single .chosen-single div b, .custom-chosen .chosen-container-single .chosen-single:hover div b, .custom-chosen .chosen-container-single .chosen-single:active div b, .custom-chosen .chosen-container-single.chosen-container-active.chosen-with-drop .chosen-single div b, .header .top-navigation .navigation .menu > li.has-child > a:before, .header .top-navigation .navigation .menu > li.has-child > span.wrapper:before, .header .top-navigation .navigation .menu .expand-notification > a .notif-count:before, .header .top-navigation .expand-menu .sub-menu-child-indicator, .header .top-navigation .expand-menu .sub-menu-child-indicator.primary, .header .top-navigation .expand-menu .sub-menu-child-indicator.zebra, .header .top-navigation .expand-menu .sub-menu.cloning-menu li.has-menu a:after, .header .top-navigation .expand-menu .sub-menu li.has-menu a:after, .breadcrumb .wrap ul li:before, .user-role .wrap .field .component .login-role:after, .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectButton:after, .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li.selected:after, .user-role .wrap .field .component .login-role .ffSelectWrapper:hover .ffSelect .ffSelectButton:after, .user-role .wrap .field .component .login-role .ffSelectWrapper.active .ffSelect .ffSelectButton:after, .custom-datepicker .icon-area, .custom-uploader .icon-area, .custom-search .icon-area, .custom-combobox:after, .custom-combobox:hover:after, .custom-combobox.disabled:hover:after, .pagination .page-button .prev.disabled, .pagination .page-button .next.disabled, .pagination .page-button .prev.disabled:hover, .pagination .page-button .prev.disabled:active, .pagination .page-button .next.disabled:hover, .pagination .page-button .next.disabled:active, .pagination .page-button .prev, .pagination .page-button .next, .accordion .item-wrap.current .head .indicator, .toggle .item-wrap.current .head .indicator, .accordion .item-wrap .head .indicator, .toggle .item-wrap .head .indicator, .widget .widget-perspective-meter .perspective-meter:after, .widget .widget-performance-meter .performance-meter:after, .widget .widget-wheel-meter .wheel-meter:after, .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton:after, .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper:hover .ffSelect .ffSelectButton:after, .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper.active .ffSelect .ffSelectButton:after { background-image: url('../images/sprites-scf339f037c.png'); background-repeat: no-repeat; } .sprites-icon-sprite, .icon-burger-menu, .icon-burger-menu.white, .icon-search, .icon-information, .icon-download, .icon-download-disable, .icon-upload, .icon-marker, .icon-contact-mail, .icon-checklist, .icon-reply, .icon-edit, .icon-add, .icon-trash, .icon-facebook, .icon-twitter, .icon-rss, .icon-youtube, .icon-google-plus, .icon-view, .button.with-icon.icon-btn-add:before, .calendar table.fc-header .with-icon.icon-btn-add.fc-button-today:before, .button.with-icon.icon-btn-edit:before, .calendar table.fc-header .with-icon.icon-btn-edit.fc-button-today:before, .button.with-icon.icon-btn-delete:before, .calendar table.fc-header .with-icon.icon-btn-delete.fc-button-today:before, .button.with-icon.icon-btn-upload:before, .calendar table.fc-header .with-icon.icon-btn-upload.fc-button-today:before, .button.with-icon.icon-btn-download:before, .calendar table.fc-header .with-icon.icon-btn-download.fc-button-today:before, .button.with-icon.icon-btn-print:before, .calendar table.fc-header .with-icon.icon-btn-print.fc-button-today:before, .form-bubble .form-bubble-close, .form-bubble .fc-dialog .fc-dclose, .form-bubble .fc-dialog .fc-dclose:hover, .form-bubble .fc-dialog .fc-dclose:active, .calendar .fc-button-prev, .calendar .fc-button-prev:hover, .calendar .fc-button-prev:active, .calendar .fc-button-next, .calendar .fc-button-next:hover, .calendar .fc-button-next:active, .calendar .fc-dialog .fc-dclose, .calendar .fc-dialog .fc-dclose:hover, .calendar .fc-dialog .fc-dclose:active, .calendar .view-type .icon-grid-view, .calendar .view-type .icon-list-view, .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-prev, .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-next, .custom-chosen .chosen-container .chosen-search:after, .header .top-navigation .navigation .menu > li.expand-menu.current > a .icon-burger-menu, .header .top-navigation .navigation .menu > li.expand-menu.current > span.wrapper .icon-burger-menu, .body-navigation .nav-head.has-navigation .btn-nav.prev, .body-navigation .nav-head.has-navigation .btn-nav.next, .agenda-navigation .heading .icon-calendar, .agenda-navigation .nav-item .nav.prev-button, .agenda-navigation .nav-item .nav.next-button, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.prev, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.next, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.up, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.down, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.prev, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.next, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.up, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.down, .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .icon-indicator.icon-sad, .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .icon-indicator.icon-smile, .widget .widget-performance-meter .performance-meter .performance-legend .state-value .icon-indicator.icon-sad, .widget .widget-performance-meter .performance-meter .performance-legend .state-value .icon-indicator.icon-smile, .widget .widget-big-state .state-item .indicator.icon-checklist, .widget .widget-big-state .state-item .indicator.icon-sandwatch, .widget .widget-state .state-item .indicator.icon-checklist, .widget .widget-state .state-item .indicator.icon-sandwatch { background-image: url('../images/sprites-icon-s13acbdef73.png'); background-repeat: no-repeat; } .sprites-icon-widget-sprite, .icon-widget-action, .icon-widget-calendar, .icon-widget-finding, .icon-widget-schedule, .icon-widget-verified, .icon-widget-editor, .icon-widget-profile, .icon-widget-head-brain, .icon-widget-address, .icon-widget-company-information, .icon-widget-configuration, .icon-widget-data-matches, .icon-widget-event-created, .icon-widget-experience, .icon-widget-family-member, .icon-widget-formal-education, .icon-widget-informal-education, .icon-widget-language-skill, .icon-widget-open-vacancy, .icon-widget-other-info, .icon-widget-personal, .icon-widget-personal-data, .icon-widget-personal-doc, .icon-widget-reference, .icon-widget-search-doc, .icon-widget-statistic, .icon-widget-academic, .icon-widget-achievement, .icon-widget-attendance, .icon-widget-group, .icon-widget-message, .icon-widget-news, .icon-widget-recommended, .icon-widget-telephone, .icon-widget-performance { background-image: url('../images/sprites-icon-widget-sfc2ae37ecf.png'); background-repeat: no-repeat; } /*! normalize.css v3.0.1 | MIT License | git.io/normalize */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background: transparent; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `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; } /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ img { border: 0; } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ figure { margin: 1em 40px; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Contain overflow in all browsers. */ pre { overflow: auto; } /** * Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 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; } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * Remove default vertical scrollbar in IE 8/9/10/11. */ textarea { overflow: auto; } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*! Fonts using webfont */ /* Open sans */ @font-face { font-family: 'Open Sans'; src: url("../fonts/opensans/opensans-regular.eot?") format("eot"), url("../fonts/opensans/opensans-regular.woff") format("woff"), url("../fonts/opensans/opensans-regular.ttf") format("truetype"); font-weight: normal; } @font-face { font-family: 'Open Sans'; src: url("../fonts/opensans/opensans-light.eot?") format("eot"), url("../fonts/opensans/opensans-light.woff") format("woff"), url("../fonts/opensans/opensans-light.ttf") format("truetype"); font-weight: 300; } @font-face { font-family: 'Open Sans'; src: url("../fonts/opensans/opensans-bold.eot?") format("eot"), url("../fonts/opensans/opensans-bold.woff") format("woff"), url("../fonts/opensans/opensans-bold.ttf") format("truetype"); font-weight: bold; } @font-face { font-family: 'Open Sans'; src: url("../fonts/opensans/opensans-semibold.eot?") format("eot"), url("../fonts/opensans/opensans-semibold.woff") format("woff"), url("../fonts/opensans/opensans-semibold.ttf") format("truetype"); font-weight: 500; } @font-face { font-family: 'Open Sans'; src: url("../fonts/opensans/opensans-italic.eot?") format("eot"), url("../fonts/opensans/opensans-italic.woff") format("woff"), url("../fonts/opensans/opensans-italic.ttf") format("truetype"); font-weight: normal; font-style: italic; } @font-face { font-family: 'Open Sans'; src: url("../fonts/opensans/opensans-bolditalic.eot?") format("eot"), url("../fonts/opensans/opensans-bolditalic.woff") format("woff"), url("../fonts/opensans/opensans-bolditalic.ttf") format("truetype"); font-weight: bold; font-style: italic; } /* Interstate */ @font-face { font-family: 'Interstate'; src: url("../fonts/interstate/interstate-regular.eot?") format("eot"), url("../fonts/interstate/interstate-regular.woff") format("woff"), url("../fonts/interstate/interstate-regular.ttf") format("truetype"); font-weight: normal; } @font-face { font-family: 'Interstate'; src: url("../fonts/interstate/interstate-thin.eot?") format("eot"), url("../fonts/interstate/interstate-thin.woff") format("woff"), url("../fonts/interstate/interstate-thin.ttf") format("truetype"); font-weight: 100; } @font-face { font-family: 'Interstate'; src: url("../fonts/interstate/interstate-light.eot?") format("eot"), url("../fonts/interstate/interstate-light.woff") format("woff"), url("../fonts/interstate/interstate-light.ttf") format("truetype"); font-weight: 300; } @font-face { font-family: 'Interstate'; src: url("../fonts/interstate/interstate-bold.eot?") format("eot"), url("../fonts/interstate/interstate-bold.woff") format("woff"), url("../fonts/interstate/interstate-bold.ttf") format("truetype"); font-weight: bold; } @font-face { font-family: 'Interstate'; src: url("../fonts/interstate/interstate-black.eot?") format("eot"), url("../fonts/interstate/interstate-black.woff") format("woff"), url("../fonts/interstate/interstate-black.ttf") format("truetype"); font-weight: 900; } @font-face { font-family: 'Interstate'; src: url("../fonts/interstate/interstate-italic.eot?") format("eot"), url("../fonts/interstate/interstate-italic.woff") format("woff"), url("../fonts/interstate/interstate-italic.ttf") format("truetype"); font-style: italic; } /* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties Mixins available: - css3-prefix - arguments: Property, Value - background-gradient - arguments: Start Color: #3C3C3C, End Color: #999999 - background-radial - arguments: Start Color: #FFFFFF, Start position: 0%, End Color: #000000, End position: 100% - background-size - arguments: Width: 100%, Height: 100% - background-opacity - arguments: Color: #000, Opacity: .85 - border-radius - arguments: Radius: 5px - border-radius-separate - arguments: Top Left: 5px, Top Left: 5px, Bottom Left: 5px, Bottom Right: 5px - box - arguments: Orientation: horizontal, Pack: center, Align: center - box-rgba - arguments: R: 60, G: 3, B: 12, Opacity: 0.23, Color: #3C3C3C - box-shadow - arguments: X: 2px, Y: 2px, Blur: 5px, Color: rgba(0,0,0,.4) - box-sizing - arguments: Type: border-box - columns - arguments: Count: 3, Gap: 10 - double-borders - arguments: Color One: #3C3C3C, Color Two: #999999, Radius: 0 - flex - arguments: Value: 1 - flip - arguments: ScaleX: -1 - font-face - arguments: Font Family: myFont, Eot File Src: myFont.eot, Woff File Src: myFont.woff, Ttf File Src: myFont.ttf - opacity - arguments: Opacity: 0.5 - outline radius - arguments: Radius: 5px - resize - arguments: Direction: both - rotate - arguments: Degree: 0, M11: 0, M12: 0, M21: 0, M22: 0 CSS Matrix Rotation Calculator http://www.boogdesign.com/examples/transforms/matrix-calculator.html - text-shadow - arguments: X: 2px, Y: 2px, Blur: 5px, Color: rgba(0,0,0,.4) - transform - arguments: Parameters: null - transform-style - arguments: Style: preserve-3d - transition - Default arguments: What: all, Length: 1s, Easing: ease-in-out - - Examples: @include transition (all 2s ease-in-out); - @include transition (opacity 1s ease-in 2s, width 2s ease-out); - triple-borders - arguments: Color One: #3C3C3C, Color Two: #999999, Color Three: #000000, Radius: 0 - keyframes - arguments: Animation name - content: Animation css - animation - arguments: name duration timing-function delay iteration-count direction fill-mode play-state (http://www.w3schools.com/cssref/css3_pr_animation.asp) ------------------------------------------------------------- */ /* ADDS A BROWSER PREFIX TO THE PROPERTY */ /* BACKGROUND GRADIENT */ /* BACKGROUND RADIAL */ /* BACKGROUND SIZE */ /* BACKGROUND COLOR OPACITY */ /* BORDER RADIUS */ /* BOX */ /* BOX RGBA */ /* BOX SHADOW */ /* BOX SIZING */ /* COLUMNS */ /* DOUBLE BORDERS */ /* FLEX */ /* FLIP */ /* FONT FACE */ /* OPACITY */ /* OUTLINE RADIUS */ /* RESIZE */ /* ROTATE*/ /* TEXT SHADOW */ /* TRANSFORM */ /* TRANSFORM STYLE */ /* TRANSITION */ /* TRIPLE BORDERS */ /* KEYFRAMES */ /* ANIMATION */ /*! Mixins */ /*! Icons */ .icon-burger-menu { display: inline-block; width: 24px; height: 18px; background-position: 0 -258px; } .icon-burger-menu.white { display: inline-block; width: 24px; height: 18px; background-position: 0 -237px; } .icon-search { display: inline-block; width: 13px; height: 15px; background-position: 0 -1631px; } .icon-information { display: inline-block; width: 26px; height: 26px; background-position: 0 -991px; } .icon-download { display: inline-block; width: 20px; height: 19px; background-position: 0 -594px; } .icon-download-disable { display: inline-block; width: 20px; height: 19px; background-position: 0 -572px; } .icon-upload { display: inline-block; width: 20px; height: 19px; background-position: 0 -1758px; } .icon-marker { display: inline-block; width: 13px; height: 20px; background-position: 0 -1038px; } .icon-contact-mail { display: inline-block; width: 40px; height: 40px; background-position: 0 -529px; } .icon-contact-mail:hover, .icon-contact-mail.icon-contact-mail-hover { background-position: 0 -486px; } .icon-checklist { display: inline-block; width: 16px; height: 15px; background-position: 0 -345px; } .icon-reply { display: inline-block; width: 21px; height: 19px; background-position: 0 -1523px; } .icon-edit { display: inline-block; width: 21px; height: 20px; background-position: 0 -616px; } .icon-add { display: inline-block; width: 20px; height: 20px; background-position: 0 0; } .icon-trash { display: inline-block; width: 17px; height: 20px; background-position: 0 -1649px; } .icon-readmore { display: inline-block; width: 6px; height: 8px; vertical-align: middle; background-position: 0 -1413px; } .icon-readmore:hover, .icon-readmore.readmore-indicator-hover { background-position: 0 -1402px; } .icon-more-up-indicator { display: inline-block; width: 10px; height: 6px; vertical-align: middle; background-position: 0 -905px; } .icon-more-down-indicator { display: inline-block; width: 10px; height: 6px; vertical-align: middle; background-position: 0 -896px; } /* Update 25 Feb 2015 */ .icon-facebook { display: inline-block; width: 40px; height: 40px; background-position: 0 -682px; } .icon-facebook:hover, .icon-facebook.icon-facebook-hover { background-position: 0 -639px; } .icon-twitter { display: inline-block; width: 40px; height: 40px; background-position: 0 -1715px; } .icon-twitter:hover, .icon-twitter.icon-twitter-hover { background-position: 0 -1672px; } .icon-rss { display: inline-block; width: 40px; height: 40px; background-position: 0 -1588px; } .icon-rss:hover, .icon-rss.icon-rss-hover { background-position: 0 -1545px; } .icon-youtube { display: inline-block; width: 40px; height: 40px; background-position: 0 -1928px; } .icon-youtube:hover, .icon-youtube.icon-youtube-hover { background-position: 0 -1885px; } .icon-google-plus { display: inline-block; width: 40px; height: 40px; background-position: 0 -768px; } .icon-google-plus:hover, .icon-google-plus.icon-googleplus-hover { background-position: 0 -725px; } /* Update 2 April 2015 */ .icon-view { display: inline-block; width: 20px; height: 16px; background-position: 0 -1866px; } /*! Icons widget */ .icon-widget-action { display: inline-block; width: 30px; height: 24px; background-position: 0 -59px; } .icon-widget-calendar { display: inline-block; width: 30px; height: 30px; background-position: 0 -136px; } .icon-widget-finding { display: inline-block; width: 30px; height: 30px; background-position: 0 -366px; } .icon-widget-schedule { display: inline-block; width: 25px; height: 29px; background-position: 0 -827px; } .icon-widget-verified { display: inline-block; width: 28px; height: 30px; background-position: 0 -944px; } .icon-widget-editor { display: inline-block; width: 30px; height: 27px; background-position: 0 -257px; } .icon-widget-profile { display: inline-block; width: 24px; height: 30px; background-position: 0 -741px; } .icon-widget-head-brain { display: inline-block; width: 26px; height: 31px; background-position: 0 -436px; } .icon-widget-address { display: inline-block; width: 30px; height: 28px; background-position: 0 -83px; } .icon-widget-company-information { display: inline-block; width: 31px; height: 31px; background-position: 0 -166px; } .icon-widget-configuration { display: inline-block; width: 30px; height: 30px; background-position: 0 -197px; } .icon-widget-data-matches { display: inline-block; width: 26px; height: 30px; background-position: 0 -227px; } .icon-widget-event-created { display: inline-block; width: 30px; height: 29px; background-position: 0 -284px; } .icon-widget-experience { display: inline-block; width: 32px; height: 31px; background-position: 0 -313px; } .icon-widget-family-member { display: inline-block; width: 30px; height: 22px; background-position: 0 -344px; } .icon-widget-formal-education { display: inline-block; width: 30px; height: 20px; background-position: 0 -396px; } .icon-widget-informal-education { display: inline-block; width: 30px; height: 24px; background-position: 0 -467px; } .icon-widget-language-skill { display: inline-block; width: 30px; height: 29px; background-position: 0 -491px; } .icon-widget-open-vacancy { display: inline-block; width: 30px; height: 25px; background-position: 0 -571px; } .icon-widget-other-info { display: inline-block; width: 30px; height: 30px; background-position: 0 -596px; } .icon-widget-personal { display: inline-block; width: 30px; height: 30px; background-position: 0 -711px; } .icon-widget-personal-data { display: inline-block; width: 29px; height: 30px; background-position: 0 -651px; } .icon-widget-personal-doc { display: inline-block; width: 30px; height: 30px; background-position: 0 -681px; } .icon-widget-reference { display: inline-block; width: 30px; height: 26px; background-position: 0 -801px; } .icon-widget-search-doc { display: inline-block; width: 31px; height: 30px; background-position: 0 -856px; } .icon-widget-statistic { display: inline-block; width: 30px; height: 29px; background-position: 0 -886px; } .icon-widget-academic { display: inline-block; width: 30px; height: 30px; background-position: 0 0; } .icon-widget-achievement { display: inline-block; width: 26px; height: 29px; background-position: 0 -30px; } .icon-widget-attendance { display: inline-block; width: 31px; height: 25px; background-position: 0 -111px; } .icon-widget-group { display: inline-block; width: 30px; height: 20px; background-position: 0 -416px; } .icon-widget-message { display: inline-block; width: 29px; height: 30px; background-position: 0 -520px; } .icon-widget-news { display: inline-block; width: 31px; height: 21px; background-position: 0 -550px; } .icon-widget-recommended { display: inline-block; width: 21px; height: 30px; background-position: 0 -771px; } .icon-widget-telephone { display: inline-block; width: 28px; height: 29px; background-position: 0 -915px; } .icon-widget-performance { display: inline-block; width: 30px; height: 25px; background-position: 0 -626px; } /*! Themes */ /*! University theme */ /*! Theme color */ /*! Button */ /*! Background Menu */ /*! Fullcalendar custom */ /*! Reset elements */ body { margin: 0; padding: 0; background: #fff; font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight: normal; color: #5e5e5e; line-height: 22px; } p { display: block; margin: 24px 0; padding: 0; } img { display: block; max-width: 100%; height: auto; } a { color: #0098D7; text-decoration: none; } a .icon-readmore { margin-top: -1px; } a:hover { color: #f48b31; } a:hover .icon-readmore { background-position: 0 -1402px; } h1, h2, h3, h4, h5, h6 { display: block; margin: 0 0 24px; padding: 30px 0 0; font-weight: normal; } table { width: 100%; border-collapse: collapse; } table thead { background: #e4e4e4; } table thead tr { border-top: 1px solid #fff; } table thead tr:first-child { border-top: 0; } table thead tr th { padding: 13px; font-size: 12px; font-weight: bold; line-height: 14px; text-align: left; text-transform: uppercase; } table tbody tr { background: #fff; border-bottom: 1px solid #e2e2e2; } table tbody tr th { padding: 13px; font-size: 13px; line-height: 15px; background: #d4d4d4; } table tbody tr td { padding: 13px; font-size: 13px; line-height: 15px; } table tfoot { background: #f1f1f1; } table tfoot tr td { padding: 13px; font-size: 13px; line-height: 15px; } table.zebra tbody tr:nth-child(even) { background: #f2f2f2; } table.horizontal tbody tr th { text-align: right; text-transform: uppercase; } table.horizontal.bordered tbody tr th { border: 1px solid #e2e2e2; border-bottom: 1px solid #fff; } table.horizontal.bordered tbody tr:last-child th { border-bottom: 1px solid #e2e2e2; } table.bordered thead { border: 1px solid #e2e2e2; } table.bordered thead tr th { border-left: 1px solid #fff; } table.bordered thead tr th:first-child { border-left: 0; } table.bordered tbody tr td { border: 1px solid #e2e2e2; } table.bordered tfoot tr td { border: 1px solid #e2e2e2; } input[type="text"], input[type="email"], input[type="password"], input[type="search"], textarea { display: block; margin: 0; padding: 0 10px; width: 100%; height: 40px; border: 1px solid #c9c9c9; outline: 0; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus { border-color: #ff9024; } input[type="text"][readonly="readonly"], input[type="text"][disabled="disabled"], input[type="email"][readonly="readonly"], input[type="email"][disabled="disabled"], input[type="password"][readonly="readonly"], input[type="password"][disabled="disabled"], input[type="search"][readonly="readonly"], input[type="search"][disabled="disabled"], textarea[readonly="readonly"], textarea[disabled="disabled"] { background: #e4e4e4; } input[type="text"].has-success, input[type="email"].has-success, input[type="password"].has-success, input[type="search"].has-success, textarea.has-success { border-color: #74b71b; } input[type="text"].has-warning, input[type="email"].has-warning, input[type="password"].has-warning, input[type="search"].has-warning, textarea.has-warning { border-color: #ff9024; } input[type="text"].has-error, input[type="email"].has-error, input[type="password"].has-error, input[type="search"].has-error, textarea.has-error { border-color: #d12f2e; } textarea { padding: 10px; resize: none; height: auto; line-height: 20px; } form { display: block; } form .row { margin: 0 -10px; } form .row .column { padding: 0 10px; } form p { display: block; margin: 0 0 20px; padding: 0; } form p.action.has-border { margin: 10px 0; padding: 20px 0 0; border-top: 1px solid #c9c9c9; } form label { display: block; margin: 0 0 8px; padding: 0; font-size: 12px; color: #909090; line-height: 15px; text-transform: uppercase; } form label .required { color: #d12f2e; } form small { display: block; padding-top: 10px; font-size: 12px; color: #919191; line-height: 15px; } ul.custom-list { display: block; margin: 0; padding: 0; } ul.custom-list li { display: block; position: relative; margin: 0 0 8px; padding: 0 0 0 18px; } ul.custom-list li:before { display: block; position: absolute; top: 0; left: 0; z-index: 1; content: ''; margin-top: 5px; width: 6px; height: 6px; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; background: #0098D7; } code { padding: 3px 5px; background: #5e5e5e; color: #fff; } blockquote { display: block; margin: 20px 0; padding: 20px; background: #f6f6f6; } /*! Reusable Patterns */ .clearfix:after, .container:after, .row:after, .calendar-wrap:after, .ui-datepicker .ui-datepicker-header .ui-datepicker-title:after, .header .navigator ul:after, .header .top-navigation .navigation:after, .header .top-navigation .navigation .menu:after, .agenda-navigation .agenda-content ul:after, .archives .post-item.has-thumbnail:after, .widget-parent .widget-group:after, .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav:after, .clearfix:before, .container:before, .row:before, .calendar-wrap:before, .ui-datepicker .ui-datepicker-header .ui-datepicker-title:before, .header .navigator ul:before, .header .top-navigation .navigation:before, .header .top-navigation .navigation .menu:before, .agenda-navigation .agenda-content ul:before, .archives .post-item.has-thumbnail:before, .widget-parent .widget-group:before, .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav:before { display: table; content: ''; } .clearfix:after, .container:after, .row:after, .calendar-wrap:after, .ui-datepicker .ui-datepicker-header .ui-datepicker-title:after, .header .navigator ul:after, .header .top-navigation .navigation:after, .header .top-navigation .navigation .menu:after, .agenda-navigation .agenda-content ul:after, .archives .post-item.has-thumbnail:after, .widget-parent .widget-group:after, .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav:after { clear: both; } /* Floating */ .left { float: left; } .right { float: right; } /* Text align */ .text-left { text-align: left; } .text-center { text-align: center; } .text-right { text-align: right; } .text-justify { text-align: justify; } /* Text color */ .text-success { display: inline-block; padding: 1px 5px; color: #74b71b; background: #f2f7ec; } .text-error { display: inline-block; padding: 1px 5px; color: #d12f2e; background: #f9f2f4; } .text-warning { display: inline-block; padding: 1px 5px; color: #ff9024; background: #f5efe9; } /* Button */ .button, .calendar table.fc-header .fc-button-today { display: inline-block; position: relative; margin: 0; padding: 0 25px; min-width: 120px; height: 40px; border: 0; outline: 0; font-size: 12px; color: #fff; line-height: 40px; text-align: center; text-transform: uppercase; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } .button.wide, .calendar table.fc-header .wide.fc-button-today { width: 100%; margin-bottom: 10px; } .button.button-primary, .calendar table.fc-header .fc-button-today { background: #34aee2; background-color: #34aee2; background-image: -webkit-gradient(linear, left top, left bottom, from(#34aee2), to(#0098d7)); background-image: -webkit-linear-gradient(top, #34aee2, #0098d7); background-image: -moz-linear-gradient(top, #34aee2, #0098d7); background-image: -ms-linear-gradient(top, #34aee2, #0098d7); background-image: -o-linear-gradient(top, #34aee2, #0098d7); background-image: linear-gradient(top, #34aee2, #0098d7); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#34aee2', endColorStr='#0098d7'); } .button.button-primary:hover, .calendar table.fc-header .fc-button-today:hover { background: #0083bf; color: #fff; } .button.button-primary:active, .calendar table.fc-header .fc-button-today:active, .button.button-primary.active, .calendar table.fc-header .active.fc-button-today { background: #0071a6; color: #fff; } .button.button-secondary, .calendar table.fc-header .button-secondary.fc-button-today { background: #bababa; } .button.button-secondary:hover, .calendar table.fc-header .button-secondary.fc-button-today:hover { background: #a1a1a1; color: #fff; } .button.button-secondary.active, .calendar table.fc-header .button-secondary.active.fc-button-today { background: #878787; color: #fff; } .button.button-orange, .calendar table.fc-header .button-orange.fc-button-today { background: #f59949; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFf59949', endColorstr='#FFe5842e'); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f59949), color-stop(99%, #e5842e)); background-image: -webkit-linear-gradient(top, #f59949 0%, #e5842e 99%); background-image: -moz-linear-gradient(top, #f59949 0%, #e5842e 99%); background-image: -o-linear-gradient(top, #f59949 0%, #e5842e 99%); background-image: linear-gradient(top, #f59949 0%, #e5842e 99%); } .button.button-orange:hover, .calendar table.fc-header .button-orange.fc-button-today:hover { background: #db7e2c; color: #fff; } .button.button-orange.active, .calendar table.fc-header .button-orange.active.fc-button-today { background: #c26f27; color: #fff; } .button.with-icon, .calendar table.fc-header .with-icon.fc-button-today { position: relative; padding: 0 15px 0 50px; text-align: left; } .button.with-icon.wide, .calendar table.fc-header .with-icon.wide.fc-button-today { text-align: center; } .button.with-icon:before, .calendar table.fc-header .with-icon.fc-button-today:before { display: block; position: absolute; top: 50%; left: 10px; z-index: 1; content: ''; margin-top: -10px; width: 20px; height: 20px; } .button.with-icon:after, .calendar table.fc-header .with-icon.fc-button-today:after { display: block; position: absolute; top: 10px; bottom: 10px; left: 40px; content: ''; width: 1px; background: #fff; } .button.with-icon.icon-btn-add:before, .calendar table.fc-header .with-icon.icon-btn-add.fc-button-today:before { background-position: 0 -99px; } .button.with-icon.icon-btn-edit:before, .calendar table.fc-header .with-icon.icon-btn-edit.fc-button-today:before { background-position: 0 -168px; } .button.with-icon.icon-btn-delete:before, .calendar table.fc-header .with-icon.icon-btn-delete.fc-button-today:before { background-position: 0 -122px; } .button.with-icon.icon-btn-upload:before, .calendar table.fc-header .with-icon.icon-btn-upload.fc-button-today:before { background-position: 0 -214px; } .button.with-icon.icon-btn-download:before, .calendar table.fc-header .with-icon.icon-btn-download.fc-button-today:before { background-position: 0 -145px; } .button.with-icon.icon-btn-print:before, .calendar table.fc-header .with-icon.icon-btn-print.fc-button-today:before { background-position: 0 -191px; } /*! Basic structure */ body.overflow-hidden { overflow: hidden; } #page { display: block; position: relative; } #page .page-heading { display: block; position: relative; margin: 0 0 30px; } #page .page-heading h1 { display: block; margin: 0; padding: 0; font-size: 24px; font-weight: bold; color: #0098D7; line-height: 28px; text-transform: uppercase; } #page .page-sub-heading { display: block; position: relative; margin-bottom: 20px; padding: 0 0 20px; border-bottom: 1px solid #c9c9c9; } #page .page-sub-heading h2 { display: block; margin: 0; padding: 0; font-size: 20px; font-weight: normal; color: #5e5e5e; line-height: 22px; } #page .page-sub-heading.no-border { padding: 0; border-bottom: 0; } #site-content { display: block; position: relative; } #site-content .divider { display: block; width: 100%; height: 1px; background: #c9c9c9; } #main-content { display: block; position: relative; padding: 80px 0 80px; } #main-content.has-widget { z-index: 1; margin-top: -1px; padding: 40px 0 80px; background: #f1f1f1; border-top: 1px solid #c9c9c9; } #main-content.has-widget .widget-parent .widget { background: #fff; } #main-content.has-widget .widget-parent .widget .widget-footer { background: #fff; } #main-content.has-widget .box-container { display: block; position: relative; margin-bottom: 20px; padding: 20px; background: #fff; border: 1px solid #c9c9c9; } .container { display: block; width: 940px; margin: auto; } .container.w-640px { width: 640px; } .container.w-720px { width: 720px; } .container.w-800px { width: 800px; } .container.w-880px { width: 880px; } /* Banner */ .tagline-banner { display: block; position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 0; /* Update 25 Feb 2015 */ } .tagline-banner.short-banner { position: fixed; } .tagline-banner.short-banner .wrap .banner { padding: 0; } .tagline-banner.short-banner .wrap .banner .banner-image { margin-top: -20px; height: 114px; background-position: 0 -1424px; } .tagline-banner.short-banner .wrap .tagline { display: none; } .tagline-banner .container { height: 0; } .tagline-banner .wrap { display: block; margin-left: -80px; width: 53px; } .tagline-banner .wrap .banner { display: block; padding: 187px 0 0; background: #0098D7; } .tagline-banner .wrap .banner .banner-image { display: block; width: 53px; height: 204px; background-color: #fff; background-position: 0 -1541px; } .tagline-banner .wrap .tagline { display: block; margin: 50px 0 0; font-family: 'Interstate'; font-size: 12px; font-weight: bold; color: #474a4a; line-height: 14px; } .tagline-banner.new-layout .wrap { margin-left: 0; } .tagline-banner.new-layout .wrap .banner { padding: 0; } .tagline-banner.new-layout .wrap .banner .banner-image { margin-top: -20px; height: 114px; background-position: 0 -1424px; } .tagline-banner.new-layout .wrap .tagline { display: none; } .tagline-banner.new-layout.short-banner { display: none; } /* Row */ .row { display: block; } .row .column { display: block; float: left; width: 100%; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .row .column.one-half { width: 50%; } .row .column.two-thirds { width: 66.67%; } .row .column.one-third { width: 33.33%; } .row .column.one-fourth { width: 25%; } .row .column.one-fifth { width: 20%; } /* Table */ .group-item { display: table; table-layout: fixed; width: 100%; } .group-item .rows { display: table-row; } .group-item .item { display: table-cell; } .group-item .item.one-half { width: 50%; } .group-item .item.two-thirds { width: 66.67%; } .group-item .item.one-third { width: 33.33%; } .group-item .item.one-fourth { width: 25%; } .group-item .item.one-fifth { width: 20%; } /* Divider absolute */ .absolute-divider { display: block; position: absolute; left: auto; z-index: 1; content: ''; width: 100%; height: 1px; background: #c9c9c9; } .absolute-divider.top { bottom: 100%; } .absolute-divider.bottom { top: 100%; } /* Heading */ .heading { display: block; margin: 0 0 60px; padding: 0; font-size: 24px; font-weight: normal; color: #0098D7; line-height: 28px; text-align: center; text-transform: uppercase; } .heading.new-layout { margin: 0 0 30px; padding: 0 0 20px; font-size: 20px; text-align: left; line-height: 24px; border-bottom: 1px solid #c9c9c9; } .ffTextBoxWrapper, .ffPasswordWrapper, .ffCheckboxWrapper, .ffRadioWrapper, .ffTextAreaWrapper, .ffSubmitWrapper, .ffResetWrapper, .ffButtonWrapper { display: inline-block; zoom: 1; *display: inline; margin: 5px 0; } .ffSelectWrapper { display: inline-block; zoom: 1; margin: 5px 0; } .ffTextBoxLeft, .ffTextBoxRight, .ffPasswordLeft, .ffPasswordRight, .ffCheckbox, .ffRadio, .ffSelectButton, .ffSelectButton span, .ffSelectMenuWrapper div.ffSelectMenuTop, .ffSelectMenuWrapper div.ffSelectMenuBottom, .ffSelectMenuWrapper > div > span, .ffTextAreaTop, .ffTextAreaTop span, .ffTextAreaBottom, .ffTextAreaBottom span, .ffSubmitWrapper a, .ffSubmitWrapper a span, .ffResetWrapper a, .ffResetWrapper a span, .ffButtonWrapper a, .ffButtonWrapper a span { background-repeat: no-repeat; } /* text box */ .ffTextBoxRight, .ffPasswordRight { background-position: right -256px; padding-right: 5px; } .ffTextBoxLeft, .ffPasswordLeft { background-position: 0 0; padding: 0 5px 0 10px; } .ffTextBoxLeft input, .ffPasswordLeft input { border: 0; height: 28px; background-color: transparent; margin-top: 6px\9; height: 22px\9; } .ffTextBoxRight:hover, .ffPasswordRight:hover { background-position: right -288px; } .ffTextBoxLeft:hover, .ffPasswordLeft:hover { background-position: 0 -32px; } .focus .ffTextBoxRight, .focus .ffPasswordRight { background-position: right -320px; } .focus .ffTextBoxLeft, .focus .ffPasswordLeft { background-position: 0 -64px; } .ffTextBoxWrapper.disabled .ffTextBoxRight, .ffPasswordWrapper.disabled .ffPasswordRight { background-position: right -352px; } .ffTextBoxWrapper.disabled .ffTextBoxLeft, .ffPasswordWrapper.disabled .ffPasswordLeft { background-position: 0 -96px; color: #999; } /* checkbox */ .ffCheckboxWrapper a { text-decoration: none; color: #6F6F6F; position: relative; top: 1px; font-size: 14px; padding-left: 5px; margin-right: 10px; } .ffCheckbox { width: 21px; height: 21px; float: left; background-position: 0 -288px; cursor: pointer; } .ffCheckboxWrapper:hover a, .ffCeckboxWrapper.focus a { color: #4e4e4e; } .ffCheckboxWrapper:hover .ffCheckbox, .ffCeckboxWrapper.focus .ffCheckbox { background-position: -30px -288px; } .ffCheckboxWrapper.on .ffCheckbox { background-position: -60px -288px; } .ffCheckboxWrapper.on:hover .ffCheckbox, .ffCeckboxWrapper.on.focus .ffCheckbox { background-position: -90px -288px; } .ffCheckboxWrapper.disabled .ffCheckbox { background-position: -120px -288px; } .ffCheckboxWrapper.on.disabled .ffCheckbox { background-position: -150px -288px; } .ffCheckboxWrapper.disabled a, .ffCeckboxWrapper.disabled:hover a, .ffCeckboxWrapper.disabled.focus a { color: #999; } /* radio */ .ffRadioWrapper a { text-decoration: none; color: #555; position: relative; top: 1px; font-size: 14px; padding-left: 5px; margin-right: 10px; } .ffRadio { width: 18px; height: 18px; float: left; background-position: -180px -288px; cursor: pointer; } .ffRadioWrapper:hover a, .ffRadioWrapper.focus a { color: #4e4e4e; } .ffRadioWrapper:hover .ffRadio, .ffRadioWrapper.focus .ffRadio { background-position: -210px -288px; } .ffRadioWrapper.on .ffRadio { background-position: -240px -288px; } .ffRadioWrapper.on:hover .ffRadio, .ffRadioWrapper.on.focus .ffRadio { background-position: -270px -288px; } .ffRadioWrapper.disabled .ffRadio { background-position: -300px -288px; } .ffRadioWrapper.on.disabled .ffRadio { background-position: -330px -288px; } .ffRadioWrapper.disabled a, .ffRadioWrapper.disabled:hover a, .ffRadioWrapper.disabled.focus a { color: #999; } /* selectbox */ .ffSelectWrapper { width: 200px; *clear: both; } .ffSelect { position: relative; } .ffSelect > a { background-position: right -128px; display: block; text-decoration: none; outline: 0; cursor: default; } .ffSelect > a > span { display: block; height: 28px; margin-right: 40px; padding-left: 10px; background-position: 0 0; overflow: hidden; line-height: 28px; font-size: 14px; color: #555; white-space: nowrap; *white-space: normal; text-overflow: ellipsis; } .ffSelect:hover > a, .ffSelectWrapper.focus .ffSelect > a { background-position: right -160px; } .ffSelect:hover > a > span, .ffSelectWrapper.focus .ffSelect > a > span { background-position: 0 -32px; } .ffSelectWrapper.active .ffSelect > a { background-position: right -192px; z-index: 1005; position: relative; } .ffSelectWrapper.active .ffSelect > a > span { background-position: 0 -64px; } .ffSelectWrapper.disabled .ffSelect > a { background-position: right -224px; } .ffSelectWrapper.disabled .ffSelect > a > span { background-position: 0 -96px; color: #999; } .ffSelectMenuWrapper { width: 100%; } .ffSelectMenuWrapper .ffSelectMenuMidBG ul { list-style-type: none; margin: 0 0; padding: 0; list-style: none !important; } .ffSelectMenuWrapper .ffSelectMenuMidBG li { padding: 5px; cursor: default; background-color: #fff; list-style: none !important; margin: 0; } .ffSelectMenuWrapper .ffSelectMenuMidBG li SPAN { font-size: 14px; } .ffSelectMenuWrapper .ffSelectMenuMidBG li.disabled SPAN { color: #888; } .ffSelectMenuWrapper .ffSelectMenuMidBG li.on { background-color: #ccc; } .ffSelectMenuTop { height: 5px; background-position: 0 -394px; } .ffSelectMenuTop span { display: block; height: 5px; margin-left: 8px; background: right -384px; } .ffSelectMenuBottom { height: 5px; background-position: 0 -414px; } .ffSelectMenuBottom span { display: block; height: 5px; margin-left: 8px; background-position: right -404px; } .ffSelectMenuMidBG { background: url(../images/fancyfields/sides.png) repeat-y right 0; } .ffSelectMenuMid { max-height: 200px; overflow: auto; background: url(../images/fancyfields/sides.png) repeat-y 0 0; padding-left: 4px; margin-right: 4px; } .scrollingBarWrapper { width: 24px; height: 200px; background: url(../images/fancyfields/scrollingBarBg.png) no-repeat; right: 3px !important; } .scrollingHandle { width: 24px; padding-top: 20px; background: url(../images/fancyfields/scrollingHandleTop.png) no-repeat 0 0; } .scrollingHandleBottom { width: 24px; background: url(../images/fancyfields/scrollingHandleBottom.png) no-repeat 0px bottom; } /* textarea */ .ffTextAreaWrapper textarea { border: 0; margin: 10px 10px 10px 15px; padding: 0; font-size: 14px; color: #555; background: none; resize: none; } .ffTextAreaTop { height: 5px; background-position: 0 -394px; } .ffTextAreaTop span { display: block; height: 5px; margin-left: 8px; background-position: right -384px; } .ffTextAreaMid { background: transparent url(../images/fancyfields/sides.png) repeat-y right 0; } .ffTextAreaMid .ffTextAreaLeft { background: url(../images/fancyfields/sides.png) repeat-y 0 0; margin-right: 4px; } .ffTextAreaBottom { height: 5px; background-position: 0 -414px; } .ffTextAreaBottom span { display: block; height: 5px; margin-left: 6px; background-position: right -404px; } /* button */ .ffButtonWrapper > a { background-position: right -585px; display: block; text-decoration: none; outline: 0; } .ffButtonWrapper > a > span { display: block; height: 36px; padding-bottom: 2px; line-height: 39px; font-size: 15px; background-position: 0 -424px; text-align: center; padding: 0 10px 0 15px; color: #fff; font-weight: bold; text-transform: uppercase; margin-right: 5px; } .ffButtonWrapper:hover > a { background-position: right -625px; } .ffButtonWrapper:hover > a > span { background-position: 0 -464px; } .ffButtonWrapper > a:active { background-position: right -665px; position: relative; } .ffButtonWrapper > a:active > span { background-position: 0 -504px; } .ffButtonWrapper.disabled > a { background-position: right -705px; position: static; } .ffButtonWrapper.disabled > a > span { background-position: 0 -544px; color: #c1c1c1; } input[type="text"], input[type="password"], textarea, select { outline: none; } /* remove webkit yellow border */ select.mobileSelect { opacity: 0; filter: alpha(opacity=0); position: absolute; top: 0; display: block; } /* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */ /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("../images/fancybox/fancybox_sprite.png"); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; } #fancybox-loading div { width: 44px; height: 44px; background: url("../images/fancybox/fancybox_loading.gif") center center no-repeat; } .fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url("../images/fancybox/blank.gif"); /* helps IE */ -webkit-tap-highlight-color: transparent; z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /* Overlay helper */ .fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url("../images/fancybox/fancybox_overlay.png"); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; position: relative; text-shadow: none; z-index: 8050; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, 0.8); } /*Retina graphics!*/ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url("../images/fancybox/fancybox_sprite@2x.png"); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ } #fancybox-loading div { background-image: url("../images/fancybox/fancybox_loading@2x.gif"); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } /*! * FullCalendar v1.6.4 Stylesheet * Docs & License: http://arshaw.com/fullcalendar/ * (c) 2013 Adam Shaw */ .fc { direction: ltr; text-align: left; } .fc table { border-collapse: collapse; border-spacing: 0; } html .fc, .fc table { font-size: 1em; } .fc td, .fc th { padding: 0; vertical-align: top; } /* Header ------------------------------------------------------------------------*/ .fc-header td { white-space: nowrap; } .fc-header-left { width: 25%; text-align: left; } .fc-header-center { text-align: center; } .fc-header-right { width: 25%; text-align: right; } .fc-header-title { display: inline-block; vertical-align: top; } .fc-header-title h2 { margin-top: 0; white-space: nowrap; } .fc .fc-header-space { padding-left: 10px; } .fc-header .fc-button { margin-bottom: 1em; vertical-align: top; } /* buttons edges butting together */ .fc-header .fc-button { margin-right: -1px; } .fc-header .fc-corner-right, .fc-header .ui-corner-right { /* theme */ margin-right: 0; /* back to normal */ } /* button layering (for border precedence) */ .fc-header .fc-state-hover, .fc-header .ui-state-hover { z-index: 2; } .fc-header .fc-state-down { z-index: 3; } .fc-header .fc-state-active, .fc-header .ui-state-active { z-index: 4; } /* Content ------------------------------------------------------------------------*/ .fc-content { clear: both; zoom: 1; /* for IE7, gives accurate coordinates for [un]freezeContentHeight */ } .fc-view { width: 100%; overflow: hidden; } /* Cell Styles ------------------------------------------------------------------------*/ .fc-widget-header, .fc-widget-content { /* , usually */ border: 1px solid #ddd; } .fc-state-highlight { /* today cell */ /* TODO: add .fc-today to */ background: #fcf8e3; } .fc-cell-overlay { /* semi-transparent rectangle while dragging */ background: #bce8f1; opacity: .3; filter: alpha(opacity=30); /* for IE */ } /* Buttons ------------------------------------------------------------------------*/ .fc-button { position: relative; display: inline-block; padding: 0 .6em; overflow: hidden; height: 1.9em; line-height: 1.9em; white-space: nowrap; cursor: pointer; } .fc-state-default { /* non-theme */ border: 1px solid; } .fc-state-default.fc-corner-left { /* non-theme */ border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .fc-state-default.fc-corner-right { /* non-theme */ border-top-right-radius: 4px; border-bottom-right-radius: 4px; } /* Our default prev/next buttons use HTML entities like ‹ › « » and we'll try to make them look good cross-browser. */ .fc-text-arrow { margin: 0 .1em; font-size: 2em; font-family: "Courier New", Courier, monospace; vertical-align: baseline; /* for IE7 */ } .fc-button-prev .fc-text-arrow, .fc-button-next .fc-text-arrow { /* for ‹ › */ font-weight: bold; } /* icon (for jquery ui) */ .fc-button .fc-icon-wrap { position: relative; float: left; top: 50%; } .fc-button .ui-icon { position: relative; float: left; margin-top: -50%; *margin-top: 0; *top: -50%; } /* button states borrowed from twitter bootstrap (http://twitter.github.com/bootstrap/) */ .fc-state-default { background-color: #f5f5f5; background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6)); background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6); background-image: -o-linear-gradient(top, #ffffff, #e6e6e6); background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); background-repeat: repeat-x; border-color: #e6e6e6 #e6e6e6 #bfbfbf; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); color: #333; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); } .fc-state-hover, .fc-state-down, .fc-state-active, .fc-state-disabled { color: #333333; background-color: #e6e6e6; } .fc-state-hover { color: #333333; text-decoration: none; background-position: 0 -15px; } .fc-state-down, .fc-state-active { background-color: #cccccc; background-image: none; outline: 0; box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); } .fc-state-disabled { cursor: default; background-image: none; opacity: 0.65; filter: alpha(opacity=65); box-shadow: none; } /* Global Event Styles ------------------------------------------------------------------------*/ .fc-event-container > * { z-index: 8; } .fc-event-container > .ui-draggable-dragging, .fc-event-container > .ui-resizable-resizing { z-index: 9; } .fc-event { border: 1px solid #3a87ad; /* default BORDER color */ background-color: #3a87ad; /* default BACKGROUND color */ color: #fff; /* default TEXT color */ font-size: .85em; cursor: default; } a.fc-event { text-decoration: none; } a.fc-event, .fc-event-draggable { cursor: pointer; } .fc-rtl .fc-event { text-align: right; } .fc-event-inner { width: 100%; height: 100%; overflow: hidden; } .fc-event-time, .fc-event-title { padding: 0 1px; } .fc .ui-resizable-handle { display: block; position: absolute; z-index: 99999; overflow: hidden; /* hacky spaces (IE6/7) */ font-size: 300%; /* */ line-height: 50%; /* */ } /* Horizontal Events ------------------------------------------------------------------------*/ .fc-event-hori { border-width: 1px 0; margin-bottom: 1px; } .fc-ltr .fc-event-hori.fc-event-start, .fc-rtl .fc-event-hori.fc-event-end { border-left-width: 1px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .fc-ltr .fc-event-hori.fc-event-end, .fc-rtl .fc-event-hori.fc-event-start { border-right-width: 1px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } /* resizable */ .fc-event-hori .ui-resizable-e { top: 0 !important; /* importants override pre jquery ui 1.7 styles */ right: -3px !important; width: 7px !important; height: 100% !important; cursor: e-resize; } .fc-event-hori .ui-resizable-w { top: 0 !important; left: -3px !important; width: 7px !important; height: 100% !important; cursor: w-resize; } .fc-event-hori .ui-resizable-handle { _padding-bottom: 14px; /* IE6 had 0 height */ } /* Reusable Separate-border Table ------------------------------------------------------------*/ table.fc-border-separate { border-collapse: separate; } .fc-border-separate th, .fc-border-separate td { border-width: 1px 0 0 1px; } .fc-border-separate th.fc-last, .fc-border-separate td.fc-last { border-right-width: 1px; } .fc-border-separate tr.fc-last th, .fc-border-separate tr.fc-last td { border-bottom-width: 1px; } .fc-border-separate tbody tr.fc-first td, .fc-border-separate tbody tr.fc-first th { border-top-width: 0; } /* Month View, Basic Week View, Basic Day View ------------------------------------------------------------------------*/ .fc-grid th { text-align: center; } .fc .fc-week-number { width: 22px; text-align: center; } .fc .fc-week-number div { padding: 0 2px; } .fc-grid .fc-day-number { float: right; padding: 0 2px; } .fc-grid .fc-other-month .fc-day-number { opacity: 0.3; filter: alpha(opacity=30); /* for IE */ /* opacity with small font can sometimes look too faded might want to set the 'color' property instead making day-numbers bold also fixes the problem */ } .fc-grid .fc-day-content { clear: both; padding: 2px 2px 1px; /* distance between events and day edges */ } /* event styles */ .fc-grid .fc-event-time { font-weight: bold; } /* right-to-left */ .fc-rtl .fc-grid .fc-day-number { float: left; } .fc-rtl .fc-grid .fc-event-time { float: right; } /* Agenda Week View, Agenda Day View ------------------------------------------------------------------------*/ .fc-agenda table { border-collapse: separate; } .fc-agenda-days th { text-align: center; } .fc-agenda .fc-agenda-axis { width: 50px; padding: 0 4px; vertical-align: middle; text-align: right; white-space: nowrap; font-weight: normal; } .fc-agenda .fc-week-number { font-weight: bold; } .fc-agenda .fc-day-content { padding: 2px 2px 1px; } /* make axis border take precedence */ .fc-agenda-days .fc-agenda-axis { border-right-width: 1px; } .fc-agenda-days .fc-col0 { border-left-width: 0; } /* all-day area */ .fc-agenda-allday th { border-width: 0 1px; } .fc-agenda-allday .fc-day-content { min-height: 34px; /* TODO: doesnt work well in quirksmode */ _height: 34px; } /* divider (between all-day and slots) */ .fc-agenda-divider-inner { height: 2px; overflow: hidden; } .fc-widget-header .fc-agenda-divider-inner { background: #eee; } /* slot rows */ .fc-agenda-slots th { border-width: 1px 1px 0; } .fc-agenda-slots td { border-width: 1px 0 0; background: none; } .fc-agenda-slots td div { height: 20px; } .fc-agenda-slots tr.fc-slot0 th, .fc-agenda-slots tr.fc-slot0 td { border-top-width: 0; } .fc-agenda-slots tr.fc-minor th, .fc-agenda-slots tr.fc-minor td { border-top-style: dotted; } .fc-agenda-slots tr.fc-minor th.ui-widget-header { *border-top-style: solid; /* doesn't work with background in IE6/7 */ } /* Vertical Events ------------------------------------------------------------------------*/ .fc-event-vert { border-width: 0 1px; } .fc-event-vert.fc-event-start { border-top-width: 1px; border-top-left-radius: 3px; border-top-right-radius: 3px; } .fc-event-vert.fc-event-end { border-bottom-width: 1px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .fc-event-vert .fc-event-time { white-space: nowrap; font-size: 10px; } .fc-event-vert .fc-event-inner { position: relative; z-index: 2; } .fc-event-vert .fc-event-bg { /* makes the event lighter w/ a semi-transparent overlay */ position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: .25; filter: alpha(opacity=25); } .fc .ui-draggable-dragging .fc-event-bg, .fc-select-helper .fc-event-bg { display: none\9; /* for IE6/7/8. nested opacity filters while dragging don't work */ } /* resizable */ .fc-event-vert .ui-resizable-s { bottom: 0 !important; /* importants override pre jquery ui 1.7 styles */ width: 100% !important; height: 8px !important; overflow: hidden !important; line-height: 8px !important; font-size: 11px !important; font-family: monospace; text-align: center; cursor: s-resize; } .fc-agenda .ui-resizable-resizing { /* TODO: better selector */ _overflow: hidden; } /* Calendar Wrapper by DMD ------------------------------------------------------------------------*/ .calendar-wrap { display: block; margin: 0 auto 40px; position: relative; } .calendar-wrap .legend { margin-top: 20px; } .calendar-wrap .calendar-mode { position: absolute; top: 0; right: 0; } .fc-day .events-view-more { padding: 2px 10px 5px; text-transform: uppercase; font-size: 11px; text-align: center; } /*! Form bubble */ .form-bubble { display: none; position: absolute; float: left; z-index: 101; padding: 0; background-color: #fff; background: #e2e2e2; margin-left: 1px; box-shadow: 0 0 5px #888; } .form-bubble h5 { background: #c9c9c9; padding: 5px 15px 6px; margin: 0 0 10px; } .form-bubble .fc-event { padding: 1px 10px; line-height: 1.4; display: block; width: 200px !important; position: relative; border: none; } .form-bubble a.fc-event:hover { text-decoration: underline; } .form-bubble .form-bubble-close { display: block; position: absolute; background-position: 0 -445px; width: 15px; height: 15px; cursor: pointer; right: 4px; top: 4px; } .form-bubble .form-bubble-close:hover, .form-bubble .form-bubble-close.icon-close-tooltip-calendar-hover { background-position: 0 -427px; } .form-bubble .form-bubble-close:active, .form-bubble .form-bubble-close.icon-close-tooltip-calendar-active { background-position: 0 -409px; } /*all pointers*/ .form-bubble .form-bubble-pointer-right, .form-bubble .form-bubble-pointer-top-right, .form-bubble .form-bubble-pointer-left, .form-bubble .form-bubble-pointer-top-left, .form-bubble .form-bubble-pointer-bottom-left { background-repeat: no-repeat; float: left; height: 13px; position: absolute; width: 14px; } /*pointers right*/ .form-bubble .form-bubble-pointer-right, .form-bubble .form-bubble-pointer-top-right { right: -14px; } .form-bubble .form-bubble-pointer-right { margin-top: -6px; top: 50%; } .form-bubble .form-bubble-pointer-top-right { top: 8px; } /*pointers left*/ .form-bubble .form-bubble-pointer-left, .form-bubble .form-bubble-pointer-top-left, .form-bubble .form-bubble-pointer-bottom-left { left: -14px; } .form-bubble .form-bubble-pointer-left { margin-top: -6px; top: 50%; } .form-bubble .form-bubble-pointer-top-left { top: 8px; } .form-bubble .form-bubble-pointer-bottom-left { bottom: 14px; } /* override */ .form-bubble ul { position: relative; margin: 0; padding: 0; } .form-bubble ul li { margin: 0 0 1px; padding: 0; list-style: none; white-space: normal; overflow: visible; } .form-bubble ul li h5 { height: 24px; line-height: 24px; padding: 0 15px; } .form-bubble .form-bubble-content { padding: 0 0 15px; } .form-bubble .form-bubble-close { z-index: 20; } .form-bubble .fc-event { cursor: pointer; overflow: visible; margin: 0 15px; } .form-bubble .fc-event:hover { cursor: pointer; overflow: visible; } .form-bubble .fc-event.fc-desktop:hover .fc-dialog { display: block; } .form-bubble .fc-event .fc-event-title { overflow: hidden; white-space: nowrap; } .form-bubble .fc-dialog { display: none; position: absolute; left: 50% !important; bottom: 25px; z-index: 1001; width: 400px; background: #fff; margin-left: -201px; color: transparent; border: 1px solid #c9c9c9; } .form-bubble .fc-dialog.active { display: block; } .form-bubble .fc-dialog:before { position: absolute; left: 50%; top: 100%; z-index: 140; content: ''; height: 0; width: 0; border: 12px solid; border-top-color: #c9c9c9; margin-left: -12px; } .form-bubble .fc-dialog:after { position: absolute; left: 50%; top: 100%; z-index: 140; content: ''; height: 0; width: 0; border: 10px solid; border-top-color: #fff; margin-left: -10px; } .form-bubble .fc-dialog .fc-dcontent { position: relative; background: #fff; color: #444446; padding: 20px; } .form-bubble .fc-dialog .fc-dcontent .fc-dtitle { font-size: 14px; line-height: 20px; color: #6f273d; padding: 0 25px 10px 0; margin: 0 0 10px; border-bottom: 1px solid #c9c9c9; } .form-bubble .fc-dialog .fc-dcontent .fc-ddate { font-size: 12px; color: #555; margin-bottom: 10px; } .form-bubble .fc-dialog .fc-dcontent .fc-ddesc { margin-bottom: 10px; } .form-bubble .fc-dialog .fc-dcontent .fc-ddesc p { margin: 0; padding: 0; white-space: normal; word-wrap: break-word; } .form-bubble .fc-dialog .fc-dclose { display: inline-block; position: absolute; right: 20px; top: 20px; z-index: 20; content: ''; width: 15px; height: 15px; background-position: 0 -445px; } .form-bubble .fc-dialog .fc-dclose:hover, .form-bubble .fc-dialog .fc-dclose.icon-close-tooltip-calendar-hover { background-position: 0 -427px; } .form-bubble .fc-dialog .fc-dclose:active, .form-bubble .fc-dialog .fc-dclose.icon-close-tooltip-calendar-active { background-position: 0 -409px; } .form-bubble .fc-dialog .fc-dclose:hover { background-position: 0 -427px; } .form-bubble .fc-dialog .fc-dclose:active { background-position: 0 -409px; } /*! Fullcalendar custom style */ .calendar-wrapper { display: block; position: relative; margin: auto; width: 100%; } .calendar-wrapper .legend { margin-top: 30px; } .calendar { display: block; position: relative; /* Header */ /* table list view */ } .calendar table.fc-header { margin: 30px 0 0; } .calendar table.fc-header .fc-header-space { display: inline-block; height: 40px; width: 1px; background: #c9c9c9; padding: 0; margin: 0 15px; } .calendar table.fc-header .fc-button-today.fc-state-disabled { background: #34aee2; background-color: #34aee2; background-image: -webkit-gradient(linear, left top, left bottom, from(#34aee2), to(#0098d7)); background-image: -webkit-linear-gradient(top, #34aee2, #0098d7); background-image: -moz-linear-gradient(top, #34aee2, #0098d7); background-image: -ms-linear-gradient(top, #34aee2, #0098d7); background-image: -o-linear-gradient(top, #34aee2, #0098d7); background-image: linear-gradient(top, #34aee2, #0098d7); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#34aee2', endColorStr='#0098d7'); } .calendar table.fc-header .fc-button-today .fc-header-left { padding-right: 10px; } .calendar table.fc-header tbody tr { border-bottom: 0; } .calendar table.fc-header tbody tr.fc-week { background: #f9f9f9; } .calendar table.fc-header .fc-button { cursor: pointer; } .calendar table.fc-header .fc-header-left { width: 70px; height: 40px; line-height: 0; } .calendar table.fc-header .fc-header-center { padding-left: 15px; vertical-align: top; text-align: left; } .calendar table.fc-header .fc-header-center .fc-header-title { height: 40px; line-height: 40px; padding: 0 0 0 15px; border-left: 1px solid #c9c9c9; } .calendar table.fc-header .fc-header-center .fc-header-title h2 { margin: 0; padding: 0; font-size: 16px; font-weight: normal; color: #5e5e5e; text-transform: uppercase; } .calendar table.fc-header .fc-header-right { width: 157px; padding: 0; } .calendar table.fc-header .fc-button-prev, .calendar table.fc-header .fc-button-next { vertical-align: top; margin-top: 5px; } .calendar .fc-widget-header, .calendar .fc-widget-content { border: 1px solid #c9c9c9; } .calendar .fc-button-prev, .calendar .fc-button-next { display: inline-block; width: 30px; height: 30px; margin-bottom: 0; text-indent: -99999em; padding: 0; background-color: #fff; border: 0; box-shadow: none; } .calendar .fc-button-prev { margin-right: 15px; background-position: 0 -1259px; } .calendar .fc-button-prev:hover, .calendar .fc-button-prev.icon-pointer-left-hover { background-position: 0 -1226px; } .calendar .fc-button-prev:active, .calendar .fc-button-prev.icon-pointer-left-active { background-position: 0 -1160px; } .calendar .fc-button-prev:hover { background-position: 0 -1226px; } .calendar .fc-button-prev:active { background-position: 0 -1160px; } .calendar .fc-button-next { background-position: 0 -1391px; } .calendar .fc-button-next:hover, .calendar .fc-button-next.icon-pointer-right-hover { background-position: 0 -1358px; } .calendar .fc-button-next:active, .calendar .fc-button-next.icon-pointer-right-active { background-position: 0 -1292px; } .calendar .fc-button-next:hover { background-position: 0 -1358px; } .calendar .fc-button-next:active { background-position: 0 -1292px; } .calendar .fc-day-header { padding: 10px 0; } .calendar .fc-content { margin-top: 30px; padding-top: 30px; border-top: 1px solid #c9c9c9; } .calendar .fc-content table.fc-border-separate { border-collapse: collapse; } .calendar .fc-content table thead tr th { text-align: center; } .calendar .fc-content table tbody { border-right: 1px solid #c9c9c9; } .calendar .fc-content table tbody tr { border-bottom: 1px solid #c9c9c9; } .calendar .fc-content table tbody tr:first-child { border-top: 1px solid #c9c9c9; } .calendar .fc-content table tbody tr td { vertical-align: top; border-left: 1px solid #c9c9c9; } .calendar .fc-content table tbody tr td .fc-day-number { margin: 4px 4px 0 0; z-index: 20; position: relative; font-size: 9.5px; color: #5e5e5e; } .calendar .fc-content .fc-event { color: white; height: 20px; overflow: hidden; background: #57aae0; border: none; -webkit-border-radius: 0 !important; -khtml-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; border-radius: 0 !important; } .calendar .fc-content .fc-event:hover { overflow: auto; height: auto; } .calendar .fc-content .fc-event.fc-event-end { padding-right: 10px; } .calendar .fc-content .fc-event.fc-event-end:after { content: ''; width: 11px; height: 20px; background-position: 0 -106px; position: absolute; top: 0; right: 0; } .calendar .fc-content .fc-event.fc-event-start { padding-left: 10px; } .calendar .fc-content .fc-event.fc-event-start:before { content: ''; width: 11px; height: 20px; background-position: 0 -129px; position: absolute; top: 0; left: 0; } .calendar .fc-content .fc-event.fc-event-start.fc-event-end { padding-left: 3px; padding-right: 3px; } .calendar .fc-content .fc-event.fc-event-start.fc-event-end:before { display: none; } .calendar .fc-content .fc-event.fc-event-start.fc-event-end:after { display: none; } .calendar .fc-content .fc-event .fc-event-inner { position: relative; z-index: 1000; padding: 0 5px; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .calendar .fc-list-view { display: none; position: absolute; top: 30px; z-index: 20; width: 100%; background: #fff; } .calendar .fc-list-view.active { display: block; } .calendar .fc-list-view .table-list-view { display: table; width: 100%; } .calendar .fc-list-view .table-list-view tr.current { background: #dff1fb; } .calendar .fc-list-view .table-list-view td { padding: 10px 13px; vertical-align: middle; border-color: #c9c9c9; } .calendar .fc-list-view .table-list-view .list-view-date { width: 90px; text-align: center; } .calendar .fc-list-view .table-list-view .list-view-color { width: 15px; text-align: right; } .calendar .fc-list-view .table-list-view .list-view-day { display: block; font-size: 28px; color: #0098D7; line-height: 23px; } .calendar .fc-list-view .table-list-view .list-view-month { display: block; font-size: 14px; color: #919191; } .calendar .fc-list-view .table-list-view .list-view-time { width: 150px; font-size: 14px; color: #494949; text-align: center; } .calendar .fc-list-view .table-list-view .list-view-title { font-size: 14px; color: #5e5e5e; } .calendar .fc-list-view .table-list-view .list-view-title.no-left-border { border-left: 0 !important; padding-left: 0 !important; } .calendar .fc-list-view .table-list-view .list-view-blank { display: block; height: 45px; } .calendar .fc-list-view .table-list-view .list-view-bullet { display: inline-block; width: 10px; height: 10px; background: #0098D7; vertical-align: middle; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .calendar .fc-view { overflow: visible; } .calendar .fc-content { position: relative; } .calendar .fc-content .fc-event, .calendar .fc-content .fc-event:hover { cursor: pointer; overflow: visible; height: 20px; } .calendar .fc-content .fc-event .fc-event-inner, .calendar .fc-content .fc-event:hover .fc-event-inner { position: relative; overflow: visible; padding: 0; } .calendar .fc-content .fc-event .fc-event-inner .fc-event-title, .calendar .fc-content .fc-event:hover .fc-event-inner .fc-event-title { height: 20px; overflow: hidden; line-height: 20px; } .calendar .fc-content table tbody tr td .fc-day-number { z-index: 5; } .calendar .fc-grid .fc-event-time { display: inline-block; vertical-align: top; } .calendar .fc-grid .fc-event-title { display: inline-block; width: 100%; min-width: 112px; white-space: nowrap; } .calendar .fc-index { z-index: 20 !important; } .calendar .fc-dialog { display: none; position: absolute; left: 50%; bottom: 25px; z-index: 1001; width: 400px; background: #fff; margin-left: -201px; color: transparent; border: 1px solid #c9c9c9; } .calendar .fc-dialog.active { display: block; } .calendar .fc-dialog:before { position: absolute; left: 50%; top: 100%; z-index: 140; content: ''; height: 0; width: 0; border: 12px solid; border-top-color: #c9c9c9; margin-left: -12px; } .calendar .fc-dialog:after { position: absolute; left: 50%; top: 100%; z-index: 140; content: ''; height: 0; width: 0; border: 10px solid; border-top-color: #fff; margin-left: -10px; } .calendar .fc-dialog .fc-dcontent { position: relative; background: #fff; color: #5e5e5e; padding: 20px; } .calendar .fc-dialog .fc-dcontent .fc-dtitle { font-size: 14px; line-height: 20px; color: #0098D7; padding: 0 25px 10px 0; margin: 0 0 10px; border-bottom: 1px solid #c9c9c9; } .calendar .fc-dialog .fc-dcontent .fc-ddate { font-size: 12px; color: #555; margin-bottom: 10px; } .calendar .fc-dialog .fc-dcontent .fc-ddesc { margin-bottom: 10px; } .calendar .fc-dialog .fc-dcontent .fc-ddesc p { margin: 0; padding: 0; white-space: normal; word-wrap: break-word; line-height: 18px; } .calendar .fc-dialog .fc-dclose { display: inline-block; position: absolute; right: 20px; top: 20px; z-index: 20; content: ''; width: 15px; height: 15px; background-position: 0 -445px; } .calendar .fc-dialog .fc-dclose:hover, .calendar .fc-dialog .fc-dclose.icon-close-tooltip-calendar-hover { background-position: 0 -427px; } .calendar .fc-dialog .fc-dclose:active, .calendar .fc-dialog .fc-dclose.icon-close-tooltip-calendar-active { background-position: 0 -409px; } .calendar .fc-dialog .fc-dclose:hover { background-position: 0 -427px; } .calendar .fc-dialog .fc-dclose:active { background-position: 0 -409px; } .calendar .fc-event.fc-desktop:hover .fc-dialog { display: block; } .calendar .view-type { display: inline-block; vertical-align: top; text-align: center; width: 40px; height: 40px; background: #c9c9c9; margin-left: 1px; cursor: pointer; } .calendar .view-type.active { background: #f48b31; } .calendar .view-type .icon-grid-view { display: inline-block; width: 40px; height: 40px; background-position: 0 -1780px; } .calendar .view-type .icon-list-view { display: inline-block; width: 40px; height: 40px; background-position: 0 -1823px; } /*! Datepicker */ .ui-datepicker { display: none; z-index: 10; padding: 20px; background: #fff; border: 1px solid #c9c9c9; } .ui-datepicker .ui-datepicker-header { display: block; position: relative; margin: 0 0 10px; height: 40px; } .ui-datepicker .ui-datepicker-header .ui-corner-all { display: block; position: absolute; top: 50%; z-index: 1; margin-top: -15px; width: 30px; height: 30px; font-size: 0; line-height: 0; cursor: pointer; } .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-prev { left: 0; display: inline-block; width: 30px; height: 30px; background-position: 0 -1259px; } .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-prev.icon-pointer-left-hover { background-position: 0 -1226px; } .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-prev:active, .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-prev.icon-pointer-left-active { background-position: 0 -1160px; } .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-next { right: 0; display: inline-block; width: 30px; height: 30px; background-position: 0 -1391px; } .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-next:hover, .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-next.icon-pointer-right-hover { background-position: 0 -1358px; } .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-next:active, .ui-datepicker .ui-datepicker-header .ui-corner-all.ui-datepicker-next.icon-pointer-right-active { background-position: 0 -1292px; } .ui-datepicker .ui-datepicker-header .ui-datepicker-title { display: block; position: relative; padding: 0 40px; } .ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month, .ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year { display: block; margin-top: 5px; width: 49%; height: 30px; border: 1px solid #c9c9c9; outline: 0; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-month { float: right; } .ui-datepicker .ui-datepicker-header .ui-datepicker-title .ui-datepicker-year { float: left; } .ui-datepicker .ui-datepicker-calendar { width: 100%; } .ui-datepicker .ui-datepicker-calendar thead tr { background: #fff; border-bottom: 1px solid #c9c9c9; } .ui-datepicker .ui-datepicker-calendar tbody tr { border-bottom: 0; } .ui-datepicker .ui-datepicker-calendar tbody tr td { padding: 3px; } .ui-datepicker .ui-datepicker-calendar tbody tr td a { display: inline-block; width: 25px; height: 25px; color: #5e5e5e; line-height: 25px; text-align: center; border: 2px solid #fff; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .ui-datepicker .ui-datepicker-calendar tbody tr td a:hover { color: #ff9024; } .ui-datepicker .ui-datepicker-calendar tbody tr td a.ui-state-highlight { border-color: #0098D7; } .ui-datepicker .ui-datepicker-calendar tbody tr td a.ui-state-active { color: #fff; background: #0098D7; border-color: #0098D7; } /* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar { -ms-touch-action: none; touch-action: none; /* MSPointer events - direct all pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar { -ms-touch-action: auto; touch-action: auto; } .mCustomScrollBox { /* contains plugin's markup */ position: relative; overflow: hidden; height: 100%; max-width: 100%; outline: none; direction: ltr; } .mCSB_container { /* contains the original content */ overflow: hidden; width: auto; height: auto; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_inside > .mCSB_container { margin-right: 30px; } .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { margin-right: 0; } /* non-visible scrollbar */ .mCS-dir-rtl > .mCSB_inside > .mCSB_container { /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { margin-left: 0; } /* RTL direction/left-side scrollbar */ .mCSB_scrollTools { /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 16px; height: auto; left: auto; top: 0; right: 0; bottom: 0; } .mCSB_outside + .mCSB_scrollTools { right: -26px; } /* scrollbar position: outside */ .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { /* RTL direction/left-side scrollbar */ right: auto; left: 0; } .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */ .mCSB_scrollTools .mCSB_draggerContainer { /* contains the draggable element and dragger rail markup */ position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: auto; } .mCSB_scrollTools a + .mCSB_draggerContainer { margin: 20px 0; } .mCSB_scrollTools .mCSB_draggerRail { width: 2px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCSB_scrollTools .mCSB_dragger { /* the draggable element */ cursor: pointer; width: 100%; height: 30px; /* minimum dragger height */ z-index: 1; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { /* the dragger element */ position: relative; width: 4px; height: 100%; margin: 0 auto; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; text-align: center; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { width: 12px; /* auto-expanded scrollbar */ } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 8px; /* auto-expanded scrollbar */ } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown { display: block; position: absolute; height: 20px; width: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools .mCSB_buttonDown { bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 3. HORIZONTAL SCROLLBAR x-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_horizontal.mCSB_inside > .mCSB_container { margin-right: 0; margin-bottom: 30px; } .mCSB_horizontal.mCSB_outside > .mCSB_container { min-height: 100%; } .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden { margin-bottom: 0; } /* non-visible scrollbar */ .mCSB_scrollTools.mCSB_scrollTools_horizontal { width: auto; height: 16px; top: auto; right: 0; bottom: 0; left: 0; } .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { bottom: -26px; } /* scrollbar position: outside */ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer { margin: 0 20px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 2px; margin: 7px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger { width: 30px; /* minimum dragger width */ height: 100%; left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 4px; margin: 6px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { height: 12px; /* auto-expanded scrollbar */ margin: 2px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { height: 8px; /* auto-expanded scrollbar */ margin: 4px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { display: block; position: absolute; width: 20px; height: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft { left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { right: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 4. VERTICAL AND HORIZONTAL SCROLLBARS yx-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container_wrapper { position: absolute; height: auto; width: auto; overflow: hidden; top: 0; left: 0; right: 0; bottom: 0; margin-right: 30px; margin-bottom: 30px; } .mCSB_container_wrapper > .mCSB_container { padding-right: 30px; padding-bottom: 30px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical { bottom: 20px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal { right: 20px; } /* non-visible horizontal scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical { bottom: 0; } /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { right: 0; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { left: 20px; } /* non-visible scrollbar/RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal { left: 0; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper { /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container { padding-right: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container { padding-bottom: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden { margin-right: 0; /* non-visible scrollbar */ margin-left: 0; } /* non-visible horizontal scrollbar */ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden { margin-bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_scrollTools, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight { -webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail { -webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* default theme ("light") */ .mCSB_scrollTools { opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.75); filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight { background-image: url(mCSB_buttons.png); /* css sprites */ background-repeat: no-repeat; opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_buttonUp { background-position: 0 0; /* sprites locations light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px */ } .mCSB_scrollTools .mCSB_buttonDown { background-position: 0 -20px; /* sprites locations light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px */ } .mCSB_scrollTools .mCSB_buttonLeft { background-position: 0 -40px; /* sprites locations light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px */ } .mCSB_scrollTools .mCSB_buttonRight { background-position: 0 -56px; /* sprites locations light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px */ } .mCSB_scrollTools .mCSB_buttonUp:hover, .mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover { opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active { opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } /* theme: "dark" */ .mCS-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.15); } .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.85); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.9); } .mCS-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px 0; } .mCS-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -20px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -40px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -56px; } /* ---------------------------------------- */ /* theme: "light-2", "dark-2" */ .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { width: 4px; background-color: #fff; background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 4px; background-color: #fff; background-color: rgba(255, 255, 255, 0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 4px; margin: 6px auto; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); } .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px 0; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -20px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -40px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -56px; } /* theme: "dark-2" */ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px 0; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -20px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -40px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -56px; } /* ---------------------------------------- */ /* theme: "light-thick", "dark-thick" */ .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { width: 4px; background-color: #fff; background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; background-color: #fff; background-color: rgba(255, 255, 255, 0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 4px; margin: 6px 0; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 6px; margin: 5px auto; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp { background-position: -16px 0; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown { background-position: -16px -20px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft { background-position: -20px -40px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight { background-position: -20px -56px; } /* theme: "dark-thick" */ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp { background-position: -96px 0; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown { background-position: -96px -20px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft { background-position: -100px -40px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight { background-position: -100px -56px; } /* ---------------------------------------- */ /* theme: "light-thin", "dark-thin" */ .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail { background-color: #fff; background-color: rgba(255, 255, 255, 0.1); } .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 2px; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 2px; margin: 7px auto; } /* theme "dark-thin" */ .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.15); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px 0; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -20px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -40px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -56px; } /* ---------------------------------------- */ /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail { background-color: #fff; background-color: rgba(255, 255, 255, 0.15); } .mCS-rounded.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger { height: 14px; } .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 14px; margin: 0 1px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger { width: 14px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 14px; margin: 1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { width: 16px; /* auto-expanded scrollbar */ height: 16px; margin: -1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 4px; /* auto-expanded scrollbar */ } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { height: 16px; /* auto-expanded scrollbar */ width: 16px; margin: 0 -1px; } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { height: 4px; /* auto-expanded scrollbar */ margin: 6px 0; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp { background-position: 0 -72px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown { background-position: 0 -92px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft { background-position: 0 -112px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight { background-position: 0 -128px; } /* theme "rounded-dark", "rounded-dots-dark" */ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.15); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px -72px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -92px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -112px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -128px; } /* theme "rounded-dots", "rounded-dots-dark" */ .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail { width: 4px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { background-color: transparent; background-position: center; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); background-repeat: repeat-y; opacity: 0.3; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { height: 4px; margin: 6px 0; background-repeat: repeat-x; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp { background-position: -16px -72px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown { background-position: -16px -92px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft { background-position: -20px -112px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight { background-position: -20px -128px; } /* theme "rounded-dots-dark" */ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -96px -72px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -96px -92px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -100px -112px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -100px -128px; } /* ---------------------------------------- */ /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-repeat: repeat-y; background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { background-repeat: repeat-x; background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); } /* theme "3d", "3d-dark" */ .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger { height: 70px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger { width: 70px; } .mCS-3d.mCSB_scrollTools, .mCS-3d-dark.mCSB_scrollTools { opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { width: 8px; background-color: #000; background-color: rgba(0, 0, 0, 0.2); box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2); } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #555; } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 8px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 8px; margin: 4px 0; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 8px; margin: 4px auto; } .mCS-3d.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme "3d-dark" */ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1); } .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "3d-thick", "3d-thick-dark" */ .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools { opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical { right: 1px; } .mCS-3d-thick.mCSB_scrollTools_vertical, .mCS-3d-thick-dark.mCSB_scrollTools_vertical { box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); } .mCS-3d-thick.mCSB_scrollTools_horizontal, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal { bottom: 1px; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4); width: 12px; margin: 2px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #555; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 12px; width: auto; } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer { background-color: #000; background-color: rgba(0, 0, 0, 0.05); box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme: "3d-thick-dark" */ .mCS-3d-thick-dark.mCSB_scrollTools { box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal { box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #777; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { background-color: #fff; background-color: rgba(0, 0, 0, 0.05); box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "minimal", "minimal-dark" */ .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { right: 0; margin: 12px 0; } .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { bottom: 0; margin: 0 12px; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { left: 0; right: auto; } .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; } .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger { height: 50px; } .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger { width: 50px; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* theme: "minimal-dark" */ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* ---------------------------------------- */ /* theme "light-3", "dark-3" */ .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { width: 6px; background-color: #000; background-color: rgba(0, 0, 0, 0.2); } .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; } .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 6px; margin: 5px 0; } .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 12px; } .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { height: 12px; margin: 2px 0; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme "dark-3" */ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* ---------------------------------------- */ /* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */ .mCS-inset.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { width: 12px; background-color: #000; background-color: rgba(0, 0, 0, 0.2); } .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; margin: 3px 5px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 6px; margin: 5px 3px; position: absolute; width: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 12px; margin: 2px 0; } .mCS-inset.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme "inset-dark", "inset-2-dark", "inset-3-dark" */ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* theme "inset-2", "inset-2-dark" */ .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; border-width: 1px; border-style: solid; border-color: #fff; border-color: rgba(255, 255, 255, 0.2); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { border-color: #000; border-color: rgba(0, 0, 0, 0.2); } /* theme "inset-3", "inset-3-dark" */ .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail { background-color: #fff; background-color: rgba(255, 255, 255, 0.6); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.6); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.75); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); } /* ---------------------------------------- */ /*! Custom scrollbar */ .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: #0098D7; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background: #0098D7; } .mCSB_scrollTools .mCSB_draggerRail { background: #c9c9c9; } .mCSB_scrollTools.mCSB_scrollTools_onDrag .mCSB_dragger .mCSB_dragger_bar { background: #0098D7; } /*! Freeze pane */ .freeze-pane { display: block; position: relative; overflow: auto; } .freeze-pane table { white-space: nowrap; } .freeze-pane table.bordered thead tr th { border-left: 0; border-right: 1px solid #fff; } .freeze-pane table.bordered thead tr th:last-child { border-right: 1px solid #e2e2e2; } .freeze-pane table.bordered.DTFC_Cloned thead tr th:last-child { border-right: 1px solid #fff; } /*! Chosen, a Select Box Enhancer for jQuery and Prototype by Patrick Filler for Harvest, http://getharvest.com Version 1.3.0 Full source at https://github.com/harvesthq/chosen Copyright (c) 2011-2014 Harvest http://getharvest.com MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md This file is generated by `grunt build`, do not edit it by hand. */ /* @group Base */ .chosen-container { position: relative; display: inline-block; vertical-align: middle; font-size: 13px; zoom: 1; *display: inline; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .chosen-container * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .chosen-container .chosen-drop { position: absolute; top: 100%; left: -9999px; z-index: 1010; width: 100%; border: 1px solid #aaa; border-top: 0; background: #fff; box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15); } .chosen-container.chosen-with-drop .chosen-drop { left: 0; } .chosen-container a { cursor: pointer; } /* @end */ /* @group Single Chosen */ .chosen-container-single .chosen-single { position: relative; display: block; overflow: hidden; padding: 0 0 0 8px; height: 25px; border: 1px solid #aaa; border-radius: 5px; background-color: #fff; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #ffffff), color-stop(50%, #f6f6f6), color-stop(52%, #eeeeee), color-stop(100%, #f4f4f4)); background: -webkit-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); background: -moz-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); background: -o-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); background: linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); background-clip: padding-box; box-shadow: 0 0 3px white inset, 0 1px 1px rgba(0, 0, 0, 0.1); color: #444; text-decoration: none; white-space: nowrap; line-height: 24px; } .chosen-container-single .chosen-default { color: #999; } .chosen-container-single .chosen-single span { display: block; overflow: hidden; margin-right: 26px; text-overflow: ellipsis; white-space: nowrap; } .chosen-container-single .chosen-single-with-deselect span { margin-right: 38px; } .chosen-container-single .chosen-single abbr { position: absolute; top: 6px; right: 26px; display: block; width: 12px; height: 12px; background: url("../images/chosen/chosen-sprite.png") -42px 1px no-repeat; font-size: 1px; } .chosen-container-single .chosen-single abbr:hover { background-position: -42px -10px; } .chosen-container-single.chosen-disabled .chosen-single abbr:hover { background-position: -42px -10px; } .chosen-container-single .chosen-single div { position: absolute; top: 0; right: 0; display: block; width: 18px; height: 100%; } .chosen-container-single .chosen-single div b { display: block; width: 100%; height: 100%; background: url("../images/chosen/chosen-sprite.png") no-repeat 0px 2px; } .chosen-container-single .chosen-search { position: relative; z-index: 1010; margin: 0; padding: 3px 4px; white-space: nowrap; } .chosen-container-single .chosen-search input[type="text"] { margin: 1px 0; padding: 4px 20px 4px 5px; width: 100%; height: auto; outline: 0; border: 1px solid #aaa; background: white url("../images/chosen/chosen-sprite.png") no-repeat 100% -20px; background: url("../images/chosen/chosen-sprite.png") no-repeat 100% -20px; font-size: 1em; font-family: sans-serif; line-height: normal; border-radius: 0; } .chosen-container-single .chosen-drop { margin-top: -1px; border-radius: 0 0 4px 4px; background-clip: padding-box; } .chosen-container-single.chosen-container-single-nosearch .chosen-search { position: absolute; left: -9999px; } /* @end */ /* @group Results */ .chosen-container .chosen-results { color: #444; position: relative; overflow-x: hidden; overflow-y: auto; margin: 0 4px 4px 0; padding: 0 0 0 4px; max-height: 240px; -webkit-overflow-scrolling: touch; } .chosen-container .chosen-results li { display: none; margin: 0; padding: 5px 6px; list-style: none; line-height: 15px; word-wrap: break-word; -webkit-touch-callout: none; } .chosen-container .chosen-results li.active-result { display: list-item; cursor: pointer; } .chosen-container .chosen-results li.disabled-result { display: list-item; color: #ccc; cursor: default; } .chosen-container .chosen-results li.highlighted { background-color: #3875d7; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc)); background-image: -webkit-linear-gradient(#3875d7 20%, #2a62bc 90%); background-image: -moz-linear-gradient(#3875d7 20%, #2a62bc 90%); background-image: -o-linear-gradient(#3875d7 20%, #2a62bc 90%); background-image: linear-gradient(#3875d7 20%, #2a62bc 90%); color: #fff; } .chosen-container .chosen-results li.no-results { color: #777; display: list-item; background: #f4f4f4; } .chosen-container .chosen-results li.group-result { display: list-item; font-weight: bold; cursor: default; } .chosen-container .chosen-results li.group-option { padding-left: 15px; } .chosen-container .chosen-results li em { font-style: normal; text-decoration: underline; } /* @end */ /* @group Multi Chosen */ .chosen-container-multi .chosen-choices { position: relative; overflow: hidden; margin: 0; padding: 0 5px; width: 100%; height: auto !important; height: 1%; border: 1px solid #aaa; background-color: #fff; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff)); background-image: -webkit-linear-gradient(#eeeeee 1%, #ffffff 15%); background-image: -moz-linear-gradient(#eeeeee 1%, #ffffff 15%); background-image: -o-linear-gradient(#eeeeee 1%, #ffffff 15%); background-image: linear-gradient(#eeeeee 1%, #ffffff 15%); cursor: text; } .chosen-container-multi .chosen-choices li { float: left; list-style: none; } .chosen-container-multi .chosen-choices li.search-field { margin: 0; padding: 0; white-space: nowrap; } .chosen-container-multi .chosen-choices li.search-field input[type="text"] { margin: 1px 0; padding: 0; height: 25px; outline: 0; border: 0 !important; background: transparent !important; box-shadow: none; color: #999; font-size: 100%; font-family: sans-serif; line-height: normal; border-radius: 0; } .chosen-container-multi .chosen-choices li.search-choice { position: relative; margin: 3px 5px 3px 0; padding: 3px 20px 3px 5px; border: 1px solid #aaa; max-width: 100%; border-radius: 3px; background-color: #eeeeee; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee)); background-image: -webkit-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: -moz-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: -o-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-size: 100% 19px; background-repeat: repeat-x; background-clip: padding-box; box-shadow: 0 0 2px white inset, 0 1px 0 rgba(0, 0, 0, 0.05); color: #333; line-height: 13px; cursor: default; } .chosen-container-multi .chosen-choices li.search-choice span { word-wrap: break-word; } .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { position: absolute; top: 4px; right: 3px; display: block; width: 12px; height: 12px; background: url("../images/chosen/chosen-sprite.png") -42px 1px no-repeat; font-size: 1px; } .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { background-position: -42px -10px; } .chosen-container-multi .chosen-choices li.search-choice-disabled { padding-right: 5px; border: 1px solid #ccc; background-color: #e4e4e4; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee)); background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); color: #666; } .chosen-container-multi .chosen-choices li.search-choice-focus { background: #d4d4d4; } .chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close { background-position: -42px -10px; } .chosen-container-multi .chosen-results { margin: 0; padding: 0; } .chosen-container-multi .chosen-drop .result-selected { display: list-item; color: #ccc; cursor: default; } /* @end */ /* @group Active */ .chosen-container-active .chosen-single { border: 1px solid #5897fb; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); } .chosen-container-active.chosen-with-drop .chosen-single { border: 1px solid #aaa; -moz-border-radius-bottomright: 0; border-bottom-right-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff)); background-image: -webkit-linear-gradient(#eeeeee 20%, #ffffff 80%); background-image: -moz-linear-gradient(#eeeeee 20%, #ffffff 80%); background-image: -o-linear-gradient(#eeeeee 20%, #ffffff 80%); background-image: linear-gradient(#eeeeee 20%, #ffffff 80%); box-shadow: 0 1px 0 #fff inset; } .chosen-container-active.chosen-with-drop .chosen-single div { border-left: none; background: transparent; } .chosen-container-active.chosen-with-drop .chosen-single div b { background-position: -18px 2px; } .chosen-container-active .chosen-choices { border: 1px solid #5897fb; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); } .chosen-container-active .chosen-choices li.search-field input[type="text"] { color: #222 !important; } /* @end */ /* @group Disabled Support */ .chosen-disabled { opacity: 0.5 !important; cursor: default; } .chosen-disabled .chosen-single { cursor: default; } .chosen-disabled .chosen-choices .search-choice .search-choice-close { cursor: default; } /* @end */ /* @group Right to Left */ .chosen-rtl { text-align: right; } .chosen-rtl .chosen-single { overflow: visible; padding: 0 8px 0 0; } .chosen-rtl .chosen-single span { margin-right: 0; margin-left: 26px; direction: rtl; } .chosen-rtl .chosen-single-with-deselect span { margin-left: 38px; } .chosen-rtl .chosen-single div { right: auto; left: 3px; } .chosen-rtl .chosen-single abbr { right: auto; left: 26px; } .chosen-rtl .chosen-choices li { float: right; } .chosen-rtl .chosen-choices li.search-field input[type="text"] { direction: rtl; } .chosen-rtl .chosen-choices li.search-choice { margin: 3px 5px 3px 0; padding: 3px 5px 3px 19px; } .chosen-rtl .chosen-choices li.search-choice .search-choice-close { right: auto; left: 4px; } .chosen-rtl.chosen-container-single-nosearch .chosen-search, .chosen-rtl .chosen-drop { left: 9999px; } .chosen-rtl.chosen-container-single .chosen-results { margin: 0 0 4px 4px; padding: 0 4px 0 0; } .chosen-rtl .chosen-results li.group-option { padding-right: 15px; padding-left: 0; } .chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div { border-right: none; } .chosen-rtl .chosen-search input[type="text"] { padding: 4px 5px 4px 20px; background: white url("../images/chosen/chosen-sprite.png") no-repeat -30px -20px; background: url("../images/chosen/chosen-sprite.png") no-repeat -30px -20px; direction: rtl; } .chosen-rtl.chosen-container-single .chosen-single div b { background-position: 6px 2px; } .chosen-rtl.chosen-container-single.chosen-with-drop .chosen-single div b { background-position: -12px 2px; } /* @end */ /* @group Retina compatibility */ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 144dpi) { .chosen-rtl .chosen-search input[type="text"], .chosen-container-single .chosen-single abbr, .chosen-container-single .chosen-single div b, .chosen-container-single .chosen-search input[type="text"], .chosen-container-multi .chosen-choices .search-choice .search-choice-close, .chosen-container .chosen-results-scroll-down span, .chosen-container .chosen-results-scroll-up span { background-image: url("../images/chosen/chosen-sprite@2x.png") !important; background-size: 52px 37px !important; background-repeat: no-repeat !important; } } /* @end */ /*! Custom chosen */ .custom-chosen { display: block; *display: block; position: relative; } .custom-chosen .chosen-container { display: block; width: 100% !important; height: 40px; } .custom-chosen .chosen-container .chosen-drop { z-index: 2; padding: 0; box-shadow: none; background: #b8b8b8; border: 1px solid #c9c9c9; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .custom-chosen .chosen-container .chosen-search { display: block; position: relative; padding: 10px; background: #dfdfdf; } .custom-chosen .chosen-container .chosen-search input[type="text"] { display: block; position: relative; padding: 0 10px; margin: 0; width: 100%; height: 40px; background: #fff; border: 1px solid #c9c9c9; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .custom-chosen .chosen-container .chosen-search:after { display: block; position: absolute; top: 50%; right: 20px; z-index: 1; content: ''; margin-top: -8px; width: 13px; height: 15px; background-position: 0 -1020px; } .custom-chosen .chosen-container .chosen-results { display: block; margin: 0; padding: 0; } .custom-chosen .chosen-container .chosen-results li { padding: 0 10px; height: 40px; line-height: 40px; color: #fff; border-top: 1px solid #fff; } .custom-chosen .chosen-container .chosen-results li:before { display: none; } .custom-chosen .chosen-container .chosen-results li:hover, .custom-chosen .chosen-container .chosen-results li.result-selected, .custom-chosen .chosen-container .chosen-results li.highlighted { background: #f48b31; background-color: #f48b31; } .custom-chosen .chosen-container .chosen-results li em { text-decoration: none; } .custom-chosen .chosen-container .chosen-results li.no-results { color: #5e5e5e; } .custom-chosen .chosen-container-single .chosen-single { padding: 0 10px; height: 40px; background: #fff; background-color: #fff; box-shadow: none; border: 1px solid #c9c9c9; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .custom-chosen .chosen-container-single .chosen-single span { height: 40px; line-height: 40px; } .custom-chosen .chosen-container-single .chosen-single div { width: 40px; } .custom-chosen .chosen-container-single .chosen-single div b { background-position: 0 -281px; } .custom-chosen .chosen-container-single .chosen-single div b:hover, .custom-chosen .chosen-container-single .chosen-single div b.fancy-arrow-down-hover { background-position: 0 -238px; } .custom-chosen .chosen-container-single .chosen-single div b:active, .custom-chosen .chosen-container-single .chosen-single div b.fancy-arrow-down-active { background-position: 0 -195px; } .custom-chosen .chosen-container-single .chosen-single:hover div b { background-position: 0 -238px; } .custom-chosen .chosen-container-single .chosen-single:active div b { background-position: 0 -195px; } .custom-chosen .chosen-container-single.chosen-container-active.chosen-with-drop .chosen-single div b { background-position: 0 -195px; } /*! CKEditor custom */ .cke_editor_editor { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; -ms-box-shadow: none !important; -o-box-shadow: none !important; box-shadow: none !important; border: 1px solid #c9c9c9 !important; } .cke_top { border-bottom-color: #c9c9c9 !important; } .cke_bottom { border-top: 1px solid #c9c9c9 !important; background: #f6f6f6 !important; background-color: #f6f6f6 !important; background-image: none !important; } .cke_toolgroup { background: none !important; background-color: none !important; background-image: none !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; -ms-box-shadow: none !important; -o-box-shadow: none !important; box-shadow: none !important; border: 0 !important; border-bottom: 0 !important; } a.cke_button { border: 1px solid transparent !important; } a.cke_button_off:hover, a.cke_button_off:focus, a.cke_button_off:active, a.cke_button_disabled:hover, a.cke_button_disabled:focus, a.cke_button_disabled:active { background: #f6f6f6 !important; background-color: #f6f6f6 !important; background-image: none !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; -ms-box-shadow: none !important; -o-box-shadow: none !important; box-shadow: none !important; border-color: #c9c9c9 !important; } a.cke_button_on { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; -ms-box-shadow: none !important; -o-box-shadow: none !important; box-shadow: none !important; border-color: #c9c9c9 !important; } a.cke_button_on:hover, a.cke_button_on:focus, a.cke_button_on:active { background: #e2e2e2 !important; background-color: #e2e2e2 !important; background-image: none !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; -ms-box-shadow: none !important; -o-box-shadow: none !important; box-shadow: none !important; } /* Update 25 Feb 2015 */ /* * qTip2 - Pretty powerful tooltips - v2.2.1 * http://qtip2.com * * Copyright (c) 2014 * Released under the MIT licenses * http://jquery.org/license * * Date: Sat Sep 6 2014 08:21 EDT-0400 * Plugins: None * Styles: core */ .qtip { position: absolute; left: -28000px; top: -28000px; display: none; max-width: 280px; min-width: 50px; font-size: 10.5px; line-height: 12px; direction: ltr; box-shadow: none; padding: 0; } .qtip-content { position: relative; padding: 5px 9px; overflow: hidden; text-align: left; word-wrap: break-word; } .qtip-titlebar { position: relative; padding: 5px 35px 5px 10px; overflow: hidden; border-width: 0 0 1px; font-weight: bold; } .qtip-titlebar + .qtip-content { border-top-width: 0 !important; } /* Default close button class */ .qtip-close { position: absolute; right: -9px; top: -9px; z-index: 11; /* Overlap .qtip-tip */ cursor: pointer; outline: medium none; border: 1px solid transparent; } .qtip-titlebar .qtip-close { right: 4px; top: 50%; margin-top: -9px; } * html .qtip-titlebar .qtip-close { top: 16px; } /* IE fix */ .qtip-titlebar .ui-icon, .qtip-icon .ui-icon { display: block; text-indent: -1000em; direction: ltr; } .qtip-icon, .qtip-icon .ui-icon { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; text-decoration: none; } .qtip-icon .ui-icon { width: 18px; height: 14px; line-height: 14px; text-align: center; text-indent: 0; font: normal bold 10px/13px Tahoma,sans-serif; color: inherit; background: transparent none no-repeat -100em -100em; } /* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */ /* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */ /* Default tooltip style */ .qtip-default { border: 1px solid #F1D031; background-color: #FFFFA3; color: #555; } .qtip-default .qtip-titlebar { background-color: #FFEF93; } .qtip-default .qtip-icon { border-color: #CCC; background: #F1F1F1; color: #777; } .qtip-default .qtip-titlebar .qtip-close { border-color: #AAA; color: #111; } /*! Header */ .header { display: block; position: relative; border-bottom: 1px solid #c9c9c9; /* Navigator */ /* Logo */ } .header .navigator { display: block; padding: 10px 0; border-bottom: 1px solid #c9c9c9; } .header .navigator ul { display: block; margin: 0; padding: 0 0 0 25px; } .header .navigator ul li { display: block; position: relative; margin: 0 30px 0 0; padding: 0 0 0 20px; list-style: none; float: left; font-size: 12px; color: #808080; } .header .navigator ul li:before { display: block; position: absolute; top: 50%; left: 0; z-index: 1; content: ''; margin: -2px 0 0 -6px; width: 6px; height: 6px; background: #0098D7; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .header .navigator ul li:first-child:before { display: none; } .header .logo { display: block; padding: 20px 12px 15px 88px; } .header .logo a { display: inline-block; } /*! Top navigation */ .header { /* Sub-menu */ } .header .top-navigation { display: block; height: 35px; } .header .top-navigation .navigation { display: block; height: 35px; } .header .top-navigation .navigation.fixed-layout { position: fixed; top: 0; left: 0; z-index: 50; padding: 10px 0 0; width: 100%; height: auto; background: #fff; box-shadow: 0px 1px 5px #d8d8d8; } .header .top-navigation .navigation.fixed-layout:after { display: none; } .header .top-navigation .navigation.fixed-layout .logo-nav { display: block; } .header .top-navigation .navigation.fixed-layout .menu { padding-top: 10px; } .header .top-navigation .navigation.fixed-layout .absolute-divider { display: none; } .header .top-navigation .navigation .logo-nav { display: none; margin-right: 20px; } .header .top-navigation .navigation .logo-nav a { display: block; padding: 0; width: 231px; height: 75px; background: url("../images/logo-small.png"); } .header .top-navigation .navigation .logo-nav .logo-text { display: block; padding: 5px 0 0; font-size: 14px; font-weight: bold; color: #0098D7; line-height: 16px; } .header .top-navigation .navigation .logo-nav .logo-text .business-unit { display: inline-block; vertical-align: top; } .header .top-navigation .navigation .logo-nav .logo-text .app-name { display: inline-block; vertical-align: top; margin-left: 15px; padding-left: 15px; border-left: 1px solid #c9c9c9; } .header .top-navigation .navigation .menu { display: block; position: relative; margin: 0; padding: 0; /* Expand menu */ /* Expand Notification */ /* Expand settings */ /* Expand search form */ } .header .top-navigation .navigation .menu > li { display: block; position: relative; list-style: none; margin: 0; padding: 7px 0 0; float: left; height: 40px; line-height: 30px; border-top: 1px solid #fff; } .header .top-navigation .navigation .menu > li.current { background: #f9f9f9; border-top-color: #c9c9c9; /*> .sub-menu { display: block; }*/ } .header .top-navigation .navigation .menu > li.current:before { display: block; position: absolute; top: 0; right: 100%; z-index: 1; content: ''; width: 1px; height: 100%; background: #c9c9c9; } .header .top-navigation .navigation .menu > li.current:after { display: block; position: absolute; top: 0; right: 0; z-index: 1; content: ''; width: 1px; height: 100%; background: #c9c9c9; } .header .top-navigation .navigation .menu > li.current > a, .header .top-navigation .navigation .menu > li.current > span.wrapper { position: relative; } .header .top-navigation .navigation .menu > li.current > a:after, .header .top-navigation .navigation .menu > li.current > span.wrapper:after { display: block; position: absolute; top: 100%; left: 0; z-index: 30; margin-top: 6px; content: ''; width: 100%; height: 5px; background: #f9f9f9; } .header .top-navigation .navigation .menu > li.current:first-child:before { right: auto; left: 0; } .header .top-navigation .navigation .menu > li > a, .header .top-navigation .navigation .menu > li > span.wrapper { display: inline-block; vertical-align: top; padding: 0 10px; height: 30px; color: #777; border-right: 1px solid #c9c9c9; } .header .top-navigation .navigation .menu > li > a .icon, .header .top-navigation .navigation .menu > li > span.wrapper .icon { vertical-align: middle; } .header .top-navigation .navigation .menu > li > a .label, .header .top-navigation .navigation .menu > li > span.wrapper .label { display: inline-block; font-size: 12px; } .header .top-navigation .navigation .menu > li:first-child > a, .header .top-navigation .navigation .menu > li:first-child > span.wrapper { border-left: 1px solid #c9c9c9; } .header .top-navigation .navigation .menu > li.has-child > a, .header .top-navigation .navigation .menu > li.has-child > span.wrapper { padding: 0 28px 0 13px; } .header .top-navigation .navigation .menu > li.has-child > a:before, .header .top-navigation .navigation .menu > li.has-child > span.wrapper:before { display: block; position: absolute; top: 50%; right: 0; z-index: 1; content: ''; margin: -3px 14px 0 0; width: 8px; height: 5px; background-position: 0 -888px; } .header .top-navigation .navigation .menu > li.has-child.current > a:before, .header .top-navigation .navigation .menu > li.has-child.current > span.wrapper:before { margin: -1px 13px 0 0; } .header .top-navigation .navigation .menu > li.expand-menu > a .label, .header .top-navigation .navigation .menu > li.expand-menu > span.wrapper .label { text-transform: uppercase; } .header .top-navigation .navigation .menu > li.expand-menu.current { background: #0090d1; } .header .top-navigation .navigation .menu > li.expand-menu.current > a, .header .top-navigation .navigation .menu > li.expand-menu.current > span.wrapper { background: #0090d1; } .header .top-navigation .navigation .menu > li.expand-menu.current > a:after, .header .top-navigation .navigation .menu > li.expand-menu.current > span.wrapper:after { background: #0090d1; } .header .top-navigation .navigation .menu > li.expand-menu.current > a .icon-burger-menu, .header .top-navigation .navigation .menu > li.expand-menu.current > span.wrapper .icon-burger-menu { background-position: 0 -237px; } .header .top-navigation .navigation .menu > li.expand-menu.current > a .label, .header .top-navigation .navigation .menu > li.expand-menu.current > span.wrapper .label { color: #fff; } .header .top-navigation .navigation .menu > li.expand-menu.current .expand-menu-container > .sub-menu { display: block; top: 0; } .header .top-navigation .navigation .menu .sub-menu { display: none; position: absolute; top: 47px; left: 0; z-index: 25; margin: 0; padding: 0; } .header .top-navigation .navigation .menu .sub-menu li { display: block; position: relative; list-style: none; margin: 0; padding: 0; } .header .top-navigation .navigation .menu .expand-menu { display: block; } .header .top-navigation .navigation .menu .expand-menu > a { padding: 0 20px 0 20px; } .header .top-navigation .navigation .menu .expand-menu > a .label { margin-left: 5px; } .header .top-navigation .navigation .menu .expand-notification { display: block; } .header .top-navigation .navigation .menu .expand-notification > a .notif-count { display: block; position: absolute; bottom: 100%; left: 50%; z-index: 1; margin-bottom: -7px; margin-left: -8px; width: 33px; height: 15px; font-size: 10px; color: #fff; line-height: 15px; text-align: center; background: #f48b31; } .header .top-navigation .navigation .menu .expand-notification > a .notif-count:before { display: block; position: absolute; top: 100%; left: 0; z-index: 1; content: ''; margin-top: -1px; width: 7px; height: 5px; color: #fff; background-position: 0 -914px; } .header .top-navigation .navigation .menu .expand-notification.current > a .notif-count { margin-bottom: 0; } .header .top-navigation .navigation .menu .expand-settings { display: block; } .header .top-navigation .navigation .menu .expand-settings > a img { display: inline-block; margin-left: 10px; width: 30px; height: 30px; vertical-align: middle; } .header .top-navigation .navigation .menu .expand-settings .sub-menu { left: auto; right: 0; } .header .top-navigation .navigation .menu .expand-search-form { display: block; } .header .top-navigation .navigation .menu .expand-search-form > span.wrapper { padding: 0 4px 0 14px; } .header .top-navigation .navigation .menu .expand-search-form .icon-click-area { display: block; position: absolute; top: 10px; left: 0; z-index: 1; width: 43px; height: 30px; cursor: pointer; } .header .top-navigation .navigation .menu .expand-search-form .search-form { display: inline-block; vertical-align: middle; margin-right: 5px; } .header .top-navigation .navigation .menu .expand-search-form .search-form .search-form-field { display: none; padding: 0; width: 0; height: 22px; font-size: 12px; color: #5e5e5e; line-height: 12px; background: #fff; border: 0; outline: 0; border-bottom: 1px solid #fff; } .header .top-navigation .navigation .menu .expand-search-form .search-form .search-form-field.has-border { border-bottom-color: #0098D7; } .header .top-navigation { /* Expand Menu */ /* Expand notification */ /* Expand settings */ } .header .top-navigation .expand-menu .expand-menu-container { display: block; position: absolute; top: 47px; left: 0; z-index: 26; width: 940px; overflow: hidden; } .header .top-navigation .expand-menu .sub-menu-child-indicator { display: block; position: absolute; top: 0; left: 0; z-index: 27; content: ''; width: 12px; height: 20px; background-position: 0 -865px; } .header .top-navigation .expand-menu .sub-menu-child-indicator.primary { background-position: 0 -819px; } .header .top-navigation .expand-menu .sub-menu-child-indicator.zebra { background-position: 0 -842px; } .header .top-navigation .expand-menu .sub-menu { width: 235px; background: #0090d1; border: 1px solid #c9c9c9; /* custom scrollbar */ } .header .top-navigation .expand-menu .sub-menu.cloning-menu { background: #f1f1f1; box-shadow: 0 0 5px #d8d8d8; } .header .top-navigation .expand-menu .sub-menu.cloning-menu.zebra { background: #e2e2e2; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li a { color: #5e5e5e; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li:before { background: #c9c9c9; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li:hover a { color: #0098D7; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li.has-menu a:after { background-position: 0 -796px; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li.current a { color: #0098D7; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li.current a:after { background: #bababa; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li.divider { background: #f9f9f9; border-top: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9; } .header .top-navigation .expand-menu .sub-menu.cloning-menu li.divider:before { display: none; } .header .top-navigation .expand-menu .sub-menu li:before { display: block; position: absolute; bottom: 0; left: 20px; right: 20px; z-index: 1; content: ''; height: 1px; background: #30a3d7; } .header .top-navigation .expand-menu .sub-menu li a { display: block; position: relative; padding: 20px 30px 20px 20px; font-size: 14px; color: #fff; line-height: 18px; } .header .top-navigation .expand-menu .sub-menu li.divider { z-index: 1; margin-top: -1px; height: 1px; background: #0090d1; border-top: 1px solid #30a3d7; border-bottom: 1px solid #30a3d7; } .header .top-navigation .expand-menu .sub-menu li.divider:before { display: none; } .header .top-navigation .expand-menu .sub-menu li.sub-title a { font-size: 15px; font-weight: 500; } .header .top-navigation .expand-menu .sub-menu li.has-menu a { position: relative; } .header .top-navigation .expand-menu .sub-menu li.has-menu a:after { display: block; position: absolute; top: 50%; right: 20px; z-index: 1; content: ''; margin-top: -10px; width: 12px; height: 20px; background-position: 0 -773px; } .header .top-navigation .expand-menu .sub-menu li.current a { color: #fff; } .header .top-navigation .expand-menu .sub-menu li.current a:after { margin-top: -1px; width: 12px; height: 2px; background: #fff; } .header .top-navigation .expand-menu .sub-menu li.cloning-title a { font-weight: bold; } .header .top-navigation .expand-menu .sub-menu li:hover a { color: #fff; } .header .top-navigation .expand-menu .sub-menu .sub-sub-menu { display: none; } .header .top-navigation .expand-menu .sub-menu .mCSB_inside > .mCSB_container { margin-right: 0; overflow: inherit; } .header .top-navigation .expand-menu .sub-menu .mCSB_scrollTools .mCSB_draggerRail { background: none; } .header .top-navigation .expand-menu .sub-menu .mCustomScrollBox { overflow: inherit; } .header .top-navigation .expand-notification .sub-menu { width: 278px; border: 1px solid #c9c9c9; } .header .top-navigation .expand-notification .sub-menu li.sub-title { padding: 10px 20px; font-size: 12px; font-weight: bold; line-height: 12px; background: #f9f9f9; border-bottom: 1px solid #c9c9c9; } .header .top-navigation .expand-notification .sub-menu li.sub-title a { display: inline-block; position: absolute; right: 20px; z-index: 1; font-size: 12px; font-weight: normal; color: #919191; line-height: 12px; } .header .top-navigation .expand-notification .sub-menu li.list-notification { padding: 0 20px; background: #fff; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification { display: block; position: relative; padding: 20px 0; border-top: 1px solid #c9c9c9; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification:first-child { border-top: 0; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification .thumbnail { display: block; position: absolute; top: 20px; left: 0; z-index: 1; padding: 1px; width: 45px; height: 45px; overflow: hidden; background: #fff; border: 1px solid #c9c9c9; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification .thumbnail img { display: block; width: 100%; height: auto; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification .details { display: block; position: relative; padding-left: 58px; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification .details .description { display: block; margin-bottom: 5px; font-size: 13px; color: #5e5e5e; line-height: 15px; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification .details .description a { color: #5e5e5e; text-decoration: underline; } .header .top-navigation .expand-notification .sub-menu li.list-notification .notification .details .date { display: block; font-size: 10px; line-height: 10px; color: #5e5e5e; } .header .top-navigation .expand-notification .sub-menu li.view-all { display: block; height: 43px; line-height: 43px; text-align: center; text-transform: uppercase; background: #bababa; } .header .top-navigation .expand-notification .sub-menu li.view-all a { display: block; height: 43px; font-size: 12px; color: #fff; } .header .top-navigation .expand-settings .sub-menu { width: 278px; border: 1px solid #c9c9c9; } .header .top-navigation .expand-settings .sub-menu li.sub-title { padding: 10px 20px; font-size: 12px; font-weight: bold; line-height: 12px; background: #f9f9f9; border-bottom: 1px solid #c9c9c9; } .header .top-navigation .expand-settings .sub-menu li.setting-content { padding: 20px; min-height: 85px; background: #fff; } .header .top-navigation .expand-settings .sub-menu li.setting-content .avatar { display: block; position: absolute; top: 20px; left: 20px; z-index: 1; padding: 2px; width: 80px; height: 80px; overflow: hidden; background: #fff; border: 1px solid #c9c9c9; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .header .top-navigation .expand-settings .sub-menu li.setting-content .avatar img { display: block; width: 100%; height: auto; } .header .top-navigation .expand-settings .sub-menu li.setting-content .details { display: block; padding-left: 100px; color: #5e5e5e; } .header .top-navigation .expand-settings .sub-menu li.setting-content .details .student-name { display: block; margin-bottom: 3px; font-size: 12px; line-height: 14px; text-transform: uppercase; } .header .top-navigation .expand-settings .sub-menu li.setting-content .details .email-address { display: block; margin-bottom: 10px; font-size: 12px; line-height: 12px; } .header .top-navigation .expand-settings .sub-menu li.setting-content .details .link { display: block; margin-bottom: 4px; font-size: 13px; font-weight: 500; line-height: 13px; } .header .top-navigation .expand-settings .sub-menu li.setting-content .details .link a { color: #5e5e5e; text-decoration: underline; } .header .top-navigation .expand-settings .sub-menu li.logout { display: block; height: 43px; line-height: 43px; text-align: center; text-transform: uppercase; background: #f48b31; } .header .top-navigation .expand-settings .sub-menu li.logout a { display: block; height: 43px; font-size: 12px; color: #fff; } /*! Components */ /*! Breadcrumb */ .breadcrumb { display: block; position: relative; padding: 30px 0; } .breadcrumb .wrap { display: block; } .breadcrumb .wrap ul { display: block; margin: 0; padding: 0; font-size: 0; line-height: 0; text-align: left; } .breadcrumb .wrap ul li { display: inline-block; position: relative; list-style: none; margin: 0 0 0 28px; padding: 0; font-size: 12px; color: #0098D7; line-height: 12px; } .breadcrumb .wrap ul li a { color: #919191; } .breadcrumb .wrap ul li:before { display: block; position: absolute; top: 50%; right: 100%; z-index: 1; content: ''; margin: -7px 10px 0 0; width: 8px; height: 14px; background-position: 0 -89px; } .breadcrumb .wrap ul li:first-child { margin: 0; } .breadcrumb .wrap ul li:first-child:before { display: none; } /* Update 26 Feb 2015 */ .box-container .breadcrumb { margin-bottom: 20px; padding: 0 0 20px; border-bottom: 1px solid #c9c9c9; } /*! User profile */ .user-profile { display: block; position: relative; padding: 50px 0; border-bottom: 1px solid #c9c9c9; } .user-profile .thumbnail { display: block; float: left; width: 240px; } .user-profile .thumbnail .avatar { display: block; margin: auto; width: 167px; height: 167px; overflow: hidden; border: 1px solid #c9c9c9; -webkit-border-radius: 167px; -khtml-border-radius: 167px; -moz-border-radius: 167px; -ms-border-radius: 167px; -o-border-radius: 167px; border-radius: 167px; } .user-profile .thumbnail .avatar img { display: block; width: 100%; height: auto; } .user-profile .details { display: block; float: left; width: 695px; } .user-profile .details .student-name { display: block; margin: 0; padding: 0; font-size: 24px; font-weight: bold; color: #0098D7; } .user-profile .details .position { display: block; } .user-profile .details .field { display: block; margin: 0 0 10px; } .user-profile .details .field.with-divider { padding-bottom: 5px; border-bottom: 1px solid #c9c9c9; } .user-profile .details .field .label { display: block; font-weight: bold; } .user-profile .details .field .value { display: block; font-size: 13px; color: #919191; line-height: 19px; } .user-profile .details .action { display: block; text-align: right; } .user-profile .details .action a { display: inline-block; padding: 2px 10px; font-size: 12px; color: #5e5e5e; text-transform: uppercase; border-left: 1px solid #c9c9c9; } /*! User role */ .user-role { display: block; } .user-role .wrap { display: block; position: relative; padding: 40px 0 30px; } .user-role .wrap .field { display: block; padding: 0 30px; } .user-role .wrap .field .label { display: inline-block; vertical-align: middle; margin-right: 10px; } .user-role .wrap .field .component { display: inline-block; vertical-align: middle; } .user-role .wrap .field .component .login-role { display: block; position: relative; width: 200px; height: 40px; min-height: 40px; } .user-role .wrap .field .component .login-role:after { display: block; position: absolute; top: 0; right: 0; z-index: 0; content: ''; width: 10px; height: 40px; background-position: 0 -152px; } .user-role .wrap .field .component .login-role select { display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 40px; min-height: 40px; zoom: 1; filter: alpha(opacity=0); opacity: 0; } .user-role .wrap .field .component .login-role .combobox-label { display: block; position: relative; padding: 0 20px 0 10px; height: 40px; color: #5e5e5e; line-height: 40px; background: transparent; border-bottom: 1px solid #c9c9c9; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .user-role .wrap .field .component .login-role .ffSelectWrapper { width: 100%; font-size: 13px; margin: 0; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect { text-align: left; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectButton { position: relative; height: 40px; cursor: pointer; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectButton:after { position: absolute; top: 0; right: 0; z-index: 1; content: ''; width: 10px; height: 40px; background-position: 0 -152px; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectButton:before { display: block; position: absolute; bottom: 0; left: 0; z-index: 1; content: ''; width: 100%; height: 1px; background: #c9c9c9; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectButton span { display: block; position: relative; background: #fff; padding: 6px 15px 4px; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper { top: 0; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuTop { display: none; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG { background: #b8b8b8; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid { padding: 0; margin: 0; background: #b8b8b8; color: white; max-height: 174px; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul { margin: 0; padding: 0; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li { background: #b8b8b8; padding: 13px 25px 11px 15px; position: relative; line-height: 1.3; list-style: none; cursor: pointer; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li span { font-size: 13px; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li.on { background: #f48b31; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li.selected:after { position: absolute; top: 50%; right: 10px; content: ''; margin-top: -6px; width: 11px; height: 11px; background-position: 0 -481px; } .user-role .wrap .field .component .login-role .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuBottom { display: none; } .user-role .wrap .field .component .login-role .ffSelectWrapper:hover .ffSelect .ffSelectButton:after { background-position: 0 -152px; } .user-role .wrap .field .component .login-role .ffSelectWrapper.active .ffSelect .ffSelectButton:after { background-position: 0 -152px; } /*! Body navigation */ .body-navigation { display: block; position: relative; } .body-navigation.on-pre-content { background: #f9f9f9; border-top: 1px solid #c9c9c9; } .body-navigation.on-pre-content .nav-body { display: none; } .body-navigation .nav-head { display: block; position: relative; padding: 0; min-height: 30px; border-bottom: 1px solid #c9c9c9; } .body-navigation .nav-head ul { display: block; margin: auto 50px; padding: 0; font-size: 0; text-align: center; white-space: nowrap; } .body-navigation .nav-head ul li { display: inline-block; position: relative; margin: 0; padding: 20px 0; list-style: none; width: 16.67%; font-size: 15px; color: transparent; line-height: 17px; vertical-align: top; white-space: normal; } .body-navigation .nav-head ul li a { display: block; padding: 0 15px; color: #919191; border-left: 1px solid #c9c9c9; } .body-navigation .nav-head ul li a .label { display: inline-block; line-height: 17px; } .body-navigation .nav-head ul li:first-child a { border-left: 0; } .body-navigation .nav-head ul li:hover a { color: #ff9024; } .body-navigation .nav-head ul li.current a { position: relative; color: transparent; } .body-navigation .nav-head ul li.current a .label { color: #ff9024; } .body-navigation .nav-head ul li.current:before { display: block; position: absolute; bottom: 0; left: 15px; right: 15px; z-index: 2; content: ''; margin-top: 26px; height: 5px; background: #ff9024; } .body-navigation .nav-head ul li.current:after { display: block; position: absolute; top: 100%; left: 50%; z-index: 2; content: ''; margin: 0 0 0 -10px; width: 0; height: 0; border: 10px solid; border-top-color: #ff9024; } .body-navigation .nav-head.has-navigation .container { position: relative; } .body-navigation .nav-head.has-navigation ul { white-space: nowrap; overflow: hidden; } .body-navigation .nav-head.has-navigation ul li { width: 16.67%; white-space: normal; } .body-navigation .nav-head.has-navigation .btn-nav { display: block; position: absolute; top: 50%; z-index: 1; content: ''; margin-top: -20px; width: 30px; height: 30px; } .body-navigation .nav-head.has-navigation .btn-nav.prev { left: 0; background-position: 0 -1259px; } .body-navigation .nav-head.has-navigation .btn-nav.prev:hover, .body-navigation .nav-head.has-navigation .btn-nav.prev.icon-pointer-left-hover { background-position: 0 -1226px; } .body-navigation .nav-head.has-navigation .btn-nav.prev:active, .body-navigation .nav-head.has-navigation .btn-nav.prev.icon-pointer-left-active { background-position: 0 -1160px; } .body-navigation .nav-head.has-navigation .btn-nav.next { right: 0; background-position: 0 -1391px; } .body-navigation .nav-head.has-navigation .btn-nav.next:hover, .body-navigation .nav-head.has-navigation .btn-nav.next.icon-pointer-right-hover { background-position: 0 -1358px; } .body-navigation .nav-head.has-navigation .btn-nav.next:active, .body-navigation .nav-head.has-navigation .btn-nav.next.icon-pointer-right-active { background-position: 0 -1292px; } .body-navigation .nav-body { display: block; position: relative; } .body-navigation .nav-body .nav-body-item { display: block; position: relative; } .body-navigation .nav-body .nav-body-item .inside { display: block; margin: auto; padding: 60px 0 40px; width: 940px; } /*! Form */ /*! Checkbox */ .group-checkbox { display: block; text-align: left; } .group-checkbox .custom-checkbox { display: inline-block; margin-left: 20px; } .group-checkbox .custom-checkbox:first-child { margin-left: 0; } .custom-checkbox { display: inline-block; position: relative; min-width: 16px; min-height: 16px; } .custom-checkbox .label { display: inline-block; padding-left: 2px; font-size: 13px; color: #5e5e5e; line-height: 15px; text-transform: none; cursor: pointer; } /*! Radio button */ .group-radiobutton { display: block; text-align: left; } .group-radiobutton .custom-radiobutton { display: inline-block; margin-left: 20px; } .group-radiobutton .custom-radiobutton:first-child { margin-left: 0; } .custom-radiobutton { display: inline-block; position: relative; min-width: 16px; min-height: 16px; } .custom-radiobutton .label { display: inline-block; vertical-align: top; padding-left: 2px; font-size: 13px; color: #5e5e5e; line-height: 22px; text-transform: none; cursor: pointer; } /*! Datepicker */ .custom-datepicker { display: block; position: relative; } .custom-datepicker .icon-area { display: block; position: absolute; top: 0; right: 0; z-index: 1; content: ''; width: 40px; height: 40px; background-position: 0 -438px; cursor: pointer; } /*! Uploader */ .custom-uploader { display: block; position: relative; } .custom-uploader .upload-area { display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 40px; zoom: 1; opacity: 0; filter: alpha(opacity=0); background: transparent; cursor: pointer; } .custom-uploader .icon-area { display: block; position: absolute; top: 0; right: 0; z-index: 0; content: ''; width: 40px; height: 40px; background-position: 0 -614px; } .custom-uploader input[type="text"][readonly="readonly"] { background: #fff !important; } /*! Search */ .custom-search { display: block; position: relative; } .custom-search .icon-area { display: block; position: absolute; top: 0; right: 0; z-index: 1; content: ''; width: 40px; height: 40px; background-position: 0 -571px; cursor: pointer; } /* Custom combobox */ .custom-combobox { display: block; position: relative; height: 40px; background: #fff; } .custom-combobox:after { display: block; position: absolute; top: 0; right: 0; z-index: 0; content: ''; width: 40px; height: 40px; background-position: 0 -281px; } .custom-combobox:after:hover, .custom-combobox:after.fancy-arrow-down-hover { background-position: 0 -238px; } .custom-combobox:after:active, .custom-combobox:after.fancy-arrow-down-active { background-position: 0 -195px; } .custom-combobox:hover:after { background-position: 0 -238px; } .custom-combobox .combobox-label { display: block; position: relative; padding: 0 50px 0 10px; height: 40px; color: #5e5e5e; line-height: 40px; background: transparent; border: 1px solid #c9c9c9; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .custom-combobox select { display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 40px; min-height: 40px; zoom: 1; filter: alpha(opacity=0); opacity: 0; } .custom-combobox.disabled .combobox-label { background: #e4e4e4; } .custom-combobox.disabled:hover:after { background-position: 0 -281px; } .custom-combobox.disabled:hover:after:hover, .custom-combobox.disabled:hover:after.fancy-arrow-down-hover { background-position: 0 -238px; } .custom-combobox.disabled:hover:after:active, .custom-combobox.disabled:hover:after.fancy-arrow-down-active { background-position: 0 -195px; } /* Input group */ .input-group { position: relative; display: table; width: 100%; border-collapse: separate; } .input-group .textbox { display: table-cell; } .input-group .addon { display: table-cell; padding: 0 12px; width: 1%; white-space: nowrap; vertical-align: middle; background: #e4e4e4; border: 1px solid #c9c9c9; } .input-group .addon:first-child { border-right: 0; } .input-group .addon:last-child { border-left: 0; } /* Update 15 April 2015 */ .search-filter-form { display: block; position: relative; margin: 0 0 30px; padding: 20px 20px 0; background: #f6f6f6; border: 1px solid #c9c9c9; } /*! Popup */ .fancybox-wrap { display: block; } .fancybox-skin { padding: 0 !important; background: #fff; -webkit-border-radius: 0; -khtml-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .fancybox-close { top: 30px; right: 30px; content: ''; width: 20px; height: 20px; background-image: url("../images/sprites-icon/icon-close.png"); } .fancybox-close:hover { background-image: url("../images/sprites-icon/icon-close-hover.png"); } .fancybox-close:active { background-image: url("../images/sprites-icon/icon-close-active.png"); } .popup .divider { display: block; width: 100%; height: 1px; background: #c9c9c9; } .popup .popup-content { display: block; width: 640px; padding: 80px; } /* Popup using Formalhaut */ .popup-border { position: absolute; z-index: 11005; padding: 0; background: #fff; } .popup-background { position: absolute; z-index: 11000; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); } .popup-full-wrap { position: fixed; top: 0; left: 0; z-index: 10999; opacity: 0; } .popup-inner-wrap { position: absolute; z-index: 11001; overflow: auto; } .popup-second-inner-wrap { padding: 30px 0; } .popup-close-button { position: absolute; top: 30px; right: 30px; width: 20px; height: 20px; font-size: 14px; text-align: center; text-indent: -9999px; cursor: pointer; background-image: url("../images/sprites-icon/icon-close.png"); } .popup-close-button:hover { background-image: url("../images/sprites-icon/icon-close-hover.png"); } .popup-close-button:active { background-image: url("../images/sprites-icon/icon-close-active.png"); } /*! Pagination */ .pagination { display: block; position: relative; margin-top: 40px; height: 40px; text-align: right; } .pagination .page-display { display: inline-block; margin-right: 10px; padding-right: 10px; font-size: 13px; vertical-align: top; height: 40px; line-height: 40px; border-right: 1px solid #c9c9c9; } .pagination .page-number { display: inline-block; margin-right: 10px; vertical-align: top; height: 40px; font-size: 0; line-height: 40px; } .pagination .page-number .item { display: inline-block; padding: 0 6px; font-size: 13px; color: #919191; } .pagination .page-number .item:hover, .pagination .page-number .item.current { color: #5e5e5e; text-decoration: underline; } .pagination .page-button { display: inline-block; vertical-align: top; height: 40px; font-size: 0; } .pagination .page-button .prev, .pagination .page-button .next { display: inline-block; width: 40px; height: 40px; } .pagination .page-button .prev.disabled, .pagination .page-button .next.disabled { background-position: 0 -46px; } .pagination .page-button .prev.disabled:hover, .pagination .page-button .prev.disabled:active, .pagination .page-button .next.disabled:hover, .pagination .page-button .next.disabled:active { background-position: 0 -46px; } .pagination .page-button .prev { margin-right: 1px; background-position: 0 -1155px; } .pagination .page-button .prev:hover, .pagination .page-button .prev.pagination-prev-hover { background-position: 0 -1112px; } .pagination .page-button .prev:active, .pagination .page-button .prev.pagination-prev-active { background-position: 0 -1069px; } .pagination .page-button .next { background-position: 0 -1026px; } .pagination .page-button .next:hover, .pagination .page-button .next.pagination-next-hover { background-position: 0 -983px; } .pagination .page-button .next:active, .pagination .page-button .next.pagination-next-active { background-position: 0 -940px; } /*! Legend */ .legend { display: block; position: relative; padding: 20px; background: #e2e2e2; } .legend.new-layout { background: #f6f6f6; border: 1px solid #c9c9c9; } .legend .header { display: block; margin: 0 0 10px; padding: 0 0 10px; font-weight: bold; text-transform: uppercase; border-bottom: 1px solid #c9c9c9; } .legend .group-item .item { padding: 5px 10px; } .legend .group-item .item .bullet { display: inline-block; vertical-align: middle; width: 13px; height: 13px; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .legend .group-item .item .label { display: inline-block; vertical-align: middle; } /*! Tabulation */ .tabulation { display: block; position: relative; } .tabulation .tab-head { display: block; position: relative; border-bottom: 1px solid #c9c9c9; } .tabulation .tab-head ul { display: block; margin: auto; padding: 0; font-size: 0; } .tabulation .tab-head ul li { display: inline-block; position: relative; vertical-align: top; border-top: 1px solid #c9c9c9; border-right: 1px solid #c9c9c9; } .tabulation .tab-head ul li a { display: block; padding: 15px 20px; font-size: 12px; color: #5e5e5e; text-transform: uppercase; background: #f6f6f6; } .tabulation .tab-head ul li:first-child { border-left: 1px solid #c9c9c9; } .tabulation .tab-head ul li.current a { font-weight: bold; color: #0098D7; background: #fff; } .tabulation .tab-head ul li.current:before { display: block; position: absolute; top: 100%; left: 0; z-index: 1; content: ''; width: 100%; height: 1px; background: #fff; } .tabulation .tab-body { display: block; position: relative; padding-top: 60px; white-space: nowrap; overflow: hidden; } .tabulation .tab-body.after-load { white-space: normal; overflow: initial; } .tabulation .tab-body .tab-body-item { display: inline-block; width: 100%; vertical-align: top; } .tabulation .tab-body .tab-body-item.current { display: block !important; vertical-align: initial; } /*! Agenda navigation */ .agenda-navigation { display: block; position: relative; margin: -1px 0 0; min-height: 60px; background: #f9f9f9; border-top: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9; } .agenda-navigation .container { position: relative; height: 60px; } .agenda-navigation .heading { display: block; position: absolute; top: 0; left: 0; z-index: 1; padding: 0 30px 0 0; height: 60px; font-size: 0; line-height: 60px; border-right: 1px solid #c9c9c9; } .agenda-navigation .heading .icon-calendar { display: inline-block; margin-right: 15px; width: 25px; height: 30px; background-position: 0 -279px; vertical-align: middle; } .agenda-navigation .heading .label { display: inline-block; font-size: 18px; color: #0098D7; line-height: 20px; text-transform: uppercase; vertical-align: middle; } .agenda-navigation .nav-item { display: block; position: absolute; top: 50%; left: 0; z-index: 1; margin-top: -15px; width: 100%; height: 0; } .agenda-navigation .nav-item .nav { display: block; position: absolute; top: 50%; z-index: 1; content: ''; width: 30px; height: 30px; } .agenda-navigation .nav-item .nav.prev-button { left: 220px; background-position: 0 -1259px; } .agenda-navigation .nav-item .nav.prev-button:hover, .agenda-navigation .nav-item .nav.prev-button.icon-pointer-left-hover { background-position: 0 -1226px; } .agenda-navigation .nav-item .nav.prev-button:active, .agenda-navigation .nav-item .nav.prev-button.icon-pointer-left-active { background-position: 0 -1160px; } .agenda-navigation .nav-item .nav.next-button { right: 0; background-position: 0 -1391px; } .agenda-navigation .nav-item .nav.next-button:hover, .agenda-navigation .nav-item .nav.next-button.icon-pointer-right-hover { background-position: 0 -1358px; } .agenda-navigation .nav-item .nav.next-button:active, .agenda-navigation .nav-item .nav.next-button.icon-pointer-right-active { background-position: 0 -1292px; } .agenda-navigation .agenda-content { display: block; position: relative; padding: 0 40px 0 260px; } .agenda-navigation .agenda-content ul { display: block; margin: 0; padding: 10px 0; } .agenda-navigation .agenda-content ul li { display: block; float: left; vertical-align: top; list-style: none; margin: 0; padding: 0; width: 25%; height: 40px; line-height: 40px; border-left: 1px solid #c9c9c9; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .agenda-navigation .agenda-content ul li:first-child { border-left: 0; } .agenda-navigation .agenda-content ul li .wrap { display: inline-block; vertical-align: middle; padding: 0 10px; } .agenda-navigation .agenda-content ul li .wrap .label { display: block; font-size: 12px; line-height: 14px; } /*! Single content */ .single-content { display: block; position: relative; } .single-content .iconic { display: block; margin: 0 auto 30px; } .single-content ul { display: block; margin: 20px 0; padding: 0; } .single-content ul li { display: block; position: relative; margin: 0; padding: 0 0 0 20px; list-style: none; } .single-content ul li:before { display: block; position: absolute; top: 8px; left: 0; z-index: 0; content: ''; width: 6px; height: 6px; background: #0098D7; -webkit-border-radius: 6px; -khtml-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px; } .single-content ol { display: block; margin: 20px 0; padding: 0 0 0 20px; } .single-content ol li { margin: 0; padding: 0; } .single-content hr { display: block; margin: 20px 0; border: 0; border-top: 1px solid #c9c9c9; } .single-content .gallery { display: block; position: relative; } .single-content .gallery .row { margin: 0 -10px; } .single-content .gallery .row .column { padding: 0 10px 20px; } .single-content .gallery .thumbnail { display: block; margin-bottom: 10px; } .single-content .gallery .thumbnail a { display: block; } .single-content .gallery .title { display: block; line-height: 16px; } .single-content .gallery .title a { color: #5e5e5e; } .single-content figure { display: block; margin: 20px 0; padding: 0; } .single-content figure img { margin-bottom: 5px; } .single-content figure figcaption { display: block; font-size: 12px; font-style: italic; color: #919191; line-height: 14px; } /*! Component alert */ .alert { display: block; position: relative; margin: 0 0 40px; padding: 0 15px; height: 40px; color: #fff; line-height: 40px; background: #e4e4e4; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .alert.has-success { background: #74b71b; } .alert.has-warning { background: #ff9024; } .alert.has-error { background: #d12f2e; } /*! Component accordion */ .accordion, .toggle { display: block; position: relative; } .accordion .item-wrap, .toggle .item-wrap { display: block; border-bottom: 1px solid #c9c9c9; } .accordion .item-wrap:first-child, .toggle .item-wrap:first-child { border-top: 1px solid #c9c9c9; } .accordion .item-wrap.current .head .indicator, .toggle .item-wrap.current .head .indicator { background-position: 0 0; } .accordion .item-wrap.current .body, .toggle .item-wrap.current .body { display: block; } .accordion .item-wrap .head, .toggle .item-wrap .head { display: block; position: relative; padding: 20px 0; cursor: pointer; } .accordion .item-wrap .head .title, .toggle .item-wrap .head .title { display: block; position: relative; margin: 0; padding: 0 0 0 20px; font-weight: bold; font-size: 14px; color: #5e5e5e; line-height: 18px; } .accordion .item-wrap .head .title:before, .toggle .item-wrap .head .title:before { display: block; position: absolute; top: 50%; left: 0; z-index: 1; content: ''; margin-top: -5px; width: 10px; height: 10px; background: #0098D7; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .accordion .item-wrap .head .indicator, .toggle .item-wrap .head .indicator { display: block; position: absolute; top: 50%; right: 0; z-index: 1; margin-top: -10px; width: 20px; height: 20px; background-position: 0 -23px; } .accordion .item-wrap .body, .toggle .item-wrap .body { display: none; position: relative; padding: 0 20px 15px; } /*! Code highlight */ .highlight { display: block; position: relative; } .highlight code { display: block; margin: 24px 0; padding: 5px 15px; font-size: 14px; color: #5e5e5e; line-height: 15px; background: #f6f6f6; white-space: pre-wrap; word-wrap: break-word; word-break: break-word; border: 1px solid #c9c9c9; } .highlight code.language-html .c { color: #919191; } .highlight code.language-html .nt { color: #2f6f9f; } .highlight code.language-html .na { color: #4f9fcf; } .highlight code.language-html .s { color: #d44950; } .highlight code.language-js .p, .highlight code.language-js .nx { color: #5e5e5e; } .highlight code.language-js .nb { color: #366; } .highlight code.language-js .s { color: #C30; } .highlight code.language-js .na { color: #4f9fcf; } .highlight code.language-js .kc { color: #069; } .highlight code.language-js .c { color: #999; } .highlight code.language-js .kd { color: #069; } .highlight code.language-css .c { color: #919191; } .highlight code.language-css .nt { color: #2f6f9f; } .highlight code.language-css .na { color: #4f9fcf; } .highlight code.language-css .s { color: #d44950; } .highlight code.language-css .nc { color: #0A8; } .highlight code.language-css p { color: #5e5e5e; } .highlight code.language-css .nl { color: #99F; } .highlight code.language-css .nb { color: #366; } /* Update 25 Feb 2015 */ /*! Tooltip */ .qtip-default { padding: 5px; color: transparent; background-color: #666; border: 1px solid #666; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } .qtip-default:after { display: block; position: absolute; top: 100%; left: 50%; z-index: 1; content: ''; margin-top: 1px; margin-left: -7px; width: 0; height: 0; border: 7px solid; border-top-color: #666; } .qtip-default .qtip-content { font-size: 12px; color: #fff; } /*! User content */ .user-content { display: block; position: relative; } .user-content .user-profile { padding: 30px; min-height: 167px; border-bottom: 0; } .user-content .user-profile .thumbnail { position: absolute; top: 0; left: 0; z-index: 1; margin-top: 30px; width: auto; float: none; } .user-content .user-profile .details { padding: 0 40px 0 167px; width: auto; min-height: 167px; float: none; line-height: 167px; } .user-content .user-profile .details .student-name { line-height: 26px; } .user-content .user-profile .details .position { line-height: 16px; } .user-content .user-profile .details .field { display: inline-block; vertical-align: middle; } .user-content .user-role .wrap { padding: 30px 0; min-height: 167px; line-height: 167px; text-align: right; } .user-content .user-role .wrap .field { display: inline-block; padding: 0; vertical-align: middle; } .user-content .user-role .wrap .field .component { text-align: left; } .user-content .user-role .wrap .field .component .login-role { width: 215px; } .user-content.single-page .user-role .wrap { min-height: 0; line-height: 16px; } /* Update 3 Mar 2015 */ /*! Archives */ .archives { display: block; position: relative; } .archives .post-item { display: block; position: relative; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #c9c9c9; } .archives .post-item.has-thumbnail .thumbnail { display: block; float: left; width: 240px; } .archives .post-item.has-thumbnail .details { float: right; width: 640px; } .archives .post-item .details { display: block; position: relative; } .archives .post-item .details .post-title { display: block; margin: 0 0 5px; padding: 0; } .archives .post-item .details .meta-data { display: block; margin: 0 0 10px; font-size: 12px; color: #919191; } .archives .post-item .details .excerpt { display: block; } .archives .post-item .details .excerpt p { margin: 0; padding: 0; } /*! Widgets */ .widget-parent { display: block; position: relative; } .widget-parent .widget-group { display: block; position: relative; padding: 0 9px; } .widget-parent > .row { margin: 0 -10px; } .widget-parent > .row > .column { padding: 0 10px 20px; } .widget-parent .widget { display: block; position: relative; padding: 15px; float: left; width: 100%; height: 293px; background: #f6f6f6; overflow: hidden; border: 1px solid #c9c9c9; -webkit-box-sizing: border-box; -khtml-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; /* Structure */ } .widget-parent .widget:first-child { margin-left: 0; } .widget-parent .widget.auto-height { height: auto; } .widget-parent .widget.auto-height .widget-footer { position: relative; top: auto; left: auto; right: auto; height: auto; margin: 15px 0 0; } .widget-parent .widget .widget-head { display: block; position: relative; padding: 0 0 10px; height: 32px; line-height: 32px; border-bottom: 1px solid #c9c9c9; } .widget-parent .widget .widget-head.has-navigation .nav-container { display: block; position: absolute; top: 50%; right: 0; z-index: 1; margin-top: -20px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav { display: inline-block; width: 30px; height: 30px; vertical-align: middle; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.prev { background-position: 0 -1259px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.prev:hover, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.prev.icon-pointer-left-hover { background-position: 0 -1226px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.prev:active, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.prev.icon-pointer-left-active { background-position: 0 -1160px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.next { background-position: 0 -1391px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.next:hover, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.next.icon-pointer-right-hover { background-position: 0 -1358px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.next:active, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.next.icon-pointer-right-active { background-position: 0 -1292px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.up { background-position: 0 -1490px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.up:hover, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.up.icon-pointer-up-hover { background-position: 0 -1457px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.up:active, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.up.icon-pointer-up-active { background-position: 0 -1424px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.down { background-position: 0 -1127px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.down:hover, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.down.icon-pointer-down-hover { background-position: 0 -1094px; } .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.down:active, .widget-parent .widget .widget-head.has-navigation .nav-container .btn-nav.down.icon-pointer-down-active { background-position: 0 -1061px; } .widget-parent .widget .widget-head .head-wrap { display: inline-block; width: 100%; vertical-align: middle; /* Update 26 Feb 2015 */ } .widget-parent .widget .widget-head .head-wrap .icon { vertical-align: middle; margin-right: 10px; padding-right: 10px; border-right: 1px solid #c9c9c9; } .widget-parent .widget .widget-head .head-wrap .indicator { display: inline-block; vertical-align: middle; margin-right: 10px; padding-right: 10px; height: 30px; width: 30px; border-right: 1px solid #c9c9c9; } .widget-parent .widget .widget-head .head-wrap .indicator.warning .wrap { background: #f5b000; color: #fff; } .widget-parent .widget .widget-head .head-wrap .indicator.danger .wrap { background: #D2302E; color: #fff; } .widget-parent .widget .widget-head .head-wrap .indicator.success .wrap { background: #47af74; color: #fff; } .widget-parent .widget .widget-head .head-wrap .indicator .wrap { display: block; width: 30px; height: 30px; color: #5e5e5e; text-align: center; } .widget-parent .widget .widget-head .head-wrap .indicator .wrap .label { display: block; padding-top: 4px; font-size: 10px; line-height: 10px; } .widget-parent .widget .widget-head .head-wrap .indicator .wrap .value { display: block; font-size: 13px; line-height: 13px; text-transform: uppercase; } .widget-parent .widget .widget-head .head-wrap .label { display: inline-block; vertical-align: middle; } .widget-parent .widget .widget-head .head-wrap .label .title { display: block; font-size: 16px; line-height: 18px; text-transform: uppercase; } .widget-parent .widget .widget-head .head-wrap .label .pre-title { display: block; font-size: 12px; line-height: 12px; } .widget-parent .widget .widget-head .head-wrap .opposite-link { display: block; position: absolute; top: 0; right: 0; z-index: 1; height: 32px; line-height: 32px; } .widget-parent .widget .widget-head .head-wrap .opposite-link a { display: block; padding-left: 15px; color: #5e5e5e; text-transform: uppercase; border-left: 1px solid #c9c9c9; } .widget-parent .widget .widget-body { display: block; position: relative; padding-top: 15px; } .widget-parent .widget .widget-body .body-sub-title { display: block; margin-top: -15px; padding: 10px 0; font-size: 12px; line-height: 13px; border-bottom: 1px solid #c9c9c9; } .widget-parent .widget .widget-footer { display: block; position: absolute; bottom: 0; left: 15px; right: 15px; z-index: 1; height: 42px; background: #f6f6f6; border-top: 1px solid #c9c9c9; } .widget-parent .widget .widget-footer > span { display: block; height: 42px; line-height: 42px; } .widget-parent .widget .widget-footer.has-navigation > span { position: relative; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container { display: inline-block; vertical-align: middle; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav { display: inline-block; margin-top: -5px; width: 30px; height: 30px; vertical-align: middle; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.prev { background-position: 0 -1259px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.prev:hover, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.prev.icon-pointer-left-hover { background-position: 0 -1226px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.prev:active, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.prev.icon-pointer-left-active { background-position: 0 -1160px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.next { background-position: 0 -1391px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.next:hover, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.next.icon-pointer-right-hover { background-position: 0 -1358px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.next:active, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.next.icon-pointer-right-active { background-position: 0 -1292px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.up { background-position: 0 -1490px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.up:hover, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.up.icon-pointer-up-hover { background-position: 0 -1457px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.up:active, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.up.icon-pointer-up-active { background-position: 0 -1424px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.down { background-position: 0 -1127px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.down:hover, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.down.icon-pointer-down-hover { background-position: 0 -1094px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.down:active, .widget-parent .widget .widget-footer.has-navigation > span .nav-container .btn-nav.down.icon-pointer-down-active { background-position: 0 -1061px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label { display: block; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav { position: absolute; top: 50%; z-index: 1; margin-top: -15px; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav.prev, .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav.up { left: 0; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav.next, .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .btn-nav.down { right: 0; } .widget-parent .widget .widget-footer.has-navigation > span .nav-container.has-label .label { display: block; position: relative; padding: 0 40px; overflow: hidden; } /*! Widget component */ /*! Widget scrolled */ .widget .widget-scrolled { display: block; height: 160px !important; overflow: hidden; } .widget .widget-scrolled.scrolled-horizontal { white-space: nowrap; } .widget .widget-scrolled.scrolled-horizontal .scrolled-item { display: inline-block; vertical-align: top; width: 100%; } .widget .widget-scrolled.scrolled-vertical .scrolled-item { display: block; } /*! Widget perspective meter */ .widget .widget-perspective-meter { display: block; position: relative; height: 203px; } .widget .widget-perspective-meter .perspective-meter { display: block; position: relative; margin: auto; width: 183px; height: 99px; } .widget .widget-perspective-meter .perspective-meter:after { display: block; width: 183px; height: 99px; content: ''; z-index: 0; position: absolute; top: 0; left: -2px; background-position: 0 -1300px; } .widget .widget-perspective-meter .perspective-meter svg { z-index: 1; width: 183px; height: 99px; } .widget .widget-perspective-meter .perspective-meter .perspective-legend { display: block; position: absolute; top: 50px; left: 0; right: 0; z-index: 1; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .score { display: block; padding: 0 20px; text-align: center; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .score .score-label { display: block; margin: 0 0 10px; font-size: 12px; line-height: 12px; text-transform: uppercase; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .score .score-value { display: block; font-size: 32px; line-height: 32px; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .score .score-value.failed { color: #d2302e; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .score .score-value.passed { color: #47af74; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value { display: block; padding: 0 2px 0; font-size: 16px; color: #919191; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .start { display: block; float: left; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .end { display: block; float: right; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .icon-indicator { display: inline-block; width: 42px; height: 42px; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .icon-indicator.icon-sad { background-position: 0 -856px; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .state-value .icon-indicator.icon-smile { background-position: 0 -946px; } .widget .widget-perspective-meter .perspective-meter .perspective-legend .description { display: block; margin-top: 20px; color: #919191; text-align: center; } /*! Widget perspective meter */ .widget .widget-performance-meter { display: block; position: relative; height: 203px; } .widget .widget-performance-meter .performance-meter { display: block; position: relative; margin: auto; width: 183px; height: 99px; } .widget .widget-performance-meter .performance-meter:after { display: block; width: 183px; height: 99px; content: ''; z-index: 0; position: absolute; top: 0; left: 0; background-position: 0 -1198px; } .widget .widget-performance-meter .performance-meter svg { z-index: 1; width: 183px; height: 99px; } .widget .widget-performance-meter .performance-meter .performance-legend { display: block; position: absolute; top: 50px; left: 0; right: 0; z-index: 1; } .widget .widget-performance-meter .performance-meter .performance-legend .score { display: block; padding: 0 20px; text-align: center; } .widget .widget-performance-meter .performance-meter .performance-legend .score .score-label { display: block; margin: 0 0 10px; font-size: 12px; line-height: 12px; text-transform: uppercase; } .widget .widget-performance-meter .performance-meter .performance-legend .score .score-value { display: block; font-size: 32px; line-height: 32px; } .widget .widget-performance-meter .performance-meter .performance-legend .score .score-value.failed { color: #d2302e; } .widget .widget-performance-meter .performance-meter .performance-legend .score .score-value.passed { color: #47af74; } .widget .widget-performance-meter .performance-meter .performance-legend .state-value { display: block; padding: 0 2px 0; font-size: 16px; color: #919191; } .widget .widget-performance-meter .performance-meter .performance-legend .state-value .start { display: block; float: left; } .widget .widget-performance-meter .performance-meter .performance-legend .state-value .end { display: block; float: right; } .widget .widget-performance-meter .performance-meter .performance-legend .state-value .icon-indicator { display: inline-block; width: 42px; height: 42px; } .widget .widget-performance-meter .performance-meter .performance-legend .state-value .icon-indicator.icon-sad { background-position: 0 -856px; } .widget .widget-performance-meter .performance-meter .performance-legend .state-value .icon-indicator.icon-smile { background-position: 0 -946px; } /*! Widget perspective meter */ .widget .widget-wheel-meter { display: block; position: relative; height: 203px; } .widget .widget-wheel-meter .wheel-meter { display: block; position: relative; margin: auto; width: 152px; height: 150px; } .widget .widget-wheel-meter .wheel-meter:after { display: block; width: 152px; height: 150px; content: ''; z-index: 0; position: absolute; top: 0; left: 0; background-position: 0 -1748px; } .widget .widget-wheel-meter .wheel-meter svg { z-index: 1; width: 152px; height: 150px; } .widget .widget-wheel-meter .wheel-meter .wheel-legend { display: block; position: absolute; top: 50%; left: 0; right: 0; z-index: 1; margin-top: -16px; } .widget .widget-wheel-meter .wheel-meter .wheel-legend .score { display: block; padding: 0 20px; font-size: 32px; line-height: 32px; text-align: center; } /*! Widget bar meter */ .widget .widget-bar-meter { display: block; position: relative; } .widget .widget-bar-meter .bar-meter { display: block; padding: 20px 0 0; } .widget .widget-bar-meter .bar-meter .bar-scale { display: block; position: relative; margin: auto; width: 223px; height: 53px; border-left: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9; } .widget .widget-bar-meter .bar-meter .the-bar { display: block; position: absolute; top: 10px; left: 0; width: 0%; height: 30px; background: #ababab; } .widget .widget-bar-meter .bar-meter .bar-x-scales li { display: inline-block; position: absolute; top: 56px; left: -5px; z-index: 1; } .widget .widget-bar-meter .bar-meter .bar-x-scales li:before { display: block; position: absolute; top: -7px; left: 50%; content: ''; margin-left: -1px; width: 1px; height: 4px; background: #c9c9c9; } .widget .widget-bar-meter .bar-meter .bar-x-scales li:last-child:before { left: auto; right: 6px; } .widget .widget-bar-meter .bar-meter .bar-x-scales li span { display: block; font-size: 12px; color: #919191; line-height: 13px; text-align: center; } .widget .widget-bar-meter .bar-meter .bar-x-scales li span.label { font-size: 12px; } .widget .widget-bar-meter .bar-meter .the-value { display: block; position: absolute; top: -24px; right: 0; z-index: 1; padding: 0 0 3px 3px; font-size: 12px; color: #666; line-height: 13px; white-space: nowrap; border-left: 1px solid #c9c9c9; border-bottom: 1px solid #c9c9c9; } .widget .widget-bar-meter .bar-meter .the-value:before { display: block; position: absolute; bottom: -10px; right: 0; content: ''; width: 1px; height: 10px; background: #c9c9c9; } .widget .widget-bar-meter .bar-meter .the-value.opposite { right: auto; left: 0; padding: 0 3px 3px 0; border-left: 0; border-right: 1px solid #c9c9c9; } .widget .widget-bar-meter .bar-meter .the-value.opposite:before { right: auto; left: 0; } .widget .widget-bar-meter .bar-meter .description { display: block; margin: 42px 0 0; text-align: center; } .widget .widget-bar-meter .bar-meter .description p { font-size: 12px; text-transform: uppercase; } /*! Widget big state */ .widget .widget-big-state { display: block; } .widget .widget-big-state .state-item { display: block; position: relative; padding: 15px 0; min-height: 42px; } .widget .widget-big-state .state-item .indicator { display: block; position: absolute; top: 50%; left: 0; z-index: 1; content: ''; margin-top: -21px; width: 42px; height: 42px; } .widget .widget-big-state .state-item .indicator.icon-checklist { background-position: 0 -811px; } .widget .widget-big-state .state-item .indicator.icon-sandwatch { background-position: 0 -901px; } .widget .widget-big-state .state-item .value { display: block; padding: 0 52px; min-height: 42px; font-size: 28px; line-height: 42px; } .widget .widget-big-state .state-item .label { display: block; position: absolute; top: 50%; right: 0; z-index: 1; margin-top: -11px; } /*! Widget state */ .widget .widget-state { display: block; } .widget .widget-state .state-item { display: block; position: relative; padding: 15px 0; min-height: 42px; border-top: 1px solid #c9c9c9; } .widget .widget-state .state-item:first-child { border-top: 0; } .widget .widget-state .state-item .indicator { display: block; position: absolute; top: 50%; left: 0; z-index: 1; content: ''; margin-top: -21px; width: 42px; height: 42px; } .widget .widget-state .state-item .indicator.icon-checklist { background-position: 0 -811px; } .widget .widget-state .state-item .indicator.icon-sandwatch { background-position: 0 -901px; } .widget .widget-state .state-item .description { display: block; padding: 0 0 0 52px; min-height: 42px; line-height: 16px; } /*! Widget scrollbar */ .widget .widget-scrollbar { display: block; height: 160px; } /*! Widget news */ .widget .widget-news { display: block; position: relative; } .widget .widget-news .news-item { display: block; position: relative; margin-top: 15px; padding-top: 15px; padding-left: 20px; border-top: 1px solid #c9c9c9; } .widget .widget-news .news-item:first-child { margin-top: 0; padding-top: 0; border-top: 0; } .widget .widget-news .news-item .details { display: block; position: relative; } .widget .widget-news .news-item .details:before { display: block; position: absolute; top: 0; left: 0; z-index: 1; content: ''; margin-top: 4px; margin-left: -20px; width: 10px; height: 10px; background: #0098D7; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .widget .widget-news .news-item .details .title { display: block; margin: 0; padding: 0; font-size: 14px; color: #0098D7; line-height: 15px; } .widget .widget-news .news-item .details .credential { display: block; margin: 5px 0 0; font-size: 11px; color: #919191; line-height: 12px; } /*! Widget schedule */ .widget .widget-schedule { display: block; position: relative; } .widget .widget-schedule .schedule-item { display: block; padding: 6px 0; border-top: 1px solid #c9c9c9; } .widget .widget-schedule .schedule-item:first-child { border-top: 0; padding: 0 0 6px; } .widget .widget-schedule .schedule-item .group-item .item { padding-top: 5px; padding-bottom: 5px; } .widget .widget-schedule .schedule-item .group-item .item.time { padding-right: 15px; width: 50px; font-size: 18px; line-height: 18px; border-right: 1px solid #c9c9c9; } .widget .widget-schedule .schedule-item .group-item .item.title { padding-left: 15px; } /*! Widget revenue */ .widget .widget-comparison { display: block; position: relative; padding: 20px 0 0; text-align: center; } .widget .widget-comparison .current-value { display: block; padding: 10px 0; font-size: 25px; color: #919191; line-height: 25px; } .widget .widget-comparison .comparison-value { display: block; padding: 10px 0; font-size: 16px; color: #919191; line-height: 16px; border-top: 1px solid #c9c9c9; } .widget .widget-comparison .description { display: block; padding: 10px 0 0; } /*! Overriding */ .widget .pagination { margin-top: 15px; } /*! Footer */ .footer { display: block; position: relative; background: #414042; /* Update 25 Feb 2015 */ } .footer .footer-widget { display: block; } .footer .footer-widget .group-item { padding: 50px 0; } .footer .footer-widget .group-item .item { padding: 0 48px 0 20px; border-left: 1px dotted #fff; /* Binus education */ /* Contact information */ } .footer .footer-widget .group-item .item:first-child { padding: 0 20px 0 48px; border-left: 0; } .footer .footer-widget .group-item .item .binus-education { display: block; padding-top: 20px; } .footer .footer-widget .group-item .item .binus-education .education-link { display: block; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper { margin: 0; width: 100%; font-size: 13px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect { text-align: left; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton { position: relative; height: 40px; cursor: pointer; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton:after { position: absolute; top: 0; right: 0; content: ''; width: 40px; height: 40px; background-position: 0 -281px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton:after:hover, .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton:after.fancy-arrow-down-hover { background-position: 0 -238px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton:after:active, .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton:after.fancy-arrow-down-active { background-position: 0 -195px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectButton span { background: #e2e2e2; border: 1px solid #c9c9c9; padding: 6px 15px 4px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper { top: 0; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuTop { display: none; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG { background: #b8b8b8; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid { padding: 0; margin: 0; background: #b8b8b8; color: white; max-height: 174px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul { margin: 0; padding: 0; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li { background: #b8b8b8; padding: 13px 25px 11px 15px; position: relative; line-height: 1.3; list-style: none; cursor: pointer; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li span { font-size: 13px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuMidBG .ffSelectMenuMid ul li.on { background: #f48b31; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper .ffSelect .ffSelectMenuWrapper .ffSelectMenuBottom { display: none; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper:hover .ffSelect .ffSelectButton:after { background-position: 0 -238px; } .footer .footer-widget .group-item .item .binus-education .education-link .ffSelectWrapper.active .ffSelect .ffSelectButton:after { background-position: 0 -195px; } .footer .footer-widget .group-item .item .contact-infomation { display: block; position: relative; } .footer .footer-widget .group-item .item .contact-infomation .contact-icon { display: block; position: absolute; bottom: 0; right: 0; z-index: 1; width: 60px; height: 40px; text-align: right; border-left: 1px solid #fff; } .footer .footer-widget .group-item .item .contact-infomation .contact-address { display: block; padding-right: 80px; } .footer .footer-widget .group-item .item .contact-infomation .contact-address p { display: block; margin: 0 0 3px; padding: 0; font-size: 13px; font-style: normal; color: #fff; line-height: 15px; } .footer .footer-widget .group-item .item .contact-infomation .contact-address .hide { color: #414042; } .footer .footer-title { display: block; margin-bottom: 15px; } .footer .footer-title .title { display: block; margin: 0; padding: 0; font-size: 21px; font-weight: normal; color: #f2f2f2; line-height: 24px; text-transform: uppercase; } .footer .footer-title .pre-title { display: block; font-size: 14px; color: #fff; line-height: 16px; text-transform: uppercase; } .footer .summary { display: block; padding: 20px 0; text-align: center; border-top: 1px dotted #fff; } .footer .summary .organization-name { display: block; margin: 0 0 5px; padding: 0; font-size: 16px; font-weight: normal; color: #f2f2f2; line-height: 19px; text-transform: uppercase; } .footer .summary .copyright { display: block; font-size: 11px; color: #5a595b; line-height: 11px; } .footer.new-layout .footer-widget .group-item .item { padding: 0; } .footer.new-layout .footer-widget .group-item .item.has-padding { padding: 0 20px; } .footer.new-layout .footer-widget .group-item .item.has-padding-left { padding: 0 0 0 20px; } .footer.new-layout .footer-widget .group-item .item.has-padding-right { padding: 0 20px 0 0; } .footer.new-layout .footer-widget .group-item .item.bottom-direction { padding-bottom: 4px; vertical-align: bottom; } .footer.new-layout .social-media { display: block; position: relative; } .footer.new-layout .social-media .icon { margin-left: 5px; } .footer.new-layout .social-media .icon:first-child { margin-left: 0; } .footer.new-layout .feedback-area { display: block; position: relative; } .footer.new-layout .feedback-area .button.wide, .footer.new-layout .feedback-area .calendar table.fc-header .wide.fc-button-today, .calendar table.fc-header .footer.new-layout .feedback-area .wide.fc-button-today { margin-bottom: 0; } .footer.new-layout .feedback-area .feedback-popup { display: none; position: absolute; bottom: 100%; left: 0; margin-bottom: 130px; z-index: 3; width: 100%; background: #414042; text-align: right; } .footer.new-layout .feedback-area .feedback-popup .feedback-close { display: inline-block; margin: 15px 15px 0; width: 20px; height: 20px; background: url("../images/sprites-icon/icon-close.png"); } .footer.new-layout .feedback-area .feedback-popup .feedback-close:hover { background: url("../images/sprites-icon/icon-close-hover.png"); } .footer.new-layout .feedback-area .feedback-popup .feedback-close:active { background: url("../images/sprites-icon/icon-close-active.png"); } .footer.new-layout .feedback-area .feedback-popup form { position: relative; padding: 15px; color: transparent; } .footer.new-layout .feedback-area .feedback-popup form p { margin: 15px 0 0; } .footer.new-layout .feedback-area .feedback-popup form p:first-child { margin: 0; } .footer.new-layout .feedback-area .feedback-popup form input[type="text"], .footer.new-layout .feedback-area .feedback-popup form textarea { color: #5e5e5e; } .footer.new-layout .feedback-area .feedback-popup form:after { display: block; position: absolute; top: 100%; left: 50%; z-index: 1; content: ''; margin-left: -10px; width: 0; height: 0; border: 10px solid; border-top-color: #414042; } .footer.new-layout .corporate-area { display: block; position: relative; } .footer.new-layout .corporate-area .main-title { display: block; margin: 0; padding: 0 0 5px; font-size: 18px; font-weight: bold; text-transform: uppercase; color: #f2f2f2; line-height: 20px; } .footer.new-layout .corporate-area .pre-title { display: block; margin: 0; padding: 0; font-size: 18px; font-weight: 300; text-transform: none; color: #fff; line-height: 15px; } /*! Overriding */ /*auto complete*/ .bm-autocomplete-wrap input[type=text]{ min-width: 200px; float: left; margin: 5px; } .autocomplete-list{ background: #fff; border: #bfbfbf 1px solid; width: 200px; position: absolute; padding: 0 !important; z-index: 2; cursor: pointer; } .autocomplete-list ul{ margin: 0; } .autocomplete-list li{ list-style: none !important; padding: 10px; margin: 0; } .autocomplete-list li:hover, .autocomplete-list li.hover{ background: #cfcfcf; } .hide { display: none !important; } /*end auto complete*/ /****************************************************** * Table styles (Freeze Column, Sort and Search Table) ******************************************************/ /* * Table styles */ table.dataTable { width: 100%; margin: 0 auto 0 0; clear: both; border-collapse: separate; border-spacing: 0; /* * Header and footer styles */ /* * Body styles */ } table.dataTable thead th, table.dataTable tfoot th { font-weight: bold; } table.dataTable thead th, table.dataTable thead td { padding: 10px 18px; border-bottom: 0px solid #111111; } table.dataTable thead th:active, table.dataTable thead td:active { outline: none; } table.dataTable tfoot th, table.dataTable tfoot td { padding: 10px 18px 6px 18px; border-top: 0px solid #111111; } table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting { cursor: pointer; *cursor: hand; } table.dataTable thead .sorting { background: url("../images/datatables/sort-both.png") no-repeat center right; } table.dataTable thead .sorting_asc { background: url("../images/datatables/sort-asc.png") no-repeat center right; } table.dataTable thead .sorting_desc { background: url("../images/datatables/sort-desc.png") no-repeat center right; } table.dataTable thead .sorting_asc_disabled { background: url("../images/datatables/sort-asc-disabled.png") no-repeat center right; } table.dataTable thead .sorting_desc_disabled { background: url("../images/datatables/sort-desc-disabled.png") no-repeat center right; } /* table.dataTable tbody tr { */ /* background-color: white; */ /* } */ table.dataTable tbody tr.selected { background-color: #b0bed9; } table.dataTable tbody tr:last-child { border-bottom: 0 !important; } table.dataTable tbody th, table.dataTable tbody td { padding: 8px 10px; } table.dataTable th.center, table.dataTable td.center, table.dataTable td.dataTables_empty { text-align: center; } table.dataTable th.right, table.dataTable td.right { text-align: right; } table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td { border-top: 1px solid #dddddd; } table.dataTable.row-border tbody tr:first-child th, table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th, table.dataTable.display tbody tr:first-child td { border-top: none; } table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td { border-top: 1px solid #dddddd; border-right: 1px solid #dddddd; } table.dataTable.cell-border tbody tr th:first-child, table.dataTable.cell-border tbody tr td:first-child { border-left: 1px solid #dddddd; } table.dataTable.cell-border tbody tr:first-child th, table.dataTable.cell-border tbody tr:first-child td { border-top: none; } table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd { background-color: #f9f9f9; } table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected { background-color: #abb9d3; } table.dataTable.hover tbody tr:hover, table.dataTable.hover tbody tr.odd:hover, table.dataTable.hover tbody tr.even:hover, table.dataTable.display tbody tr:hover, table.dataTable.display tbody tr.odd:hover, table.dataTable.display tbody tr.even:hover { background-color: whitesmoke; } table.dataTable.hover tbody tr:hover.selected, table.dataTable.hover tbody tr.odd:hover.selected, table.dataTable.hover tbody tr.even:hover.selected, table.dataTable.display tbody tr:hover.selected, table.dataTable.display tbody tr.odd:hover.selected, table.dataTable.display tbody tr.even:hover.selected { background-color: #a9b7d1; } table.dataTable.order-column tbody tr > .sorting_1, table.dataTable.order-column tbody tr > .sorting_2, table.dataTable.order-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1, table.dataTable.display tbody tr > .sorting_2, table.dataTable.display tbody tr > .sorting_3 { background-color: #f9f9f9; } table.dataTable.order-column tbody tr.selected > .sorting_1, table.dataTable.order-column tbody tr.selected > .sorting_2, table.dataTable.order-column tbody tr.selected > .sorting_3, table.dataTable.display tbody tr.selected > .sorting_1, table.dataTable.display tbody tr.selected > .sorting_2, table.dataTable.display tbody tr.selected > .sorting_3 { background-color: #acbad4; } table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 { background-color: #f1f1f1; } table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 { background-color: #f3f3f3; } table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 { background-color: whitesmoke; } table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 { background-color: #a6b3cd; } table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 { background-color: #a7b5ce; } table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 { background-color: #a9b6d0; } table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 { background-color: #f9f9f9; } table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.order-column.stripe tbody tr.even > .sorting_2 { background-color: #fbfbfb; } table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.order-column.stripe tbody tr.even > .sorting_3 { background-color: #fdfdfd; } table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 { background-color: #acbad4; } table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 { background-color: #adbbd6; } table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 { background-color: #afbdd8; } table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.display tbody tr.odd:hover > .sorting_1, table.dataTable.display tbody tr.even:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_1, table.dataTable.order-column.hover tbody tr.even:hover > .sorting_1 { background-color: #eaeaea; } table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.display tbody tr.odd:hover > .sorting_2, table.dataTable.display tbody tr.even:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_2, table.dataTable.order-column.hover tbody tr.even:hover > .sorting_2 { background-color: #ebebeb; } table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.display tbody tr.odd:hover > .sorting_3, table.dataTable.display tbody tr.even:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr.odd:hover > .sorting_3, table.dataTable.order-column.hover tbody tr.even:hover > .sorting_3 { background-color: #eeeeee; } table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.display tbody tr.odd:hover.selected > .sorting_1, table.dataTable.display tbody tr.even:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_1 { background-color: #a1aec7; } table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.display tbody tr.odd:hover.selected > .sorting_2, table.dataTable.display tbody tr.even:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_2 { background-color: #a2afc8; } table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.display tbody tr.odd:hover.selected > .sorting_3, table.dataTable.display tbody tr.even:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr.odd:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr.even:hover.selected > .sorting_3 { background-color: #a4b2cb; } table.dataTable.no-footer { border-bottom: 0px solid #111111 !important; } table.dataTable, table.dataTable th, table.dataTable td { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } /* * Control feature layout */ .dataTables_wrapper { position: relative; clear: both; *zoom: 1; zoom: 1; } .dataTables_wrapper .dataTables_length { float: left; } .dataTables_wrapper .dataTables_filter { position: relative; width: 100%; padding: 20px 0; background: #d4d4d4; margin-bottom: 1px; float: right; text-align: right; } .dataTables_wrapper .dataTables_filter .button-search { position: absolute; right: 20px; top: 20px; z-index: 1; width: 40px; height: 40px; background: url("../images/datatables/button-search.png"); } .dataTables_wrapper .dataTables_filter input { width: 240px; margin-right: 20px; height: 40px; border: 1px solid #c9c9c9; outline: 0; padding: 0 50px 0 10px; } .dataTables_wrapper .dataTables_filter label { display: block; position: relative; color: #d4d4d4; } .dataTables_wrapper .dataTables_info { clear: both; float: left; padding-top: 0.755em; } .dataTables_wrapper .dataTables_paginate { float: right; text-align: right; padding-top: 0.25em; } .dataTables_wrapper .dataTables_paginate .paginate_button { box-sizing: border-box; display: inline-block; min-width: 1.5em; padding: 0.5em 1em; margin-left: 2px; text-align: center; text-decoration: none !important; cursor: pointer; *cursor: hand; color: #333333 !important; border: 1px solid transparent; } .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { color: #333333 !important; border: 1px solid #cacaca; background-color: white; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, gainsboro)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, white 0%, gainsboro 100%); /* Chrome10+,Safari5.1+ */ background: -moz-linear-gradient(top, white 0%, gainsboro 100%); /* FF3.6+ */ background: -ms-linear-gradient(top, white 0%, gainsboro 100%); /* IE10+ */ background: -o-linear-gradient(top, white 0%, gainsboro 100%); /* Opera 11.10+ */ background: linear-gradient(to bottom, #ffffff 0%, #dcdcdc 100%); /* W3C */ } .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active { cursor: default; color: #666 !important; border: 1px solid transparent; background: transparent; box-shadow: none; } .dataTables_wrapper .dataTables_paginate .paginate_button:hover { color: white !important; border: 1px solid #111111; background-color: #585858; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111111)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #585858 0%, #111111 100%); /* Chrome10+,Safari5.1+ */ background: -moz-linear-gradient(top, #585858 0%, #111111 100%); /* FF3.6+ */ background: -ms-linear-gradient(top, #585858 0%, #111111 100%); /* IE10+ */ background: -o-linear-gradient(top, #585858 0%, #111111 100%); /* Opera 11.10+ */ background: linear-gradient(to bottom, #585858 0%, #111111 100%); /* W3C */ } .dataTables_wrapper .dataTables_paginate .paginate_button:active { outline: none; background-color: #2b2b2b; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* Chrome10+,Safari5.1+ */ background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* FF3.6+ */ background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* IE10+ */ background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%); /* Opera 11.10+ */ background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%); /* W3C */ box-shadow: inset 0 0 3px #111; } .dataTables_wrapper .dataTables_processing { position: absolute; top: 50%; left: 50%; width: 100%; height: 40px; margin-left: -50%; margin-top: -25px; padding-top: 20px; text-align: center; font-size: 1.2em; background-color: white; background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(25%, rgba(255, 255, 255, 0.9)), color-stop(75%, rgba(255, 255, 255, 0.9)), color-stop(100%, rgba(255, 255, 255, 0))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); /* Chrome10+,Safari5.1+ */ background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); /* FF3.6+ */ background: -ms-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); /* IE10+ */ background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); /* Opera 11.10+ */ background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%); /* W3C */ } .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate { color: #333333; } .dataTables_wrapper .dataTables_scroll { clear: both; } .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody { *margin-top: -1px; -webkit-overflow-scrolling: touch; border-bottom: 1px solid #efefef; } .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody th > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody td > div.dataTables_sizing { height: 0; overflow: hidden; margin: 0 !important; padding: 0 !important; } .dataTables_wrapper.no-footer .dataTables_scrollBody { border-bottom: 1px solid #111111; } .dataTables_wrapper.no-footer div.dataTables_scrollHead table, .dataTables_wrapper.no-footer div.dataTables_scrollBody table { border-bottom: none; } .dataTables_wrapper:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; } @media screen and (max-width: 767px) { .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_paginate { float: none; text-align: center; } .dataTables_wrapper .dataTables_paginate { margin-top: 0.5em; } } @media screen and (max-width: 640px) { .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter { float: none; text-align: center; } .dataTables_wrapper .dataTables_filter { margin-top: 0.5em; } } /* Block out what is behind the fixed column's header and footer */ /* Block out the gap above the scrollbar on the right, when there is a fixed * right column */ div.DTFC_LeftWrapper table.dataTable, div.DTFC_RightWrapper table.dataTable { margin-bottom: 0; } div.DTFC_LeftWrapper table.dataTable.no-footer, div.DTFC_RightWrapper table.dataTable.no-footer { border-bottom: none; } /* Ensure that the demo table scrolls */ /*table.dataTable th, table.dataTable td { white-space: nowrap; }*/ table.dataTable div.dataTables_wrapper { width: 100%; margin: 0 auto; } #loading-info { position: fixed; top: 0; left: 0; display: block; font-family: "Open Sans", Helvetica, Arial, sans-serif; text-align: center; font-size: 12px; width: 100%; padding-top: 5px; z-index: 600; } #loading-info span { background: #f5b000; color: white; padding: 10px 15px 4px; margin: 0 auto; max-width: 600px; } /*end data table*/