/*! CSS - https://gist.github.com/rbfonbuena/08282e89769bd7624fc6de32b3bdef02 */
:root{
    --animate-duration: 1s;
    --animate-delay: 1s;
    --animate-repeat: 1;
    --ycm-blue: #377DFF;
    --ycm-teal: #00C9A7;
    --ycm-yellow: #FEC55E;
    --ycm-orange: #EA6C01;
    --ycm-red: #DE4437
}
html,body{
    min-width:320px;
    height:100%;
    font-family:"Poppins",sans-serif;
    font-weight:400;
    font-size:16px;
    line-height:normal
}
.animated,.animate__animated{
    animation-duration:var(--animate-duration);
    animation-fill-mode:both
}
.bounceIn,.animate__bounceIn{
    animation-duration:calc(var(--animate-duration)*.75);
    animation-name:bounceIn
}
.zoomIn,.animate__zoomIn{
    animation-name:zoomIn
}
@media(max-width: 991.98px){
    .lead{
        font-size:1rem;
        line-height:1.2
    }
}
.font-size-18{
    font-size:18px
}
.page-wrap{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    min-height:100%
}
.page-wrap header,footer{
    flex-shrink:0
}
.page-wrap .main{
    flex-grow:1
}
@media(min-width: 420px){
    .navbar-brand img{
        width:160px;
        height:auto
    }
}
.expert-avatar{
    position:relative;
    margin-top:-32px;
    margin-bottom:1rem;
    padding:0;
    text-align:center;
    z-index:10
}
.expert-avatar img{
    width:54px;
    height:54px;
    margin-bottom:.5rem;
    border-radius:100%;
    object-fit:cover;
    object-position:center;
    transition:all 200ms ease-in-out
}
.expert-avatar .avatar-text{
    margin-left:.875rem;
    font-size:14px;
    line-height:1.2
}
@media(min-width: 576px){
    .expert-avatar{
        margin-top:-40px;
        margin-bottom:2rem
    }
    .expert-avatar img{
        width:72px;
        height:72px
    }
    .expert-avatar .avatar-text{
        font-size:1.125rem
    }
}
.experts-note{
    display:flex;
    justify-content:center
}
.experts-note .avatar{
    --animate-duration: 0.25s;
    flex:0 0 calc(48px + .75rem);
    animation-duration:var(--animate-duration, 0.25s);
    transform:translate3d(0, 0, 0);
    backface-visibility:hidden
}
.experts-note .avatar img{
    width:48px;
    height:48px;
    margin-right:.75rem;
    border:1px solid #e9ecef;
    border-radius:60%;
    object-fit:cover
}
.experts-note .note{
    position:relative;
    padding:1rem 1.5rem;
    line-height:1.2;
    background-color:#f1f3f5;
    border-radius:20px
}
.experts-note .note::before{
    content:"";
    position:absolute;
    top:16px;
    left:-8px;
    border-style:solid;
    border-width:.5rem .5rem .5rem 0;
    border-color:#f1f3f5;
    border-left-color:rgba(0,0,0,0);
    border-top-color:rgba(0,0,0,0);
    border-bottom-color:rgba(0,0,0,0)
}
.survey-header{
    margin-bottom:1rem;
    border-bottom:1px solid #dee2e6
}
.question{
    font-weight:300;
    line-height:1.2
}
@media(max-width: 575.98px){
    .question{
        font-size:20px
    }
}
.survey-content{
    max-width:922px;
    margin:auto;
    text-align:center
}
.row.gutter-sm{
    margin-left:-0.5rem;
    margin-right:-0.5rem
}
.row.gutter-sm>[class^=col-]{
    padding-left:.5rem;
    padding-right:.5rem;
    margin-bottom:.5rem
}
.custom-radio-button{
    position:relative;
    width:100%;
    margin-bottom:0;
    padding:.5rem 1rem;
    background-color:#fff;
    border:1px solid #dee2e6;
    border-radius:.3rem;
    box-shadow:0 2px 12px rgba(0,0,0,.065);
    cursor:pointer;
    transition:all 200ms ease-in-out
}
.custom-radio-button:not(.disabled):hover{
    background-color:rgba(0,123,255,.05);
    border-color:rgba(0,123,255,.15);
    box-shadow:0 12px 24px rgba(0,0,0,.08);
    transform:translate3d(0, 0, 0) scale3d(1.05, 1.05, 1) rotate(0deg);
    transform-style:preserve-3d;
    z-index:10
}
.custom-radio-button:not(.disabled):hover .label-text{
    color:#007bff
}
.custom-radio-button.is-checked,.custom-radio-button.is-checked:hover{
    background-color:rgba(0,123,255,.125);
    border-color:#007bff
}
.custom-radio-button.is-checked .label-text,.custom-radio-button.is-checked:hover .label-text{
    color:#007bff
}
@media(min-width: 576px){
    .custom-radio-button{
        padding:1rem
    }
}
.custom-radio-button input[type=radio],.custom-radio-button input[type=checkbox]{
    position:absolute;
    top:0;
    left:0;
    visibility:hidden
}
.custom-radio-button .label{
    display:flex;
    padding:0;
    align-items:center;
    min-height:46px
}
.custom-radio-button .label-image{
    flex:0 0 42px;
    margin:0
}
@media(min-width: 576px){
    .custom-radio-button .label-image{
        flex:0 0 64px
    }
}
.custom-radio-button .marker+.label-image{
    margin-left:.75rem
}
.custom-radio-button .label-image>img,.custom-radio-button .label-image>svg{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:96px;
    margin:auto
}
.custom-radio-button .label-image>svg{
    width:100%;
    height:auto
}
.custom-radio-button .label-text{
    line-height:1.125
}
.custom-radio-button:not(.button-inline).is-checked input[type=checkbox]+.label::before,
.custom-radio-button.is-checked input[type=checkbox]+.label>figure::before {
    content:url("data:image/svg+xml,%3csvg width='20' height='20' viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' clip-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'%3e%3cpath d='M64 2.625C30.156 2.625 2.625 30.156 2.625 64S30.156 125.375 64 125.375 125.375 97.844 125.375 64 97.844 2.625 64 2.625zm31.107 48.369L61.862 84.238a5.102 5.102 0 01-3.616 1.499 5.104 5.104 0 01-3.616-1.499L38.008 67.616c-2-2-2-5.232 0-7.232s5.231-2 7.232 0L58.246 73.39l29.629-29.628c2-2 5.232-2 7.232 0s2 5.231 0 7.232z' fill='%23007bff' fill-rule='nonzero'/%3e%3c/svg%3e");
    display:block;
    width:20px;
    height:20px;
    position:absolute;
    top:.5rem;
    right:.5rem;
    animation:bounceIn 500ms;
    animation-fill-mode:both;
    backface-visibility:hidden;
    transform:translate3d(0, 0, 0)
}
.custom-radio-button:not(.disabled).button-blue .label-image img,.custom-radio-button:not(.disabled).button-yellow .label-image img,.custom-radio-button:not(.disabled).button-red .label-image img,.custom-radio-button:not(.disabled).button-teal .label-image img,.custom-radio-button:not(.disabled).button-orange .label-image img{
    object-position:0 .4rem
}
.custom-radio-button:not(.disabled):hover.button-blue{
    background-color:rgba(55,125,255,.05);
    border-color:rgba(55,125,255,.15)
}
.custom-radio-button:not(.disabled):hover.button-blue .label-text{
    color:#377dff
}
.custom-radio-button:not(.disabled):hover.button-yellow{
    background-color:rgba(254,197,94,.05);
    border-color:rgba(254,197,94,.15)
}
.custom-radio-button:not(.disabled):hover.button-yellow .label-text{
    color:#fec55e
}
.custom-radio-button:not(.disabled):hover.button-red{
    background-color:rgba(222,68,55,.05);
    border-color:rgba(222,68,55,.15)
}
.custom-radio-button:not(.disabled):hover.button-red .label-text{
    color:#de4437
}
.custom-radio-button:not(.disabled):hover.button-teal{
    background-color:rgba(0,201,167,.05);
    border-color:rgba(0,201,167,.15)
}
.custom-radio-button:not(.disabled):hover.button-teal .label-text{
    color:#00c9a7
}
.custom-radio-button:not(.disabled):hover.button-orange{
    background-color:rgba(234,108,1,.05);
    border-color:rgba(234,108,1,.15)
}
.custom-radio-button:not(.disabled):hover.button-orange .label-text{
    color:#ea6c01
}
.custom-radio-button:not(.disabled).is-checked.button-yellow{
    background-color:rgba(254,197,94,.125);
    border-color:#fec55e
}
.custom-radio-button:not(.disabled).is-checked.button-yellow .label-text{
    color:#fec55e
}
.custom-radio-button:not(.disabled).is-checked.button-red{
    background-color:rgba(222,68,55,.125);
    border-color:#de4437
}
.custom-radio-button:not(.disabled).is-checked.button-red .label-text{
    color:#de4437
}
.custom-radio-button:not(.disabled).is-checked.button-teal{
    background-color:rgba(0,201,167,.125);
    border-color:#00c9a7
}
.custom-radio-button:not(.disabled).is-checked.button-teal .label-text{
    color:#00c9a7
}
.custom-radio-button:not(.disabled).is-checked.button-orange{
    background-color:rgba(234,108,1,.125);
    border-color:#ea6c01
}
.custom-radio-button:not(.disabled).is-checked.button-orange .label-text{
    color:#ea6c01
}
.custom-radio-button.disabled{
    box-shadow:none;
    opacity:.65
}
.custom-radio-button:not(.button-inline){
    height:100%
}
@media(min-width: 768px){
    .custom-radio-button:not(.button-inline) .label{
        display:flex;
        flex-direction:column;
        justify-content:space-evenly;
        height:100%
    }
}
@media(min-width: 768px){
    .custom-radio-button:not(.button-inline) .label-image{
        margin:0 auto 1.5rem
    }
}
.custom-radio-button:not(.button-inline) .label-image img,.custom-radio-button:not(.button-inline) .label-image svg{
    max-height:120px
}
.custom-radio-button .label-text{
    text-align:left
}
.custom-radio-button .label-text div:first-child,.custom-radio-button .label-text .h5{
    margin-bottom:0
}
.custom-radio-button .label-text p:last-child{
    margin-bottom:0
}
.custom-radio-button.button-inline .label-text{
    margin:auto;
    text-align:center
}
.custom-radio-button.button-inline .marker+.label-text,.custom-radio-button.button-inline figure+.label-text{
    margin-left:1rem;
    text-align:left
}
.custom-radio-button.button-inline .marker+figure{
    margin-left:.75rem
}
.custom-radio-button:not(.button-inline) .label-text{
    margin-left:1rem
}
@media(min-width: 768px){
    .custom-radio-button:not(.button-inline) .label-text{
        margin-left:0;
        text-align:center
    }
}
.custom-radio-button .marker{
    position:relative;
    flex:0 0 24px;
    width:24px;
    height:24px;
    border:1px solid #ced4da;
    border-radius:.3rem
}
.custom-radio-button input[type=radio]+.label>.marker{
    border-radius:60%
}
.custom-radio-button.is-checked .marker{
    background-color:#007bff;
    border-color:#007bff;
    text-align:center
}
.custom-radio-button.is-checked .marker::before{
    content:"✓";
    position:absolute;
    top:-2px;
    left:1px;
    width:20px;
    height:20px;
    color:#fff;
    font-family:"Inter",sans-serif !important;
    font-size:18px;
    font-weight:900
}
button:not(:disabled):focus{
    outline:none
}
.survey-content button:not(:disabled):not(.dropdown-toggle){
    position:relative;
    display:inline-block;
    margin:auto;
    font-weight:600;
    transition:all 150ms ease-in-out
}
.survey-content button:not(:disabled).btn{
    min-width:100%
}
.survey-content button:not(:disabled).btn:hover:not(:active):not(.dropdown-toggle),.survey-content button:not(:disabled).btn:hover:not(:active):not(.dropdown-toggle):focus{
    transform:translateY(-2px);
    box-shadow:0 8px 16px rgba(0,0,0,.125)
}
.survey-content button:not(:disabled).btn:active:not(.dropdown-toggle){
    transform:translateY(0);
    box-shadow:none
}
@media(min-width: 576px){
    .survey-content button:not(:disabled).btn{
        min-width:30%
    }
}
@media(min-width: 992px){
    .survey-content button:not(:disabled).btn{
        min-width:20%
    }
}
footer{
    color:#868e96;
    margin-top:2rem;
    padding-top:1rem;
    padding-bottom:1rem;
    text-align:center;
    box-shadow:-6px 0 4px rgba(0,0,0,.125)
}
footer a{
    display:inline-block;
    color:#868e96
}
footer a:hover{
    color:inherit
}
footer .footer-links a{
    margin:0 0 .875rem
}
footer .footer-links>span{
    display:inline;
    opacity:.25;
    padding:0 .125rem
}
@media(min-width: 768px){
    footer .footer-links>span{
        padding:0 .5rem
    }
}
.form-group label{
    font-size:14px;
    font-weight:800 !important
}
input[type=text],input[type=email],input[type=tel],select,textarea{
    font-family:sans-serif
}
.custom-textarea{
    border:1px solid #adb5bd;
    border-radius:.3rem
}
.custom-textarea textarea{
    font-size:18px;
    border:0
}
.custom-textarea textarea:focus{
    box-shadow:none !important;
    background-color:#f8f9fa
}
.custom-textarea .textarea-placeholder{
    color:#868e96;
    font-size:14px;
    padding:.5rem .75rem
}
::placeholder{
    color:#adb5bd !important;
    font-family:sans-serif
}
.parsley-errors-list{
    margin-top:.25rem;
    padding-left:0;
    list-style-type:none;
    font-size:14px;
    font-family:sans-serif
}
.parsley-errors-list li{
    color:var(--danger)
}
@keyframes bounceIn{
    from,20%,40%,60%,80%,to{
        animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0%{
        opacity:0;
        transform:scale3d(0.3, 0.3, 0.3)
    }
    20%{
        transform:scale3d(1.1, 1.1, 1.1)
    }
    40%{
        transform:scale3d(0.9, 0.9, 0.9)
    }
    60%{
        opacity:1;
        transform:scale3d(1.03, 1.03, 1.03)
    }
    80%{
        transform:scale3d(0.97, 0.97, 0.97)
    }
    to{
        opacity:1;
        transform:scale3d(1, 1, 1)
    }
}
@keyframes zoomIn{
    from{
        opacity:0;
        transform:scale3d(0.3, 0.3, 0.3)
    }
    50%{
        opacity:1
    }
}
 
b,strong {
    font-weight: 700;
}

/* BS4 to BS5 fixes */
body {
    font-weight: normal; /* fix bold font-weight and <strong> and <b> tags not working */
}
.parsley-errors-list li {
    --danger: var(--bs-form-invalid-color, #dc3545);
}
input[type="text"].parsley-error,
input[type="email"].parsley-error,
input[type="tel"].parsley-error,
textarea.parsley-error,
select.parsley-error {
    border-color: var(--bs-form-invalid-color, #dc3545);
}
input[type="text"].parsley-success,
input[type="email"].parsley-success,
input[type="tel"].parsley-success {
    border-color: var(--bs-form-valid-color);
}

/* BS4 to BS5 shims */
.bs5 .font-weight-bold {
    font-weight: bolder;
}
.bs5 .text-left {
    text-align: left !important;
}
.bs5 .text-right {
    text-align: right !important;
}
.bs5 .form-group {
    margin-bottom: 1rem;
}
.bs5 .mr-1 {
    margin-right: 0.25rem;
}
.bs5 .float-left {
    float: left !important;
}
.bs5 .float-right {
    float: right !important;
}
.bs5 .modal .btn-close > span {
    display: none;
}
.bs5 .sr-only {
 border:0;
 clip:rect(0,0,0,0);
 height:1px;
 margin:-1px;
 overflow:hidden;
 padding:0;
 position:absolute;
 width:1px
}
.bs5 .sr-only-focusable:active,
.bs5 .sr-only-focusable:focus {
 clip:auto;
 height:auto;
 margin:0;
 overflow:visible;
 position:static;
 width:auto
}


/* Helpers */
.top-line, 
.topline {
    display: block;
    font-size: 0.65em;
    font-weight: 700;
    line-height: 1.2;
}
.top-line + br,
.topline + br {
    display: none;
}
option:disabled,
option[disabled] {
    color: #ccc;
}
.text-reset {
    color: inherit !important;
}

/* max-width classes */
.mw-768 {
    max-width: 768px !important;
}
.mw-992 {
    max-width: 992px !important;
}
.mw-1140 {
    max-width: 1140px !important;
}

/* Overrides */
.survey-header .question {
    font-size: clamp(1.25rem, 4vw, 2rem);
    line-height: 1.125;
}
@media (max-width: 419px) {
    #possibly-svg-logo,
    header .navbar-brand svg,
    header .navbar-brand img {
        max-width: 120px;
    }
}
label.font-weight-bold > small {
    font-family: sans-serif;
    font-weight: 400;
}

/* Fix a11y issues */
footer, footer a, footer .footer-links > span {
    color: inherit;
    opacity: 1;
}
.custom-radio-button:focus,
.custom-radio-button.is-focused {
    border-color: transparent;
    outline: none;
    box-shadow: 0 0 0 3px hsla(211,100%,50%,0.5);
}
button:not(:disabled):focus,
:focus {
    outline: 3px solid hsla(211,100%,50%,0.5);
}
:focus:not(:focus-visible):not(button) {
    outline: 3px solid transparent !important;
}
@media (prefers-reduced-motion: no-preference) {
    :focus-visible {
        outline-offset: 3px;
        transition: outline-offset 0.15s linear;
    }
}

/* Anouncement/Hero bar */
.announcement-bar {
    padding: 0.5rem;
    font-size: 14px;
    font-size: clamp(0.75em, 2vw, 0.875em);
    font-weight: 600;
    line-height: 1.2;
}
.announcement-bar span {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}

/* Admin bar */
.adminbar {
    z-index: 999 !important;
}

.input-group .btn.dropdown-toggle {
    border-color: var(--bs-border-color);
}

/* Inline button checkmark */
.custom-radio-button.button-inline-checkbox.is-checked input[type="checkbox"]  + .label::before {
  content: url("data:image/svg+xml,%3csvg width='20' height='20' viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' clip-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'%3e%3cpath d='M64 2.625C30.156 2.625 2.625 30.156 2.625 64S30.156 125.375 64 125.375 125.375 97.844 125.375 64 97.844 2.625 64 2.625zm31.107 48.369L61.862 84.238a5.102 5.102 0 01-3.616 1.499 5.104 5.104 0 01-3.616-1.499L38.008 67.616c-2-2-2-5.232 0-7.232s5.231-2 7.232 0L58.246 73.39l29.629-29.628c2-2 5.232-2 7.232 0s2 5.231 0 7.232z' fill='%23007bff' fill-rule='nonzero'/%3e%3c/svg%3e");
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  animation: bounceIn 500ms;
  animation-fill-mode: both;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
}

/* Animate CSS fadeIn */
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn,.animate__fadeIn {
  animation-name: fadeIn;
}

/* Tiled Exit Buttons */
.tile-exit-button {
    position: relative;
    display: block;
    padding: 1rem;
    background-color: #fff;
    border: 1px solid var(--bs-gray-400);
    border-radius: var(--bs-border-radius);
    color: inherit;
    text-decoration: none;
    box-shadow: 0 2px 12px rgba(0,0,0,.065);
    transition: all 200ms ease-in-out;
}
.tile-exit-button:hover {
    background-color: rgba(0,123,255,.05);
    border-color: rgba(0,123,255,.15);
    box-shadow: 0 12px 24px rgba(0,0,0,.08);
    transform: translate3d(0, 0, 0) scale3d(1.05, 1.05, 1) rotate(0deg);
    transform-style: preserve-3d;
    z-index: 10;
}
.tile-exit-button .label {
    display: flex;
    align-items: center;
    padding: 0;
    min-height: 46px;
}
.tile-exit-button .label-image {
    flex: 0 0 64px;
    margin: 0;
}
.tile-exit-button .label-text {
    margin-left: 1rem;
    text-align: left;
}
.tile-exit-button .label-text > span {
    font-size: 1.25rem;
    line-height: 1;
}
.tile-exit-button .label-text > small {
    line-height: 1;
}

/* TCPA */
[data-tf-element-role="consent-language"] {
    font-size: 0.675em;
}

/* Five parties modal */
#modalFiveParties .modal-body ul,
.modal-suppliers .modal-body ul {
    font-size: 0.75rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    grid-gap: 0 2rem;
}

/* Product list/table */
.product-list {
    counter-reset: productList;
    max-width: 992px;
    margin-left: auto;
    margin-right: auto;
    transition: 200ms ease-in;
}
.product-list .product-item::before {
    counter-increment: productList;
    display: block;
    content: counter(productList);
    padding: 0.5rem 0.75rem;
    position: absolute;
    background-color: var(--bs-gray-200);
    color: var(--bs-gray-600);
    font-weight: 700;
    font-size: 0.75rem;
    border-top-left-radius: var(--bs-radius);
    border-bottom-right-radius: calc(var(--bs-radius) * 2);
    transition: 200ms ease-in;
}
.product-list .product-item:hover {
    border-color: var(--bs-success);
    transition: 200ms ease-in;
}
.product-list .product-item:hover::before {
    color: var(--bs-white);
    background-color: var(--bs-success);
    transition: 200ms ease-in;
}
