/* ================================================================================== */ /* == Normalize.css v7.0.0 ========================================================== */ /* ================================================================================== */ html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:0.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none} *,*:before,*:after { box-sizing: border-box; margin: 0; padding: 0; list-style: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Viewport Sizing */ @-webkit-viewport{width:device-width} @-moz-viewport{width:device-width} @-ms-viewport{width:device-width} @-o-viewport{width:device-width} @viewport{width:device-width} /* ================================================================================== */ /* == Web Fonts ===================================================================== */ /* ================================================================================== */ @font-face { font-family: 'vo-font'; src: url('../../fonts/proximanova-regular-webfont.woff2') format('woff2'), url('../../fonts/proximanova-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'vo-font'; src: url('../../fonts/proximanova-regularit-webfont.woff2') format('woff2'), url('../../fonts/proximanova-regularit-webfont.woff') format('woff'); font-weight: normal; font-style: italic; } @font-face { font-family: 'vo-font'; src: url('../../fonts/proximanova-semibold-webfont.woff2') format('woff2'), url('../../fonts/proximanova-semibold-webfont.woff') format('woff'); font-weight: 600; font-style: normal; } @font-face { font-family: 'vo-font'; src: url('../../fonts/proximanova-semiboldit-webfont.woff2') format('woff2'), url('../../fonts/proximanova-semiboldit-webfont.woff') format('woff'); font-weight: 600; font-style: italic; } @font-face { font-family: 'vo-font'; src: url('../../fonts/proximanova-bold-webfont.woff2') format('woff2'), url('../../fonts/proximanova-bold-webfont.woff') format('woff'); font-weight: bold; font-style: normal; } /* ================================================================================== */ /* == Variables ===================================================================== */ /* ================================================================================== */ :root { --darkest-text: #353A40; --default-text: #6F7780; --lightest-text: #9EA4AE; --table-header-text: #7E8DA3; --color-primary: #5874C8; --color-blue2: #239DEF; --color-dark-blue: #485C99; --color-darkest-blue: #2A375C; --color-red: #F86B67; --color-red2: #D45245; --color-green: #36AF47; --color-green2: #7BC43C; --color-yellow: #FDD948; --color-yellow2: #FDCF1A; --color-yellow3: #DA932C; --color-purple: #A050E0; --color-border: #E6EAEE; --bg-table-header: #F4F7F9; --bg-body: #EFF3F6; --bg-gray: #F6F9FA; --checkbox-bg: #FAFCFC; --checkbox-border: #DEE3E9; --table-border: #ECEFF2; } /* ================================================================================== */ /* == General Styles ================================================================ */ /* ================================================================================== */ html, body { background: var(--bg-body); font-size: 14px; line-height: 1.35; font-family: 'vo-font', Helvetica Neue, Arial, sans-serif; color: var(--default-text); } a { text-decoration: none; color: var(--color-primary); -webkit-transition: all 0.218s; -moz-transition: all 0.218s; -ms-transition: all 0.218s; -o-transition: all 0.218s; transition: all 0.218s; } a:hover { color: var(--color-red); } h1, h2, h3, h4 ,h5 { font-weight: 600; margin: 0; color: var(--darkest-text); } h1 { font-size: 26px; } h2 { font-size: 18px; margin-bottom: 13px; } input, textarea { font-family: 'vo-font'; height: 40px; background: var(--checkbox-bg); border: 1px solid var(--color-border); border-radius: 3px; padding: 0 13px; color: var(--darkest-text); font-size: 14px; line-height: 1.35; font-weight: 600; } input:focus, textarea:focus { outline: none; border-color: var(--color-primary) !important; } input.sm { padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px; height: 31px; } /*Loading Element*/ .cnd-waiting-for-results, .waiting-for-results { background: url(../../img/loader.gif) no-repeat center; background-size: 34px; height: 300px; } /*No Results*/ .cnd-no-results, .no-results { padding: 20px; } .no-results.no-results--no-pad { padding: 0px; } /*Tooltip*/ .tooltip { display: inline-block; width: 12px; height: 12px; line-height: 13px; font-size: 11px; text-align: center; border-radius: 50%; background: var(--color-primary); color: #fff; font-weight: bold; cursor: help; vertical-align: 1px; margin-left: 3px; } .ui-tooltip { padding: 15px 20px; background: var(--darkest-text); color: rgba(255,255,255,0.75); border-radius: 5px; width: 300px; box-shadow: 0px 2px 5px rgba(0,0,0,0.3); font-size: 11px; line-height: 1.35em; } /* Video Tooltip */ .tooltip.tooltip--video { display: inline-block; width: 15px; height: 12px; line-height: 13px; font-size: 11px; text-indent: -9999px; border-radius: 2px; background: var(--color-red) url(../../img/icon-video-play.svg) no-repeat center; background-size: 10px; color: #fff; font-weight: bold; cursor: help; vertical-align: 1px; margin-left: 3px; } /*Edit Buttons*/ span.edit, a.edit { font-weight: 600; color: var(--color-red); cursor: pointer; } /*Error Message*/ .error-message { background: var(--color-yellow2); border-radius: 4px; padding: 20px; color: var(--darkest-text); font-weight: 600; margin-bottom: 40px; } .error-message:before { content: "ERROR: "; font-weight: 700; float: left; margin-right: 5px; } .error-message.error-message--no-title:before { display: none; } .page-header + .error-message { margin: 40px 40px 0 40px; } /*For when an error message follows the page title.*/ .block .error-message { padding: 15px; margin-bottom: 20px; } /*For error message inside a block.*/ /*Success Message*/ .note-message { background: var(--color-blue2); border-radius: 4px; padding: 20px; color: #fff; font-weight: 600; margin-bottom: 40px; } .note-message:before { content: "Note: "; font-weight: 700; } .note-message a { color: inherit; text-decoration: underline;} .note-message.note-message--no-title:before { display: none; } .block .note-message { padding: 15px; margin-bottom: 20px; } /*For success message inside a block.*/ /*Success Message*/ .success-message { background: var(--color-blue2); border-radius: 4px; padding: 20px; color: #fff; font-weight: 600; margin-bottom: 40px; } .success-message:before { content: "Success: "; font-weight: 700; } .success-message.success-message--no-title:before { display: none; } .block .success-message { padding: 15px; margin-bottom: 20px; } /*For success message inside a block.*/ /*Warning Message*/ .warning-message { background: var(--color-yellow3); border-radius: 4px; padding: 20px; color: #fff; font-weight: 600; margin-bottom: 40px; } .warning-message:before { content: "Warning: "; font-weight: 700; } .warning-message.warning-message--no-title:before { display: none; } .block .warning-message { padding: 15px; margin-bottom: 20px; } /*For success message inside a block.*/ /*Notificaiton Success Message*/ .notification-success-message { background: var(--color-blue2); border-radius: 4px; padding: 20px; color: #fff; font-weight: 600; margin-bottom: 40px; } .notification-success-message:before { content: "Success: "; font-weight: 700; } .notification-success-message.notification-success-message--no-title:before { display: none; } .block .notification-success-message { padding: 15px; margin-bottom: 20px; } /*For success message inside a block.*/ /*Notification Error Message*/ .notification-error-message { background: var(--color-yellow2); border-radius: 4px; padding: 20px; color: var(--darkest-text); font-weight: 600; margin-bottom: 40px; } .notification-error-message:before { content: "ERROR: "; font-weight: 700; float: left; margin-right: 5px; } .notification-error-message.notification-error-message--no-title:before { display: none; } .block .notification-error-message { padding: 15px; margin-bottom: 20px; } /*For error message inside a block.*/ /*Embeded Video Container*/ .video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* ================================================================================== */ /* == Site Layout =================================================================== */ /* ================================================================================== */ html, body { height: 100%; } body { min-width: 900px; } .site-wrapper { min-height: calc(100% - 80px); position: relative; } .site-wrapper:after { content: ""; display: table; clear: both; } .site-nav { float: left; clear: both; width: 220px; height: 100%; position: absolute; top: 0; transition: all 1s; } .site-main { float: right; width: calc(100% - 220px); transition: all 1s;} /*Nav collapsed*/ .nav-collapsed .site-nav { width: 80px; } .nav-collapsed .site-main { width: calc(100% - 80px); } /*Auto Save Indicator*/ #vo-async-progress { /*background: rgba(0,0,0,0.25);*/ width: calc(100% - 40px); height: 25px; margin: 20px auto 0 auto; border-radius: 5px; text-indent: -9999px; opacity: 0; transition: opacity 0.5s; } #vo-async-progress .loader { position: relative; margin: 0px auto; width: 25px; } #vo-async-progress .loader:before { content:''; display: block; padding-top: 100%; } #vo-async-progress .loader svg { height: 100%; width: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } #vo-async-progress svg .loader_rotation, #vo-async-progress svg .loader_path { stroke-linecap: square; stroke-width: 3; } #vo-async-progress .loader_path { opacity: 0; stroke: #ffffff; transition: opacity 0.5s, stroke-dashoffset 0.5s; } #vo-async-progress .loader_background { opacity: 0; fill: #7BC43C; transition: opacity 0.5s, stroke-dashoffset 0.5s; } #vo-async-progress .loader_rotation { stroke: #7BC43C; stroke-dasharray: 1,200; stroke-dashoffset: 0; transform-origin: bottom right; transition: opacity 0.5s; animation: dash 1.5s ease-in-out infinite, rotate 2s linear infinite; } #vo-async-progress.saving, #vo-async-progress.saved { opacity: 1; } #vo-async-progress.saved .loader .loader_path, #vo-async-progress.saved .loader .loader_background { opacity: 1; stroke-dashoffset: 0; } #vo-async-progress.saved .loader .loader_rotation { opacity: 0; } @keyframes rotate { 100%{ transform: rotate(360deg); } } @keyframes dash { 0%{ stroke-dasharray: 1,200; stroke-dashoffset: 0; } 50%{ stroke-dasharray: 89,200; stroke-dashoffset: -35px; } 100%{ stroke-dasharray: 89,200; stroke-dashoffset: -124px; } } /* ================================================================================== */ /* == Site Header =================================================================== */ /* ================================================================================== */ .site-header { height: 80px; line-height: 80px; padding: 0 30px; color: #fff; background: var(--color-primary); background: -moz-linear-gradient(top, var(--color-primary) 0%, #4260b9 100%); background: -webkit-linear-gradient(top, var(--color-primary) 0%,#4260b9 100%); background: linear-gradient(to bottom, var(--color-primary) 0%,#4260b9 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='var(--color-primary)', endColorstr='#4260b9',GradientType=0 ); } .site-header h1 { float: left; margin: 0; font-size: 26px; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.2); } .site-header h1 a { color: #fff; } .site-header .tagline { float: left; font-size: 13px; font-weight: normal; color: #fff; opacity: 0.7; text-shadow: none; margin-left: 14px; height: 80px; line-height: 86px; } .site-header .site-switcher { float: left; margin-left: 15px; } .site-header .site-switcher .bootstrap-select { border-radius: 3px; width: 26px; height: 26px; } .site-header .site-switcher .bootstrap-select .dropdown-toggle { border-radius: 3px; width: 100%; height: 100%; padding: 0; text-indent: -9999px; border: none; background: linear-gradient(180deg, rgba(58,70,108,0.57) 0%, rgba(38,50,88,0.55) 100%); } .site-header .site-switcher .bootstrap-select .dropdown-toggle .caret { width: 100%; height: 100%; background: url(../../img/icon-arrow-down-white.svg) no-repeat center 4px; background-size: 20px; top: 0; left: 0; right: 0; margin: 0; opacity: 0.95; } .site-header .site-switcher .bootstrap-select .dropdown-toggle:hover { background: linear-gradient(180deg, rgba(58,70,108,0.8) 0%, rgba(38,50,88,0.8) 100%); } .site-header .site-switcher .bootstrap-select.open > .dropdown-toggle { background: linear-gradient(180deg, rgba(58,70,108,1) 0%, rgba(38,50,88,1) 100%); } .site-header .site-switcher ul li { width: 100%; } .site-header .site-switcher ul li:before { display: none; } .site-header ul { float: right; } .site-header ul li { float: left; } .site-header ul li:before { content: "|"; padding-right: 9px; margin-left: 10px; } .site-header ul li:first-child:before { display: none; } .site-header ul li#help { background: url(../../img/icon-help.svg) no-repeat center 30px; width: 40px; margin-left: 5px; text-indent: -9999px; opacity: 0.6; transition: opacity .2s; } .site-header ul li#help:before { display: none; } .site-header ul li#help a { display: block; } .site-header ul li#help:hover { opacity: 1; } .site-header ul a { color: #fff; display: inline-block; } /* ================================================================================== */ /* == Sidebar Navigation ============================================================ */ /* ================================================================================== */ /*Navigation*/ .site-nav { position: absolute; top: 0px; transition: width 1s; height: calc(100% - 80px); height: 100%; background: var(--color-primary); background: linear-gradient(to bottom, #3A466C 0%,#263258 100%); } .site-nav.sticky { position: sticky; height: 100vh; } .site-nav-upper { overflow: hidden; posit/ion: -webkit-sticky; positi/on: sticky; top: 0; padding-top: 20px; } .site-nav .nav li { position: relative; } .site-nav .nav li span { display: block; padding: 0 0 0 30px; line-height: 46px; color: rgba(255,255,255,0.8); cursor: pointer; background-repeat: no-repeat; background-position: 0px center; height: 46px; overflow: hidden; transition: text-indent 1s; } .site-nav .nav li span:hover { background: rgba(0,0,0,0.1); } .site-nav .nav li span a { color: rgba(255,255,255,0.8); display: block; } .site-nav .nav li { width: 220px; } .site-nav .nav li > ul { display: none; background: rgba(0,0,0,0.25); font-size: 13px; padding: 10px 0; } .site-nav .nav li > ul a { display: block; padding: 8px 30px; color: rgba(255,255,255,0.8); } .site-nav .nav li > ul li.active:before { content: ""; background: var(--color-blue2); width: 6px; height: 6px; border-radius: 50%; position: absolute; top: 12px; left: 14px; } .site-nav .nav li svg { float: left; height: 46px; width: 20px; margin-right: 17px; } .site-nav .nav li svg path { fill: #fff; opacity: 0.8; } .site-nav .nav li.active svg path { fill: #90EA4F; opacity: 1; } .site-nav .nav li .message-counter { float: right; background: var(--color-red); font-size: 10px; font-weight: 600; padding: 2px 3px 1px 3px; border-radius: 3px; margin-right: 30px; margin-top: 14px; line-height: 12px; min-width: 16px; text-align: center; } .site-nav .nav li li .message-counter { position: absolute; top: 9px; right: 0; margin-top: 0; color: #fff; } /*Active Page*/ .site-nav .nav li.active span { background-color: rgba(0,0,0,0.1); border-left: 4px solid #90EA4F; padding-left: 26px; } body#index .site-nav .nav li#site-nav-dash span, body.ana .site-nav .nav li#site-nav-ana span, body.cmc .site-nav .nav li#site-nav-cmc span, body.cmn .site-nav .nav li#site-nav-cmn span, body.cms .site-nav .nav li#site-nav-cms span, body.core .site-nav .nav li#site-nav-core span, body.ppl .site-nav .nav li#site-nav-ppl span { background-color: rgba(0,0,0,0.1); border-left: 4px solid #90EA4F; padding-left: 26px; } /*Nav Collapsed*/ .nav-collapsed .site-nav .nav span { text-indent: 200px; } .site-nav .nav li:nth-child(1) span { } .site-nav .nav li:nth-child(2) span { transition-delay: .075s; } .site-nav .nav li:nth-child(3) span { transition-delay: .15s; } .site-nav .nav li:nth-child(4) span { transition-delay: .225s; } .site-nav .nav li:nth-child(5) span { transition-delay: .3s; } .site-nav .nav li:nth-child(6) span { transition-delay: .375s; } .site-nav .nav li:nth-child(7) span { transition-delay: .45s; } .site-nav .nav li:nth-child(8) span { transition-delay: .52s; } /*Sticky Footer*/ .site-nav-footer { height: 90px; overflow: hidden; position: -webkit-sticky; position: sticky; top: calc(100vh - 90px); } /*Nav Toggle*/ .site-nav .toggle-nav { cursor: pointer; color: #fff; font-size: 11px; line-height: 46px; height: 46px; padding-left: 47px; background: url(../../img/icon-arrow-left-white.svg) no-repeat 25px; background-size: 18px; opacity: 0.5; background-image: url(../../img/icon-arrow-left-white.svg), url(../../img/icon-arrow-left-white.svg); background-repeat: no-repeat, no-repeat; background-position: 25px, 30px; } .site-nav .toggle-nav span { transition: opacity 2s; transition-delay: 1s; } .nav-collapsed .site-nav .toggle-nav { background-image: url(../../img/icon-arrow-right-white.svg), url(../../img/icon-arrow-right-white.svg); background-repeat: no-repeat, no-repeat; background-position: 29px, 34px; } .nav-collapsed .site-nav .toggle-nav span { opacity: 0; transition: opacity .2s; } /*Site Switcher - NOTE: this is now gone via GitHub issue #584*/ .site-nav .bootstrap-select { margin: 3px 0 10px 20px !important; width: 178px; transition: all 1s; } .site-nav .bootstrap-select li a { padding: 2px 15px; } .site-nav .bootstrap-select .dropdown-toggle { background-color: rgba(0,0,0,0.1); border-color: transparent; color: rgba(255,255,255,0.8); /*box-shadow: inset 0px 1px 3px rgba(0,0,0,0.15);*/ } /*Site Switcher - When sidebar is closed - NOTE: this is now gone via GitHub issue #584*/ .nav-collapsed .site-nav .bootstrap-select { width: calc(100% - 40px); } .nav-collapsed .site-nav .bootstrap-select .dropdown-toggle { padding: 0; text-indent: -9999px; background-image: url(../../img/nav-site.svg); background-repeat: no-repeat; background-position: center; background-size: 20px; } .nav-collapsed .site-nav .bootstrap-select .caret { display: none; } /* ================================================================================== */ /* == Page Parts ==================================================================== */ /* ================================================================================== */ /*Page Header*/ .page-header { background: #fff; line-height: 80px; border-bottom: 1px solid var(--color-border); padding: 0 40px; } .page-header h1 { font-size: 26px; float: left; margin-right: 18px; } .page-header:after { content: ""; display: table; clear: both; } .page-header .tagline { font-size: 13px; vertical-align: middle; color: var(--color-red); font-style: italic; margin-left: 8px; } .page-header .tagline.tagline--blue { color: var(--color-blue2); } /*Page Header - Back Button*/ .page-header .go-back, .page-header .action-return { float: left; background: #EFF3F6 url(../../img/icon-back-arrow.svg) no-repeat center; border: none; border-radius: 3px; width: 40px; height: 40px; text-indent: -9999px; margin: 20px 20px 0 0; cursor: pointer; } .page-header .go-back:hover, .page-header .action-return:hover { animation: backButton 1.5s linear infinite; } @keyframes backButton { 0% { background-position: center center; } 20% { background-position: 10px center; } 40% { background-position: center center; } 80% { background-position: 13px center; } 100% { background-position: center center; } } /*Page Body*/ .page-body { padding: 40px; position: relative; padding-bottom: 0; min-height: calc(100vh - 161px); } .page-body--with-filters { float: right; width: calc(100% - 210px); } .page-body--with-sidebar { float: left; width: calc(100% - 210px); position: relative; } .page-body--with-sidebar:after { content: ""; position: absolute; top: 0; right: -210px; width: 210px; height: 100%; background: #fff; border-left: 1px solid var(--color-border); z-index: 1; } /*This creates a fake sidebar background that is 100% tall*/ /*Page Tabs*/ .page-tabs { background: #FFF; border-bottom: 1px solid var(--color-border); position: relative; -webkit-font-smoothing: antialiased; margin: -41px -40px 40px -40px; height: 45px; position: relative; z-index: 2; } .page-tabs .ui-tabs-nav { height: 45px; padding: 1px 40px 0 40px; overflow-x: auto; overflow-y: hidden; white-space: nowrap; -webkit-overflow-scrolling: touch; } .page-tabs .ui-tabs-nav::-webkit-scrollbar { display: none; } .page-tabs:before { content: ""; position: absolute; top: 0; right: 0; width: 100px; height: 100%; background: linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 100%), linear-gradient(to right, rgba(255,255,255,0) 20%, #fff 100%); z-index: 9; pointer-events: none;} .page-tabs .ui-tabs-nav li { display: inline-block; margin-right: 7px; height: 100%; border: 1px solid var(--color-border); border-bottom: none; border-radius: 4px 4px 0 0; position: relative; font-weight: 600; } .page-tabs .ui-tabs-nav li a { display: block; line-height: 44px; padding: 0 20px; color: var(--default-text); outline: 0; } .page-tabs .ui-tabs-nav li.ui-tabs-active { background: var(--bg-body); } .page-tabs .ui-tabs-nav li.ui-tabs-active a { color: var(--darkest-text); } .page-tabs .ui-tabs-nav li.ui-tabs-active:after { content: ""; position: absolute; bottom: -1px; width: 100%; height: 2px; background: var(--bg-body); } .page-body--with-sidebar .page-tabs:after { content: ""; width: 210px; height: 45px; position: absolute; right: -210px; top: 0; background: #FFF; border-bottom: 1px solid var(--color-border); } /*Page Title Message*/ .page-title { margin-bottom: 40px; text-align: center; } .page-title h1 { font-weight: normal; } .page-title p { font-size: 16px; color: var(--table-header-text); margin-top: 5px;} /*Page Description*/ .page-description { margin-bottom: 40px; } .page-description p { margin-bottom: 14px; } .page-description p:last-child { margin: 0; } /*Page Note*/ .page-note { background: url(../../img/icon-info.svg) no-repeat 16px center; background-size: 30px; background-color: var(--color-yellow); padding: 20px 20px 20px 59px; border-radius: 4px; margin-bottom: 40px; background-color: rgba(253, 217, 72, 0.5); border: 1px solid var(--color-yellow); color: #7E6840; } .page-note:before { content: "Note: "; font-weight: bold; color: #715D37; } a.page-note:hover { color: #715D37; } /*Button Footer independent at bottom of page*/ .page-button-footer { clear: both; background: #fff; border: 1px solid var(--color-border); border-radius: 4px; overflow: hidden; position: relative; padding: 20px; } /* ================================================================================== */ /* == Page Sidebars ================================================================= */ /* ================================================================================== */ /*Page Sidebar*/ .sidebar { float: right; min-height: calc(100vh - 161px); background: #fff; border-left: 1px solid var(--color-border); width: 210px; padding: 20px; position: relative; z-index: 2; } .sidebar--under-tabs { padding-top: 65px; } .sidebar--sticky { position: sticky; top: 0; } .sidebar h2 { font-size: 13px; text-transform: uppercase; margin-bottom: 9px; } .sidebar .controls-list > li { border-top: 1px solid var(--color-border); padding-top: 28px; margin-bottom: 30px; } .sidebar .controls-list > li:first-child { border: none; padding-top: 0; } .sidebar .controls-list > li:after { content: ""; display: table; clear: both; } .sidebar .controls-list > li > ul > li { margin-bottom: 10px; } .sidebar .controls-list > li > ul > li:last-child { margin-bottom: 0; } .sidebar .version-message { background: var(--color-yellow2); color: var(--darkest-text); font-size: 12px; margin: -20px -20px 20px -20px; padding: 12px 20px 11px 20px; font-style: italic; } .sidebar .btn { width: 100%; height: 34px !important; line-height: 34px; font-size: 13px; text-align: left; font-weight: normal; position: relative; } .sidebar .btn-default { border-color: var(--color-border); color: var(--default-text); background: var(--bg-body); background: linear-gradient(to bottom, var(--checkbox-bg) 0%,var(--bg-table-header) 100%); } .sidebar .btn-primary { } .sidebar .bootstrap-select { width: 100%; } .sidebar .bootstrap-select .dropdown-menu { max-width: 100%; } .sidebar input { width: 100%; height: 34px; font-size: 13px; border: 1px solid var(--color-border); border-radius: 3px; color: var(--default-text); padding: 0 10px; background: var(--checkbox-bg); } .sidebar .btn-group--split { width: 100%; } .sidebar .btn-group--split .btn { width: calc(100% - 25px); line-height: 25px; } .sidebar .btn-group--split .btn.unclickable { background: var(--checkbox-bg); } .sidebar .btn-group--split .dropdown-toggle { width: 26px; } .sidebar .btn-sidebar-processing:after { content: ""; position: absolute; right: 10px; top: 50%; margin-top: -7px; width: 14px; height: 14px; background: url(../../img/loader9b.svg) no-repeat; background-size: 100%; } .sidebar .btn-primary.btn-sidebar-processing:after { background: url(../../img/loader9.svg) no-repeat; background-size: 100%; } /*Buttons with Icons*/ .sidebar .btn.save, .sidebar .btn.vo-save-order-draft { background: url(../../img/icon-save.svg) no-repeat 10px center, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.btn-primary.save { background-image: url(../../img/icon-save-white.svg); background-position: 10px center; background-color: var(--color-primary); border-color: var(--color-primary); } .sidebar .btn.preview { background: url(../../img/icon-preview.svg) no-repeat 10px center, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.publish { background-image: url(../../img/icon-publish.svg); background-repeat: no-repeat; background-position: 10px center; padding-left: 38px; } .sidebar .btn.send-test, .sidebar .btn.resend-invoice, .sidebar .btn.vo-email-invoice { background: url(../../img/icon-send.svg) no-repeat 10px center, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.vo-generate-invoice { background: url(../../img/icon-document.svg) no-repeat 11px center, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.unpublish { background-image: url(../../img/icon-restore.svg); background-repeat: no-repeat; background-position: 10px center; background-size: 16px; padding-left: 38px; } .sidebar .btn.send-settings { background: url(../../img/icon-settings.svg) no-repeat 10px center, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.delete, .sidebar .btn.vo-delete-order { background: url(../../img/icon-trash.svg) no-repeat 12px 10px, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.vo-print-invoice, .sidebar .btn.vo-print-packing-slip { background: url(../../img/icon-print.svg) no-repeat 10px center, url(../../img/btn-bg.png) repeat-x; background-size: auto, 32px 100%; padding-left: 38px; } .sidebar .btn.add-split { background: url(../../img/icon-split.svg) no-repeat 9px 9px, url(../../img/btn-bg.png) repeat-x; background-size: 16px, 32px 100%; padding-left: 38px; } .sidebar .date-display { background-image: url(../../img/icon-calendar.svg); background-repeat: no-repeat; background-position: 10px center; padding-left: 32px; } .sidebar .btn.vo-start-new-ship-package, .sidebar .btn.vo-manual-ship-package, .sidebar .btn.vo-manual-edit-ship-package { background: url(../../img/icon-package.svg) no-repeat 10px center, url(../../img/btn-bg.png) repeat-x; background-size: 15px, 32px 100%; padding-left: 38px; } .sidebar .toggle-option { font-size: 13px; padding-left: 1px; } .sidebar .toggle-option strong { color: var(--darkest-text); font-weight: 600; margin-right: 2px; } .sidebar .toggle-option .toggle-switch { float: right; } .sidebar #publish-date > li { float: left; margin-right: 9px; margin-bottom: 0; } .sidebar #publish-date > li:first-child { margin: 0 0 10px 0; } .sidebar #publish-date > li:last-child { margin: 0; } .sidebar #publish-date .dropdown-toggle { padding: 0 20px 0 10px; width: 50px; } .sidebar #publish-date .dropdown-toggle .caret { right: 8px; } .sidebar .featured-image { } .sidebar .featured-image .no-image { border: 1px solid var(--color-border); background: var(--checkbox-bg); border-radius: 3px; line-height: 100px; text-align: center; } .sidebar .featured-image img { width: 100%; height: auto; border: 1px solid var(--color-border); border-radius: 3px; } .sidebar .featured-image .set-image, .sidebar .featured-image .change-image { display: block; font-size: 12px; color: var(--color-blue2); margin-top: 7px; margin-bottom: -5px; cursor: pointer; } /*Tags List*/ .tag-builder .tag-list { margin-top: 10px; overflow: hidden; margin-bottom: -7px; clear: both; } .tag-builder .tag-list li { float: left; font-weight: 600; margin-right: 20px; line-height: 24px; } .tag-builder .tag-list li .delete { float: right; border: none; text-indent: -9999px; background: url(../../img/icon-tag-x.svg) no-repeat right 9px; width: 12px; height: 100%; cursor: pointer; } .tag-builder .tag-list li .delete:hover { background: url(../../img/icon-tag-x-hover.svg) no-repeat right 9px; } .tag-builder .tag-list li .delete:focus { outline: none; } /*Filter Sidebar*/ .filters { float: left; min-height: calc(100vh - 160px); width: 210px; padding: 40px 0 40px 40px; -webkit-font-smoothing: antialiased; } .filters h3 { font-size: 13px; text-transform: uppercase; color: var(--table-header-text); margin-bottom: 9px; } .filters h3 .collapse { display: none !important; } /*This hides the collapse buttons*/ .filters h3 .cancel { background: url(../../img/icon-tag-x.svg) no-repeat center right; float: right; background-size: 50%; width: 16px; height: 16px; cursor: pointer; } .filters h3 .cancel span { display: none; } .filters .cnd-header { margin-bottom: 28px; } .filters .cnd-searchable-list { position: relative; } .filters .cnd-searchable-list .cnd-list { max-height: 216px; overflow-y: scroll; } .filters .cnd-searchable-list:before { content: ""; background: linear-gradient(0deg, rgba(255,255,255,0) 0%, var(--bg-body) 100%); width: 100%; height: 8px; position: absolute; left: 0; top: 57px; z-index: 1; } .filters .cnd-searchable-list:after { content: ""; background: linear-gradient(0deg, var(--bg-body) 0%, rgba(255,255,255,0) 100%); width: 100%; height: 10px; position: absolute; left: 0; bottom: 0; z-index: 1; } .filters .vo-search-context { margin: -4px 0 5px -2px; } .filters .vo-search-context input { font-size: 12px; height: 30px; padding: 0 9px 0 20px; width: calc(100% + 2px); background: #fff url(../../img/icon-search.svg) no-repeat 6px center; background-size: 10px; } .filters .vo-search-context input::placeholder { color: var(--lightest-text); } .filters .cnd-list li { padding: 3px 0 3px 18px; position: relative; cursor: pointer; } .filters .cnd-list li:before { content: ""; position: absolute; top: 7px; left: 0; width: 8px; height: 8px; border-radius: 2px; background: var(--color-primary); } .filters .cnd-list .ui-state-active { background: none; color: inherit; font-weight: 600; } .filters .cnd-list li.ui-state-active:before { background: var(--color-green); } .filters .vo-ui-info span { display: inline-block; font-size: 13px; font-style: italic; font-weight: 600; padding: 5px 9px 5px 25px; color: var(--table-header-text); background: var(--bg-table-header) url(../../img/icon-info.svg) no-repeat left 6px center; background-size: 15px; border: 1px solid var(--color-border); border-radius: 4px; cursor: pointer; } .filters .vo-ui-info span:hover { border-color: var(--checkbox-border); } /*Message Schedule*/ .sidebar .days-range {} .sidebar .days-range li { float: left; width: calc(50% - 17px); text-align: center; } .sidebar .days-range li:nth-child(2) { width: 34px; line-height: 33px; } .sidebar .days-range li[style*="display: none"] + li.vo-days-to:not([style*="display: none"]) { width: 100%; } .sidebar .days-range li[style*="display: none"] + li.vo-days-to:not([style*="display: none"]) input { width: calc(50% - 17px); float: left; } .sidebar .days-range .txt-days-before { float: left; line-height: 33px; margin-left: 5px; font-size: 13px; } .sidebar .days-range .switch-option { display: block; clear: both; width: 100%; text-align: left; margin-top: -2px; } .sidebar .days-range .switch-option span { font-size: 12px; color: var(--color-blue2); cursor: pointer; } /*The time range slider for VigoAlessi*/ .filters .cnd-slider-range { margin-top: 7px; } .filters label { display: flex; justify-content: space-between; } /* ================================================================================== */ /* == Buttons ======================================================================= */ /* ================================================================================== */ /*! * Bootstrap v3.3.7 (http://getbootstrap.com) * Copyright 2011-2017 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=cf50894a7467a27d095f0278c7d8e943) * Config saved to config.json and https://gist.github.com/cf50894a7467a27d095f0278c7d8e943 */ .btn { display: inline-block; margin-bottom: 0; font-weight: 600; text-align: center; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 0 15px; font-size: 14px; line-height: 38px; border-radius: 3px; user-select: none; font-family: 'vo-font'; } .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { /*outline: 5px auto -webkit-focus-ring-color;*/ outline: 0; outline-offset: -2px; } .btn:hover, .btn:focus, .btn.focus { color: var(--darkest-text); text-decoration: none; } .btn:active, .btn.active { outline: 0; background-image: none; box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } .btn.disabled, .btn[disabled] { cursor: not-allowed; opacity: 0.65; filter: alpha(opacity=65); box-shadow: none; } a.btn.disabled { pointer-events: none; } .btn.unclickable { pointer-events: none; } /*Button Default*/ .btn-default { color: var(--darkest-text); background-color: #ffffff; border-color: var(--checkbox-border); } .btn-default:focus, .btn-default.focus { color: var(--darkest-text); background-color: var(--bg-table-header); border-color: #CFD6DE; } .btn-default:hover { color: var(--darkest-text); background-color: var(--bg-table-header); border-color: #CFD6DE; } .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default { color: var(--darkest-text); background-color: var(--bg-table-header); border-color: #CFD6DE; } .btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus { color: var(--darkest-text); background-color: var(--bg-table-header); border-color: #CFD6DE; } .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default { background-image: none; } .btn-default.disabled:hover, .btn-default[disabled]:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, .btn-default.disabled.focus, .btn-default[disabled].focus { background-color: #ffffff; border-color: var(--checkbox-border); } .btn-default .badge { color: #ffffff; background-color: var(--darkest-text); } /*Button Primary*/ .btn-primary { color: #ffffff; background-color: var(--color-primary); border-color: var(--color-primary); } .btn-primary:focus, .btn-primary.focus { color: #ffffff; background-color: #4B67BB; border-color: #4B67BB; } .btn-primary:hover { color: #ffffff; background-color: #4B67BB; border-color: #4B67BB; } .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary { color: #ffffff; background-color: #3F5BAF; border-color: #3F5BAF; } .btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus { color: #ffffff; background-color: #3F5BAF; border-color: #3F5BAF; } .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary { background-image: none; } .btn-primary.disabled:hover, .btn-primary[disabled]:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus { background-color: #337ab7; border-color: #2e6da4; } .btn-primary .badge { color: #337ab7; background-color: #ffffff; } /*Button Success*/ .btn-success { color: #ffffff; background-color: var(--color-green); border-color: var(--color-green); } .btn-success:focus, .btn-success.focus { color: #ffffff; background-color: #29A23A; border-color: #29A23A; } .btn-success:hover { color: #ffffff; background-color: #29A23A; border-color: #29A23A; } .btn-success:active, .btn-success.active, .open > .dropdown-toggle.btn-success { color: #ffffff; background-color: #1D962E; border-color: #1D962E; } .btn-success:active:hover, .btn-success.active:hover, .open > .dropdown-toggle.btn-success:hover, .btn-success:active:focus, .btn-success.active:focus, .open > .dropdown-toggle.btn-success:focus, .btn-success:active.focus, .btn-success.active.focus, .open > .dropdown-toggle.btn-success.focus { color: #ffffff; background-color: #1D962E; border-color: #1D962E; } .btn-success:active, .btn-success.active, .open > .dropdown-toggle.btn-success { background-image: none; } .btn-success.disabled:hover, .btn-success[disabled]:hover, .btn-success.disabled:focus, .btn-success[disabled]:focus, .btn-success.disabled.focus, .btn-success[disabled].focus { background-color: #5cb85c; border-color: #4cae4c; } .btn-success .badge { color: #5cb85c; background-color: #ffffff; } /*Button Info*/ .btn-info { color: #ffffff; background-color: var(--color-blue2); border-color: var(--color-blue2); } .btn-info:focus, .btn-info.focus { color: #ffffff; background-color: #1690E2; border-color: #1690E2; } .btn-info:hover { color: #ffffff; background-color: #1690E2; border-color: #1690E2; } .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info { color: #ffffff; background-color: #0A84D6; border-color: #0A84D6; } .btn-info:active:hover, .btn-info.active:hover, .open > .dropdown-toggle.btn-info:hover, .btn-info:active:focus, .btn-info.active:focus, .open > .dropdown-toggle.btn-info:focus, .btn-info:active.focus, .btn-info.active.focus, .open > .dropdown-toggle.btn-info.focus { color: #ffffff; background-color: #0A84D6; border-color: #0A84D6; } .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info { background-image: none; } .btn-info.disabled:hover, .btn-info[disabled]:hover, .btn-info.disabled:focus, .btn-info[disabled]:focus, .btn-info.disabled.focus, .btn-info[disabled].focus { background-color: #5bc0de; border-color: #46b8da; } .btn-info .badge { color: #5bc0de; background-color: #ffffff; } /*Button Warning*/ .btn-warning { color: #ffffff; background-color: var(--color-yellow2); border-color: var(--color-yellow2); } .btn-warning:focus, .btn-warning.focus { color: #ffffff; background-color: #F0C20D; border-color: #F0C20D; } .btn-warning:hover { color: #ffffff; background-color: #F0C20D; border-color: #F0C20D; } .btn-warning:active, .btn-warning.active, .open > .dropdown-toggle.btn-warning { color: #ffffff; background-color: #E4B601; border-color: #E4B601; } .btn-warning:active:hover, .btn-warning.active:hover, .open > .dropdown-toggle.btn-warning:hover, .btn-warning:active:focus, .btn-warning.active:focus, .open > .dropdown-toggle.btn-warning:focus, .btn-warning:active.focus, .btn-warning.active.focus, .open > .dropdown-toggle.btn-warning.focus { color: #ffffff; background-color: #E4B601; border-color: #E4B601; } .btn-warning:active, .btn-warning.active, .open > .dropdown-toggle.btn-warning { background-image: none; } .btn-warning.disabled:hover, .btn-warning[disabled]:hover, .btn-warning.disabled:focus, .btn-warning[disabled]:focus, .btn-warning.disabled.focus, .btn-warning[disabled].focus { background-color: #f0ad4e; border-color: #eea236; } .btn-warning .badge { color: #f0ad4e; background-color: #ffffff; } /*Button Danger*/ .btn-danger { color: #ffffff; background-color: var(--color-red2); border-color: var(--color-red2); } .btn-danger:focus, .btn-danger.focus { color: #ffffff; background-color: #C74538; border-color: #C74538; } .btn-danger:hover { color: #ffffff; background-color: #C74538; border-color: #C74538; } .btn-danger:active, .btn-danger.active, .open > .dropdown-toggle.btn-danger { color: #ffffff; background-color: #BB392C; border-color: #BB392C; } .btn-danger:active:hover, .btn-danger.active:hover, .open > .dropdown-toggle.btn-danger:hover, .btn-danger:active:focus, .btn-danger.active:focus, .open > .dropdown-toggle.btn-danger:focus, .btn-danger:active.focus, .btn-danger.active.focus, .open > .dropdown-toggle.btn-danger.focus { color: #ffffff; background-color: #BB392C; border-color: #BB392C; } .btn-danger:active, .btn-danger.active, .open > .dropdown-toggle.btn-danger { background-image: none; } .btn-danger.disabled:hover, .btn-danger[disabled]:hover, .btn-danger.disabled:focus, .btn-danger[disabled]:focus, .btn-danger.disabled.focus, .btn-danger[disabled].focus { background-color: #d9534f; border-color: #d43f3a; } .btn-danger .badge { color: #d9534f; background-color: #ffffff; } /*Button Link*/ .btn-link { color: #337ab7; font-weight: normal; border-radius: 0; } .btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled] { background-color: transparent; box-shadow: none; } .btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active { border-color: transparent; } .btn-link:hover, .btn-link:focus { color: #23527c; text-decoration: underline; background-color: transparent; } .btn-link[disabled]:hover, .btn-link[disabled]:focus { color: #777777; text-decoration: none; } /*Button Processing*/ .btn-processing { background-image: url(../../img/loader9.svg); background-size: auto 50%; background-repeat: no-repeat; background-position: center; color: rgba(0,0,0,0) !important; } /*Button Large*/ .btn-lg, .btn-group-lg > .btn { padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 6px; } /*Button Small*/ .btn-sm, .btn-group-sm > .btn { padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px; } /*Button Extra Small*/ .btn-xs, .btn-group-xs > .btn { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; } /*Buttons in Tables*/ table .btn { padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px; display: block; } table .btn.dropdown-toggle { height: 30px; } /*Button Block*/ .btn-block { display: block; width: 100%; } .btn-block + .btn-block { margin-top: 5px; } input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block { width: 100%; } /*Caret*/ .caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; /*border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent;*/ background: url(../../img/icon-dropdown-arrow.svg) no-repeat; width: 8px; height: 6px; } .dropup, .dropdown { position: relative; } .dropdown-toggle:focus { outline: 0; } .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 160px; padding: 5px 0; margin: 2px 0 0; list-style: none; font-size: 14px; text-align: left; background-color: #ffffff; border: 1px solid #CFD6DE; /*border: 1px solid rgba(0, 0, 0, 0.15);*/ border-radius: 4px; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); background-clip: padding-box; } .dropdown-menu.pull-right { right: 0; left: auto; } .dropdown-menu .divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5; } .dropdown-menu > li > a { display: block; padding: 3px 15px; clear: both; font-weight: normal; line-height: 1.42857143; color: var(--darkest-text); white-space: nowrap; cursor: pointer; } .dropdown-menu > li > a.level0 { padding-left: 15px; } .dropdown-menu > li > a.level1 { padding-left: 30px; } .dropdown-menu > li > a.level2 { padding-left: 45px; } .dropdown-menu > li > a.level3 { padding-left: 60px; } .dropdown-menu > li > a.level4 { padding-left: 75px; } .dropdown-menu > li > a.level5 { padding-left: 90px; } .dropdown-menu > li > a.level6 { padding-left: 105px; } .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { text-decoration: none; color: var(--darkest-text); background-color: var(--bg-table-header); } .dropdown-menu > li > a:hover { background: #E5F1FC; box-shadow: inset 3px 0 0 var(--color-blue2); } .dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus { color: #ffffff; text-decoration: none; outline: 0; background-color: #337ab7; } .dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus { color: #777777; } .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus { text-decoration: none; background-color: transparent; background-image: none; filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); cursor: not-allowed; } .open > .dropdown-menu { display: block; } .open > a { outline: 0; } .dropdown-menu-right { left: auto; right: 0; } .dropdown-menu-left { left: 0; right: auto; } .dropdown-header { display: block; padding: 3px 15px; font-size: 12px; line-height: 1.42857143; color: #777777; white-space: nowrap; } .dropdown-backdrop { position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 990; } .dropup .caret { /*border-top: 0; border-bottom: 4px dashed; border-bottom: 4px solid \9;*/ content: ""; background: url(../../img/icon-dropdown-arrow-up.svg) no-repeat; width: 8px; height: 6px;} .dropup .dropdown-menu { top: auto; bottom: 100%; margin-bottom: 2px; } .btn-group { position: relative; display: inline-block; vertical-align: middle; } .btn-group > .btn { position: relative; float: left; } .btn-group > .btn:hover, .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active { z-index: 2; } .btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group { margin-left: -1px; } .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { border-radius: 0; } .btn-group > .btn:first-child { margin-left: 0; } .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) { border-bottom-right-radius: 0; border-top-right-radius: 0; } .btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; } .btn-group > .btn-group { float: left; } .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { border-radius: 0; } .btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle { border-bottom-right-radius: 0; border-top-right-radius: 0; } .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child { border-bottom-left-radius: 0; border-top-left-radius: 0; } .btn-group .dropdown-toggle:active, .btn-group.open .dropdown-toggle { outline: 0; } .btn-group > .btn + .dropdown-toggle { padding-left: 8px; padding-right: 8px; } .btn-group > .btn-lg + .dropdown-toggle { padding-left: 12px; padding-right: 12px; } .btn-group.open .dropdown-toggle { box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } .btn-group.open .dropdown-toggle.btn-link { box-shadow: none; } .btn .caret { margin-left: 5px; } .btn-lg .caret { border-width: 5px 5px 0; border-bottom-width: 0; } .dropup .btn-lg .caret { border-width: 0 5px 5px; } .btn-group > .btn + .dropdown-toggle .caret { margin: 0; } [data-toggle="buttons"] > .btn input[type="radio"], [data-toggle="buttons"] > .btn-group > .btn input[type="radio"], [data-toggle="buttons"] > .btn input[type="checkbox"], [data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] { position: absolute; clip: rect(0, 0, 0, 0); pointer-events: none; } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } /* More button */ .btn-more { position: absolute; right: 20px; top: 20px; } .btn-more .dropdown-toggle { background: #F6F9FA url(../../img/icon-more.svg) no-repeat center !important; border: 1px solid var(--color-border); width: 26px; height: 26px; border-radius: 50%; text-indent: -9999px; padding: 0; } .btn-more .dropdown-menu { left: auto; right: 0; padding: 0; font-size: 13px; background: var(--bg-gray); min-width: 100px; } .btn-more li { padding: 8px 10px; border-bottom: 1px solid var(--color-border); margin: 0; /*color: var(--darkest-text);*/ cursor: pointer; } .btn-more li:last-child { border: none; } /* More button in tables */ .btn-table-more { position: absolute; right: 20px; top: 50%; margin-top: -13px; } .btn-table-more .dropdown-toggle { background: #F6F9FA url(../../img/icon-more.svg) no-repeat center !important; border: 1px solid var(--color-border); width: 26px; height: 26px !important; border-radius: 50%; text-indent: -9999px; padding: 0; } .btn-table-more .dropdown-menu { left: auto; right: 0; padding: 0; font-size: 13px; background: var(--bg-gray); min-width: 100px; } .btn-table-more li { padding: 8px 10px; border-bottom: 1px solid var(--color-border); margin: 0; /*color: var(--darkest-text);*/ cursor: pointer; } .btn-table-more li:last-child { border: none; } /* ================================================================================== */ /* ==