:root {
  --dark: rgba(3,21,54,1);
  --darkf: rgba(5, 40, 101);
  --gold: rgba(207, 159, 108, 1);
  --lgold: rgba(207, 169, 130, 1);
  --iborder: rgba(76, 81, 93, 1);
  --w: #FFF;
  --grey: #c9cad3;
  --vdark: rgba(3, 21, 54, 1);
  --light:rgba(234,238,247,1);
  --dirt:rgba(245,241,241,1);
  --red:#fa3246;
  --darkgrey: #363231;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0px;
  padding: 0px;
  font-family: 'Inter';
}

.header {
  background: var(--dark);
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90px;
}

.logo IMG {
  height: 60px;
}

.mt60 {
  margin-top: 60px;
}

.errorbox {
  font-size: 1em;
  text-align: left;
  color: var(--red);
  font-weight: 500;
  display: none;
  align-items: center;
  gap:10px;
  margin-bottom: 10px;
}

.flex {
  display: flex;
}

.errorbox IMG {
  width:15px;
  height: 15px;
  margin-right: 10px;
}

.errorized {
  border: 2px solid var(--red) !important;
  margin-bottom: 0px !important;
  margin-top: 5px;
}

.inside {
  width:1140px;
  margin:0 auto;
}

.highlight {
  color: var(--gold);
  text-decoration: underline;
}

.button {
  padding: 10px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--w);
  font-weight: 600;
  font-size: 1.5rem;
  background: var(--gold);
  text-decoration: none;
  height: 50px;
}

INPUT[type="submit"] {
  padding: 10px;
  border-radius: 5px;
  border:0px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--w);
  font-weight: 600;
  font-size: 1.5rem;
  background: var(--gold);
  text-decoration: none;
  height: 50px;
  width:100%;
  cursor: pointer;
}

.bold500 {
  font-weight: 600;
}

.bold600 {
  font-weight: 600;
}

.bold700 {
  font-weight: 600;
}

.faces {
  background-image: url('../img/gridback.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-top: 60px;
}

.obtain {
  font-size: 1.125rem;
  color: var(--darkf);
  font-weight: 600;
  text-align: center;
}

.big H1 {
    font-size: 2.5rem;
    color: var(--darkf);
    font-weight: 600;
}

.big {
  text-align: center;
}

.formrow INPUT[type="text"] {
  border: 1px solid var(--iborder);
  width: 100%;
  height: 50px;
  border-radius: 3px;
  padding: 3px;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  font-size: 18px;
  color: var(--darkgrey);
}

.formrow INPUT::placeholder {
  font-size: 18px;
  color: var(--grey);
}

.formrow BUTTON {
  width: 100%;
  height: 50px;
  border-radius: 5px;
  border:0px;
  color: var(--w);
  background: var(--gold);
  font-size: 1rem;
  font-weight: 600;
}

.faceimg {
  text-align: center;
}

.descl {
    font-size: .75rem;
    color: var(--darkf);
    text-align:center;
    margin-top: 40px;
}

.enter {
  margin-top: 60px;
  font-size: 1.25rem;
  color: var(--darkf);
  text-align:center;
}

.colombo {
  font-size: 1.25rem;
  color: var(--vdark);
  text-align:center;
  margin-top: 60px;
  margin-bottom: 100px;
}

.carlos {
  margin-bottom: 40px;
  text-align: center;
}

.sep {
  height: 3px;
  width:50%;
  background: var(--gold);
  margin: 0 auto;
}

.carlos DIV {
      font-size: 1.75rem;
      color: var(--darkf);
      text-align:center;
      font-weight: 600;
}

.faceimg {
  margin-top: 40px;
  margin-bottom: 60px;
}

.carlos SPAN {
  font-size: 1.25rem;
  color: var(--darkf);
  text-align:center;
  font-weight: 600;
}


/*************Three blocks*************/

.threeblock {
  background: var(--dark);
  padding-top: 100px;
  padding-bottom: 60px;
}

.tb_ttl{
    font-size: 2rem;
    color: var(--w);
    text-align: center;
    font-weight: 600;
    margin-bottom: 40px;
}

.tb_subttl{
    font-size: 1.25rem;
    color: var(--w);
    text-align: center;
    margin-bottom: 40px;
}

.tb_wrapper {
  display: flex;
  gap:20px;
  justify-content: center;
}

.tb_block {
  background: var(--w);
  padding: 20px;
  width:350px;
}

.tbb_name {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--dark);
}

.tb_stars {
  font-size: 1.25rem;
  margin-top: 40px;
  margin-bottom: 20px;
  font-weight: 600;
  color: var(--gold);
}

.tb_text {
  font-size: 1rem;
  color: var(--fdark);
  line-height: 1.5rem;
}

/*********white block************/

.wb_ttl {
  font-size:2rem;
  font-weight: 600;
  text-align: center;
  color: var(--dark);
  padding-top: 100px;
  margin-bottom: 60px;
}

.wb_descr {
  font-size: 1.125rem;
  line-height: 1.5rem;
  color: var(--fdark);
  margin-bottom: 40px;
}

.wb_wrapper {
  display: flex;
  gap:20px;
  justify-content: center;
    margin-bottom: 60px;
}

.wb_items {
  display: flex;
  color: var(--dark);
  font-size: 1.125rem;
  line-height: 1.5rem;
  flex-direction: column;
  gap:20px;
}

.wb_items DIV {
  display: flex;
  align-items: middle;
}

.wb_items DIV IMG {
  height: 1.125rem;
  width:1.125rem;
}

.wb_sub_wrap {
  font-size: 1.125rem;
  line-height: 1.5rem;
  color: var(--dark);
  text-align: center;
  margin-bottom: 40px;
}

.wb_sub_wrap2 {
  font-size: 1.125rem;
  line-height: 1.5rem;
  color: var(--dark);
    text-align: center;
      margin-bottom: 60px;
}

.butwhite {
  width:400px;
  margin: 0 auto;
    margin-bottom: 60px;
}

/**********Blue three block****/
.bluethree_ttl {
  font-size:2rem;
  font-weight: 600;
  text-align: center;
  color: var(--dark);
  margin-bottom: 40px;
}

.bluethree {
  background: var(--light);
  padding-top: 60px;
  padding-bottom: 40px;
}

.bl_item {
  padding: 20px;
  background: var(--w);
}

.bluethree_item_ttl {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--dark);
}

.bluethree_item_descr {
  font-size: 1.125rem;
  color: var(--dark);
  margin-top: 20px;
}

.bl_wrap {
  display: flex;
  justify-content: center;
  gap:20px;
}

.bl_item_img IMG {
  padding: 0px;
  margin: 0px;
}

/**********Navigate block****/
.navigate_ttl {
  font-size:2rem;
  font-weight: 600;
  text-align: center;
  color: var(--dark);
  margin-bottom: 40px;
}

.navigate {
  background: var(--w);
  padding-top: 60px;
  padding-bottom: 40px;
}

.navigate_item {
  padding: 20px;
  background: var(--dirt);
  width:250px;
}

.navigate_item_ttl {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--dark);
  text-align: center;
}

.navigate_item_descr {
  font-size: 1.125rem;
  color: var(--dark);
  text-align: center;
}

.navigate_wrap {
  display: flex;
  justify-content: center;
  gap:20px;
}

.navigate_item_img {
  height: 50%;
  text-align: center;
  margin-bottom: 20px;
}

.navigate_item_img IMG {
  padding: 0px;
  margin: 0px;
}

/**********Sponsor********/
.sponsor {
  padding-top: 60px;
  padding-bottom: 40px;
}

.sp_wrap {
  display: flex;
  justify-content: center;
  gap:40px;
}

.sponsim IMG {
  width:300px
}

.sp_ttl {
  color:var(--vdark);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5rem;
  text-align: center;
  margin-bottom: 40px;
}


/***********Process***************/

.process {
  padding-top: 60px;
  padding-bottom: 40px;
  background: var(--dark);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.bignum {
  font-size: 4rem;
  font-weight: 600;
  color: var(--gold);
}

.pro_wrapper {
  margin: 0 auto;
  display: flex;
  gap:80px;
  margin-bottom: 60px;
  background-image: url('../img/liberty2.png');
  background-position: center center;
  background-size: cover;
  background-repeat:no-repeat;
  justify-content: center;
  align-items: center;
}

.butproc {
  margin-left: -100px;
  text-align: center;
  display: flex;
  justify-content: center;
}

.butproc A {
  width:fit-content;
}

.problock {
  display: flex;
  gap:20px;
  align-items: center;
}

.pr_blocktitle {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--w);
}

.pr_blockdesc {
  font-size: 1.125rem;
  line-height: 1.5rem;
  color: var(--w);

}

.pro_wrapper_left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:80px;
}

.pro_wrapper_right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:80px;
}


.w20 {
  width:20%;
}


.w80 {
  width:80%;
}

.proc_ttl {
  color:var(--w);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.5rem;
  text-align: center;
  margin-bottom: 40px;
}

.process_descr {
  color:var(--w);
  font-size: 1.125rem;
  line-height: 1.5rem;
  text-align: center;
  margin-bottom: 80px;
}

/****Review****/
.review {
  background: var(--light);
  padding-top: 80px;
  padding-bottom: 60px;
}

.review .tb_ttl, .review .tb_subttl {
  color: var(--dark);
}

/********Action***********/

.actionf {
  background-image: url('../img/liberty.png');
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 60px;
  padding-bottom: 40px;
}

.ac_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ac_ttl {
  font-size: 1.5rem;
  color:var(--w);
  font-weight: 500;
  line-height: 2rem;
  margin-bottom: 40px;
  text-align: center;
}

.ac_subttl {
  font-size: 1.125rem;
  color:var(--w);
  line-height: 1.5rem;
  margin-bottom: 40px;
  text-align: center;
}

/*****************Footer***************/
footer {
  background: var(--dark);
  padding-top: 60px;
  padding-bottom: 40px;
}

.foot_wrap {
  color: var(--w);
  display: flex;
  justify-content: space-between;
  font-size: 12px;
}

.fr_top DIV {
  margin-bottom: 5px;
}

.fr_top A {
  text-decoration: underline;
  color: var(--w);
}

.pro_wrapper_mobile {
  display: none;
}

/*********Thank you page**********/

.typage_big {
  text-align: center;
  font-size: 2rem;
  font-weight: 600;
  color: var(--dark);
  margin-top: 60px;
  margin-bottom: 40px;
}

.typage_sm {
  text-align: center;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--dark);
  margin-bottom: 20px;
}

.typage_image {
  text-align: center;
  margin-bottom: 40px;
}

.typage {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 1140px;
  margin: 0 auto;
}

.complete {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 1140px;
  margin: 0 auto;
  margin-bottom: 40px;
}

.complete FORM {
  width:60%;
}

.loader {
  display: none;
  text-align: center;
}

.loader IMG {
  width:30px;
  height: 30px;
  border-radius: 10px;
}

/***Quiz**************/
.select2 {
  width:100% !important;
}

.select2-container .select2-selection--single {
  align-items: center !important;
  display: flex !important;
  height: 60px !important;
  font-size: 1.5rem !important;
  color: var(--dark);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top:15px !important;
}

.quiz {
  width:700px;
  margin: 0 auto;
  padding-top: 60px;
  padding-bottom: 80px;
}

.hidden {
  display: none;
}

.cnt {
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  background-color: var(--dark);
  border-start-start-radius: 5px;
  border-end-start-radius: 3px;
  border-start-end-radius: 3px;
  border-end-end-radius: 5px;
  min-inline-size: 16px;
  block-size: 19px;
  font-weight: bold;
  -webkit-box-align: center;
  align-items: center;
  color: #FFF;
  padding: 10px;
  font-size: 1.75rem;
  line-height: 14px;
  letter-spacing: 0px;
  width:2rem;
  height: 2rem;
  margin-right: 20px;
}

.question {
  display: flex;
  font-size: 1.5rem;
  color: var(--dark);
  align-items: center;
  margin-bottom: 20px;
}

.answ {
  display: flex;
  gap:20px;
  border: 2px solid #1e3e75;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 15px;
  cursor: pointer;
  color: var(--dark);
  align-items: center;
}

.answ:hover {
  background: #a9b8d0;
}

.anactive {
  background: #a9b8d0;
}

.answ DIV {
  border: 2px solid #1e3e75;
  border-radius: 10px;
  width:40px;
  height:40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.qnav {
    display: flex;
    gap:40px;
    margin-top: 40px;
}

.qnav DIV {
  width:100px;
  height: 60px;
  background: var(--gold);
  font-size: 1.5rem;
  color: var(--w);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  border-radius: 5px;
  cursor: pointer;
}

.bblocked {
  background: var(--grey) !important;
}
/****Mobile *****/

@media (max-width: 480px) {
  .inside {
    width:auto;
    padding-left: 10px;
    padding-right: 10px;
  }

  .tb_wrapper {
    flex-direction: column;
  }

  .faceimg IMG {
    width:100%;
  }

  .wb_wrapper {
      flex-direction: column;
  }

  .tb_block {
    width:100%;
  }

  .bl_wrap {
      flex-direction: column;
  }

  .butproc {
    margin-left: 0px;
  }

  .proc_ttl {
    line-height: 2rem;
  }

  .bl_item_img {
    text-align: center;
  }

  .bluethree_item_ttl {
      text-align: center;
  }

  .bluethree_item_subttl {
      text-align: center;
  }

  .navigate_wrap {
      flex-direction: column;
  }

  .navigate_item {
    width:100%;
  }

  .pro_wrapper {
    display: none;
  }

  .problock {
    margin-bottom: 20px;
  }

  .wb_wright IMG {
    width:100%;
  }

  .button {
    height: auto;
  }

  .pro_wrapper_mobile {
    display: flex;
    flex-direction: column;
  }

  .sp_wrap {
    flex-direction: column;
    align-items: center;
  }

  .ac_wrapper {
    flex-direction: column;
  }

  .foot_wrap {
      flex-direction: column;
      align-items: center;
      justify-content:center;
      gap:20px;
      text-align: center;
  }

  .typage {
    width:auto;
    padding-left: 20px;
    padding-right: 20px;
  }

  .complete {
    width:auto;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
  }

  .typage_image IMG {
    width:100%;
  }

  FORM {
    width:100%;
  }

  INPUT[type="submit"] {
    width:100%;
  }

  .butwhite {
    width:auto;
  }

  .quiz {
    width:100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .logo IMG {
    height: 60px;
    width:100%;
  }

  .complete FORM {
    width:100%;
  }

  .qnav {
    width:100%;
    justify-content: space-between;
  }

  .qnav DIV {
    width:100%;
  }
}