html {
  scroll-behavior: smooth;
}
@font-face {
  font-family: BricolageGrotesque;
  src: url(BricolageGrotesqueRegular.ttf);
}
@font-face {
  font-family: BricolageGrotesqueLight;
  src: url(BricolageGrotesqueLight.ttf);
}
*{
  font-family: BricolageGrotesqueLight;
  color: #545177;
}
p{
  font-size: 22px;
}
img{
  width: 100%;
}
.row{
  display: flex;
  max-width: 1080px;
  width: 90%;
  margin: auto;
}
.center{
  text-align: center;
}
.section{
  padding-top: 60px !important;
}
    .col-lg-1 {
        flex: 0 0 auto;
        width: 10%;
    }
    .col-lg-2 {
        flex: 0 0 auto;
        width: 20%;
    }
    .col-lg-3{
        flex: 0 0 auto;
        width: 30%;
    }
    .col-lg-4{
        flex: 0 0 auto;
        width: 40%;
    }
    .col-lg-5{
        flex: 0 0 auto;
        width: 50%;
    }
    .col-lg-6{
        flex: 0 0 auto;
        width: 60%;
    }
    .col-lg-7{
        flex: 0 0 auto;
        width: 70%;
    }
    .col-lg-8{
        flex: 0 0 auto;
        width: 80%;
    }
    .col-lg-10{
        flex: 0 0 auto;
        width: 100%;
    }
    @media (max-width: 968px) 
    {
      .row{
        display: block;
      }
      .celda{
        width: 99% !important;
      }
    }


.texttop{
  font-size: 64px;
}
.calculatorgif{
  max-width: 90% !important;
}



header{
  align-items: center;
}

.logo img{
  max-width: 220px;
}
.row .texttop{
padding-left: 45px;
}


/*TAB*/
.accordion {
  background-color: #545177;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 24px;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #545177;
}

.accordion:after {
  content: '>';
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.panel {
  padding: 0 18px;
  background-color: #545177;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  
}
.panel p{
  color: white;
  font-size: 20px !important;
}
.panel a{
  color: #ecf458;
}
/*FIN TAB*/
.c-button{
  border: 1px solid #545177;
  padding: 15px 25px;
  font-size: 25px;
  font-weight: 800;
  border-radius: 100px;
  margin: 0 auto;
  background-color: white;
  transition-duration: 0.25s;
  cursor: pointer;
}
.c-button:hover{
  background-color: #ecf458;
}

.cbutton{
  padding: 2%;
}
.q-button{
  border: 1px solid #545177;
  padding: 5px 25px;
  font-size: 20px;
  font-weight: 800;
  border-radius: 100px;
  margin: 0 auto;
  background-color: white;
  transition-duration: 0.25s;
  cursor: pointer;
  display: block;
  width: 200px;
}
.q-button:hover{
  background-color: #ecf458;
}

.q-button.next{
  background-color: #545177 !important;
  color: white !important;
  display: none;
}
.q-button.next:hover{
  background-color: #ecf458 !important;
  color: #545177 !important;
}


.buttonarea{
  padding-top: 10px;
  max-width: 500px;
  margin: 0 auto;
  padding-bottom: 10px;
  display: flex;
}

.resultarea{
  padding-top: 10px;
  margin: 0 auto;
  padding-bottom: 10px;
  display: flex;
}
.resultarea h1{
  margin: 0 auto !important;
  font-size: 30px;
}
.resultarea h2{
  margin: 40px 0 5px;
}
.resultarea h2.level-1{
 color: #afafaf;
}
.resultarea h2.level-2{
 color: #e8d01b;
}
.resultarea h2.level-3{
 color: #266ee2;
}
.resultarea h2.level-4{
 color: #37c417;
}

.block-title{
  
  width: 100%;
}
.blocks p{
  padding-top: 0px;
  margin-top: 0px;
}
.blocks .col-lg-7{
padding-left: 20px;
}
.checks{
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50px !important;
  border: 3px solid #545177 !important;
  cursor: pointer;
  transition-duration: 0.25s;
  position: absolute;
  margin-left: 15px;
}
.checks:checked {
  background-color: #CB4317;
}
.questions{
  margin: 0% !important;
  padding: 20px 2% 2% !important;
}
.questions .row{
  border: 8px solid;
  padding: 1% !important;
}

.questions *{
  text-align: center;
}
.questions .resultarea *{
  text-align: left !important;
}
.question-title{
  font-size: 30px;
  text-align: center;
  margin: 0 auto;
}


footer .funded{
  max-width: 170px;
}
footer .foot-text{
  color: black !important;
  font-size: 15px !important;
  font-weight: 300;
}
footer .foot-title{
  padding-top: 0px !important;
  margin-top: 5px !important;
  padding-bottom: 10px;
  font-size: 16px !important;
  font-weight: 800;
  color: black;
}
footer .celda{
  padding: 2%;
}
.quest{
  display: none;
}
.quest.position1{
  display: block;
}


.questionbox input[type="radio"]{
  visibility: hidden;
  transition-duration: 0.25s;
}
.questionbox label{
  display: block;
  cursor: pointer;
  max-width: 350px;
  margin: 0 auto;
  transition-duration: 0.25s;
  background-color: white;
  border: 2px solid;
  padding: 5px;
  font-size: 20px;
}
.questionbox input[type="radio"]:checked+label{ 
  font-weight: bold;
  color: white;
} 



.questions.inclusion .row{
  border-color: #b1d474;
}
.inclusion .questionbox label{
border-color: #b1d474;
}
.inclusion .questionbox label:hover{
background-color: #d0e8a4;
}
.inclusion .questionbox input[type="radio"]:checked+label{
background-color: #b1d474;
}

.questions.voice .row{
  border-color: #14C9C0;
}
.voice .questionbox label{
border-color: #14C9C0;
}
.voice .questionbox label:hover{
background-color: #5fddd7;
}
.voice .questionbox input[type="radio"]:checked+label{
background-color: #14C9C0;
}

.questions.critical .row{
  border-color: #ECF458;
}
.critical .questionbox label{
border-color: #ECF458;
}
.critical .questionbox label:hover{
background-color: #f1f4b0;
}
.critical .questionbox input[type="radio"]:checked+label{
background-color: #ECF458;
color: #545177 !important;
}


.questions.recognition .row{
  border-color: #FF50B0;
}
.recognition .questionbox label{
border-color: #FF50B0;
}
.recognition .questionbox label:hover{
background-color: #f28ac1;
}
.recognition .questionbox input[type="radio"]:checked+label{
background-color: #FF50B0;
}


.questions.impact .row{
  border-color: #B68CF9;
}
.impact .questionbox label{
border-color: #B68CF9;
}
.impact .questionbox label:hover{
background-color: #d0bdef;
}
.impact .questionbox input[type="radio"]:checked+label{
background-color: #B68CF9;
}


.questions.global .row{
  border-color: #EE7B84;
  background-color: #fff9fa;
}
.questions.global h1, .questions.global p{
}
.questions.global .finallevel{
}
.resultpage .blocks .col-lg-7{
padding-left: 0px !important;
}




.topadvise{
  text-align: center;
}
.resultpage .accordion:hover, .resultpage .accordion.active{
background-color: #d0d1ec;
color: #565176 !important;
}
.resultpage .accordion:hover::after, .accordion.active::after{
color: #565176 !important;
}
.resultpage .panel{
  background-color: #d0d1ec !important;

}
.resultpage .accordion.active:hover{
color: #181264;
}


/*RES*/
.resultpage .inclusion .accordion{
  background-color: #B1D474 !important;
}
.resultpage .inclusion .accordion:hover, .resultpage .inclusion .accordion.active{
background-color: #e0edc9 !important;
}
.resultpage .inclusion .panel{
  background-color: #e0edc9 !important;

}

/*F RES*/

/*RES*/
.resultpage .voice .accordion{
  background-color: #14C9C0 !important;
}
.resultpage .voice .accordion:hover, .resultpage .voice .accordion.active{
background-color: #b9e5e1 !important;
}
.resultpage .voice .panel{
  background-color: #b9e5e1 !important;
}
/*F RES*/

/*RES*/
.resultpage .critical .accordion{
  background-color: #c6d30c !important;
}
.resultpage .critical .accordion:hover, .resultpage .critical .accordion.active{
background-color: #f0f4a6 !important;
}
.resultpage .critical .panel{
  background-color: #f0f4a6 !important;
}
/*F RES*/

/*RES*/
.resultpage .recognition .accordion{
  background-color: #FF50B0 !important;
}
.resultpage .recognition .accordion:hover, .resultpage .recognition .accordion.active{
background-color: #ffc4e3 !important;
}
.resultpage .recognition .panel{
  background-color: #ffc4e3 !important;
}
/*F RES*/

/*RES*/
.resultpage .impact .accordion{
  background-color: #b68cf9 !important;
}
.resultpage .impact .accordion:hover, .resultpage .impact .accordion.active{
background-color: #ddcdf7 !important;
}
.resultpage .impact .panel{
  background-color: #ddcdf7 !important;
}
/*F RES*/



.resultpage .panel p, .resultpage .panel ul *, .resultpage .panel h2, .resultpage .panel b
{
color: #565176 !important;
text-align: justify;
font-size: 18px;
}
/*.resultpage .panel p, .resultpage .panel ul *
{
font-weight: 100 !important;
}*/

.resultpage .panel{
  padding-right: 4%;
  padding-left: 4%;
}


.recommendationssection li{
  list-style-type: circle;
  padding-bottom: 25px;
  
}
.resultpage .panel h2{
  font-size: 18px;
  font-weight: 400 !important;
}
.resultpage .panel h2 a:hover b{
  color: #CB4317 !important;
}
.schools{
/*background-color: #32F201;
padding: 0px 4px;
color: black !important;
max-width: max-content;*/
text-align: left !important;
font-size: 22px;
}
.rec-icons{
  max-width: 110px;
  text-align: left !important;
}
.rec-icons.medal{
  max-width: 80px !important;
}
.resultpage .questions .recommendationssection{
text-align: left !important;
}
.recommendationssection *{
  text-align: left !important;
}
img.block-title{
  max-width: 340px !important;
}
.active + .panel{
  
}

@media (max-width: 968px) 
{
        .texttop{
          font-size: 44px;
        }
          header{
            text-align: center;
          }
          .row .texttop{
          padding-left: 0px !important;
          }
          p{
            font-size: 18px;
          }
          footer .celda{
            padding: 0px 0px 30px;
          }
          .question-title{
          font-size: 26px;
          text-align: center;
        }
        .buttonarea{
        display: block;
      }
      .resultarea{
        display: block;
      }
}
.guidebook{
border: 1px solid;
padding: 4px 12px;
text-decoration: none !important;
font-weight: 600;
transition-duration: 0.25s;
border-radius: 25px;
font-size: 18px;
}
.guidebook:hover{
background-color: #E84E94;
color: white;
}