/* TR-SPECIFIC CLASSES AND OVERRIDES TO TIGA-SUPPLIED STYLES */


.tr-error {
    font-weight: bold;
    color: red;
}

.tr-done {
    font-weight: bold;
    color: black;
}

.show_more_less {
    cursor: pointer;
    text-decoration: underline;
    margin: 10px 0 0;
}

.filterSpacer {
    padding-bottom: 30px;
}

.table_gap {
    margin-top: 2em;
}

.product-border {
    border: 1px solid #979797;
}

.product-search {
    display: flex;
}

.product-search-input {
    text-align: left;
}

.product-search-input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: white;
    opacity: 1; /* Firefox */
}

.product-search-input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: white;
}

.product-search-input::-ms-input-placeholder { /* Microsoft Edge */
    color: white;
}

.product-search-button {
    margin-left: -10px;
}

.product-search-form {
    flex-shrink: 0;
    flex-grow: 1;
    display: flex;
}

.page-icons {
    width: 3em;
}

.video-width {
    width: 100%;
}

.table_gap {
    margin-top: 2em;
}

.product-border {
    border: 1px solid #979797;
}

.inline {
    display: inline-block !important;
}

.plain-backgrond {
    background-color: #fff;
}

.video-icon {
    width: 2em;
}

.lastMenuRow {
    padding-bottom: 40px;
}

.bottom-spacing {
    padding-bottom: 40px;
}

dt.component79__noafter:after {
    content: "";
}

#loginDropdown:hover {
    cursor: pointer;
}


/* *** Footer changes *** */
.footer__report__image {
    background-color: transparent !important;
}

.footer__upper__newsletter-report {
    align-items: flex-start;
}

@media (min-width: 992px) {
    .footer__upper__newsletter-report {
        flex-direction: row !important;
    }
}

@media (min-width: 768px) {
    .footer__group__list {
        grid-template-columns: repeat(6, 1fr) !important;
    }
}
/* *** End of Footer changes *** */


.header_spacer {
    padding-top: 1.5em;
}

.bookmark-badge {
    position: relative;
    border: black;
}

.bookmark-badge[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    top: 0px;
    right: -5px;
    font-size: .7em;
    background: red;
    color: white;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 18px;
    border-radius: 50%;
    box-shadow: 0 0 1px #333;
}

.enlarge {
    float: right;
    margin: 2px 0;
    display: block;
    height: 24px;
    cursor: pointer;
}

.signout {
    left: -45px;
}

.greeting_name {
    left: -205px;
}

.wizard, .tabcontrol {
    display: block;
    width: 100%;
    overflow: hidden
}

.wizard a, .tabcontrol a {
    outline: 0
}

.wizard ul, .tabcontrol ul {
    list-style: none !important;
    padding: 0;
    margin: 0
}

.wizard ul > li, .tabcontrol ul > li {
    display: block;
    padding: 0
}

.wizard > .steps .current-info, .tabcontrol > .steps .current-info {
    position: absolute;
    left: -999em
}

.wizard > .content > .title, .tabcontrol > .content > .title {
    position: absolute;
    left: -999em
}

.wizard > .steps {
    position: relative;
    display: block;
    width: 100%
}

.wizard.vertical > .steps {
    display: inline;
    float: left;
    width: 30%
}

.wizard > .steps .number {
    font-size: 1.429em
}

.wizard > .steps > ul > li {
    width: 25%
}

.wizard > .steps > ul > li, .wizard > .actions > ul > li {
    float: left
}

.wizard.vertical > .steps > ul > li {
    float: none;
    width: 100%
}

.wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active {
    display: block;
    width: auto;
    margin: 0 .5em .5em;
    padding: .7em .7em;
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.wizard > .steps .disabled a, .wizard > .steps .disabled a:hover, .wizard > .steps .disabled a:active {
    background: #eee;
    color: #aaa;
    cursor: default
}

.wizard > .steps .current a, .wizard > .steps .current a:hover, .wizard > .steps .current a:active {
    background: #023c6f;
    color: #fff;
    cursor: default
}

.wizard > .steps .done a, .wizard > .steps .done a:hover, .wizard > .steps .done a:active {
    background: #7887a7;
    color: #fff
}

.wizard > .steps .error a, .wizard > .steps .error a:hover, .wizard > .steps .error a:active {
    background: #ff3111;
    color: #fff
}

.wizard > .content {
    background: #eee;
    display: block;
    margin: .5em;
    min-height: 17em;
    overflow: hidden;
    position: relative;
    width: 100%;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.wizard.vertical > .content {
    display: inline;
    float: left;
    margin: 0 2.5% .5em 2.5%;
    width: 65%
}

.wizard > .content > .body {
    float: left;
    position: absolute;
    width: 95%;
    padding: 2.5%
}

.wizard > .content > .body ul {
    list-style: disc !important
}

.wizard > .content > .body ul > li {
    display: list-item
}

.wizard > .content > .body > iframe {
    border: 0 none;
    width: 100%;
    height: 100%
}

.wizard > .content > .body input {
    display: block;
    border: 1px solid #ccc;
}

.wizard > .content > .body input[type="checkbox"] {
    display: inline-block
}

.wizard > .content > .body input.error {
    background: #fbe3e4;
    border: 1px solid #fbc2c4;
    color: #8a1f11
}

.wizard > .content > .body label {
    display: inline-block;
    margin-bottom: .5em
}

.wizard > .content > .body label.error {
    color: #8a1f11;
    display: inline-block;
    margin-left: 1.5em
}

.wizard > .actions {
    position: relative;
    display: block;
    text-align: right;
    width: 100%
}

.wizard.vertical > .actions {
    display: inline;
    float: right;
    margin: 0 2.5%;
    width: 95%
}

.wizard > .actions > ul {
    display: inline-block;
    text-align: right
}

.wizard > .actions > ul > li {
    margin: 0 .5em
}

.wizard.vertical > .actions > ul > li {
    margin: 0 0 0 1em
}

.wizard > .actions a, .wizard > .actions a:hover, .wizard > .actions a:active {
    background: #023c6f;
    color: #fff;
    display: block;
    padding: .5em 1em;
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.wizard > .actions .disabled a, .wizard > .actions .disabled a:hover, .wizard > .actions .disabled a:active {
    background: #eee;
    color: #aaa
}

.wizard > .loading {
}

.wizard > .loading .spinner {
}

.wizard > .steps > ul > li {
    width: auto;
}

.wizard h4 {
    color: #023c6f;
}

.product-result {
    display: flex;
}

.product-result-D1 {
    width: 8%;
}

.product-result-D2 {
    width: 73%;
}

.product-result-D3 {
    width: 18%;
    text-align: right;
}

.last {
    margin-right: auto;
}

.research {
    display: block;
}

.tokenbox {
    width: 70%;
}

.product_thumbnail {
    width: 70%;
}

.side_image {
    width: 50%;
    float: left;
}

.clickLink {
    text-decoration: underline;
    cursor: pointer;
}

.rollover-container { }

.rollover-container .rollover-img {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
}

.rollover-container:hover .rollover-img {
    display: inline;
}


/* ********** COMPONENT OVERRIDES ********** */
.component80__collection-icon {
    padding-top: 0;
}

.info-bar__icon {
    z-index: 999 !important;
}

.component11_just_link {
    color: #38a2dc;
}

.component11__item_no_expand {
    margin-top: 10px;
    margin-bottom: 10px;
}

/* (Marketing don't want automatic lines between videos. They'll add them where they need them) */
.component68__list__item:first-child {
    border: none !important;
}

.component68__list__item {
    border: none !important;
}

/* Show link text as white within this component where appropriate */
.component34__items h3 a {
    color: #fff !important;
}

.component34__items h3 a, .component25__item__copy a {
    color: #fff !important;
}

/* Show hover text as black */
.component25__item__copy a:hover {
    color: #000 !important;
}

.component40__filters__list__values {
    margin-bottom: 0px !important;
}

#dropdownModelButton {
    margin-top: 20px !important;
    padding: 21px 40px !important;
    font-size: .9rem !important;
    font-weight: 500 !important;
}

@media (min-width: 768px) {
    .component21_3__row {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        column-gap: 10px;
        row-gap: 10px;
    }
}

@media (max-width: 1459.98px) {
    #dropdownModelButton {
        margin-bottom: 20px !important;
        padding: 21px 10px !important;
    }
}

/* ********** END OF COMPONENT OVERRIDES ********** */

.rollover {
    -webkit-transition: all .7s ease-in-out;
    -moz-transition: all .7s ease-in-out;
    -o-transition: all .7s ease-in-out;
    transition: all .7s ease-in-out;
}

.rollover:hover { }


/*********  TWO FA MODAL ***********/
.twofa-modal {
    position: fixed;
    z-index: 99999;
    padding-top: 300px;
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4); 
}

.twofa-modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 60%;
}

/*********   END OF 2FA MODAL **********/

/*********  COLLECTIONS ***********/
#collectionsModalWrapper {
    padding: 5px;
}

/* ***********  TJVTODO TEMPORARY SETTINGS UNTIL COLLECTIONS IS IMPLEMENTED *********** */
/*  -- Suspended, as we're now trying to implement it
@media (min-width: 992px) {
    .navbar-expand-md .navbar-nav-upper {
        position: absolute;
        top: 0;
        right: 15px;
        display: flex;
        flex-wrap: nowrap;
        align-items: end;
    }

    .navbar-expand-md .navbar-nav-upper__bookmark {
        margin-right: 35px;
        display: none;
        flex-direction: row;
        align-items: center;
        flex-wrap: nowrap;
        box-shadow: none;
    }
    .navbar-expand-md .navbar-nav-upper__bookmark > img {
        width: 38px;
    }

    .navbar-expand-md .navbar-nav-upper--with-bookmark .navbar-nav-upper__bookmark {
        display: flex;
    }

    .navbar-expand-md .navbar-nav-upper__bookmark__label {
        font-weight: 300;
        font-size: 0.75rem;
        padding: 3px 11px 4px 8px;
        position: relative;
        height: 25px;
        margin-right: 15px;
    }

    .navbar-expand-md .navbar-nav-upper__bookmark__label::after {
        position: absolute;
        top: 3.5px;
        right: -9.5px;
        content: '';
        display: block;
        width: 17.677669529663688110021109052621px;
        height: 17.677669529663688110021109052621px;
        transform: rotateZ(45deg);
    }

    .navbar-light.navbar-expand-md .navbar-nav-upper__bookmark__label, .navbar-light.navbar-expand-md .navbar-nav-upper__bookmark__label::after {
        background-color: #f0f0f0;
    }

    .navbar-nav-upper__bookmark {
        width: 190px;
    }
}

.navbar-light .navbar-nav-upper__bookmark__label {
    color: #1a7abf;
}
*/

    /* ***********  END BEAGLE TJVTODO: REMOVE ONCE COLLECTIONS IS LIVE *****************/