*,: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.023

Schedule

Release 2021.023 will be deployed:

To staging sites, Wednesday, November 17th
To production sites, Monday, November 22nd
To Enterprise client sites, Monday, November 29th

Discussion Widget Setting - Followed Categories

You can now configure Discussions widgets to show top, trending, newest or most recent discussions from categories a user follows. This will allow for personalized widgets to show content from categories your user is interested in.

N.B. Widget will not appear if you are not following categories.

Screen Shot 2021-11-18 at 4.15.59 PM.png

Kaltura Embeds

Videos from Kaltura’s Video Hub can now be embedded into community discussions, comments and articles. Easily embed Kaltura videos into articles to enhance KB content, add them to discussions and comments to answer questions or share content.

Release 2021.024 will add the ability to configure custom Kaltura URL support.

Screen Shot 2021-11-18 at 4.16.10 PM.png

Discussion Updated Trigger

You can now automate workflows through Zapier when discussions are updated in Vanilla. Keep issues and content updated in 3rd party tools when changes are made in Vanilla. With this new feature you can;

Update GitHub issues
Add notes to Product Board
Update or add comments to Zendesk tickets

Screen Shot 2021-11-18 at 4.16.21 PM.png

Copy Analytics Dashboard

You can now make copies of our out of the box dashboards. Make your own copy of Vanilla’s OOTB dashboards to customize the layout or add and edit charts.

This allows us to continue refining our OOTB charts and dashboards without overriding customized views.

Screen Shot 2021-11-18 at 4.16.35 PM.png

API & Webhooks

We have made some improvements to our API & Webhooks to allow you to get more information on subcommunities and users. This will also help power our Zapier triggers and analytics options.

The api/v2/subcommunities GET endpoint now includes associated categories & knowledge bases.

The User Webhhook event has been updated to include badge events & rank changes.

Screen Shot 2021-11-18 at 4.16.46 PM.png

Improvements

Add category following email notifications by default in dropdown config flag VNLA-670- vanilla-cloud#3857
Write discussion status when ideation status written- vanilla-cloud#3856
Fix analytics data keys being array in specific cases- vanilla-cloud#3852
Add "Followed categories only" to Pocket (List - Discussion) - vanilla-cloud#3848 & vanilla-cloud#3816
Fix "_New" field appearing in user badge event payload- vanilla-cloud#3847
Update user Agent used for page scraper- vanilla-cloud#3846
Fix sending invalid search query when category filters are applied- vanilla-cloud#3843
Add charts thumbnails to new dashboard page VNLA-400- vanilla-cloud#3841
Changing to use logger, for error log.- vanilla-cloud#3842
Write unified discussion status definition for ideas when user defines ideation status- vanilla-cloud#3837
Write unified discussion status definition for ideas when user defines ideation status- vanilla-cloud#3837
Reduce the calls to the access token table- vanilla-cloud#3833
Add handler for TrackingEventInterface in analytics plugin- vanilla-cloud#3831
Add webhook events for ranks - vanilla-cloud#3828
Fix analytics visual bugs- vanilla-cloud#3826
Fix chromatic changing back and forth- vanilla-cloud#3825
Add User badge event- vanilla-cloud#3823
Add Users api token role- vanilla-cloud#3824
Adds "Copy Analytics Dashboard" feature- vanilla-cloud#3818
Add tests for response handling - vanilla-cloud#3815
Port ideation status definitions to new unified post statuses schema- vanilla-cloud#3814
Add role-token auth support to /api/v2/products- vanilla-cloud#3813
Add role name and role id fields to datasources and relabel null values in charts to 'other'- vanilla-cloud#3812
Fix html entities appearing in rank labels on leaderboards- vanilla-cloud#3811
Add `Object.fromEntries` to polyfill check- vanilla-cloud#3807
Prevent external creation of and modification to system-defined unified post statuses- vanilla-cloud#3805
Add Kb and Category IDs to subcommunity response- vanilla-cloud#3803
Fix chart presets- vanilla-cloud#3802
Fix pieGraph legends to horizontal - vanilla-cloud#3801
Add PHP security advisories to CI- vanilla-cloud#3800
Add Kaltura Embed support - vanilla-cloud#3799
Fix analytics lab item svg and add docs link into description - vanilla-cloud#3798
Update PHP Mailer- vanilla-cloud#3797
Fix showing duplicate Ideation filters dropdown when QnA addon enabled- vanilla-cloud#3795
Fix Analytics Permission Error- vanilla-cloud#3796
Simplify catalog options- vanilla-cloud#3790
Remove unneeded configurations from the rule model- vanilla-cloud#3782
Reverse permission check- vanilla-cloud#3773
Fix category events list returned empty by updating query- vanilla-cloud#3763

Bug Fixes

Fix ideation test corruption- vanilla-cloud#3875
Fix simple embed regression- vanilla-cloud#3870
Fix discussion moves being called discussions merged - vanilla-cloud#3867
Fix discussions widget breaking the request content type- vanilla-cloud#3863
Fix post tick error- vanilla-cloud#3862
Don’t let unconfirmed emails SSO to Zendesk- vanilla-cloud#3854
Don’t let exceptions in theme variable providers kill sites- vanilla-cloud#3853
SSO to Zendesk enhancements- vanilla-cloud#3840
Fix QnA unanswered count not getting correct subcommunity counts - vanilla-cloud#3839
Remove session storage synchronization across tabs- vanilla-cloud#3836
Fix text column false alters- vanilla-cloud#3835
Fix advanced embedded search page not rendering- vanilla-cloud#3832
Add the SSO to Zendesk addon- vanilla-cloud#3829
Fix charts number results formatting based on site locale - vanilla-cloud#3822
Fix Q&A tag return for translations- vanilla-cloud#3821
Fix restore discussion error by correcting bad log values- vanilla-cloud#3819
Fix issue where jsconnect was able to load other provider configs- vanilla-cloud#3804
Fix theme preview crashing on deleted themes - vanilla-cloud#3792