* {
  margin: 0;
  padding: 0;
}
body {
  background: #ffffff;
}
:root {
  /*--baseColor: #FF0000;
	--secondaryColor: #CC0000;*/
  --baseColor: #ffa70d;
  --secondaryColor: #d98b03;
  --lightColor: #ffffff;
  --grayColor: #f7f7f7;
  --darkColor: #333333;

  --baseFont: "Roboto", sans-serif;
  --secondaryFont: "Playfair Display", serif;
}

/* ===== CSS For "Common Cases" Starts Here ===== */
a {
  text-decoration: none;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
a:hover {
  text-decoration: none;
}
img {
  max-width: 100%;
}

/* ======================== */

.grid_item {
  display: -ms-grid;
  display: grid;
  -ms-flex-line-pack: center;
  align-content: center;
}

/* ======================== */

.cta_btn_wrap {
  margin-top: 20px;
}
.cta_btn {
  color: var(--lightColor);
  background: var(--baseColor);
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 28px;
  border-bottom: 5px solid var(--secondaryColor);
  border-radius: 5px;
  text-align: center;
  display: block;
  padding: 10px 15px;
  text-decoration: none;
  letter-spacing: -0.4px;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}
.cta_btn:hover {
  color: var(--lightColor);
  text-decoration: none;
  background: var(--secondaryColor);
}

/* ======================== */

.heading {
  margin-bottom: 10px;
}
.heading h3 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 800;
  font-size: 30px;
  line-height: 1.3;
  margin-bottom: 0px;
}
.heading h3 a {
  color: var(--darkColor);
  text-decoration: none;
}

/* ======================== */

.sub_heading {
  margin-bottom: 10px;
}
.sub_heading h4 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 24px;
  margin-bottom: 0px;
}

/* ======================== */

.sub_title {
  margin-bottom: 10px;
}
.sub_title h5 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 20px;
  margin-bottom: 0px;
}

/* ======================== */

.para_texts p {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 18.5px;
  line-height: 1.5;
  margin-bottom: 15px;
}
.para_texts p:last-child {
  margin-bottom: 0px;
}
.para_texts p .bold_texts {
  font-weight: 700;
}
.para_texts p .red_texts {
  color: var(--baseColor);
}
.para_texts p a {
  color: #006699;
  font-weight: 500;
  text-decoration: underline;
}
.para_texts p a:hover {
  color: #7dc049;
}

/* ======================== */

.mt_10 {
  margin-top: 10px !important;
}
.mt_15 {
  margin-top: 15px !important;
}
.mt_20 {
  margin-top: 20px !important;
}

.mb_10 {
  margin-bottom: 10px !important;
}
.mb_15 {
  margin-bottom: 15px !important;
}
.mb_20 {
  margin-bottom: 20px !important;
}
/* ===== CSS For "Common Cases" Ends Here ===== */

/* ============================== */
/* ============================== */
/* ============================== */

/* ===== CSS For "Header" Starts Here ===== */
.header_wrap {
  padding: 15px 0px;
}
.header {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-grid-columns: 240px 15px 1fr;
  grid-template-columns: 240px 1fr;
  grid-auto-rows: auto;
  gap: 15px;
}
.header .adver_txts {
  text-align: right;
}
.header .adver_txts h6 {
  color: #999999;
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 14px;
  margin-bottom: 0px;
}
/* ===== CSS For "Header" Ends Here ===== */

/* ============================== */
/* ============================== */
/* ============================== */

/* ===== CSS For "Article Common" Starts Here ===== */
.article_wrap {
  /*background: #EBF3F7;*/
  padding: 25px 0px;
}

.the_article {
  background: var(--lightColor);
  padding: 20px;
}
.the_article .single_part {
  margin-bottom: 50px;
}
.the_article .single_part:last-child {
  margin-bottom: 0px;
}

/* ============================== */

.the_article .preview_media {
  margin-bottom: 15px;
}
.the_article .preview_media img {
  width: 100%;
}

.the_article .preview_media video {
  width: 100%;
}

/* ============================== */
.the_article .bullet_points {
  margin-bottom: 15px;
}

.the_article .bullet_points h6 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 18.5px;
  margin-bottom: 15px;
}
.the_article .bullet_points ul {
  margin-bottom: 0px;
  padding-left: 20px;
}
.the_article .bullet_points ul li {
  list-style: none;
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 18.5px;
  margin-bottom: 15px;
  position: relative;
  padding-left: 20px;
}
.the_article .bullet_points ul li:last-child {
  margin-bottom: 0px;
}
.the_article .bullet_points ul li .bold_texts {
  font-weight: 700;
}
.the_article .bullet_points ul li .color_verified {
  color: #008000;
  font-style: italic;
}
.the_article .bullet_points ul li:before {
  content: "";
  background: var(--darkColor);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  position: absolute;
  left: 0px;
  top: 10px;
}

/* ============================== */

.the_article .quote_box {
  background: #fafafa;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  border-left: 5px solid #f0ad4e;
  padding: 20px;
  margin: 15px 0px;
}

/* ============================== */

.the_article .how_contents {
  margin-top: 25px;
}
.the_article .how_contents .steps {
  margin-bottom: 20px;
}
.the_article .how_contents .steps h6 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 18.5px;
  margin-bottom: 15px;
}

.the_article .how_contents .steps p {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 18.5px;
  margin-bottom: 15px;
}
.the_article .how_contents .steps ul {
  margin-bottom: 0px;
}
.the_article .how_contents .steps ul li {
  list-style: none;
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 18.5px;
  line-height: 1.5;
  margin-bottom: 10px;
}
.the_article .how_contents .steps ul li:last-child {
  margin-bottom: 0px;
}
.the_article .how_contents .steps ul li .bold_texts {
  font-weight: 700;
}
.the_article .how_contents .steps ul li a {
  color: #006699;
  font-weight: 500;
  text-decoration: underline;
}
.the_article .how_contents .steps ul li a:hover {
  color: #7dc049;
}

/* ============================== */

.the_article .select_options .sub_heading h4 {
  color: #337ab7;
  text-align: center;
}
.the_article .select_property .sub_heading h4 {
  color: var(--darkColor);
}

.the_article .select_options .options_2 ul {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 12.5px 1fr;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: auto;
  gap: 12.5px;
  margin-bottom: 0px;
}
.the_article .select_options .options_4 ul {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 12.5px 1fr 12.5px 1fr 12.5px 1fr;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: auto;
  gap: 12.5px;
  margin-bottom: 0px;
}
.the_article .select_options ul li {
  list-style: none;
}
.the_article .select_options ul li a {
  text-decoration: none;
  color: var(--darkColor);
  background: #eeeeee;
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 24px;
  display: block;
  padding: 10px 15px;
  text-align: center;
  border-radius: 5px;
}
.the_article .select_options ul li a:hover {
  color: var(--lightColor);
  background: #dd3500;
  -webkit-transform: scale(1.025);
  -ms-transform: scale(1.025);
  transform: scale(1.025);
}

.the_article .select_property ul li a {
  color: var(--lightColor);
  background: #7dc049;
  font-size: 20px;
}
.the_article .select_property ul li a:hover {
  background: #006699;
}
/* ===== CSS For "Article Common" Ends Here ===== */

/* ============================== */
/* ============================== */
/* ============================== */

/* ===== CSS For "Article Header" Starts Here ===== */
.article_header {
  margin-bottom: 50px;
}

.article_header .article_title {
  margin-bottom: 10px;
}
.article_header .article_title h1 {
  color: var(--darkColor);
  /*color: #ffa70d;*/
  /*font-family: var(--secondaryFont);*/
  font-weight: 700;
  font-size: 52px;
  line-height: 1.1;
  letter-spacing: -0.8px;
  margin-bottom: 0px;
  text-align: center; 
  font-family: var(--baseFont);
}

.article_header .article_title h2 {
  /*color: var(--darkColor);*/
  color: #ffa70d;
  /*font-family: var(--secondaryFont);*/
  font-weight: 500;
  font-size: 43px;
  line-height: 1.1;
  letter-spacing: -0.8px;
  margin-bottom: 0px;
  text-align: center;
  font-style: italic;
}

.article_header .author_info {
  display: -ms-grid;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-grid-columns: 40px 12px 1fr;
  grid-template-columns: 40px 1fr;
  grid-auto-rows: auto;
  gap: 12px;
  margin-bottom: 15px;
  justify-content: center;
}
.article_header .author_info .image img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
}
.article_header .author_info h6 {
  color: #999999;
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 0px;
}
.article_header .author_info h6 .color_texts {
  /*color: #7dc049;*/
  font-weight: 700;
}

.article_header .article_banner {
  margin-bottom: 25px;
}
.article_header .article_banner img {
  width: 100%;
}

.article_header .heading {
  margin-bottom: 20px;
  margin-top: 20px;
}
/* ===== CSS For "Article Header" Ends Here ===== */

/* ============================== */
/* ============================== */
/* ============================== */

/* ===== CSS For "Quiz" Starts Here ===== */
.quiz_wrapper {
  box-shadow: 0px 2px 4px rgba(10, 37, 64, 0.25);
  border-radius: 4px;
  padding: 20px;
}

/* ============================== */

.quiz_wrapper .quiz_header_progress {
  border-bottom: 1px solid #d7d7d7;
  margin-bottom: 20px;
  padding-bottom: 20px;
}

.quiz_wrapper .progress {
  height: 20px;
}
.quiz_wrapper .progress .progress-bar {
  background-color: #0d334c;
}

.quiz_wrapper .progress .progress-bar span {
  color: var(--lightColor);
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 14px;
  font-style: italic;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

/* ============================== */

/* ====Progress Bar Inner Text Control==== */
.progress .two_of_four {
  display: none;
  opacity: 0;
}
.progress .three_of_four {
  display: none;
  opacity: 0;
}
.progress .four_of_four {
  display: none;
  opacity: 0;
}

/* ============================== */

.progress .two_of_five {
  display: none;
  opacity: 0;
}
.progress .three_of_five {
  display: none;
  opacity: 0;
}
.progress .four_of_five {
  display: none;
  opacity: 0;
}
.progress .five_of_five {
  display: none;
  opacity: 0;
}

/* ============================== */
/* ============================== */

.quiz_wrapper .progress_four.force_two .one_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_two .two_of_four {
  display: block;
  opacity: 1;
}
.quiz_wrapper .progress_four.force_two .three_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_two .four_of_four {
  display: none;
  opacity: 0;
}

/* ------------------------------ */

.quiz_wrapper .progress_four.force_three .one_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_three .two_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_three .three_of_four {
  display: block;
  opacity: 1;
}
.quiz_wrapper .progress_four.force_three .four_of_four {
  display: none;
  opacity: 0;
}

/* ------------------------------ */

.quiz_wrapper .progress_four.force_four .one_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_four .two_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_four .three_of_four {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_four.force_four .four_of_four {
  display: block;
  opacity: 1;
}

/* ============================== */
/* ============================== */

.quiz_wrapper .progress_five.force_two .one_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_two .two_of_five {
  display: block;
  opacity: 1;
}
.quiz_wrapper .progress_five.force_two .three_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_two .four_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_two .five_of_five {
  display: none;
  opacity: 0;
}

/* ------------------------------ */

.quiz_wrapper .progress_five.force_three .one_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_three .two_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_three .three_of_five {
  display: block;
  opacity: 1;
}
.quiz_wrapper .progress_five.force_three .four_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_three .five_of_five {
  display: none;
  opacity: 0;
}

/* ------------------------------ */

.quiz_wrapper.force_four .progress_five .one_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper.force_four .progress_five .two_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper.force_four .progress_five .three_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper.force_four .progress_five .four_of_five {
  display: block;
  opacity: 1;
}
.quiz_wrapper.force_four .progress_five .five_of_five {
  display: none;
  opacity: 0;
}

/* ------------------------------ */

.quiz_wrapper .progress_five.force_five .one_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_five .two_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_five .three_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_five .four_of_five {
  display: none;
  opacity: 0;
}
.quiz_wrapper .progress_five.force_five .five_of_five {
  display: block;
  opacity: 1;
}
/* ====Progress Bar Inner Text Control==== */

/* ====Progress Bar Control==== */
.quiz_wrapper .progress_four .progress-bar {
  width: 25%;
}
.quiz_wrapper .progress_four.force_two .progress-bar {
  width: 50%;
}
.quiz_wrapper .progress_four.force_three .progress-bar {
  width: 75%;
}
.quiz_wrapper .progress_four.force_four .progress-bar {
  width: 100%;
}

/* ============================== */

.quiz_wrapper .progress_five .progress-bar {
  width: 20%;
}
.quiz_wrapper .progress_five.force_two .progress-bar {
  width: 40%;
}
.quiz_wrapper .progress_five.force_three .progress-bar {
  width: 60%;
}
.quiz_wrapper .progress_five.force_four .progress-bar {
  width: 80%;
}
.quiz_wrapper .progress_five.force_five .progress-bar {
  width: 100%;
}
/* ====Progress Bar Control==== */

/* ============================== */
/* ============================== */

.answer_checking {
  display: none;
}
.final_box {
  display: none;
}

/* ============================== */
/* ============================== */

.survey_box .single_question {
  text-align: center;
  max-width: 500px;
  margin: 0px auto;
}
.survey_box .single_question .answer_options ul {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 15px 1fr;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: auto;
  gap: 15px;
  margin-bottom: 0px;
}
.survey_box .single_question .survey_btn {
  display: block;
  padding: 10px 15px;
  font-size: 20px;
  border-bottom: none;
  background: #7dc049;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}
.survey_box .single_question .survey_btn:hover {
  background: #006699;
  -webkit-transform: scale(1.025);
  -ms-transform: scale(1.025);
  transform: scale(1.025);
}

.survey_box .question_texts {
  margin-bottom: 15px;
}
.survey_box .question_texts p {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 22px;
  line-height: 1.3;
  margin-bottom: 0px;
}

.survey_box .answer_options ul {
  margin-bottom: 0px;
}
.survey_box .answer_options ul li {
  list-style: none;
}
.survey_box .answer_options ul li:last-child {
  margin-bottom: 0px;
}

/* ============================== */
/* ============================== */

.survey_box form {
  max-width: 420px;
  margin: 0px auto;
}
.survey_box .select_field {
  position: relative;
}
.survey_box .select_field select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  text-indent: 1px;
  text-overflow: "";
  padding-right: 30px;
  cursor: pointer;
}
.survey_box .select_field select::-ms-expand {
  display: none;
}
.survey_box .select_field:after {
  content: "\f0d7";
  color: #7dc049;
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  font-size: 20px;
  position: absolute;
  right: 15px;
  top: 50%;
  pointer-events: none;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.survey_box .select_field .form-control {
  color: var(--darkColor);
  background: #f6f9fc;
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 18px;
  border: 1px solid #d7d7d7;
  border-radius: 5px;
  height: inherit;
  padding: 10.5px 15px;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}
.survey_box .select_field .form-control:active,
.survey_box .select_field .form-control:focus {
  box-shadow: none;
  border: 1px solid #7dc049;
}

.survey_box form .submit_button {
  margin-top: 15px;
}
.survey_box form .submit_button .survey_btn {
  width: 100%;
  border: none;
}
.survey_box form .submit_button .survey_btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}
.survey_box form .submit_button .survey_btn:disabled:hover {
  color: var(--lightColor);
  background: #7dc049;
  opacity: 0.7;
}

/* ============================== */
/* ============================== */

.answer_checking {
  text-align: center;
}
.answer_checking .heading {
  margin-bottom: 15px;
}
.answer_checking .heading h3 {
  color: #7dc049;
  font-family: var(--baseFont);
  font-weight: 700;
  font-size: 30px;
  margin-bottom: 0px;
}

.loader {
  width: 8px;
  height: 30px;
  display: inline-block;
  position: relative;
  border-radius: 4px;
  box-sizing: border-box;
  animation: animloader 1s linear infinite alternate;
  margin-left: -120px;
}

@keyframes animloader {
  0% {
    box-shadow: 20px 0 rgba(255, 255, 255, 0), 40px 0 rgba(255, 255, 255, 0),
      60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0),
      100px 0 rgba(255, 255, 255, 0);
  }
  20% {
    box-shadow: 20px 0 #7dc049, 40px 0 rgba(255, 255, 255, 0),
      60px 0 rgba(255, 255, 255, 0), 80px 0 rgba(255, 255, 255, 0),
      100px 0 rgba(255, 255, 255, 0);
  }
  40% {
    box-shadow: 20px 0 #7dc049, 40px 0 #7dc049, 60px 0 rgba(255, 255, 255, 0),
      80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
  }
  60% {
    box-shadow: 20px 0 #7dc049, 40px 0 #7dc049, 60px 0 #7dc049,
      80px 0 rgba(255, 255, 255, 0), 100px 0 rgba(255, 255, 255, 0);
  }
  80% {
    box-shadow: 20px 0 #7dc049, 40px #7dc049, 60px 0 #7dc049, 80px 0 #7dc049,
      100px 0 rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 20px 0 #7dc049, 40px 0 #7dc049, 60px 0 #7dc049, 80px 0 #7dc049,
      100px 0 #7dc049;
  }
}

/* ============================== */
/* ============================== */

.final_box {
  text-align: center;
}
.final_box h4 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 20px;
}
.final_box h5 {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 25px;
}
.final_box .cta_btn {
  display: block;
}
/* ===== CSS For "Quiz" Ends Here ===== */

/* ============================== */
/* ============================== */
/* ============================== */

/* ===== CSS For "Footer" Starts Here ===== */
.footer {
  background: #cce0eb;
  text-align: center;
  padding: 40px 0px;
}
.footer .footer_logo {
  max-width: 180px;
  margin: 0px auto;
}

.footer .legal_links {
  margin: 25px 0px;
}
.footer .legal_links ul {
  margin-bottom: 0px;
}
.footer .legal_links ul li {
  list-style: none;
  display: inline-block;
  margin-right: 20px;
}
.footer .legal_links ul li:last-child {
  margin-right: 0px;
}
.footer .legal_links ul li a {
  color: #006699;
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 14px;
  text-decoration: underline;
}
.footer .legal_links ul li a:hover {
  color: #7dc049;
}

.footer .disclaimer_texts {
  margin-bottom: 25px;
}
.footer .disclaimer_texts p {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 13px;
  margin-bottom: 5px;
}
.footer .disclaimer_texts p:last-child {
  margin-bottom: 0px;
}

.footer .copyright p {
  color: var(--darkColor);
  font-family: var(--baseFont);
  font-weight: 400;
  font-size: 14px;
  margin-bottom: 0px;
}
/* ===== CSS For "Footer" Ends Here ===== */

/* ============================== */
/* ============================== */
/* ============================== */
