/*
Calculator styles
*/

#adsar {
  /*background-color: #f6f3f9;*/
  padding: 80px 20px;
}

@media (max-width: 768px) {
  #adsar {
    margin-left: -15px;
    margin-right: -15px;
  }
}

#adsar .resultslinkblock {
  display: none;
}

#adsar .results {
  display: none;
}

#adsar .results > div {
  margin-bottom: 30px;
}

.select-wrapper select {
  background-color: transparent;
  padding: 11px 55px 15px 15px;
  position: relative;
  cursor: pointer;
  -webkit-transition: all 0.1s linear;
  display: block;
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 1.5;
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  box-sizing: border-box;
}

.select-wrapper select:focus {
  outline: none;
}

.select-wrapper {
  height: 47px;
  background-color: #ffffff;
  border-radius: 12px;
  display: inline-block;
  position: relative;
  z-index: 1;
  -webkit-transition: all 0.2s linear;
  width: 50%;
  overflow: hidden;
  border: 1px solid var(--purple-400);
}

@media (max-width: 767px) {
  .select-wrapper {
    height: 47px;
    background-color: #ffffff;
    border-radius: 4px;
    display: inline-block;
    position: relative;
    z-index: 2;
    -webkit-transition: all 0.2s linear;
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--purple-400);
  }
}

.select-wrapper:focus-within {
  border-color: var(--color-primary);
}

.select-wrapper.hidden {
  height: 0px;
}

.select-wrapper.selection-complete {
  background-color: #00aeef;
  box-shadow: inset 0 2px 0 0 #0083b3;
}

.select-wrapper:before,
.select-wrapper:after {
  z-index: -1;
  -webkit-transition: all 0.2s linear;
}

.select-wrapper:before {
  width: 60px;
  height: 50px;
  position: absolute;
  top: 0;
  right: 0;
  content: '';
  z-index: 10;
  background-color: #ffffff;
  pointer-events: none;
}

.select-wrapper:after {
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L7 5.58579L12.2929 0.292893C12.6834 -0.0976311 13.3166 -0.0976311 13.7071 0.292893C14.0976 0.683417 14.0976 1.31658 13.7071 1.70711L7.70711 7.70711C7.31658 8.09763 6.68342 8.09763 6.29289 7.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z' fill='%23291D4C'/%3E%3C/svg%3E%0A");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  position: absolute;
  top: 15px;
  right: 15px;
  height: 16px;
  width: 16px;
  z-index: 11;
  pointer-events: none;
}

.pseudo-select {
  background-color: transparent;
  padding: 16px 55px 15px 15px;
  position: relative;
  cursor: pointer;
  -webkit-transition: all 0.1s linear;
  display: block;
  margin: 0 0 10px;
  box-shadow: 0 2px 0 0 #d1d5d6;
  border: 0;
}

select.pseudo-select::-ms-expand {
  display: none;
}

/*
Heading styles
*/

#adsar h1,
#adsar h2.h1 {
  color: var(--article-headings-color);
  font-family: var(--heading-font-family);
  font-size: 32px;
  font-weight: bold;
  line-height: 40px;
  margin-bottom: 26px;
}

#adsar h3 {
  color: var(--article-headings-color);
  font-family: var(--heading-font-family);
  font-size: 22px;
  line-height: 32px;
  font-weight: normal;
  margin-top: 10px;
  font-weight: bold;
  margin-bottom: 10px;
}

#adsar h4 {
  font-size: 22px;
  line-height: 30px;
  color: var(--secondary-text-color);
  font-family: var(--heading-font-family);
}

#adsar .resultslinkblock h3 {
  color: var(--article-headings-color);
  font-family: var(--heading-font-family);
  font-size: 32px;
  font-weight: bold;
  line-height: 40px;
  margin-bottom: 26px;
}

/*
Button styles
*/

#adsar .btn-primary.link {
  display: inline-flex;
  align-items: center;
  margin: 15px auto;
  height: 40px;
  text-decoration: none;
  font-weight: bold;
  cursor: pointer;
  background-color: var(--lilac-300);
  border-color: var(--lilac-300);
  color: var(--color-primary) !important;
  font-size: 1rem;
  font-weight: 700;
  padding: 16px 60px 16px 16px;
  border-radius: 16px;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.2929 4.29289C11.6834 3.90237 12.3166 3.90237 12.7071 4.29289L19.7071 11.2929C20.0976 11.6834 20.0976 12.3166 19.7071 12.7071L12.7071 19.7071C12.3166 20.0976 11.6834 20.0976 11.2929 19.7071C10.9024 19.3166 10.9024 18.6834 11.2929 18.2929L16.5858 13L5 13C4.44772 13 4 12.5523 4 12C4 11.4477 4.44772 11 5 11L16.5858 11L11.2929 5.70711C10.9024 5.31658 10.9024 4.68342 11.2929 4.29289Z' fill='%23291d4c'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: calc(100% - 16px) center;
}
#adsar .btn-primary.link:hover {
  background-color: var(--lilac-400) !important;
  border-color: var(--lilac-400) !important;
  outline: 2px solid var(--lilac-400) !important;
}
#adsar .btn-primary.link:focus {
  background-color: var(--lilac-400) !important;
  border-color: var(--lilac-400) !important;
  outline: 2px solid #ffffff !important;
  box-shadow: 0 0 0 4px #2b173f !important;
}

#adsar .btn.link {
  display: inline-flex;
  align-items: center;
  margin: 15px auto;
  height: 40px;
  text-decoration: none;
  font-weight: bold;
  cursor: pointer;
  background-color: var(--lilac-300);
  border-color: var(--lilac-300);
  color: var(--color-primary) !important;
  font-size: 1rem;
  font-weight: 700;
  padding: 16px 60px 16px 16px;
  border-radius: 16px;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.2929 4.29289C11.6834 3.90237 12.3166 3.90237 12.7071 4.29289L19.7071 11.2929C20.0976 11.6834 20.0976 12.3166 19.7071 12.7071L12.7071 19.7071C12.3166 20.0976 11.6834 20.0976 11.2929 19.7071C10.9024 19.3166 10.9024 18.6834 11.2929 18.2929L16.5858 13L5 13C4.44772 13 4 12.5523 4 12C4 11.4477 4.44772 11 5 11L16.5858 11L11.2929 5.70711C10.9024 5.31658 10.9024 4.68342 11.2929 4.29289Z' fill='%23291d4c'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: calc(100% - 16px) center;
}
#adsar .btn.link:hover {
  background-color: var(--lilac-400) !important;
  border-color: var(--lilac-400) !important;
  outline: 2px solid var(--lilac-400) !important;
}
#adsar .btn.link:focus {
  background-color: var(--lilac-400) !important;
  border-color: var(--lilac-400) !important;
  outline: 2px solid #ffffff !important;
  box-shadow: 0 0 0 4px #2b173f !important;
}

#adsar .calculate .submit {
  display: inline-flex;
  align-items: center;
  margin: 15px auto;
  max-width: 250px;
  text-decoration: none;
  font-weight: bold;
  cursor: pointer;
  background-color: var(--cta-primary-background);
  border-color: var(--cta-primary-background);
  /*font-family: "MSM Primary", "Arial Black", sans-serif;*/
  color: #fff !important;
  font-size: 1rem;
  font-weight: 700;
  padding: 16px 82px 16px 16px;
  border-radius: 16px;
  position: relative;
}
#adsar .calculate .submit:after {
  display: block;
  content: '';
  background-color: red;
  width: 42px;
  height: 42px;
  border-radius: 4px;
  background-color: var(--lilac-200);
  top: calc(50% - 21px);
  right: 16px;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='23.999999999999996' xmlns='http://www.w3.org/2000/svg' fill='none'%3E%3Cg%3E%3Ctitle%3ELayer 1%3C/title%3E%3Cpath id='svg_1' fill='%23291D4C' d='m11.2929,4.29289c0.3905,-0.39052 1.0237,-0.39052 1.4142,0l7,7.00001c0.3905,0.3905 0.3905,1.0237 0,1.4142l-7,7c-0.3905,0.3905 -1.0237,0.3905 -1.4142,0c-0.3905,-0.3905 -0.3905,-1.0237 0,-1.4142l5.2929,-5.2929l-11.5858,0c-0.55228,0 -1,-0.4477 -1,-1c0,-0.5523 0.44772,-1 1,-1l11.5858,0l-5.2929,-5.29289c-0.3905,-0.39053 -0.3905,-1.02369 0,-1.41422z' clip-rule='evenodd' fill-rule='evenodd'/%3E%3Cpath id='svg_2' fill='%23291D4C' d='m47.52241,4.62076c0.3905,-0.39052 1.0237,-0.39052 1.4142,0l7,7.00001c0.3905,0.3905 0.3905,1.0237 0,1.4142l-7,7c-0.3905,0.3905 -1.0237,0.3905 -1.4142,0c-0.3905,-0.3905 -0.3905,-1.0237 0,-1.4142l5.2929,-5.2929l-11.5858,0c-0.55228,0 -1,-0.4477 -1,-1c0,-0.5523 0.44772,-1 1,-1l11.5858,0l-5.2929,-5.29289c-0.3905,-0.39053 -0.3905,-1.02369 0,-1.41422z' clip-rule='evenodd' fill-rule='evenodd'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 60px 24px;

  background-position: calc(100% - 10px) 9px;

  transition: background-position 300ms linear;

  position: absolute;
}
#adsar .calculate .submit:hover {
  background-color: var(--purple-500) !important;
  border-color: var(--purple-500) !important;
  outline: 2px solid var(--purple-500) !important;
}
#adsar .calculate .submit:hover:after {
  background-position: calc(100% + 27px) 9px;
}
#adsar .calculate .submit:focus {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  outline: 2px solid #ffffff !important;
  box-shadow: 0 0 0 4px #2b173f !important;
}

/*
Text styles
*/

#adsar .info {
  width: 19px;
  height: 19px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 3.25C7.02944 3.25 3 7.27944 3 12.25C3 17.2206 7.02944 21.25 12 21.25C16.9706 21.25 21 17.2206 21 12.25C21 7.27944 16.9706 3.25 12 3.25ZM1 12.25C1 6.17487 5.92487 1.25 12 1.25C18.0751 1.25 23 6.17487 23 12.25C23 18.3251 18.0751 23.25 12 23.25C5.92487 23.25 1 18.3251 1 12.25ZM11 8.25C11 7.69772 11.4477 7.25 12 7.25H12.01C12.5623 7.25 13.01 7.69772 13.01 8.25C13.01 8.80228 12.5623 9.25 12.01 9.25H12C11.4477 9.25 11 8.80228 11 8.25ZM12 11.25C12.5523 11.25 13 11.6977 13 12.25V16.25C13 16.8023 12.5523 17.25 12 17.25C11.4477 17.25 11 16.8023 11 16.25V12.25C11 11.6977 11.4477 11.25 12 11.25Z' fill='%235B5EBF'/%3E%3C/svg%3E%0A");
  background-size: cover;
  display: inline-block;
  margin-left: 6px;
  cursor: pointer;
}

#adsar .info:hover {
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 3.25C7.02944 3.25 3 7.27944 3 12.25C3 17.2206 7.02944 21.25 12 21.25C16.9706 21.25 21 17.2206 21 12.25C21 7.27944 16.9706 3.25 12 3.25ZM1 12.25C1 6.17487 5.92487 1.25 12 1.25C18.0751 1.25 23 6.17487 23 12.25C23 18.3251 18.0751 23.25 12 23.25C5.92487 23.25 1 18.3251 1 12.25ZM11 8.25C11 7.69772 11.4477 7.25 12 7.25H12.01C12.5623 7.25 13.01 7.69772 13.01 8.25C13.01 8.80228 12.5623 9.25 12.01 9.25H12C11.4477 9.25 11 8.80228 11 8.25ZM12 11.25C12.5523 11.25 13 11.6977 13 12.25V16.25C13 16.8023 12.5523 17.25 12 17.25C11.4477 17.25 11 16.8023 11 16.25V12.25C11 11.6977 11.4477 11.25 12 11.25Z' fill='%23291D4C'/%3E%3C/svg%3E%0A");
}

#adsar .info-block {
  display: none;
}

#adsar .resultslinkblock {
  padding-top: 35px;
  display: none;
}

#adsar .resultslinkblock .dotted {
  border-top: 1px dotted #8b8c8b;
  /* padding-top: 15px;
    padding-bottom: 15px;*/
  text-align: left;
}

#adsar .dotted {
  display: flex;
  align-items: center;
}

#adsar .dotted > div:first-child {
  flex: 1;
  padding-right: 20px;
}

#adsar .dotted h3 {
  font-family: var(--heading-font-family);
  color: var(--article-headings-color);
  font-size: 22px;
  line-height: 32px;
  font-weight: normal;
  margin-top: 10px;
  font-weight: bold;
  margin-bottom: 10px;
}

/*
Error messages
*/

#adsar .error {
  padding-top: 20px;
  margin-left: 0;
  margin-right: 0;
  display: none;
}
#adsar .form_error {
  position: relative;
  padding: 2px 20px 2px 60px;
  border-left: 5px solid var(--color-tint-negative);
  background-color: #fde8e9;
  margin-bottom: 20px;
}
#adsar .form_error p {
  padding: 0;
  color: var(--color-tint-negative);
}
#adsar .form_error strong {
  font-weight: bold;
}
#adsar .form_error .icon {
  width: 28px;
  height: 28px;
  display: block;
  position: absolute;
  top: 20px;
  left: 20px;
  border-radius: 14px;
  fill: none;
  background-color: rgba(255, 255, 255, 0);
  stroke: var(--color-tint-negative);
  color: white;
}
