/**
 * Plugin Name: Crelly Slider
 * Plugin URI: https://wordpress.org/plugins/crelly-slider/
 * Description: A free responsive slider that supports layers. Add texts, images, videos and beautify them with transitions and animations.
 * Version: 1.4.6
 * Author: Fabio Rinaldi
 * Author URI: https://github.com/fabiorino
 * License: MIT
 */

.crellyslider {
	margin: 0 auto;
	position: relative;
	white-space: nowrap;
	overflow: hidden;
	line-height: 1.5;
	font-size: 14px;
  	color: #000;
  	font-family: 'Verdana', sans-serif;
}

.crellyslider,
.crellyslider * {
	touch-action: pan-y; /* Needed for swipe-left and swipe-right on mobile */
}

.crellyslider a {
	color: #0073aa;
}

.crellyslider a:hover {
	color: #0073aa;
}

.crellyslider > .cs-preloader {
	width: 100%;
	height: 100%;
	z-index: 999;
	background-color: #fff;
	position: relative;
	overflow: hidden;
}

.crellyslider > .cs-preloader > .cs-bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 11;
	display: block;
	width: 100%;
	height: 100%;
	filter: blur(5px);
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-o-filter: blur(5px);
	-ms-filter: blur(5px);
}

.crellyslider > .cs-preloader > .cs-loader {
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -25px;
	margin-left: -25px;
	z-index: 12;
	background-color:#fff;
	box-shadow:0 3px 10px rgba(0,0,0,0.16), 0 3px 10px rgba(0,0,0,0.23);
	background-repeat: no-repeat;
	background-position: center center;
	border: 10px;
	border-radius: 50%;
}

.crellyslider > .cs-preloader > .cs-loader > .cs-spinner {
	top: 16px;
	left: 50%;
	margin-left: -2px;
}

.crellyslider > .cs-preloader > .cs-loader > .cs-spinner, .crellyslider > .cs-preloader > .cs-loader > .cs-spinner:before, .crellyslider > .cs-preloader > .cs-loader > .cs-spinner:after {
  width: 4px;
  height: 18px;
  background-color: #0b60a9;
  border-radius: 2px;
}

.crellyslider > .cs-preloader > .cs-loader > .cs-spinner {
  display: inline-block;
  position: relative;
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner:before, .crellyslider > .cs-preloader > .cs-loader > .cs-spinner:after {
  content: "";
  position: absolute;
  display: block;
  top: 0px;
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner:before {
  left: -6px;
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner:after {
  left: 6px;
}

@-webkit-keyframes cs-bounce-middle {
  0% {
    height: 4px;
    margin-top: 8px;
    margin-bottom: 8px;
  }
  50% {
    height: 20px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  100% {
    height: 4px;
    margin-top: 8px;
    margin-bottom: 8px;
  }
}
@keyframes cs-bounce-middle {
  0% {
    height: 4px;
    margin-top: 8px;
    margin-bottom: 8px;
  }
  50% {
    height: 20px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  100% {
    height: 4px;
    margin-top: 8px;
    margin-bottom: 8px;
  }
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner {
  -webkit-animation: cs-bounce-middle 0.6s ease 0.1s infinite;
          animation: cs-bounce-middle 0.6s ease 0.1s infinite;
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner:before, .crellyslider > .cs-preloader > .cs-loader > .cs-spinner:after {
  top: 50%;
  -webkit-transform: translateY(-10px) translateZ(0);
          transform: translateY(-10px) translateZ(0);
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner:before {
  -webkit-animation: cs-bounce-middle 0.6s ease 0s infinite;
          animation: cs-bounce-middle 0.6s ease 0s infinite;
}
.crellyslider > .cs-preloader > .cs-loader > .cs-spinner:after {
  -webkit-animation: cs-bounce-middle 0.6s ease 0.2s infinite;
          animation: cs-bounce-middle 0.6s ease 0.2s infinite;
}

.crellyslider > .cs-controls,
.crellyslider > .cs-navigation {
	z-index: 999;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	-ms-transition: all 0.2s;
	transition: all 0.2s;
	opacity: 0;
	filter: alpha(opacity=0);
}

.crellyslider:hover > .cs-controls,
.crellyslider:hover > .cs-navigation {
	opacity: 1;
	filter: alpha(opacity=100);
}

.crellyslider > .cs-slides {
	list-style: none;
	margin: 0;
	padding: 0;
}

.crellyslider > .cs-slides > .cs-slide {
	margin: 0;
	padding: 0;
	position: absolute;
	overflow: hidden;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.crellyslider > .cs-slides > .cs-slide > .cs-background-link {
	opacity: 0;
	z-index: 0;
	padding: 0;
	width: 100% !important;
	height: 100% !important;
	top: 0 !important;
	left: 0 !important;
}

.crellyslider > .cs-slides > .cs-slide > * {
	position: absolute;
  display: block;
	cursor: default;
	-webkit-transition: none;
	-moz-transition: none;
	-ms-transition: none;
	-o-transition: none;
	transition: none;
	font-size: 14px;
}

.crellyslider > .cs-slides > .cs-slide > a {
	cursor: pointer;
}

.crellyslider > .cs-slides > .cs-slide > img,
.crellyslider > .cs-slides > .cs-slide > a > img {
	max-width: none !important;
}

.crellyslider > .cs-slides > .cs-slide a,
.crellyslider > .cs-slides > .cs-slide > a > img {
	text-decoration: none;
	outline: none;
	border: none;
}

.crellyslider > .cs-controls {
	position: absolute;
	width: 100%;
	top: 50%;
	margin-top: -9px;
}

.crellyslider > .cs-controls > .cs-previous,
.crellyslider > .cs-controls > .cs-next {
	display: block;
	width: 35px;
	height: 35px;
	position: absolute;
	cursor: pointer;
	background-color:#fff;
	box-shadow:0 3px 10px rgba(0,0,0,0.16), 0 3px 10px rgba(0,0,0,0.23);
	background-repeat: no-repeat;
	background-position: center center;
	border: 10px;
	border-radius: 50%;
}

.crellyslider > .cs-controls > .cs-previous {
	background-image: url('../images/arrow-left.png');
	left: 30px;
}

.crellyslider > .cs-controls > .cs-next {
	background-image: url('../images/arrow-right.png');
	right: 30px;
}

.crellyslider > .cs-navigation {
	position: absolute;
	width: 100%;
	height: 0;
	bottom: 40px;
	text-align: center;
}

.crellyslider > .cs-navigation > .cs-slide-link {
	width: 15px;
	height: 15px;
	display: inline-block;
	cursor: pointer;
	margin: 6px;
	background-color:#fff;
	box-shadow:0 3px 10px rgba(0,0,0,0.16), 0 3px 10px rgba(0,0,0,0.23);
	border: 10px;
	border-radius: 50%;
	opacity: .5;
	filter: alpha(opacity=50);
}

.crellyslider > .cs-navigation > .cs-slide-link.cs-active {
	opacity: 1;
	filter: alpha(opacity=100);
}

.crellyslider > .cs-progress-bar {
	width: 0%;
	height: 4px;
	position: absolute;
	top: 0;
	background-color: #fff;
	opacity: .5;
	filter: alpha(opacity=50);
	z-index: 999;
}

.crellyslider > .cs-progress-bar.cs-progress-bar-hidden {
	opacity: 0;
	filter: alpha(opacity=0);
}
