.rail{
		display: block; position: relative;
		overflow: hidden;
		cursor: move; cursor: grab;	cursor: -moz-grab; cursor: -webkit-grab;
}
.rail>*:not(.rail-loader):not(.rail-bullets-holder){display: none}
.rail-controller{
		display: flex; position: absolute;
		width: auto; min-width: 100%; height: 100%;
		flex-direction: row; flex-flow: row;
		align-items: flex-start; align-content: stretch;
}
.rail-slide-controller{
		width: 100%; height: 100%;
		position: relative;
}
.rail-slide,
.rail-slide-content,
.rail-slide-bg{
		display: block; width: 100%; height: 100%;
		position: absolute; top: 0;
		/*-webkit-touch-callout: none;
	    -webkit-user-select: none;
	     -khtml-user-select: none;
	       -moz-user-select: none;
	        -ms-user-select: none;
	            user-select: none;*/
		pointer-events: none;
}
.rail-slide{opacity: 1; pointer-events: all; vertical-align: top}
.rail-transition{
		transition: 0.4s ease-out;
		-webkit-transition: 0.4s ease-out;
		-moz-transition: 0.4s ease-out;
		-o-transition: 0.4s ease-out;
		-ms-transition: 0.4s ease-out;
}
.rail-slide.rail-slide-off{opacity: 0 !important; pointer-events: none !important}
/*.rail-slide-bg{background-size: cover !important;}*/

.rail.mousedown{cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing}

.rail-scroll-block{overflow-x: hidden; overflow-y: hidden;}

.rail-loader{
	display: block; width: 100px; height: 60px; margin: auto;
	position: absolute; top: 0; bottom: 0; left: 0; right: 0;
	transition: 0.3s ease;
}
.rail-loader h3{
	text-align: center;
	transition: 0.3s ease; margin-top: 0;
}
.rail-loader-progress{
	display: block; width: 100px; height: 10px;
	margin: 6px auto; border-radius: 5px; overflow: hidden;
	position: relative; text-align: left;
	transition: 0.3s ease;
}
.rail-loader-progress>span{
	display: block; width: 0; height: 10px;
	vertical-align: top;
	transition: 0.3s ease;
}
.rail-loader.rail-loader-off h3{opacity: 0; margin-top: -10px}
.rail-loader .rail-loader-progress.rail-loader-off{width: 0}

.rail-bullets-holder{
		display: block; width: auto; height: auto;
		position: absolute; text-align: center;
}
.rail-bullets{
		display: block; width: 100%; height: 100%;
		position: relative; font-size: 0;
}
.rail-bullet{
		display: inline-block;
		position: relative;
		cursor: pointer;
		transition: 0.3s ease;
}
.rail-bullet>span{
		display: inline-block; box-sizing: content-box;
		border-style: solid; position: absolute;
		top: 50%; transform: translateY(-50%);
		left: 0; right: 0; margin: auto;
		cursor: pointer; transform-origin: center;
		transition: 0.3s ease;
}
.rail-bullet-on{pointer-events: none}
.rail-bullet-shape-square>span{border-radius: 0}
.rail-bullet-shape-circle>span{border-radius: 100%}

.rail-pop-toggle{
		display: block; width: 150px; height: 150px;
		position: absolute; z-index: 8000; bottom: 0; right: 0;
		font-size: 50px; background-color: rgba(95,196,235,0.8);
		transition: 0.3s ease;
		opacity: 0; pointer-events: none;
}
.rail-pop-toggle>i{
		display: block; text-align: center;
		position: absolute; top: 50%;
		left: 0; right: 0; margin: auto;
		transform: translateY(-50%);
}
.rail-slide:hover .rail-pop-toggle{
	opacity: 1; pointer-events: all;
}
.rail-pop{
		display: block; width: 100%; height: 100%;
		position: fixed; z-index: 10000;
		overflow-y: auto; top: 0; left: 0;
		background-color: #FFF;
}
.rail-pop-close{
		display: table; padding: 6px 10px;
		position: fixed; right: 10px; top: 10px;
		z-index: 10000; color: #FFF !important;
}
.rail-pop-close::after{
		content: ''; display: block; width: 100%;
		height: 100%; position: absolute; top: 50%; left: 0; right: 0;
		transform: translateY(-50%); z-index: 2999;
		-o-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -ms-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -moz-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		background-color: rgba(0,0,0,0.5);
}
.rail-pop-close>span{position: relative; z-index: 3000; font-size: 12px; text-transform: uppercase; color: #FFF !important;}
.rail-pop-close:hover::after{transform: translateY(-50%) scale(1.1,1.1)}
.rail-pop-close:hover{color: #FFF !important;}
.rail-pop-image{
		display: block; max-width: 100%; max-height: 100%; height: auto;
		margin: auto; position: absolute; top: 50%;
		transform: translateY(-50%); left: 0; right: 0;
}

.rail-pop{
	display: block; width: 100%; height: 100%;
	position: fixed; z-index: 10000;
	overflow-y: auto; top: 0; left: 0;
	background-color: #FFF;
}
.rail-pop-close{
	display: table; padding: 6px 10px;
	position: fixed; right: 10px; top: 10px;
	z-index: 10000; color: #FFF !important;
}
.rail-pop-close::after{
		content: ''; display: block; width: 100%;
		height: 100%; position: absolute; top: 50%; left: 0; right: 0;
		transform: translateY(-50%); z-index: 2999;
		-o-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		-ms-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		-moz-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		-webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
		background-color: rgba(0,0,0,0.5);
}
.rail-pop-close>span{position: relative; z-index: 3000; font-size: 12px; text-transform: uppercase; color: #FFF !important;}
.rail-pop-close:hover::after{transform: translateY(-50%) scale(1.1,1.1)}
.rail-pop-close:hover{color: #FFF !important;}
.rail-pop-image{
	display: block; max-width: 100%; max-height: 100%; height: auto;
	margin: auto; position: absolute; top: 50%;
	transform: translateY(-50%); left: 0; right: 0;
}

.rail-buttons-control{
	display: none;
	position: absolute; z-index: 10000;
	top: 50%; left: 0; right: 0; margin: auto;
	transform: translateY(-50%); pointer-events: none;
}
.rail-buttons-control>a{
	transition: 0.4s ease;
	display: block; opacity: .5;
	position: absolute; top: 50%; transform: translateY(-50%);
	pointer-events: all; border-radius: 100%;
}
.rail-buttons-control>a:not(.rail-button-disabled):hover{
	opacity: 1;
}
.rail-button-disabled{
	opacity: 0 !important; pointer-events: none;
}

.rail-buttons-control>a>i{
	display: block;
	text-align: center; line-height: 1;
	position: absolute; left: 0; right: 0; margin: auto; top: 50%; transform: translateY(-50%);
}
.rail-buttons-prev>i{margin-right: 10px !important;}
.rail-buttons-next>i{margin-left: 10px !important;}
.rail-buttons-prev{left: 2em;}
.rail-buttons-next{right: 2em;}

@media screen and (max-width: 1366px){

}
@media screen and (max-width: 1024px){

}
@media screen and (max-width: 980px){

}
@media screen and (max-width: 768px){

}
@media screen and (max-width: 640px){

}
@media screen and (max-width: 414px){

}
@media screen and (max-width: 320px){

}
