eg.
- You can skip the "-stc" suffix on non-clashing classes.
eg.
*/
/*
--- DEPENDENT INCLUDES ---
The order and/or setup of the following includes is significant.
Please do not re-order or change.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
/*
legacy.scss
This file contains legacy CSS. Please do not add any additional CSS to
this file if possible as it will be phased out eventually.
It is included by the main btms.scss file.
.style-legacy is a class that wraps all these legacy declarations. These
declarations only apply to the headers and footer of the site but they
are so intertwined this its hard to pull out just the header and
footer specific declarations.
More idiomatic versions of this styling lives in navigation.scss. That
works well but mobile isnt complete.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
.style-legacy {
/*
--------------------------------------------------------
# MIXINS (BEGIN)
*/
/*
## MARGIN
*/
/*
## PADDING
*/
/*
## PSEUDO CLASSES - GENERAL
*/
/*
## PSEUDO CLASSES - LINKS
*/
/*
# MIXINS (END)
--------------------------------------------------------
*/
/*
--------------------------------------------------------
# OBJECT CLASSES
NOTE: To be used in @extend calls but not actually
applied to page elements
*/
/*
# OBJECT CLASSES (END)
--------------------------------------------------------
*/
/*
--------------------------------------------------------
# PLACEHOLDERS (BEGIN)
*/
/*
# PLACEHOLDERS (END)
--------------------------------------------------------
*/
/*
--------------------------------------------------------
# STATE / CONDITION CLASSES (BEGIN)
*/
/*
# STATE / CONDITION CLASSES (END)
--------------------------------------------------------
*/
/*
--------------------------------------------------------
# UTILITY CLASSES (BEGIN)
*/
/*
# UTILITY CLASSES (END)
--------------------------------------------------------
*/
/*
--------------------------------------------------------
# HTML ELEMENT CLASSES (BEGIN)
*/
/*
## BODY
*/
/*
# HTML ELEMENT CLASSES (END)
--------------------------------------------------------
*/
/*
--------------------------------------------------------
# SITE HEADER (BEGIN)
*/
/*
## HEADER / FOOTER SEARCH BOX
*/
/*
## HEADER USER MENU
*/
/*
## HEADER COMPANY LOGO
*/
/*
## HEADER WEBSITE MAIN MENU
*/
/*
# SITE HEADER (END)
--------------------------------------------------------
*/
/*
# SITE FOOTER (BEGIN)
*/
/*
# SITE FOOTER (END)
--------------------------------------------------------
*/
/*
# reports
--------------------------------------------------------
*/
}
.style-legacy .o-header, .style-legacy .c-header-top, .style-legacy .c-header-bottom {
border-radius: 0rem;
margin-top: 0rem;
margin-bottom: 0rem;
}
.style-legacy .o-menu, .style-legacy .c-usermenu-dropdown, .style-legacy .c-sitemenu-group-entries {
background-color: #fff !important;
border-radius: 0px;
transition: width 2s, height 4s;
}
@media only screen and (min-width: 768px) {
.style-legacy .o-menu, .style-legacy .c-usermenu-dropdown, .style-legacy .c-sitemenu-group-entries {
border: 1px solid #3399cc;
border-top: none;
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
}
}
@media only screen and (min-width: 768px) {
.style-legacy .o-menu-caret:hover::after, .style-legacy .has-dropdown-menu:hover::after {
border-color: transparent transparent #fff transparent;
border-style: solid;
border-width: 0 7px 7px 7px;
bottom: 0;
content: "";
height: 0;
left: 50%;
position: absolute;
transform: translate(-50%, 0);
width: 0;
z-index: 9999;
}
}
.style-legacy .o-menu-entry, .style-legacy .c-usermenu-entries__entry, .style-legacy .c-sitemenu-group-entries__entry {
color: #3496d2 !important;
font-size: 16px;
padding: 9px 20px !important;
transition: all 0.3s ease;
}
.style-legacy .o-mobile-menu-toggle, .style-legacy .c-usermenu-toggle, .style-legacy .c-sitemenu-toggle {
color: #fff;
}
.style-legacy .o-mobile-menu-toggle:hover, .style-legacy .c-usermenu-toggle:hover, .style-legacy .c-sitemenu-toggle:hover, .style-legacy .o-mobile-menu-toggle:focus, .style-legacy .c-usermenu-toggle:focus, .style-legacy .c-sitemenu-toggle:focus, .style-legacy .o-mobile-menu-toggle:active, .style-legacy .c-usermenu-toggle:active, .style-legacy .c-sitemenu-toggle:active {
background-color: #3496d2 !important;
}
.style-legacy .o-header, .style-legacy .c-header-top, .style-legacy .c-header-bottom, .style-legacy .c-searchbox, .style-legacy .c-searchbox__input, .style-legacy .c-searchbox__input:hover, .style-legacy .c-searchbox__input:focus, .style-legacy .c-searchbox__input:active, .style-legacy .c-searchbox__button, .style-legacy .c-logo, .style-legacy .c-sitemenu-container, .style-legacy .c-sitemenu-group__group-name {
border: none !important;
}
.style-legacy .c-searchbox, .style-legacy .c-searchbox__input:hover, .style-legacy .c-searchbox__input:focus, .style-legacy .c-searchbox__input:active, .style-legacy .c-logo, .style-legacy .c-sitemenu-group__btn-responsive, .style-legacy .c-sitemenu-group__btn-responsive:active {
box-shadow: none !important;
}
.style-legacy .u-background-curious-blue {
background-color: #3496d2 !important;
}
.style-legacy .u-background-white {
background-color: #fff !important;
}
.style-legacy .u-text-overflow {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 100%;
display: block;
}
.style-legacy .u-text-nowrap-hidden {
overflow: hidden;
white-space: nowrap;
}
@media only screen and (min-width: 992px) {
.style-legacy ul.nav li.dropdown:hover > ul.dropdown-menu {
display: block;
}
}
.style-legacy .c-header-top {
background-color: #01000b;
}
.style-legacy .c-header-top *::-webkit-input-placeholder {
color: #eaedf1;
}
.style-legacy .c-header-top *:-moz-placeholder {
color: #eaedf1;
}
.style-legacy .c-header-top *::-moz-placeholder {
color: #eaedf1;
}
.style-legacy .c-header-top *:-ms-input-placeholder {
color: #eaedf1;
}
.style-legacy .c-header-bottom {
background-color: #3b586f;
}
.style-legacy header form.c-searchbox {
margin: 0;
}
.style-legacy .navbar .container {
width: 100%;
padding: 0 30px;
max-width: 100% !important;
}
.style-legacy .navbar-collapse {
padding: 0 !important;
}
@media only screen and (max-width: 767px) {
.style-legacy .navbar-collapse {
margin: 0 -15px;
padding: auto !important;
}
.style-legacy .navbar-collapse .navbar-nav {
margin-top: 7.5px;
margin-left: 0 !important;
margin-right: 0;
margin-bottom: 7.5px;
}
.style-legacy .navbar-collapse .navbar-nav .c-sitemenu-group__group-name {
padding: 15px !important;
}
.style-legacy .navbar-collapse .navbar-nav .c-sitemenu-group-entries__entry {
padding: 7.5px 15px 7.5px 25px !important;
}
.style-legacy .navbar-collapse .navbar-nav .glyphicon {
font-size: 18px;
}
}
.style-legacy .c-searchmenu-container {
padding: 0;
margin: 0;
}
@media only screen and (max-width: 991px) {
.style-legacy .c-searchmenu-container input {
min-height: 32px;
height: 32px;
max-height: 32px;
}
.style-legacy .c-searchmenu-container button {
font-size: 10px;
height: 32px;
min-height: 32px;
max-height: 32px;
}
}
.style-legacy .footer-container .c-searchbox, .style-legacy .c-footer .c-searchbox {
width: 275px;
}
.style-legacy .c-searchbox {
margin-top: 8px;
margin-bottom: 8px;
}
.style-legacy .c-searchbox__input {
border-radius: 7px !important;
background-color: #9dacb7;
color: #eaedf1;
height: 36px;
max-height: 36px;
min-height: 36px;
min-width: 200px;
border-right: 0rem;
border-top-right-radius: 0rem !important;
border-bottom-right-radius: 0rem !important;
color: #eaedf1;
}
.style-legacy .c-searchbox__input::placeholder {
color: #eaedf1;
opacity: .7;
}
@media only screen and (max-width: 767px) {
.style-legacy .c-searchbox__input {
width: calc(100% - 43px);
float: left;
}
}
.style-legacy .c-searchbox__button {
border-radius: 0px 7px 7px 0px;
background-color: #9dacb7;
color: #fff;
height: 36px;
max-height: 36px;
min-height: 36px;
}
.style-legacy .c-searchbox__button:hover, .style-legacy .c-searchbox__button:focus, .style-legacy .c-searchbox__button:active {
background-color: #9dacb7;
color: #fff;
}
.style-legacy .c-usermenu-container {
border: none;
}
.style-legacy .c-usermenu {
position: relative;
}
@media only screen and (min-width: 768px) {
.style-legacy .c-usermenu:hover, .style-legacy .c-usermenu:focus, .style-legacy .c-usermenu:active {
background-color: #34333c;
}
}
.style-legacy .c-usermenu-entries {
margin-right: -15px;
}
.style-legacy .c-usermenu-entries .quicklink > a {
color: #bcced7;
padding: 15px 10px;
}
.style-legacy .c-usermenu-entries .quicklink:hover > a {
color: white;
}
.style-legacy .c-usermenu-entries .quicklink .badge {
background: red;
color: #FFF;
font-size: 7px;
font-weight: bold;
position: absolute;
top: 9px;
right: -2px;
z-index: 598;
min-height: 8px;
padding: 5px;
}
@media only screen and (max-width: 767px) {
.style-legacy .c-usermenu-entries {
margin-top: 0px;
margin-bottom: 0px;
}
.style-legacy .c-usermenu-entries .quicklink {
float: left;
}
}
.style-legacy .c-usermenu-username {
color: #fff !important;
background-color: transparent !important;
}
.style-legacy .c-usermenu-username:hover, .style-legacy .c-usermenu-username:focus, .style-legacy .c-usermenu-username:active {
color: #fff !important;
}
.style-legacy .c-usermenu-toggle {
float: left;
width: 44px;
}
.style-legacy .c-logo-container {
padding: 0;
}
.style-legacy .c-logo-container img {
margin-top: 8px;
max-height: 34px;
}
@media only screen and (max-width: 767px) {
.style-legacy .c-logo-container {
text-align: center;
}
}
.style-legacy .c-logo {
margin: 8px !important;
}
@media only screen and (min-width: 768px) {
.style-legacy .c-logo {
padding-left: 0rem;
margin: 8px !important;
}
}
@media only screen and (max-width: 767px) {
.style-legacy .c-logo {
text-align: center;
}
}
.style-legacy .c-logo img {
max-height: 38px;
}
.style-legacy .c-logo-mobile {
width: 100%;
text-align: center;
margin-top: 8px;
}
.style-legacy .c-logo-mobile img {
max-height: 38px;
}
.style-legacy .c-sitemenu-container .c-sitemenu {
margin-left: -15px;
}
@media only screen and (max-width: 767px) {
.style-legacy .c-sitemenu-group {
clear: both;
}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.style-legacy .c-sitemenu-group:hover .dropdown-menu {
display: block;
}
}
@media only screen and (max-width: 767px) {
.style-legacy .c-sitemenu-group:hover {
background: none;
}
.style-legacy .c-sitemenu-group:hover > a {
background: none;
}
}
.style-legacy .c-sitemenu-group__btn-responsive {
background-color: transparent;
border: none;
color: #fff;
font-size: 2rem;
line-height: 20px;
margin: 0px;
padding-bottom: 10px;
padding-top: 10px;
}
@media only screen and (max-width: 767px) {
.style-legacy .c-sitemenu-group__btn-responsive {
float: right;
}
}
.style-legacy .c-sitemenu-group__group-name {
color: #bcced7 !important;
border-radius: 0px;
font-size: 16px;
font-weight: 700;
}
@media only screen and (max-width: 991px) {
.style-legacy .c-sitemenu-group__group-name {
font-size: 14px;
padding: 15px 7px;
}
}
@media only screen and (max-width: 767px) {
.style-legacy .c-sitemenu-group__group-name {
color: #fff !important;
background-color: transparent !important;
float: left;
}
}
@media only screen and (min-width: 768px) {
.style-legacy .c-sitemenu-group__group-name:hover {
color: #fff !important;
background-color: #3496d2 !important;
}
}
@media only screen and (max-width: 767px) {
.style-legacy .c-sitemenu-group-entries {
clear: both;
}
}
.style-legacy .c-sitemenu-toggle {
height: 40px;
}
.style-legacy .c-sitemenu-toggle__iconbar {
background-color: #fff !important;
}
.style-legacy footer .footer-container, .style-legacy footer .container {
box-sizing: border-box;
width: 100% !important;
}
.style-legacy .c-footer {
padding-top: 1rem;
padding-bottom: 1rem;
background-color: #3b586f;
color: #fff;
}
.style-legacy .c-footer *::-webkit-input-placeholder {
color: #eaedf1;
}
.style-legacy .c-footer *:-moz-placeholder {
color: #eaedf1;
}
.style-legacy .c-footer *::-moz-placeholder {
color: #eaedf1;
}
.style-legacy .c-footer *:-ms-input-placeholder {
color: #eaedf1;
}
.style-legacy .c-footer .container {
width: 100% !important;
max-width: 100%;
}
.style-legacy .c-footer__copyright {
padding-top: 1rem;
padding-bottom: 1rem;
list-style: none;
text-align: center;
}
@media only screen and (min-width: 768px) {
.style-legacy .c-footer__copyright {
padding-top: 0rem;
padding-bottom: 0rem;
text-align: left;
}
}
.style-legacy .c-footer-logo {
text-align: center;
}
.style-legacy .c-footer-logo img {
max-height: 41px;
}
@media only screen and (min-width: 768px) {
.style-legacy .c-footer-logo {
text-align: right;
}
}
.style-legacy .table-action-bar .container, .style-legacy .breadcrumb-wrap .container {
width: 100% !important;
max-width: 100% !important;
}
.compact-stc {
/*
select2.scss
This file is for any select2 CSS styles.
It is included by the main btms.scss file.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
/*
This stops the quick flash when a native selectbox is shown and
then replaced by a select2 input when javascript kicks in.
*/
/*
This makes the select2 clear selection
arrow larger and red
*/
}
.compact-stc select.js-select2-single, .compact-stc select.js-select2-multiple {
background-color: #fff;
border-color: #999999;
color: #fff;
height: 22px;
}
.compact-stc span.select2-selection__clear {
font-size: 2rem;
color: #a94442;
}
.compact-stc .select2-container--default .select2-selection--single {
height: 22px;
border-color: #999;
}
.compact-stc .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 20px;
}
.compact-stc .select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 20px;
}
.compact-stc .select2-container--default .select2-selection--multiple {
border-color: #999;
background: #fbfcfd;
font-size: 12px;
min-height: 22px;
}
.compact-stc .select2-container--default .select2-selection--multiple.js-select2-multiple-empty {
height: 22px !important;
font-size: 14px;
margin-top: -2px;
font-weight: 500;
}
.compact-stc .select2-container--default .select2-selection--multiple.js-select2-multiple-empty .select2-search__field {
margin-top: 1px !important;
}
.compact-stc .select2-container--default .select2-selection--multiple input.select2-search__field::-webkit-input-placeholder {
font-weight: 440;
color: #999;
}
.compact-stc .slider-container span.begin {
margin-right: 20px;
}
.compact-stc .slider-container span.end {
margin-left: 20px;
}
.compact-stc .slider-container.yes .slider.slider-horizontal .slider-track .slider-selection {
background: #48ba6d !important;
}
.compact-stc .slider-container.no .slider.slider-horizontal .slider-track .slider-selection {
background: #c33b2c !important;
}
.compact-stc .slider-container.slider-container-neutral.yes .slider.slider-horizontal .slider-track .slider-selection {
background: #48ba6d !important;
}
.compact-stc .slider-container.slider-container-neutral.no .slider.slider-horizontal .slider-track .slider-selection {
background: #48ba6d !important;
}
.compact-stc .slider-container.disabled .slider.slider-horizontal .slider-track.yes .slider.slider-horizontal .slider-track .slider-selection {
background: #48ba6d !important;
}
.compact-stc .slider-container.disabled .slider.slider-horizontal .slider-track.no .slider.slider-horizontal .slider-track .slider-selection {
background: #48ba6d !important;
}
.compact-stc .slider-container.disabled .slider.slider-horizontal .slider-track .slider-handle {
display: none !important;
}
.compact-stc .slider-container .slider.slider-horizontal {
width: 38px !important;
height: 22px;
margin: auto;
}
.compact-stc .slider-container .slider.slider-horizontal .slider-track {
height: 100%;
border-radius: 11px;
margin-top: -11px;
}
.compact-stc .slider-container .slider.slider-horizontal .slider-track .slider-selection {
background: #b5c0ca !important;
left: -13px !important;
width: 62px !important;
height: 100%;
border-radius: 11px;
box-shadow: none;
-webkit-box-shadow: none;
}
.compact-stc .slider-container .slider.slider-horizontal .slider-track .slider-handle {
opacity: 1;
width: 18px;
height: 18px;
background: #fff;
position: absolute;
content: '';
-webkit-border-radius: 9px;
border-radius: 9px;
top: 50%;
margin-top: -9px;
right: 3px;
-webkit-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
pointer-events: none;
}
/*
--- INCLUDES ---
The order of these includes does not matter.
Please sort alphabetically.
*/
.ui-dialog .sizzle {
font-size: 1em;
}
.ui-dialog .sizzle .btn-block {
width: 100% !important;
}
.ui-dialog .sizzle .text-right {
text-align: right;
}
.ui-dialog .sizzle .flex {
display: flex;
clear: both;
width: 100%;
}
.ui-dialog .sizzle .row .col {
flex: 1;
box-sizing: border-box;
padding: 2.5px;
}
.ui-dialog .sizzle .row .col small {
display: block;
line-height: 20px;
}
.ui-dialog .sizzle .row .col:last-of-type {
padding-top: 22.5px;
}
.ui-dialog .sizzle .row:not(:first-of-type) .col small {
display: none;
}
.ui-dialog .sizzle .row:not(:first-of-type) .col:last-of-type {
padding-top: 2.5px;
}
.ui-dialog .sizzle button, .ui-dialog .sizzle input, .ui-dialog .sizzle select {
font-size: 1em;
}
.ui-dialog .sizzle button.error, .ui-dialog .sizzle input.error, .ui-dialog .sizzle select.error {
border: 1px solid red;
}
.ui-dialog .sizzle a {
color: #337ab7 !important;
text-decoration: underline;
}
.ui-dialog .sizzle input {
height: 30px;
background: #fbfcfd;
border: 1px solid #999999;
border-radius: 4px;
padding: 0px 6px;
}
.ui-dialog .sizzle .form-control-static {
line-height: 32px;
}
.ui-dialog .sizzle button.btn {
height: 32px;
border: 0;
padding: 5px 20px !important;
margin-bottom: 4px;
}
.ui-dialog .sizzle button.btn:disabled {
background: #c8c8c8 !important;
background-color: #c8c8c8 !important;
color: #FFF !important;
border-color: #c3c3c3 !important;
}
.ui-dialog .sizzle select {
height: 32px;
color: gray;
min-width: 100%;
width: auto;
}
.ui-dialog .sizzle div.row:first-of-type div.strike:before {
top: 59%;
}
.ui-dialog .sizzle div.strike:before {
top: 40%;
}
/*
form-inline-stc.scss
Special variation on the stock bootstrap form-inline class.
It has these modifications:
- An explicit percentage width for inputs; this allows for control
of the input's width via the bootstrap col- classes, something not
possible with the stock form-inline class.
- No padding-right on divs with col-* classes
The goal of collection of classes is to create inline inputs and labels that
can also have explicit input widths vs. the 'width: auto' that
the stock Bootstrap form-inline class applies.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
@media only screen and (min-width: 768px) {
.form-inline-stc label {
display: inline-block;
}
.form-inline-stc input {
display: inline-block;
width: 77%;
}
.form-inline-stc .select2 {
width: 76% !important;
}
.form-inline-stc div[class^="col-"] {
padding-right: 0px;
}
}
/*
html.scss
This file is for any CSS styles that need to be applied
to HTML entites.
It is included by the main btms.scss file.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
body {
background-color: #e4e8ec;
}
input[readonly], select[readonly] {
background-color: #eeeeee !important;
border: 0.5px solid #737373;
box-shadow: unset;
}
/*
stc.scss
This file contains more single-purpose styles. Often, these
are needed on a specific page or section of the app vs. the
styles in the main btms.scss file, which are meant to apply
globally.
When possible, please note the use case for each class.
It is included by the main btms.scss file.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
/*
Purpose: Explicit styles for the borders around inputs. Used to style
elements with the same border as an input.
Used: LTL Quoteform (Sizzle version)
*/
.border-stc {
border: 1px solid #999999;
border-radius: 4px;
}
/*
Purpose: Creates inline form for the following scenario:
LABEL: [ input ]
LABEL: [ input ] LABEL: [ input ]
LABEL: [ input ]
For the above, labels are in one column and the inputs are
in their own column. For the second line (with input/label/input where
the other rows only have an input), sizing and spacing the input and labels
is very difficult due to the way Bootstrap handles inline forms. This CSS
alleviates that problem by setting widths on each element in a reusable way.
*/
.form-thirds-stc .first-third {
float: left;
width: 33%;
}
.form-thirds-stc .second-third {
float: left;
padding-right: 3px;
text-align: right;
width: 33%;
}
.form-thirds-stc .final-third {
float: left;
width: 33%;
}
/*
Purpose: Makes elements with the TBS .label class look better
with our compact forms.
Used: Adjustments
*/
.label-heading-stc {
font-size: 50%;
margin-left: 1em;
padding: 0.1em 0.5em 0.2em;
}
/*
utility.scss
This file contains utility CSS classes.
It is included by the main btms.scss file.
*/
/*
variables.scss
This file is for any CSS variables that need to be
used by SASS.
It is included by the main btms.scss file.
*/
/*
COLORS
Generate color names using:
http://chir.ag/projects/name-that-color/
*/
/*
Bootstrap Colors
Use when you need to reference the color code
for a default Bootstrap class (i.e., text-danger)
*/
/*
RESPONSIVE VARIABLES
*/
/*
HTML ENTITY VARIABLES
*/
/*
DIMENSION VARIABLES
*/
.background-white {
background-color: #fff;
}
.background-transparent {
background-color: transparent !important;
}
.cursor-pointer, .clickable {
cursor: pointer;
}
.display-inline {
display: inline;
}
.display-none {
display: none;
}
.font-weight-bold {
font-weight: bold;
}
.full-width {
width: 100% !important;
}
.italic {
font-style: italic;
}
.left-indent {
padding-left: 4rem !important;
}
.margin-top {
margin-top: 20px;
}
.margin-top-sm {
margin-top: 10px;
}
.min-height-500px {
min-height: 500px;
}
.no-padding {
padding: 0px;
}
.no-underline-on-hover:hover {
text-decoration: none;
}
.pad {
padding: 4px;
}
.pad-lg {
padding: 1rem 2rem;
}
.text-decoration-underline {
text-decoration: underline;
}
.word-break-all {
word-break: break-all;
max-width: 90%;
}
.position-relative {
position: relative;
}
.smarty-ui {
display: none;
}
.style-modern .date > .input-group-addon {
cursor: pointer;
}
.style-modern .wrapper-white {
background-color: #fff;
}
.style-modern .margin-bottom {
margin-bottom: 50px !important;
}
.style-modern .margin-bottom-sm {
margin-bottom: 10px !important;
}
.style-modern .mb-0 {
margin-bottom: 0 !important;
}
.style-modern .m-05 {
margin: 0.5rem !important;
}
.style-modern .mb-05 {
margin-bottom: 0.5rem !important;
}
.style-modern .mt-05 {
margin-top: 0.5rem !important;
}
.style-modern .mb-1 {
margin-bottom: 1rem !important;
}
.style-modern .mt-1 {
margin-top: 1rem;
}
.style-modern .my-5 {
margin-top: 3rem !important;
margin-bottom: 3rem !important;
}
.style-modern .pt-1 {
padding-top: 1rem;
}
.style-modern h1.page-title {
font-size: 30px;
}
.style-modern .page-title {
margin: 10px 0 10px;
}
.style-modern .glyphicon-large-stc {
font-size: 1.3em;
}
.style-modern .table-stc thead > tr > th {
background-color: #b5c0ca;
padding: 3px;
text-align: center;
}
.style-modern .table-stc thead > tr > th > a {
display: block;
background: #d3d9df;
border: 1px solid #adb4ba;
padding: 3px 6px;
border-radius: 5px;
text-transform: uppercase;
font-size: 10px;
color: #000000;
}
.style-modern .table-stc thead > tr > th > a > img {
margin-left: 5px;
}
.style-modern .table-stc thead > tr > th > a:hover {
color: #23527c;
text-decoration: none;
}
.style-modern .panel-stc {
border-radius: 10px;
}
.style-modern .panel-stc.panel-stc-tabs {
border-top-left-radius: 0;
}
.style-modern .panel-stc .panel-heading {
border: 0;
background-color: #fff;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
padding-bottom: 0px;
}
.style-modern .panel-stc .panel-heading .panel-title {
font-size: 20px;
font-weight: 300;
}
.style-modern .panel-stc h3 {
padding-bottom: 1rem;
border-bottom: 1px solid #726f68;
font-size: 19px;
margin-top: 10px;
font-weight: bold;
}
.style-modern .panel-stc .panel-title a {
color: #337ab7;
font-size: 14px;
line-height: 1.5em;
}
.style-modern .list-stc-landing ul {
list-style-type: none;
padding-left: 15px;
}
.style-modern .list-stc-landing ul li::before {
content: "\002022";
color: #337ab7;
padding-right: 7px;
}
.style-modern .list-stc-landing ul.two-column-list li {
display: inline-block;
width: 49%;
}
.style-modern .navbar .container {
width: 100%;
}
.style-modern #topbanner {
height: auto;
}
.style-modern #top-banner .tms-container,
.style-modern #top-menu .tms-container {
width: 100% !important;
}
.style-modern #top-banner #top-menu-logo,
.style-modern #top-menu #top-menu-logo {
padding-left: 15px;
}
.style-modern .nav-tabs-stc {
margin-bottom: -1px;
}
.style-modern .nav-tabs-stc > li > a {
border-radius: 10px 10px 0 0;
margin-right: 5px;
background: #efefef;
}
.style-modern .nav-tabs-stc > li > a:hover {
background: #f3f3f3;
border-bottom-color: #f3f3f3;
}
.style-modern .nav-tabs-stc > li.active > a {
background: #fff !important;
}
.style-modern .nav-tabs-stc > li.active > a:hover {
border-bottom-color: #fff;
}
.style-modern .list-inline-stc {
margin: 20px 0;
}
.style-modern .list-inline-stc li {
margin-right: 15px;
}
.style-modern .list-inline-stc li:first-child {
padding-left: 0;
}
.style-modern hr {
border-top: 1px solid #eeeeee;
margin: 10px 0;
}
.style-modern .compact-stc input[type="text"],
.style-modern .compact-stc input[type="number"],
.style-modern .compact-stc input[type="email"],
.style-modern .compact-stc select {
height: 22px !important;
}
.style-modern .compact-stc textarea,
.style-modern .compact-stc input[type="text"],
.style-modern .compact-stc input[type="number"],
.style-modern .compact-stc input[type="email"] {
border: 1px solid #999999;
background: #fbfcfd;
}
.style-modern .compact-stc .checkbox-lg-stc input[type="checkbox"] {
transform: scale(1.5);
margin-top: 2px;
}
.style-modern .compact-stc .form-horizontal .control-label {
padding-top: 1px;
}
.style-modern .compact-stc .form-horizontal .checkbox,
.style-modern .compact-stc .form-horizontal .radio {
min-height: 20px;
padding-top: 1px;
}
.style-modern .compact-stc .form-horizontal .checkbox-inline,
.style-modern .compact-stc .form-horizontal .radio-inline {
padding-top: 1px;
}
.style-modern .compact-stc .form-group {
margin-bottom: 3px;
}
.style-modern .compact-stc .form-control-zip-stc {
width: 89px;
}
.style-modern .compact-stc input[type="text"].form-control, .style-modern .compact-stc select.form-control {
padding: 1px 6px;
}
.style-modern .compact-stc .form-inline .form-group {
margin-right: 15px;
}
.style-modern .compact-stc .input-group-addon {
padding: 2px 6px;
}
.style-modern label.required:before {
color: red;
content: "*";
}
.popover {
max-width: 400px;
}
#nmfc_tooltip_contents a {
color: #337ab7 !important;
}
.nmfc_description {
padding: 6px 0;
text-align: left;
}
.nmfc_sub_container {
margin: 4px 0;
padding: 6px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.nmfc_sub_row {
padding: 4px 0;
}
.nmfc_sub_row:hover {
background-color: #f8f9fa;
}
.nmfc_sub_desc {
text-align: left;
}
.nmfc_sub_link {
text-align: right;
}
.nmfc_sub_class {
text-align: left;
}
.nmfc_v2-controls {
padding: 6px;
}
/*Readonly Select2 hack */
select[readonly="true"].select2-hidden-accessible + .select2-container {
pointer-events: none;
touch-action: none;
}
select[readonly="true"].select2-hidden-accessible + .select2-container .select2-selection {
background: #eee;
box-shadow: none;
}
select[readonly="true"].select2-hidden-accessible + .select2-container .select2-selection__arrow,
select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
display: none;
}
select[readonly="true"] + .select2-container {
pointer-events: none;
touch-action: none;
}
select[readonly="true"] + .select2-container .select2-selection {
background: #eee;
box-shadow: none;
}
select[readonly="true"] + .select2-container .select2-selection__arrow,
select[readonly="true"] + .select2-container .select2-selection__clear {
display: none;
}
/*Billing Adjustments*/
.row.fee {
display: flex;
position: relative;
align-items: center;
}
.row.fee.strike:before {
width: 88%;
left: 20px;
top: 50%;
}
.row.fee.strike.editing:before {
top: 12px;
}
.row.fee.new.editing .delete {
cursor: pointer;
}
.row.fee .delete {
color: red;
position: absolute;
top: 10px;
left: -6px;
}
.row.fee.new .delete {
top: 3px;
}
.row.fee input[disabled] {
background: #EEE;
}
.row.strike:before {
border-bottom: 1px solid #000;
position: absolute;
top: 18px;
z-index: 2;
}
/* Copied from fats.css for Notes tables (ex: notes on Account Clearance page) */
table.notes {
width: 95%;
border-spacing: 0;
}
table.notes td.nlabel {
width: 120px;
border: 1px solid #A6A6A6;
background-color: #f2f2f2;
font-size: 8px;
color: #5C5C5C;
white-space: nowrap;
vertical-align: top;
}
table.notes td.nfield,
table.notes td.nbody {
border: 1px solid #A6A6A6;
background-color: #fff;
font-size: 12px;
color: #000;
padding: 0;
}
table.notes td.nbody.flagged {
border-color: red;
background-color: #ffcccc;
}
table.notes td.nbody.flagged .nbody {
background-color: #ffcccc;
}
table.notes .nlabel.flag {
width: 35px;
}
table.notes .nlabel.flag .fa {
font-size: 250%;
}
table.notes .nlabel span {
display: block;
}
.table-action-bar .container,
.breadcrumb-wrap .container {
padding: 0 15px;
width: 100% !important;
max-width: 100% !important;
}
.expanded-bs .wrapper-white {
background-color: rgba(255, 255, 255, 0.7);
}
.expanded-bs .compact-stc .select2-container--default .select2-selection--single {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.expanded-bs .compact-stc .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 32px;
}
.carrier-check-status:before {
font-size: 1.4em;
}
.carrier-check-status.reload {
color: #000;
}
.carrier-check-status.cancelled, .carrier-check-status.expired {
color: #BA0000;
}
.carrier-check-status.blocked {
color: #ff6700;
}
.carrier-check-status.approved {
color: green;
}
.carrier-check-status.used {
color: gray;
}
.carrier-check-status.unapproved {
color: #555;
}
div.autocomplete {
position: absolute;
width: 100%;
background-color: white;
margin: 0px;
padding: 0px;
z-index: 11;
}
div.autocomplete ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}
div.autocomplete li {
list-style-type: none;
display: block;
margin: 0;
padding: 2px;
cursor: pointer;
font-size: 9pt;
background-color: #fff;
}
div.autocomplete li.selected {
background-color: #ffffbb;
}
.shipperConsigneePanel {
margin: 5px 0 15px 0;
border: 1px solid lightgray;
padding: 10px;
border-radius: 6px;
font-size: .95em;
}
/*notes*/
.notes {
display: block;
margin: 0 auto;
padding: 0;
}
.notes > li {
margin: 0 auto;
position: relative;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
-ms-justify-content: space-between;
-o-justify-content: space-between;
justify-content: space-between;
padding: 10px;
background: #f2f2f2;
-webkit-border-radius: 4px;
border-radius: 4px;
-ms-align-items: center;
align-items: center;
}
.notes > li:nth-child(even) {
background: transparent;
}
.hide-notes, .hide-billing-notes li:nth-child(even) {
background: #d9dde2;
}
.hide-notes, .hide-billing-notes li:nth-child(odd) {
background: transparent;
}
.notes > li .icon-area {
margin: 0;
width: 35px;
}
.notes > li .name-area {
margin: 0;
width: 15%;
vertical-align: top;
}
.notes > li p {
margin: 0;
display: inline-block;
vertical-align: middle;
}
.notes > li p strong:first-child {
padding-left: 0;
}
.notes > li p strong {
padding: 0 10px;
display: inline-block;
position: relative;
}
.notes > li p strong a {
text-decoration: none;
color: #337ab7;
}
.notes > li p strong:last-child:before {
display: none;
}
.notes > li .input-area {
-webkit-flex: 1;
-moz-flex: 1;
-ms-flex: 1;
-o-flex: 1;
flex: 1;
display: inline-block;
vertical-align: middle;
text-align: left;
}
.notes > li .input-area .remove-icon {
display: inline-block;
vertical-align: middle;
padding: 10px 5px;
}
.notes > li .input-area input {
display: inline-block;
width: 100%;
vertical-align: middle;
border: 1px solid #ccc;
padding: 0 15px;
color: #333333;
font-size: 14px;
height: 39px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.hide-notes, .hide-billing-notes {
display: none;
}
.notes > li .dispatchEdit, .billingEdit {
border: 5px solid #FFCCCC;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.notes > li .dispatch, .billing, .flagged {
background-color: #FFCCCC;
}
.notes > li .horizontal-padding {
padding-left: 10px;
padding-right: 10px;
}
.notes .ckb {
display: inline-block !important;
width: 12px;
height: 12px;
border: 1px solid #acacac;
border-radius: 0px;
cursor: pointer;
position: relative;
vertical-align: middle;
margin-right: 5px;
background: #fff;
border-radius: 3px;
-webkit-border-radius: 3px;
-ms-border-radius: 3px;
margin-bottom: 0;
}
.notes .ckb:before {
content: "";
position: absolute;
width: 6px;
height: 3px;
border-left: 3px solid #33cc66;
border-bottom: 3px solid #33cc66;
transform: rotate(45deg);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
top: 3px;
left: 2px;
opacity: 0;
padding: 0;
}
.note-container {
width: 100%;
}
.note-container .note-text {
width: 95%;
float: left;
font-size: 12px;
}
.notes .follow-up-container {
margin-top: 5px;
font-size: 12px;
}
.notes .input-area .follow-up-container input {
width: auto;
height: auto;
display: inline;
font-size: 12px;
padding: 0 5px;
}
.notes input[type="checkbox"] {
margin-bottom: 2px;
}
.hide-ck {
opacity: 0;
visibility: hidden;
width: 0;
height: 0;
font-size: 0;
margin: 0;
padding: 0;
}
.ckb {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.ckb {
display: inline-block !important;
width: 21px;
height: 21px;
border: 1px solid #acacac;
border-radius: 0px;
cursor: pointer;
position: relative;
vertical-align: middle;
margin-right: 5px;
background: #fff;
border-radius: 3px;
-webkit-border-radius: 3px;
-ms-border-radius: 3px;
margin-bottom: 0;
}
.ckb:before {
content: "";
position: absolute;
width: 11px;
height: 7px;
border-left: 3px solid #33cc66;
border-bottom: 3px solid #33cc66;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
top: 4px;
left: 5px;
opacity: 0;
padding: 0;
}
.ckb + .name {
vertical-align: top;
display: inline-block;
font-weight: 400;
font-size: 14px;
padding: 0;
}
.hide-ck:checked + .ckb {
background: #fff;
border: 1px solid #acacac;
}
.hide-ck:checked + .ckb:before {
opacity: 1;
}
.ckb.disabled {
background: #ccc !important;
cursor: default;
}
.ckb.disabled:before {
border-color: #777;
}
.ckb.disabled.reqdocs:before {
border-color: #26994d;
}
.delete-note {
position: absolute;
top: 5px;
right: 10px;
}
.assing-row .btn-group button, button.independent-blue {
width: auto;
display: inline-block;
padding: 5px 20px;
font-size: 12px;
height: 30px;
text-transform: capitalize;
outline: none;
background: #3496d2;
cursor: pointer;
border-radius: 5px;
border: 0;
color: #fff;
transition: all 0.3s ease;
}
.hidden {
display: none;
}
.notes button.btn, button.delete-note {
display: inline-block;
padding: 6px 12px !important;
margin-bottom: 0;
font-size: 14px !important;
font-weight: 400;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
width: auto;
}
.btn-group-sm > .btn, .btn-sm, button.delete-note.btn-sm {
padding: 5px 10px !important;
font-size: 12px !important;
line-height: 1.5;
border-radius: 3px;
}
.btn-outline {
background-color: white !important;
border: 1px solid #aaa !important;
color: #aaa !important;
}
.btn-outline:hover {
background-color: #aaa !important;
border: 1px solid #aaa !important;
color: white !important;
}
.btn-outline:disabled {
background-color: white !important;
border: 1px solid #ccc !important;
color: #ccc !important;
}
.btn-round {
border-radius: 100%;
}
.custom-combobox-input.sizzle {
display: block;
width: 100%;
min-width: 80px;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc !important;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.03);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.03);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.custom-combobox-toggle.sizzle {
position: absolute !important;
right: 10px !important;
top: 8px;
}
input.predictiveRateZip + select + span.custom-combobox > a.custom-combobox-toggle.sizzle {
position: absolute !important;
right: 20px !important;
top: 28px;
}
table.dataTable tbody tr.selected td.select-checkbox:after, table.dataTable thead th.select-checkbox.selected:after,
table.dataTable tbody td.select-checkbox.selected:after {
content: "✔" !important;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Segoe UI Symbol";
color: #FFFFFF !important;
text-align: center !important;
font-size: 12px !important;
font-weight: normal !important;
line-height: 0.8 !important;
text-shadow: none !important;
}
.commission-group_other-group_alert {
color: #BA0000;
}
table.dataTable thead {
white-space: nowrap;
}
table.dataTable thead th.select-checkbox,
table.dataTable tbody td.select-checkbox {
position: relative !important;
width: auto;
height: auto;
}
table.dataTable thead th.select-checkbox:before, table.dataTable thead th.select-checkbox:after,
table.dataTable tbody td.select-checkbox:before,
table.dataTable tbody td.select-checkbox:after {
color: #FFFFFF !important;
text-align: center !important;
font-size: 12px !important;
font-weight: bold;
line-height: 1;
display: block !important;
position: absolute !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
margin: auto !important;
width: 12px !important;
height: 12px !important;
box-sizing: border-box !important;
border: 1px solid #757575 !important;
border-radius: 3px !important;
}
table.dataTable thead th.select-checkbox:before,
table.dataTable tbody td.select-checkbox:before {
content: " " !important;
display: block;
}
table.dataTable thead th.select-checkbox.selected:after,
table.dataTable tbody td.select-checkbox.selected:after {
float: left;
margin: auto;
}
/* Chrome, Safari, and also the Edge Browser and Firefox */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
table.dataTable tbody td.select-checkbox:after,
table.dataTable tbody tr.selected td.select-checkbox:after,
table.dataTable thead th.select-checkbox:after,
table.dataTable tbody td.select-checkbox:after,
.select-checkbox:after {
background-color: #0074fd;
border: 1px solid #0074fd !important;
}
}
@supports (-moz-appearance: none) {
table.dataTable tbody td.select-checkbox:after,
table.dataTable tbody tr.selected td.select-checkbox:after,
table.dataTable thead th.select-checkbox:after,
table.dataTable tbody td.select-checkbox:after,
.select-checkbox:after {
background-color: #e75320 !important;
border-color: #e75320 !important;
}
}
.no-wrap {
white-space: nowrap;
}
.round-badge {
display: inline-flex;
justify-content: center;
align-items: center;
padding: 0;
font-size: 0.85em;
color: #fff !important;
border-radius: 50%;
width: 1.55em;
height: 1.55em;
border: none;
box-shadow: none;
-webkit-transform: translateZ(0);
transform: translateZ(0);
background-clip: padding-box;
cursor: default;
vertical-align: top;
}
.round-badge.viewer {
background-color: #ff9c07;
}
.round-badge.editor {
background-color: #00AD50;
}
.round-badge.shared {
background-color: #e0e0e0;
color: #777777 !important;
}
/* Load bulk import */
.bulk_import {
font-size: 1.05em;
font-weight: 350;
color: #333333;
}
.bulk_import strong {
font-weight: 500;
}
.bulk_import hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 2rem 0;
padding: 0;
}
.bulk_import .bulkUploader {
padding: 2rem;
margin-top: 3rem;
margin-bottom: 6rem;
}
.bulk_import .bulkUploader ul {
list-style-type: disc;
padding-left: 3rem;
}
.bulk_import .bulkUploader li::marker {
font-size: 0.75em;
color: #646464;
}
.bulk_import input[type="file"] {
width: 100%;
}
.bulk_import p {
margin-bottom: 1rem;
}
.bulk_import .description {
font-weight: 500;
font-size: 1.15em;
}
.bulk_import input[type="file"]::file-selector-button {
margin: 1.5rem;
padding: 0.5rem 1rem;
border: 0;
background-color: #747474;
color: #ffffff;
cursor: pointer;
border-radius: 10px;
}
.bulk_import input[type="file"]::file-selector-button:hover {
background-color: #3b3b3b;
}
.bulk_import #spreadSheetStatus {
text-align: left;
padding: 1.5rem;
background-color: #f8f8f8;
display: none;
border: 1px solid #ccc;
border-radius: 10px;
}