/**
 * @version     $id: $
 * @author      JoomlaUX!
 * @package     Joomla!
 * @subpackage  mod_jux_horizontal_accordion_slider
 * @copyright   Copyright (C) 2013 by JoomlaUX. All rights reserved.
 * @license     http://www.gnu.org/licenses/gpl-3.0.html GNU/GPL version 3, See LICENSE.txt
 */
/* ===[ accordion css reset ]=== */
.accordion * {
  border: 0;
  line-height: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}
/* ===[ accordion ]=== */
.accordion a {
  text-decoration: none;
  color: #EE561B;
  background: none;
}
.accordionShadow {
  border: 0;
  display: block;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}
.accordion * {
  list-style: none;
}
.accordion {
  margin: 0 auto;
  outline: none !important;
  position: relative;
}
.jAccordion-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
/* Do not change anything in this rule */
.accordion .jAccordion-slidesWrapper {
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}
/* Do not change display, overflow or position */
.accordion .jAccordion-slide {
  display: block;
  overflow: hidden;
  position: relative;
  -webkit-box-shadow: -5px 0 40px 1px #000;
          box-shadow: -5px 0 40px 1px #000;
}
/* Opera 10.xx bug fix
 * More info: http://css-lab.com/bug-test/opera-ap-bugfix.html
 */
.accordion .jAccordion-slide:after {
  content: "";
  float: left;
  height: 1%;
  width: 0;
}
/* ===[ Custom elements ]=== */
.accordion .title,
.accordion .caption,
.accordion .description {
  cursor: auto;
  overflow: hidden;
  position: absolute;
}
.accordion .title {
  bottom: 30px;
  left: 0;
  width: 180px;
  -moz-border-radius-topright: 5px;
  -moz-border-radius-bottomright: 5px;
  /* FF1+ */
  -webkit-border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  /* Safari 3-4, iOS 1-3.2, Android <=1.6 */
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  /* Opera 10.5, IE9, Safari 5, Chrome, Firefox 4+, iOS 4, Android 2.1+ */
}
.accordion .caption {
  text-align: center;
  white-space: nowrap;
}
.accordion .caption,
.accordion .description {
  /* FF1+ */
  /* Safari 3-4, iOS 1-3.2, Android <=1.6 */
  border-radius: 3px;
  /* Opera 10.5, IE9, Safari 5, Chrome, Firefox 4+, iOS 4, Android 2.1+ */
}
.accordion .description {
  bottom: 2%;
  margin-bottom: -8px;
  padding-top: 4px;
  padding: 10px 10px 5px 10px;
}
.accordion .description a:hover {
  color: white;
  background: none;
}
/* Preloader */
.accordion .preloader {
  background: url(../images/ajax-loader.gif) no-repeat center center;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
/* Horizontal Accordion with Timer */
.accordion .controlPanel {
  background: url(../images/controlPanel_background.png) no-repeat left top;
  height: 45px;
  left: 38%;
  position: absolute;
  top: -45px;
  width: 214px;
  z-index: 9999;
}
.accordion .controlPanel .prevBtn {
  background: url(../images/prevBtn_background.png) no-repeat 29px 10px;
  float: left;
  height: 35px;
  width: 46px;
}
.accordion .controlPanel .prevBtn:hover {
  background: url(../images/prevBtn_hover_background.png) no-repeat left top;
}
.accordion .controlPanel .nextBtn {
  background: url(../images/nextBtn_background.png) no-repeat 9px 10px;
  float: right;
  height: 35px;
  width: 46px;
}
.accordion .controlPanel .nextBtn:hover {
  background: url(../images/nextBtn_hover_background.png) no-repeat left top;
}
/* Horizontal Accordion with Timer  */
.accordion .timer {
  background: white;
  bottom: 0;
  height: 3px;
  left: 0;
  position: absolute;
  width: 0;
  z-index: 9999;
}
/* ===[ End of custom elements ]=== */
/* ===[ Default font styles ]=== */
.accordion h1,
.accordion h2,
.accordion h3 {
  padding: 7px 15px;
}
.accordion h1 {
  font-size: 17px;
  line-height: 1.7;
}
.accordion h2 {
  font-size: 15px;
  line-height: 1.5;
}
.accordion h3 {
  font-size: 14px;
  font-style: italic;
  line-height: 1.3;
}
.accordion p {
  color: #CCC;
  padding: 0 15px 7px;
  display: block;
  line-height: 25px !important;
}
/* ===[ End of default font styles ]=== */
/* ===[ Custom font styles ]=== */
.accordion h1.caption,
.accordion h2.caption,
.accordion h3.caption {
  line-height: 1;
  padding: 10px 20px 10px 20px;
}
.accordion h1.caption {
  font-size: 28px;
}
.accordion a:hover h1.caption {
  color: #005CAB;
  background: white;
}
.accordion h2.caption {
  font-size: 24px;
}
.accordion a:hover h2.caption {
  color: #005CAB;
  background: white;
}
.accordion h3.caption {
  font-size: 18px;
}
.accordion a:hover h3.caption {
  color: #005CAB;
  background: white;
}
/* ===[ End of custom font styles ]=== */
/* ===[ Rules used when JS is disabled ]===
 * If you don't care about JS fallback you can remove this entire section.
 * Percents are used to keep the responsiveness for the JS fallback even though it can sometimes make the accordion look a bit jumpy.
 */
/* Rule for inactive slide */
.accordion.noJS .jAccordion-slide {
  float: left;
  /* Remove this rule if using vertical accordion */
  margin-left: 0px;
  /* Spacing - I do not recommend to use spacing for horizontal accordion (replace with margin-top if using vertical accordion) */
  width: 25%;
  /* width = 100% / number of slides (replace width with height if using vertical accordion) */
}
/* Shrinked slide size 
 * shrinked slide size in percents = (100% - active slide size in percents) / (number of slides - 1);
 */
.accordion.noJS .jAccordion-slidesWrapper:hover .jAccordion-slide {
  width: 9.5%;
}
/* Active slide size
 * active slide size in percents = active slide size in px / accordion size * 100%;
 */
.accordion.noJS .jAccordion-slidesWrapper .jAccordion-slide:hover {
  width: 71.5%;
}
.accordion.noJS .jAccordion-slide .title {
  display: block;
}
.accordion.noJS .jAccordion-slide:hover .title {
  display: none;
}
.accordion.noJS .jAccordion-slide .description,
.accordion.noJS .jAccordion-slide .caption {
  display: none;
}
.accordion.noJS .jAccordion-slide:hover .description,
.accordion.noJS .jAccordion-slide:hover .caption {
  display: block;
}
/* ===[ End of rules used when JS is disabled ]=== */
/* ===[ Responsive ]=== */
/* iPad - screen width from 768px up to 1023px */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .accordion h1 {
    font-size: 17px;
    padding: 6px 10px;
  }
  .accordion h2 {
    font-size: 15px;
    padding: 6px 10px;
  }
  .accordion h3 {
    font-size: 14px;
    padding: 6px 10px;
  }
  .accordion h1.caption {
    font-size: 23px;
  }
  .accordion h2.caption {
    font-size: 19px;
  }
  .accordion h3.caption {
    font-size: 16px;
  }
  .accordion p {
    padding: 0 10px 6px;
  }
}
/* Small tablet - screen width from 480px up to 767px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .accordion h1 {
    font-size: 16px;
    padding: 2px 6px;
  }
  .accordion h2 {
    font-size: 15px;
    padding: 2px 6px;
  }
  .accordion h3 {
    font-size: 13px;
    padding: 2px 6px;
  }
  .accordion h1.caption {
    font-size: 18px;
  }
  .accordion h2.caption {
    font-size: 16px;
  }
  .accordion h3.caption {
    font-size: 14px;
  }
  .accordion p {
    padding: 0 6px 2px;
  }
  .accordion .description p {
    font-size: 10px !important;
    line-height: 15px !important;
  }
}
/* iPhone and small phones - screen width up to 479px */
@media only screen and (max-width: 479px) {
  .accordion h1 {
    font-size: 15px;
    padding: 0 3px;
  }
  .accordion h2 {
    font-size: 14px;
    padding: 0 3px;
  }
  .accordion h3 {
    font-size: 12px;
    padding: 0 3px;
  }
  .accordion h1.caption {
    font-size: 17px;
    font-weight: normal;
  }
  .accordion h2.caption {
    font-size: 15px;
    font-weight: normal;
  }
  .accordion h3.caption {
    font-size: 13px;
    font-weight: normal;
  }
  .accordion p {
    padding: 0 4px 2px;
  }
  .accordion .description {
    display: none !important;
  }
}