/*START General CSS*/

:root {
    --suffix-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    --fontfamily-playfair: 'Playfair Display', var(--suffix-family);
    --fontfamily-montserrat: 'Montserrat', var(--suffix-family);
    --fontfamily-ptserif: 'PT Serif', var(--suffix-family);
    --padding-field: 14px 47px 14px 14px;
    --padding-button: 18px 14px;
    --rounded-sm: 6px;
    --transparent: rgba(0, 0, 0, 0);
    --white: #fff;
    --black: #000;
    --cream: #F6F4F1;
    --denim: #778DAE;
    --brown: #6B6B6B;
    --clay: #7E4A27;
    --light-orange: #DCA882;
    --text-color: #3A3A3A;
    --text-denim: #5F7398;
    --shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
    --shadow-card: 0px 1.96px 5.89px 0px #0D0A2C14;
    --listing-column: 4;
    --listing-gap: 24px;
    --listing-gap-bottom: var(--listing-gap);
    --duration: .3s;
    --transition: background-color var(--duration), border-color var(--duration), color var(--duration), fill var(--duration), stroke var(--duration), opacity var(--duration), visibility var(--duration), box-shadow var(--duration), -webkit-box-shadow var(--duration), transform var(--duration), -webkit-transform var(--duration), filter var(--duration), backdrop-filter var(--duration);
}

/* START RESET BUTTON / CTA */
.whbutton-wrapper {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.whbutton-wrapper:not(.whbutton-align--inline) {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.whbutton-wrapper.whbutton-align--left {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.whbutton-wrapper.whbutton-align--center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.whbutton-wrapper.whbutton-align--right {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

[class*="whbutton-fill"] .cta-whbutton,
[class*="whbutton-outline"] .cta-whbutton {
    padding: var(--padding-button);
    border: 2px solid var(--transparent);
    -webkit-border-radius: var(--rounded-sm);
    -moz-border-radius: var(--rounded-sm);
    border-radius: var(--rounded-sm);
}

.cta-whbutton {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    text-align: left;
    font-family: var(--fontfamily-unbounded);
    font-weight: 400;
    line-height: 1;
}

.cta-whbutton .label-cta {
    color: inherit;
}

.cta-whbutton .label-cta strong {
    display: block;
    font-weight: 500;
    margin-bottom: 4px;
}

.cta-whbutton .icon-cta,
.whbutton-icon .cta-whbutton::after {
    display: inline-block;
    width: 24px;
    min-width: 24px;
    height: 24px;
    min-height: 24px;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    -moz-transition: var(--transition);
    transition: var(--transition);
}

.cta-whbutton .icon-cta {
    -o-object-fit: contain;
    object-fit: contain;
}

.whbutton-icon:not() .cta-whbutton::after {
    background: center/contain no-repeat;
}

/* DEFAULT SIZE ICON CIRCLE */
.whbutton-wrapper[class*="-circle"] .cta-whbutton .icon-cta {
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
}

.cta-whbutton .icon-cta--hover {
    position: absolute;
    top: 50%;
    z-index: 2;
    opacity: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

[class*="whbutton-animate-"] .cta-whbutton .icon-cta--hover {
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.whbutton-icon-left .cta-whbutton .icon-cta--hover {
    left: 0;
}

[class*="whbutton-fill"].whbutton-icon-left .cta-whbutton .icon-cta--hover,
[class*="whbutton-outline"].whbutton-icon-left .cta-whbutton .icon-cta--hover {
    left: 30px;
}

.whbutton-icon-right .cta-whbutton .icon-cta--hover {
    right: 0;
}

[class*="whbutton-fill"].whbutton-icon-right .cta-whbutton .icon-cta--hover,
[class*="whbutton-outline"].whbutton-icon-right .cta-whbutton .icon-cta--hover {
    right: 30px;
}

.cta-whbutton:hover .icon-cta--hover {
    opacity: 1;
}

.cta-whbutton .icon-cta--hover,
.cta-whbutton:hover .icon-cta--hover~.icon-cta--default {
    opacity: 0;
}

.whbutton-icon-left .cta-whbutton .icon-cta,
.whbutton-icon-right .cta-whbutton .label-cta,
.whbutton-icon-left .cta-whbutton::after {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -moz-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1;
    margin-right: 12px;
}

.whbutton-animate-left .cta-whbutton:hover .icon-cta,
.whbutton-animate-left .cta-whbutton:hover::after {
    -webkit-transform: translateX(-3px);
    -moz-transform: translateX(-3px);
    -ms-transform: translateX(-3px);
    -o-transform: translateX(-3px);
    transform: translateX(-3px);
}

.whbutton-animate-right .cta-whbutton:hover .icon-cta,
.whbutton-animate-right .cta-whbutton:hover::after {
    -webkit-transform: translateX(3px);
    -moz-transform: translateX(3px);
    -ms-transform: translateX(3px);
    -o-transform: translateX(3px);
    transform: translateX(3px);
}

.whbutton-animate-top .cta-whbutton:hover .icon-cta,
.whbutton-animate-top .cta-whbutton:hover::after {
    -webkit-transform: translateY(-3px);
    -moz-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    -o-transform: translateY(-3px);
    transform: translateY(-3px);
}

.whbutton-animate-bottom .cta-whbutton:hover .icon-cta,
.whbutton-animate-bottom .cta-whbutton:hover::after {
    -webkit-transform: translateY(3px);
    -moz-transform: translateY(3px);
    -ms-transform: translateY(3px);
    -o-transform: translateY(3px);
    transform: translateY(3px);
}

.whbutton-animate-left .cta-whbutton:hover .icon-cta--hover {
    -webkit-transform: translate(-3px, -50%);
    -moz-transform: translate(-3px, -50%);
    -ms-transform: translate(-3px, -50%);
    -o-transform: translate(-3px, -50%);
    transform: translate(-3px, -50%);
}

.whbutton-animate-right .cta-whbutton:hover .icon-cta--hover {
    -webkit-transform: translate(3px, -50%);
    -moz-transform: translate(3px, -50%);
    -ms-transform: translate(3px, -50%);
    -o-transform: translate(3px, -50%);
    transform: translate(3px, -50%);
}

.whbutton-animate-top .cta-whbutton:hover .icon-cta--hover {
    -webkit-transform: translateY(-webkit-calc(-50% - 3px));
    -moz-transform: translateY(-moz-calc(-50% - 3px));
    -ms-transform: translateY(calc(-50% - 3px));
    -o-transform: translateY(calc(-50% - 3px));
    transform: translateY(calc(-50% - 3px));
}

.whbutton-animate-bottom .cta-whbutton:hover .icon-cta--hover {
    -webkit-transform: translateY(-webkit-calc(-50% + 3px));
    -moz-transform: translateY(-moz-calc(-50% + 3px));
    -ms-transform: translateY(calc(-50% + 3px));
    -o-transform: translateY(calc(-50% + 3px));
    transform: translateY(calc(-50% + 3px));
}

.whbutton-color--black .cta-whbutton {
    color: var(--black);
}

.whbutton-color--white .cta-whbutton {
    color: var(--white);
}

.whbutton-color--blue .cta-whbutton {
    color: var(--blue);
}

.whbutton-color--light-blue .cta-whbutton {
    color: var(--lightblue);
}

.whbutton-color--green .cta-whbutton {
    color: var(--green);
}

.whbutton-color--light-green .cta-whbutton {
    color: var(--light-green);
}

.whbutton-color--light-orange .cta-whbutton {
    color: var(--light-orange);
}

.whbutton-colorhvr--black .cta-whbutton:hover {
    color: var(--black);
}

.whbutton-colorhvr--white .cta-whbutton:hover {
    color: var(--white);
}

.whbutton-colorhvr--blue .cta-whbutton:hover {
    color: var(--blue);
}

.whbutton-colorhvr--light-blue .cta-whbutton:hover {
    color: var(--light-blue);
}

.whbutton-colorhvr--green .cta-whbutton:hover {
    color: var(--green);
}

.whbutton-colorhvr--light-green .cta-whbutton:hover {
    color: var(--light-green);
}

.whbutton-colorhvr--light-orange .cta-whbutton {
    color: var(--light-orange);
}

.whbutton-fill--black .cta-whbutton {
    background-color: var(--black);
    border-color: var(--black);
}

.whbutton-fill--white .cta-whbutton {
    background-color: var(--white);
    border-color: var(--black);
}

.whbutton-fill--blue .cta-whbutton {
    background-color: var(--blue);
    border-color: var(--black);
}

.whbutton-fill--light-blue .cta-whbutton {
    background-color: var(--light-blue);
    border-color: var(--black);
}

.whbutton-fill--green .cta-whbutton {
    background-color: var(--green);
    border-color: var(--black);
}

.whbutton-fill--light-green .cta-whbutton {
    background-color: var(--light-green);
    border-color: var(--black);
}

.whbutton-fill--light-orange .cta-whbutton {
    background-color: var(--light-orange);
    border-color: var(--black);
}

.whbutton-outline--black .cta-whbutton {
    border-color: var(--black);
}

.whbutton-outline--white .cta-whbutton {
    border-color: var(--white);
}

.whbutton-outline--blue .cta-whbutton {
    border-color: var(--blue);
}

.whbutton-outline--light-blue .cta-whbutton {
    border-color: var(--light-blue);
}

.whbutton-outline--green .cta-whbutton {
    border-color: var(--green);
}

.whbutton-outline--light-green .cta-whbutton {
    border-color: var(--light-green);
}

.whbutton-outline--light-orange .cta-whbutton {
    border-color: var(--light-orange);
}

[class*="whbutton-fill"],
[class*="whbutton-outline"] {
    position: relative;
    padding-bottom: 8px;
}

[class*="whbutton-fill"] .cta-whbutton,
[class*="whbutton-outline"] .cta-whbutton {
    z-index: 2;
    bottom: 0px;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

[class*="whbutton-fill"] .cta-whbutton:hover,
[class*="whbutton-outline"] .cta-whbutton:hover {
    bottom: -8px;
}

[class*="whbutton-fill"]:after,
[class*="whbutton-outline"]:after {
    content: '';
    display: inline-block;
    width: var(--outerWidth);
    height: 10px;
    background-color: var(--black);
    -webkit-border-radius: var(--rounded-sm);
    -moz-border-radius: var(--rounded-sm);
    border-radius: var(--rounded-sm);
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    border-top-right-radius: 0px;
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    border-top-left-radius: 0px;
    position: absolute;
    bottom: 0;
    left: 0;
}

[class*="whbutton-fill"].whbutton-wrapper.whbutton-align--center:after,
[class*="whbutton-outline"].whbutton-wrapper.whbutton-align--center:after {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

[class*="whbutton-fill"].whbutton-wrapper.whbutton-align--right:after,
[class*="whbutton-outline"].whbutton-wrapper.whbutton-align--right:after {
    left: auto;
    right: 0;
}

.whbutton-wrapper.whbutton-simple.whbutton-icon-left .cta-whbutton .icon-cta,
.whbutton-wrapper.whbutton-simple.whbutton-icon-right .cta-whbutton .label-cta,
.whbutton-wrapper.whbutton-simple.whbutton-icon-left .cta-whbutton::after {
    margin-right: 16px;
}

.whbutton-wrapper.whbutton-simple .cta-whbutton {
    font-family: var(--fontfamily-montserrat);
}

.whbutton-wrapper.whbutton-contact[class*="whbutton-fill"] .cta-whbutton,
.whbutton-wrapper.whbutton-contact[class*="whbutton-outline"] .cta-whbutton {
    min-width: 286px;
}

.whbutton-wrapper.whbutton-contact[class*="whbutton-fill"] .cta-whbutton .label-cta {
    font-family: var(--fontfamily-montserrat);
}

.whbutton-wrapper.whbutton-contact[class*="whbutton-fill"] .cta-whbutton .label-cta strong {
    font-family: var(--fontfamily-montserrat);
}

/* END RESET BUTTON / CTA */

/*END General CSS*/

