/* France style */
@import "../fonts/MyFontsWebfontsKit.css";

body  {
  color: #39679d;
  font-family: "ProximaNova-Regular", sans-serif;
}

a:link,
a:hover,
a:visited {
  color: #39679d;
}

a:hover {
  color: #0019A3;
}

h1, h2, h3, h4, h5  {
  color: #39679d;
  font-family: "ProximaNova-Bold", sans-serif;

}

/* main color */
.purple  {
  color: #39679d;
}

.purple-light  {
  color: #9cb3ce;
}

.cta-box  {
  background-color: #d7e1eb;
}

.btn  {
  font-family: "ProximaNova-Bold", sans-serif;
}

.btn-primary {
  color: #fff;
  background-color: #39679d;
  border-color: #39679d;
}

.btn-primary:hover {
  color: #39679d;
  background-color: #fff;
  border-color: #39679d;
}

.btn-primary.focus, .btn-primary:focus {
  color: #fff;
  background-color: #39679d;
  border-color: #39679d;
  box-shadow: 0 0 0 0.2rem rgba(57, 103, 157, 0.5);
}

.btn-outline-primary {
  color: #39679d;
  border-color: #39679d;
}

.btn-outline-primary:hover {
  color: #fff;
  background-color: #39679d;
  border-color: #39679d;
}

.btn-outline-primary:focus, .btn-outline-primary.focus {
  box-shadow: 0 0 0 0.2rem rgba(57, 103, 157, 0.5);
}

.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show > .btn-outline-primary.dropdown-toggle {
  color: #fff;
  background-color: #39679d;
  border-color: #39679d;
}

.btn-outline-primary:not(:disabled):not(.disabled).active:hover  {
  color: #39679d;
  background-color: #fff;
  border-color: #39679d;
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
  color: #39679d;
}

.btn-outline-primary.disabled:hover,
.btn-outline-primary:disabled:hover {
  background-color: #fff;
}

.btn-primary.disabled,
.btn-primary:disabled {
  color: #fff;
  background-color: #39679d;
  border-color: #39679d;
}

.triangle-left-or-text,
.triangle-left {
  border-right: 12px solid #39679d;
}

.french .triangle-left-or-text,
.french .triangle-left {
  border-right: 12px solid #39679d;
}

.triangle-left-or-text:hover  {
  color: #fff;
}

.again-link a  {
  color: #9cb3ce;
  text-decoration: none;
}

.again-link a .triangle-left  {
  border-right: 12px solid #9cb3ce;
  margin-right: 6px;
}

.question-count,
.again-link  {
  font-family: "ProximaNova-Bold", sans-serif;
}

.home .intro-text  {
  color: #39679d;
}

.question-box  {
  color: #fff;
  background-color: #39679d;
}

.number {
  color: #39679d;
  border: 1px solid #39679d;
}

.number.done {
  background-color: #39679d;
}

.number.active {
  background-color: #39679d;
}

.result-number .circle  {
  color: #fff;
  background-color: #39679d;
  font-family: "ProximaNova-Bold", sans-serif;
}

.triangle-bottom {
  border-top: 12px solid #39679d;
}

.score  {
  font-family: "ProximaNova-Bold", sans-serif;
}

.progress {
  background-color: #d7e1eb;
  border: 2px solid #d7e1eb;
}

.progress-bar  {
  background-color: #39679d;
}


.answer-box button.answer {
  color: #39679d;
  border: 2px solid #39679d;
}

.no-ios .answer-box button:hover  {
  color: #fff;
  background-color: #39679d;
  border: 2px solid #39679d;
}

.answer-box button.active {
  color: #fff;
  background-color: #39679d;
  border: 2px solid #39679d;
}

.answer-box button.result {
  background-color: #0019A3;
  border: 2px solid #0019A3;
}

.answer-box button.chosen,
.answer-box a.result.chosen  {
  border: 2px solid #0019A3;
}

/* PDF specifiek */

.results .result  {
  border: 1px solid #39679d;
}

.results .result.blue  {
  border: 1px solid #63c3d1;
}

.results .result.blue.active  {
  color: #fff;
  background-color: #63c3d1;
}

/* volgens commentaar wordt dit niet gebruikt */
.results .result.orange  {
}

.results .result.orange.active  {
  color: #fff;
  background-color: #ed6b17;
  border: 1px solid #ed6b17;
}

.results .nav-pills .nav-sm-link.active {
  color: #fff;
  background-color: #39679d;
  border: 1px solid #39679d;
}

.results .nav-pills .nav-sm-link.chosen,
.results .nav-pills .nav-sm-link.result.chosen  {
  border: 1px solid #0019A3;
}

.score .number.orange  {
  color: #ed6b17;
}

.score .number.blue  {
  color: #63c3d1;
}


@media (min-width: 768px) {
  .triangle-left-or-text {
    color: #39679d;
  }
}