{if $slides}
<div class="loader">&nbsp;</div>
<script type="text/javascript">
	//refresOnResize();
</script>
<div class="header-container">
<div class="hider"></div>
<div class="slider-container" style="height: auto;">
	<div class="slider-delay" style="display:none">{$themeOptions->header->sliderDelayTime}</div>
    <div class="slider-animTime" style="display:none">{$themeOptions->header->sliderAnimTime}</div>
    <div class="slider-height" style="display:none">{$themeOptions->header->sliderHeight}</div>
	<div class="slider-width" style="display:none">{$themeOptions->header->sliderWidth}</div>

	<div class="main-background-slider-bottom" style="display:none; background: url('{!$slide->options->backgroundImage}') center center;"><img src="#" alt="top"/></div>
    <div class="main-background-slider-top" style="display:none;"></div>

    <div class="preload--background-slider-images" style="display: none;">
    	{foreach $slides as $slide}
    		{if $slide->options->backgroundImage}
    		  <img src="{$slide->options->backgroundImage}" alt="Background" />
    		{else}
    		  <img src="#" alt="Background" />
    		{/if}
    	{/foreach}
    </div>
  
	<ul class="slider slide clear clearfix">
		{var $i=1}
		{foreach $slides as $slide}
		
    <li class="clearfix">
		<span class="slide-wrap">
			<a href="{$slide->options->link}" class="inside-slider">
			{ifset $slide->options->topImage}
			  {if $slide->options->slideDescription}
				  <img src="{$slide->options->topImage}" alt="{$slide->options->slideDescription}" />
				{else}
				  <img src="{$slide->options->topImage}" alt="TopImage" />
				{/if}
			{/ifset}
			{if $slide->options->slideDescriptionPosition != 'hide'}
			
			{/if}
			</a>
			{ifset $slide->options->backgroundImage}
			<div class="background-image" style="display:none;">{$slide->options->backgroundImage}</div>
			{/ifset}
		</span>	
		<div class="slider-inner clearfix">
			<a class="slide-link" href="{$slide->options->link}"></a>
			<div class="custom-slide-{$slide->options->slideDescriptionPosition} csss clearfix" style="display: none; top: {$slide->options->buttonYPosition} !important;">
				<!-- <strong>{!$slide->title}</strong> -->
				<div class="description left" style="color: {!$slide->options->colorLink}; width: {!$slide->options->buttonWeight}">{!$slide->options->slideDescription}</div>
				{var $i++}
			</div>
		</div>
		</li>
		{/foreach}
	</ul>
	{var $t = 0}
	{ifset $post->options('slider')->overrideGlobal}
	{if $post->options('slider')->sliderType != '-1' }{var $t++}{/if}
	{if $post->options('slider')->sliderType2 != '-1' }{var $t++}{/if}
	{if $post->options('slider')->sliderType3 != '-1' }{var $t++}{/if}
	{if $post->options('slider')->sliderType4 != '-1' }{var $t++}{/if}
	{else}
	{if $themeOptions->header->sliderType != '-1' }{var $t++}{/if}
	{if $themeOptions->header->sliderType2 != '-1' }{var $t++}{/if}
	{if $themeOptions->header->sliderType3 != '-1' }{var $t++}{/if}
	{if $themeOptions->header->sliderType4 != '-1' }{var $t++}{/if}
	{/ifset}
	{if $t == 1 }<div class="slider-tabs" style="display: none;">{/if}
	{if $t == 2 }<div class="slider-tabs tabs2">{/if}
	{if $t == 3 }<div class="slider-tabs tabs3">{/if}
	{if $t == 4 }<div class="slider-tabs tabs4">{/if}
	{var $tt = 1}
	{ifset $post->options('slider')->overrideGlobal}
		<span class="space-left">&nbsp;</span>
		{if $post->options('slider')->sliderType != '-1'}
			<div class="hc{$tt++}"><h3>{$name[0]->name}</h3><p>{$desc[0]->description}</p></div>
		{/if}
		{if $post->options('slider')->sliderType2 != '-1'}
			<div class="hc{$tt++}"><h3>{$name2[0]->name}</h3><p>{$desc2[0]->description}</p></div>
		{/if}
		{if $post->options('slider')->sliderType3 != '-1'}
			<div class="hc{$tt++}"><h3>{$name3[0]->name}</h3><p>{$desc3[0]->description}</p></div>
		{/if}
		{if $post->options('slider')->sliderType4 != '-1'}
			<div class="hc{$tt++}"><h3>{$name4[0]->name}</h3><p>{$desc4[0]->description}</p></div>
		{/if}
		<span class="space-right">&nbsp;</span>
		</div>
	{else}
		<span class="space-left">&nbsp;</span>
		{if $themeOptions->header->sliderType != '-1'}
			<div class="hc{$tt++}"><h3>{$nameGlob[0]->name}</h3><p>{$descGlob[0]->description}</p></div>
		{/if}
		{if $themeOptions->header->sliderType2 != '-1'}
			<div class="hc{$tt++}"><h3>{$nameGlob2[0]->name}</h3><p>{$descGlob2[0]->description}</p></div>
		{/if}
		{if $themeOptions->header->sliderType3 != '-1'}
			<div class="hc{$tt++}"><h3>{$nameGlob3[0]->name}</h3><p>{$descGlob3[0]->description}</p></div>
		{/if}
		{if $themeOptions->header->sliderType4 != '-1'}
			<div class="hc{$tt++}"><h3>{$nameGlob4[0]->name}</h3><p>{$descGlob4[0]->description}</p></div>
		{/if}
		<span class="space-right">&nbsp;</span>
		</div>
	{/ifset}
</div><!-- end of slider -->

</div><!-- end of header-container -->
{/if}