/*================
Decathlon SA
written for: www.decathlon.nl
initialization by dpdk // 06::05:2013

swatch colors:
> bfbfbf - Light gray
> 989898 - Gray
> 666 - Dark gray
> 218ced - Light blue
> 0071DE - Blue
> 1f6fdb - Darker blue (almost equals 0071DE)
> 1351a5 - Dark blue

sum up:
> Crumbpath
> Global
> Devices
===================*/

/*
 * Crumbpath
 */

@font-face {
    font-family: 'Roboto';
    src: url('/ecpt/static/faq2016/fonts/Roboto-Regular-webfont.eot');
    src: url('/ecpt/static/faq2016/fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/ecpt/static/faq2016/fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('/ecpt/static/faq2016/fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('/ecpt/static/faq2016/fonts/Roboto-Regular-webfont.svg#RobotoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Roboto';
    src: url('/ecpt/static/faq2016/fonts/oboto-Bold-webfont.eot');
    src: url('/ecpt/static/faq2016/fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/ecpt/static/faq2016/fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('/ecpt/static/faq2016/fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('/ecpt/static/faq2016/fonts/Roboto-Bold-webfont.svg#RobotoBold') format('svg');
    font-weight: bold;
    font-style: normal;
}




.float:after {
  /* positioning */
  display: block;
  clear: both;

  /* sizing */
  width: 100%;
  height: 0;

  /* font related */
  font-size: 0;
  line-height: 0;

  /* decorations */
  content: "";
}

.breadcrumb {
  /* positioning */
  position: relative;
  z-index: 10;

  /* sizing */
  width: 100%;
  height: 49px;

  /* decorations */
  background: #989898;
}

#breadcrumb-bg {
  /* positioning */
  float: left;

  /* sizing */
  padding-right: 40px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/bg-breadcrumb.png") no-repeat scroll 100% 0 transparent;
}

.breadcrumb_list {
  /* positioning */
  display: inline;
  float: left;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/bg-breadcrumb-repeatable.jpg") repeat-x scroll 0 0 transparent;
}

.breadcrumb_list li {
  /* positioning */
  display: inline;
  float: left;
  position: relative;

  /* decorations */
  list-style: none outside none;
}

.breadcrumb_list li a.link_breadcrumb {
  /* sizing */
  padding-right: 25px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/puce-06.gif") no-repeat scroll 100% 50% transparent;
}

.breadcrumb_list li a.link_breadcrumb,
.breadcrumb_list li span.link_breadcrumb {
  /* positioning */
  z-index: 2;
  position: relative;

  /* sizing */
  padding: 0 20px;

  /* font related */
  color: #FFFFFF;
  font-size: 12px;
  font-weight: bold;
  line-height: 49px;
  text-decoration: none;
}

.breadcrumb_list li.sep {
  /* sizing */
  width: 21px;
  height: 49px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/puce-05.png") no-repeat scroll 0 0 transparent;
}

.breadcrumb_list li.sep_next {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/puce-05-next.png");
}

#contact_breadcrumb .breadcrumb_list li a.link_breadcrumb_two_lines,
#contact_breadcrumb .breadcrumb_list li span.link_breadcrumb_two_lines {
  /* font related */
  line-height: 31px;
}

.breadcrumb_list li a.link_breadcrumb_two_lines,
.breadcrumb_list li span.link_breadcrumb_two_lines {
  /* positioning */
  display: inline-block;
  top: 8px;

  /* sizing */
  max-height: 49px;

  /* font related */
  line-height: 17px;
}

.breadcrumb_list li a.link_breadcrumb:hover {
  /* font related */
  text-decoration: underline;
}

.breadcrumb_list li.hover {
  /* decorations */
  background: none repeat scroll 0 0 #0071DE;
}

.breadcrumb .breadcrumb_list li a.link_breadcrumb_no_child_last {
  background: none;
  cursor: default;
  padding-right: 25px;
  text-decoration: none;
  top: 0px;
}



/*
 * Global
 */

html {
  /* decorations */
  background-color: #e8e8e8;
}
body {
  /* sizing */
  width: 100%;
}

#faq_container {
  /* sizing */
  margin: 0 auto;

  /* decorations */
  background-color: #FFF;
}

.contact_info {
  /* sizing */
  padding-top: 0px;

  /* decorations */
  overflow: hidden;
}

.contact_info div {
  /* positioning */
  float: left;
}

.contact_info .contact_items {
  /* sizing */
  margin-left: 312px;
}

.contact_info .contact_items div {
  /* sizing */
  margin-right: 0px;
  margin-top: 15px;
  padding: 15px 10px 5px 0;
}

.contact_info .contact_items div.contact_bellen {
  /* sizing */
  padding-right: 0;

  /* decorations */
  border: none;
}

.contact_info .contact_mail a {
  /* positioning */
  display: block;

  /* sizing */
  width: 160px;
  height: 66px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/contact_mail.png") no-repeat;
}

.contact_info .contact_mail a:hover {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/contact_mail_hover.png");
}

.contact_info .contact_twitter a {
  /* positioning */
  display: block;

  /* sizing */
  width: 160px;
  height: 66px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/contact_twitter.png") no-repeat;
}

.contact_info .contact_twitter a:hover {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/contact_twitter_hover.png");
}

.contact_info .contact_facebook a {
  /* positioning */
  display: block;

  /* sizing */
  margin-left: -3px;
  width: 160px;
  height: 66px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/contact_facebook.png") no-repeat;
}

.contact_info .contact_facebook a:hover {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/contact_facebook_hover.png");
}

.contact_info .contact_bellen a {
  /* positioning */
  display: block;

  /* sizing */
  width: 160px;
  height: 66px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/contact_call.png") no-repeat;
}

.contact_info .contact_bellen a:hover  {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/contact_call_hover.png");
}

.faq_content_wrapper {
  /* sizing */
  margin-top: 20px;
  min-height: 450px;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/gradient.png") no-repeat;
  overflow: auto;
}

#faq_menu_dropdown {
  /* positioning */
  display: none;
}

.faq_menu_container {
  /* positioning */
  float: left;
}

.faq_menu_container.stuck {
  /* positioning */
  position: fixed;
  top: 115px;
}

.faq_menu_container.stuck-bottom {
  /* positioning */
  position: absolute;
  bottom: -115px;
  top: auto;
}

.sticky-wrapper {
  /* positioning */
  float:left;

  /* sizing */
  width: 254px;
}

.faq_menu {
  /* sizing */
  margin-left: -7px;
}

.faq_menu li.menu_item {
  /* sizing */
  width: 254px;
  height: 53px;
  padding-left: 7px;

  /* decorations */
  outline: none;
}

.faq_menu li.menu_item a:active,
.faq_menu li.menu_item a:visited,
.faq_menu li.menu_item a:focus{
  /* decorations */
  outline: none;
  border: none;
}

.faq_menu .item_active,
.faq_menu li.menu_item:hover {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/bg_menu_arrow.png") no-repeat left center;
}

.faq_menu .divider {
  /* positioning */
  display: block;

  /* sizing */
  width: 188px;
  height: 1px;
  margin: 0 0 3px 20px;

  /* decorations */
  background: url("") no-repeat;
}

.faq_menu li a {
  /* positioning */
  display: block;

  /* sizing */
  padding: 15px 10px 19px 55px;

  /* font related */
  color: #000;

  /* decorations */
  outline: none;
}

.faq_menu .item_active a,
.faq_menu li:hover a {
  /* font related */
  color: #FFF;
}

.faq_menu li.item_mgv a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_meestgesteldevragen.png") no-repeat 15px 14px;
}

.faq_menu li.item_bestellen a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_bestellen.png") no-repeat 15px 14px;
}

.faq_menu li.item_levering a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_levering.png") no-repeat 15px 14px;
}

.faq_menu li.item_retourneren a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_retourneren.png") no-repeat 15px 15px;
}

.faq_menu li.item_betalen a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_betalen.png") no-repeat 15px 11px;
}

.faq_menu li.item_garantie a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_garantie.png") no-repeat 16px 13px;
}

.faq_menu li.item_account a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_account.png") no-repeat 18px 13px;
}

.faq_menu li.item_ereserv a {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/icon_ereserv.png") no-repeat 18px 13px;
}


.faq_menu li.item_mgv.item_active a,
.faq_menu li.item_mgv:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_meestgesteldevragen_hover.png");
}

.faq_menu li.item_bestellen.item_active a,
.faq_menu li.item_bestellen:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_bestellen_hover.png");
}

.faq_menu li.item_levering.item_active a,
.faq_menu li.item_levering:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_levering_hover.png");
}

.faq_menu li.item_retourneren.item_active a,
.faq_menu li.item_retourneren:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_retourneren_hover.png");
}

.faq_menu li.item_betalen.item_active a,
.faq_menu li.item_betalen:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_betalen_hover.png");
}

.faq_menu li.item_garantie.item_active a,
.faq_menu li.item_garantie:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_garantie_hover.png");
}

.faq_menu li.item_account.item_active a,
.faq_menu li.item_account:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_account_hover.png");
}

.faq_menu li.item_ereserv.item_active a,
.faq_menu li.item_ereserv:hover a {
  /* decorations */
  background-image: url("/ecpt/static/faq2016/img/icon_ereserv_hover.png");
}

.faq_accordion {
  /* positioning */
  float: left;

  /* sizing */
  width: 650px;
  margin-left: 60px;
  /*margin-left: 349px;*/
}

.faq_accordion div h3 {
  /* sizing */
  padding-top: 15px;
  padding-left: 45px;
  padding-bottom: 15px;
  margin-bottom: 0;

  /* font related */
  font-family: Roboto, Arial;
  color: #1f6fdb;
  font-size: 14px;
  text-transform: none;

  /* decorations */
  background: url("/ecpt/static/faq2016/img/arrow_right.png") no-repeat 11px center;
  outline: none;
  cursor: pointer;
  border-top: 1px dashed #bfbfbf;
}

.faq_accordion div h3:hover {
  /* font related */
  color: #1351a5;

  /* decorations */
  background-position: 20px center;
}

.faq_accordion div.accordion_item {
  /* decorations */
  border-bottom: 1px dashed #bfbfbf;
  margin-bottom: 25px;
}

.faq_accordion div.accordion_item div a {
  /* font related */
  color: #1F6FDB;
}

.faq_accordion div.accordion_item div a:hover {
  /* font related */
  text-decoration: underline;
  color: #1351A5;
}

.faq_accordion div h3.ui-state-active {
  /* decorations */
  background: url("/ecpt/static/faq2016/img/arrow_down.png") no-repeat 5px center;
}

.faq_accordion div h2 {
  /* sizing */
  padding-top: 25px;
  margin-top: 0;

  /* font related */
  color: #000;
  font-size: 14px;

  /*decorations */
  border-top: 1px dashed #bfbfbf;
}

.faq_accordion div div {
  /* sizing */
  padding-left: 75px;
  padding-bottom: 50px;

  /* font related */
  color: #666;
  font-size: 12px;
  font-family: Roboto, Arial;

  /* decorations */
  border-bottom: 1px dashed #bfbfbf;
}

.faq_accordion div div.ui-accordion-content-active {
  /* decorations */
  border: none;
}

.faq_accordion div.accordion_item {
  /* positioning */
  display: none;
}

.faq_accordion div.item_mgv {
  /* positioning */
  display: block;
}

.faq_accordion div.accordion_item ul {
  /* sizing */
  margin-left: 15px;
  margin-bottom: 10px;

  /* decorations */
  list-style: outside disc;
}





/*
 *Devices
 */

/* Tablet */
@media all and (max-width: 1023px) {
  #faq_container {
    /* sizing */
    width:100%;
  }

  .contact_info .contact_items {
    /* sizing */
    margin-left: 24%;
  }

  .faq_content_wrapper {
    /* decorations */
    background: none;
  }

  .faq_menu_container {
    /* sizing */
    width: 27%;
  }

  .sticky-wrapper {
    /* positioning */
    float: left;

    /* sizing */
    width: 20%;
  }

  .faq_menu li.menu_item {
    /* sizing */
    min-width: 160px;
    width: 100%;

    /* decorations */
    background-position: right center;
  }

  .faq_menu .item_active,
  .faq_menu li.menu_item:hover {
    /* decorations */
    background-position: right center;
  }

  .faq_menu .divider {
    /* sizing */
    width: 70%;
  }

  .faq_accordion {
    /* sizing */
    width: 63%;
    margin-left: 5%; /* 25% */
    margin-right: 5%;
  }

  /* hover state fixes*/
  .faq_accordion div h3:hover {
    /* font related */
    color: #1F6FDB;

    /* decorations */
    background-position: 11px center;
  }
}

@media all and (min-width: 680px) and (max-width: 810px) {
  .contact_info .contact_items {
    /* positioning */
    float: right;

    /* sizing */
    margin: 0;
    margin-right: 50px;
  }
}

/* Small Tablet */
@media all and (max-width: 680px) {
  .contact_info .contact_items {
    /* sizing */
    margin-right: auto;
    margin-left: auto;

    /* font related */
    text-align: center;
  }

  .contact_info .contact_items div {
    /* positioning */
    display: inline-block;
    float: none;

    /* sizing */
    width: 210px;

    /* decorations */
    border: none;
  }

  .contact_info .contact_items div.contact_twitter {
    /* decorations */
    border: none;
  }

  .contact_info .contact_items div.contact_facebook {
    /* positioning */
    clear: left;

    /* sizing */
    padding-left: 0;
  }

  .faq_menu li.menu_item a,
  .faq_menu li.menu_item.item_active a,
  .faq_menu li.menu_item:hover a {
    /* sizing */
    padding-left: 10px;

    /* decorations */
    background: none;
  }

  .faq_menu li.menu_item {
    /* sizing */
    min-width: 100px;
  }

  .faq_menu .divider {
    /* sizing */
    width: 50%;
  }
}

/* Mobile */
@media all and (max-width: 480px) {
  .contact_info {
    /* sizing */
    padding-top: 8px;
  }

  .contact_info .contact_items div {
    /* sizing */
    width: 200px;

    /* decorations */
    border: none;
  }

  .contact_info .contact_mail a {
    /* sizing */
    margin-left: -3px;
  }

  .contact_info .contact_facebook a {
    /* sizing */
    margin-left: -3px;
  }

  .faq_menu_container {
    /* positioning */
    display: none;
  }

  .faq_accordion {
    /* sizing */
    width: 90%;
    margin-left: 5%;
    margin-right: 0;
  }
  /* MFS */
  .mfs-container {
    /* positioning */
    position: relative;

    /* sizing */
    margin: 0 auto 20px;
    padding: 0 20px;
  }

  .mfs-container select {
    /* positioning */
    display: none;
  }

  .mfs-options {
    /* positioning */
    position: relative;
    z-index: 10;

    /* sizing */
    width: 100%;
    margin: 0;

    /* font related */
    list-style-type: none;
    font-family: Roboto, Arial;
    font-weight: bold;

    /* decorations */
    background: #ffffff;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MCUiIHkxPSIxMDAlIiB4Mj0iNTAlIiB5Mj0iLTEuNDIxMDg1NDcxNTIwMmUtMTQlIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzExMTIxMiIgc3RvcC1vcGFjaXR5PSIwLjA0Ii8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZiIgc3RvcC1vcGFjaXR5PSIwLjA0Ii8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+); /* gradient overlay */
    background-image: -moz-linear-gradient(bottom, rgba(18,18,18,.04) 0%, rgba(255,255,255,.04) 100%); /* gradient overlay */
    background-image: -o-linear-gradient(bottom, rgba(18,18,18,.04) 0%, rgba(255,255,255,.04) 100%); /* gradient overlay */
    background-image: -webkit-linear-gradient(bottom, rgba(18,18,18,.04) 0%, rgba(255,255,255,.04) 100%); /* gradient overlay */
    background-image: linear-gradient(bottom, rgba(18,18,18,.04) 0%, rgba(255,255,255,.04) 100%); /* gradient overlay */
  }

  .mfs-options li:first-child {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_meestgesteldevragen.png") no-repeat 15px center;
  }
  .mfs-options li:nth-child(2) {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_bestellen.png") no-repeat 15px center;
  }
  .mfs-options li:nth-child(3) {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_levering.png") no-repeat 15px center;
  }
  .mfs-options li:nth-child(4) {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_retourneren.png") no-repeat 15px center;
  }
  .mfs-options li:nth-child(5) {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_betalen.png") no-repeat 15px center;
  }
  .mfs-options li:nth-child(6) {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_garantie.png") no-repeat 15px center;
  }
  .mfs-options li:nth-child(7) {
    /* decorations */
    background: url("./ecpt/static/faq2016/img/icon_account.png") no-repeat 15px center;
  }

  .mfs-options li:nth-child(7) {
    /* decorations */
    background: url("/ecpt/static/faq2016/img/icon_ereserv.png") no-repeat 15px center;
  }

  .mfs-options li a {
    /* positioning */
    display: block;

    /* sizing */
    padding: 10px 0;
    margin: 0 20px 0 75px;

    /* font related */
    text-decoration: none;
    color: #1f6fdb;
  }

  .mfs-options li a:hover {
    /* font related */
    text-decoration: underline;
  }

  .mfs-optgroup-option {
    /* sizing */
    padding-left: 10px;
  }

  .mfs-options li.mfs-optgroup {
    /* sizing */
    padding: 4px 5px;

    /* font related */
    color: #999999;
  }

  a.mfs-selected-option {
    /* positioning */
    display: block;
    position: relative;

    /* sizing */
    padding: 10px 20px;

    /* font related */
    background-color: #218ced;
    color: #FFF;
    font-weight: 700;

    /* decorations */
    -moz-box-shadow: 2px 3px 5px rgba(0,0,0,.26); /* drop shadow */
    -webkit-box-shadow: 2px 3px 5px rgba(0,0,0,.26); /* drop shadow */
    box-shadow: 2px 3px 5px rgba(0,0,0,.26); /* drop shadow */
  }

  a.mfs-selected-option span:after {
    /* positioning */
    display: inline-block;
    position: absolute;
    top: 17px;
    right: 17px;

    /* sizing */
    width: 0;
    height: 0;

    /* decorations */
    border-top: 4px solid #FFF;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: "";
  }

  #faq_menu_dropdown {
    /* positioning */
    display:block;
  }
}

/* Mobile Portrait */
@media all and (max-width: 460px) {
  .contact_info .contact_items div {
    /* sizing */
    width: 150px;
    padding: 0;
  }
}




