*,: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 2022.016

Schedule

Release 2022.016 will be deployed:

To staging sites, Tuesday, August 9th
To production sites, Monday, August 15th
To Enterprise clients, Monday, August 22nd

Call to Action Widget

We have added a Call to Action widget that allows to combine text, images and a linked button to create branded prompts and CTAs.

Guest Sign In Widget

We have added a widget allowing you to customize the messaging and style of the Guest Sign In module. Choose to add it to the main content section or in the side panel. A Sign In and Register link will remain in your header title bar.

Modern Embed Mechanism

We have added a new Modern Embed Mechanism that can be enabled from your Vanilla Labs page. Once the feature is enabled you will see an updated Embed Settings page where you can update the javascript on your site to use the new embed mechanism.

This new embed mechanism will replace the Universal Forum Embed for non-Wordpress sites. Our Vanilla Plugin for Wordpress and Universal Comment Embed will not be affected by this update.

Improvements

Correcting parameter name for pre-populated discussion type. #4862
Change base class of HttpExceptionTest to provide container- vanilla-cloud#4927
Change RSVP response property name- vanilla-cloud#4925
Add-indexes-for-statuses-in-discussion- vanilla-cloud#4922
Fix external image loading for tests- vanilla-cloud#4916
CTA widgets demo feedback- vanilla-cloud#4911
Add Guest Widget - vanilla-cloud#4902
Add a config call to NOT send cookies in the cURL request for user profile.- vanilla-cloud#4898
Clean up Status API- vanilla-cloud#4892
Fix user mentions long runner- vanilla-cloud#4889
Add Call to Action widget- vanilla-cloud#4888
Adds translation ability to not found error- vanilla-cloud#4879
Add validation to prevent setting garden.title to empty string- vanilla-cloud#4878
Fix prettier on offending files- vanilla-cloud#4877
Add batching of keen events- vanilla-cloud#4871
Remove keen write credentials exposure- vanilla-cloud#4867
Grammar-URL-Updates- vanilla-cloud#4864
Correcting parameter name for pre-populated discussion type.- vanilla-cloud#4862
Add bigger image size src-set option and prevent scale-up for Cloudflare- vanilla-cloud#4860
Add new modern embed - vanilla-cloud#4859
Adding signIn configs to settings/security- vanilla-cloud#4856

Bug Fixes

Fix errors from the 2022.015 release (including statuses) - vanilla-cloud#4919
Fix leaderboard widget inheriting image settings by passing content type of icon- vanilla-cloud#4914
Clear session cache after session is updated.- vanilla-cloud#4913
Fix role filtering and improve performance of user leaders queries- vanilla-cloud#4903
Fix idea counter crashing with a bad status- vanilla-cloud#4899
Fix discussion list ideation state filter not working - vanilla-cloud#4893
Restore the Ideation plugin's vote buttons by lowercasing field names and values- vanilla-cloud#4887
Removed `reported` discussions from the tabs widget `Recent Discussions` - vanilla-cloud#4886
Fix `RoleTracker` plugin triggering errors when adding tags over the allowed limit- vanilla-cloud#4870
Fix layout editor subcommunity errors- vanilla-cloud#4861
Fix discussion titles not appearing in status change notifications - vanilla-cloud#4857