/* Add your custom CSS below */
@import url("https://fonts.googleapis.com/css?family=Montserrat:300,400,500,700");
* {
  box-sizing: border-box;
  margin: 0;
  font-family: "Montserrat", sans-serif !important;
}

body {
  background: rgb(237, 241, 243) !important;
  padding: min(2rem, 5vw);
  --grey-lightest: #f3f4f6;
  --grey-lighter: #e4e9eb;
  --grey-light: #cbd4d8;
  --grey-medium: #b3b9c8;
  --grey-dark: #919fa9;
  --grey-darker: #7d8a91;
}

.mktoForm {
  padding: 0 !important;
  width: 100% !important;
}
.mktoField {
  float: unset !important;
}
.mktoClear {
  display: none;
}
.mktoForm .mktoLabel {
  display: block !important;
  color: #1a1a1a !important;
  font-size: 1rem !important;
  padding-bottom: 0.325rem !important;
  padding-top: 0rem !important;
  width: 100% !important;
}

.mktoForm .mktoFormRow:not(:has(input[type="hidden"])) {
  margin-bottom: 0.8rem;
}

.mktoHtmlText.mktoHasWidth {
  width: 100% !important;
}

.mktoForm input[type="text"],
.mktoForm input[type="url"],
.mktoForm input[type="email"],
.mktoForm input[type="tel"],
.mktoForm input[type="number"],
.mktoForm input[type="date"],
.mktoForm textarea.mktoField,
.mktoForm select.mktoField {
  width: 100% !important;
  height: auto !important;
  transition: all var(--speed-fast) ease-out !important;
  border: 1px solid var(--grey-light) !important;
  color: #202020 !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  padding: 0.5rem !important;
  margin: 0 !important;
  outline: none !important;
  border-radius: 0.25ch !important;
  background-color: var(--blue-bg) !important;
  line-height: 1.2 !important;
}
.mktoForm input[type="text"]:focus,
.mktoForm input[type="url"]:focus,
.mktoForm input[type="email"]:focus,
.mktoForm input[type="tel"]:focus,
.mktoForm input[type="number"]:focus,
.mktoForm input[type="date"]:focus,
.mktoForm textarea.mktoField:focus,
.mktoForm select.mktoField:focus {
  outline: none !important;
  border-color: #22517b !important;
}
.mktoForm input[type="text"]:hover,
.mktoForm input[type="url"]:hover,
.mktoForm input[type="email"]:hover,
.mktoForm input[type="tel"]:hover,
.mktoForm input[type="number"]:hover,
.mktoForm input[type="date"]:hover,
.mktoForm textarea.mktoField:hover,
.mktoForm select.mktoField:hover {
  outline: none !important;
  border-color: #919fa9 !important;
}
.mktoFormCol,
.mktoFieldWrap {
  width: 100% !important;
}
.mktoFieldWrap {
  /* --blue-bg: #d2dee6; */
  --blue-bg: rgb(231 236 238);
  &:not(:has([for="partnerContentTechnologyInterests"])) {
    border: 1px solid var(--grey-light) !important;
    padding: 1ch !important;
    background: white !important;
    border-radius: 0.5ch;
  }
}
.mktoForm .mktoRequiredField label.mktoLabel {
  font-weight: normal !important;
}
.mktoButtonWrap {
  margin-left: 0 !important;
}
.mktoButtonRow {
  width: 100% !important;
}
@media screen and (prefers-reduced-motion: no-preference) {
  :root {
    --speed-gradual: 3s;
    --speed-snail: 1s;
    --speed-slower: 0.75s;
    --speed-slow: 0.5s;
    --speed-standard: 0.25s;
    --speed-fast: 0.1s;
  }
}
.mktoForm .mktoButtonWrap.mktoSimple .mktoButton {
  border: none !important;
}
.mktoButton {
  display: inline-block;
  position: relative;
  --text-white: white;
  --bg-main-hover: transparent;
  --gradient-light: #3396bc;
  --gradient-dark: #172b49;
  --theme-gradient: linear-gradient(15deg, var(--gradient-dark) 0%, var(--gradient-light) 100%);
  --gradient-border: linear-gradient(var(--bg-main-hover), var(--bg-main-hover)) padding-box,
    var(--theme-gradient) border-box;
  background: var(--gradient-border) !important;
  border: var(--border-width-button) solid transparent !important;
  border-radius: 100vmax;
  color: white;
  font-weight: 500;
  padding: 0.75rem 1.5rem !important;
  appearance: none;
  text-decoration: none;
  text-transform: none;
  user-select: none;
  touch-action: manipulation;
  cursor: pointer;
  word-break: keep-all;
  z-index: 0;
  --transition-out-quadratic: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all var(--speed-slow) var(--transition-out-quadratic);

  outline-color: rgb(0 0 0);
  text-shadow: 0rem 0rem 1rem rgb(0 0 0 / 0.5), 0rem 0rem 0.25rem rgb(0 0 0 / 0.5);

  filter: brightness(1.4);

  &:hover:not(:disabled) {
    scale: 1.025;
    filter: brightness(1.2);
  }

  &:active:not(:disabled) {
    box-shadow: 0 0 1rem rgb(255 255 255 / 0.2);
  }
}
span.mktoButtonWrap.mktoSimple {
  display: contents !important;
}

.mktoForm .mktoCheckboxList > input {
  border: 1px solid var(--grey-light) !important;
  width: 1.5em !important;
  height: 1.5em !important;
  background: #fff !important;
  border-radius: 0.5ch !important;
  box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%) !important;
}
.mktoForm .mktoCheckboxList > label:hover .mktoForm .mktoCheckboxList > input[type="checkbox"] {
  border: 2px solid #3496bd !important;
}
.mktoForm .mktoRadioList,
.mktoForm .mktoCheckboxList {
  float: unset !important;
  /* border: 1px solid var(--grey-light) !important;
  border-radius: 0.325rem !important;
  background-color: white !important;
  padding: 10.5rem 0.5rem 4px 0.5rem !important; */
  margin-top: 0.325rem !important;
  margin-bottom: 0.325rem !important;
  width: 100% !important;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18ch, 1fr));
  & input[type="checkbox"] {
    display: contents;
  }
}
.mktoForm .mktoRadioList > label,
.mktoForm .mktoCheckboxList > label {
  position: relative !important;
  margin-left: 2.4em !important;
  margin-top: 0.1em;
  margin-bottom: 1em !important;
  line-height: 1.2em;
  display: block;
  min-height: 12px;
  cursor: pointer !important;
}

[type="checkbox"] + label::after {
  content: "" !important;
}

.mktoCheckboxList input:checked + label:before {
  content: "✔" !important;
  position: absolute !important;
  left: -1.9rem !important;
  top: -0.2rem !important;
  line-height: 0.8 !important;
  color: #00a082 !important;
  transition: all var(--speed-fast) !important;
  font-size: 1em !important;
  text-align: end !important;
}

.mktoCheckboxList input + label:before {
  content: "" !important;
  position: absolute !important;
  left: -1.9rem !important;
  top: -0.2rem !important;
  width: 1.35em !important;
  height: 1.35em !important;
  border: 1px solid var(--grey-light) !important;
  background: #fff !important;
  border-radius: 0.5ch !important;
  box-shadow: inset 0 1px 3px rgb(0 0 0 / 10%) !important;
  font-size: 1em !important;
}

.mktoForm input[type="checkbox"]:hover + label:before {
  border: 1px solid #3496bd !important;
}

.mktoForm input[type="checkbox"]:focus + label:before {
  border: 1px dotted #3496bd !important;
}

.mktoForm .mktoCheckboxList > input {
  height: 0rem !important;
}
/* .mktoForm .mktoRequiredField .mktoAsterix {
  display: none !important;
} */

/* Animation */

.mktoForm .mktoError .mktoErrorMsg {
  display: block;
  margin-top: 0.5rem;
  background-color: #9b1d1d;
  background-image: linear-gradient(#9b1d1d 43%, #ba1600 100%);
  border: 1px solid #9f1300;
  border-radius: 0.5rem;
  box-shadow: rgba(0, 0, 0, 0.65) 0 2px 7px, inset #ff3c3c 0 1px 0rem;
  color: #f3f3f3;
  font-size: 1em;
  line-height: 1.2em;
  max-width: 16em;
  padding: 0.4em 0.6em;
  text-shadow: #901100 0 -1px 0;
  animation: alternate-reverse;
  animation: bounce calc(2 * var(--speed-snail)) infinite;
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  60% {
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
  }
}

/* Required field error msg start */

.mktoForm .mktoError {
  position: relative !important;
  color: #bf0000 !important;
  left: 0rem !important;
  width: 100% !important;
  bottom: unset !important;
}

.mktoForm .mktoError .mktoErrorArrowWrap {
  display: none !important;
}

.mktoForm .mktoError .mktoErrorMsg {
  background-color: transparent !important;
  background-image: none !important;
  border: 0rem !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-size: 14px !important;
  color: darkred !important;
}

/* Required field error msg end */