body {

  font-family: 'Poppins';
  font-weight: 900;

}

.header {

  border-bottom: 10px solid #bf1e2e;

  border-image-source: linear-gradient(45deg, #952b2b, #d28444);

  border-image-slice: 1;

}

.content{

  text-align: center;

    color: #fff;

    font-size: 80px;

    font-weight: 500;

    line-height: 95px;

    padding: 125px 0;

}

.content-btns {

  text-align: center;

    padding-bottom: 30px;

}

.btn {

  color: #fff;

    font-size: 30px;

    font-weight: 500;

    padding: 10px 20px;

    line-height: 35px;

    margin: 5px 10px;

}

.btn.focus, .btn:focus, .btn:hover {

    color: #fff;

}

.btn-blue, .sw-btn-prev {

    background: #0872BA;

}

.btn-orange, .sw-btn-next {

  background: #1a439d;

}

h1.title {

    text-align: center;

    padding: 0 0 35px 0;

    font-size: 30px;

    margin: 0;

}

.symptoms {

    margin-bottom: 100px;

}

.symptoms h2.title {

    font-size: 24px;

    font-weight: 500;

    margin-top: 10px;

}

.symptoms h3.sub-title {

    font-size: 20px;

    font-weight: 500;

    margin-top: 10px;

    color: #009543;

}

.detail-form .form-control {

    background-color: #009543;

    border: 1px solid #009543;

    color: #fff;

    font-size: 30px;

    height: 50px;

}

.detail-form .form-control::placeholder {

    color: #000;

}

.detail-form .control-label {

    font-size: 25px;

    padding: 0;

    line-height: 50px;

}

.detail-form .control-inline {

    margin: 10px 0;

    line-height: 28px;

}

.detail-form .rounded-circle {

    margin-top: 75px;

}

.language-form .btn-orange {

  width: 100%;

  border: 2px solid #d18343;

  color: #000;

  font-size: 25px;

  line-height: 30px;

  background: none;
  
  transition: all 0.3s linear;

}
.btn-orange:hover , .btn-orange:focus {
  color: #fff;
    border: #932a29;
    background-color: #962c26;
}

.language-form {

  padding: 35px 0 35px 0;

}

.language-form .div-center {

  margin: 0 auto;

  float: none;

}

.language-form .rounded-circle {

    margin-top: 150px;

}

.question-form h1.title {

  font-size: 25px;

  line-height: 35px;

  padding: 10px 0;

}

.question-form .btn-orange {

  width: 100%;

  border: 5px solid #009543;

  color: #000;

  font-size: 25px;

  line-height: 30px;

  font-weight: 700;

  background: none;

}

.question-form input[type=radio]{

  display: none;

}

.question-form input:checked + .btn-orange{

  background: #0872BA;

  color: #fff;

}

.question-form .div-center {

  margin: 0 auto;

  float: none;

}

.question-form .rounded-circle {

    margin-top: 50px;

}

.form-horizontal .radio-inline {

  position: relative;

  padding-left: 35px;

  padding-top: 0;

  margin-bottom: 12px;

  cursor: pointer;

  font-size: 22px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

}

.radio-inline input {

  position: absolute;

  opacity: 0;

  cursor: pointer;

}

.checkmark {

  position: absolute;

  top: 0;

  left: 0;

  height: 25px;

  width: 25px;

  background-color: #eee;

  border-radius: 50%;

}

.radio-inline:hover input ~ .checkmark {

  background-color: #ccc;

}

.radio-inline input:checked ~ .checkmark {

  background-color: #009543;

}

.checkmark:after {

  content: "";

  position: absolute;

  display: none;

}

.radio-inline input:checked ~ .checkmark:after {

  display: block;

}

.radio-inline .checkmark:after {

    top: 9px;

    left: 9px;

    width: 8px;

    height: 8px;

    border-radius: 50%;

    background: white;

}

.result-form .score {

  color: #009543;

  font-size: 70px;

  line-height: 80px;

}

.result-form h6 {

    font-size: 20px;

    margin-top: 50px;

    font-weight: 600;

}

.result-form p {

  font-size: 20px;

}

.footer {

    border-top: 10px solid #bf1e2e;

    border-image-source: linear-gradient(45deg, #92282a, #ac470e);
    border-image-slice: 1;

    color: #fff;

    line-height: 50px;

    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;

}

.btn-finish.disabled {

  display: none;

}

.sw-btn-next.disabled {

  display: none;

}

@media only screen and (max-width: 600px) {

  h1.title {

    font-size: 20px;

  }

  .btn {

    font-size: 18px;

    line-height: 20px;

  }

  .content {

    font-size: 50px;

    line-height: 60px;

  }

  .detail-form .control-label {

    margin-left: 15px;

  }

  .detail-form .rounded-circle {

    margin-top: 20px;

    margin-bottom: 20px;

    width: 200px;

  }

  .language-form .btn-orange {

    margin: 5px 0;

    font-size: 18px;

    line-height: 20px;

  }

  .language-form .rounded-circle {

    margin-top: 20px;

    margin-bottom: 20px;

    width: 200px;

  }

  .question, .detail, .language {

    display: flex;

    flex-direction: column-reverse;

  }

  .question-form .btn-orange {

    margin: 5px 0;

  }

  .question-form .rounded-circle {

    margin-top: 20px;

    margin-bottom: 20px;

    width: 200px;

  }

}


