*,:after,:before { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59,130,246,.5); --tw-ring-offset-shadow: 0 0 transparent; --tw-ring-shadow: 0 0 transparent; --tw-shadow: 0 0 transparent; --tw-shadow-colored: 0 0 transparent; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: } footer { border-top: solid 1px #eee; margin-top: 30px; padding-top: 30px; font-size: 1.125em; text-align: left; } *,:after,:before { border: 0 solid #e5e7eb; box-sizing: border-box } :after,:before { --tw-content: "" } html { -webkit-text-size-adjust: 100%; font-family: ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,BlinkMacSystemFont,Helvetica Neue,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji; line-height: 1.5; -moz-tab-size: 4; tab-size: 4 } body { line-height: inherit; margin: 0 } hr { border-top-width: 1px; color: inherit; height: 0 } abbr:where([title]) { text-decoration: underline; -webkit-text-decoration: underline dotted currentColor; text-decoration: underline dotted currentColor } h1,h2,h3,h4,h5,h6 { font-size: inherit; font-weight: inherit } a { color: inherit; text-decoration: inherit } b,strong { font-weight: bolder } code,kbd,pre,samp { font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace; font-size: 1em } small { font-size: 80% } sub,sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sub { bottom: -.25em } sup { top: -.5em } table { border-collapse: collapse; border-color: inherit; text-indent: 0 } button,input,optgroup,select,textarea { color: inherit; font-family: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; margin: 0; padding: 0 } button,select { text-transform: none } [type=button],[type=reset],[type=submit],button { -webkit-appearance: button; background-color: transparent; background-image: none } :-moz-focusring { outline: auto } :-moz-ui-invalid { box-shadow: none } progress { vertical-align: baseline } ::-webkit-inner-spin-button,::-webkit-outer-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; outline-offset: -2px } ::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } summary { display: list-item } blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre { margin: 0 } fieldset { margin: 0 } fieldset,legend { padding: 0 } menu,ol,ul { list-style: none; margin: 0; padding: 0 } textarea { resize: vertical } input::-moz-placeholder,textarea::-moz-placeholder { color: #9ca3af; opacity: 1 } input::placeholder,textarea::placeholder { color: #9ca3af; opacity: 1 } [role=button],button { cursor: pointer } :disabled { cursor: default } audio,canvas,embed,iframe,img,object,svg,video { display: block; vertical-align: middle } img,video { height: auto; max-width: 100% } *,:after,:before { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59,130,246,.5); --tw-ring-offset-shadow: 0 0 transparent; --tw-ring-shadow: 0 0 transparent; --tw-shadow: 0 0 transparent; --tw-shadow-colored: 0 0 transparent; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: } ::-webkit-backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59,130,246,.5); --tw-ring-offset-shadow: 0 0 transparent; --tw-ring-shadow: 0 0 transparent; --tw-shadow: 0 0 transparent; --tw-shadow-colored: 0 0 transparent; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: } ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgba(59,130,246,.5); --tw-ring-offset-shadow: 0 0 transparent; --tw-ring-shadow: 0 0 transparent; --tw-shadow: 0 0 transparent; --tw-shadow-colored: 0 0 transparent; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: } .sr-only { clip: rect(0,0,0,0); border-width: 0; height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px } .static { position: static } .absolute { position: absolute } .relative { position: relative } .top-0 { top: 0 } .right-4 { right: 1rem } .-top-8 { top: -2rem } .left-8 { left: 2rem } .z-10 { z-index: 10 } .z-20 { z-index: 20 } .col-span-4 { grid-column: span 4/span 4 } .col-span-3 { grid-column: span 3/span 3 } .col-span-2 { grid-column: span 2/span 2 } .col-span-1 { grid-column: span 1/span 1 } .float-right { float: right } .float-left { float: left } .m-4 { margin: 1rem } .m-8 { margin: 2rem } .m-auto { margin: auto } .mx-auto { margin-left: auto; margin-right: auto } .my-6 { margin-bottom: 1.5rem; margin-top: 1.5rem } .my-4 { margin-bottom: 1rem; margin-top: 1rem } .my-8 { margin-bottom: 2rem; margin-top: 2rem } .ml-4 { margin-left: 1rem } .mb-16 { margin-bottom: 4rem } .mb-4 { margin-bottom: 1rem } .mb-8 { margin-bottom: 2rem } .mb-12 { margin-bottom: 3rem } .mt-8 { margin-top: 2rem } .mr-2 { margin-right: .5rem } .ml-2 { margin-left: .5rem } .mt-20 { margin-top: 5rem } .-mt-12 { margin-top: -3rem } .mt-4 { margin-top: 1rem } .mr-4 { margin-right: 1rem } .-mt-4 { margin-top: -1rem } .mb-2 { margin-bottom: .5rem } .mt-2 { margin-top: .5rem } .mb-24 { margin-bottom: 6rem } .mt-16 { margin-top: 4rem } .-ml-40 { margin-left: -10rem } .-mt-8 { margin-top: -2rem } .-mr-40 { margin-right: -10rem } .mr-0 { margin-right: 0 } .mt-12 { margin-top: 3rem } .-mt-20 { margin-top: -5rem } .block { display: block } .flex { display: flex } .grid { display: grid } .contents { display: contents } .hidden { display: none } .h-fit { height: -webkit-fit-content; height: -moz-fit-content; height: fit-content } .h-60 { height: 15rem } .h-20 { height: 5rem } .h-64 { height: 16rem } .h-24 { height: 6rem } .h-16 { height: 4rem } .h-full { height: 100% } .max-h-96 { max-height: 24rem } .max-h-20 { max-height: 5rem } .max-h-32 { max-height: 8rem } .max-h-80 { max-height: 20rem } .max-h-40 { max-height: 10rem } .max-h-16 { max-height: 4rem } .max-h-72 { max-height: 18rem } .max-h-\[35rem\] { max-height: 35rem } .max-h-24 { max-height: 6rem } .max-h-60 { max-height: 15rem } .w-1\/2 { width: 50% } .w-3\/4 { width: 75% } .w-full { width: 100% } .flex-1 { flex: 1 1 0% } .grow-0 { flex-grow: 0 } .grow { flex-grow: 1 } .basis-1\/3 { flex-basis: 33.333333% } .basis-full { flex-basis: 100% } .grid-cols-1 { grid-template-columns: repeat(1,minmax(0,1fr)) } .grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) } .grid-cols-6 { grid-template-columns: repeat(6,minmax(0,1fr)) } .flex-row { flex-direction: row } .flex-col { flex-direction: column } .flex-wrap { flex-wrap: wrap } .items-center { align-items: center } .justify-start { justify-content: flex-start } .justify-end { justify-content: flex-end } .justify-center { justify-content: center } .gap-4 { gap: 1rem } .overflow-hidden { overflow: hidden } .rounded-md { border-radius: .375rem } .rounded { border-radius: .25rem } .rounded-lg { border-radius: .5rem } .rounded-xl { border-radius: .75rem } .border-2 { border-width: 2px } .border-solid { border-style: solid } .border-vanilla-white { --tw-border-opacity: 1; border-color: rgba(255,255,255,var(--tw-border-opacity)) } .border-vanilla-pink { --tw-border-opacity: 1; border-color: rgba(225,66,111,var(--tw-border-opacity)) } .border-vanilla-gray { --tw-border-opacity: 1; border-color: rgba(206,206,206,var(--tw-border-opacity)) } .border-vanilla-dark-gray { --tw-border-opacity: 1; border-color: rgba(63,62,60,var(--tw-border-opacity)) } .border-vanilla-light-gray { --tw-border-opacity: 1; border-color: rgba(249,249,249,var(--tw-border-opacity)) } .bg-indigo-400 { --tw-bg-opacity: 1; background-color: rgba(129,140,248,var(--tw-bg-opacity)) } .bg-green-400 { --tw-bg-opacity: 1; background-color: rgba(74,222,128,var(--tw-bg-opacity)) } .bg-yellow-400 { --tw-bg-opacity: 1; background-color: rgba(250,204,21,var(--tw-bg-opacity)) } .bg-red-400 { --tw-bg-opacity: 1; background-color: rgba(248,113,113,var(--tw-bg-opacity)) } .bg-transparent { background-color: transparent } .bg-vanilla-white { --tw-bg-opacity: 1; background-color: rgba(255,255,255,var(--tw-bg-opacity)) } .bg-vanilla-pink { --tw-bg-opacity: 1; background-color: rgba(225,66,111,var(--tw-bg-opacity)) } .bg-vanilla-light-gray { --tw-bg-opacity: 1; background-color: rgba(249,249,249,var(--tw-bg-opacity)) } .bg-vanilla-dark-gray { --tw-bg-opacity: 1; background-color: rgba(63,62,60,var(--tw-bg-opacity)) } .bg-vanilla-blue { --tw-bg-opacity: 1; background-color: rgba(63,143,217,var(--tw-bg-opacity)) } .bg-vanilla-alert-bar { --tw-bg-opacity: 1; background-color: rgba(128,207,204,var(--tw-bg-opacity)) } .bg-opacity-5 { --tw-bg-opacity: 0.05 } .bg-gradient-to-r { background-image: linear-gradient(to right,var(--tw-gradient-stops)) } .from-vanilla-blue { --tw-gradient-from: #3f8fd9; --tw-gradient-to: rgba(63,143,217,0); --tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to) } .from-vanilla-light-blue { --tw-gradient-from: #6bbef6; --tw-gradient-to: rgba(107,190,246,0); --tw-gradient-stops: var(--tw-gradient-from),var(--tw-gradient-to) } .to-vanilla-light-blue { --tw-gradient-to: #6bbef6 } .to-vanilla-blue { --tw-gradient-to: #3f8fd9 } .bg-cover { background-size: cover } .bg-center { background-position: 50% } .bg-no-repeat { background-repeat: no-repeat } .p-6 { padding: 1.5rem } .p-4 { padding: 0.75rem } .p-8 { padding: 2rem } .p-2 { padding: .5rem } .p-16 { padding: 4rem } .py-40 { padding-bottom: 10rem; padding-top: 10rem } .px-20 { padding-left: 5rem; padding-right: 5rem } .py-8 { padding-bottom: 2rem; padding-top: 2rem } .py-12 { padding-bottom: 3rem; padding-top: 3rem } .py-4 { padding-bottom: 1rem; padding-top: 1rem } .px-8 { padding-left: 2rem; padding-right: 2rem } .py-2 { padding-bottom: .5rem; padding-top: .5rem } .px-4 { padding-left: 1rem; padding-right: 1rem } .py-16 { padding-bottom: 4rem; padding-top: 4rem } .px-6 { padding-left: 1.5rem; padding-right: 1.5rem } .py-32 { padding-bottom: 8rem; padding-top: 8rem } .pt-8 { padding-top: 2rem } .pb-16 { padding-bottom: 4rem } .pb-8 { padding-bottom: 2rem } .pt-20 { padding-top: 5rem } .pb-24 { padding-bottom: 6rem } .pt-12 { padding-top: 3rem } .pb-12 { padding-bottom: 3rem } .pr-0 { padding-right: 0 } .pl-0 { padding-left: 0 } .pl-4 { padding-left: 1rem } .pr-4 { padding-right: 1rem } .pr-8 { padding-right: 2rem } .pb-32 { padding-bottom: 8rem } .pt-40 { padding-top: 10rem } .text-left { text-align: left } .text-center { text-align: center } .text-right { text-align: right } .text-8xl { font-size: 6rem; line-height: 1 } .text-2xl { font-size: 1.5rem; line-height: 2rem } .text-4xl { font-size: 2.25rem; line-height: 2.5rem } .text-lg { font-size: 1.125rem; line-height: 1.75rem } .text-sm { font-size: .875rem; line-height: 1.25rem } .text-xl { font-size: 1.25rem; line-height: 1.75rem } .text-3xl { font-size: 1.875rem; line-height: 2.25rem } .text-base { font-size: 1rem; line-height: 1.5rem } .text-xs { font-size: .75rem; line-height: 1rem } .text-5xl { font-size: 3rem; line-height: 1 } .font-bold { font-weight: 700 } .font-black { font-weight: 900 } .font-medium { font-weight: 500 } .uppercase { text-transform: uppercase } .italic { font-style: italic } .leading-9 { line-height: 2.25rem } .text-indigo-50 { --tw-text-opacity: 1; color: rgba(238,242,255,var(--tw-text-opacity)) } .text-green-50 { --tw-text-opacity: 1; color: rgba(240,253,244,var(--tw-text-opacity)) } .text-yellow-50 { --tw-text-opacity: 1; color: rgba(254,252,232,var(--tw-text-opacity)) } .text-red-50 { --tw-text-opacity: 1; color: rgba(254,242,242,var(--tw-text-opacity)) } .text-vanilla-white { --tw-text-opacity: 1; color: rgba(255,255,255,var(--tw-text-opacity)) } .text-vanilla-dark-gray { --tw-text-opacity: 1; color: rgba(63,62,60,var(--tw-text-opacity)) } .text-vanilla-blue { --tw-text-opacity: 1; color: rgba(63,143,217,var(--tw-text-opacity)) } .text-vanilla-pink { --tw-text-opacity: 1; color: rgba(225,66,111,var(--tw-text-opacity)) } .underline { -webkit-text-decoration-line: underline; text-decoration-line: underline } .shadow-3xl { --tw-shadow: 0px 0px 15px 1px rgba(0,0,0,.25); --tw-shadow-colored: 0px 0px 15px 1px var(--tw-shadow-color) } .shadow-3xl,.shadow-md { box-shadow: 0 0 transparent,0 0 transparent,var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow) } .shadow-md { --tw-shadow: 0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1); --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color) } .outline { outline-style: solid } .transition-all { transition-duration: .15s; transition-property: all; transition-timing-function: cubic-bezier(.4,0,.2,1) } @font-face { font-display: swap; font-family: Gotham; font-weight: 400; src: url(/wp-content/themes/Vanilla/public/fonts/Gotham-Book.f15af4.otf) } @font-face { font-display: swap; font-family: Gotham; font-weight: 700; src: url(/wp-content/themes/Vanilla/public/fonts/Gotham-Bold.70a810.otf) } @font-face { font-display: swap; font-family: Gotham; font-weight: 900; src: url(/wp-content/themes/Vanilla/public/fonts/Gotham-Black.ad1381.otf) } body { font-family: Gotham,Arial,sans-serif } .vanilla-soft-margin { margin-left: auto!important; margin-right: auto!important; max-width: 1280px!important; padding-left: 2rem!important; padding-right: 2rem!important } @media screen and (min-width: 1536px) { .vanilla-soft-margin { padding-left:0!important; padding-right: 0!important } } img[data-src] { opacity: 0; transition: opacity .25s ease-in-out; will-change: opacity } img[data-src][src] { opacity: 1 } .banners__vf_header { background: #fff; border-bottom: 2px solid #3f8fd9; padding: 1rem 2rem } .banners__vf_header-logo-container { align-items: center; display: flex } .banners__vf_header-logo-container img { max-height: 3.5rem } .banners__vf_header-nav-container { display: flex; padding: 0 0 0 7rem } .banners__vf_header-cta-container { display: flex; text-align: right } .banners__vf_header-cta-container--cta { background: #e1426f; border: 2px solid #e1426f; border-radius: .375rem; color: #fff; font-weight: 700; padding: .25rem 1.75rem } @media(max-width: 1023px) { .banners__vf_header-cta-container--cta { padding:.25rem } } @media(max-width: 767px) { .banners__vf_header-cta-container--cta { padding:0; text-align: center } } .banners__vf_header-cta-container--cta:hover { background: #fff; color: #e1426f } .menu-main-nav-menu-container { flex-grow: 1; height: 100% } .menu-main-nav-menu-container ul { align-items: center; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); height: 100% } .menu-main-nav-menu-container ul li { flex-grow: 1; float: left; position: relative } .menu-main-nav-menu-container ul li a { color: #3f3e3c; font-size: .65rem; font-weight: 700; text-transform: uppercase } .menu-main-nav-menu-container ul li a:hover { color: #3f8fd9 } .menu-labels { color: #3f3e3c; font-size: 14px; font-weight: 400; text-transform: uppercase } .blue-border-left { border-left: 2px solid #3f8fd9!important } .flex-parent>ul { display: flex!important } .blue-bottom-bar { background-color: #e1426f!important } .blue-bottom-bar a { color: #fff!important } .extra-padding-column { padding-top: 6px!important } .mega-sub-menu li a { font-weight: 900!important } .mega-sub-menu .textwidget p { height: 4rem } @media(max-width: 1279px) { .banners__vf_header-nav-container { padding:0 0 0 1rem } } @media(max-width: 767px) { .banners__vf_header-nav-container #mega-menu-wrap-main-nav { display:none } .banners__vf_header-logo-container #mega-menu-wrap-mobile-nav { margin-right: 2rem } } .footer-section a { color: #3f8fd9 } .footer-section__content p { margin-bottom: .5rem } .footer-section__copyright a { color: #fff } .home-page-video-container { height: 0; max-width: 100%; overflow: hidden; padding-bottom: 56.25%; position: relative } .home-page-video-container iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .integration-box .logo-box { display: block } .integration-box .excerpt-box,.integration-box:hover .logo-box { display: none } .integration-box:hover .excerpt-box { display: block } .featured-logo-box img { max-height: 5rem; width: auto } #term_filter_form { padding: 2rem 0 } #term_filter_form ul { display: flex; flex-direction: column; justify-content: center; list-style-type: none } @media(min-width: 1024px) { #term_filter_form ul { flex-direction:row } } #term_filter_form ul li { display: flex; flex-basis: auto; float: left; height: 40px; margin: 0 0 1rem; position: relative } @media(min-width: 1024px) { #term_filter_form ul li { flex-basis:20%; margin: 0 1rem 0 0 } } #term_filter_form ul input,#term_filter_form ul label { background: #fff; bottom: 0; cursor: pointer; display: block; left: 0; position: absolute; right: 0; top: 0 } #term_filter_form ul input[type=radio] { opacity: .01; z-index: 100 } #term_filter_form ul .Checked+label,#term_filter_form ul input[type=radio]:checked+label { background: #3f8fd9; color: #fff } #term_filter_form ul label { border: 2px solid #3f8fd9; color: #3f8fd9; cursor: pointer; font-weight: 700; padding: 5px; z-index: 90 } #term_filter_form ul label:hover { background: #3f8fd9; color: #fff } .integration_detail_header { -webkit-mask-position: center; mask-position: center; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; mask-size: 100% 100% } .integration-detail-video-container { height: 0; max-width: 100%; overflow: hidden; padding-bottom: 56.25%; position: relative } .integration-detail-video-container iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .integration_detail_content h3 { color: #3f8fd9; font-size: 1.25rem; font-weight: 900; line-height: 1.75rem; margin-bottom: 2rem } .integration_detail_content a { color: #3f8fd9; text-decoration: underline } .integration_detail_content p,.integration_detail_content ul { margin-bottom: 2rem } .integration_detail_content ul li { list-style-type: disc; margin-left: 1rem } .integration_detail_content ol { margin-bottom: 2rem } .integration_detail_content ol li { list-style-type: decimal; margin-left: 1rem } .journey-content-box p { margin-bottom: 1rem } .features-media-video-container { height: 0; max-width: 100%; overflow: hidden; padding-bottom: 56.25%; position: relative } .features-media-video-container iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .accordion { align-items: center; background-color: #f9f9f9; border: none; color: #3f3e3c; cursor: pointer; display: flex; height: 7rem; justify-content: space-between; margin: 1rem 0; outline: none; padding: 2rem; text-align: left; transition: .4s; width: 100% } .accordion:hover { background-color: #3f8fd9; color: #fff } .accordion:hover .accordion__status:after { color: #fff } .accordion__status:after { color: #3f3e3c; content: "+"; float: right; font-size: 1rem; margin-left: .5rem } .active:after { content: "âˆ’" } .panel { background-color: #fff; display: none; overflow: hidden; padding: 0 2rem } .panel a { text-decoration: underline } .panel ul { margin-left: 1rem } .panel ul li { list-style: disc } .checklist-text-area p { margin-bottom: 1rem } .platform-video-container { height: 0; max-width: 100%; overflow: hidden; padding-bottom: 56.25%; position: relative } .platform-video-container iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .featured-case-study-wrapper img { margin: auto; max-height: 5rem; width: auto } .post-content { color: #3f3e3c } .post-content h2 { font-size: 1.5rem; font-weight: 900; line-height: 2rem; margin-bottom: 2rem } .post-content h3 { font-size: 1.25rem } .post-content h3,.post-content h4 { font-weight: 900; line-height: 1.75rem; margin-bottom: 2rem } .post-content h4 { font-size: 1.125rem } .post-content h5 { font-size: 1rem; line-height: 1.5rem } .post-content h5,.post-content h6 { font-weight: 900; margin-bottom: 2rem } .post-content h6 { font-size: .875rem; line-height: 1.25rem } .post-content p,.post-content ul { margin-bottom: 2rem } .post-content ul { margin-left: 3rem } .post-content ul li { list-style-type: disc } .post-content a { color: #3f8fd9 } .post-content a:hover { text-decoration: underline } .blog-thumbnail img { width: 100% } .sf-field-search input { border: 1px solid #3f3e3c; border-radius: 9999px; padding: .25rem .5rem; width: 100% } .searchandfilter>ul>li h4 { border-bottom: 2px solid #3f3e3c; color: #3f3e3c; font-size: 1.5rem } .hover\:translate-x-4:hover { --tw-translate-x: 1rem; transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .hover\:bg-vanilla-white:hover { --tw-bg-opacity: 1; background-color: rgba(255,255,255,var(--tw-bg-opacity)) } .hover\:bg-vanilla-dark-gray:hover { --tw-bg-opacity: 1; background-color: rgba(63,62,60,var(--tw-bg-opacity)) } .hover\:text-vanilla-blue:hover { --tw-text-opacity: 1; color: rgba(63,143,217,var(--tw-text-opacity)) } .hover\:text-vanilla-pink:hover { --tw-text-opacity: 1; color: rgba(225,66,111,var(--tw-text-opacity)) } .hover\:text-vanilla-white:hover { --tw-text-opacity: 1; color: rgba(255,255,255,var(--tw-text-opacity)) } .hover\:shadow-3xl:hover { --tw-shadow: 0px 0px 15px 1px rgba(0,0,0,.25); --tw-shadow-colored: 0px 0px 15px 1px var(--tw-shadow-color); box-shadow: 0 0 transparent,0 0 transparent,var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow) } .focus\:not-sr-only:focus { clip: auto; height: auto; margin: 0; overflow: visible; padding: 0; position: static; white-space: normal; width: auto } @media (min-width: 768px) { .md\:col-span-2 { grid-column:span 2/span 2 } .md\:col-span-3 { grid-column: span 3/span 3 } .md\:mx-4 { margin-left: 1rem } .md\:mr-4,.md\:mx-4 { margin-right: 1rem } .md\:mb-0 { margin-bottom: 0 } .md\:ml-8 { margin-left: 2rem } .md\:block { display: block } .md\:inline { display: inline } .md\:flex { display: flex } .md\:h-12 { height: 3rem } .md\:h-16 { height: 4rem } .md\:basis-1\/3 { flex-basis: 33.333333% } .md\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) } .md\:grid-cols-5 { grid-template-columns: repeat(5,minmax(0,1fr)) } .md\:grid-cols-4 { grid-template-columns: repeat(4,minmax(0,1fr)) } .md\:grid-cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)) } .md\:flex-row { flex-direction: row } .md\:gap-12 { gap: 3rem } .md\:py-20 { padding-bottom: 5rem; padding-top: 5rem } .md\:px-24 { padding-left: 6rem; padding-right: 6rem } .md\:py-24 { padding-bottom: 6rem; padding-top: 6rem } .md\:px-8 { padding-left: 2rem; padding-right: 2rem } .md\:pt-20 { padding-top: 5rem } .md\:pr-4 { padding-right: 1rem } .md\:pl-4 { padding-left: 1rem } .md\:text-left { text-align: left } .md\:text-right { text-align: right } .md\:odd\:mr-4:nth-child(odd) { margin-right: 1rem } .md\:even\:mr-0:nth-child(2n) { margin-right: 0 } .md\:even\:ml-4:nth-child(2n) { margin-left: 1rem } } @media (min-width: 1024px) { .lg\:col-span-4 { grid-column:span 4/span 4 } .lg\:mb-0 { margin-bottom: 0 } .lg\:mr-4 { margin-right: 1rem } .lg\:-mt-12 { margin-top: -3rem } .lg\:mt-0 { margin-top: 0 } .lg\:mr-8 { margin-right: 2rem } .lg\:block { display: block } .lg\:flex { display: flex } .lg\:h-20 { height: 5rem } .lg\:h-16 { height: 4rem } .lg\:h-40 { height: 10rem } .lg\:w-full { width: 100% } .lg\:w-1\/2 { width: 50% } .lg\:w-1\/4 { width: 25% } .lg\:w-3\/4 { width: 75% } .lg\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) } .lg\:grid-cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)) } .lg\:grid-cols-4 { grid-template-columns: repeat(4,minmax(0,1fr)) } .lg\:grid-cols-5 { grid-template-columns: repeat(5,minmax(0,1fr)) } .lg\:p-0 { padding: 0 } .lg\:px-40 { padding-left: 10rem; padding-right: 10rem } .lg\:py-8 { padding-bottom: 2rem; padding-top: 2rem } .lg\:px-16 { padding-left: 4rem; padding-right: 4rem } .lg\:pt-0 { padding-top: 0 } .lg\:pl-8 { padding-left: 2rem } .lg\:text-left { text-align: left } .lg\:last\:m-0:last-child { margin: 0 } .lg\:last\:mr-0:last-child { margin-right: 0 } } @media (min-width: 1280px) { .xl\:left-0 { left:0 } } .bg-vanilla-dark-gray { --tw-bg-opacity: 1; background-color: rgba(63,62,60,var(--tw-bg-opacity)) } .hover\:bg-vanilla-dark-gray:hover { --tw-bg-opacity: 1; background-color: rgba(63,62,60,var(--tw-bg-opacity)) } .block { display: block } .flex { display: flex } .grid { display: grid } .grid-cols-1 { grid-template-columns: repeat(1,minmax(0,1fr)) } .grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) } .grid-cols-6 { grid-template-columns: repeat(6,minmax(0,1fr)) } .flex-1 { flex: 1 1 0% } .flex-row { flex-direction: row } .flex-col { flex-direction: column } .flex-wrap { flex-wrap: wrap } .italic { font-style: italic } .items-center { align-items: center } .justify-start { justify-content: flex-start } .justify-end { justify-content: flex-end } .justify-center { justify-content: center } .font-bold { font-weight: 700 } .footer-section a { color: #3f8fd9 } .footer-section__content p { margin-bottom: .5rem } .footer-section__copyright a { color: #fff } .footer-section__content p { margin-bottom: .5rem } /* "footer-section__copyright": true, "footer-section__demo": true, "footer-section__grid": true, "footer-section__info": true, "footer-section__sales": true, "footer-section__title": true, "footer-section__title--bottom": true, "footer-section__title--top": true, "italic": true, "lg:grid-cols-4": true, "md:grid-cols-2": true, */ .text-right { text-align: right } .text-vanilla-white { --tw-text-opacity: 1; color: rgba(255,255,255,var(--tw-text-opacity)) } .text-xs { font-size: .75rem; line-height: 1rem } .vanilla-soft-margin { margin-left: auto!important; margin-right: auto!important; max-width: 1280px!important; padding-left: 2rem!important; padding-right: 2rem!important } @media screen and (min-width: 1536px) { .vanilla-soft-margin { padding-left:0!important; padding-right: 0!important } } @media (min-width: 1024px) { .lg\:grid-cols-4 { grid-template-columns: repeat(4,minmax(0,1fr)); } } .fa, .fa-brands { font-weight: 400; font-family: "FontAwesome"; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: var(--fa-display,inline-block); font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto; } .fa-linkedin-in:before { content: "\f0e1"; } .fa-instagram:before { content: "\f16d"; } .fa-twitter:before { content: "\f099"; } .fa-facebook-f:before { content: "\f082"; }

Vanilla Release Notes

Release 2021.007

Schedule

Release 2021.007 will be deployed:

To staging sites: Wednesday, April 7th
To production site: Monday, April 12th
To Enterprise client sites: Monday, April 19th

Zapier Templates & Docs

We've added a Zapier page to our Dashboard settings to allow you to explore and set-up Zapier templates from within your Vanilla Dashboard.

Screen Shot 2021-04-06 at 12.04.11 PM.png

Parent Theme Support

It is now possible to share assets between file-based themes with the parent key in the addon.json. By setting this theme to another the key of another theme, the parent assets will be merged with the child assets.

Here's how it works:

variables.json or variables.neon - Variables are merged together.
styles.css - Styles are concatenated.
javascript.js - Javascript is concatenated.
All assets (if the child does not specify the asset, it will be inherited from the parent).

Future releases may add additional behaviours to parent themes.

Bug Fixes and Improvements

Add ban by fingerprint to the troll management plugin- addons#844
Add the RelayState to SAML sign out requests.- vanilla-cloud#2237
Add DiscussionModel::merge() method- vanilla-cloud#1965
Add discussions api common expand- vanilla-cloud#2505
Add user tags to discussion UI - vanilla-cloud#2502
Add API endpoint for iterating over PHP generators - vanilla-cloud#2523
Add initial implementation of theme asset merging- vanilla-cloud#2527
Add better input and button normalization for cross-browser support- vanilla-cloud#2560
Add support for rich fragment lists- vanilla-cloud#2558
Add user card to LeaderBoardModule(List) view- vanilla-cloud#2540
Fix broken search result images in articles with image embeds- vanilla-cloud#2609
Fix stub-content posts being marked as spam by akismet- vanilla-cloud#2606
Fix orphaned junction tables appearing as no permission- vanilla-cloud#2604
Fix QnA status when deleting comments- vanilla-cloud#2602
Fixes double encoding of special chars in WYSIWYG codeblocks- vanilla-cloud#2591
Fix underlined links in leaderboard list and groups searchbar spacing when signed out- vanilla-cloud#2586
Fix badges email missing description- vanilla-cloud#2585
Fixes invisible dashboard- vanilla-cloud#2584
Fix user permissions schema- vanilla-cloud#2570
Fix performance of `_mountComponents()` with a large amount of components- vanilla-cloud#2569
Fix admins can't see categories on settings page without Discussions.View permission- vanilla-cloud#2557
Fix user dateLastActive not updating- vanilla-cloud#2556
Fix excessive whitespace stripping in HtmlNormalizeTrait- vanilla-cloud#2551
Fix validation errors on userFragments and categories allow discussion types- vanilla-cloud#2541
Fix remote resource content column type- vanilla-cloud#2535
Fixs missing quotes with (Quote) on profile/comments page- vanilla-cloud#2532
Fix permission error when approving applicants- vanilla-cloud#2530
Fix article foreignID - vanilla-cloud#2529
Fix not all new lines in email formatted correctly- vanilla-cloud#2526
Fix overlapping in mobiles- vanilla-cloud#2521
Fix issues with new discussion list- vanilla-cloud#2518
Fix userID can be set as a string- vanilla-cloud#2517
Fix KB styling issues- vanilla-cloud#2516
Fix mobile only navigation- vanilla-cloud#2515
Fix discussion options menu showing when it shouldn't- vanilla-cloud#2514
Fix conversations api when body has an external embed- vanilla-cloud#2508
Fix users getting two emails when rank increases- vanilla-cloud#2466
Fix comment query returning orphan comments- vanilla-cloud#2448
Fix merging discussions counts- vanilla-cloud#2413
Fix profile extender rendering fields out of order- vanilla-cloud#2412
Fix disappearing header In foundation- vanilla-cloud#2724
Fix broken radio input layouts- vanilla-cloud#2592
Fix checkbox input layout- vanilla-cloud#2720
Fix search widget module- vanilla-cloud#2681
Fix articles with multiple translations (revisions) not appearing in sitemap- vanilla-cloud#2617
Fix validation error when search driver is force set in the config- vanilla-cloud#2620
Fix saving comment drafts not saving- vanilla-cloud#2673
Fix advanced search paging with elastic- vanilla-cloud#2731
Fix emoji's appearing as search result images- vanilla-cloud#2685