html { background:#fef0f0; }
body { font-family: 'Montserrat', sans-serif; font-size:12px; background-color:transparent; }

.container { padding-left:0; padding-right:0; }
.col-md-12 { padding-left:0; padding-right:0; }
.row { margin-right:0; margin-left:0; }

.vto-frame { min-height:402px; background:#feebeb; margin:0 auto; text-align:center; }

.vto-loader { 
    position:absolute; width:100%; height:100%; background:#fef0f0; z-index:10; display:flex; justify-content: center; align-items:center; 
    background:url('../images/VTO_steiner_mobile.jpg') no-repeat bottom center; background-size:cover; }
.vto-loader__content { text-align:center; max-width:300px; }
.vto-loader__content__img { max-width:250px; margin:0 auto; }
.vto-loader__content__text { color:#e82e8a; font-weight:600; font-size:20px; }
.vto-loader__content__loader { color:#860421; font-size:30px; margin-top:5px; }

.vto-controls ul.nav { justify-content: center; }
.vto-controls__l1 { margin-top:10px; margin-bottom:10px!important; }
.vto-controls__l1 .nav-link { padding:0; margin:0 10px; opacity:0.5; color:#e82e8a; text-align:center; }
.vto-controls__l1 .nav-link img { width:50px; }
.vto-controls__l1 .nav-link.active { background-color:transparent; opacity:1; color:#e82e8a; }

.vto-controls__l2 { margin:5px 0; border-top:1px solid #dadada; padding:10px 10px 0; position:relative; }
.vto-controls__l2 .vto-controls__l2 { padding:10px 0 0; }
.vto-controls__l2 ul.nav { display:block; width:max-content; margin-bottom:5px!important; }
.vto-controls__l2 ul.nav > .nav-item { display:inline-block; }
.vto-controls__l2 .nav-link { font-size:10px; text-transform:uppercase; font-weight:bold; color:#aaa; margin:0 5px 0 0; border:1px solid #aaa; line-height:1.1em; border-radius:0; background:#fff; }
.vto-controls__l2 .nav-link.active { color:white; background-color:#e82e8a; border-color:#e82e8a; }
.vto-controls__l2 .vto-control__slide { margin-bottom:5px; }

.vto-control__slide { overflow-x:auto; -ms-overflow-style:none; scrollbar-width:none; position:relative; }
.vto-control__slide::-webkit-scrollbar { display:none; }

.vto-control__slide__l2__more,
.vto-control__slide__l3__more,
.vto-control__slide__color__more,
.vto-control__slide__color__l3__more { position:absolute; right:5px; width:20px; text-align: right; background:#fef0f0; font-size:16px; z-index:10; color:#e82e8a; }
.vto-control__slide__l2__more { top:10px; height:29px; line-height: 29px; }
.vto-control__slide__l3__more { top:10px; height:29px; line-height: 29px; right:-5px; }
.vto-control__slide__color__more { top:50px; height:35px; line-height: 35px; }
.vto-control__slide__color__l3__more { top:50px; height:35px; line-height: 35px; right:-5px; }

.vto-controls__colors { width:max-content; display:flex; margin-bottom:25px; margin-top:5px; }
.vto-controls__colors__item { display:inline-block; text-align:center; width:70px; font-size:10px; }
.vto-controls__colors__item .color { background-color: #860421; display: inline-block; width: 30px; height: 30px; border-radius: 50%; }

.vto-product { display:none; }

/* Small devices (landscape phones, 500px and up) */
@media (min-width: 500px) {
    .vto-frame { max-width:360px; }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    .vto-frame { max-width:360px; }
 }

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    html { background:url('../images/VTO_steiner.jpg') no-repeat center; background-size:cover; height:100%; }
    .container--vto { margin-top:30px; }
    .vto-controls__l2 ul.nav { width:100%; }
    .vto-controls__l2 ul.nav > .nav-item { margin-bottom:10px; }
    .vto-controls__colors { width:100%; flex-wrap:wrap; }
    .vto-controls__colors__item { margin-bottom:20px; font-size:11px; width:80px; }
    .vto-controls__l1 .nav-link img { width:60px; }
    .vto-controls__colors__item .color { width:40px; height:40px; }

    .vto-control__slide__l2__more,
    .vto-control__slide__l3__more,
    .vto-control__slide__color__more,
    .vto-control__slide__color__l3__more { display:none; }

    .tab-pane { position:relative; }
    .vto-product { display:block; position:absolute; right:-25px; top:0; }
    .vto-product__img { width:100px; }
 }

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  }