/*
* SliderPro v1.3
* Homepage: http://bqworks.com/slider-pro/
* Author: bqworks
* Author URL: http://bqworks.com/
*/
/* 5 :: SLIDER PRO */
.slider-pro { position: relative; margin: 0 auto; }
.sp-slides-container { position: relative; }
.sp-mask { position: relative; overflow: hidden; }
.sp-slides { position: relative; -webkit-backface-visibility: hidden; -webkit-perspective: 1000; }
.sp-slide { position: absolute; }
.sp-image-container { overflow: hidden; }
.sp-image { position: relative; display: block; border: none; }
.sp-no-js { overflow: hidden; max-width: 100%; }
/*  5.1 :: SliderPro Thumbnails */
.sp-thumbnails-container { position: relative; overflow: hidden; direction: ltr; }
.sp-top-thumbnails, .sp-bottom-thumbnails { left: 0; margin: 0 auto; }
.sp-top-thumbnails { position: absolute; top: 0; margin-bottom: 4px; }
.sp-bottom-thumbnails { margin-top: 4px; }
.sp-left-thumbnails, .sp-right-thumbnails { position: absolute; top: 0; }
.sp-right-thumbnails { right: 0; margin-left: 4px; }
.sp-left-thumbnails { left: 0; margin-right: 4px; }
.sp-thumbnails { position: relative; }
.sp-thumbnail { border: none; }
.sp-thumbnail-container { position: relative; display: block; overflow: hidden; float: left; -webkit-box-sizing: border-box; box-sizing: border-box; }
.sp-rtl .sp-thumbnail-container { float: right; }
.sp-top-thumbnails .sp-thumbnail-container, .sp-bottom-thumbnails .sp-thumbnail-container { margin-left: 2px; margin-right: 2px; }
.sp-top-thumbnails .sp-thumbnail-container:first-child, .sp-bottom-thumbnails .sp-thumbnail-container:first-child { margin-left: 0; }
.sp-top-thumbnails .sp-thumbnail-container:last-child, .sp-bottom-thumbnails .sp-thumbnail-container:last-child { margin-right: 0; }
.sp-left-thumbnails .sp-thumbnail-container, .sp-right-thumbnails .sp-thumbnail-container { margin-top: 2px; margin-bottom: 2px; }
.sp-left-thumbnails .sp-thumbnail-container:first-child, .sp-right-thumbnails .sp-thumbnail-container:first-child { margin-top: 0; }
.sp-left-thumbnails .sp-thumbnail-container:last-child, .sp-right-thumbnails .sp-thumbnail-container:last-child { margin-bottom: 0; }
.sp-right-thumbnails.sp-has-pointer { margin-left: -13px; }
.sp-right-thumbnails.sp-has-pointer .sp-thumbnail { position: absolute; left: 18px; margin-left: 0 !important; }
.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:before { content: ''; position: absolute; height: 100%; border-left: 5px solid #F00; left: 0; top: 0; margin-left: 13px; }
.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after { content: ''; position: absolute; width: 0; height: 0; left: 0; top: 50%; margin-top: -8px; border-right: 13px solid #F00; border-top: 8px solid transparent; border-bottom: 8px solid transparent; }
.sp-left-thumbnails.sp-has-pointer { margin-right: -13px; }
.sp-left-thumbnails.sp-has-pointer .sp-thumbnail { position: absolute; right: 18px; }
.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:before { content: ''; position: absolute; height: 100%; border-left: 5px solid #F00; right: 0; top: 0; margin-right: 13px; }
.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after { content: ''; position: absolute; width: 0; height: 0; right: 0; top: 50%; margin-top: -8px; border-left: 13px solid #F00; border-top: 8px solid transparent; border-bottom: 8px solid transparent; }
.sp-bottom-thumbnails.sp-has-pointer { margin-top: -13px; }
.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail { position: absolute; top: 18px; margin-top: 0 !important; }
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:before { content: ''; position: absolute; width: 100%; border-bottom: 5px solid #F00; top: 0; margin-top: 13px; }
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:after { content: ''; position: absolute; width: 0; height: 0; left: 50%; top: 0; margin-left: -8px; border-bottom: 13px solid #F00; border-left: 8px solid transparent; border-right: 8px solid transparent; }
.sp-top-thumbnails.sp-has-pointer { margin-bottom: -13px; }
.sp-top-thumbnails.sp-has-pointer .sp-thumbnail { position: absolute; bottom: 18px; }
.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:before { content: ''; position: absolute; width: 100%; border-bottom: 5px solid #F00; bottom: 0; margin-bottom: 13px; }
.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:after { content: ''; position: absolute; width: 0; height: 0; left: 50%; bottom: 0; margin-left: -8px; border-top: 13px solid #F00; border-left: 8px solid transparent; border-right: 8px solid transparent; }
/* 5.1 :: SliderPro Layers */
.sp-layer { -webkit-backface-visibility: hidden; }
/* 5.2 :: SliderPro Touch Swipe */
.sp-grab { cursor: url(../img/cursors/openhand.cur), move; }
.sp-grabbing { cursor: url(../img/cursors/closedhand.cur), move; }
.sp-selectable { cursor: default; }
/* 5.3 :: SliderPro Caption */
.sp-caption-container { text-align: center; margin-top: 10px; }
/* 5.6 :: SliderPro Full Screen */
.sp-full-screen { margin: 0 !important; background-color: #000; }
.sp-full-screen-button { position: absolute; top: 5px; right: 10px; font-size: 30px; line-height: 1; cursor: pointer; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.sp-full-screen-button:before { content: '\2195'; }
.sp-fade-full-screen { opacity: 0; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; }
.slider-pro:hover .sp-fade-full-screen { opacity: 1; }
/* 5.4 :: SliderPro Buttons */
.sp-buttons { position: absolute; width: 100%; text-align: center; left: 0; bottom: 7rem; }
.sp-rtl .sp-buttons { direction: rtl; }
.sp-full-screen .sp-buttons { display: none; }
.sp-button { width: 8px; height: 8px; background-color: rgba(255, 255, 255, 0.5); border-radius: 50%; margin: 4px; display: inline-block; cursor: pointer; -webkit-transition: background-color 0.3s ease-out; -o-transition: background-color 0.3s ease-out; transition: background-color 0.3s ease-out; }
.sp-button:hover { background-color: rgba(255, 255, 255, 0.75); }
.sp-selected-button { background-color: white; }
/* 5.5 :: SliderPro Arrows */
.sp-arrows { position: absolute; }
.sp-fade-arrows { opacity: 0; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; }
.sp-slides-container:hover .sp-fade-arrows { opacity: 1; }
.sp-horizontal .sp-arrows { width: 100%; left: 0; top: 50%; margin-top: -15px; }
.sp-vertical .sp-arrows { height: 100%; left: 50%; top: 0; margin-left: -10px; }
.sp-arrow { position: absolute; display: block; width: 24px; height: 24px; cursor: pointer; }
.sp-vertical .sp-arrow { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.sp-horizontal .sp-previous-arrow { left: 20px; right: auto; }
.sp-horizontal.sp-rtl .sp-previous-arrow { right: 20px; left: auto; }
.sp-horizontal .sp-next-arrow { right: 20px; left: auto; }
.sp-horizontal.sp-rtl .sp-next-arrow { left: 20px; right: auto; }
.sp-vertical .sp-previous-arrow { top: 20px; }
.sp-vertical .sp-next-arrow { bottom: 20px; -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }
.sp-previous-arrow:before, .sp-previous-arrow:after, .sp-next-arrow:before, .sp-next-arrow:after { content: ''; position: absolute; width: 4px; height: 12px; background-color: rgba(255, 255, 255, 0.75); -webkit-transition: background-color 0.3s ease-out; -o-transition: background-color 0.3s ease-out; transition: background-color 0.3s ease-out; }
 .sp-previous-arrow:before:hover, .sp-previous-arrow:after:hover, .sp-next-arrow:before:hover, .sp-next-arrow:after:hover {
 background-color: white;
}
.sp-arrow:before { left: 30%; top: 0; -webkit-transform: skew(145deg, 0deg); -ms-transform: skew(145deg, 0deg); transform: skew(145deg, 0deg); }
.sp-arrow:after { left: 30%; top: 50%; -webkit-transform: skew(-145deg, 0deg); -ms-transform: skew(-145deg, 0deg); transform: skew(-145deg, 0deg); }
.sp-next-arrow { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
.sp-horizontal.sp-rtl .sp-previous-arrow { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }
.sp-horizontal.sp-rtl .sp-next-arrow { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
/* 5.6 :: SliderPro Thumbnail Arrows */
.sp-thumbnail-arrows { position: absolute; }
.sp-fade-thumbnail-arrows { opacity: 0; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; }
.sp-thumbnails-container:hover .sp-fade-thumbnail-arrows { opacity: 1; }
.sp-top-thumbnails .sp-thumbnail-arrows, .sp-bottom-thumbnails .sp-thumbnail-arrows { width: 100%; top: 50%; left: 0; margin-top: -12px; }
.sp-left-thumbnails .sp-thumbnail-arrows, .sp-right-thumbnails .sp-thumbnail-arrows { height: 100%; top: 0; left: 50%; margin-left: -7px; }
.sp-thumbnail-arrow { position: absolute; display: block; width: 15px; height: 25px; cursor: pointer; }
.sp-left-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow, .sp-right-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.sp-top-thumbnails .sp-previous-thumbnail-arrow, .sp-bottom-thumbnails .sp-previous-thumbnail-arrow { left: 0px; }
.sp-top-thumbnails .sp-next-thumbnail-arrow, .sp-bottom-thumbnails .sp-next-thumbnail-arrow { right: 0px; }
.sp-left-thumbnails .sp-previous-thumbnail-arrow, .sp-right-thumbnails .sp-previous-thumbnail-arrow { top: 0px; }
.sp-left-thumbnails .sp-next-thumbnail-arrow, .sp-right-thumbnails .sp-next-thumbnail-arrow { bottom: 0px; }
.sp-previous-thumbnail-arrow:before, .sp-previous-thumbnail-arrow:after, .sp-next-thumbnail-arrow:before, .sp-next-thumbnail-arrow:after { content: ''; position: absolute; width: 50%; height: 50%; background-color: #FFF; }
.sp-previous-thumbnail-arrow:before { left: 30%; top: 0; -webkit-transform: skew(145deg, 0deg); -ms-transform: skew(145deg, 0deg); transform: skew(145deg, 0deg); }
.sp-previous-thumbnail-arrow:after { left: 30%; top: 50%; -webkit-transform: skew(-145deg, 0deg); -ms-transform: skew(-145deg, 0deg); transform: skew(-145deg, 0deg); }
.sp-next-thumbnail-arrow:before { right: 30%; top: 0; -webkit-transform: skew(35deg, 0deg); -ms-transform: skew(35deg, 0deg); transform: skew(35deg, 0deg); }
.sp-next-thumbnail-arrow:after { right: 30%; top: 50%; -webkit-transform: skew(-35deg, 0deg); -ms-transform: skew(-35deg, 0deg); transform: skew(-35deg, 0deg); }
/* 5.7 :: SliderPro Video */
a.sp-video { text-decoration: none; }
a.sp-video img { -webkit-backface-visibility: hidden; border: none; }
a.sp-video:after { content: '\25B6'; position: absolute; width: 45px; padding-left: 5px; height: 50px; border: 2px solid #FFF; text-align: center; font-size: 30px; border-radius: 30px; top: 0; color: #FFF; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.2); margin: auto; line-height: 52px; }
/* 19.1 Hero Slider */
.ui-hero.ui-hero-slider { padding: 2rem 0 3rem 0; }
 @media (min-width: 481px) {
.ui-hero.ui-hero-slider { padding: 2rem 0 3rem 0; }
}
 @media (min-width: 740px) {
.ui-hero.ui-hero-slider { padding: 2rem 0 3rem 0; }
}
 @media (min-width: 1367px) {
.ui-hero.ui-hero-slider { padding: 8rem 0; }
}
.ui-hero.ui-hero-slider .sp-slides { opacity: 1; -webkit-transition: opacity 0.35s ease-out; -o-transition: opacity 0.35s ease-out; transition: opacity 0.35s ease-out; }
.ui-hero.ui-hero-slider .sp-slides.fade { opacity: 0; }
.ui-hero.ui-hero-slider .sp-buttons { bottom: 1rem; }
 @media (min-width: 740px) {
.ui-hero.ui-hero-slider .sp-buttons { bottom: 1rem; }
}
 @media (min-width: 1367px) {
.ui-hero.ui-hero-slider .sp-buttons { bottom: 4rem; }
}
/* 19.2 :: Waves Hero */
.ui-hero.ui-waves { margin: 0 0 -2rem 0; padding: 2rem 0 4rem 0; }
 @media (min-width: 740px) {
.ui-hero.ui-waves { padding: 2rem 0 6rem 0; }
}
 @media (min-width: 1367px) {
.ui-hero.ui-waves { padding: 8rem 0 12rem 0; }
}
.ui-hero.ui-waves::after { display: block; content: ''; height: 100%; background: url(../img/svg-layers/waves.svg) bottom no-repeat; background-size: contain; position: absolute; bottom: -1px; left: -20%; right: -20%; z-index: 1; }
 @media (min-width: 740px) {
.ui-hero.ui-waves::after { left: -1px; right: -1px; }
}
/* 19.3 Curved Hero*/
.ui-hero.ui-curve { padding: 2rem 0 4rem 0; }
 @media (min-width: 740px) {
.ui-hero.ui-curve { padding: 2rem 0 6rem 0; }
}
 @media (min-width: 1367px) {
.ui-hero.ui-curve { padding: 8rem 0 12rem 0; }
}
.ui-hero.ui-curve::after { display: block; content: ''; height: 100%; background: url(../img/svg-layers/curve-layer.svg) bottom no-repeat; background-size: contain; position: absolute; bottom: -3px; left: -1px; right: -1px; z-index: 1; }
 @media (min-width: 992px) {
.ui-hero.ui-curve::after { left: -10%; right: -10%; }
}
 @media (min-width: 1367px) {
.ui-hero.ui-curve::after { left: -20%; right: -20%; }
}
 @media (min-width: 1500px) {
.ui-hero.ui-curve::after { left: -30%; right: -30%; }
}
/* 19.4 Tilt Hero */
.ui-hero.ui-tilt { margin: 0 0 -8rem 0; padding: 2rem 0 4rem 0; }
 @media (min-width: 740px) {
.ui-hero.ui-tilt { padding: 2rem 0 6rem 0; }
}
 @media (min-width: 1367px) {
.ui-hero.ui-tilt { padding: 8rem 0 16rem 0; }
}
.ui-hero.ui-tilt::after { display: block; content: ''; position: absolute; left: -8rem; right: -8rem; height: 16rem; background-color: #FFF; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); z-index: 1; }
 @media (min-width: 740px) {
.ui-hero.ui-tilt::after { -webkit-transform: rotate(-8.5deg); -ms-transform: rotate(-8.5deg); transform: rotate(-8.5deg); }
}
 @media (min-width: 992px) {
.ui-hero.ui-tilt::after { -webkit-transform: rotate(-5.5deg); -ms-transform: rotate(-5.5deg); transform: rotate(-5.5deg); }
}
.ui-hero.ui-tilt::after { bottom: -8rem; }
/* 19.5 Hero Gradient Animator */
.ui-hero.ui-gradient-animator { background: -webkit-linear-gradient(45deg, #fd81b5, #c961f7, #8089ff, #c961f7, #fe60a1, #ff8765, #fe60a1, #8089ff, #54ceff); background: -o-linear-gradient(45deg, #fd81b5, #c961f7, #8089ff, #c961f7, #fe60a1, #ff8765, #fe60a1, #8089ff, #54ceff); background: linear-gradient(45deg, #fd81b5, #c961f7, #8089ff, #c961f7, #fe60a1, #ff8765, #fe60a1, #8089ff, #54ceff); background-size: 450% 100%; -webkit-animation-name: animate_gradient; animation-name: animate_gradient; -webkit-animation-duration: 35s; animation-duration: 35s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }
