/*
Theme created for use with Sequence.js (http://www.sequencejs.com/)

Theme: Sliding Horizontal Parallax
Version: 1.2
Theme Author: Ian Lunn @IanLunn
Author URL: http://www.ianlunn.co.uk/
Theme URL: http://www.sequencejs.com/themes/sliding-horizontal-parallax/

This is a FREE theme and is available under a MIT License:
http://www.opensource.org/licenses/mit-license.php

Sequence.js and its dependencies are (c) Ian Lunn Design 2012 - 2013 unless otherwise stated.
*/

/* !CSS RESET */
/* prefix declarations */
/* THEME STYLES */
#main-slider {
  /*position: relative;
  min-height: 600px;
  max-width: 1400px;
  min-width: 960px;
  margin: 0 auto;
  overflow: hidden;
  background: url(../images/bg-sky.png) repeat-x #65b7f1;
  color: white;
  font-family: "Play", sans-serif;*/
}
#main-slider > .sequence-canvas {
  height: 100%;
  width: 100%;
}
/*#main-slider > .sequence-canvas > li {*/
#main-slider > .sequence-canvas > article {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
/*#main-slider > .sequence-canvas li > * {*/
#main-slider > .sequence-canvas article > * {
  position: absolute;
  -webkit-transition-timing-function: ease-in-out;
  -moz-transition-timing-function: ease-in-out;
  -ms-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}


/* ------------------------------------ 
 * NEXT / PREV BUTTONS
 * ------------------------------------
 */
#main-slider .sequence-next,
#main-slider .sequence-prev {
    color: #fff;
    color:#004687;
    cursor: pointer;
    
    display: none;
    
    font-size:54px;
    font-size:5.4rem;
    position:absolute;
    opacity: 0.6;
  
    bottom:50px;
    /*bottom:5rem;*/
  
    height: 54px;
    /*height: 5.4rem;*/
    width: 54px;
    /*width: 5.4rem;*/
    line-height: 54px;
    /*line-height: 5.4rem; */
  
    z-index: 10;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    }
#main-slider .sequence-prev {left: 40px;/*left: 4rem;*/}
#main-slider .sequence-next {right: 40px;/*right: 4rem;*/}

#main-slider .sequence-next:hover,
#main-slider .sequence-prev:hover {
    opacity: 0.84;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    }

#main-slider .sequence-prev:after,
#main-slider .sequence-next:after {
    display:block;
    position:absolute;
    bottom:0;
    z-index:10000;
    
    /*position:relative;
    top:0;
    left:0;*/
    
    height: 54px;
    /*height: 5.4rem;*/
    width: 54px;
    /*width: 5.4rem;*/
  
    /*font-family: "fontello";
    font-variant: normal;
    text-transform: none;  */
    
    /*speak: none;
    display: inline-block;
    text-decoration: inherit;
    text-align: center; */
    /* For safety - reset parent styles, that can break glyph codes*/
    /*font-variant: normal;
    text-transform: none;*/     
    /* fix buttons height, for twitter bootstrap */
    /*line-height: 1;
    vertical-align:baseline;*/
    
    /*box-shadow:0 2px 2px rgba(0,0,0,0.6);*/
    }
#main-slider .sequence-prev:after {content:url(../../../images/arrow_left_blue.svg);}
#main-slider .sequence-next:after {content:url(../../../images/arrow_right_blue.svg);}
body.compositum #main-slider .sequence-prev:after {content:url(../../../images/arrow_left_red.svg);}
body.compositum #main-slider .sequence-next:after {content:url(../../../images/arrow_right_red.svg);}


/* ------------------------------------ 
 * PAGINATION
 * ------------------------------------
 */
.sequence-pagination {
    position:absolute;
    display: none;
    z-index:10;
    bottom:60px;
    /*bottom:6rem;*/
    margin:0;
    padding:0;
    
    left:50%;
    margin-left:-445px;
    width:900px;
    text-align:center;
    }
.sequence-pagination li {
    display:inline;
    margin-right: 14px;
    }
.sequence-pagination li span {
    display:inline-block;
    width:12px;
    height:12px;
    border-radius:10px;
    background:#fff;
    cursor:pointer;
    
    box-shadow:0 0 2px rgba(0,0,0,0.6);
    
    opacity: 0.8;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    }
.sequence-pagination li span:hover,
.sequence-pagination li.current span {
    opacity: 0.94;
    opacity:1;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    }
.sequence-pagination li.current span {
    background:#004687;
    }
body.compositum .sequence-pagination li.current span {
    background:#e2001a;
    }
    
    

/* ------------------------------------ 
 * PAUSE
 * ------------------------------------
 */
.sequence-pause {
    position:absolute;
    top:45%;
    left:50%;
    z-index:9;
    width:50px;
    height:50px;
    opacity:0;
    }
.sequence-pause.paused {
    opacity: 0.8;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
    transition-duration: 0.4s;
    }
.sequence-pause.paused:after {
    width:50px;
    height:50px;
    display:block;
    background-image:url(../images/icon-pause.svg);
    background-repeat:no-repeat;
    background-position:top left;
    background-size:50px;
    }


/* ------------------------------------ 
 * INFO PANEL
 * ------------------------------------
 */
#main-slider .info-panel {
    top:60px;
    left:-150%;
    background:#004687;
    color:#fff;
    padding:20px;
    
    max-width:450px; 
    z-index: 2;
    
    border-radius:0 10px 10px 0;
    -webkit-transition-property: left;
    -moz-transition-property: left;
    -ms-transition-property: left;
    -o-transition-property: left;
    transition-property: left;
    }
#main-slider .animate-in .info-panel {
    left:0;
    z-index: 2;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s;
    }
#main-slider .animate-out .info-panel {
    left:-150%;
    z-index: 2;
    -webkit-transition-duration: 4s;
    -moz-transition-duration: 4s;
    -ms-transition-duration: 4s;
    -o-transition-duration: 4s;
    transition-duration: 4s;
    }


#main-slider .info-panel h2,
#main-slider .info-panel h3 {
    color:#fff;
    padding:0;
    }
#main-slider .info-panel h2 {
    font-size:36px;
    font-size:3.6rem;
    }
#main-slider .info-panel h3 {
    font-size:26px;
    font-size:2.6rem;
    text-transform:inherit;
    }



/* ------------------------------------ 
 * SLIDER IMAGE
 * ------------------------------------
 */
#main-slider .slider-image {
    height: auto;
    width: 100%;
    top: 0;
    opacity: 0;
    z-index:1;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -ms-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
    }
#main-slider .animate-in .slider-image {
    opacity:1;
    z-index:1;
    -webkit-transition-duration: 2s;
    -moz-transition-duration: 2s;
    -ms-transition-duration: 2s;
    -o-transition-duration: 2s;
    transition-duration: 2s;
    }
#main-slider .animate-out .slider-image {
    opacity:0;
    z-index:1;
    -webkit-transition-duration: 2s;
    -moz-transition-duration: 2s;
    -ms-transition-duration: 2s;
    -o-transition-duration: 2s;
    transition-duration: 2s;
    }