/*
 * Swiper - Mobile Touch Slider CSS
 * http://www.idangero.us/sliders/swiper
 *
 * Vladimir Kharlampidi, The iDangero.us
 * http://www.idangero.us/
 *
 * Copyright 2012-2013, Vladimir Kharlampidi
 * The iDangero.us
 * http://www.idangero.us
 *
 * Licensed under GPL & MIT
 *
*/

/* ===============================================================
Basic Swiper Styles
================================================================*/

.swiper-container {
  margin:0 auto;
  position:relative;
  overflow:hidden;
  -webkit-backface-visibility:hidden;
  -moz-backface-visibility:hidden;
  -ms-backface-visibility:hidden;
  -o-backface-visibility:hidden;
  backface-visibility:hidden;
  /* Fix of Webkit flickering */
  z-index:1; }

.swiper-wrapper {
  position:relative;
  width:100%;
  -webkit-transition-property:-webkit-transform, left, top;
  -webkit-transition-duration:0s;
  -webkit-transform:translate3d(0px,0,0);
  -webkit-transition-timing-function:ease;

  -moz-transition-property:-moz-transform, left, top;
  -moz-transition-duration:0s;
  -moz-transform:translate3d(0px,0,0);
  -moz-transition-timing-function:ease;

  -o-transition-property:-o-transform, left, top;
  -o-transition-duration:0s;
  -o-transform:translate3d(0px,0,0);
  -o-transition-timing-function:ease;
  -o-transform:translate(0px,0px);

  -ms-transition-property:-ms-transform, left, top;
  -ms-transition-duration:0s;
  -ms-transform:translate3d(0px,0,0);
  -ms-transition-timing-function:ease;

  transition-property:transform, left, top;
  transition-duration:0s;
  transform:translate3d(0px,0,0);
  transition-timing-function:ease; }

.swiper-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -ms-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto; }

.swiper-slide {
  float: left; }

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
  -ms-touch-action: pan-y; }

.swiper-wp8-vertical {
  -ms-touch-action: pan-x; }

/* ===============================================================
Your custom styles, here you need to specify container's and slide's
sizes, pagination, etc.
================================================================*/

#slider {
  position:relative;
  margin-top:20px; }

  #slider .arrow-left {
    position:absolute;
    left:10px;
    top:50%;
    margin-top:-15px;
    font-size:4em; }

  #slider .arrow-right {
    position:absolute;
    right:10px;
    top:50%;
    margin-top:-15px;
    font-size:4em; }

@media (min-width: 768px) {

  #slider .arrow-left,
  #slider .arrow-right {
    font-size:3em; }

}

.swiper-container {
  max-height:400px;
  width:90%; }

  .swiper-container .content-slide {
    padding:20px; }

  .swiper-container .title {
    font-size: 25px;
    margin-bottom: 10px; }

.swiper-slide {
  /* Specify Slides's Size: */
  width: 90%;
  /*height: 100%;*/ }

.swiper-slide-active {
  /* Specific active slide styling: */ }

.swiper-slide-visible {
  /* Specific visible slide styling: */ }

/* ===============================================================
Pagination Styles
================================================================*/

.pagination {
  text-align:center;
  width:100%; }

  .pagination .swiper-pagination-switch {
    display:inline-block;
    width:10px;
    height:10px;
    border-radius:10px;
    background:#acbbc3;
    margin:0 3px;
    cursor:pointer; }

  .pagination .swiper-active-switch,
  .pagination .swiper-active-switch {
    background:#617ca3; }