/*
    these are just the default styles used in the Cycle2 demo pages.  
    you can use these styles or any others that you wish.
*/


/* set border-box so that percents can be used for width, padding, etc (personal preference) */
.cycle-slideshow, .cycle-slideshow * { position:relative; }


.cycle-slideshow { width: 100%; margin: 0px auto; padding: 0; position: relative;
    background: url() 50% 50% no-repeat;
	z-index:10;
	height:auto;
 }
 
 .cycle-slideshow div {
     -webkit-background-size: cover!important;
  -moz-background-size: cover!important;
  -o-background-size: cover!important;
  background-size: cover!important;
  height:270px;
  width:100%;
 }

#alt-caption { display:none; }
 
.center { 
	position: absolute;
	
	width: 360px;
	z-index: 141;
	color:#ffffff;
    font-family: 'nexa_rust_sansblack';
    letter-spacing: 1px;
	font-size:38px;
	line-height:41px;
	margin:0px 45px 0px 0px;
    text-shadow: 2px 2px #000;
	padding:20px;
	top:0;
	right:0;
    margin-top: 250px;
	display:block;
}

/* slideshow images (for most of the demos, these are the actual "slides") */
.cycle-slideshow img { 
    /* 
    some of these styles will be set by the plugin (by default) but setting them here
    helps avoid flash-of-unstyled-content
    */
    position: absolute; top: 0; left: 0;
    width: 100%; padding: 0; display: block;
}

/* in case script does not load */
.cycle-slideshow img:first-child {
    position: static; z-index: 100;
}

/* pager */
.cycle-pager { 
     margin:20px 0px 0px 0px; z-index: 500; position: absolute; bottom:0; right:0; overflow: hidden;
}
.cycle-pager .pager_item { 
   font-size:0px; width: 14px; height: 14px; 
    display: inline-block; cursor: pointer; 
	background-color: none; border:#E2B900 solid 1px;
	float:left; margin-right:2px;
}
.cycle-pager div.cycle-pager-active { background-color: #E2B900;}
.cycle-pager > * { cursor: pointer;}


/* caption */
.cycle-caption { position: absolute; margin-right:0px; text-align:right; margin-left:200px; color:#fff; padding:14px 14px 14px 120px; bottom: 25%; right: 20px; z-index: 700; font-size:34px;  line-height:32px;  font-weight:300; font-family: 'Sumana', serif; background-image:url(../images/logo_caption.png); background-position:left; background-repeat:no-repeat; }


/* overlay */
.cycle-overlay { 
    font-family: tahoma, arial;
    position: absolute; bottom: 0; width: 100%; z-index: 600;
    background: black; color: white; padding: 15px; opacity: .5;
}

/* prev / next links */

#prev {
    left: 30px;
    bottom: 31%;
    width: 47px;
    position: absolute;
    z-index: 105;
    height: 46px;
    display: block;
/*    background: url(../images/prev2.png) 50% 50% no-repeat; */
    cursor: pointer;
    -webkit-transition: all 0.3s ease-out; 
    -moz-transition: all 0.3s ease-out; 
    transition: all 0.3s ease-out;  
}
#next {
    right: 30px;
    bottom: 31%;
    width: 45px;
    position: absolute;
    z-index: 105;
    height: 45px;
    display: block;
/*    background: url(../images/next2.png) 50% 50% no-repeat; */
    cursor: pointer;
    -webkit-transition: all 0.3s ease-out; 
    -moz-transition: all 0.3s ease-out; 
    transition: all 0.3s ease-out;  
}

/* #prev:hover {background: url(../images/prev2_hover.png) 50% 50% no-repeat;}
#next:hover {background: url(../images/next2_hover.png) 50% 50% no-repeat;}
*/

.disabled { opacity: .5; filter:alpha(opacity=50); }


/* display paused text on top of paused slideshow */
.cycle-paused:after {
    content: 'Paused'; color: white; background: black; padding: 10px;
    z-index: 500; position: absolute; top: 10px; right: 10px;
    border-radius: 10px;
    opacity: .5; filter: alpha(opacity=50);
}

/* 
    media queries 
    some style overrides to make things more pleasant on mobile devices
*/

@media all and (max-width: 650px) { 
    .cycle-slideshow { width: 100%; height:auto;}
    .cycle-overlay { padding: 4px; display:none; }
    .cycle-caption { bottom: 4px; right: 4px; display:none; opacity:0; }
	.center { display:none; }
	#alt-caption { display:none; opacity:0; }
	.pager { display:none; opacity:0; }
}