.hoefitVermogen #legenda_text {
  margin-right: 10px;
  float: right;
  font-family: robotolight; font-weight: normal; font-style: normal; line-height: normal;
  font-size: 16px; color: #666666;
}
.hoefitVermogen #legenda_image {
  float: right;
  padding: 6px;
}

.hoefitVermogen .btn.disabled, .btn[disabled], .btn.turnedOff {
  opacity: 0.35;
  filter: alpha(opacity=35);
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  pointer-events: none;
  cursor: not-allowed;
}

.hoefitVermogen .disclaimer {
  font-size: 12px;
  padding: 15px 5px;
}


#mainGraphRow .hoefitVermogen .disclaimer {
    font-size: 10px;
    margin-top: 8px;
    padding: 4px 5px 0 0;
}

.hoefitVermogen a:hover,
.hoefitVermogen a:focus {
  text-decoration: none;
}

.hoefitVermogen a.mail {
  padding-left: 18px;
}
a:link { -webkit-tap-highlight-color: #ff6600 !important; }
.hoefitVermogen h2 {
  font-size: 32px;
}

 .hoefitVermogen .col-md-6 .csc-header.csc-header-n1 h2.csc-firstHeader {
    color:black;
    font-size: 26px;
}

.hoefitVermogen h3 {
  font-size: 26px;
}

.hoefitVermogen h4 {
  font-size: 15pt;
  margin: 0 0 10px 0;
}

.hoefitVermogen ol {
  list-style-position: inherit;
  margin-left: 1em;
}
.hoefitVermogen ol > li {
  margin-left: 1em;
  margin-bottom: 5px;
}

.hoefitVermogen label#title{
      line-height: 20px;
}

#main-background {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    min-width: 100%;
    height: 850px;
    z-index: 1;
    background-repeat: no-repeat;
    background-position:  50% 176px;
    /** on mobile:
    padding: 0 10px;
    margin: 0 -10px;
    */
}


#main-background .animationLayer {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    min-width: 100%;
    height: 850px;
    background-repeat: no-repeat;
    background-position:  50% 176px;
}

#cookieWall:not(.hiddenCookie) + #main-background {
   top:80px;
}


.hoefitVermogen .btn.hidden,
.hoefitVermogen .hidden-button,
.hoefitVermogen .hidden-harmonie,
.hoefitVermogen .hidden-plukdedag,
.hoefitVermogen .hidden-verstandig,
.hoefitVermogen .hidden-visionair {
  display: none !important;
  visibility: hidden;
}

.hoefitVermogen .ui-widget-content {
    background: none;
}

#main.gradient-long {
  background: rgb(255,255,255); /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZmVmZWYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 1%, rgba(239,239,239,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(255,255,255,1)), color-stop(100%,rgba(239,239,239,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* W3C */

  background-size:100% 570px;
  background-position: 0% 176px ;
  background-repeat: no-repeat;

  z-index: 5;

}


#main.gradient-short {
    background: #FFF url(/static/RETAIL/img/gradients/main-gradient-short.png) 0 186px repeat-x;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZmVmZWYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 1%, rgba(239,239,239,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(255,255,255,1)), color-stop(100%,rgba(239,239,239,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 1%,rgba(239,239,239,1) 100%); /* W3C */

  background-size:100% 186px;
  background-position: 0% 176px ;
  background-repeat: no-repeat;


    z-index: 5;
}

#main.gradient-404 {
    background: #FFF url(/static/RETAIL/img/gradients/main-gradient-short.png) 0 80px repeat-x;
    z-index: 5;
}

.hoefitVermogen .goalFrame {
  /* margin-top: 25px; */
}




/*!
 *  Fit vermogen common classes
 */
.hoefitVermogen .gradientWithBoxShadow {
  padding: 3px 35px 45px 20px;
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y0ZjhmYyIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(244,248,252,0.4) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(244,248,252,0.4)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(244,248,252,0.4) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(244,248,252,0.4) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(244,248,252,0.4) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(244,248,252,0.4) 0%,rgba(255,255,255,1) 100%); /* W3C */


-webkit-box-shadow: inset 0px 15px 30px -6px rgba(233, 231, 238, 0.4);

        box-shadow: inset 0px 15px 30px -6px rgba(233, 231, 238, 0.4);
  position: relative;
  /* background: url(/static/RETAIL/img//sliderBg.png);
   background-repeat: no-repeat; */

}
.hoefitVermogen .gradientWithBoxShadow.goalFrame,
.hoefitVermogen .gradientWithBoxShadow.calculatorControls {
background: rgb(237,243,248); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VkZjNmOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(237,243,248,1) 0%, rgba(255,255,255,1) 70%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(237,243,248,1)), color-stop(70%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(237,243,248,1) 0%,rgba(255,255,255,1) 70%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(237,243,248,1) 0%,rgba(255,255,255,1) 70%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(237,243,248,1) 0%,rgba(255,255,255,1) 70%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(237,243,248,1) 0%,rgba(255,255,255,1) 70%); /* W3C */


-webkit-box-shadow: inset 0px 15px 30px -12px rgba(100, 100, 100, 0.3);

        box-shadow: inset 0px 15px 30px -12px rgba(100, 100, 100, 0.3);
}

#mainGraphRow .hoefitVermogen .calculatorControls .sliderContainer input
{
  font-size:10pt !important;
  color:#666 !important;
  background-color:transparent !important;
  box-shadow: none !important;
  cursor: initial;
}

#mainGraphRow .hoefitVermogen .calculatorControls .sliderContainer span3 {
	margin-right: -40px;
}

 .gradientWithBoxShadow .triangle {
  height: 31px;
  width: 16px;
  position: relative;
  background: url(/static/RETAIL/img/right-side-traingle.png);
  left: 100%;
  margin-left: 35px;
  top: 80px;
}




.hoefitVermogen .centered-pills { text-align:center; }
.hoefitVermogen .centered-pills ul.nav.nav-pills,
.hoefitVermogen .centered-pills ul.nav.nav-tabs { display:inline-block; }
.hoefitVermogen .centered-pills ul.nav.nav-pills li,
.hoefitVermogen .centered-pills ul.nav.nav-tabs li { display:inline; }
.hoefitVermogen .centered-pills ul.nav.nav-pills > li > a {
  padding-top:0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
  color:black;
  font-size:14px;
  font-family: Arial;
  font-weight: bold;
}
.hoefitVermogen .centered-pills ul.nav.nav-pills > li.active > a,
.hoefitVermogen .centered-pills ul.nav.nav-pills > li > a:hover {
  background: transparent;
  color:#FF6600;
}



.hoefitVermogen .center {
  text-align: center;
  margin: 0 auto;
}

.hoefitVermogen .dottedBottomBorder {
  border-bottom: 1px solid #EEE;
}

.hoefitVermogen .marginTop20 {
  margin-top: 20px;
}

/*.hoefitVermogen .marginTop20:first-child {
  margin-top: 0px;
}*/
.hoefitVermogen .marginTop10 {
  margin-top: 10px;
}

.hoefitVermogen .marginLeft5 {
  margin-left: 5px;
}
.hoefitVermogen .marginTop40 {
    margin-top: 40px;
  }

.hoefitVermogen .marginTop40p {
    margin-top: 40%;
  }
@media (max-width: 767px) {
  .hoefitVermogen .marginTop40p {
    margin-top: 10px;
  }
}

.hoefitVermogen .marginBottom20 {
  margin-bottom: 20px;
}

.hoefitVermogen .marginBottom40 {
  margin-bottom: 40px;
}

.hoefitVermogen .marginBottom10 {
  margin-bottom: 10px;
}

.hoefitVermogen .noMargin {
  margin:0;
}

.hoefitVermogen .paddingBottom20 {
  padding-bottom: 20px;
}

.hoefitVermogen .paddingRight20 {
  padding-right: 20px;
}

.hoefitVermogen .colorBlack {
  color:black;
}
.hoefitVermogen .colorGray {
  color:#666666;
}

.hoefitVermogen .colorDarkGray {
  color:#333333;
}

.hoefitVermogen .quizHeader {
  font-size: 40px;
  text-align: left;
}

.hoefitVermogen .quizSubheader {
  font-size:26px;
    font-family: robotolight;
    text-align: left;
}



.hoefitVermogen .colorOrange {
  color:#FF6600;
}

.hoefitVermogen .bottomTriangle  {
  position: relative;
}
.hoefitVermogen .bottomTriangle:after {
  content: "";
  width: 0px;
  height: 0px;
  border-right: 24px solid transparent;
  border-top: 24px solid #FFFFFF;
  border-left: 24px solid transparent;
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left:-24px;
  z-index: 2;
}


.hoefitVermogen .topTriangle  {
  position: relative;
}
.hoefitVermogen .topTriangle:before {
  content: "";
  width: 0px;
  height: 0px;
  border-right: 24px solid transparent;
  border-top: 24px solid #FFFFFF;
  border-left: 24px solid transparent;
  position: absolute;
  top: 45px;
  left: 50%;
  margin-left:-24px;
  z-index: 2;
}

.hoefitVermogen .subNavigation  + h2.bottomTriangle:after {
  top:60px;
}

.hoefitVermogen #fortune-wheel-container{

    overflow: hidden;
    height: 210px;

    margin-bottom: 80px;
    padding:3px 35px 20px 45px;

  }

.hoefitVermogen #fortune-wheel-container  .gradientWithBoxShadow {
  padding:1px 30px 45px 35px
}

.hoefitVermogen .fortune-wheel.bottomTriangle:after{
  top: 62px;


}

.hoefitVermogen h2.bottomTriangle:after{
  top: 45px;


}


.hoefitVermogen .btn-navPhone,
.hoefitVermogen .btn-big,
.hoefitVermogen .page-btn {
  padding:10px 20px;
  font-family: robotolight !important;
  font-weight: normal;
  font-style: normal;
  font-size: 18px !important;
   border-radius:5px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
 /* height: 44px;*/
  border:1px solid #ccc\9;

}



.ltie10 .hoefitVermogen .btn-navPhone,
.ltie10 .hoefitVermogen .btn-big,
.ltie10 .hoefitVermogen .page-btn {
  padding-top: 6px;
  height:40px;
}

.ltie9 .hoefitVermogen .btn-navPhone,
.ltie9 .hoefitVermogen .btn-big,
.ltie9 .hoefitVermogen .page-btn {
  height:50px;
}

.hoefitVermogen .page-btn .orange {
  color:#FF6600;
  padding-right:4px;
  font-family: robotobold;
  font-size: 16px;

  width:13px;
  margin-top:6px;
  height:20px;
}
.hoefitVermogen .page-btn .orange.pull-left {
  margin-right:10px;
  background: url(/static/RETAIL/img/arrow_orange_left.png);
  background-repeat: no-repeat;
}
.hoefitVermogen .page-btn .orange.pull-right {
  margin-left:10px;
  background: url(/static/RETAIL/img/arrow_orange.png);
  background-repeat: no-repeat;

}


.hoefitVermogen .page-btn  span {
  display: block;
  float:left;
  /*margin-top:8px\9;*/
}

.ltie10 .hoefitVermogen .page-btn  span.orange {
  margin-top: 5px;
}

.ltie9 .hoefitVermogen .page-btn  span.orange {
  margin-top: 12px;
}

.hoefitVermogen .page-btn span.pull-right {float: right;}

.hoefitVermogen .page-btn.disabled span,
.hoefitVermogen .page-btn.disabled {
  /*-moz-opacity: 0.20;
  opacity: 0.20;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=20);*/
  color:#666;
  cursor: default;
}

.hoefitVermogen .page-btn.disabled:hover{
  background: #FFFFFF;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhYWFhYWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  #FFFFFF 0%, #AAAAAA 150%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(150%,#AAAAAA));
  background: -webkit-linear-gradient(top,  #FFFFFF 0%,#AAAAAA 150%);
  background: -o-linear-gradient(top,  #FFFFFF 0%,#AAAAAA 150%);
  background: -ms-linear-gradient(top,  #FFFFFF 0%,#AAAAAA 150%);
  background: linear-gradient(to bottom,  #FFFFFF 0%,#AAAAAA 150%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#AAAAAA',GradientType=0 );
}
.hoefitVermogen .page-btn.disabled .orange.pull-left {
  margin-right:10px;
  background: url(/static/RETAIL/img/arrow_grey.png);
  background-repeat: no-repeat;
}
.hoefitVermogen .page-btn.disabled .orange.pull-right {
  margin-left:10px;
  background: url(/static/RETAIL/img/arrow_grey_right.png);
  background-repeat: no-repeat;

}



.hoefitVermogen .btn-blue {
  color: #FFFFFF;


  background: #4598CD;
  background: -moz-linear-gradient(top,  #4598CD 0%, #002D6B 150%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4598CD), color-stop(150%,#002D6B));
  background: -webkit-linear-gradient(top,  #4598CD 0%,#002D6B 150%);
  background: -o-linear-gradient(top,  #4598CD 0%,#002D6B 150%);
  background: -ms-linear-gradient(top,  #4598CD 0%,#002D6B 150%);
  background: linear-gradient(to bottom,  #4598CD 0%,#002D6B 150%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4598CD', endColorstr='#002D6B',GradientType=0 );
}

.hoefitVermogen .btn-blue:hover {
  background: -moz-linear-gradient(top,  #4598CD 0%, #002D6B 80%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4598CD), color-stop(80%,#002D6B));
  background: -webkit-linear-gradient(top,  #4598CD 0%,#002D6B 80%);
  background: -o-linear-gradient(top,  #4598CD 0%,#002D6B 80%);
  background: -ms-linear-gradient(top,  #4598CD 0%,#002D6B 80%);
  background: linear-gradient(to bottom,  #4598CD 0%,#002D6B 80%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4598CD', endColorstr='#002D6B',GradientType=0 );
}

.hoefitVermogen .btn-orange {
  color: #FFFFFF;
  background: #FF6600;
  background: -moz-linear-gradient(top,  #FF6600 0%, #FF0000 150%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF6600), color-stop(150%,#FF0000));
  background: -webkit-linear-gradient(top,  #FF6600 0%,#FF0000 150%);
  background: -o-linear-gradient(top,  #FF6600 0%,#FF0000 150%);
  background: -ms-linear-gradient(top,  #FF6600 0%,#FF0000 150%);
  background: linear-gradient(to bottom,  #FF6600 0%,#FF0000 150%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FF6600', endColorstr='#FF0000',GradientType=0 );
}


.hoefitVermogen .btn-orange:hover {
  background: -moz-linear-gradient(top,  #FF6600 10%, #FF0000 50%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF6600), color-stop(50%,#FF0000));
  background: -webkit-linear-gradient(top,  #FF6600 10%,#FF0000 50%);
  background: -o-linear-gradient(top,  #FF6600 10%,#FF0000 50%);
  background: -ms-linear-gradient(top,  #FF6600 10%,#FF0000 50%);
  background: linear-gradient(to bottom,  #FF6600 10%,#FF0000 50%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FF6600', endColorstr='#FF0000',GradientType=0 );
}


.hoefitVermogen .btn-gray {
  color: #002C6B;
  background: #FFFFFF;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNhYWFhYWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  #FFFFFF 0%, #AAAAAA 150%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(150%,#AAAAAA));
  background: -webkit-linear-gradient(top,  #FFFFFF 0%,#AAAAAA 150%);
  background: -o-linear-gradient(top,  #FFFFFF 0%,#AAAAAA 150%);
  background: -ms-linear-gradient(top,  #FFFFFF 0%,#AAAAAA 150%);
  background: linear-gradient(to bottom,  #FFFFFF 0%,#AAAAAA 150%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#AAAAAA',GradientType=0 );
}


.hoefitVermogen .btn-gray:hover {
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYWFhYWFhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
  background: -moz-linear-gradient(top,  #FFFFFF 10%, #AAAAAA 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FF6600), color-stop(100%,#FF0000));
  background: -webkit-linear-gradient(top,  #FFFFFF 10%,#AAAAAA 100%);
  background: -o-linear-gradient(top,  #FFFFFF 10%,#AAAAAA 100%);
  background: -ms-linear-gradient(top,  #FFFFFF 10%,#AAAAAA 100%);
  background: linear-gradient(to bottom,  #FFFFFF 10%,#AAAAAA 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#AAAAAA',GradientType=0 );
}

.jqplot-highlighter-tooltip,
.tooltip-inner {
  background-color: #FF6600 !important;
  color:white;
  font-family: Arial;
  font-size: 14px;
  font-weight: normal;
   -webkit-box-shadow:  -1px 5px 5px -2px rgba(0, 0, 0, 0.5);
        box-shadow:  -1px 5px 5px -2px rgba(0, 0, 0, 0.5);
}

.tooltip.top .tooltip-arrow {
    bottom: -5px;
    left: 50%;
    margin-left: -10px;
    border-top-color: #000000;
    border-width: 10px 10px 0;
}

.jqplot-highlighter-tooltip {
  background-color: #4598CD !important;
  border-color: #4598CD !important;

}


.tooltip.top .tooltip-arrow {
  border-top-color: #FF6600 !important;
}

.tooltip.right .tooltip-arrow {
  border-right-color: #FF6600 !important;
}

.tooltip.left .tooltip-arrow {
  border-left-color: #FF6600 !important;
}

.tooltip.bottom .tooltip-arrow {
  border-bottom-color: #FF6600 !important;
}


/*==================================================
 * movieContainer
 * ===============================================*/
.hoefitVermogen .movieContainer {
  border: 10px solid white;
  width: 100%;
  -webkit-box-shadow: 0 10px 6px -6px #777;
  -moz-box-shadow: 0 10px 6px -6px #777;
  box-shadow: 0 10px 6px -6px #777;
   position: relative;
}

.hoefitVermogen .movieContainer.greyBorder {
    border: 6px solid #EAEAEA;
    margin: 0 auto;
}
.hoefitVermogen h6 + .movieContainer.greyBorder {
    width: 100%;
}

 .hoefitVermogen .movieContainer.paddingBottom30{
  padding-bottom: 30px;
 }

  .hoefitVermogen .movieContainer.bigFrame {
    border: 20px solid white;

  }
/*.hoefitVermogen .movieContainer:after {
    background-color: #666666;
    border-radius: 77%;
    bottom: -17px;
    content: "";
    height: 12px;
    left: -6%;
    position: absolute;
    width: 112%;
    z-index: -1;
}*/

.hoefitVermogen .movieContainer.bigFrame:after {
  bottom: -27px;
}
.hoefitVermogen .movieHolder {

  position: relative;
  padding:0;
  padding-bottom: 56.25%;

  height: 0;
  overflow: hidden;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;



}

.hoefitVermogen .movieMargin .movieHolder  {
  margin-top:10px;
  width:97%;
}



.hoefitVermogen .movieHolder.widescreen {
    padding-bottom: 57.25%;
}
.hoefitVermogen .movieHolder.vimeo {
    padding-top: 0;
}
.hoefitVermogen .movieHolder iframe,
.hoefitVermogen .movieHolder object,
.hoefitVermogen .movieHolder embed,
.hoefitVermogen .movieHolder video,
.hoefitVermogen .movieHolder #video {
    position: absolute;
    top: 0;
    left: 0;
    width:100% !important;
    height:100% !important;
}

.hoefitVermogen .movieHolder #video.video-js.vjs-fullscreen {
  position: fixed;
overflow: hidden;
z-index: 1000;
left: 0;
top: 0;
bottom: 0;
right: 0;
width: 100% !important;
height: 100% !important;
_position: absolute;
}

.hoefitVermogen .movieControls {
  border-top: 10px solid #FFFFFF;
  text-align: center;
  background-color: white;
}


.hoefitVermogen .movieControls .progressChapter {
  height: 40px;
  display: block;
  overflow: hidden;

  /*background-color: #f7f7f7;
  background-image: -moz-linear-gradient(top, #f5f5f5, #f9f9f9);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), to(#f9f9f9));
  background-image: -webkit-linear-gradient(top, #f5f5f5, #f9f9f9);
  background-image: -o-linear-gradient(top, #f5f5f5, #f9f9f9);
  background-image: linear-gradient(to bottom, #f5f5f5, #f9f9f9*/);
  background-repeat: repeat-x;


}
.hoefitVermogen .movieControls .btnChapter {
  float:left;
  width: auto;
  margin-left: 7px;
  margin-left: 3px \9;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  background: #ABA195;

  background-color: #ABA195;
  color: white;

  font-family: Arial;
  font-weight: normal;
  font-style: normal;
  font-size: 13px;
  -webkit-box-shadow:inset 0 -5px 14px rgba(0, 0, 0, 0.2);
  -moz-box-shadow:inset 0 -5px 14px rgba(0, 0, 0, 0.2);
  box-shadow:inset 0 -5px 14px rgba(0, 0, 0, 0.2);
  word-break:break-all;
  z-index:1;

}

.hoefitVermogen .movieControls .btnChapter:hover {
   background-color: #91887F;


}
.hoefitVermogen .movieControls .btnChapter:first-child {
  margin-left:0px;
}


.hoefitVermogen .movieControls .progressChapter .chapterBar {


margin-top: -30px;
  display: initial;
  float: left;
  width: 0;
  height: 52px;
  font-size: 12px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
   background: #ff6600;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmNjYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #ff6600 0%, #ff0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff6600), color-stop(100%,#ff0000));
    background: -webkit-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: -o-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: -ms-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: linear-gradient(to bottom,  #ff6600 0%,#ff0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6600', endColorstr='#ff0000',GradientType=0 )\9;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
     -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: width 0.6s ease;
     -moz-transition: width 0.6s ease;
       -o-transition: width 0.6s ease;
          transition: width 0.6s ease;
}
.hoefitVermogen .movieControls .progressChapter .chapterTitle {
  position: relative;
  margin: 0 10px;
  top: 0px;
  display: block;
  padding-top: 10px;
  font-size: 13px;
  font-family: Arial;
  font-weight: bold;
  line-height: 150%;
}


.hoefitVermogen .movieControls .progressChapter .chapterBar + .chapterBar {
  -webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
     -moz-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}

/*==================================================
 * Diagram
 * ===============================================*/

 /* start of modification for 5 columns */
@media (min-width: 768px){
    .hoefitVermogen .diagram .col-md-2 {
        width: 18.297872340425532%;
        *width: 18.2234042553191494%;
    }
}
@media (min-width: 1200px) {
    .hoefitVermogen .diagram .col-md-2 {
        width: 18.9487179487179488%;
        *width: 18.87424986361156592%;
    }
}
@media (min-width: 768px) and (max-width: 979px) {
    .hoefitVermogen .diagram .col-md-2 {
        width: 17.79005524861878448%;
        *width: 17.7155871635124022%;
    }
}
/* end of modification for 5 columns */

.hoefitVermogen .diagram{
  position:relative;
  margin-bottom: 50px;
  background: #ABABAB;
  background: -moz-linear-gradient(top,  #F7F7F7 0% #FFFFFF 30%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F7F7F7), color-stop(30%,#FFFFFF));
  background: -webkit-linear-gradient(top,  #F7F7F7 0%,#FFFFFF 30%);
  background: -o-linear-gradient(top,  #F7F7F7 0%,#FFFFFF 30%);
  background: -ms-linear-gradient(top,  #F7F7F7 0%,#FFFFFF 30%);
  background: linear-gradient(to bottom,  #F7F7F7 0%,#FFFFFF 30%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E6E6E6', endColorstr='#FFFFFF',GradientType=0 );
  min-height:361px;
}

.hoefitVermogen .diagramHeader {
  padding-bottom: 14px;
  margin-top:30px;
}
.hoefitVermogen .diagram ul{
  text-align:center;
  width:100%;
  position:relative;
  z-index:2;
  list-style: none;
}

.hoefitVermogen .diagram li{
  float:left;
  margin:0 1px;
}
.hoefitVermogen .diagram  .box{
  overflow:visible !important;
  z-index:2;
  width:100%;
  position:absolute;
  bottom:0;
  min-height:10px;
  background-color: transparent;
}
.hoefitVermogen .diagram .box .bar{
  overflow:visible !important;
  height:100%;
  width:31%;
  position:absolute;
  bottom:0;
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;

  background: #4598CD;
  background: -moz-linear-gradient(top,  #4598CD 0%, #2668A1 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4598CD), color-stop(100%,#2668A1));
  background: -webkit-linear-gradient(top,  #4598CD 0%,#2668A1 100%);
  background: -o-linear-gradient(top,  #4598CD 0%,#2668A1 100%);
  background: -ms-linear-gradient(top,  #4598CD 0%,#2668A1 100%);
  background: linear-gradient(to bottom,  #4598CD 0%,#2668A1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4598CD', endColorstr='#2668A1',GradientType=0 );
  min-height:10px;
  margin:0 35%;
  -webkit-box-shadow:  0px 3px 4px -1px rgba(0, 0, 0, 0.5);
          box-shadow:  0px 3px 4px -1px rgba(0, 0, 0, 0.5);
}

.hoefitVermogen .diagram  .value,
.hoefitVermogen .diagram  .tooltip-btn
{
  display:block;
  text-align:center;
  position: absolute;
  top: -30px;
  left: 0;
  z-index: 3;
}

.hoefitVermogen .diagram  .tooltip-btn {
  top:-9px;
  left:55%;
}

.hoefitVermogen .diagram  .value {
  width: 100%;
  text-align:center;
  font-family: robotolight;
  font-size: 17px;
  font-weight: normal;
   color:#666666;
}

.hoefitVermogen .diagram .title{
  display:block;
  font-family: robotolight;
  font-size: 17px;
 color: #000000;
  font-weight: normal;

}

.hoefitVermogen .diagram .icon{
 height:58px;
  vertical-align: bottom;
    display: table-cell;
    margin:0 auto;
    width:100%;
}
.hoefitVermogen .diagram .box-section{
  position:relative;
  height:262px;
  width:100%;
  margin:0 auto 8px;
}

.hoefitVermogen .diagram a {
	font-size: 10px;
}

/*==================================================
 * Nav list
 * ===============================================*/
.hoefitVermogen .nav-list {
  padding-left:0;
}

.hoefitVermogen .nav-list li {
  padding: 2px 0px;
}
.hoefitVermogen .nav-list img {
  padding-top: 5px;
  padding-right: 4px;
}

.hoefitVermogen .nav-list a {
  color: #4598CC;
  font-family: robotolight;
  font-weight: normal;
  font-style: normal;
  font-size: 16px;
  margin:0;
}

.hoefitVermogen .nav-list a.active,
.hoefitVermogen .nav-list a:hover {
  color: #ff6600;
  background-color: transparent;
}
/*!
 *  Fit vermogen sub navigatie
 */

.hoefitVermogen .subNavigation {
  margin-bottom: 10px;
}
.hoefitVermogen .subNavigation ul li {
  /*width: 22.92817679558011%;
  margin-left: 2.0717%;*/
  width: 24%;
  margin-left: 1%;

}


.hoefitVermogen .subNavigation ul li:first-child {
  margin-left: 0;
}


.hoefitVermogen .subNavigation ul li  {

  color: white;
}
.hoefitVermogen .subNavigation ul li a .img {
  position: relative;
  content: "";
  width: 43px;
  height: 43px;
  background-repeat: no-repeat;
  display: block;
  float: left;
}

.hoefitVermogen .subNavigation ul li a .img.pageId6 {
   background: url(/static/RETAIL/img//submenu/sparen_of_beleggen.png);
}

.hoefitVermogen .subNavigation ul li a .img.pageId7,
.hoefitVermogen .subNavigation ul li a .img.pageId12 {
  background: url(/static/RETAIL/img//submenu/basisregels_beleggen.png);
}

.hoefitVermogen .subNavigation ul li a .img.pageId8 {
   background: url(/static/RETAIL/img//submenu/vermogensprofiel.png);
}

.hoefitVermogen .subNavigation ul li a .img.pageId9 {
  background: url(/static/RETAIL/img//submenu/vermogenscalculator.png);
}

.hoefitVermogen .subNavigation ul li a .link-title,
.hoefitVermogen .subNavigation ul li a .link-subtitle  {
  width: 100%;
  margin-left: 52px;
  display: block;
  margin-top: 10px;
}


.hoefitVermogen .subNavigation a .link-subtitle {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    margin-top: 8px;
    color:#000;
}

.hoefitVermogen .subNavigation ul li a {
  background: none;
  background-color: #9C9389;



  width: 100%;
  border:none;


  padding: 10px 5px 10px;
  height: 80px;

  color: #FFFFFF;
  font-family: robotolight;
  font-weight: normal;
  font-style: normal;
  font-size: 18px;
  line-height: 16px;

  -webkit-box-shadow: inset 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0px 0px 5px 3px rgba(0, 0, 0, 0.1);

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

  display: table-cell;
  min-width: 228px;
}


.hoefitVermogen .subNavigation li a:hover{
  background-color: #857E76;
  border-bottom-color: #857E76;

}
.hoefitVermogen .subNavigation li.active {
  position: relative;
}
.hoefitVermogen .subNavigation li.active a {
  background-color: #4598CC;
  border-bottom-color: #4598CC;
  position: relative;
}

.hoefitVermogen .subNavigation li.active a:after {
  content: "";
  width: 0px;
  height: 0px;
  border-right: 18px solid transparent;
  border-top: 18px solid #4598CC;
  border-left: 18px solid transparent;
  position: absolute;
  bottom: -13px;
  left: 50%;
  position: absolute;
  -webkit-box-shadow: inset 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
  z-index: 2;
  margin-left: -18px;
}



.hoefitVermogen .subNavigation  + h2 {
  padding-bottom: 20px;
}

/*!
 *  Fit vermogen waarom vermogen opbouwen
 */


.hoefitVermogen .whiteToTransparentGradient {


  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjgyIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  rgba(255,255,255,0.9) 10%, rgba(255,255,255,0) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(10%,rgba(255,255,255,0.9)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0.9) 10%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,0.9) 10%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,0.9) 10%,rgba(255,255,255,0) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,0.9) 10%,rgba(255,255,255,0) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-8 */
  -webkit-border-radius: 4px 4px 0px 0px;
        border-radius: 4px 4px 0px 0px;
}


.whiteToTransparentGradient .nav-list {
  padding-right: 0px;
}


/*==================================================
 * shadow effect
 * ===============================================*/
.hoefitVermogen .centerShadow
{
  background: #FFFFFF;
    position:relative;
    /*-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;*/
}
.hoefitVermogen .centerShadow:before, .hoefitVermogen  .centerShadow:after
{
   content: "";
  position: absolute;
  z-index: -1;
  -webkit-box-shadow: 0 0 7px rgba(125,125,125,0.5);
  -moz-box-shadow: 0 0 7px rgba(125,125,125,0.5);
  box-shadow: 0 0 7px rgba(125,125,125,0.5);
  top: 91%;
  bottom: 0;
  left: 20%;
  right: 20%;
  -moz-border-radius: 100px / 10px;
  border-radius: 100px / 10px;
}

/*!
 *  Fit vermogen slider
 */
.hoefitVermogen .ui-slider .ui-widget-header {
    background: #ff6600;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmNjYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #ff6600 0%, #ff0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff6600), color-stop(100%,#ff0000));
    background: -webkit-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: -o-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: -ms-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: linear-gradient(to bottom,  #ff6600 0%,#ff0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6600', endColorstr='#ff0000',GradientType=0 );
}

.hoefitVermogen .ui-slider .ui-slider-handle {
    top:-9px;
    margin-left:-13px;
    width: 25px;
    height: 25px;
    border:none;

    -webkit-box-shadow: 0px 1px 1px 1px rgba(125, 125, 125, 0.5);
    box-shadow: 0px 1px 1px 1px rgba(125, 125, 125, 0.5);

    -webkit-border-radius: 25px;
    border-radius: 25px;

    /*background: #ff6600;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmNjYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  #ff6600 0%, #ff0000 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff6600), color-stop(100%,#ff0000));
    background: -webkit-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: -o-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: -ms-linear-gradient(top,  #ff6600 0%,#ff0000 100%);
    background: linear-gradient(to bottom,  #ff6600 0%,#ff0000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6600', endColorstr='#ff0000',GradientType=0 );*/

    background: url(/static/RETAIL/img/sliderHandle.png);
    background-position: -3px -1px;

}

.hoefitVermogen .ui-slider .ui-slider-handle.ui-state-hover {
  background: url(/static/RETAIL/img/sliderHandleSlide.png);
  background-position: -3px -1px;
}

.hoefitVermogen .slider {
  height:34px;
}
.hoefitVermogen .slider .ui-slider{
  top:11px;
  height: .6em;
}

.hoefitVermogen input.input-small {
  height: 34px !important;
  line-height: 17px !important;
  width: 90% !important;
  float: right;
}

.hoefitVermogen .noMargin input.input-small {
  float:left;
}

.hoefitVermogen input.input-72px {
  float:left;
  width:72px !important;
  margin-right: 18px !important;
}

.hoefitVermogen .btnChapter.active1 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(10%, #ff6600), color-stop(10%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 10%, #ABA195 10%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 10%, #ABA195 10%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 10%, #ABA195 10%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 10%, #ABA195 10%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 10%, #ABA195 10%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active2 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(20%, #ff6600), color-stop(20%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 20%, #ABA195 20%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 20%, #ABA195 20%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 20%, #ABA195 20%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 20%, #ABA195 20%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 20%, #ABA195 20%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active3 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(30%, #ff6600), color-stop(30%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 30%, #ABA195 30%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 30%, #ABA195 30%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 30%, #ABA195 30%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 30%, #ABA195 30%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 30%, #ABA195 30%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active4 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(40%, #ff6600), color-stop(40%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 40%, #ABA195 40%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 40%, #ABA195 40%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 40%, #ABA195 40%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 40%, #ABA195 40%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 40%, #ABA195 40%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active5 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(50%, #ff6600), color-stop(50%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 50%, #ABA195 50%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 50%, #ABA195 50%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 50%, #ABA195 50%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 50%, #ABA195 50%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 50%, #ABA195 50%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active6 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(60%, #ff6600), color-stop(60%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 60%, #ABA195 60%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 60%, #ABA195 60%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 60%, #ABA195 60%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 60%, #ABA195 60%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 60%, #ABA195 60%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active7 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(70%, #ff6600), color-stop(70%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 70%, #ABA195 70%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 70%, #ABA195 70%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 70%, #ABA195 70%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 70%, #ABA195 70%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 70%, #ABA195 70%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active8 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(80%, #ff6600), color-stop(80%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 80%, #ABA195 80%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 80%, #ABA195 80%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 80%, #ABA195 80%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 80%, #ABA195 80%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 80%, #ABA195 80%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active9 {
   background: -webkit-gradient(linear, left top, right top,color-stop(0%, #ff6600),color-stop(90%, #ff6600), color-stop(90%,#ABA195),color-stop(100%,#ABA195));
   background: -webkit-linear-gradient(left, #ff6600 0%, #ff6600 90%, #ABA195 90%, #ABA195 100%);
   background: -moz-linear-gradient(left, #ff6600 0%, #ff6600 90%, #ABA195 90%, #ABA195 100%);
   background: -o-linear-gradient(left, #ff6600 0%, #ff6600 90%, #ABA195 90%, #ABA195 100%);
   background: -ms-linear-gradient(left, #ff6600 0%, #ff6600 90%, #ABA195 90%, #ABA195 100%);
   background: linear-gradient(right, #ff6600 0%, #ff6600 90%, #ABA195 90%, #ABA195 100%);
}
.hoefitVermogen .btnChapter.active10 {
    background-color: #ff6600;
}




/*==================================================
 * Vermogens dashboard
 * ===============================================*/

 .hoefitVermogen .roundNumber {
  font-family: robotobold;
   -webkit-border-radius: 100%;
    border-radius: 100%;
    height: 45px;
    width: 45px;
    margin: 0 auto;
    border: 2px solid #FF6600;
    color: #FF6600;
    font-size: 25px;
    text-align: center;
    line-height: 40px;
    float:left;
 }


.hoefitVermogen .media {
  padding: 10px 0;
  border-bottom: 1px solid #E4E4E4;
}

.hoefitVermogen .media-image {
  text-align: center;
  vertical-align: middle;

  height: 200px;
}
.hoefitVermogen .media-center-image {
text-align: center;
/* position: relative; */
  width:50%;

}

.hoefitVermogen  .info-list h4.media-heading {
  background: url(/static/RETAIL/img/header_accept.png);
  background-repeat: no-repeat;
  background-position: left top;
  padding-left: 40px;
}
.hoefitVermogen .media-center-image img {
    margin: auto;

}



.hoefitVermogen .media p {
  font-family: robotolight;
  font-size: 16px;
}

.hoefitVermogen .vermogens-dashboard .media {
  font-family: robotolight;
  font-size: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #EEE;
}

.hoefitVermogen .vermogens-dashboard .btn {
/*   width: 220px; */
  min-width: 195px;
}

.hoefitVermogen .vermogens-dashboard .media-heading {
   text-align: left;

  margin-bottom: 10px;
  height:45px;
   line-height: 45px;
}


.hoefitVermogen .vermogens-dashboard .roundNumber {
  margin-right: 10px;
}


.hoefitVermogen .fortune-wheel {
  margin: 0 auto;
width: 100%;
text-align: center;
padding-bottom:20px;
}
.hoefitVermogen .fortune-wheel .gradientWithBoxShadow {
  padding:3px 7% 45px 10%;
}
.hoefitVermogen .completedSection {
  margin-top:10px;
}
.hoefitVermogen .completedSection .roundNumber + h5 {
    margin-left:55px;
}

.hoefitVermogen .completedSection .row {
    margin-top:16px;
}

.hoefitVermogen .completedSection #avatar-final {
  float:left;
  margin-right:2%;
}

.hoefitVermogen .completedSection #avatar-final + h4 {
  margin-top:0px;
}


.hoefitVermogen .completedSection .risk-row {

  min-height: 70px;
  width: 100%;
  background-color: #F6F6F6;
  -webkit-border-radius: 35px;
  border-radius: 35px;
  display: inline-block;
  vertical-align: middle;
  font-size: 22px;
  padding-top: 17px;
  padding-left: 28px;
  margin-top: 10px;
  margin-bottom: 5px;

}

.hoefitVermogen .completedSection p {
  font-family: Arial;
  font-size: 16px;
}
.hoefitVermogen #accordion p,
.hoefitVermogen #accordion p.bodytext  {
  font-size: 14px;
}

.hoefitVermogen .readmore {
  margin-bottom: 10px;
  font-size: 16px;
}

.hoefitVermogen .completedSection .risk-row .iconHolder {
  float:left;
  margin-right: 10px;
  position: relative;
  margin-top: 0px;
}

.hoefitVermogen .completedSection .risk-row .textHolder {
  margin-left: 103px;
  padding-top: 0px;
  line-height: 21px;
  margin-right: 20px;
}

.hoefitVermogen .completedSection .risk-row .iconHolder .imageText {
  position: absolute;
  top: 14px;
  left: 20px;
  color: #FFFFFF;
  font-size: 16px;
  font-family: robotolight;
  width: 60px;
  text-align: center;
}


.hoefitVermogen .completedSection .goalIcon {
  float: left;
  margin:  auto 0;
  width:100px;
  text-align: center;
  margin-top: 10px;
}

.hoefitVermogen .completedSection .text {
  margin-left:107px;
}


.hoefitVermogen .printSection {
  margin-top:30px;
}

.hoefitVermogen .printSection span {
  color: #4598CD;
  margin: 0 0 0 10px;
  font-size: 16px;
}


.hoefitVermogen .delete {
  margin-bottom:5px;
  font-family: Arial;
  font-size:  13px;
  color:#002E6B;
}
.hoefitVermogen .delete  > img {
 margin-top:-2px;
}
.hoefitVermogen .delete:first-letter {
    text-transform: uppercase;
}

.hoefitVermogen .delete:hover {
  color:#FF6600;
}
.hoefitVermogen .illustration {
  /*background: url(/static/RETAIL/img//vermogensdashboard/illustrations/bg_financiele_persoonlijkheid_1.jpg);*/
  /* background-image: url(/static/RETAIL/img//vermogensdashboard/illustrations/white.jpg); */
  background-repeat: no-repeat;
  background-position: 100% 0px;
  -ms-background-position-x:100%;

}

.hoefitVermogen .illustration.begin {
   background: url(/static/RETAIL/img/illustrations/quiz_beginscherm_illustratie.jpg);
    background-repeat: no-repeat;
  background-position: 100% 64px;
  -ms-background-position-x:100%;
  min-height: 513px;
}


#graphic .wm-field-list {
  margin-bottom: 15px;
}

.hoefitVermogen #graphic {
  /* min-height: 430px; */
  position: relative;
  background-position: 100% 60px;
  /* property duration timing-function delay */
  /* -ms-background-position-x:100%;
  -webkit-transition: background 900ms ease-in 10ms;
  -moz-transition: background 900ms ease-in 10ms;
  -o-transition: background 900ms ease-in 10ms;
  transition: background 900ms ease-in 10ms; */
}

.illustration #q11 {
  display: none;
}

.hoefitVermogen .navigation {
  position: absolute;
  bottom: 30px;
  height: 20px;
 }



/*==================================================
 * Forms
 * ===============================================*/


 @media (max-width: 767px) {
    .hoefitVermogen label {
      line-height: 40px;
    }

 }

.hoefitVermogen .questionContainer {
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid #EEE;
}

 .hoefitVermogen input[type="radio"],
 .hoefitVermogen input[type="checkbox"] {
  margin-top:12px;
  margin-right:12px;
 }

.hoefitVermogen .yes-no #title{
  border-width: 2px;
  border-radius: 2px;
  border-style: solid;
  padding: 4px;
  line-height: 20px;
}
.hoefitVermogen #yes-no0 #title{
  border-color: #99CC66;
}
.hoefitVermogen #yes-no1 #title{
  border-color: #87CBD6;
}
.hoefitVermogen #yes-no2 #title{
  border-color: #CCCC00;
}
.hoefitVermogen #yes-no3 #title{
  border-color: #996699;
}
.hoefitVermogen #yes-no4 #title{
  border-color: #006699;
}
.hoefitVermogen #yes-no5 #title{
  border-color: #FFBA7D;
}
.hoefitVermogen #yes-no6 #title{
  border-color: #FF6600;
}
.hoefitVermogen #yes-no7 #title{
  border-color: #4598CC;
}
.hoefitVermogen .yes-no {
  margin-top:84px;
}
.hoefitVermogen form .yes-no.hidden {
  visibility: hidden;
  display: none;
  height:0;

}

.hoefitVermogen label.radio-yes-no,
.hoefitVermogen label.radio,
.hoefitVermogen label.checkbox {
    display: inline-block;
    cursor: pointer;
    position: relative;
    font-family: Arial;
    font-size:16px !important;
    line-height: 20px !important;
    /* padding: 12px 0px;
    padding-left: 40px; */
}

.hoefitVermogen .panel .form-inline label.control-label {
  display: block;
  line-height: 20px;
}

.hoefitVermogen label.checkbox:before {
    background-position: 0 -25px;
    content:" "; /*IE8 fix*/
}

/*.hoefitVermogen input[type=radio]:checked + label:before,*/
.hoefitVermogen input[type=radio].checked + label:before {
    background-position: -25px 0;
    content:"  "; /*IE8 fix*/
}

/*.hoefitVermogen input[type=checkbox]:checked + label:before,*/
.hoefitVermogen input[type=checkbox].checked + label:before {
    background-position: -24px -25px;
    content:"  "; /*IE8 fix*/
}

.hoefitVermogen .panel form.form-inline {
  padding-bottom: 40px;
}
.hoefitVermogen .panel label.checkbox:before {
  -webkit-border-radius:0% !important;
    border-radius: 0% !important;
}


.hoefitVermogen .radioRow {
  float:left;
  width: 48.61878453038674%;
  *width: 48.56559304102504%;

}

.hoefitVermogen .radioRow:nth-child(even) {}
.hoefitVermogen .radioRow:nth-child(odd) { margin-left: 2.7624309392265194%;}

.hoefitVermogen .radialRow {
  float:left;
  width: 30%;
  margin-left: 3%;
  text-align: center


}
.hoefitVermogen .radialRow label {
  padding:0;
}
.hoefitVermogen .radialRow label.radio:before {
  left: 50%;
  top: -25px;
  margin-left: -10px;

}


.hoefitVermogen .radialRow .anwserImage {
  margin-bottom: 30px;
}

/*Progress */
.hoefitVermogen .questionProgress {
  position: relative;
  min-height: 40px;
}



.ltie10 .hoefitVermogen .questionProgress {
  margin-top: 5px;
}

.hoefitVermogen .questionProgress .progress {
  padding: 2px;

  background: rgba(163, 163, 163, 0.9);
  border-radius: 6px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08);
  border: 0;
}

.hoefitVermogen .questionProgress .progress {
  display: block;
}

.ie9 .hoefitVermogen .questionProgress .progress {
  filter:none;
}
.ltie9 .hoefitVermogen .questionProgress .progress {
  background:#ccc;
}
.hoefitVermogen .questionProgress .progress > div {
  background: #FF6600;
}

.hoefitVermogen .questionProgress   .progress-bar {
  position: relative;
  width: 0%;
  height: 4px;
  border-radius: 4px;
  -webkit-transition: 0.4s linear;
  -moz-transition: 0.4s linear;
  -o-transition: 0.4s linear;
  transition: 0.4s linear;
  -webkit-transition-property: width, background-color;
  -moz-transition-property: width, background-color;
  -o-transition-property: width, background-color;
  transition-property: width, background-color;
  /*-webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25), inset 0 1px rgba(255, 255, 255, 0.1);
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25), inset 0 1px rgba(255, 255, 255, 0.1);*/
}
/*.hoefitVermogen .questionProgress .progress-bar:before,
.hoefitVermogen .questionProgress .progress-bar:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.hoefitVermogen .progress-bar:before {
  bottom: 0;
  background: #FF6600;
  border-radius: 4px 4px 0 0;
}
.hoefitVermogen .progress-bar:after {
  z-index: 2;
  bottom: 45%;
  border-radius: 4px;
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.05));
}*/

/*
 * Note: using adjacent or general sibling selectors combined with
 *       pseudo classes doesn't work in Safari 5.0 and Chrome 12.
 *       See this article for more info and a potential fix:
 *       http://css-tricks.com/webkit-sibling-bug/
 */
 .hoefitVermogen input[type=radio].radioProgress + label:before {
    position: absolute;
    top: 3px;
    left: 50%;
    margin-left: -20px;
    width: 20px;
    height: 20px;
    background: rgba(163, 163, 163, 1);
    content: " ";
    border-radius: 20px;
    z-index: 0;



 }

/*.hoefitVermogen input[type=radio].radioProgress:checked + label:before,*/
.hoefitVermogen input[type=radio].radioProgress.checked + label:before {
  content: "\2022";
  color:#ff6600;
  text-align: center;
  font-size: 33px;
  line-height: 25px;
  z-index: 1;
   content:"  "; /*IE8 fix*/
}

.ltie10 .hoefitVermogen input[type=radio].radioProgress.checked + label:before {
  font-size: 40px;
  line-height: 20px;
   content:"  "; /*IE8 fix*/
}
.hoefitVermogen .questionProgress .radioProgress + .label {
  position: absolute;
  left: 0%;
  right: 66%;
  height: 60px;
  padding-top: 30px;
  top: -10px;
}

.hoefitVermogen .questionProgress .radioProgress#percent2 + .label {
  left:33%;
  right:33%;
}

.hoefitVermogen .questionProgress .radioProgress#percent3 + .label {
  left: 66%;
  right: 0%;
}



.hoefitVermogen .questionProgress #percent1:checked ~ .progress > .progress-bar,
.hoefitVermogen .questionProgress #percent1.checked ~ .progress > .progress-bar {
  width: 16%;
  z-index: 3;

}

.hoefitVermogen .questionProgress #percent2:checked ~ .progress > .progress-bar,
.hoefitVermogen .questionProgress #percent2.checked ~ .progress > .progress-bar {
  width: 49.5%;
 z-index: 3;
}

.hoefitVermogen .questionProgress #percent3:checked ~ .progress > .progress-bar,
.hoefitVermogen .questionProgress #percent3.checked ~ .progress > .progress-bar {
  width: 100%;
  z-index: 3;

}



.hoefitVermogen .questionProgress .radioProgress + .label {
  color: white;
  background: transparent;
  display: inline-block;
  text-align: center;
  color: #000;
  text-shadow: none;
  border-radius: 3px;
  cursor: pointer;
}

.hoefitVermogen .sliderQuestion {
  height:40px;
  margin-left: 20px;
}
/**
* Pie chart
*/
.hoefitVermogen .circle #percentage {
float: left;
display: inline-block;
vertical-align: middle;
height: 40px;
padding-top: 9px;
padding-left: 10px;
}
.hoefitVermogen .circle #euroSignImage{
  float:left;
  background: url(/static/RETAIL/img/euro-sign/0.gif) no-repeat;
  width: 42px;
  height: 44px;
  margin-top:-5px;
-webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
        -ms-transition: all 300ms ease-in;
        -o-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
}

.hoefitVermogen .circle #euroSignImage.percentage10{
    background: url(/static/RETAIL/img//euro-sign/10.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage20{
    background: url(/static/RETAIL/img//euro-sign/20.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage30{
    background: url(/static/RETAIL/img//euro-sign/30.gif) no-repeat;
}

.hoefitVermogen .circle #euroSignImage.percentage40{
    background: url(/static/RETAIL/img//euro-sign/40.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage50{
    background: url(/static/RETAIL/img//euro-sign/50.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage60{
    background: url(/static/RETAIL/img//euro-sign/60.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage70{
    background: url(/static/RETAIL/img//euro-sign/70.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage80{
    background: url(/static/RETAIL/img//euro-sign/80.gif) no-repeat;
}
.hoefitVermogen .circle #euroSignImage.percentage90{
    background: url(/static/RETAIL/img//euro-sign/90.gif) no-repeat;
}

.hoefitVermogen .circle #euroSignImage.percentage100{
    background: url(/static/RETAIL/img//euro-sign/100.gif) no-repeat;
}


.hoefitVermogen .radioWithImageRow {
  width: 100%;

}
.hoefitVermogen .radioWithImageRow > img{
  margin-right:10px;

}
.hoefitVermogen .illustration {
  position: relative;
}
.hoefitVermogen #handlebars_template_container{
  position: relative;
  width: 100%;
  overflow: hidden;
}

.hoefitVermogen #handlebars_template_container .panel h5 {
  font-family: robotobold;
  font-size: 18px !important;
}

.hoefitVermogen #handlebars_template_container .panel .muted {
  font-size: 16px;
}

.hoefitVermogen #handlebars_template_container > .panel {
  position: relative;
  display: none;
  -webkit-transition: 0.8s ease-in-out left;
          transition: 0.8s ease-in-out left;
}


.hoefitVermogen #handlebars_template_container > .active,
.hoefitVermogen #handlebars_template_container > .next,
.hoefitVermogen #handlebars_template_container > .prev {
  display: block;
}

.hoefitVermogen #handlebars_template_container > .active {
  left: 0;
  background-color: transparent;
}

.hoefitVermogen #handlebars_template_container > .next,
.hoefitVermogen #handlebars_template_container > .prev {
  position: absolute;
  top: 0;
  width: 100%;
  height:400px;
}


.hoefitVermogen #handlebars_template_container > .next {
  left: 100%;
}

.hoefitVermogen #handlebars_template_container > .prev {
  left: -100%;
}


.hoefitVermogen #handlebars_template_container > .next.left,
.hoefitVermogen #handlebars_template_container > .prev.right {
  left: 0;
}

.hoefitVermogen #handlebars_template_container > .active.left {
  left: -100%;
}

.hoefitVermogen #handlebars_template_container > .active.right {
  left: 100%;
}


/***
  Avatar frontend
*/
.hoefitVermogen .avatarRow {
  border-bottom: 1px solid #EEE;
  margin:2px 0;
}

.hoefitVermogen .avatarRow {
  *zoom: 1;
}

.hoefitVermogen .avatarRow:before,
.hoefitVermogen .avatarRow:after {
  display: table;
  line-height: 0;
  content: "";
}

.hoefitVermogen .avatarRow:after {
  clear: both;
}

.hoefitVermogen .avatarRow .avatarPartName {
 margin:10px 0px 5px 0px;
 width: 100%;
 font-size: 16px;
 font-family: Arial;
}

.hoefitVermogen .avatar {
  text-align: center;
}




.hoefitVermogen .avatarRow .avatarPart {
  margin:5px 1px;
  height: 50px;
  width: 50px;
  display: block;
  float: left;
}

.avatarPartName + .avatarPart {
  margin-left:0px !important;
}

.hoefitVermogen .avatarRow .avatarPart img {
  border:2px solid #9C9389;
}



.hoefitVermogen .avatarRow .avatarPart.selected img {
  border-color: #FF6600;
}

.hoefitVermogen .avatarRow .checkmark {
  background: url(/static/RETAIL/img/header_accept.png);
  width: 34px;
  height: 50px;
  float: left;
  background-repeat: no-repeat;
  background-position: 0px 50%;
}

/**
* Goals screen
*/
.hoefitVermogen .goalHeader {
  margin-top: -15px;
  margin-bottom: 0;
  color: #000000;

}

.hoefitVermogen #goalSelection {
  margin-top:0;
}
.hoefitVermogen .goalRow {
  margin: -15px 0 30px 0;
}

.hoefitVermogen .goalRow + .goalRow {
  margin-top:  30px;
}
.hoefitVermogen .goalRow .goalSpan {
  width: 100%;
  margin-left: 4.3333%;
  text-align: center;
  background-color: #FFFFFF;
  border:1px solid #CCCCCC;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.hoefitVermogen .goalRow .goalSpan {
   margin-bottom: 60px;
}
.hoefitVermogen .goalRow .goalSpan .radio{
   padding-left: 0px;
}
.hoefitVermogen .goalRow .goalSpan label {
  font-family: robotolight;
  font-size: 17px !important;
  line-height: 20px;
  margin: 27px 2% 4px;
  min-height: 120px;
  padding: 0;
}
.hoefitVermogen .goalRow .goalSpan label.radio:before {
  left: 50%;
  top: 143px;
  margin-left: -10px;
}

.hoefitVermogen .goalRow .goalSpan .anwserImage {
 /*  margin-top: 20px;
   min-height: 150px;*/
   display: block;
   min-height: 80px;
   margin: 0px;
}

.hoefitVermogen .goalRow .goalSpan .anwserImage img {
   margin: 0px;
   pointer-events: none;
}

/**
* Question navigation
*/

.hoefitVermogen .pagination {
  margin: 13px 0;
  display: block;
}

.pagination-centered {
  text-align: center;
}

.hoefitVermogen .pagination ul {
  display: inline-block;
  *display: inline;
  margin-bottom: 0;
  margin-left: 0;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  *zoom: 1;
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
  margin-top: 5px;
  padding-left: 0px;
}



.hoefitVermogen .pagination ul > li {
  display: inline;
}

.hoefitVermogen .pagination ul > li > a,
.hoefitVermogen .pagination ul > li > span {
  border:1px solid transparent;
  padding: 5px 10px ;

  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
   background-color: transparent;

  	 color: #999999;
  	cursor: default;
}

ul.active-2 li:first-child a,
ul.active-2 li:nth-child(2) a,

ul.active-3 li:first-child a,
ul.active-3 li:nth-child(2) a,
ul.active-3 li:nth-child(3) a,

ul.active-4 li:first-child a,
ul.active-4 li:nth-child(2) a,
ul.active-4 li:nth-child(3) a,
ul.active-4 li:nth-child(4) a,

ul.active-5 li:first-child a,
ul.active-5 li:nth-child(2) a,
ul.active-5 li:nth-child(3) a,
ul.active-5 li:nth-child(4) a,
ul.active-5 li:nth-child(5) a,

ul.active-6 li:first-child a,
ul.active-6 li:nth-child(2) a,
ul.active-6 li:nth-child(3) a,
ul.active-6 li:nth-child(4) a,
ul.active-6 li:nth-child(5) a,
ul.active-6 li:nth-child(6) a,

ul.active-7 li:first-child a,
ul.active-7 li:nth-child(2) a,
ul.active-7 li:nth-child(3) a,
ul.active-7 li:nth-child(4) a,
ul.active-7 li:nth-child(5) a,
ul.active-7 li:nth-child(6) a,
ul.active-7 li:nth-child(7) a,

ul.active-8 li:first-child a,
ul.active-8 li:nth-child(2) a,
ul.active-8 li:nth-child(3) a,
ul.active-8 li:nth-child(4) a,
ul.active-8 li:nth-child(5) a,
ul.active-8 li:nth-child(6) a,
ul.active-8 li:nth-child(7) a,
ul.active-8 li:nth-child(8) a,

ul.active-9 li:first-child a,
ul.active-9 li:nth-child(2) a,
ul.active-9 li:nth-child(3) a,
ul.active-9 li:nth-child(4) a,
ul.active-9 li:nth-child(5) a,
ul.active-9 li:nth-child(6) a,
ul.active-9 li:nth-child(7) a,
ul.active-9 li:nth-child(8) a,
ul.active-9 li:nth-child(9) a,

ul.active-10 li:first-child a,
ul.active-10 li:nth-child(2) a,
ul.active-10 li:nth-child(3) a,
ul.active-10 li:nth-child(4) a,
ul.active-10 li:nth-child(5) a,
ul.active-10 li:nth-child(6) a,
ul.active-10 li:nth-child(7) a,
ul.active-10 li:nth-child(8) a,
ul.active-10 li:nth-child(9) a,
ul.active-10 li:nth-child(10) a,

ul.active-11 li:first-child a,
ul.active-11 li:nth-child(2) a,
ul.active-11 li:nth-child(3) a,
ul.active-11 li:nth-child(4) a,
ul.active-11 li:nth-child(5) a,
ul.active-11 li:nth-child(6) a,
ul.active-11 li:nth-child(7) a,
ul.active-11 li:nth-child(8) a,
ul.active-11 li:nth-child(9) a,
ul.active-11 li:nth-child(10) a,
ul.active-11 li:nth-child(11) a{
	color: #002F6B;
	cursor: pointer;
}

.hoefitVermogen .pagination ul > li > a:hover,
.hoefitVermogen .pagination ul > .active > a,
.hoefitVermogen .pagination ul > .active > span {
  background-color: #FFFFFF;
  border:1px solid #CCCCCC;
  color: #FF6600;
}

.hoefitVermogen .pagination ul > .active > a,
.hoefitVermogen .pagination ul > .active > span {
   color: #FF6600;
  cursor: default;
}

.hoefitVermogen .pagination ul > li > span,
.hoefitVermogen .pagination ul > .disabled > a,
.hoefitVermogen .pagination ul > .disabled > a:focus {

}



.hoefitVermogen .pagination ul > li:first-child > a,
.hoefitVermogen .pagination ul > li:first-child > span {
   -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.hoefitVermogen .pagination ul > li:last-child > a,
.hoefitVermogen .pagination ul > li:last-child > span {
  --webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}



.collapse {
  display: none;
}

.panel-collapse.collapse {
   overflow: auto;
}

.collapse.in {
  display: block;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition: height 0.35s ease;
          transition: height 0.35s ease;
}

.panel-group .panel {
  margin-bottom: 20px;
  background-color: #ffffff;
}

.panel-collapse {
    margin-top: -10px;
}
.collapsing {
    padding-bottom: 10px;
}

.panel-body {
  margin-left: 63px;
  padding-right: 40px;
  float: left;
  overflow:visible;
}

.panel-body:before,
.panel-body:after {
  display: table;
  content: " ";
}

.panel-body:after {
  clear: both;
}

.panel-body:before,
.panel-body:after {
  display: table;
  content: " ";
}

.panel-body:after {
  clear: both;
}

.panel-body p {
    margin-bottom: 15px;
}





.panel-heading {
  padding: 1px 15px;
  border-bottom: 1px solid transparent;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}

.panel-heading > .dropdown .dropdown-toggle {
  color: inherit;
}

.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: #4598CC;
  padding-top: 3px;
}

.panel-title > a {
  color: inherit;
}

.panel-title > a img {
  margin-right: 10px;
  float: left;
}

.panel-title > a span {
  float: left;
  width: 75%;
  margin-top: 10px;
  font-family: robotobold;
}

.panel-footer {
  padding: 10px 15px;
  background-color: #f5f5f5;
  border-top: 1px solid #dddddd;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}

.panel-group .panel {
  margin-bottom: 0;
  overflow: hidden;
  border-radius: 4px;
}

.panel-group .panel-heading {
  border-bottom: 0;
}

.panel-group .panel-heading + .panel-collapse .panel-body {
  border-top: 1px solid #FFFFFF;
}

.panel-group .panel-footer {
  border-top: 0;
}

.panel-group .panel-footer + .panel-collapse .panel-body {
  border-bottom: 1px solid #FFFFFF;
}

.panel-default {
  border-color: #FFF;
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNmU2ZTYiIHN0b3Atb3BhY2l0eT0iMC40Ii8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(240,240,240,0.4) 200%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(200%,rgba(240,240,240,0.4))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(240,240,240,0.4) 200%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(240,240,240,0.4) 200%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(240,240,240,0.4) 200%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(240,240,240,0.4) 200%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#F0F0F0',GradientType=0 ); /* IE6-8 */


-webkit-box-shadow:  1px 2px 2px 2px rgba(125, 125, 125, 0.4);
        box-shadow:  1px 2px 2px 2px rgba(125, 125, 125, 0.4);
}

.panel-default > .panel-heading {
  background-color: transparent;
}

.panel-default > .panel-heading + .panel-collapse .panel-body {
  border-top-color: transparent;
}

.panel-default > .panel-heading > .dropdown .caret {
  border-color: #FFF;
}

.panel-default > .panel-footer + .panel-collapse .panel-body {
  border-bottom-color: #FFF;
}




.hoefitVermogen .collapsed .icon-chevron {
   background: url(/static/RETAIL/img/arrow_orange_large.png);
  background-origin: 0 0;
  width:16px;
  height:16px;
  background-repeat: no-repeat;
  margin-top: 14px;
}

.hoefitVermogen .icon-chevron {
  background: url(/static/RETAIL/img/arrow_orange_large_bottom.png);

  background-origin: 0 0;
  width:16px;
  height:16px;
  background-repeat: no-repeat;
  margin-top: 14px;
}

/**
* Mobile only classes
*/
.hoefitVermogen .mobile-nav-pills {
  margin: 10px 0 20px;
  position:relative;min-heigth:50px !important;
}

.hoefitVermogen .mobile-nav-pills .btn-navPhone {
 background: rgb(102,102,102); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk5JSIgc3RvcC1jb2xvcj0iIzQ0NDQ0NCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top,  rgba(102,102,102,1) 0%, rgba(68,68,68,1) 99%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(102,102,102,1)), color-stop(99%,rgba(68,68,68,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(102,102,102,1) 0%,rgba(68,68,68,1) 99%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(102,102,102,1) 0%,rgba(68,68,68,1) 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(102,102,102,1) 0%,rgba(68,68,68,1) 99%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(102,102,102,1) 0%,rgba(68,68,68,1) 99%); /* W3C */

height: 40px;
width: 70px;
padding-top: 11px;


}

.hoefitVermogen .mobile-nav-pills .btn-navPhone.pull-left {
  margin-left: -40px;
  text-align: right;
}
.hoefitVermogen .mobile-nav-pills .btn-navPhone img {
  margin-left: -10px;
}
.hoefitVermogen .mobile-nav-pills .btn-navPhone.pull-left img {
  margin-right: -10px;
  float: right;
}

.hoefitVermogen .mobile-nav-pills .btn-navPhone.pull-right {
  margin-right: -40px
}


.hoefitVermogen .mobile-nav-pills .pageActive,
.hoefitVermogen .mobile-nav-pills .pageCounter {
  float:left;

  font-family: Arial;
   font-size:17px;
   left:50px;
    color:#999999;
    position:absolute;
    top:50%;
    margin-top:-0.5em;
    line-height:1;
}

.hoefitVermogen .mobile-nav-pills .pageActive {
   width: 64%;
   color:#FF6600;
   text-align: center;
   margin-left: 15px;

}


.hoefitVermogen .pagination .pagination-mobile  span {
  font-family: Arial;
  font-size: 17px;

}
.hoefitVermogen .pagination .pagination-mobile .activePage{
  padding-right: 0;
  padding-left: 0;
  color:#FF6600;
}

.hoefitVermogen .pagination .pagination-mobile .totalPages{
   padding-right: 0;
  padding-left: 0;
  color:#182C68;
}

/***
* Responsive
*/
.hoefitVermogen .col-md-35 {
  width: 25.52817679558011%;
  *width: 25.37498530621841%;
}

.hoefitVermogen .col-md-85 {
  width: 72.10939226519337%;
  *width: 70.95620077583166%;
 padding-left: 10px;
padding-right: 10px;
}
.vermogenOpbouw h5 {
  position: relative;
  left: -40px;
  z-index: -5;
  opacity: 0;
}
.vermogenOpbouw .roundNumber {
  z-index: 5;
  background-color: white;
  opacity: 0;
}
/**
* Tablet
*/
@media (min-width: 768px) and (max-width: 979px) {

  #main.gradient-short.ipadMultiLine {
    background-size: 100% 200px;
  }

  #main.gradient-short {
    background: none;
  }

  .hoefitVermogen .centered-pills ul.nav.nav-pills li,
  .hoefitVermogen .centered-pills ul.nav.nav-tabs li {
    display:inline; width: 25%;
  }

  .hoefitVermogen .subNavigation .navbar-collapse,
  .hoefitVermogen .subNavigation .navbar-collapse.collapse{
    display: block;
    height: 100%;
    overflow :visible;

  }

  .hoefitVermogen .subNavigation {
    margin-bottom: 10px;
  }


  .hoefitVermogen .subNavigation  .navbar-collapse .nav > li {
    float:left;
    width: 24%;
    margin-left: 1%;
  }

  .hoefitVermogen .subNavigation ul li a {
    min-width: 100%;
    width: 100%;
    padding: 10px 5px;
    box-sizing: border-box;
    float: left;


  }
  .hoefitVermogen .subNavigation ul li a .img {
    display: none;
  }

   .hoefitVermogen .subNavigation ul li a .link-title,
   .hoefitVermogen .subNavigation ul li a .link-subtitle
  {
    margin: 6px 3px;
  }
  .hoefitVermogen .subNavigation ul li a:after {
    display: none;
  }

  .hoefitVermogen .col-md-35 {
    width: 25.02817679558011%;
    *width: 24.87498530621841%;
  }

  .hoefitVermogen .col-md-85 {
    width: 72.10939226519337%;
    *width: 70.95620077583166%;
    padding-left: 10px;
  }

  .hoefitVermogen .diagram {
    margin-bottom: 20px;
  }

  .hoefitVermogen .gradientWithBoxShadow.goalFrame .triangle {
    margin-left: 15px;
  }
  .hoefitVermogen .col-md-4.goalFrame {
    margin-left: 6.32596685082873%;
  }

  .hoefitVermogen .vermogens-dashboard .btn
  {
    margin-top: 10px;
  }
  .hoefitVermogen .completedSection .col-md-7 {
    width:100% !important;

  }
  .hoefitVermogen .completedSection .avatar {
    *zoom: 1;
  }

  .hoefitVermogen .completedSection .avatar:before,
  .hoefitVermogen .completedSection .avatar:after {
    display: table;
    line-height: 0;
    content: "";
  }

  .hoefitVermogen .completedSection .avatar:after {
    clear: both;
  }

  .hoefitVermogen .btn.btn-big.btn-blue.col-md-6.no {
    padding:13px 0px 15px;
    font-size: 17px !important;
  }

  .hoefitVermogen #calcResult .col-md-6{
    width: 100%;

  }

  .hoefitVermogen #calcResult .col-md-6.paddingLeft5 {
    padding-left: 0;
    margin-left:0;
  }

  .hoefitVermogen #fortune-wheel-container {
    height:162px;
  }

   .hoefitVermogen .calculatorControls .col-xs-9 {
    width:59%;
    float: left;
  }

  .hoefitVermogen .calculatorControls .col-xs-3 {
    margin-left: 2%;
    float: left;
  }
}

/**
* Mobile
*/

@media (max-width: 767px) {

  .hoefitVermogen .vermogens-dashboard .media {

  }

  .hoefitVermogen .vermogens-dashboard .btn {
    /*width: 195px;*/
    float: right;
    width: 100%;
    margin-top: 10px;
  }

  .hoefitVermogen .vermogens-dashboard .media-body {
  float: right;
  width: 100%;
  }

  .hoefitVermogen .paddingBottom20.mobile-padding{
    padding-bottom: 0px;
    padding-top: 30px;

  }

  .hoefitVermogen .movieContainer.bigFrame {
    border: 10px solid #fff;
  }
  #main #menuBox {
    position: absolute;
	overflow: auto;
	max-height: 100vh;
	padding-bottom:55px;

	position: fixed;
    /* width: 100%; */
    height: calc(100% + 60px);
	-webkit-overflow-scrolling: touch;
  }

  #main.no-mobile-gradient{
    background: none;

  }

  .hoefitVermogen .quizHeader {
    margin-top: 30px;
  }
  .hoefitVermogen .quizSubheader {
    margin-top: 5px;
  }

  .hoefitVermogen .col-md-6 .csc-header.csc-header-n1 h2.csc-firstHeader {
    margin-top: 70px;
  }
  .hoefitVermogen .subNavigation + h2 {
    padding: 0;
  }

  #main-background,
  #main-background .animationLayer {
    background-position: 50% 343px;
  }

  #main.gradient-short {
    background-size: 100% 15px;
  }

    #main.gradient-short.ipadMultiLine {
      background-size: 100% 40px;
    }


  .hoefitVermogen .subNavigation {
    background-color: #FFFFFF;
    margin-bottom: 20px;
    padding: 10px 5% 0;
    width: 110% !important;
    margin-left: -5%;

  }



  .hoefitVermogen .subNavigation .nav {
    margin-bottom: 0px;
    padding: 0 0;
    margin: 0 -10px;
  }
  .hoefitVermogen .subNavigation ul li {
     width:100%;

     margin:0;

     border-top: 1px solid #CCC000;
     padding: 0 0;
  }

  .hoefitVermogen .subNavigation ul li:first-child {
    border: none;
  }



.hoefitVermogen .subNavigation ul li a {
  background: none;
  background-color: #FFFFFF;

  height: 100%;
  width: 100%;
  border:none;
  padding: 15px 0px;
  color: #002F6B;
  font-family: robotobold;
  font-weight: normal;
  font-style: normal;
  text-align: left;
  font-size: 17px;
  line-height: 34px;

  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;

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

  display: block;

  background-image:  url(/static/RETAIL/img/arrow_orange.png);
  background-repeat: no-repeat;
  background-position: 98% 25px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding-left: 10px;

}
.hoefitVermogen .subNavigation .navbar-toggle {
    width: 110% !important;
    margin-left: -5%;
    padding: 20px 17px 10px;
    padding-left: 5%;
    background: #D7D7D7;
    font-family: robotobold !important;
    font-weight: normal;
    font-style: normal;
    text-align: left;
    font-size: 17px !important;
    color: #002F6B;
    border:none;
    -webkit-box-shadow: inset 0px 4px 4px 0px rgba(100, 100, 100, 0.5);

    box-shadow: inset 0px 4px 4px 0px rgba(100, 100, 100, 0.5);
    margin-bottom: 5px;
    background-image:  url(/static/RETAIL/img//phone_arrow_up.png);
    background-repeat: no-repeat;
    background-position: 94% 30px;
}

.hoefitVermogen .subNavigation .navbar-toggle.collapsed {
  background-image:  url(/static/RETAIL/img//phone_arrow_bottom.png);
  background-repeat: no-repeat;
  background-position: 94% 30px;
}
.hoefitVermogen .subNavigation.collapsable  {
  margin-top: 10px;
  padding-top: 0px;
  background: #D7D7D7;
}
.hoefitVermogen .subNavigation .navbar-collapse ul li a {
  background: #D7D7D7;
}

 .hoefitVermogen .subNavigation .navbar-collapse ul li:first-child {
    border-top:  1px solid #CCC000;
}

.hoefitVermogen .subNavigation ul li a .link-title ,
.hoefitVermogen .subNavigation .navbar-collapse ul li .link-title {
  margin-left: 0px;
  margin-top: 0;
}


.hoefitVermogen .subNavigation .navbar-collapse li a:hover,
.hoefitVermogen .subNavigation .navbar-collapse li.active a {
  background-color: #efefef;
  border-bottom-color: #efefef;
  position: static;
}

.hoefitVermogen .subNavigation li a:hover,
.hoefitVermogen .subNavigation li.active a {
  background-color: #efefef;
  border-bottom-color: #efefef;
  position: static;
}

.hoefitVermogen .subNavigation li a:hover:after,
.hoefitVermogen .subNavigation li.active a:after {
  display: hidden;
  visibility: hidden;
}
    .hoefitVermogen .whiteToTransparentGradient {
  margin-top: 20px;

  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjgyIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  rgba(255,255,255,0.8) 10%, rgba(255,255,255,0) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(10%,rgba(255,255,255,0.8)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0.8) 10%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,0.8) 10%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,0.8) 10%,rgba(255,255,255,0) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,0.8) 10%,rgba(255,255,255,0) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-8 */
  }
  .hoefitVermogen .col-md-35 {
   display: none;
   visibility: hidden;
  }

  .hoefitVermogen .col-md-85 {
    width: 100%;
    padding: 5px;
  }
  .hoefitVermogen .col-md-85 .row {
    padding:0 1%;
  }
  .hoefitVermogen .col-md-85 .row > div {
    margin-top:10px;
  }
   .hoefitVermogen .col-md-85 .movieContainer {
    /*width:90%;*/
    margin:0 auto;
    /*margin-left: 2.5%;*/
   }

   .hoefitVermogen .diagram {
    margin-bottom: 20px;
  }

   .hoefitVermogen .diagram .row .col-md-2 {
      width: 17.3646408839779%;
   }

   .hoefitVermogen .diagram .row [class*="span"]:first-child {
    margin-left: 0;
  }
  .hoefitVermogen .diagram  .row [class*="span"] + [class*="span"] {
    margin-left: 2.7624309392265194%;
  }
  .hoefitVermogen .diagram div.row > a {
    margin:10px 0;
    font-size:14px;
  }
  .hoefitVermogen .diagram .box .bar {
    width: 50%;
    margin: 0 26%;

  }

  .hoefitVermogen h2.paddingBottom20{
    margin-top: 20px;
    padding-bottom: 0px;
  }

  .btn.col-md-6 + .btn.col-md-6 {
    margin-top:20px;
  }

  .hoefitVermogen .diagram .tooltip-btn {
    display: none;
  }

  /*.hoefitVermogen .fortune-wheel {
    padding-bottom: 0px;
  }
  .hoefitVermogen .fortune-wheel.bottomTriangle:after {
    border: none;
  }*/

  .hoefitVermogen form .yes-no {
    margin-top: 0px;
  }

  .hoefitVermogen h2.bottomTriangle:after {
    top:72px;
  }

  .hoefitVermogen #fortune-wheel-container {
    overflow: hidden;
    height: 107px;
    margin-bottom: 0px;
    padding: 3px 0px 20px 0px;
  }

  .hoefitVermogen .illustration {
    background: none !important;
  }

  .hoefitVermogen .completedSection .risk-row .textHolder {
    padding-top: 0px;
  }


  .hoefitVermogen .media-heading {
    width: 100%;
  }

  .hoefitVermogen .media .pull-left {
    margin-bottom: 0px;
  }


  .hoefitVermogen .info-list .media-center-image {

 display: none;


}

  .hoefitVermogen .btnRisk {
      font-size:14px;
  }

  .hoefitVermogen .calculatorControls .col-md-9 {
    width:59%;
    float: left;
  }

  .hoefitVermogen .calculatorControls .col-md-3 {
    width:39%;
    margin-left: 2%;
    float: left;
  }

  .hoefitVermogen .avatar{
    float:left;
    width: 100%;
    text-align: center;
    margin-bottom: 40px;
  }

  .hoefitVermogen .roundNumber{
    margin: 0 15px auto 0;
  }

  .hoefitVermogen .btn-big{
    padding: 13px 10px 13px;

  }

   .hoefitVermogen .completedSection #avatar-final {
    float:none;
    margin: 0;
    width: 50%;

  }

  .hoefitVermogen .radioRow {
    float: none;
    width: 100%;
    margin:0 !important;
  }

  .hoefitVermogen .radialRow {
    float: none;
    width: 100%;
    margin:0 !important;
    text-align: left;
  }

  .hoefitVermogen .radialRow label {
     width: 100%;
    margin-left: 12px;
    float: left;

    height: auto;
    padding-top: 0px;
    top: 0 !important;
    left: 0 !important;
    text-align: left;
    display: inline-block;
    cursor: pointer;
    position: relative;
    font-family: Arial;
    font-size: 16px !important;
    line-height: 20px !important;
    padding: 12px 0px;
    padding-left: 24px;
  }
  .hoefitVermogen .radialRow label.radio:before {
       content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 12px;

  }


  .hoefitVermogen .radialRow .anwserImage {
    display: none;
  }
  /*.hoefitVermogen .radialRow .anwserImage {
    margin: 0;
    display:none;
    visibility: hidden;
  }*/
  .hoefitVermogen .control-group label,
  .hoefitVermogen label.radio {
      width: 69%;
  }

  .hoefitVermogen .control-group label {
    margin-left: 100px;
    line-height: 25px;
  }


  .hoefitVermogen .sliderQuestion .col-md-5 {
    width: 69%;
    float: left;
  }

  .hoefitVermogen .sliderQuestion .col-md-5 + .col-md-7 {
    width: 29%;
    margin-left: 2%;
    float:left;
  }

  .hoefitVermogen .readmore {
    left: 0;
    bottom: 0;
  }

  .hoefitVermogen .goalFrame input.input-small {
      width:50%;
      float: left;
  }

  .hoefitVermogen .questionProgress {
    position: static;
  }

 .hoefitVermogen .questionProgress .radioProgress + .label
  {
    width: 100%;
    margin-left: 24px;
    float: left;
    right: 66%;
    height: auto;
    padding-top: 0px;
    top: 0 !important;
    left: 0 !important;
    text-align: left;
    display: inline-block;
    cursor: pointer;
    position: relative;
    font-family: Arial;
    font-size: 16px !important;
    line-height: 20px !important;
    padding: 12px 0px;
    padding-left: 20px;
  }
  .hoefitVermogen .questionProgress .progress {
    visibility: hidden;
  }

  .hoefitVermogen input[type=radio].radioProgress + label:before {
       content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 12px;
    background-image: url(/static/RETAIL/img/form-elements-sprite.png);
    background-repeat: no-repeat;
    background-position: 0 0;
  }

  /*.hoefitVermogen input[type=radio].radioProgress:checked + label:before,*/
  .hoefitVermogen input[type=radio].radioProgress.checked + label:before {
    content: " ";
    background-position: -25px 0;
  }

  .hoefitVermogen .questionContainer#question9 {
    height: auto;
  }

  /*.hoefitVermogen .vermogenOpbouw {
    display: none;
  }*/


  .hoefitVermogen .pagination .pagination-mobile {
  display: inline-block !important;
  }

   .hoefitVermogen .goalFrame {
    padding: 10px 10px 5px;
  }

  .hoefitVermogen .goalFrame p{
  	font-size: 11pt;
  }

  .hoefitVermogen .gradientWithBoxShadow.calculatorControls {
    margin-bottom: 20px;
    padding-top: 5px;
  }

  .hoefitVermogen .gradientWithBoxShadow.calculatorControls .triangle {
    display: none;
  }

  .hoefitVermogen .sliderContainer {
    margin-top: 0px;

  }
}

/*
* Small phone
*/
@media (max-width: 568px) {
  .hoefitVermogen .diagram .value,
  .hoefitVermogen .diagram .title {
    font-size: 13px;
  }

  .hoefitVermogen .goalRow .goalSpan .anwserImage img {
    text-align: center;
    height:40px;
  }
  .hoefitVermogen .goalRow .goalSpan .anwserImage
  {
    min-height: 40px;
  }
  .hoefitVermogen .goalRow .goalSpan label {
    min-height: 100px;

    word-wrap:break-word;
  }

  .hoefitVermogen .goalRow .goalSpan label.radio:before {
    top:115px;
  }

  .hoefitVermogen .goalRow .goalSpan label.radio:before {

  }
  .hoefitVermogen .avatar {
    text-align: center;
  }
   .hoefitVermogen label.radio {
  width: 69%;
  }
  .hoefitVermogen .goalRow {
    padding-bottom: 20px;
  }


}


@media (max-width: 320px) {

  .hoefitVermogen .diagram .value,
  .hoefitVermogen .diagram .title {
    font-size: 10px;
    line-height: 12px;
  }

  .hoefitVermogen .goalRow {
    padding-bottom: 10px;
  }
  .hoefitVermogen .goalRow .goalSpan .anwserImage img {
    text-align: center;
   /* height:30px;*/
  }
  /*.hoefitVermogen .goalRow .goalSpan .anwserImage
  {
    min-height: 30px;
  }*/
  .hoefitVermogen .goalRow .goalSpan label {
  /*  min-height: 70px;*/
    font-size:12px !important;
  }

  .hoefitVermogen .goalRow .goalSpan label.radio:before {
   /* top:80px;*/
  }
  .hoefitVermogen .avatar {
    text-align: center;
  }
 .hoefitVermogen label.radio {
  width: 69%;
  }

  /* fix for mobile pull-right to float on begin page quiz */
   .hoefitVermogen .btn-blue.btn-big.pull-right.marginTop40p {
      float:left;
   }
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {
/* STYLES GO HERE */

}


@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {
  .hoefitVermogen .subNavigation li.active a:after {
    top:67px;
  }
}


.csc-header-n3 {
  text-align: center;
}

.goalFrame {
	padding: 0 20px 10px;
	background: #f8f8f8;
}

.goalFrame,
.calculatorControls {
  padding: 0 10px 10px;
  background-color: #e6e5e5;
  background-color: rgba(230, 229, 229, .5);
}
.goalFrame .sliderContainer input,
.calculatorControls .sliderContainer input {
  font-size: 10pt !important;
  color: #666 !important;
  cursor: initial;
  background-color: transparent !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}
.calculatorControls .triangle {
  display: none;
  float: right;
  width: 16px;
  height: 32px;
  margin-top: 30px;
  margin-right: -26px;
  background-repeat: no-repeat;
}
@media (min-width: 768px) {
  .calculatorControls .triangle {
    display: block;
  }
}

#calcGraphContainer {
  height: 236px;
  margin-bottom: 15px;
  /*overflow: hidden;*/
}
/*!
 *  Fit vermogen calculator
 */
.slider .ui-slider {
  background-color: #dedede;
  border: 1px solid #aaa;
  border-bottom: none;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .25), 0 1px rgba(255, 255, 255, .08);
          box-shadow: inset 0 1px 2px rgba(0, 0, 0, .25), 0 1px rgba(255, 255, 255, .08);
}
.sliderContainer {
  padding-top: 20px;
}
@media (min-width: 768px) {
  .sliderContainer {
    padding-top: 0;
  }

  #mainGraphRow .sliderContainer {
    padding-top: 5px;
  }
}
.sliderContainer h6,
.riskContainer h6 {
  font-family: robotobold;
  font-size: 16px;
  color: #ea650d;
}

#mainGraphRow .sliderContainer h6, .riskContainer h6 {
    color: #ea650d;
    font-family: robotobold;
    font-size: 16px;
    margin: 3px 0;
}

.riskContainer h6 {
  font-size: 18px;
}
.btnRisk {
  -webkit-box-shadow: inset 0 2px 1px rgba(0, 0, 0, .1);
          box-shadow: inset 0 2px 1px rgba(0, 0, 0, .1);
}
.btnRisk,
.btnRisk:visited {
  float: left;
  width: 32.333%;
  height: 32px;
  padding-top: 6px;
  margin-right: 1%;
  font-family: robotolight;
  font-size: 13px;
  font-style: normal;
  font-weight: normal;
  color: white;
  background: none;
  background-color: #aba195;
          border-radius: 0;

  -webkit-border-radius: 0;
}
@media (min-width: 992px) {
  .btnRisk,
  .btnRisk:visited {
    padding-top: 4px;
    font-size: 17px;
  }
}
.btnRisk:hover,
.btnRisk:active,
.btnRisk.active {
  color: white;
  background-color: #ea650d;
  border-radius: 0;
}
.big-black-bottom-border {
  padding-top: 10px;
  margin-top: 20px;
  margin-bottom: 10px;
  border-top: 1px solid #EEE;
  border-bottom: 3px solid black;
}

#mainGraphRow .big-black-bottom-border {
  margin-top: 0px;
  float:left;
  width:100%;
}

#calcGraphContainer {
  height: 236px;
  margin-bottom: 15px;
  /*overflow: hidden;*/
}

#mainGraphRow #calcGraphContainer {
  height: 180px;
  margin-bottom: 15px;
  /*overflow: hidden;*/
}

#calcResult h6 {
  margin-top: 0;
  font-size: 16px;
  color: black;
  font-family: robotolight;
}

#mainGraphRow #calcResult h6 {
  margin-top: 0;
  font-size: 15px;
  color: black;
  font-family: robotolight;
}
#mainGraphRow #calcResult h6.compare {
    font-size: 12px;
    margin: 0;
}

#calcResult p {
  font-size: 24px;
  color: black;
  margin-bottom: 7px;
}
#calcResult h6,
#calcResult p {
  line-height: 24px;
}

#mainGraphRow #calcResult h6,
#mainGraphRow #calcResult p {
  line-height: 17px;
}

#mainGraphRow #expectedCapital {
    font-size: 20px;
}

#mainGraphRow .open-account-button-container .btn.btn-lg.btn-orange{
	margin: 8px 0 0;
}

#calcResult .end-capital-sum h6,
#calcResult .end-capital-sum p {
  font-family: robotobold;
}
#calcResult .amount {
  font-family: robotolight;
  font-size: 16px;
}

.circleDiagrams img {
  width: 41px;
  height: 39px;
  margin-left: 1%;
  filter: alpha(opacity=50);
          opacity: .5;

  -webkit-opacity: .5;
     -moz-opacity: .5;
}

#mainGraphRow .circleDiagrams img {
  width: 35px;
  height: 36px;
}

.circleDiagrams .big {
  width: 69px;
  height: 65px;
  filter: alpha(opacity=100);
          opacity: 1;

  -webkit-opacity: 1;
     -moz-opacity: 1;
}


#mainGraphRow .circleDiagrams .big {
    height: 56px;
    width: 60px;
}


.legend {
  margin: 10px 0;
  font-family: robotolight;
  font-size: 14px;
}
.legend span {
  float: left;
  margin-right: 5px;
}
.legend .obligaties,
.legend .aandelen {
  display: block;
  float: left;
  width: 14px;
  height: 14px;
  margin-top: 3px;
  margin-right: 4px;
  border-radius: 3px;
}
.legend .obligaties {
  background-color: #67c5eb;
}
.legend .aandelen {
  background-color: #09c;
}
.explanationLink {
  margin-left: 5px;
}

.open-account-button-container {
  width: 305px;
  margin: 0 auto;
  margin-bottom: 70px !important;
}
.open-account-button-container a {
  width: 100%;
  min-height: 44px;
  margin-top: 20px;
  font-size: 18px;
  font-weight: lighter;
  font-weight: 100;
  color: white;
}
.open-account-button-container a:link,
.open-account-button-container a:visited,
.open-account-button-container a:hover,
.open-account-button-container a:active {
  padding-top: 10px;
  color: white;
}
.open-account-button-container a:active,
.open-account-button-container a:visited {
  background-image: -webkit-linear-gradient(top, #f60000 0%, #f60 100%);
  background-image:      -o-linear-gradient(top, #f60000 0%, #f60 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f60000), to(#f60));
  background-image:         linear-gradient(to bottom, #f60000 0%, #f60 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff60000', endColorstr='#ffff6600', GradientType=0);
  background-repeat: repeat-x;
}
.open-account-button-container a i {
  color: white;
  background: url(/static/RETAIL/img/arrow_white.png);
  height: 13px;
display: block;
width: 8px;
}
.open-account-button-container a i.no-arrow {
	background: none;
	line-height: 22px;
  	margin-bottom: 15px;
}
.open-account-button-container a i,
.open-account-button-container a i:link,
.open-account-button-container a i:visited,
.open-account-button-container a i:hover,
.open-account-button-container a i:active {
  margin-top: 7px;
  margin-left: 10px;
  font-size: 13px;
  font-style: normal !important;
}
.full-width-left-aligned-button {
  width: auto;
  margin-bottom: 0 !important;
}
.full-width-left-aligned-button a {
  text-align: left;
}
.full-width-left-aligned-button a i {
  margin-right: 20px;
  float: left;
}

.disclaimer {
  padding: 5px 0;
  margin-top: 12px;
  margin-bottom: 10px;
  font-family: Arial;
  font-size: 11px;
  color: #666;
  border-top: 1px solid #EEE;
}
.disclaimer img {
  margin-left: 10px;
}
.disclaimer a {
  color: #4598cc;
  font-family: robotolight;
  font-size: 14px;
}
@media (min-width: 768px) {
  .disclaimer {
    padding-top: 10px;
    margin-top: 30px;
  }
}
.landing-banner {
  position: relative;
  z-index: 1;
  background-color: #F4f4f4;
}

.landing-banner h1 {
  font-size: 32px;
  color: #fff;
}

.landing-banner h2 {
  color: #fff;
  font-family: robotolight;
  font-size: 22px;
}

.landing-banner .content-right,
.landing-banner .content-left {
  z-index: 2;
  padding-top: 33px;
}

.landing-banner .content-left .title {
  line-height: 1.3em;
  padding-right: 36px;
}

.landing-banner .content-right .title h3, .landing-banner .content-right .title h2{
    color: #000000;
}

.landing-banner .content-right {
  text-align: center;
}
.landing-banner .content-right .title {
  margin-top: 30px;
  margin-bottom: 0px;
}

.landing-banner .content-right .btn {
  margin-bottom: 10px;
}

.landing-banner .text {
  color: #fff;
  font-family: robotolight;
}
.landing-banner .text ul {
  list-style: none;
  padding-left: 0;
  margin-left: -10px;
}
.landing-banner .text ul li {
  margin-top: 5px;
  background: url("/static/RETAIL/img/header_accept_white.png") no-repeat left center;
  padding: 0px 0 0 40px;
  margin-right: 15px;
  color: black;
  display: block;
  font-family: robotolight;
  text-align: left;
  font-size: 22px;
  color: #fff;
}

.landing-banner .text {
  color: #fff;
  font-family: robotolight;
}
.landing-banner .text ul {
  list-style: none;
  padding-left: 0;
  margin-left: -10px;
}
.landing-banner .text ul li {
  margin-top: 5px;
  background: url("/static/RETAIL/img/header_accept_white.png") no-repeat left center;
  padding: 0px 0 0 40px;
  margin-right: 15px;
  color: black;
  display: block;
  font-family: robotolight;
  text-align: left;
  font-size: 22px;
  color: #fff;
}

.landing-banner .sliding-image {
  width: 68%;
  z-index: 0;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}

.landing-banner .the-image {
  position: absolute;
  right: 0;
  background-image: url(/static/RETAIL/img/landing_banner_bg.png);
  background-size: cover;
  background-position: 100%;
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
}

.landing-banner .image-container,
.landing-header .image-container {
  float: left;
  width: 100%;
  position: relative;
  min-height: 1px;
  padding-left: 10px;
  padding-right: 10px;
}

.landing-banner .content,
.landing-header .content {
  padding-top: 17px;
  float: left;
  width: 100%;
  position: relative;
  min-height: 1px;
  padding-left: 10px;
  padding-right: 10px;
  margin-bottom: 12px;
  font-family: robotolight;
  font-size: 16px;
  color: #000;
  text-align: center;
}
.landing-banner .image-container img,
.landing-header .image-container img {
  margin: 0 auto;
  padding: 20px 0;
}

.landing-banner .content .faded,
.landing-header .content .faded {
  padding: 15px;
  background: #ffffff;
  /* The Fallback */
  background: rgba(255, 255, 255, 0.5);
  border-radius: 4px;
}
.landing-banner .content .text,
.landing-header .content .text {
  font-family: robotobold;
  text-align: left;
  margin-bottom: 24px;
  line-height: 1.43em;
}
.landing-banner .content .title,
.landing-header .content .title {
  font-size: 24px;
}
.landing-banner .btn,
.landing-header .btn {
  margin: 0 auto;
  padding: 14px 13px 15px;
  margin-top: 10px;
}

@media (min-width: 768px) {
  .landing-banner .image-container,
  .landing-header .image-container {
    float: left;
    width: 50%;
  }
  .landing-banner .image-container img,
  .landing-header .image-container img {
    margin: 0;
  }

  .landing-banner .content,
  .landing-header .content {
    width: 50%;
  }
}
@media (min-width: 992px) {
  .landing-banner .image-container,
  .landing-header .image-container {
    float: left;
    width: 66.66666667%;
  }

  .landing-banner .content,
  .landing-header .content {
    float: right ;
  }
  .landing-banner .content,
  .landing-header .content {
    float: left;
    width: 33.33333333%;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .landing-banner .btn,
  .landing-header .btn {
    white-space: normal;
  }
}
.landing-banner .btn + a,
.landing-header .btn + a {
  margin-top: 6px;
  display: block;
}
@media (max-width: 767px) {
  .landing-header .row {
    margin: 0;
  }
  .landing-banner .image-container,
  .landing-header .image-container,
  .landing-banner .content,
  .landing-header .content {
    float: none;
  }
}

@media (min-width: 768px) {
  .landing-banner .content-left {
    padding-right: 55px;
  }
  .landing-banner .sliding-image {
    width: 60%;
  }
}

@media (max-width: 767px) {
  .landing-banner .content-left {
    background-color: #ea650d;
    padding: 20px 10px;
  }
  .landing-banner .sliding-image {
    display: none;
  }

  #calcGraphContainer {
    margin-top: 30px;
}
}

@media (max-width: 480px) {
	.open-account-button-container a {
	  font-size: 15px;
	}
}

@media (min-width: 992px) {
  .landing-banner {
    min-height: 295px;
  }
  .landing-banner .content-right .title {
    margin-top: 61px;
	}

  .landing-banner .content-right .btn {
    min-width: 230px;
  }
  .landing-banner .sliding-image {
    width: 58.5%;
  }
}
#mainGraphRow .legend{
	float:left;
}
}