/*!* Spotlight Carousel v1.1 */
/*
 * v1.1 - Bug fixes for alignment, tabbing and RTL
 * v1.0 - Initial Checkin
 */

/* X-SMALL = 480px */
@media only screen and (min-width:30em) {}

/* SMALL = 600px */
@media only screen and (min-width:37.5em) {}

/* MEDIUM = 768px */
@media only screen and (min-width:48em) {}

/* LARGE = 960px */
@media only screen and (min-width:60em) {}

/* X-LARGE = 1024px + */
@media only screen and (min-width:64em) {}

/* BASE styles */
.dmcb-crsl-spotlight,
.dmcb-crsl-spotlight * {
    box-sizing: border-box;
}
.dmcb-crsl-spotlight {
    margin: 0 0 20px;
    max-width: 100%;
    overflow: hidden;
    position: relative;
}
.dmcb-crsl-spotlight.compact {
    margin-bottom: 0;
}
.dmcb-crsl-spotlight .pre-loader {
    display: none;
}
.dmcb-crsl-spotlight.intro .pre-loader {
    background: url('/c/dam/assets/dmrb/spotlight-carousel/images/loader_white_bg.gif') no-repeat;
    display: block;
    height: 44px;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 143px;
}
.dmcb-crsl-spotlight .slides-container {
    font-size: 0;
    line-height: 0;
    margin: 0 0 30px;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    white-space: nowrap;
    width: auto;
}
.dmcb-crsl-spotlight.intro .slides-container {
    opacity: 0;
}
.dmcb-crsl-spotlight .slides-container .slide {
    display: inline-block;
    vertical-align: top;
    white-space: normal;
    width: 100%;
}
.dmcb-crsl-spotlight .slides-container .slide.end-of-tree {
    display: none;
}
.dmcb-crsl-spotlight .slide .tine {
    width: 100%;
}
.dmcb-crsl-spotlight .slide .tine .image {
    border-radius: 0 300px 300px 0;
    line-height: 0;
    margin: 0 16px 15px 0;
    overflow: hidden;
    width: calc(100% - 16px);
}
.dmcb-crsl-spotlight .tine .image .eyebrow-text {
    display: none;
}
.dmcb-crsl-spotlight .tine .mobile {
    width: 100%;
}
.dmcb-crsl-spotlight .tine .desktop {
    display: none;
}
.dmcb-crsl-spotlight .tine img {
    position: relative;
    width: 100%;
}
.dmcb-crsl-spotlight .tine .content {
    padding: 0 16px;
    width: 100%;
}
.dmcb-crsl-spotlight .tine .content :last-child {
    margin-bottom: 0;
}
.dmcb-crsl-spotlight .tine .content .lightbox-link {
    display: inline-block;
}
.dmcb-crsl-spotlight .nav-container {
    overflow: auto;
    text-align: center;
    width: 100%;
}
.dmcb-crsl-spotlight.intro .nav-container {
    opacity: 0;
}
.dmcb-crsl-spotlight .nav-container ul {
    font-size: 0;
    line-height: 0;
    margin: 0 auto;
    white-space: nowrap;
}
.dmcb-crsl-spotlight .nav-container ul li {
    cursor: pointer;
    display: inline-block;
    margin: 0 16px 0 0;
    vertical-align: top;
    white-space: normal;
    width: 72px;
}
.dmcb-crsl-spotlight .nav-container ul li:first-child {
    margin: 0 16px;
}
.dmcb-crsl-spotlight .nav-container ul li a.nav-wrap {
    border: 3px solid transparent;
    border-radius: 50%;
    display: block;
    line-height: 0;
    margin: 0 0 10px;
    overflow: hidden;
    padding: 3px;
    position: relative;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100%;
}
.dmcb-crsl-spotlight .nav-container ul li.current a.nav-wrap,
.no-touch .dmcb-crsl-spotlight .nav-container ul li:hover a.nav-wrap {
    border-color: #1fbde9;
    transition: border-bottom-color 0.15s linear, border-left-color 0.15s linear 0.10s, border-top-color 0.15s linear 0.20s, border-right-color 0.15s linear 0.30s;
}
.dmcb-crsl-spotlight .nav-container li a.nav-wrap img {
    border-radius: 50%;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 100%;
}
.dmcb-crsl-spotlight .nav-container li .eyebrow-text {
    margin: 0;
}
.no-js .dmcb-crsl-spotlight.intro .pre-loader {
    display: none;
}
.no-js .dmcb-crsl-spotlight .slides-container {
    margin: 0;
    white-space: normal;
}
.no-js .dmcb-crsl-spotlight.intro .slides-container {
    opacity: 1;
}
.no-js .dmcb-crsl-spotlight .slides-container .slide {
    margin-bottom: 20px;
}
.no-js .dmcb-crsl-spotlight.intro .nav-container {
    display: none;
}
/* RTL Styles */
html[dir="rtl"] .dmcb-crsl-spotlight .slide .tine .image {
    border-radius: 300px 0 0 300px;
    margin: 0 0 15px 16px;
}
html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li {
    margin: 0 0 0 16px;
}
html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li:first-child {
    margin: 0 16px;
}

/* Code for fadeUp animation */
@-webkit-keyframes tine-fadeUp {
    0% {
        opacity: 0;
        transform: translateY(-35%);
    }
    100% {
        opacity: 1;
        transform: translateY(-50%);
    }
}
@-moz-keyframes tine-fadeUp {
    0% {
        opacity: 0;
        transform: translateY(-35%);
    }
    100% {
        opacity: 1;
        transform: translateY(-50%);
    }
}
@-o-keyframes tine-fadeUp {
    0% {
        opacity: 0;
        transform: translateY(-35%);
    }
    100% {
        opacity: 1;
        transform: translateY(-50%);
    }
}
@keyframes tine-fadeUp {
    0% {
        opacity: 0;
        transform: translateY(-35%);
    }
    100% {
        opacity: 1;
        transform: translateY(-50%);
    }
}
/* Code for fadeIn animation */
@-webkit-keyframes tine-fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.3;
    }
}
@-moz-keyframes tine-fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.3;
    }
}
@-o-keyframes tine-fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.3;
    }
}
@keyframes tine-fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 0.3;
    }
}

/* SMALL = 600px */
@media only screen and (min-width:37.5em) {
    .dmcb-crsl-spotlight .slides-container {
        margin: 0 0 45px;
    }
    .dmcb-crsl-spotlight .slide {
        height: 360px;
    }
    .dmcb-crsl-spotlight .slide .tine {
        height: 360px;
    	position: relative;
    }
    .dmcb-crsl-spotlight .slide .tine .image {
        margin: 0 18px 0 0;
        width: calc(100% - 18px);
    }
    .dmcb-crsl-spotlight .slide.current .tine .image::after {
        -webkit-animation-duration: 500ms;
        -moz-animation-duration: 500ms;
        -ms-animation-duration: 500ms;
        -o-animation-duration: 500ms;
        animation-duration: 500ms;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        -ms-animation-fill-mode: forwards;
        -o-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-name: tine-fadeIn;
        -moz-animation-name: tine-fadeIn;
        -ms-animation-name: tine-fadeIn;
        -o-animation-name: tine-fadeIn;
        animation-name: tine-fadeIn;
        -webkit-animation-delay: 500ms;
        -moz-animation-delay: 500ms;
        -ms-animation-delay: 500ms;
        -o-animation-delay: 500ms;
        animation-delay: 500ms;
        background-color: #000;
        border-radius: 0 300px 300px 0;
        content: ' ';
        height: 360px;
        left: 0;
        margin: 0 18px 0 0;
        opacity: 0;
        position: absolute;
        top: 0;
        width: calc(100% - 18px);
    }
    .dmcb-crsl-spotlight .tine .mobile {
        display: none;
    }
    .dmcb-crsl-spotlight .tine .desktop {
        display: block;
        width: 100%;
    }
    .dmcb-crsl-spotlight .tine img {
        height: 360px;
        width: auto;
    }
    .dmcb-crsl-spotlight .tine.focal-R img {
        left: 100%;
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        transform: translateX(-100%);
    }
    .dmcb-crsl-spotlight .tine.focal-C img {
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    .dmcb-crsl-spotlight .tine .content {
        opacity: 0;
        padding: 0 10px;
    	position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 80%;
    }
    .dmcb-crsl-spotlight .slide.current .tine .content {
        padding: 0 18px;
        -webkit-animation-duration: 1s;
        -moz-animation-duration: 1s;
        -ms-animation-duration: 1s;
        -o-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        -ms-animation-fill-mode: forwards;
        -o-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-name: tine-fadeUp;
        -moz-animation-name: tine-fadeUp;
        -ms-animation-name: tine-fadeUp;
        -o-animation-name: tine-fadeUp;
        animation-name: tine-fadeUp;
        -webkit-animation-delay: 500ms;
        -moz-animation-delay: 500ms;
        -ms-animation-delay: 500ms;
        -o-animation-delay: 500ms;
        animation-delay: 500ms;
    }
    .dmcb-crsl-spotlight .tine .content .eyebrow-text,
    .dmcb-crsl-spotlight .tine .content h3,
    .dmcb-crsl-spotlight .tine .content p {
        color: #FFF;
    }
    .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a:not(.dmcb-button),
    .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a.text-cta {
        border-bottom: 1px dotted #fff;
        color: #FFF;
    }
    .no-touch .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a:not(.dmcb-button):hover,
	.no-touch .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a.text-cta:hover {
        border-bottom: 1px solid #fff;
        color: #fff;
    }
    .dmcb-crsl-spotlight .nav-container ul li {
        margin: 0 18px 0 0;
        width: 92px;
    }
    .dmcb-crsl-spotlight .nav-container ul li:first-child {
        margin: 0 18px;
    }
    .dmcb-crsl-spotlight .nav-container ul li a.nav-wrap {
        border: 4px solid transparent;
        padding: 4px;
    }
    .no-js .dmcb-crsl-spotlight .tine img {
        width: 100%;
    }
    .no-js .dmcb-crsl-spotlight .slides-container .slide {
        height: auto;
        margin-bottom: 0;
    }
    .no-js .dmcb-crsl-spotlight .slide .tine {
        height: auto;
    }
    .no-js .dmcb-crsl-spotlight .slide.current .tine .image::after {
        content: none;
    }
    .no-js .dmcb-crsl-spotlight .tine img {
        height: auto;
    }
    .no-js .dmcb-crsl-spotlight .tine .content {
        opacity: 1;
        padding: 20px;
        position: static;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        width: 100%;
    }
    .no-js .dmcb-crsl-spotlight .tine .content .eyebrow-text,
    .no-js .dmcb-crsl-spotlight .tine .content h3,
    .no-js .dmcb-crsl-spotlight .tine .content p {
        color: #4d4c4c;
    }
    .no-js .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a:not(.dmcb-button),
    .no-js .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a.text-cta {
        border-bottom: solid 1px transparent;
        color: #007493;
    }
    .no-js.no-touch  .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a:not(.dmcb-button):hover,
	.no-js.no-touch  .dmc-blade.row.full.blowout .dmcb-crsl-spotlight .tine .content a.text-cta:hover {
        border-bottom: solid 1px #005073;
        color: #005073;
    }
    /* RTL Styles */
    html[dir="rtl"] .dmcb-crsl-spotlight .slide .tine .image {
        margin: 0 0 0 18px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .slide.current .tine .image::after {
        border-radius: 300px 0 0 300px;
        margin: 0 0 0 18px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .tine img {
        right: 100%;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%);
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .tine.focal-R img {
        left: auto;
        right: auto;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .tine.focal-C img {
        right: 50%;
        -webkit-transform: translateX(50%);
        -moz-transform: translateX(50%);
        -ms-transform: translateX(50%);
        -o-transform: translateX(50%);
        transform: translateX(50%);
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li {
        margin: 0 0 0 18px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li:first-child {
        margin: 0 18px;
    }
}

/* MEDIUM = 768px */
@media only screen and (min-width:48em) {
    .dmcb-crsl-spotlight .slides-container .slide {
    	border-radius: 106px;
        cursor: pointer;
        margin: 0 30px 0 0;
        overflow: hidden;
        -webkit-transition: width 0.3s ease-in, border-radius 0.3s ease-in;
        -moz-transition: width 0.3s ease-in, border-radius 0.3s ease-in;
        -ms-transition: width 0.3s ease-in, border-radius 0.3s ease-in;
        -o-transition: width 0.3s ease-in, border-radius 0.3s ease-in;
        transition: width 0.3s ease-in, border-radius 0.3s ease-in;
    }
    .dmcb-crsl-spotlight .slides-container .slide.current {
        border-radius: 0 300px 300px 0;
        cursor: default;
    }
    .dmcb-crsl-spotlight .slides-container .slide.end-of-tree {
        background-color: #1fbde9;
        display: inline-block;
    }
    .dmcb-crsl-spotlight .slides-container .slide:last-child {
        margin: 0;
    }
    .dmcb-crsl-spotlight .slide .tine .image {
    	border-radius: 0;
        margin: 0;
        overflow: visible;
        width: 100%;
    }
    .dmcb-crsl-spotlight .slide.current .tine .image::after {
        margin: 0;
        width: 100%;
    }
    .dmcb-crsl-spotlight .tine .content {
        opacity: 1;
        text-align: center;
        width: 100%;
    }
    .dmcb-crsl-spotlight .slide.current .tine .content {
        opacity: 0;
        text-align: left;
        width: 80%;
    }
    .dmcb-crsl-spotlight .slide:not(.current) .tine .content h3,
    .dmcb-crsl-spotlight .slide:not(.current) .tine .content p,
    .dmcb-crsl-spotlight .slide:not(.current) .tine .content .dmcb-button.brandi,
    .dmcb-crsl-spotlight .slide:not(.current) .tine .content a.text-cta {
        display: none;
    }
    .dmcb-crsl-spotlight .slide:not(.current) .tine .content .eyebrow-text {
        display: block;
        margin: 0;
    }
    .dmcb-crsl-spotlight .slide.current .tine .content .dmcb-button.brandi,
    .dmcb-crsl-spotlight .tine .content a.text-cta {
        display: inline-block;
    }
    .dmcb-crsl-spotlight .nav-container ul li {
        margin: 0 20px 0 0;
    }
    .dmcb-crsl-spotlight .nav-container ul li:first-child {
        margin: 0 20px;
    }
    .no-js .dmcb-crsl-spotlight .slides-container .slide {
    	border-radius: 0;
    }
    .no-js .dmcb-crsl-spotlight .slides-container .slide.end-of-tree {
        display: none;
    }
    .no-js .dmcb-crsl-spotlight .slide:not(.current) .tine .content h3,
    .no-js .dmcb-crsl-spotlight .slide:not(.current) .tine .content p {
        display: block;
    }
    .no-js .dmcb-crsl-spotlight .slide:not(.current) .tine .content .dmcb-button.brandi,
    .no-js .dmcb-crsl-spotlight .slide:not(.current) .tine .content a.text-cta {
        display: inline-block;
    }
    /* RTL Styles */
    html[dir="rtl"] .dmcb-crsl-spotlight .slides-container .slide {
        margin: 0 0 0 30px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .slides-container .slide.current {
        border-radius: 300px 0 0 300px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .slides-container .slide:last-child {
        margin: 0;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .slide .tine .image {
        border-radius: 0;
        margin: 0;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .slide.current .tine .image::after {
        margin: 0;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .slide.current .tine .content {
        text-align: right;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li {
        margin: 0 0 0 20px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li:first-child {
        margin: 0 20px;
    }
}

/* MEDIUM = 1024px */
@media only screen and (min-width:64em) {
    .dmcb-crsl-spotlight .slide {
        height: 400px;
    }
    .dmcb-crsl-spotlight .slide .tine {
        height: 400px;
    }
    .dmcb-crsl-spotlight .slide.current .tine .image::after {
        height: 400px;
    }
    .dmcb-crsl-spotlight .tine img {
        height: 400px;
    }
    .dmcb-crsl-spotlight .slide.current .tine .content {
        padding: 0 20px;
    }
    .dmcb-crsl-spotlight .nav-container ul li {
        margin: 0 24px 0 0;
        width: 122px;
    }
    .dmcb-crsl-spotlight .nav-container ul li:first-child {
        margin: 0 24px;
    }
    .dmcb-crsl-spotlight .nav-container ul li a.nav-wrap {
        padding: 6px;
    }
    /* RTL Styles */
    html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li {
        margin: 0 0 0 24px;
    }
    html[dir="rtl"] .dmcb-crsl-spotlight .nav-container ul li:first-child {
        margin: 0 24px;
    }
}

/* MEDIUM = 1280px */
@media only screen and (min-width:80em) {
    .dmcb-crsl-spotlight .slides-container {
        margin: 0 0 35px;
    }
    .dmcb-crsl-spotlight .slide {
        height: 435px;
    }
    .dmcb-crsl-spotlight .slide .tine {
        height: 435px;
    }
    .dmcb-crsl-spotlight .slide.current .tine .image::after {
        height: 435px;
    }
    .dmcb-crsl-spotlight .tine img {
        height: 435px;
    }
    .dmcb-crsl-spotlight .tine .content {
        width: 100%;
    }
    .dmcb-crsl-spotlight .slide.current .tine .content {
        padding: 0 60px;
        width: 60%;
    }
    .dmcb-crsl-spotlight .tine .content h3 {
        margin: 0 0 10px;
    }
    .ie .dmcb-crsl-spotlight .tine img {
        position: absolute;
    }
}