// CAROUSEL .owl-carousel { position: relative; .owl-nav { .owl-prev, .owl-next { color: $primary-color; opacity: 0; font-size: 30px; } .owl-prev { position: absolute; top: calc(50% - 15px); left: 0px; transition: 0.3s; } .owl-next { position: absolute; right: 0px; top: calc(50% - 15px); transition: 0.3s; } } &:hover { .owl-nav .owl-next, .owl-nav .owl-prev { opacity: 1; } .owl-nav .owl-next { right: 30px; } .owl-nav .owl-prev { left: 30px; } } .owl-dots { text-align: center; -webkit-tap-highlight-color: transparent; position: absolute; width: 100%; bottom: 20px; .owl-dot { display: inline-block; zoom: 1; *display: inline; span { width: 10px; height: 10px; margin: 5px 7px; background: #D6D6D6; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border-radius: 30px; } &.active, &:hover { span { background: $primary-color; } } } } } #artista-slider { margin-bottom: 10px; .item { width: 100%; position: relative; text-align: center; img { display: block; height: 460px; width: auto; margin: 0 auto; } } @include media-xs { margin-top: 30px; .item { img { height: auto; max-width: 100%; } } } .overlay { background: rgba(black, 37); position: absolute; bottom: 0; left: 0; right: 0; width: 100%; color: $white; font-size: 16px; font-family: $vbook; text-align: right; padding: 3px 15px; z-index: 3; } } #carousel { .item { overflow: hidden; a { display: block; width: 100%; height: 150px; overflow: hidden; background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important; transition: 0.3s; transform: scale(1.0); &:hover { transform: scale(1.2); } } } } .propiedad-slider { .item { width: 100% !important; text-align: center !important; a { display: block; outline: none !important; } img { width: auto !important; max-width: 100%; height: 100%; max-height: 480px; margin: 0 auto; } &.video { a { position: relative; &:before { content: "\f01d"; font-family: 'FontAwesome'; position: absolute; color: $black; z-index: 3; font-size: 100px; top: calc(50% - 60px); left: calc(50% - 40px); transform: scale(1.0); transition: 0.3s; opacity: .6; } &:hover { &:before { transform: scale(1.3); opacity: 1; } } } } } .owl-dots { counter-reset: slides-num; position: absolute; width: auto; max-width: 120px; bottom: 0; &:after { content: "/ " counter(slides-num); display: inline-block; vertical-align: middle; padding-left: 5px; color: $gray; font-family: $vbold; font-size: 24px; } } .owl-dot { display: inline-block; counter-increment: slides-num; margin-right: 5px; span { display: none !important; } &.active { &:before { content: counter(slides-num); display: inline-block; vertical-align: middle; position: absolute; left: 15px; top: 0; color: $primary-color; font-family: $vbold; font-size: 24px; } } } }