@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap');

.gform_required_legend {
  display: none;
}

fieldset legend {
  border: none;
}

.gform_wrapper.gravity-theme.nwEval_wrapper input[type=color], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=date], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=datetime-local], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=datetime], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=email], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=month], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=number], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=password], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=search], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=tel], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=text], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=time], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=url], .gform_wrapper.gravity-theme.nwEval_wrapper input[type=week], .gform_wrapper.gravity-theme.nwEval_wrapper select, .gform_wrapper.gravity-theme.nwEval_wrapper textarea {
    border-color: #CECECE;
    color: #000000;
    font-weight: 400;
    background: #fff;
    padding: 0.625rem;
    margin: 0.25rem 0;
    border-width: 1px;
    border-style: solid;
    font-size: var(--body);
    color: #555;
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-appearance: none;
    border-radius: 0;
    line-height: normal;
    width: 100% !important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.gform_wrapper.gravity-theme.nwEval_wrapper input[type=color]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=date]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=datetime-local]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=datetime]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=email]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=month]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=number]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=password]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=search]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=tel]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=text]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=time]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=url]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper input[type=week]:focus, .gform_wrapper.gravity-theme.nwEval_wrapper select:focus, .gform_wrapper.gravity-theme.nwEval_wrapper textarea:focus {
  border-color: #CECECE;
  color: #000000;
}

.gform_wrapper.gravity-theme.nwEval_wrapper {
    max-width: 680px;
    width: 100%;
    margin: 0 auto;
    padding-top: 30px;
    padding-bottom: 30px;
    color: #000000;
    font-family: 'Montserrat', sans-serif;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .gform_fields {
  display: block;
  font-family: 'Montserrat', sans-serif;
  line-height: normal;
/* 	grid-row-gap: 30px; */
}

.gform_wrapper.gravity-theme.nwEval_wrapper .gfield {
  position: relative;
  margin-bottom: 16px;
  padding: 16px 16px 8px;
  border-radius: 4px;
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
  overflow: hidden;
}

@media (min-width: 768px) {
  .gform_wrapper.gravity-theme.nwEval_wrapper .gfield {
    margin-bottom: 24px;
    padding: 24px 24px 8px;
  }
}

.gform_wrapper.gravity-theme.nwEval_wrapper .gfield:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
}

.weight-lowest:before {
  background-color: #3DCFE3;
}

.weight-low:before {
  background-color: #7C98FE;
}

.weight-high:before {
  background-color: #CE67FF;
}

.weight-highest:before {
  background-color: #E33D41;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .gfield_label {
  float: left;
  width: 100%:
  /* position: absolute; */
  top: 16px;
  left: 0;
  width: 100%;
  /* padding: 0 16px; */
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 500;
  color: #000000;
}

@media (min-width: 768px) {
  /* .gform_wrapper.gravity-theme.nwEval_wrapper .gfield_label {
    top: 24px;
    padding: 0 24px;
  } */
}

.gform_wrapper.gravity-theme.nwEval_wrapper .ginput_container {
  float: left;
  width: 100%;
  margin-top: 12px;
  /* padding-top: 36px; */
}

@media (min-width: 768px) {
  .gform_wrapper.gravity-theme.nwEval_wrapper .ginput_container {
    margin-top: 16px;
  }
}

.nwEval .gfield_radio {
  position: relative;
}

.nwEval .gfield.nw_label_exp .gfield_radio:before,
.nwEval .gfield.nw_label_exp .gfield_radio:after,
.nwEval .gfield.nw_label_level .gfield_radio:before,
.nwEval .gfield.nw_label_level .gfield_radio:after {
  position: absolute;
  left: 60px;
  color: #999;
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.nwEval .gfield.nw_label_exp .gfield_radio:before,
.nwEval .gfield.nw_label_level .gfield_radio:before {
  top: 2px;
}

.nwEval .gfield.nw_label_exp .gfield_radio:after,
.nwEval .gfield.nw_label_level .gfield_radio:after {
  bottom: 0;
}

.nwEval .gfield.nw_label_exp .gfield_radio:before {
  content: 'No experience';
  
}

.nwEval .gfield.nw_label_exp .gfield_radio:after {
  content: 'Lots of experience';
  
}

.nwEval .gfield.nw_label_level .gfield_radio:before {
  content: 'Low';
}

.nwEval .gfield.nw_label_level .gfield_radio:after {
  content: 'High';
}

@media (min-width: 768px) {
  .nwEval .gfield.nw_label_exp .gfield_radio,
  .nwEval .gfield.nw_label_level .gfield_radio {
    padding-bottom: 23px;
  }

  .nwEval .gfield.nw_label_exp .gfield_radio:before,
  .nwEval .gfield.nw_label_exp .gfield_radio:after,
  .nwEval .gfield.nw_label_level .gfield_radio:before,
  .nwEval .gfield.nw_label_level .gfield_radio:after {
    top: auto;
    bottom: 18px;
  }

  .nwEval .gfield.nw_label_exp .gfield_radio:before,
  .nwEval .gfield.nw_label_level .gfield_radio:before {
    left: 8px;
  }

  .nwEval .gfield.nw_label_exp .gfield_radio:after,
  .nwEval .gfield.nw_label_level .gfield_radio:after {
    right: 8px;
    left: auto;
  }
}




.nwEval .gfield_checkbox {
  display: flex;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .nwEval .gfield_radio {
    display: inline-flex;
    width: auto;
  }

  .nwEval .gfield_checkbox {
    display: flex;
  }
}

/* .nwEval .gfield_radio {
  justify-content: space-between;
} */

.nwEval .gfield_radio .gchoice,
.nwEval .gfield_checkbox .gchoice {
  display: flex;
  flex-direction: column;
  position: relative;
  margin-bottom: 16px;
  min-width: 36px;
}

.nwEval .gfield_radio .gchoice {
  align-items: flex-start;
}

.nwEval .gfield_checkbox .gchoice {
  align-items: center;
  margin-right: 8px;
}

@media (min-width: 768px) {
  .nwEval .gfield_radio .gchoice,
  .nwEval .gfield_checkbox .gchoice {
    align-items: center;
    margin-bottom: 16px;
  }

  .nwEval .gfield_radio .gchoice {
    margin-right: 16px;
  }

  .nwEval .gfield_radio .gchoice:last-of-type {
    margin-right: 0;
  }
}

.nwEval .gfield_radio .gchoice input,
.nwEval .gfield_checkbox .gchoice input {
  display: none;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield-choice-input+label {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: none;
  cursor: pointer; 
  color: #000000;
  transition: all 0.3s ease;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_radio .gfield-choice-input+label {
  padding-left: 28px;
  font-size: 14px;
}

@media (min-width: 768px) {
  .gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_radio .gfield-choice-input+label {
    padding-left: 0;
    font-size: 12px;
  }
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_radio .gfield-choice-input+label:after {
  content: '';
  position: absolute;
  top: -2px;
  left: 0;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 35px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36' fill='none'%3E%3Cpath d='M18 26C15.8783 26 13.8434 25.1571 12.3431 23.6569C10.8429 22.1566 10 20.1217 10 18C10 15.8783 10.8429 13.8434 12.3431 12.3431C13.8434 10.8429 15.8783 10 18 10C20.1217 10 22.1566 10.8429 23.6569 12.3431C25.1571 13.8434 26 15.8783 26 18C26 20.1217 25.1571 22.1566 23.6569 23.6569C22.1566 25.1571 20.1217 26 18 26ZM18 8C16.6868 8 15.3864 8.25866 14.1732 8.7612C12.9599 9.26375 11.8575 10.0003 10.9289 10.9289C9.05357 12.8043 8 15.3478 8 18C8 20.6522 9.05357 23.1957 10.9289 25.0711C11.8575 25.9997 12.9599 26.7362 14.1732 27.2388C15.3864 27.7413 16.6868 28 18 28C20.6522 28 23.1957 26.9464 25.0711 25.0711C26.9464 23.1957 28 20.6522 28 18C28 16.6868 27.7413 15.3864 27.2388 14.1732C26.7362 12.9599 25.9997 11.8575 25.0711 10.9289C24.1425 10.0003 23.0401 9.26375 21.8268 8.7612C20.6136 8.25866 19.3132 8 18 8Z' fill='%23999999'/%3E%3C/svg%3E");
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_radio .gfield-choice-input:checked+label:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36' fill='none'%3E%3Cpath d='M18 26C15.8783 26 13.8434 25.1571 12.3431 23.6569C10.8429 22.1566 10 20.1217 10 18C10 15.8783 10.8429 13.8434 12.3431 12.3431C13.8434 10.8429 15.8783 10 18 10C20.1217 10 22.1566 10.8429 23.6569 12.3431C25.1571 13.8434 26 15.8783 26 18C26 20.1217 25.1571 22.1566 23.6569 23.6569C22.1566 25.1571 20.1217 26 18 26ZM18 8C16.6868 8 15.3864 8.25866 14.1732 8.7612C12.9599 9.26375 11.8575 10.0003 10.9289 10.9289C9.05357 12.8043 8 15.3478 8 18C8 20.6522 9.05357 23.1957 10.9289 25.0711C11.8575 25.9997 12.9599 26.7362 14.1732 27.2388C15.3864 27.7413 16.6868 28 18 28C20.6522 28 23.1957 26.9464 25.0711 25.0711C26.9464 23.1957 28 20.6522 28 18C28 16.6868 27.7413 15.3864 27.2388 14.1732C26.7362 12.9599 25.9997 11.8575 25.0711 10.9289C24.1425 10.0003 23.0401 9.26375 21.8268 8.7612C20.6136 8.25866 19.3132 8 18 8Z' fill='%23999999'/%3E%3Cpath d='M18 13C16.6739 13 15.4021 13.5268 14.4645 14.4645C13.5268 15.4021 13 16.6739 13 18C13 19.3261 13.5268 20.5979 14.4645 21.5355C15.4021 22.4732 16.6739 23 18 23C19.3261 23 20.5979 22.4732 21.5355 21.5355C22.4732 20.5979 23 19.3261 23 18C23 16.6739 22.4732 15.4021 21.5355 14.4645C20.5979 13.5268 19.3261 13 18 13Z' fill='%23E33D41'/%3E%3C/svg%3E");
}

@media (min-width: 768px) {
  .gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_radio .gfield-choice-input+label:after {
    margin-top: 7px;
    position: static;
  }
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_checkbox .gfield-choice-input+label {
  padding: 12px 16px;
  border-radius: 20px;
  border: 1px solid #999;
  background: #FFF;
  font-size: 14px;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_checkbox .gfield-choice-input+label:hover {
  border-color: rgba(227, 61, 65, 1);
  color: rgba(227, 61, 65, 1);
}

.gform_wrapper.gravity-theme.nwEval_wrapper .nwEval .gfield_checkbox .gfield-choice-input:checked+label {
  border-color: rgba(227, 61, 65, 1);
  background-color: rgba(227, 61, 65, 1);
  color: #ffffff;
}


/* Form Footer */
.gform_wrapper.gravity-theme.nwEval_wrapper .gform_footer {
  justify-content: center;
  margin-top: 40px;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .gform_footer .gform_button {
    width: 113px;
    min-height: 0 !important;
    padding: 13px 24px;
    border: 1px solid rgba(227, 61, 65, 1);
    border-radius: 2px;
    background: rgba(227, 61, 65, 1);
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    line-height: 1 !important;
    text-transform: uppercase;
}

.gform_wrapper.gravity-theme.nwEval_wrapper .gform_footer .gform_button:hover {
  background: rgba(195, 42, 45, 1);
  border: 1px solid rgba(195, 42, 45, 1);
  color: #fff;
}

@media (min-width: 768px) {
  .gform_wrapper.gravity-theme.nwEval_wrapper .gform_footer {
    margin-top: 48px;
  }
}


/* Form Result */
/* OLD Pie */
.nwResult {
  display: flex;
  justify-content: center;
}

.nwChart {
  width: 33%;
  justify-content: space-around ;
}

.nwCircularChart {
  display: block;
  margin: 10px auto;
  max-width: 80%;
  max-height: 250px;
}

.nwCircleBg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.nwCircle {
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}

.nwCircularChart.is-A .nwCircle {
  stroke: #77C747;
}

.nwCircularChart.is-B .nwCircle {
  stroke: #F5E620;
}

.nwCircularChart.is-C .nwCircle {
  stroke: #FF7800;
}

.nwCircularChart.is-C .nwCircle {
  stroke: #E31E26;
}

.nwPercentage {
  fill: #666;
  font-family: sans-serif;
  font-size: 0.5em;
  text-anchor: middle;
}

/* END: OLD Pie */

.confirmation-message {
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
  max-width: 680px;
  margin: 0 auto;
  border-radius: 4px;
  background: #FFF;
  border-top: 0;
  margin-top: 18px;
  margin-bottom: 64px;
  padding: 24px;
  text-align: center;
}

.confirmation-message h3 {
  margin-bottom: 16px;
  font-family: 'Montserrat', sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.48px;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .confirmation-message h3 {
    font-size: 32px;
    letter-spacing: 0.64px;
  }
}

/* NEW Pie */
@property --p{
  syntax: '<number>';
  inherits: true;
  initial-value: 0;
}

.pie {
  --p:20;
  --b:22px;
  --w:150px;
  
  width:var(--w);
  aspect-ratio:1;
  position:relative;
  display:inline-grid;
  margin:5px;
  place-content:center;
  font-size:25px;
  font-weight:bold;
  font-family:sans-serif;
}
.pie:before,
.pie:after {
  content:"";
  position:absolute;
  border-radius:50%;
}
.pie:before {
  inset:0;
}
.pie:after {
  inset:calc(50% - var(--b)/2);
  transform:rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
}


.result-status {
  width: 140px;
  margin: 24px auto 0;
  padding: 4px;
  border-radius: 4px;
  border: 1px solid #2BCC70;
  border-left: 4px solid #2BCC70;
  border-right: 4px solid #2BCC70;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.32px;
  text-transform: uppercase;
}

.pie.Pass:before {
  background:
    radial-gradient(farthest-side,#2BCC70 98%,#0000) top/var(--b) var(--b) no-repeat,
    conic-gradient(#2BCC70 calc((var(--p)*1%)/2), #2BCCC2 calc(var(--p)*1%), #ffffff 0);

  /* background:
    radial-gradient(farthest-side,#2BCC70 98%,#0000) top/var(--b) var(--b) no-repeat,
    conic-gradient(#2BCC70 calc(var(--p)*1%),#0000 0); */
  -webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
          mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}
.pie.Pass:after {
  background:#2BCCC2;
}

.pie.Fail:before {
  background:
    radial-gradient(farthest-side,#e74c3c 98%,#0000) top/var(--b) var(--b) no-repeat,
    conic-gradient(#e74c3c calc((var(--p)*1%)/2), #c32a2d calc(var(--p)*1%), #ffffff 0);
  /* background:
    radial-gradient(farthest-side,#e74c3c 98%,#0000) top/var(--b) var(--b) no-repeat,
    conic-gradient(#e74c3c calc(var(--p)*1%),#0000 0); */
  -webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
          mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}
.pie.Fail:after {
  background:#c32a2d;
}

.result-status.Fail {
  border-color: #e74c3c;
}

.animate {
  animation:p 1s .5s both;
}
.no-round:before {
  background-size:0 0,auto;
}
.no-round:after {
  content:none;
}
@keyframes p {
  from{--p:0}
}
/* END: NEW Pie */


.grader-banner-container {
  padding-top: 40px;
  padding-bottom: 32px;
  border-bottom: 1px solid #000;
}

@media (min-width: 768px) {
  .grader-banner-container {
    width: 100%;
    max-width: none;
    padding-top: 48px;
    padding-bottom: 40px;
  }
}

.grader-banner {
  position: relative;
  max-width: 680px;
  width: 100%;
  margin: 0 auto;
  font-family: 'Montserrat', sans-serif;
}

.grader-banner img {
  position: absolute;
  top: 60px;
  right: 0;
  display: block;
  max-width: 68px;
  width: 100%;
  height: auto;
}

@media (min-width: 768px) {
  .grader-banner img {
    max-width: 112px;
    top: 0;
  }
}

.grader-banner h1 {
  margin-bottom: 24px;
  font-family: 'Montserrat', sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.64px;
  color: #333;
}

@media (min-width: 768px) {
  .grader-banner h1 {
    font-size: 40px;
    letter-spacing: -0.8px;
  }

  .grader-main-content {
    display: flex;
  }
}

.grader-banner ul {
    display: inline-block;
    position: relative;
    padding-bottom: 18px;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    list-style-type: none;
}

.grader-banner ul:before,
.grader-banner ul:after {
  position: absolute;
  bottom: 0;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  color: #999;
}

.grader-banner ul:before {
  content: 'highest';
  right: 20px;
}

.grader-banner ul:after {
  content: 'lowest';
  left: 0;
}

.grader-banner ul li {
  position: relative;
  display: inline-block;
  margin-right: 18px;
  padding-left: 20px;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  color: #333;
}

.grader-banner ul li span {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
}

@media (min-width: 768px) {
  .grader-banner ul {
    display: block;
    padding-left: 24px;
    padding-bottom: 22px;
  }

  .grader-banner ul:after {
    left: 20px;
  }

  .grader-banner ul li {
    margin-right: 22px;
  }
}