@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);

[v-cloak] {
    display: none;
}

/* text utility  */
.tb-cart-font {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:   0.95rem;
}

.tb-text-smaller {
    font-size: 0.85em;
}

.tb-text-muted {
    color: #6c757d;
}

.tb-text-medium {
    color: dimgray;
}

.tb-text-ok {
    color: darkgreen;
}

.tb-text-alert {
    color: darkgoldenrod;
}

.tb-text-warning {
    color: darkred;
}

.tb-text-em {
    font-weight: bold;
}

/* navbar */
.tb-navbar-plain {
    background-color: whitesmoke;
    border-color:     darkslategrey;
}

/* buttons */
.tb-button-full {
    width: 100%;
}

.tb-button-full-capped {
    width:     100%;
    max-width: 220px;
}

.tb-button-full-capped-small {
    width:     100%;
    max-width: 120px;
}

.tb-action-button {
    background-color: #c5dbf2;
    color:            #6c757d;
    border:           2px solid #c5dbf2;
    padding:          8px 0px !important;
    text-transform:   none !important;
    letter-spacing:   0 !important;
    font-family:      "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.tb-action-button:hover,
.tb-action-button:active,
.tb-action-button:focus
{
    background-color: white;
    color:            #6c757d;
    border:           2px solid #c5dbf2;
    padding:          8px 0px !important;
}

.tb-action-button-large {
    padding:          12px 0px !important;
}

.tb-action-button-large:hover,
.tb-action-button-large:active,
.tb-action-button-large:focus
{
    padding:          12px 0px !important;
}

.tb-button-enabled {
    opacity: 1;
    cursor:  pointer;
}

.tb-default-button {
    background-color: white;
    color:            #6c757d;
    border:           2px solid #6c757d;
    padding:          12px 0px !important;
    text-transform:   none !important;
    letter-spacing:   0 !important;
    font-family:      "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.tb-default-button:hover,
.tb-default-button:active,
.tb-default-button:focus
{
    background-color: #6c757d !important;
    color:            white;
    border:           2px solid #6c757d !important;
    padding:          12px 0px !important;
}

.tb-add-button {
    background-color: white;
    color:            #6c757d;
    border:           2px solid #6c757d;
    padding:          12px 0px !important;
    text-transform:   none !important;
    letter-spacing:   0 !important;
    font-family:      "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.tb-add-button:hover,
.tb-add-button:active,
.tb-add-button:focus
{
    background-color: #6c757d !important;
    color:            white;
    border:           2px solid #6c757d !important;
    padding:          12px 0px !important;
}

.tb-add-button-small {
    padding:          8px 0px !important;
}

.tb-add-button-small:hover,
.tb-add-button-small:active,
.tb-add-button-small:focus
{
    padding:          8px 0px !important;
}

/* FAB images */
.image-cropper {
    position:         relative;
    overflow:         hidden;
}

img.fab-img {
    margin-top:       -3px;
    margin-bottom:    0;
    margin-left:      0;
    margin-right:     0;
    height:           24px;
    width:            auto;
    object-fit:       cover;
    border-radius:    50%;
}

/* form  */
.tb-form-row {
    padding-top:    6px;
    padding-bottom: 6px;
}

.tb-form-control {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:   0.95rem;
    color:       dimgray !important;
}

/* icon colors */
.tb-icon-ok {
    color: darkgreen;
}

.tb-icon-alert {
    color: darkgoldenrod;
}

.tb-icon-warning {
    color: darkred;
}

/* layout utility */
.tb-left {
    text-align: left;
}

.tb-right {
    text-align: right;
}

.tb-center {
    text-align: center;
}

.tb-nudge-up-small {
    margin-top: -2px;
}

.tb-nudge-up {
    margin-top: -4px;
}

.tb-col-padding-slim {
    padding-left:  6px;
    padding-right: 6px;
}

.tb-col-padding-slimmer {
    padding-left:  4px;
    padding-right: 4px;
}

.tb-col-padding-none {
    padding-left:  0;
    padding-right: 0;
}

/* modal */
.tb-modal {
    display:          none;
    position:         fixed;
    z-index:          999;
    left:             0;
    top:              0;
    width:            100%;
    height:           100%;
    overflow:         auto;
    background-color: rgba(0,0,0,0.4);
}

.tb-modal-content {
    background-color: #fefefe;
    margin:           15% auto;
    border:           1px solid #888;
    width:            90%;
    max-width:        700px;
}

.tb-modal-header {
    border-bottom:    1px solid lavender;
    padding:          10px;
}

.tb-modal-header-title {
    margin-bottom:    0 !important;
}

.tb-modal-body {
    padding:          10px;
}

.tb-modal-footer {
    border-top:       1px solid lavender;
    padding:          10px;
    text-align:       center;
}

.tb-modal-ok {
    min-width:        100px;
}

.tb-modal-button-small {
    min-width:        80px;
}

/* dropdown  */
.dropdown {
    position: relative;
    display:  inline-block;
}

.dropdown-content {
    display:     none;
    position:    absolute;
    min-width:   160px;
    box-shadow:  0px 8px 16px 0px rgba(0,0,0,0.2);
    padding:     12px 16px;
    z-index:     1;
    white-space: nowrap;
}

.dropdown-right {
    right:       0;
}

.dropbutton {
    font-weight: bold;
}

.tb-dropdown {
    background-color: ivory;
    padding-top:      0.2rem;
    padding-bottom:   0.2rem;
}

.tb-dropdown-login {
    background-color: whitesmoke;
    padding-top:      0.2rem;
    padding-bottom:   0.2rem;
}

.tb-dropdown-item {
    display:         block;
    width:           100%;
    line-height:     32px;
    padding-top:     3px;
    padding-bottom:  3px;
    text-decoration: none !important;
    box-shadow:      none !important;
    cursor:          pointer;
}

.tb-dropdown-item:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.tb-dropdown-divider {
    background-color: #DDDDDD;
    margin-top:       0.4rem;
    margin-bottom:    0.4rem;
    height:           1px;
    width:            100%;
}

.tb-show {
    display: block;
}