/* Creative Popup basic Skin */

.cp-basic .cp-nav-prev,
.cp-basic .cp-nav-next,
.cp-basic .cp-bottom-slidebuttons a,
.cp-basic .cp-nav-start,
.cp-basic .cp-nav-stop,
.cp-basic .cp-nav-prev:after,
.cp-basic .cp-nav-next:after,
.cp-basic .cp-playvideo,
.cp-basic .cp-playvideo:after {
	transition: border .3s ease-in-out,
				border-radius .2s ease-in-out,
				background-color .3s ease-in-out,
				-o-transform .2s ease-in-out,
				-ms-transform .2s ease-in-out,
				-moz-transform .2s ease-in-out,
				-webkit-transform .2s ease-in-out,
				transform .2s ease-in-out
				!important;
}

.cp-basic .cp-playvideo {
	width: 50px;
	height: 50px;
	margin-left: -25px;
	margin-top: -25px;
}

.cp-basic .cp-playvideo:after {
	content: '';
	position: absolute;
	top: 50%;
	margin-top: -16px;
	width: 26px;
	height: 26px;
	border: 3px solid transparent;
	border-top: 3px solid rgba(255,255,255,0.75);
	right: 20px;
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	border-right: 3px solid rgba(255,255,255,0.75);
}

.cp-basic .cp-playvideo:hover {
	-o-transform: scaleX(1.2) scaleY(.7);
	-ms-transform: scaleX(1.2) scaleY(.7);
	-moz-transform: scaleX(1.2) scaleY(.7);
	-webkit-transform: scaleX(1.2) scaleY(.7);
	transform: scaleX(1.2) scaleY(.7);
}

.cp-basic .cp-playvideo:hover:after {
	border-top-color: rgba(255,255,255,1) !important;
	border-right-color: rgba(255,255,255,1) !important;
}

.cp-basic .cp-nav-prev,
.cp-basic .cp-nav-next {
	width: 50px;
	height: 50px;
	z-index: 10000;
	top: 50%;
	margin-top: -25px;
	position: absolute;
	border-radius: 25px;
}

.cp-basic .cp-nav-prev:after,
.cp-basic .cp-nav-next:after {
	content: '';
	position: absolute;
	top: 50%;
	margin-top: -16px;
	width: 26px;
	height: 26px;
	border: 3px solid transparent;
	border-top: 3px solid rgba(255,255,255,0.75);
}

.cp-basic .cp-nav-prev:after {
	left: 20px;
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	border-left: 3px solid rgba(255,255,255,0.75);
}

.cp-basic .cp-nav-next:after {
	right: 20px;
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	border-right: 3px solid rgba(255,255,255,0.75);
}

.cp-basic .cp-nav-prev:hover,
.cp-basic .cp-nav-next:hover {
	-o-transform: scaleX(1.2) scaleY(.7);
	-ms-transform: scaleX(1.2) scaleY(.7);
	-moz-transform: scaleX(1.2) scaleY(.7);
	-webkit-transform: scaleX(1.2) scaleY(.7);
	transform: scaleX(1.2) scaleY(.7);
}

.cp-basic .cp-nav-prev:hover:after {
	border-top-color: rgba(255,255,255,1) !important;
	border-left-color: rgba(255,255,255,1) !important;
}

.cp-basic .cp-nav-next:hover:after {
	border-top-color: rgba(255,255,255,1) !important;
	border-right-color: rgba(255,255,255,1) !important;
}

.cp-basic .cp-nav-prev {
	left: 10px;
}

.cp-basic .cp-nav-next {
	right: 10px;
}

.cp-basic .cp-bottom-slidebuttons a,
.cp-basic .cp-nav-sides {
	margin: 0 5px;
	width: 8px !important;
	height: 8px;
}

.cp-basic .cp-bottom-slidebuttons a {
	border-radius: 10px;
	border: 2px solid rgba(255,255,255,0.75) !important;
}

.cp-basic .cp-bottom-slidebuttons a.cp-nav-active {
	background-color: rgba(255,255,255,0.75);
}

.cp-basic .cp-bottom-slidebuttons a:hover {
	border: 2px solid rgba(255,255,255,1) !important;
}

.cp-basic .cp-bottom-slidebuttons a.cp-nav-active:hover {
	background-color: rgba(255,255,255,1) !important;
}

.cp-basic .cp-nav-start:after {
	position: absolute;
	content: '';
	width: 7px;
	height: 7px;
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	border-top: 2px solid rgba(255,255,255,0.75);
	border-right: 2px solid rgba(255,255,255,0.75);
	left: -14px;
	top: -10px;
}

.cp-basic .cp-nav-start {
	position: relative;
	-o-transform: scaleX(1.5);
	-ms-transform: scaleX(1.5);
	-moz-transform: scaleX(1.5);
	-webkit-transform: scaleX(1.5);
	transform: scaleX(1.5);
}

.cp-basic .cp-nav-start:hover:after,
.cp-basic .cp-nav-start-active:after {
	border-top: 2px solid rgba(255,255,255,1);
	border-right: 2px solid rgba(255,255,255,1);
}

.cp-basic .cp-nav-stop {
	border-left: 2px solid rgba(255,255,255,0.75) !important;
	border-right: 2px solid rgba(255,255,255,0.75) !important;
	width: 4px;
	height: 12px;
	margin-left: 5px;
}

.cp-basic .cp-nav-stop:hover,
.cp-basic .cp-nav-stop-active {
	border-left: 2px solid rgba(255,255,255,1) !important;
	border-right: 2px solid rgba(255,255,255,1) !important;
}

.cp-basic .cp-bottom-slidebuttons,
.cp-basic .cp-bottom-slidebuttons a,
.cp-basic .cp-nav-start,
.cp-basic .cp-nav-stop,
.cp-basic .cp-nav-sides {
	display: inline-block !important;
}

.cp-basic .cp-bottom-nav-wrapper {
	top: -30px;
}

.cp-basic .cp-nav-sides {
	width: 0px;
}

.cp-basic .cp-thumbnail-hover {
	bottom: 30px;
	padding: 2px;
	margin-left: 7px;
}

.cp-basic .cp-thumbnail-hover-bg {
	background: #eee;
	border-radius: 3px;
}

.cp-basic .cp-thumbnail-hover span {
	border: 5px solid #eee;
	margin-left: -5px;
}

.cp-basic .cp-thumbnail {
	top: 10px;
}

.cp-basic .cp-thumbnail-inner {
	padding: 2px;
	margin-left: -2px;
	background: #fff;
}

.cp-basic .cp-thumbnail-slide a {
	margin-right: 2px;
}

.cp-basic .cp-nothumb {
	background: #eee;
}

.cp-basic .cp-loading-container {
	width: 40px;
	height: 40px;
	margin-left: -20px;
	margin-top: -20px;
	background-position: -450px -150px;
}

.cp-basic .cp-loading-indicator {
	width: 22px;
	height: 22px;
	margin-top: 9px;
	background-image: url(../../../../img/core/skins/basic/loading.gif);
}

.cp-basic .cp-circle-timer {
	top: 16px;
	right: 16px;
	width: 24px;
	height: 24px;
}

.cp-basic .cp-ct-half,
.cp-basic .cp-ct-center {
	border-width: 2px;
}
