/*
Plugin Name: Osteo - Scroll Image For Elementor
Plugin URI: http://twinkletheme.xyz/
Description: Osteo scroll image is a scroll image addons for elementor page builder.
Version: 1.0.0
Author: TwinkleTheme
Author URI: http://twinkletheme.xyz/
License: GPLv2 or later
Text Domain: osteo-scroll-image
*/
.scrolling-image-style-1, .scrolling-image-style-2, .scrolling-image-style-3, .scrolling-image-style-4, .scrolling-image-style-5, .scrolling-image-style-6, .scrolling-image-style-7, .scrolling-image-style-8, .scrolling-image-style-9, .scrolling-image-style-10, .scrolling-image-style-11, .scrolling-image-style-12, .scrolling-image-style-13, .scrolling-image-style-14, .scrolling-image-style-15, .scrolling-image-style-16, .scrolling-image-style-17, .scrolling-image-style-18, .scrolling-image-style-19 {
	height: 300px;
	background-position: top;
	transition: 3s;
	background-size: cover;
	position: relative;
}

.scrolling-image-style-20, .scrolling-image-style-21, .scrolling-image-style-22, .scrolling-image-style-23, .scrolling-image-style-24, .scrolling-image-style-25, .scrolling-image-style-26, .scrolling-image-style-27, .scrolling-image-style-28, .scrolling-image-style-29, .scrolling-image-style-30, .scrolling-image-style-31, .scrolling-image-style-32, .scrolling-image-style-33, .scrolling-image-style-34, .scrolling-image-style-35, .scrolling-image-style-36, .scrolling-image-style-37, .scrolling-image-style-38 {
	height: 300px;
	background-position: left;
	transition: 3s;
	background-size: cover;
	position: relative;
}

.scrolling-image-style-20:hover, .scrolling-image-style-21:hover, .scrolling-image-style-22:hover, .scrolling-image-style-23:hover, .scrolling-image-style-24:hover, .scrolling-image-style-25:hover, .scrolling-image-style-26:hover, .scrolling-image-style-27:hover, .scrolling-image-style-28:hover, .scrolling-image-style-29:hover, .scrolling-image-style-30:hover, .scrolling-image-style-31:hover, .scrolling-image-style-32:hover, .scrolling-image-style-33:hover, .scrolling-image-style-34:hover, .scrolling-image-style-35:hover, .scrolling-image-style-36:hover, .scrolling-image-style-37:hover, .scrolling-image-style-38:hover {
	background-position: right;
}

.scrolling-image-style-1:hover, .scrolling-image-style-2:hover, .scrolling-image-style-3:hover, .scrolling-image-style-4:hover, .scrolling-image-style-5:hover, .scrolling-image-style-6:hover, .scrolling-image-style-7:hover, .scrolling-image-style-8:hover, .scrolling-image-style-9:hover, .scrolling-image-style-10:hover, .scrolling-image-style-11:hover, .scrolling-image-style-12:hover, .scrolling-image-style-13:hover, .scrolling-image-style-14:hover, .scrolling-image-style-15:hover, .scrolling-image-style-16:hover, .scrolling-image-style-17:hover, .scrolling-image-style-18:hover, .scrolling-image-style-19:hover {
	background-position: bottom;
}

.scrolling-image-style-11:hover:before, .scrolling-image-style-12:hover:before, .scrolling-image-style-13:hover:before, .scrolling-image-style-14:hover:before, .scrolling-image-style-15:hover:before, .scrolling-image-style-16:hover:before, .scrolling-image-style-17:hover:before, .scrolling-image-style-18:hover:before, .scrolling-image-style-19:hover:before, .scrolling-image-style-30:hover:before, .scrolling-image-style-31:hover:before, .scrolling-image-style-32:hover:before, .scrolling-image-style-33:hover:before, .scrolling-image-style-34:hover:before, .scrolling-image-style-35:hover:before, .scrolling-image-style-36:hover:before, .scrolling-image-style-37:hover:before, .scrolling-image-style-38:hover:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: red;
	opacity: .7;
	transition: .5s;
}

.scrolling-image-style-11:hover .cmk-button, .scrolling-image-style-12:hover .cmk-button, .scrolling-image-style-13:hover .cmk-button, .scrolling-image-style-14:hover .cmk-button, .scrolling-image-style-15:hover .cmk-button, .scrolling-image-style-16:hover .cmk-button, .scrolling-image-style-17:hover .cmk-button, .scrolling-image-style-18:hover .cmk-button, .scrolling-image-style-19:hover .cmk-button, .scrolling-image-style-30:hover .cmk-button, .scrolling-image-style-31:hover .cmk-button, .scrolling-image-style-32:hover .cmk-button, .scrolling-image-style-33:hover .cmk-button, .scrolling-image-style-34:hover .cmk-button, .scrolling-image-style-35:hover .cmk-button, .scrolling-image-style-36:hover .cmk-button, .scrolling-image-style-37:hover .cmk-button, .scrolling-image-style-38:hover .cmk-button {
	opacity: 1 !important;
	visibility: visible;
	transition: .3s;
}

.scrolling-image-style-11 .cmk-button, .scrolling-image-style-12 .cmk-button, .scrolling-image-style-13 .cmk-button, .scrolling-image-style-14 .cmk-button, .scrolling-image-style-15 .cmk-button, .scrolling-image-style-16 .cmk-button, .scrolling-image-style-17 .cmk-button, .scrolling-image-style-18 .cmk-button, .scrolling-image-style-19 .cmk-button, .scrolling-image-style-30 .cmk-button, .scrolling-image-style-31 .cmk-button, .scrolling-image-style-32 .cmk-button, .scrolling-image-style-33 .cmk-button, .scrolling-image-style-34 .cmk-button, .scrolling-image-style-35 .cmk-button, .scrolling-image-style-36 .cmk-button, .scrolling-image-style-37 .cmk-button, .scrolling-image-style-38 .cmk-button {
	position: absolute;
	visibility: hidden;
	opacity: 0;
}

.scrolling-image-style-2 .cmk-button, .scrolling-image-style-3 .cmk-button, .scrolling-image-style-4 .cmk-button, .scrolling-image-style-5 .cmk-button, .scrolling-image-style-6 .cmk-button, .scrolling-image-style-7 .cmk-button, .scrolling-image-style-8 .cmk-button, .scrolling-image-style-9 .cmk-button, .scrolling-image-style-10 .cmk-button, .scrolling-image-style-21 .cmk-button, .scrolling-image-style-22 .cmk-button, .scrolling-image-style-23 .cmk-button, .scrolling-image-style-24 .cmk-button, .scrolling-image-style-25 .cmk-button, .scrolling-image-style-26 .cmk-button, .scrolling-image-style-27 .cmk-button, .scrolling-image-style-28 .cmk-button, .scrolling-image-style-29 .cmk-button {
	position: absolute;
	visibility: visible;
	opacity: 1;
}

.scrolling-image-style-2 .cmk-button, .scrolling-image-style-11 .cmk-button, .scrolling-image-style-21 .cmk-button, .scrolling-image-style-30 .cmk-button {
	top: 5%;
	left: 4%;
}

.scrolling-image-style-3 .cmk-button, .scrolling-image-style-12 .cmk-button, .scrolling-image-style-22 .cmk-button, .scrolling-image-style-31 .cmk-button {
	top: 6%;
	left: 50%;
	transform: translateX(-50%);
}

.scrolling-image-style-4 .cmk-button, .scrolling-image-style-13 .cmk-button, .scrolling-image-style-23 .cmk-button, .scrolling-image-style-32 .cmk-button {
	top: 6%;
	right: 6%;
}

.scrolling-image-style-5 .cmk-button, .scrolling-image-style-14 .cmk-button, .scrolling-image-style-24 .cmk-button, .scrolling-image-style-33 .cmk-button {
	top: 50%;
	left: 4%;
	transform: translateY(-50%);
}

.scrolling-image-style-6 .cmk-button, .scrolling-image-style-15 .cmk-button, .scrolling-image-style-25 .cmk-button, .scrolling-image-style-34 .cmk-button {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.scrolling-image-style-7 .cmk-button, .scrolling-image-style-16 .cmk-button, .scrolling-image-style-26 .cmk-button, .scrolling-image-style-35 .cmk-button {
	top: 50%;
	right: 5%;
	transform: translateY(-50%);
}

.scrolling-image-style-8 .cmk-button, .scrolling-image-style-17 .cmk-button, .scrolling-image-style-27 .cmk-button, .scrolling-image-style-36 .cmk-button {
	bottom: 5%;
	left: 4%;
}

.scrolling-image-style-9 .cmk-button, .scrolling-image-style-18 .cmk-button, .scrolling-image-style-28 .cmk-button, .scrolling-image-style-37 .cmk-button {
	bottom: 6%;
	left: 50%;
	transform: translateX(-50%);
}

.scrolling-image-style-10 .cmk-button, .scrolling-image-style-19 .cmk-button, .scrolling-image-style-29 .cmk-button, .scrolling-image-style-38 .cmk-button {
	bottom: 6%;
	right: 6%;
}

.cmk-button {
	display: inline-block;
	background-color: transparent;
	color: #000;
	border-radius: 2px;
	z-index: 5;
	transition: .3s;
}

.cmk-button:hover {
	border-radius: 2px;
}

.cmk-button:before {
	border-radius: 2px;
}

.cmk-button:after {
	border-radius: 2px;
}

.before-icon i {
	float: left;
	padding: 5px 0;
	padding-right: 10px;
}

.after-icon i {
	float: right;
	padding: 5px 0;
	padding-left: 10px;
}

.cmk-button.xs {
	font-size: 13px;
	padding: 8px 20px;
}

.cmk-button.sm {
	font-size: 15px;
	padding: 8px 24px;
}

.cmk-button.md {
	font-size: 15px;
	padding: 12px 32px;
}

.cmk-button.lg {
	font-size: 18px;
	padding: 15px 40px;
}

.cmk-button.xl {
	font-size: 20px;
	padding: 20px 50px;
}

/*Reset*/
a:focus, a:hover {
	color: #fff;
	text-decoration: none !important;
}