/** * Owl Carousel v2.2.1 * Copyright 2013-2017 David Deutsch * Licensed under () */ /* * Default theme - Owl Carousel CSS File */ .owl-theme .owl-nav { margin-top: 0px; text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-nav [class*='owl-'] { color: #FFF; font-size: 36px; padding: 0px 22px 6px; cursor: pointer; font-weight: 200; } .owl-theme .owl-nav [class*='owl-']:hover { background: #d2d2d2; color: #FFF; text-decoration: none; } .owl-theme .owl-nav .disabled { opacity: 0.5; cursor: default; } .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 10px; } .owl-theme .owl-dots { bottom: 100px; display: block; position: absolute; text-align: center; -webkit-tap-highlight-color: transparent; width: 100%; } .owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1; *display: inline; } .owl-theme .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 5px 7px; background: #D6D6D6; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border-radius: 30px; border: 2px solid #cdcdcd; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791; } .owl-prev { float: left; position: absolute; top: 50%; } .owl-next { float: right; position: absolute; top: 50%; right: 0; } #banner .owl-theme .owl-nav { margin-top: 0px; -webkit-tap-highlight-color: transparent; width: 100%; } #banner .owl-theme .owl-next { float: right; /*-webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%);*/ position: absolute; top: 50%; } .clearfix:after{ content: ''; display: table;; clear: both; } /* custom */ /* Feel free to change duration */ .animated { -webkit-animation-duration : 1000 ms ; animation-duration : 1000 ms ; -webkit-animation-fill-mode : both ; animation-fill-mode : both ; } /* .owl-animated-out - only for current item */ /* This is very important class. Use z-index if you want move Out item above In item */ .owl-animated-out { z-index : 1 } /* .owl-animated-in - only for upcoming item /* This is very important class. Use z-index if you want move In item above Out item */ .owl-animated-in { z-index : 0 } .owl-item{ background: transparent; } /* .fadeOut is style taken from Animation.css and this is how it looks in owl.carousel.css: */ .fadeOut { -webkit-animation-name : fadeOut ; animation-name : fadeOut ; } @-webkit-keyframes fadeOut { 0% { opacity : 1 ; } 100% { opacity : 0 ; } } @keyframes fadeOut { 0% { opacity : 1 ; } 100% { opacity : 0 ; } }