@import url('https://fonts.googleapis.com/css?family=Muli:400,700');

.faq-accordion {

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  font-smooth: always;

  max-width: 100%;

  margin: 0 auto;

  font-family: 'Muli', sans-serif;

  font-size: 13px;

  line-height: 24px;

  font-weight: 300;
  margin-bottom: 40px;

}

.acc-ctrl-btn {

  padding: 0;

  margin: 0 0 12px 0;

  box-sizing: border-box;

  text-align: right;

  display: block;

  clear: both;

  width: 100%;

}

.acc-ctrl-btn .acc-expand-all,

.acc-ctrl-btn .acc-collapsible-all {

  width: 24px;

  height: 24px;

  border: 1px solid #CCCCCC;

  font-size: 12px;

  text-align: center;

  display: inline-block;

  cursor: pointer;

}

.acc-ctrl-btn .acc-expand-all {

  margin-right: 5px;

}

/***********************************************************************************************/

/* 03. Accordion title bar & Themes */

/***********************************************************************************************/

h2.acc_title_bar {

  font-family: 'Muli', sans-serif;

  padding: 0;

  margin: 0 0 2px 0;

  height: 46px;

  line-height: 46px;

  font-size: 16px;

  font-weight: 500;

  display: block;

  background: transparent;

  overflow: hidden;

  -webkit-border-radius: 0px 0px 0 10px;

  -moz-border-radius: 0px 0px 0 10px;

  border-radius: 0px 0px 0 10px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.acc_title_bar a {

  color: #ffffff;

  text-decoration: none;

  display: block;

  padding: 0 0 0 56px;

  position: relative;

}

h2.acc_title_bar a:after {

  z-index: 1;

  left: 20px;

  top: 0;

  content: '';

  position: absolute;

  display: inline-block;

  width: 7px;

  height: 46px;

  line-height: 46px;

  background: transparent;

  -webkit-transform: skewX(50deg);

  -moz-transform: skewX(50deg);

  -ms-transform: skewX(50deg);

  -o-transform: skewX(50deg);

  transform: skewX(50deg);

  -webkit-transition: 0.5s 0.2s ease-out;

  -moz-transition: 0.5s 0.2s ease-out;

  -o-transition: 0.5s 0.2s ease-out;

  transition: 0.5s 0.2s ease-out;

}

h2.acc_title_bar a:before {

  z-index: 2;

  content: "\f107";

  font-family: 'Font Awesome 5 Free';

  display: inline-block;

  font-weight: 900;

  width: 48px;

  height: 46px;

  line-height: 46px;

  background: transparent;

  position: absolute;

  left: 0;

  top: 0;

  text-align: center;

  overflow: hidden;

  -webkit-border-radius: 0px 4px 0 4px;

  -moz-border-radius: 0px 4px 0 4px;

  border-radius: 0px 4px 0 4px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.acc_title_bar a:hover {

  color: #f0f0f0;

}

h2.acc_title_bar a:hover:before {

  content: "\f128";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

  display: inline-block;

  width: 48px;

  height: 46px;

  line-height: 46px;

  background: transparent;

  position: absolute;

  left: 0;

  top: 0;

}

h2.title-bar-active {

  background: transparent;

}

h2.title-bar-active a {

  color: #f0f0f0;

}

h2.title-bar-active a:after {

  z-index: 1;

  left: 20px;

  top: 0;

  content: '';

  position: absolute;

  display: inline-block;

  width: 7px;

  height: 46px;

  line-height: 46px;

  background: transparent;

  -webkit-transform: skewX(0deg);

  -moz-transform: skewX(0deg);

  -ms-transform: skewX(10deg);

  -o-transform: skewX(0deg);

  transform: skewX(0deg);

}

h2.title-bar-active a:before {

  content: "\f007";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

  display: inline-block;

  width: 48px;

  height: 46px;

  line-height: 46px;

  background: transparent;

  position: absolute;

  left: 0;

  top: 0;

}

h2.title-bar-active a:hover {

  color: #f0f0f0;

}

h2.title-bar-active a:hover:before {

  content: "\f068";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

  display: inline-block;

  width: 48px;

  height: 46px;

  line-height: 46px;

  background: transparent;

  position: absolute;

  left: 0;

  top: 0;

}

/***********************************************************************************************/

/* 3.1 Default theme */

/***********************************************************************************************/

h2.default-title-bar {

  background: #2c2c2c;

}

h2.default-title-bar a {

  color: #ffffff;

}

h2.default-title-bar a:after {

  background: #b3b330;

}

h2.default-title-bar a:before {

  background: #b3b330;

}

h2.default-title-bar a:hover {

  color: #f0f0f0;

}

h2.default-title-bar a:hover:before {

  background: #b3b330;

}

h2.default-title-bar-active {

  background: #121212;

}

h2.default-title-bar-active a {

  color: #f0f0f0;

}

h2.default-title-bar-active a:after {

  -webkit-transform: skewX(0deg);

  -moz-transform: skewX(0deg);

  -ms-transform: skewX(0deg);

  -o-transform: skewX(0deg);

  transform: skewX(0deg);

  background: #cfcf4d;

}

h2.default-title-bar-active a:before {

  content: "\f077";

  background: #cfcf4d;

}

h2.default-title-bar-active a:hover {

  color: #f0f0f0;

}

h2.default-title-bar-active a:hover:before {

  content: "\f068";

  background: #cfcf4d;

}







/***********************************************************************************************/

/* 04. Accordion content */

/***********************************************************************************************/

div.acc_container {

  margin: 0 0 2px 0;

  padding: 0;

  overflow: hidden;

  clear: both;

  background: #fbfbfb;

  border: 1px solid #d6d6d6;

  display: none;

}

div.acc_container .block {

  padding: 0 12px;

}



/***********************************************************************************************/

/* 06. Custom nav box */

/***********************************************************************************************/

h2.nav_square {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_square a {

  -webkit-transform: skewX(0deg);

  -moz-transform: skewX(0deg);

  -ms-transform: skewX(0deg);

  -o-transform: skewX(0deg);

  transform: skewX(0deg);

}

h2.nav_square a:before {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_square a:after {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

  -webkit-transform: skewX(0deg);

  -moz-transform: skewX(0deg);

  -ms-transform: skewX(0deg);

  -o-transform: skewX(0deg);

  transform: skewX(0deg);

}

h2.nav_square:before {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_square:after {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_arrow {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_arrow a {

  padding: 0 0 0 62px;

}

h2.nav_arrow a:after {

  left: -4px;

  top: 0;

  content: '';

  width: 48px;

  height: 48px;

  line-height: 46px;

  -webkit-transform: rotate(45deg);

  -moz-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg);

  -webkit-transition: 0.5s 0.2s ease-out;

  -moz-transition: 0.5s 0.2s ease-out;

  -o-transition: 0.5s 0.2s ease-out;

  transition: 0.5s 0.2s ease-out;

}

h2.nav_arrow a:before {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_circle {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

h2.nav_circle a {

  padding: 0 0 0 62px;

}

h2.nav_circle a:after {

  left: 36px;

  top: 33%;

  content: '';

  width: 18px;

  height: 18px;

  -webkit-border-radius: 100px;

  -moz-border-radius: 100px;

  border-radius: 100px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

  line-height: 18px;

  -webkit-transform: rotate(70deg);

  -moz-transform: rotate(70deg);

  -ms-transform: rotate(70deg);

  -o-transform: rotate(70deg);

  transform: rotate(70deg);

  -webkit-transition: 0.5s 0.2s ease-out;

  -moz-transition: 0.5s 0.2s ease-out;

  -o-transition: 0.5s 0.2s ease-out;

  transition: 0.5s 0.2s ease-out;

}

h2.nav_circle a:before {

  -webkit-border-radius: 0px;

  -moz-border-radius: 0px;

  border-radius: 0px;

  -webkit-background-clip: padding-box;

  -moz-background-clip: padding;

  background-clip: padding-box;

}

/***********************************************************************************************/

/* 07. Custom nav icon */

/***********************************************************************************************/

h2.nav_icon_angle a:before {

  content: "\f107";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle a:hover:before {

  content: "\f107";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_active a:before {

  content: "\f106";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_active a:hover:before {

  content: "\f106";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_double a:before {

  content: "\f103";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_double a:hover:before {

  content: "\f103";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_double_active a:before {

  content: "\f102";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_double_active a:hover:before {

  content: "\f102";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_caret a:before {

  content: "\f0d8";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_caret a:hover:before {

  content: "\f0d8";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_caret_active a:before {

  content: "\f0d7";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_caret_active a:hover:before {

  content: "\f0d7";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_chevron a:before {

  content: "\f078";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_chevron a:hover:before {

  content: "\f078";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_chevron_active a:before {

  content: "\f077";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}

h2.nav_icon_angle_chevron_active a:hover:before {

  content: "\f077";

  font-family: 'Font Awesome 5 Free';
  font-weight: 900;

}



/***********************************************************************************************/

/* 09. Responsive styling */

/***********************************************************************************************/

@media only screen and (min-width: 0px) and (max-width: 320px) {

  h2.acc_title_bar {

    min-height: 46px;

    line-height: 18px;

    font-size: 14px;

  }

  h2.acc_title_bar a {

    color: #ffffff;

    text-decoration: none;

    display: block;

    padding: 6px 0 0 56px;

    position: relative;

    height: 100%;

  }

  h2.rtl-title-bar a {

    padding: 0px 56px 0 0;

  }

}