/*************************************************************************************************/
/* BRAND COLORS */
/* DO NOT USE DIRECTLY! Use $brandColor instead. See brand.*.pcss for definitions. */
/*************************************************************************************************/
/* Green Splunk Enterprise */
/* Orange Splunk Lite */
/* Brand colors */
/*===============================================================================================*/
/* SPLUNK: VARIABLES */
/* Variables to customize the look and feel of Bootstrap (splunk version). */
/* See /en-US/static/docs/style/style-guide.html for style guide */
/*===============================================================================================*/
/*===============================================================================================*/
/* WARNING */
/* This file has an implicit dependency on the brand variables injected by the */
/* 'splunk-postcss-theme-import' postcss plugin. */
/*===============================================================================================*/
/*===============================================================================================*/
/* SPLUNK: COLORS */
/*===============================================================================================*/
/*************************************************************************************************/
/* NEUTRAL COLORS */
/* */
/* PRE IVORY -> CURRENT VARIABLE */
/* $black -> $black */
/* $grayDarker -> $gray20 */
/* $grayDark -> $gray30 */
/* $gray -> $gray45 */
/* $grayLight -> $gray60 */
/* $grayLightMedium -> $gray80 */
/* $grayLighter -> $gray92 */
/* $gray96 */
/* $offWhite -> $gray98 */
/* $white -> $white */
/*************************************************************************************************/
/*************************************************************************************************/
/* SEMANTIC COLORS */
/* */
/* PRE IVORY -> CURRENT VARIABLE */
/* $red -> $errorColor */
/* $orange -> $alertColor */
/* $yellow -> $warningColor */
/* $yellowLight -> $warningColorL20 */
/* $yellowLighter -> $warningColorL40 */
/* $green -> $successColor */
/* $blue -> $infoColor */
/* $blueDark -> $infoColorD40 */
/* $pink -> No Equivalent or $errorColorL30 */
/* $purple -> No Equivalent */
/* $teal -> No Equivalent */
/* $focusColor -> $accentColorL10 */
/*************************************************************************************************/
/* Blue Accent */
/* Red Error */
/* Orange Alert */
/* Yellow Warning */
/* Green Success */
/* Blue Info */
/*************************************************************************************************/
/* CATEGORICAL COLORS */
/*************************************************************************************************/
/*************************************************************************************************/
/* DIVERGING COLORS */
/*************************************************************************************************/
/*************************************************************************************************/
/* STATIC PATHS */
/*************************************************************************************************/
/*************************************************************************************************/
/* TYPOGRAPHY */
/*************************************************************************************************/
/* Lite listing pages */
/* empty to use BS default, $fontFamily */
/* instead of browser default, bold */
/*************************************************************************************************/
/* SCAFFOLDING */
/*************************************************************************************************/
/* Border Colors */
/* aliases: $tableBorderColor $tableBorderColorVertical */
/* also see: $interactiveBorderColor */
/* Borders */
/* Border Radius */
/* For containers without a wrapper */
/* For for containers with a wrapper, like popdown */
/* Padding & Margin */
/* 200% - 40px */
/* 150% - 30px */
/* 75% - 15px */
/* 50% - 10px */
/* 25% - 5px */
/* Popdown Arrows */
/* Large Icons */
/*************************************************************************************************/
/* TRANSITIONS */
/*************************************************************************************************/
/*************************************************************************************************/
/* HORIZONTAL FORMS & LISTS */
/*************************************************************************************************/
/*************************************************************************************************/
/* Z-INDEX */
/*************************************************************************************************/
/* If a variable does not suit your purpose, set a value relatively such as, $zindexModal +1 */
/* Splunk Lite */
/* Splunk Lite */
/* Sidebar Component */
/* Sidebar Component */
/* timerange popdown needs to be above modal + backdrop */
/* top interactive element */
/* top interactive element */
/* top uninteractive */
/* top uninteractive */
/*************************************************************************************************/
/* TABLES */
/*************************************************************************************************/
/* overall background-color */
/*************************************************************************************************/
/* FORMS */
/*************************************************************************************************/
/* base input height + 10px vertical padding + 2px top/bottom border */
/* This is generally overridden. */
/*************************************************************************************************/
/* MODAL */
/*************************************************************************************************/
/*************************************************************************************************/
/* POPUP */
/*************************************************************************************************/
/*************************************************************************************************/
/* TABS */
/*************************************************************************************************/
/*************************************************************************************************/
/* MENU */
/*************************************************************************************************/
/*************************************************************************************************/
/* BASE INTERACTIVE */
/*************************************************************************************************/
/* text */
/* background */
/* borders */
/* shadow */
/*************************************************************************************************/
/* BASE INTERACTIVE ERROR */
/*************************************************************************************************/
/* text */
/* background */
/*************************************************************************************************/
/* BUTTONS */
/*************************************************************************************************/
/* 1 rem */
/*************************************************************************************************/
/* PRIMARY BUTTONS */
/*************************************************************************************************/
/* text */
/* background */
/* borders */
/* shadow */
/*************************************************************************************************/
/* PILL BUTTONS */
/*************************************************************************************************/
/* text */
/* background */
/*************************************************************************************************/
/* COMPONENT VARIABLES */
/*************************************************************************************************/
/*************************************************************************************************/
/* NAVBAR */
/*************************************************************************************************/
/*************************************************************************************************/
/* APP BAR */
/*************************************************************************************************/
/*************************************************************************************************/
/* ACCORDION */
/*************************************************************************************************/
/*************************************************************************************************/
/* CONCERTINA */
/* Concertina has the same color as Accordion, maybe we should just reuse them? */
/*************************************************************************************************/
/*************************************************************************************************/
/* TOOLTIPS & POPOVERS */
/*************************************************************************************************/
/*************************************************************************************************/
/* SELECTORS FOR CUSTOMIZING SPECIFIC LOCALES */
/*************************************************************************************************/
/*************************************************************************************************/
/* DASHBOARDS */
/*************************************************************************************************/
/*************************************************************************************************/
/* VIZ & VIZ PICKERS */
/*************************************************************************************************/
/*************************************************************************************************/
/* MAPS */
/*************************************************************************************************/
/* leaflet popup defaults */
/*************************************************************************************************/
/* Search IDE */
/*************************************************************************************************/
/*************************************************************************************************/
/* Date Picker */
/*************************************************************************************************/
/*************************************************************************************************/
/* Time Range Picker */
/*************************************************************************************************/
/*************************************************************************************************/
/* Events Viewer */
/*************************************************************************************************/
/*************************************************************************************************/
/* Misc */
/*************************************************************************************************/
/*************************************************************************************************/
/* TYPOGRAPHY */
/*************************************************************************************************/
/* Lite listing pages */
/*************************************************************************************************/
/* SCAFFOLDING */
/*************************************************************************************************/
/* Borders */
/*************************************************************************************************/
/* MODAL */
/*************************************************************************************************/
/*************************************************************************************************/
/* POPUP */
/*************************************************************************************************/
/*************************************************************************************************/
/* TABS */
/*************************************************************************************************/
/*************************************************************************************************/
/* MENU */
/*************************************************************************************************/
/*************************************************************************************************/
/* BASE INTERACTIVE */
/*************************************************************************************************/
/* text */
/* background */
/* borders */
/* shadow */
/*************************************************************************************************/
/* BUTTONS */
/*************************************************************************************************/
/*************************************************************************************************/
/* TABLES */
/*************************************************************************************************/
/* overall background-color */
/* fixme */
/*************************************************************************************************/
/* FORMS */
/*************************************************************************************************/
/*************************************************************************************************/
/* COMPONENT VARIABLES */
/*************************************************************************************************/
/*************************************************************************************************/
/* PILL BUTTONS */
/*************************************************************************************************/
/* text */
/* background */
/*************************************************************************************************/
/* ACCORDION */
/*************************************************************************************************/
/*************************************************************************************************/
/* CONCERTINA */
/* Note the selected state color of conertina is different from accordion */
/*************************************************************************************************/
/*************************************************************************************************/
/* NAVBAR */
/*************************************************************************************************/
/*************************************************************************************************/
/* TOOLTIPS & POPOVERS */
/*************************************************************************************************/
/*************************************************************************************************/
/* DASHBOARDS */
/*************************************************************************************************/
/*************************************************************************************************/
/* VIZ & VIZ PICKERS */
/*************************************************************************************************/
/*************************************************************************************************/
/* MAPS */
/*************************************************************************************************/
/*************************************************************************************************/
/* Search IDE */
/*************************************************************************************************/
/*************************************************************************************************/
/* Date Picker */
/*************************************************************************************************/
/*************************************************************************************************/
/* Time Range Picker */
/*************************************************************************************************/
/*************************************************************************************************/
/* Events Viewer */
/*************************************************************************************************/
/*************************************************************************************************/
/* Misc */
/*************************************************************************************************/
/*===============================================================================================*/
/* SPLUNK: MIXINS */
/* Snippets of reusable CSS to develop faster and keep code readable */
/*===============================================================================================*/
/* Reset */
/* ------------------ */
/* Link */
/* ------------------ */
/*************************************************************************************************/
/* FOCUS STATES */
/*************************************************************************************************/
/* Use when are outer focus glow will be block (i.e Menu Items). Provide background color.*/
/* Block elements change the background color */
/* Block elements change the background color and spread via box-shadow */
/*************************************************************************************************/
/* INTERACTIVE */
/* These are by any element that can be clicked, such as buttons, menus and table headings. */
/*************************************************************************************************/
/*----------------------------------------------*/
/* Interactive style: */
/* @params: */
/* Background Color */
/* Border Color */
/* Box Shadow */
/* Text Color */
/* Transition */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Primary interactive style: */
/* @params: */
/* Background Color */
/* Box Shadow */
/* Text Color */
/* Transition */
/*----------------------------------------------*/
/*************************************************************************************************/
/* INTERACTIVE ERROR */
/* These are by any interactive element that is is in an error state. */
/*************************************************************************************************/
/*************************************************************************************************/
/* BUTTONS */
/*************************************************************************************************/
/*----------------------------------------------*/
/* Pills, Links */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Define states of buttons: */
/* :hover, :active, disabled and :focus */
/* @params: */
/* Hover Mixin */
/* Active Mixin */
/* Disabled Mixin */
/* Focus Mixin */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Button Padding: */
/* @params: */
/* Vertical Padding */
/* Horizontal Padding */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Primary Button Padding: */
/* @params: */
/* Vertical Padding */
/* Horizontal Padding */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Button Padding For Other Button Sizes: */
/* @params: */
/* Vertical Padding */
/* Horizontal Padding */
/* Button Icon Margin Top */
/*----------------------------------------------*/
/* Draggable Handle */
/*************************************************************************************************/
/* FONTS */
/*************************************************************************************************/
/*----------------------------------------------*/
/* Define Font Family: */
/* @params: */
/* Font Name */
/* Name of Font File */
/* Font Format */
/* Font Weight */
/* Font Style */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Create a heading */
/* @params: */
/* Font Size */
/* Margin */
/* Font Color */
/* Text Transform */
/*----------------------------------------------*/
/*************************************************************************************************/
/* UTILITY MIXINS */
/*************************************************************************************************/
/*----------------------------------------------*/
/* Clearfix: */
/* For clearing floats like a boss h5bp.com/q */
/*----------------------------------------------*/
/* Placeholder text */
/* Basic input styles */
/* Sets Modal width and margin */
/* Define card style. Add white background and shadow. */
/* Workaround for table shadows in IE. Don't use this mixin, use create-card-table */
/* Define card style on tables. Adds workaround for IE */
/* Cover browser specific radio button with styled radio button. */
/* Can only be used if label comes immediately after input[type=radio] */
/* Use to cover button in .radio class */
/*-------------------------------------------------------------------------*/
/* CSS image replacement */
/* For clearing floats like a boss h5bp.com/q */
/* Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757 */
/*-------------------------------------------------------------------------*/
/*************************************************************************************************/
/* ICONS */
/*************************************************************************************************/
/*************************************************************************************************/
/* FORMS */
/*************************************************************************************************/
/* Block level inputs */
/*************************************************************************************************/
/* COMPONENT MIXINS */
/*************************************************************************************************/
/*----------------------------------------------*/
/* Horizontal Dividers: */
/* Dividers (basically an hr) within dropdowns */
/* and nav lists. */
/* @params: */
/* Border Color */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Navbar Vertical Align: */
/* Vertically center elements in the navbar. */
/* Example: an element has a height of 30px, */
/* so write out `.navbarVerticalAlign(30px);` */
/* to calculate the appropriate top margin. */
/* @params: */
/* Element Height */
/*----------------------------------------------*/
/*************************************************************************************************/
/* PRINTING */
/*************************************************************************************************/
/*************************************************************************************************/
/* POPDOWN */
/*************************************************************************************************/
/*----------------------------------------------*/
/* Arrow: */
/* Create an arrow. */
/* @params: */
/* Arrow Direction (up, down, left, right) */
/* Arrow Color */
/* Arrow Size */
/*----------------------------------------------*/
/* popdown body */
/*************************************************************************************************/
/* FULL PAGE LAYOUT */
/*************************************************************************************************/
/* Splunk bootstrap */
/* import and override bootstrap defaults */
/* CSS Reset */
/*===============================================================================================*/
/* SPLUNK: RESET CSS */
/* Adapted from http://github.com/necolas/normalize.css */
/*===============================================================================================*/
/* Display in IE6-9 and FF3 */
/* ------------------------- */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
display: block;
}
/* Display block in IE6-9 and FF3 */
/* ------------------------- */
audio,
canvas,
video {
display: inline-block;
}
/* Prevents modern browsers from displaying 'audio' without controls */
/* ------------------------- */
audio:not([controls]) {
display: none;
}
/* Base settings */
/* ------------------------- */
html {
font-size: 100%;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
text-size-adjust: 100%;
}
/* Focus states */
a:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
a:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
/* Hover & Active */
a:hover,
a:active {
outline: 0;
}
/* Prevents sub and sup affecting line-height in all browsers */
/* ------------------------- */
sub,
sup {
position: relative;
font-size: 75%;
line-height: 0;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* Img border in a's and image quality */
/* ------------------------- */
img {
/* Responsive images (ensure images don't scale beyond their parents) */
max-width: 100%; /* Part 1: Set a maxium relative to the parent */
height: auto; /* Part 2: Scale the height according to the width, otherwise you get stretching */
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}
/* Prevent max-width from affecting Google Maps */
#map_canvas img,
.google-maps img {
max-width: none;
}
/* Forms */
/* ------------------------- */
/* Font size in all browsers, margin changes, misc consistency */
button,
input,
select,
textarea {
margin: 0;
font-size: 100%;
vertical-align: middle;
}
button,
input {
line-height: normal; /* FF3/4 have !important on line-height in UA stylesheet */
}
button::-moz-focus-inner,
input::-moz-focus-inner { /* Inner padding and border oddities in FF3/4 */
padding: 0;
border: 0;
}
button,
html input[type="button"], /* Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* Corrects inability to style clickable `input` types in iOS. */
cursor: pointer; /* Improves usability and consistency of cursor style between image-type `input` and others. */
}
label,
select,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="radio"],
input[type="checkbox"] {
cursor: pointer; /* Improves usability and consistency of cursor style between image-type `input` and others. */
}
input[type="search"] { /* Appearance in Safari/Chrome */
-webkit-box-sizing: content-box;
box-sizing: content-box;
-webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: none; /* Inner-padding issues in Chrome OSX, Safari 5 */
}
textarea {
overflow: auto; /* Remove vertical scrollbar in IE6-9 */
vertical-align: top; /* Readability and alignment cross-browser */
}
/* Printing */
/* ------------------------- */
/* Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css */
@media print {
* {
text-shadow: none !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
background: transparent !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/* Don't show links for images, or javascript/internal links */
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group; /* h5bp.com/t */
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}
/* Grid system and page structure */
/*===============================================================================================*/
/* SPLUNK: SCAFFOLDING */
/*===============================================================================================*/
/*************************************************************************************************/
/* DEFAULT & STRUCTURE */
/*************************************************************************************************/
body {
margin: 0;
background: #31373E;
color: #FFFFFF;
min-width: 960px;
font-family: "Splunk Platform Sans", "Proxima Nova", Roboto, Droid, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 20px;
-webkit-transition: margin 0.2s;
transition: margin 0.2s;
}
body.open {
margin-left: 300px;
margin-right: -300px;
}
.shared-page {
height: 100vh;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
/*************************************************************************************************/
/* LINKS */
/*************************************************************************************************/
a {
color: #00A4FD;
text-decoration: none;
cursor: pointer;
}
a:hover {
color: #006EAA;
text-decoration: underline;
}
a:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
a:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
a:focus {
text-decoration: none;
}
a:active {
-webkit-box-shadow: none;
box-shadow: none;
}
a.disabled {
color: #5C6773;
}
a.external:after {
font-family: "Splunk Icons";
content: "\EC13";
display: inline-block;
padding-left: 0.5em;
}
/*************************************************************************************************/
/* IMAGES */
/*************************************************************************************************/
/* Rounded corners */
.img-rounded {
border-radius: 3px;
}
/* Add polaroid-esque trim */
.img-polaroid {
padding: 4px;
background-color: #FFFFFF;
border: 1px solid #171D21;
border: 1px solid rgba(0,0,0,.2);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.1);
box-shadow: 0 1px 3px rgba(0,0,0,.1);
}
/* Perfect circle */
.img-circle {
border-radius: 500px; /* crank the border-radius so it works with most reasonably sized images */
}
/*************************************************************************************************/
/* SECTIONS */
/*************************************************************************************************/
/* add padding to a section
padded content
*/
.section-padded {
padding: 20px;
}
/* section-header extends section-padded */
.section-header {
position: relative;
}
.section-header .section-title {
margin-top: 0;
font-size: 24px;
font-weight: 500;
line-height: 24px;
}
.section-header.page-heading {
padding: 20px 20px 10px 20px;
}
/* default container */
.main-section-body {
color: #FFFFFF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.main-section-body > :first-child {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
/* using three color so we can set color stop even though its only 2 colors */
.main-section-body h2 i[class^="icon-"],
.main-section-body h2 i[class*=" icon-"] {
color: #6b7785;
}
.main-section-body .divider {
border-top: 1px solid #171D21;
margin: 0;
}
/* huh? */
.main-section-body > .pull-right {
margin-right: 20px;
}
.main-section-body .loading-message {
padding-top: 100px;
min-height: 400px;
text-align: center;
}
.main-section-body .main-section {
padding: 0 20px;
}
.main-section-body .card {
background-color: transparent;
-webkit-box-shadow: 0;
box-shadow: 0;
}
/*************************************************************************************************/
/* UTILITY CLASSES */
/*************************************************************************************************/
/* for full width unpadded content
TODO: this should probably also remove width and margin: auto
content here ...
*/
.container-full-width {
padding: 0;
}
/* force full width even in padded container
padded content here ...
expanded content here ...
*/
.push-margins {
margin-left: -20px;
margin-right: -20px;
}
/* new image replacement
hidden
*/
.hide-text {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
/*************************************************************************************************/
/* PANELS */
/*************************************************************************************************/
/* panels for dashboards?
panel content ...
panel content ...
panel content ...
*/
.panel {
position: relative;
border: 1px solid #171D21;
background-color: #FFFFFF;
padding: 20px;
margin-right: 20px;
border-radius: 2px;
}
.panel:last-child {
margin-right: 0;
}
/* panel rows?
panel content ...
panel content ...
panel content ...
panel content ...
*/
.panel-row {
padding: 0 20px;
margin-bottom: 20px;
}
/*************************************************************************************************/
/* SIMPLE LAYOUT COLUMNS */
/*************************************************************************************************/
.section-content {
background-color: #FFFFFF;
min-height: 400px;
border-top: 1px solid #171D21;
}
.column {
position: relative;
padding: 20px;
margin-right: 20px;
}
/*************************************************************************************************/
/* 508 ACCESSIBILITY */
/*************************************************************************************************/
.navSkip {
position: absolute;
margin: 1px 0px 0px 10px;
top: 0;
left: -1000px;
width: 150px;
height: 32px;
text-align: center;
line-height: 32px;
background-color: #171D21;
color: #C3CBD4;
z-index: 1040;
}
.navSkip:focus {
left: 0px;
}
/*************************************************************************************************/
/* PAYWALL */
/*************************************************************************************************/
.shared-paywall {
padding-top: 30px;
}
/*************************************************************************************************/
/* DEFINITION LISTS */
/*************************************************************************************************/
.list-dotted {
line-height: 20px;
margin-top: 0;
}
.list-dotted dt {
float: left;
width: 120px;
overflow: hidden;
white-space: nowrap;
margin-right: 5px;
font-weight: normal;
line-height: 20px;
/* SPL-69719 - fix IE10 when in dropdown */
word-wrap: normal;
}
.list-dotted dt:after {
content: " ............................................";
}
.list-dotted dd {
line-height: 20px;
margin-left: 125px;
}
/*************************************************************************************************/
/* PAGE LOAD PLACEHOLDER */
/*************************************************************************************************/
#placeholder-splunk-bar {
padding: 0 ;
background-color: #171D21;
text-rendering: geometricPrecision;
}
#placeholder-splunk-bar .brand, #placeholder-splunk-bar .brand:hover {
font-family: "Splunk Icons";
font-weight: normal;
color: #FFFFFF;
padding: 0 20px;
height: 34px;
font-size: 18px;
line-height: 34px;
text-shadow: none;
text-decoration: none;
text-rendering: geometricPrecision;
margin-left: 0;
}
#placeholder-splunk-bar .brand strong {
color: #818D99;
font-weight: normal;
}
/* reg symbol */
#placeholder-splunk-bar .brand strong:after {
content: '\AE';
color: #818D99;
font-weight: normal;
}
#placeholder-app-bar {
color: #FFFFFF;
background-color: #3C444D;
height: 44px;
}
#placeholder-main-section-body {
color: #FFFFFF;
padding-top: 100px;
min-height: 400px;
text-align: center;
}
/*************************************************************************************************/
/* LITE UI */
/*************************************************************************************************/
/*************************************************************************************************/
/* PRINT */
/*************************************************************************************************/
@media print {
body,
.main-section-body {
background: none !important;
}
@page {
margin: 1.27cm;
}
.navSkip {
display: none !important;
}
}
/*===============================================================================================*/
/* SPLUNK: MIXINS GRID SYSTEM */
/*===============================================================================================*/
/* Default 940px grid */
/* 1200px min */
/* 768px-979px */
/*************************************************************************************************/
/* FLUID GRID */
/*************************************************************************************************/
/* 1200px min */
/* 768px-979px */
/* Responsive Variables */
/* Centered container element */
/* Table columns */
/* Make a Grid */
/* Use .makeRow and .makeColumn to assign semantic layouts grid system behavior */
/* The Grid */
/*===============================================================================================*/
/* SPLUNK: GRID SYSTEM */
/*===============================================================================================*/
/* Fixed (940px) */
.span1 {
width: 60px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span2 {
width: 140px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span3 {
width: 220px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span4 {
width: 300px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span5 {
width: 380px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span6 {
width: 460px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span7 {
width: 540px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span8 {
width: 620px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span9 {
width: 700px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span10 {
width: 780px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span11 {
width: 860px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.span12 {
width: 940px;
float: left;
min-height: 1px; /* prevent collapsing columns */
margin-left: 20px;
}
.offset1 {
margin-left: 100px;
}
.offset2 {
margin-left: 180px;
}
.offset3 {
margin-left: 260px;
}
.offset4 {
margin-left: 340px;
}
.offset5 {
margin-left: 420px;
}
.offset6 {
margin-left: 500px;
}
.offset7 {
margin-left: 580px;
}
.offset8 {
margin-left: 660px;
}
.offset9 {
margin-left: 740px;
}
.offset10 {
margin-left: 820px;
}
.offset11 {
margin-left: 900px;
}
.offset12 {
margin-left: 980px;
}
.row {
margin-left: -20px;
}
.row:before,
.row:after {
display: table;
content: "";
line-height: 0;
}
.row:after {
clear: both;
}
/* Set the container width, and override it for fixed navbars in media queries */
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
/* Fluid (940px) */
.row-fluid {
width: 100%;
}
.row-fluid:before,
.row-fluid:after {
display: table;
content: "";
line-height: 0;
}
.row-fluid:after {
clear: both;
}
.row-fluid .span1 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 6.38298%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span1:first-child {
margin-left: 0;
}
.row-fluid .span2 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 14.89362%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span2:first-child {
margin-left: 0;
}
.row-fluid .span3 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 23.40426%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span3:first-child {
margin-left: 0;
}
.row-fluid .span4 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 31.91489%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span4:first-child {
margin-left: 0;
}
.row-fluid .span5 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 40.42553%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span5:first-child {
margin-left: 0;
}
.row-fluid .span6 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 48.93617%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span6:first-child {
margin-left: 0;
}
.row-fluid .span7 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 57.44681%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span7:first-child {
margin-left: 0;
}
.row-fluid .span8 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 65.95745%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span8:first-child {
margin-left: 0;
}
.row-fluid .span9 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 74.46809%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span9:first-child {
margin-left: 0;
}
.row-fluid .span10 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 82.97873%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span10:first-child {
margin-left: 0;
}
.row-fluid .span11 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 91.48937%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span11:first-child {
margin-left: 0;
}
.row-fluid .span12 {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
width: 100%;
float: left;
margin-left: 2.127659574%;
}
.row-fluid .span12:first-child {
margin-left: 0;
}
.row-fluid .offset1 {
margin-left: 10.6383%;
}
.row-fluid .offset2 {
margin-left: 19.14894%;
}
.row-fluid .offset3 {
margin-left: 27.65958%;
}
.row-fluid .offset4 {
margin-left: 36.17021%;
}
.row-fluid .offset5 {
margin-left: 44.68085%;
}
.row-fluid .offset6 {
margin-left: 53.19149%;
}
.row-fluid .offset7 {
margin-left: 61.70213%;
}
.row-fluid .offset8 {
margin-left: 70.21277%;
}
.row-fluid .offset9 {
margin-left: 78.72341%;
}
.row-fluid .offset10 {
margin-left: 87.23405%;
}
.row-fluid .offset11 {
margin-left: 95.74469%;
}
.row-fluid .offset12 {
margin-left: 104.25532%;
}
/* Space grid-sized controls properly if multiple per line */
.row-fluid .controls-row [class*="span"] + [class*="span"] {
margin-left: 2.127659574%;
}
/* Reset utility classes due to specificity */
[class*="span"].hide,
.row-fluid [class*="span"].hide {
display: none;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
float: right;
}
/*===============================================================================================*/
/* SPLUNK: LAYOUTS */
/*===============================================================================================*/
/* Container (centered, fixed-width layouts) */
.container {
margin-right: auto;
margin-left: auto;
}
.container:before,
.container:after {
display: table;
content: "";
line-height: 0;
}
.container:after {
clear: both;
}
/* Fluid layouts (left aligned, with sidebar, min- & max-width content) */
.container-fluid {
padding-right: 20px;
padding-left: 20px;
}
.container-fluid:before,
.container-fluid:after {
display: table;
content: "";
line-height: 0;
}
.container-fluid:after {
clear: both;
}
/* Base CSS */
/*************************************************************************************************/
/* FONTS */
/*************************************************************************************************/
@font-face {
font-family: 'Splunk Platform Sans';
src: url('/static/fonts/proxima-bold-webfont.woff') format('woff');
font-weight: bold;
font-style: normal;
}
/* Bold */
@font-face {
font-family: 'Splunk Platform Sans';
src: url('/static/fonts/proxima-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* Regular */
@font-face {
font-family: 'Splunk Platform Sans';
src: url('/static/fonts/proxima-semibold-webfont.woff') format('woff');
font-weight: 500;
font-style: normal;
}
/* Semi-bold */
@font-face {
font-family: 'Splunk Platform Mono';
src: url('/static/fonts/inconsolata-regular.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* Monospace */
@font-face {
font-family: 'Splunk Icons';
src: url('/static/fonts/splunkicons-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* Splunk Icons : unicode-range: U+00-FF; */
/*===============================================================================================*/
/* SPLUNK: TYPOGRAPHY */
/* Headings, body text, lists, code, and more for a versatile and durable typography system. */
/*===============================================================================================*/
/*************************************************************************************************/
/* BODY TEXT */
/*************************************************************************************************/
p {
margin: 0 0 10px;
}
.lead {
margin-bottom: 20px;
font-size: 21px;
font-weight: 200;
line-height: 30px;
}
/*************************************************************************************************/
/* EMPHASIS & MISC */
/*************************************************************************************************/
small { font-size: 85%; }
/* Ex: 14px base font * 85% = about 12px */
strong { font-weight: bold; }
em { font-style: italic; }
cite { font-style: normal; }
/* Utility classes */
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.muted {
color: #6b7785;
}
a.muted:hover, a.muted:focus {
color: rgb(84, 94, 105);
}
/* .muted */
.text-warning {
color: #F8BE34;
}
a.text-warning:hover, a.text-warning:focus {
color: rgb(241, 171, 9);
}
/* .text-warning */
.text-error {
color: #DC4E41;
}
a.text-error:hover, a.text-error:focus {
color: rgb(198, 50, 36);
}
/* .text-error */
.text-info {
color: #006D9C;
}
a.text-info:hover, a.text-info:focus {
color: rgb(0, 75, 107);
}
/* .text-info */
.text-success {
color: #53A051;
}
a.text-success:hover, a.text-success:focus {
color: rgb(65, 125, 63);
}
/* .text-success */
/*************************************************************************************************/
/* FONT FAMILIES */
/*************************************************************************************************/
/* monospace for code and raw
normal
mono space
*/
.mono-space {
font-family: "Splunk Platform Mono", Inconsolata, Consolas, "Droid Sans Mono", Monaco, "Courier New", Courier, monospace;
}
/*************************************************************************************************/
/* HEADINGS */
/*************************************************************************************************/
h1 {
margin: 10px 0;
font-size: 24px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: none;
color: #FFFFFF;
text-rendering: optimizelegibility;
}
/* Fix the character spacing for headings */
h1 small { font-size: 21.6px; }
h2 {
margin: 10px 0;
font-size: 18px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: none;
color: #FFFFFF;
text-rendering: optimizelegibility;
}
/* Fix the character spacing for headings */
h2 small { font-size: 16.2px; }
h3 {
margin: 10px 0;
font-size: 16px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: none;
color: #FFFFFF;
text-rendering: optimizelegibility;
}
/* Fix the character spacing for headings */
h3 small { font-size: 14px; }
h4 {
margin: 10px 0;
font-size: 14px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: none;
color: #FFFFFF;
text-rendering: optimizelegibility;
/* Fix the character spacing for headings */
font-size: 14px;
}
h5 {
margin: 10px 0;
font-size: 18px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: none;
color: #FFFFFF;
text-rendering: optimizelegibility;
/* Fix the character spacing for headings */
font-size: 12px;
}
h6 {
margin: 10px 0;
font-size: 18px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: none;
color: #FFFFFF;
text-rendering: optimizelegibility;
/* Fix the character spacing for headings */
font-size: 11px;
}
.section-heading {
margin: 5px 0;
font-size: 14px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: uppercase;
color: #F7F8FA;
text-rendering: optimizelegibility;
/* Fix the character spacing for headings */
}
.section-heading-small {
margin: 5px 0;
font-size: 12px;
font-family: inherit;
font-weight: 500;
line-height: 20px;
text-transform: uppercase;
color: #F7F8FA;
text-rendering: optimizelegibility;
/* Fix the character spacing for headings */
}
/*************************************************************************************************/
/* PAGE HEADER */
/*************************************************************************************************/
.page-header {
padding-bottom: 9px;
margin: 20px 0 30px;
border-bottom: 1px solid #2B3033;
}
/*************************************************************************************************/
/* LISTS */
/*************************************************************************************************/
/* Unordered and Ordered lists */
ul, ol {
padding: 0;
margin: 0 0 10px 25px;
}
ul ul, ul ol, ol ul, ol ol {
margin-bottom: 0;
}
/* Remove default list styles */
ul.unstyled, ol.unstyled {
margin-left: 0;
list-style: none;
}
/* Single-line list items */
ul.inline, ol.inline {
margin-left: 0;
list-style: none;
}
ul.inline > li, ol.inline > li {
display: inline-block;
padding-left: 5px;
padding-right: 5px;
}
li {
line-height: 20px;
}
/* Description Lists */
dl {
margin-bottom: 20px;
}
dt,
dd {
line-height: 20px;
}
dt {
font-weight: bold;
}
dd {
margin-left: 10px;
}
/* Horizontal layout (like forms) */
.dl-horizontal:before,
.dl-horizontal:after {
display: table;
content: "";
line-height: 0;
}
.dl-horizontal:after {
clear: both;
}
/* Ensure dl clears floats if empty dd elements present */
.dl-horizontal dt {
float: left;
width: 160px;
clear: left;
text-align: right;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dl-horizontal dd {
margin-left: 180px;
}
/*************************************************************************************************/
/* MISC */
/*************************************************************************************************/
/* Horizontal rules */
hr {
margin: 20px 0;
border: 0;
border-top: 1px solid #2B3033;
border-bottom: 1px solid #FFFFFF;
}
/* Abbreviations and acronyms */
abbr[title],
/* Added data-* attribute to help out our tooltip plugin, per https://github.com/twitter/bootstrap/issues/5257 */
abbr[data-original-title] {
cursor: help;
border-bottom: 1px dotted #818D99;
}
abbr.initialism {
font-size: 90%;
text-transform: uppercase;
}
/* Blockquotes */
blockquote {
padding: 0 0 0 15px;
margin: 0 0 20px;
border-left: 5px solid #E1E6EB;
}
blockquote p {
margin-bottom: 0;
font-size: 17.5px;
font-weight: 300;
line-height: 1.25;
}
blockquote small {
display: block;
line-height: 20px;
color: #818D99;
}
blockquote small:before {
content: '\2014 \A0';
}
/* Float right with text-align: right */
blockquote.pull-right {
float: right;
padding-right: 15px;
padding-left: 0;
border-right: 5px solid #E1E6EB;
border-left: 0;
}
blockquote.pull-right p,
blockquote.pull-right small {
text-align: right;
}
blockquote.pull-right small:before {
content: '';
}
blockquote.pull-right small:after {
content: '\A0 \2014';
}
/* Quotes */
q:before,
q:after,
blockquote:before,
blockquote:after {
content: "";
}
/* Addresses */
address {
display: block;
margin-bottom: 20px;
font-style: normal;
line-height: 20px;
}
/*===============================================================================================*/
/* SPLUNK: CODE (INLINE AND BLOCK) */
/*===============================================================================================*/
/* Inline and block code styles */
code,
pre {
font-family: "Splunk Platform Mono", Inconsolata, Consolas, "Droid Sans Mono", Monaco, "Courier New", Courier, monospace;
border-radius: 3px;
}
/* Inline code */
code {
padding: 2px 4px;
color: #D14;
background-color: #F7F7F9;
border: 1px solid #E1E1E8;
white-space: nowrap;
font-size: 12px;
}
/* Blocks of code */
pre {
display: block;
padding: 9.5px;
margin: 0 0 10px;
font-size: 13px; /* 14px to 13px */
color: #3C444D;
line-height: 20px;
word-break: break-all;
word-wrap: break-word;
white-space: pre;
white-space: pre-wrap;
background-color: #F5F5F5;
border: 1px solid rgba(0, 0, 0, .15);
}
/* Make prettyprint styles more spaced out for readability */
pre.prettyprint {
margin-bottom: 20px;
}
/* Account for some code outputs that place code tags in pre tags */
pre code {
padding: 0;
color: inherit;
white-space: pre;
white-space: pre-wrap;
background-color: transparent;
border: 0;
}
/* Enable scrollable blocks of code */
.pre-scrollable {
max-height: 340px;
overflow-y: scroll;
}
/*===============================================================================================*/
/* SPLUNK: FORMS */
/* Base styles for various input types, form layouts, and states */
/*===============================================================================================*/
/*************************************************************************************************/
/* GENERAL STYLES */
/*************************************************************************************************/
/* Make all forms have space below them */
form, form:last-child {
margin: 0 0 20px;
}
fieldset {
padding: 0;
margin: 0;
border: 0;
}
/* Groups of fields with labels on top (legends) */
legend {
display: block;
width: 100%;
padding: 0;
margin-bottom: 20px;
font-size: 15px;
line-height: 40px;
color: #3C444D;
border: 0;
border-bottom: 1px solid #e5e5e5;
}
/* Small */
legend small {
font-size: 15px;
color: #818D99;
}
/* Set font for forms */
label,
input,
button,
select,
textarea {
font-size: 14px;
font-weight: normal;
line-height: 20px;
}
input,
button,
select,
textarea {
font-family: "Splunk Platform Sans", "Proxima Nova", Roboto, Droid, "Helvetica Neue", Helvetica, Arial, sans-serif; /* And only set font-family here for those that need it (note the missing label element) */
}
/* Identify controls by their labels */
label {
display: block;
margin-bottom: 5px;
cursor: default; /* reset pointer */
}
/*************************************************************************************************/
/* FORM CONTROLS */
/*************************************************************************************************/
/* Shared size and type resets */
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
display: inline-block;
padding: 5px 8px;
height: 32px;
line-height: 20px;
font-size: 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 10px;
color: #FFFFFF;
border-radius: 3px;
vertical-align: middle;
}
/* Reset appearance properties for textual inputs and textarea */
/* Declare width for legacy (can't be on input[type=*] selectors or it's too specific) */
input,
textarea,
.uneditable-input {
width: 206px; /* plus 12px padding and 2px border */
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* Reset height since textareas have rows */
textarea {
height: auto;
}
/* Everything else */
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
background-color: #2B3033;
border: 1px solid #171D21;
-webkit-transition: border 0.2s, -webkit-box-shadow 0.2s;
transition: border 0.2s, -webkit-box-shadow 0.2s;
transition: border 0.2s, box-shadow 0.2s;
transition: border 0.2s, box-shadow 0.2s, -webkit-box-shadow 0.2s;
}
/* Focus state */
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
textarea:focus:active:not([disabled]), input[type="text"]:focus:active:not([disabled]), input[type="password"]:focus:active:not([disabled]), input[type="datetime"]:focus:active:not([disabled]), input[type="datetime-local"]:focus:active:not([disabled]), input[type="date"]:focus:active:not([disabled]), input[type="month"]:focus:active:not([disabled]), input[type="time"]:focus:active:not([disabled]), input[type="week"]:focus:active:not([disabled]), input[type="number"]:focus:active:not([disabled]), input[type="email"]:focus:active:not([disabled]), input[type="url"]:focus:active:not([disabled]), input[type="search"]:focus:active:not([disabled]), input[type="tel"]:focus:active:not([disabled]), input[type="color"]:focus:active:not([disabled]), .uneditable-input:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus {
z-index: 3;
}
textarea.text-clear, input[type="text"].text-clear, input[type="password"].text-clear, input[type="datetime"].text-clear, input[type="datetime-local"].text-clear, input[type="date"].text-clear, input[type="month"].text-clear, input[type="time"].text-clear, input[type="week"].text-clear, input[type="number"].text-clear, input[type="email"].text-clear, input[type="url"].text-clear, input[type="search"].text-clear, input[type="tel"].text-clear, input[type="color"].text-clear, .uneditable-input.text-clear {
padding-right: 28px;
}
/* Don't show IE clear button when an artificial one is shown. */
textarea.text-clear::-ms-clear, input[type="text"].text-clear::-ms-clear, input[type="password"].text-clear::-ms-clear, input[type="datetime"].text-clear::-ms-clear, input[type="datetime-local"].text-clear::-ms-clear, input[type="date"].text-clear::-ms-clear, input[type="month"].text-clear::-ms-clear, input[type="time"].text-clear::-ms-clear, input[type="week"].text-clear::-ms-clear, input[type="number"].text-clear::-ms-clear, input[type="email"].text-clear::-ms-clear, input[type="url"].text-clear::-ms-clear, input[type="search"].text-clear::-ms-clear, input[type="tel"].text-clear::-ms-clear, input[type="color"].text-clear::-ms-clear, .uneditable-input.text-clear::-ms-clear {
display: none;
width: 0; /* IE 11 on windows 8 */
height: 0; /* IE 11 on windows 8 */
}
/* Position radios and checkboxes better */
input[type="radio"],
input[type="checkbox"] {
margin: 4px 0 0;
margin-top: 1px \9; /* IE9 */
line-height: normal;
}
/* Reset width of input images, buttons, radios, checkboxes */
input[type="file"],
input[type="image"],
input[type="submit"],
input[type="reset"],
input[type="button"],
input[type="radio"],
input[type="checkbox"] {
width: auto; /* Override of generic input selector */
}
/* Set the height of select and file controls to match text inputs */
select,
input[type="file"] {
height: 32px;
line-height: 32px;
}
/* Make select elements obey height by applying a border */
select {
width: 220px; /* default input width + 10px of padding that doesn't get applied */
border: 1px solid #171D21;
background-color: #2B3033; /* Chrome on Linux and Mobile Safari need background-color */
}
/* Make multiple select elements height not fixed */
select[multiple],
select[size] {
height: auto;
}
/* Focus for select, file, radio, and checkbox */
select:focus,
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
select:focus:active:not([disabled]), input[type="file"]:focus:active:not([disabled]), input[type="radio"]:focus:active:not([disabled]), input[type="checkbox"]:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
input[type="radio"]:focus {
border-radius: 100%;
}
/*************************************************************************************************/
/* UNEDITABLE INPUTS */
/*************************************************************************************************/
/* Make uneditable inputs look inactive */
.uneditable-input,
.uneditable-textarea {
color: #5C6773;
background-color: #2B3033;
border-color: #3C444D;
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.025);
box-shadow: inset 0 1px 2px rgba(0,0,0,.025);
cursor: not-allowed;
}
/* For text that needs to appear as an input but should not be an input */
.uneditable-input {
overflow: hidden; /* prevent text from wrapping, but still cut it off like an input does */
white-space: nowrap;
}
/* Make uneditable textareas behave like a textarea */
.uneditable-textarea {
width: auto;
height: auto;
}
/* restrict text area resize */
textarea {
min-height: 2em;
resize: vertical;
}
/*************************************************************************************************/
/* PLACEHOLDER */
/*************************************************************************************************/
/* Placeholder text gets special styles because when browsers invalidate entire lines if it doesn't understand a selector */
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #C3CBD4;
opacity: 1;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: #C3CBD4;
opacity: 1;
}
input::-ms-input-placeholder, textarea::-ms-input-placeholder {
color: #C3CBD4;
opacity: 1;
}
input::placeholder, textarea::placeholder {
color: #C3CBD4;
opacity: 1;
}
/*************************************************************************************************/
/* CHECKBOXES & RADIOS */
/*************************************************************************************************/
/* Indent the labels to position radios/checkboxes as hanging */
.radio,
.checkbox {
min-height: 20px; /* clear the floating input if there is no label text */
padding-left: 20px;
}
.radio input[type="radio"],
.checkbox input[type="checkbox"] {
float: left;
margin-left: -20px;
}
.radio input[type="radio"] {
border-radius: 100%;
}
/* Move the options list down to align with labels */
.controls > .radio:first-child,
.controls > .checkbox:first-child {
padding-top: 5px; /* has to be padding because margin collaspes */
}
/* Radios and checkboxes on same line */
/* TODO v3: Convert .inline to .control-inline */
.radio.inline,
.checkbox.inline {
display: inline-block;
padding-top: 5px;
margin-bottom: 0;
vertical-align: middle;
}
.radio.inline + .radio.inline,
.checkbox.inline + .checkbox.inline {
margin-left: 10px; /* space out consecutive inline controls */
}
/*************************************************************************************************/
/* DISABLED STATE */
/************************************************************************************************/
/* Disabled and read-only inputs */
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
cursor: not-allowed;
background-color: #2B3033;
border-color: #3C444D;
color: #5C6773;
}
/* Explicitly reset the colors here */
input[type="radio"][disabled],
input[type="checkbox"][disabled],
input[type="radio"][readonly],
input[type="checkbox"][readonly] {
background-color: #2B3033;
}
/*************************************************************************************************/
/* FORM FIELD FEEDBACK STATES */
/*************************************************************************************************/
/* Warning */
/* Set the text color */
.control-group.warning .control-label,
.control-group.warning .help-block,
.control-group.warning .help-inline,
.control-group.warning .checkbox,
.control-group.warning .radio {
color: #F8BE34;
}
/* Style inputs accordingly */
.control-group.warning input,
.control-group.warning select,
.control-group.warning textarea {
color: #F8BE34;
border-color: #F8BE34;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
/* Redeclare so transitions work */
.control-group.warning input:focus, .control-group.warning select:focus, .control-group.warning textarea:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.control-group.warning input:focus:active:not([disabled]), .control-group.warning select:focus:active:not([disabled]), .control-group.warning textarea:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.control-group.warning input:focus, .control-group.warning select:focus, .control-group.warning textarea:focus {
z-index: 3;
}
/* Give a small background color for input-prepend/-append */
.control-group.warning .input-prepend .add-on,
.control-group.warning .input-append .add-on {
color: #F8BE34;
background-color: #FEF2D7;
border-color: #F8BE34;
}
/* Error */
/* Set the text color */
.control-group.error .control-label,
.control-group.error .help-block,
.control-group.error .help-inline,
.control-group.error .checkbox,
.control-group.error .radio {
color: #DC4E41;
}
/* Style inputs accordingly */
.control-group.error input,
.control-group.error select,
.control-group.error textarea {
color: #DC4E41;
border-color: #DC4E41;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
/* Redeclare so transitions work */
.control-group.error input:focus, .control-group.error select:focus, .control-group.error textarea:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.control-group.error input:focus:active:not([disabled]), .control-group.error select:focus:active:not([disabled]), .control-group.error textarea:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.control-group.error input:focus, .control-group.error select:focus, .control-group.error textarea:focus {
z-index: 3;
}
/* Give a small background color for input-prepend/-append */
.control-group.error .input-prepend .add-on,
.control-group.error .input-append .add-on {
color: #DC4E41;
background-color: #31373E;
border-color: #DC4E41;
}
/* Success */
/* Set the text color */
.control-group.success .control-label,
.control-group.success .help-block,
.control-group.success .help-inline,
.control-group.success .checkbox,
.control-group.success .radio {
color: #53A051;
}
/* Style inputs accordingly */
.control-group.success input,
.control-group.success select,
.control-group.success textarea {
color: #53A051;
border-color: #53A051;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
/* Redeclare so transitions work */
.control-group.success input:focus, .control-group.success select:focus, .control-group.success textarea:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.control-group.success input:focus:active:not([disabled]), .control-group.success select:focus:active:not([disabled]), .control-group.success textarea:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.control-group.success input:focus, .control-group.success select:focus, .control-group.success textarea:focus {
z-index: 3;
}
/* Give a small background color for input-prepend/-append */
.control-group.success .input-prepend .add-on,
.control-group.success .input-append .add-on {
color: #53A051;
background-color: #DDECDD;
border-color: #53A051;
}
/* Success */
/* Set the text color */
.control-group.info .control-label,
.control-group.info .help-block,
.control-group.info .help-inline,
.control-group.info .checkbox,
.control-group.info .radio {
color: #006D9C;
}
/* Style inputs accordingly */
.control-group.info input,
.control-group.info select,
.control-group.info textarea {
color: #006D9C;
border-color: #006D9C;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
/* Redeclare so transitions work */
.control-group.info input:focus, .control-group.info select:focus, .control-group.info textarea:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.control-group.info input:focus:active:not([disabled]), .control-group.info select:focus:active:not([disabled]), .control-group.info textarea:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.control-group.info input:focus, .control-group.info select:focus, .control-group.info textarea:focus {
z-index: 3;
}
/* Give a small background color for input-prepend/-append */
.control-group.info .input-prepend .add-on,
.control-group.info .input-append .add-on {
color: #006D9C;
background-color: #CCE2EB;
border-color: #006D9C;
}
/* HTML5 invalid states */
/* Shares styles with the .control-group.error above */
input:focus:invalid,
textarea:focus:invalid,
select:focus:invalid {
color: #b94a48;
border-color: #ee5f5b;
}
input:focus:invalid:focus, textarea:focus:invalid:focus, select:focus:invalid:focus {
border-color: rgb(233, 53, 47);
-webkit-box-shadow: 0 0 6px rgb(248, 188, 186);
box-shadow: 0 0 6px rgb(248, 188, 186);
}
/*************************************************************************************************/
/* FORM ACTIONS */
/*************************************************************************************************/
.form-actions {
padding: 19px 20px 20px;
margin-top: 20px;
margin-bottom: 20px;
background-color: #F7F8FA;
border-top: 1px solid #e5e5e5; /* Adding clearfix to allow for .pull-right button containers */
}
.form-actions:before,
.form-actions:after {
display: table;
content: "";
line-height: 0;
}
.form-actions:after {
clear: both;
}
/*************************************************************************************************/
/* HELP TEXT */
/*************************************************************************************************/
.help-block,
.help-inline {
color: #C3CBD4;
}
.help-block > .learn-more-link, .help-block > .help-link, .help-inline > .learn-more-link, .help-inline > .help-link {
white-space: nowrap;
}
.help-block {
display: block; /* account for any element using help-block */
margin-top: 3px;
margin-bottom: 10px;
line-height: 1.4em;
font-size: 12px;
word-wrap: break-word;
}
.help-inline {
display: inline-block;
vertical-align: middle;
padding-left: 5px;
}
/*************************************************************************************************/
/* INPUT GROUPS */
/*************************************************************************************************/
/* Allow us to put symbols and text within the input field for a cleaner look */
/*************************************************************************************************/
/* SEARCH FORM */
/*************************************************************************************************/
input.search-query {
margin-bottom: 0; /* Remove the default margin on all inputs */
-webkit-transition: background-color 0.2s;
transition: background-color 0.2s;
}
/*************************************************************************************************/
/* HORIZONTAL & VERTICAL FORMS */
/*************************************************************************************************/
/* Common properties */
/* ----------------- */
.form-search input,
.form-search textarea,
.form-search select,
.form-search .uneditable-input,
.form-inline input,
.form-inline textarea,
.form-inline select,
.form-inline .uneditable-input,
.form-horizontal input,
.form-horizontal textarea,
.form-horizontal select,
.form-horizontal .uneditable-input {
display: inline-block;
margin-bottom: 0;
vertical-align: middle;
}
/* Re-hide hidden elements due to specifity */
.form-search .hide, .form-inline .hide, .form-horizontal .hide {
display: none;
}
.form-search label,
.form-search .btn-group,
.form-inline label,
.form-inline .btn-group {
display: inline-block;
}
.form-search .radio,
.form-search .checkbox,
.form-inline .radio,
.form-inline .checkbox {
/* Inline checkbox/radio labels (remove padding on left) */
padding-left: 0;
margin-bottom: 0;
vertical-align: middle;
}
.form-search .radio input[type="radio"],
.form-search .checkbox input[type="checkbox"],
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
/* Remove float and margin, set to inline-block */
float: left;
margin-right: 3px;
margin-left: 0;
}
/* Margin to space out fieldsets */
.control-group {
margin-bottom: 10px;
position: relative;
}
.control-group.disabled .control-label {
/* If a control is disabled, also gray out the control label */
color: #5C6773;
cursor: default;
}
.control-group .tooltip-link {
/* Tooltop link */
top: -0.5em;
position: relative;
font-size: 75%;
line-height: 0;
vertical-align: baseline;
margin: 0 2px;
padding: 2px;
cursor: default;
font-weight: normal;
}
/* Legend collapses margin, so next element is responsible for spacing */
/* Only applies to legends that are not visually hidden for accessibility purposes */
legend:not(.visuallyhidden) + .control-group {
margin-top: 20px;
-webkit-margin-top-collapse: separate;
}
/*************************************************************************************************/
/* HORIZONTAL SPECIFIC STYLES */
/*************************************************************************************************/
.form-horizontal {
/* Increase spacing between groups */
width: 600px;
max-width: 100%;
}
.form-horizontal .control-group {
margin-bottom: 10px;
}
.form-horizontal .control-group:before,
.form-horizontal .control-group:after {
display: table;
content: "";
line-height: 0;
}
.form-horizontal .control-group:after {
clear: both;
}
/* Float the labels left */
.form-horizontal .control-label {
float: left;
width: 160px;
padding-top: 5px;
text-align: right;
}
/* Move over all input controls and content */
.form-horizontal .controls {
margin-left: 180px;
}
.form-horizontal .controls > .help-block {
margin-left: 0;
}
/* Remove bottom margin on block level help text since that's accounted for on .control-group */
.form-horizontal .help-block {
margin-bottom: 0;
margin-left: 180px;
}
/* And apply it only to .help-block instances that follow a form control */
.form-horizontal input + .help-block, .form-horizontal select + .help-block, .form-horizontal textarea + .help-block, .form-horizontal .uneditable-input + .help-block {
margin-top: 10px;
}
/* Move over buttons in .form-actions to align with .controls */
.form-horizontal .form-actions {
padding-left: 180px;
}
/*************************************************************************************************/
/* INLINE SPECIFIC STYLES */
/*************************************************************************************************/
.form-inline label {
line-height: 28px;
}
.form-inline .form-value {
line-height: 28px;
margin-right: 15px;
}
.form-inline input {
width: auto;
margin-right: 15px;
}
/*************************************************************************************************/
/* CONTROLS LAYOUT */
/*************************************************************************************************/
/* Synthetic Radio is always full width */
.controls .shared-controls-syntheticradiocontrol,
.controls .shared-controls-booleanradiocontrol {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
}
.controls .shared-controls-syntheticradiocontrol > .btn, .controls .shared-controls-booleanradiocontrol > .btn {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.controls-join {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
/* evenly space controls */
.controls-join .control:not(:only-child) {
-webkit-box-flex: 1;
-ms-flex: 1 0 0px;
flex: 1 0 0px;
max-width: 100%;
}
.controls-join .control:only-child {
width: 100%;
}
/* Text-inputs should take up any extra space */
.controls-join .shared-controls-textcontrol {
-webkit-box-flex: 0;
-ms-flex: 0 1 100%;
flex: 0 1 100%;
min-width: 30%;
}
/* If there are three controls, allow the text control to get very small */
.controls-join .shared-controls-textcontrol:nth-last-child(n+3), .controls-join .control:nth-last-child(n+3) ~ .shared-controls-textcontrol {
min-width: 48px;
}
/* First or in the Middle do not have right corners */
.controls-join .shared-controls-textcontrol:not(:last-child) input,
.controls-join .shared-controls-textcontrol:not(:last-child) .uneditable-input,
.controls-join .shared-controls-syntheticselectcontrol:not(:last-child) .btn {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
/* Last or in the Middle do not have left corners */
.controls-join .shared-controls-textcontrol:not(:first-child) input,
.controls-join .shared-controls-textcontrol:not(:first-child) .uneditable-input,
.controls-join .shared-controls-syntheticselectcontrol:not(:first-child) .btn {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left: none;
}
/* Control should fill the control div */
.controls-join input,
.controls-join textarea,
.controls-join select,
.controls-join .uneditable-input,
.controls-join .shared-controls-syntheticselectcontrol .btn {
width: 100%;
}
/* Reset width of input images, buttons, radios, checkboxes */
.controls-join input[type="file"],
.controls-join input[type="image"],
.controls-join input[type="submit"],
.controls-join input[type="reset"],
.controls-join input[type="button"],
.controls-join input[type="radio"],
.controls-join input[type="checkbox"] {
width: auto; /* Override of generic input selector */
}
.controls-wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.controls-separate {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.controls-separate .control + .control {
margin-left: 10px;
}
.controls-stack {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column
}
/*************************************************************************************************/
/* FORM ELEMENTS */
/*************************************************************************************************/
.control {
position: relative;
}
/* synthetic placeholder */
.control .placeholder {
color: #C3CBD4;
position: absolute;
max-width: 100%;
top: 3px;
left: 6px;
font-size: 14px;
}
.control ::-webkit-input-placeholder {
color: #C3CBD4;
opacity: 1;
}
.control :-ms-input-placeholder {
color: #C3CBD4;
opacity: 1;
}
.control ::-ms-input-placeholder {
color: #C3CBD4;
opacity: 1;
}
.control ::placeholder {
color: #C3CBD4;
opacity: 1;
}
/* uneditable-input a read only text field or text area */
.control .uneditable-input {
background-color: #2B3033;
min-height: 32px;
}
.control .uneditable-input.uneditable-input-multiline {
overflow-y: auto;
white-space: normal;
white-space: pre-wrap;
word-break: break-all;
word-break: break-word;
height: auto;
max-height: 100px;
}
.control.shared-controls-textcontrol .control-clear, .control.shared-controls-textcontrol .search-icon {
position: absolute;
top: calc(50% + 1px);
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
right: 10px;
font-size: 18px;
color: #6b7785;
}
.control.shared-controls-textcontrol .control-clear {
display: none;
}
.control.shared-controls-textcontrol > input {
width: 100%;
}
.control.shared-controls-spinnercontrol {
text-align: center;
}
.control.shared-controls-spinnercontrol input, .control.shared-controls-spinnercontrol .uneditable-input {
display: block;
padding: 4px 65px 4px 6px;
-webkit-transition: border 0.2s, -webkit-box-shadow 0.2s;
transition: border 0.2s, -webkit-box-shadow 0.2s;
transition: border 0.2s, box-shadow 0.2s;
transition: border 0.2s, box-shadow 0.2s, -webkit-box-shadow 0.2s;
}
.control.shared-controls-spinnercontrol input.corrected-value {
border-color: #DC4E41;
-webkit-box-shadow: #FCEDEC 0px 0px 8px 0px;
box-shadow: #FCEDEC 0px 0px 8px 0px;
}
.control.shared-controls-spinnercontrol .increment-down, .control.shared-controls-spinnercontrol .increment-up {
position: absolute;
right: 1px;
top: 1px;
width: 30px;
line-height: 30px;
}
.control.shared-controls-spinnercontrol .increment-down:focus, .control.shared-controls-spinnercontrol .increment-up:focus {
background-color: rgba(0, 164, 253, 0.1);
-webkit-box-shadow: none;
box-shadow: none;
outline: none;
}
.control.shared-controls-spinnercontrol .increment-down.disabled, .control.shared-controls-spinnercontrol .increment-up.disabled {
color: #5C6773;
}
.control.shared-controls-spinnercontrol .increment-down {
right: 31px;
}
.control.shared-findinput {
display: inline-block;
margin: 5px 0;
}
.control.shared-findinput input {
width: 250px;
}
/* simple text only control (LabelControl) */
.input-label {
display: inline-block;
padding: 8px 0 4px 0;
height: auto;
line-height: 15px;
font-size: 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
max-width: 100%;
word-wrap: break-word;
word-break: break-word;
font-weight: 500;
}
/* wrapper for checkbox */
label.checkbox {
padding: 2px 0 2px 21px;
margin-bottom: 0;
position: relative;
}
label.checkbox.disabled {
color: #5C6773;
}
label.checkbox >.btn {
padding: 0;
width: 16px;
height: 16px;
border-radius: 2px;
position: absolute;
left: 0;
top: 3px;
}
label.checkbox >.btn > [class*="icon-"] {
margin: 0;
position: relative;
bottom: 6px;
vertical-align: text-top;
}
/*************************************************************************************************/
/* SMALL FORMS */
/*************************************************************************************************/
.control-group-small .control-label {
font-size: 12px;
}
.control-small {
font-size: 12px;
}
.control-small input[type="text"],
.control-small .uneditable-input,
.control-small textarea {
padding-top: 2px;
padding-bottom: 2px;
font-size: inherit;
}
.control-small input[type="text"],
.control-small .uneditable-input {
height: 26px
}
.control-small .uneditable-input {
min-height: 16px;
}
.control-small .btn, .control-small.btn-group > .btn {
padding-top: 2px;
padding-bottom: 2px;
font-size: 12px;
}
.control-small.shared-controls-spinnercontrol input, .control-small.shared-controls-spinnercontrol .uneditable-input {
padding-right: 55px;
}
.control-small.shared-controls-spinnercontrol .increment-down, .control-small.shared-controls-spinnercontrol .increment-up {
width: 24px;
line-height: 24px;
}
.control-small.shared-controls-spinnercontrol .increment-down {
right: 25px;
}
/*************************************************************************************************/
/* CHECKBOX CONTROLS */
/*************************************************************************************************/
.shared-controls-checkboxgroup label.checkbox {
padding-top: 2px;
padding-bottom: 2px;
}
.control-group > .controls > .shared-controls-syntheticcheckboxcontrol:only-child {
padding-top: 4px; /* Align to label */
}
/*************************************************************************************************/
/* KEY VALUE CONTROL */
/*************************************************************************************************/
.shared-controls-keyvaluecontrol .shared-controls-textcontrol {
margin-right: 10px;
}
.shared-controls-keyvaluecontrol .key-text-control-placeholder,
.shared-controls-keyvaluecontrol .value-text-control-placeholder {
float: left;
}
/*************************************************************************************************/
/* ACCUMULATOR CONTROL */
/*************************************************************************************************/
.accumulator {
width: 700px;
}
.controls-join .accumulator {
width: 100%;
}
.accumulator .availableOptionsContainer,
.accumulator .selectedOptionsContainer {
float: left;
width: calc(50% - 10px);
margin: 0px 20px 0px 0px;
}
.accumulator .addAllLink, .accumulator .removeAllLink {
float: right;
}
.accumulator .selectedOptionsContainer {
margin-right: 0px;
}
.accumulator .availableOptionsHeader {
font-weight: normal;
font-size: 14px;
width: 200px;
margin-right: 22px;
padding-bottom: 5px;
line-height: 0px;
}
.accumulator .selectedOptionsHeader {
width: 200px;
margin-right: 0px;
}
.accumulator ul.availableOptions, .accumulator ul.selectedOptions {
border-radius: 3px;
height: 100px;
overflow: auto;
list-style: none;
margin: 0;
padding: 0;
border: 1px solid #171D21;
clear: left;
}
.accumulator .accDisabled ul.availableOptions,
.accumulator .accDisabled ul.selectedOptions {
background-color: #F7F8FA;
}
.accumulator ul.availableOptions li, .accumulator ul.selectedOptions li {
clear: left;
padding: 4px 5px;
font-size: 14px;
cursor: pointer;
line-height: 1;
}
.accumulator ul.availableOptions li:hover,
.accumulator ul.selectedOptions li:hover {
background-color: #3C444D;
}
.accumulator ul.availableOptions li span, .accumulator ul.selectedOptions li span {
margin: 0px 8px 0 0;
display: block;
float: left;
}
.accumulator ul span.splIcon-arrow-e {
background-color: #007ABD;
}
.accumulator ul.availableOptions li.selected, .accumulator .accDisabled ul li {
color: #6b7785;
}
.accumulator ul.availableOptions li.selected span.splIcon,
.accumulator .accDisabled ul li span.splIcon {
background-color: #C3CBD4;
}
.accumulator .selected {
background-color: transparent;
}
.control-group.error .accumulator ul {
border-color: #DC4E41;
}
.accumulator .icon-class {
color: #6b7785;
}
.accumulator div.wide {
width: 340px;
}
/*************************************************************************************************/
/* TABLE FORMS */
/* TODO: figure out what this is for. */
/*************************************************************************************************/
/*
*/
table.form td {
padding-right: 10px;
padding-bottom: 5px;
}
table.form tr:last-child td {
padding-bottom: 0;
}
table.form tr:last-child .help-block {
margin-bottom: 0;
}
/*************************************************************************************************/
/* FORMAT DIALOGS */
/*************************************************************************************************/
.form-format .control-label {
width: 100px;
}
/* remove margin from last group */
.form-format .control-group:last-child {
margin-bottom: 0;
}
.form-format .controls {
margin-left: 120px;
}
/* Horizontal form, left-aligned */
.form-horizontal.align-left .control-label {
width: auto;
text-align: left;
display: inline-block;
float: none;
}
.form-horizontal.align-left .controls {
margin-left: 15px;
display: inline-block;
}
/* Append /Prepend */
/* -------------- */
.shared-controls-textcontrol.input-prepend {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.shared-controls-textcontrol.input-prepend > input, .shared-controls-textcontrol.input-prepend .uneditable-input {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
width: 0;
}
.shared-controls-textcontrol.input-prepend > .btn:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: none;
}
.shared-controls-textcontrol.input-append,
.shared-controls-textbrowsecontrol {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.shared-controls-textcontrol.input-append > input, .shared-controls-textcontrol.input-append .uneditable-input, .shared-controls-textbrowsecontrol > input, .shared-controls-textbrowsecontrol .uneditable-input {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto; /* SPL-122817 */
width: 0;
}
.shared-controls-textcontrol.input-append > input + .btn, .shared-controls-textcontrol.input-append .uneditable-input + .btn, .shared-controls-textbrowsecontrol > input + .btn, .shared-controls-textbrowsecontrol .uneditable-input + .btn {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left: none;
}
.shared-controls-textcontrol.input-append .add-on, .shared-controls-textbrowsecontrol .add-on {
display: inline-block;
padding: 5px 14px;
height: auto;
line-height: 20px;
font-size: 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 5px 14px;
margin-bottom: 0; /* For input.btn */
font-weight: 400;
color: #FFFFFF;
text-align: center;
vertical-align: middle;
border: 1px solid;
border-left: none;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
background-color: #5C6773;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none; /* this breaks some bootstrap styles */
}
.shared-controls-textcontrol.input-append .add-on[disabled], .shared-controls-textbrowsecontrol .add-on[disabled] {
color: #5C6773;
border-color: #3C444D;
cursor: not-allowed;
}
/* Form Complex */
/* -------------- */
/*
*/
/* complex forms? maybe use form-narrow? */
.form-complex {
width: 100%;
}
.form-complex .controls {
position: relative;
}
.form-complex .control-group {
width: 440px; /* magic number ;_; maybe move width to container */
}
.form-complex .control-heading { /* like control-label but without the float */
padding-top: 5px;
text-align: right;
width: 160px;
font-weight: bold;
}
.form-complex .help-block, .form-complex .help-outer {
position: absolute;
top: 4px;
left: 100%;
margin-left: 10px;
margin-top: 0 !important; /* TODO: get rid of important; */
width: 280px;
}
.form-complex .outline {
border: 1px solid #171D21;
border-radius: 3px;
margin-bottom: 10px; /* TOOD: use var here; */
margin-top: 0;
padding-top: 10px;
}
.form-complex fieldset {
border: 1px solid transparent;
}
.form-complex .btn-check {
display: inline-block;
padding: 0;
height: auto;
line-height: 20px;
font-size: 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
vertical-align: middle;
width: 20px;
}
.form-complex .control-feedback {
display: block;
width: 100%;
}
/* feedback for controls */
.control-feedback {
color: #FFFFFF;
background-color: #2B3033;
border-radius: 3px;
font-size: 85%;
text-align: center;
margin-top: 3px;
}
/*************************************************************************************************/
/* SYNTHETIC RADIO CONTROL */
/*************************************************************************************************/
.shared-controls-syntheticradiocontrol > .tooltip {
white-space:normal;
}
.shared-controls-syntheticradiocontrol .btn-radio {
-webkit-animation: none 0s ease 0s 1 normal none running;
animation: none 0s ease 0s 1 normal none running;
-webkit-backface-visibility: visible;
backface-visibility: visible;
background: transparent none repeat 0 0 / auto auto padding-box border-box scroll;
border: medium none currentColor;
border-collapse: separate;
-o-border-image: none;
border-image: none;
border-radius: 0;
border-spacing: 0;
bottom: auto;
-webkit-box-shadow: none;
box-shadow: none;
-webkit-box-sizing: content-box;
box-sizing: content-box;
caption-side: top;
clear: none;
clip: auto;
color: #000;
-webkit-columns: auto;
columns: auto;
-webkit-column-count: auto;
column-count: auto;
-webkit-column-fill: balance;
column-fill: balance;
-webkit-column-gap: normal;
column-gap: normal;
-webkit-column-rule: medium none currentColor;
column-rule: medium none currentColor;
-webkit-column-span: 1;
column-span: 1;
-webkit-column-width: auto;
column-width: auto;
content: normal;
counter-increment: none;
counter-reset: none;
cursor: auto;
direction: ltr;
display: inline;
empty-cells: show;
float: none;
font-family: serif;
font-size: medium;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-stretch: normal;
line-height: normal;
height: auto;
-webkit-hyphens: none;
-ms-hyphens: none;
hyphens: none;
left: auto;
letter-spacing: normal;
list-style: disc outside none;
margin: 0;
max-height: none;
max-width: none;
min-height: 0;
min-width: 0;
opacity: 1;
orphans: 2;
outline: medium none invert;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
padding: 0;
page-break-after: auto;
page-break-before: auto;
page-break-inside: auto;
-webkit-perspective: none;
perspective: none;
-webkit-perspective-origin: 50% 50%;
perspective-origin: 50% 50%;
position: static;
right: auto;
-moz-tab-size: 8;
-o-tab-size: 8;
tab-size: 8;
table-layout: auto;
text-align: left;
text-align-last: auto;
text-decoration: none;
text-indent: 0;
text-shadow: none;
text-transform: none;
top: auto;
-webkit-transform: none;
transform: none;
-webkit-transform-origin: 50% 50% 0;
transform-origin: 50% 50% 0;
-webkit-transform-style: flat;
transform-style: flat;
-webkit-transition: none 0s ease 0s;
transition: none 0s ease 0s;
unicode-bidi: normal;
vertical-align: baseline;
visibility: visible;
white-space: normal;
widows: 2;
width: auto;
word-spacing: normal;
z-index: auto;
font-family: "Splunk Platform Sans", "Proxima Nova", Roboto, Droid, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 20px;
color: #FFFFFF;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block;
border-width: 1px;
visibility: inherit;
/* postcss-initial does not correctly reset this for all browsers */
outline: medium none #00A4FD;
outline: medium none invert;
position: relative;
padding: 3px 0 3px 20px;
color: #FFFFFF;
text-decoration: none;
}
.shared-controls-syntheticradiocontrol .btn-radio:before {
content:'';
border: 1px solid;
background-color: #5C6773;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
position: absolute;
left: 0;
top: 4px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 16px;
height: 16px;
border-radius: 8px;
}
.shared-controls-syntheticradiocontrol .btn-radio.disabled {
cursor: not-allowed;
color: #5C6773;
opacity: 0.65;
}
.shared-controls-syntheticradiocontrol .btn-radio.disabled:before {
background: #2B3033;
-webkit-filter: none;
filter: none;
border-color: #3C444D;
}
.shared-controls-syntheticradiocontrol .btn-radio:not(.disabled):hover:before {
background-color: #3C444D;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.shared-controls-syntheticradiocontrol .btn-radio:focus:before {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.shared-controls-syntheticradiocontrol .btn-radio:focus:before:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.shared-controls-syntheticradiocontrol .btn-radio.active:after {
content:'';
position: absolute;
left: 4px;
top: 8px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 8px;
height: 8px;
border-radius: 4px;
background-color: currentColor;
}
.radio-control-list {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
/*************************************************************************************************/
/* ERROR STATES */
/*************************************************************************************************/
.error .btn {
background-color: #F1B9B3;
border-color: #DC4E41;
color: #DC4E41;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.error .btn.active {
background-color: #EA958D;
border-color: #DC4E41;
color: #DC4E41;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
background-image: none;
}
.error .btn:hover {
background-color: #EA958D;
border-color: #DC4E41;
color: #DC4E41;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.required {
color: #DC4E41;
}
/* Custom shared form components for color editing */
/* ------------------------------------------------------ */
.color-square {
display: block;
width: 32px;
height: 32px;
background: #53A051;
border: 1px solid #000000;
border-radius: 2px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.color-square:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.color-square:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.color-square-standalone {
margin-top: 3px;
}
/*===============================================================================================*/
/* SPLUNK: TABLES */
/* Tables for, you guessed it, tabular data. */
/*===============================================================================================*/
/*************************************************************************************************/
/* BASE TABLES */
/*************************************************************************************************/
table {
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
border-spacing: 0;
}
/*************************************************************************************************/
/* BASELINE STYLES */
/*************************************************************************************************/
.table {
width: auto;
min-width: 100%;
max-width: none;
margin-bottom: 20px;
}
/* Cells */
.table th, .table td {
text-align: left;
vertical-align: top;
padding: 6px 12px;
line-height: 20px;
border-bottom: 1px solid transparent;
}
.table th td:focus, .table td td:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.table th td:focus:active:not([disabled]), .table td td:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table th td:focus, .table td td:focus {
-webkit-box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
}
.table th .tooltip-link, .table td .tooltip-link {
top:-.5em;
position:relative;
font-size:75%;
line-height:0;
vertical-align:baseline;
cursor:default;
font-weight:400;
}
.table th div {
padding: 6px 12px;
}
.table thead th {
vertical-align: bottom;
}
/* Remove top border from thead by default */
.table caption + thead tr:first-child th,
.table caption + thead tr:first-child td,
.table colgroup + thead tr:first-child th,
.table colgroup + thead tr:first-child td,
.table thead:first-child tr:first-child th,
.table thead:first-child tr:first-child td {
border-top: 0;
}
/* Account for multiple tbody instances */
.table tbody + tbody {
border-top: 2px solid transparent;
}
/* sorts */
.table .sorts {
white-space: nowrap;
cursor: pointer;
}
.table .sorts a {
color: inherit;
}
.table .sorts a:hover {
text-decoration: none;
}
.table .sorts:hover {
color: #00A4FD;
}
.table .sorts .icon-sorts:before {
font-family: "Splunk Icons";
content: "\2195";
padding-left: 5px;
color: unset;
}
.table .sorts.active .icon-sorts:before {
color: unset;
}
.table .sorts .asc:before,
.table .sorts .Asc:before {
content: "\21A5";
color: inherit;
}
.table .sorts .desc:before,
.table .sorts .Desc:before {
content: "\21A7";
color: inherit;
}
.table .sorts[tabindex]:focus {
outline: 0;
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.table .sorts[tabindex]:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table .sorts[tabindex]:focus {
-webkit-box-shadow: inset 0 0 2px 1px #171D21, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #171D21, inset 0 0 0 2px #00A4FD;
}
/* Nesting */
.table .table {
background-color: transparent;
}
/*************************************************************************************************/
/* CONDENSED TABLE W/ HALF PADDING */
/*************************************************************************************************/
.table-condensed th,
.table-condensed td {
padding: 3px 6px;
}
/*************************************************************************************************/
/* BORDERED TABLE */
/*************************************************************************************************/
.table-bordered {
border: 1px solid transparent;
border-collapse: separate; /* Done so we can round those corners! */
border-left: 0;
}
.table-bordered th,
.table-bordered td {
border-left: 1px solid transparent;
}
/*************************************************************************************************/
/* BORDERED LITE TABLE */
/* A stripped-down version of bootstrap's table-bordered */
/*************************************************************************************************/
.table-bordered-lite th, .table-bordered-lite td {
border-left: 1px solid transparent;
}
.table-bordered-lite th:first-child, .table-bordered-lite td:first-child {
border-left: none;
}
/*************************************************************************************************/
/* BORDERED DOTTED TABLE */
/*************************************************************************************************/
.table-dotted td, .table-dotted th {
border-top: 1px dashed #171D21;
}
/*************************************************************************************************/
/* STRIPED TABLE */
/*************************************************************************************************/
.table-striped > thead > tr > th {
background-color: #2B3033;
border-top: 1px solid transparent;
}
.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
background-color: #31373E;
}
.table-striped > tbody > tr:nth-child(even) > td {
background-color: #2B3033;
}
.table-striped > tbody > tr.odd > td,
.table-striped > tbody > tr.odd > th {
background-color: #31373E;
}
.table-striped > tbody > tr.even > td,
.table-striped > tbody > tr.even > th {
background-color: #2B3033;
}
.table-striped > tbody > tr > td {
border: none;
}
.table-striped.table-chrome > tbody > tr:nth-child(even) > td,
.table-striped.table-chrome > tbody > tr:nth-child(odd).even > td,
.table-striped.table-chrome > tbody > tr.even > td {
background-color: #31373E;
}
.table-striped.table-chrome > tbody > tr:nth-child(odd) > td,
.table-striped.table-chrome > tbody > tr:nth-child(even).odd > td,
.table-striped.table-chrome > tbody > tr.odd > td {
background-color: #2B3033;
}
/*************************************************************************************************/
/* CHROME TABLE */
/* Table with dark header background color. */
/*************************************************************************************************/
.table-chrome, .table-chrome.table-row-expanding {
border: none;
}
.table-chrome > thead > tr > th {
font-weight: normal;
background-color: #171D21;
border-right: 1px solid #32414C;
border-bottom: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.table-chrome > thead > tr > th:last-child {
border-right: none;
}
/* sorting */
.table-chrome .sorts {
border-bottom: none;
}
/* saf3+, chrome1+ */
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* fix table headers */
.table-chrome > thead > tr > th { position: relative; }
}
/*************************************************************************************************/
/* HOVER EFFECT */
/*************************************************************************************************/
.table-hover > tbody > tr > td, .table-hover > tbody > tr > th {
-webkit-transition: background 0.05s;
transition: background 0.05s;
}
.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th {
background-color: #3C444D !important;
}
/*************************************************************************************************/
/* TABLE CELL SIZING */
/*************************************************************************************************/
/* Reset default grid behavior */
table td[class*="span"],
table th[class*="span"],
.row-fluid table td[class*="span"],
.row-fluid table th[class*="span"] {
display: table-cell;
float: none; /* undo default grid column styles */
margin-left: 0; /* undo default grid column styles */
}
/* Change the column widths to account for td/th padding */
.table td.span1, .table th.span1 { float: none; /* undo default grid column styles */ width: 44px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span2, .table th.span2 { float: none; /* undo default grid column styles */ width: 124px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span3, .table th.span3 { float: none; /* undo default grid column styles */ width: 204px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span4, .table th.span4 { float: none; /* undo default grid column styles */ width: 284px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span5, .table th.span5 { float: none; /* undo default grid column styles */ width: 364px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span6, .table th.span6 { float: none; /* undo default grid column styles */ width: 444px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span7, .table th.span7 { float: none; /* undo default grid column styles */ width: 524px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span8, .table th.span8 { float: none; /* undo default grid column styles */ width: 604px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span9, .table th.span9 { float: none; /* undo default grid column styles */ width: 684px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span10, .table th.span10 { float: none; /* undo default grid column styles */ width: 764px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span11, .table th.span11 { float: none; /* undo default grid column styles */ width: 844px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
.table td.span12, .table th.span12 { float: none; /* undo default grid column styles */ width: 924px; /* 16 is total padding on left and right of table cells */ margin-left: 0; /* undo default grid column styles */ }
/*************************************************************************************************/
/* FOCUS EFFECT */
/* Add focus back in, needs to come last */
/*************************************************************************************************/
.table > tbody > tr.even > td:focus, .table > tbody > tr.odd > td:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;}
.table > tbody > tr.even > td:focus:active:not([disabled]), .table > tbody > tr.odd > td:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table > tbody > tr.even > td:focus, .table > tbody > tr.odd > td:focus {
-webkit-box-shadow: inset 0 0 2px 1px #2B3033, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #2B3033, inset 0 0 0 2px #00A4FD;
}
.table > tbody > tr:focus,
.table > tbody > tr.even:focus,
.table > tbody > tr.odd:focus {
outline: none;
}
.table > tbody > tr:focus > td, .table > tbody > tr.even:focus > td, .table > tbody > tr.odd:focus > td {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;}
.table > tbody > tr:focus > td:active:not([disabled]), .table > tbody > tr.even:focus > td:active:not([disabled]), .table > tbody > tr.odd:focus > td:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table > tbody > tr:focus > td, .table > tbody > tr.even:focus > td, .table > tbody > tr.odd:focus > td {
-webkit-box-shadow: inset 0 0 2px 1px #2B3033, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #2B3033, inset 0 0 0 2px #00A4FD;
}
/*************************************************************************************************/
/* TABLE BACKGROUNDS */
/* Exact selectors below required to override .table-striped */
/*************************************************************************************************/
.table tbody tr.success > td {
background-color: #DDECDD;
}
.table tbody tr.error > td {
background-color: #31373E;
}
.table tbody tr.warning > td {
background-color: #FEF2D7;
}
.table tbody tr.info > td {
background-color: #CCE2EB;
}
/* Hover states for .table-hover */
.table-hover tbody tr.success:hover > td {
background-color: rgb(206, 227, 206);
}
.table-hover tbody tr.error:hover > td {
background-color: rgb(38, 43, 49);
}
.table-hover tbody tr.warning:hover > td {
background-color: rgb(253, 234, 190);
}
.table-hover tbody tr.info:hover > td {
background-color: rgb(185, 216, 228);
}
/* EMBEDDED TABLES */
/* -------------------- */
/* tables that appear within other tables. */
.table-embed {
width: 100%;
border: 0;
}
.table-embed td {
border-bottom: 1px dashed #171D21;
border-left: 0;
padding: 0;
background-color: transparent !important;
}
.table-embed td:first-child {
padding-right: 10px;
}
/*************************************************************************************************/
/* ROW EXPANDING */
/*************************************************************************************************/
.table-row-expanding {
width: 100%;
table-layout: fixed;
margin-bottom: -1px;
border-bottom: 1px solid #171D21;
}
.table-row-expanding > tbody > tr > td.expands {
cursor: pointer;
border-right: 1px solid #32414C;
padding: 0;
}
.table-row-expanding > tbody > tr > td.expands.disabled {
color: #5C6773;
cursor: default;
}
.table-row-expanding > tbody > tr > td.expands.disabled > span, .table-row-expanding > tbody > tr > td.expands.disabled a {
color: inherit;
cursor: inherit;
}
.table-row-expanding > tbody > tr > td.expands > span, .table-row-expanding > tbody > tr > td.expands a, .table-row-expanding > tbody > tr > td.expands > i {
color: #FFFFFF;
display: block;
padding: 6px 10px;
width: 15px;
height: 100%;
text-decoration: none;
text-align: center;
}
.table-row-expanding > tbody > tr > td.expands a:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.table-row-expanding > tbody > tr > td.expands a:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table-row-expanding > tbody > tr > td.expands a:focus {
-webkit-box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
}
.table-row-expanding > tbody > tr > td > .btn-combo {
margin: -4px 5px -6px 20px;
}
.table-row-expanding > tbody > tr > td > .btn-combo:first-child {
margin-left: 0;
}
.table-row-expanding > tbody > tr > td.title > a, .table-row-expanding > tbody > tr > td.title > span {
margin: -6px -12px;
padding: 6px 12px;
display: block;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
font-size: 14px;
line-height: 20px;
}
.table-row-expanding > tbody > tr > td.title > a:focus, .table-row-expanding > tbody > tr > td.title > span:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.table-row-expanding > tbody > tr > td.title > a:focus:active:not([disabled]), .table-row-expanding > tbody > tr > td.title > span:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table-row-expanding > tbody > tr > td.title > a:focus, .table-row-expanding > tbody > tr > td.title > span:focus {
-webkit-box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
}
.table-row-expanding > tbody > tr > td.title > .disabled {
color: #5C6773;
}
.table-row-expanding > tbody > tr > td:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.table-row-expanding > tbody > tr > td:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.table-row-expanding > tbody > tr > td:focus {
-webkit-box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
}
/* TODO unify these class names */
.table-row-expanding > tbody > tr.more-info, .table-row-expanding > tbody > tr.info-row > td {
border-top: none;
background-color: #3C444D;
}
/* style for an extra row inserted in the expanded state */
.table-row-expanding > tbody > tr.expanded > td {
background-color: #3C444D;
}
.table-row-expanding > tbody > tr.expanded > td.title > a {
white-space: normal;
}
.table-row-expanding th.col-info {
width: 15px;
padding-left: 10px;
padding-right: 10px;
text-align: center;
vertical-align: top;
font-size: 100%;
border-right: 1px solid #32414C;
}
.table-row-expanding th.col-info a {
text-decoration: none;
color: #000000;
-webkit-box-shadow: none;
box-shadow: none;
}
.table-row-expanding th.col-info .icon-info {
width: 15px;
display: block;
}
.table-row-expanding td.expands:hover:not(.disabled), .table-row-expanding td.col-info:hover:not(.disabled) {
border-right: 1px solid #32414C !important;
}
.table-row-expanding td.expands:hover:not(.disabled) a > i, .table-row-expanding td.col-info:hover:not(.disabled) a > i {
color: #00A4FD;
}
.table-row-expanding td.expands.disabled:hover, .table-row-expanding td.col-info.disabled:hover {
background-color: inherit !important;
}
.table-row-expanding td.expands .icon-triangle-right-small:before {
content: "\203A";
}
.table-row-expanding td.expands .icon-triangle-down-small:before {
content: "\2C5";
}
/* remove sorting icons for info column */
.table-chrome .sorts th.col-info:after {
content: "";
}
.table-padded {
padding: 0 20px;
}
/*************************************************************************************************/
/* SPECIAL COLUMNS AND CELLS */
/* Custom styles for row numbers */
/*************************************************************************************************/
td.row-number,
th.row-number {
width: 1px;
}
td.row-number, td.line-num {
text-align: right;
color: #6b7785;
}
/* custom styles for numeric value cells */
th.numeric, td.numeric {
text-align: right
}
td.end-group {
border-right: 1px solid #32414C;
}
/*************************************************************************************************/
/* DOCKING AND STATIC TABLE HEADERS */
/* Class for docking table header and scroll bar */
/*************************************************************************************************/
.header-table-docked {
position: fixed;
top: 0;
z-index: 405;
overflow: hidden;
-webkit-box-shadow: 0 2px 4px #C3CBD4;
box-shadow: 0 2px 4px #C3CBD4;
background: #FFFFFF;
}
.header-table-docked > .disable {
display: block;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
background-color: #5C6773;
opacity: 0.30;
}
.header-table-docked > table {
table-layout: fixed;
margin-bottom: 0;
/* SPL-71945, this prevents the last header cell from appearing un-styled in Firefox and IE */
max-width: inherit;
}
.main-section > .header-table-docked, .table-padded > .header-table-docked {
width: calc(100% - 40px);
margin-left: 20px !important;
}
.table-scroll-bar-docked {
position: fixed;
bottom: 0;
left: 0;
right: 0;
overflow-x: auto;
}
/* class for static table header and scroll bar */
.header-table-static {
height: 0;
position: relative;
z-index: 405;
}
.header-table-static > table {
margin-bottom: 0;
}
.header-table-wrapper {
overflow: hidden;
border-bottom: 1px solid transparent;
}
.header-table-wrapper .table {
margin-bottom: 0;
}
/* need to clean up these two classes to make sense */
.scroll-table-wrapper { /* used on dashboards and embedded tables, the wrapper scrolls horz and vert */
height: 380px; /* override */
width: 100%;
overflow: auto;
}
.scrolling-table-wrapper { /* tables that will scroll horizontally */
width: 100%;
overflow-x: auto;
position: relative;
}
/* tables that will scroll vertically, up to consumer to set height or max-height */
.vertical-scrolling-table-wrapper {
width: 100%;
overflow-y: auto;
}
/*************************************************************************************************/
/* MODALIZING ROWS */
/*************************************************************************************************/
.modalize-table-top, .modalize-table-bottom, .modalize-table-overlay {
position: absolute;
left: 0;
background-color: #5C6773;
opacity: 0.30;
}
.modalize-table-top {
top: 0;
}
.modalize-table-bottom {
bottom: 0;
}
.modalize-table-overlay {
position: fixed;
top: 0;
bottom: 0;
right: 0;
}
/*************************************************************************************************/
/* DRILLDOWN */
/*************************************************************************************************/
.table-drilldown > tbody > tr > td {
color: #00A4FD;
}
.table-drilldown > tbody > tr > td:hover {
color: #006EAA;
}
/* reset for row # */
.table-drilldown > tbody > tr > td.row-number {
color: #6b7785;
}
.table-drilldown-row > tbody > tr:hover > td {
color: #006EAA;
}
/* reset for row # */
.table-drilldown-row > tbody > tr:hover > td.row-number {
color: #6b7785;
}
.table-drilldown-cell > tbody > tr > td:hover .multivalue-subcell {
color: #00A4FD;
}
.table-drilldown-cell > tbody > tr > td:hover .multivalue-subcell:hover {
color: #006EAA;
}
/*************************************************************************************************/
/* MISC */
/*************************************************************************************************/
/* misc hacks that should probably never been added */
.ui-grid-head-table,
.ui-grid-body-table {
margin-bottom: 0;
}
/* table-scroll? */
.table-scroll tbody {
max-height: 200px;
overflow-y: scroll;
}
/* just the row borders */
.table-border-row {
border-top: 1px solid transparent;
}
.table-border-row th, .table-border-row td {
border-top: 1px solid transparent;
}
/* fixed width tables */
.table-fixed {
table-layout: fixed;
}
.table-fixed tr > td:first-child {
max-width: 300px;
word-break: break-all;
}
/* remove the sorting icons for the row number column */
.table-chrome .sorts th.row-number:after {
content: "";
}
/* Print */
/* -------------------------------------------------- */
@media print {
body table {
max-width: 100% !important;
width: 100% !important;
overflow: hidden !important;
table-layout: auto !important;
}
body .scrolling-table-wrapper, body .results-wrapper, body .results-table, body .events-viewer-wrapper {
max-width: 100% !important;
width: 100% !important;
overflow: hidden !important;
}
body td,
body th {
background: none !important;
word-break: break-all !important;
word-wrap: break-word !important;
overflow-wrap: break-word !important;
white-space: normal !important;
width: auto !important;
page-break-inside:auto;
}
body .table-chrome .sorts:after {
content: '';
}
body .header-table-docked,
body .table-scroll-bar-docked {
display: none !important;
}
}
body.print table {
max-width: 100% !important;
width: 100% !important;
overflow: hidden !important;
table-layout: auto !important;
}
body.print .scrolling-table-wrapper, body.print .results-wrapper, body.print .results-table, body.print .events-viewer-wrapper {
max-width: 100% !important;
width: 100% !important;
overflow: hidden !important;
}
body.print td,
body.print th {
background: none !important;
word-break: break-all !important;
word-wrap: break-word !important;
overflow-wrap: break-word !important;
white-space: normal !important;
width: auto !important;
page-break-inside:auto;
}
body.print .table-chrome .sorts:after {
content: '';
}
body.print .header-table-docked,
body.print .table-scroll-bar-docked {
display: none !important;
}
/*===============================================================================================*/
/* SPLUNK: TABLE CAPTIONS */
/* The count, filters and pagination that appear above a listing. */
/*===============================================================================================*/
.table-caption,
.table-caption-inner {
min-height: 42px;
text-align: center;
margin-bottom: 5px;
}
.table-caption-inner.affix-top {
left: 0;
top: 0;
right: 0;
background-color: #F2F4F5;
z-index: 405;
position: fixed;
}
.table-caption h3, .table-caption span.shared-collectioncount {
font-size: 14px;
font-weight: normal;
float: left;
padding-left: 20px;
line-height: 42px;
margin: 0;
min-width: 140px;
text-align: left;
}
.table-caption .shared-waitspinner {
float: left;
width: 14px;
height: 14px;
margin: 12px 5px 2px 0;
}
.table-caption form.shared-tablecaption-input {
display: inline-block;
margin: 5px 0;
}
.table-caption form.shared-tablecaption-input input {
width: 250px;
}
.table-caption .btn-group {
display: inline-block;
margin-right: 10px;
}
.table-caption .pagination {
min-width: 150px;
margin: 5px 20px 0 20px;
}
/*************************************************************************************************/
/* FILTER FORMS */
/*************************************************************************************************/
.shared-tablecaption-input {
position: relative;
}
.table-caption div.shared-controls-controlgroup {
display: inline-block;
margin: 0px 10px 0px 0;
}
.table-caption .pagination {
min-width: 150px;
margin: 5px 20px 0 20px;
}
/*===============================================================================================*/
/* SPLUNK: STANDARD TOUR */
/*===============================================================================================*/
.tourbar {
background-color: #171D21;
min-height: 46px;
position: relative;
}
.tourbar .info-container {
margin: 0px 200px;
padding: 10px;
background-color: #3C444D;
min-height: 26px;
}
.tourbar .info-container .info {
font-size: 14px;
color: #E1E6EB;
}
.tourbar .btn {
background: transparent;
-webkit-filter: none;
filter: none;
border-color: #000000;
color: #E1E6EB;
text-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
top: 50%;
margin-top: -13px;
position: absolute;
}
.tourbar .btn.next {
right: 158px;
}
.tourbar .btn.previous {
left: 158px;
}
.tourbar .btn.close-btn {
right: 10px;
}
.tourbar .close-container {
float: right;
margin: 10px 25px 10px 25px;
}
.tourbar .next-container {
float: right;
margin: 10px 0px 10px 25px;
}
.tourbar .previous-container {
float: left;
margin: 10px 25px;
}
.tour-highlight {
position: relative;
}
.tour-highlight::after {
content: "";
position: absolute;
right: -20px;
top: -20px;
height: 30px;
width: 30px;
z-index: 99999;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjIwcHgiIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAwIDIwIDIwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDx0aXRsZT5VbnRpdGxlZCAyPC90aXRsZT4KICAgIDxkZXNjcmlwdGlvbj5DcmVhdGVkIHdpdGggU2tldGNoIChodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gpPC9kZXNjcmlwdGlvbj4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPgogICAgICAgIDxwYXRoIGQ9Ik02LjcxNDQ2NjA5LDYuNzE0NDY2MDkgTDAsMCBMMCwyMCBMMjAsMjAgTDEzLjc4NTUzMzksMTMuNzg1NTMzOSBMMjAuMDQ1OTQxNSw3LjUyNTEyNjI3IEwxMi45NzQ4NzM3LDAuNDU0MDU4NDU0IEw2LjcxNDQ2NjA5LDYuNzE0NDY2MDkgWiIgaWQ9IlRyaWFuZ2xlLTEiIGZpbGw9IiNEODVEM0MiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4KICAgIDwvZz4KPC9zdmc+);
background-size: 30px 30px;
-webkit-animation: highlightedElementAnimation 2s infinite alternate;
animation: highlightedElementAnimation 2s infinite alternate;
}
@-webkit-keyframes highlightedElementAnimationFrames {
from { right: -20px; top: -20px; }
to { right: -30px; top: -30px; }
}
@keyframes highlightedElementAnimationFrames {
from { right: -20px; top: -20px; }
to { right: -30px; top: -30px; }
}
/* IMAGE TOUR CAROUSEL */
.image-tour-container .carousel {
width: 960px;
height: 718px;
background: #3C444D;
margin-bottom: 0;
}
.image-tour-container .carousel .carousel-control {
top: 52%;
background: none;
border: none;
color: #5CC05C;
opacity: 1;
left: 45px;
font-size: 48px;
z-index: 60;
}
.image-tour-container .carousel .carousel-control polygon {
fill: #5CC05C;
}
.image-tour-container .carousel .carousel-control:hover polygon{
fill: #7ECD7E;
}
.image-tour-container .carousel .carousel-control.disabled {
display: none;
}
.image-tour-container .carousel .carousel-control:focus {
-webkit-box-shadow: none;
box-shadow: none;
}
.image-tour-container .carousel .carousel-control.right {
right: 45px;
left: auto;
}
.image-tour-container .carousel .carousel-indicators {
bottom: 18px;
top: inherit;
right: 50%;
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
z-index: 60;
}
.image-tour-container .carousel .carousel-indicators li {
height: 6px;
width: 6px;
cursor: pointer;
background: #818D99;
border: none;
margin-left: 10px;
margin-bottom: 0px;
}
.image-tour-container .carousel .carousel-indicators li.active {
background-color: #5CC05C;
}
.image-tour-container .carousel .carousel-indicators li:first-child {
margin-left: 0;
}
.image-tour-container .carousel .item {
width: 960px;
height: 716px;
}
.image-tour-container .carousel .item img {
width:100%;
}
.image-tour-container .carousel .item.active img:hover {
cursor: pointer;
}
.image-tour-container .carousel .help-link {
position: absolute;
width: 150px;
height: 30px;
top: 122px;
left: 563px;
}
.image-tour-container .carousel a#splunk-answers {
top: 160px;
left: 504px;
width: 140px;
}
.image-tour-container .tour-links {
position: absolute;
top: 15px;
right: 5px;
padding: 5px;
text-align: right;
z-index: 50;
font-size: 12px;
}
.image-tour-container .tour-links a {
color: #FFFFFF;
margin-left: 15px;
}
.image-tour-container .tour-links a:hover {
text-decoration: underline;
}
.image-tour-container .welcome-slide {
position: absolute;
top: 0;
left: 0;
z-index: 100;
}
.image-tour-container .tour-btn {
background: rgba(0, 0, 0, 0.3);
position: absolute;
top: 300px;
left: 50%;
padding: 30px 40px;
font-size: 30px;
color: #FFFFFF;
cursor: pointer;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
.image-tour-container .start-tour,
.image-tour-container .exit-tour {
color: #5CC05C;
}
.image-tour-container .tour-gutter {
background: rgba(60, 68, 77, 0.9);
height: 132px;
width: 962px;
font-size: 16px;
color: #FFFFFF;
position: absolute;
bottom: 0px;
z-index: 50;
left: 50%;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
.image-tour-container .tour-gutter div.gutter-text {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
margin: 0 auto;
position: relative;
top: 50%;
line-height: 150%;
width: 720px;
text-align: center;
}
.image-tour-container .tour-gutter a {
color: #FFFFFF;
text-decoration: underline;
}
.image-tour-container .carousel-assets {
position: absolute;
height: 132px;
width: 960px;
bottom: 0;
}
.image-tour-container .next-tour,
.image-tour-container .try-it-now {
display: none;
}
.image-tour-container .try-it-now {
position: absolute;
right: 30px;
z-index: 500;
bottom: 50px;
}
@media only screen and (max-height: 750px) {
.image-tour-container .carousel-assets,
.image-tour-container .tour-gutter {
position: fixed;
}
.image-tour-container .carousel-assets {
bottom: -132px;
z-index: 60;
}
.image-tour-container .carousel-assets .carousel-control {
top: inherit;
bottom: 175px;
}
.image-tour-container .carousel-assets .carousel-indicators {
bottom: 150px;
}
.image-tour-container .carousel-assets .tour-links {
top: inherit;
bottom: 220px;
}
.image-tour-container .carousel-assets .try-it-now {
top: inherit;
bottom: 180px;
}
}
/* IMAGE TOUR MODAL */
.image-tour .tour-modal {
width: 960px;
margin-left: -480px;
height: 716px;
background: #3C444D;
z-index: 1061;
}
.image-tour .tour-modal.fade.in {
top: 15px;
}
.modal-backdrop.tour-backdrop.fade {
background: #3C444D;
z-index: 1060;
}
.modal-backdrop.tour-backdrop.fade.in {
opacity: 1;
background: #3C444D;
}
.shared-tour-producttours.modal, .shared-tour-imagetour.modal, .shard-interactivetour.modal {
background-clip: border-box;
}
.shared-tour-producttours.modal .modal-header, .shared-tour-imagetour.modal .modal-header, .shard-interactivetour.modal .modal-header {
padding-bottom: 10px;
}
.shared-tour-producttours.modal .modal-body, .shared-tour-imagetour.modal .modal-body, .shard-interactivetour.modal .modal-body {
padding: 0 10px 10px;
border-top: 0;
}
.shared-tour-producttours.modal .modal-body:last-child, .shared-tour-imagetour.modal .modal-body:last-child, .shard-interactivetour.modal .modal-body:last-child {
max-height: none;
}
/* INTERACTIVE TOUR */
.introjs-overlay {
position: absolute;
z-index: 999999;
background-color: #000000;
opacity: 0;
background: radial-gradient(center,ellipse cover,rgba(0, 0, 0, 0.4) 0,rgba(0, 0, 0, 0.9) 100%);
}
.introjs-fixParent {
z-index: auto !important;
opacity: 1.0 !important;
position: absolute !important;
-webkit-transform: none !important;
transform: none !important;
display: block !important;
}
.introjs-showElement,
tr.introjs-showElement > td,
tr.introjs-showElement > th {
z-index: 9999999 !important;
}
.introjs-disableInteraction {
z-index: 99999999 !important;
position: absolute;
}
a.introjs-showElement {
display: inline-block !important;
}
.introjs-relativePosition,
tr.introjs-showElement > td,
tr.introjs-showElement > th {
position: relative;
}
.introjs-helperLayer {
position: absolute;
z-index: 9999998;
background-color: rgba(255, 255, 255, 0.9);
border: 1px solid rgba(0, 0, 0, 0.5);
border-radius: 4px;
-webkit-box-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
}
.introjs-tooltipReferenceLayer {
position: absolute;
z-index: 10000000;
background-color: transparent;
}
.introjs-helperLayer *,
.introjs-helperLayer *:before,
.introjs-helperLayer *:after {
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.introjs-helperNumberLayer {
position: absolute;
top: -16px;
left: -16px;
z-index: 9999999999 !important;
padding: 2px;
font-size: 13px;
font-weight: bold;
color: white;
text-align: center;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
background: -webkit-gradient(linear, left top, left bottom, from(#DC4E41), to(#5C6773));
background: linear-gradient(to bottom, #DC4E41 0%, #5C6773 100%);
width: 20px;
height:20px;
line-height: 20px;
border: 3px solid white;
border-radius: 50%;
-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
}
.introjs-arrow {
border: 8px solid rgba(60, 68, 77, 0.9);
content:'';
position: absolute;
}
.introjs-arrow.top {
top: -15px;
border-top-color:transparent;
border-right-color:transparent;
border-bottom-color: rgba(60, 68, 77, 0.9);
border-left-color:transparent;
}
.introjs-arrow.top-right {
top: -15px;
right: 10px;
border-top-color:transparent;
border-right-color:transparent;
border-bottom-color: rgba(60, 68, 77, 0.9);
border-left-color:transparent;
}
.introjs-arrow.top-middle {
top: -15px;
left: 50%;
margin-left: -5px;
border-top-color:transparent;
border-right-color:transparent;
border-bottom-color: rgba(60, 68, 77, 0.9);
border-left-color:transparent;
}
.introjs-arrow.right {
right: -15px;
top: 15px;
border-top-color:transparent;
border-right-color:transparent;
border-bottom-color:transparent;
border-left-color: rgba(60, 68, 77, 0.9);
}
.introjs-arrow.right-bottom {
bottom:10px;
right: -15px;
border-top-color:transparent;
border-right-color:transparent;
border-bottom-color:transparent;
border-left-color: rgba(60, 68, 77, 0.9);
}
.introjs-arrow.bottom {
bottom: -15px;
border-top-color: rgba(60, 68, 77, 0.9);
border-right-color:transparent;
border-bottom-color:transparent;
border-left-color:transparent;
}
.introjs-arrow.left {
left: -15px;
top: 10px;
border-top-color:transparent;
border-right-color: rgba(60, 68, 77, 0.9);
border-bottom-color:transparent;
border-left-color:transparent;
}
.introjs-arrow.left-bottom {
left: -15px;
bottom:10px;
border-top-color:transparent;
border-right-color: rgba(60, 68, 77, 0.9);
border-bottom-color:transparent;
border-left-color:transparent;
}
.introjs-tooltip {
position: absolute;
padding: 40px 60px 10px;
text-align: center;
color: #FFFFFF;
background-color: rgba(60, 68, 77, 0.9);
min-width: 400px;
max-width: 500px;
border-radius: 0;
-webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}
.introjs-tooltiptext a {
color: #FFFFFF;
text-decoration: underline;
}
.introjs-tooltipbuttons {
text-align: right;
white-space: nowrap;
}
.introjs-button {
overflow: visible;
padding: 5px;
margin: 0;
color: #5CC05C;
fill: #5CC05C;
text-decoration: none;
font-size: 25px;
cursor: pointer;
outline: none;
position: absolute;
top: 50%;
-webkit-transform: translate(0, -45%);
transform: translate(0, -45%);
}
.introjs-button:hover polygon{
fill: rgb(130, 206, 130);
}
.introjs-button.introjs-disabled {
display: none;
}
.introjs-button:focus {
-webkit-box-shadow: none;
box-shadow: none;
background: none;
}
.introjs-tooltiplinks {
position: absolute;
top: 10px;
right: 5px;
}
.introjs-skipbutton,
.introjs-nexttourbutton {
font-size: 12px;
color: #FFFFFF;
position: relative;
}
.introjs-skipbutton:hover, .introjs-nexttourbutton:hover {
color: #FFFFFF;
}
.introjs-skipbutton:focus, .introjs-nexttourbutton:focus {
color: #FFFFFF;
}
.introjs-skipbutton.done {
color: #5CC05C;
}
.introjs-prevbutton {
left: 10px;
}
.introjs-nextbutton {
right: 10px;
}
.introjs-disabled,
.introjs-disabled:hover,
.introjs-disabled:focus {
color: #818D99;
-webkit-box-shadow: none;
box-shadow: none;
cursor: default;
background-image: none;
text-decoration: none;
}
.introjs-bullets {
text-align: center;
padding-top: 30px;
}
.introjs-bullets ul {
clear: both;
margin: 15px auto 0;
padding: 0;
display: inline-block;
}
.introjs-bullets ul li {
list-style: none;
float: left;
margin: 0 5px;
}
.introjs-bullets ul li a {
display: block;
width: 6px;
height: 6px;
background: #C3CBD4;
border-radius: 10px;
text-decoration: none;
}
.introjs-bullets ul li a.active {
background: #5CC05C;
}
.introjs-progress {
overflow: hidden;
height: 10px;
margin: 10px 0 5px 0;
border-radius: 4px;
background-color: #E1E6EB;
}
.introjs-progressbar {
float: left;
width: 0%;
height: 100%;
font-size: 10px;
line-height: 10px;
text-align: center;
background-color: #006D9C;
}
.introjsFloatingElement {
position: absolute;
height: 0;
width: 0;
left: 50%;
top: 50%;
}
.introjs-tooltiptext {
font-size: 16px;
line-height: 24px;
}
/* tour links in product tours modal */
.tours-links {
text-align: center;
margin: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.tours-links li {
position: relative;
list-style: none;
margin-bottom: 20px;
display: inline-block;
text-align: center;
}
.tours-links .mask {
position:absolute;
top:0;
bottom:0;
left: 0;
right: 0;
opacity:0;
border-radius: 3px;
cursor: pointer;
background-color: #5CC05C;
-webkit-transition: opacity 0.15s linear;
transition: opacity 0.15s linear;
}
.tours-links .mask:hover {
opacity:0.1;
}
.tours-links .svg-wrapper {
height: 84px;
padding: 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.tours-links .svg-wrapper svg {
width: 84px;
fill: #5CC05C;
}
.tour-link {
position: relative;
padding: 10px;
margin: 10px;
display: inline-block;
color: #3C444D !important;
font-weight: 500;
-webkit-box-flex: 1;
-ms-flex: 1 1 0px;
flex: 1 1 0;
max-width: 25%;
-webkit-transition: opacity 0.125s, background 0.05s;
transition: opacity 0.125s, background 0.05s;
}
.tour-link:hover {
background: rgba(195, 203, 212, 0.1);
text-decoration: none;
}
.tour-link:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.tour-link:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.tour-link i {
height: 84px;
padding: 32px 40px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-size: 76px;
line-height: 60px;
color: #5CC05C;
}
/* Components: common */
/*===============================================================================================*/
/* SPLUNK: ICONS */
/* Override bootstrap glyph icons and replace with custom font icons loosely based on */
/* [FontAwesome](http://fortawesome.github.com/Font-Awesome/) see splunk */
/* [styleguide](http://localhost:8000/static/style-guide.html) for more details */
/*===============================================================================================*/
/*----------------------------------------------*/
/* Make Icon Class: */
/* .icon-[icon name] */
/* @params: */
/* Icon Name */
/* Content */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Make Icon Class + Font Smoothing */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Make Icon Class + Margin Right */
/*----------------------------------------------*/
/*----------------------------------------------*/
/* Make Icon Class + Font Family Inherit */
/*----------------------------------------------*/
/*************************************************************************************************/
/* ICON FONT FACE */
/*************************************************************************************************/
[class^="icon-"]:before,
[class*=" icon-"]:before {
font-family: "Splunk Icons";
font-style: normal;
font-weight: normal;
text-decoration: inherit;
line-height: inherit;
}
a [class^="icon-"],
a [class*=" icon-"] {
display: inline-block;
text-decoration: none;
line-height: inherit;
}
/* makes the font 33% larger relative to the icon container */
.icon-large {
font-size: 1.3333333333333333em;
vertical-align: middle;
}
/*************************************************************************************************/
/* UTILS & HELPERS */
/*************************************************************************************************/
/* utility for setting font-family */
/* TODO: is this used? or needed? */
.font-icon {
font-family: "Splunk Icons";
font-size: inherit;
line-height: inherit;
}
.icon-no-underline:first-child {
padding-right: 0.3em;
}
.icon-no-underline:last-child {
padding-left: 0.3em;
}
.icon-no-underline:first-child:last-child {
padding-right: 0;
padding-left: 0;
}
.icon-no-underline:before {
text-decoration: none;
}
.padded-icon {
margin-right: 0.5em;
}
/*image replace helper*/
.ir {
position: relative;
display: inline-block;
min-width: 0.5em;
text-indent: -9999px;
outline:none;
}
/* vertical-align:middle; */
.ir:before {
position: absolute;
top: 0;
left: 0; /* Firefox needs to be explicit here */
text-indent: 0;
}
/*************************************************************************************************/
/* FONT ICONS */
/* When possible we should use the Unicode Private Use Area (PUA) to ensure screen readers do */
/* not read off random characters that represent icons. */
/* convert this ... */
/* .icon-share:before { */
/* content: "\EC83 "; */
/* } */
/* into this */
/* */
/* Search: */
/* \.(icon-[^:]+).* */
/* Replace: */
/* */
/*************************************************************************************************/
/* example
Check -
Check
*/
/* Splunk logo */
.icon-splunk:before {
content: "splunk";
}
.icon-greater:before {
content: ">";
}
.icon-hunk:before {
content: "\F000";
}
.icon-enterprise:before {
content: "\F001";
}
.icon-cloud-logo:before {
content: "\F002";
}
.icon-splunk-light:before {
content: "\F003";
}
/* Shapes */
.icon-circle:before {
content: "\ECD0";
}
.icon-circle-filled:before {
content: "\25CF";
}
.icon-box-filled:before {
content: "\25A0";
}
.icon-triangle-up-small:before {
content: "\25B4";
}
.icon-triangle-right:before {
content: "\25B6";
}
.icon-triangle-right-small:before {
content: "\25B8";
}
.icon-triangle-down:before {
content: "\25BC";
}
.icon-triangle-down-small:before {
content: "\25BE";
}
.icon-triangle-left:before {
content: "\25C0";
}
.icon-triangle-left-small:before {
content: "\25C2";
}
/* Arrows & Pointers */
.icon-arrow-up:before {
content: "\EC01";
}
.icon-arrow-right:before {
content: "\27A1";
}
.icon-arrow-down:before {
content: "\EC02";
}
.icon-arrow-left:before {
content: "\EC00";
}
.icon-two-arrows-cycle:before {
content: "\EC12";
}
.icon-external:before {
content: "\EC13";
}
.icon-rotate-counter:before {
content: "\21BA";
}
.icon-rotate:before {
content: "\21BB";
}
.icon-location:before {
content: "\EC80";
}
.icon-chevron-left:before {
content: "\2039";
}
.icon-chevron-right:before {
content: "\203A";
}
.icon-chevron-up:before {
content: "\2C4";
}
.icon-chevron-down:before {
content: "\2C5";
}
/* Actions */
.icon-trash:before {
content: "\EC66";
}
.icon-share:before {
content: "\27A6";
}
.icon-export:before {
content: "\EC68";
}
.icon-print:before {
content: "\EC89";
}
.icon-search:before {
content: "\EC9B";
}
.icon-search-thin:before {
content: "\ECC2";
}
.icon-pivot:before {
content: "\EC12";
}
.icon-clone:before {
content: "\ECE8";
}
.icon-pause:before {
content: "\EC50";
}
.icon-stop:before {
content: "\25A0";
}
.icon-play:before {
content: "\25B6";
}
.icon-sort:before {
content: "\2195";
}
.icon-sorted-up:before {
content: "\21A5";
}
.icon-sorted-down:before {
content: "\21A7";
}
.icon-minus:before {
content: "\2212";
}
.icon-minus-circle:before {
content: "\2296";
margin-right: 0.25em
}
.icon-plus:before {
content: "+";
}
.icon-plus-circle:before {
content: "\2295";
}
.icon-x:before {
content: "\2717";
}
.icon-x-circle:before {
content: "\2297";
}
.icon-close:before {
content: "\2717";
}
.icon-cancel:before {
content: "\2717";
}
.icon-collapse-left:before {
content: "\ECE0";
}
.icon-expand-right:before {
content: "\ECE1";
}
/* Concepts */
.icon-activity:before {
content: "\ECAE";
}
.icon-string:before {
content: "a";
}
.icon-number:before {
content: "#";
}
.icon-text:before {
content: "\ECD9";
}
.icon-not-allowed:before {
content: "\EC9E";
}
.icon-data:before {
content: "\ECA4";
}
.icon-data-input:before {
content: "\ECA3";
}
.icon-settings:before {
content: "\ECA5";
}
.icon-distributed-environment:before {
content: "\ECA6";
}
.icon-visible:before {
content: "\ECC0";
}
.icon-hidden:before {
content: "\ECC1";
}
.icon-boolean:before {
content: "\ECD2";
}
.icon-menu:before {
content: "\EC56";
}
.icon-rows:before {
content: "\EC56";
}
.icon-tiles:before {
content: "\ECF0";
}
.icon-metric:before {
content: "\ECF5";
}
.icon-event:before {
content: "\ECF6";
}
.icon-rollup:before {
content: "\ECF8";
}
/* Misc */
.icon-info:before {
content: "i";
}
.icon-info-circle:before {
content: "I";
}
.icon-question:before {
content: "?";
font-family: inherit
}
.icon-question-circle:before {
content: "\EC9D";
}
.icon-box-unchecked:before {
content: "\2610";
}
.icon-box-checked:before {
content: "\2611";
}
.icon-check-circle:before {
content: "\ECD3";
}
.icon-alert-circle:before {
content: "\ECD4";
}
.icon-code:before {
content: "\ECD7";
}
.icon-code-thin:before {
content: "\ECD6";
}
.icon-alert:before {
content: "\26A0";
}
.icon-error:before {
content: "\ECE2";
}
.icon-warning:before {
content: "\26A0";
}
.icon-fullscreen:before {
content: "\ECF3";
}
/* Objects */
.icon-bell:before {
content: "\EC9C";
}
.icon-bookmark:before {
content: "\ECA1";
}
.icon-bulb:before {
content: "\EC98";
}
.icon-calendar:before {
content: "\EC9A";
}
.icon-check:before {
content: "\2713";
}
.icon-clock:before {
content: "\231A";
}
.icon-cloud:before {
content: "\2601";
}
.icon-flag:before {
content: "\2691";
}
.icon-gear:before {
content: "\2699";
}
.icon-lightning:before {
content: "\2301";
}
.icon-link:before {
content: "\ECF1";
}
.icon-lock:before {
content: "\EC9F";
}
.icon-lock-unlocked:before {
content: "\ECA0";
}
.icon-mail:before {
content: "\2709";
}
.icon-pencil:before {
content: "\270F";
}
.icon-speech-bubble:before {
content: "\EC99";
}
.icon-star:before {
content: "\2605";
}
.icon-user:before {
content: "\EC84";
}
.icon-clipboard:before {
content: "\ECD5";
}
.icon-paintbrush:before {
content: "\ECCA";
}
.icon-warning-sign:before {
content: "\26A0";
}
/* Results and Visualizations */
.icon-chart-area:before {
content: "\ECA9";
}
.icon-chart-bar:before {
content: "\ECAA";
}
.icon-chart-column:before {
content: "\ECAB";
}
.icon-chart-pie:before {
content: "\ECAC";
}
.icon-chart-scatter:before {
content: "\ECAD";
}
.icon-chart-bubble:before {
content: "\ECB8";
}
.icon-chart-line:before {
content: "\ECAE";
}
.icon-single-value:before {
content: "\ECAF";
}
.icon-gauge-radial:before {
content: "\ECA2";
}
.icon-gauge-marker:before {
content: "\ECB0";
}
.icon-gauge-filler:before {
content: "\ECB1";
}
.icon-choropleth-map:before {
content: "\ECB9";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-external-viz:before {
content: "\ECF2";
}
.icon-label-rotation--90:before {
content: "\ECE3";
}
.icon-label-rotation--45:before {
content: "\ECE4";
}
.icon-label-rotation-0:before {
content: "\ECE5";
}
.icon-label-rotation-45:before {
content: "\ECE6";
}
.icon-label-rotation-90:before {
content: "\ECE7";
}
.icon-trellis-layout:before {
content: "\F004";
}
.icon-chart-area-plus-table:before {
content: "\ECA9 + \ECA8";
}
.icon-chart-bar-plus-table:before {
content: "\ECAA + \ECA8";
}
.icon-chart-column-plus-table:before {
content: "\ECAB + \ECA8";
}
.icon-chart-pie-plus-table:before {
content: "\ECAC + \ECA8";
}
.icon-chart-scatter-plus-table:before {
content: "\ECAD + \ECA8";
}
.icon-chart-bubble-plus-table:before {
content: "\ECB8 + \ECA8";
}
.icon-chart-line-plus-table:before {
content: "\ECAE + \ECA8";
}
.icon-single-value-plus-table:before {
content: "\ECAF + \ECA8";
}
.icon-gauge-radial-plus-table:before {
content: "\ECA2 + \ECA8";
}
.icon-gauge-marker-plus-table:before {
content: "\ECB0 + \ECA8";
}
.icon-gauge-filler-plus-table:before {
content: "\ECB1 + \ECA8";
}
.icon-location-plus-table:before {
content: "\EC80 + \ECA8";
}
.icon-choropleth-map-plus-table:before {
content: "\ECB9 + \ECA8";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-external-viz-plus-table:before {
content: "\ECF2 + \ECA8";
}
/* Formatting */
.icon-list:before {
content: "\ECA7";
}
.icon-table:before {
content: "\ECA8";
}
.icon-bar-beside:before {
content: "\ECB2";
}
.icon-bar-stacked:before {
content: "\ECB3";
}
.icon-bar-stacked-100:before {
content: "\ECB4";
}
.icon-missing-value-skipped:before {
content: "\ECB5";
}
.icon-missing-value-zero:before {
content: "\ECB6";
}
.icon-missing-value-join:before {
content: "\ECB7";
}
/* Documents */
.icon-folder:before {
content: "\ECE9";
}
.icon-document:before {
content: "\ECC3";
}
.icon-report:before {
content: "\ECC3";
}
.icon-report-search:before {
content: "\ECC4";
}
.icon-report-pivot:before {
content: "\ECC5";
}
.icon-dashboard:before {
content: "\ECC6";
}
.icon-panel:before {
content: "\ECC7";
}
.icon-panel-search:before {
content: "\ECC8";
}
.icon-panel-pivot:before {
content: "\ECC9";
}
/*===============================================================================================*/
/* SPLUNK: POPDOWN */
/*===============================================================================================*/
/* TODO: review how this works with dropdown */
/* popdown for variable content
*/
/* Popdown wrapper */
.popdown {
position: relative
}
/* popdown container */
.popdown-dialog {
background-color: #31373E;
border: 1px solid #000000;
-webkit-box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.5);
border-radius: 2px;
top: 100%;
left: 50%;
margin: 8px 0 0 -103px;
display: none;
position: absolute;
z-index: 1059;
white-space: normal;
}
/* placement of arrow */
.popdown-dialog .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-top: 0;
border-bottom-color: #000000;
top: -8px;
left: 50%;
margin-left: -4px;
}
/* generated arrow */
.popdown-dialog .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-top: 0;
border-bottom-color: #31373E;
top: 1px;
left: -8px;
}
/* prevent inheriting nowrap from btn-group */
.popdown-dialog.up {
margin-top: 0;
}
/* placement of arrow */
.popdown-dialog.up > .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-bottom: 0;
border-top-color: #000000;
top: auto;
bottom: -8px;
}
.popdown-dialog.up > .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-bottom: 0;
border-top-color: #31373E;
top: auto;
bottom: 1px;
}
.popdown-dialog.right { /* point left */
margin-left: 5px;
margin-top: 0;
}
/* placement of arrow */
.popdown-dialog.right .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-left: 0;
border-right-color: #000000;
top: 50%;
left: -8px;
margin: -8px 0 0 0;
}
.popdown-dialog.right .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-left: 0;
border-right-color: #31373E;
top: 50%;
left: 1px;
margin: -8px 0 0 0;
}
/* position of arrow when floated right */
.popdown-dialog.pull-right .arrow {
left: auto;
right: 8px;
}
/* open state */
.popdown-dialog.open {
display: block;
}
/* SPL-68751 - IE10 box shadow animation artifacts fix */
.popdown-dialog:after
{
content: "";
font-size: 0;
display: inline;
overflow: hidden;
}
/* popdown body */
.popdown-dialog-body {
margin: 0;
border-radius: 1px;
background-color: #31373E;
}
.popdown-dialog-body:before,
.popdown-dialog-body:after {
display: table;
content: "";
line-height: 0;
}
.popdown-dialog-body:after {
clear: both;
}
/* popdown body */
.popdown-dialog-footer {
border-top: 1px solid #171D21;
padding: 5px;
border-bottom-left-radius: 1px;
border-bottom-right-radius: 1px;
}
.popdown-dialog-footer:before,
.popdown-dialog-footer:after {
display: table;
content: "";
line-height: 0;
}
.popdown-dialog-footer:after {
clear: both;
}
/* variations */
/* ------------ */
/* extends popdown-dialog, adds extra padding
*/
.popdown-dialog-padded {
padding: 10px;
}
/*===============================================================================================*/
/* SPLUNK: DROP DOWN ARROW/CARET */
/*===============================================================================================*/
.dropup,
.dropdown {
position: relative;
}
.dropdown-toggle:active,
.open .dropdown-toggle {
outline: 0;
}
/*************************************************************************************************/
/* CARET / ARROW */
/* Icon for caret. */
/*************************************************************************************************/
/*
*/
.caret {
display: inline-block;
content: "";
border: none;
width: auto;
height: auto;
line-height: 20px;
font-size: inherit;
margin: 0;
padding-left: 0.3em;
text-decoration: none;
vertical-align: baseline;
font-family: "Splunk Icons";
font-weight: normal;
}
/* generated font icon */
.caret:before {
content: "\25BE";
font-size: inherit;
text-decoration: none;
}
.icon-no-underline + .caret {
padding-left: 0;
}
.caret-char {
font-weight: normal;
font-family: "Splunk Icons";
font-weight: normal;
}
.caret-char:before {
content: "\25BE";
}
/*************************************************************************************************/
/* DROPDOWNS */
/*************************************************************************************************/
.dropdown-menu {
float: left;
min-width: 160px;
list-style: none;
word-wrap: break-word;
width: 20em;
line-height: 1.33333em;
padding: 0;
background-clip: padding-box;
}
.open > .dropdown-menu {
display: block;
}
.dropdown-menu {
background-color: #31373E;
border: 1px solid #000000;
-webkit-box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.5);
border-radius: 2px;
top: 100%;
left: 50%;
margin: 8px 0 0 -103px;
display: none;
position: absolute;
z-index: 1059;
white-space: normal;
}
/* placement of arrow */
.dropdown-menu .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-top: 0;
border-bottom-color: #000000;
top: -8px;
left: 50%;
margin-left: -4px;
}
/* generated arrow */
.dropdown-menu .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-top: 0;
border-bottom-color: #31373E;
top: 1px;
left: -8px;
}
/* prevent inheriting nowrap from btn-group */
.dropdown-menu.up {
margin-top: 0;
}
/* placement of arrow */
.dropdown-menu.up > .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-bottom: 0;
border-top-color: #000000;
top: auto;
bottom: -8px;
}
.dropdown-menu.up > .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-bottom: 0;
border-top-color: #31373E;
top: auto;
bottom: 1px;
}
.dropdown-menu.right { /* point left */
margin-left: 5px;
margin-top: 0;
}
/* placement of arrow */
.dropdown-menu.right .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-left: 0;
border-right-color: #000000;
top: 50%;
left: -8px;
margin: -8px 0 0 0;
}
.dropdown-menu.right .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-left: 0;
border-right-color: #31373E;
top: 50%;
left: 1px;
margin: -8px 0 0 0;
}
/* position of arrow when floated right */
.dropdown-menu.pull-right .arrow {
left: auto;
right: 8px;
}
/* open state */
.dropdown-menu.open {
display: block;
}
/* Dividers (basically an hr) within the dropdown */
.dropdown-menu .divider {
height: 1px;
margin: 9px 1px;
/* 8px 1px */
overflow: hidden;
background-color: #171D21;
}
/* link info style */
.dropdown-menu .info, .dropdown-menu .title {
color: #6b7785;
}
.dropdown-menu ul li.info:not(:first-child) {
border-top: 1px solid #171D21;
}
/* menu lists */
.dropdown-menu ul {
list-style: none;
margin: 0;
border-radius: 1px;
background-color: #31373E; /* FIXME: this should be separate from popdown */
/* in rare cases that long strings increase the container size, this will minimize the issues */
}
.dropdown-menu ul:before,
.dropdown-menu ul:after {
display: table;
content: "";
line-height: 0;
}
.dropdown-menu ul:after {
clear: both;
}
.dropdown-menu ul {
overflow-x: hidden;
overflow-y: auto;
max-width: 100%;
max-height: 270px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius:0;
}
/* give spacing to double lists */
.dropdown-menu ul + ul {
margin-top: -1px;
}
.dropdown-menu ul + ul li:first-child > a, .dropdown-menu ul + ul li.title:first-child {
border-top: 1px solid #171D21;
}
/* rounding for first and last items */
.dropdown-menu .arrow + ul, .dropdown-menu .arrow + ul > li:first-child > a {
border-top-left-radius: 1px;
border-top-right-radius: 1px;
border-top: none;
}
.dropdown-menu ul:last-of-type, .dropdown-menu ul:last-of-type > li:last-of-type > a {
border-bottom-left-radius: 1px;
border-bottom-right-radius: 1px;
}
/* for selectable lists */
.dropdown-menu a .icon-check {
position: absolute;
left: 5px;
top: 5px;
color: #00A4FD;
}
.dropdown-menu [class^="icon-"], .dropdown-menu [class*=" icon-"] {
width: 1.25em;
text-align: center;
}
.dropdown-menu li {
position: relative;
}
.dropdown-menu li.info {
padding: 5px 10px;
}
.dropdown-menu li.title {
text-transform: uppercase;
padding: 3px 10px;
}
.dropdown-menu li.message {
padding: 5px 10px;
}
.dropdown-menu li > span.field-value {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
word-wrap: normal;
}
/* link style */
.dropdown-menu li > a {
display: block;
clear: both;
font-weight: normal;
line-height: 20px;
position: relative;
color: #FFFFFF;
padding: 5px 10px;
white-space: normal;
text-decoration: none;
}
.dropdown-menu li > a > .info {
display: block;
font-size: 12px;
}
/* focus state */
.dropdown-menu li > a:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.dropdown-menu li > a:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.dropdown-menu li > a:focus {
-webkit-box-shadow: inset 0 0 2px 1px #31373E, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #31373E, inset 0 0 0 2px #00A4FD;
}
/* hover state */
.dropdown-menu li > a:hover {
color: #FFFFFF;
background: #212527;
}
/* items with secondary action icons */
.dropdown-menu li > a.primary-link {
margin-right: 40px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.dropdown-menu li > a.secondary-link {
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 40px;
padding-left:0;
padding-right: 0;
font-size: 16px;
text-align: center;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.dropdown-menu li > a > .link-description {
color: #6b7785;
display: block;
font-size: 0.85em;
}
/* disabled state */
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus,
.dropdown-menu li > a.disabled,
.dropdown-menu li > a.disabled:hover,
.dropdown-menu li > a.disabled:focus {
color: #5C6773;
cursor: not-allowed;
text-decoration: none;
background-color: transparent;
background-image: none; /* Remove CSS gradient */
-webkit-box-shadow: none;
box-shadow: none;
}
/* divider style */
.dropdown-menu .divider {
margin: 0;
border: none;
border-top: 1px solid #171D21;
margin-top: 0;
height: 0;
}
/* remove top border when there is already a divider */
.dropdown-menu .divider + li > a {
border-top: none;
}
/* select menus with find */
.dropdown-menu .input-container .shared-findinput {
width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 5px;
margin:0;
}
.dropdown-menu .input-container .search-query {
width: 100%;
}
/* truncated dropdown text */
.dropdown-truncated li > a {
/* wrapping */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/*************************************************************************************************/
/* DROPDOWN SIZES */
/*************************************************************************************************/
.dropdown-menu-narrow {
width: 10em;
}
.dropdown-menu-medium {
width: 25em;
}
.dropdown-menu-wide {
width: 30em;
}
.dropdown-menu-width-auto {
width: auto;
max-width: 20em;
}
.dropdown-menu-width-auto.dropdown-menu-narrow {
max-width: 10em;
}
.dropdown-menu-width-auto.dropdown-menu-medium {
max-width: 25em;
}
.dropdown-menu-width-auto.dropdown-menu-wide {
max-width: 30em;
}
/*************************************************************************************************/
/* SELECTABLE DROPDOWN */
/*************************************************************************************************/
.dropdown-menu-selectable li > a { /* BS 2.2 scoped */
padding-left: 24px;
}
/*************************************************************************************************/
/* BOOTSTRAP OVERRIDE */
/*************************************************************************************************/
.navbar .nav > li > .dropdown-menu:before, .navbar .nav > li > .dropdown-menu:after {
display: none;
}
.dropdown-header {
display: block;
padding: 3px 20px;
font-size: 12px;
line-height: 1.42857143;
color: #6b7785;
}
/*************************************************************************************************/
/* FIXED HEIGHT DROPDOWNS & POPDOWNS */
/*************************************************************************************************/
.dropdown-menu-tall ul {
max-height: 20em;
overflow: auto;
}
.dropdown-menu-short ul {
max-height: 10em;
overflow: auto;
}
/* disable scrolling */
.dropdown-menu-noscroll ul {
max-height: none;
}
/* Allow for dropdowns to go bottom up (aka, dropup-menu) */
/* ------------------------------------------------------ */
/* Just add .dropup after the standard .dropdown class and you're set, bro. */
/* TODO: abstract this so that the navbar fixed styles are not placed here? */
/* Reverse the caret */
.dropup .caret, .navbar-fixed-bottom .dropdown .caret {
border-top: 0;
border-bottom: 4px solid #000000;
content: "";
}
/* Different positioning for bottom up menu */
.dropup .dropdown-menu, .navbar-fixed-bottom .dropdown .dropdown-menu {
top: auto;
bottom: 100%;
margin-bottom: 1px;
}
/*************************************************************************************************/
/* SUBMENUS */
/*************************************************************************************************/
.dropdown-submenu {
position: relative;
}
/* Default dropdowns */
.dropdown-submenu > .dropdown-menu {
top: 0;
left: 100%;
margin-top: -6px;
margin-left: -1px;
border-radius: 2px 2px 2px 2px;
}
.dropdown-submenu:hover > .dropdown-menu {
display: block;
}
/* hover state of dropdown submenu */
.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a {
text-decoration: none;
color: #006EAA;
background: #3C444D;
}
.dropdown-submenu > a {
paddin-right: 20px;
}
/* Caret to indicate there is a submenu */
.dropdown-submenu > a:after {
display: block;
content: "";
position: absolute;
right: 8px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 5px 0 5px 5px;
border-left-color: rgb(204, 204, 204);
}
.dropdown-submenu > ul {
overflow-x: hidden;
overflow-y: auto;
}
/* Left aligned submenus */
.dropdown-submenu.pull-left {
/* Undo the float */
/* Yes, this is awkward since .pull-left adds a float, but it sticks to our conventions elsewhere. */
float: none;
}
/* Positioning the submenu */
.dropdown-submenu.pull-left > .dropdown-menu {
left: -100%;
margin-left: 10px;
border-radius: 6px 0 6px 6px;
}
/*************************************************************************************************/
/* DROPUPS */
/*************************************************************************************************/
.dropup .dropdown-submenu > .dropdown-menu {
top: auto;
bottom: 0;
margin-top: 0;
margin-bottom: -2px;
border-radius: 5px 5px 5px 0;
}
/*************************************************************************************************/
/* TWEAK NAV HEADERS */
/*************************************************************************************************/
/* Increase padding from 15px to 20px on sides */
.dropdown .dropdown-menu .nav-header {
padding-left: 20px;
padding-right: 20px;
}
/*************************************************************************************************/
/* TYPEAHEAD */
/*************************************************************************************************/
.typeahead {
z-index: 1051;
margin-top: 2px; /* give it some space to breathe */
border-radius: 3px;
}
/*===============================================================================================*/
/* SPLUNK: COMPONENT ANIMATIONS */
/*===============================================================================================*/
.fade {
opacity: 0;
-webkit-transition: opacity 0.125s;
transition: opacity 0.125s;
}
.fade.in {
opacity: 1;
}
.collapse {
position: relative;
height: 0;
overflow: hidden;
-webkit-transition: height 0.2s ease;
transition: height 0.2s ease;
}
.collapse.in {
height: auto;
}
/*===============================================================================================*/
/* SPLUNK: CLOSE ICONS */
/*===============================================================================================*/
.close {
float: right;
border-radius: 3px;
width: 27px;
height: 27px;
/* hide any placeholder text */
color: transparent;
font-size: 0;
line-height: 0;
text-align: center;
-webkit-transition: background 0.2s, color 0.2s;
transition: background 0.2s, color 0.2s;
/* Additional properties for button version */
/* iOS requires the button element instead of an anchor tag. */
}
.close:before {
font-family: "Splunk Icons";
content: '\2717';
font-size: 20px;
color: #FFFFFF;
line-height: 28px;
-webkit-transition: color 0.2s;
transition: color 0.2s;
}
.close:hover {
background-color: #3C444D;
cursor: pointer;
text-decoration: none;
}
.close:hover:before {
color: #FFFFFF;
}
.close:focus {
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.close:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.close:focus:before {
color: #FFFFFF;
}
/* If you want the anchor version, it requires `href="#"`. */
button.close {
padding: 0;
cursor: pointer;
background: transparent;
border: 0;
-webkit-appearance: none;
}
/* Components: Buttons & Alerts */
/*===============================================================================================*/
/* SPLUNK: BUTTONS */
/*===============================================================================================*/
/*************************************************************************************************/
/* Base Styles & Overrides */
/* Standard button class for use on a, button */
/*************************************************************************************************/
/*
Button
Button
Button
*/
.btn {
display: inline-block;
padding: 5px 14px;
height: auto;
line-height: 20px;
font-size: 14px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 5px 14px;
margin-bottom: 0; /* For input.btn */
font-weight: 400;
color: #5C6773;
text-align: center;
vertical-align: middle;
cursor: pointer;
border: 1px solid;
border-radius: 3px;
white-space: nowrap;
background-color: #5C6773;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
/* this breaks some bootstrap styles */
.btn:hover {
background-color: #3C444D;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn:focus {
background-color: #5C6773;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.btn:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn:active, .btn.active {
background-color: #2B3033;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: none;
transition: none;
-webkit-filter: none;
filter: none;
}
.btn.disabled,
.btn[disabled],
.btn.disabled:hover,
.btn[disabled]:hover,
.btn.disabled:focus,
.btn[disabled]:focus,
.btn.disabled:active,
.btn[disabled]:active {
background-color: #3C444D;
border-color: transparent;
color: #5C6773;
-webkit-box-shadow: inset 0px -1px 0 transparent;
box-shadow: inset 0px -1px 0 transparent;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
cursor: not-allowed;
}
/*************************************************************************************************/
/* PRIMARY BUTTONS */
/* Provides extra visual weight and identifies the primary action in a set of buttons. */
/*************************************************************************************************/
/*
Primary
Primary
Primary
*/
.btn-primary {
padding: 6px 15px;
font-weight: 500;
border: none;
background-color: #5CC05C;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn-primary:hover {
background-color: #40A540;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn-primary:focus {
background-color: #5CC05C;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.btn-primary:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-primary:active, .btn-primary.active {
background-color: #389038;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active {
background-color: #9ED99E;
border-color: transparent;
color: #DFF2DF;
-webkit-box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
box-shadow: inset 0px -2px 0 rgba(0, 0, 0, 0.1);
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
cursor: not-allowed;
}
.btn-secondary {
font-weight: 500;
}
.btn-secondary:hover {
background-color: #3C444D;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn-secondary:focus {
background-color: #5C6773;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.btn-secondary:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-secondary:active, .btn-secondary.active {
background-color: #2B3033;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: none;
transition: none;
-webkit-filter: none;
filter: none;
}
.btn-secondary.disabled,
.btn-secondary[disabled],
.btn-secondary.disabled:hover,
.btn-secondary[disabled]:hover,
.btn-secondary.disabled:focus,
.btn-secondary[disabled]:focus,
.btn-secondary.disabled:active,
.btn-secondary[disabled]:active {
background-color: #3C444D;
border-color: transparent;
color: #5C6773;
-webkit-box-shadow: inset 0px -1px 0 transparent;
box-shadow: inset 0px -1px 0 transparent;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
cursor: not-allowed;
}
/*************************************************************************************************/
/* Links */
/* Pager style button pill */
/* Note: this does not inherit or extend btn base styles and is meant for links only */
/*************************************************************************************************/
/*
Pill
Pill
Pill
Pill
*/
.btn-pill {
display: inline-block;
padding: 5px 14px; /* note the vertical padding will be funky unless it's block, inline-block, or floated */
line-height: 20px;
border-radius: 3px;
border: 1px solid transparent;
background-color: none;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn-pill:hover {
color: #FFFFFF;
background: #3C444D;
border-color: #171D21;
text-decoration: none;
}
.btn-pill:focus {
color: #FFFFFF;
background: none;
border-color: transparent;
text-decoration: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.btn-pill:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-pill:active, .btn-pill.active {
color: #FFFFFF;
background: #2B3033;
border-color: transparent;
text-decoration: none;
}
.btn-pill.disabled,
.btn-pill[disabled],
.btn-pill.disabled:hover,
.btn-pill[disabled]:hover,
.btn-pill.disabled:focus,
.btn-pill[disabled]:focus,
.btn-pill.disabled:active,
.btn-pill[disabled]:active {
color: #5C6773;
background: none;
border-color: transparent;
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
cursor: not-allowed;
}
/*************************************************************************************************/
/* LINK BUTTONS */
/* Make a button look and behave like a link. */
/*************************************************************************************************/
.btn-link {
background-color: transparent;
border-color: transparent;
color: #00A4FD;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.btn-link:hover {
color: #006EAA;
text-decoration: underline;
}
.btn-link:focus {
color: #00A4FD;
text-decoration: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.btn-link:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-link:active, .btn-link.active {
color: #00A4FD;
text-decoration: none;
}
.btn-link.disabled,
.btn-link[disabled],
.btn-link.disabled:hover,
.btn-link[disabled]:hover,
.btn-link.disabled:focus,
.btn-link[disabled]:focus,
.btn-link.disabled:active,
.btn-link[disabled]:active {
color: #6b7785;
text-decoration: none;
cursor: not-allowed;
}
/*************************************************************************************************/
/* BLOCK BUTTON */
/*************************************************************************************************/
.btn-block {
display: block;
width: 100%;
padding-left: 0;
padding-right: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* Vertically space out multiple block buttons */
.btn-block + .btn-block {
margin-top: 5px;
}
/* Specificity overrides */
input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block {
width: 100%;
}
/*************************************************************************************************/
/* DRAGGABLE BUTTON */
/*************************************************************************************************/
/*
Draggable
*/
.btn-draggable {
cursor: move;
width: 150px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* generated handle */
.btn-draggable:before, .btn-draggable .before {
content: "";
float: left;
margin-left: -8px;
height: 18px;
width: 6px;
background: url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20width%3D%224px%22%20height%3D%224px%22%20viewBox%3D%220%200%204%204%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Crect%20fill%3D%22%23818D99%22%20width%3D%222%22%20height%3D%222%22/%3E%0A%3C/svg%3E);
cursor: move;
}
/* sizes */
.btn-draggable.btn-small:before{
height: 14px;
}
.btn-draggable.btn-mini:before{
height: 12px;
}
/*************************************************************************************************/
/* BUTTON SIZES */
/*************************************************************************************************/
/* Large */
.btn-large {
padding: 8px 28px;
}
.btn-large [class^="icon-"],
.btn-large [class*=" icon-"] {
margin-top: 4px;
}
.btn-large.btn-primary {
padding: 9px 29px;
}
/* Small */
.btn-small {
padding: 3px 14px;
}
.btn-small [class^="icon-"],
.btn-small [class*=" icon-"] {
margin-top: 0px;
}
.btn-small.btn-primary {
padding: 4px 15px;
}
/* Mini */
.btn-mini {
padding: 0px 7px;
}
.btn-mini [class^="icon-"],
.btn-mini [class*=" icon-"] {
margin-top: -1px;
}
.btn-mini.btn-primary {
padding: 1px 8px;
}
.btn-mini,
.btn-group > .btn-mini {
font-size: 12px;
font-weight: 500;
line-height: 18px;
}
/* Square Button */
.btn-square {
padding: 6px 0;
height: 32px;
width: 32px;
text-align: center;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/*************************************************************************************************/
/* PRINT */
/*************************************************************************************************/
@media print {
.btn {
background: none !important;
border: none !important;
padding: 0 !important;
color: #FFFFFF !important;
text-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.caret {
display: none !important;
}
}
/*===============================================================================================*/
/* SPLUNK: BUTTON GROUPS */
/* BTN-GROUP handles rounding & spacing on btns & btn-combo. */
/* BTN-COMBO handles rounding on dropdowns & splits only, behaves like group but without */
/* grouping or spacing. */
/*===============================================================================================*/
/* button combos, grouping and toolbar
*/
/* Make the div behave like a button */
.btn-group,
.btn-combo {
position: relative;
display: inline-block;
font-size: 0; /* remove as part 1 of font-size inline-block hack */
white-space: nowrap; /* prevent buttons from wrapping when in tight spaces (e.g., the table on the tests page) */
vertical-align: middle; /* match .btn alignment given font-size hack above */
}
/* Space out series of button groups */
.btn-group + .btn-group,
.btn-combo + .btn-combo {
margin-left: 10px;
}
/* Float them, remove border radius, then re-add to first and last elements */
.btn-group > .btn,
.btn-group > .btn-combo > .btn {
position: relative;
border-radius: 0;
}
/* reset margin when in a group */
.btn-group > .btn + .btn,
.btn-group > .btn + .btn-combo,
.btn-group > .btn-combo + .btn-combo,
.btn-group > .btn-combo + .btn {
margin-left: -1px;
}
/* Redeclare as part 2 of font-size inline-block hack */
.btn-group > .btn,
.btn-group > .btn-large,
.btn-group > .btn-small,
.btn-group > .dropdown-menu,
.btn-group > .popover,
.btn-group .btn-pill,
.btn-group .popdown-dialog,
.btn-group .dropdown-toggle,
.btn-group ul {
font-size: 14px;
}
.btn-group > .btn-mini {
font-size: 12px; /* Reset font for mini size */
}
/* Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match */
.btn-group > .btn:first-child,
.btn-group > .btn-combo:first-child > .btn:first-child,
.btn-group > .btn-combo:first-child > .drodown-toggle,
.btn-group > .btn-combo:first-child > .btn:first-child {
margin-left: 0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
/* Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it */
.btn-group > .btn:last-child,
.btn-group > .dropdown-toggle,
.btn-group > .btn-combo:last-child > .btn:last-child,
.btn-group > .btn-combo:last-child > .dropdown-toggle {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
/* Reset corners for large buttons */
.btn-group > .btn.large:first-child,
.btn-group > .btn-combo:first-child > .btn.large:first-child {
margin-left: 0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.btn-group > .btn.large:last-child,
.btn-group > .large.dropdown-toggle,
.btn-group > .btn-combo:last-child > .btn.large:last-child,
.btn-group > .btn-combo:last-child > .large.dropdown-toggle {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
/* On hover/active, bring the proper btn to front */
.btn-group > .btn:hover,
.btn-group > .btn:active,
.btn-group > .btn.active,
.btn-group > .btn-combo > .btn:hover,
.btn-group > .btn-combo > .btn:active,
.btn-group > .btn-combo > .btn.active {
z-index: 2;
}
/* On focus, bring the btn to front */
.btn-group > .btn:focus,
.btn-group > .btn-combo > .btn:focus {
z-index: 3;
}
/* On active and open, don't show outline */
.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
outline: 0;
}
/*************************************************************************************************/
/* BUTTON COMBO */
/*************************************************************************************************/
/* special case for btn-combo */
.btn-combo > .btn:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.btn-combo > .btn:last-child,
.btn-combo > .dropdown-toggle {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
/* reset margin when in a group */
.btn-combo > .btn + .btn {
margin-left: -1px;
}
/* Redeclare as part 2 of font-size inline-block hack */
.btn-combo > .btn,
.btn-combo > .btn-large,
.btn-combo > .btn-small,
.btn-combo > .dropdown-menu,
.btn-combo .btn-pill,
.btn-combo .popdown-dialog,
.btn-combo .dropdown-toggle,
.btn-combo ul {
font-size: 14px;
}
.btn-combo > .btn-mini {
font-size: 12px; /* Reset font for mini size */
}
/* Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match */
.btn-combo:first-child > .btn:first-child {
margin-left: 0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
/* Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it */
.btn-combo > .dropdown-toggle {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
/*************************************************************************************************/
/* BUTTON TOOLBAR */
/* Optional: Group multiple button groups together for a toolbar. */
/*************************************************************************************************/
.btn-toolbar {
font-size: 0; /* Hack to remove whitespace that results from using inline-block */
margin-top: 10px;
margin-bottom: 10px;
}
.btn-toolbar .btn-combo {
display: inline-block; /* display inline for toolbar */
}
.btn-toolbar > .btn + .btn,
.btn-toolbar > .btn-group + .btn,
.btn-toolbar > .btn + .btn-group,
.btn-toolbar > .btn-combo + .btn,
.btn-toolbar > .btn + .btn-combo {
margin-left: 5px;
}
/*************************************************************************************************/
/* SPLIT BUTTON DROPDOWNS */
/*************************************************************************************************/
/* Give the line between buttons some depth */
.btn-group > .btn-combo > .btn + .dropdown-toggle,
.btn-combo > .btn + .dropdown-toggle {
padding-left: 8px;
padding-right: 8px;
-webkit-box-shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
}
.btn-group > .btn-mini + .dropdown-toggle,
.btn-group > .btn-combo > .btn-mini + .dropdown-toggle {
padding-left: 5px;
padding-right: 5px;
}
.btn-group > .btn-large + .dropdown-toggle,
.btn-group > .btn-combo > .btn-large + .dropdown-toggle {
padding-left: 12px;
padding-right: 12px;
}
/* Remove the gradient and set the same inset shadow as the :active state */
.btn-group.open .dropdown-toggle {
background-image: none;
-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
}
/* Keep the hover's background when dropdown is open */
.btn-group.open .btn.dropdown-toggle {
background-color: #3C444D;
}
/* The clickable button for toggling the menu */
.btn-group.open .btn-primary.dropdown-toggle {
background-color: #40A540;
}
.btn-group.open .btn-danger.dropdown-toggle {
background-color: #EA958D;
}
.btn-group.open .btn-success.dropdown-toggle {
background-color: #40A540;
}
/* Prevent Tooltip from spacing two buttons */
.btn-group > .btn + div.tooltip + .btn {
margin-left: -1px;
}
/*************************************************************************************************/
/* VERTICAL BUTTON GROUPS */
/*************************************************************************************************/
.btn-group-vertical {
display: inline-block;
}
/* makes buttons only take up the width they need */
.btn-group-vertical > .btn {
display: block;
float: none;
max-width: 100%;
border-radius: 0;
}
.btn-group-vertical > .btn + .btn {
margin-left: 0;
margin-top: -1px;
}
.btn-group-vertical:first-child {
border-radius: 3px 3px 0 0;
}
.btn-group-vertical:last-child {
border-radius: 0 0 3px 3px;
}
.btn-group-vertical > .btn-large:first-child {
border-radius: 3px 3px 0 0;
}
.btn-group-vertical > .btn-large:last-child {
border-radius: 0 0 3px 3px;
}
/*************************************************************************************************/
/* RADIO BUTTON GROUP */
/*************************************************************************************************/
.btn-group-radio > .btn {
text-overflow: ellipsis;
overflow: hidden;
border-color: #171D21;
}
.btn-group-radio > .btn:hover {
background-color: #3C444D;
-webkit-box-shadow: inset 0px -1px 0 #31373E;
box-shadow: inset 0px -1px 0 #31373E;
}
.btn-group-radio > .btn.active {
cursor: default;
background-color: #2B3033;
-webkit-box-shadow: inset 0px 1px 0 #000000;
box-shadow: inset 0px 1px 0 #000000;
border-color: #171D21;
}
.btn-group-radio > .btn.active:focus {
cursor: default;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.btn-group-radio > .btn.active:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-group-radio > .btn.active[disabled] {
cursor: not-allowed;
background-color: #2B3033;
-webkit-box-shadow: inset 0px 1px 0 #000000;
box-shadow: inset 0px 1px 0 #000000;
border-color: #171D21;
}
.btn-group-radio > .btn:disabled {
-webkit-box-shadow: none;
box-shadow: none;
border-color: transparent;
background-color: #3C444D;
}
/* For synthetic radio with the "locale-responsive-layout" class, align the items vertically to accommodate long words (SPL-83062). */
body.locale-de .btn-group-radio.locale-responsive-layout {
display: block;
}
body.locale-de .btn-group-radio.locale-responsive-layout .btn {
border-radius: 0;
display: block;
width: 100%;
margin-left: 0;
border-bottom-width: 0;
}
body.locale-de .btn-group-radio.locale-responsive-layout .btn:first-child {
border-radius: 3px 3px 0 0;
}
body.locale-de .btn-group-radio.locale-responsive-layout .btn:last-child {
border-radius: 0 0 3px 3px;
border-bottom-width: 1px;
}
/*===============================================================================================*/
/* SPLUNK: ALERTS */
/*===============================================================================================*/
/*************************************************************************************************/
/* ALERTS CONTAINER */
/*************************************************************************************************/
.alerts:not(.alerts-view) {
max-height: 500px;
overflow-y: auto;
}
/*************************************************************************************************/
/* BASE STYLES */
/*************************************************************************************************/
.alert {
margin-bottom: 20px;
border-radius: 3px;
position: relative;
padding: 8px 35px 8px 27px;
word-wrap: break-word;
color: #FFFFFF;
}
.alert .icon-alert {
font-size: 200%;
position: absolute;
left: 0px;
top: 8px;
}
.alert h4 {
color: inherit;
margin: 0;
}
.alert .close {
position: relative;
top: -2px;
right: -21px;
line-height: 20px;
}
.alert-inline {
display: inline-block;
border: 0;
margin-bottom: 0;
}
/*************************************************************************************************/
/* ALERTS LEVELS */
/*************************************************************************************************/
.alert-warning .icon-alert {
color: #F8BE34;
}
.alert-info .icon-alert {
color: #006D9C;
}
.alert-info .icon-alert:before {
content: 'I';
}
.alert-success .icon-alert {
color: #53A051;
}
.alert-success .icon-alert:before {
content: 'I';
}
.alert-404,
.alert-error .icon-alert {
color: #DC4E41;
}
.alert-404:before, .alert-error .icon-alert:before {
content: '\ECE2';
}
/* Components: Nav */
/*===============================================================================================*/
/* SPLUNK: NAVS */
/* Navigation styles and components. */
/*===============================================================================================*/
/*************************************************************************************************/
/* BASE CLASS */
/*************************************************************************************************/
.nav {
margin-left: 0;
margin-bottom: 0;
list-style: none;
}
.nav > li > a {
display: block;
}
.nav > li > a:hover, .nav > li > a:focus {
text-decoration: none;
}
/* Redeclare pull classes because of specifity */
.nav > .pull-right {
float: right;
}
/* Nav headers (for dropdowns and lists) */
.nav-header {
display: block;
padding: 3px 15px;
font-size: 12px;
font-weight: bold;
line-height: 20px;
color: #818D99;
text-shadow: 0 1px 0 rgba(255,255,255,.5);
text-transform: uppercase;
}
/* Space them out when they follow another list item (link) */
.nav li + .nav-header {
margin-top: 9px;
}
/*************************************************************************************************/
/* NAV LIST */
/*************************************************************************************************/
.nav-list {
padding-left: 15px;
padding-right: 15px;
margin-bottom: 0;
}
.nav-list > li > a,
.nav-list .nav-header {
margin-left: -15px;
margin-right: -15px;
text-shadow: 0 1px 0 rgba(255,255,255,.5);
}
.nav-list > li > a {
padding: 3px 15px;
}
.nav-list > .active > a,
.nav-list > .active > a:hover,
.nav-list > .active > a:focus {
color: #FFFFFF;
text-shadow: 0 -1px 0 rgba(0,0,0,.2);
background-color: #00A4FD;
}
.nav-list [class^="icon-"], .nav-list [class*=" icon-"] {
margin-right: 2px;
}
/* Dividers (basically an hr) within the dropdown */
.nav-list .divider {
height: 1px;
margin: 9px 1px;
/* 8px 1px */
overflow: hidden;
background-color: #171D21;
}
/*************************************************************************************************/
/* TABS & PILLS */
/*************************************************************************************************/
.nav-tabs:before,
.nav-tabs:after,
.nav-pills:before,
.nav-pills:after {
display: table;
content: "";
line-height: 0;
}
.nav-tabs:after, .nav-pills:after {
clear: both;
}
.nav-tabs > li, .nav-pills > li {
float: left;
}
.nav-tabs > li > a, .nav-pills > li > a {
padding-right: 15px;
padding-left: 15px;
margin-right: 2px;
line-height: 14px; /* keeps the overall height an even number */
}
/*************************************************************************************************/
/* TABS */
/* Splunk style tabs. */
/* extends: nav */
/* overrides: bootstrap default nav-tabs */
/*************************************************************************************************/
/*
*/
.nav-tabs {
padding: 0 5px;
height: 38px;
background-color: #FFFFFF;
border-bottom: 1px solid #2B3033;
}
.nav-tabs > li {
position: relative;
}
.nav-tabs > li > a {
line-height: 34px;
padding: 2px 15px;
color: #5C6773;
}
.nav-tabs > li > a:before {
content: '';
position: absolute;
width: calc(100% - 30px);
height: 0;
bottom: 0;
left: 14px;
background-color: #E1E6EB;
-webkit-transition: height 0.2s;
transition: height 0.2s;
}
.nav-tabs > li > a:hover {
background: transparent;
}
.nav-tabs > li > a:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.nav-tabs > li > a:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.nav-tabs > li > a:focus {
-webkit-box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #FFFFFF, inset 0 0 0 2px #00A4FD;
background-color: transparent;
border-radius: 3px;
}
.nav-tabs > li:not(.active):hover > a:before {
height: 3px;
}
.nav-tabs > li.active > a:before {
height: 3px;
background-color: #007ABD;
}
.nav-tabs > li.active, .nav-tabs > li > a.active {
-webkit-box-shadow: none !important;
box-shadow: none !important;
border-radius: 0 !important;
font-weight: 500;
color: #FFFFFF;
}
/*************************************************************************************************/
/* PILLS */
/*************************************************************************************************/
/* Links rendered as pills */
.nav-pills > li > a {
padding-top: 8px;
padding-bottom: 8px;
margin-top: 2px;
margin-bottom: 2px;
border-radius: 5px;
}
/* Active State */
.nav-pills > .active > a,
.nav-pills > .active > a:hover,
.nav-pills > .active > a:focus {
color: #FFFFFF;
background-color: #00A4FD;
}
/*************************************************************************************************/
/* STACKED NAV */
/*************************************************************************************************/
/* Stacked tabs and pills */
.nav-stacked > li {
float: none;
}
.nav-stacked > li > a {
margin-right: 0; /* no need for the gap between nav items */
}
/* Tabs */
.nav-stacked > li.nav-tabs {
border-bottom: 0;
}
.nav-stacked > li.nav-tabs > li > a {
border: 1px solid #171D21;
border-radius: 0;
}
.nav-stacked > li.nav-tabs > li > a:hover,
.nav-stacked > li.nav-tabs > li > a:focus {
border-color: #171D21;
z-index: 2;
}
.nav-stacked > li.nav-tabs > li:first-child > a {
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.nav-stacked > li.nav-tabs > li:last-child > a {
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
/* Pills */
.nav-stacked > li.nav-pills > li > a {
margin-bottom: 3px;
}
.nav-stacked > li.nav-pills > li:last-child > a {
margin-bottom: 1px; /* decrease margin to match sizing of stacked tabs */
}
/*************************************************************************************************/
/* DROPDOWNS */
/*************************************************************************************************/
.nav-tabs .dropdown-menu {
border-radius: 0 0 3px 3px; /* remove the top rounded corners here since there is a hard edge above the menu */
}
.nav-pills .dropdown-menu {
border-radius: 3px; /* make rounded corners match the pills */
}
/*************************************************************************************************/
/* DEFAULT DROPDOWN LINKS */
/*************************************************************************************************/
/* Make carets use linkColor to start */
.nav .dropdown-toggle .caret {
border-top-color: #00A4FD;
border-bottom-color: #00A4FD;
margin-top: 6px;
}
.nav .dropdown-toggle:hover .caret, .nav .dropdown-toggle:focus .caret {
border-top-color: #006EAA;
border-bottom-color: #006EAA;
}
/* move down carets for tabs */
.nav-tabs .dropdown-toggle .caret {
margin-top: 8px;
}
/*************************************************************************************************/
/* ACTIVE DROPDOWN LINKS */
/*************************************************************************************************/
.nav .active .dropdown-toggle .caret {
border-top-color: #FFFFFF;
border-bottom-color: #FFFFFF;
}
.nav-tabs .active .dropdown-toggle .caret {
border-top-color: #5C6773;
border-bottom-color: #5C6773;
}
/*************************************************************************************************/
/* ACTIVE:HOVER / :FOCUS DROPDOWN LINKS */
/*************************************************************************************************/
.nav > .dropdown.active > a:hover,
.nav > .dropdown.active > a:focus {
cursor: pointer;
}
/*************************************************************************************************/
/* OPEN DROPDOWNS */
/*************************************************************************************************/
.nav-tabs .open .dropdown-toggle,
.nav-pills .open .dropdown-toggle,
.nav > li.dropdown.open.active > a:hover,
.nav > li.dropdown.open.active > a:focus {
color: #FFFFFF;
background-color: #818D99;
border-color: #818D99;
}
.nav li.dropdown.open .caret,
.nav li.dropdown.open.active .caret,
.nav li.dropdown.open a:hover .caret,
.nav li.dropdown.open a:focus .caret {
border-top-color: #FFFFFF;
border-bottom-color: #FFFFFF;
opacity: 1.0;
}
/* Dropdowns in stacked tabs */
.tabs-stacked .open > a:hover,
.tabs-stacked .open > a:focus {
border-color: #818D99;
}
/*************************************************************************************************/
/* TABBABLE COMMON STYLES */
/*************************************************************************************************/
/* Clear any floats */
.tabbable:before,
.tabbable:after {
display: table;
content: "";
line-height: 0;
}
.tabbable:after {
clear: both;
}
.tab-content {
overflow: auto; /* prevent content from running below tabs */
}
/* Remove border on bottom, left, right */
.tabs-below > .nav-tabs, .tabs-right > .nav-tabs, .tabs-left > .nav-tabs {
border-bottom: 0;
}
/* Show/hide tabbable areas */
.tab-content > .tab-pane,
.pill-content > .pill-pane {
display: none;
}
.tab-content > .active,
.pill-content > .active {
display: block;
}
/*************************************************************************************************/
/* TABBABLE BOTTOM STYLES */
/*************************************************************************************************/
.tabs-below > .nav-tabs {
border-top: 1px solid #171D21;
}
.tabs-below > .nav-tabs > li {
margin-top: -1px;
margin-bottom: 0;
}
.tabs-below > .nav-tabs > li > a {
border-radius: 0 0 3px 3px;
}
.tabs-below > .nav-tabs > li > a:hover,
.tabs-below > .nav-tabs > li > a:focus {
border-bottom-color: transparent;
border-top-color: #171D21;
}
.tabs-below > .nav-tabs > .active > a,
.tabs-below > .nav-tabs > .active > a:hover,
.tabs-below > .nav-tabs > .active > a:focus {
border-color: transparent #171D21 #171D21 #171D21;
}
/*************************************************************************************************/
/* TABBABLE LEFT & RIGHT STYLES */
/*************************************************************************************************/
/* Common styles */
.tabs-left > li, .tabs-right > li {
float: none;
}
.tabs-left > li > a, .tabs-right > li > a {
min-width: 74px;
margin-right: 0;
margin-bottom: 3px;
}
/* Tabs on the left */
.tabs-left > .nav-tabs {
float: left;
margin-right: 19px;
border-right: 1px solid #171D21;
}
.tabs-left > .nav-tabs > li > a {
margin-right: -1px;
border-radius: 3px 0 0 3px;
}
.tabs-left > .nav-tabs > li > a:hover,
.tabs-left > .nav-tabs > li > a:focus {
border-color: #E1E6EB #171D21 #E1E6EB #E1E6EB;
}
.tabs-left > .nav-tabs .active > a,
.tabs-left > .nav-tabs .active > a:hover,
.tabs-left > .nav-tabs .active > a:focus {
border-color: #171D21 transparent #171D21 #171D21;
}
/* Tabs on the right */
.tabs-right > .nav-tabs {
float: right;
margin-left: 19px;
border-left: 1px solid #171D21;
}
.tabs-right > .nav-tabs > li > a {
margin-left: -1px;
border-radius: 0 3px 3px 0;
}
.tabs-right > .nav-tabs > li > a:hover,
.tabs-right > .nav-tabs > li > a:focus {
border-color: #E1E6EB #E1E6EB #E1E6EB #171D21;
}
.tabs-right > .nav-tabs .active > a,
.tabs-right > .nav-tabs .active > a:hover,
.tabs-right > .nav-tabs .active > a:focus {
border-color: #171D21 #171D21 #171D21 transparent;
}
/* fixes an alignment issue with out font based carets. */
.nav .dropdown-toggle .caret,
.nav-tabs .dropdown-toggle .caret,
.navbar .nav .dropdown-toggle .caret {
margin-top: 0;
}
/*************************************************************************************************/
/* DISABLED STATES */
/*************************************************************************************************/
/* Gray out text */
.nav > .disabled > a {
color: #5C6773;
}
/* Nuke hover/focus effects */
.nav > .disabled > a:focus,
.nav > .disabled > a:hover {
text-decoration: none;
background-color: transparent;
cursor: default;
}
/*************************************************************************************************/
/* PRINT */
/*************************************************************************************************/
@media print {
header,
.app-bar {
display: none !important;
}
.main-tabs {
border: none !important;
}
.main-tabs li:not(.active) {
display: none !important;
}
.main-tabs li.active:before, .main-tabs li.active:after {
display:none !important;
}
}
/*===============================================================================================*/
/* SPLUNK: NAVBARS (REDUX) */
/*===============================================================================================*/
/*************************************************************************************************/
/* COMMON STYLES */
/*************************************************************************************************/
/* Base class and wrapper */
.navbar {
overflow: visible;
margin-bottom: 0;
}
/* We then reset it for fixed navbars in the #gridSystem mixin */
.navbar .container {
width: auto;
}
/* Brand: Website or project name. */
.navbar .brand {
float: left;
display: block;
/* Vertically center the text given $navbarHeight */
padding: 7px 20px 7px;
margin-left: -20px; /* negative indent to left-align the text down the page */
font-size: 20px;
font-weight: 200;
color: #00A4FD;
text-shadow: 0 1px 0 #FFFFFF;
}
.navbar .brand:hover,
.navbar .brand:focus {
text-decoration: none;
}
/* Dividers in navbar */
.navbar .divider-vertical {
height: 34px;
margin: 0 9px;
border-left: 1px solid #171D21;
border-right: 1px solid #FFFFFF;
}
/* Buttons in navbar */
.navbar .btn,
.navbar .btn-group {
margin-top: 2px; /* Vertically center in navbar */
}
/* Set width to auto for default container */
.navbar .btn-group .btn,
.navbar .input-prepend .btn,
.navbar .input-append .btn,
.navbar .input-prepend .btn-group,
.navbar .input-append .btn-group {
margin-top: 0; /* then undo the margin here so we don't accidentally double it */
}
/* Inner for background effects */
/* Gradient is applied to its own element because overflow visible is not honored by IE when filter is present */
.navbar-inner {
min-height: 34px;
padding-left: 20px;
padding-right: 20px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#171D21));
background-image: linear-gradient(to bottom, #FFFFFF, #171D21);
border: 1px solid rgb(0, 0, 0);
border-radius: 3px;
-webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065);
box-shadow: 0 1px 4px rgba(0,0,0,.065);
}
/* Prevent floats from breaking the navbar */
.navbar-inner:before,
.navbar-inner:after {
display: table;
content: "";
line-height: 0;
}
.navbar-inner:after {
clear: both;
}
/* Override the default collapsed state */
.nav-collapse.collapse {
height: auto;
overflow: visible;
}
/* Plain text in topbar */
.navbar-text {
margin-bottom: 0;
line-height: 34px;
color: #C3CBD4;
}
/* Janky solution for now to account for links outside the .nav */
.navbar-link {
color: #C3CBD4;
}
.navbar-link:hover,
.navbar-link:focus {
color: #3C444D;
}
/*************************************************************************************************/
/* NAVBAR FORMS */
/*************************************************************************************************/
.navbar-form {
margin-bottom: 0;
}
/* remove default bottom margin */
.navbar-form:before,
.navbar-form:after {
display: table;
content: "";
line-height: 0;
}
.navbar-form:after {
clear: both;
}
.navbar-form input,
.navbar-form select,
.navbar-form .radio,
.navbar-form .checkbox {
margin-top: 2px; /* Vertically center in navbar */
}
.navbar-form input,
.navbar-form select,
.navbar-form .btn {
display: inline-block;
margin-bottom: 0;
}
.navbar-form input[type="image"],
.navbar-form input[type="checkbox"],
.navbar-form input[type="radio"] {
margin-top: 3px;
}
.navbar-form .input-append,
.navbar-form .input-prepend {
margin-top: 5px;
white-space: nowrap;
}
/* preven two items from separating within a .navbar-form that has .pull-left */
.navbar-form .input-append input, .navbar-form .input-prepend input {
margin-top: 0; /* remove the margin on top since it's on the parent */
}
/*************************************************************************************************/
/* NAVBAR SEARCH */
/*************************************************************************************************/
.navbar-search {
position: relative;
float: left;
margin-top: 2px; /* Vertically center in navbar */
margin-bottom: 0;
}
.navbar-search .search-query {
margin-bottom: 0;
padding: 4px 14px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 13px;
font-weight: normal;
line-height: 1;
border-radius: 15px; /* redeclare because of specificity of the type attribute */
}
/*************************************************************************************************/
/* STATIC NAVBAR */
/*************************************************************************************************/
.navbar-static-top {
position: static;
margin-bottom: 0;
}
/* remove 18px margin for default navbar */
.navbar-static-top .navbar-inner {
border-radius: 0;
}
/*************************************************************************************************/
/* FIXED NAVBAR */
/*************************************************************************************************/
/* Shared (top/bottom) styles */
.navbar-fixed-top,
.navbar-fixed-bottom {
position: fixed;
right: 0;
left: 0;
z-index: 1030;
margin-bottom: 0;
}
/* remove 18px margin for default navbar */
.navbar-fixed-top .navbar-inner, .navbar-fixed-bottom .navbar-inner {
padding-left: 0;
padding-right: 0;
border-radius: 0;
}
.navbar-fixed-top .navbar-inner, .navbar-static-top .navbar-inner {
border-width: 0 0 1px;
-webkit-box-shadow: 0 1px 10px rgba(0,0,0,.1);
box-shadow: 0 1px 10px rgba(0,0,0,.1);
}
/* Fixed to top */
.navbar-fixed-top {
top: 0;
}
/* Fixed to bottom */
.navbar-fixed-bottom {
bottom: 0;
}
.navbar-fixed-bottom .navbar-inner {
border-width: 1px 0 0;
-webkit-box-shadow: 0 -1px 10px rgba(0,0,0,.1);
box-shadow: 0 -1px 10px rgba(0,0,0,.1);
}
/* Reset container width */
/* Required here as we reset the width earlier on and the grid mixins don't override early enough */
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
/*************************************************************************************************/
/* NAVIGATION */
/*************************************************************************************************/
.navbar {
/* Navbar button for toggling navbar items in responsive layouts */
}
.navbar .nav {
position: relative;
left: 0;
display: block;
float: left;
margin: 0 10px 0 0;
}
.navbar .nav.pull-right {
float: right; /* redeclare due to specificity */
margin-right: 0; /* remove margin on float right nav */
}
.navbar .nav > li {
float: left;
}
/* Links */
.navbar .nav > li > a {
float: none;
/* Vertically center the text given $navbarHeight */
padding: 7px 15px 7px;
color: #C3CBD4;
text-decoration: none;
text-shadow: 0 1px 0 #FFFFFF;
}
/* Hover/focus */
.navbar .nav > li > a:focus,
.navbar .nav > li > a:hover {
background-color: transparent; /* "transparent" is default to differentiate :hover/:focus from .active */
color: #3C444D;
text-decoration: none;
}
/* Dropdown Menus */
.navbar .nav > li > .dropdown-menu:before {
content: '';
display: inline-block;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #171D21;
border-bottom-color: #171D21;
position: absolute;
top: -7px;
left: 9px;
}
.navbar .nav > li > .dropdown-menu:after {
content: '';
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #FFFFFF;
position: absolute;
top: -6px;
left: 10px;
}
/* Caret should match text color on hover/focus */
.navbar .nav > li.dropdown > a:hover .caret,
.navbar .nav > li.dropdown > a:focus .caret {
border-top-color: #3C444D;
border-bottom-color: #3C444D;
}
/* Remove background color from open dropdown */
.navbar .nav > li.dropdown.open > .dropdown-toggle, .navbar .nav > li.dropdown.active > .dropdown-toggle, .navbar .nav > li.dropdown.open.active > .dropdown-toggle {
background-color: rgb(13, 16, 18);
color: #5C6773;
}
.navbar .nav > li.dropdown.open > .dropdown-toggle .caret, .navbar .nav > li.dropdown.active > .dropdown-toggle .caret, .navbar .nav > li.dropdown.open.active > .dropdown-toggle .caret {
border-top-color: #5C6773;
border-bottom-color: #5C6773;
}
.navbar .nav > li.dropdown > .dropdown-toggle .caret {
border-top-color: #C3CBD4;
border-bottom-color: #C3CBD4;
}
.navbar .nav .dropdown-toggle .caret {
margin-top: 8px;
}
/* Active nav items */
.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > .active > a:focus {
color: #5C6773;
text-decoration: none;
background-color: rgb(13, 16, 18);
-webkit-box-shadow: inset 0 3px 8px rgba(0,0,0,.125);
box-shadow: inset 0 3px 8px rgba(0,0,0,.125);
}
/* These definitions need to come after '.navbar .btn' */
.navbar .btn-navbar {
display: none;
float: right;
padding: 7px 10px;
margin-left: 5px;
margin-right: 5px;
background-color: #5C6773;
border-color: #171D21;
color: #FFFFFF;
-webkit-box-shadow: inset 0px -1px 0 #3C444D;
box-shadow: inset 0px -1px 0 #3C444D;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
}
.navbar .btn-navbar .icon-bar {
display: block;
width: 18px;
height: 2px;
background-color: #f5f5f5;
border-radius: 1px;
-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.25);
box-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.navbar .btn-navbar .icon-bar+ .icon-bar {
margin-top: 3px;
}
/* Right aligned menus need alt position */
.navbar .pull-right > li > .dropdown-menu,
.navbar .nav > li > .dropdown-menu.pull-right {
left: auto;
right: 0;
}
.navbar .pull-right > li > .dropdown-menu:before, .navbar .nav > li > .dropdown-menu.pull-right:before {
left: auto;
right: 12px;
}
.navbar .pull-right > li > .dropdown-menu:after, .navbar .nav > li > .dropdown-menu.pull-right:after {
left: auto;
right: 13px;
}
.navbar .pull-right > li > .dropdown-menu .dropdown-menu, .navbar .nav > li > .dropdown-menu.pull-right .dropdown-menu {
left: auto;
right: 100%;
margin-left: 0;
margin-right: -1px;
border-radius: 6px 0 6px 6px;
}
/* Menu position and menu caret support for dropups via extra dropup class */
.navbar-fixed-bottom .nav > li > .dropdown-menu:before {
border-top: 7px solid #171D21;
border-top-color: #171D21;
border-bottom: 0;
bottom: -7px;
top: auto;
}
.navbar-fixed-bottom .nav > li > .dropdown-menu:after {
border-top: 6px solid #FFFFFF;
border-bottom: 0;
bottom: -6px;
top: auto;
}
/*===============================================================================================*/
/* SPLUNK: PAGINATOR */
/* Navigation styles and components. */
/*===============================================================================================*/
/* pagination styles and overrides
*/
.pagination {
height: auto;
}
.pagination > ul {
display: inline-block;
/* Reset default ul styles */
margin-left: 0;
margin-bottom: 0;
list-style: none;
}
.pagination > ul > li {
float: left;
}
.pagination > ul > li > span,
.pagination > ul > li > a {
padding: 5px 14px; /* note the vertical padding will be funky unless it's block, inline-block, or floated */
float: left;
line-height: 20px;
border: 1px solid transparent;
border-radius: 3px;
background-color: none;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.pagination > ul > li > span:hover, .pagination > ul > li > a:hover {
color: #FFFFFF;
background: #3C444D;
border-color: #171D21;
text-decoration: none;
}
.pagination > ul > li > span:focus, .pagination > ul > li > a:focus {
color: #00A4FD;
background: none;
border-color: transparent;
text-decoration: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.pagination > ul > li > span:focus:active:not([disabled]), .pagination > ul > li > a:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.pagination > ul > li > span:active, .pagination > ul > li > span.active, .pagination > ul > li > a:active, .pagination > ul > li > a.active {
color: #FFFFFF;
background: #2B3033;
border-color: transparent;
text-decoration: none;
}
.pagination > ul > li > span.disabled,
.pagination > ul > li > span[disabled],
.pagination > ul > li > span.disabled:hover,
.pagination > ul > li > span[disabled]:hover,
.pagination > ul > li > span.disabled:focus,
.pagination > ul > li > span[disabled]:focus,
.pagination > ul > li > span.disabled:active,
.pagination > ul > li > span[disabled]:active,
.pagination > ul > li > a.disabled,
.pagination > ul > li > a[disabled],
.pagination > ul > li > a.disabled:hover,
.pagination > ul > li > a[disabled]:hover,
.pagination > ul > li > a.disabled:focus,
.pagination > ul > li > a[disabled]:focus,
.pagination > ul > li > a.disabled:active,
.pagination > ul > li > a[disabled]:active {
color: #5C6773;
background: none;
border-color: transparent;
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
cursor: not-allowed;
}
.pagination > ul > li > span:not(.page-controls),.pagination > ul > li > a:not(.page-controls){
padding: 5px 10px;
margin: 0 1px;
}
.pagination > ul > li > span:not(.page-controls).btn-square, .pagination > ul > li > a:not(.page-controls).btn-square {
padding: 5px 0;
}
.pagination > ul .active > a, .pagination > ul .active > a:hover {
cursor: default;
border: 1px solid #007ABD;
color: #007ABD;
}
.pagination > ul .icon-chevron-left, .pagination > ul .icon-triangle-left-small {
padding-right: 6.66667px;
}
.pagination > ul .icon-chevron-right, .pagination > ul .icon-triangle-right-small {
padding-left: 6.66667px;
}
.pagination > ul > .disabled > span,
.pagination > ul > .disabled > a,
.pagination > ul > .disabled > a:hover,
.pagination > ul > .disabled > a:focus {
background-color: transparent;
border-color: transparent;
color: #5C6773;
cursor: default;
-webkit-box-shadow: none;
box-shadow: none;
}
.pagination .max-events-per-bucket {
color: #F8BE34;
font-size: 18px;
}
/* .pagination */
.splunk-paginator.splunk-view {
padding: 0 10px;
}
.splunk-paginator.splunk-view .disabled, .splunk-paginator.splunk-view a.selected {
color: #5C6773;
cursor: default;
}
.splunk-paginator.splunk-view a.selected {
color: #00A4FD;
border: 1px solid #00A4FD;
background: transparent;
}
.splunk-paginator.splunk-view a {
border: 1px solid transparent;
border-radius: 3px;
color: #FFFFFF;
padding: 2px 8px 2px;
text-decoration: none;
min-width: 10px;
line-height: 20px;
display: inline-block;
text-align: center;
}
.splunk-paginator.splunk-view a:hover {
background: #3C444D;
}
.splunk-paginator.splunk-view a:disabled {
background: none;
}
.splunk-paginator.splunk-view span {
padding-left: 5px;
padding-right: 5px;
}
/*===============================================================================================*/
/* SPLUNK: PAGER PAGINATION */
/*===============================================================================================*/
.pager {
margin: 20px 0;
list-style: none;
text-align: center;
}
.pager:before,
.pager:after {
display: table;
content: "";
line-height: 0;
}
.pager:after {
clear: both;
}
.pager li {
display: inline;
}
.pager li > a,
.pager li > span {
display: inline-block;
padding: 5px 14px;
background-color: #FFFFFF;
border: 1px solid #171D21;
border-radius: 15px;
}
.pager li > a:hover,
.pager li > a:focus {
text-decoration: none;
background-color: #F7F8FA;
}
.pager .next > a,
.pager .next > span {
float: right;
}
.pager .previous > a,
.pager .previous > span {
float: left;
}
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
text-decoration: none;
background-color: #F7F8FA;
}
/* Components: Popovers */
/*===============================================================================================*/
/* SPLUNK: MODALS */
/*===============================================================================================*/
/* TODO: the close button seems to have issues on placement */
/* modal windows
*/
/* body while modal is open */
.body-modal-open {
overflow: hidden;
}
/* Background */
.modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1040;
background-color: #b3b3b3;
}
/* Fade for backdrop */
.modal-backdrop.fade { opacity: 0; }
.modal-backdrop,
.modal-backdrop.fade.in {
opacity: 0.80;
}
/* modal container */
.modal {
position: fixed;
top: 40px;
left: 50%;
width: 550px;
margin-left: -275px;
}
.modal .form-horizontal {
width: 550px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.modal {
z-index: 1050;
background-color: #31373E;
border: none;
-webkit-box-shadow: 0 3px 7px rgba(0,0,0,0.3);
box-shadow: 0 3px 7px rgba(0,0,0,0.3);
background-clip: border-box;
outline: none;
}
/* Remove focus outline from opened modal */
.modal.fade {
-webkit-transition: opacity 0.125s, top 0.125s ease;
transition: opacity 0.125s, top 0.125s ease;
top: 0;
}
.modal.fade.in { top: 40px }
/* modal */
/* SPL-68751 - IE10 box shadow animation artifacts fix */
.modal:after {
content: "";
font-size: 0;
display: inline;
overflow: hidden;
}
/*************************************************************************************************/
/* MODAL HEADER */
/*************************************************************************************************/
.modal-header {
border: none;
position: relative;
background: #31373E;
padding: 20px;
}
/* heading */
.modal-header h3, .modal-header h1, .modal-header .modal-title {
font-size: 20px;
font-weight: 500;
line-height: 22px;
margin: 0;
overflow-wrap: break-word;
padding-right: 40px;
}
/* close button */
.modal-header .close {
border: 1px solid;
top: 20px;
right: 20px;
margin-top: -2px;
position: absolute;
background-color: none;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.modal-header .close:hover {
color: #FFFFFF;
background: #3C444D;
border-color: #171D21;
text-decoration: none;
}
.modal-header .close:focus {
color: #00A4FD;
background: none;
border-color: transparent;
text-decoration: none;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.modal-header .close:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.modal-header .close:active, .modal-header .close.active {
color: #FFFFFF;
background: #2B3033;
border-color: transparent;
text-decoration: none;
}
.modal-header .close.disabled,
.modal-header .close[disabled],
.modal-header .close.disabled:hover,
.modal-header .close[disabled]:hover,
.modal-header .close.disabled:focus,
.modal-header .close[disabled]:focus,
.modal-header .close.disabled:active,
.modal-header .close[disabled]:active {
color: #5C6773;
background: none;
border-color: transparent;
text-decoration: none;
-webkit-box-shadow: none;
box-shadow: none;
cursor: not-allowed;
}
/*************************************************************************************************/
/* MODAL BODY */
/*************************************************************************************************/
.modal-body {
position: relative;
padding: 0 20px;
overflow: visible;
max-height: calc(100vh - 246px);
}
.modal-body:last-child {
max-height: calc(100vh - 259px); /* if no footer, can be somewhat taller */
}
/* Remove bottom margin if need be */
.modal-form {
margin-bottom: 0;
}
.modal-body-scrolling {
overflow-y: auto;
padding: 20px;
position: relative;
border-top: 1px solid #32414C;
border-bottom: 1px solid #32414C;
}
/*************************************************************************************************/
/* MODAL FOOTER */
/*************************************************************************************************/
.modal-footer {
padding: 20px;
margin-bottom: 0;
text-align: right; /* right align buttons */
background: #31373E;
}
.modal-footer:before,
.modal-footer:after {
display: table;
content: "";
line-height: 0;
}
.modal-footer:after {
clear: both;
}
/* clear it in case folks use .pull-* classes on buttons */
.modal-footer > .btn {
min-width: 80px;
}
.modal-footer > .btn + .btn:not(.pull-left) {
/* Properly space out buttons */
margin-left: 10px;
margin-bottom: 0; /* account for input[type="submit"] which gets the bottom margin like all other inputs */
}
/* but override that for button groups */
.modal-footer > .btn-group .btn + .btn {
margin-left: -1px;
}
/* and override it for block buttons as well */
.modal-footer > .btn-block + .btn-block {
margin-left: 0;
}
.modal-footer:empty {
padding: 0;
}
/*************************************************************************************************/
/* MODAL VARIATIONS */
/*************************************************************************************************/
/* extends modal; sets width & offset */
.modal-wide {
width: 800px;
margin-left: -400px;
}
.modal-wide .form-horizontal {
width: 800px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* Disconnect needs to be above other modals */
.modal.disconnection-warning-modal {
z-index: 1090;
}
.shared-splunkbar-messages-noconnectionoverlay .modal-backdrop {
z-index: 1080;
}
/* loading ... */
.modal-loading {
text-align: center;
color: #C3CBD4;
}
/*************************************************************************************************/
/* WHATS NEW DIALOG */
/*************************************************************************************************/
.shared-whatsnewdialog.modal {
width: 900px;
margin-left: -450px;
}
.shared-whatsnewdialog.modal .modal-body {
padding-right: 0;
}
.shared-whatsnewdialog h2 {
font-weight: 200;
font-size: 24px;
margin: 0 0 20px -20px;
padding-left: 20px;
}
.shared-whatsnewdialog .feature {
display:inline-block;
width: 260px;
margin: 0 20px 20px 0;
position: relative;
vertical-align: top;
}
.shared-whatsnewdialog .feature > h3 {
margin: 0 0 5px 0;
}
.shared-whatsnewdialog .feature > img {
display: block;
width: 100%;
height: 170px;
border: 1px solid #171D21;
margin-bottom: 10px;
}
.shared-whatsnewdialog .feature > p {
margin: 0;
}
.shared-whatsnewdialog .feature + h2 {
padding-top: 20px;
border-top: 1px dotted #171D21;
}
/*===============================================================================================*/
/* SPLUNK: TOOLTIPS */
/*===============================================================================================*/
/* Base class */
.tooltip {
position: absolute;
z-index: 1070;
display: block;
visibility: visible;
font-size: 12px;
line-height: 1.4;
opacity: 0.0;
}
.tooltip.in { opacity: 0.85; }
.tooltip.top { margin-top: -3px; padding: 5px 0; }
.tooltip.right { margin-left: 3px; padding: 0 5px; }
.tooltip.bottom { margin-top: 3px; padding: 5px 0; }
.tooltip.left { margin-left: -3px; padding: 0 5px; }
/* Wrapper for the tooltip content */
.tooltip-inner {
max-width: 200px;
padding: 6px 12px;
color: #171D21;
text-align: center;
text-decoration: none;
background-color: #FFFFFF;
}
/* Arrows */
.tooltip-arrow {
position: absolute;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
}
.tooltip.top .tooltip-arrow {
bottom: 0;
left: 50%;
margin-left: -5px;
border-width: 5px 5px 0;
border-top-color: #FFFFFF;
}
.tooltip.right .tooltip-arrow {
top: 50%;
left: 0;
margin-top: -5px;
border-width: 5px 5px 5px 0;
border-right-color: #FFFFFF;
}
.tooltip.left .tooltip-arrow {
top: 50%;
right: 0;
margin-top: -5px;
border-width: 5px 0 5px 5px;
border-left-color: #FFFFFF;
}
.tooltip.bottom .tooltip-arrow {
top: 0;
left: 50%;
margin-left: -5px;
border-width: 0 5px 5px;
border-bottom-color: #FFFFFF;
}
/* Components: Misc */
/*===============================================================================================*/
/* SPLUNK: THUMBNAILS */
/*===============================================================================================*/
/* Note: `.thumbnails` and `.thumbnails > li` are overriden in responsive files */
/* Make wrapper ul behave like the grid */
.thumbnails {
margin-left: -20px;
list-style: none;
}
.thumbnails:before,
.thumbnails:after {
display: table;
content: "";
line-height: 0;
}
.thumbnails:after {
clear: both;
}
/* Fluid rows have no left margin */
.row-fluid .thumbnails {
margin-left: 0;
}
/* Float li to make thumbnails appear in a row */
.thumbnails > li {
float: left; /* Explicity set the float since we don't require .span* classes */
margin-bottom: 20px;
margin-left: 20px;
}
/* The actual thumbnail (can be `a` or `div`) */
.thumbnail {
display: block;
padding: 4px;
line-height: 20px;
border: 1px solid #ddd;
border-radius: 3px;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.055);
box-shadow: 0 1px 3px rgba(0,0,0,.055);
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
/* Add a hover/focus state for linked versions only */
a.thumbnail:hover,
a.thumbnail:focus {
border-color: #00A4FD;
-webkit-box-shadow: 0 1px 4px rgba(0,105,214,.25);
box-shadow: 0 1px 4px rgba(0,105,214,.25);
}
/* Images and captions */
.thumbnail > img {
display: block;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.thumbnail .caption {
padding: 9px;
color: #5C6773;
}
/*===============================================================================================*/
/* SPLUNK: LABELS & BADGES OVERRIDES */
/*===============================================================================================*/
/* Base classes */
.label,
.badge {
display: inline-block;
padding: 2px 4px;
font-size: 11.844px;
font-weight: bold;
line-height: 14px; /* ensure proper line-height if floated */
color: #FFFFFF;
vertical-align: baseline;
white-space: nowrap;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
background-color: #818D99;
}
/* Set unique padding and border-radii */
.label {
border-radius: 3px;
}
.badge {
padding-left: 9px;
padding-right: 9px;
border-radius: 9px;
}
/* Empty labels/badges collapse */
.label:empty, .badge:empty {
display: none;
}
/* Hover/focus state, but only for links */
a.label:hover,
a.label:focus,
a.badge:hover,
a.badge:focus {
color: #FFFFFF;
text-decoration: none;
cursor: pointer;
}
/* Colors */
/* Only give background-color difference to links (and to simplify, we don't qualifty with `a` but [href] attribute) */
/* Important (red) */
.label-important, .badge-important { background-color: #31373E; }
.label-important[href], .badge-important[href] { background-color: rgb(27, 30, 34); }
/* Warnings (orange) */
.label-warning, .badge-warning { background-color: #F1813F; }
.label-warning[href], .badge-warning[href] { background-color: rgb(237, 98, 18); }
/* Success (green) */
.label-success, .badge-success { background-color: #53A051; }
.label-success[href], .badge-success[href] { background-color: rgb(65, 125, 63); }
/* Info (turquoise) */
.label-info, .badge-info { background-color: #006D9C; }
.label-info[href], .badge-info[href] { background-color: rgb(0, 75, 107); }
/* Inverse (black) */
.label-inverse, .badge-inverse { background-color: #3C444D; }
.label-inverse[href], .badge-inverse[href] { background-color: rgb(38, 43, 49); }
/* Quick fix for labels/badges in buttons */
.btn .label,
.btn .badge {
position: relative;
top: -1px;
}
.btn-mini .label,
.btn-mini .badge {
top: 0;
}
/* Labels */
/* ------ */
/* TODO: use vars here */
.label {
padding: 1px 4px 0 4px;
border-radius: 4px;
line-height: 17px;
font-size: 12px;
font-weight: normal;
text-transform: uppercase;
color: #FFFFFF;
text-shadow: none;
background-color: #C3CBD4;
border: 1px solid #3C444D;
}
/* icons in labels */
.label [class*="icon-"]{
font-size: 16px;
margin-right: 3px;
vertical-align: middle;
}
/* Important (red) */
.label-important {
background-color: #31373E;
border-color: #DC4E41;
color: #DC4E41;
}
/* Warnings (orange) */
.label-warning {
background-color: rgb(253, 239, 231);
border-color: #F1813F;
color: #F1813F;
}
/* Success (green) */
.label-success {
background-color: #DDECDD;
border-color: #53A051;
color: #53A051;
}
/* Info (yellow) */
.label-info {
background-color: #FEF2D7;
border-color: #F8BE34;
color: #F8BE34;
}
/* Inverse (black) */
.label-inverse {
background-color: #5C6773;
border-color: #3C444D;
color: #FFFFFF;
}
/*===============================================================================================*/
/* SPLUNK: PROGRESS BARS */
/*===============================================================================================*/
/* ANIMATIONS */
/* ---------- */
@-webkit-keyframes progress-bar-stripes {
from { background-position: 40px 0; }
to { background-position: 0 0; }
}
@keyframes progress-bar-stripes {
from { background-position: 40px 0; }
to { background-position: 0 0; }
}
/* Spinners */
/* ---------------------------- */
.spinner-small {
background-image: url("/static/img/skins/default/loading_small.png");
background-position: left top;
width: 14px;
height: 14px;
background-size: 280px 14px;
}
.spinner-medium {
background-image: url("/static/img/skins/default/loading_medium.png");
background-position: left top;
width: 19px;
height: 19px;
background-size: 380px 19px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.spinner-small {
background-image: url("/static/img/skins/default/loading_small_2x.png");
}
.spinner-medium {
background-image: url("/static/img/skins/default/loading_medium_2x.png");
}
}
/* Progress */
/* ---------------------------- */
/* This is suppose to match Bootstrap, but it doesn't. */
.progress {
overflow: hidden;
height: 20px;
margin-bottom: 20px;
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#f9f9f9));
background-image: linear-gradient(to bottom, #f5f5f5, #f9f9f9);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
background-color: #F7F8FA;
border-radius: 3px;
}
/* Bootstrap uses the .bar class, but our standard components use .progress-bar */
.progress .bar,
.progress .progress-bar {
width: 0%;
height: 100%;
color: #FFFFFF;
float: left;
font-size: 12px;
text-align: center;
-webkit-transition: width .6s ease;
transition: width .6s ease;
}
.progress .bar {
background-color: #007ABD;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.progress .bar + .bar {
-webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.15), inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 1px 0 0 rgba(0,0,0,.15), inset 0 -1px 0 rgba(0,0,0,.15);
}
.progress .progress-bar {
line-height: 20px;
background-color: #C3CBD4;
}
.progress .progress-striped.progress-bar {
background-color: #C3CBD4;
background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-size: 40px 40px;
}
/* Striped bars */
.progress-striped .bar {
background-color: #007ABD;
background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-size: 40px 40px;
}
/* Call animation for the active one */
.progress.active .bar,
.active.progress-bar {
-webkit-animation: progress-bar-stripes 2s linear infinite;
animation: progress-bar-stripes 2s linear infinite;
}
/* PROGRESS STATES */
/* --------------- */
/* These have been inherited from Bootstrap and are not used on Core. */
/* Danger (red) */
.progress-danger .bar, .progress .bar-danger {
background: #DC4E41;
}
.progress-danger.progress-striped .bar, .progress-striped .bar-danger {
background-color: #DC4E41;
background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
}
/* Success (green) */
.progress-success .bar, .progress .bar-success {
background: #53A051;
}
.progress-success.progress-striped .bar, .progress-striped .bar-success {
background-color: #53A051;
background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
}
/* Info (teal) */
.progress-info .bar, .progress .bar-info {
background: #006D9C;
}
.progress-info.progress-striped .bar, .progress-striped .bar-info {
background-color: #006D9C;
background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
}
/* Warning (orange) */
.progress-warning .bar, .progress .bar-warning {
background: #F1813F;
}
.progress-warning.progress-striped .bar, .progress-striped .bar-warning {
background-color: #F1813F;
background-image: linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
}
/*===============================================================================================*/
/* SPLUNK: ACCORDION */
/* Accordion for expanding content. */
/*===============================================================================================*/
/*
*/
/* Parent container */
.accordion {
margin-bottom: 0;
background: #31373E;
}
/* Heading */
.accordion-heading {
border-bottom: 0;
position: relative;
}
/* Heading Toggle */
.accordion-heading .accordion-toggle {
display: block;
padding: 5px 14px;
padding-left: 30px;
line-height: 20px;
background-color: #3C444D;
color: #FFFFFF;
text-decoration: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
cursor: pointer;
}
.accordion-heading .accordion-toggle .icon-triangle-right-small:before {
content: "\203A";
}
.accordion-heading .accordion-toggle .icon-triangle-down-small:before {
content: "\2C5";
}
/* Group == heading + body */
.accordion-group {
margin-bottom: 2px;
border: none;
border-radius: 0;
}
.accordion-group:first-child .accordion-toggle {
border-top: none;
}
.accordion-group:last-child .accordion-toggle,
.accordion-group.active:last-child .accordion-body {
border-bottom: none;
}
.accordion-group .accordion-toggle:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.accordion-group .accordion-toggle:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.accordion-group .accordion-toggle:focus {
-webkit-box-shadow: inset 0 0 2px 1px #3C444D, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #3C444D, inset 0 0 0 2px #00A4FD;
}
.accordion-group.active .accordion-toggle {
background: #31373E;
border-bottom: none;
cursor: default;
}
.accordion-group.active .accordion-toggle:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.accordion-group.active .accordion-toggle:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.accordion-group.active .accordion-toggle:focus {
-webkit-box-shadow: inset 0 0 2px 1px #31373E, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #31373E, inset 0 0 0 2px #00A4FD;
}
.accordion-group:not(.active) .accordion-toggle:hover {
background-color: #212527;
-webkit-box-shadow: none;
box-shadow: none;
}
.accordion-group:not(.active) .accordion-toggle:hover:focus {
-webkit-box-shadow: none;
box-shadow: none;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.accordion-group:not(.active) .accordion-toggle:hover:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.accordion-group:not(.active) .accordion-toggle:hover:focus {
-webkit-box-shadow: inset 0 0 2px 1px #212527, inset 0 0 0 2px #00A4FD;
box-shadow: inset 0 0 2px 1px #212527, inset 0 0 0 2px #00A4FD;
}
/* Heading Toggle Icon */
.icon-accordion-toggle {
position: absolute;
left: 10px;
}
/* Body */
.accordion-body {
background-color: #31373E;
}
.accordion-inner {
padding: 10px 20px 20px 20px;
border: none;
}
.accordion-inner:before,
.accordion-inner:after {
display: table;
content: "";
line-height: 0;
}
.accordion-inner:after {
clear: both;
}
.accordion-inner {
position: relative;
}
/*===============================================================================================*/
/* SPLUNK: CAROUSEL */
/*===============================================================================================*/
.carousel {
position: relative;
margin-bottom: 20px;
line-height: 1;
}
.carousel-inner {
overflow: hidden;
width: 100%;
position: relative;
}
.carousel-inner > .item {
display: none;
position: relative;
-webkit-transition: .6s ease-in-out left;
transition: .6s ease-in-out left;
}
/* Account for jankitude on images */
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
display: block;
line-height: 1;
}
.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
display: block;
}
.carousel-inner > .next,
.carousel-inner > .prev {
position: absolute;
top: 0;
width: 100%;
}
.carousel-inner > .next {
left: 100%;
}
.carousel-inner > .prev {
left: -100%;
}
.carousel-inner > .next.left,
.carousel-inner > .prev.right {
left: 0;
}
.carousel-inner > .active {
left: 0;
}
.carousel-inner > .active.left,
.carousel-inner > .active.right {
left: 100%;
}
/*************************************************************************************************/
/* LEFT/RIGHT CONTROLS FOR NAV */
/*************************************************************************************************/
.carousel-control {
position: absolute;
top: 40%;
left: 15px;
width: 40px;
height: 40px;
margin-top: -20px;
font-size: 60px;
font-weight: 100;
line-height: 30px;
color: #FFFFFF;
text-align: center;
background: #171D21;
border: 3px solid #FFFFFF;
border-radius: 23px;
opacity: 0.50;
/* we can't have this transition here */
/* because webkit cancels the carousel */
/* animation if you trip this while */
/* in the middle of another animation */
/* ;_; */
/* transition: opacity .2s linear; */
}
/* Reposition the right one */
.carousel-control.right {
left: auto;
right: 15px;
}
/* Hover/focus state */
.carousel-control:hover,
.carousel-control:focus {
color: #FFFFFF;
text-decoration: none;
opacity: 0.90;
}
/*************************************************************************************************/
/* CAROUSEL INDICATOR PIPS */
/*************************************************************************************************/
.carousel-indicators {
position: absolute;
top: 15px;
right: 15px;
z-index: 5;
margin: 0;
list-style: none;
}
.carousel-indicators li {
display: block;
float: left;
width: 10px;
height: 10px;
margin-left: 5px;
text-indent: -999px;
background-color: #C3CBD4;
background-color: rgba(255, 255, 255, .25);
border-radius: 5px;
}
.carousel-indicators .active {
background-color: #FFF;
}
/*************************************************************************************************/
/* CAPTION FOR TEXT BELOW IMAGES */
/*************************************************************************************************/
.carousel-caption {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 15px;
background: #3C444D;
background: rgba(0, 0, 0, .75);
}
.carousel-caption h4, .carousel-caption p {
color: #FFFFFF;
line-height: 20px;
}
.carousel-caption h4 {
margin: 0 0 5px;
}
.carousel-caption p {
margin-bottom: 0;
}
/* Utility classes */
/*===============================================================================================*/
/* SPLUNK: UTILITY CLASSES */
/*===============================================================================================*/
/* Quick floats */
.pull-right {
float: right;
}
.pull-left {
float: left;
}
/* Toggling content */
.hide {
display: none;
}
.show {
display: block;
}
/* Visibility */
.invisible {
visibility: hidden;
}
/* For Affix plugin */
.affix {
position: fixed;
}
/* Proxy mixin s */
.clearfix:before,
.clearfix:after {
display: table;
content: "";
line-height: 0;
}
.clearfix:after {
clear: both;
}
.hide-text {
font: 0/0 a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
position: absolute;
width: 0;
}
.input-block-level {
display: block;
width: 100%;
min-height: 32px;
/* Make inputs at least the height of their button counterpart (base line-height + padding + border) */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Makes inputs behave like true block-level elements */
}
/* 508 helper class - Hide only visually, but have it available for screenreaders */
.visuallyhidden {
clip: rect(0 0 0 0);
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
overflow: hidden;
border: 0;
}
/* Has to be last to override when necessary */
/* 3rd party */
/*===============================================================================================*/
/* SPLUNK: JQUERY UI THEME */
/*===============================================================================================*/
/* generic widgets */
/* --------------- */
.ui-widget {
font-family: inherit;
}
.ui-widget-header {
font-weight: normal;
background: transparent;
border: 0;
color: #FFFFFF;
}
.ui-widget-header a {
color: #000000;
}
.ui-corner-all {
border-radius: 2px;
}
.ui-icon {
font-family: "Splunk Icons";
width: 20px;
height: 20px;
}
/* Tabs */
/* ----------- */
/*jq-ui adds background to tabs which is shared by other components*/
.ui-tabs .ui-widget-header {
background: none;
border-bottom:1px solid #171D21;
border-radius: 0;
}
/* override default tabs borders */
.ui-tabs .ui-tabs-nav li {
border-bottom: 1px solid #171D21 !important; /*need important to override jq-ui bs*/
margin-bottom:-1px;
}
/* selected state */
.ui-tabs .ui-tabs-nav li.ui-tabs-selected {
border-bottom:1px solid #171D21 !important; /*need important to override the other important*/
}
/* Accordiion */
/* ------------ */
.ui-accordion .ui-accordion-header .ui-icon {
left: 0.5em;
margin-top: -8px;
position: absolute;
top: 50%;
}
.ui-accordion-icons .ui-accordion-header a {
padding-left: 2.2em;
}
/* Datepicker */
/* ------------- */
#ui-datepicker-div {
display:none; /* jquery ui adds this id by default ;_; */
z-index: 1070 !important; /* need to override jquery inline z-index nonsense ;_; */
}
.ui-datepicker {
background-color: #31373E;
border: 1px solid #000000;
-webkit-box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.5);
box-shadow: 1px 4px 5px rgba(0, 0, 0, 0.5);
border-radius: 2px;
top: 100%;
left: 50%;
margin: 8px 0 0 -103px;
display: none;
position: absolute;
z-index: 1059;
white-space: normal;
}
/* placement of arrow */
.ui-datepicker .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-top: 0;
border-bottom-color: #000000;
top: -8px;
left: 50%;
margin-left: -4px;
}
/* generated arrow */
.ui-datepicker .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-top: 0;
border-bottom-color: #31373E;
top: 1px;
left: -8px;
}
/* prevent inheriting nowrap from btn-group */
.ui-datepicker.up {
margin-top: 0;
}
/* placement of arrow */
.ui-datepicker.up > .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-bottom: 0;
border-top-color: #000000;
top: auto;
bottom: -8px;
}
.ui-datepicker.up > .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-bottom: 0;
border-top-color: #31373E;
top: auto;
bottom: 1px;
}
.ui-datepicker.right { /* point left */
margin-left: 5px;
margin-top: 0;
}
/* placement of arrow */
.ui-datepicker.right .arrow {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-left: 0;
border-right-color: #000000;
top: 50%;
left: -8px;
margin: -8px 0 0 0;
}
.ui-datepicker.right .arrow:before {
position: absolute;
height: 0;
width: 0;
border: 8px solid transparent;
content: "";
display: block;
border-left: 0;
border-right-color: #31373E;
top: 50%;
left: 1px;
margin: -8px 0 0 0;
}
/* position of arrow when floated right */
.ui-datepicker.pull-right .arrow {
left: auto;
right: 8px;
}
/* open state */
.ui-datepicker.open {
display: block;
}
.ui-datepicker {
background-color: #31373E;
width: 17em;
height: auto;
position: relative;
padding: 5px;
margin: 0;
}
.ui-datepicker .ui-datepicker-header {
position: relative;
padding: 0.2em 0;
background: transparent;
}
/* header */
.ui-datepicker .ui-datepicker-title {
margin: 0 2.3em;
line-height: 32px;
text-align: center;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
position: absolute;
text-decoration: none;
}
.ui-datepicker .ui-datepicker-prev .ui-icon,.ui-datepicker .ui-datepicker-next .ui-icon{
font: 0/0 a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
position: absolute;
width: 0;
left: 0;
/* override hide-text for ie-7 */
}
.ui-datepicker .ui-datepicker-prev .ui-icon:after, .ui-datepicker .ui-datepicker-next .ui-icon:after {
display: block;
position: absolute;
top: 0;
left: 0;
text-align: center;
width: 32px;
line-height: 32px;
color: #FFFFFF;
text-indent: 0;
font-size: 12px;
font-family: "Splunk Icons";
}
/* prev-next */
.ui-datepicker .ui-datepicker-prev .ui-icon:after {
content: "\25C0";
}
.ui-datepicker .ui-datepicker-next {
top: 0;
right: 0;
}
.ui-datepicker .ui-datepicker-next .ui-icon:after {
content: "\25B6";
}
.ui-datepicker table {
margin-bottom: 0;
width: 100%;
border-collapse: collapse;
margin: 0 0 0.4em;
}
.ui-datepicker .ui-datepicker-calendar {/* table */
margin: 0;
}
.ui-datepicker .ui-datepicker-calendar th {
line-height: 10px;
padding: 0.7em 0.3em;
padding-top: 20px;
color: #C3CBD4;
text-align: center;
border: 0;
font-weight: normal;
}
.ui-datepicker .ui-datepicker-calendar td {
padding: 1px;
}
.ui-datepicker .ui-datepicker-calendar td a {
display: block;
padding: 0.2em;
text-align: right;
color: #FFFFFF;
}
.ui-datepicker .ui-datepicker-calendar a {
border: 1px solid #171D21;
}
.ui-datepicker .ui-datepicker-calendar a:hover {text-decoration: none;}
.ui-datepicker .ui-datepicker-calendar .ui-state-default {
background: #31373E;
border:1px solid #3C444D;
color: #FFFFFF;
}
.ui-datepicker .ui-datepicker-calendar .ui-state-active {
background-color: #C3CBD4;
border-color: #007ABD;
color: #006EAA;
}
.ui-datepicker .ui-datepicker-calendar .ui-state-hover {
border-color: #00A4FD;
background: #C3CBD4;
color: #006EAA;
}
/* calendar */
.ui-datepicker a.ui-corner-all {
display: inline-block;
padding: 5px 14px; /* note the vertical padding will be funky unless it's block, inline-block, or floated */
border-radius: 3px;
background-color: none;
border-color: transparent;
color: #FFFFFF;
-webkit-box-shadow: none;
box-shadow: none;
text-decoration: none;
text-shadow: none;
-webkit-transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s;
transition: background 0.2s, border 0.2s, box-shadow 0.2s, text-decoration 0.2s, -webkit-box-shadow 0.2s, -webkit-text-decoration 0.2s;
-webkit-filter: none;
filter: none;
}
.ui-datepicker a.ui-corner-all:hover {
color: #00A4FD;
text-decoration: none;
}
.ui-datepicker a.ui-corner-all:focus {
color: #00A4FD;
text-decoration: underline;
-webkit-box-shadow: 0 0 1px 2px #00A4FD;
box-shadow: 0 0 1px 2px #00A4FD;
border-collapse: separate;
/* Fix IE9 Issue with box-shadow */
outline: 0;
text-decoration: none;
}
.ui-datepicker a.ui-corner-all:focus:active:not([disabled]) {
-webkit-box-shadow: none;
box-shadow: none;
}
.ui-datepicker a.ui-corner-all:active, .ui-datepicker a.ui-corner-all.active {
color: #00A4FD;
text-decoration: none;
}
.ui-datepicker a.ui-corner-all.disabled,
.ui-datepicker a.ui-corner-all[disabled],
.ui-datepicker a.ui-corner-all.disabled:hover,
.ui-datepicker a.ui-corner-all[disabled]:hover,
.ui-datepicker a.ui-corner-all.disabled:focus,
.ui-datepicker a.ui-corner-all[disabled]:focus,
.ui-datepicker a.ui-corner-all.disabled:active,
.ui-datepicker a.ui-corner-all[disabled]:active {
color: #5C6773;
text-decoration: none;
cursor: not-allowed;
}
.ui-datepicker a.ui-corner-all {
width: 32px;
height: 32px;
text-align: center;
padding:0;
}
.ui-datepicker a.ui-corner-all:hover {
cursor: pointer; /* ensure pointer if missing href */
color: #006EAA;
background: #F7F8FA;
font-weight: normal;
}
.ui-datepicker a.ui-corner-all:hover .ui-icon:after {
color: #006EAA;
}
/* .ui-datepicker */
/*
* jQuery UI Resizable $VERSION
*
* Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*
* http://docs.jquery.com/UI/Resizable#theming
*/
.ui-resizable { position: relative;}
.ui-resizable-handle { position: absolute;font-size: 0.1px;z-index: 99999; display: block; }
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; }
.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; }
.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; }
.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; }
.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; }
.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }
.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }
.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}
.ui-resizable-handle {
width: 100%;
height: 9px;
background-color: transparent;
z-index: 1000;
cursor: ns-resize;
cursor: row-resize;
bottom: 0;
}
.ui-resizable-handle:before {
content: "";
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
margin-top:-1px;
display: block;
border-radius: 3px;
border: none;
height: 6px;
width: 6px;
background-color: rgba(0, 0, 0, 0.25);
}
.ui-resizable-handle:hover {
/* .gradient-vertical($interactiveGradientStartColorHover, $interactiveGradientEndColorHover); */
}
.ui-resizable-handle .ui-draggable-dragging {
position: relative;
}
.ui-resizable:hover .ui-resizable-handle {
visibility: visible;
}