<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Captions and Animations &#8211; Serious Slider Plugin Demo</title>
	<atom:link href="https://demos.cryoutcreations.eu/wordpress/serious-slider/cat/captions-and-animations/feed/" rel="self" type="application/rss+xml" />
	<link>https://demos.cryoutcreations.eu/wordpress/serious-slider</link>
	<description>A free highly efficient SEO friendly fully translatable image slider for WordPress</description>
	<lastBuildDate>Wed, 25 Oct 2017 18:31:53 +0000</lastBuildDate>
	<language>en-CA</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>
	<item>
		<title>Caption Variations</title>
		<link>https://demos.cryoutcreations.eu/wordpress/serious-slider/captions-and-animations/caption-variations/</link>
		
		<dc:creator><![CDATA[tech]]></dc:creator>
		<pubDate>Wed, 25 Oct 2017 03:00:54 +0000</pubDate>
				<category><![CDATA[Captions and Animations]]></category>
		<guid isPermaLink="false">https://demos.cryoutcreations.eu/wordpress/serious-slider/?p=69</guid>

					<description><![CDATA[No Background &#160; Text Shadow &#160; Background Color]]></description>
										<content:encoded><![CDATA[<h2>No Background</h2>
		<div id="serious-slider-2-rnd8223" class="cryout-serious-slider seriousslider serious-slider-2-rnd8223 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-none" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd8223" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd8223" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Text Shadow</h2>
		<div id="serious-slider-2-rnd1470" class="cryout-serious-slider seriousslider serious-slider-2-rnd1470 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd1470" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd1470" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Background Color</h2>
		<div id="serious-slider-2-rnd2490" class="cryout-serious-slider seriousslider serious-slider-2-rnd2490 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-bgcolor" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd2490" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd2490" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Transition Animations</title>
		<link>https://demos.cryoutcreations.eu/wordpress/serious-slider/captions-and-animations/transition-animations/</link>
		
		<dc:creator><![CDATA[tech]]></dc:creator>
		<pubDate>Wed, 25 Oct 2017 02:20:54 +0000</pubDate>
				<category><![CDATA[Captions and Animations]]></category>
		<guid isPermaLink="false">https://demos.cryoutcreations.eu/wordpress/serious-slider/?p=66</guid>

					<description><![CDATA[Fade Transition &#160; Slide Transition &#160; Overslide Transition &#160; Underslide Transition &#160; Parallax Transition &#160; Horizontal Flip Transition &#160; Vertical Flip Transition]]></description>
										<content:encoded><![CDATA[<h2>Fade Transition</h2>
		<div id="serious-slider-2-rnd7822" class="cryout-serious-slider seriousslider serious-slider-2-rnd7822 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-fade seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd7822" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd7822" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Slide Transition</h2>
		<div id="serious-slider-2-rnd4102" class="cryout-serious-slider seriousslider serious-slider-2-rnd4102 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd4102" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd4102" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Overslide Transition</h2>
		<div id="serious-slider-2-rnd9612" class="cryout-serious-slider seriousslider serious-slider-2-rnd9612 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-overlide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd9612" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd9612" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Underslide Transition</h2>
		<div id="serious-slider-2-rnd8834" class="cryout-serious-slider seriousslider serious-slider-2-rnd8834 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-underslide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd8834" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd8834" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Parallax Transition</h2>
		<div id="serious-slider-2-rnd1708" class="cryout-serious-slider seriousslider serious-slider-2-rnd1708 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-parallax seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd1708" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd1708" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Horizontal Flip Transition</h2>
		<div id="serious-slider-2-rnd6180" class="cryout-serious-slider seriousslider serious-slider-2-rnd6180 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-hflip seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd6180" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd6180" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Vertical Flip Transition</h2>
		<div id="serious-slider-2-rnd9322" class="cryout-serious-slider seriousslider serious-slider-2-rnd9322 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-vflip seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd9322" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd9322" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Caption Animations</title>
		<link>https://demos.cryoutcreations.eu/wordpress/serious-slider/captions-and-animations/caption-animations/</link>
		
		<dc:creator><![CDATA[tech]]></dc:creator>
		<pubDate>Wed, 25 Oct 2017 02:10:55 +0000</pubDate>
				<category><![CDATA[Captions and Animations]]></category>
		<guid isPermaLink="false">https://demos.cryoutcreations.eu/wordpress/serious-slider/?p=73</guid>

					<description><![CDATA[No Animation &#160; Fade Caption &#160; Slide Caption &#160; Blur Caption &#160; Zoom In Caption &#160; Zoom Out Caption]]></description>
										<content:encoded><![CDATA[<h2>No Animation</h2>
		<div id="serious-slider-2-rnd5015" class="cryout-serious-slider seriousslider serious-slider-2-rnd5015 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-none seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd5015" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd5015" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Fade Caption</h2>
		<div id="serious-slider-2-rnd9267" class="cryout-serious-slider seriousslider serious-slider-2-rnd9267 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-fade seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd9267" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd9267" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Slide Caption</h2>
		<div id="serious-slider-2-rnd2939" class="cryout-serious-slider seriousslider serious-slider-2-rnd2939 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd2939" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd2939" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Blur Caption</h2>
		<div id="serious-slider-2-rnd1778" class="cryout-serious-slider seriousslider serious-slider-2-rnd1778 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-blur seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd1778" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd1778" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Zoom In Caption</h2>
		<div id="serious-slider-2-rnd9612" class="cryout-serious-slider seriousslider serious-slider-2-rnd9612 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-zoomin seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd9612" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd9612" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
<p>&nbsp;</p>
<h2>Zoom Out Caption</h2>
		<div id="serious-slider-2-rnd9255" class="cryout-serious-slider seriousslider serious-slider-2-rnd9255 serious-slider-2 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-0 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-zoomout seriousslider-textstyle-textshadow" data-ride="seriousslider">
			<div class="seriousslider-inner" role="listbox">

			
			<div class="item slide-1 active" role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-1.jpg" alt="Serious Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Serious Slider</span></div>						<div class="seriousslider-caption-text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris lorem felis, egestas in posuere ac, pellentesque et nisl. Etiam id aliquam nulla. Nunc id commodo erat, at aliquet enim. Maecenas ut tempus est.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Read more</a>
																																<a class="seriousslider-button" href="" >Read less</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-2 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-3.jpg" alt="Customizable Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>Customizable Slider</span></div>						<div class="seriousslider-caption-text"><p>Donec mollis elit et odio consectetur mattis. In pellentesque aliquam euismod. Mauris condimentum dui nunc, in congue dui sodales et. Pellentesque quis arcu lorem. Nam scelerisque fermentum ligula, eu ultrices purus congue non. Nullam fringilla mi in venenatis blandit. Curabitur iaculis sagittis leo vitae egestas. Donec eros nisl, dignissim eget arcu sit amet, tincidunt fermentum augue.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Button 1</a>
																																<a class="seriousslider-button" href="" >Button 2</a>
																					</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

			
			<div class="item slide-3 " role="option">
								<a  >
					<img decoding="async" class="item-image" src="https://demos.cryoutcreations.eu/wordpress/serious-slider/wp-content/uploads/2017/10/sample-slide-2.jpg" alt="WordPress Responsive Slider" >
				</a>
												<div class="seriousslider-caption">
					<div class="seriousslider-caption-inside">
						<div class="seriousslider-caption-title"><span>WordPress Responsive Slider</span></div>						<div class="seriousslider-caption-text"><p>Integer maximus tellus neque, a rhoncus augue finibus non. Praesent ullamcorper dui non justo blandit dictum. Sed placerat elit eu lacus congue, in ultricies felis sodales. In convallis risus et enim convallis suscipit.</p>
</div>						<div class="seriousslider-caption-buttons">
																								<a class="seriousslider-button" href="" >Sample Button</a>
																																				</div>
					</div><!--seriousslider-caption-inside-->
				</div><!--seriousslider-caption-->
								<div class="seriousslider-hloader"></div>
				<figure class="seriousslider-cloader">
					<svg width="200" height="200">
						<circle cx="95" cy="95" r="20" transform="rotate(-90, 95, 95)"/>
					</svg>
			  </figure>
			</div>

						</div>

			<div class="seriousslider-indicators">
				<ol class="seriousslider-indicators-inside">
										<li data-target="#serious-slider-2" data-slide-to="0" class="active"></li>
										<li data-target="#serious-slider-2" data-slide-to="1" ></li>
										<li data-target="#serious-slider-2" data-slide-to="2" ></li>
									</ol>
			</div>

			<button class="left seriousslider-control" data-target="#serious-slider-2-rnd9255" role="button" data-slide="prev">
			  <span class="sicon-prev control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Previous Slide</span>
			</button>
			<button class="right seriousslider-control" data-target="#serious-slider-2-rnd9255" role="button" data-slide="next">
			  <span class="sicon-next control-arrow" aria-hidden="true"></span>
			  <span class="sr-only">Next Slide</span>
			</button>
		</div>
		
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
