@font-face { font-family: 'GilroyBold'; src: url('../fonts/gilroy/Gilroy-Bold.woff') format('woff'); } @font-face { font-family: 'GilroyHeavy'; src: url('../fonts/gilroy/Gilroy-Heavy.woff') format('woff'); } @font-face { font-family: 'GilroyLight'; src: url('../fonts/gilroy/Gilroy-Light.woff') format('woff'); } @font-face { font-family: 'GilroyMedium'; src: url('../fonts/gilroy/Gilroy-Medium.woff') format('woff'); } @font-face { font-family: 'GilroyRegular'; src: url('../fonts/gilroy/Gilroy-Regular.woff') format('woff'); } @font-face { font-family: 'GilroySemibold'; src: url('../fonts/gilroy/Gilroy-Semibold.woff') format('woff'); } .navbarcontainer { max-width: 100%; margin-left: 145px; margin-right: auto; } @media only screen and (max-width: 1700px) { .navbarcontainer { max-width: 100%; margin-left: auto; margin-right: auto; } } header { display: none; } body { overflow:hidden; background: linear-gradient(to top, white, white) fixed; } footer { display: none; } .bg-blue { display:none; } .owl-carousel, .owl-carousel .owl-item { -webkit-tap-highlight-color: rgba(0,0,0,0); position: relative } .owl-carousel { display: none; width: 100%; z-index: 1 } .owl-carousel .owl-stage { -moz-backface-visibility: hidden; position: relative; touch-action: manipulation } .owl-carousel .owl-stage:after { clear: both; content: "."; display: block; height: 0; line-height: 0; visibility: hidden } .owl-carousel .owl-stage-outer { overflow: hidden; position: relative; -webkit-transform: translateZ(0) } .owl-carousel .owl-item, .owl-carousel .owl-wrapper { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0) } .owl-carousel .owl-item { -webkit-touch-callout: none; -webkit-backface-visibility: hidden; float: left; min-height: 1px } .owl-carousel .owl-item img { display: block; width: 100% } .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled { display: none } .no-js .owl-carousel, .owl-carousel.owl-loaded { display: block } .owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev { cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none } .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot { background: 0 0; border: none; color: inherit; font: inherit; padding: 0 !important } .owl-carousel.owl-loading { display: block; opacity: 0 } .owl-carousel.owl-hidden { opacity: 0 } .owl-carousel.owl-refresh .owl-item { visibility: hidden } .owl-carousel.owl-drag .owl-item { touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; user-select: none } .owl-carousel.owl-grab { cursor: move; cursor: grab } .owl-carousel.owl-rtl { direction: rtl } .owl-carousel.owl-rtl .owl-item { float: right } .owl-carousel .animated { animation-duration: 1s; animation-fill-mode: both } .owl-carousel .owl-animated-in { z-index: 0 } .owl-carousel .owl-animated-out { z-index: 1 } .owl-carousel .fadeOut { animation-name: fadeOut } @keyframes fadeOut { 0% { opacity: 1 } to { opacity: 0 } } .owl-height { transition: height .5s ease-in-out } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity .4s ease } .owl-carousel .owl-item .owl-lazy:not([src]), .owl-carousel .owl-item .owl-lazy[src^=""] { max-height: 0 } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d } .owl-carousel .owl-video-wrapper { background: #000; height: 100%; position: relative } .owl-carousel .owl-video-play-icon { -webkit-backface-visibility: hidden; background: url(servicenow-www-pagelibs-v2/css/owl.video.play.png) no-repeat; cursor: pointer; height: 80px; left: 50%; margin-left: -40px; margin-top: -40px; position: absolute; top: 50%; transition: transform .1s ease; width: 80px; z-index: 1 } .owl-carousel .owl-video-play-icon:hover { transform: scale(1.3) } .owl-carousel .owl-video-playing .owl-video-play-icon, .owl-carousel .owl-video-playing .owl-video-tn { display: none } .owl-carousel .owl-video-tn { background-position: 50%; background-repeat: no-repeat; background-size: contain; height: 100%; opacity: 0; transition: opacity .4s ease } .owl-carousel .owl-video-frame { height: 100%; position: relative; width: 100%; z-index: 1 } .owl-theme .owl-dots, .owl-theme .owl-nav { -webkit-tap-highlight-color: rgba(0,0,0,0); text-align: center } .owl-theme .owl-nav { margin-top: 10px } .owl-theme .owl-nav [class*=owl-] { background: #d6d6d6; border-radius: 3px; color: #fff; cursor: pointer; display: inline-block; font-size: 14px; margin: 5px; padding: 4px 7px } .owl-theme .owl-nav [class*=owl-]:hover { background: #869791; color: #fff; text-decoration: none } .owl-theme .owl-nav .disabled { cursor: default; opacity: .5 } .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 10px } .owl-theme .owl-dots .owl-dot { zoom: 1; display: inline-block } .owl-theme .owl-dots .owl-dot span { -webkit-backface-visibility: visible; background: #d6d6d6; border-radius: 30px; display: block; height: 10px; margin: 5px 7px; transition: opacity .2s ease; width: 10px } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791 } /*! * Bootstrap Grid v4.1.2 (https://getbootstrap.com/) * Copyright 2011-2018 The Bootstrap Authors * Copyright 2011-2018 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) */ html { -ms-overflow-style: scrollbar } *, :after, :before { box-sizing: inherit } .container { margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; width: 100% } @media(min-width: 576px) { .container { max-width: 540px } } @media(min-width: 768px) { .container { max-width: 720px } } @media(min-width: 1024px) { .container { max-width: 960px } } @media(min-width: 1700px) { .container { max-width: 1700px } } .container-fluid { margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; width: 100% } .row { display: flex; flex-wrap: wrap; margin-left: -15px; margin-right: -15px } .no-gutters { margin-left: 0; margin-right: 0 } .no-gutters > .col, .no-gutters > [class*=col-] { padding-left: 0; padding-right: 0 } .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { min-height: 1px; padding-left: 15px; padding-right: 15px; position: relative; width: 100% } .col { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-auto { flex: 0 0 auto; max-width: none; width: auto } .col-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .col-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .col-3 { flex: 0 0 25%; max-width: 25% } .col-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .col-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .col-6 { flex: 0 0 50%; max-width: 50% } .col-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .col-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .col-9 { flex: 0 0 75%; max-width: 75% } .col-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .col-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .col-12 { flex: 0 0 100%; max-width: 100% } .order-first { order: -1 } .order-last { order: 13 } .order-0 { order: 0 } .order-1 { order: 1 } .order-2 { order: 2 } .order-3 { order: 3 } .order-4 { order: 4 } .order-5 { order: 5 } .order-6 { order: 6 } .order-7 { order: 7 } .order-8 { order: 8 } .order-9 { order: 9 } .order-10 { order: 10 } .order-11 { order: 11 } .order-12 { order: 12 } .offset-1 { margin-left: 8.3333333333% } .offset-2 { margin-left: 16.6666666667% } .offset-3 { margin-left: 25% } .offset-4 { margin-left: 33.3333333333% } .offset-5 { margin-left: 41.6666666667% } .offset-6 { margin-left: 50% } .offset-7 { margin-left: 58.3333333333% } .offset-8 { margin-left: 66.6666666667% } .offset-9 { margin-left: 75% } .offset-10 { margin-left: 83.3333333333% } .offset-11 { margin-left: 91.6666666667% } @media(min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-sm-auto { flex: 0 0 auto; max-width: none; width: auto } .col-sm-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .col-sm-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .col-sm-3 { flex: 0 0 25%; max-width: 25% } .col-sm-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .col-sm-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .col-sm-6 { flex: 0 0 50%; max-width: 50% } .col-sm-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .col-sm-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .col-sm-9 { flex: 0 0 75%; max-width: 75% } .col-sm-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .col-sm-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .col-sm-12 { flex: 0 0 100%; max-width: 100% } .order-sm-first { order: -1 } .order-sm-last { order: 13 } .order-sm-0 { order: 0 } .order-sm-1 { order: 1 } .order-sm-2 { order: 2 } .order-sm-3 { order: 3 } .order-sm-4 { order: 4 } .order-sm-5 { order: 5 } .order-sm-6 { order: 6 } .order-sm-7 { order: 7 } .order-sm-8 { order: 8 } .order-sm-9 { order: 9 } .order-sm-10 { order: 10 } .order-sm-11 { order: 11 } .order-sm-12 { order: 12 } .offset-sm-0 { margin-left: 0 } .offset-sm-1 { margin-left: 8.3333333333% } .offset-sm-2 { margin-left: 16.6666666667% } .offset-sm-3 { margin-left: 25% } .offset-sm-4 { margin-left: 33.3333333333% } .offset-sm-5 { margin-left: 41.6666666667% } .offset-sm-6 { margin-left: 50% } .offset-sm-7 { margin-left: 58.3333333333% } .offset-sm-8 { margin-left: 66.6666666667% } .offset-sm-9 { margin-left: 75% } .offset-sm-10 { margin-left: 83.3333333333% } .offset-sm-11 { margin-left: 91.6666666667% } } @media(min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-md-auto { flex: 0 0 auto; max-width: none; width: auto } .col-md-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .col-md-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .col-md-3 { flex: 0 0 25%; max-width: 25% } .col-md-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .col-md-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .col-md-6 { flex: 0 0 50%; max-width: 50% } .col-md-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .col-md-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .col-md-9 { flex: 0 0 75%; max-width: 75% } .col-md-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .col-md-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .col-md-12 { flex: 0 0 100%; max-width: 100% } .order-md-first { order: -1 } .order-md-last { order: 13 } .order-md-0 { order: 0 } .order-md-1 { order: 1 } .order-md-2 { order: 2 } .order-md-3 { order: 3 } .order-md-4 { order: 4 } .order-md-5 { order: 5 } .order-md-6 { order: 6 } .order-md-7 { order: 7 } .order-md-8 { order: 8 } .order-md-9 { order: 9 } .order-md-10 { order: 10 } .order-md-11 { order: 11 } .order-md-12 { order: 12 } .offset-md-0 { margin-left: 0 } .offset-md-1 { margin-left: 8.3333333333% } .offset-md-2 { margin-left: 16.6666666667% } .offset-md-3 { margin-left: 25% } .offset-md-4 { margin-left: 33.3333333333% } .offset-md-5 { margin-left: 41.6666666667% } .offset-md-6 { margin-left: 50% } .offset-md-7 { margin-left: 58.3333333333% } .offset-md-8 { margin-left: 66.6666666667% } .offset-md-9 { margin-left: 75% } .offset-md-10 { margin-left: 83.3333333333% } .offset-md-11 { margin-left: 91.6666666667% } } @media(min-width: 1024px) { .col-lg { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-lg-auto { flex: 0 0 auto; max-width: none; width: auto } .col-lg-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .col-lg-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .col-lg-3 { flex: 0 0 25%; max-width: 25% } .col-lg-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .col-lg-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .col-lg-6 { flex: 0 0 50%; max-width: 50% } .col-lg-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .col-lg-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .col-lg-9 { flex: 0 0 75%; max-width: 75% } .col-lg-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .col-lg-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .col-lg-12 { flex: 0 0 100%; max-width: 100% } .order-lg-first { order: -1 } .order-lg-last { order: 13 } .order-lg-0 { order: 0 } .order-lg-1 { order: 1 } .order-lg-2 { order: 2 } .order-lg-3 { order: 3 } .order-lg-4 { order: 4 } .order-lg-5 { order: 5 } .order-lg-6 { order: 6 } .order-lg-7 { order: 7 } .order-lg-8 { order: 8 } .order-lg-9 { order: 9 } .order-lg-10 { order: 10 } .order-lg-11 { order: 11 } .order-lg-12 { order: 12 } .offset-lg-0 { margin-left: 0 } .offset-lg-1 { margin-left: 8.3333333333% } .offset-lg-2 { margin-left: 16.6666666667% } .offset-lg-3 { margin-left: 25% } .offset-lg-4 { margin-left: 33.3333333333% } .offset-lg-5 { margin-left: 41.6666666667% } .offset-lg-6 { margin-left: 50% } .offset-lg-7 { margin-left: 58.3333333333% } .offset-lg-8 { margin-left: 66.6666666667% } .offset-lg-9 { margin-left: 75% } .offset-lg-10 { margin-left: 83.3333333333% } .offset-lg-11 { margin-left: 91.6666666667% } } @media(min-width: 1700px) { .col-xl { flex-basis: 0; flex-grow: 1; max-width: 100% } .col-xl-auto { flex: 0 0 auto; max-width: none; width: auto } .col-xl-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333% } .col-xl-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667% } .col-xl-3 { flex: 0 0 25%; max-width: 25% } .col-xl-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333% } .col-xl-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667% } .col-xl-6 { flex: 0 0 50%; max-width: 50% } .col-xl-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333% } .col-xl-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667% } .col-xl-9 { flex: 0 0 75%; max-width: 75% } .col-xl-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333% } .col-xl-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667% } .col-xl-12 { flex: 0 0 100%; max-width: 100% } .order-xl-first { order: -1 } .order-xl-last { order: 13 } .order-xl-0 { order: 0 } .order-xl-1 { order: 1 } .order-xl-2 { order: 2 } .order-xl-3 { order: 3 } .order-xl-4 { order: 4 } .order-xl-5 { order: 5 } .order-xl-6 { order: 6 } .order-xl-7 { order: 7 } .order-xl-8 { order: 8 } .order-xl-9 { order: 9 } .order-xl-10 { order: 10 } .order-xl-11 { order: 11 } .order-xl-12 { order: 12 } .offset-xl-0 { margin-left: 0 } .offset-xl-1 { margin-left: 8.3333333333% } .offset-xl-2 { margin-left: 16.6666666667% } .offset-xl-3 { margin-left: 25% } .offset-xl-4 { margin-left: 33.3333333333% } .offset-xl-5 { margin-left: 41.6666666667% } .offset-xl-6 { margin-left: 50% } .offset-xl-7 { margin-left: 58.3333333333% } .offset-xl-8 { margin-left: 66.6666666667% } .offset-xl-9 { margin-left: 75% } .offset-xl-10 { margin-left: 83.3333333333% } .offset-xl-11 { margin-left: 91.6666666667% } } .d-none { display: none !important } .d-inline { display: inline !important } .d-inline-block { display: inline-block !important } .d-block { display: block !important } .d-table { display: table !important } .d-table-row { display: table-row !important } .d-table-cell { display: table-cell !important } .d-flex { display: flex !important } .d-inline-flex { display: inline-flex !important } @media(min-width: 576px) { .d-sm-none { display: none !important } .d-sm-inline { display: inline !important } .d-sm-inline-block { display: inline-block !important } .d-sm-block { display: block !important } .d-sm-table { display: table !important } .d-sm-table-row { display: table-row !important } .d-sm-table-cell { display: table-cell !important } .d-sm-flex { display: flex !important } .d-sm-inline-flex { display: inline-flex !important } } @media(min-width: 768px) { .d-md-none { display: none !important } .d-md-inline { display: inline !important } .d-md-inline-block { display: inline-block !important } .d-md-block { display: block !important } .d-md-table { display: table !important } .d-md-table-row { display: table-row !important } .d-md-table-cell { display: table-cell !important } .d-md-flex { display: flex !important } .d-md-inline-flex { display: inline-flex !important } } @media(min-width: 1024px) { .d-lg-none { display: none !important } .d-lg-inline { display: inline !important } .d-lg-inline-block { display: inline-block !important } .d-lg-block { display: block !important } .d-lg-table { display: table !important } .d-lg-table-row { display: table-row !important } .d-lg-table-cell { display: table-cell !important } .d-lg-flex { display: flex !important } .d-lg-inline-flex { display: inline-flex !important } } @media(min-width: 1700px) { .d-xl-none { display: none !important } .d-xl-inline { display: inline !important } .d-xl-inline-block { display: inline-block !important } .d-xl-block { display: block !important } .d-xl-table { display: table !important } .d-xl-table-row { display: table-row !important } .d-xl-table-cell { display: table-cell !important } .d-xl-flex { display: flex !important } .d-xl-inline-flex { display: inline-flex !important } } @media print { .d-print-none { display: none !important } .d-print-inline { display: inline !important } .d-print-inline-block { display: inline-block !important } .d-print-block { display: block !important } .d-print-table { display: table !important } .d-print-table-row { display: table-row !important } .d-print-table-cell { display: table-cell !important } .d-print-flex { display: flex !important } .d-print-inline-flex { display: inline-flex !important } } .flex-row { flex-direction: row !important } .flex-column { flex-direction: column !important } .flex-row-reverse { flex-direction: row-reverse !important } .flex-column-reverse { flex-direction: column-reverse !important } .flex-wrap { flex-wrap: wrap !important } .flex-nowrap { flex-wrap: nowrap !important } .flex-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-fill { flex: 1 1 auto !important } .flex-grow-0 { flex-grow: 0 !important } .flex-grow-1 { flex-grow: 1 !important } .flex-shrink-0 { flex-shrink: 0 !important } .flex-shrink-1 { flex-shrink: 1 !important } .justify-content-start { justify-content: flex-start !important } .justify-content-end { justify-content: flex-end !important } .justify-content-center { justify-content: center !important } .justify-content-between { justify-content: space-between !important } .justify-content-around { justify-content: space-around !important } .align-items-start { align-items: flex-start !important } .align-items-end { align-items: flex-end !important } .align-items-center { align-items: center !important } .align-items-baseline { align-items: baseline !important } .align-items-stretch { align-items: stretch !important } .align-content-start { align-content: flex-start !important } .align-content-end { align-content: flex-end !important } .align-content-center { align-content: center !important } .align-content-between { align-content: space-between !important } .align-content-around { align-content: space-around !important } .align-content-stretch { align-content: stretch !important } .align-self-auto { align-self: auto !important } .align-self-start { align-self: flex-start !important } .align-self-end { align-self: flex-end !important } .align-self-center { align-self: center !important } .align-self-baseline { align-self: baseline !important } .align-self-stretch { align-self: stretch !important } @media(min-width: 576px) { .flex-sm-row { flex-direction: row !important } .flex-sm-column { flex-direction: column !important } .flex-sm-row-reverse { flex-direction: row-reverse !important } .flex-sm-column-reverse { flex-direction: column-reverse !important } .flex-sm-wrap { flex-wrap: wrap !important } .flex-sm-nowrap { flex-wrap: nowrap !important } .flex-sm-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-sm-fill { flex: 1 1 auto !important } .flex-sm-grow-0 { flex-grow: 0 !important } .flex-sm-grow-1 { flex-grow: 1 !important } .flex-sm-shrink-0 { flex-shrink: 0 !important } .flex-sm-shrink-1 { flex-shrink: 1 !important } .justify-content-sm-start { justify-content: flex-start !important } .justify-content-sm-end { justify-content: flex-end !important } .justify-content-sm-center { justify-content: center !important } .justify-content-sm-between { justify-content: space-between !important } .justify-content-sm-around { justify-content: space-around !important } .align-items-sm-start { align-items: flex-start !important } .align-items-sm-end { align-items: flex-end !important } .align-items-sm-center { align-items: center !important } .align-items-sm-baseline { align-items: baseline !important } .align-items-sm-stretch { align-items: stretch !important } .align-content-sm-start { align-content: flex-start !important } .align-content-sm-end { align-content: flex-end !important } .align-content-sm-center { align-content: center !important } .align-content-sm-between { align-content: space-between !important } .align-content-sm-around { align-content: space-around !important } .align-content-sm-stretch { align-content: stretch !important } .align-self-sm-auto { align-self: auto !important } .align-self-sm-start { align-self: flex-start !important } .align-self-sm-end { align-self: flex-end !important } .align-self-sm-center { align-self: center !important } .align-self-sm-baseline { align-self: baseline !important } .align-self-sm-stretch { align-self: stretch !important } } @media(min-width: 768px) { .flex-md-row { flex-direction: row !important } .flex-md-column { flex-direction: column !important } .flex-md-row-reverse { flex-direction: row-reverse !important } .flex-md-column-reverse { flex-direction: column-reverse !important } .flex-md-wrap { flex-wrap: wrap !important } .flex-md-nowrap { flex-wrap: nowrap !important } .flex-md-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-md-fill { flex: 1 1 auto !important } .flex-md-grow-0 { flex-grow: 0 !important } .flex-md-grow-1 { flex-grow: 1 !important } .flex-md-shrink-0 { flex-shrink: 0 !important } .flex-md-shrink-1 { flex-shrink: 1 !important } .justify-content-md-start { justify-content: flex-start !important } .justify-content-md-end { justify-content: flex-end !important } .justify-content-md-center { justify-content: center !important } .justify-content-md-between { justify-content: space-between !important } .justify-content-md-around { justify-content: space-around !important } .align-items-md-start { align-items: flex-start !important } .align-items-md-end { align-items: flex-end !important } .align-items-md-center { align-items: center !important } .align-items-md-baseline { align-items: baseline !important } .align-items-md-stretch { align-items: stretch !important } .align-content-md-start { align-content: flex-start !important } .align-content-md-end { align-content: flex-end !important } .align-content-md-center { align-content: center !important } .align-content-md-between { align-content: space-between !important } .align-content-md-around { align-content: space-around !important } .align-content-md-stretch { align-content: stretch !important } .align-self-md-auto { align-self: auto !important } .align-self-md-start { align-self: flex-start !important } .align-self-md-end { align-self: flex-end !important } .align-self-md-center { align-self: center !important } .align-self-md-baseline { align-self: baseline !important } .align-self-md-stretch { align-self: stretch !important } } @media(min-width: 1024px) { .flex-lg-row { flex-direction: row !important } .flex-lg-column { flex-direction: column !important } .flex-lg-row-reverse { flex-direction: row-reverse !important } .flex-lg-column-reverse { flex-direction: column-reverse !important } .flex-lg-wrap { flex-wrap: wrap !important } .flex-lg-nowrap { flex-wrap: nowrap !important } .flex-lg-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-lg-fill { flex: 1 1 auto !important } .flex-lg-grow-0 { flex-grow: 0 !important } .flex-lg-grow-1 { flex-grow: 1 !important } .flex-lg-shrink-0 { flex-shrink: 0 !important } .flex-lg-shrink-1 { flex-shrink: 1 !important } .justify-content-lg-start { justify-content: flex-start !important } .justify-content-lg-end { justify-content: flex-end !important } .justify-content-lg-center { justify-content: center !important } .justify-content-lg-between { justify-content: space-between !important } .justify-content-lg-around { justify-content: space-around !important } .align-items-lg-start { align-items: flex-start !important } .align-items-lg-end { align-items: flex-end !important } .align-items-lg-center { align-items: center !important } .align-items-lg-baseline { align-items: baseline !important } .align-items-lg-stretch { align-items: stretch !important } .align-content-lg-start { align-content: flex-start !important } .align-content-lg-end { align-content: flex-end !important } .align-content-lg-center { align-content: center !important } .align-content-lg-between { align-content: space-between !important } .align-content-lg-around { align-content: space-around !important } .align-content-lg-stretch { align-content: stretch !important } .align-self-lg-auto { align-self: auto !important } .align-self-lg-start { align-self: flex-start !important } .align-self-lg-end { align-self: flex-end !important } .align-self-lg-center { align-self: center !important } .align-self-lg-baseline { align-self: baseline !important } .align-self-lg-stretch { align-self: stretch !important } } @media(min-width: 1700px) { .flex-xl-row { flex-direction: row !important } .flex-xl-column { flex-direction: column !important } .flex-xl-row-reverse { flex-direction: row-reverse !important } .flex-xl-column-reverse { flex-direction: column-reverse !important } .flex-xl-wrap { flex-wrap: wrap !important } .flex-xl-nowrap { flex-wrap: nowrap !important } .flex-xl-wrap-reverse { flex-wrap: wrap-reverse !important } .flex-xl-fill { flex: 1 1 auto !important } .flex-xl-grow-0 { flex-grow: 0 !important } .flex-xl-grow-1 { flex-grow: 1 !important } .flex-xl-shrink-0 { flex-shrink: 0 !important } .flex-xl-shrink-1 { flex-shrink: 1 !important } .justify-content-xl-start { justify-content: flex-start !important } .justify-content-xl-end { justify-content: flex-end !important } .justify-content-xl-center { justify-content: center !important } .justify-content-xl-between { justify-content: space-between !important } .justify-content-xl-around { justify-content: space-around !important } .align-items-xl-start { align-items: flex-start !important } .align-items-xl-end { align-items: flex-end !important } .align-items-xl-center { align-items: center !important } .align-items-xl-baseline { align-items: baseline !important } .align-items-xl-stretch { align-items: stretch !important } .align-content-xl-start { align-content: flex-start !important } .align-content-xl-end { align-content: flex-end !important } .align-content-xl-center { align-content: center !important } .align-content-xl-between { align-content: space-between !important } .align-content-xl-around { align-content: space-around !important } .align-content-xl-stretch { align-content: stretch !important } .align-self-xl-auto { align-self: auto !important } .align-self-xl-start { align-self: flex-start !important } .align-self-xl-end { align-self: flex-end !important } .align-self-xl-center { align-self: center !important } .align-self-xl-baseline { align-self: baseline !important } .align-self-xl-stretch { align-self: stretch !important } } .w-25 { width: 25% !important } .w-50 { width: 50% !important } .w-75 { width: 75% !important } .w-100 { width: 100% !important } .w-auto { width: auto !important } .h-25 { height: 25% !important } .h-50 { height: 50% !important } .h-75 { height: 75% !important } .h-100 { height: 100% !important } .h-auto { height: auto !important } .mw-100 { max-width: 100% !important } .mh-100 { max-height: 100% !important } .m-0 { margin: 0 !important } .mt-0, .my-0 { margin-top: 0 !important } .mr-0, .mx-0 { margin-right: 0 !important } .mb-0, .my-0 { margin-bottom: 0 !important } .ml-0, .mx-0 { margin-left: 0 !important } .m-1 { margin: .25rem !important } .mt-1, .my-1 { margin-top: .25rem !important } .mr-1, .mx-1 { margin-right: .25rem !important } .mb-1, .my-1 { margin-bottom: .25rem !important } .ml-1, .mx-1 { margin-left: .25rem !important } .m-2 { margin: .5rem !important } .mt-2, .my-2 { margin-top: .5rem !important } .mr-2, .mx-2 { margin-right: .5rem !important } .mb-2, .my-2 { margin-bottom: .5rem !important } .ml-2, .mx-2 { margin-left: .5rem !important } .m-3 { margin: 1rem !important } .mt-3, .my-3 { margin-top: 1rem !important } .mr-3, .mx-3 { margin-right: 1rem !important } .mb-3, .my-3 { margin-bottom: 1rem !important } .ml-3, .mx-3 { margin-left: 1rem !important } .m-4 { margin: 1.5rem !important } .mt-4, .my-4 { margin-top: 1.5rem !important } .mr-4, .mx-4 { margin-right: 1.5rem !important } .mb-4, .my-4 { margin-bottom: 1.5rem !important } .ml-4, .mx-4 { margin-left: 1.5rem !important } .m-5 { margin: 3rem !important } .mt-5, .my-5 { margin-top: 3rem !important } .mr-5, .mx-5 { margin-right: 3rem !important } .mb-5, .my-5 { margin-bottom: 3rem !important } .ml-5, .mx-5 { margin-left: 3rem !important } .p-0 { padding: 0 !important } .pt-0, .py-0 { padding-top: 0 !important } .pr-0, .px-0 { padding-right: 0 !important } .pb-0, .py-0 { padding-bottom: 0 !important } .pl-0, .px-0 { padding-left: 0 !important } .p-1 { padding: .25rem !important } .pt-1, .py-1 { padding-top: .25rem !important } .pr-1, .px-1 { padding-right: .25rem !important } .pb-1, .py-1 { padding-bottom: .25rem !important } .pl-1, .px-1 { padding-left: .25rem !important } .p-2 { padding: .5rem !important } .pt-2, .py-2 { padding-top: .5rem !important } .pr-2, .px-2 { padding-right: .5rem !important } .pb-2, .py-2 { padding-bottom: .5rem !important } .pl-2, .px-2 { padding-left: .5rem !important } .p-3 { padding: 1rem !important } .pt-3, .py-3 { padding-top: 1rem !important } .pr-3, .px-3 { padding-right: 1rem !important } .pb-3, .py-3 { padding-bottom: 1rem !important } .pl-3, .px-3 { padding-left: 1rem !important } .p-4 { padding: 1.5rem !important } .pt-4, .py-4 { padding-top: 1.5rem !important } .pr-4, .px-4 { padding-right: 1.5rem !important } .pb-4, .py-4 { padding-bottom: 1.5rem !important } .pl-4, .px-4 { padding-left: 1.5rem !important } .p-5 { padding: 3rem !important } .pt-5, .py-5 { padding-top: 3rem !important } .pr-5, .px-5 { padding-right: 3rem !important } .pb-5, .py-5 { padding-bottom: 3rem !important } .pl-5, .px-5 { padding-left: 3rem !important } .m-auto { margin: auto !important } .mt-auto, .my-auto { margin-top: auto !important } .mr-auto, .mx-auto { margin-right: auto !important } .mb-auto, .my-auto { margin-bottom: auto !important } .ml-auto, .mx-auto { margin-left: auto !important } @media(min-width: 576px) { .m-sm-0 { margin: 0 !important } .mt-sm-0, .my-sm-0 { margin-top: 0 !important } .mr-sm-0, .mx-sm-0 { margin-right: 0 !important } .mb-sm-0, .my-sm-0 { margin-bottom: 0 !important } .ml-sm-0, .mx-sm-0 { margin-left: 0 !important } .m-sm-1 { margin: .25rem !important } .mt-sm-1, .my-sm-1 { margin-top: .25rem !important } .mr-sm-1, .mx-sm-1 { margin-right: .25rem !important } .mb-sm-1, .my-sm-1 { margin-bottom: .25rem !important } .ml-sm-1, .mx-sm-1 { margin-left: .25rem !important } .m-sm-2 { margin: .5rem !important } .mt-sm-2, .my-sm-2 { margin-top: .5rem !important } .mr-sm-2, .mx-sm-2 { margin-right: .5rem !important } .mb-sm-2, .my-sm-2 { margin-bottom: .5rem !important } .ml-sm-2, .mx-sm-2 { margin-left: .5rem !important } .m-sm-3 { margin: 1rem !important } .mt-sm-3, .my-sm-3 { margin-top: 1rem !important } .mr-sm-3, .mx-sm-3 { margin-right: 1rem !important } .mb-sm-3, .my-sm-3 { margin-bottom: 1rem !important } .ml-sm-3, .mx-sm-3 { margin-left: 1rem !important } .m-sm-4 { margin: 1.5rem !important } .mt-sm-4, .my-sm-4 { margin-top: 1.5rem !important } .mr-sm-4, .mx-sm-4 { margin-right: 1.5rem !important } .mb-sm-4, .my-sm-4 { margin-bottom: 1.5rem !important } .ml-sm-4, .mx-sm-4 { margin-left: 1.5rem !important } .m-sm-5 { margin: 3rem !important } .mt-sm-5, .my-sm-5 { margin-top: 3rem !important } .mr-sm-5, .mx-sm-5 { margin-right: 3rem !important } .mb-sm-5, .my-sm-5 { margin-bottom: 3rem !important } .ml-sm-5, .mx-sm-5 { margin-left: 3rem !important } .p-sm-0 { padding: 0 !important } .pt-sm-0, .py-sm-0 { padding-top: 0 !important } .pr-sm-0, .px-sm-0 { padding-right: 0 !important } .pb-sm-0, .py-sm-0 { padding-bottom: 0 !important } .pl-sm-0, .px-sm-0 { padding-left: 0 !important } .p-sm-1 { padding: .25rem !important } .pt-sm-1, .py-sm-1 { padding-top: .25rem !important } .pr-sm-1, .px-sm-1 { padding-right: .25rem !important } .pb-sm-1, .py-sm-1 { padding-bottom: .25rem !important } .pl-sm-1, .px-sm-1 { padding-left: .25rem !important } .p-sm-2 { padding: .5rem !important } .pt-sm-2, .py-sm-2 { padding-top: .5rem !important } .pr-sm-2, .px-sm-2 { padding-right: .5rem !important } .pb-sm-2, .py-sm-2 { padding-bottom: .5rem !important } .pl-sm-2, .px-sm-2 { padding-left: .5rem !important } .p-sm-3 { padding: 1rem !important } .pt-sm-3, .py-sm-3 { padding-top: 1rem !important } .pr-sm-3, .px-sm-3 { padding-right: 1rem !important } .pb-sm-3, .py-sm-3 { padding-bottom: 1rem !important } .pl-sm-3, .px-sm-3 { padding-left: 1rem !important } .p-sm-4 { padding: 1.5rem !important } .pt-sm-4, .py-sm-4 { padding-top: 1.5rem !important } .pr-sm-4, .px-sm-4 { padding-right: 1.5rem !important } .pb-sm-4, .py-sm-4 { padding-bottom: 1.5rem !important } .pl-sm-4, .px-sm-4 { padding-left: 1.5rem !important } .p-sm-5 { padding: 3rem !important } .pt-sm-5, .py-sm-5 { padding-top: 3rem !important } .pr-sm-5, .px-sm-5 { padding-right: 3rem !important } .pb-sm-5, .py-sm-5 { padding-bottom: 3rem !important } .pl-sm-5, .px-sm-5 { padding-left: 3rem !important } .m-sm-auto { margin: auto !important } .mt-sm-auto, .my-sm-auto { margin-top: auto !important } .mr-sm-auto, .mx-sm-auto { margin-right: auto !important } .mb-sm-auto, .my-sm-auto { margin-bottom: auto !important } .ml-sm-auto, .mx-sm-auto { margin-left: auto !important } } @media(min-width: 768px) { .m-md-0 { margin: 0 !important } .mt-md-0, .my-md-0 { margin-top: 0 !important } .mr-md-0, .mx-md-0 { margin-right: 0 !important } .mb-md-0, .my-md-0 { margin-bottom: 0 !important } .ml-md-0, .mx-md-0 { margin-left: 0 !important } .m-md-1 { margin: .25rem !important } .mt-md-1, .my-md-1 { margin-top: .25rem !important } .mr-md-1, .mx-md-1 { margin-right: .25rem !important } .mb-md-1, .my-md-1 { margin-bottom: .25rem !important } .ml-md-1, .mx-md-1 { margin-left: .25rem !important } .m-md-2 { margin: .5rem !important } .mt-md-2, .my-md-2 { margin-top: .5rem !important } .mr-md-2, .mx-md-2 { margin-right: .5rem !important } .mb-md-2, .my-md-2 { margin-bottom: .5rem !important } .ml-md-2, .mx-md-2 { margin-left: .5rem !important } .m-md-3 { margin: 1rem !important } .mt-md-3, .my-md-3 { margin-top: 1rem !important } .mr-md-3, .mx-md-3 { margin-right: 1rem !important } .mb-md-3, .my-md-3 { margin-bottom: 1rem !important } .ml-md-3, .mx-md-3 { margin-left: 1rem !important } .m-md-4 { margin: 1.5rem !important } .mt-md-4, .my-md-4 { margin-top: 1.5rem !important } .mr-md-4, .mx-md-4 { margin-right: 1.5rem !important } .mb-md-4, .my-md-4 { margin-bottom: 1.5rem !important } .ml-md-4, .mx-md-4 { margin-left: 1.5rem !important } .m-md-5 { margin: 3rem !important } .mt-md-5, .my-md-5 { margin-top: 3rem !important } .mr-md-5, .mx-md-5 { margin-right: 3rem !important } .mb-md-5, .my-md-5 { margin-bottom: 3rem !important } .ml-md-5, .mx-md-5 { margin-left: 3rem !important } .p-md-0 { padding: 0 !important } .pt-md-0, .py-md-0 { padding-top: 0 !important } .pr-md-0, .px-md-0 { padding-right: 0 !important } .pb-md-0, .py-md-0 { padding-bottom: 0 !important } .pl-md-0, .px-md-0 { padding-left: 0 !important } .p-md-1 { padding: .25rem !important } .pt-md-1, .py-md-1 { padding-top: .25rem !important } .pr-md-1, .px-md-1 { padding-right: .25rem !important } .pb-md-1, .py-md-1 { padding-bottom: .25rem !important } .pl-md-1, .px-md-1 { padding-left: .25rem !important } .p-md-2 { padding: .5rem !important } .pt-md-2, .py-md-2 { padding-top: .5rem !important } .pr-md-2, .px-md-2 { padding-right: .5rem !important } .pb-md-2, .py-md-2 { padding-bottom: .5rem !important } .pl-md-2, .px-md-2 { padding-left: .5rem !important } .p-md-3 { padding: 1rem !important } .pt-md-3, .py-md-3 { padding-top: 1rem !important } .pr-md-3, .px-md-3 { padding-right: 1rem !important } .pb-md-3, .py-md-3 { padding-bottom: 1rem !important } .pl-md-3, .px-md-3 { padding-left: 1rem !important } .p-md-4 { padding: 1.5rem !important } .pt-md-4, .py-md-4 { padding-top: 1.5rem !important } .pr-md-4, .px-md-4 { padding-right: 1.5rem !important } .pb-md-4, .py-md-4 { padding-bottom: 1.5rem !important } .pl-md-4, .px-md-4 { padding-left: 1.5rem !important } .p-md-5 { padding: 3rem !important } .pt-md-5, .py-md-5 { padding-top: 3rem !important } .pr-md-5, .px-md-5 { padding-right: 3rem !important } .pb-md-5, .py-md-5 { padding-bottom: 3rem !important } .pl-md-5, .px-md-5 { padding-left: 3rem !important } .m-md-auto { margin: auto !important } .mt-md-auto, .my-md-auto { margin-top: auto !important } .mr-md-auto, .mx-md-auto { margin-right: auto !important } .mb-md-auto, .my-md-auto { margin-bottom: auto !important } .ml-md-auto, .mx-md-auto { margin-left: auto !important } } @media(min-width: 1024px) { .m-lg-0 { margin: 0 !important } .mt-lg-0, .my-lg-0 { margin-top: 0 !important } .mr-lg-0, .mx-lg-0 { margin-right: 0 !important } .mb-lg-0, .my-lg-0 { margin-bottom: 0 !important } .ml-lg-0, .mx-lg-0 { margin-left: 0 !important } .m-lg-1 { margin: .25rem !important } .mt-lg-1, .my-lg-1 { margin-top: .25rem !important } .mr-lg-1, .mx-lg-1 { margin-right: .25rem !important } .mb-lg-1, .my-lg-1 { margin-bottom: .25rem !important } .ml-lg-1, .mx-lg-1 { margin-left: .25rem !important } .m-lg-2 { margin: .5rem !important } .mt-lg-2, .my-lg-2 { margin-top: .5rem !important } .mr-lg-2, .mx-lg-2 { margin-right: .5rem !important } .mb-lg-2, .my-lg-2 { margin-bottom: .5rem !important } .ml-lg-2, .mx-lg-2 { margin-left: .5rem !important } .m-lg-3 { margin: 1rem !important } .mt-lg-3, .my-lg-3 { margin-top: 1rem !important } .mr-lg-3, .mx-lg-3 { margin-right: 1rem !important } .mb-lg-3, .my-lg-3 { margin-bottom: 1rem !important } .ml-lg-3, .mx-lg-3 { margin-left: 1rem !important } .m-lg-4 { margin: 1.5rem !important } .mt-lg-4, .my-lg-4 { margin-top: 1.5rem !important } .mr-lg-4, .mx-lg-4 { margin-right: 1.5rem !important } .mb-lg-4, .my-lg-4 { margin-bottom: 1.5rem !important } .ml-lg-4, .mx-lg-4 { margin-left: 1.5rem !important } .m-lg-5 { margin: 3rem !important } .mt-lg-5, .my-lg-5 { margin-top: 3rem !important } .mr-lg-5, .mx-lg-5 { margin-right: 3rem !important } .mb-lg-5, .my-lg-5 { margin-bottom: 3rem !important } .ml-lg-5, .mx-lg-5 { margin-left: 3rem !important } .p-lg-0 { padding: 0 !important } .pt-lg-0, .py-lg-0 { padding-top: 0 !important } .pr-lg-0, .px-lg-0 { padding-right: 0 !important } .pb-lg-0, .py-lg-0 { padding-bottom: 0 !important } .pl-lg-0, .px-lg-0 { padding-left: 0 !important } .p-lg-1 { padding: .25rem !important } .pt-lg-1, .py-lg-1 { padding-top: .25rem !important } .pr-lg-1, .px-lg-1 { padding-right: .25rem !important } .pb-lg-1, .py-lg-1 { padding-bottom: .25rem !important } .pl-lg-1, .px-lg-1 { padding-left: .25rem !important } .p-lg-2 { padding: .5rem !important } .pt-lg-2, .py-lg-2 { padding-top: .5rem !important } .pr-lg-2, .px-lg-2 { padding-right: .5rem !important } .pb-lg-2, .py-lg-2 { padding-bottom: .5rem !important } .pl-lg-2, .px-lg-2 { padding-left: .5rem !important } .p-lg-3 { padding: 1rem !important } .pt-lg-3, .py-lg-3 { padding-top: 1rem !important } .pr-lg-3, .px-lg-3 { padding-right: 1rem !important } .pb-lg-3, .py-lg-3 { padding-bottom: 1rem !important } .pl-lg-3, .px-lg-3 { padding-left: 1rem !important } .p-lg-4 { padding: 1.5rem !important } .pt-lg-4, .py-lg-4 { padding-top: 1.5rem !important } .pr-lg-4, .px-lg-4 { padding-right: 1.5rem !important } .pb-lg-4, .py-lg-4 { padding-bottom: 1.5rem !important } .pl-lg-4, .px-lg-4 { padding-left: 1.5rem !important } .p-lg-5 { padding: 3rem !important } .pt-lg-5, .py-lg-5 { padding-top: 3rem !important } .pr-lg-5, .px-lg-5 { padding-right: 3rem !important } .pb-lg-5, .py-lg-5 { padding-bottom: 3rem !important } .pl-lg-5, .px-lg-5 { padding-left: 3rem !important } .m-lg-auto { margin: auto !important } .mt-lg-auto, .my-lg-auto { margin-top: auto !important } .mr-lg-auto, .mx-lg-auto { margin-right: auto !important } .mb-lg-auto, .my-lg-auto { margin-bottom: auto !important } .ml-lg-auto, .mx-lg-auto { margin-left: auto !important } } @media(min-width: 1700px) { .m-xl-0 { margin: 0 !important } .mt-xl-0, .my-xl-0 { margin-top: 0 !important } .mr-xl-0, .mx-xl-0 { margin-right: 0 !important } .mb-xl-0, .my-xl-0 { margin-bottom: 0 !important } .ml-xl-0, .mx-xl-0 { margin-left: 0 !important } .m-xl-1 { margin: .25rem !important } .mt-xl-1, .my-xl-1 { margin-top: .25rem !important } .mr-xl-1, .mx-xl-1 { margin-right: .25rem !important } .mb-xl-1, .my-xl-1 { margin-bottom: .25rem !important } .ml-xl-1, .mx-xl-1 { margin-left: .25rem !important } .m-xl-2 { margin: .5rem !important } .mt-xl-2, .my-xl-2 { margin-top: .5rem !important } .mr-xl-2, .mx-xl-2 { margin-right: .5rem !important } .mb-xl-2, .my-xl-2 { margin-bottom: .5rem !important } .ml-xl-2, .mx-xl-2 { margin-left: .5rem !important } .m-xl-3 { margin: 1rem !important } .mt-xl-3, .my-xl-3 { margin-top: 1rem !important } .mr-xl-3, .mx-xl-3 { margin-right: 1rem !important } .mb-xl-3, .my-xl-3 { margin-bottom: 1rem !important } .ml-xl-3, .mx-xl-3 { margin-left: 1rem !important } .m-xl-4 { margin: 1.5rem !important } .mt-xl-4, .my-xl-4 { margin-top: 1.5rem !important } .mr-xl-4, .mx-xl-4 { margin-right: 1.5rem !important } .mb-xl-4, .my-xl-4 { margin-bottom: 1.5rem !important } .ml-xl-4, .mx-xl-4 { margin-left: 1.5rem !important } .m-xl-5 { margin: 3rem !important } .mt-xl-5, .my-xl-5 { margin-top: 3rem !important } .mr-xl-5, .mx-xl-5 { margin-right: 3rem !important } .mb-xl-5, .my-xl-5 { margin-bottom: 3rem !important } .ml-xl-5, .mx-xl-5 { margin-left: 3rem !important } .p-xl-0 { padding: 0 !important } .pt-xl-0, .py-xl-0 { padding-top: 0 !important } .pr-xl-0, .px-xl-0 { padding-right: 0 !important } .pb-xl-0, .py-xl-0 { padding-bottom: 0 !important } .pl-xl-0, .px-xl-0 { padding-left: 0 !important } .p-xl-1 { padding: .25rem !important } .pt-xl-1, .py-xl-1 { padding-top: .25rem !important } .pr-xl-1, .px-xl-1 { padding-right: .25rem !important } .pb-xl-1, .py-xl-1 { padding-bottom: .25rem !important } .pl-xl-1, .px-xl-1 { padding-left: .25rem !important } .p-xl-2 { padding: .5rem !important } .pt-xl-2, .py-xl-2 { padding-top: .5rem !important } .pr-xl-2, .px-xl-2 { padding-right: .5rem !important } .pb-xl-2, .py-xl-2 { padding-bottom: .5rem !important } .pl-xl-2, .px-xl-2 { padding-left: .5rem !important } .p-xl-3 { padding: 1rem !important } .pt-xl-3, .py-xl-3 { padding-top: 1rem !important } .pr-xl-3, .px-xl-3 { padding-right: 1rem !important } .pb-xl-3, .py-xl-3 { padding-bottom: 1rem !important } .pl-xl-3, .px-xl-3 { padding-left: 1rem !important } .p-xl-4 { padding: 1.5rem !important } .pt-xl-4, .py-xl-4 { padding-top: 1.5rem !important } .pr-xl-4, .px-xl-4 { padding-right: 1.5rem !important } .pb-xl-4, .py-xl-4 { padding-bottom: 1.5rem !important } .pl-xl-4, .px-xl-4 { padding-left: 1.5rem !important } .p-xl-5 { padding: 3rem !important } .pt-xl-5, .py-xl-5 { padding-top: 3rem !important } .pr-xl-5, .px-xl-5 { padding-right: 3rem !important } .pb-xl-5, .py-xl-5 { padding-bottom: 3rem !important } .pl-xl-5, .px-xl-5 { padding-left: 3rem !important } .m-xl-auto { margin: auto !important } .mt-xl-auto, .my-xl-auto { margin-top: auto !important } .mr-xl-auto, .mx-xl-auto { margin-right: auto !important } .mb-xl-auto, .my-xl-auto { margin-bottom: auto !important } .ml-xl-auto, .mx-xl-auto { margin-left: auto !important } } .visible { visibility: visible !important } .invisible { visibility: hidden !important } /*! * Web Fonts from Fontspring.com * * All OpenType features and all extended glyphs have been removed. * Fully installable fonts can be purchased at http://www.fontspring.com * * The fonts included in this stylesheet are subject to the End User License you purchased * from Fontspring. The fonts are protected under domestic and international trademark and * copyright law. You are prohibited from modifying, reverse engineering, duplicating, or * distributing this font software. * * (c) 2010-2020 Fontspring * * * * * The fonts included are copyrighted by the vendor listed below. * * Vendor: Radomir Tinkov * License URL: https://www.fontspring.com/licenses/radomir-tinkov/webfont * * */ :root { --gable-green: #293e40; --acapulco: #81b5a1; --cloud: #f7f7f7; --pure-white: #fff; --fountain-blue: #68a1af; --wild-blue-yonder: #8686bc; --orchid: #db8f8f; --tumbleweed: #e8a679; --flax: #e5d87c; --cruise: #b0e1ce; --cavern-pink: #e9bcbc; --apricot: #fbd0b3; --french-pass: #a7d4df; --perano: #b1b1e4; --buttermilk: #fbf2b4; --aquamarine: #64ddac; --bittersweet: #fc726d; --tan-hide: #ff924e; --ocean-spray: #72d0e2; --lavender: #9898e5; --wattle: #d6df38; --interstitial-green: #4b8169; --light-monochromacy: #5ea188; --powder-blue: #b8d9e2; --powder-pink: #f8d1d4; --powder-green: #b9d0cc; --powder-yellow: #f2e5be; --powder-dark-grey: #c8c8c8; --powder-light-grey: #e1e1e1; --error-red: #b33233; --inactive-grey: #5b6f70; --active-green: #497e6e; --brand-green: #86ed78; --brand-green-darker: #62d84e; --brand-blue: #032d42; --brand-blue-lighter: #1a5d68; --brand-black: #000; --brand-gray: #999; --btn-border-radius: 6px; --brand-opacity: 0.5 } .container-fluid { max-width: 170rem } html { font: 62.5%/normal GilroyRegular; min-height: 100%; position: relative } html, html * { box-sizing: border-box } body { font-family: GilroyRegular; font-size: 1.4rem; margin: 0; overflow-x: hidden; overflow-y: auto } body.no-scroll { overflow-y: hidden; position: fixed } .site-wrapper.variation-100percent { width: 100% } .site-body-content-wrapper { overflow: hidden } body[data-currentpage*=demonow] .site-body-content-wrapper { overflow: visible } .site-wrapper { padding-top: 6rem } .site-wrapper.homepage { padding-top: 0 } @media(min-width: 768px) { .site-wrapper { padding-top: 7rem } .site-wrapper.homepage { padding-top: 0 } } @media(min-width: 1280px) { .site-wrapper { padding-top: 8rem } .site-wrapper.homepage { padding-top: 0 } } a, body, h1, h2, h3, h4, h5, h6, li, p, span { letter-spacing: -.2px } a, h1, h2, h3, h4, h5, h6, p, span { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: var(--brand-black,var(--gable-green)) } h1, h2, h3, h4, h5, h6 { margin: 0 } .accordion.section ul li a, .dotcom-links a, p a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } .accordion.section ul li a:hover, .dotcom-links a:hover, p a:hover { background-size: 100% 100% } .accordion.section ul li a.csc-link:hover, .dotcom-links a.csc-link:hover, p a.csc-link:hover { background-size: .2rem .2rem; font-family: gilroyBold; padding-bottom: 1px; transition: none } span.super-case, sup { font-size: 30%; line-height: 1 !important; position: relative; top: .2rem; vertical-align: text-top } span.sub-script { font-size: 1rem } body[data-currentPage="/content/servicenow/www/locale-sites/en-us"] span.sub-script { font-size: .7rem !important } .white-bg-underline p a { background: linear-gradient(#fff,#fff) bottom repeat-x; background-size: .2rem .2rem; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } .white-bg-underline p a:hover { background-size: 100% 100% } .billboard-marquee-component .billboard-marquee-eyebrow, .billboard-marquee-component .billboard-marquee-eyebrow span, .eyebrow, .eyebrow span { font-family: gilroySemiBold; font-size: 1.6rem; line-height: 1.5; text-transform: uppercase } .footnote { font-size: 1.4rem; line-height: 1.5 } h1 { font-family: GilroyBold; font-size: 2.8rem; line-height: 1.3; padding: 2rem 0 } h1 span.super-case, h1 sup { top: .56rem } body:not(.en) h1 { font-size: 2.2rem; line-height: 1.3 } body:not(.en) h1 span.super-case, body:not(.en) h1 sup { top: .5rem } h2 { font-family: GilroyBold; font-size: 2.2rem; line-height: 1.3; margin: 2rem 0 } h2 span.super-case, h2 sup { top: .5rem } h3 { font-family: GilroyBold; font-size: 2rem; line-height: 1.3 } h3 span.super-case, h3 sup { top: .58rem } h4 { font-family: GilroyBold; font-size: 1.8rem; line-height: 1.3 } h4 span.super-case, h4 sup { top: .45rem } h5, h6 { font-family: GilroyBold; font-size: 1.6rem; line-height: 1.3 } h5 span.super-case, h5 sup, h6 span.super-case, h6 sup { top: .44rem } p, span { font-size: 1.4rem } p span.super-case, p sup { font-size: 4.2px; top: .2rem } .ui-autocomplete .ui-menu-item p, .ui-autocomplete .ui-menu-item span { font-size: 1.4rem } .anchorInactive { cursor: unset; pointer-events: none; text-decoration: none } .anchorInactive:hover .icon-link-sec-img img { transform: none !important } .anchorInactive .icon-link-sec-text-sec .icon-link-sec-list-item-location { background: unset !important; background: none !important } .comp-full-bleed-bg-color { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .opacity-zero { opacity: 0 } .opacity-ten { opacity: .1 } .opacity-twenty { opacity: .2 } .opacity-forty { opacity: .4 } .opacity-sixty { opacity: .6 } .opacity-eighty { opacity: .8 } .xlarge-body-copy, .xlarge-body-copy p, .xlarge-body-copy span { font-size: 1.8rem; line-height: 1.5 } .xlarge-body-copy p span.super-case, .xlarge-body-copy span.super-case, .xlarge-body-copy sup { top: .42rem } .accordion.section .accordion-panel, .accordion.section .accordion-panel p, .accordion.section .accordion-panel span, .large-body-copy, .large-body-copy p, .large-body-copy span { font-size: 1.8rem; line-height: 1.7 } .accordion.section .accordion-panel span.super-case, .accordion.section .accordion-panel sup, .large-body-copy p span.super-case, .large-body-copy span.super-case, .large-body-copy sup { top: .4rem } .accordion.section ul.list-unstyled li, .accordion.section ul.list-unstyled li p, .accordion.section ul.list-unstyled li span, .medium-body-copy, .medium-body-copy p, .medium-body-copy span { font-size: 1.6rem; line-height: 1.7 } .accordion.section ul.list-unstyled li span.super-case, .accordion.section ul.list-unstyled li sup, .medium-body-copy p span.super-case, .medium-body-copy span.super-case, .medium-body-copy sup { top: .3rem } .accordion.section .accordion-expand-wrapper a, .accordion.section .accordion-expand-wrapper a p, .accordion.section .accordion-expand-wrapper a span, .small-body-copy, .small-body-copy p, .small-body-copy span, .xsmall-body-copy, .xsmall-body-copy p, .xsmall-body-copy span { font-size: 1.4rem; line-height: 1.5 } .accordion.section .accordion-expand-wrapper a span.super-case, .accordion.section .accordion-expand-wrapper a sup, .small-body-copy p span.super-case, .small-body-copy span.super-case, .small-body-copy sup, .xsmall-body-copy p span.super-case, .xsmall-body-copy span.super-case, .xsmall-body-copy sup { top: .25rem } .label-copy { font-family: GilroyBold; text-transform: uppercase } .label-copy, .label-copy p, .label-copy span { font-size: 1rem; line-height: normal } .label-copy p span.super-case, .label-copy span.super-case, .label-copy sup { font-size: .3px; top: .2rem } .site-width-1700 { margin: auto; max-width: 170rem; padding-left: 1rem; padding-right: 1rem; width: 100% } .cta-btn { background-color: #50e3c2; display: inline-block; font-size: 1.6rem; padding: 1.2rem 5rem } .cta-btn.white-text { color: #000 } .cta-btn.transparent-background { background: transparent } .cta-btn.arrow-icon { position: relative } .cta-btn.arrow-icon:before { border-bottom: .2rem solid #000; border-right: .2rem solid #000; content: ""; display: inline-block; height: .8rem; left: 3rem; position: absolute; top: 1.5rem; transform: rotate(-45deg); width: .8rem } .light-quote { fill: #f0f1ea !important; stroke: #f0f1ea !important } .light-quote, .light-quote + .link-list-component-inner-wrapper .link-list-sticky-active, .light-quote:before { background-color: #f0f1ea !important } .gable-green { fill: #293e40 !important; stroke: #293e40 !important } .gable-green, .gable-green + .link-list-component-inner-wrapper .link-list-sticky-active, .gable-green:before { background-color: #293e40 !important } .acapulco { fill: #81b5a1 !important; stroke: #81b5a1 !important } .acapulco, .acapulco + .link-list-component-inner-wrapper .link-list-sticky-active, .acapulco:before { background-color: #81b5a1 !important } .cloud { fill: #f7f7f7 !important; stroke: #f7f7f7 !important } .cloud, .cloud + .link-list-component-inner-wrapper .link-list-sticky-active, .cloud:before { background-color: #f7f7f7 !important } .pure-white { fill: #fff !important; stroke: #fff !important } .pure-white, .pure-white + .link-list-component-inner-wrapper .link-list-sticky-active, .pure-white:before { background-color: #fff !important } .fountain-blue { fill: #68a1af !important; stroke: #68a1af !important } .fountain-blue, .fountain-blue + .link-list-component-inner-wrapper .link-list-sticky-active, .fountain-blue:before { background-color: #68a1af !important } .wild-blue-yonder { fill: #8686bc !important; stroke: #8686bc !important } .wild-blue-yonder, .wild-blue-yonder + .link-list-component-inner-wrapper .link-list-sticky-active, .wild-blue-yonder:before { background-color: #8686bc !important } .orchid { fill: #db8f8f !important; stroke: #db8f8f !important } .orchid, .orchid + .link-list-component-inner-wrapper .link-list-sticky-active, .orchid:before { background-color: #db8f8f !important } .tumbleweed { fill: #e8a679 !important; stroke: #e8a679 !important } .tumbleweed, .tumbleweed + .link-list-component-inner-wrapper .link-list-sticky-active, .tumbleweed:before { background-color: #e8a679 !important } .flax { fill: #e5d87c !important; stroke: #e5d87c !important } .flax, .flax + .link-list-component-inner-wrapper .link-list-sticky-active, .flax:before { background-color: #e5d87c !important } .cruise { fill: #b0e1ce !important; stroke: #b0e1ce !important } .cruise, .cruise + .link-list-component-inner-wrapper .link-list-sticky-active, .cruise:before { background-color: #b0e1ce !important } .cavern-pink { fill: #e9bcbc !important; stroke: #e9bcbc !important } .cavern-pink, .cavern-pink + .link-list-component-inner-wrapper .link-list-sticky-active, .cavern-pink:before { background-color: #e9bcbc !important } .apricot { fill: #fbd0b3 !important; stroke: #fbd0b3 !important } .apricot, .apricot + .link-list-component-inner-wrapper .link-list-sticky-active, .apricot:before { background-color: #fbd0b3 !important } .french-pass { fill: #a7d4df !important; stroke: #a7d4df !important } .french-pass, .french-pass + .link-list-component-inner-wrapper .link-list-sticky-active, .french-pass:before { background-color: #a7d4df !important } .perano { fill: #b1b1e4 !important; stroke: #b1b1e4 !important } .perano, .perano + .link-list-component-inner-wrapper .link-list-sticky-active, .perano:before { background-color: #b1b1e4 !important } .buttermilk { fill: #fbf2b4 !important; stroke: #fbf2b4 !important } .buttermilk, .buttermilk + .link-list-component-inner-wrapper .link-list-sticky-active, .buttermilk:before { background-color: #fbf2b4 !important } .aquamarine { fill: #64ddac !important; stroke: #64ddac !important } .aquamarine, .aquamarine + .link-list-component-inner-wrapper .link-list-sticky-active, .aquamarine:before { background-color: #64ddac !important } .bittersweet { fill: #fc726d !important; stroke: #fc726d !important } .bittersweet, .bittersweet + .link-list-component-inner-wrapper .link-list-sticky-active, .bittersweet:before { background-color: #fc726d !important } .tan-hide { fill: #ff924e !important; stroke: #ff924e !important } .tan-hide, .tan-hide + .link-list-component-inner-wrapper .link-list-sticky-active, .tan-hide:before { background-color: #ff924e !important } .ocean-spray { fill: #72d0e2 !important; stroke: #72d0e2 !important } .ocean-spray, .ocean-spray + .link-list-component-inner-wrapper .link-list-sticky-active, .ocean-spray:before { background-color: #72d0e2 !important } .lavender { fill: #9898e5 !important; stroke: #9898e5 !important } .lavender, .lavender + .link-list-component-inner-wrapper .link-list-sticky-active, .lavender:before { background-color: #9898e5 !important } .wattle { fill: #d6df38 !important; stroke: #d6df38 !important } .wattle, .wattle + .link-list-component-inner-wrapper .link-list-sticky-active, .wattle:before { background-color: #d6df38 !important } .interstitial-green { fill: #4b8169 !important; stroke: #4b8169 !important } .interstitial-green, .interstitial-green + .link-list-component-inner-wrapper .link-list-sticky-active, .interstitial-green:before { background-color: #4b8169 !important } .light-monochromacy { fill: #5ea188 !important; stroke: #5ea188 !important } .light-monochromacy, .light-monochromacy + .link-list-component-inner-wrapper .link-list-sticky-active, .light-monochromacy:before { background-color: #5ea188 !important } .powder-blue { fill: #b8d9e2 !important; stroke: #b8d9e2 !important } .powder-blue, .powder-blue + .link-list-component-inner-wrapper .link-list-sticky-active, .powder-blue:before { background-color: #b8d9e2 !important } .powder-pink { fill: #f8d1d4 !important; stroke: #f8d1d4 !important } .powder-pink, .powder-pink + .link-list-component-inner-wrapper .link-list-sticky-active, .powder-pink:before { background-color: #f8d1d4 !important } .powder-green { fill: #b9d0cc !important; stroke: #b9d0cc !important } .powder-green, .powder-green + .link-list-component-inner-wrapper .link-list-sticky-active, .powder-green:before { background-color: #b9d0cc !important } .powder-yellow { fill: #f2e5be !important; stroke: #f2e5be !important } .powder-yellow, .powder-yellow + .link-list-component-inner-wrapper .link-list-sticky-active, .powder-yellow:before { background-color: #f2e5be !important } .powder-dark-grey { fill: #c8c8c8 !important; stroke: #c8c8c8 !important } .powder-dark-grey, .powder-dark-grey + .link-list-component-inner-wrapper .link-list-sticky-active, .powder-dark-grey:before { background-color: #c8c8c8 !important } .powder-light-grey { fill: #e1e1e1 !important; stroke: #e1e1e1 !important } .powder-light-grey, .powder-light-grey + .link-list-component-inner-wrapper .link-list-sticky-active, .powder-light-grey:before { background-color: #e1e1e1 !important } .brand-green { fill: #86ed78 !important; stroke: #86ed78 !important } .brand-green, .brand-green + .link-list-component-inner-wrapper .link-list-sticky-active, .brand-green:before { background-color: #86ed78 !important } .brand-blue { fill: #032d42 !important; stroke: #032d42 !important } .brand-blue, .brand-blue + .link-list-component-inner-wrapper .link-list-sticky-active, .brand-blue:before { background-color: #032d42 !important } .brand-black { fill: #000 !important; stroke: #000 !important } .brand-black, .brand-black + .link-list-component-inner-wrapper .link-list-sticky-active, .brand-black:before { background-color: #000 !important } .brand-green-darker { fill: #62d84e !important; stroke: #62d84e !important } .brand-green-darker, .brand-green-darker + .link-list-component-inner-wrapper .link-list-sticky-active, .brand-green-darker:before { background-color: #62d84e !important } .brand-blue-lighter { fill: #1a5d68 !important; stroke: #1a5d68 !important } .brand-blue-lighter, .brand-blue-lighter + .link-list-component-inner-wrapper .link-list-sticky-active, .brand-blue-lighter:before { background-color: #1a5d68 !important } .brand-gray { fill: #c3c3c3 !important; stroke: #c3c3c3 !important } .brand-gray, .brand-gray + .link-list-component-inner-wrapper .link-list-sticky-active, .brand-gray:before { background-color: #c3c3c3 !important } .gable-green-eyebrow:after { background-color: #293e40 !important } .acapulco-eyebrow:after { background-color: #81b5a1 !important } .cloud-eyebrow:after { background-color: #f7f7f7 !important } .pure-white-eyebrow:after { background-color: #fff !important } .fountain-blue-eyebrow:after { background-color: #68a1af !important } .wild-blue-yonder-eyebrow:after { background-color: #8686bc !important } .orchid-eyebrow:after { background-color: #db8f8f !important } .tumbleweed-eyebrow:after { background-color: #e8a679 !important } .flax-eyebrow:after { background-color: #e5d87c !important } .cruise-eyebrow:after { background-color: #b0e1ce !important } .cavern-pink-eyebrow:after { background-color: #e9bcbc !important } .apricot-eyebrow:after { background-color: #fbd0b3 !important } .french-pass-eyebrow:after { background-color: #a7d4df !important } .perano-eyebrow:after { background-color: #b1b1e4 !important } .buttermilk-eyebrow:after { background-color: #fbf2b4 !important } .aquamarine-eyebrow:after { background-color: #64ddac !important } .bittersweet-eyebrow:after { background-color: #fc726d !important } .tan-hide-eyebrow:after { background-color: #ff924e !important } .ocean-spray-eyebrow:after { background-color: #72d0e2 !important } .lavender-eyebrow:after { background-color: #9898e5 !important } .wattle-eyebrow:after { background-color: #d6df38 !important } .interstitial-green-eyebrow:after { background-color: #4b8169 !important } .light-monochromacy-eyebrow:after { background-color: #5ea188 !important } .powder-blue-eyebrow:after { background-color: #b8d9e2 !important } .powder-pink-eyebrow:after { background-color: #f8d1d4 !important } .powder-green-eyebrow:after { background-color: #b9d0cc !important } .powder-yellow-eyebrow:after { background-color: #f2e5be !important } .powder-dark-grey-eyebrow:after { background-color: #c8c8c8 !important } .powder-light-grey-eyebrow:after { background-color: #e1e1e1 !important } .brand-green-eyebrow:after { background-color: #86ed78 !important } .brand-blue-eyebrow:after { background-color: #032d42 !important } .brand-black-eyebrow:after { background-color: #000 !important } .brand-green-darker-eyebrow:after { background-color: #62d84e !important } .brand-blue-lighter-eyebrow:after { background-color: #1a5d68 !important } .brand-gray-eyebrow:after { background-color: #c3c3c3 !important } .gable-green-cta.cta-rectangle-box a { border-color: #293e40 !important } .gable-green-cta.cta-rectangle-box .cta-background-full, .gable-green-cta.cta-rectangle-box.solid a { background-color: #293e40 !important } .gable-green-cta.cta-play-video svg path, .gable-green-cta.cta-play-video svg polygon, .gable-green-cta.cta-play-video svg polyline, .gable-green-cta.cta-text-arrow svg path, .gable-green-cta.cta-text-arrow svg polygon, .gable-green-cta.cta-text-arrow svg polyline { stroke: #293e40 !important } .acapulco-cta.cta-rectangle-box a { border-color: #81b5a1 !important } .acapulco-cta.cta-rectangle-box .cta-background-full, .acapulco-cta.cta-rectangle-box.solid a { background-color: #81b5a1 !important } .acapulco-cta.cta-play-video svg path, .acapulco-cta.cta-play-video svg polygon, .acapulco-cta.cta-play-video svg polyline, .acapulco-cta.cta-text-arrow svg path, .acapulco-cta.cta-text-arrow svg polygon, .acapulco-cta.cta-text-arrow svg polyline { stroke: #81b5a1 !important } .cloud-cta.cta-rectangle-box a { border-color: #f7f7f7 !important } .cloud-cta.cta-rectangle-box .cta-background-full, .cloud-cta.cta-rectangle-box.solid a { background-color: #f7f7f7 !important } .cloud-cta.cta-play-video svg path, .cloud-cta.cta-play-video svg polygon, .cloud-cta.cta-play-video svg polyline, .cloud-cta.cta-text-arrow svg path, .cloud-cta.cta-text-arrow svg polygon, .cloud-cta.cta-text-arrow svg polyline { stroke: #f7f7f7 !important } .pure-white-cta.cta-rectangle-box a { border-color: #fff !important } .pure-white-cta.cta-rectangle-box .cta-background-full, .pure-white-cta.cta-rectangle-box.solid a { background-color: #fff !important } .pure-white-cta.cta-play-video svg path, .pure-white-cta.cta-play-video svg polygon, .pure-white-cta.cta-play-video svg polyline, .pure-white-cta.cta-text-arrow svg path, .pure-white-cta.cta-text-arrow svg polygon, .pure-white-cta.cta-text-arrow svg polyline { stroke: #fff !important } .fountain-blue-cta.cta-rectangle-box a { border-color: #68a1af !important } .fountain-blue-cta.cta-rectangle-box .cta-background-full, .fountain-blue-cta.cta-rectangle-box.solid a { background-color: #68a1af !important } .fountain-blue-cta.cta-play-video svg path, .fountain-blue-cta.cta-play-video svg polygon, .fountain-blue-cta.cta-play-video svg polyline, .fountain-blue-cta.cta-text-arrow svg path, .fountain-blue-cta.cta-text-arrow svg polygon, .fountain-blue-cta.cta-text-arrow svg polyline { stroke: #68a1af !important } .wild-blue-yonder-cta.cta-rectangle-box a { border-color: #8686bc !important } .wild-blue-yonder-cta.cta-rectangle-box .cta-background-full, .wild-blue-yonder-cta.cta-rectangle-box.solid a { background-color: #8686bc !important } .wild-blue-yonder-cta.cta-play-video svg path, .wild-blue-yonder-cta.cta-play-video svg polygon, .wild-blue-yonder-cta.cta-play-video svg polyline, .wild-blue-yonder-cta.cta-text-arrow svg path, .wild-blue-yonder-cta.cta-text-arrow svg polygon, .wild-blue-yonder-cta.cta-text-arrow svg polyline { stroke: #8686bc !important } .orchid-cta.cta-rectangle-box a { border-color: #db8f8f !important } .orchid-cta.cta-rectangle-box .cta-background-full, .orchid-cta.cta-rectangle-box.solid a { background-color: #db8f8f !important } .orchid-cta.cta-play-video svg path, .orchid-cta.cta-play-video svg polygon, .orchid-cta.cta-play-video svg polyline, .orchid-cta.cta-text-arrow svg path, .orchid-cta.cta-text-arrow svg polygon, .orchid-cta.cta-text-arrow svg polyline { stroke: #db8f8f !important } .tumbleweed-cta.cta-rectangle-box a { border-color: #e8a679 !important } .tumbleweed-cta.cta-rectangle-box .cta-background-full, .tumbleweed-cta.cta-rectangle-box.solid a { background-color: #e8a679 !important } .tumbleweed-cta.cta-play-video svg path, .tumbleweed-cta.cta-play-video svg polygon, .tumbleweed-cta.cta-play-video svg polyline, .tumbleweed-cta.cta-text-arrow svg path, .tumbleweed-cta.cta-text-arrow svg polygon, .tumbleweed-cta.cta-text-arrow svg polyline { stroke: #e8a679 !important } .flax-cta.cta-rectangle-box a { border-color: #e5d87c !important } .flax-cta.cta-rectangle-box .cta-background-full, .flax-cta.cta-rectangle-box.solid a { background-color: #e5d87c !important } .flax-cta.cta-play-video svg path, .flax-cta.cta-play-video svg polygon, .flax-cta.cta-play-video svg polyline, .flax-cta.cta-text-arrow svg path, .flax-cta.cta-text-arrow svg polygon, .flax-cta.cta-text-arrow svg polyline { stroke: #e5d87c !important } .cruise-cta.cta-rectangle-box a { border-color: #b0e1ce !important } .cruise-cta.cta-rectangle-box .cta-background-full, .cruise-cta.cta-rectangle-box.solid a { background-color: #b0e1ce !important } .cruise-cta.cta-play-video svg path, .cruise-cta.cta-play-video svg polygon, .cruise-cta.cta-play-video svg polyline, .cruise-cta.cta-text-arrow svg path, .cruise-cta.cta-text-arrow svg polygon, .cruise-cta.cta-text-arrow svg polyline { stroke: #b0e1ce !important } .cavern-pink-cta.cta-rectangle-box a { border-color: #e9bcbc !important } .cavern-pink-cta.cta-rectangle-box .cta-background-full, .cavern-pink-cta.cta-rectangle-box.solid a { background-color: #e9bcbc !important } .cavern-pink-cta.cta-play-video svg path, .cavern-pink-cta.cta-play-video svg polygon, .cavern-pink-cta.cta-play-video svg polyline, .cavern-pink-cta.cta-text-arrow svg path, .cavern-pink-cta.cta-text-arrow svg polygon, .cavern-pink-cta.cta-text-arrow svg polyline { stroke: #e9bcbc !important } .apricot-cta.cta-rectangle-box a { border-color: #fbd0b3 !important } .apricot-cta.cta-rectangle-box .cta-background-full, .apricot-cta.cta-rectangle-box.solid a { background-color: #fbd0b3 !important } .apricot-cta.cta-play-video svg path, .apricot-cta.cta-play-video svg polygon, .apricot-cta.cta-play-video svg polyline, .apricot-cta.cta-text-arrow svg path, .apricot-cta.cta-text-arrow svg polygon, .apricot-cta.cta-text-arrow svg polyline { stroke: #fbd0b3 !important } .french-pass-cta.cta-rectangle-box a { border-color: #a7d4df !important } .french-pass-cta.cta-rectangle-box .cta-background-full, .french-pass-cta.cta-rectangle-box.solid a { background-color: #a7d4df !important } .french-pass-cta.cta-play-video svg path, .french-pass-cta.cta-play-video svg polygon, .french-pass-cta.cta-play-video svg polyline, .french-pass-cta.cta-text-arrow svg path, .french-pass-cta.cta-text-arrow svg polygon, .french-pass-cta.cta-text-arrow svg polyline { stroke: #a7d4df !important } .perano-cta.cta-rectangle-box a { border-color: #b1b1e4 !important } .perano-cta.cta-rectangle-box .cta-background-full, .perano-cta.cta-rectangle-box.solid a { background-color: #b1b1e4 !important } .perano-cta.cta-play-video svg path, .perano-cta.cta-play-video svg polygon, .perano-cta.cta-play-video svg polyline, .perano-cta.cta-text-arrow svg path, .perano-cta.cta-text-arrow svg polygon, .perano-cta.cta-text-arrow svg polyline { stroke: #b1b1e4 !important } .buttermilk-cta.cta-rectangle-box a { border-color: #fbf2b4 !important } .buttermilk-cta.cta-rectangle-box .cta-background-full, .buttermilk-cta.cta-rectangle-box.solid a { background-color: #fbf2b4 !important } .buttermilk-cta.cta-play-video svg path, .buttermilk-cta.cta-play-video svg polygon, .buttermilk-cta.cta-play-video svg polyline, .buttermilk-cta.cta-text-arrow svg path, .buttermilk-cta.cta-text-arrow svg polygon, .buttermilk-cta.cta-text-arrow svg polyline { stroke: #fbf2b4 !important } .aquamarine-cta.cta-rectangle-box a { border-color: #64ddac !important } .aquamarine-cta.cta-rectangle-box .cta-background-full, .aquamarine-cta.cta-rectangle-box.solid a { background-color: #64ddac !important } .aquamarine-cta.cta-play-video svg path, .aquamarine-cta.cta-play-video svg polygon, .aquamarine-cta.cta-play-video svg polyline, .aquamarine-cta.cta-text-arrow svg path, .aquamarine-cta.cta-text-arrow svg polygon, .aquamarine-cta.cta-text-arrow svg polyline { stroke: #64ddac !important } .bittersweet-cta.cta-rectangle-box a { border-color: #fc726d !important } .bittersweet-cta.cta-rectangle-box .cta-background-full, .bittersweet-cta.cta-rectangle-box.solid a { background-color: #fc726d !important } .bittersweet-cta.cta-play-video svg path, .bittersweet-cta.cta-play-video svg polygon, .bittersweet-cta.cta-play-video svg polyline, .bittersweet-cta.cta-text-arrow svg path, .bittersweet-cta.cta-text-arrow svg polygon, .bittersweet-cta.cta-text-arrow svg polyline { stroke: #fc726d !important } .tan-hide-cta.cta-rectangle-box a { border-color: #ff924e !important } .tan-hide-cta.cta-rectangle-box .cta-background-full, .tan-hide-cta.cta-rectangle-box.solid a { background-color: #ff924e !important } .tan-hide-cta.cta-play-video svg path, .tan-hide-cta.cta-play-video svg polygon, .tan-hide-cta.cta-play-video svg polyline, .tan-hide-cta.cta-text-arrow svg path, .tan-hide-cta.cta-text-arrow svg polygon, .tan-hide-cta.cta-text-arrow svg polyline { stroke: #ff924e !important } .ocean-spray-cta.cta-rectangle-box a { border-color: #72d0e2 !important } .ocean-spray-cta.cta-rectangle-box .cta-background-full, .ocean-spray-cta.cta-rectangle-box.solid a { background-color: #72d0e2 !important } .ocean-spray-cta.cta-play-video svg path, .ocean-spray-cta.cta-play-video svg polygon, .ocean-spray-cta.cta-play-video svg polyline, .ocean-spray-cta.cta-text-arrow svg path, .ocean-spray-cta.cta-text-arrow svg polygon, .ocean-spray-cta.cta-text-arrow svg polyline { stroke: #72d0e2 !important } .lavender-cta.cta-rectangle-box a { border-color: #9898e5 !important } .lavender-cta.cta-rectangle-box .cta-background-full, .lavender-cta.cta-rectangle-box.solid a { background-color: #9898e5 !important } .lavender-cta.cta-play-video svg path, .lavender-cta.cta-play-video svg polygon, .lavender-cta.cta-play-video svg polyline, .lavender-cta.cta-text-arrow svg path, .lavender-cta.cta-text-arrow svg polygon, .lavender-cta.cta-text-arrow svg polyline { stroke: #9898e5 !important } .wattle-cta.cta-rectangle-box a { border-color: #d6df38 !important } .wattle-cta.cta-rectangle-box .cta-background-full, .wattle-cta.cta-rectangle-box.solid a { background-color: #d6df38 !important } .wattle-cta.cta-play-video svg path, .wattle-cta.cta-play-video svg polygon, .wattle-cta.cta-play-video svg polyline, .wattle-cta.cta-text-arrow svg path, .wattle-cta.cta-text-arrow svg polygon, .wattle-cta.cta-text-arrow svg polyline { stroke: #d6df38 !important } .light-monochromacy-cta.cta-rectangle-box a { border-color: #5ea188 !important } .light-monochromacy-cta.cta-rectangle-box .cta-background-full, .light-monochromacy-cta.cta-rectangle-box.solid a { background-color: #5ea188 !important } .light-monochromacy-cta.cta-play-video svg path, .light-monochromacy-cta.cta-play-video svg polygon, .light-monochromacy-cta.cta-play-video svg polyline, .light-monochromacy-cta.cta-text-arrow svg path, .light-monochromacy-cta.cta-text-arrow svg polygon, .light-monochromacy-cta.cta-text-arrow svg polyline { stroke: #5ea188 !important } .powder-blue-cta.cta-rectangle-box a { border-color: #b8d9e2 !important } .powder-blue-cta.cta-rectangle-box .cta-background-full, .powder-blue-cta.cta-rectangle-box.solid a { background-color: #b8d9e2 !important } .powder-blue-cta.cta-play-video svg path, .powder-blue-cta.cta-play-video svg polygon, .powder-blue-cta.cta-play-video svg polyline, .powder-blue-cta.cta-text-arrow svg path, .powder-blue-cta.cta-text-arrow svg polygon, .powder-blue-cta.cta-text-arrow svg polyline { stroke: #b8d9e2 !important } .powder-pink-cta.cta-rectangle-box a { border-color: #f8d1d4 !important } .powder-pink-cta.cta-rectangle-box .cta-background-full, .powder-pink-cta.cta-rectangle-box.solid a { background-color: #f8d1d4 !important } .powder-pink-cta.cta-play-video svg path, .powder-pink-cta.cta-play-video svg polygon, .powder-pink-cta.cta-play-video svg polyline, .powder-pink-cta.cta-text-arrow svg path, .powder-pink-cta.cta-text-arrow svg polygon, .powder-pink-cta.cta-text-arrow svg polyline { stroke: #f8d1d4 !important } .powder-green-cta.cta-rectangle-box a { border-color: #b9d0cc !important } .powder-green-cta.cta-rectangle-box .cta-background-full, .powder-green-cta.cta-rectangle-box.solid a { background-color: #b9d0cc !important } .powder-green-cta.cta-play-video svg path, .powder-green-cta.cta-play-video svg polygon, .powder-green-cta.cta-play-video svg polyline, .powder-green-cta.cta-text-arrow svg path, .powder-green-cta.cta-text-arrow svg polygon, .powder-green-cta.cta-text-arrow svg polyline { stroke: #b9d0cc !important } .powder-yellow-cta.cta-rectangle-box a { border-color: #f2e5be !important } .powder-yellow-cta.cta-rectangle-box .cta-background-full, .powder-yellow-cta.cta-rectangle-box.solid a { background-color: #f2e5be !important } .powder-yellow-cta.cta-play-video svg path, .powder-yellow-cta.cta-play-video svg polygon, .powder-yellow-cta.cta-play-video svg polyline, .powder-yellow-cta.cta-text-arrow svg path, .powder-yellow-cta.cta-text-arrow svg polygon, .powder-yellow-cta.cta-text-arrow svg polyline { stroke: #f2e5be !important } .powder-dark-grey-cta.cta-rectangle-box a { border-color: #c8c8c8 !important } .powder-dark-grey-cta.cta-rectangle-box .cta-background-full, .powder-dark-grey-cta.cta-rectangle-box.solid a { background-color: #c8c8c8 !important } .powder-dark-grey-cta.cta-play-video svg path, .powder-dark-grey-cta.cta-play-video svg polygon, .powder-dark-grey-cta.cta-play-video svg polyline, .powder-dark-grey-cta.cta-text-arrow svg path, .powder-dark-grey-cta.cta-text-arrow svg polygon, .powder-dark-grey-cta.cta-text-arrow svg polyline { stroke: #c8c8c8 !important } .powder-light-grey-cta.cta-rectangle-box a { border-color: #e1e1e1 !important } .powder-light-grey-cta.cta-rectangle-box .cta-background-full, .powder-light-grey-cta.cta-rectangle-box.solid a { background-color: #e1e1e1 !important } .powder-light-grey-cta.cta-play-video svg path, .powder-light-grey-cta.cta-play-video svg polygon, .powder-light-grey-cta.cta-play-video svg polyline, .powder-light-grey-cta.cta-text-arrow svg path, .powder-light-grey-cta.cta-text-arrow svg polygon, .powder-light-grey-cta.cta-text-arrow svg polyline { stroke: #e1e1e1 !important } .brand-green-cta.cta-rectangle-box a { border-color: #86ed78 !important } .brand-green-cta.cta-rectangle-box .cta-background-full, .brand-green-cta.cta-rectangle-box.solid a { background-color: #86ed78 !important } .brand-green-cta.cta-play-video svg path, .brand-green-cta.cta-play-video svg polygon, .brand-green-cta.cta-play-video svg polyline, .brand-green-cta.cta-text-arrow svg path, .brand-green-cta.cta-text-arrow svg polygon, .brand-green-cta.cta-text-arrow svg polyline { stroke: #86ed78 !important } .brand-green-cta.cta-rectangle-box a:hover { border-color: #62d84e !important } .brand-green-cta.cta-rectangle-box a:hover + .cta-background-full, .brand-green-cta.cta-rectangle-box a:hover:after { background-color: #62d84e !important } .brand-blue-cta.cta-rectangle-box a { border-color: #032d42 !important } .brand-blue-cta.cta-rectangle-box .cta-background-full, .brand-blue-cta.cta-rectangle-box.solid a { background-color: #032d42 !important } .brand-blue-cta.cta-play-video svg path, .brand-blue-cta.cta-play-video svg polygon, .brand-blue-cta.cta-play-video svg polyline, .brand-blue-cta.cta-text-arrow svg path, .brand-blue-cta.cta-text-arrow svg polygon, .brand-blue-cta.cta-text-arrow svg polyline { stroke: #032d42 !important } .brand-blue-cta.cta-rectangle-box a:hover { border-color: #1a5d68 !important } .brand-blue-cta.cta-rectangle-box a:hover + .cta-background-full, .brand-blue-cta.cta-rectangle-box a:hover:after { background-color: #1a5d68 !important } .brand-black-cta.cta-rectangle-box a { border-color: #000 !important } .brand-black-cta.cta-rectangle-box .cta-background-full, .brand-black-cta.cta-rectangle-box.solid a { background-color: #000 !important } .brand-black-cta.cta-play-video svg path, .brand-black-cta.cta-play-video svg polygon, .brand-black-cta.cta-play-video svg polyline, .brand-black-cta.cta-text-arrow svg path, .brand-black-cta.cta-text-arrow svg polygon, .brand-black-cta.cta-text-arrow svg polyline { stroke: #000 !important } .brand-green-darker-cta.cta-rectangle-box a { border-color: #62d84e !important } .brand-green-darker-cta.cta-rectangle-box .cta-background-full, .brand-green-darker-cta.cta-rectangle-box.solid a { background-color: #62d84e !important } .brand-green-darker-cta.cta-play-video svg path, .brand-green-darker-cta.cta-play-video svg polygon, .brand-green-darker-cta.cta-play-video svg polyline, .brand-green-darker-cta.cta-text-arrow svg path, .brand-green-darker-cta.cta-text-arrow svg polygon, .brand-green-darker-cta.cta-text-arrow svg polyline { stroke: #62d84e !important } .brand-green-darker-cta.cta-rectangle-box a:hover { border-color: #86ed78 !important } .brand-green-darker-cta.cta-rectangle-box a:hover + .cta-background-full, .brand-green-darker-cta.cta-rectangle-box a:hover:after { background-color: #86ed78 !important } .brand-blue-lighter-cta.cta-rectangle-box a { border-color: #1a5d68 !important } .brand-blue-lighter-cta.cta-rectangle-box .cta-background-full, .brand-blue-lighter-cta.cta-rectangle-box.solid a { background-color: #1a5d68 !important } .brand-blue-lighter-cta.cta-play-video svg path, .brand-blue-lighter-cta.cta-play-video svg polygon, .brand-blue-lighter-cta.cta-play-video svg polyline, .brand-blue-lighter-cta.cta-text-arrow svg path, .brand-blue-lighter-cta.cta-text-arrow svg polygon, .brand-blue-lighter-cta.cta-text-arrow svg polyline { stroke: #1a5d68 !important } .brand-blue-lighter-cta.cta-rectangle-box a:hover { border-color: #032d42 !important } .brand-blue-lighter-cta.cta-rectangle-box a:hover + .cta-background-full, .brand-blue-lighter-cta.cta-rectangle-box a:hover:after { background-color: #032d42 !important } .brand-gray-cta.cta-rectangle-box a { border-color: #c3c3c3 !important } .brand-gray-cta.cta-rectangle-box .cta-background-full, .brand-gray-cta.cta-rectangle-box.solid a { background-color: #c3c3c3 !important } .brand-gray-cta.cta-play-video svg path, .brand-gray-cta.cta-play-video svg polygon, .brand-gray-cta.cta-play-video svg polyline, .brand-gray-cta.cta-text-arrow svg path, .brand-gray-cta.cta-text-arrow svg polygon, .brand-gray-cta.cta-text-arrow svg polyline { stroke: #c3c3c3 !important } .gable-green-text, .gable-green-text *, .gable-green-text.cta-rectangle-box a { color: #293e40 !important } .gable-green-text.cta-rectangle-box a:hover { color: #fff !important } .gable-green-text-hover.cta-component a:hover, .gable-green-text.cta-play-video a, .gable-green-text.cta-text-arrow a { color: #293e40 !important } .acapulco-text, .acapulco-text *, .acapulco-text.cta-rectangle-box a { color: #81b5a1 !important } .acapulco-text.cta-rectangle-box a:hover { color: #fff !important } .acapulco-text.cta-play-video a, .acapulco-text.cta-text-arrow a { color: #81b5a1 !important } .cloud-text, .cloud-text *, .cloud-text.cta-rectangle-box a { color: #f7f7f7 !important } .cloud-text.cta-rectangle-box a:hover { color: #fff !important } .cloud-text.cta-play-video a, .cloud-text.cta-text-arrow a { color: #f7f7f7 !important } .pure-white-text, .pure-white-text *, .pure-white-text-hover.cta-component a:hover, .pure-white-text.cta-play-video a, .pure-white-text.cta-rectangle-box a, .pure-white-text.cta-rectangle-box a:hover, .pure-white-text.cta-text-arrow a { color: #fff !important } .fountain-blue-text, .fountain-blue-text *, .fountain-blue-text.cta-rectangle-box a { color: #68a1af !important } .fountain-blue-text.cta-rectangle-box a:hover { color: #fff !important } .fountain-blue-text.cta-play-video a, .fountain-blue-text.cta-text-arrow a { color: #68a1af !important } .wild-blue-yonder-text, .wild-blue-yonder-text *, .wild-blue-yonder-text.cta-rectangle-box a { color: #8686bc !important } .wild-blue-yonder-text.cta-rectangle-box a:hover { color: #fff !important } .wild-blue-yonder-text.cta-play-video a, .wild-blue-yonder-text.cta-text-arrow a { color: #8686bc !important } .orchid-text, .orchid-text *, .orchid-text.cta-rectangle-box a { color: #db8f8f !important } .orchid-text.cta-rectangle-box a:hover { color: #fff !important } .orchid-text.cta-play-video a, .orchid-text.cta-text-arrow a { color: #db8f8f !important } .tumbleweed-text, .tumbleweed-text *, .tumbleweed-text.cta-rectangle-box a { color: #e8a679 !important } .tumbleweed-text.cta-rectangle-box a:hover { color: #fff !important } .tumbleweed-text.cta-play-video a, .tumbleweed-text.cta-text-arrow a { color: #e8a679 !important } .flax-text, .flax-text *, .flax-text.cta-rectangle-box a { color: #e5d87c !important } .flax-text.cta-rectangle-box a:hover { color: #fff !important } .flax-text.cta-play-video a, .flax-text.cta-text-arrow a { color: #e5d87c !important } .cruise-text, .cruise-text *, .cruise-text.cta-rectangle-box a { color: #b0e1ce !important } .cruise-text.cta-rectangle-box a:hover { color: #fff !important } .cruise-text.cta-play-video a, .cruise-text.cta-text-arrow a { color: #b0e1ce !important } .cavern-pink-text, .cavern-pink-text *, .cavern-pink-text.cta-rectangle-box a { color: #e9bcbc !important } .cavern-pink-text.cta-rectangle-box a:hover { color: #fff !important } .cavern-pink-text.cta-play-video a, .cavern-pink-text.cta-text-arrow a { color: #e9bcbc !important } .apricot-text, .apricot-text *, .apricot-text.cta-rectangle-box a { color: #fbd0b3 !important } .apricot-text.cta-rectangle-box a:hover { color: #fff !important } .apricot-text.cta-play-video a, .apricot-text.cta-text-arrow a { color: #fbd0b3 !important } .french-pass-text, .french-pass-text *, .french-pass-text.cta-rectangle-box a { color: #a7d4df !important } .french-pass-text.cta-rectangle-box a:hover { color: #fff !important } .french-pass-text.cta-play-video a, .french-pass-text.cta-text-arrow a { color: #a7d4df !important } .perano-text, .perano-text *, .perano-text.cta-rectangle-box a { color: #b1b1e4 !important } .perano-text.cta-rectangle-box a:hover { color: #fff !important } .perano-text.cta-play-video a, .perano-text.cta-text-arrow a { color: #b1b1e4 !important } .buttermilk-text, .buttermilk-text *, .buttermilk-text.cta-rectangle-box a { color: #fbf2b4 !important } .buttermilk-text.cta-rectangle-box a:hover { color: #fff !important } .buttermilk-text.cta-play-video a, .buttermilk-text.cta-text-arrow a { color: #fbf2b4 !important } .aquamarine-text, .aquamarine-text *, .aquamarine-text.cta-rectangle-box a { color: #64ddac !important } .aquamarine-text.cta-rectangle-box a:hover { color: #fff !important } .aquamarine-text.cta-play-video a, .aquamarine-text.cta-text-arrow a { color: #64ddac !important } .bittersweet-text, .bittersweet-text *, .bittersweet-text.cta-rectangle-box a { color: #fc726d !important } .bittersweet-text.cta-rectangle-box a:hover { color: #fff !important } .bittersweet-text.cta-play-video a, .bittersweet-text.cta-text-arrow a { color: #fc726d !important } .tan-hide-text, .tan-hide-text *, .tan-hide-text.cta-rectangle-box a { color: #ff924e !important } .tan-hide-text.cta-rectangle-box a:hover { color: #fff !important } .tan-hide-text.cta-play-video a, .tan-hide-text.cta-text-arrow a { color: #ff924e !important } .ocean-spray-text, .ocean-spray-text *, .ocean-spray-text.cta-rectangle-box a { color: #72d0e2 !important } .ocean-spray-text.cta-rectangle-box a:hover { color: #fff !important } .ocean-spray-text.cta-play-video a, .ocean-spray-text.cta-text-arrow a { color: #72d0e2 !important } .lavender-text, .lavender-text *, .lavender-text.cta-rectangle-box a { color: #9898e5 !important } .lavender-text.cta-rectangle-box a:hover { color: #fff !important } .lavender-text.cta-play-video a, .lavender-text.cta-text-arrow a { color: #9898e5 !important } .wattle-text, .wattle-text *, .wattle-text.cta-rectangle-box a { color: #d6df38 !important } .wattle-text.cta-rectangle-box a:hover { color: #fff !important } .wattle-text.cta-play-video a, .wattle-text.cta-text-arrow a { color: #d6df38 !important } .light-monochromacy-text, .light-monochromacy-text *, .light-monochromacy-text.cta-rectangle-box a { color: #5ea188 !important } .light-monochromacy-text.cta-rectangle-box a:hover { color: #fff !important } .light-monochromacy-text.cta-play-video a, .light-monochromacy-text.cta-text-arrow a { color: #5ea188 !important } .powder-blue-text, .powder-blue-text *, .powder-blue-text.cta-rectangle-box a { color: #b8d9e2 !important } .powder-blue-text.cta-rectangle-box a:hover { color: #fff !important } .powder-blue-text.cta-play-video a, .powder-blue-text.cta-text-arrow a { color: #b8d9e2 !important } .powder-pink-text, .powder-pink-text *, .powder-pink-text.cta-rectangle-box a { color: #f8d1d4 !important } .powder-pink-text.cta-rectangle-box a:hover { color: #fff !important } .powder-pink-text.cta-play-video a, .powder-pink-text.cta-text-arrow a { color: #f8d1d4 !important } .powder-green-text, .powder-green-text *, .powder-green-text.cta-rectangle-box a { color: #b9d0cc !important } .powder-green-text.cta-rectangle-box a:hover { color: #fff !important } .powder-green-text.cta-play-video a, .powder-green-text.cta-text-arrow a { color: #b9d0cc !important } .powder-yellow-text, .powder-yellow-text *, .powder-yellow-text.cta-rectangle-box a { color: #f2e5be !important } .powder-yellow-text.cta-rectangle-box a:hover { color: #fff !important } .powder-yellow-text.cta-play-video a, .powder-yellow-text.cta-text-arrow a { color: #f2e5be !important } .powder-dark-grey-text, .powder-dark-grey-text *, .powder-dark-grey-text.cta-rectangle-box a { color: #c8c8c8 !important } .powder-dark-grey-text.cta-rectangle-box a:hover { color: #fff !important } .powder-dark-grey-text.cta-play-video a, .powder-dark-grey-text.cta-text-arrow a { color: #c8c8c8 !important } .powder-light-grey-text, .powder-light-grey-text *, .powder-light-grey-text.cta-rectangle-box a { color: #e1e1e1 !important } .powder-light-grey-text.cta-rectangle-box a:hover { color: #fff !important } .powder-light-grey-text.cta-play-video a, .powder-light-grey-text.cta-text-arrow a { color: #e1e1e1 !important } .brand-green-text, .brand-green-text *, .brand-green-text.cta-rectangle-box a { color: #86ed78 !important } .brand-green-text.cta-rectangle-box a:hover { color: #fff !important } .brand-green-text.cta-play-video a, .brand-green-text.cta-text-arrow a { color: #86ed78 !important } .brand-blue-text, .brand-blue-text *, .brand-blue-text.cta-rectangle-box a { color: #032d42 !important } .brand-blue-text.cta-rectangle-box a:hover { color: #fff !important } .brand-blue-text.cta-play-video a, .brand-blue-text.cta-text-arrow a { color: #032d42 !important } .brand-black-text, .brand-black-text *, .brand-black-text.cta-rectangle-box a { color: #000 !important } .brand-black-text.cta-rectangle-box a:hover { color: #fff !important } .brand-black-text-hover.cta-component a:hover, .brand-black-text.cta-play-video a, .brand-black-text.cta-text-arrow a { color: #000 !important } .brand-green-darker-text, .brand-green-darker-text *, .brand-green-darker-text.cta-rectangle-box a { color: #62d84e !important } .brand-green-darker-text.cta-rectangle-box a:hover { color: #fff !important } .brand-green-darker-text.cta-play-video a, .brand-green-darker-text.cta-text-arrow a { color: #62d84e !important } .brand-blue-lighter-text, .brand-blue-lighter-text *, .brand-blue-lighter-text.cta-rectangle-box a { color: #1a5d68 !important } .brand-blue-lighter-text.cta-rectangle-box a:hover { color: #fff !important } .brand-blue-lighter-text.cta-play-video a, .brand-blue-lighter-text.cta-text-arrow a { color: #1a5d68 !important } .brand-gray-text, .brand-gray-text *, .brand-gray-text.cta-rectangle-box a { color: #c3c3c3 !important } .brand-gray-text.cta-rectangle-box a:hover { color: #fff !important } .brand-gray-text.cta-play-video a, .brand-gray-text.cta-text-arrow a { color: #c3c3c3 !important } .text-center-alignment { padding-left: 1.5rem; padding-right: 1.5rem } .flex-box-container-1700 { display: flex; max-width: 170rem; padding: 0 1rem } .flex-box-container { display: flex; flex-wrap: wrap } .flex-box-col { flex-basis: 0; flex-grow: 1; max-width: 100% } .flex-box-col-sm-1 { flex: 0 0 16.666667%; max-width: 16.666667% } .flex-box-col-sm-2 { flex: 0 0 33.333333%; max-width: 33.333333% } .flex-box-col-sm-3 { flex: 0 0 50%; max-width: 50% } .flex-box-col-sm-4 { flex: 0 0 66.666667%; max-width: 66.666667% } .flex-box-col-sm-5 { flex: 0 0 83.333333%; max-width: 83.333333% } .flex-box-col-sm-6 { flex: 0 0 100%; max-width: 100% } .left-margin-sm-0 { margin-left: 0 } .left-margin-sm-1 { margin-left: 8.333333% } .left-margin-sm-2 { margin-left: 16.666667% } .left-margin-sm-3 { margin-left: 25% } .left-margin-sm-4 { margin-left: 33.333333% } .left-margin-sm-5 { margin-left: 41.666667% } .left-margin-sm-6 { margin-left: 50% } .left-margin-sm-7 { margin-left: 58.333333% } .left-margin-sm-8 { margin-left: 66.666667% } .left-margin-sm-9 { margin-left: 75% } .left-margin-sm-10 { margin-left: 83.333333% } .left-margin-sm-11 { margin-left: 91.666667% } .left-margin-sm-12 { margin-left: 100% } .right-margin-sm-0 { margin-right: 0 } .right-margin-sm-1 { margin-right: 8.333333% } .right-margin-sm-2 { margin-right: 16.666667% } .right-margin-sm-3 { margin-right: 25% } .right-margin-sm-4 { margin-right: 33.333333% } .right-margin-sm-5 { margin-right: 41.666667% } .right-margin-sm-6 { margin-right: 50% } .right-margin-sm-7 { margin-right: 58.333333% } .right-margin-sm-8 { margin-right: 66.666667% } .right-margin-sm-9 { margin-right: 75% } .right-margin-sm-10 { margin-right: 83.333333% } .right-margin-sm-11 { margin-right: 91.666667% } .right-margin-sm-12 { margin-right: 100% } .left-padding-sm-0 { padding-left: 0 } .left-padding-sm-1 { padding-left: 8.333333% } .left-padding-sm-2 { padding-left: 16.666667% } .left-padding-sm-3 { padding-left: 25% } .left-padding-sm-4 { padding-left: 33.333333% } .left-padding-sm-5 { padding-left: 41.666667% } .left-padding-sm-6 { padding-left: 50% } .left-padding-sm-7 { padding-left: 58.333333% } .left-padding-sm-8 { padding-left: 66.666667% } .left-padding-sm-9 { padding-left: 75% } .left-padding-sm-10 { padding-left: 83.333333% } .left-padding-sm-11 { padding-left: 91.666667% } .left-padding-sm-12 { padding-left: 100% } .right-padding-sm-0 { padding-right: 0 } .right-padding-sm-1 { padding-right: 8.333333% } .right-padding-sm-2 { padding-right: 16.666667% } .right-padding-sm-3 { padding-right: 25% } .right-padding-sm-4 { padding-right: 33.333333% } .right-padding-sm-5 { padding-right: 41.666667% } .right-padding-sm-6 { padding-right: 50% } .right-padding-sm-7 { padding-right: 58.333333% } .right-padding-sm-8 { padding-right: 66.666667% } .right-padding-sm-9 { padding-right: 75% } .right-padding-sm-10 { padding-right: 83.333333% } .right-padding-sm-11 { padding-right: 91.666667% } .right-padding-sm-12 { padding-right: 100% } .push-left-sm-0 { padding-left: 0 !important } .push-left-sm-5 { padding-left: .5rem !important } .push-left-sm-10 { padding-left: 1rem !important } .push-left-sm-15 { padding-left: 1.5rem !important } .push-left-sm-20 { padding-left: 2rem } .push-left-sm-25 { padding-left: 2.5rem !important } .push-left-sm-30 { padding-left: 3rem !important } .push-right-sm-0 { padding-right: 0 !important } .push-right-sm-5 { padding-right: .5rem !important } .push-right-sm-10 { padding-right: 1rem !important } .push-right-sm-15 { padding-right: 1.5rem !important } .push-right-sm-20 { padding-right: 2rem } .push-right-sm-25 { padding-right: 2.5rem !important } .push-right-sm-30 { padding-right: 3rem !important } .flex-box-col-lg, .flex-box-col-lg-1, .flex-box-col-lg-10, .flex-box-col-lg-11, .flex-box-col-lg-12, .flex-box-col-lg-2, .flex-box-col-lg-3, .flex-box-col-lg-4, .flex-box-col-lg-5, .flex-box-col-lg-6, .flex-box-col-lg-7, .flex-box-col-lg-8, .flex-box-col-lg-9, .flex-box-col-lg-auto, .flex-box-col-md, .flex-box-col-md-1, .flex-box-col-md-10, .flex-box-col-md-11, .flex-box-col-md-12, .flex-box-col-md-2, .flex-box-col-md-3, .flex-box-col-md-4, .flex-box-col-md-5, .flex-box-col-md-6, .flex-box-col-md-7, .flex-box-col-md-8, .flex-box-col-md-9, .flex-box-col-md-auto, .flex-box-col-sm, .flex-box-col-sm-1, .flex-box-col-sm-10, .flex-box-col-sm-11, .flex-box-col-sm-12, .flex-box-col-sm-2, .flex-box-col-sm-3, .flex-box-col-sm-4, .flex-box-col-sm-5, .flex-box-col-sm-6, .flex-box-col-sm-7, .flex-box-col-sm-8, .flex-box-col-sm-9, .flex-box-col-sm-auto, .flex-box-col-xlg, .flex-box-col-xlg-1, .flex-box-col-xlg-10, .flex-box-col-xlg-11, .flex-box-col-xlg-12, .flex-box-col-xlg-2, .flex-box-col-xlg-3, .flex-box-col-xlg-4, .flex-box-col-xlg-5, .flex-box-col-xlg-6, .flex-box-col-xlg-7, .flex-box-col-xlg-8, .flex-box-col-xlg-9, .flex-box-col-xlg-auto { min-height: .1rem; padding-left: 1rem; padding-right: 1rem; position: relative; width: 100% } @media only screen and (min-width: 768px) { a, body, h1, h2, h3, h4, h5, h6, li, p, span { Letter-spacing: normal } .billboard-marquee-component .billboard-marquee-eyebrow, .billboard-marquee-component .billboard-marquee-eyebrow span, .eyebrow, .eyebrow span { font-size: 1.8rem } h1 { font-size: 3.6rem } h1 span.super-case { top: .9rem } body:not(.en) h1 { font-size: 3.2rem } body:not(.en) h1 span.super-case, body:not(.en) h1 sup { top: .55rem } h2 { font-size: 2.8rem } h2 span.super-case, h2 sup { top: .6rem } h3 { font-size: 2.4rem } h3 span.super-case, h3 sup { top: .54rem } h4 { font-size: 2.2rem } h4 span.super-case, h4 sup { top: .55rem } h5 { font-size: 2rem } h5 span.super-case, h5 sup { top: .55rem } h6 { font-size: 1.8rem } h6 span.super-case, h6 sup { top: .44rem } .xlarge-body-copy p span.super-case, .xlarge-body-copy span.super-case, .xlarge-body-copy sup { top: .45rem } .accordion.section .accordion-panel, .accordion.section .accordion-panel p, .accordion.section .accordion-panel span, .large-body-copy, .large-body-copy p, .large-body-copy span { font-size: 2rem } .accordion.section .accordion-panel span.super-case, .accordion.section .accordion-panel sup, .large-body-copy p span.super-case, .large-body-copy span.super-case, .large-body-copy sup { top: .4rem } .accordion.section ul.list-unstyled li, .accordion.section ul.list-unstyled li p, .accordion.section ul.list-unstyled li span, .medium-body-copy, .medium-body-copy p, .medium-body-copy span { font-size: 1.8rem } .accordion.section ul.list-unstyled li span.super-case, .accordion.section ul.list-unstyled li sup, .medium-body-copy p span.super-case, .medium-body-copy span.super-case, .medium-body-copy sup { top: .4rem } .accordion.section .accordion-expand-wrapper a, .accordion.section .accordion-expand-wrapper a p, .accordion.section .accordion-expand-wrapper a span, .small-body-copy, .small-body-copy p, .small-body-copy span, .xsmall-body-copy, .xsmall-body-copy p, .xsmall-body-copy span { font-size: 1.6rem } .accordion.section .accordion-expand-wrapper a span.super-case, .accordion.section .accordion-expand-wrapper a sup, .small-body-copy p span.super-case, .small-body-copy span.super-case, .small-body-copy sup, .xsmall-body-copy p span.super-case, .xsmall-body-copy span.super-case, .xsmall-body-copy sup { top: .3rem } .text-center-alignment { margin: auto; max-width: 58rem; text-align: center } .background-color-768-0 { background-color: #fff } .background-color-768-1 { background-color: #f2f2f2 } .background-color-768-2 { background-color: #d8d8d8 } .cta-btn.white-text { color: #fff } .cta-btn.arrow-icon:before { border-bottom: .2rem solid #fff; border-right: .2rem solid #fff } .flex-box-col-md-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .flex-box-col-md-2 { flex: 0 0 16.666667%; max-width: 16.666667% } .flex-box-col-md-3 { flex: 0 0 25%; max-width: 25% } .flex-box-col-md-4 { flex: 0 0 33.333333%; max-width: 33.333333% } .flex-box-col-md-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .flex-box-col-md-6 { flex: 0 0 50%; max-width: 50% } .flex-box-col-md-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .flex-box-col-md-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .flex-box-col-md-9 { flex: 0 0 75%; max-width: 75% } .flex-box-col-md-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .flex-box-col-md-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .flex-box-col-md-12 { flex: 0 0 100%; max-width: 100% } .left-margin-md-0 { margin-left: 0 } .left-margin-md-1 { margin-left: 8.333333% } .left-margin-md-2 { margin-left: 16.666667% } .left-margin-md-3 { margin-left: 25% } .left-margin-md-4 { margin-left: 33.333333% } .left-margin-md-5 { margin-left: 41.666667% } .left-margin-md-6 { margin-left: 50% } .left-margin-md-7 { margin-left: 58.333333% } .left-margin-md-8 { margin-left: 66.666667% } .left-margin-md-9 { margin-left: 75% } .left-margin-md-10 { margin-left: 83.333333% } .left-margin-md-11 { margin-left: 91.666667% } .left-margin-md-12 { margin-left: 100% } .right-margin-md-0 { margin-right: 0 } .right-margin-md-1 { margin-right: 8.333333% } .right-margin-md-2 { margin-right: 16.666667% } .right-margin-md-3 { margin-right: 25% } .right-margin-md-4 { margin-right: 33.333333% } .right-margin-md-5 { margin-right: 41.666667% } .right-margin-md-6 { margin-right: 50% } .right-margin-md-7 { margin-right: 58.333333% } .right-margin-md-8 { margin-right: 66.666667% } .right-margin-md-9 { margin-right: 75% } .right-margin-md-10 { margin-right: 83.333333% } .right-margin-md-11 { margin-right: 91.666667% } .right-margin-md-12 { margin-right: 100% } .left-padding-md-0 { padding-left: 0 } .left-padding-md-1 { padding-left: 8.333333% } .left-padding-md-2 { padding-left: 16.666667% } .left-padding-md-3 { padding-left: 25% } .left-padding-md-4 { padding-left: 33.333333% } .left-padding-md-5 { padding-left: 41.666667% } .left-padding-md-6 { padding-left: 50% } .left-padding-md-7 { padding-left: 58.333333% } .left-padding-md-8 { padding-left: 66.666667% } .left-padding-md-9 { padding-left: 75% } .left-padding-md-10 { padding-left: 83.333333% } .left-padding-md-11 { padding-left: 91.666667% } .left-padding-md-12 { padding-left: 100% } .right-padding-md-0 { padding-right: 0 } .right-padding-md-1 { padding-right: 8.333333% } .right-padding-md-2 { padding-right: 16.666667% } .right-padding-md-3 { padding-right: 25% } .right-padding-md-4 { padding-right: 33.333333% } .right-padding-md-5 { padding-right: 41.666667% } .right-padding-md-6 { padding-right: 50% } .right-padding-md-7 { padding-right: 58.333333% } .right-padding-md-8 { padding-right: 66.666667% } .right-padding-md-9 { padding-right: 75% } .right-padding-md-10 { padding-right: 83.333333% } .right-padding-md-11 { padding-right: 91.666667% } .right-padding-md-12 { padding-right: 100% } .push-left-md-5 { padding-left: .5rem !important } .push-left-md-10 { padding-left: 1rem !important } .push-left-md-15 { padding-left: 1.5rem !important } .push-left-md-20 { padding-left: 2rem !important } .push-left-md-25 { padding-left: 2.5rem !important } .push-left-md-30 { padding-left: 3rem } .push-right-md-5 { padding-right: .5rem !important } .push-right-md-10 { padding-right: 1rem !important } .push-right-md-15 { padding-right: 1.5rem !important } .push-right-md-20 { padding-right: 2rem !important } .push-right-md-25 { padding-right: 2.5rem !important } .push-right-md-30 { padding-right: 3rem } .flex-box-container-1700 { padding: 0 .5rem } .flex-box-col-lg, .flex-box-col-lg-1, .flex-box-col-lg-10, .flex-box-col-lg-11, .flex-box-col-lg-12, .flex-box-col-lg-2, .flex-box-col-lg-3, .flex-box-col-lg-4, .flex-box-col-lg-5, .flex-box-col-lg-6, .flex-box-col-lg-7, .flex-box-col-lg-8, .flex-box-col-lg-9, .flex-box-col-lg-auto, .flex-box-col-md, .flex-box-col-md-1, .flex-box-col-md-10, .flex-box-col-md-11, .flex-box-col-md-12, .flex-box-col-md-2, .flex-box-col-md-3, .flex-box-col-md-4, .flex-box-col-md-5, .flex-box-col-md-6, .flex-box-col-md-7, .flex-box-col-md-8, .flex-box-col-md-9, .flex-box-col-md-auto, .flex-box-col-sm, .flex-box-col-sm-1, .flex-box-col-sm-10, .flex-box-col-sm-11, .flex-box-col-sm-12, .flex-box-col-sm-2, .flex-box-col-sm-3, .flex-box-col-sm-4, .flex-box-col-sm-5, .flex-box-col-sm-6, .flex-box-col-sm-7, .flex-box-col-sm-8, .flex-box-col-sm-9, .flex-box-col-sm-auto, .flex-box-col-xlg, .flex-box-col-xlg-1, .flex-box-col-xlg-10, .flex-box-col-xlg-11, .flex-box-col-xlg-12, .flex-box-col-xlg-2, .flex-box-col-xlg-3, .flex-box-col-xlg-4, .flex-box-col-xlg-5, .flex-box-col-xlg-6, .flex-box-col-xlg-7, .flex-box-col-xlg-8, .flex-box-col-xlg-9, .flex-box-col-xlg-auto { min-height: .1rem; padding-left: 1.5rem; padding-right: 1.5rem; position: relative; width: 100% } .site-width-1700 { padding-left: 1.5rem; padding-right: 1.5rem } } @media only screen and (min-width: 1024px) { h1 { font-size: 4.8rem } h1 span.super-case, h1 sup { top: 1.1rem } body:not(.en) h1 { font-size: 4.2rem } body:not(.en) h1 span.super-case, body:not(.en) h1 sup { top: 1rem } h2 { font-size: 3.6rem } h2 span.super-case, h2 sup { top: .8rem } h3 { font-size: 2.8rem } h3 span.super-case, h3 sup { top: .64rem } h4 { font-size: 2.4rem } h4 span.super-case, h4 sup { top: .5rem } h5 { font-size: 2.2rem } h5 span.super-case, h5 sup { top: .5rem } h6 { font-size: 2rem } h6 span.super-case, h6 sup { top: .55rem } p span.super-case { top: .3rem } .xlarge-body-copy, .xlarge-body-copy p, .xlarge-body-copy span { font-size: 2.4rem } .xlarge-body-copy p span.super-case, .xlarge-body-copy span.super-case, .xlarge-body-copy sup { top: .44rem } .accordion.section .accordion-expand-wrapper a span.super-case, .accordion.section .accordion-expand-wrapper a sup, .small-body-copy p span.super-case, .small-body-copy span.super-case, .small-body-copy sup, .xsmall-body-copy p span.super-case, .xsmall-body-copy span.super-case, .xsmall-body-copy sup { top: .25rem } .label-copy, .label-copy p, .label-copy span { font-size: 1.2rem } .label-copy p span.super-case, .label-copy span.super-case, .label-copy sup { top: .2rem } .push-left-right-10-percent { padding: 0 8.333333% } .text-center-alignment { max-width: 80rem } .background-color-1024-0 { background-color: #fff } .background-color-1024-1 { background-color: #f2f2f2 } .background-color-1024-2 { background-color: #d8d8d8 } .flex-box-col-lg-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .flex-box-col-lg-2 { flex: 0 0 16.666667%; max-width: 16.666667% } .flex-box-col-lg-3 { flex: 0 0 25%; max-width: 25% } .flex-box-col-lg-4 { flex: 0 0 33.333333%; max-width: 33.333333% } .flex-box-col-lg-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .flex-box-col-lg-6 { flex: 0 0 50%; max-width: 50% } .flex-box-col-lg-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .flex-box-col-lg-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .flex-box-col-lg-9 { flex: 0 0 75%; max-width: 75% } .flex-box-col-lg-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .flex-box-col-lg-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .flex-box-col-lg-12 { flex: 0 0 100%; max-width: 100% } .left-margin-lg-0 { margin-left: 0 } .left-margin-lg-1 { margin-left: 8.333333% } .left-margin-lg-2 { margin-left: 16.666667% } .left-margin-lg-3 { margin-left: 25% } .left-margin-lg-4 { margin-left: 33.333333% } .left-margin-lg-5 { margin-left: 41.666667% } .left-margin-lg-6 { margin-left: 50% } .left-margin-lg-7 { margin-left: 58.333333% } .left-margin-lg-8 { margin-left: 66.666667% } .left-margin-lg-9 { margin-left: 75% } .left-margin-lg-10 { margin-left: 83.333333% } .left-margin-lg-11 { margin-left: 91.666667% } .left-margin-lg-12 { margin-left: 100% } .right-margin-lg-0 { margin-right: 0 } .right-margin-lg-1 { margin-right: 8.333333% } .right-margin-lg-2 { margin-right: 16.666667% } .right-margin-lg-3 { margin-right: 25% } .right-margin-lg-4 { margin-right: 33.333333% } .right-margin-lg-5 { margin-right: 41.666667% } .right-margin-lg-6 { margin-right: 50% } .right-margin-lg-7 { margin-right: 58.333333% } .right-margin-lg-8 { margin-right: 66.666667% } .right-margin-lg-9 { margin-right: 75% } .right-margin-lg-10 { margin-right: 83.333333% } .right-margin-lg-11 { margin-right: 91.666667% } .right-margin-lg-12 { margin-right: 100% } .left-padding-lg-0 { padding-left: 0 } .left-padding-lg-1 { padding-left: 8.333333% } .left-padding-lg-2 { padding-left: 16.666667% } .left-padding-lg-3 { padding-left: 25% } .left-padding-lg-4 { padding-left: 33.333333% } .left-padding-lg-5 { padding-left: 41.666667% } .left-padding-lg-6 { padding-left: 50% } .left-padding-lg-7 { padding-left: 58.333333% } .left-padding-lg-8 { padding-left: 66.666667% } .left-padding-lg-9 { padding-left: 75% } .left-padding-lg-10 { padding-left: 83.333333% } .left-padding-lg-11 { padding-left: 91.666667% } .left-padding-lg-12 { padding-left: 100% } .right-padding-lg-0 { padding-right: 0 } .right-padding-lg-1 { padding-right: 8.333333% } .right-padding-lg-2 { padding-right: 16.666667% } .right-padding-lg-3 { padding-right: 25% } .right-padding-lg-4 { padding-right: 33.333333% } .right-padding-lg-5 { padding-right: 41.666667% } .right-padding-lg-6 { padding-right: 50% } .right-padding-lg-7 { padding-right: 58.333333% } .right-padding-lg-8 { padding-right: 66.666667% } .right-padding-lg-9 { padding-right: 75% } .right-padding-lg-10 { padding-right: 83.333333% } .right-padding-lg-11 { padding-right: 91.666667% } .right-padding-lg-12 { padding-right: 100% } .push-left-lg-5 { padding-left: .5rem !important } .push-left-lg-10 { padding-left: 1rem !important } .push-left-lg-15 { padding-left: 1.5rem !important } .push-left-lg-20 { padding-left: 2rem !important } .push-left-lg-25 { padding-left: 2.5rem !important } .push-left-lg-30 { padding-left: 3rem !important } .push-right-lg-5 { padding-right: .5rem !important } .push-right-lg-10 { padding-right: 1rem !important } .push-right-lg-15 { padding-right: 1.5rem !important } .push-right-lg-20 { padding-right: 2rem !important } .push-right-lg-25 { padding-right: 2.5rem !important } .push-right-lg-30 { padding-right: 3rem !important } .flex-box-container-1700 { padding: 2rem } .flex-box-col-lg, .flex-box-col-lg-1, .flex-box-col-lg-10, .flex-box-col-lg-11, .flex-box-col-lg-12, .flex-box-col-lg-2, .flex-box-col-lg-3, .flex-box-col-lg-4, .flex-box-col-lg-5, .flex-box-col-lg-6, .flex-box-col-lg-7, .flex-box-col-lg-8, .flex-box-col-lg-9, .flex-box-col-lg-auto, .flex-box-col-md, .flex-box-col-md-1, .flex-box-col-md-10, .flex-box-col-md-11, .flex-box-col-md-12, .flex-box-col-md-2, .flex-box-col-md-3, .flex-box-col-md-4, .flex-box-col-md-5, .flex-box-col-md-6, .flex-box-col-md-7, .flex-box-col-md-8, .flex-box-col-md-9, .flex-box-col-md-auto, .flex-box-col-sm, .flex-box-col-sm-1, .flex-box-col-sm-10, .flex-box-col-sm-11, .flex-box-col-sm-12, .flex-box-col-sm-2, .flex-box-col-sm-3, .flex-box-col-sm-4, .flex-box-col-sm-5, .flex-box-col-sm-6, .flex-box-col-sm-7, .flex-box-col-sm-8, .flex-box-col-sm-9, .flex-box-col-sm-auto, .flex-box-col-xlg, .flex-box-col-xlg-1, .flex-box-col-xlg-10, .flex-box-col-xlg-11, .flex-box-col-xlg-12, .flex-box-col-xlg-2, .flex-box-col-xlg-3, .flex-box-col-xlg-4, .flex-box-col-xlg-5, .flex-box-col-xlg-6, .flex-box-col-xlg-7, .flex-box-col-xlg-8, .flex-box-col-xlg-9, .flex-box-col-xlg-auto { min-height: .1rem; padding-left: 2rem; padding-right: 2rem; position: relative; width: 100% } .site-width-1700 { padding-left: 2rem; padding-right: 2rem } } @media only screen and (min-width: 1700px) { .billboard-marquee-component .billboard-marquee-eyebrow, .billboard-marquee-component .billboard-marquee-eyebrow span, .eyebrow, .eyebrow span { font-size: 2rem } h1 { font-size: 6.4rem } h1 span.super-case, h1 sup { top: 1.4rem } body:not(.en) h1 { font-size: 5.6rem } body:not(.en) h1 span.super-case, body:not(.en) h1 sup { top: 1.3rem } h2 { font-size: 4.8rem } h2 span.super-case, h2 sup { font-size: 14.4px; top: 1.1rem } h3 { font-size: 3.6rem } h3 span.super-case, h3 sup { top: .8rem } h4 { font-size: 2.8rem } h4 span.super-case, h4 sup { top: .6rem } h5 { font-size: 2.4rem } h5 span.super-case, h5 sup { top: .5rem } h6 { font-size: 2.2rem } h6 span.super-case, h6 sup { top: .5rem } .xlarge-body-copy, .xlarge-body-copy p, .xlarge-body-copy span { font-size: 2.8rem } .xlarge-body-copy p span.super-case, .xlarge-body-copy span.super-case, .xlarge-body-copy sup { top: .6rem } .accordion.section .accordion-panel, .accordion.section .accordion-panel p, .accordion.section .accordion-panel span, .large-body-copy, .large-body-copy p, .large-body-copy span { font-size: 2.2rem } .accordion.section .accordion-panel span.super-case, .accordion.section .accordion-panel sup, .large-body-copy p span.super-case, .large-body-copy span.super-case, .large-body-copy sup { top: .45rem } .accordion.section ul.list-unstyled li, .accordion.section ul.list-unstyled li p, .accordion.section ul.list-unstyled li span, .medium-body-copy, .medium-body-copy p, .medium-body-copy span { font-size: 2rem } .accordion.section .accordion-expand-wrapper a, .accordion.section .accordion-expand-wrapper a p, .accordion.section .accordion-expand-wrapper a span, .small-body-copy, .small-body-copy p, .small-body-copy span, .xsmall-body-copy, .xsmall-body-copy p, .xsmall-body-copy span { font-size: 1.8rem } .accordion.section .accordion-expand-wrapper a span.super-case, .accordion.section .accordion-expand-wrapper a sup, .small-body-copy p span.super-case, .small-body-copy span.super-case, .small-body-copy sup, .xsmall-body-copy p span.super-case, .xsmall-body-copy span.super-case, .xsmall-body-copy sup { top: .44rem } .push-left-right-10-percent { padding: 0 8.333333% } .text-center-alignment { max-width: 80rem } .background-color-1024-0 { background-color: #fff } .background-color-1024-1 { background-color: #f2f2f2 } .background-color-1024-2 { background-color: #d8d8d8 } .flex-box-col-xlg-1 { flex: 0 0 8.333333%; max-width: 8.333333% } .flex-box-col-xlg-2 { flex: 0 0 16.666667%; max-width: 16.666667% } .flex-box-col-xlg-3 { flex: 0 0 25%; max-width: 25% } .flex-box-col-xlg-4 { flex: 0 0 33.333333%; max-width: 33.333333% } .flex-box-col-xlg-5 { flex: 0 0 41.666667%; max-width: 41.666667% } .flex-box-col-xlg-6 { flex: 0 0 50%; max-width: 50% } .flex-box-col-xlg-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .flex-box-col-xlg-8 { flex: 0 0 66.666667%; max-width: 66.666667% } .flex-box-col-xlg-9 { flex: 0 0 75%; max-width: 75% } .flex-box-col-xlg-10 { flex: 0 0 83.333333%; max-width: 83.333333% } .flex-box-col-xlg-11 { flex: 0 0 91.666667%; max-width: 91.666667% } .flex-box-col-xlg-12 { flex: 0 0 100%; max-width: 100% } .left-margin-xlg-0 { margin-left: 0 } .left-margin-xlg-1 { margin-left: 8.333333% } .left-margin-xlg-2 { margin-left: 16.666667% } .left-margin-xlg-3 { margin-left: 25% } .left-margin-xlg-4 { margin-left: 33.333333% } .left-margin-xlg-5 { margin-left: 41.666667% } .left-margin-xlg-6 { margin-left: 50% } .left-margin-xlg-7 { margin-left: 58.333333% } .left-margin-xlg-8 { margin-left: 66.666667% } .left-margin-xlg-9 { margin-left: 75% } .left-margin-xlg-10 { margin-left: 83.333333% } .left-margin-xlg-11 { margin-left: 91.666667% } .left-margin-xlg-12 { margin-left: 100% } .right-margin-xlg-0 { margin-right: 0 } .right-margin-xlg-1 { margin-right: 8.333333% } .right-margin-xlg-2 { margin-right: 16.666667% } .right-margin-xlg-3 { margin-right: 25% } .right-margin-xlg-4 { margin-right: 33.333333% } .right-margin-xlg-5 { margin-right: 41.666667% } .right-margin-xlg-6 { margin-right: 50% } .right-margin-xlg-7 { margin-right: 58.333333% } .right-margin-xlg-8 { margin-right: 66.666667% } .right-margin-xlg-9 { margin-right: 75% } .right-margin-xlg-10 { margin-right: 83.333333% } .right-margin-xlg-11 { margin-right: 91.666667% } .right-margin-xlg-12 { margin-right: 100% } .left-padding-xlg-0 { padding-left: 0 } .left-padding-xlg-1 { padding-left: 8.333333% } .left-padding-xlg-2 { padding-left: 16.666667% } .left-padding-xlg-3 { padding-left: 25% } .left-padding-xlg-4 { padding-left: 33.333333% } .left-padding-xlg-5 { padding-left: 41.666667% } .left-padding-xlg-6 { padding-left: 50% } .left-padding-xlg-7 { padding-left: 58.333333% } .left-padding-xlg-8 { padding-left: 66.666667% } .left-padding-xlg-9 { padding-left: 75% } .left-padding-xlg-10 { padding-left: 83.333333% } .left-padding-xlg-11 { padding-left: 91.666667% } .left-padding-xlg-12 { padding-left: 100% } .right-padding-xlg-0 { padding-right: 0 } .right-padding-xlg-1 { padding-right: 8.333333% } .right-padding-xlg-2 { padding-right: 16.666667% } .right-padding-xlg-3 { padding-right: 25% } .right-padding-xlg-4 { padding-right: 33.333333% } .right-padding-xlg-5 { padding-right: 41.666667% } .right-padding-xlg-6 { padding-right: 50% } .right-padding-xlg-7 { padding-right: 58.333333% } .right-padding-xlg-8 { padding-right: 66.666667% } .right-padding-xlg-9 { padding-right: 75% } .right-padding-xlg-10 { padding-right: 83.333333% } .right-padding-xlg-11 { padding-right: 91.666667% } .right-padding-xlg-12 { padding-right: 100% } .push-left-xlg-5 { padding-left: .5rem !important } .push-left-xlg-10 { padding-left: 1rem !important } .push-left-xlg-15 { padding-left: 1.5rem !important } .push-left-xlg-20 { padding-left: 2rem !important } .push-left-xlg-25 { padding-left: 2.5rem !important } .push-left-xlg-30 { padding-left: 3rem !important } .push-right-xlg-5 { padding-right: .5rem !important } .push-right-xlg-10 { padding-right: 1rem !important } .push-right-xlg-15 { padding-right: 1.5rem !important } .push-right-xlg-20 { padding-right: 2rem !important } .push-right-xlg-25 { padding-right: 2.5rem !important } .push-right-xlg-30 { padding-right: 3rem !important } } .pad-sm { padding: 8px } .pad-top-sm { padding-top: 8px } .pad-bot-sm { padding-bottom: 8px } .pad-md { padding: 16px } .pad-top-md { padding-top: 16px } .pad-bot-md { padding-bottom: 16px } .pad-lg { padding: 24px } .pad-top-lg { padding-top: 24px } .pad-bot-lg { padding-bottom: 24px } .pad-xl { padding: 32px } .pad-top-xl { padding-top: 32px } .pad-bot-xl { padding-bottom: 32px } .margin-sm { margin: 8px } .margin-top-sm { margin-top: 8px } .margin-bot-sm { margin-bottom: 8px } .margin-md { margin: 16px } .margin-top-md { margin-top: 16px } .margin-bot-md { margin-bottom: 16px } .margin-lg { margin: 24px } .margin-top-lg { margin-top: 24px } .margin-bot-lg { margin-bottom: 24px } .margin-xl { margin: 32px } .margin-top-xl { margin-top: 32px } .margin-bot-xl { margin-bottom: 32px } h1, h2, h3, h4, h5 { margin-before: 0; margin-after: 0 } a { color: var(--brand-black,var(--gable-green)); cursor: pointer; font-family: GilroyRegular; font-size: 14px; letter-spacing: 0; line-height: 14px } a, a:active, a:focus, a:hover { text-decoration: none } li { list-style: none } ul { padding-start: 0 } .img-responsive { display: block; height: auto; max-width: 100%; width: auto } .global-header-divider { font-size: 2rem; margin: 2rem auto; text-align: center } .global-form-disclaimer { list-style: none } .form-1 .global-form-disclaimer span a { color: #9b9b9b !important } .form-1 .contact-us-eloqua-form .global-form-disclaimer { margin-top: 2rem } .form-1 .contact-us-eloqua-form .global-form-disclaimer span a { color: #293e40 !important } #open_flyout_form .global-form-disclaimer { margin: 15px 20px } #open_flyout_form .global-form-disclaimer span { color: #9f9f9f } #open_flyout_form .global-form-disclaimer span a, #open_flyout_form .optin-copy a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; color: #293e40 !important; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } #open_flyout_form .global-form-disclaimer span a:hover, #open_flyout_form .optin-copy a:hover { background-size: 100% 100% !important; color: #293e40 !important } .global-site-innerwidth { padding-left: 1rem; padding-right: 1rem } .card-author-options { display: none } .top-padding-zero { padding-top: 0 } .top-padding-default { padding-top: 6rem } .top-padding-large { padding-top: 12rem } .bottom-padding-zero { padding-bottom: 0 } .bottom-padding-default { padding-bottom: 4rem } .bottom-padding-large { padding-bottom: 8rem } @media only screen and (min-width: 768px) { .global-site-innerwidth { padding-left: 1.5rem; padding-right: 1.5rem } .top-padding-default { padding-top: 4rem } .top-padding-large { padding-top: 8rem } .bottom-padding-default { padding-bottom: 3rem } .bottom-padding-large { padding-bottom: 6rem } } @media only screen and (min-width: 1024px) { .global-site-innerwidth { padding-left: 2rem; padding-right: 2rem } } @media only screen and (min-width: 1700px) { .bottom-padding-default { padding-bottom: 3.6rem } .bottom-padding-large { padding-bottom: 7.2rem } } .component-padding { padding: 0 2rem } @media(min-width: 768px) { .component-padding { padding: 0 3rem } } @media(min-width: 1024px) { .component-padding { padding: 0 4rem } } .padding-zero-top { padding-top: 0 } .padding-zero-bot { padding-bottom: 0 } .padding-40-top { padding-top: 4rem } .padding-40-bot { padding-bottom: 4rem } .padding-80-top { padding-top: 8rem } .padding-80-bot { padding-bottom: 8rem } .cmp-experiencefragment .xf-content-height { min-height: auto } .text-gable-green { color: #293e40 } .bg-gable-green { background-color: #293e40 } .text-acapulco { color: #81b5a1 } .bg-acapulco { background-color: #81b5a1 } .text-cloud { color: #f7f7f7 } .bg-cloud { background-color: #f7f7f7 } .text-white { color: #fff } .bg-white { background-color: #fff } .text-fountain-blue { color: #68a1af } .bg-fountain-blue { background-color: #68a1af } .text-warm-lt-gray { color: #e9ebe0 } .bg-warm-lt-gray { background-color: #e9ebe0 } .component-tiles-container { overflow: hidden; padding: 5rem 0 6rem; position: relative } .component-tiles-container.hide-tile-filter .container-filter, .component-tiles-container.hide-top-tile-line .tiles-container:before { display: none !important } .component-tiles-container.hide-tile-filter .tiles-header h2 { max-width: 75% } .component-tiles-container.hide-bottom-tile-line .tiles-footer-container .tiles-footer:before { display: none } .component-tiles-container.top-padding-large { padding-top: 6rem !important } .component-tiles-container.top-padding-0 { padding-top: 0 !important } .component-tiles-container.bottom-padding-large { padding-bottom: 6rem !important } .component-tiles-container.bottom-padding-0 { padding-bottom: 0 !important } .component-tiles-container.disable-animation .component-tile, .component-tiles-container.disable-animation .component-tile-new { top: 0 !important } .component-tiles-container .tiles-header { display: flex; flex-direction: column; padding: 0 1rem; position: relative } .component-tiles-container .tiles-header h2 { flex-grow: 1; margin: 0 0 .7rem; max-width: 100% } .component-tiles-container .tiles-header .container-filter { -webkit-appearance: none; -moz-appearance: none; background-image: url(servicenow-www-pagelibs-v2/images/filter.svg),url(servicenow-www-pagelibs-v2/images/divider.svg),url(servicenow-www-pagelibs-v2/images/chevron-down.svg); background-position: 1rem,85%,93%; background-repeat: no-repeat; border: .1rem solid #999; border-radius: 0; font-size: 1.8rem; font-weight: 600; height: 4.7rem; margin-bottom: 1.7rem; padding-left: 4.7rem; text-overflow: ellipsis; width: 100% } .component-tiles-container .tiles-header .cta-component.cta-text-arrow { float: right; margin-bottom: 1.6rem; margin-right: -3rem } .component-tiles-container .tiles-header .cta-component.cta-text-arrow .cta-title-link-arrow { margin-right: 0 } .component-tiles-container .tiles-container { height: auto !important } .component-tiles-container .tiles-container:before { background: rgba(41,62,64,.2); clear: both; content: ""; height: .1rem; margin: 0 1rem 2rem; width: 100% } .component-tiles-container .tiles-footer-container { padding: 0 1rem; width: 100% } .component-tiles-container .tiles-footer-container .filter-count { color: #5b6f70; padding-bottom: 8px; text-align: center } .component-tiles-container .tiles-footer-container .tiles-footer { align-content: center; align-items: center; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; position: relative; width: inherit } .component-tiles-container .tiles-footer-container .tiles-footer:before { background-color: rgba(41,62,64,.2); content: ""; height: .1rem; top: 5rem; width: 100% } .component-tiles-container .tiles-footer-container .tiles-footer .load-more { border: .05rem solid rgba(41,62,64,.2); border-top: none; display: block; font-size: 1.4rem; font-weight: 700; height: 4rem; padding: 1.3rem 3.2rem; text-align: center; z-index: 2 } .component-tiles-container .tiles-footer-container .tiles-footer .load-more:hover { background: rgba(41,62,64,.2) } .component-tiles-container .tiles-footer-container .tiles-footer .load-more.hide { display: none } @media only screen and (min-width: 768px) { .component-tiles-container { padding: 4.2rem 0 6rem } .component-tiles-container .tiles-header { flex-wrap: wrap; justify-content: space-between; padding: 0 1.5rem } .component-tiles-container .tiles-header h2 { width: 100% } .component-tiles-container .tiles-header .container-filter { background-position: 1rem,80%,91%; margin-top: 1rem; width: 26.7rem } .component-tiles-container .tiles-header .cta-component { margin-left: auto } .component-tiles-container .tile-line { margin: 0 1.5rem 1rem } .component-tiles-container .tiles-container { padding: 0 } .component-tiles-container .tiles-container:before { margin: 0 1.5rem 2rem } .component-tiles-container .tiles-footer-container { padding: 0 1.5rem 2rem } } @media only screen and (min-width: 1024px) { .component-tiles-container { padding: 7rem 0 6.75rem } .component-tiles-container .tiles-header { padding: 0 2rem } .component-tiles-container .tiles-header h2 { max-width: none } .component-tiles-container .tiles-header .container-filter { margin-bottom: 1.7rem; margin-top: 1.2rem; width: 26.7rem } .component-tiles-container .tile-line { margin: 0 2rem 2rem } .component-tiles-container .tiles-container { padding: 0 0 .8rem } .component-tiles-container .tiles-container:before { margin: 0 2rem 2rem } .component-tiles-container .tiles-footer-container { padding: 0 2rem } .component-tiles-container .tiles-footer-container .tiles-footer .load-more { font-size: 1.8rem; height: 5rem; padding: 1.7rem 4rem } } @media only screen and (min-width: 1700px) { .component-tiles-container.hide-tile-filter .tiles-header h2 { margin-bottom: 2.6rem } .component-tiles-container .tiles-header h2 { margin-bottom: 0; width: 100% } .component-tiles-container .tiles-header .container-filter { margin-bottom: 2.6rem; margin-top: 1.8rem } .component-tiles-container .tiles-container { padding: 0 } } .tile { display: flex; flex-grow: 1; width: 100% } .tile.filtered-tile { display: none !important } .component-tile { margin-bottom: 3.2rem; min-height: 30rem; opacity: 1; padding: 0 1rem; position: relative; transition: opacity .5s; width: 100% } .component-tile .component-tile-overlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-tile .component-tile-overlay .cta-component, .component-tile .component-tile-overlay a { bottom: 0; height: 100%; left: 0; margin: 0; overflow: hidden; padding: 0; position: absolute; right: 0; text-indent: -9999px; top: 0; width: 100%; z-index: 20 } .component-tile.calculator .component-tile-image-container { background-color: #d02d26; bottom: 0; height: 50%; padding: 0; position: absolute; width: calc(100% - 4rem) } .component-tile.calculator .component-tile-image-container .component-tile-image { background-position: top; height: 100%; margin-top: 5%; width: 100% } .component-tile.calculator .component-tile-text-container-container { background-color: #d02d26; position: static } .component-tile.calculator .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: transparent } .component-tile.calculator .component-tile-text-container { background: none; min-height: auto !important; top: 0; width: 100% } .component-tile.calculator .component-tile-text-container a, .component-tile.calculator .component-tile-text-container h3, .component-tile.calculator .component-tile-text-container h6, .component-tile.calculator .component-tile-text-container span { color: #fff } .component-tile.calculator .component-tile-text-container h6 span { color: #293e40 } .component-tile.calculator .component-tile-text-container p { display: none !important } .component-tile.calculator .component-tile-text-container .component-tile-arrow { fill: #fff } .component-tile.featured .component-tile-image { background-position: top } .component-tile.variation-no-image { margin-bottom: 0; min-height: 0 !important } .component-tile.variation-no-image .component-tile-image-container, .component-tile.variation-no-image .component-tile-text-container .cta-component { display: none !important } .component-tile.variation-no-image .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: transparent } .component-tile.variation-no-image .component-tile-text-container-container .component-tile-text-container { display: block; height: 100%; min-height: 0; padding-bottom: 3.6rem } .component-tile.variation-no-image .component-tile-text-container-container .component-tile-text-container:after { display: none } .component-tile.variation-no-image .component-tile-text-container-container .component-tile-text-container h3 { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 .2rem; display: inline; margin-bottom: 1.4rem; padding-bottom: .2rem; transition: all .25s linear } .component-tile.variation-no-image .component-tile-text-container-container .component-tile-text-container p { display: block; margin-top: 1.4rem; min-height: 0 !important } .component-tile.hide-tile-description .component-tile-text-container-container .component-tile-text-container p { display: none } .component-tile.no-tile-background .component-tile-text-container, .component-tile.no-tile-background .component-tile-text-container .comp-full-bleed-bg-color, .component-tile.no-tile-background .component-tile-text-container-container, .component-tile.no-tile-background .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: transparent !important } .component-tile.variation-no-image.show-tile-arrow .component-tile-text-container-container .component-tile-text-container:after { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/company-library/icon/arrow.svg); background-repeat: no-repeat; background-size: contain; content: ""; display: block; position: static; right: auto } .component-tile.show-download-icon .component-tile-text-container-container .component-tile-text-container:after, .component-tile.variation-no-image.show-download-icon .component-tile-text-container-container .component-tile-text-container:after { background-image: url(servicenow-www-pagelibs-v2/images/download.svg); content: "" } .component-tile.show-video-icon .component-tile-text-container-container .component-tile-text-container:after, .component-tile.variation-no-image.show-video-icon .component-tile-text-container-container .component-tile-text-container:after { background-image: url(servicenow-www-pagelibs-v2/images/video-cta.svg); content: ""; margin-top: .8rem } .component-tile.show-audio-icon .component-tile-text-container-container .component-tile-text-container:after, .component-tile.variation-no-image.show-audio-icon .component-tile-text-container-container .component-tile-text-container:after { background-image: url(servicenow-www-pagelibs-v2/images/audio-cta.svg); content: "" } .component-tile.hide-cta-icon .component-tile-text-container-container .component-tile-text-container:after { display: none !important } .component-tile.hidden { cursor: pointer; display: none; pointer-events: none; visibility: hidden } .component-tile.author-mode { visibility: initial !important } .component-tile.filtered-tile { display: none !important } .component-tile.hover:hover .component-tile-image-container .component-tile-image { transform: scale(1.2); transition: transform .5s ease } .component-tile.hover:hover .cta-text-arrow { border: 0 } .component-tile.hover:hover .cta-text-arrow a { cursor: pointer } .component-tile.hover:hover .cta-text-arrow a .cta-title-link-arrow svg { transform: translate(-.5rem) } .component-tile.hover .variation-no-image:hover .component-tile-text-container-container h3 { background-position: 0 100%; background-size: 205% .2rem; transition: all .25s linear } .component-tile a { cursor: default } .component-tile .component-tile-image-container { display: inline-block; height: 0; overflow: hidden; padding: 56.25% 0 0; position: relative; width: 100% } .component-tile .component-tile-image-container .component-tile-image { background-position: 50%; background-repeat: no-repeat; background-size: 101%; height: 100%; position: absolute; top: 0; transition: transform .5s ease; width: 100% } .component-tile .component-tile-text-container-container { background-color: #fff; position: relative } .component-tile .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: #fff } .component-tile .component-tile-text-container-container .component-tile-text-container { display: flex; flex-direction: column; font-family: GilroySemiBold; padding: 1.6rem 1.6rem 5rem; position: relative; z-index: 1 } .component-tile .component-tile-text-container-container .component-tile-text-container:after { background-position: 100% 100%; background-repeat: no-repeat; background-size: contain; bottom: 1.6rem; content: ""; height: 1.8rem; padding: 0; position: absolute; right: 1.6rem; width: 1.8rem } .component-tile .component-tile-text-container-container .component-tile-text-container p { flex-grow: 1; margin: 0 } .component-tile .component-tile-text-container-container .component-tile-text-container h6 { color: #293e40; font-family: GilroySemiBold; font-size: 1.2rem; letter-spacing: .1rem; line-height: 1.8rem; margin: 0; opacity: .6; text-transform: uppercase } .component-tile .component-tile-text-container-container .component-tile-text-container h6 span { font-size: inherit; line-height: inherit; text-transform: none } .component-tile .component-tile-text-container-container .component-tile-text-container h6 span:before { content: " • "; padding: 0 .2rem } .component-tile .component-tile-text-container-container .component-tile-text-container h3 { color: #293e40; flex-grow: 1; font-size: 1.8rem; letter-spacing: auto; line-height: 2.34rem; margin: 0 0 1.6rem } .component-tile .component-tile-text-container-container .component-tile-text-container p { color: #293e40; display: none; font: 1.6rem GilroyRegular; line-height: 2.4rem } .component-tile .component-tile-text-container-container .component-tile-text-container .component-asset-block { bottom: 1.6rem; display: flex; height: 5rem; margin-bottom: -3.4rem; margin-top: 1.6rem; width: 15rem } .component-tile .component-tile-text-container-container .component-tile-text-container .component-asset-block img, .component-tile .component-tile-text-container-container .component-tile-text-container .component-asset-block svg, .component-tile .component-tile-text-container-container .component-tile-text-container .component-asset-block video { height: auto; max-height: 100%; max-width: 100%; width: auto } .component-tile .component-tile-text-container-container .component-tile-text-container .cta-component { bottom: 1.5rem; position: absolute } .component-tile .component-tile-text-container-container .component-tile-text-container .cta-component a span { margin-right: 0 } @media only screen and (min-width: 768px) { .tile { max-width: 33.333333% } .tile.featured-tile { max-width: 66.666667% } .component-tile { min-height: 27.8rem; overflow: hidden; padding: 0 1.5rem } .component-tile, .component-tile.variation-no-image { margin-bottom: 4rem } .component-tile.calculator .cta-component { padding-top: 1.5rem; position: relative } .component-tile.featured { overflow: hidden; position: relative } .component-tile.featured .component-tile-image-container { height: 100%; left: 1.5rem; max-height: 12rem; position: absolute; right: 1.5rem; width: auto } .component-tile.featured .component-tile-image-container .component-tile-image { background-position: top; height: 100%; width: 100% } .component-tile.featured .cta-component { bottom: 2.5rem; position: absolute } .component-tile.featured .component-tile-text-container-container { background: transparent; bottom: 0; height: auto; padding: 25.5% 0 0; position: absolute; width: calc(50% - 3rem) } .component-tile.featured .component-tile-text-container-container .component-tile-text-container { bottom: 0; height: 100%; position: relative; width: 100% } .component-tile.featured .component-tile-text-container-container .component-tile-text-container h6 { margin: 0 } .component-tile.featured .component-tile-text-container-container .component-tile-text-container h3 { max-width: 18.4rem } .component-tile.featured .component-tile-text-container-container .component-tile-text-container h2 { font-size: 2.8rem; line-height: 3.64rem } .component-tile .component-tile-image-container .component-tile-image { background-size: cover !important } .component-tile .component-tile-text-container-container { height: 100%; margin-top: -4px } } @media only screen and (min-width: 1024px) { .tile { max-width: 25% } .tile.featured-tile { max-width: 50% } .component-tile { min-height: 42rem; padding: 0 2rem } .component-tile.featured { position: relative } .component-tile.featured .component-tile-text-container-container { margin-top: -.4rem; width: calc(50% - 4rem) } .component-tile.featured .component-tile-image-container { left: 2rem; right: 2rem } .component-tile.featured .component-tile-image-container .component-tile-image { height: 100% } .component-tile.featured .component-tile-text-container-container .component-tile-text-container h6 { margin: .5rem 0 } .component-tile.featured .component-tile-text-container-container .component-tile-text-container h3 { max-width: 100% } .component-tile.hide-tile-description, .component-tile.variation-no-image { margin-bottom: 3.5rem } .component-tile.hide-tile-description .component-tile-text-container-container .component-tile-text-container p { display: block } .component-tile .component-tile-image-container { height: 16.65rem } .component-tile .component-tile-text-container-container { height: 100%; margin-top: -.4rem } .component-tile .component-tile-text-container-container .component-tile-text-container { min-height: 29rem; padding: 2rem 2rem 6.2rem } .component-tile .component-tile-text-container-container .component-tile-text-container:after { bottom: 2rem; height: 2rem; right: 2rem; width: 2rem } .component-tile .component-tile-text-container-container .component-tile-text-container h6 { margin: .5rem 0 } .component-tile .component-tile-text-container-container .component-tile-text-container h3 { flex-grow: 0; font-size: 2rem; margin-bottom: 1rem; max-width: 100% } .component-tile .component-tile-text-container-container .component-tile-text-container p { display: block; max-width: 100% } .component-tile .component-tile-text-container-container .component-tile-text-container .component-asset-block { bottom: 2rem; margin-bottom: -4.2rem; margin-top: 2.4rem } .component-tile .component-tile-text-container-container .component-tile-text-container .cta-component { width: 100% } .component-tile .component-tile-text-container-container .component-tile-text-container .cta-component a span { font-size: 1.8rem } .component-tile .component-tile-text-container-container .component-tile-text-container .table-bottom-container .cta-component.cta-text-arrow { width: 120% } } @media only screen and (min-width: 1200px) { .component-tile.featured .component-tile-text-container-container .component-tile-text-container { height: 100% } .component-tile .component-tile-text-container-container .component-tile-text-container { height: auto } } @media only screen and (min-width: 1700px) { .component-tile { margin: 0 0 5.6rem; min-height: 50rem } .component-tile .component-tile-image-container { height: 21.1rem } .component-tile.variation-no-image .component-tile-text-container-container .component-tile-text-container { min-height: 20rem } .component-tile.variation-no-image .component-tile-text-container-container .component-tile-text-container p { max-height: 11rem !important } .component-tile .component-tile-text-container-container .component-tile-text-container { min-height: 28.8rem; padding: 3.2rem 3.2rem 7.4rem } .component-tile .component-tile-text-container-container .component-tile-text-container:after { bottom: 3.2rem; right: 3.2rem } .component-tile .component-tile-text-container-container .component-tile-text-container h6 { margin: 0 0 1rem } .component-tile .component-tile-text-container-container .component-tile-text-container h3 { font-size: 2.2rem; max-width: 31.2rem } .component-tile .component-tile-text-container-container .component-tile-text-container p { font-size: 1.8rem; margin-top: 1rem; max-width: none; overflow: hidden; padding-top: .4rem } .component-tile .component-tile-text-container-container .component-tile-text-container .component-asset-block { bottom: 3.2rem } } @media only screen and (max-width: 767px) { .component-tile, .component-tile.variation-no-image { margin-bottom: 2.4rem } .component-tile.calculator .component-tile-image-container { left: 1rem; right: 1rem } .component-tile .component-tile-text-container-container { margin-top: -.4rem } .component-tile .component-tile-text-container-container .component-tile-text-container h6 { font-family: GilroyBold } } @media only screen and (max-width: 1023px) { .component-tile.calculator .component-tile-image-container { height: 100%; left: 1.5rem; right: 1.5rem; width: auto } .component-tile.calculator .component-tile-image-container .component-tile-image { background-position: 100% 100%; background-size: contain } .component-tile.calculator .component-tile-text-container-container { background: 0; position: relative } } .cq-Editable-dom .component-tile, .cq-wcm-edit .component-tile { display: block !important; opacity: 1 !important } .bc-player-default_default { background-color: transparent !important } .component-content-block { background-position: top; background-repeat: no-repeat; background-size: contain; position: relative } .component-content-block.bg-cover-size-mobile { background-position: top; background-repeat: no-repeat; background-size: cover } .component-content-block .flex-box-container { position: relative } .component-content-block .flex-box-container .content-col { padding-bottom: 2rem; padding-top: 2rem; z-index: 1 } .component-content-block .flex-box-container .content-col .body, .component-content-block .flex-box-container .content-col .body p { font-family: GilroyRegular !important; font-size: 1.8rem; line-height: 1.7 } @media only screen and (min-width: 768px) { .component-content-block .flex-box-container .content-col .body, .component-content-block .flex-box-container .content-col .body p { font-size: 2rem } } @media only screen and (min-width: 1700px) { .component-content-block .flex-box-container .content-col .body, .component-content-block .flex-box-container .content-col .body p { font-size: 2.2rem } } .component-content-block .flex-box-container .content-col .content-wrap { padding-bottom: 0; padding-top: 0 } .component-content-block .flex-box-container .content-col .content-wrap h2 { margin-bottom: 0; margin-top: 0; padding-bottom: 0; padding-top: 0 } .component-content-block .flex-box-container .asset-col { height: auto; width: 100% } .component-content-block .flex-box-container .asset-col .asset-col-container { position: relative } .component-content-block .flex-box-container .asset-col .foreground-layer { height: auto; line-height: 0; width: 100% } .component-content-block .flex-box-container .asset-col .foreground-layer .video-target { height: 100%; width: 100% } .component-content-block .flex-box-container .asset-col .foreground-layer .animation-section-container, .component-content-block .flex-box-container .asset-col .foreground-layer img, .component-content-block .flex-box-container .asset-col .foreground-layer video { height: auto; width: 100% } .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-2 { position: absolute; top: 0 } .component-content-block.content-block-new .cta-list { margin: 2.4rem 0 0 } .component-content-block.content-block-new .cta-component.cta-rectangle-box { margin-right: 2.4rem } .component-content-block.content-block-new.asset-column-grid .flex-box-container { display: flex; position: relative } .component-content-block.content-block-new.asset-column-grid .flex-box-container .flex-box-col-sm-6.flex-box-col-md-7.image-col { padding: 3.2rem 1rem } .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col { align-items: center; display: flex; justify-content: center } .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col-container { height: 100%; padding-bottom: 1rem; padding-top: 1rem; position: relative; width: 100% } .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col-container .foreground-layer { height: 100%; margin-left: 0; width: 100% !important } .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col-container .foreground-layer-2 { position: relative } .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col-container .foreground-layer-2 div.overlay-video-container, .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col-container .foreground-layer-2 img { display: block; height: auto; left: 50%; max-height: 30rem; width: auto } .component-content-block.content-block-new.asset-column-grid .flex-box-container .asset-col-container .foreground-layer-2 .overlay-video-container video { height: 100%; width: 100% } .component-content-block.content-block-new.asset-full-bleed .flex-box-container { align-items: stretch } .component-content-block.content-block-new.asset-full-bleed .asset-col, .component-content-block.content-block-new.asset-full-bleed .asset-col .foreground-layer { height: 100% } .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container { left: -1rem; max-height: 30rem; min-height: 30rem; width: calc(100% + 2rem) !important } .component-content-block.content-block-new.asset-full-bleed .asset-col .img-responsive { height: 100%; left: auto; max-height: 30rem; -o-object-fit: cover; object-fit: cover; -o-object-position: 50% 50%; object-position: 50% 50%; position: relative; top: auto; transform: none } .component-content-block.content-block-new.asset-full-bleed .flex-box-col-sm-6.flex-box-col-md-7.image-col { padding-left: 0; padding-right: 0 } .component-content-block.content-block-new .flex-box-container .content-col { padding-bottom: 3.2rem; padding-top: 3.2rem } .component-content-block.content-block-new .flex-box-container .content-col .title { padding-bottom: 1.6rem } .component-content-block.content-block-new .flex-box-container .content-col .body, .component-content-block.content-block-new .flex-box-container .content-col .body p { font-family: GilroyRegular; font-size: 1.8rem; line-height: 3.06rem; margin-bottom: 0; margin-top: 0 } .component-content-block.content-block-new .flex-box-container .content-col .content-wrap .cta-list .cta-component { margin-bottom: 0 } @media only screen and (min-width: 768px) { .component-content-block.content-block-new .cta-component.cta-rectangle-box a { padding: 1.1rem 2rem } .component-content-block.content-block-new .body, .component-content-block.content-block-new .body p { font-size: 2rem } .component-content-block.content-block-new.asset-full-bleed .cta-component.cta-rectangle-box a { padding: 1.1rem 1.3rem } .component-content-block.content-block-new.asset-full-bleed .content-col { align-items: center; display: flex; justify-content: center } .component-content-block.content-block-new.asset-full-bleed .asset-col { height: 100%; margin-top: 0 } .component-content-block.content-block-new.asset-full-bleed .asset-col:not(.order-md-2) { left: 0; position: absolute } .component-content-block.content-block-new.asset-full-bleed .asset-col .foreground-layer { left: -2rem } .component-content-block.content-block-new.asset-full-bleed .asset-col.order-md-2 .foreground-layer { left: unset; right: -2rem !important } .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container { max-height: none; min-height: none } .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container .img-responsive { max-height: none; min-height: 46.1rem } .component-content-block.content-block-new .cta-component a .cta-play-video-svg, .component-content-block.content-block-new .cta-component a .cta-title-link-arrow { margin-right: 0 } .component-content-block.content-block-new.asset-column-grid .flex-box-container .flex-box-col-sm-6.flex-box-col-md-7.image-col { padding-left: 1.5rem; padding-right: 0 } .component-content-block.content-block-new.asset-column-grid .flex-box-container .content-col { padding-right: 0 } .component-content-block.content-block-new.asset-column-grid .asset-col .asset-col-container .foreground-layer-2 div.overlay-video-container, .component-content-block.content-block-new.asset-column-grid .asset-col .asset-col-container .foreground-layer-2 img { max-height: none; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 100% } .component-content-block.content-block-new .flex-box-container { height: auto; min-height: 46.1rem } .component-content-block.content-block-new .flex-box-container .asset-col { position: relative; width: 55% } .component-content-block.content-block-new .flex-box-container .asset-col .foreground-layer { right: unset } .component-content-block.content-block-new .flex-box-container .asset-col .foreground-layer img { height: auto; max-height: 100%; max-width: 100% } .component-content-block.content-block-new .flex-box-container .asset-col.order-md-2 { position: absolute } .component-content-block.content-block-new .flex-box-container .asset-col.order-md-2 .foreground-layer { right: -1.5rem } .component-content-block.content-block-new .flex-box-container .content-col { height: 100%; padding-bottom: 6rem; padding-top: 6rem } .component-content-block.content-block-new .flex-box-container .content-col .content-wrap .content-block-list { margin-bottom: 1.6rem } .component-content-block.content-block-new .flex-box-container .content-col.order-md-2 { position: absolute; right: 0 } } @media only screen and (min-width: 1024px) { .component-content-block.content-block-new .cta-list { margin: 3.2rem 0 0 } .component-content-block.content-block-new .cta-component.cta-rectangle-box { margin-right: 4rem } .component-content-block.content-block-new.asset-column-grid .flex-box-container .flex-box-col-sm-6.flex-box-col-md-7.image-col { padding-left: 2rem; padding-right: 2rem } .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container .foreground-layer { overflow: hidden } .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container .img-responsive { min-height: 110%; top: -5% } .component-content-block.content-block-new .flex-box-container { min-height: 53.1rem } .component-content-block.content-block-new .flex-box-container .content-col { padding-bottom: 8rem; padding-top: 8rem } .component-content-block.content-block-new .flex-box-container .content-col .body, .component-content-block.content-block-new .flex-box-container .content-col .body p { font-family: GilroyRegular; font-size: 2rem; line-height: 3.4rem } } @media only screen and (min-width: 1700px) { .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container .foreground-layer { overflow: unset } .component-content-block.content-block-new.asset-full-bleed .asset-col .asset-col-container .img-responsive { min-height: 68.2rem; top: 0 } .component-content-block.content-block-new .flex-box-container { min-height: 68.2rem } .component-content-block.content-block-new .flex-box-container .flex-box-col-sm-6.flex-box-col-md-7.image-col { margin-left: 0 } .component-content-block.content-block-new .flex-box-container .asset-col .foreground-layer img { height: 100%; max-height: none; max-width: none } .component-content-block.content-block-new .flex-box-container .content-col .title { padding-bottom: 2.4rem } .component-content-block.content-block-new .flex-box-container .content-col .body, .component-content-block.content-block-new .flex-box-container .content-col .body p { font-family: GilroyRegular; font-size: 2.2rem; line-height: 3.74rem } } .component-content-block.variation-3 .content-block-list { margin-bottom: .8rem } .component-content-block.variation-3 .content-block-list ul { -webkit-margin-after: 0; -webkit-margin-before: 1.6rem; -webkit-padding-start: 0; margin-block-end: 0; margin-block-start: 1.6rem; padding-inline-start: 0 } .component-content-block.variation-3 .content-block-list ul li { font-size: 1.8rem; line-height: 2.7rem; padding: 0 0 1rem 2rem } .component-content-block.variation-3 .content-block-list ul li:last-child { padding: 0 0 0 2rem } .component-content-block.variation-3 .content-block-list ul.unordered-icon li { background-position: top .75rem left; background-repeat: no-repeat; background-size: 1.2rem } .component-content-block.variation-3 .content-block-list ul.unordered { -webkit-padding-start: 1.75rem; padding-inline-start: 1.75rem } .component-content-block.variation-3 .content-block-list ul.unordered li { list-style: disc; padding: 0 0 1rem } .component-content-block.variation-3 .content-block-list ol { -webkit-margin-after: 0; -webkit-margin-before: 1.6rem; -webkit-padding-start: 0; counter-reset: content-block-counter; list-style-type: none; margin-block-end: 0; margin-block-start: 1.6rem; padding-inline-start: 0 } .component-content-block.variation-3 .content-block-list ol > li { counter-increment: content-block-counter; font-size: 1.8rem; line-height: 2.7rem; padding: 0 0 1rem } .component-content-block.variation-3 .content-block-list ol > li:last-child { padding: 0 } .component-content-block.variation-3 .content-block-list ol > li:before { content: counter(content-block-counter); font-family: GilroyBold; margin-right: .8rem } .component-content-block.variation-3 .content-block-list ol.reg-li > li:before { font-family: GilroyRegular } .component-content-block.variation-3 .content-block-list ol.mix ul { -webkit-padding-start: 3.6rem; padding-inline-start: 3.6rem } .component-content-block.variation-3 .content-block-list ol.mix ul li { list-style: disc; padding: 0 0 1rem } .component-content-block.variation-3 .content-block-list ol.mix ul li:before { content: none } .component-content-block .video-js.video-target .vjs-tech { left: unset !important; right: 0 !important } .component-content-block.text-block-align-right .video-js.video-target .vjs-tech { left: 0 !important; right: unset !important } .component-content-block.bg-transition .content-col, .component-content-block.bg-transition .content-col-icon, .component-content-block.bg-transition .content-col-icon:before, .component-content-block.bg-transition .content-col:before { background-color: transparent } .component-content-block .content-block-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-content-block .icon-col { align-items: center; background-position: 50% 0; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; min-height: 30vw; z-index: 1000 } .component-content-block .icon-col .icon-grid { align-items: flex-start; border: 0; display: flex; flex-wrap: wrap; justify-content: center; min-width: 25rem; padding: 1.6rem 0 4rem; width: 75% } .component-content-block .icon-col .icon-grid-item { border: 0; padding: 2.4rem 0 0; text-align: center; width: 33% } .component-content-block .icon-col .icon-grid-item a:hover { cursor: pointer; text-decoration: underline } .component-content-block .icon-col .icon-grid-item a.anchorInactive, .component-content-block .icon-col .icon-grid-item a.anchorInactive:hover { cursor: unset; text-decoration: none } .component-content-block .icon-col .icon-grid-item-wide-1 { width: 100% } .component-content-block .icon-col .icon-grid-item-wide-2 { width: 50% } .component-content-block .icon-col .icon-grid-item-wide-3 { width: 33.33% } .component-content-block .icon-col .icon-grid-item-wide-4 { width: 50% } .component-content-block .icon-col .icon-grid-item-wide-5 { width: 33% } .component-content-block .icon-col .icon-large { max-height: 10rem; max-width: 10rem } .component-content-block .icon-col .icon-full { max-height: 20rem; max-width: 20rem } .component-content-block .icon-col .icon-grid-item img, .component-content-block .icon-col .icon-grid-item svg { border: 0; margin: 0; max-height: 5rem; max-width: 5rem; min-width: 4rem; width: 50% } .component-content-block .icon-col .icon-grid-item .item-title { color: #293e40; display: block; font: 1.2rem GilroySemiBold; line-height: 1.56rem; margin: auto; max-width: 10rem; padding: .8rem .4rem 0 } .component-content-block .icon-col #canvas { border: 0; height: auto !important; margin: auto !important; max-width: 20rem; padding: 0 .4rem !important; width: 75% !important } .component-content-block .icon-col #animation_container { align-items: center; border: 0; display: flex; height: 75% !important; text-align: center; width: 100% !important } .component-content-block .content-col-icon { background-color: #fff; padding-bottom: 2rem } .component-content-block .content-col-icon:before { background: #fff; content: ""; display: block; height: 100%; left: -100%; position: absolute; width: 1000% } .component-content-block .content-col-icon .content-wrap-icon { padding: 0; position: relative } .component-content-block .content-col-icon .cta-list-icon { display: flex; margin: 0 } .component-content-block .image-col { align-items: center; background-position: 50% 0; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; min-height: 75vw } .component-content-block .image-col .image-wrap { position: relative } .component-content-block .image-col .image-wrap .overlay { bottom: 0; display: block; left: 0; position: absolute; right: 0; top: 0 } .component-content-block .image-col .image-wrap .overlay div.overlay-video-container, .component-content-block .image-col .image-wrap .overlay img { display: block; height: auto; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 100% } .component-content-block .image-col .image-wrap .overlay .overlay-video-container video { height: 100%; width: 100% } .component-content-block .image-col .image-wrap .overlay.align-bottom img { bottom: 0; top: auto; transform: translate(-50%) } .component-content-block.has-bg-image .image-wrap { display: none } .component-content-block .flex-box-col-sm-6.flex-box-col-md-7.image-col, .component-content-block .site-width-1700.video { padding-left: 0; padding-right: 0 } .component-content-block .content-col { background-color: #fff } .component-content-block .content-col:before { background: #fff; content: ""; display: block; height: 100%; left: -100%; position: absolute; top: 0; width: 100% } .component-content-block .site-width-1700.video > .flex-box-container.align-items-center > .content-col { padding-left: 2rem; padding-right: 2rem } .component-content-block .content-wrap { padding: 2.4rem 0 0; position: relative } .component-content-block .cta-list { margin: 2.4rem 0 0 } @media only screen and (max-width: 767px) { .component-content-block .site-width-1700 { max-width: 100% } .component-content-block .site-width-1700.video { padding-left: 0; padding-right: 0 } .component-content-block .title h2 { margin-bottom: 0 } .component-content-block .body, .component-content-block .body p { margin-top: 1.6rem } .component-content-block > .container { max-width: 100% } .component-content-block .component-content-block .image-col.flex-box-col-sm-6.flex-box-col-md-7.order-md-2 { display: none } .component-content-block .component-content-block .content-col { background-color: transparent } .component-content-block .component-content-block .content-col:before { display: none } .component-content-block .flex-box-container .asset-col .foreground-layer { margin-left: -1rem; width: calc(100% + 2rem) !important } .component-content-block.bg-img-hidden-mobile { background-image: none !important } } @media only screen and (min-width: 768px) { .component-content-block { background-position: 50% 0; background-repeat: no-repeat; background-size: cover; padding: 0 } .component-content-block.has-bg-image .image-col { background-image: none !important } .component-content-block.has-bg-image .image-wrap { display: block } .component-content-block .flex-box-container { min-height: 45rem } .component-content-block .flex-box-container .content-col { background-color: transparent; padding-bottom: 6rem; padding-top: 6rem } .component-content-block .flex-box-container .content-col:before { display: none !important } .component-content-block .flex-box-container .asset-col { height: 100%; max-height: 45rem; position: absolute; right: 0; width: 100% } .component-content-block .flex-box-container .asset-col .asset-col-container { position: unset } .component-content-block .flex-box-container .asset-col .asset-col-container h2 { font-size: 2.8rem; line-height: 3.64rem } .component-content-block .flex-box-container .asset-col .foreground-layer { height: 100%; position: absolute; right: -6.5rem; text-align: right; width: auto } .component-content-block .flex-box-container .asset-col .foreground-layer .animation-section-container, .component-content-block .flex-box-container .asset-col .foreground-layer img, .component-content-block .flex-box-container .asset-col .foreground-layer video { height: 100%; width: auto } .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-back, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-front { margin-left: 0; right: -6.5rem; width: 85% } .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-back .animation-section-continer, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-back img, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-back video, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-front .animation-section-continer, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-front img, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-1.parallax-effect-front video { height: 90% } .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-2 { top: unset } .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-2.parallax-effect-back, .component-content-block .flex-box-container .asset-col .foreground-layer.foreground-layer-2.parallax-effect-front { width: auto } .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="cloud-grey-platform-icon.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-br.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-de.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-es.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-fr.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-it.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-nl.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="cloud-grey-platform-icon.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-br.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-de.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-es.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-fr.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-it.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-nl.gif"] { align-self: center; height: auto; left: 5rem; position: relative; width: 68% } } @media only screen and (min-width: 768px)and (max-width:1024px) { .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="cloud-grey-platform-icon.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-br.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-de.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-es.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-fr.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-it.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 picture > img[src*="products-icon-nl.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="cloud-grey-platform-icon.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-br.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-de.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-es.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-fr.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-it.gif"], .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 > img[src*="products-icon-nl.gif"] { width: 75% } } @media only screen and (min-width: 768px) { .component-content-block .image-col { min-height: 0; padding-bottom: 0; padding-top: 0 } .component-content-block .flex-box-col-sm-6.flex-box-col-md-7.image-col { padding-left: 1.5rem; padding-right: 1.5rem } .component-content-block .site-width-1700.video { padding-left: 1rem; padding-right: 1rem } .component-content-block .title h2 { margin-bottom: 0 } .component-content-block .image-col.order-md-2 { margin-left: 0 } .component-content-block.top-bottom-lg-padding { padding: 15rem 0 } .component-content-block .icon-col .icon-grid-item { padding: 2.4rem .4rem 0 } .component-content-block .icon-col .icon-grid-item img, .component-content-block .icon-col .icon-grid-item svg { max-height: 7rem; max-width: 7rem } .component-content-block .icon-col .icon-grid-item .item-title { font-size: 1.4rem; line-height: 2.08rem; max-width: 10rem; padding: .8rem 0 0 } .component-content-block .icon-col .icon-grid-item-wide-4 { width: 50% } .component-content-block .icon-col .icon-grid-item-wide-5 { width: 33% } .component-content-block .icon-col #canvas { border: 0; height: auto !important; margin: auto !important; max-width: 28rem; width: 75% !important } .component-content-block .icon-col #animation_container { align-items: center; border: 0; display: flex; height: 75% !important; text-align: center; width: 100% !important } .component-content-block .content-col-icon, .component-content-block .content-col-icon:before { background-color: transparent } .component-content-block.text-block-align-right .content-col { left: 58.6%; position: relative } .component-content-block.text-block-align-right .asset-col { left: 0; right: unset } .component-content-block.text-block-align-right .asset-col .foreground-layer { left: -1.5rem; right: unset; text-align: left } } @media only screen and (min-width: 1024px) { .component-content-block { padding: 0 } .component-content-block .body, .component-content-block .body p { font-family: GilroyRegular !important; font-size: 2rem; line-height: 3.4rem } .component-content-block .flex-box-container { min-height: 60rem } .component-content-block .flex-box-container .content-col { padding-bottom: 8rem; padding-right: 2.6rem; padding-top: 8rem } .component-content-block .flex-box-container .asset-col { max-height: none } .component-content-block .flex-box-container .asset-col .foreground-layer { right: -2rem } .component-content-block .image-col.order-md-2 { margin-left: 0 } .component-content-block.top-bottom-lg-padding { padding: 20rem 0 } .component-content-block.text-block-align-right .asset-col .foreground-layer { left: -2rem } .component-content-block .flex-box-col-sm-6.flex-box-col-md-7.image-col { padding-left: 2rem; padding-right: 2rem } .component-content-block .site-width-1700.video { padding-left: 1rem; padding-right: 1rem } .component-content-block .icon-col .icon-grid { width: 100% } .component-content-block .icon-col .icon-grid-item { min-height: 10rem; padding: .8rem .8rem 0; width: 20% } .component-content-block .icon-col .icon-grid-item img, .component-content-block .icon-col .icon-grid-item svg { max-height: 8rem; max-width: 8rem; min-width: 4rem } .component-content-block .icon-col .icon-grid-item .item-title { font-size: 1.4rem; line-height: 1.82rem; max-width: 10rem; padding: 1.6rem 0 0 } .component-content-block .icon-col .icon-grid-item-wide-1 { width: 100% } .component-content-block .icon-col .icon-grid-item-wide-2 { width: 50% } .component-content-block .icon-col .icon-grid-item-wide-3 { width: 33.33% } .component-content-block .icon-col .icon-grid-item-wide-4 { width: 25% } .component-content-block .icon-col .icon-grid-item-wide-5 { width: 20% } .component-content-block .icon-col .icon-large { max-height: 10rem !important; max-width: 10rem !important } .component-content-block .icon-col .icon-full { max-height: 20rem !important; max-width: 20rem !important } .component-content-block .icon-col #canvas { border: 0; height: auto !important; margin: auto !important; max-width: 28rem; padding: 1.6rem .4rem 0 !important; width: 75% !important } .component-content-block .icon-col #animation_container { align-items: center; border: 0; display: flex; height: 75% !important; text-align: center; width: 100% !important } } @media only screen and (min-width: 1700px) { .component-content-block .body, .component-content-block .body p { font-family: GilroyRegular !important; font-size: 2.2rem; line-height: 3.74rem } .component-content-block .flex-box-container { min-height: 75rem } .component-content-block .flex-box-container .content-col { padding-bottom: 8rem; padding-right: 2rem; padding-top: 8rem } .component-content-block .image-col.order-md-2 { margin-left: 8.333333% } .component-content-block .icon-col .icon-grid { width: 100% } .component-content-block .icon-col .icon-grid-item { min-height: 10rem; padding: 1.6rem .8rem 0; width: 20% } .component-content-block .icon-col .icon-grid-item img, .component-content-block .icon-col .icon-grid-item svg { max-height: 8rem; max-width: 8rem; min-width: 4rem } .component-content-block .icon-col .icon-grid-item .item-title { font-size: 1.8rem; line-height: 2.34rem; max-width: 10rem; padding: 2.4rem 0 0 } .component-content-block .icon-col .icon-grid-item-wide-1 { width: 100% } .component-content-block .icon-col .icon-grid-item-wide-2 { width: 50% } .component-content-block .icon-col .icon-grid-item-wide-3 { width: 33.33% } .component-content-block .icon-col .icon-grid-item-wide-4 { width: 25% } .component-content-block .icon-col .icon-grid-item-wide-5 { width: 20% } .component-content-block .icon-col .icon-large { max-height: 10rem !important; max-width: 10rem !important } .component-content-block .icon-col .icon-full { max-height: 20rem !important; max-width: 20rem !important } .component-content-block .component-content-block .image-col.order-md-2, .component-content-block ::-ms-backdrop { margin-left: 0 } } @media (-ms-high-contrast:active),(-ms-high-contrast:none) { .component-content-block .asset-col-container { position: static !important } .component-content-block .asset-col-container .foreground-layer { position: absolute !important } .component-content-block .flex-box-container .asset-col { top: 0 } #vjs_video_3_html5_api { height: auto !important; left: 0 } } @media only screen and (max-width: 767px) { body[data-currentPage="/content/servicenow/www/locale-sites/en-us"] .component-content-block.has-bg-image { background-image: none !important } } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .temp-wrapper-for-ie .vjs-tech { height: auto !important } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block .asset-col .asset-col-container { height: 100% } @media only screen and (min-width: 768px) { body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block .flex-box-container .asset-col { top: 0 } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block .flex-box-container .asset-col .asset-col-container { position: static } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block .flex-box-container .asset-col .foreground-layer { margin-left: 0; width: 85% !important } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block:not(.text-block-align-right) .asset-col .asset-col-container .foreground-layer.foreground-layer-1 { display: flex; justify-content: flex-end; overflow-x: hidden; overflow-y: hidden; right: 0 } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block:not(.text-block-align-right) .asset-col.order-md-2 .asset-col-container .foreground-layer.foreground-layer-1 { justify-content: center } } @media only screen and (min-width: 768px)and (min-width:1900px) { body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .component-content-block:not(.text-block-align-right) .asset-col.order-md-2 .asset-col-container .foreground-layer.foreground-layer-1 { justify-content: flex-end } } @media(max-width: 1500px)and (min-width:768px) { body[data-currentPage^="/content/servicenow/www/locale-sites/fr-fr"].fr .component-content-block .flex-box-container .asset-col .foreground-layer, body[data-currentPage^="/content/servicenow/www/locale-sites/it-it"].it .component-content-block .flex-box-container .asset-col .foreground-layer, body[data-currentPage^="/content/servicenow/www/locale-sites/ja-jp"].ja .component-content-block .flex-box-container .asset-col .foreground-layer, body[data-currentPage^="/content/servicenow/www/locale-sites/nl-nl"].nl .component-content-block .flex-box-container .asset-col .foreground-layer { align-items: normal; display: initial; flex-direction: row } body[data-currentPage^="/content/servicenow/www/locale-sites/fr-fr"].fr .component-content-block .flex-box-container .asset-col .foreground-layer img, body[data-currentPage^="/content/servicenow/www/locale-sites/it-it"].it .component-content-block .flex-box-container .asset-col .foreground-layer img, body[data-currentPage^="/content/servicenow/www/locale-sites/ja-jp"].ja .component-content-block .flex-box-container .asset-col .foreground-layer img, body[data-currentPage^="/content/servicenow/www/locale-sites/nl-nl"].nl .component-content-block .flex-box-container .asset-col .foreground-layer img { height: 100% } } @media only screen and (min-width: 768px) { :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block .flex-box-container .asset-col { top: 0 } :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block .flex-box-container .asset-col .asset-col-container .foreground-layer { margin-left: 0; width: 85% } :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col { top: unset } :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 { display: flex; justify-content: flex-end; overflow-x: hidden; overflow-y: hidden; right: 0 } :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col .asset-col-container .foreground-layer.foreground-layer-1 .video-js.video-target { left: 0 !important; right: unset !important } :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col.order-md-2 .asset-col-container .foreground-layer.foreground-layer-1 { justify-content: center } } @media only screen and (min-width: 768px)and (min-width:1900px) { :not(body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"]) .component-content-block:not(.text-block-align-right) .flex-box-container .asset-col.order-md-2 .asset-col-container .foreground-layer.foreground-layer-1 { justify-content: flex-end } } .hero-marquee-component, .hero-marquee-component * { transition: width .25s ease,max-width .25s ease } .hero-marquee-component .hero-marquee-component-outter-wrapper { overflow: hidden } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper { height: 100%; line-height: 0; position: relative; right: 0; top: 0; width: 100% } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-component-background-video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper img { height: auto; position: relative; top: 0; width: 100% } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block img, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block svg, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block video { left: unset; max-width: 118%; right: 0 } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block img { max-width: none } .hero-marquee-component .hero-marquee-left-background { background: #fff; height: 100%; opacity: 1; position: absolute; width: 100% } .hero-marquee-component .hero-marquee-left-background:before { background: #fff; content: ""; display: block; height: 100%; left: -990%; position: absolute; width: calc(1000% + .1rem) } .hero-marquee-component.no-left-col-background .hero-marquee-left-background { display: none !important } .hero-marquee-component.no-left-col-background .hero-marquee-left-col { margin-top: 0 } .hero-marquee-component .hero-marquee-component-outter-wrapper, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-right-col { height: auto; position: relative } .hero-marquee-component .hero-marquee-left-col { order: 2; z-index: 10 } .hero-marquee-component .hero-marquee-right-col { -moz-align-items: center; -o-align-items: center; align-items: center; display: flex; order: 1 } .hero-marquee-component[data-com-name-variant=marquee-dual-toned] .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { opacity: 1 } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { opacity: 0; position: relative; top: 0; width: 100% } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section.show-marquee-header { opacity: 1 } .hero-marquee-component .hero-marquee-content { height: 100%; position: relative } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-title { position: relative } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-title * { color: #293e40 } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-title p { font-size: 1.4rem; line-height: 2rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section { bottom: 0; padding: 2.5rem 1rem; position: relative; width: auto } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section:before { bottom: 0; content: ""; display: block; height: 100%; left: -100%; position: absolute; width: calc(1000% + .1rem) } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section * { color: #fff } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-text { position: relative } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-text.xl-body-copy, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-text.xl-body-copy p, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-text.xl-body-copy span { font-size: 1.8rem; line-height: 2.7rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-cta { margin-top: .2rem; position: relative } .hero-marquee-component .hero-marquee-img-wrapper { height: auto; margin-left: auto; position: relative; width: 100% } .hero-marquee-component .hero-marquee-img-wrapper:before { content: ""; display: block; padding-top: 56.25%; width: 100% } .hero-marquee-component .hero-marquee-img-wrapper .component-asset-block, .hero-marquee-component .hero-marquee-img-wrapper .hero-marquee-img-item { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .hero-marquee-component .hero-marquee-right-col img { height: auto; position: relative; width: 100% } .hero-marquee-component .hero-marquee-photo-frame { position: relative; right: 0; top: 0; width: 100% } .hero-marquee-component .hero-marquee-photo-frame picture > img, .hero-marquee-component .hero-marquee-photo-frame > img { height: 100%; position: absolute; right: -1.5rem } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block { height: 100%; padding: 3.5rem 3.5rem 0; position: absolute; right: 0; width: auto } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block picture > img, .hero-marquee-component .hero-marquee-photo-frame .component-asset-block > img, .hero-marquee-component .hero-marquee-photo-frame .component-asset-block > svg, .hero-marquee-component .hero-marquee-photo-frame .component-asset-block > video { height: 100%; max-width: none; width: auto } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block .video-js { width: auto } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block .video-js video { height: 100%; max-width: none; min-width: 100%; width: auto } .hero-marquee-component .hero-marquee-eyebrow { margin: 0 0 .8rem; padding-bottom: .6rem; position: relative } .hero-marquee-component .hero-marquee-header-inner-section { padding: 3.2rem 0 0 } .hero-marquee-component .hero-marquee-header-inner-section .hero-marquee-title h1 { font-size: 2.8rem; line-height: 1.3; padding-bottom: 2.4rem; padding-top: .6rem } .hero-marquee-component .hero-marquee-eyebrow:after { background: #474d52; bottom: 0; content: ""; display: block; height: .2rem; position: absolute; width: 2.8rem } .hero-marquee-component .hero-marquee-text-cta-section-text { padding-bottom: .6rem } .hero-marquee-component .hero-marquee-text-cta-section-text p { margin: 0; padding: 0 } .hero-marquee-component .hero-marquee-eyebrow span { color: #293e40; font-family: GilroySemiBold; font-weight: 500 } .hero-marquee-component .hero-marquee-text-cta-section-text p { font-size: 1.8rem; line-height: 1.5 } .hero-marquee-component .hero-marquee-eyebrow span { font-size: 1.2rem; line-height: 1.5 } .hero-marquee-component .hero-marquee-title-link-arrow { display: inline-block; padding-left: 1rem; vertical-align: middle } .hero-marquee-component .hero-marquee-title-link-arrow svg { height: 1.3rem; width: 1.6rem } .hero-marquee-component.no-16-9-asset-right-col .hero-marquee-img-wrapper { height: 100%; top: unset; -webkit-transform: none; transform: none } .hero-marquee-component.no-16-9-asset-right-col .hero-marquee-img-wrapper:before { padding-top: 100% } .hero-marquee-component.no-16-9-asset-right-col .hero-marquee-img-wrapper .component-asset-block img, .hero-marquee-component.no-16-9-asset-right-col .hero-marquee-img-wrapper .component-asset-block svg, .hero-marquee-component.no-16-9-asset-right-col .hero-marquee-img-wrapper .component-asset-block video { height: 100% } .hero-marquee-component.no-right-cutoff .hero-marquee-photo-frame .component-asset-block { right: -2rem } @media only screen and (max-width: 767px) { .hero-marquee-component .site-width-1700 { padding: 0 } .hero-marquee-component .site-width-1700 .hero-marquee-left-col { padding-left: 2rem; padding-right: 2rem } .hero-marquee-component .site-width-1700 .hero-marquee-photo-frame { margin-left: 1rem; margin-right: 1rem } .hero-marquee-component .site-width-1700 .hero-marquee-right-col { padding-left: 0; padding-right: 0 } .hero-marquee-component .site-width-1700 .hero-marquee-right-col .hero-marquee-img-wrapper .component-asset-block video { height: auto; position: relative } } @media only screen and (min-width: 768px) { .hero-marquee-component[data-com-name-variant=marquee-dual-toned] .hero-marquee-component-outter-wrapper .hero-marquee-left-col { display: flex; -moz-flex-direction: column; -o-flex-direction: column; flex-direction: column; -moz-justify-content: space-between; -ms-justify-content: space-between; -o-justify-content: space-between; -webkit-justify-content: space-between } .hero-marquee-component[data-com-name-variant=marquee-dual-toned] .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { height: 70%; position: relative } .hero-marquee-component[data-com-name-variant=marquee-dual-toned] .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section { bottom: 2.4rem; position: absolute } .hero-marquee-component[data-com-name-variant=marquee-dual-toned] .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section { min-height: auto; position: relative; width: calc(100% + .1rem) } .hero-marquee-component .hero-marquee-component-outter-wrapper { max-height: 75vh; min-height: 60rem } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper { padding-top: 0; position: absolute } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-component-background-video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper img, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper > svg { left: 50%; position: absolute; top: 50%; -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 120% } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper img { height: 100%; width: auto } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block img, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block svg, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .component-asset-block video { transform: translateY(-50%) } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .video-js video { top: 0 !important; transform: none !important } .hero-marquee-component .hero-marquee-header-inner-section .hero-marquee-title h1 { font-size: 3.6rem; padding-bottom: 0 } .hero-marquee-component .hero-marquee-component-outter-wrapper:before { content: ""; display: block; padding-top: 50.625%; width: 100% } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-text-cta-section-text { padding-bottom: 1.4rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-component-inner-wrapper { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .hero-marquee-component .hero-marquee-photo-frame { height: 100% !important; position: absolute } .hero-marquee-component .hero-marquee-photo-frame picture > img, .hero-marquee-component .hero-marquee-photo-frame > img { right: -15% } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block { padding: 0; right: -15%; text-align: right; width: 100% } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block picture > img, .hero-marquee-component .hero-marquee-photo-frame .component-asset-block > img, .hero-marquee-component .hero-marquee-photo-frame .component-asset-block > svg, .hero-marquee-component .hero-marquee-photo-frame .component-asset-block > video { position: absolute; right: 0 } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block .video-js video { max-width: none; min-width: auto; width: auto } .hero-marquee-component .hero-marquee-component-outter-wrapper { overflow: hidden; position: relative } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-right-col { position: relative } .hero-marquee-component .hero-marquee-left-background { display: block; left: -1.5rem; opacity: .3 } .hero-marquee-component .hero-marquee-left-col { margin-top: 0; order: 1 } .hero-marquee-component .hero-marquee-right-col { order: 2 } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { align-items: center; background: transparent; display: flex; height: 100%; position: absolute; width: 120% } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section:before { display: none } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section { bottom: 0; display: flex; flex-direction: column; justify-content: center; margin-right: 1.5rem; min-height: 20rem; padding: 2.4rem 3rem 2.4rem 0; position: absolute; width: calc(100% - 3rem) } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section:before { left: -1000% } .hero-marquee-component .hero-marquee-eyebrow { padding-top: 0 } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section { position: relative } .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy, .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy p, .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy span { font-size: 1.8rem; line-height: 2.7rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-cta { padding-bottom: 0 } } @media only screen and (min-width: 1024px) { .hero-marquee-component[data-com-name-variant=marquee-dual-toned] .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section { bottom: 30%; -moz-transform: translateY(40%); -ms-transform: translateY(40%); -o-transform: translateY(40%); -webkit-transform: translateY(40%); transform: translateY(40%) } .hero-marquee-component .hero-marquee-eyebrow span, .hero-marquee-component .hero-marquee-text-cta-section-text p { font-size: 2rem } .hero-marquee-component .hero-marquee-text-cta-section-text p { font-size: 2.4rem } .hero-marquee-component .hero-marquee-eyebrow span { font-size: 2rem } .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy, .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy p, .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy span { font-size: 2.4rem; line-height: 3.6rem } .hero-marquee-component .hero-marquee-component-outter-wrapper { max-height: none; min-height: 75rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section { margin-right: 2rem; min-height: 26.4rem; padding: 4rem 4rem 4rem 0; width: calc(100% - 4rem) } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-title p { font-size: 1.8rem; line-height: 2.6rem } .hero-marquee-component .hero-marquee-photo-frame .component-asset-block, .hero-marquee-component .hero-marquee-photo-frame picture > img, .hero-marquee-component .hero-marquee-photo-frame > img { right: -20% } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-text-cta-section-text { padding-bottom: 3rem } .hero-marquee-component .hero-marquee-left-background { display: block; left: -2rem; opacity: .3 } .hero-marquee-component .hero-marquee-eyebrow { padding-bottom: 1rem } .hero-marquee-component .hero-marquee-eyebrow:after { width: 3.4rem } .hero-marquee-component .hero-marquee-header-inner-section .hero-marquee-title h1 { font-size: 4.8rem; padding-top: .5rem } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-component-background-video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper > svg { width: 118% } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper img { width: auto } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-left-background { display: block; left: -2rem; opacity: .3 } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-eyebrow { padding-bottom: 1rem } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-eyebrow:after { width: 3.4rem } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-header-inner-section .hero-marquee-title h1 { padding-top: .5rem } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-full-bleed-img-wrapper .hero-marquee-component-background-video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-full-bleed-img-wrapper img, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-full-bleed-img-wrapper video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-full-bleed-img-wrapper > svg { width: 118% } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-text-cta-section-cta .cta-component:first-of-type { margin-right: 3rem } } @media only screen and (min-width: 1280px) { .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-photo-frame .component-asset-block, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-photo-frame picture > img, .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-photo-frame > img { right: 0 } } @media only screen and (min-width: 1700px) { .hero-marquee-component .hero-marquee-text-cta-section-text p { font-size: 2.8rem } .hero-marquee-component .hero-marquee-eyebrow span { font-size: 2.6rem; line-height: 3.9rem } .hero-marquee-component .hero-marquee-text-cta-section-text { position: relative } .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy, .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy p, .hero-marquee-component .hero-marquee-text-cta-section-text.xl-body-copy span { font-size: 2.8rem; line-height: 4.2rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-photo-frame .component-asset-block { right: 0 } .hero-marquee-component .hero-marquee-component-outter-wrapper { max-height: 75vh; min-height: 80rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section { min-height: 28rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section .hero-marquee-text-cta-section-text { padding-bottom: .4rem } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { width: 138% } .hero-marquee-component .hero-marquee-eyebrow:after { width: 4rem } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper .hero-marquee-component-background-video, .hero-marquee-component .hero-marquee-full-bleed-img-wrapper img { width: 100% } .hero-marquee-component .hero-marquee-full-bleed-img-wrapper img { height: auto } .hero-marquee-component .hero-marquee-header-inner-section .hero-marquee-title h1 { font-size: 6.4rem; padding-top: 0 } .hero-marquee-component .hero-marquee-text-cta-section-cta .cta-component:first-of-type { margin-right: 3.6rem } } @media(max-width: 767px) { .hero-marquee-component .hero-marquee-photo-frame > img { height: 100%; padding: 0 35px; position: absolute; right: -45px } .hero-marquee-component .hero-marquee-photo-frame .video-js, .hero-marquee-component .hero-marquee-photo-frame .video-js video { width: 100% !important } .hero-marquee-component.transparent-marquee .hero-marquee-header-inner-section .hero-marquee-title h1 { margin-bottom: -1rem; padding-bottom: .4rem } .hero-marquee-component.transparent-marquee .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section { padding-top: 0 } .hero-marquee-component.transparent-marquee .hero-marquee-text-cta-section-text { padding-bottom: .6rem } .hero-marquee-component.image-on-bottom .hero-marquee-content { display: flex; flex-direction: column-reverse } } .hero-marquee-component.transparent-marquee .hero-marquee-header-inner-section { padding-bottom: 1rem } .hero-marquee-component.transparent-marquee .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-text-cta-section * { color: #293e40 } .hero-marquee-component.transparent-marquee.translucent-marquee .hero-marquee-left-col.flex-box-col-sm-6.flex-box-col-md-5.flex-box-col-xlg-4 { background-color: hsla(0,0%,100%,.3) } .hero-marquee-component.transparent-marquee.transparent-marquee .hero-marquee-left-col { margin: 0 } .hero-marquee-component.transparent-marquee.transparent-marquee .hero-marquee-left-background, .hero-marquee-component.transparent-marquee.transparent-marquee .hero-marquee-left-background:before { display: none } .hero-marquee-component.transparent-marquee.transparent-marquee.translucent-mobile .hero-marquee-left-col .hero-marquee-left-background { background-color: hsla(0,0%,100%,.3); display: block !important; left: -1rem; right: -1rem; width: auto } .hero-marquee-component.transparent-marquee.transparent-marquee.translucent-mobile .hero-marquee-left-col .hero-marquee-left-background:before { display: none } .hero-marquee-component.transparent-marquee .hero-marquee-right-col { padding-bottom: 3rem; padding-top: 8rem } .hero-marquee-component.transparent-marquee.no-right-cutoff .hero-marquee-photo-frame .component-asset-block { padding: 0; right: 0; width: 100% } .hero-marquee-component.transparent-marquee.no-right-cutoff .hero-marquee-photo-frame .component-asset-block img, .hero-marquee-component.transparent-marquee.no-right-cutoff .hero-marquee-photo-frame .component-asset-block svg, .hero-marquee-component.transparent-marquee.no-right-cutoff .hero-marquee-photo-frame .component-asset-block video { padding: 0 !important; right: 0; width: 100% } .hero-marquee-component.transparent-marquee .hero-marquee-component-outter-wrapper .hero-marquee-right-col { padding-top: 8rem } @media(min-width: 768px) { .hero-marquee-component.transparent-marquee .hero-marquee-left-col { display: flex; flex-direction: column } .hero-marquee-component.transparent-marquee .hero-marquee-left-col .hero-marquee-left-background { display: block !important } .hero-marquee-component.transparent-marquee .hero-marquee-left-col .hero-marquee-header-section, .hero-marquee-component.transparent-marquee .hero-marquee-left-col .hero-marquee-text-cta-section { flex-grow: 1; flex-shrink: 0; padding-top: 0; position: static } .hero-marquee-component.transparent-marquee .hero-marquee-left-col .hero-marquee-header-section { align-items: flex-end; display: flex; height: auto !important } .hero-marquee-component.transparent-marquee .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section { position: static; transform: translate(0) } .hero-marquee-component.transparent-marquee .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section .hero-marquee-eyebrow span { font-size: 1.4rem } .hero-marquee-component.transparent-marquee .hero-marquee-title h1 { padding-bottom: .8rem; padding-top: .8rem } .hero-marquee-component.transparent-marquee .hero-marquee-text-cta-section-text { padding-bottom: 1.4rem } .hero-marquee-component .hero-marquee-header-inner-section { padding: 0 } } @media(min-width: 1024px) { .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { height: 95% } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section .hero-marquee-eyebrow span { font-size: 1.8rem } .hero-marquee-component.transparent-marquee .hero-marquee-text-cta-section-text { padding-bottom: 1.4rem } } @media(min-width: 1700px) { .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { height: 90% } .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section .hero-marquee-header-inner-section .hero-marquee-eyebrow span { font-size: 2rem } .hero-marquee-component.transparent-marquee .hero-marquee-text-cta-section-text { padding-bottom: 3.8rem } } @media(min-width: 767px)and (max-width:1023px) { .hero-marquee-component .hero-marquee-right-col .animation-section-container video { margin-left: -5%; width: 120% !important } } @media(min-width: 1024px)and (max-width:1279px) { .hero-marquee-component .hero-marquee-right-col .animation-section-container video { width: 110% !important } } @media(max-width: 767px)and (min-width:480px) { .hero-marquee-component .hero-marquee-photo-frame .component-asset-block img { height: 100%; padding: 2rem; padding-bottom: 0 !important; padding-top: 0 !important; position: absolute; right: -45px; top: 0 !important } } @media(max-width: 480px)and (min-width:320px) { .hero-marquee-component .hero-marquee-photo-frame .component-asset-block img { bottom: -1rem; height: 100%; padding: 19px; padding-bottom: 0 !important; position: absolute; right: -30px; top: auto } } @media(max-width: 767px) { body[data-currentPage="/content/servicenow/www/locale-sites/en-us"] .hero-marquee-component .hero-marquee-title h1 { padding-top: 2.4rem } } @media(max-width: 480px)and (min-width:320px) { body[data-currentPage="/content/servicenow/www/locale-sites/en-us"] .hero-marquee-component .hero-marquee-photo-frame .component-asset-block img { bottom: 2rem } } body[data-currentPage="/content/servicenow/www/locale-sites/en-us"] .hero-marquee-component .hero-marquee-header-inner-section { padding: 0 } @media screen and (max-width: 767px) { body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .hero-marquee-component .hero-marquee-component-outter-wrapper .hero-marquee-right-col { padding-top: 8rem !important } } .aem-AuthorLayer-Edit .hero-marquee-component-outter-wrapper, .aem-AuthorLayer-Edit .hero-marquee-component-outter-wrapper .hero-marquee-left-col, .aem-AuthorLayer-Edit .hero-marquee-component-outter-wrapper .hero-marquee-left-col .hero-marquee-header-section { max-height: 80rem !important; min-height: 80rem !important } .cta-component { border-radius: var(--btn-border-radius,unset); display: inline-block; line-height: 0; margin-bottom: .8rem; margin-top: .8rem; vertical-align: middle } .cta-component:last-of-type a .cta-title-link-arrow { margin-right: 0 } .cta-component a { border-radius: var(--btn-border-radius,unset); font-family: GilroySemiBold; font-size: 1.4rem; font-weight: 500 } .cta-component a:focus { outline: none } .cta-component a .cta-play-video-svg, .cta-component a .cta-title-link-arrow { display: none; margin-right: 4rem } .cta-component.cta-rectangle-box { margin-right: 4rem; overflow: hidden; position: relative } .cta-component.cta-rectangle-box a { border: .2rem solid #81b5a1; color: #fff; display: inline-block; padding: 1.1rem 3.2rem; position: relative; -moz-transition: color .25s ease; -ms-transition: color .25s ease; -webkit-transition: color .25s ease; transition: color .25s ease; z-index: 2 } .cta-component.cta-rectangle-box a:hover { color: #fff } .cta-component.cta-rectangle-box a:hover + span.cta-background-full { left: 0; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -webkit-transition: all .3s ease; transition: all .3s ease } .cta-component.cta-rectangle-box a:focus, .cta-component.cta-rectangle-box a:focus-visible { outline-color: #3eaa2b; outline-style: solid; outline-width: 3px } .cta-component.cta-rectangle-box span.cta-background-full { background-color: #81b5a1; border-radius: var(--btn-border-radius,unset); display: block; height: 100%; left: -100%; position: absolute; top: 0; width: 100%; z-index: 1 } .cta-component.cta-rectangle-box.light a { border: .2rem solid #293d40 !important; color: #293d40 !important } .cta-component.cta-rectangle-box.light:hover a { border: .2rem solid #293d40 !important; color: #fff !important } .cta-component.cta-rectangle-box.light:hover span.cta-background-full { background-color: #293d40 !important } .cta-component.cta-rectangle-box.white a { border: .2rem solid #81b5a1 !important; color: #293d40 !important } .cta-component.cta-rectangle-box.white:hover a { color: #293d40 !important } .cta-component.cta-rectangle-box.gable-green-cta:hover a span { color: #fff !important } .cta-component.cta-rectangle-box.solid a:after { content: ""; height: 100%; left: 0; left: -100%; position: absolute; top: 0; transition: all .2s ease; width: 100%; z-index: -1 } .cta-component.cta-rectangle-box.solid a:hover:after { left: 0 } .cta-component.cta-rectangle-box.solid a + span.cta-background-full { display: none !important } .cta-component.cta-text-arrow { border: none } .cta-component.cta-text-arrow a { color: #fff; vertical-align: bottom } .cta-component.cta-text-arrow a:hover .cta-title-link-arrow { display: inline-block } .cta-component.cta-text-arrow a:hover .cta-title-link-arrow svg { transform: translate(-.5rem) } .cta-component.cta-text-arrow a .cta-title-link-arrow { overflow: hidden } .cta-component.cta-text-arrow a .cta-title-link-arrow svg { height: 1.3rem; -moz-transform: translate(-1.5rem); -ms-transform: translate(-1.5rem); -webkit-transform: translate(-1.5rem); transform: translate(-1.5rem); -moz-transition: all .25s linear; -ms-transition: all .25s linear; -webkit-transition: all .25s linear; transition: all .25s linear } .cta-component.cta-text-arrow a .cta-title-link-arrow svg #polyline-3 { transform: translate(1rem) } .cta-component.cta-text-arrow a .cta-title-link-arrow svg #svg-group { transform: translate(-1rem) } .cta-component.cta-text-arrow a .cta-title-link-arrow svg path { fill: #81b5a1 } .cta-component.cta-text-arrow .cta-background-full { display: none } .cta-component.cta-text-arrow.light a, .cta-component.cta-text-arrow.white a { color: var(--brand-black,var(--gable-green)) !important } .cta-component.cta-text-arrow .cta-title-link-arrow { display: inline-block; line-height: 0; margin-left: -.2rem; position: relative; transform: scale(.8); vertical-align: middle } .cta-component.cta-play-video a { color: #fff; position: relative } .cta-component.cta-play-video a .cta-play-video-svg { display: inline-block; margin-left: .8rem } .cta-component.cta-play-video a .cta-play-video-svg svg { height: 1.8rem; position: absolute; top: 0; -moz-transition: all .25s linear; -ms-transition: all .25s linear; -o-transition: all .25s linear; -webkit-transition: all .25s linear; transition: all .25s linear; width: 1.8rem } .cta-component.cta-play-video a:hover svg { transform: scale(1.8); transform-origin: center } .cta-component.cta-play-video a:hover svg path { opacity: 0 } .cta-component.cta-play-video.light a, .cta-component.cta-play-video.white a { color: var(--brand-black,var(--gable-green)) !important } .cta-component.csc-cta { display: table; margin-left: auto; margin-right: auto } .cta-component.csc-cta.cta-text-arrow a { display: block } .cta-component.csc-cta.cta-text-arrow a .cta-title-link-arrow { margin-left: .8rem; margin-right: 0; padding-top: 2px !important; position: absolute } .cta-component.csc-cta.cta-text-arrow a:hover .cta-title-link-arrow svg { transform: translate(-1rem) } .cta-component.csc-cta a { font-family: gilroyBold; font-size: 1.4rem !important; padding: 2rem 4.6rem !important } .cta-component.csc-cta a, .cta-component.csc-cta.cta-rectangle-box.light a, .cta-component.csc-cta.cta-rectangle-box.light a:hover { border-width: 1px !important } @media only screen and (min-width: 768px) { .cta-component.cta-rectangle-box a { padding: 1.5rem 4rem } .cta-component a { font-size: 1.6rem } .cta-component.cta-play-video a .cta-play-video-svg svg { height: 2rem; width: 2rem } .cta-component.csc-cta { display: inline-block } } @media only screen and (min-width: 1024px) { .cta-component a { font-size: 1.8rem !important } .cta-component.cta-text-arrow .cta-title-link-arrow svg { height: 1.5rem } .cta-component.cta-text-arrow .cta-title-link-arrow { margin-left: .5rem; transform: scale(1) } } @media only screen and (min-width: 1700px) { .cta-component.cta-rectangle-box a { padding: 1.5rem 4rem } .cta-component.cta-text-arrow .cta-title-link-arrow { margin-left: .8rem } } .link-farm-component .link-grid-left-background:before { content: ""; display: block; height: 100%; left: -990%; position: absolute; width: 1000% } .link-grid-left-background-img, .link-grid-left-background-img:before { background: transparent !important } .link-grid-col-icon, .link-grid-col-icon:before { background-color: transparent } .link-grid-arrow { border: 0 solid red; padding-top: 0 } .link-grid-arrow svg { width: 24px } .link-grid-load-more { border: 2px solid #e9ebec; color: #293e40; cursor: pointer; display: block; font-family: GilroySemiBold; font-size: 14px; margin: 32px auto auto; padding: 10px 32px } .link-grid-load-more:hover { background: #d4d8d9 } .link-farm-hidden-tile { display: none } .link-farm-load-more { border: 2px solid #e9ebec; color: #293e40; cursor: pointer; display: block; font-family: GilroySemiBold; font-size: 14px; margin: 32px auto auto; padding: 10px 32px } .link-farm-load-more:hover { background: #d4d8d9; border-color: #d4d8d9 } .link-farm-component, .link-farm-component * { transition: width .25s ease,max-width .25s ease } .link-farm-component .link-farm-component-outter-wrapper { overflow: hidden } .link-farm-component .link-farm-component-outter-wrapper .link-farm-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .link-farm-component .link-farm-left-background { height: 100%; position: absolute; width: 100% } .link-farm-component .link-farm-left-background:before { content: ""; display: block; height: 100%; left: -990%; position: absolute; width: 1000% } .link-farm-component .link-farm-component-outter-wrapper, .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col, .link-farm-component .link-farm-component-outter-wrapper .link-farm-right-col { height: auto; position: relative } .link-farm-component .link-farm-component-outter-wrapper .link-farm-right-col-top { align-items: flex-start; border: 1px solid red } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col { position: unset } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { position: relative; width: 100% } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section:before { content: ""; display: block; height: 100%; left: -100%; padding: 60px 0 0; position: absolute; width: 300% } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow { margin-bottom: 2rem; padding-bottom: .6rem; position: relative } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow span { color: #293e40; font-family: GilroySemiBold; font-size: 1.6rem; font-weight: 500; line-height: 2.72rem } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow span:after { background: #474d52; bottom: 0; content: ""; display: block; height: .2rem; position: absolute; width: 2.8rem } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title, .link-farm-component .link-farm-content { position: relative } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-text-cta-section * { color: #fff } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-text-cta-section .link-farm-text-cta-section-cta, .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-text-cta-section .link-farm-text-cta-section-text { position: relative } .link-farm-component .link-farm-right-col img { height: auto; width: 100% } .link-farm-component .link-farm-photo-frame { position: relative; right: 0; top: 0; width: 100% } .link-farm-component .link-farm-photo-frame img { height: 100%; position: absolute; right: 0 } .link-farm-component .link-farm-img-wrapper { height: 100%; margin: auto; max-width: 80rem; padding-top: 11rem; width: 100% } .link-farm-component .link-farm-img-wrapper img { height: 100%; left: 50%; position: relative; transform: translate(-50%); width: auto } .link-farm-component.no-left-col-background-all .link-farm-left-background { display: none !important } .link-farm-component.no-left-col-background-mobile .link-farm-left-background { display: none } .link-farm-component.hide-quotation-mark .link-farm-quotation { opacity: 0 !important } .link-farm-component.hide-eyebrow .link-farm-header-eyebrow { display: none } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption { padding-top: 1.4rem !important; width: 90% } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-first-caption { font-family: GilroySemiBold } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link.no-hover { cursor: default } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link.no-hover:hover .link-farm-item-first-caption { background-position: 100% 100% } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link .link-farm-item-first-caption { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: block; overflow: hidden; padding-bottom: .6rem; transition: all .25s linear } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link:hover .link-farm-item-first-caption { background-position: 0 100%; transition: all .25s linear } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link .link-farm-item-third-caption { display: block; font-family: GilroyRegular; font-size: 1.3rem; line-height: 2rem } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link .caption-mobile-hide { display: none } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item { width: 50% } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-img { border-radius: 50%; line-height: 0; max-width: 10.4rem; overflow: hidden; position: relative; width: 100%; z-index: 99 } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-img img { transition: all .25s ease } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-link { -webkit-clip-path: circle(80% at center); clip-path: circle(80% at center); display: inline-block; width: 100% } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-link.no-hover:hover .link-farm-item-img img { transform: scale(1) } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-link:hover .link-farm-item-img img { transform: scale(1.1); transform-origin: center center } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption { color: #293e40; display: block; font-size: 1.4rem; line-height: 2.38rem } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption.link-farm-speaker { font-family: GilroySemiBold } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span { color: #293e40; font-size: 1.4rem; line-height: 2rem } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption .link-farm-item-first-caption { display: table } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding-top: 8rem } .link-farm-component.three-large-circles .link-farm-item-wrapper { padding: 2rem 0 6rem } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item { padding: 1.2rem 1.2rem 1.2rem 0 } .link-farm-component.three-large-circles .link-farm-quotation { content: open-quote; display: block !important; font-size: 2.4rem; left: 0; position: relative; top: 0 } .link-farm-component.three-large-circles .link-farm-quotation svg { width: 1.2rem } .link-farm-component.three-large-circles .link-farm-right-col .link-farm-item-caption span { display: block } .link-farm-component.three-large-circles .link-farm-quote { color: #293e40; font-family: GilroySemiBold; font-size: 2rem; line-height: 2.6rem; margin-bottom: .8rem; margin-top: 0 } .link-farm-component.logos-two-column .cta-component a, .link-farm-component.logos-two-column .link-farm-title-header { display: block !important } .link-farm-component.logos-two-column .link-grid-arrow { padding-top: .8rem } .link-farm-component.logos-four-column .cta-component a, .link-farm-component.logos-four-column .link-farm-title-header, .link-farm-component.logos-three-column .cta-component a, .link-farm-component.logos-three-column .link-farm-title-header, .link-farm-component.text-only-column .cta-component a, .link-farm-component.text-only-column .link-farm-title-header { display: block !important } .link-farm-component.logos-four-column .link-farm-title-header, .link-farm-component.logos-three-column .link-farm-title-header, .link-farm-component.logos-two-column .link-farm-title-header, .link-farm-component.text-only-column .link-farm-title-header { color: #293e40; font-size: 2.4rem; line-height: 2.8rem } .link-farm-component.logos-four-column .link-farm-quote, .link-farm-component.logos-three-column .link-farm-quote, .link-farm-component.logos-two-column .link-farm-quote, .link-farm-component.text-only-column .link-farm-quote { color: #293e40; font-size: 1.4rem; line-height: 2.38rem; margin: 1rem 0 } .link-farm-component.logos-four-column .cta-component a, .link-farm-component.logos-three-column .cta-component a, .link-farm-component.logos-two-column .cta-component a, .link-farm-component.text-only-column .cta-component a { font-family: GilroySemiBold } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { width: 50% } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item-mobile-one-col, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item-mobile-one-col, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item-mobile-one-col, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item-mobile-one-col { width: 100% } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img { max-width: none; padding-right: 20%; transition: all .25s ease; width: 100% } .link-farm-component h2.link-farm-title-header { margin-bottom: 16px } .link-farm-component.svg-icon.logos-four-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.svg-icon.logos-three-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.svg-icon.logos-two-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img { max-width: 27px; padding-right: 0 } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img img, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img img, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img img, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img img { width: 100% } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption { color: #293e40; display: table; font-size: 1.4rem; line-height: 2rem } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption { padding-top: .6rem } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding: 40px 0 25px } .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding: 40px 0 2px } .link-farm-component.logos-four-column .link-farm-item-wrapper, .link-farm-component.logos-three-column .link-farm-item-wrapper, .link-farm-component.logos-two-column .link-farm-item-wrapper, .link-farm-component.text-only-column .link-farm-item-wrapper { padding: 0 0 60px } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { padding: 28px .4rem 0 0 } .link-farm-component.logos-four-column .link-farm-right-col .link-farm-item-caption span, .link-farm-component.logos-three-column .link-farm-right-col .link-farm-item-caption span, .link-farm-component.logos-two-column .link-farm-right-col .link-farm-item-caption span, .link-farm-component.text-only-column .link-farm-right-col .link-farm-item-caption span { display: block } .link-farm-component.logos-four-column .cta-component a-arrow, .link-farm-component.logos-three-column .cta-component a-arrow, .link-farm-component.logos-two-column .cta-component a-arrow, .link-farm-component.text-only-column .cta-component a-arrow { display: inline-block; padding-left: 1rem; vertical-align: middle } .link-farm-component.logos-four-column .cta-component a-arrow svg, .link-farm-component.logos-three-column .cta-component a-arrow svg, .link-farm-component.logos-two-column .cta-component a-arrow svg, .link-farm-component.text-only-column .cta-component a-arrow svg { height: 1.3rem; width: 1.6rem } .link-farm-component.text-only-column .cta-component a, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.text-only-column .link-farm-quote { display: none !important } .link-farm-component.text-only-column .link-farm-title-header { color: #293e40 !important; padding-bottom: 2rem } .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { padding-top: 0 } @media only screen and (min-width: 768px) { .link-farm-component .link-farm-left-background, .link-farm-component .link-farm-left-background:before { background: #f7f7f7 } .link-farm-load-more { display: none } .link-farm-component .flex-box-col-md-5 { flex: 0 0 50%; max-width: 100% } .link-farm-component .flex-box-col-md-7 { flex: inherit; max-width: 100% !important } .link-farm-hidden-tile { display: block !important } .link-farm-component.svg-icon.logos-four-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.svg-icon.logos-three-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img, .link-farm-component.svg-icon.logos-two-column .link-farm-item-wrapper .link-farm-item .link-farm-item-img { max-width: 45px; padding-right: 0 } .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-link .caption-mobile-hide { display: block } .link-farm-component .link-farm-photo-frame { height: 100% !important; position: absolute } .link-farm-component .link-farm-component-outter-wrapper { overflow: hidden } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section:before { display: none } .link-farm-component .link-farm-img-wrapper { padding-top: 8rem } .link-farm-component.three-large-circles .link-farm-quote { font-size: 2.2rem; line-height: 2.86rem; margin-bottom: 1.6rem } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption { font-size: 1.6rem; line-height: 2.72rem } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item { width: 33.33333% } .link-farm-component.three-large-circles .link-farm-quotation svg { height: 28px; width: auto } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-img { max-width: 16rem; width: 100% } .link-farm-component.logos-four-column .link-farm-title-header, .link-farm-component.logos-three-column .link-farm-title-header, .link-farm-component.logos-two-column .link-farm-title-header, .link-farm-component.text-only-column .link-farm-title-header { font-size: 2.8rem; line-height: 4rem } .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { padding: 2rem .8rem 0 0; width: 50% } .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { width: 33.33333% } .link-farm-component.logos-four-column .link-farm-quote, .link-farm-component.logos-three-column .link-farm-quote, .link-farm-component.logos-two-column .link-farm-quote, .link-farm-component.text-only-column .link-farm-quote { font-size: 1.6rem; line-height: 2.72rem; margin-bottom: 1.6rem } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item { width: 25% } } @media only screen and (min-width: 1024px) { .link-farm-component .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption { padding-top: 2rem !important; width: 83.3333% } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding-top: 10rem } .link-farm-component.three-large-circles .link-farm-item-wrapper { padding: 4rem 0 8rem } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item { padding: 2rem 0 3rem } .link-farm-component.three-large-circles .link-farm-quote { font-size: 2.8rem; line-height: 3.64rem } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption { font-size: 1.8rem; line-height: 3.06rem } .link-farm-component.three-large-circles .link-farm-item-wrapper .link-farm-item .link-farm-item-img { max-width: 18rem; width: 100% } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding: 60px 0 25px } .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding: 60px 0 2px } .link-farm-component.logos-four-column .link-farm-item-wrapper, .link-farm-component.logos-three-column .link-farm-item-wrapper, .link-farm-component.logos-two-column .link-farm-item-wrapper, .link-farm-component.text-only-column .link-farm-item-wrapper { padding: 0 0 10rem } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { padding: 28px 1rem 0 0 } .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item { width: 50% } .link-farm-component.logos-two-column .link-farm-title-header { font-size: 3.6rem; line-height: 4rem } .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item { width: 25% } .link-farm-component.logos-three-column .link-farm-title-header { font-size: 3.6rem; line-height: 4rem } .link-farm-component h2.link-farm-title-header { margin-bottom: 24px } .link-farm-component.logos-four-column .link-farm-title-header, .link-farm-component.text-only-column .link-farm-title-header { font-size: 3.6rem; line-height: 4rem } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-four-column .link-farm-quote, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-three-column .link-farm-quote, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-two-column .link-farm-quote, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-item .link-farm-item-caption span, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.text-only-column .link-farm-quote { font-size: 1.8rem; line-height: 3.06rem } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow { padding-bottom: .5rem } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow span { font-size: 2rem; line-height: 3.4rem } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow span:after { width: 3.4rem } } @media only screen and (min-width: 1700px) { .link-farm-component .flex-box-col-md-5 { max-width: 41.666667% } .link-farm-component .flex-box-col-md-7 { flex: 0 0 58.333333%; max-width: 58.333333% } .link-farm-component .link-farm-left-background { display: block; position: unset } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col { position: relative } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { background: transparent; left: auto; padding: 80px 8rem 80px 2rem; position: absolute; top: 50%; transform: translateY(-50%); width: 100% } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section-top { background: transparent; left: 0; padding-right: 8rem; padding-top: 60px !important; top: 0; transform: none } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section { padding-right: 20px } .link-farm-component .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-inner-section .link-farm-header-eyebrow span:after { width: 4rem } .link-farm-component.no-left-col-background-mobile .link-farm-left-background { display: block } .link-farm-component.fifty-percent-16-9 .link-farm-component-outter-wrapper:before { content: ""; display: block; padding-top: 28.125%; width: 100% } .link-farm-component.fifty-percent-16-9 .link-farm-component-outter-wrapper .link-farm-component-inner-wrapper { bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100% } .link-farm-component.fifty-percent-16-9 .link-farm-component-outter-wrapper .link-farm-component-inner-wrapper .link-farm-content { top: 50%; transform: translateY(-50%) } .link-farm-component.fifty-percent-16-9 .link-farm-component-outter-wrapper .link-farm-component-inner-wrapper .link-farm-left-background { height: 600%; position: absolute; right: 2rem; top: -200% } .link-farm-component.three-large-circles .link-farm-item-wrapper { padding: 8rem 0 } .link-farm-component.three-large-circles .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding-top: 20px } .link-farm-component.three-large-circles .link-farm-quote { font-size: 3.6rem; line-height: 4.68rem; margin-bottom: 3.2rem } .link-farm-component.three-large-circles .link-farm-quotation { top: 0 } .link-farm-component.three-large-circles .link-farm-quotation svg { height: 36px; width: auto } .link-farm-component.logos-two-column .link-farm-item-wrapper, .link-farm-component.logos-two-column .link-farm-item-wrapper-top, .link-farm-component.text-only-column .link-farm-item-wrapper, .link-farm-component.text-only-column .link-farm-item-wrapper-top { padding: 50px 0 80px } .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding-bottom: 2.5rem } .link-farm-component.logos-three-column .link-farm-item-wrapper, .link-farm-component.text-only-column .link-farm-item-wrapper { padding: 8% 0 } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section { padding-top: 20px } .link-farm-component.logos-four-column .link-farm-title-header, .link-farm-component.logos-three-column .link-farm-title-header, .link-farm-component.logos-two-column .link-farm-title-header, .link-farm-component.text-only-column .link-farm-title-header { font-size: 4.8rem; line-height: 6rem } .link-farm-component.logos-four-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item, .link-farm-component.text-only-column .link-farm-item-wrapper .link-farm-item { padding: 28px 0 2rem } .link-farm-component.logos-two-column .link-farm-item-wrapper .link-farm-item { padding: 30px 40px 0 !important; width: 50% } .link-farm-component.logos-three-column .link-farm-item-wrapper .link-farm-item { width: 33.333333% } .link-farm-component.logos-four-column .cta-component a-arrow svg, .link-farm-component.logos-three-column .cta-component a-arrow svg, .link-farm-component.logos-two-column .cta-component a-arrow svg, .link-farm-component.text-only-column .cta-component a-arrow svg { height: 1.5rem; width: 1.8rem } .link-farm-component.logos-four-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-three-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.logos-two-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption, .link-farm-component.text-only-column .link-farm-component-outter-wrapper .link-farm-left-col .link-farm-header-section .link-farm-title .link-farm-caption { font-size: 2.4rem; line-height: 3rem } .link-farm-component.logos-four-column .link-farm-quote, .link-farm-component.logos-three-column .link-farm-quote, .link-farm-component.logos-two-column .link-farm-quote, .link-farm-component.text-only-column .link-farm-quote { margin-bottom: .8rem } .link-farm-component.logos-four-column .link-farm-item-wrapper { padding: 12% 0 } .link-farm-component.text-only-column .link-farm-title-header { color: inherit !important; padding-bottom: 0 } .link-farm-component.align-to-top .link-farm-left-col .link-farm-header-section { padding-top: 12.45rem !important; top: 0; transform: none } } @media only screen and (max-width: 767px) { .link-farm-component .link-farm-item-mobile-one-col { width: 100% !important } } .interstitial-component { position: relative } .interstitial-component, .interstitial-component * { transition: width !important .25s ease,max-width .25s ease!important } .interstitial-component sup { line-height: 1px } .interstitial-component .interstitial-component-outter-wrapper { overflow: hidden } .interstitial-component .interstitial-component-outter-wrapper .backlayer-front { background-attachment: scroll; background-position: 50%; background-repeat: no-repeat; background-size: contain; bottom: 0; height: 100%; left: 0; max-width: 170rem; opacity: 1; overflow: visible; position: absolute; right: 0; text-align: center; top: 0; width: 100%; z-index: 88 } .interstitial-component .interstitial-component-outter-wrapper .backlayer-front img { height: auto; width: 100% } .interstitial-component .interstitial-component-outter-wrapper .backlayer-rear { background-attachment: scroll; background-position: 100%; background-repeat: no-repeat; background-size: auto 100%; bottom: 0; height: 100%; left: 0; opacity: 1; position: absolute; right: 0; text-align: center; top: 0; width: 100%; z-index: 77 } @media only screen and (max-width: 767px) { .interstitial-component .interstitial-component-outter-wrapper .backlayer-rear { display: none } } .interstitial-component .interstitial-component-outter-wrapper .interstitial-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .interstitial-component .interstitial-component-inner-wrapper { position: relative; z-index: 99 } .interstitial-component .interstitial-left-background { background: #f7f7f7; height: 100%; position: absolute; width: 100% } .interstitial-component .interstitial-left-background:before { background: #f7f7f7; content: ""; display: block; height: 100%; left: -990%; position: absolute; width: 1000% } .interstitial-component .interstitial-caption, .interstitial-component .interstitial-item-second-caption, .interstitial-component .interstitial-quotation, .interstitial-component .interstitial-title-header, .interstitial-component .interstitial-title-link { display: none } .interstitial-component .interstitial-component-outter-wrapper { background-position: top; background-repeat: no-repeat; background-size: cover; height: auto; position: relative } .interstitial-component .interstitial-component-outter-wrapper .interstitial-left-col, .interstitial-component .interstitial-component-outter-wrapper .interstitial-right-col { height: auto; position: relative } .interstitial-component .interstitial-component-outter-wrapper .interstitial-left-col { position: unset } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section { padding: 6rem 0; position: relative; width: 100% } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section * { color: #fff } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow p, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow p a, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title p, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title p a { font-family: GilroyBold } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow p, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title p { font-size: 2.2rem; font-weight: 600; line-height: 2.86rem; margin: 0 } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow .interstitial-eyebrow-text { padding-bottom: 1.6rem } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow.interstitial-gable-green p { font-family: GilroyBold } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-text-cta-section-text { padding-top: 2rem; position: relative } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-text-cta-section-cta { padding-top: 1.4rem; position: relative } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title h2 a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; font-family: GilroyBold; font-size: inherit; padding-bottom: .1rem; text-decoration: none; transition: background .25s ease-out } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title h2 a:hover { background-size: 100% 100% } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title h3 { font-family: GilroyRegular } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title h3 a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; font-family: GilroyRegular; font-size: inherit; padding-bottom: .1rem; text-decoration: none; transition: background .25s ease-out } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title h3 a:hover { background-size: 100% 100% } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section h2.padding-zero, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section h3.padding-zero { margin-bottom: 0; margin-top: 0 } .interstitial-component .interstitial-component-outter-wrapper .interstitial-content, .interstitial-component .interstitial-component-outter-wrapper .interstitial-left-col .interstitial-header-section .interstitial-title { position: relative } .interstitial-component .interstitial-right-col img { height: auto; width: 100% } .interstitial-component .interstitial-photo-frame { position: relative; right: 0; top: 0; width: 100% } .interstitial-component .interstitial-photo-frame img { height: 100%; position: absolute; right: 0 } .interstitial-component .interstitial-img-wrapper { height: 100%; margin: auto; max-width: 80rem; padding-top: 11rem; width: 100% } .interstitial-component .interstitial-img-wrapper img { height: 100%; left: 50%; position: relative; transform: translate(-50%); width: auto } .interstitial-component .interstitial-text-cta-section-cta .cta-component:first-of-type { margin-right: 2.4rem } .interstitial-component .interstitial-full-bleed-img-wrapper { height: 100%; line-height: 0; position: relative; top: 0; width: 100% } .interstitial-component .interstitial-full-bleed-img-wrapper .interstitial-component-background-video, .interstitial-component .interstitial-full-bleed-img-wrapper img { height: auto; position: relative; top: 0; width: 100% } @media only screen and (min-width: 768px) { .interstitial-component .interstitial-title h2 { font-size: 2.8rem; line-height: 3.64rem } .interstitial-component .interstitial-photo-frame { height: 100% !important; position: absolute } .interstitial-component .interstitial-component-outter-wrapper { overflow: hidden } .interstitial-component .interstitial-component-outter-wrapper .foreground-layer { display: block } .interstitial-component.fifty-percent-16-9 .interstitial-component-outter-wrapper:before { content: ""; display: block; padding-top: 50.625%; width: 100% } .interstitial-component.fifty-percent-16-9 .interstitial-component-outter-wrapper .interstitial-component-inner-wrapper { bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100% } .interstitial-component.fifty-percent-16-9 .interstitial-component-outter-wrapper .interstitial-component-inner-wrapper .interstitial-content { top: 50%; transform: translateY(-50%) } .interstitial-component.fifty-percent-16-9 .interstitial-full-bleed-img-wrapper img { width: 100% !important } .interstitial-component .interstitial-component-outter-wrapper .interstitial-left-col .interstitial-header-section:before { display: none } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow p, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title p { font-size: 2.8rem; line-height: 3.64rem } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow .interstitial-eyebrow-text { padding-bottom: 1.6rem } .interstitial-component .interstitial-img-wrapper { padding-top: 8rem } .interstitial-component .interstitial-text-cta-section-cta .cta-component:first-of-type { margin-right: 3rem } .interstitial-component .interstitial-full-bleed-img-wrapper { padding-top: 0; position: absolute } } @media only screen and (min-width: 1024px) { .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section { padding: 8rem 0 } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow p, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title p { font-size: 3.6rem; line-height: 4.68rem } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow .interstitial-eyebrow-text { padding-bottom: 2.4rem } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section.option-padding-topbot-120 { padding: 8rem 0 } .interstitial-component .interstitial-content { align-items: center; min-height: 70rem; position: relative } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-text-cta-section-cta { padding-top: 3rem } .interstitial-component .interstitial-full-bleed-img-wrapper .interstitial-component-background-video, .interstitial-component .interstitial-full-bleed-img-wrapper img { width: 115% } } @media only screen and (min-width: 1700px) { .interstitial-component .interstitial-left-background { display: block; position: unset } .interstitial-component .interstitial-component-outter-wrapper .interstitial-left-col { position: relative } .interstitial-component .interstitial-component-outter-wrapper .interstitial-left-col .interstitial-header-section { background: transparent; left: 0; padding: 0 8rem 0 2rem; position: absolute; top: 50%; transform: translateY(-50%); width: 100% } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow p, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-title p { font-size: 4.8rem; line-height: 6.24rem } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section .interstitial-eyebrow .interstitial-eyebrow-text { padding-bottom: 3.2rem } .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section.left-start2, .interstitial-component .interstitial-component-outter-wrapper .interstitial-header-section.left-start2.option-padding-topbot-120 { padding: 8rem 0 } .interstitial-component .interstitial-full-bleed-img-wrapper .interstitial-component-background-video, .interstitial-component .interstitial-full-bleed-img-wrapper img { width: 100% } } .interstitial-new-component { align-items: center; display: flex; position: relative } .interstitial-new-component.top-padding-0 .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding-top: 0 !important } .interstitial-new-component.top-padding-large .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding-top: 8rem !important } .interstitial-new-component.bottom-padding-0 .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding-bottom: 0 !important } .interstitial-new-component.bottom-padding-large .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding-bottom: 8rem !important } .interstitial-new-component .interstitial-new-component-outer-wrapper { margin: auto; width: 100% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-background-layer { bottom: 0; left: 0; max-height: 100%; max-width: 100%; overflow: hidden; position: absolute; right: 0; top: 0; z-index: 0 } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-background-layer .component-asset-block { align-items: flex-start; display: flex; height: 100%; justify-content: center; overflow: hidden } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-background-layer .component-asset-block img { flex-shrink: 0; max-width: none; min-height: 100%; min-width: 100%; width: auto } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-background-layer .component-asset-block .video-js video { height: auto } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-foreground-layer { align-items: center; bottom: 0; display: none; height: 100%; justify-content: center; left: 0; position: absolute; right: 0; top: 0; z-index: 1 } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-foreground-layer .component-asset-block { height: 100%; width: 100% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-foreground-layer .component-asset-block img { height: 100%; max-width: none; width: auto } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-foreground-layer.right-aligned { justify-content: flex-end; margin: auto; max-width: 165rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-foreground-layer.right-aligned .component-asset-block { text-align: right; width: 100% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { margin: auto; max-width: 165rem; padding: 6rem 2rem; position: relative; z-index: 2 } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h2 { margin: 0 0 1.6rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h3 { font-family: GilroyRegular; margin: 0 0 2.4rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h1 a, .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h2 a, .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h3 a, .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h4 a, .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h5 a, .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h6 a { font-family: inherit; font-size: inherit; text-decoration: underline } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content.resources-header { text-align: center; width: 100% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content.resources-header h2 { font-family: GilroyBold; font-size: 4.8rem; font-weight: 700 !important; line-height: 6.24rem } .interstitial-new-component.interstitial-variation-2 { min-height: auto !important } .interstitial-new-component.interstitial-variation-2 .interstitial-new-foreground-layer { align-items: center; bottom: 0; display: flex; height: 100%; justify-content: center; left: 0; position: relative; right: 0; top: 0; z-index: 1 } .interstitial-new-component.interstitial-variation-2 .interstitial-new-foreground-layer .component-asset-block img { height: auto; margin-bottom: -.4rem; max-width: 100%; width: auto } .interstitial-new-component.interstitial-variation-2 .interstitial-new-foreground-layer .component-asset-block .video-js { position: relative } .interstitial-new-component.interstitial-variation-2 .interstitial-new-foreground-layer.right-aligned { justify-content: flex-end } .interstitial-new-component.interstitial-variation-2 .interstitial-new-foreground-layer.right-aligned .component-asset-block { text-align: right; width: 100% } .interstitial-new-component.interstitial-variation-2 .interstitial-new-component-inner-wrapper { display: none } @media only screen and (min-width: 768px) { .interstitial-new-component.interstitial-new-min-height { min-height: 40rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-foreground-layer { display: flex } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding: 6rem 3rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content { width: 82.5% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h2 { margin: 0 0 1.6rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h3 { margin: 0 0 2.4rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content.resources-header { text-align: center; width: 100% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content.resources-header h2 { font-family: GilroyBold; font-size: 4.8rem; font-weight: 700 !important; line-height: 6.24rem } } @media only screen and (min-width: 1024px) { .interstitial-new-component { min-height: 32rem } .interstitial-new-component.interstitial-new-min-height { min-height: 50rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding: 8rem 4rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h2 { margin: 0 0 2.4rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h3 { margin: 0 0 3.2rem } } @media only screen and (min-width: 1700px) { .interstitial-new-component { min-height: 40rem } .interstitial-new-component.interstitial-new-min-height { min-height: 55rem } .interstitial-new-component.indent-interstitial .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content { padding-left: 8.25% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper { padding: 8rem 2rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content { width: 74.5% } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h2 { margin: 0 0 3.2rem } .interstitial-new-component .interstitial-new-component-outer-wrapper .interstitial-new-component-inner-wrapper .interstitial-new-text-content h3 { margin: 0 0 4.8rem } } .component-overlay-container { height: 65rem; opacity: 0; overflow-y: scroll; -webkit-overscroll-behavior-y: none; -moz-overscroll-behavior-y: none; -ms-overscroll-behavior-y: none; overscroll-behavior-y: none; position: fixed; top: 0; width: calc(100% + 1.5rem); z-index: -1 } .component-overlay-container .component-overlay-left-col, .component-overlay-container .component-overlay-right-col { opacity: 0; right: -10%; transition: all .3s linear; z-index: -1 } .component-overlay-container .no-transition .component-overlay-left-col { opacity: 1; transition: none; z-index: 9998 } .component-overlay-container .no-transition .component-overlay-right-col { opacity: 1; right: 0; transition: none; z-index: 9999 } .component-overlay-container.single-overlay .overlay-nav-btn { display: none !important } .component-overlay-container.overlay-modal-open { opacity: 1; z-index: 99997 } .component-overlay-container.overlay-modal-open.no-slide-in-effect .component-overlay-left-col { right: 0 } .component-overlay-container .active-overlay .component-overlay-left-col.overlay-col-fade-in { opacity: 1; right: 0; transition: all .25s linear .15s; z-index: 9998 } .component-overlay-container .active-overlay .component-overlay-left-col.overlay-col-slide-in, .component-overlay-container .active-overlay .component-overlay-right-col.overlay-col-slide-in { opacity: 1; right: 0; transition: all .25s linear; z-index: 9999 } .component-overlay-container.overlay-modal-close { opacity: 0; z-index: -1 } .component-overlay-container.no-left-image .component-overlay-left-col, .component-overlay-container.no-left-image .component-overlay-left-col img { display: none } .component-overlay-container.no-left-image .component-overlay-left-col .component-overlay-left-background:before { background-color: #7b8b8d !important } .component-overlay-container.no-left-image .component-overlay-left-col.overlay-col-fade-in { opacity: .8 } .component-overlay-container.no-left-image .component-overlay-right-col { margin-top: 0 } .component-overlay-container.no-left-image .component-overlay-right-col .component-overlay-right-col-quote-sec, .component-overlay-container.no-left-image .component-overlay-right-col .person-title { display: none } .component-overlay-container.no-left-image .component-overlay-right-col .overlay-person { padding: 2.1rem 0 } .component-overlay-container.no-left-image .component-overlay { background-color: transparent } .component-overlay-container.no-left-image .component-overlay .component-overlay-outter-wrapper { background-color: transparent !important } .component-overlay-container.no-left-image .component-overlay .component-overlay-left-col .component-overlay-left-background { background-color: #293e40 !important; height: 100% } .component-overlay-container.no-left-image .component-overlay .component-overlay-left-col .component-overlay-left-background:before { background: #293e40 !important; content: ""; display: none; display: block; height: 100%; left: -100%; opacity: 1; position: absolute; width: 1000% } .component-overlay-container.no-left-image .component-overlay .component-overlay-content { position: relative } .component-overlay-container.no-left-image .component-overlay-right-col-nav-sec .overlay-nav .close-btn-desktop { display: block } .component-overlay-container.no-left-image .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-previous { right: 9rem } .component-overlay-container.no-left-image .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-next { right: 4rem } @media only screen and (min-width: 768px) { .component-overlay-container { height: 100vh !important } .component-overlay-container.no-left-image .component-overlay-right-col .component-overlay-right-col-text-sec { height: 100vh } .component-overlay-container.no-left-image .component-overlay .component-overlay-content { min-height: 100vh } } @media only screen and (min-width: 1024px) { .component-overlay-container .component-overlay-left-col { opacity: 0; right: 0; transition: all .3s linear .15s; z-index: -1 } .component-overlay-container.no-left-image .component-overlay-left-col { display: block } .component-overlay-container.no-left-image .overlay-person { padding: 7rem 0 } } @media only screen and (max-width: 767px) { .component-overlay-content { margin-left: -10px; margin-right: -10px; overflow-x: hidden; overflow-y: auto } .left-image-hidden .component-overlay-content { height: 100% } .component-overlay-container.no-left-image .component-overlay-content { overflow-y: auto } .component-overlay-container.has-left-image .component-overlay .component-overlay-right-col-text-sec { margin-bottom: 0; overflow: unset } .component-overlay-container.has-left-image .component-overlay .component-overlay-right-col-scroll { height: auto; overflow: unset } .component-overlay-container.has-left-image .component-overlay-right-col-nav-sec { position: sticky; top: 0; z-index: 1 } .component-overlay-container.has-left-image.left-image-hidden .component-overlay-left-col { display: none } .component-overlay .component-overlay-right-col-nav-sec.top-menu-active { left: 0; margin: 0; right: 0 } .component-overlay-container.no-left-image .component-overlay .component-overlay-outter-wrapper { background-color: #fff !important } } .resume-container { height: auto; margin: 0 !important; overflow-y: auto; padding: 0 1.4% !important } .resume-container .component-overlay-right-col-quote-sec:first-child { padding-top: 4rem } .resume-container { -webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: auto } .component-overlay { background-color: #fff; height: 0; overflow: hidden; position: absolute; top: 0; width: 100% } .component-overlay.active-overlay { height: auto } .component-overlay.active-overlay-close { transition: all .3s ease-in-out !important } .component-overlay .component-overlay-right-col-background-img { padding-top: 100% } .component-overlay .component-overlay-right-col-background-img img { bottom: 0; height: 100%; left: 50%; position: absolute; transform: translate(-50%) } .component-overlay .component-overlay-right-col-quote-sec .overlay-quote { color: #293e40; font-weight: 600; margin-bottom: 4.8rem; margin-top: 0; position: relative } .component-overlay .component-overlay-right-col-quote-sec .overlay-quotation { display: block !important; font-size: 2.4rem; left: 0; top: -3.4rem } .component-overlay .component-overlay-right-col-quote-sec .overlay-quotation svg { width: 1.2rem } .component-overlay .component-overlay-right-col-resume-sec { padding-bottom: 3.6rem } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-header, .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list { padding-bottom: 2.4rem } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-header p { font-size: 1.2rem; font-weight: 700; margin: 0; opacity: .5; text-transform: uppercase } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-job-title, .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-timeline, .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-location { font-size: 1.4rem; line-height: 2.2rem } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-location { font-family: GilroySemiBold } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-job-title { font-weight: 500; padding-right: 1.4rem } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-timeline { font-weight: 400; opacity: .5 } .component-overlay .component-overlay-right-col-nav-sec { margin-left: -2rem; opacity: 0; position: fixed; z-index: -1 } .component-overlay .component-overlay-right-col-nav-sec.top-menu-active { bottom: 0; opacity: 1; padding: 0 2rem; width: 100%; z-index: 10 } .component-overlay .component-overlay-right-col-nav-sec .overlay-person { display: inline-block; padding: 1rem 0; position: relative; vertical-align: middle } .component-overlay .component-overlay-right-col-nav-sec .overlay-person p { color: #fff !important; font-size: 1.6rem; line-height: 2.2rem; margin: 0 } .component-overlay .component-overlay-right-col-nav-sec .overlay-person p.person-name { font-family: GilroySemiBold } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav { display: inline-block; height: 1.6rem; line-height: 0; margin: 0; position: absolute; right: 5%; top: 50%; transform: translateY(-50%); vertical-align: middle } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn { cursor: pointer; display: inline-block } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { position: absolute; right: 7rem } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next.no-more-click, .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous.no-more-click { opacity: .4; pointer-events: none } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn svg { height: 1.6rem; opacity: .6; width: .8rem } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn:hover svg { opacity: 1 } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .close-btn-desktop { display: none } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .close-btn-desktop svg { opacity: .6 } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .close-btn-desktop:hover svg { opacity: 1 } .component-overlay .component-overlay-right-col-scroll { padding-bottom: 6.4rem; padding-top: 3.2rem } .component-overlay .component-overlay-close-btn { cursor: pointer } .component-overlay .component-overlay-close-btn.close-btn-mobile { position: absolute; right: 2rem; top: 2rem; z-index: 10000 } .component-overlay .component-overlay-close-btn.close-btn-mobile svg g { stroke: #293e40 } .component-overlay .component-overlay-close-btn.close-btn-mobile svg { opacity: .3 } .component-overlay .component-overlay-close-btn.close-btn-mobile:hover svg, .component-overlay .component-overlay-close-btn.close-btn-mobile:hover svg g { opacity: 1 } @media only screen and (min-width: 768px) { .component-overlay { position: fixed } .component-overlay .component-overlay-outter-wrapper { height: 100vh } .component-overlay .component-overlay-right-col-quote-sec .overlay-quote { margin-bottom: 5.4rem } .component-overlay .component-overlay-right-col-quote-sec .overlay-quotation svg { width: 1.6rem } .component-overlay .component-overlay-right-col-nav-sec { margin-left: -3rem; padding: 0 3rem } .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { position: absolute; right: 8rem } .component-overlay .component-overlay-right-col-text-sec { height: calc(50vh - 6.4rem); margin-bottom: 4rem; overflow: hidden } .component-overlay .component-overlay-right-col-text-sec .component-overlay-right-col-scroll { height: 100%; overflow-y: scroll; -webkit-overscroll-behavior-y: none; -moz-overscroll-behavior-y: none; -ms-overscroll-behavior-y: none; overscroll-behavior-y: none; padding-top: 0; width: calc(100% + 2rem) } .component-overlay .component-overlay-left-col .component-overlay-left-background:before { bottom: 0; content: ""; display: block; height: 100%; left: -100%; position: absolute; width: 1000% } .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-job-title, .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-timeline, .component-overlay .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-location { font-size: 1.8rem; line-height: 2.42rem } .component-overlay .component-overlay-right-col:before { bottom: 0; content: ""; display: block; height: 100%; position: absolute; right: -1000%; width: 1000% } .component-overlay .component-overlay-right-col-background-img { padding-top: 56.25% } .component-overlay .component-overlay-right-col-background-img img { height: 115% } } @media only screen and (min-width: 1024px) { .component-overlay .component-overlay-right-col .component-overlay-right-col-quote-sec .overlay-quote { margin-bottom: 4.8rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec { bottom: unset; margin-left: 0; padding: 0; position: relative } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-person { padding: 3.2rem 0 } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-person p { font-size: 1.8rem; line-height: 2.8rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { position: absolute; right: 11rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next { position: absolute; right: 5rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-nav .close-btn-desktop { display: inline-block } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec:before { content: ""; display: block; height: 100%; left: -2rem; position: absolute; width: 1000% } .component-overlay .component-overlay-right-col .padding-4 { padding: 0 2% } .component-overlay .component-overlay-left-col .component-overlay-left-background:before { left: -1000% } .component-overlay .component-overlay-right-col-text-sec { height: calc(100vh - 11rem) } .component-overlay .component-overlay-right-col-text-sec .component-overlay-right-col-scroll { padding-bottom: 0; padding-top: 0 } .component-overlay .close-btn-mobile { display: none } .component-overlay .component-overlay-right-col-background-img img { height: 100% } } @media only screen and (min-width: 1700px) { .component-overlay .component-overlay-right-col .component-overlay-right-col-quote-sec .overlay-quote { margin-bottom: 8rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-person { padding: 5.6rem 0 } .component-overlay .component-overlay-right-col .component-overlay-right-col-nav-sec .overlay-person p { font-size: 1.8rem; line-height: 2.8rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-text-sec { height: calc(100vh - 16rem) } .component-overlay .component-overlay-right-col .component-overlay-right-col-text-sec .component-overlay-right-col-scroll { padding-bottom: 8rem; padding-top: 8rem } .component-overlay .component-overlay-right-col .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-job-title, .component-overlay .component-overlay-right-col .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-designation .resume-sec-timeline, .component-overlay .component-overlay-right-col .component-overlay-right-col-resume-sec .resume-sec-list .resume-sec-list-item .resume-sec-list-item-location { font-size: 1.8rem; line-height: 2.8rem } } @media only screen and (min-width: 100px)and (max-width:420px) { .overlay-person { width: 70% } } @media only screen and (max-width: 1023px) { .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn, .component-overlay .component-overlay-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { height: 64px; text-align: center; width: 50px } .component-overlay-container.no-left-image .component-overlay-right-col:after { background: #fff; bottom: 0; content: ""; display: block; height: 100%; left: -999%; position: absolute; width: 1000% } } @media only screen and (max-width: 767px) { .component-overlay .component-overlay-close-btn.close-btn-mobile { position: fixed } html body.no-scroll { position: fixed !important } .component-overlay.active-overlay { height: 100%; overflow: auto } } @media only screen and (min-width: 100px)and (max-width:767px) { .overlay-person p.person-title { font-size: 1.4rem !important } .resume-container { -webkit-overflow-scrolling: touch !important; height: auto !important } } .component-quote { position: relative } .component-quote .site-width-1700 { overflow: hidden } .component-quote .quote-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-quote .quote-right-col { background-position: 100% 0; background-repeat: no-repeat; background-size: cover; display: none } .component-quote .quote-header { padding: 6rem 0 0 } .component-quote .quote-header p { font-size: 1.4rem; line-height: 2.38rem; margin: 0 } .component-quote .quote-header .title { font-family: GilroySemiBold; font-size: 1.6rem; margin: 0; padding-bottom: .6rem; position: relative } .component-quote .quote-header .title + p { margin-top: 1.6rem } .component-quote .quote-header .title:after { background: #474d52; bottom: 0; content: ""; height: .2rem; left: 0; position: absolute; width: 2.8rem } .component-quote .quote-body { background: #fff; margin-left: -2rem; margin-right: -2rem; padding: 1.6rem 2rem } .component-quote .quote-body blockquote { font-family: GilroySemiBold; font-size: 2.2rem; margin: 0; padding: 1.6rem 0 0; position: relative } .component-quote .quote-body blockquote:before { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAkCAYAAADLsGk3AAAAAXNSR0IArs4c6QAABnVJREFUWAm1WX1sFEUUnzd7hRaLKJRC/Qr8YZS2oLUR9R+610KbAo1AcpBAAgLGiIoGAibGP6gG/AJBjYIhEYyiCVaNpkqBtPfRogJJIUrvSAwSo4ZA70Ba+t27HX9zl2u3d7u3e9dzknZn3tdv3rydN2/2iGXQ5ldVTbsVEdtJiKUOUp7+zdt8OgMztlTK1bqCAdGzXWNiMVf4Rr/bfdZIkYyIZrTyhQunDIS17ZqmvQiZyVIOBoYF0asBr3sPEQkz3XTpD6vL7hgSXS8zJjYLwfLjWHi+4vd59iZi2Xak2OmsYhFxGDO912hSRKwpjyavbfc2hoz46dBKK6oWRZh2mAlxt7Ee/Tg5h68729JyPc63dOQJlyuvqzP0thDiBShZyNMVh8JWX/B4fHGAdJ7ldXWT+rp63kEUnrPCwsL9w5iyOuBraZMYKSc2d8mSO8M9vceYYI/bnhBRhDP2ustZsbO+vl6zq1dSUzNV9A81CSbm29VhwELUdqyqVN80daS8pqaob2DwBJyYa9uwThCGPw60ejfpSKbdskWL7hocCp9E1EtMhVIy6CMsXnIrq62d3j8w1JaJE8ToJ8aV5Ssr1eeTLSdT5lVXFw4MDp/KxAm8XqdIoWUBn3tzUkRcLpfivxY6gRBXJcOmoBB9m0PK7nRSscTq6Aw2Y8HUFJaTWFisb5jCdgc8njNxpiPeiT87gtd3YbOl40RQ4cqGDm/LD3Ebdp/+a8G3IKvalYcDncia6wOtnmOJOmMiUqouVCNa2JMoZDaG4RPE857ye49dNZMxo5dUVlZqYa3FjJ9Il+mdO5T1HS0t1xJ5cjyyR5BhuCbCe42EkmgyMxFt9fvctZk4EcUKi31Jdg0IcCCMw++lgM+72MwJqTbyajV4W9fiBC0zsDWWJFMeiTV+r/coAMbybI6AtQGv7zwrcekE1hpnhbvBSjYaEblCQhOvWQlLPiex8SKcsCNrJCM3uBDaDiNeEo2U9XackHqK/Bckqkb6s06XRPsR4jekTqZNFMyohe4mK31E+wM4gVPeXotGRGgMoU7dEOZLvLBgS2opay5eRkssFBy/5z1w/zZra6MSVKK68jURCuGonzhKTu5FDx6P5/tkjn3KY7W1t9/q7Q8hheak0kI6r0s3nTuYuPGopROMAjh8xuWEnHh3/7Cso1I6gervQrpOSNsOwTQbBaE4VFJVVcyGta2oAudArwB/slw/zxXW2OF2n0y8H4Bn0KyxOPFD89Tq0rAY3oIs+iCMRLGIiXPcwaNYBoYZFS9wfody5EkjZpyG/YGSmc2E4ZF0HefJJ5z4FTfFZ63KkzkVaiPKkaV63cQ+9tDfiEqRORY7j9S5SV+eSBscZ8J9icYSxzB6j5lhKYuM91BYhNtKKpzPJOqOGQuyxsLFLTUWzrqIaJujqhv1tpG1aKqekGlfgmuCHShd4FxhZgM34exgyX2m0UHcWkfeJI7VzIrx2OQF14jtR2l+m6EzIjuLFscSEXFA3irlGCUTyzMEzZCIhZkRHgwbnhVIu7kZmjVTK+rr7l0nmRzGb5pJZU7XFhvpIvN0GdHHR4thcWSJ7Dsi6BGjyf0viyZYucTiTNBfRqDjoQli02Qhmmwj+1gIhDxn5H1EnE0GHCdFCKXxypVoQaq3hPBnHQtRdsiKmjOFTuvBstHHKv3bfvDgcKItfIfMOhYOz+sNDQ0RPqWg4KQETgQdzxiv1h9G+hOn5B9HGZDVDU+Colj8l4aGfuL8MyPgTGlIhceNdNsbG/vw4ftzI17GNE5RrNiGdHB8FGY9GRvTK+IqrCh0RE/S9yfw3HdRm/XqaZn2Meew0JQvpH7shnj5ctf0WbOlcXl7G18j+sTv9XxqZuTqn5duFs6a3Y9NWmMmY5eOLXHwYqs7+jbFIgLNlc6KD7FSX9k1YiSHFTrPqWCrEU9Pw3fh9yH7tZ6Wdp+o3ZE7YVtcD06NNlWtdwQ13xH8qLJqlGqzR+w0p0nL7X4eklidwvclShqXTQSdGP2s5PAV+s9DYxyJS5YscK6GM3swLorTzJ/UjdV9D3fsnUYp11wvxilW1TW4o+xB9TzTSlZmPCSLfYVc3eX11uNT0WgzdESyo7+LhELVTGMolUUZSDMBOA3PHsEoiHvMOVxmPLk5ytH25uZxpVSJdTN4o4ZEBFgELDEjhkW3sJdCMSzuzp808eiZpqZuOb/E9h/pUlKEVNCHKQAAAABJRU5ErkJggg=="); background-position: 0 0; background-repeat: no-repeat; background-size: 100%; content: ""; height: 1rem; left: 0; position: absolute; top: 0; width: 1rem } .component-quote .quote-body blockquote p { font-size: inherit; line-height: inherit; margin-top: 0 } .component-quote .quote-body blockquote p:last-child { margin: 0 } .component-quote .quote-cite { margin-top: 1.6rem } .component-quote .quote-cite, .component-quote .quote-cite p, .component-quote .quote-cite span { font-size: 1.6rem; line-height: 2.72rem } .component-quote .quote-cite p { margin: 0 } .component-quote .quote-cite span.name { font-family: GilroyBold } .component-quote .quote-footer { color: #fff; margin: 1.2rem -2rem 0; padding: 1.2rem 2rem 4rem } .component-quote .quote-footer a { color: #fff } .component-quote .quote-footer p { font-size: 1.4rem; line-height: 2.38rem; margin: 0 } .component-quote .quote-cta .cta-component { margin-bottom: 2rem; margin-top: 0 } .component-quote .quote-cta .cta-component a { font-family: GilroySemiBold } .component-quote .component-quote-background-layer { height: 100%; overflow: hidden; position: absolute; width: 100% } .component-quote .component-quote-background-layer .component-asset-block { align-items: center; display: flex; height: 100%; justify-content: flex-end } .component-quote .component-quote-background-layer .component-asset-block picture > img, .component-quote .component-quote-background-layer .component-asset-block > img, .component-quote .component-quote-background-layer .component-asset-block > svg, .component-quote .component-quote-background-layer .component-asset-block > video { height: 100%; max-width: none; position: absolute; width: auto } @media screen and (max-width: 767px) { .component-quote { background-image: none !important } .component-quote .quote-body { background: none !important; padding-bottom: 0; padding-top: 2.4rem } .component-quote .quote-header { padding-top: 2.4rem } .component-quote .quote-image { transform: translate(-15%) } .component-quote .quote-footer { margin: 0; padding: 0 } .component-quote .quote-footer .quote-cta { margin: 1.2rem -2rem 0; padding: 1.2rem 2rem 4rem } } @media only screen and (min-width: 768px) { .component-quote { background-position: 110% 100%; background-repeat: no-repeat; background-size: contain } .component-quote .quote-right-col { background-position: 80% top; background-size: auto 90%; display: flex; flex-direction: column-reverse; padding: 0 } .component-quote .component-quote-background-layer .component-asset-block { align-items: center; justify-content: center } .component-quote .flex-box-container .quote-left-col { min-height: 50vh } .component-quote .quote-left-col { background: hsla(0,0%,100%,.3); display: flex; flex-direction: column; margin-left: -1.5rem; padding-left: 3rem } .component-quote .quote-image { display: none } .component-quote .quote-body, .component-quote .quote-footer, .component-quote .quote-header { display: flex; flex-direction: column } .component-quote .quote-header { padding-bottom: 2.4rem } .component-quote .quote-body { background: transparent; flex-flow: column; flex-grow: 1; padding: 2.4rem 2rem 0 } .component-quote .quote-body blockquote { font-size: 2.8rem; line-height: 3.64rem; padding-top: 1.6rem } .component-quote .quote-body blockquote:before { height: 1.8rem; top: -1rem; width: 1.8rem } .component-quote .quote-cta { padding-top: .6rem } .component-quote .quote-footer { margin: 1.6rem -1.5rem 0 -3rem; padding: 2.4rem 2rem 4rem 3rem } } @media only screen and (min-width: 1024px) { .component-quote { background-position-x: 100% } .component-quote .quote-left-col { margin-left: -2rem; padding-left: 4rem } .component-quote .flex-box-container .quote-left-col { min-height: 68rem } .component-quote .quote-header { padding-right: 25%; padding-top: 8rem } .component-quote .quote-header p { font-size: 1.8rem; line-height: 3.06rem } .component-quote .quote-header .title { font-size: 2rem } .component-quote .quote-header .title:after { width: 3.4rem } .component-quote .quote-body blockquote { font-size: 3.6rem; margin-right: -20%; padding-top: 3.64rem } .component-quote .quote-body blockquote:before { height: 2.6rem; top: 0; width: 2.6rem } .component-quote .quote-cite { margin-top: 2.4rem } .component-quote .quote-cite, .component-quote .quote-cite p, .component-quote .quote-cite span { font-size: 1.8rem } .component-quote .quote-footer { margin: .8rem -2rem 0 -4rem; padding-bottom: 4rem; padding-left: 4rem; padding-top: 3.2rem } .component-quote .quote-cta .cta-component a, .component-quote .quote-footer p { font-size: 1.6rem } } @media only screen and (min-width: 1280px) { .component-quote .site-width-1700 { overflow: visible } } @media only screen and (min-width: 1700px) { .component-quote .flex-box-container .quote-left-col { min-height: 70rem } .component-quote .quote-header { padding-bottom: 0; padding-top: 8rem } .component-quote .quote-header .title, .component-quote .quote-header p { font-size: 2.2rem } .component-quote .component-quote-background-layer { width: 100% } .component-quote .component-quote-background-layer .component-asset-block picture > img, .component-quote .component-quote-background-layer .component-asset-block > img, .component-quote .component-quote-background-layer .component-asset-block > svg, .component-quote .component-quote-background-layer .component-asset-block > video { height: auto; max-width: 100%; position: relative; width: 100% } .component-quote .quote-body { padding-bottom: 0; padding-top: 4rem } .component-quote .quote-body blockquote { font-size: 4.8rem; line-height: 6.24rem; margin-right: -25%; padding-top: 4.2rem } .component-quote .quote-cite { margin-top: 3.2rem } .component-quote .quote-cite, .component-quote .quote-cite p, .component-quote .quote-cite span { font-size: 2rem } .component-quote .quote-footer { margin-top: 2.4rem; padding-bottom: 6rem; padding-top: 3.2rem; position: relative } .component-quote .quote-footer p { font-size: 1.8rem } .component-quote .quote-footer:before { bottom: 0; content: ""; display: block; height: 100%; position: absolute; right: 100%; width: 500%; z-index: 10 } .component-quote .quote-left-col:before { background: hsla(0,0%,100%,.3); content: ""; display: block; height: 100%; position: absolute; right: 100%; top: 0; width: 500%; z-index: 10 } .component-quote .quote-cta .cta-component a { font-size: 1.8rem } } .component-video-modal * { transition: all .25s ease-in-out !important } .component-video-modal .modal, .component-video-modal .modal-backdrop { bottom: 0; left: 0; right: 0; top: 0 } .component-video-modal .nav-normal { background: #fff; font-family: Gotham SSm A,Gotham SSm B,Helvetica,Arial,sans-serif; font-size: 100%; max-width: 100% !important; overflow: visible !important; width: 100% !important } .component-video-modal .media-tile .img-item, .component-video-modal .modal-dialog .modal-header.img-bg { background-position: 50%; background-repeat: no-repeat; background-size: cover } .component-video-modal .modal, .component-video-modal .modal-open { overflow: hidden } .component-video-modal .fade { opacity: 0; transition: opacity .15s linear } .component-video-modal .fade.in { opacity: 1 } .component-video-modal .modal { -webkit-overflow-scrolling: touch; display: none; outline: 0; position: fixed; z-index: 10050 } .component-video-modal .modal.fade .modal-dialog { transform: translateY(-25%); transition: transform .3s ease-out } .component-video-modal .modal.in .modal-dialog { transform: translate(0) } .component-video-modal .modal-open .modal { overflow-x: hidden; overflow-y: auto } .component-video-modal .modal-dialog { position: relative; width: auto } .component-video-modal .modal-content { background-clip: padding-box; background-color: #fff; border: 1px solid transparent; border-radius: 0; box-shadow: 0 3px 9px rgba(0,0,0,.5); outline: 0; position: relative } .component-video-modal .modal-backdrop { background-color: #000; position: fixed; z-index: 10000 } .component-video-modal .modal-backdrop.fade { filter: alpha(opacity=0); opacity: 0 } .component-video-modal .modal-backdrop.in { filter: alpha(opacity=75); opacity: .75 } .component-video-modal .modal-header { border-bottom: 1px solid #e5e5e5; min-height: 16.43px; padding: 15px } .component-video-modal .modal-header .close { margin-top: -2px } .component-video-modal .modal-title { line-height: 1.42857; margin: 0 } .component-video-modal .modal-body { padding: 15px; position: relative } .component-video-modal .modal-footer { border-top: 1px solid #e5e5e5; padding: 15px; text-align: right } .component-video-modal .modal-footer:after, .component-video-modal .modal-footer:before { content: " "; display: table } .component-video-modal .modal-footer:after { clear: both } .component-video-modal .modal-footer .btn + .btn { margin-bottom: 0; margin-left: 5px } .component-video-modal .modal-footer .btn-group .btn + .btn { margin-left: -1px } .component-video-modal .modal-footer .btn-block + .btn-block { margin-left: 0 } .component-video-modal .modal-scrollbar-measure { height: 50px; overflow: scroll; position: absolute; top: -9999px; width: 50px } @media(min-width: 768px) { .component-video-modal .modal-dialog { margin: 30px auto; width: 600px } .component-video-modal .modal-content { box-shadow: 0 5px 15px rgba(0,0,0,.5) } .component-video-modal .modal-sm { width: 300px } } @media(min-width: 992px) { .component-video-modal .modal-lg { width: 900px } } .component-video-modal .media-tile { display: block; height: 0; overflow: hidden; padding: 0; position: relative } .component-video-modal .media-tile .img-item, .component-video-modal .media-tile .media-item, .component-video-modal .media-tile embed, .component-video-modal .media-tile iframe, .component-video-modal .media-tile object, .component-video-modal .media-tile video { border: 0; bottom: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100% } .component-video-modal .media-tile.media-src-2by1 { padding-bottom: 100% } .component-video-modal .media-tile.media-src-4by3 { padding-bottom: 75% } .component-video-modal .media-tile.media-src-16by9 { padding-bottom: 56.25% } .component-video-modal .media-tile.media-src-1by2 { padding-bottom: 50% } .component-video-modal .media-tile.media-src-1by3 { padding-bottom: 33.33333333% } .component-video-modal .media-tile.google-map { padding-bottom: 62% } .component-video-modal .media-tile.promo-tile { padding-bottom: 35% } .component-video-modal .media-tile span { display: block } .component-video-modal .modal-dialog { background-color: #000; margin: 30px 10px 10px } .component-video-modal .modal-dialog .container { width: 100% } .component-video-modal .modal-dialog .modal-content { border: none } .component-video-modal .modal-dialog .modal-header { border-bottom: none; height: 0; min-height: 0; padding: 0; position: relative } .component-video-modal .modal-dialog .modal-header.img-bg { color: #fff } .component-video-modal .modal-dialog .modal-header .close { background-color: #efefef; border: none; border-radius: 100px; display: block; height: 30px; opacity: 1; position: absolute; right: -15px; top: -15px; width: 30px; z-index: 10100 } .component-video-modal .modal-dialog .modal-header .close:after, .component-video-modal .modal-dialog .modal-header .close:before { background-color: #000; content: " "; display: block; position: absolute; transform: translateZ(0) } .component-video-modal .modal-dialog .modal-header .close:before { height: 3px; left: 5px; top: 14px; transform: rotate(45deg); width: 20px } .component-video-modal .modal-dialog .modal-header .close:after { height: 3px; left: 5px; top: 14px; transform: rotate(-45deg); width: 20px } .component-video-modal .modal-dialog .modal-header .close.collapse:after { display: none } .component-video-modal .modal-dialog .modal-header .close:focus, .component-video-modal .modal-dialog .modal-header .close:hover { border-color: #e51b24; color: #e51b24; opacity: 1 } .component-video-modal .modal-dialog .modal-header .close:focus:after, .component-video-modal .modal-dialog .modal-header .close:focus:before, .component-video-modal .modal-dialog .modal-header .close:hover:after, .component-video-modal .modal-dialog .modal-header .close:hover:before { background-color: #e51b24 } .component-video-modal .modal-dialog .modal-body { padding: 0 } .component-video-modal .modal-dialog .modal-footer { display: none; padding: 0 } @media(min-width: 768px) { .component-video-modal .modal-dialog { margin: 30px auto; width: 750px } } @media(min-width: 992px) { .component-video-modal .modal-dialog { width: 950px } } @media(min-width: 1200px) { .component-video-modal .modal-dialog { left: 50%; margin: 0; position: absolute; top: 50%; transform: translate(-50%,-50%) !important; width: 1050px } } .component-video-modal iframe#youTubePlayer { background: #000 !important } .component-video-modal .video-component { background-position: 50% } .component-video-modal .video-component a { position: relative } .component-video-modal .video-component a.button-dark:after { border: 2px solid #333; color: #333 } .component-video-modal .video-component a:after { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; border: 2px solid #fff; border-radius: 100px; color: #fff; content: ""; display: block; font: normal normal normal 14px/1 FontAwesome; font-size: 31px; height: 70px; left: 50%; line-height: 68px; margin-left: -35px; margin-top: -35px; opacity: .75; padding-left: 23px; position: absolute; text-align: left; text-rendering: auto; top: 50%; transition: opacity .25s ease-in-out; vertical-align: top; width: 70px; z-index: 90 } .component-video-modal .video-component a:hover:after { opacity: 1 } .component-video-modal .video-component.bg-img-overlay a { position: relative } .component-video-modal .video-component.bg-img-overlay a:before { background-color: #000; bottom: 0; content: " "; height: inherit; left: 0; opacity: .15; position: absolute; right: 0; top: 0; transition: opacity .25s ease-in-out; width: 100%; z-index: 80 } .component-video-modal #videoModal .modal-header, .component-video-modal .video-component .media-caption { z-index: 100 } .component-video-modal .video-component.bg-img-overlay a:hover:before { opacity: .45 } .component-video-modal .video-component.without-play-btn a:after, .component-video-modal .video-component.without-play-btn a:before { display: none } .component-video-modal .video-component .media-title { font-size: 22px } .component-video-modal .video-component.with-caption { position: relative } .component-video-modal #videoPlayerWrapper .innerWrapper, .component-video-modal .tab-grid-container-component .video-component a { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-video-modal .video-component.with-caption.with-title-top .media-caption { display: block } .component-video-modal .video-component.with-caption.with-title-top .media-title.top { display: none } .component-video-modal .slider-container-component .video-component.with-title-top .media-caption, .component-video-modal .video-component.with-caption.with-title-top .media-title.bottom { display: block } .component-video-modal .slider-container-component .video-component.with-title-top .media-title.top { display: none } .component-video-modal .slider-container-component .video-component.with-title-top .media-title.bottom { display: block } .component-video-modal .tab-grid-container-component .video-component { background-size: cover } .component-video-modal .tab-grid-container-component .video-component img.img-responsive { display: none } .component-video-modal #videoPlayerWrapper .oo-player-video-container { bottom: 0; left: 0; position: absolute !important; right: 0; top: 0 } .component-video-modal #videoModal .modal-body { z-index: 90 } .component-video-modal .modal-variation-refresh #videoPlayerWrapper .vod .oo_scrubber { background: 0 0 } .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:after, .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:before { height: 3px !important; left: 7px !important; top: 13px !important; width: 16px !important } @media(max-width: 899px) { .component-video-modal .tab-left-container-component main .video-component { background-size: cover; bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-video-modal .tab-left-container-component main .video-component a { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-video-modal .tab-left-container-component aside .video-component, .component-video-modal .tab-left-container-component aside .video-component a { bottom: auto; left: auto; position: relative; right: auto; top: auto } .component-video-modal .tab-left-container-component main .video-component img { display: none } .component-video-modal .tab-left-container-component aside .video-component img, .component-video-modal .tab-left-container-component main .video-component .media-caption img { display: inline-block } .component-video-modal .tab-left-container-component aside .video-component { background-size: cover } } @media(min-width: 900px) { .component-video-modal .tab-left-container-component .video-component, .component-video-modal .tab-left-container-component .video-component a { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-video-modal .tab-left-container-component .video-component { background-size: cover } .component-video-modal .tab-left-container-component .video-component img { display: inline-block } } @media(max-width: 767px) { .component-video-modal .video-component .media-title { font-size: 16px !important } } @media(min-width: 768px) { .component-video-modal .video-component.with-caption { position: relative } .component-video-modal .video-component.with-caption.with-title-top .media-caption, .component-video-modal .video-component.with-caption.with-title-top .media-title.top { display: block } .component-video-modal .video-component.with-caption.with-title-top .media-title.bottom { display: none } .component-video-modal .slider-container-component .video-component.with-title-top .media-caption { display: block } .component-video-modal .slider-container-component .video-component.with-title-top .media-title.top { display: block; visibility: visible } .component-video-modal .slider-container-component .video-component.with-title-top .media-title.bottom { display: none } .component-video-modal .modal-dialog .video-btn-more { bottom: -60px } } @media(min-width: 992px) { .component-video-modal .modal-dialog .video-btn-more { bottom: -80px } } .component-video-modal .modal-dialog { margin-left: auto; margin-right: auto; max-width: 65% } .component-video-modal .modal-dialog .video-btn-more { bottom: -60px; position: absolute; text-align: center; width: 100% } .component-video-modal .modal-variation-refresh .modal-dialog { background-color: transparent; margin: 0 } .component-video-modal .modal-variation-refresh .modal-dialog .modal-body { height: 100% } .component-video-modal .modal-variation-refresh .modal-dialog .modal-body #videoPlayerWrapper { height: 100%; padding: 0 } .component-video-modal .modal-variation-refresh #videoPlayerWrapper .oo_controls { border-radius: 0 !important; bottom: 0 !important; height: 75px !important; left: 0 !important; right: 0 !important } .component-video-modal .modal-variation-refresh #videoPlayerWrapper .oo_controls .oo_controls_inner { bottom: 20px !important; top: 20px !important } .component-video-modal .modal-variation-refresh #videoPlayerWrapper .vod .oo_scrubber { background: none; bottom: 10px !important; left: 85px !important; right: 45px !important; top: 9px !important } .component-video-modal #videoPlayerWrapper .oo_controls .vod .oo_scrubber_track, .component-video-modal .modal-variation-refresh #videoPlayerWrapper .vod .oo_scrubber_track { left: 55px !important; right: 55px !important } .component-video-modal .modal-variation-refresh #videoPlayerWrapper .oo_playhead { top: -2px !important } .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close { background-color: #000; right: 15px !important; top: 15px !important } .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:after, .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:before { background-color: #fff } .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:focus:after, .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:focus:before, .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:hover:after, .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:hover:before { background-color: #e51b24 } .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:after, .component-video-modal .modal-variation-refresh .modal-dialog .modal-header .close:before { height: 3px !important; left: 7px !important; top: 13px !important; width: 16px !important } .component-video-modal .modal-variation-refresh .modal-dialog { height: 100%; max-width: 1920px !important; width: 100% !important } .component-video-modal .modal-variation-refresh .modal-content { height: 100% } .component-video-modal .modal-variation-refresh.in .video-js { bottom: 0; height: 100%; left: 0; position: fixed; right: 0; top: 0; width: 100% } .component-video-modal button.close, .component-video-modal button.close:focus { outline: none } .component-newsfeed-form .LV_valid { display: none !important } .marquee-medium-component { background-position: 50%; background-size: cover } .marquee-medium-component, .marquee-medium-component * { transition: width !important .25s ease,max-width .25s ease!important } .marquee-medium-component.top-padding-0 .marquee-medium-header-section { padding-top: 0 !important } .marquee-medium-component.bottom-padding-0 .marquee-medium-header-section { padding-bottom: 0 !important } .marquee-medium-component.top-padding-nav .marquee-medium-header-section { padding-top: 11.2rem !important } .marquee-medium-component.hide-mobile-image .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-header-section { padding-top: 5.6rem } .marquee-medium-component.hide-mobile-image .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image .marquee-medium-right-col-frame, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-right-col-frame, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-right-col-frame, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-right-col-frame { display: none } .marquee-medium-component .marquee-medium-component-outter-wrapper { height: auto; overflow: hidden; position: relative } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section { padding: 6rem 0; position: relative; width: 100% } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-left-col .marquee-medium-header-section .marquee-medium-title, .marquee-medium-component .marquee-medium-content { position: relative } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow { margin-bottom: .8rem; padding-bottom: .4rem; position: relative } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow span { font-family: GilroySemiBold; font-size: 1.6rem; font-weight: 500; line-height: 2.72rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow:after { background: #474d52; bottom: 0; content: ""; display: block; height: .2rem; position: absolute; width: 2.8rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section * { color: #fff } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-title { padding-bottom: .8rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-title h1 { padding-bottom: 0; padding-top: 0 } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle { padding-bottom: 1.2rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p { font-size: 1.8rem; line-height: 1.5; margin-bottom: 0; margin-top: 0; padding-bottom: 0 } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p span.super-case, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p sup, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle span.super-case, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle sup { font-size: 5.4px; top: .44rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-text-cta-section-cta, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-text-cta-section-text { position: relative } .marquee-medium-component .marquee-medium-photo-frame { position: relative; right: 0; top: 0; width: 100% } .marquee-medium-component .marquee-medium-photo-frame img { height: 100%; position: absolute; right: 0 } .marquee-medium-component .marquee-medium-img-wrapper { height: 100%; margin: auto; max-width: 80rem; padding-top: 11rem; width: 100% } .marquee-medium-component .marquee-medium-img-wrapper img { height: 100%; left: 50%; position: relative; transform: translate(-50%); width: auto } .marquee-medium-component .marquee-medium-text-cta-section-cta .cta-component { margin-bottom: 1.2rem; margin-top: 1.2rem } .marquee-medium-component .marquee-medium-text-cta-section-cta .cta-component:first-of-type { margin-right: 2.4rem } .marquee-medium-component .marquee-medium-full-bleed-img-wrapper { height: 100%; line-height: 0; position: relative; top: 0; width: 100% } .marquee-medium-component .marquee-medium-full-bleed-img-wrapper .marquee-medium-component-background-video, .marquee-medium-component .marquee-medium-full-bleed-img-wrapper img { height: auto; position: relative; top: 0; width: 100% } .marquee-medium-component .marquee-medium-asset-section, .marquee-medium-component .marquee-medium-right-col { display: none } .marquee-medium-component .cta-title-link-arrow { margin-right: 0 !important } .marquee-medium-component .marquee-medium-asset-section { height: 100%; position: relative; width: 100% } .marquee-medium-component .marquee-medium-asset-section:before { content: ""; display: block; padding-top: 56.25% } .marquee-medium-component .marquee-medium-asset-section .image-ratio-4-3-mobile { height: 100%; width: 100% } .marquee-medium-component .marquee-medium-asset-section .image-ratio-4-3-mobile + img { display: none } .marquee-medium-component .marquee-medium-asset-section .marquee-medium-asset-section-frame { height: 100%; left: 50%; position: absolute; top: 0; transform: translate(-50%); width: 100%; z-index: 0 } .marquee-medium-component .marquee-medium-asset-section img, .marquee-medium-component .marquee-medium-asset-section svg, .marquee-medium-component .marquee-medium-asset-section video { height: 100%; width: 100% } .marquee-medium-component .my-account-loading-layer { position: fixed } .marquee-medium-component.right-align-img .marquee-medium-content-innerwrapper { z-index: 1 } .marquee-medium-component.right-align-img .marquee-medium-asset-section { display: block } .marquee-medium-component.right-align-img .marquee-medium-header-section { padding-bottom: 2.4rem } .marquee-medium-component.right-align-img.right-image-top .marquee-medium-asset-section { order: 1 } .marquee-medium-component.right-align-img.right-image-top .marquee-medium-content-innerwrapper { order: 2 } .marquee-medium-component.right-align-img.right-image-top .marquee-medium-header-section { padding-bottom: 5.6rem; padding-top: 0 } .marquee-medium-component.right-align-img.right-image-top .marquee-medium-asset-section { margin-bottom: 2.4rem } .marquee-medium-component.right-col-icon .marquee-medium-right-col { display: block } .marquee-medium-component.right-col-icon .marquee-medium-right-col-frame { line-height: 0; margin: auto; padding-bottom: 6rem; text-align: center; width: 34.5% } .marquee-medium-component.right-col-icon .marquee-medium-right-col-frame img, .marquee-medium-component.right-col-icon .marquee-medium-right-col-frame svg, .marquee-medium-component.right-col-icon .marquee-medium-right-col-frame video { width: 100% } .marquee-medium-component.right-col-icon .marquee-medium-header-section { padding-bottom: 1.4rem } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-right-col { order: 1 } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-content-innerwrapper { order: 2 } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-header-section { padding-bottom: 6rem; padding-top: 0 } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-asset-section { margin-bottom: 2.4rem } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-right-col-frame { padding-bottom: 4rem; padding-top: 5.6rem } .marquee-medium-component.right-align-img.right-col-icon .marquee-medium-right-col { display: block; position: absolute !important; z-index: 1 } .marquee-medium-component.header-dropdown-variation .marquee-medium-component-outter-wrapper { overflow: visible } .marquee-medium-component.header-dropdown-variation .dropdown-downward-arrow, .marquee-medium-component.header-dropdown-variation .dropdown-menu-box { display: none } .marquee-medium-component.header-dropdown-variation .dropdown-menu-box-mobile { display: block } .marquee-medium-component.header-dropdown-variation .marquee-medium-title { position: relative; width: 90% } .marquee-medium-component.header-dropdown-variation .marquee-medium-title h1 { display: inline; margin-right: 1rem } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-downward-arrow { bottom: 0; display: inline-block; left: auto; position: absolute } @media only screen and (min-width: 1024px) { .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-downward-arrow { bottom: 1rem } } @media only screen and (min-width: 1700px) { .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-downward-arrow { bottom: 2rem } } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-downward-arrow svg path { stroke: #293e40 } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box { background: #fff; border-radius: 1.5rem; margin-left: -7rem; position: absolute; top: 3.5rem; width: 35.6rem; z-index: 10 } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box:before { border: 1rem solid transparent; border-bottom-color: #fff; bottom: 100%; content: ""; display: block; height: 0; margin-left: 7.2rem; position: absolute; width: 0 } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul { margin: 0; padding: 0 } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul li { padding: 1.6rem 3.2rem } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul li:first-child { border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem; padding-top: 3.2rem } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul li:last-child { border-bottom-left-radius: 1.5rem; border-bottom-right-radius: 1.5rem; padding-bottom: 3.2rem } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul li a { font-size: 1.6rem; line-height: 2.72rem } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul li:hover { background-color: #293e40 } .marquee-medium-component.header-dropdown-variation .marquee-medium-title .dropdown-menu-box ul li:hover a { color: #fff !important } .marquee-medium-component.header-dropdown-variation .marquee-medium-title select.dropdown-menu-box-mobile { font-family: GilroySemiBold; font-size: 2.8rem; height: 100%; line-height: 3.64rem; margin: 0; opacity: 0; padding: 0; position: absolute; text-indent: unset; width: 110%; z-index: 100 } .marquee-medium-component.remove-eyebrow-accent .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow:after, .marquee-medium-component.remove-eyebrow-accent .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow:after { background: transparent; content: none } @media only screen and (max-width: 767px) { .marquee-medium-component.mobile-4-3-image-ratio-wrapper .marquee-medium-component-inner-wrapper { padding-left: 0; padding-right: 0 } .marquee-medium-component.mobile-4-3-image-ratio-wrapper .marquee-medium-content-innerwrapper { padding-left: 20px; padding-right: 20px } .marquee-medium-component.mobile-4-3-image-ratio-wrapper .marquee-medium-asset-section:before { display: none } .marquee-medium-component.mobile-4-3-image-ratio-wrapper .marquee-medium-asset-section .marquee-medium-asset-section-frame { left: auto; position: relative; transform: none; width: 100% !important } } @media only screen and (min-width: 768px) { .marquee-medium-component.hide-mobile-image .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-header-section { padding-top: 4.8rem } .marquee-medium-component.hide-mobile-image .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image .marquee-medium-right-col-frame, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-right-col-frame, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-right-col-frame, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-asset-section, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-right-col-frame { display: block } .marquee-medium-component .image-ratio-4-3-mobile, .marquee-medium-component .marquee-medium-asset-section:before { display: none } .marquee-medium-component .marquee-medium-asset-section .image-ratio-4-3-mobile + img { display: inline } .marquee-medium-component .marquee-medium-photo-frame { height: 100% !important; position: absolute } .marquee-medium-component .marquee-medium-component-outter-wrapper { overflow: hidden } .marquee-medium-component.fifty-percent-16-9 .marquee-medium-component-outter-wrapper:before { content: ""; display: block; padding-top: 50.625%; width: 100% } .marquee-medium-component.fifty-percent-16-9 .marquee-medium-component-outter-wrapper .marquee-medium-component-inner-wrapper { bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100% } .marquee-medium-component.fifty-percent-16-9 .marquee-medium-component-outter-wrapper .marquee-medium-component-inner-wrapper .marquee-medium-content { top: 50%; transform: translateY(-50%) } .marquee-medium-component.fifty-percent-16-9 .marquee-medium-full-bleed-img-wrapper img { width: 100% !important } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle { padding-bottom: 2.2rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-content { -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; min-height: 40rem; position: relative } .marquee-medium-component .marquee-medium-img-wrapper { padding-top: 8rem } .marquee-medium-component .marquee-medium-full-bleed-img-wrapper { padding-top: 0; position: absolute } .marquee-medium-component.right-align-img .marquee-medium-asset-section { height: 100%; padding-top: 0; position: absolute; top: 0 } .marquee-medium-component.right-align-img .marquee-medium-asset-section .marquee-medium-asset-section-frame { align-items: center; display: flex; left: auto; max-width: 55%; right: -2rem; transform: none; width: auto } .marquee-medium-component.right-align-img .marquee-medium-asset-section .marquee-medium-asset-section-frame img { height: auto } .marquee-medium-component.right-align-img .marquee-medium-header-section, .marquee-medium-component.right-align-img.right-image-top .marquee-medium-header-section { padding-bottom: 4.8rem; padding-top: 5.6rem } .marquee-medium-component.right-align-img.right-image-top .marquee-medium-asset-section { margin-bottom: 0 } .marquee-medium-component.right-col-icon .marquee-medium-right-col { position: relative } .marquee-medium-component.right-col-icon .marquee-medium-right-col-frame { padding-bottom: 0; text-align: center; width: 60% } .marquee-medium-component.right-col-icon .marquee-medium-header-section { padding-bottom: 6rem } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-right-col { order: 2 } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-content-innerwrapper { order: 1 } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-header-section { padding-bottom: 4.8rem; padding-top: 5.6rem } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-asset-section { margin-bottom: 0 } .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-right-col-frame { padding-bottom: 0; padding-top: 0 } .marquee-medium-component.right-align-img.right-col-icon .marquee-medium-right-col { position: relative !important } .marquee-medium-component.header-dropdown-variation .marquee-medium-title:hover .dropdown-menu-box { display: block } .marquee-medium-component.header-dropdown-variation .dropdown-menu-box-mobile { display: none } .marquee-medium-component.header-dropdown-variation .marquee-medium-content-innerwrapper { position: static !important } .marquee-medium-component.header-dropdown-variation .marquee-medium-breadcrumbs { padding-left: 1.5rem !important; position: absolute; top: 0 } } @media only screen and (min-width: 1024px) { .marquee-medium-component.hide-mobile-image .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-align-img .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-align-img.right-image-top .marquee-medium-header-section, .marquee-medium-component.hide-mobile-image.right-image-top .marquee-medium-header-section { padding-top: 8rem } .marquee-medium-component.top-padding-nav .marquee-medium-header-section { padding-top: 16rem !important } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section { padding: 8rem 0 } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-title { padding-bottom: 2.4rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow { margin-bottom: 1.6rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow span { font-size: 2rem; line-height: 3.4rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle { padding-bottom: 2.8rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p { font-size: 2.4rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p span.super-case, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p sup { font-size: 7.3px; top: .55rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle span.super-case, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle sup { font-size: 7.2px; top: .55rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-content { min-height: 55rem } .marquee-medium-component .marquee-medium-text-cta-section-cta .cta-component:first-of-type { margin-right: 3.2rem } .marquee-medium-component .marquee-medium-full-bleed-img-wrapper .marquee-medium-component-background-video, .marquee-medium-component .marquee-medium-full-bleed-img-wrapper img { width: 115% } .marquee-medium-component.right-align-img.right-image-top .marquee-medium-header-section, .marquee-medium-component.right-col-icon.right-image-top .marquee-medium-header-section { padding-bottom: 8rem; padding-top: 8rem } .marquee-medium-component.header-dropdown-variation .marquee-medium-header-section { padding-bottom: 4rem !important } .marquee-medium-component.header-dropdown-variation .marquee-medium-breadcrumbs { padding-left: 2rem !important } } @media only screen and (min-width: 1280px) { .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-title { padding-bottom: 3.2rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle { padding-bottom: 4.6rem } } @media only screen and (min-width: 1700px) { .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-title { padding-bottom: 3.2rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-eyebrow span { font-size: 2.2rem; line-height: 3.74rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle { padding-bottom: 4.6rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p { font-size: 2.8rem } .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p span.super-case, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle p sup, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle span.super-case, .marquee-medium-component .marquee-medium-component-outter-wrapper .marquee-medium-header-section .marquee-medium-subtitle sup { font-size: 8.4px; top: .69rem } .marquee-medium-component .marquee-medium-text-cta-section-cta .cta-component:first-of-type { margin-right: 4rem } .marquee-medium-component .marquee-medium-full-bleed-img-wrapper .marquee-medium-component-background-video, .marquee-medium-component .marquee-medium-full-bleed-img-wrapper img { width: 100% } .marquee-medium-component.right-align-img .marquee-medium-asset-section .marquee-medium-asset-section-frame { max-width: 34.8%; right: 0 } .marquee-medium-component.right-align-img .marquee-medium-asset-section .marquee-medium-asset-section-frame img { max-width: 55.8rem } } .marquee-medium-breadcrumbs { left: 0; max-width: 70%; padding: 3.2rem 1.8rem .8rem; padding-left: 0 !important; position: relative; right: 0; width: 100%; z-index: 11 } .marquee-medium-breadcrumbs.variation-standalone { max-width: none; position: relative } .marquee-medium-breadcrumbs.variation-standalone ul { margin: 0 auto; max-width: 162rem } .marquee-medium-breadcrumbs.pure-white-text ul:after { background-color: #fff } .marquee-medium-breadcrumbs.pure-white-text ul li a { background-image: linear-gradient(90deg,#fff 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; opacity: .8; overflow: hidden; padding-bottom: 5px; transition: all .25s linear } .marquee-medium-breadcrumbs ul { margin: 0; padding: 0 } .marquee-medium-breadcrumbs ul:after { background-color: #293e40; content: ""; display: block; height: .2rem; margin-top: .2rem; position: absolute; width: 2rem } .marquee-medium-breadcrumbs ul li { display: inline } .marquee-medium-breadcrumbs ul li h6 { display: inline; font-size: 1.4rem } .marquee-medium-breadcrumbs ul li, .marquee-medium-breadcrumbs ul li a { color: #293e40; font-size: 1.4rem } .marquee-medium-breadcrumbs ul li a { opacity: .8; transition: all .25s linear } .marquee-medium-breadcrumbs ul li a:hover { opacity: 1; transition: all .25s linear } .marquee-medium-breadcrumbs ul li + li:before { content: "/"; opacity: .6; padding: 0 .8rem 0 .4rem } @media only screen and (max-width: 767px) { .marquee-medium-breadcrumbs { padding-bottom: 5rem } .marquee-medium-breadcrumbs ul li { display: none } .marquee-medium-breadcrumbs ul li:last-child { display: block } .marquee-medium-breadcrumbs ul li:last-child:before { display: none } .marquee-medium-breadcrumbs ul li:last-child a:after, .marquee-medium-breadcrumbs ul li:last-child:after { content: "/"; opacity: .6; padding: 0 .8rem 0 .4rem } } @media only screen and (min-width: 768px) { .marquee-medium-breadcrumbs { padding: 3.2rem 3rem .8rem } .marquee-medium-breadcrumbs.variation-homepage { padding-top: 7.5rem; top: auto !important } .marquee-medium-breadcrumbs ul li, .marquee-medium-breadcrumbs ul li a { font-size: 1.4rem } .marquee-medium-breadcrumbs ul li + li:before { padding: 0 1.6rem 0 1.2rem } .marquee-medium-breadcrumbs ul:after { width: 2.5rem } } @media only screen and (min-width: 1024px) { .marquee-medium-breadcrumbs { padding: 3.2rem 4rem 1.6rem } .marquee-medium-breadcrumbs.variation-homepage { padding-top: 8.8rem } .marquee-medium-breadcrumbs ul li, .marquee-medium-breadcrumbs ul li a, .marquee-medium-breadcrumbs ul li h6 { font-size: 1.8rem } .marquee-medium-breadcrumbs ul:after { width: 3rem } } @media only screen and (min-width: 1920px) { .marquee-medium-breadcrumbs { padding: 3.2rem 4rem 1.6rem } .marquee-medium-breadcrumbs.variation-homepage { padding-top: 10.4rem } .marquee-medium-breadcrumbs ul li, .marquee-medium-breadcrumbs ul li a, .marquee-medium-breadcrumbs ul li h6 { font-size: 2rem } } .breadcrumbs + .marquee .hero-marquee-component .hero-marquee-header-inner-section { padding: 5.6rem 0 0 } .breadcrumbs + .marquee .hero-marquee-component .hero-marquee-header-inner-section .component-icon-block { margin-top: -.5rem } .link-list-component { position: relative } .link-list-component .link-list-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .link-list-component .link-list-component-inner-wrapper { padding-bottom: 6rem; padding-top: 6rem; position: relative } .link-list-component .link-list-component-inner-wrapper .link-list-section-title h2 { margin-bottom: 3.2rem; margin-top: 0 } .link-list-component .link-list-content .link-list-block-title { padding: 1.75rem 0; transition: top .25s } .link-list-component .link-list-content .link-list-block-title:after { border-bottom: .2rem solid #293e40; border-right: .2rem solid #293e40; content: ""; display: inline-block; height: 1rem; margin-left: .5rem; opacity: .6; position: absolute; right: 1.5rem; top: 2rem; transform: rotate(45deg); transform-origin: center center; transition: transform .25s; width: 1rem } .link-list-component .link-list-content .link-list-block.col-visible .link-list-block-title:after { opacity: 1; right: 1.5rem; top: 2.5rem; transform: rotate(225deg) } .link-list-component .link-list-content .link-list-block.col-visible .link-list-block-title.link-list-sticky-active:after { right: 2.5rem; top: 2.5rem; transform: rotate(225deg) } .link-list-component .link-list-content .link-list-block-link-content { background-color: #f7f7f7; display: none } .link-list-component .link-list-content .link-list-block-link-content ul { margin: 0; padding: 0; position: relative } .link-list-component .link-list-content .link-list-block-link-content ul li { outline: 0; padding: 1.6rem 0; position: relative } .link-list-component .link-list-content .link-list-block-link-content ul li a { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline; outline: 0; overflow: hidden; padding-bottom: .5rem; transition: all .25s linear } .link-list-component .link-list-content .link-list-block-link-content ul li a:hover { background-position: 0 100%; transition: all .25s linear } .link-list-component .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 3.2rem } .link-list-component .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 3.2rem } .link-list-component .link-list-content .link-list-block-link-content ul .comp-full-bleed-bg-color { bottom: 0; display: block; left: -100%; position: absolute; top: 0; width: 400%; z-index: 0 } .link-list-component .link-list-content .link-list-block { padding-left: 1rem; position: relative; width: 100% } .link-list-component .link-list-content .linkList { width: 100% } .link-list-component .link-list-content .link-list-sticky-active { background-color: #fff; margin-left: -2rem; padding-left: 2rem; position: fixed; top: 0; width: 100%; z-index: 1 } .link-list-component .link-list-content .stay-bottom { position: absolute } .link-list-component.col-pure-white-version .link-list-block-title:after { border-color: #293e40 !important } .link-list-component.col-pure-white-version .link-list-block-title.link-list-sticky-active { background-color: #fff } .link-list-component.col-pure-white-version .link-list-block-link-content { background-color: transparent } .link-list-component.col-pure-white-version .link-list-block-link-content ul:before { background-color: #f7f7f7 } .link-list-component.col-pure-white-version.ls-static-stack .link-list-block-link-content, .link-list-component.col-pure-white-version.ls-static-stack .link-list-block-link-content ul:before { background-color: #fff } .link-list-component.col-cloud-version .link-list-block-title:after { border-color: #293e40 !important } .link-list-component.col-cloud-version .link-list-block-title.link-list-sticky-active { background-color: #f7f7f7 } .link-list-component.col-cloud-version .link-list-block-link-content { background-color: transparent } .link-list-component.col-cloud-version .link-list-block-link-content ul:before { background-color: #fff } .link-list-component.col-cloud-version.ls-static-stack .link-list-block-link-content, .link-list-component.col-cloud-version.ls-static-stack .link-list-block-link-content ul:before { background-color: #f7f7f7 } .link-list-component.col-heavy-color-version .link-list-block-title:after { border-color: #fff !important } .link-list-component.col-heavy-color-version .link-list-block-title.link-list-sticky-active { background-color: #293e40 } .link-list-component.col-heavy-color-version .link-list-block-link-content { background-color: transparent } .link-list-component.col-heavy-color-version .link-list-block-link-content ul:before { background-color: #fff; opacity: .1 } .link-list-component.col-heavy-color-version.ls-static-stack .link-list-block-link-content ul:before { display: none } .link-list-component .link-list-block-title { align-items: center; display: flex } .link-list-component .link-list-block-title .link-list-block-icon { height: auto; line-height: 0; margin-right: .8rem; width: 2.7rem } .link-list-component .link-list-block-title .link-list-block-icon img { line-height: 0; width: 100% } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li { padding: .8rem 0 } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 3.2rem } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 3.2rem } .link-list-component.ls-static-stack .link-list-content .link-list-block-link-content { display: block } .link-list-component.ls-static-stack .link-list-component .link-list-content .link-list-block-title:after, .link-list-component.ls-static-stack .link-list-content .link-list-block-title:after { display: none } .link-list-component.ls-static-stack .link-list-content .link-list-block-title { padding: 0 } .link-list-component.ls-static-stack .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 1.6rem } .link-list-component.medium-body-font .link-list-block-link-content ul li a { font-size: 1.4rem; line-height: 2.38rem } .title-component + .link-list-component.ls-static-stack .link-list-component-inner-wrapper { padding-top: 3.2rem } @media only screen and (min-width: 768px) { .title-component + .link-list-component.ls-static-stack .link-list-component-inner-wrapper { padding-top: 4.8rem } } @media only screen and (min-width: 1024px) { .title-component + .link-list-component.ls-static-stack .link-list-component-inner-wrapper { padding-top: 5.6rem } } @media only screen and (min-width: 768px) { .link-list-component .link-list-component-inner-wrapper { padding-bottom: .2rem } .link-list-component .link-list-component-inner-wrapper .link-list-section-title h2 { margin-bottom: 4.8rem; padding-left: 1.5rem } .link-list-component .link-list-content .link-list-block-title { bottom: none !important; padding: 0 } .link-list-component .link-list-content .link-list-block-title:after { display: none } .link-list-component .link-list-content .link-list-block-link-content { background-color: transparent; display: block !important } .link-list-component .link-list-content .link-list-block-link-content ul { width: 85% } .link-list-component .link-list-content .link-list-block-link-content ul:before { display: none } .link-list-component .link-list-content .link-list-block-link-content ul li { padding: .8rem 0 } .link-list-component .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 1.6rem } .link-list-component .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 1.6rem } .link-list-component .link-list-content .link-list-block-link-content ul .comp-full-bleed-bg-color { display: none } .link-list-component .link-list-content .link-list-block { padding-bottom: 5.6rem; padding-left: 1.5rem; width: 100% } .link-list-component .link-list-content .linkList { width: 50% } .link-list-component .link-list-block-title .link-list-block-icon { width: 4.5rem } .link-list-component.a-z-four-col .link-list-block { padding-bottom: 5.6rem } .link-list-component.a-z-two-col .link-list-component-inner-wrapper { padding-bottom: 2.2rem } .link-list-component.a-z-two-col .link-list-block { padding-bottom: 4rem } .link-list-component.a-z-two-col .linkList { width: 50% !important } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 2.4rem } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 0 } .link-list-component.medium-body-font .link-list-block-link-content ul li a { font-size: 1.6rem; line-height: 2.72rem } } @media only screen and (min-width: 1024px) { .link-list-component .link-list-component-inner-wrapper { padding-bottom: 3.2rem; padding-top: 8rem } .link-list-component .link-list-component-inner-wrapper .link-list-section-title h2 { margin-bottom: 5.6rem; padding-left: 2rem } .link-list-component .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 3.2rem } .link-list-component .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 1.6rem } .link-list-component .link-list-content .link-list-block { padding-left: 2rem } .link-list-component .link-list-content .linkList { width: 33.33333% } .link-list-component.a-z-four-col .link-list-block:last-child, .link-list-component.a-z-four-col .link-list-block:nth-last-child(2) { padding-top: 0 } .link-list-component.a-z-four-col .linkList { width: 25% } .link-list-component.a-z-two-col .link-list-component-inner-wrapper { padding-bottom: 4.2rem } .link-list-component.a-z-two-col .link-list-block { padding-bottom: 4.8rem } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li { padding: 1.2rem 0 } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:first-child { padding-top: 3.2rem } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 0 } .link-list-component.medium-body-font .link-list-block-link-content ul li a { font-size: 1.8rem; line-height: 3.06rem } .link-list-component .link-list-block-title .link-list-block-icon { margin-right: 1.6rem } } @media only screen and (min-width: 1700px) { .link-list-component.a-z-two-col .link-list-block:first-child, .link-list-component.a-z-two-col .link-list-block:nth-child(2) { padding-bottom: 5.4rem } .link-list-component.a-z-two-col .link-list-content .link-list-block-link-content ul li:last-child { padding-bottom: 0 } .link-list-component.medium-body-font .link-list-block-link-content ul li a { font-size: 1.8rem; line-height: 3.06rem } } .linkListContainer.cq-Editable-dom .link-list-component .linkList .linkList.cq-Editable-dom { width: 100% } .linkListContainer.cq-Editable-dom .link-list-component .link-list-content.flex-box-container > div { display: flex; flex-wrap: inherit } .linkListContainer.cq-Editable-dom .link-list-component .link-list-content.flex-box-container .newpar.new.section.cq-Editable-dom { width: 100% } .in-page-navigation-component { position: relative; z-index: 899 } .in-page-navigation-component .in-page-navigation-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .in-page-navigation-component .in-page-navigation-component-outter-wrapper { height: 4.8rem } .in-page-navigation-component .in-page-navigation-component-inner-wrapper { height: 100%; overflow: hidden; position: relative; z-index: 2 } .in-page-navigation-component .in-page-navigation-content { height: 100%; padding: 0 1rem } .in-page-navigation-component .in-page-navigation-page-title { cursor: pointer; display: none } .in-page-navigation-component .in-page-navigation-page-title h5 { font-family: GilroyBold !important } .in-page-navigation-component .in-page-navigation-tab-row-outerwrapper { margin-bottom: -1.6rem; overflow: hidden; position: relative; transition: all 2s } .in-page-navigation-component .in-page-navigation-tab-row-outerwrapper .in-page-navigation-tab-row-innerwrapper { height: calc(100% + 2rem); overflow-x: scroll; overflow-y: hidden; top: 0; transform: none; white-space: nowrap } .in-page-navigation-component .in-page-navigation-tab-row-outerwrapper.gradient-layer:after { content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; width: 4.8rem; z-index: 1 } .in-page-navigation-component .in-page-navigation-tab-row-outerwrapper.gradient-layer-front:before { content: ""; display: block; height: 100%; left: 0; position: absolute; top: 0; width: 4.8rem; z-index: 1 } .in-page-navigation-component .in-page-navigation-tab-row-innerwrapper { position: relative; top: 50%; transform: translateY(-50%) } .in-page-navigation-component .in-page-navigation-cta { background-color: #293e40; bottom: 0; height: 4.8rem; left: 0; opacity: 0; position: fixed; width: 100%; z-index: -1 } .in-page-navigation-component .in-page-navigation-cta:hover { opacity: .8 !important } .in-page-navigation-component .in-page-navigation-cta a { align-items: center; border: 0; color: #fff; cursor: pointer; display: flex; display: -moz-flex; display: -ms-flex; display: -o-flex; font-family: GilroySemiBold; font-size: 1.8rem; height: 100%; justify-content: center; margin: 0; padding: 0 4rem; text-align: center } .in-page-navigation-component.in-page-sticky .in-page-navigation-tab-row-outerwrapper { transition: all 1ms } .in-page-navigation-component.in-page-sticky .in-page-navigation-component-outter-wrapper { -ms-box-shadow: 0 0 1.5rem .5rem rgba(41,62,64,.2); -o-box-shadow: 0 0 1.5rem .5rem rgba(41,62,64,.2); box-shadow: 0 0 1.5rem .5rem rgba(41,62,64,.2); opacity: 1; position: fixed; top: 0; width: 100%; z-index: 1 } .in-page-navigation-component .active-nav-tab a { opacity: 1 } .in-page-navigation-component ul { margin: 0; padding: 0; position: relative } .in-page-navigation-component ul li { cursor: pointer; display: inline-block; padding: 0 1.2rem } .in-page-navigation-component ul li a { display: block; opacity: .6; padding-bottom: 1.3rem; padding-top: 1.3rem; transition: all .25s ease } .in-page-navigation-component ul li:first-child { padding-left: 0 } .in-page-navigation-component ul li:hover a { opacity: 1 } .in-page-navigation-component .active-tab-indicator { background-color: #81b5a1; height: .5rem; position: absolute; top: 4.4rem; transition: all .22s ease-out; will-change: left,right } .in-page-navigation-component .in-page-navigation-search { background-color: #fff; border-bottom: .1rem solid rgba(41,62,64,.2); border-top: .1rem solid rgba(41,62,64,.2); display: flex; height: 4.8rem; justify-content: center; line-height: 4.8rem; z-index: 1 } .in-page-navigation-component .in-page-navigation-search form { position: relative } .in-page-navigation-component .in-page-navigation-search form input { border: none; font-size: 1.6rem; outline: none; width: 11rem } .in-page-navigation-component .in-page-navigation-search .search-clear { right: 0 } .in-page-navigation-component .in-page-navigation-search .search-clear:after, .in-page-navigation-component .in-page-navigation-search .search-clear:before { background-color: #293e40 } .in-page-navigation-component .in-page-navigation-search .search-click { align-items: center; display: flex } .in-page-navigation-component .in-page-navigation-search .search-click:after { content: url(https://www.servicenow.com/content/dam/servicenow-assets/images/meganav/search-icon.svg); display: block; height: 3rem; overflow: hidden } .in-page-navigation-component .in-page-navigation-search-panel .component-dotcom-search-in-page { top: 9.6rem !important } .in-page-navigation-component .in-page-navigation-search-panel .component-dotcom-search-in-page .drop-panelx-in-page { height: auto; max-height: calc(100vh - 9.6rem); overflow-y: auto } .in-page-navigation-component .comp-full-bleed-bg-color { background-color: #fff; z-index: 1 } .in-page-navigation-component .in-page-navigation-page-title h6, .in-page-navigation-component .in-page-navigation-tab-item a { color: #293e40 } .in-page-navigation-component .in-page-navigation-cta, .in-page-navigation-component .in-page-navigation-cta a { background-color: #293e40; color: #fff } .in-page-navigation-component .in-page-navigation-component-inner-wrapper .gradient-layer-front:before { background: -webkit-linear-gradient(270deg,hsla(0,0%,100%,0) 40%,#fff) !important; background-image: -webkit-linear-gradient(left,hsla(0,0%,100%,.001) 4%,#fff 5%,#fff) !important; background: -moz-linear-gradient(to left,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background-image: -moz-linear-gradient(to left,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background: -o-linear-gradient(to left,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background-image: -o-linear-gradient(to left,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background: -ms-linear-gradient(to left,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background-image: -ms-linear-gradient(to left,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background: linear-gradient(270deg,hsla(0,0%,100%,0) 40%,#fff) !important; background-image: linear-gradient(270deg,hsla(0,0%,100%,0) 40%,#fff) !important; pointer-events: none } .in-page-navigation-component .in-page-navigation-component-inner-wrapper .gradient-layer:after { background: -webkit-linear-gradient(90deg,hsla(0,0%,100%,0) 40%,#fff) !important; background-image: -webkit-linear-gradient(left,hsla(0,0%,100%,.001) 4%,#fff 5%,#fff) !important; background: -moz-linear-gradient(to right,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background-image: -moz-linear-gradient(to right,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background: -o-linear-gradient(to right,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background-image: -o-linear-gradient(to right,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background: -ms-linear-gradient(to right,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background-image: -ms-linear-gradient(to right,hsla(0,0%,100%,0) 40%,#fff 100%) !important; background: linear-gradient(90deg,hsla(0,0%,100%,0) 40%,#fff) !important; background-image: linear-gradient(90deg,hsla(0,0%,100%,0) 40%,#fff) !important; pointer-events: none } .in-page-navigation-component.variation-csc-hub .active-tab-indicator { display: none !important } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper { height: 6rem } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li { padding: 0 2rem 0 0 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li.active-nav-tab a { border-bottom: .4rem solid #293e40; font-family: GilroyBold } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li.active-nav-tab a:hover { opacity: 1 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li:hover a { color: #314749; opacity: 1 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li a { color: #314749; font-family: GilroyRegular; font-size: 1.4rem; opacity: 1; padding-bottom: 1.5rem; padding-top: 2rem } @media only screen and (min-width: 768px) { .in-page-navigation-component .in-page-navigation-cta { height: 100%; left: auto; opacity: 1; position: absolute; right: 0; width: auto; z-index: 0 } .in-page-navigation-component .comp-full-bleed-bg-color { z-index: -1 } .in-page-navigation-component .in-page-navigation-component-outter-wrapper { height: 6.4rem } .in-page-navigation-component .in-page-navigation-component-outter-wrapper .in-page-navigation-component-inner-wrapper { z-index: 0 } .in-page-navigation-component .in-page-navigation-content { padding: 0 1.5rem } .in-page-navigation-component .in-page-navigation-search { border: .1rem solid rgba(41,62,64,.2); height: 100%; left: auto; line-height: 6.4rem; opacity: 1; padding: 0 4rem; position: absolute; right: 0; top: 0; width: auto } .in-page-navigation-component .in-page-navigation-search .search-click:after { height: 5rem } .in-page-navigation-component .in-page-navigation-search-panel .component-dotcom-search-in-page { top: 6.4rem !important } .in-page-navigation-component .in-page-navigation-search-panel .component-dotcom-search-in-page .drop-panelx-in-page { max-height: calc(100vh - 64px) } .in-page-navigation-component ul li.active-nav-tab a { border-bottom: .5rem solid #293e40 } .in-page-navigation-component ul li a { padding-bottom: 2.1rem; padding-top: 2.1rem } .in-page-navigation-component .active-tab-indicator { top: 6rem } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li { padding: 0 4rem 0 0 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li a { font-size: 1.6rem; padding-bottom: .9rem } } @media only screen and (min-width: 1024px) { .in-page-navigation-component .in-page-navigation-component-outter-wrapper { height: 7.2rem } .in-page-navigation-component .in-page-navigation-page-title { -moz-align-items: center; -o-align-items: center; align-items: center; display: block; display: flex; margin-right: 0; max-width: 0; opacity: 0; overflow: hidden; transition: margin-right .5s ease-out,max-width .5s ease-out,opacity 1s; white-space: nowrap } .in-page-navigation-component .in-page-navigation-content { padding: 0 2rem } .in-page-navigation-component .in-page-navigation-search { line-height: 7.2rem } .in-page-navigation-component .in-page-navigation-search .search-click:after { height: 5.4rem } .in-page-navigation-component .in-page-navigation-search-panel .component-dotcom-search-in-page { top: 7.2rem !important } .in-page-navigation-component .in-page-navigation-search-panel .component-dotcom-search-in-page .drop-panelx-in-page { max-height: calc(100vh - 7.2rem) } .in-page-navigation-component ul li { padding: 0 1.6rem } .in-page-navigation-component ul li a { padding-bottom: 2.3rem; padding-top: 2.3rem } .in-page-navigation-component .active-tab-indicator { top: 6.8rem } .in-page-navigation-component.in-page-sticky .in-page-navigation-page-title { margin-right: 7.2rem; max-width: 100%; opacity: 1; transition: all 1s } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper { height: 10.8rem } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li { padding: 0 6rem 0 0 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li.active-nav-tab a { border-bottom: .2rem solid #293e40 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li:not(.active-nav-tab) a:hover { text-shadow: 1px 0 .1px } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li a { padding-bottom: 3.9rem; padding-top: 4rem } } @media only screen and (min-width: 1700px) { .in-page-navigation-component .in-page-navigation-search { padding: 0 6rem } .in-page-navigation-component ul li { font-family: GilroySemibold; font-size: 1.8rem; padding: 0 2.4rem } .in-page-navigation-component ul li a { font-family: GilroySemibold; font-size: 1.8rem; padding-bottom: 2.3rem; padding-top: 2.3rem } .in-page-navigation-component .in-page-navigation-cta, .in-page-navigation-component .in-page-navigation-cta a { font-family: GilroySemibold; font-size: 2.4rem } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li { padding: 0 7.6rem 0 0 } .in-page-navigation-component.variation-csc-hub .in-page-navigation-component-outter-wrapper ul li a { font-size: 2rem; padding-bottom: 3.6rem } } .component-dotcom-search-in-page { display: none; max-width: 50vw; position: absolute; right: 0; top: 0; width: 100% } .component-dotcom-search-in-page .search-panel-in-page { background: #293e40; color: #fff; display: block !important; padding: 0; text-align: left; top: -.2rem } .component-dotcom-search-in-page .search-panel-in-page .search-click { color: #fff; cursor: pointer; display: inline-block; font-size: 1.8rem; line-height: 2.6rem; position: absolute; right: 5rem; top: 3rem; z-index: 999 } .component-dotcom-search-in-page .search-panel-in-page .search-click:hover { color: #81b5a1 } .component-dotcom-search-in-page .search-panel-in-page form { margin: .2rem; padding-left: 0; width: 80% } .component-dotcom-search-in-page .search-panel-in-page form input { background: #293e40; border: none; color: #fff; font-size: 2.2rem; height: 8rem; line-height: 2.5rem; margin: 0 auto; width: 100% !important } .component-dotcom-search-in-page .search-panel-in-page form input:focus { color: #fff; outline: none } .component-dotcom-search-in-page .drop-panelx-in-page { background: #fff; display: none; font: Gilroy Semibold; font-size: 1.4rem; margin-bottom: 1rem; padding: 3rem; position: relative; width: auto; z-index: 999 } .component-dotcom-search-in-page .drop-panelx-in-page li { color: #666; cursor: pointer; display: block; line-height: 3rem; list-style: none; text-align: left !important } .component-dotcom-search-in-page .drop-panelx-in-page li:hover { color: #258dfc } .component-dotcom-search-in-page .drop-panelx-in-page div { line-height: 2rem } .component-dotcom-search-in-page .drop-panelx-in-page .view-all { margin-top: 3rem } .component-dotcom-search-in-page .drop-panelx-in-page .view-all a { color: #258dfc } .component-dotcom-search-in-page .direct-keywords { background: transparent; color: inherit; height: 100%; padding: 5.6rem 0 10rem 10%; position: absolute; text-align: center; top: 8rem } .component-dotcom-search-in-page .direct-keywords div.byline { color: inherit; font-size: 2.4rem; text-align: left } .component-dotcom-search-in-page .direct-keywords div.keywords { align-items: center; display: -ms-flex; display: flex; flex-flow: row wrap; justify-content: flex-start; padding: 4rem 0 } .component-dotcom-search-in-page .direct-keywords div.keywords span { background: #fff; border: .1rem solid #ccc; border-radius: 10rem; cursor: pointer; font-size: 1.8rem; margin: 1.5rem 1.5rem 1.5rem 0; padding: 1.25rem 3.2rem } .component-dotcom-search-in-page .direct-keywords div.keywords span:hover { background: transparent; border: .1rem solid #000 } @media screen and (min-width: 320px)and (max-width:767px) { .component-dotcom-search-in-page { max-width: 100vw; width: 100% } } .component-breadcrumbs { left: 0; padding: 2.5rem 1.8rem .4rem; position: absolute; right: 0; z-index: 11 } .component-breadcrumbs.variation-standalone { max-width: none; padding: 1.9rem 2rem; position: relative } .component-breadcrumbs.variation-standalone ul { margin: 0 auto; max-width: 162rem } .component-breadcrumbs.pure-white-text ul:after { background-color: #fff } .component-breadcrumbs.pure-white-text ul li a { background-image: linear-gradient(90deg,#fff 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline; opacity: .8; overflow: hidden; padding-bottom: .5rem; transition: all .25s linear } .component-breadcrumbs.pure-white-text ul li a:after { background-color: #fff } .component-breadcrumbs ul { margin: 0; padding: 0 } .component-breadcrumbs ul li { display: none } .component-breadcrumbs ul li h6 { display: inline; font-family: GilroySemibold; font-size: 1.4rem } .component-breadcrumbs ul li, .component-breadcrumbs ul li a { color: var(--brand-black,var(--gable-green)); font-size: 1.4rem } .component-breadcrumbs ul li a { opacity: var(--brand-opacity,.8); position: relative; transition: all .25s linear } .component-breadcrumbs ul li a:after { background-color: var(--brand-black,var(--gable-green)); content: ""; display: block; height: .2rem; left: 0; margin-top: .4rem; position: absolute; transition: width .25s linear; width: 0 } .component-breadcrumbs ul li a:hover { opacity: 1; transition: all .25s linear } .component-breadcrumbs ul li:after { content: "/"; font-family: GilroySemibold; opacity: .4; padding: 0 1.6rem } @media only screen and (max-width: 767px) { .component-breadcrumbs ul li { display: none } .component-breadcrumbs ul li a:hover { opacity: .8 !important } .component-breadcrumbs ul li:last-child { display: block } .component-breadcrumbs ul li:last-child:before { display: none } } @media only screen and (min-width: 768px) { .component-breadcrumbs, .component-breadcrumbs.variation-standalone { padding: 1.9rem 2rem } .component-breadcrumbs.variation-homepage { padding-top: 7.8rem; top: auto !important } .component-breadcrumbs ul li { display: inline } .component-breadcrumbs ul li, .component-breadcrumbs ul li a { font-size: 1.4rem } .component-breadcrumbs ul li a:after { margin-top: .6rem } .component-breadcrumbs ul li a:hover:after { width: 2.2rem } .component-breadcrumbs ul li + li:before { padding: 0 1.6rem 0 1.2rem } } @media only screen and (min-width: 1024px) { .component-breadcrumbs, .component-breadcrumbs.variation-standalone { padding: 2.88rem 4rem } .component-breadcrumbs.variation-homepage { padding-top: 8.8rem } .component-breadcrumbs ul li, .component-breadcrumbs ul li a, .component-breadcrumbs ul li h6 { font-size: 1.8rem } .component-breadcrumbs ul li a:hover:after { width: 2.9rem } } @media only screen and (min-width: 1700px) { .component-breadcrumbs, .component-breadcrumbs.variation-standalone { padding: 2.8rem 4rem } .component-breadcrumbs.variation-homepage { padding-top: 10.4rem } .component-breadcrumbs ul li, .component-breadcrumbs ul li a, .component-breadcrumbs ul li h6 { font-size: 2rem } .component-breadcrumbs ul li a:after { margin-top: .8rem } .component-breadcrumbs ul li a:hover:after { width: 3.2rem } } @media only screen and (min-width: 1920px) { .component-breadcrumbs { padding: 2.4rem 4rem } .component-breadcrumbs.variation-homepage { padding-top: 10.4rem } .component-breadcrumbs ul li, .component-breadcrumbs ul li a, .component-breadcrumbs ul li h6 { font-size: 2rem } } .breadcrumbs + .marquee .hero-marquee-component .hero-marquee-header-inner-section, .component-breadcrumbs + .hero-marquee-component .hero-marquee-header-inner-section { padding: 4.8rem 0 0 } .breadcrumbs + .marquee .hero-marquee-component .hero-marquee-header-inner-section .component-icon-block, .component-breadcrumbs + .hero-marquee-component .hero-marquee-header-inner-section .component-icon-block { margin-top: -.5rem } .is-demonow-page .title .title-component .title-component-outer-wrapper { margin: 0 auto; max-width: 880px } .is-demonow-page .title .title-component .title-component-outer-wrapper .title-component-inner-wrapper { padding: 0 4rem } .is-demonow-page .title .title-component .title-component-outer-wrapper .title-component-inner-wrapper .title-container .title-left-col h2 { font-size: 2rem; line-height: 3.4rem; margin-bottom: .8rem } .title-component.text-alignment-center .title-component-outer-wrapper .title-component-inner-wrapper .title-container { justify-content: center } .title-component.text-alignment-center .title-component-outer-wrapper .title-component-inner-wrapper .title-container .title-left-col { align-items: center } .title-component.text-alignment-center .title-component-outer-wrapper .title-component-inner-wrapper .title-container .title-left-col p.subtext { text-align: center } .title-component .title-component-outer-wrapper { height: auto; overflow: hidden; position: relative } .title-component .title-component-outer-wrapper .title-full-bleed-background { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .title-component .title-component-inner-wrapper .title-container { position: relative } .title-component .title-component-inner-wrapper .title-container .title-left-col { align-items: center; display: flex; flex-direction: row; position: relative } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon { align-items: flex-start; flex-direction: column } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon img { display: none } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon p.subtext { font-size: 2rem; line-height: 3.4rem; padding: 0; text-align: left } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon + .title-right-col { align-items: flex-end } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon + .title-right-col :nth-child(2) { padding-bottom: 1.2rem } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-text h2 { display: none } .title-component .title-component-inner-wrapper .title-container .title-right-col { align-items: center; display: flex; position: relative } .title-component .title-component-inner-wrapper .title-container .title-right-col.no-cta { display: none } .title-component .title-component-inner-wrapper .title-container .align-bottom { align-self: flex-end !important; margin-bottom: -2rem } .title-component .title-component-inner-wrapper .rule { border-bottom: .3rem solid #293e40; margin: 0 auto; opacity: .1; position: relative; width: 97.4% } .title-component .title-component-inner-wrapper .rule.no-rule { display: none; margin-top: 0 !important } .title-component .title-component-inner-wrapper .rule.only { margin-bottom: 0; margin-top: 0 !important } .title-component .title-component-inner-wrapper.title—-padding-top-large-responsive { padding-top: 4rem } .title-component .title-component-inner-wrapper.title—-padding-top-medium-responsive { padding-top: 2.4rem } .title-component .title-component-inner-wrapper.title--padding-bottom-large-responsive { padding-bottom: 4rem } .title-component .title-component-inner-wrapper.title--padding-bottom-medium-responsive { padding-bottom: 2.4rem } @media only screen and (min-width: 320px) { .title-component .title-component-inner-wrapper { padding: 6rem 1.5rem } .title-component .title-component-inner-wrapper .title-container { margin: 0 auto } .title-component .title-component-inner-wrapper .title-container .title-left-col h1, .title-component .title-component-inner-wrapper .title-container .title-left-col h2 { margin: 0 } .title-component .title-component-inner-wrapper .title-container .title-left-col h1 { padding: 0 } .title-component .title-component-inner-wrapper .title-container .title-left-col img { height: 6rem; margin-right: 1.6rem; width: 6rem } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon + .title-right-col { margin-top: -1.6rem } .title-component .title-component-inner-wrapper .rule { margin-top: 1.6rem } .title-component .title-component-inner-wrapper.padding-bottom-option { padding-bottom: 3.2rem } .title-component .title-component-inner-wrapper.padding-bottom-option p.subtext { margin-bottom: 2.4rem; margin-top: 0 } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule { padding-bottom: 3rem } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule p.subtext { margin-bottom: 2.4rem; margin-top: 0 } } @media only screen and (min-width: 768px) { .title-component .title-component-inner-wrapper .title-container { flex-direction: row } .title-component .title-component-inner-wrapper .title-container .title-left-col { padding: 0 1rem } .title-component .title-component-inner-wrapper .title-container .title-left-col img { height: 6rem; margin-right: 2.4rem; width: 6rem } .title-component .title-component-inner-wrapper .title-container .title-left-col .rule.no-rule { display: none } .title-component .title-component-inner-wrapper .title-container .title-right-col { justify-content: flex-end } .title-component .title-component-inner-wrapper .rule { margin-top: 2.4rem } .title-component .title-component-inner-wrapper.padding-bottom-option { padding-bottom: 4rem } .title-component .title-component-inner-wrapper.padding-bottom-option p.subtext { margin-bottom: 0; margin-top: 0 } .title-component .title-component-inner-wrapper.padding-bottom-option .title-right-col { padding: 1.5rem 0 0 } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule { padding-bottom: 2rem } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule p.subtext { margin-top: 0 } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule .title-right-col { padding: 1.5rem 0 } } @media only screen and (min-width: 1024px) { .title-component .title-component-inner-wrapper { align-items: center; padding: 8rem 1.8rem } .title-component .title-component-inner-wrapper.title—-padding-top-large-responsive { padding-top: 8rem } .title-component .title-component-inner-wrapper.title—-padding-top-medium-responsive { padding-top: 5.6rem } .title-component .title-component-inner-wrapper.title--padding-bottom-large-responsive { padding-bottom: 8rem } .title-component .title-component-inner-wrapper.title--padding-bottom-medium-responsive { padding-bottom: 5.6rem } .title-component .title-component-inner-wrapper .title-container .title-left-col { padding: 0 2rem } .title-component .title-component-inner-wrapper .title-container .title-left-col img { height: 6rem; margin-right: 3.2rem; width: 6rem } .title-component .title-component-inner-wrapper .title-container .rule { margin-top: 2.4rem } .title-component .title-component-inner-wrapper.padding-bottom-option { padding-bottom: 4.8rem } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule { padding-bottom: 1.2rem } } @media only screen and (min-width: 1700px) { .title-component .title-component-inner-wrapper .title-container .title-left-col img { height: 8rem; margin-right: 4rem; width: 8rem } .title-component .title-component-inner-wrapper.padding-bottom-option { padding-bottom: 5.6rem } .title-component .title-component-inner-wrapper.padding-bottom-option-no-rule { padding-bottom: 3.2rem } } .title-component .title-component-inner-wrapper.padding-zero-top { padding-top: 0 } .title-component .title-component-inner-wrapper.padding-zero-bot { padding-bottom: 0 } @media only screen and (min-width: 320px)and (max-width:767px) { .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon + .title-right-col { display: flex; flex-direction: column; justify-content: flex-start; margin-top: 0 } .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon + .title-right-col .cta-rectangle-box, .title-component .title-component-inner-wrapper .title-container .title-left-col.no-icon + .title-right-col .cta-text-arrow { align-self: flex-start } } @media only screen and (max-width: 1024px) { .is-demonow-page .title .title-component .title-component-outer-wrapper .title-component-inner-wrapper { padding-left: 4rem } } @media only screen and (max-width: 768px) { .is-demonow-page .title .title-component .title-component-outer-wrapper .title-component-inner-wrapper .title-left-col p { margin-bottom: 1.6rem } } .tabs-to-carousel { transition: all .66s ease-in-out } .tabs-to-carousel .site-width-1700 { padding: 0 } .tabs-to-carousel .tab-module { display: none } @media only screen and (min-width: 768px) { .tabs-to-carousel .tab-module { display: flex !important } } .tabs-to-carousel .tab-nav-wrap h2 { margin-bottom: 5.6rem; margin-top: 10.4rem; width: 85% } @media only screen and (min-width: 768px)and (max-width:1023px) { .tabs-to-carousel .tab-nav-wrap h2 { margin-bottom: 2.4rem; margin-top: 8rem; width: 95% } } .tabs-to-carousel .inner-nav-wrap { flex-direction: column } .tabs-to-carousel nav { display: flex; padding-bottom: 6.4rem } .tabs-to-carousel nav a { align-items: center; border-left: 5px solid #293e40; display: flex; flex: 1; margin-bottom: 24px; min-height: 50px; opacity: .4; padding: .5rem .5rem .5rem 35px; transition: all .25s ease-out; width: 100% } .tabs-to-carousel nav a h5 { font-family: GilroySemiBold; transition: all .25s ease-out } .tabs-to-carousel nav a:hover { border-color: rgba(41,62,64,.6); opacity: 1 } .tabs-to-carousel nav a:active { outline: 0 } .tabs-to-carousel nav a.selected { border-color: #81b5a1; opacity: 1 } .tabs-to-carousel nav a.selected:focus { outline: 0 } @media only screen and (min-width: 768px)and (max-width:1023px) { .tabs-to-carousel nav a { border-left: 3px solid #293e40; margin-bottom: 12px; min-height: 36px; padding: .5rem .5rem .5rem 20px } } .tabs-to-carousel .tab-content-wrap { padding: 0 0 0 2rem } .tabs-to-carousel .tab-content-wrap .tabbed-container { height: 0; overflow: hidden; padding: 0 0 0 2rem; position: relative } .tabs-to-carousel .tab-content-wrap .tabbed-container .ani-delay { opacity: 0 } .tabs-to-carousel .tab-content-wrap .tabbed-container.tabbed-container-active { animation: fadeIn 1.5s; display: block; height: 100%; position: relative; z-index: 2 } .tabs-to-carousel .tab-content-wrap .tabbed-container.tabbed-container-active .ani-delay { animation: fadeIn2 1.5s; opacity: 1 } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content { display: flex; flex-direction: column; height: 100%; justify-content: start; padding: 8rem 0 4rem } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .animation-section-container, .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content img, .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content video { align-self: start; padding: 2rem 0; width: 80% } @media only screen and (min-width: 768px)and (max-width:1023px) { .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .animation-section-container, .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content img, .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content video { width: 98% } } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content p { width: 80% } @media only screen and (min-width: 768px)and (max-width:1023px) { .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content p { width: 98% } } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content.align-mid { justify-content: center } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .full-image { background-repeat: no-repeat; width: 100% } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .full-image.align-top { background-position: 0 0; flex: 1 1 0; margin-bottom: -4rem; margin-top: 4.5rem } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .full-image.align-bottom { align-self: baseline; background-position: 0 100%; flex: 1 1 0; margin-bottom: 4.5rem; margin-top: -8rem } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .tab-img-wrap { background-position: right 9rem; background-repeat: no-repeat; background-size: 30%; padding-right: 8rem } .tabs-to-carousel .tab-content-wrap .tabbed-container .tab-content .tab-img-wrap img { margin: 0 auto } .tabs-to-carousel .video-target { height: auto; width: auto } .tabs-to-carousel .video-target video { height: auto; position: relative; width: 80% } @media only screen and (max-width: 767px) { .tabs-to-carousel { background-color: #fff } } @keyframes fadeIn2 { 0% { opacity: 0 } 20% { opacity: 0 } to { opacity: 1 } } .carousel-wrap { padding-bottom: 4rem } .carousel-wrap h1, .carousel-wrap h2, .carousel-wrap h3, .carousel-wrap h4, .carousel-wrap h5, .carousel-wrap h6 { font-family: GilroySemiBold; width: 85% } .carousel-wrap h4 { font-size: 2.2rem; padding: 3.5rem 1rem 1rem 5rem } .carousel-wrap .owl-carousel .owl-stage { display: flex } .carousel-wrap .owl-carousel .owl-stage .owl-item { display: flex; flex: 1 0 auto; height: auto; padding: 15px 8px } .carousel-wrap .owl-carousel .owl-item-content { height: 100%; padding: .4rem 1rem 1rem } .carousel-wrap .owl-carousel .owl-item-content .animation-section-container, .carousel-wrap .owl-carousel .owl-item-content img, .carousel-wrap .owl-carousel .owl-item-content video { padding: 2rem; width: 100% } .carousel-wrap .owl-carousel .owl-item-content .animation-section-container, .carousel-wrap .owl-carousel .owl-item-content video { padding: 0 0 2rem } .carousel-wrap .owl-carousel.owl-theme .owl-dot { outline: 0 } .carousel-wrap .owl-carousel.owl-theme .owl-dot span { background: #d4d8d9; border: none; border-radius: 2px; height: 5px; margin-left: 12px; margin-right: 12px; width: 35px } .carousel-wrap .owl-carousel.owl-theme .owl-dot.active span { background-color: #81b5a1 } .carousel-wrap .owl-carousel .owl-theme .owl-controls .owl-page.active span, .carousel-wrap .owl-carousel .owl-theme .owl-controls.clickable .owl-page:hover span { background: #3f51b5 } @media only screen and (min-width: 768px) { .carousel-wrap.tab-hide { display: none !important } } .owl-carousel .owl-stage { display: flex } .owl-carousel .owl-item { height: 100%; width: auto } .comparison-card-component { padding: 0; position: relative } .comparison-card-component > .comp-full-bleed-bg-color { background-color: #293e40 } .comparison-card-component .cta-component.cta-rectangle-box { margin: 0 2rem 0 0 } .comparison-card-component .comparison-card-background { background-position: bottom !important; background-size: cover !important; bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100%; z-index: -1 } .comparison-card-component .comparison-card-quotation { display: none } .comparison-card-component.variation-with-quote .comparison-card-component-header h2 { padding-bottom: 3rem } .comparison-card-component.variation-with-quote .comparison-card-component-header h2 .cta-component.cta-rectangle-box { margin-right: 2rem } .comparison-card-component.variation-with-quote .comparison-card-quotation { display: block } .comparison-card-component.hide-card-icons .comparison-card-container .comparison-card .comparison-card-body ul li { background-image: none !important; padding-left: 0 !important } .comparison-card-component .comparison-card-component-header { padding: 4.8rem 2rem 3.2rem; position: relative } .comparison-card-component .comparison-card-component-header h2 { color: #fff; margin: 0 0 .8rem } .comparison-card-component .comparison-card-component-header p { color: #fff; margin: 0 } .comparison-card-component .comparison-card-component-header .cta-component.cta-rectangle-box { margin: 2.4rem 2rem 0 0 } .comparison-card-component .comparison-card-container { margin: 1.6rem 1rem 0; position: relative; vertical-align: top } .comparison-card-component .comparison-card-container p { color: #fff; padding: 0 2rem; width: 100% } .comparison-card-component .comparison-card-container .comparison-card { border-bottom: .1rem solid #e6e6e6; vertical-align: top } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header { align-items: center; display: flex; flex-direction: row; height: 5.8rem; padding: 1.6rem 1rem 2.4rem; position: relative } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header img { display: none } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-icon-left, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-title-left { align-self: flex-start } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container { align-items: center; display: flex; padding: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .count { font-size: 1.8rem; margin-left: .5rem } .accordion.section .accordion-expand-wrapper .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container a.title, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .accordion.section .accordion-expand-wrapper a.title, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .title.small-body-copy { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline; outline: 0; overflow: hidden; transition: all .25s linear } .accordion.section .accordion-expand-wrapper .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container a.title:hover, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .accordion.section .accordion-expand-wrapper a.title:hover, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .title.small-body-copy:hover { background-position: 0 100%; transition: all .25s linear } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-price-container { align-self: flex-start; display: flex; margin: 0; padding: .8rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-description { color: #293e40; padding: 1.6rem 3rem 0 0; text-align: center } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-description-left { align-self: flex-start; display: flex; text-align: left } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .cta-mobile { align-self: flex-start; display: inline; padding: 2.4rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body { display: flex; flex-direction: column; max-height: 0; overflow: hidden; padding: 0 1rem; position: relative; transition: all .75s } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul { flex-grow: 1; margin: 0; padding: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li { background-size: 0; padding: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li:nth-child(n+2) { padding-top: 2.4rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li.inactive-card-item { background-image: none !important; opacity: .2 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li.inactive-card-item:before { display: none } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li:last-of-type { padding-bottom: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li a { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline; font-size: 1.6rem; outline: 0; overflow: hidden; padding-bottom: .5rem; transition: all .25s linear } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li a:hover { background-position: 0 100%; transition: all .25s linear } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .cta-desktop { display: none } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .cta-component { align-self: center; flex-shrink: 1; margin: 0 0 3.2rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .cta-component a { display: flex; justify-content: center } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .footnote { margin: 2.4rem 0 1.6rem } @media only screen and (max-width: 767px) { .comparison-card-component .site-width-1700 { padding-bottom: 3rem; padding-left: 0; padding-right: 0 } .comparison-card-component .heading-subtext { font-size: 1.4rem } .comparison-card-component .comp-full-bleed-bg-color, .comparison-card-component .comparison-card-background { display: none } .comparison-card-component > .comp-full-bleed-bg-color { display: block } .comparison-card-component .comparison-card-container { border-radius: .3rem; margin: 0 1rem; padding: 0 } .comparison-card-component .comparison-card-container h3, .comparison-card-component .comparison-card-container li { color: #293e40 } .comparison-card-component .comparison-card-container .comparison-card { border-radius: .3rem .3rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header { background-color: #fff; flex-direction: column; height: auto; justify-content: center } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header h2 { padding: 0 0 .4rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header > .comp-full-bleed-bg-color { background-color: #fff } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header:after { border-bottom: .1rem solid #293e40; border-right: .1rem solid #293e40; content: ""; cursor: pointer; display: inline-block; height: .8rem; opacity: .6; position: absolute; right: 2rem; top: 45%; transform: rotate(45deg); transform-origin: center center; transition: all .5s; width: .8rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-description, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container { align-self: flex-start } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-price-container h4, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .count, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container a, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container h3 { color: #293e40 !important } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-description { color: #293e40 !important; text-align: left } .comparison-card-component .comparison-card-container .comparison-card.active-card .comparison-card-header:after { opacity: 1; transform: rotate(225deg); transition: all .5s } .comparison-card-component .comparison-card-container .comparison-card.active-card .comparison-card-body { max-height: 75rem; padding: 2.4rem 1rem; transition: all .75s } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body, .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body > .comp-full-bleed-bg-color { background-color: #fff } .comparison-card-component .comparison-card-header.gable-green-text:after, .comparison-card-component.gable-green-text .comparison-card-container .comparison-card .comparison-card-header:after { border-bottom: .1rem solid #293e40; border-right: .1rem solid #293e40 } .comparison-card-component .inactive-card-item { display: none } .comparison-card-component .comparison-card-body li { background-image: none !important; padding-left: 0 !important } .comparison-card-component .comp-full-bleed-bg-color + .comparison-card .comparison-card-header { border-radius: .3rem .3rem 0 0 } .comparison-card-component .comparison-card:last-of-type { border: none } .comparison-card-component .comparison-card:last-of-type .comparison-card-header { border-radius: 0 0 .3rem .3rem } .comparison-card-component .comparison-card:last-of-type.active-card .comparison-card-header { border-radius: 0 } .comparison-card-component .comparison-card:last-of-type.active-card .comparison-card-body { border-radius: 0 0 .3rem .3rem } .comparison-card-component .footnote { color: #293e40 !important } } @media only screen and (min-width: 768px) { .comparison-card-component { padding: 6rem 0 } .comparison-card-component .heading-subtext { font-size: 1.6rem } .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card { width: 48% } .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card:first-child, .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card:nth-child(2) { margin-bottom: 1.6rem } .comparison-card-component.variation-two-cards .comparison-card-container .comparison-card { width: 48% } .comparison-card-component.variation-one-card .comparison-card-container { justify-content: space-evenly } .comparison-card-component.variation-one-card .comparison-card-container .comparison-card { width: 48% } .comparison-card-component.variation-left-ctas .comparison-card-container .comparison-card .comparison-card-header { align-items: flex-start } .comparison-card-component.variation-left-ctas .comparison-card-container .comparison-card .comparison-card-body { text-align: left } .comparison-card-component.variation-with-quote .comparison-card-component-header h2 { font-size: 2.4rem; line-height: 3.12rem; padding-bottom: 3rem } .comparison-card-component.variation-with-quote .comparison-card-quotation { display: block } .comparison-card-component.variation-with-shadows .comparison-card { box-shadow: 0 0 2rem .5rem rgba(41,62,64,.1) } .comparison-card-component .comparison-card-component-header { padding: 0 15rem 2rem 1.5rem } .comparison-card-component .comparison-card-component-header p { margin: 0 } .comparison-card-component .comparison-card-component-header .cta-component.cta-rectangle-box { margin: 1.6rem 2rem 0 0 } .comparison-card-component .comparison-card-container { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0; padding: 2rem 1.5rem 0 } .comparison-card-component .comparison-card-container p { padding: 0 0 0 1rem } .comparison-card-component .comparison-card-container .comparison-card { border: none; border-radius: .3rem; display: inline-block; overflow: hidden; width: 32.5% } .comparison-card-component .comparison-card-container .comparison-card.no-card-line .comparison-card-header { border-bottom: none } .comparison-card-component .comparison-card-container .comparison-card .comp-full-bleed-bg-color { background-color: #fff } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header { border-bottom: .1rem solid #e6e6e6; flex-direction: column; height: auto; justify-content: flex-start; line-height: 2.2rem; padding: 2.4rem 1.6rem 1.6rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .comp-full-bleed-bg-color { border-radius: .3rem .3rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container { display: block; padding: 0 0 .8rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .count { font-size: 1.4rem; margin: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-description { padding: .8rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header h3 { display: inline; font-size: 1.4rem; line-height: 1.6rem; padding: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header img { display: block; padding: 0 0 1.6rem; width: 4.5rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .cta-mobile { display: none } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-price-container { margin: 0; padding: .8rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .card-price-container h4 { color: #fff; margin: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body { border-radius: 0 0 .3rem .3rem; display: block; height: auto; max-height: none !important; padding: 3.2rem 1.6rem; text-align: center; transition: all 0s } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul { text-align: left } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .footnote { margin: 2.4rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .comp-full-bleed-bg-color.pure-white { border-radius: 0 0 .3rem .3rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .cta-desktop { align-self: flex-start; display: flex; margin: 1.6rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .cta-desktop:first-child { margin: 0 } } @media only screen and (min-width: 1024px) { .comparison-card-component { padding: 8rem 0 } .comparison-card-component .heading-subtext { font-size: 1.8rem } .comparison-card-component.variation-with-quote .comparison-card-component-header h2 { font-size: 2.8rem; line-height: 3.64rem; padding-bottom: 3rem } .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card { width: 45% } .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card:first-child, .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card:nth-child(2) { margin-bottom: 1.6rem } .comparison-card-component.variation-one-card .comparison-card-container .comparison-card, .comparison-card-component.variation-two-cards .comparison-card-container .comparison-card { width: 45% } .comparison-card-component .cta-component.cta-rectangle-box { margin: 1.6rem 4rem 0 0 } .comparison-card-component .comparison-card-component-header { padding: 0 22rem 2rem 2rem } .comparison-card-component .comparison-card-container { margin: 0; padding: 2rem 2rem 0 } .comparison-card-component .comparison-card-container .comparison-card { width: 32.25% } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header { padding: 2.4rem 1.6rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header .title-container .count { font-size: 1.6rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header h3 { font-size: 1.6rem; line-height: 2rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header p { margin: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body .cta-desktop.cta-component { margin: 2.4rem 0 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul { padding: 0 } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li { background-position: .2rem .4rem; background-repeat: no-repeat; background-size: 1.2rem; font-size: 1.6rem; line-height: 2rem; margin: 0; padding-left: 2rem } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-body ul li:nth-child(n+2) { background-position: left 2rem; padding-top: 1.6rem } .comparison-card-component .comparison-card-container p { padding: 4rem 0 0 1rem } } @media only screen and (max-width: 1699px) { .comparison-card-component .comparison-card-component-header > .comp-full-bleed-bg-color, .comparison-card-component .comparison-card-container > .comp-full-bleed-bg-color { display: none } } @media only screen and (min-width: 1700px) { .comparison-card-component .heading-subtext { font-size: 2rem } .comparison-card-component .site-width-1700 { align-items: center; display: flex; padding: 0 } .comparison-card-component.variation-top-header .site-width-1700 { align-items: flex-start } .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card { width: 23% } .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card:first-child, .comparison-card-component.variation-four-cards .comparison-card-container .comparison-card:nth-child(2) { margin-bottom: 1.6rem } .comparison-card-component.variation-two-cards .comparison-card-container .comparison-card { width: 43.8% } .comparison-card-component .comparison-card-component-header { flex-grow: 0; flex-shrink: 0; padding: 0 11rem 0 4rem; position: static; width: 33% } .comparison-card-component .comparison-card-component-header .comp-full-bleed-bg-color { right: 67% } .comparison-card-component .comparison-card-component-header h2 { font-size: 3.8rem } .comparison-card-component .comparison-card-container { flex-grow: 0; flex-shrink: 0; padding: 0 4rem; position: relative; width: 66% } .comparison-card-component .comparison-card-container > .comp-full-bleed-bg-color { left: 0; right: -9999% } .comparison-card-component .comparison-card-container .comparison-card { width: 31.8% } .comparison-card-component .comparison-card-container .comparison-card .comparison-card-header h3 { font-size: 1.8rem; line-height: 2.2rem } } .component-overlay-new { background-color: #fff; height: 0; overflow: hidden; position: absolute; top: 0; width: 100% } .component-overlay-new .icon-link-container { height: auto; margin: 0 !important; overflow-y: auto } .component-overlay-new .icon-link-container .component-overlay-new-right-col-quote-sec:first-child { padding-top: 4rem } .component-overlay-new .comp-full-bleed-bg-color { background-color: #fff; left: -4rem; z-index: 0 } .component-overlay-new .comp-full-bleed-bg-color:before { background-color: #fff; content: ""; display: block; height: 100%; width: 1000% } .component-overlay-new .icon-link-container { -webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: auto } .component-overlay-new.active-overlay { height: auto } .component-overlay-new.active-overlay-close { transition: all .3s ease-in-out !important } .component-overlay-new .component-overlay-new-right-col-background-img { padding-top: 100% } .component-overlay-new .component-overlay-new-right-col-background-img img { bottom: 0; height: 100%; left: 50%; position: absolute; transform: translate(-50%) } .component-overlay-new .component-overlay-new-right-col-quote-sec .overlay-quote { color: #293e40; font-weight: 600; margin-bottom: 4.8rem; margin-top: 0; position: relative } .component-overlay-new .component-overlay-new-right-col-quote-sec .overlay-quotation { display: block !important; font-size: 2.4rem; left: 0; top: -3.4rem } .component-overlay-new .component-overlay-new-right-col-quote-sec .overlay-quotation svg { width: 1.2rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec { padding-bottom: 2.4rem; padding-top: 2.4rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-header, .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list { padding-bottom: 2.4rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-header p { font-size: 1.2rem; font-weight: 700; margin: 0; opacity: .5; text-transform: uppercase } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item { align-items: center; display: flex } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-list-item-location { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; font-family: GilroySemiBold; overflow: hidden; padding-bottom: 3px; transition: all .25s linear } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-list-item-designation { display: none } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-list-item-designation .icon-link-sec-job-title { font-weight: 500; padding-right: 1.4rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-list-item-designation .icon-link-sec-timeline { font-weight: 400; opacity: .5 } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-img { height: 7rem; margin-right: 1.6rem; max-width: 7rem; overflow: hidden; width: 100% } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-img img { height: auto; transition: all .25s linear; width: 100% } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-text-sec { max-width: 60rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list > a:hover .icon-link-sec-img img { transform: scale(1.1) } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list > a:hover .icon-link-sec-list-item-location { background-position: 0 100%; transition: all .25s linear } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list:last-child { padding-bottom: 0 } .component-overlay-new .component-overlay-new-right-col-nav-sec { position: relative } .component-overlay-new .component-overlay-new-right-col-nav-sec:before { content: ""; display: block; height: 100%; left: -2rem; position: absolute; right: -1000%; width: 1000% } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-sticky-banner { display: inline-block; padding: 2.4rem 0; position: relative; vertical-align: middle } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-sticky-banner p { color: #fff !important; margin: 0 } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-sticky-banner p.overlay-sticky-banner-title { font-family: GilroySemiBold } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav { display: inline-block; height: 1.6rem; line-height: 0; margin: 0; position: absolute; right: 5%; top: 50%; transform: translateY(-50%); vertical-align: middle } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn { cursor: pointer; display: inline-block } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { position: absolute; right: 9rem } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next { position: absolute; right: 4rem } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next.no-more-click, .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous.no-more-click { opacity: .4; pointer-events: none } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn svg { height: 1.6rem; opacity: .6; width: .8rem } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn:hover svg { opacity: 1 } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .close-btn-desktop svg { opacity: .6 } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .close-btn-desktop:hover svg { opacity: 1 } .component-overlay-new .component-overlay-new-close-btn { cursor: pointer } .component-overlay-new .component-overlay-new-close-btn.close-btn-mobile { position: absolute; right: 3rem; top: 2rem } .component-overlay-new .component-overlay-new-close-btn.close-btn-mobile svg g { stroke: #293e40; opacity: .6 } .component-overlay-new .component-overlay-new-close-btn.close-btn-mobile svg { opacity: .6 } .component-overlay-new .component-overlay-new-close-btn.close-btn-mobile:hover svg, .component-overlay-new .component-overlay-new-close-btn.close-btn-mobile:hover svg g { opacity: 1 } .component-overlay-new .component-overlay-new-right-col-text-sec { margin-bottom: 4rem; overflow: hidden; position: relative } .component-overlay-new .component-overlay-new-right-col-scroll { height: 100%; padding-top: 0; width: calc(100% - 15px) } @media only screen and (min-width: 768px) { .component-overlay-new { position: fixed } .component-overlay-new .component-overlay-new-outter-wrapper { height: 100vh } .component-overlay-new .component-overlay-new-right-col-quote-sec .overlay-quote { margin-bottom: 5.4rem } .component-overlay-new .component-overlay-new-right-col-quote-sec .overlay-quotation svg { width: 1.6rem } .component-overlay-new .component-overlay-new-right-col-nav-sec { margin-left: -3rem; padding: 0 3rem } .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { position: absolute } .component-overlay-new .component-overlay-new-right-col-text-sec { height: 50vh; margin-bottom: 4rem; overflow: hidden } .component-overlay-new .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { height: 100%; padding-top: 0; width: calc(100% + 2rem) } .component-overlay-new .component-overlay-new-left-col .component-overlay-new-left-background:before { bottom: 0; content: ""; display: block; height: 100%; left: -100%; position: absolute; right: 0; width: 1000% } .component-overlay-new .component-overlay-new-right-col-background-img { padding-top: 56.25% } .component-overlay-new .component-overlay-new-right-col-background-img img { height: 115% } .component-overlay-new .icon-link-sec-list .icon-link-sec-list-item { align-items: start !important } .component-overlay-new .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-list-item-designation { display: block !important } .component-overlay-new .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-text-sec { margin-top: -.6rem; padding-right: 1.5rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-img { height: 8.8rem; max-width: 8.8rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec { padding-bottom: 4rem; padding-top: 4rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list { padding-bottom: 3.2rem } } @media only screen and (min-width: 1024px) { .component-overlay-new .comp-full-bleed-bg-color { left: 0 } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-quote-sec .overlay-quote { margin-bottom: 4.8rem } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-nav-sec { bottom: unset; margin-left: 0; padding: 0; position: relative } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-nav-sec .overlay-sticky-banner { padding: 3.2rem 0 } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { right: 11rem } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next { right: 5rem } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-nav-sec .overlay-nav .close-btn-desktop { display: inline-block } .component-overlay-new .component-overlay-new-right-col .padding-4 { padding: 0 2% } .component-overlay-new .component-overlay-new-left-col .component-overlay-new-left-background:before { left: -1000% } .component-overlay-new .component-overlay-new-right-col-text-sec { height: calc(100vh - 11rem) } .component-overlay-new .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { padding-bottom: 0; padding-top: 0 } .component-overlay-new .close-btn-mobile { display: none } .component-overlay-new .component-overlay-new-right-col-background-img img { height: 100% } .component-overlay-new .component-overlay-new-right-col-icon-link-sec { padding-bottom: 3.2rem; padding-top: 3.2rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-img { height: 9.7rem; max-width: 9.7rem } } @media only screen and (min-width: 1700px) { .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-quote-sec .overlay-quote { margin-bottom: 8rem } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-nav-sec .overlay-sticky-banner { padding: 5.6rem 0 } .component-overlay-new .component-overlay-new-right-col .component-overlay-new-right-col-text-sec { height: calc(100vh - 16rem) } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-img { height: 11rem; max-width: 11rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec { padding-bottom: 4rem; padding-top: 4rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list { padding-bottom: 4rem } } @media only screen and (min-width: 100px)and (max-width:420px) { .overlay-sticky-banner { width: 70% } } @media only screen and (min-width: 421px) { .overlay-sticky-banner { width: 90% } } @media only screen and (max-width: 767px) { .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav { right: 4rem } .component-overlay-new .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .icon-link-sec-list-item .icon-link-sec-text-sec { padding-right: 6rem } .component-overlay-new .component-overlay-new-close-btn.close-btn-mobile { position: fixed } .component-overlay-new .icon-link-sec-text-sec { padding-right: 4rem } } @media screen and (max-width: 1023px) { .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn, .component-overlay-new .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous { text-align: center } } @media only screen and (max-width: 768px) { .component-overlay-new-content { margin-right: -10px } } @media only screen and (min-width: 100px)and (max-width:767px) { .icon-link-container { -webkit-overflow-scrolling: touch !important; height: auto !important } } .component-overlay-container-new { height: 65rem; opacity: 0; overflow-y: auto; position: fixed; top: 0; width: calc(100% + 15px); z-index: -1 } .component-overlay-container-new .component-overlay-new-left-col, .component-overlay-container-new .component-overlay-new-right-col { opacity: 0; right: -10%; transition: all .3s linear; z-index: -1 } .component-overlay-container-new .no-transition .component-overlay-new-left-col { opacity: 1; transition: none; z-index: 9998 } .component-overlay-container-new .no-transition .component-overlay-new-right-col { opacity: 1; right: -1rem; transition: none; z-index: 9999 } .component-overlay-container-new.single-overlay .overlay-nav-btn { display: none !important } .component-overlay-container-new.overlay-modal-open { display: block; opacity: 1; z-index: 99997 } .component-overlay-container-new .active-overlay .component-overlay-new-left-col.overlay-col-fade-in { opacity: 1; transition: all .25s linear .15s; z-index: 9998 } .component-overlay-container-new .active-overlay .component-overlay-new-left-col.overlay-col-slide-in, .component-overlay-container-new .active-overlay .component-overlay-new-right-col.overlay-col-slide-in { opacity: 1; right: -1rem; transition: all .25s linear; z-index: 9999 } .component-overlay-container-new.overlay-modal-close { opacity: 0; z-index: -1 } .component-overlay-container-new.no-left-image .component-overlay-new-left-col, .component-overlay-container-new.no-left-image .component-overlay-new-left-col img { display: none } .component-overlay-container-new.no-left-image .component-overlay-new-left-col .component-overlay-new-left-background:before { background-color: #7b8b8d !important } .component-overlay-container-new.no-left-image .component-overlay-new-right-col { margin-top: 0 } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec { height: calc(100vh - 80px); overflow-y: auto } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { padding-bottom: 2.4rem } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-quote-sec, .component-overlay-container-new.no-left-image .component-overlay-new-right-col .person-title { display: none } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .overlay-person { padding: 2.1rem 0 } .component-overlay-container-new.no-left-image .component-overlay-new { background-color: transparent } .component-overlay-container-new.no-left-image .component-overlay-new .component-overlay-new-outter-wrapper { background-color: transparent !important } .component-overlay-container-new.no-left-image .component-overlay-new .component-overlay-new-left-col .component-overlay-new-left-background { background-color: #293e40 !important; height: 100%; left: 0; opacity: .8; position: fixed; right: 0 } .component-overlay-container-new.no-left-image .component-overlay-new .component-overlay-new-left-col .component-overlay-new-left-background:before { background: #293e40 !important; content: ""; display: none; display: block; height: 100%; left: -100%; opacity: 1; position: absolute; right: 0; width: 1000% } .component-overlay-container-new.no-left-image .component-overlay-new .component-overlay-new-content { height: 100vh; position: relative } .component-overlay-container-new.no-left-image .component-overlay-new-right-col-nav-sec .overlay-nav .close-btn-desktop { display: block } .component-overlay-container-new.no-left-image .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-previous { right: 9rem } .component-overlay-container-new.no-left-image .component-overlay-new-right-col-nav-sec .overlay-nav .overlay-nav-next { right: 4rem } @media only screen and (max-width: 768px) { .component-overlay-container-new.no-left-image .component-overlay-new .component-overlay-new-content { min-height: 100vh } } @media only screen and (min-width: 768px) { .component-overlay-container-new { height: 100vh !important } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec { height: calc(100vh - 100px); overflow-y: auto; width: calc(100% + 10px) } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { height: auto; padding-bottom: 3.2rem; width: auto } } @media only screen and (min-width: 769px) { .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec { width: calc(100% + 20px) } } @media only screen and (min-width: 1024px) { .component-overlay-container-new .component-overlay-new-left-col { opacity: 0; right: 0; transition: all .3s linear .15s; z-index: -1 } .component-overlay-container-new.no-left-image .component-overlay-new-left-col { display: block } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec { height: calc(100vh - 120px); width: calc(100% + 30px) } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { padding-bottom: 4rem } .component-overlay-container-new.no-left-image .overlay-person { padding: 7rem 0 } } @media only screen and (min-width: 1700px) { .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec { height: calc(100vh - 150px); max-width: none; overflow-y: auto; width: calc(50vw - 30px) } .component-overlay-container-new.no-left-image .component-overlay-new-right-col .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { height: auto; max-width: 83rem; overflow-y: visible; padding-bottom: 4.8rem } .component-overlay-new-right-col-scroll.padding-4 { max-width: 79rem } .component-overlay-new .component-overlay-new-right-col .padding-4 { padding: 0 2rem } } @media only screen and (max-width: 767px) { .component-overlay-new-content { height: 100vh; margin-left: -10px; overflow-x: hidden; overflow-y: auto } .left-image-hidden .component-overlay-new-content { height: 100% } .component-overlay-container-new.no-left-image .component-overlay-new-content { overflow-y: hidden } .component-overlay-container-new.has-left-image .component-overlay-new .component-overlay-new-right-col-text-sec { margin-bottom: 0; overflow: unset } .component-overlay-container-new.has-left-image .component-overlay-new .component-overlay-new-right-col-scroll { height: auto; overflow: unset } .component-overlay-container-new.has-left-image .component-overlay-new-right-col-nav-sec { position: sticky; top: 0; z-index: 1 } .component-overlay-container-new.has-left-image.left-image-hidden .component-overlay-new-left-col { display: none } .component-overlay-new .component-overlay-new-right-col-nav-sec.top-menu-active { left: 0; margin: 0; right: 0 } } .component-content-router { margin: auto; position: relative } .component-content-router.top-padding-large .content-router-item-container { padding-top: 6rem } .component-content-router.top-padding-0 .content-router-item-container { padding-top: 0 } .component-content-router.bottom-padding-large .content-router-item-container { padding-bottom: 6rem } .component-content-router.bottom-padding-0 .content-router-item-container { padding-bottom: 0 } .component-content-router.default-spacing-top .ucsc-variation-2 .content-router-item-container { padding-top: 4rem !important } .component-content-router.default-spacing-bot .ucsc-variation-2 .content-router-item-container { padding-bottom: 4rem !important } .component-content-router .content-router-container { display: flex; margin: auto } .component-content-router .cta-component.cta-rectangle-box { margin-right: 3rem } .component-content-router .content-router-item { position: relative; width: 100% } .component-content-router .content-router-item.full-bleed-center .content-router-full-bleed-bg { justify-content: center } .component-content-router .content-router-item.full-bleed-left .content-router-full-bleed-bg { justify-content: left } .component-content-router .content-router-item .content-router-item-container { margin: 0 auto; max-width: 170rem; padding: 3.2rem 2rem; position: relative; width: 100% } .component-content-router .content-router-item .content-router-full-bleed-bg { bottom: auto; display: flex; height: 100%; justify-content: flex-end; left: 0; position: absolute; right: 0; top: auto } .component-content-router .content-router-item .content-router-full-bleed-bg .component-asset-block img { height: 100%; max-width: none; width: auto } .component-content-router .content-router-item .content-router-item-background { background-position: 100% 100% !important; background-repeat: no-repeat !important; background-size: contain !important; bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-content-router .content-router-item .content-router-image-column { padding: 0; position: relative } .component-content-router .content-router-item .content-router-image-column .component-asset-block img, .component-content-router .content-router-item .content-router-image-column .component-asset-block svg, .component-content-router .content-router-item .content-router-image-column .component-asset-block video { max-width: 100%; width: auto } .component-content-router .content-router-item .content-router-image-column .component-asset-block .video-js, .component-content-router .content-router-item .content-router-image-column .component-asset-block .video-js video { height: auto } .component-content-router .content-router-item .content-router-text-column { padding: 3rem 0 0; position: relative } .component-content-router .content-router-item .content-router-text-column ol, .component-content-router .content-router-item .content-router-text-column ul { margin: 0 } .component-content-router .content-router-item .content-router-text-column li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; color: #293e40; line-height: 1.7; list-style: unset } .component-content-router .content-router-item .component-icon-block { margin: 0 0 1rem } .component-content-router .content-router-item h3 { margin: 0 0 .8rem } .component-content-router .content-router-item p { margin: 0 0 1rem } .component-content-router .content-router-item .cta-component.cta-text-arrow:last-of-type { margin-right: 0 } .component-content-router .content-router-item .cta-component.cta-text-arrow:last-of-type a { margin-right: 0; white-space: nowrap } .component-content-router .content-router-item .cta-component.cta-text-arrow:last-of-type a .cta-title-link-arrow { position: absolute } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block { border-radius: 3px; height: 16rem; overflow: hidden; width: 100% } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block img { margin-left: -10%; min-width: 124% } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column h3 { font-family: gilroyBold; font-size: 1.8rem; margin-bottom: 1.8rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column p { margin-bottom: 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-component { margin-left: auto; margin-right: auto; margin-top: 2.7rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-text-arrow { margin-top: 3rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-text-arrow .cta-title-link-arrow { padding-top: .1rem } .component-content-router .content-router-item.asset-top .content-router-image-column { align-self: flex-start } .component-content-router .content-router-item.asset-center .content-router-image-column { align-self: center } .component-content-router .content-router-item.default-variation li, .component-content-router .content-router-item.default-variation p { font-size: 1.8rem } .component-content-router .content-router-item.default-variation p { margin-bottom: 0 } .component-content-router .content-router-item.default-variation .cta-component { margin-top: 1rem } .component-content-router .content-router-item.default-variation .content-router-image-column { align-self: center } .component-content-router.variation-stacked-items .content-router-container { flex-direction: column } @media only screen and (min-width: 768px) { .component-content-router .content-router-item .content-router-item-container { align-items: center; display: flex; flex-direction: row-reverse; justify-content: space-between; max-width: 170rem; padding: 4rem 3rem; width: 100% } .component-content-router .content-router-item .content-router-image-column { align-items: stretch; padding: 0 0 0 1.5rem; width: 50% } .component-content-router .content-router-item .content-router-text-column { align-items: stretch; padding: 0 1.5rem 0 0; width: 50% } .component-content-router .content-router-item.image-on-left .content-router-item-container { flex-direction: row } .component-content-router .content-router-item.image-on-left .content-router-image-column { padding: 0 1.5rem 0 0 } .component-content-router .content-router-item.image-on-left .content-router-text-column { padding: 0 0 0 1.5rem } .component-content-router .content-router-item.default-variation li, .component-content-router .content-router-item.default-variation p { font-size: 2rem } .component-content-router .content-router-item.default-variation p { margin-bottom: 0 } .component-content-router .content-router-item.default-variation .cta-component { margin-top: 3.2rem } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block { height: 22rem } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block img { margin-left: -13%; min-width: 138% } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column { margin-right: 4.5% } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column h3 { font-size: 2.2rem; margin-bottom: 2rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column p { margin-bottom: 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column li, .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column p { font-size: 1.8rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-component { margin-left: 0; margin-right: 0; margin-top: 1.7rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-rectangle-box a { padding: 1.5rem 3rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-text-arrow { margin-top: 0; padding-left: 3rem } .component-content-router .content-router-item.ucsc-variation-2.image-on-left .content-router-text-column { margin-right: unset } .component-content-router.variation-stacked-items .content-router-container { flex-direction: row } .component-content-router.variation-stacked-items .content-router-item { flex-direction: column; flex-grow: 0; flex-shrink: 0; max-width: 50% } .component-content-router.variation-stacked-items .content-router-item .content-router-item-container { display: flex; flex-direction: column; max-width: 85rem } .component-content-router.variation-stacked-items .content-router-item .content-router-image-column { padding: 0 0 3.2rem; width: 100% } .component-content-router.variation-stacked-items .content-router-item .content-router-text-column { padding: 0; width: 100% } .component-content-router.variation-stacked-items .content-router-item:nth-of-type(odd) .content-router-item-container { margin: 0 0 0 auto; padding-right: 1.5rem } .component-content-router.variation-stacked-items .content-router-item:nth-of-type(2n) .content-router-item-container { margin: 0 auto 0 0; padding-left: 1.5rem } } @media only screen and (min-width: 1024px) { .component-content-router.top-padding-large .content-router-item-container { padding-top: 8rem } .component-content-router.bottom-padding-large .content-router-item-container { padding-bottom: 8rem } .component-content-router.default-spacing-top .ucsc-variation-2 .content-router-item-container { padding-top: 6rem !important } .component-content-router.default-spacing-bot .ucsc-variation-2 .content-router-item-container { padding-bottom: 6rem !important } .component-content-router .content-router-item .content-router-item-container { padding: 4.8rem 4rem } .component-content-router .content-router-item .content-router-image-column { padding: 0 0 0 2.4rem } .component-content-router .content-router-item .component-icon-block, .component-content-router .content-router-item h3 { margin: 0 0 1.6rem } .component-content-router .content-router-item p { margin: 0 0 2rem } .component-content-router .content-router-item.default-variation li, .component-content-router .content-router-item.default-variation p { font-size: 2rem } .component-content-router .content-router-item.default-variation p { margin-bottom: 0 } .component-content-router .content-router-item.default-variation .cta-component { margin-top: 3.4rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-image-column { padding: 0 2rem 0 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-item-container { padding: 4rem } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block { height: 20.4rem } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block img { margin-left: 0; min-width: 100% } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column { margin-right: 6.5%; padding: 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column h3 { margin-bottom: 1rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column p { font-size: 1.6rem; margin-bottom: 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column li { font-size: 1.6rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-component { margin-top: 1.2rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-text-arrow { margin-left: 3.5rem; margin-top: 0 } .component-content-router .content-router-item.ucsc-variation-2.image-on-left .content-router-text-column { margin-right: unset; padding: 0 0 0 2rem } .component-content-router.variation-stacked-items .content-router-item .content-router-item-container { flex-direction: column } .component-content-router.variation-stacked-items .content-router-item .content-router-image-column { padding: 0 0 4rem } .component-content-router.variation-stacked-items .content-router-item:nth-of-type(odd) .content-router-item-container { padding-right: 2rem } .component-content-router.variation-stacked-items .content-router-item:nth-of-type(2n) .content-router-item-container { padding-left: 2rem } } @media only screen and (min-width: 1700px) { .component-content-router .content-router-item .content-router-item-container { min-height: 55.7rem } .component-content-router .content-router-item .content-router-text-column { width: 41% } .component-content-router .content-router-item p { font-size: 2rem; margin: 0 0 1.2rem } .component-content-router .content-router-item.default-variation li, .component-content-router .content-router-item.default-variation p { font-size: 2.2rem } .component-content-router .content-router-item.default-variation p { margin-bottom: 0 } .component-content-router .content-router-item.default-variation .cta-component { margin-top: 2.2rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-item-container { min-height: auto } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block { height: 25rem } .component-content-router .content-router-item.ucsc-variation-2 .component-asset-block img { height: auto; margin-left: 0; margin-top: -2%; min-width: 100% } .component-content-router .content-router-item.ucsc-variation-2 .content-router-image-column { min-width: calc(50% - 2rem); padding: 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column { margin-right: 8.5% !important; padding: 0; width: auto } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column h3 { margin-bottom: 2.2rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column p { font-size: 1.6rem; margin-bottom: 0 } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column li { font-size: 1.6rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-component { margin-top: 2.2rem } .component-content-router .content-router-item.ucsc-variation-2 .content-router-text-column .cta-text-arrow { margin-left: 2.2rem; margin-top: 0 } .component-content-router .content-router-item.ucsc-variation-2.image-on-left .content-router-text-column { padding: 0 0 0 4rem } } .component-asset-block picture > img, .component-asset-block > img, .component-asset-block > svg, .component-asset-block > video { height: auto; max-width: 100%; width: 100% } .component-asset-block .video-js { background-color: transparent !important; height: 100%; width: 100% } .component-asset-block .video-js video { position: static } .component-asset-block .animation-section-container { height: 100% } .component-asset-block .animation-section-container > svg { width: 100% } .image--rounded img, .image--rounded svg, .image--rounded video, .image--rounded.foreground-layer { border-radius: .6rem } @media screen and (min-width: 1024px) { .image--rounded img, .image--rounded svg, .image--rounded video, .image--rounded.foreground-layer { border-radius: 1.2rem } } @media screen and (max-width: 1023px) { .image--mobile-hidden { display: none !important } } .charting-center-align .chart-container { margin: auto } .component-charting { position: relative } .component-charting p, .component-charting text { fill: #293e40; color: #293e40 } .component-charting.donut-chart .chart-container { height: auto; max-width: 30rem; opacity: 0; position: relative; transition: opacity .25s ease-out; z-index: -1 } .component-charting.donut-chart.chart-animated .chart-container, .component-charting.donut-chart.chart-animated-click .chart-container { opacity: 1; z-index: 0 } .component-charting.donut-chart.chart-animated .chart-container svg.chart-content, .component-charting.donut-chart.chart-animated-click .chart-container svg.chart-content { width: 100% } .component-charting.donut-chart .arc, .component-charting.donut-chart .arc path { -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(255,255,255,0); cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none } .component-charting.donut-chart .arc path { -moz-tap-highlight-color: hsla(0,0%,100%,0); -ms-tap-highlight-color: hsla(0,0%,100%,0); color: transparent !important } .component-charting.donut-chart .arc text { text-anchor: middle; font-family: GilroySemiBold; font-size: 5rem; opacity: 0; transform: translateY(1rem) } .component-charting.donut-chart .arc text.arc-label { font-size: 1rem; transform: translateY(3rem) } @keyframes fadeIn { to { opacity: 1; z-index: 0 } } .component-charting.donut-chart #legend-container { align-items: left; animation: fadeIn .5s 1s forwards; display: flex; flex-direction: column; flex-wrap: wrap; opacity: 0; padding-top: 2.4rem; z-index: -1 } .component-charting.donut-chart #legend-container .legend { cursor: pointer; display: table; margin-bottom: 1rem; margin-right: 2.4rem } .component-charting.donut-chart #legend-container .legend .legend-color-box { height: 1.6rem; margin-right: 1rem; transition: all .3s ease-out; width: 1.6rem } .component-charting.donut-chart #legend-container .legend .legend-color-box.legend-box-selected { transform: scale(1.2) } .component-charting.donut-chart #legend-container .legend:last-child { margin-bottom: 0; margin-right: 0 } .component-charting.donut-chart #legend-container .legend p { font-family: GilroySemiBold; margin: 0; opacity: 1; padding: 0; transition: all .3s ease } .component-charting.donut-chart #legend-container .legend p.legend-selected { opacity: 1 } .component-charting.donut-chart #legend-container .legend p.legend-unselected { opacity: .8 } .component-charting.donut-chart #legend-container .legend .legend-color-box, .component-charting.donut-chart #legend-container .legend p { display: inline-block; vertical-align: middle } .component-charting.vertical-bar-chart .axis line, .component-charting.vertical-bar-chart .axis path { fill: none; shape-rendering: crispEdges; stroke: #000 } .component-charting.vertical-bar-chart .x.axis line, .component-charting.vertical-bar-chart .x.axis path, .component-charting.vertical-bar-chart .y.axis { display: none } .component-charting.vertical-bar-chart .chart-container { display: flex; flex-wrap: wrap; margin: auto; max-width: 80%; width: 100% } .component-charting.vertical-bar-chart .chart-container .chart-area { margin: auto; max-width: 40rem; transition: opacity .25s ease; width: 100% } .component-charting.vertical-bar-chart .chart-container .chart-area.active-chart, .component-charting.vertical-bar-chart .chart-container .chart-area:first-child { opacity: 1 } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container { padding-left: 10%; padding-top: 2rem; text-align: left } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container .legend { display: inline-block; margin-bottom: 1rem; margin-right: 3rem } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container .legend .legend-color-box { height: 1.6rem; margin-right: 1rem; width: 1.6rem } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container p { font-family: GilroySemiBold; margin: 0; opacity: 1; padding: 0; transition: all .3s ease } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container p.legend-selected { opacity: 1 } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container p.legend-unselected { opacity: .8 } .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container .legend-color-box, .component-charting.vertical-bar-chart .chart-container .chart-area #legend-container p { display: inline-block; vertical-align: middle } .component-charting .tooltip { background: #fff; box-shadow: .1rem .1rem .5rem 0 #d3d3d3; opacity: 0; padding: 1.5rem 4rem 1.5rem 2rem; position: absolute; top: 0; transition: opacity .25s ease,z-index .25s ease; width: auto; z-index: -1 } .component-charting .tooltip.tooltip-active { opacity: 1; z-index: 1 } .component-charting .tooltip .tool-col { padding-bottom: .3rem; padding-top: .3rem } .component-charting .tooltip .tool-col span { display: block; height: 1.2rem; width: 1.2rem } .component-charting .tooltip .tool-col > div p { font-family: GilroySemiBold; margin: 0; padding: 0; white-space: nowrap } .component-charting .tooltip .tool-col > div span { margin-right: .8rem } .component-charting .tooltip .tool-col > div p, .component-charting .tooltip .tool-col > div span { display: inline-block; vertical-align: middle } .component-charting .tooltip .tool-col p { margin: 0 } .component-charting .tooltip:before { background: #fff; bottom: 0; content: ""; height: 1.5rem; left: 50%; position: absolute; transform: translate(-50%); width: 3rem; z-index: 1 } .component-charting .tooltip:after { background: #fff; bottom: -.5rem; box-shadow: .1rem .1rem .5rem 0 #d3d3d3; content: ""; height: 1.5rem; left: 50%; position: absolute; transform: translate(-50%) rotate(45deg); transform-origin: center; width: 1.5rem } @keyframes fade-slide-in { 0% { opacity: 0 } to { opacity: 1 } } @keyframes area-fade-in { 0% { opacity: 0 } to { opacity: .6 } } .component-charting.line-area-chart .chart-container { margin: auto; max-width: 80rem } .component-charting.line-area-chart .chart-container svg { margin: auto } .component-charting.line-area-chart .axis.y path { fill: transparent; stroke: #c8c8c8; stroke-dasharray: 3,3 } .component-charting.line-area-chart .axis.x path { fill: #c8c8c8 } .component-charting.line-area-chart .axis.x .tick line, .component-charting.line-area-chart .axis.y .tick line { stroke: #c8c8c8; stroke-dasharray: 3,3 } .component-charting.line-area-chart .axis.x .tick text { text-anchor: start !important } .component-charting.line-area-chart .axis.y { transform: translate(-5px) } .component-charting.line-area-chart .axis.y .tick line, .component-charting.line-area-chart .axis.y path { display: none } .component-charting.line-area-chart .more-ticks line { stroke: #c8c8c8; stroke-dasharray: 3,3 } .component-charting.line-area-chart .more-ticks g.hi { transform: translate(85px) } .component-charting.line-area-chart .more-ticks path, .component-charting.line-area-chart .more-ticks text { display: none } .component-charting.line-area-chart .area { fill: #bacbcc; opacity: 0 } .component-charting.line-area-chart .line { fill: transparent; stroke-width: 2 } .component-charting.line-area-chart .line.animated { animation: fade-slide-in 2s forwards } .component-charting.line-area-chart .point { stroke: transparent; opacity: 0 } .component-charting.line-area-chart .point.animated { animation: fade-slide-in 1.5s .3s forwards } .component-charting.line-area-chart .tooltip-container { background: #fff; box-shadow: .1rem .1rem .5rem 0 #d3d3d3; opacity: 0; padding: 1.2rem 3rem 1.2rem 2rem; position: absolute; top: 0; transition: opacity .25s ease,z-index .25s ease; width: auto; z-index: -1 } .component-charting.line-area-chart .tooltip-container.tooltip-active { opacity: 1; z-index: 1 } .component-charting.line-area-chart .tooltip-container .tool-col { padding-bottom: .3rem; padding-top: .3rem } .component-charting.line-area-chart .tooltip-container .tool-col span { display: block; height: 1rem; width: 1rem } .component-charting.line-area-chart .tooltip-container .tool-col > div p { font-family: GilroySemiBold; margin: 0; padding: 0; white-space: nowrap } .component-charting.line-area-chart .tooltip-container .tool-col > div span { margin-right: .8rem } .component-charting.line-area-chart .tooltip-container .tool-col > div p, .component-charting.line-area-chart .tooltip-container .tool-col > div span { display: inline-block; vertical-align: middle } .component-charting.line-area-chart .tooltip-container .tool-col p { margin: 0 } .component-charting.line-area-chart #legend-container { padding-left: 8%; padding-top: 4rem; text-align: left } .component-charting.line-area-chart #legend-container .legend { display: inline-block; margin-bottom: 1rem; margin-right: 3rem } .component-charting.line-area-chart #legend-container .legend .legend-color-box { height: 1.6rem; margin-right: 1rem; width: 1.6rem } .component-charting.line-area-chart #legend-container p { font-family: GilroySemiBold; margin: 0; opacity: 1; padding: 0; transition: all .3s ease } .component-charting.line-area-chart #legend-container p.legend-selected { opacity: 1 } .component-charting.line-area-chart #legend-container p.legend-unselected { opacity: .8 } .component-charting.line-area-chart #legend-container .legend-color-box, .component-charting.line-area-chart #legend-container p { display: inline-block; vertical-align: middle } .component-charting.no-area-layer .area { fill: transparent } .component-charting.show-areas .chart-container path.area { animation: area-fade-in .5s 1s forwards } .component-charting.horizontal-bar-chart { width: 100% } .component-charting.horizontal-bar-chart .chart-container { max-width: 60rem; width: 100% } .component-charting.horizontal-bar-chart .chart-container .chart-section { align-items: center; display: flex; flex-direction: column; margin-bottom: 4rem } .component-charting.horizontal-bar-chart .chart-container .chart-section:last-child { margin-bottom: 0 } .component-charting.horizontal-bar-chart .chart-container .chart-section > * { display: block; vertical-align: middle } .component-charting.horizontal-bar-chart .chart-container .chart-section > h5 { padding-bottom: .8rem; padding-right: 4%; width: 100% } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section { position: relative; width: 100% } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic { height: 3rem; position: relative; width: 80% } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic .front-chart { background-color: red; display: block; height: 100%; position: relative; transition: width 1s ease-in-out; width: 0 } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic .front-chart .data-value { height: 100%; position: absolute; right: -6rem; width: 5rem } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic .front-chart .data-value .data-num { line-height: 3rem } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic .front-chart .data-value .data-sign, .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic .front-chart .data-value .real-num { font-size: inherit } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section .chart-graphic { display: inline-block; vertical-align: middle } .component-charting.horizontal-bar-chart:after { content: ""; display: block; height: 100% } @media (-ms-high-contrast:active),(-ms-high-contrast:none) { .component-charting.donut-chart .chart-container svg { height: 30rem } } @media only screen and (min-width: 768px) { .component-charting.donut-chart .chart-container { max-width: 40rem } .component-charting.donut-chart #legend-container { align-items: center; flex-direction: row; justify-content: center; padding-top: 4.8rem } .component-charting.donut-chart #legend-container .legend { margin-bottom: 0 } .component-charting.donut-chart #legend-container .legend .legend-color-box { height: 1.8rem; width: 1.8rem } .component-charting.donut-chart.legend-left-align #legend-container { justify-content: left } .component-charting.vertical-bar-chart .chart-container { flex-wrap: nowrap !important } .component-charting.vertical-bar-chart .legend-color-box { height: 1.8rem; width: 1.8rem } .component-charting.horizontal-bar-chart .chart-container .chart-section { flex-direction: row; height: 5.6rem; margin-bottom: 2.4rem } .component-charting.horizontal-bar-chart .chart-container .chart-section > * { display: inline-block } .component-charting.horizontal-bar-chart .chart-container .chart-section > h5 { padding-bottom: 0; width: 40% } .component-charting.horizontal-bar-chart .chart-container .chart-section .chart-graphic-section { width: 60% } } @media (-ms-high-contrast:active),only screen and (min-width: 768px)and (-ms-high-contrast:none) { .component-charting.donut-chart .chart-container svg { height: 40rem } } @media only screen and (min-width: 1024px) { .component-charting.donut-chart #legend-container .legend .legend-color-box { height: 2rem; width: 2rem } } @media only screen and (min-width: 1700px) { .component-charting.donut-chart .chart-container { max-width: 50rem } } @media (-ms-high-contrast:active),only screen and (min-width: 1700px)and (-ms-high-contrast:none) { .component-charting.donut-chart .chart-container svg { height: 50rem } } .charting-containing-border-top { border-top: .8px solid rgba(41,62,64,.2) } .charting-containing-border-bottom { border-bottom: .8px solid rgba(41,62,64,.2) } .charting-containing-border-middle { position: relative } .charting-containing-border-middle:after { background-color: rgba(41,62,64,.2); bottom: 0; content: ""; display: block; height: .1rem; left: -80%; position: absolute; width: 200% } @media only screen and (min-width: 768px) { .charting-containing-border-middle:after { height: 100%; left: unset; right: -1.5rem; top: 0; width: .1rem } } @media only screen and (min-width: 1024px) { .charting-containing-border-middle:after { right: -2rem } } .component-column-container .component-charting-container { height: 100% } .component-column-container .component-charting-container .component-charting-container-inner-wrapper, .component-column-container .component-charting-container .component-charting-container-inner-wrapper .component-charting-container-content { padding-left: 0; padding-right: 0 } @media only screen and (min-width: 768px) { .component-column-container .component-charting-container .component-charting-container-inner-wrapper { height: 100% } .component-column-container .component-charting-container .component-charting-container-inner-wrapper .component-charting-container-content { display: flex; flex-direction: column; height: 100%; justify-content: space-between } .component-column-container .component-charting-container .charting-link-tab ul, .component-column-container .component-charting-container .component-charting-container-subheader p { height: 3.1rem } .component-column-container .component-charting-container .component-charting-container-footnote p { height: 6rem } } @media only screen and (min-width: 1024px) { .component-column-container .component-charting-container .charting-link-tab ul, .component-column-container .component-charting-container .component-charting-container-subheader p { height: 3.8rem } } .component-charting-container { padding: 5.6rem 0 3rem; position: relative; width: 100% } .component-charting-container .charting-link-tab ul { display: flex; flex-direction: row; margin: 0; padding: 0 } .component-charting-container .charting-link-tab ul li { font-family: GilroySemiBold; margin-right: 3rem; padding: 0 .5rem } .component-charting-container .charting-link-tab ul li:hover { cursor: pointer } .component-charting-container .charting-link-tab ul li.tab-active { border-bottom: .4rem solid #81b5a1 } .component-charting-container .component-charting-container-footnote p { margin: 0 0 2.6rem } .component-charting-container .component-charting-container-header { padding-bottom: 1.6rem } .component-charting-container .component-charting-container-header h2 { margin: 0; padding: 0 } @media only screen and (min-width: 1700px) { .component-charting-container .component-charting-container-header { padding-bottom: 2.4rem } } .component-charting-container .component-charting-container-subheader p { margin: 0 } .component-charting-container .charting-link-tab, .component-charting-container .component-charting-container-subheader { padding-top: 0 } .component-charting-container .charting-slide-container { padding: 2.6rem 0 } .component-charting-container .charting-link-tab + .charting-slide-container, .component-charting-container .component-charting-container-subheader + .charting-slide-container { padding: 4rem 0 } .component-charting-container .charting-slide-container { position: relative } .component-charting-container .component-charting-container-charting { opacity: 0; position: absolute; top: 0; z-index: -1 } .component-charting-container .component-charting-container-charting.tab-slide-active { opacity: 1; position: relative; z-index: 0 } .component-charting-container.hide-link-list-tab .charting-link-tab { display: none } .component-charting-container.hide-link-list-tab .component-charting-container-charting { opacity: 1; position: relative; z-index: 0 } @media only screen and (max-width: 767px) { .component-charting-container.hide-head-in-two-col-mobile .component-charting-container-header, .component-charting-container.hide-subhead-in-two-col-mobile .component-charting-container-subheader { display: none } .component-charting-container.hide-subhead-in-two-col-mobile .charting-slide-container { padding-top: 2.6rem } .component-charting-container.hide-footnote-in-two-col-mobile .component-charting-container-footnote { display: none } .component-charting-container.hide-footnote-in-two-col-mobile .charting-slide-container { padding-bottom: 2.6rem } } @media only screen and (min-width: 768px) { .component-charting-container { padding: 6.4rem 0 3.8rem } .component-charting-container .charting-link-tab ul li { margin-right: 4rem } .component-charting-container .component-charting-container-footnote, .component-charting-container .component-charting-container-subheader { max-width: 80% } } @media only screen and (min-width: 1024px) { .component-charting-container { padding: 7.2rem 0 4.6rem } } @media only screen and (min-width: 1700px) { .component-charting-container { padding: 8rem 0 5.4rem } .component-charting-container .charting-link-tab + .charting-slide-container, .component-charting-container .component-charting-container-subheader + .charting-slide-container { padding: 5.6rem 0 } } .component-columns.mobile-order-bottom, .longFormMarquee + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-8, .statsBlade + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-8 { order: 2 } .longFormMarquee + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-4, .statsBlade + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-4 { order: 1 } @media only screen and (min-width: 768px) { .component-columns.mobile-order-bottom { order: 1 } .longFormMarquee + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-8, .statsBlade + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-8 { order: -1 } .longFormMarquee + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-4, .statsBlade + .columnsV2 .component-column-container .component-column-container-wrapper .component-columns.flex-box-col-md-4 { order: 2 } } .component-column-container { position: relative } .component-column-container > .component-column-container-wrapper { display: flex; flex-wrap: wrap; margin: auto; max-width: 170rem } @media only screen and (min-width: 768px) { .component-column-container > .component-column-container-wrapper.breakpoint-md { flex-wrap: nowrap } } @media only screen and (min-width: 1024px) { .component-column-container > .component-column-container-wrapper.breakpoint-lg { flex-wrap: nowrap } } .component-icon-block { max-height: 4rem; max-width: 4rem } .component-icon-block img, .component-icon-block svg, .component-icon-block video { height: auto; max-height: 100%; max-width: 100%; width: auto } @media only screen and (min-width: 768px) { .component-icon-block { max-height: 4.5rem; max-width: 4.5rem } } @media only screen and (min-width: 1700px) { .component-icon-block { max-height: 6rem; max-width: 6rem } } .component-long-form-quote .component-long-form-quote-outer-container { align-items: center; display: flex; min-height: 44.1rem; padding: 2rem; position: relative; z-index: 199 } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer { bottom: 0; left: 0; max-height: 100%; max-width: 100%; overflow: hidden; position: absolute; right: 0; top: 0; z-index: -1 } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block { align-items: flex-start; display: flex; height: 100%; justify-content: flex-end; overflow: hidden } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block .video-js, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block img, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block > video { flex-shrink: 0; height: 100%; max-width: none; min-height: 100%; min-width: 100%; width: auto } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block .video-js { min-height: 100%; min-width: 100% } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block .video-js video { flex-shrink: 0; height: auto; max-width: none; min-height: 100%; min-width: 100%; position: absolute; width: auto } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container { align-items: center; display: flex; margin: auto; max-width: 162rem; position: relative; width: 100% } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container { display: flex; flex-direction: column; justify-content: center; min-height: 40.2rem; padding: 3.2rem 1.6rem; position: relative } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container:before { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAkCAYAAADLsGk3AAAAAXNSR0IArs4c6QAABnVJREFUWAm1WX1sFEUUnzd7hRaLKJRC/Qr8YZS2oLUR9R+610KbAo1AcpBAAgLGiIoGAibGP6gG/AJBjYIhEYyiCVaNpkqBtPfRogJJIUrvSAwSo4ZA70Ba+t27HX9zl2u3d7u3e9dzknZn3tdv3rydN2/2iGXQ5ldVTbsVEdtJiKUOUp7+zdt8OgMztlTK1bqCAdGzXWNiMVf4Rr/bfdZIkYyIZrTyhQunDIS17ZqmvQiZyVIOBoYF0asBr3sPEQkz3XTpD6vL7hgSXS8zJjYLwfLjWHi+4vd59iZi2Xak2OmsYhFxGDO912hSRKwpjyavbfc2hoz46dBKK6oWRZh2mAlxt7Ee/Tg5h68729JyPc63dOQJlyuvqzP0thDiBShZyNMVh8JWX/B4fHGAdJ7ldXWT+rp63kEUnrPCwsL9w5iyOuBraZMYKSc2d8mSO8M9vceYYI/bnhBRhDP2ustZsbO+vl6zq1dSUzNV9A81CSbm29VhwELUdqyqVN80daS8pqaob2DwBJyYa9uwThCGPw60ejfpSKbdskWL7hocCp9E1EtMhVIy6CMsXnIrq62d3j8w1JaJE8ToJ8aV5Ssr1eeTLSdT5lVXFw4MDp/KxAm8XqdIoWUBn3tzUkRcLpfivxY6gRBXJcOmoBB9m0PK7nRSscTq6Aw2Y8HUFJaTWFisb5jCdgc8njNxpiPeiT87gtd3YbOl40RQ4cqGDm/LD3Ebdp/+a8G3IKvalYcDncia6wOtnmOJOmMiUqouVCNa2JMoZDaG4RPE857ye49dNZMxo5dUVlZqYa3FjJ9Il+mdO5T1HS0t1xJ5cjyyR5BhuCbCe42EkmgyMxFt9fvctZk4EcUKi31Jdg0IcCCMw++lgM+72MwJqTbyajV4W9fiBC0zsDWWJFMeiTV+r/coAMbybI6AtQGv7zwrcekE1hpnhbvBSjYaEblCQhOvWQlLPiex8SKcsCNrJCM3uBDaDiNeEo2U9XackHqK/Bckqkb6s06XRPsR4jekTqZNFMyohe4mK31E+wM4gVPeXotGRGgMoU7dEOZLvLBgS2opay5eRkssFBy/5z1w/zZra6MSVKK68jURCuGonzhKTu5FDx6P5/tkjn3KY7W1t9/q7Q8hheak0kI6r0s3nTuYuPGopROMAjh8xuWEnHh3/7Cso1I6gervQrpOSNsOwTQbBaE4VFJVVcyGta2oAudArwB/slw/zxXW2OF2n0y8H4Bn0KyxOPFD89Tq0rAY3oIs+iCMRLGIiXPcwaNYBoYZFS9wfody5EkjZpyG/YGSmc2E4ZF0HefJJ5z4FTfFZ63KkzkVaiPKkaV63cQ+9tDfiEqRORY7j9S5SV+eSBscZ8J9icYSxzB6j5lhKYuM91BYhNtKKpzPJOqOGQuyxsLFLTUWzrqIaJujqhv1tpG1aKqekGlfgmuCHShd4FxhZgM34exgyX2m0UHcWkfeJI7VzIrx2OQF14jtR2l+m6EzIjuLFscSEXFA3irlGCUTyzMEzZCIhZkRHgwbnhVIu7kZmjVTK+rr7l0nmRzGb5pJZU7XFhvpIvN0GdHHR4thcWSJ7Dsi6BGjyf0viyZYucTiTNBfRqDjoQli02Qhmmwj+1gIhDxn5H1EnE0GHCdFCKXxypVoQaq3hPBnHQtRdsiKmjOFTuvBstHHKv3bfvDgcKItfIfMOhYOz+sNDQ0RPqWg4KQETgQdzxiv1h9G+hOn5B9HGZDVDU+Colj8l4aGfuL8MyPgTGlIhceNdNsbG/vw4ftzI17GNE5RrNiGdHB8FGY9GRvTK+IqrCh0RE/S9yfw3HdRm/XqaZn2Meew0JQvpH7shnj5ctf0WbOlcXl7G18j+sTv9XxqZuTqn5duFs6a3Y9NWmMmY5eOLXHwYqs7+jbFIgLNlc6KD7FSX9k1YiSHFTrPqWCrEU9Pw3fh9yH7tZ6Wdp+o3ZE7YVtcD06NNlWtdwQ13xH8qLJqlGqzR+w0p0nL7X4eklidwvclShqXTQSdGP2s5PAV+s9DYxyJS5YscK6GM3swLorTzJ/UjdV9D3fsnUYp11wvxilW1TW4o+xB9TzTSlZmPCSLfYVc3eX11uNT0WgzdESyo7+LhELVTGMolUUZSDMBOA3PHsEoiHvMOVxmPLk5ytH25uZxpVSJdTN4o4ZEBFgELDEjhkW3sJdCMSzuzp808eiZpqZuOb/E9h/pUlKEVNCHKQAAAABJRU5ErkJggg=="); background-position: 0 0; background-repeat: no-repeat; background-size: 100%; content: ""; display: block; height: 2rem; left: 0; position: relative; top: 0; width: 1.6rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h2, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h3 { margin: 0 0 2.4rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container p { margin: 0 } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container p:last-of-type { margin-bottom: 0 } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container p a { background: none; background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; line-height: inherit; overflow: hidden; padding: 0 0 6px; transition: all .25s linear } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container p a:hover { background-position: 0 100%; transition: all .25s linear } .component-long-form-quote .pure-white-text .component-long-form-quote-text-container:before, .component-long-form-quote.pure-white-text .component-long-form-quote-text-container:before { filter: brightness(0) invert(1) } .component-long-form-quote.animate-longform .component-long-form-quote-inner-container { left: -50%; opacity: 0; transition: all 1s; transition-delay: .75s } .component-long-form-quote.no-background-layer .component-long-form-quote-outer-container { padding: 2rem 0 } .component-long-form-quote.no-background-layer .component-long-form-quote-inner-container { min-height: 0 } .component-long-form-quote.no-background-layer .component-long-form-quote-inner-container .comp-full-bleed-bg-color { display: none } .component-long-form-quote.show-longform-container .component-long-form-quote-inner-container { left: 0; opacity: 1; transition: all 1s; transition-delay: .5s } @media(min-width: 768px) { .component-long-form-quote.no-background-layer .component-long-form-quote-outer-container { padding: 4rem 3rem } .component-long-form-quote.no-background-layer .component-long-form-quote-inner-container .comp-full-bleed-bg-color { display: block } .component-long-form-quote .component-long-form-quote-outer-container { min-height: 52.5rem; padding: 4rem 3rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block .video-js, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block img { height: auto } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block > video { height: auto; max-width: none; width: auto } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container { min-height: 34rem; padding: 4rem 3.2rem; width: 74% } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container:before { height: 3rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h2, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h3 { font-size: 2.8rem; line-height: 3.64rem; width: 94% } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container p { width: 80% } } @media(min-width: 1024px) { .component-long-form-quote.no-background-layer .component-long-form-quote-outer-container { padding: 4rem } .component-long-form-quote .component-long-form-quote-outer-container { min-height: 70.3rem; padding: 7rem 4rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container { min-height: 47.5rem; padding: 5.6rem 4rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container:before { height: 3.6rem; width: 2rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h2, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h3 { font-size: 3.6rem; line-height: 4.68rem; width: 93% } } @media(min-width: 1700px) { .component-long-form-quote .component-long-form-quote-outer-container { min-height: 87.7rem; padding: 14rem 4rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-background-layer .component-asset-block img { height: auto } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container { min-height: 58.5rem; padding: 7.2rem 4rem 7.2rem 8.5% } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container:before { height: 3.6rem; width: 2.6rem } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h2, .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container h3 { font-size: 4.8rem; line-height: 6.24rem; width: 91% } .component-long-form-quote .component-long-form-quote-outer-container .component-long-form-quote-inner-container .component-long-form-quote-text-container p { width: 64% } } .aem-AuthorLayer-Edit .component-long-form-quote-inner-container { left: 0 !important; opacity: 1 !important } .component-longform-marquee .component-longform-marquee-outer-container { position: relative } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block .video-js, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block .video-js video { height: auto } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container { align-items: center; display: flex; min-height: 20.9rem; padding: 2.4rem 2rem 1.6rem; position: relative; z-index: 1 } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container { width: 100% } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block { margin: 0 0 1rem; max-height: 2.4rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block img, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block svg, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block video { height: 100%; max-height: inherit; max-width: none; width: auto } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container h1 { margin: 0 0 .2rem; padding: 0 } .component-longform-marquee.animate-longform .component-longform-marquee-background-layer { opacity: 0; transition: opacity .75s; transition-delay: .75s } .component-longform-marquee.animate-longform .component-longform-marquee-inner-container { left: -50%; opacity: 0; transition: opacity,left 1s; transition-delay: .75s } .component-longform-marquee.show-longform-container .component-longform-marquee-background-layer { opacity: 1; transition: opacity .75s; transition-delay: .75s } .component-longform-marquee.show-longform-container .component-longform-marquee-inner-container { left: 0; opacity: 1; transition: opacity,left 1s; transition-delay: .75s } @media(max-width: 767px) { .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer { opacity: 1; transition: opacity 0; transition-delay: 0 } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block .video-js { align-items: flex-end; display: flex } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container { left: 0; opacity: 1; transition: opacity,left 0; transition-delay: 0 } .component-longform-marquee.show-longform-container .component-longform-marquee-background-layer { opacity: 1; transition: opacity 0; transition-delay: 0 } .component-longform-marquee.show-longform-container .component-longform-marquee-inner-container { left: 0; opacity: 1; transition: opacity,left 0; transition-delay: 0 } } @media only screen and (min-width: 768px) { .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer { margin: 0 0 0 auto } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block { height: 26.2rem; margin: 0 0 0 auto; max-width: 50.2rem; text-align: right } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block .video-js, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block .video-js video, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block img, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block svg, .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block > video { height: 100%; width: auto } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container { bottom: 0; min-height: 18.4rem; padding: 2.4rem 3rem 1.6rem; position: absolute; width: 56%; z-index: 1 } } @media only screen and (min-width: 1024px) { .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block { height: 37.6rem; max-width: 66.9rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container { min-height: 31rem; padding: 3.2rem 2.4rem 2.4rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block { margin: 0 0 1.6rem; max-height: 3.6rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container h1 { margin: 0 0 1.2rem; padding: 0 2.4rem 0 0 } } @media only screen and (min-width: 1440px) { .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block { height: 52.9rem; max-width: 94rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container { min-height: 42.6rem; padding: 4.8rem 3.4rem 4rem; width: 57% } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block { margin: 0 0 3.2rem; max-height: 5.2rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container h1 { margin: 0 0 2rem; padding: 0 3.4rem 0 0 } } @media only screen and (min-width: 1700px) { .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer { margin: auto; max-width: 170rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-background-layer .component-asset-block { height: 62.4rem; max-width: 111rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container { left: 0; margin: auto; max-width: 170rem; min-height: 50.4rem; padding: 4.8rem 4rem 4rem; right: 0; width: 100% } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .comp-full-bleed-bg-color { right: 43% } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container .component-asset-block { margin: 0 0 1.6rem; max-height: 6.5rem } .component-longform-marquee .component-longform-marquee-outer-container .component-longform-marquee-inner-container .component-longform-marquee-text-container h1 { margin: 0 0 3.6rem; padding: 0 4rem 0 0; width: 93rem } .component-longform-marquee.animate-longform .component-longform-marquee-inner-container { left: -50% } .component-longform-marquee.show-longform-container .component-longform-marquee-inner-container { left: 0 } } .aem-AuthorLayer-Edit .component-longform-marquee-background-layer { opacity: 1 !important } .aem-AuthorLayer-Edit .component-longform-marquee-inner-container { left: 0 !important; opacity: 1 !important } .component-right-rail-container { margin-top: 4.8rem; max-width: 100%; overflow: hidden; padding-bottom: 4.8rem; position: relative; width: 100%; z-index: 1 } @media only screen and (min-width: 768px) { .component-right-rail-container { max-width: 43rem; padding-bottom: 0; position: absolute } .component-right-rail-container.sticky-rail { position: fixed; top: 0 } .component-right-rail-container.sticky-rail.stop-before-footer { position: absolute } } .component-right-rail { margin-bottom: 2.4rem; position: relative } .component-right-rail .component-right-rail-inner-wrap { padding: 0 1.6rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap { padding: 2.4rem 0 1.6rem; position: relative } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap .component-rr-company-name { display: none } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap .component-right-rail-expend { background-color: transparent; cursor: pointer; display: block; height: 2rem; margin-top: -1rem; opacity: 0; position: absolute; right: 2.4rem; top: calc(50% + .3rem); width: 2rem; z-index: -1 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap .component-right-rail-expend:after { border-bottom: .2rem solid #293e40; border-right: .2rem solid #293e40; content: ""; display: inline-block; height: 1rem; margin-left: .5rem; margin-top: -.8rem; position: absolute; top: 50%; transform: rotate(45deg); transform-origin: center center; transition: transform .25s,opacity .25s; width: 1rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.arrow-upwards .component-right-rail-expend:after { opacity: 1 !important; transform: rotate(225deg) } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.turned-sticky { margin-left: -1.6rem; max-width: 43rem; padding-left: 1.6rem; position: fixed; width: 100%; z-index: 901 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.turned-sticky .component-right-rail-expend { z-index: 902 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.fully-collapsed { border-bottom: none !important } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.fully-collapsed .component-right-rail-expend { opacity: 1 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.fully-collapsed .component-right-rail-expend:after { opacity: .6 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.fully-collapsed .component-right-rail-expend:hover:after { opacity: 1 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap + .component-right-rail-text-area .component-right-rail-header { padding-top: 0 } .component-right-rail .component-right-rail-inner-wrap .component-asset-block { margin: 0; max-height: 7rem; overflow: hidden; padding: 0 } .component-right-rail .component-right-rail-inner-wrap .component-asset-block img, .component-right-rail .component-right-rail-inner-wrap .component-asset-block svg { max-height: 10rem; width: auto } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area { margin: 0; overflow: hidden; position: relative } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section { display: table; padding-bottom: 2.4rem; position: relative } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section a { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: block; overflow: hidden; transition: all .25s linear } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section a:hover { background-position: 0 100%; transition: all .25s linear } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section:last-child { padding-bottom: 2.4rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-lable { color: #293e40; display: block; font-family: GilroySemiBold; opacity: .6; padding-bottom: .4rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text { color: #293e40; font-family: GilroySemiBold } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-header { padding-bottom: 1.6rem; padding-top: 2.4rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-header p { font-family: GilroySemiBold; margin: 0; opacity: .6; padding: 0 } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-header .label-copy-bold { font-size: 1.6rem; line-height: 1.2; opacity: 1 } .component-right-rail .cta-component { margin: 0; width: 100% } .component-right-rail .cta-component a { text-align: center; width: 100% } .component-right-rail.rounded-corner-image .component-asset-block img, .component-right-rail.rounded-corner-image .component-asset-block svg { border-radius: 5rem } .component-right-rail.display-company-name .component-right-rail-asset-wrap .component-asset-block { display: none } .component-right-rail.display-company-name .component-right-rail-asset-wrap .component-rr-company-name { display: block } .component-right-rail.collapsed-new .component-right-rail-expend-new:after { border-bottom: .2rem solid #293e40; border-right: .2rem solid #293e40; content: ""; cursor: pointer; display: inline-block; height: 1rem; margin-left: .5rem; margin-top: -.8rem; position: absolute; right: 1rem; top: 1.4rem; transform: rotate(45deg); transform-origin: center center; transition: transform .25s,opacity .25s; width: 1rem } .component-right-rail.collapsed-new .component-right-rail-text-multifield { display: none } .component-right-rail.collapsed-new .component-right-rail-text-multifield.show { display: inherit } .component-right-rail.collapsed-new .component-right-rail-header { position: relative } .component-right-rail.collapsed-new .arrow-upwards:after { top: 1.8rem; transform: rotate(225deg) } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap { padding: 3rem } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-header { padding: 0 } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield { padding-top: 3rem } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-lable { font-family: gilroyBold; font-size: 1.2rem; padding-bottom: 1.5rem } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.paragraph-copy { font-family: GilroyRegular; font-size: 1.4rem } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.paragraph-copy a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; display: inline; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.paragraph-copy a:hover { background-size: 100% 100% } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .paragraph-copy { line-height: 1.9 } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section:last-child { padding-bottom: 0 } .component-right-rail.variation-list .component-right-rail-inner-wrap { padding: 0 } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area { padding: 3rem } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-header { padding: 0 } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield { margin: 0; padding-left: 2rem; padding-top: 3rem } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section { display: list-item; padding-bottom: 2rem } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; display: inline; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section a:hover { background-size: 100% 100% } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section:last-child { padding-bottom: 0 } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield .right-rail-text-section .right-rail-text { font-family: gilroyRegular; font-size: 1.6rem; line-height: 1.7 } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield.bulleted .right-rail-text-section { list-style: disc } .component-right-rail.variation-list .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-text-multifield.numbered .right-rail-text-section { list-style: decimal } .component-right-rail.variation-profile .component-right-rail-inner-wrap { padding: 0 } .component-right-rail.variation-profile .component-right-rail-inner-wrap .component-right-rail-asset-wrap { padding: 2rem 3rem } .component-right-rail.variation-profile .component-right-rail-inner-wrap .component-right-rail-text-area { padding: 3rem } .component-right-rail.variation-profile .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-lable { font-family: gilroyBold } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap { padding: 3rem } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section:last-child { padding-bottom: 0 } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .right-rail-text { font-family: gilroyRegular; font-size: 1.4rem; line-height: 2.9 } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by { display: flex; margin-top: 3rem } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-picture { height: 5rem; margin-right: 2rem; width: 5rem } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-picture .component-asset-block img { border-radius: 100% } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by-name { font-size: 1.6rem; line-height: 1.6 } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by-role { line-height: 1.4 } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by-name.bold, .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by-role.bold { font-family: gilroySemibold } @media only screen and (min-width: 768px) { .component-right-rail { margin-bottom: 3.5rem } .component-right-rail .component-right-rail-inner-wrap { padding: 0 2.4rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-asset-wrap.turned-sticky { border-bottom: .1rem solid rgba(41,62,64,.2); margin-left: -2.4rem; padding-left: 2.4rem } .component-right-rail .component-right-rail-inner-wrap .component-asset-block { max-height: 8rem } .component-right-rail .component-right-rail-inner-wrap .component-right-rail-text-area .component-right-rail-header p.label-copy-bold { font-size: 2rem } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.paragraph-copy, .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.paragraph-copy { font-family: GilroyRegular; font-size: 1.6rem } .component-right-rail.variation-paragraph .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.testimonial-copy, .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text.testimonial-copy { font-size: 1.6rem } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by-name { font-size: 2rem } .component-right-rail.variation-testimonial .component-right-rail-inner-wrap .component-right-rail-text-area .right-rail-text-section .testimonial-by-role { font-size: 1.6rem } } @media only screen and (min-width: 1024px) { .component-right-rail .component-right-rail-inner-wrap .component-asset-block { max-height: 10rem } } .component-stats-blade { align-items: center; display: flex; min-height: 27.9rem; padding: 2.4rem 0; position: relative } .component-stats-blade.two-items-variation { min-height: auto } .component-stats-blade .comp-full-bleed-bg-color { background-color: #f7f7f7 } .component-stats-blade .component-sb-item { padding-bottom: 2.4rem; width: 100% } .component-stats-blade .component-sb-item:last-child { padding-bottom: 0 } .component-stats-blade .component-sb-item h2, .component-stats-blade .component-sb-item p { margin: 0 } .component-stats-blade .component-sb-item span.numeric-symbol { font-size: 50%; padding-left: .3rem } .component-stats-blade .component-sb-item .component-sb-stat { align-items: center; display: flex; padding-bottom: .8rem } .component-stats-blade .component-sb-item .component-sb-stat .stats-icon { height: 4rem; margin-right: .6rem; width: 4rem } .component-stats-blade .component-sb-item .component-sb-stat .stats-icon img, .component-stats-blade .component-sb-item .component-sb-stat .stats-icon svg { height: 100%; width: 100% } .component-stats-blade .component-sb-content { flex-direction: column } @media only screen and (min-width: 768px) { .component-stats-blade { min-height: 11.9rem; padding: 2.1rem 0 } .component-stats-blade .component-sb-content { align-items: top; flex-direction: row; flex-wrap: nowrap; margin: auto; max-width: 83.333333% } .component-stats-blade .component-sb-item { margin-right: 15%; padding-bottom: 0 } .component-stats-blade .component-sb-item:last-child { margin-right: 0 } .component-stats-blade.two-items-variation .component-sb-item { margin-right: 0; padding-right: 0 } .component-stats-blade.two-items-variation .component-sb-item:last-child { margin-right: 0; transform: translate(1.5rem) } .component-stats-blade.two-items-variation .component-sb-item .component-sb-descriptor { padding-right: 50% } } @media only screen and (min-width: 1024px) { .component-stats-blade { min-height: 20rem; padding: 3.2rem 0 } .component-stats-blade.two-items-variation .component-sb-item { padding-right: 0 } .component-stats-blade.two-items-variation .component-sb-item:last-child { transform: translate(2rem) } } @media only screen and (min-width: 1700px) { .component-stats-blade .component-sb-content { max-width: 66.666667% } .component-stats-blade .component-sb-item .component-sb-stat .stats-icon { height: 6.5rem; width: 6.5rem } } body.page-print-mode { margin: 0 auto; width: 102.4rem } img.page-print-version { position: absolute; top: 0 } .component-copy-block-intro { position: relative } .component-copy-block-intro h3 { font-family: GilroyRegular } .component-copy-block-intro h3 a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: auto auto; background-size: .2rem .2rem; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } .component-copy-block-intro h3 a:hover { background-size: 100% 100% } .component-copy-block-intro .comp-full-bleed-bg-color:before { content: ""; height: 100%; left: -1000%; position: absolute; width: 5000% } .component-copy-block-intro .component-cbi-wrapper { padding-bottom: 4rem; padding-top: 6rem } @media only screen and (min-width: 768px) { .component-copy-block-intro.background-full-bleed-left .comp-full-bleed-bg-color:before { left: -4990% } } @media only screen and (min-width: 1024px) { .component-copy-block-intro { max-width: calc(87.5% + 3.5rem) } .component-copy-block-intro .component-cbi-wrapper { padding-bottom: 4.8rem; padding-left: calc(13% + 1rem); padding-top: 8rem } } @media only screen and (min-width: 1700px) { .component-copy-block-intro .component-cbi-wrapper { padding-left: calc(27.5% + 1rem) } } .component-lf-promo { margin: auto auto auto -2rem; position: relative; transform: none; width: calc(100% + 4rem) } .component-lf-promo.top-padding-large .content-lf-promo-item-container { padding-top: 6rem !important } .component-lf-promo.top-padding-0 .content-lf-promo-item-container { padding-top: 0 !important } .component-lf-promo.bottom-padding-large .content-lf-promo-item-container { padding-bottom: 6rem !important } .component-lf-promo.bottom-padding-0 .content-lf-promo-item-container { padding-bottom: 0 !important } .component-lf-promo .content-lf-promo-container { display: flex; margin: auto } .component-lf-promo .cta-component.cta-rectangle-box { margin-right: 3rem } .component-lf-promo .content-lf-promo-item { position: relative; width: 100% } .component-lf-promo .content-lf-promo-item .content-lf-promo-item-container { margin: 0 auto; max-width: 170rem; padding: 0 2rem 2.4rem; position: relative; width: 100% } .component-lf-promo .content-lf-promo-item .content-lf-promo-item-background { background-position: 100% 100% !important; background-repeat: no-repeat !important; background-size: contain !important; bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column { padding: 0; position: relative } .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block { line-height: 0; margin-left: -2rem; width: calc(100% + 4rem) } .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block img, .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block svg, .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block video { max-width: 100%; width: auto; width: 100% } .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block .video-js, .component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block .video-js video { height: auto } .component-lf-promo .content-lf-promo-item .content-lf-promo-text-column { padding: 2.4rem 0 0; position: relative } .component-lf-promo .content-lf-promo-item .content-lf-promo-text-column .content-lf-promo-cta-section { margin-top: .6rem } .component-lf-promo .content-lf-promo-item .content-lf-promo-icon-block { margin: 0 0 .8rem; max-height: 3.8rem; max-width: 3.8rem } .component-lf-promo .content-lf-promo-item p { display: none; margin: 1.6rem 0 1rem } .component-lf-promo .content-lf-promo-item .cta-component.cta-text-arrow:last-of-type { margin-right: 0 } .component-lf-promo .content-lf-promo-item .cta-component.cta-text-arrow:last-of-type a { margin-right: 0; white-space: nowrap } .component-lf-promo .content-lf-promo-item .cta-component.cta-text-arrow:last-of-type a .cta-title-link-arrow { position: absolute } .component-lf-promo.variation-stacked-items .content-lf-promo-container { flex-direction: column } .component-lf-promo.text-over-image { -moz-align-items: center; -o-align-items: center; -webkit-align-items: center; display: flex; margin-left: -2rem; min-height: 18.5rem; width: calc(100% + 4rem) } .component-lf-promo.text-over-image .content-lf-promo-item-container { padding-bottom: 0 } .component-lf-promo.text-over-image .content-lf-promo-container { padding-bottom: 3.2rem; padding-top: 3.2rem; width: 100% } .component-lf-promo.text-over-image .content-lf-promo-asset-column { display: none } .component-lf-promo.text-over-image .content-lf-promo-text-column { padding-top: 0 } .component-lf-promo.text-over-image .content-lf-promo-text-column .content-lf-text-section { padding-right: calc(15% + 1rem) } .component-lf-promo.text-over-image .content-lf-promo-text-column .content-lf-text-section h5 { font-size: 2rem; line-height: 2.6rem } .component-lf-promo.text-over-image .content-lf-promo-text-column .content-lf-promo-cta-section { margin-top: 1.4rem } .component-lf-promo.text-over-image .content-lf-promo-item-background { height: 100%; overflow: hidden; position: absolute; right: 0; width: 100% } .component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block { height: 100% } .component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block img, .component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block svg, .component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block video { height: 100%; max-width: none; position: absolute; right: 0; width: auto } .component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block .video-js .vjs-tech { left: unset } .component-lf-promo.text-over-image .comp-full-bleed-bg-color:before { content: ""; display: block; height: 100%; left: -40px; position: absolute; width: 100% } @media(min-width: 768px) { section.component-lf-promo { margin-left: -4rem; min-height: 15.8rem; width: calc(100% + 4rem) } section.component-lf-promo .content-lf-promo-item .content-lf-promo-item-container { align-items: center; display: flex; justify-content: space-between; max-width: 170rem; padding: 0; width: 100% } section.component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column { align-items: stretch; overflow: hidden; padding: 0; width: calc(50% + 1rem) } section.component-lf-promo .content-lf-promo-item .content-lf-promo-text-column { align-items: stretch; padding: 1.6rem; width: 50% } section.component-lf-promo .content-lf-promo-item.image-on-right .content-lf-promo-item-container { flex-direction: row-reverse } section.component-lf-promo .content-lf-promo-item.image-on-right .content-lf-promo-asset-column { padding: 0 1.5rem 0 0 } section.component-lf-promo .content-lf-promo-item.image-on-right .content-lf-promo-text-column { padding: 0 0 0 1.5rem } section.component-lf-promo .content-lf-promo-item .content-lf-text-section p { display: none } section.component-lf-promo.variation-stacked-items .content-lf-promo-container { flex-direction: row } section.component-lf-promo.variation-stacked-items .content-lf-promo-item { flex-direction: column; flex-grow: 0; flex-shrink: 0; max-width: 50% } section.component-lf-promo.variation-stacked-items .content-lf-promo-item .content-lf-promo-item-container { display: flex; flex-direction: column; max-width: 85rem } section.component-lf-promo.variation-stacked-items .content-lf-promo-item .content-lf-promo-asset-column { padding: 0 0 3.2rem; width: 100% } section.component-lf-promo.variation-stacked-items .content-lf-promo-item .content-lf-promo-text-column { padding: 0; width: 100% } section.component-lf-promo.variation-stacked-items .content-lf-promo-item:nth-of-type(odd) .content-lf-promo-item-container { margin: 0 0 0 auto; padding-right: 1.5rem } section.component-lf-promo.variation-stacked-items .content-lf-promo-item:nth-of-type(2n) .content-lf-promo-item-container { margin: 0 auto 0 0; padding-left: 1.5rem } section.component-lf-promo.text-over-image { margin-left: 0; min-height: 20.5rem; width: 100% } section.component-lf-promo.text-over-image .content-lf-promo-item-container { padding-left: 0; padding-right: 0 } section.component-lf-promo.text-over-image .content-lf-promo-text-column { padding: 0; width: 100% } section.component-lf-promo.text-over-image .content-lf-promo-text-column .content-lf-text-section { padding-right: calc(15% + 2rem) } section.component-lf-promo.text-over-image .content-lf-promo-text-column .content-lf-text-section h5 { font-size: 2.2rem; line-height: 2.86rem } section.component-lf-promo.text-over-image .content-lf-promo-item-background { height: 100%; position: absolute; right: 0 } section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block { height: 100% } section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block img, section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block svg, section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block video { height: 100%; max-width: none; width: auto } } @media(min-width: 1024px) { section.component-lf-promo { margin-left: 0; min-height: 24rem; transform: translate(calc(-12.5% + 3.5rem)); width: 100% } section.component-lf-promo.top-padding-large .content-lf-promo-item-container { padding-top: 8rem !important } section.component-lf-promo.bottom-padding-large .content-lf-promo-item-container { padding-bottom: 8rem !important } section.component-lf-promo .content-lf-promo-item .content-lf-promo-item-container { padding-left: 0 } section.component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column { align-content: center; align-items: center; display: flex; justify-content: center; position: relative; width: calc(50% + 4.5rem) } section.component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block { height: 100%; margin-left: 0; position: absolute } section.component-lf-promo .content-lf-promo-item .content-lf-promo-icon-block { margin: 0 0 1.6rem; max-height: 5.5rem; max-width: 5.5rem } section.component-lf-promo .content-lf-promo-item .content-lf-text-section p { display: block; margin-bottom: 0; margin-top: 1.6rem } section.component-lf-promo .content-lf-promo-item .content-lf-promo-text-column { padding: 3.2rem 2.4rem } section.component-lf-promo.variation-stacked-items .content-lf-promo-item .content-lf-promo-item-container { flex-direction: column } section.component-lf-promo.variation-stacked-items .content-lf-promo-item .content-lf-promo-asset-column { padding: 0 0 4rem } section.component-lf-promo.variation-stacked-items .content-lf-promo-item:nth-of-type(odd) .content-lf-promo-item-container { padding-right: 2rem } section.component-lf-promo.variation-stacked-items .content-lf-promo-item:nth-of-type(2n) .content-lf-promo-item-container { padding-left: 2rem } section.component-lf-promo.text-over-image { max-width: calc(87.5% + 3.5rem); min-height: 35.7rem; transform: none } section.component-lf-promo.text-over-image .content-lf-promo-item-background { height: 100%; position: absolute; right: 0 } section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block { height: 100% } section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block img, section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block svg, section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block video { height: 100%; max-width: none; width: auto } section.component-lf-promo.text-over-image .content-lf-promo-asset-column { display: none } section.component-lf-promo.text-over-image .content-lf-promo-item-container { padding-left: 0; padding-right: calc(12.5% + 1rem) } section.component-lf-promo.text-over-image .content-lf-promo-container { padding-bottom: 4rem; padding-top: 4rem } section.component-lf-promo.text-over-image .content-lf-text-section p { margin-top: .8rem } section.component-lf-promo.text-over-image .content-lf-promo-item .content-lf-promo-text-column { padding: 0 0 0 16.5% } section.component-lf-promo.text-over-image .content-lf-promo-item .content-lf-promo-text-column h5 { font-size: 2.8rem; line-height: 3.64rem } } @media(min-width: 1700px) { section.component-lf-promo { margin-left: -4rem; min-height: 31rem; transform: none; width: calc(100% - 6rem) } section.component-lf-promo .content-lf-promo-item .content-lf-promo-text-column { padding: 4rem; width: 50% } section.component-lf-promo .content-lf-promo-item .content-lf-promo-text-column .content-lf-promo-cta-section { margin-top: 1.4rem } section.component-lf-promo .content-lf-promo-item p { margin: 0 0 1.2rem } section.component-lf-promo .content-lf-promo-item .content-lf-promo-asset-column .component-asset-block { margin-left: -2rem !important } section.component-lf-promo.text-over-image { min-height: 42.6rem } section.component-lf-promo.text-over-image .content-lf-promo-item-background { height: 100%; position: absolute; right: 0 } section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block { height: 100% } section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block img, section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block svg, section.component-lf-promo.text-over-image .content-lf-promo-item-background .component-asset-block video { height: 100%; max-width: none; width: auto } section.component-lf-promo.text-over-image .content-lf-promo-text-column { width: 100% } section.component-lf-promo.text-over-image .content-lf-promo-text-column p { margin-top: 1.6rem } section.component-lf-promo.text-over-image .content-lf-promo-text-column h5 { font-size: 3.6rem; line-height: 4.68rem } section.component-lf-promo.text-over-image .content-lf-promo-item-container { padding-left: calc(12.5% + 1.5rem) } section.component-lf-promo.text-over-image .content-lf-promo-cta-section { margin-top: 2.2rem } section.component-lf-promo.text-over-image .content-lf-promo-item .content-lf-promo-text-column { padding-left: 0 } } @media(max-width: 767px) { section.component-lf-promo.show-description-mobile .content-lf-promo-text-column .content-lf-text-section p { display: block } section.component-lf-promo.hide-background-img-mobile .content-lf-promo-item-background { display: none } } .component-long-form-copy-block { background-position: 50%; background-repeat: no-repeat; background-size: cover; padding-left: 0; padding-right: 0 } .component-long-form-copy-block .site-width-1700 { padding-left: 0; padding-right: 0 } .component-long-form-copy-block .site-width-1700.padding-top-80 { padding-top: 80px } .component-long-form-copy-block .site-width-1700.padding-top-48 { padding-top: 48px } .component-long-form-copy-block .site-width-1700.padding-top-0 { padding-top: 0 } .component-long-form-copy-block .site-width-1700.padding-bottom-80 { padding-bottom: 80px } .component-long-form-copy-block .site-width-1700.padding-bottom-48 { padding-bottom: 48px } .component-long-form-copy-block .site-width-1700.padding-bottom-0 { padding-bottom: 0 } .component-long-form-copy-block .site-width-1700 > :first-child { margin-top: 0; padding-top: 0 } .component-long-form-copy-block .site-width-1700 > :last-child { margin-bottom: 0; padding-bottom: 0 } .component-long-form-copy-block li, .component-long-form-copy-block p { color: #293e40 } .component-long-form-copy-block h4 { font-family: GilroyRegular; margin-bottom: 32px } .component-long-form-copy-block h4 b { font-family: GilroyBold } .component-long-form-copy-block h2 { padding-top: 20px } .component-long-form-copy-block p { margin-bottom: 34px } .component-long-form-copy-block ol { list-style-type: none; margin-left: 0; padding-left: 5px } .component-long-form-copy-block ol:first-child { counter-reset: customlistcounter } .component-long-form-copy-block ol li { counter-increment: customlistcounter; list-style-position: outside; padding-bottom: 32px; padding-left: 52px; position: relative } .component-long-form-copy-block ol li:before { content: counter(customlistcounter) " "; font-weight: 700; left: 15px; position: absolute; top: 0; width: 3em } .component-long-form-copy-block ul li { list-style: disc; list-style-position: outside; padding-bottom: 32px; padding-left: 24px } .component-long-form-copy-block ul li.bullet-check { list-style-image: url(servicenow-www-pagelibs-v2/images/bullet-check.png) } .component-long-form-copy-block .tooltip { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: 0 0; border-bottom: 2px dashed #81b5a1; display: inline-block; position: relative; transition: all .25s ease-out; z-index: 90 } .component-long-form-copy-block .tooltip:hover { background-size: 100% 100% } .component-long-form-copy-block .tooltip .tooltiptext { background-color: #fff; border: 1px solid rgba(41,62,64,.25); bottom: 130%; display: flex; display: none; justify-content: center; max-width: 280px; position: absolute; width: 50vw; z-index: 1 } .component-long-form-copy-block .tooltip .tooltiptext.right { right: 0 !important } .component-long-form-copy-block .tooltip .tooltiptext.left { left: 0 !important } .component-long-form-copy-block .tooltip .tooltiptext:after { border-color: #fff transparent transparent } .component-long-form-copy-block .tooltip .tooltiptext .tooltip-body { background-color: #fff; color: #293e40 !important; display: inline-block; padding: 24px; width: 100%; z-index: 1 } .component-long-form-copy-block .tooltip .tooltiptext .tooltip-arrow { background-color: #fff; border: 1px solid rgba(41,62,64,.25); bottom: -5px; height: 25px; position: absolute; transform: rotate(45deg); width: 25px } .component-long-form-copy-block .tooltip .tooltiptext img { opacity: .3; padding: 0 15px; position: absolute; right: 0; top: 10px; z-index: 10000 } .component-long-form-copy-block .tooltip .tooltiptext:hover img { opacity: 1 } @media(max-width: 768px) { .component-long-form-copy-block .site-width-1700.padding-top-mobile-60 { padding-top: 60px } .component-long-form-copy-block .site-width-1700.padding-top-mobile-0 { padding-top: 0 } .component-long-form-copy-block .site-width-1700.padding-bottom-mobile-60 { padding-bottom: 60px } .component-long-form-copy-block .site-width-1700.padding-bottom-mobile-0 { padding-bottom: 0 } .component-long-form-copy-block h4 { margin-bottom: 16px } .component-long-form-copy-block h2 { padding-top: 16px } .component-long-form-copy-block ul li { padding-bottom: 27.2px; padding-left: 8px } .component-long-form-copy-block ol li { padding-bottom: 27.2px; padding-left: 38px } .component-long-form-copy-block ol li:before { left: 20px } } @media(min-width: 768px) { section.component-long-form-copy-block { padding-left: 0; padding-right: 13% } } @media(min-width: 1024px) { section.component-long-form-copy-block { padding-left: 13%; padding-right: 0 } } @media(min-width: 1700px) { section.component-long-form-copy-block { padding-left: 26%; padding-right: 10% } } .component-long-form-call-out .call-out-h2 { margin-bottom: 32px; margin-top: 32px } .component-long-form-call-out .call-out-h2.with-image { margin-top: 0 } .component-long-form-call-out .call-out-h2 h2 { margin-bottom: 0; margin-top: 0 } .component-long-form-call-out .call-out-img { display: none; margin-bottom: 24px; margin-top: 32px } .component-long-form-call-out .call-out-img.with-image { display: flex } .component-long-form-call-out .call-out-img img { align-self: center; max-width: 100% } .component-long-form-call-out .flex-box-container .call-out-h2, .component-long-form-call-out .flex-box-container .call-out-img { padding-left: 0; padding-right: 0 } .component-long-form-call-out .flex-box-container .call-out-img { padding-right: 1rem } .component-long-form-call-out .flex-box-container .call-out-img img, .component-long-form-call-out .flex-box-container .call-out-img svg, .component-long-form-call-out .flex-box-container .call-out-img video { width: 100% } @media only screen and (min-width: 768px) { .component-long-form-call-out .flex-box-container { align-items: center } .component-long-form-call-out .flex-box-container.has-animation { left: -100%; position: relative } .component-long-form-call-out .flex-box-container .call-out-h2 { flex: 0 0 calc(75% + 2rem); margin-left: calc(12.5% + .5rem); max-width: calc(75% + 2rem) } .component-long-form-call-out .flex-box-container .call-out-img.with-image { flex: 0 0 calc(25% + 1rem); margin-left: -3.3rem; max-width: calc(25% + 1rem); padding-right: 0 } .component-long-form-call-out .flex-box-container .call-out-h2.with-image { flex: 0 0 calc(75% + 2rem); max-width: calc(75% + 2rem); padding-left: 3rem; padding-right: 0 !important } .component-long-form-call-out .flex-box-container .with-image { align-items: center } .component-long-form-call-out.show-flex-container .flex-box-container { left: 0; opacity: 1; transition: all 1s; transition-delay: .25s; transition-timing-function: ease } .component-long-form-call-out .call-out-h2 { margin-left: 8.333333%; padding-right: 0 } .component-long-form-call-out .call-out-h2.with-image { margin-left: 0; margin-top: 32px; padding-right: 1.5rem; position: relative } .component-long-form-call-out .call-out-img { margin-bottom: 32px; margin-top: 32px; padding-right: 0; padding-top: 0 } } @media only screen and (min-width: 1024px) { .component-long-form-call-out .call-out-h2 { margin-bottom: 48px; margin-top: 48px } .component-long-form-call-out .call-out-h2.with-image, .component-long-form-call-out .call-out-img { margin-bottom: 32px; margin-top: 32px } .component-long-form-call-out .flex-box-container .call-out-h2 { flex: 0 0 calc(75% - 1rem); max-width: calc(75% - 1rem) } .component-long-form-call-out .flex-box-container .call-out-img.with-image { flex: 0 0 calc(25% + 1rem); margin-left: -4rem; max-width: calc(25% + 1rem); padding-right: 0 } .component-long-form-call-out .flex-box-container .call-out-h2.with-image { flex: 0 0 calc(75% + 3rem); max-width: calc(75% + 3rem); padding-left: 4rem } } @media only screen and (min-width: 1700px) { .component-long-form-call-out .call-out-h2 { margin-bottom: 80px; margin-top: 80px; padding-right: 0 } .component-long-form-call-out .call-out-h2.with-image { margin-bottom: 80px; margin-left: 0; margin-top: 80px; padding-right: 0 } .component-long-form-call-out .call-out-img { margin-bottom: 80px; margin-top: 80px } .component-long-form-call-out .flex-box-container .call-out-h2, .component-long-form-call-out .flex-box-container .call-out-h2.with-image { flex: 0 0 calc(62.5% + 2rem); max-width: calc(62.5% + 2rem) } } .component-visual-container .no-left-padding { padding-left: 0 } @media screen and (min-width: 1700px) { .component-visual-container .no-right-padding-xlg { padding-right: 0 } } .component-visual-container p { margin-bottom: 0; margin-top: 8px } .component-visual-container .full-bleed { padding-left: 0; padding-right: 0 } .component-visual-container .video { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .component-visual-container .video-container { height: 0; padding-bottom: 56.25%; position: relative; width: 100% } .component-visual-container .video-responsive { display: block; height: auto; width: 100% } .component-visual-container .img-zoom-overlay { background-color: rgba(41,62,64,.8); bottom: 0; display: none; height: 100%; left: 0; opacity: 0; overflow-y: scroll; position: fixed; right: 0; top: 0; transition: opacity 1s ease-in-out; -webkit-transition: opacity 1s ease-in-out; width: 100%; z-index: 9999 } .component-visual-container .img-zoom-overlay span.component-overlay-close-btn { position: fixed; right: 40px; top: 40px; z-index: 999 } .component-visual-container .img-zoom-overlay img:hover { cursor: -moz-zoom-out } .component-visual-container .img-zoom-overlay .asset-cont { overflow-y: auto } .component-visual-container .img-zoom-overlay.overlay-displayed { opacity: 1 } .component-visual-container .img-zoom-overlay .img-center-responsive { display: block; height: 100%; width: 100% } .component-visual-container img.zoom-overlay:hover { cursor: -moz-zoom-in } @media only screen and (min-width: 768px) { .component-visual-container .call-out-img { left: -50%; opacity: 0 } .component-visual-container.show-image-container .call-out-img { left: 0; opacity: 1; transition: all .7s; transition-delay: .25s } } .component-visual-container.wrap-text { padding-bottom: 24px; padding-top: 16px } @media screen and (min-width: 768px) { .component-visual-container.wrap-text { padding: 16px 24px 24px 0 } } @media screen and (min-width: 1700px) { .component-visual-container.wrap-text { padding: 24px 32px 40px 0 } } .no-scroll-body-overlay { overflow: hidden } .component-sra-scorecard { width: 100% } .component-sra-scorecard.empty { max-height: -moz-fit-content; max-height: fit-content } .component-sra-scorecard + .component-sra-scorecard:before { border-bottom: 3px solid rgba(41,62,64,.1); content: ""; display: block; margin: 0 auto; width: calc(100% - 4rem) } .component-sra-scorecard .single-card { background: #fff; width: 100% } .component-sra-scorecard .single-card .top { align-items: center; display: flex; padding: 4rem 1.5rem 3.2rem } .component-sra-scorecard .single-card .top .card-name { color: #293e40; font-family: GilroyBold; font-size: 2.8rem } .component-sra-scorecard .single-card .top .circle { height: 80px; margin-right: 2rem; width: 80px } .component-sra-scorecard .single-card .top .circle img { height: 100%; width: 100% } .component-sra-scorecard .single-card .top .info-icon { display: inline; margin-left: 1rem; position: relative; top: .2rem } .component-sra-scorecard .single-card .top .info-icon img { height: 100%; width: 100% } .component-sra-scorecard .single-card .top .info-icon:hover { cursor: pointer } .component-sra-scorecard .single-card .top .info-icon .tooltip { background: #bfd8ce; display: none; left: -13.5rem; padding: 4rem 3.2rem; position: absolute; top: 45px; white-space: normal; width: 41.2rem; z-index: 100 } .component-sra-scorecard .single-card .top .info-icon .tooltip .tooltip-arrow { border-color: transparent transparent #bfd8ce; border-style: solid; border-width: 0 12px 12px; height: 0; left: 13.5rem; position: absolute; top: -12px; -webkit-transform: rotate(1turn); width: 0 } .component-sra-scorecard .single-card .top .info-icon .tooltip .tooltip-close { height: 10px; position: absolute; right: 1rem; top: 1rem; width: 10px; z-index: 10000 } .component-sra-scorecard .single-card .top .info-icon .tooltip .tooltip-close:hover { opacity: 1 } .component-sra-scorecard .single-card .top .info-icon .tooltip .tooltip-close img { height: 100%; width: 100% } .component-sra-scorecard .single-card .top .info-icon.active .tooltip { display: inline-block } .component-sra-scorecard .single-card .top .info-icon.active.left .tooltip { left: -.9rem } .component-sra-scorecard .single-card .top .info-icon.active.left .tooltip .tooltip-arrow { left: .9rem } .component-sra-scorecard .single-card .top .info-icon.active.center .tooltip { left: -13.5rem } .component-sra-scorecard .single-card .top .info-icon.active.center .tooltip .tooltip-arrow { left: 13.5rem } .component-sra-scorecard .single-card .top .info-icon.active.right .tooltip { left: -34.9rem } .component-sra-scorecard .single-card .top .info-icon.active.right .tooltip .tooltip-arrow { left: 34.9rem } .component-sra-scorecard .single-card .bottom { padding: 0 2rem 4rem } .component-sra-scorecard .single-card .bottom.empty { padding: 0 2rem 2rem } .component-sra-scorecard .single-card .bottom .bottom-header { font: 1.4rem GilroyBold; line-height: 2.8rem } .component-sra-scorecard .single-card .bottom p { font-size: 1.4rem; line-height: 2.8rem; margin: 0 } .component-sra-scorecard .single-card .bottom p + .bottom-header { padding-top: 1.2rem } @media only screen and (max-width: 767px) { .component-sra-scorecard .single-card .top .info-icon .tooltip { padding: 3.2rem 3rem; width: 28.1rem } } @media only screen and (min-width: 321px)and (max-width:767px) { .component-sra-scorecard .single-card .top .info-icon.active.right .tooltip { left: -25.2rem } .component-sra-scorecard .single-card .top .info-icon.active.right .tooltip .tooltip-arrow { left: 25.2rem } } @media(min-width: 768px) { .component-sra-scorecard { flex-direction: row; padding-bottom: 8rem; width: 32% } .component-sra-scorecard + .component-sra-scorecard:before { content: none } .component-sra-scorecard .single-card .top { border-bottom: 3px solid rgba(41,62,64,.1); padding: 2.7rem 1.5rem } .component-sra-scorecard .single-card .top .circle { margin-right: 1.5rem } .component-sra-scorecard .single-card .top .card-name { font-size: 2.2rem } .component-sra-scorecard .single-card .top .info-icon { height: 18px; width: 18px } .component-sra-scorecard .single-card .top .info-icon .tooltip { left: -10rem } .component-sra-scorecard .single-card .top .info-icon .tooltip .tooltip-arrow { left: 10rem } .component-sra-scorecard .single-card .bottom { padding: 3.2rem 1.5rem 4rem } .component-sra-scorecard .single-card .bottom.empty { padding: 3.2rem 1.5rem } .component-sra-scorecard .single-card .bottom p + .bottom-header { padding-top: 1.6rem } } @media(min-width: 1024px) { .component-sra-scorecard .single-card .top { padding: 2rem 1.6rem } .component-sra-scorecard .single-card .top .circle { height: 125px; margin-right: 2rem; width: 125px } .component-sra-scorecard .single-card .top .card-name { font-size: 2.8rem } .component-sra-scorecard .single-card .top .info-icon { height: 24px; width: 24px } .component-sra-scorecard .single-card .bottom { padding: 3.2rem 2rem 4rem } .component-sra-scorecard .single-card .bottom.empty { padding: 3.2rem 2rem } .component-sra-scorecard .single-card .bottom .bottom-header, .component-sra-scorecard .single-card .bottom p { font-size: 1.6rem; line-height: 3rem } } @media(min-width: 1700px) { .component-sra-scorecard { max-width: 51.3rem } .component-sra-scorecard .single-card .top { padding: 4rem } .component-sra-scorecard .single-card .top .circle { height: 158px; width: 158px } .component-sra-scorecard .single-card .top .card-name { font-size: 3.6rem } .component-sra-scorecard .single-card .bottom { padding: 4rem 4rem 8rem } .component-sra-scorecard .single-card .bottom.empty { padding: 4rem } .component-sra-scorecard .single-card .bottom .bottom-header { font-size: 2.2rem; line-height: 4rem; padding-bottom: 1.6rem } } .component-sra-scorecard-container { background: #f7f7f7 } .component-sra-scorecard-container.site-width-1700 { padding-bottom: 25px; padding-left: 0; padding-right: 0 } .component-sra-scorecard-container .scorecard-container { align-items: stretch; display: flex; flex-direction: column; justify-content: space-between; padding: 3.5rem 0 0 } .component-sra-scorecard-container .section-header { padding: 5rem 1.5rem } .component-sra-scorecard-container .section-header .scorecard-header { color: #293e40; font-family: GilroyBold; font-size: 2.4rem; padding-bottom: 1rem } .component-sra-scorecard-container .section-header p.header-description { font-size: 1.6rem; line-height: 2.6rem; margin: 0 } .component-sra-scorecard-container .sra-scorecard-archives { background: #fff; margin-left: 20px; margin-right: 25px; padding: 80px 20px 80px 40px } @media(max-width: 768px) { .component-sra-scorecard-container .sra-scorecard-archives { margin-top: 30px } } .component-sra-scorecard-container .sra-scorecard-archives h5 { padding-bottom: 20px } .component-sra-scorecard-container .sra-scorecard-archives a { text-decoration: underline; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none } .component-sra-scorecard-container .sra-scorecard-archives .my-account-loading-layer { bottom: 0; display: none; left: 0; position: fixed; right: 0; top: 0 } .component-sra-scorecard-container .sra-scorecard-archives .my-account-loading-layer.show-loading-layer { display: block } .component-sra-scorecard-container .sra-scorecard-archives .my-account-loading-layer .my-account-loading-film { position: absolute } .component-sra-scorecard-container .sra-scorecard-archives .my-account-loading-layer .lds-roller-my-account { left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 11 } .component-sra-scorecard-container .my-account-loading-layer { position: fixed } @media(min-width: 768px) { .component-sra-scorecard-container .scorecard-container { flex-direction: row; padding: 4rem 1.5rem 0 } .component-sra-scorecard-container .section-header { padding-top: 5.9rem } .component-sra-scorecard-container .section-header .scorecard-header { font-size: 3.6rem } .component-sra-scorecard-container .section-header p.header-description { font-size: 2.2rem } } @media(min-width: 1024px) { .component-sra-scorecard-container .scorecard-container, .component-sra-scorecard-container .section-header { padding: 5rem 2rem 0 } .component-sra-scorecard-container .section-header .scorecard-header { font-size: 4.8rem; padding-bottom: 1.5rem } } @media(min-width: 1700px) { .component-sra-scorecard-container .scorecard-container { padding-top: 5.6rem } .component-sra-scorecard-container .section-header p.header-description { font-size: 2.2rem; line-height: 4rem } } .component-progress-bar .percentage-text { margin-bottom: 0; margin-top: 0 } .component-progress-bar .progress-bar { margin-bottom: 8px; margin-top: 16.2px; position: relative } .component-progress-bar .progress-bar .progress-bar-bg { background: rgba(0,0,0,.1); height: 8px } .component-progress-bar .progress-bar .progress-bar-percentage { background: #81b5a1; height: 8px; position: absolute; top: 0; width: 38% } .component-progress-bar .progress-bar .progress-bar-percentage-tip { border: 0 0 8px 7px; border-color: #81b5a1 transparent transparent #81b5a1; border-style: solid; height: 0; left: 38%; position: absolute; top: 0 } .component-assessment-overlay { padding: 2.4rem 1.7rem } .component-assessment-overlay h3 { font-family: GilroyRegular; font-size: 1.8rem; width: calc(100% - 2.5rem) } .component-assessment-overlay .component-overlay-close-btn { position: absolute; right: 1.7rem; top: 2.4rem } .component-assessment-overlay .component-overlay-close-btn svg { height: 1.5rem; opacity: .7; width: 1.5rem } .component-assessment-overlay .component-overlay-close-btn svg g { stroke: #999 } .component-assessment-overlay .component-overlay-close-btn:hover { cursor: pointer } .component-assessment-overlay .component-overlay-close-btn:hover svg { opacity: 1 } .component-assessment-overlay .assessment-overlay-body { padding: 2rem 0 } .component-assessment-overlay .assessment-overlay-body .question-container { margin: 0 0 4rem } .component-assessment-overlay .assessment-overlay-body .question-text { position: relative } .component-assessment-overlay .assessment-overlay-body .question-text, .component-assessment-overlay .assessment-overlay-body .tooltip-reference { display: inline; font-family: GilroyBold; font-size: 2rem } .component-assessment-overlay .assessment-overlay-body .tooltip-reference { white-space: nowrap } .component-assessment-overlay .assessment-overlay-body .tooltip-reference.left .overlay-tooltip { left: 0; min-width: 23rem; right: unset } .component-assessment-overlay .assessment-overlay-body .tooltip-reference.left .overlay-tooltip .overlay-tooltip-arrow { left: 1rem } .component-assessment-overlay .assessment-overlay-body .tooltip-reference.center .overlay-tooltip { min-width: 23rem; width: 100% } .component-assessment-overlay .assessment-overlay-body .tooltip-reference.center .overlay-tooltip .overlay-tooltip-arrow { left: 13rem } .component-assessment-overlay .assessment-overlay-body .tooltip-reference.right .overlay-tooltip { left: unset; right: 0 } .component-assessment-overlay .assessment-overlay-body .tooltip-reference.right .overlay-tooltip .overlay-tooltip-arrow { left: unset; right: 2rem } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip { background: #bfd8ce; display: none; padding: 4rem 3.2rem; position: absolute; top: 6.2rem; width: 32rem; z-index: 100 } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip .overlay-tooltip-arrow { border-color: transparent transparent #bfd8ce; border-style: solid; border-width: 0 1.2rem 1.2rem; height: 0; left: 13.5rem; position: absolute; top: -1.2rem; transform: rotate(1turn); width: 0 } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip .overlay-tooltip-body { font-family: GilroyRegular; font-size: 1.6rem; line-height: 1.8rem; white-space: normal } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip.active { display: inline-block } .component-assessment-overlay .assessment-overlay-body ul.answer-choices { -webkit-margin-after: 0; -webkit-margin-before: 0; -webkit-padding-start: 0; margin-block-end: 0; margin-block-start: 0; padding-inline-start: 0 } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li { border: .2rem solid #81b5a1; box-sizing: border-box; position: relative } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text { left: 8rem; position: absolute; top: 2.25rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text.selected { color: #fff } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-number { color: #81b5a1; font-size: 2.8rem; height: 100%; padding: 1.5rem 3rem; width: 100% } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-number.selected { background: #81b5a1; color: #fff } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li + li { margin-top: 1.5rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover { background: #81b5a1; cursor: pointer } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover .answer-number, .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover .answer-text { color: #fff } .component-assessment-overlay .submit.cta-component { margin: 2.4rem 0 0 } .component-assessment-overlay .submit.hidden { visibility: hidden } .component-assessment-overlay .cta-component { margin-bottom: 2.4rem; margin-top: 0 } .component-assessment-overlay .cta-component.cta-rectangle-box a { background-color: #293e40; border: 0; padding: 1.25rem 3.5rem } .component-assessment-overlay .cta-component.cta-rectangle-box a .cta-text { color: #fff } .component-assessment-overlay .cta-component.cta-rectangle-box a .cta-background-full { background-color: #81b5a1 } .component-assessment-overlay .assessment-overlay-footer { font-family: GilroySemiBold; font-size: 2rem; line-height: 1.2rem } .component-assessment-overlay .assessment-overlay-footer span { opacity: .2 } .component-assessment-overlay .assessment-overlay-footer .enabled { opacity: .8 } .component-assessment-overlay .assessment-overlay-footer .enabled:hover { cursor: pointer } .component-assessment-overlay .alert-overlay { background: #fff; display: block; height: 28.5rem; left: 50%; margin-left: -15rem; margin-top: -14rem; padding: 3.2rem 1.5rem; position: fixed; top: 50%; width: 30rem; z-index: 1105 } .component-assessment-overlay .alert-overlay:after { background: rgba(42,63,65,.85); bottom: 0; content: ""; left: 0; position: fixed; right: 0; top: 0; z-index: -2 } .component-assessment-overlay .alert-overlay:before { background: #fff; bottom: 0; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-assessment-overlay .alert-overlay.hidden { display: none } .component-assessment-overlay .alert-overlay .alert-header { color: #293e40; font-family: GilroyBold; font-size: 2.2rem; padding-bottom: .4rem } .component-assessment-overlay .alert-overlay .alert-text { font-family: GilroyRegular; font-size: 2rem } .component-assessment-overlay .my-account-loading-layer { bottom: 0; display: none; left: 0; position: fixed; right: 0; top: 0 } .component-assessment-overlay .my-account-loading-layer.show-loading-layer { display: block } .component-assessment-overlay .my-account-loading-layer .my-account-loading-film { position: absolute } .component-assessment-overlay .my-account-loading-layer .lds-roller-my-account { left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 11 } @media only screen and (max-width: 767px) { .component-assessment-overlay .assessment-overlay-body .overlay-tooltip { padding: 3.2rem 3rem; width: 26rem } } @media only screen and (max-width: 320px) { .component-assessment-overlay .assessment-overlay-body .question-container { width: 28rem } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip { left: 0; top: 4rem } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip .overlay-tooltip-arrow { left: 18rem } } @media only screen and (min-width: 321px)and (max-width:767px) { .component-assessment-overlay .assessment-overlay-body .overlay-tooltip { left: 0; top: 4rem } .component-assessment-overlay .assessment-overlay-body .overlay-tooltip .overlay-tooltip-arrow { left: 18rem } } @media only screen and (min-width: 768px) { .component-assessment-overlay { padding: 6rem 3rem } .component-assessment-overlay h3 { font-family: GilroyBold; font-size: 2.2rem } .component-assessment-overlay .component-overlay-close-btn { right: 3rem; top: 3rem } .component-assessment-overlay .overlay-tooltip { left: -10rem; top: 5rem } .component-assessment-overlay .overlay-tooltip .overlay-tooltip-arrow { left: 10rem } .component-assessment-overlay .assessment-overlay-body { padding: 6rem 0 2.4rem } .component-assessment-overlay .assessment-overlay-body .question-container { margin: 0 0 4rem; width: 70.8rem } .component-assessment-overlay .assessment-overlay-body .question-text, .component-assessment-overlay .assessment-overlay-body .tooltip-reference { font-size: 2.8rem } .component-assessment-overlay .alert-overlay { margin-left: -31rem; padding: 3.2rem 3.2rem 5.6rem; width: 60rem } .component-assessment-overlay .alert-overlay .alert-header { font-size: 2.8rem } .component-assessment-overlay .alert-overlay .alert-text { font-size: 2.8rem; padding-bottom: 1.2rem } .component-assessment-overlay .alert-overlay .close-btn, .component-assessment-overlay .alert-overlay .continue-btn { display: inline-block } .component-assessment-overlay .submit.cta-component { margin: 4rem 0 0 } .component-assessment-overlay .alert-overlay { height: 30.3rem; margin-top: -15.5rem } } @media only screen and (min-width: 1024px) { .component-assessment-overlay { padding: 8rem 4rem } .component-assessment-overlay .answer-section { display: table-cell } .component-assessment-overlay h3 { font-size: 2.8rem } .component-assessment-overlay .component-overlay-close-btn { right: 4rem; top: 4rem } .component-assessment-overlay .assessment-overlay-body { padding: 6rem 0 } .component-assessment-overlay .assessment-overlay-body .question-container { margin: 0 0 10.5rem; width: 94.4rem } .component-assessment-overlay .assessment-overlay-body .question-text, .component-assessment-overlay .assessment-overlay-body .tooltip-reference { font-size: 3.6rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices { display: flex; padding-right: 0 } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li { display: inline-block; height: 9.7rem; width: 17.3rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li + li { margin-left: 2rem; margin-top: 0 } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text { color: #fff; font-size: 1.8rem; height: 5rem; left: 0; top: -5.5rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text.multiscale { color: #293e40 } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text.selected { color: #81b5a1; font-family: GilroyBold } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text.selected.multiscale { color: #81b5a1 } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:first-child .answer-text, .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:last-child .answer-text { color: #293e40 } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:first-child .answer-text.selected, .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:last-child .answer-text.selected { color: #81b5a1; font-family: GilroyBold } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-number { align-items: center; display: flex; font-size: 5rem; justify-content: center } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover { background: #81b5a1; cursor: pointer } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover .answer-number { color: #fff } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover .answer-text:first-child, .component-assessment-overlay .assessment-overlay-body ul.answer-choices li:hover .answer-text:last-child { color: #81b5a1; font-family: GilroyBold } .component-assessment-overlay .submit { float: right } .component-assessment-overlay .submit.cta-component { margin-top: 3.3rem } .component-assessment-overlay .assessment-overlay-footer { margin-top: 1rem } .component-assessment-overlay .alert-overlay { height: 35rem; margin-left: -39.4rem; margin-top: -17.5rem; width: 76.8rem } .component-assessment-overlay .alert-overlay .alert-header { font-size: 4.8rem } } @media only screen and (min-width: 1700px) { .component-assessment-overlay .answer-section { display: table-cell } .component-assessment-overlay h3 { font-size: 3.6rem } .component-assessment-overlay .assessment-overlay-body { padding: 8rem 0 6.4rem } .component-assessment-overlay .assessment-overlay-body .question-container { margin: 0 0 12.5rem; width: 161.6rem } .component-assessment-overlay .assessment-overlay-body .question-text, .component-assessment-overlay .assessment-overlay-body .tooltip-reference { font-size: 4.7rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li { height: 13.2rem; width: 23.4rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li + li { margin-left: 4rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-text { font-size: 2.2rem } .component-assessment-overlay .assessment-overlay-body ul.answer-choices li .answer-number { font-size: 6.4rem } } .component-filter-new { margin-bottom: 1.6rem; margin-top: 4rem; width: 100% } .component-filter-new .remove-title { display: none } .component-filter-new .show-title { display: block } .component-filter-new .filter-container { margin-top: .8rem } .component-filter-new .opacity-60 .filter-chevron, .component-filter-new .opacity-60 .filter-select-icon { max-width: 30px; opacity: .6 } .component-filter-new .filter-select-box { background: #fff; border: .1rem solid #293e40; cursor: pointer; display: none; height: 4.7rem; margin: auto; min-height: 5rem; position: relative; width: 100% } .component-filter-new .filter-select-box .contents-row { align-items: center; display: flex; height: 100%; justify-content: space-around; padding: 0 1.6rem } .component-filter-new .filter-select-box:hover .filter-chevron, .component-filter-new .filter-select-box:hover .filter-select-icon { opacity: 1 } .component-filter-new .filter-select-box .filter-select-icon { display: inline-block; padding-right: .8rem; vertical-align: middle } .component-filter-new .filter-select-box .filter-select-icon .component-asset-block .cus-logo-svg { padding-top: .2rem } .component-filter-new .filter-select-box .remove-icon { display: none } .component-filter-new .filter-select-box .show-icon { display: block } .component-filter-new .filter-select-box .filter-select-text { align-items: center; color: #333; display: flex; flex: auto; font-family: GilroySemiBold; font-size: 1.6rem; height: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .component-filter-new .filter-select-box .filter-chevron { float: right; margin-left: 4rem; vertical-align: middle } .component-filter-new .filter-select-box .filter-select-chevron { float: right; max-width: 13px } .component-filter-new .filter-select-box .rotate { transition: all .1s linear } .component-filter-new .filter-select-box .rotate.down { transform: rotate(180deg) } .component-filter-new .filter-options { border: .1rem solid #293e40; display: none; position: absolute; z-index: 41 } .component-filter-new .filter-options .filter-category-group .filter-option-value, .component-filter-new .filter-options .filter-category-title, .component-filter-new .filter-options .filter-reset .filter-option-value { align-items: center; display: flex; font-size: 1.4rem; min-height: 4.8rem; padding: 0 1.6rem } .component-filter-new .filter-options .left-padding-40 .filter-option-value { cursor: pointer; padding-left: 4rem !important } .component-filter-new .filter-options .left-padding-16 .filter-option-value { cursor: pointer; padding-left: 1.6rem !important } .component-filter-new .filter-options .filter-category-title { font-family: GilroySemibold } .component-filter-new .remove-opacity { opacity: 1 !important } .component-filter-new .theme-dark { background-color: #293e40; color: #fff !important } .component-filter-new .theme-dark .filter-option-value:hover { background-color: hsla(0,0%,100%,.1) } .component-filter-new .theme-light { background-color: #fff; color: #293e40 } .component-filter-new .theme-light .filter-option-value:hover { background-color: rgba(41,62,64,.1) } .component-filter-new .mobile-version { align-items: center; border: .1em solid #293e40; cursor: pointer; display: flex; height: 4.7rem; margin: auto; min-height: 5rem; position: relative; width: 100% } .component-filter-new .mobile-version select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(images/chevron-down.svg) no-repeat 100%; border: 0; border-right: 1.6rem solid transparent; font-family: GilroySemibold; font-size: 1.6rem; min-height: 2rem; outline: none; padding: 0 1.6rem; width: 100% } .component-filter-new .mobile-version select::-ms-expand { display: none } .component-filter-new .mobile-version .filter-chevron { display: inline-block; margin-left: 4rem; margin-right: 1.6rem; position: absolute; right: 0 } @media only screen and (min-width: 768px) { .component-filter-new { width: 26.7rem } .component-filter-new .mobile-version { display: none } .component-filter-new .filter-container { margin-top: 1.6rem } .component-filter-new .filter-select-box { display: block; min-height: 5.6rem } .component-filter-new .filter-category-title { padding: .65rem 1.6rem } .component-filter-new .filter-options { display: initial; position: absolute; width: 26.7rem } .component-filter-new .filter-options .filter-option-value { padding: .65rem 1.6rem .65rem 4rem } .component-filter-new .filter-options .filter-category-group .filter-option-value, .component-filter-new .filter-options .filter-category-title, .component-filter-new .filter-options .filter-reset .filter-option-value { align-items: center; display: flex; font-size: 1.4rem; min-height: 4rem; padding: 0 1.6rem } .component-filter-new .filter-options .parent-filter { max-height: 40rem; overflow: auto } .component-filter-new .show-hide { display: none } } .component-agenda { position: relative; width: 100% } .component-agenda .agenda-container { margin-left: auto; margin-right: auto; padding-bottom: 5.6rem; padding-top: 0 } .component-agenda .agenda-container .navigations { position: relative } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs { display: flex; flex-direction: row; margin: 0; overflow-y: auto; padding: 0 2rem } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li { border-bottom: .5rem solid transparent; cursor: pointer; flex-shrink: 0; margin: 0 3.2rem 0 0; opacity: .8; padding: 2rem 0 1rem; transition: border-color .5s } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li.current { border-bottom: .5rem solid #293e40; opacity: 1 } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li:last-of-type { padding-right: 3.2rem } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li .event-date { font-family: GilroySemiBold } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs.cloud { background-color: #f7f7f7 } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs.pure-white { background-color: #fff } .component-agenda .agenda-container .navigations.underline-acapulco-green .text-nav-wrapper .tabs li.current { border-bottom: .5rem solid #81b5a1 } .component-agenda .agenda-container .navigations.underline-gable-green .text-nav-wrapper .tabs { padding: 0 1rem } .component-agenda .agenda-container .navigations.underline-gable-green .text-nav-wrapper .tabs li.current { border-bottom: .5rem solid #293e40 } .component-agenda .agenda-container .navigations.sticky-agenda-tab { left: 0; margin: 0; position: fixed; right: 0; z-index: 10 } .component-agenda .agenda-container .title-and-filter { display: block; flex-direction: column-reverse; justify-content: space-between; margin-bottom: .8rem; margin-left: 1rem; margin-top: 3.2rem } .component-agenda .agenda-container .title-and-filter .event-title-head { align-items: center; display: flex; flex: auto; line-height: 4.6rem } .component-agenda .agenda-container .title-and-filter.remove-filter .filter-dropdown { display: none } .component-agenda .agenda-container .title-and-filter.remove-filter .event-title-head { flex: auto } .component-agenda .agenda-container .tab-content { display: none; margin: 0 1rem } .component-agenda .agenda-container .tab-content .static-horizontal-line { border: .1rem solid #293e40; margin: 0 } .component-agenda .agenda-container .tab-content .filter-dropdown .component-filter-new { margin-bottom: 0; margin-top: 0 } .component-agenda .agenda-container .tab-content .filter-dropdown .filter-container { margin-top: 0 } .component-agenda .agenda-container .tab-content.current { display: inherit } .component-agenda .agenda-container .accordion { border: none; border-bottom: .1rem solid rgba(41,62,64,.2); outline: none; text-align: left; transition: .4s; width: 100% } .component-agenda .agenda-container .accordion .clickable { cursor: pointer; padding: .8rem 0 } .component-agenda .agenda-container .accordion .not-clickable { cursor: auto } .component-agenda .agenda-container .accordion .accordion-chevron { display: flex; height: 2.4rem; margin-left: .8rem; opacity: .6; width: 2.4rem } .component-agenda .agenda-container .accordion .accordion-chevron .component-asset-block { margin: auto; width: 1.3rem } .component-agenda .agenda-container .accordion .rotate { transition: all .1s linear } .component-agenda .agenda-container .accordion .rotate.down { transform: rotate(180deg) } .component-agenda .agenda-container .accordion .accordion-active-opacity, .component-agenda .agenda-container .accordion:hover .accordion-chevron { opacity: 1 } .component-agenda .agenda-container .flexy { align-items: center; display: flex } .component-agenda .agenda-container .accordion .text-type, .component-agenda .agenda-container .flexy .text-type { flex: auto } .component-agenda .agenda-container .accordion .task-title, .component-agenda .agenda-container .flexy .task-title { flex: auto; font-family: GilroyBold } .component-agenda .agenda-container .accordion .event-hour, .component-agenda .agenda-container .accordion .task-title, .component-agenda .agenda-container .flexy .event-hour, .component-agenda .agenda-container .flexy .task-title { line-height: 2.4rem } .component-agenda .agenda-container .accordion .event-hour, .component-agenda .agenda-container .flexy .event-hour { font-family: GilroySemiBold } .component-agenda .agenda-container .agenda-details { display: none; max-height: 0; overflow: hidden; transition: max-height .3s ease-out } .component-agenda .agenda-container .agenda-details .agenda-rte { padding: 2rem 0 } .component-agenda .agenda-container .agenda-details .event-space { display: none } .component-agenda .agenda-container .agenda-details .speakers { display: block; padding: 1.6rem 0 } .component-agenda .agenda-container .agenda-details .speakers .speakers-title { font-family: GilroySemiBold } .component-agenda .agenda-container .agenda-details .speakers-details .person { display: block; margin-bottom: 0 !important; margin-top: 0 !important; padding: .8rem 0 } .component-agenda .agenda-container .agenda-details .speakers-details .person:first-child { padding-top: 0 } .component-agenda .agenda-container .agenda-details .speakers-details .person:last-child { padding-bottom: 0 } .component-agenda .agenda-container .agenda-details .agenda-cta { padding-bottom: 1.6rem; padding-top: .8rem } .component-agenda .agenda-container .component-footer-note { margin-left: 1rem; margin-top: 1.6rem } .component-agenda .agenda-container .cruise-20 { background: rgba(176,225,206,.2) } .component-agenda .agenda-container .cavern-pink-20 { background: hsla(0,51%,83%,.2) } .component-agenda .agenda-container .apricot-20 { background: hsla(24,90%,84%,.2) } .component-agenda .agenda-container .french-pass-20 { background: rgba(167,212,223,.2) } .component-agenda .agenda-container .perano-20 { background: rgba(177,177,228,.2) } .component-agenda .agenda-container .buttermilk-20 { background: hsla(52,90%,85%,.2) } @media only screen and (min-width: 768px) { .component-agenda .agenda-container .navigations { margin: 0 auto } .component-agenda .agenda-container .navigations .text-nav-wrapper { position: relative } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs { padding: 0 } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li { flex-grow: 1; flex-shrink: 0; margin: 0; padding: 2rem 0 1rem .8rem } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li.current { border-bottom: .5rem solid #293e40 } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li.current, .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li:hover { opacity: 1 } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li:last-of-type { padding-right: 0 } .component-agenda .agenda-container .navigations .text-nav-wrapper .underline { display: none } .component-agenda .agenda-container .navigations.underline-acapulco-green .text-nav-wrapper .tabs li.current { border-bottom: .5rem solid #81b5a1 } .component-agenda .agenda-container .navigations.underline-gable-green .text-nav-wrapper .tabs li.current { border-bottom: .5rem solid #293e40 } .component-agenda .agenda-container .navigations.sticky-agenda-tab { margin: 0 auto } .component-agenda .agenda-container .navigations.sticky-agenda-tab .text-nav-wrapper { margin: 0 } .component-agenda .agenda-container .navigations.sticky-agenda-tab .text-nav-wrapper .tabs { padding: 0 1.5rem } .component-agenda .agenda-container.mobile-tabs .navigations .text-nav-wrapper .tabs li { flex-grow: 0; margin-right: 3.2rem; padding-left: 0 } } @media only screen and (min-width: 1024px) { .component-agenda .agenda-container { margin-left: auto; margin-right: auto; padding-bottom: 7.2rem } .component-agenda .agenda-container .navigations .text-nav-wrapper .tabs li { padding: 1.5rem 0 1rem 1.6rem } .component-agenda .agenda-container .navigations.sticky-agenda-tab .text-nav-wrapper { margin: 0 } .component-agenda .agenda-container .navigations.sticky-agenda-tab .text-nav-wrapper .tabs { padding: 0 2rem } .component-agenda .agenda-container .title-and-filter { align-items: center; display: flex; flex-direction: row-reverse; justify-content: space-between; margin-bottom: 1.6rem; margin-top: 4.8rem } .component-agenda .agenda-container .title-and-filter .filter-dropdown { margin-left: 2.4rem } .component-agenda .agenda-container .title-and-filter .component-filter-new, .component-agenda .agenda-container .title-and-filter .filter-container { margin: 0 } .component-agenda .agenda-container .title-and-filter.remove-filter .filter-dropdown { display: none } .component-agenda .agenda-container .title-and-filter.remove-filter .event-title-head { flex: auto } .component-agenda .agenda-container .accordion .accordion-chevron { margin: 0 1.6rem } .component-agenda .agenda-container .accordion .clickable { min-height: 6.4rem; padding: 2rem 0 } .component-agenda .agenda-container .accordion .text-type { display: flex; flex: auto; flex-direction: row } .component-agenda .agenda-container .accordion .text-type .task-title { padding-left: 2.8rem; width: 75% } .component-agenda .agenda-container .accordion .event-hour, .component-agenda .agenda-container .accordion .event-space { padding-left: 0; width: 25% } .component-agenda .agenda-container .agenda-details .agenda-task-details { padding-bottom: 3.2rem; padding-left: 2.8rem } .component-agenda .agenda-container .agenda-details .agenda-cta { padding-bottom: 0; padding-top: 0 } .component-agenda .agenda-container .agenda-details .agenda-cta .cta-component { margin-bottom: 0; margin-top: 0 } .component-agenda .agenda-container .agenda-details .event-space { display: initial; width: 25% } .component-agenda .agenda-container .agenda-details .agenda-rte { padding: .7rem 0 } .component-agenda .agenda-container .agenda-details .agenda-rte .text-overview { padding-bottom: .8rem } .component-agenda .agenda-container .agenda-details .agenda-rte .speakers { padding: 1.6rem 0 } .component-agenda .agenda-container .agenda-details .agenda-rte .speakers .speakers-details { line-height: 2.1rem } .component-agenda .agenda-container .agenda-details .agenda-rte .speakers .speakers-details .person { border-right: .2rem solid rgba(41,62,64,.2); display: inline-block; margin-bottom: 0 !important; margin-top: 0 !important; padding-right: .8rem } .component-agenda .agenda-container .agenda-details .agenda-rte .speakers .speakers-details .person:not(:first-child) { padding-left: .8rem } .component-agenda .agenda-container .agenda-details .agenda-rte .speakers .speakers-details .person:last-child { border-right: 0 } .component-agenda .agenda-container .agenda-details .agenda-task-details { padding-left: 2rem; width: 75% } .component-agenda .agenda-container .agenda-details.cloud .tab-link.current { background: none } .component-agenda .agenda-container .agenda-details.cloud .background-hover { background: #fff } .component-agenda .agenda-container .agenda-details.pure-white .tab-link.current { background: none } .component-agenda .agenda-container .agenda-details.pure-white .background-hover { background: #f7f7f7 } .component-agenda .agenda-container .agenda-details.gable-green-text .theme-dark .filter-option-value { background-color: #293e40; color: #fff !important } .component-agenda .agenda-container .agenda-details.gable-green-text .theme-dark .filter-option-value:hover { background-color: hsla(0,0%,100%,.1) } .component-agenda .agenda-container .agenda-details.gable-green-text .theme-light .filter-option-value { background-color: #fff; color: #293e40 !important } .component-agenda .agenda-container .agenda-details.gable-green-text .theme-light .filter-option-value:hover { background-color: rgba(41,62,64,.1) } } @media only screen and (min-width: 1700px) { .component-agenda .agenda-container { max-width: 113.4rem } .component-agenda .agenda-container .navigations { max-width: 109.4rem; padding: 0 } .component-agenda .agenda-container .navigations .text-nav-wrapper { margin: 0 } .component-agenda .agenda-container .navigations.sticky-agenda-tab .text-nav-wrapper .tabs { padding: 0 } } @media only screen and (min-width: 1920px) { .component-agenda .agenda-container { margin-left: auto; margin-right: auto; padding-bottom: 8rem } .component-agenda .agenda-container .title-and-filter { margin-bottom: .8rem; margin-top: 5.6rem } .component-agenda .agenda-container .accordion .clickable { min-height: 8.4rem; padding: 2.9rem 0 } .component-agenda .agenda-container .accordion .accordion-chevron { margin: 0 2.4rem } .component-agenda .agenda-container .agenda-details .agenda-task-details { padding-bottom: 4rem; padding-left: 2.8rem } .component-agenda .agenda-container .agenda-details .agenda-rte .text-overview { padding-bottom: 1.6rem } .component-agenda .agenda-container .agenda-details .agenda-rte .speakers-details .person { margin-bottom: 0 !important; margin-top: 0 !important } .component-agenda .agenda-container .agenda-details .agenda-cta { padding-top: .8rem } } .component-success-navigator-overlay { bottom: -100%; display: none; left: 0; position: absolute; right: 0; top: 0; z-index: 1100 } .component-success-navigator-overlay .modal-background { background-color: #293e40 !important; height: 100%; opacity: .8; width: 100% } .component-success-navigator-overlay .modal-container { background-color: #fff; left: 0; margin-left: auto; margin-right: auto; padding: 8rem; position: absolute; right: 0; top: 20vh; width: 80% } .component-success-navigator-overlay .modal-container .close { display: flex; justify-content: flex-end } .component-success-navigator-overlay .modal-container .close .component-overlay-new-close-btn { position: absolute } .component-success-navigator-overlay .modal-container .modal-subtitle, .component-success-navigator-overlay .modal-container .modal-title { font-family: GilroyRegular } .component-success-navigator-overlay .modal-container .modal-title { border-bottom: 3px solid #e6e6e6; padding-bottom: 40px } .component-success-navigator-overlay .modal-container .modal-subtitle { margin: 30px 0 } .component-success-navigator-overlay .modal-container .group-container .plan { border: 1px solid #81b5a1; cursor: pointer; display: flex; margin-bottom: 32px; padding: 40px 20px 40px 0 } .component-success-navigator-overlay .modal-container .group-container .plan .check-container { display: flex; flex: 1; justify-content: center; min-width: 100px } .component-success-navigator-overlay .modal-container .group-container .plan .check-container .check-wrapper { cursor: pointer; display: block; height: 30px; position: relative; -webkit-user-select: none; -moz-user-select: none; user-select: none; width: 30px } .component-success-navigator-overlay .modal-container .group-container .plan .check-container .check-wrapper .checkmark { background-color: #fff; border: 1px solid #e6e6e6; border-radius: 100%; height: 28px; left: 0; margin-left: auto; margin-right: auto; position: absolute; top: 0; width: 28px } .component-success-navigator-overlay .modal-container .group-container .plan .check-container .check-wrapper .checkmark:hover:after { display: block } .component-success-navigator-overlay .modal-container .group-container .plan .check-container .check-wrapper .checkmark:after { border: solid #000; border-width: 0 2px 2px 0; content: ""; display: none; height: 14px; left: 10px; position: absolute; top: 5px; transform: rotate(45deg); width: 7px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container { flex: 11 } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .title { margin-bottom: 20px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .steps-container { align-items: center; display: flex; margin-bottom: 10px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .steps-container .step-detail, .component-success-navigator-overlay .modal-container .group-container .plan .details-container .steps-container .step-number { font-size: 18px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .steps-container .step-number { display: none; font-family: GilroySemiBold; margin-right: 5px; min-width: 60px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .steps-container .step-bullet { background-color: #293e40; border-radius: 100%; height: 8px; margin-right: 10px; padding-right: 8px; width: 8px } .component-success-navigator-overlay .modal-container .group-container .plan:hover { background-color: rgba(129,181,161,.7); transition: background-color .25s ease-out } .component-success-navigator-overlay .modal-container .group-container .plan:hover .check-container .check-wrapper .checkmark:after { display: block } .component-success-navigator-overlay .modal-container .group-container .selected-plan { background-color: rgba(129,181,161,.7); border: 1px solid rgba(129,181,161,.7) } .component-success-navigator-overlay .modal-container .group-container .selected-plan .check-container .check-wrapper .checkmark:after { display: block } .component-success-navigator-overlay .modal-container .plan-ready { display: none } .component-success-navigator-overlay .modal-container .plan-ready h4 { color: #293e40; font-family: GilroyRegular } .component-success-navigator-overlay .modal-container .plan-ready .cta-component { margin: 40px 0 0 } .component-success-navigator-overlay .modal-container .cta-rectangle-box { margin-left: 20px } .component-success-navigator-overlay .modal-container .cta-rectangle-box a { border: none } .component-success-navigator-overlay .component-overlay-new-close-btn svg { opacity: .6 } .component-success-navigator-overlay .component-overlay-new-close-btn:hover { cursor: pointer } .component-success-navigator-overlay .component-overlay-new-close-btn:hover svg { opacity: 1 } .component-success-navigator-overlay .component-overlay-close-btn { position: absolute; right: 1.7rem; top: 2.4rem } .component-success-navigator-overlay .component-overlay-close-btn svg { height: 1.5rem; opacity: .7; width: 1.5rem } .component-success-navigator-overlay .component-overlay-close-btn svg g { stroke: #999 } .component-success-navigator-overlay .component-overlay-close-btn:hover { cursor: pointer } .component-success-navigator-overlay .component-overlay-close-btn:hover svg { opacity: 1 } .component-success-navigator-overlay .alert-overlay { background: #fff; display: block; height: 28.5rem; left: 50%; margin-left: -15rem; margin-top: -14rem; padding: 3.2rem 1.5rem; position: fixed; top: 50%; width: 30rem; z-index: 1105 } .component-success-navigator-overlay .alert-overlay .cta-rectangle-box a { border: .2rem solid #81b5a1 } .component-success-navigator-overlay .alert-overlay:after { background: rgba(42,63,65,.3); bottom: 0; content: ""; left: 0; position: fixed; right: 0; top: 0; z-index: -2 } .component-success-navigator-overlay .alert-overlay:before { background: #fff; bottom: 0; content: ""; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-success-navigator-overlay .alert-overlay.hidden { display: none } .component-success-navigator-overlay .alert-overlay .alert-header { color: #293e40; font: 2.2rem GilroyBold; padding-bottom: .4rem } .component-success-navigator-overlay .alert-overlay .alert-text { font: 2rem GilroyRegular } .component-success-navigator-overlay .my-account-loading-layer { bottom: 0; display: none; left: 0; position: fixed; right: 0; top: 0 } .component-success-navigator-overlay .my-account-loading-layer.show-loading-layer { display: block } .component-success-navigator-overlay .my-account-loading-layer .my-account-loading-film { position: absolute } .component-success-navigator-overlay .my-account-loading-layer .lds-roller-my-account { left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 11 } @media(max-width: 767px) { .component-success-navigator-overlay .modal-container { padding: 20px 0 0; width: 87% } .component-success-navigator-overlay .modal-container .modal-title { border-bottom: none; font-family: GilroyRegular; font-size: 20px; margin-bottom: 0; margin-left: 20px; margin-right: 56px; padding-bottom: 0 } .component-success-navigator-overlay .modal-container .modal-subtitle { border-bottom: 1px solid #e6e6e6; font-size: 16px; margin: 0 20px; padding-bottom: 20px; padding-top: 24px } .component-success-navigator-overlay .modal-container .group-container .plan { border: 0; border-bottom: 1px solid #e6e6e6; display: inline-block; margin-bottom: 0; padding-bottom: 20px; padding-top: 20px; width: 100% } .component-success-navigator-overlay .modal-container .group-container .plan .check-container { justify-content: left; min-width: 65px; padding-bottom: 20px; padding-left: 20px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container { padding-left: 20px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .steps-container .step-detail { font-size: 16px } .component-success-navigator-overlay .modal-container .group-container .plan .details-container .title { margin-bottom: 16px } .component-success-navigator-overlay .modal-container .alert-overlay { height: auto } .component-success-navigator-overlay .modal-container .alert-overlay .alert-header { margin-top: 2rem } .component-success-navigator-overlay .modal-container .plan-ready h4 { margin-left: 20px; margin-right: 56px } .component-success-navigator-overlay .modal-container .plan-ready .cta-component.cta-rectangle-box { margin-left: 20px; margin-top: 20px } .component-success-navigator-overlay .modal-container .plan-ready .cta-component.cta-text-arrow { margin-bottom: 20px; margin-left: 20px } .component-success-navigator-overlay .modal-container .plan-ready .cta-component { margin: 20px } .component-success-navigator-overlay .modal-container .cta-component.cta-rectangle-box, .component-success-navigator-overlay .modal-container .cta-component.cta-text-arrow { margin-left: 20px } .component-success-navigator-overlay .modal-container .close .component-overlay-new-close-btn { padding-right: 20px } } @media(min-width: 768px) { .component-success-navigator-overlay .modal-container { padding: 8rem; width: 80% } .component-success-navigator-overlay .modal-container .cta-component.cta-rectangle-box, .component-success-navigator-overlay .modal-container .cta-component.cta-text-arrow { margin-left: 0 } .component-success-navigator-overlay .group-container .plan { display: flex } .component-success-navigator-overlay .group-container .plan .check-container { min-width: 100px } .component-success-navigator-overlay .group-container .plan .details-container .steps-container .step-detail { font-size: 18px } .component-success-navigator-overlay h3 { font: 2.2rem GilroyBold } .component-success-navigator-overlay .component-overlay-close-btn { right: 3rem; top: 3rem } .component-success-navigator-overlay .alert-overlay { margin-left: -310px; padding: 3.2rem 3.2rem 5.6rem; width: 600px } .component-success-navigator-overlay .alert-overlay .alert-header { font-size: 2.8rem } .component-success-navigator-overlay .alert-overlay .alert-text { font-size: 2.8rem; padding-bottom: 1.2rem } .component-success-navigator-overlay .alert-overlay .close-btn, .component-success-navigator-overlay .alert-overlay .continue-btn { display: inline-block } .component-success-navigator-overlay .alert-overlay { height: 30.3rem; margin-top: -15.5rem } } @media(min-width: 1024px) { .component-success-navigator-overlay h3 { font-size: 2.8rem } .component-success-navigator-overlay .component-overlay-close-btn { right: 4rem; top: 4rem } .component-success-navigator-overlay .alert-overlay { height: 33rem; margin-left: -39.4rem; margin-top: -17.5rem; width: 768px } .component-success-navigator-overlay .alert-overlay .alert-header { font-size: 4.8rem } } @media(min-width: 1700px) { .component-success-navigator-overlay h3 { font-size: 3.6rem } } .component-sra-pillar-card { background: #fff; color: #293e40; display: inline-block; margin-bottom: 4rem; padding: 0; position: relative; width: 100% } .component-sra-pillar-card.completed { background: rgba(129,181,161,.2) } .component-sra-pillar-card.completed .hero-image:after { background-color: rgba(129,181,161,.2); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100% } .component-sra-pillar-card + .component-sra-pillar-card { margin-top: 2.6rem } .component-sra-pillar-card .arrow-icon { display: none } .component-sra-pillar-card .title-bar { align-items: center; color: #fff; display: flex; font: 1.4rem GilroyBold; height: 4.4rem; left: 0; padding-left: 1.6rem; position: absolute; top: -2.6rem; width: 15rem; z-index: 5 } .component-sra-pillar-card .card-wrapper .hero-image { background-repeat: no-repeat; background-size: cover; height: 0; padding-top: 56.25% } .component-sra-pillar-card .card-wrapper .card-content { padding: 2rem 1.6rem 15rem } .component-sra-pillar-card .card-wrapper .card-content .content-heading { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: block; display: inline; font: 1.6rem GilroyBold; font-size: 1.6rem; line-height: 2.4rem; overflow: hidden; transition: all .25s linear } .component-sra-pillar-card .card-wrapper .card-content .content-heading:hover { background-position: 0 100%; transition: all .25s linear } @media screen\0 { .component-sra-pillar-card .card-wrapper .card-content .content-heading { display: inline-flex } } .component-sra-pillar-card .card-wrapper .card-content .content { font: 1.4rem GilroyRegular; line-height: 2.4rem; padding-top: 2.4rem } .component-sra-pillar-card .card-wrapper .card-content .content.error-msg { color: red } .component-sra-pillar-card .card-wrapper .card-content .content.error-msg p { display: inline } .component-sra-pillar-card .card-wrapper .card-content .content.error-msg-hidden { display: none } .component-sra-pillar-card .card-wrapper .card-content .content .list-container { margin: 0; padding: 0 } .component-sra-pillar-card .card-wrapper .card-content .content .list-container li { padding: .6rem 0 } .component-sra-pillar-card .card-wrapper .card-content .content .list-container li a { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: block; display: inline; font-size: 1.6rem; overflow: hidden; padding-bottom: 2px; transition: all .25s linear } .component-sra-pillar-card .card-wrapper .card-content .content .list-container li a:hover { background-position: 0 100%; transition: all .25s linear } .component-sra-pillar-card .card-wrapper .card-content .content .list-container li:first-child, .component-sra-pillar-card .card-wrapper .card-content .content .list-container li:last-child { padding: 0 } .component-sra-pillar-card .card-wrapper .card-content .content .list-container li:first-child { padding-bottom: .6rem } .component-sra-pillar-card .card-wrapper .card-content .content .list-container li:last-child { padding-top: .6rem } .component-sra-pillar-card .completed-check { bottom: 9.2rem; left: 1.6rem; position: absolute } .component-sra-pillar-card .completed-check .checkmark { margin-right: .5rem } .component-sra-pillar-card .completed-check span { font: 1.6rem GilroyBold } .component-sra-pillar-card .card-cta { bottom: 3.2rem; margin: 0 1.6rem; position: absolute; width: calc(100% - 3.2rem) } .component-sra-pillar-card .card-cta .subscribe-submit-button-assessment { -webkit-appearance: none; border: 0; color: #fff; cursor: pointer; font: 1.4rem GilroySemibold; line-height: 2.4rem; margin: 0; padding: 1rem; width: 100% } .component-sra-pillar-card .card-cta .gable-green:hover { background-color: #3e5153 !important } .component-sra-pillar-card .card-cta.hide-start-assessment-btn { display: none } @media(min-width: 768px) { .component-sra-pillar-card { margin-top: 2.6rem } .component-sra-pillar-card:nth-child(odd) { margin-right: 4rem } .component-sra-pillar-card .title-bar { height: 5.3rem } .component-sra-pillar-card .card-content { padding-left: 1.5rem; padding-right: 1.5rem } } @media(min-width: 1024px) { .component-sra-pillar-card { margin-bottom: 0 } .component-sra-pillar-card .title-bar { height: 4.4rem } .component-sra-pillar-card .arrow-icon { display: inline-block; position: absolute; right: -2.75rem; top: 30% } .component-sra-pillar-card:last-of-type .arrow-icon { display: none } .component-sra-pillar-card.flex-box-col-lg-3 { flex: 0 0 22%; max-width: 22% } .component-sra-pillar-card + .component-sra-pillar-card { margin-left: 3.75rem } .component-sra-pillar-card:nth-child(odd) { margin-right: 0 } } @media(min-width: 1700px) { .component-sra-pillar-card.flex-box-col-lg-3 { flex: 0 0 auto; max-width: 37.5rem } .component-sra-pillar-card + .component-sra-pillar-card { margin-left: 4rem } .component-sra-pillar-card .arrow-icon { right: -3rem; top: 23rem } .component-sra-pillar-card .card-wrapper .card-content { padding-bottom: 16rem } .component-sra-pillar-card .completed-check { bottom: 11.6rem } .component-sra-pillar-card .card-cta { bottom: 5.6rem } .component-sra-pillar-card .card-cta .subscribe-submit-button-assessment { padding: 1rem 4rem; width: auto } } .component-sra-pillar-card-container { background: #f7f7f7; padding: 6rem 1rem 3.2rem } .component-sra-pillar-card-container .pillar-card-container { align-items: stretch; display: flex; flex-direction: column } @media(min-width: 768px) { .component-sra-pillar-card-container { padding: 6rem 1.5rem } .component-sra-pillar-card-container .pillar-card-container { flex-direction: row; flex-wrap: wrap } } @media(min-width: 1024px) { .component-sra-pillar-card-container { padding: 6rem 2rem } } @media(min-width: 1700px) { .component-sra-pillar-card-container { padding: 6rem 0 } .component-sra-pillar-card-container .pillar-card-container.site-width-1700 { padding-left: 4rem; padding-right: 4rem } } html body.no-scroll-new { overflow: hidden !important } .component-overlay-assessment { background-color: #fff; height: 0; overflow: auto; position: absolute; top: 0; width: 100% } .component-overlay-assessment.active-overlay { height: auto } .component-overlay-assessment.active-overlay-close { transition: all .3s ease-in-out !important } .component-overlay-assessment .component-overlay-assessment-close-btn { cursor: pointer } .component-overlay-assessment .component-overlay-assessment-close-btn.close-btn-mobile { position: absolute; right: 3rem; top: 2rem } .component-overlay-assessment .component-overlay-assessment-close-btn.close-btn-mobile svg g { stroke: #293e40; opacity: .6 } .component-overlay-assessment .component-overlay-assessment-close-btn.close-btn-mobile svg { opacity: .6 } .component-overlay-assessment .component-overlay-assessment-close-btn.close-btn-mobile:hover svg, .component-overlay-assessment .component-overlay-assessment-close-btn.close-btn-mobile:hover svg g { opacity: 1 } @media only screen and (min-width: 768px) { .component-overlay-assessment { position: fixed } .component-overlay-assessment .component-overlay-assessment-outter-wrapper { height: 100vh } } .component-overlay-container-assessment { height: 65rem; opacity: 0; overflow-y: scroll; -webkit-overscroll-behavior-y: none; -moz-overscroll-behavior-y: none; -ms-overscroll-behavior-y: none; overscroll-behavior-y: none; position: fixed; top: 0; width: calc(100% + 1.5rem); z-index: -1 } .component-overlay-container-assessment.overlay-modal-open { opacity: 1; z-index: 99997 } .component-overlay-container-assessment.overlay-modal-close { opacity: 0; z-index: -1 } .component-overlay-container-assessment .component-overlay-assessment { background: #fff } .component-overlay-container-assessment .component-overlay-assessment .component-overlay-assessment-outter-wrapper { background-color: transparent !important } .component-overlay-container-assessment .component-overlay-assessment .component-overlay-assessment-content { height: 100vh; position: relative } @media only screen and (min-width: 768px) { .component-overlay-container-assessment .component-overlay-container-new { height: 100vh !important } } .tileV2 { grow: 1; display: flex; width: 100% } .tileV2.filtered-tile-new { display: none !important } .component-tile-new { margin-bottom: 3.2rem; opacity: 1; padding: 0 1rem; position: relative; transition: opacity .5s; width: 100% } .component-tile-new .component-tile-overlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-tile-new .component-tile-overlay .cta-component, .component-tile-new .component-tile-overlay a { bottom: 0; height: 100%; left: 0; margin: 0; overflow: hidden; padding: 0; position: absolute; right: 0; text-indent: -9999px; top: 0; width: 100%; z-index: 20 } .component-tile-new.calculator .component-tile-image-container { background-color: #d02d26; bottom: 0; height: 50%; padding: 0; position: absolute; width: calc(100% - 4rem) } .component-tile-new.calculator .component-tile-image-container .component-tile-image { background-position: top; height: 100%; margin-top: 5%; width: 100% } .component-tile-new.calculator .component-tile-text-container-container { background-color: #d02d26; position: static } .component-tile-new.calculator .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: transparent } .component-tile-new.calculator .component-tile-text-container { background: none; top: 0; width: 100% } .component-tile-new.calculator .component-tile-text-container a, .component-tile-new.calculator .component-tile-text-container h3, .component-tile-new.calculator .component-tile-text-container h6, .component-tile-new.calculator .component-tile-text-container span { color: #fff } .component-tile-new.calculator .component-tile-text-container .component-tile-arrow { fill: #fff } .component-tile-new.featured .component-tile-image { background-position: top } .component-tile-new.variation-no-image { margin-bottom: 3.5rem; min-height: auto !important } .component-tile-new.variation-no-image .component-tile-image-container { display: none !important } .component-tile-new.variation-no-image .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: transparent } .component-tile-new.variation-no-image .component-tile-text-container-container .component-tile-text-container .tile-new-title { display: inline-block } .component-tile-new.variation-no-image .component-tile-text-container-container .component-tile-text-container h2 { font-size: 2.8rem; line-height: 3.64rem } .component-tile-new.variation-no-image .component-tile-text-container-container .component-tile-text-container h3 { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 .2rem; display: inline; margin-bottom: 1.4rem; padding-bottom: .2rem; transition: all .25s linear; width: -moz-fit-content; width: fit-content } .component-tile-new.variation-no-image .component-tile-text-container-container .component-tile-text-container p { display: block; margin-top: 1.4rem } .component-tile-new.hide-tile-description .component-tile-text-container-container .component-tile-text-container p { display: none } .component-tile-new.no-tile-background .component-tile-text-container, .component-tile-new.no-tile-background .component-tile-text-container .comp-full-bleed-bg-color, .component-tile-new.no-tile-background .component-tile-text-container-container, .component-tile-new.no-tile-background .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: transparent !important } .component-tile-new.show-tile-arrow .table-bottom-container .icon-container { content: url(../../../content/dam/servicenow-assets/public/en-us/images/company-library/icon/arrow.svg) } .component-tile-new.show-video-icon .table-bottom-container .icon-container { content: url(../../../content/dam/servicenow-assets/public/en-us/images/company-library/icon/video-cta.svg) } .component-tile-new.show-download-icon .table-bottom-container .icon-container { content: url(../../../content/dam/servicenow-assets/public/en-us/images/company-library/icon/download-cta.svg) } .component-tile-new.show-audio-icon .table-bottom-container .icon-container { content: url(../../../content/dam/servicenow-assets/public/en-us/images/company-library/icon/audio-cta.svg) } .component-tile-new.hidden { pointer-event: none; cursor: pointer; display: none; visibility: hidden } .component-tile-new.author-mode { visibility: initial !important } .component-tile-new.filtered-tile-new { display: none !important } .component-tile-new.tile__content-full-width { min-height: auto } .component-tile-new.tile__content-full-width .component-tile-text-container-container .component-tile-text-container { padding-left: 0; padding-right: 0 } .component-tile-new.tile__content-full-width .component-tile-text-container-container .component-tile-text-container .table-bottom-container { display: none } .component-tile-new.hover:hover .component-tile-image-container .component-tile-image { transform: scale(1.1); transition: transform .5s ease } .component-tile-new.hover:hover .cta-text-arrow { border: 0 } .component-tile-new.hover:hover .cta-text-arrow a { cursor: pointer } .component-tile-new.hover:hover .cta-text-arrow a .cta-title-link-arrow svg { transform: translate(-.5rem) } .component-tile-new.hover .variation-no-image:hover .component-tile-text-container-container h3 { background-position: 0 100%; background-size: 205% .2rem; transition: all .25s linear } .component-tile-new a { cursor: default } .component-tile-new .component-tile-image-container { display: inline-block; overflow: hidden; padding: 56.25% 0 0; position: relative; width: 100% } .component-tile-new .component-tile-image-container.image__rounded-corner .component-tile-image { border-radius: .6rem } .component-tile-new .component-tile-image-container .component-tile-image { background-position: 50%; background-repeat: no-repeat; background-size: 101%; height: 100%; position: absolute; top: 0; transition: transform .5s ease; width: 100% } .component-tile-new .component-tile-image-container .animation-section-container { position: absolute; top: 0; width: 100% } .component-tile-new .component-tile-text-container-container { background-color: #fff; display: flex; position: relative } .component-tile-new .component-tile-text-container-container .comp-full-bleed-bg-color { background-color: #fff } .component-tile-new .component-tile-text-container-container .component-tile-text-container { display: flex; flex-direction: column; font-family: GilroySemiBold; padding: 1.6rem; position: relative; z-index: 1 } .component-tile-new .component-tile-text-container-container .component-tile-text-container h6 { color: var(--brand-black,var(--gable-green)); font-family: GilroySemiBold; font-size: 1.2rem; letter-spacing: .1rem; line-height: 1.8rem; margin: 0; opacity: .6; text-transform: uppercase } .component-tile-new .component-tile-text-container-container .component-tile-text-container h6 span { text-transform: none } .component-tile-new .component-tile-text-container-container .component-tile-text-container h6 span + span:before { content: " • " } .component-tile-new .component-tile-text-container-container .component-tile-text-container h3 { color: var(--brand-black,#293e40); font-size: 1.8rem; letter-spacing: auto; line-height: 2.34rem; margin: 0 } .component-tile-new .component-tile-text-container-container .component-tile-text-container p { color: var(--brand-black,#293e40); flex: 1 0 auto; font-family: GilroyRegular; font-size: 1.6rem; line-height: 2.4rem; margin: 0; padding-bottom: 2rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container .table-bottom-container { align-items: baseline; bottom: 1.5rem; display: flex; justify-content: space-between; position: relative } .component-tile-new .component-tile-text-container-container.show-audio-icon .table-bottom-container, .component-tile-new .component-tile-text-container-container.show-download-icon .table-bottom-container, .component-tile-new .component-tile-text-container-container.show-tile-arrow .table-bottom-container, .component-tile-new .component-tile-text-container-container.show-video-icon .table-bottom-container { align-items: baseline } .component-tile-new .component-tile-text-container-container.show-audio-icon .table-bottom-container .icon-container, .component-tile-new .component-tile-text-container-container.show-download-icon .table-bottom-container .icon-container, .component-tile-new .component-tile-text-container-container.show-tile-arrow .table-bottom-container .icon-container, .component-tile-new .component-tile-text-container-container.show-video-icon .table-bottom-container .icon-container { height: 1.8rem; width: 1.8rem } .component-tile-new .component-tile-text-container-container.show-audio-icon .table-bottom-container .cta-or-logo-container .component-asset-block svg, .component-tile-new .component-tile-text-container-container.show-download-icon .table-bottom-container .cta-or-logo-container .component-asset-block svg, .component-tile-new .component-tile-text-container-container.show-tile-arrow .table-bottom-container .cta-or-logo-container .component-asset-block svg, .component-tile-new .component-tile-text-container-container.show-video-icon .table-bottom-container .cta-or-logo-container .component-asset-block svg { height: 5rem; width: auto } .component-tile-new .component-tile-text-container-container.show-audio-icon .table-bottom-container.right-icon, .component-tile-new .component-tile-text-container-container.show-download-icon .table-bottom-container.right-icon, .component-tile-new .component-tile-text-container-container.show-tile-arrow .table-bottom-container.right-icon, .component-tile-new .component-tile-text-container-container.show-video-icon .table-bottom-container.right-icon { justify-content: flex-end } .component-tile-new .component-tile-text-container-container.show-audio-icon .table-bottom-container.right-icon.cta-or-logo, .component-tile-new .component-tile-text-container-container.show-download-icon .table-bottom-container.right-icon.cta-or-logo, .component-tile-new .component-tile-text-container-container.show-tile-arrow .table-bottom-container.right-icon.cta-or-logo, .component-tile-new .component-tile-text-container-container.show-video-icon .table-bottom-container.right-icon.cta-or-logo { justify-content: space-between } @media only screen and (max-width: 767px) { .component-tile-new { margin-bottom: 2.4rem } .component-tile-new.calculator .component-tile-image-container { left: 0; right: 0 } .component-tile-new .component-tile-text-container-container { margin-top: -.4rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container h6 { font-family: GilroyBold } } @media only screen and (max-width: 1023px) { .component-tile-new.calculator .component-tile-image-container { height: 100%; left: 1.5rem; right: 1.5rem; width: auto } .component-tile-new.calculator .component-tile-image-container .component-tile-image { background-position: 100% 100%; background-size: contain } .component-tile-new.calculator .component-tile-text-container-container { background: 0; position: relative } } @media only screen and (min-width: 768px) { .tileV2 { max-width: 33.333333% } .tileV2.featured-tile-new { max-width: 66.666667% } .component-tile-new { margin-bottom: 4rem; overflow: hidden; padding: 0 1.5rem } .component-tile-new.calculator .cta-component { padding-top: 1.5rem; position: relative } .component-tile-new.featured { overflow: hidden; position: relative } .component-tile-new.featured .component-tile-image-container { height: 100%; left: 1.5rem; position: absolute; right: 1.5rem; width: auto } .component-tile-new.featured .component-tile-image-container .component-tile-image { background-position: top; height: 100%; width: 100% } .component-tile-new.featured .component-tile-text-container-container { background: transparent; bottom: 0; padding: 25.5% 0 0; position: absolute; width: calc(50% - 3rem) } .component-tile-new.featured .component-tile-text-container-container .component-tile-text-container { bottom: 0; padding: 1.6rem; position: relative; width: 100% } .component-tile-new.featured .component-tile-text-container-container .component-tile-text-container h6 { margin: 0 } .component-tile-new.featured .component-tile-text-container-container .component-tile-text-container h3 { max-width: 18.4rem; padding-bottom: 3rem } .component-tile-new .component-tile-image-container .component-tile-image { background-size: cover } .component-tile-new .component-tile-text-container-container { margin-top: -.4rem } } @media only screen and (min-width: 1024px) { .component-tile-new { padding: 0 2rem } .component-tile-new.featured { position: relative } .component-tile-new.featured .component-tile-text-container-container { margin-top: -.4rem; width: calc(50% - 4rem) } .component-tile-new.featured .component-tile-image-container { left: 2rem; right: 2rem } .component-tile-new.featured .component-tile-image-container .component-tile-image { height: 100% } .component-tile-new.featured .component-tile-text-container-container .component-tile-text-container h3 { max-width: 100% } .component-tile-new.hide-tile-description, .component-tile-new.variation-no-image { margin-bottom: 3.5rem } .component-tile-new.hide-tile-description .component-tile-text-container-container .component-tile-text-container p { display: block } .component-tile-new .component-tile-image-container.image__rounded-corner .component-tile-image { border-radius: 1.2rem } .component-tile-new .component-tile-text-container-container { margin-top: -.4rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container { width: 100% } .component-tile-new .component-tile-text-container-container .component-tile-text-container h6 { margin: .5rem 0 } .component-tile-new .component-tile-text-container-container .component-tile-text-container h3 { font-size: 2rem; max-width: 100%; padding-bottom: 1.5rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container p { display: block; max-width: 100% } .component-tile-new .component-tile-text-container-container .component-tile-text-container .cta-component { font-size: 1.8rem; width: 100% } .component-tile-new .component-tile-text-container-container .component-tile-text-container .table-bottom-container { margin-top: 2.4rem } } @media only screen and (min-width: 1200px) { .component-tile-new.featured .component-tile-text-container-container .component-tile-text-container { height: 100% } .component-tile-new .component-tile-text-container-container .component-tile-text-container { height: auto; padding: 2rem } } @media only screen and (min-width: 1700px) { .tileV2 { max-width: 25% } .tileV2.featured-tile-new { max-width: 50% } .tileV2.featured-tile-new .component-tile-image-container { max-height: 52.3rem } .component-tile-new { display: flex; flex-direction: column; margin: 0 0 5.6rem; min-height: 50rem } .component-tile-new.variation-no-image .component-tile-text-container-container .component-tile-text-container { min-height: 20rem } .component-tile-new.variation-no-image .component-tile-text-container-container .component-tile-text-container p { max-height: 20rem } .component-tile-new.calculator .component-tile-image-container { height: 54% } .component-tile-new .component-tile-image-container { flex-grow: 1; max-height: 21.1rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container { padding: 3.2rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container h6 { margin: 0 0 1rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container h3 { font-size: 2.2rem; max-width: 31.2rem } .component-tile-new .component-tile-text-container-container .component-tile-text-container p { font-size: 1.8rem; margin-top: 1.6rem; max-width: none; overflow: hidden } } .cq-Editable-dom .component-tile-new, .cq-wcm-edit .component-tile-new { display: block !important; opacity: 1 !important } .component-sra-pdf { background: #293e40 } .component-sra-pdf .textarea { border: none; height: 80px; width: 100% } .component-sra-pdf .full-width { display: block; width: 100% } .component-sra-pdf table.width-100 input { font-size: 18px; width: 100% } .component-sra-pdf input { border: none; font-size: 18px } .component-sra-pdf input:focus { outline: none } .component-sra-pdf input.assign-to { width: 88% } .component-sra-pdf input.completed-by { width: 85% } .component-sra-pdf .bold { font-weight: bolder } .component-sra-pdf .dark-grey { color: #a2a2a2 } .component-sra-pdf .hero-img-container { display: block; height: 1020px; position: relative; width: 100% } .component-sra-pdf .hero-img-container .content-background { background-image: url(../../../content/dam/servicenow-assets/ui-prototyping/images/background_hero_girl.png); background-position: 50%; background-repeat: no-repeat; background-size: cover; bottom: 0; left: 0; padding: 160px 170px 160px 40px; position: absolute; right: 0; top: 0 } .component-sra-pdf .hero-img-container .content-background .content-logo { height: 20px; position: absolute; width: 180mm } .component-sra-pdf .hero-img-container .content-background .content-logo .img { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-sra-pdf .hero-img-container .content-background .content-logo .img img { height: 100%; width: auto } .component-sra-pdf .hero-img-container .content-hero { padding-top: 50px; position: absolute; top: 50mm; width: 45% } .billboard-marquee-component .billboard-marquee-eyebrow .component-sra-pdf .hero-img-container .content-hero span, .billboard-marquee-component .component-sra-pdf .hero-img-container .content-hero .billboard-marquee-eyebrow, .component-sra-pdf .hero-img-container .content-hero .billboard-marquee-component .billboard-marquee-eyebrow, .component-sra-pdf .hero-img-container .content-hero .billboard-marquee-component .billboard-marquee-eyebrow span, .component-sra-pdf .hero-img-container .content-hero .eyebrow { color: #fff; font-size: 10pt; text-transform: uppercase } .component-sra-pdf .hero-img-container .content-hero .header h1 { color: #fff; font-size: 30pt; line-height: 3.64rem } .component-sra-pdf .hero-img-container .content-hero .subheader { padding-top: 5mm } .component-sra-pdf .hero-img-container .content-hero .subheader h1 { line-height: 3.64rem } .component-sra-pdf .hero-img-container .content-hero .subheader span { color: #fff; font-size: 14pt } .component-sra-pdf .hero-img-container .content-hero .subheader .bolder { font-family: GilroyBold; font-size: 14pt } .component-sra-pdf .hero-img-container .content-hero .subheader div { padding-bottom: 20px } .component-sra-pdf .hero-title-container { display: block; height: 1020px; position: relative; width: 100% } .component-sra-pdf .content-background-color { background-color: #81b5a1; bottom: 0; left: 0; padding: 160px 170px; position: absolute; right: 0; top: 0 } .component-sra-pdf .content-background-color.color-black { background: #293e40; padding-left: 70px } .component-sra-pdf .content-background-color .content-logo { height: 20px; position: absolute; width: 180mm } .component-sra-pdf .content-background-color .content-logo .img { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-sra-pdf .content-background-color .content-logo .img img { height: 100%; width: auto } .component-sra-pdf .content-background-color .content-hero { padding-top: 50px; position: absolute; top: 50mm; width: 55% } .component-sra-pdf .content-background-color .content-hero.firsts-last { width: 40% } .component-sra-pdf .content-background-color .content-hero .header h1 { color: #fff; font-size: 30pt; line-height: 3.64rem; padding-bottom: 5px; padding-top: 10px } .component-sra-pdf .content-background-color.new { padding: 160px 80px } .billboard-marquee-component .billboard-marquee-eyebrow .component-sra-pdf .content-background-color.new .content-hero span, .billboard-marquee-component .component-sra-pdf .content-background-color.new .content-hero .billboard-marquee-eyebrow, .component-sra-pdf .content-background-color.new .content-hero .billboard-marquee-component .billboard-marquee-eyebrow, .component-sra-pdf .content-background-color.new .content-hero .billboard-marquee-component .billboard-marquee-eyebrow span, .component-sra-pdf .content-background-color.new .content-hero .eyebrow { padding-bottom: 20px } .component-sra-pdf .content-background-color.new .subheader { color: #fff; font-size: 20pt; margin-top: 20px; padding-top: 20px } .component-sra-pdf .content-background-color.new .subheader span { font-size: 20pt } .component-sra-pdf .content-background-color.new .subheader span a { color: #fff; font-size: 20pt } .component-sra-pdf .executive-container { background-color: #fff; display: block; height: 1020px; padding: 60px 40px; position: relative; width: 100% } .component-sra-pdf .executive-container .first-title { padding-top: 15px } .component-sra-pdf .executive-container .second-title { padding-bottom: 5px; padding-top: 5px } .component-sra-pdf .executive-container .second-title h2 { margin-bottom: 5px } .component-sra-pdf .executive-container .description { margin-top: -10px; padding-bottom: 10px } .component-sra-pdf .executive-container .overview-pillars-container .title { color: #fc726d; font-size: 1.7rem; font-weight: 700 } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list { border-collapse: separate; border-spacing: 20px; display: table; margin-left: -20px; padding: 10px 0 5px; width: 100% } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item { border: 1px solid #c8c8c8; display: table-cell; padding: 30px 10px 10px; position: relative } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item.disabled { background-color: hsla(0,0%,88%,.4); color: #c8c8c8 } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item.disabled .subpillar-steps div span { color: #c8c8c8 } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-item-eyebrow { align-items: center; color: #fff; font: 1.4rem GilroyBold; font-weight: bolder; left: -1px; padding: 11px 20px 11px 1.6rem; position: absolute; top: -20px; width: 15rem; z-index: 5 } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-item-eyebrow.one { background-color: #fc726d } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-item-eyebrow.two { background-color: #72d0e2 } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-item-eyebrow.three { background-color: #ff924e } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-item-eyebrow.four { background-color: #8686bc } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-box .pillar-title { font: 1.4rem GilroyBold; font-weight: bolder; padding-bottom: 10px } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-box .subpillar-steps div { padding-bottom: 5px } .component-sra-pdf .executive-container .overview-pillars-container .pillars-list .pillar-item .pillar-box .subpillar-steps div .index { padding-right: 5px } .component-sra-pdf .executive-container .bottom-tables-container { display: table; width: 100% } .component-sra-pdf .executive-container .bottom-tables-container .left-side { display: table-cell } .component-sra-pdf .executive-container .bottom-tables-container .left-side .arrow-nav-container { display: table } .component-sra-pdf .executive-container .bottom-tables-container .left-side .arrow-nav-container .each-item { display: table-cell; padding-right: 30px } .component-sra-pdf .executive-container .bottom-tables-container .left-side .arrow-nav-container .each-item span { display: inline-block } .component-sra-pdf .executive-container .bottom-tables-container .left-side .arrow-nav-container .each-item .first { padding-right: 10px } .component-sra-pdf .executive-container .bottom-tables-container .left-side .arrow-nav-container .each-item .arrow-right { border-bottom: 8px solid transparent; border-left: 6px solid #5ea188; border-top: 8px solid transparent; height: 0; width: 0 } .component-sra-pdf .executive-container .bottom-tables-container .left-side .left-table { margin: 10px 20px 10px 0; width: 600px } .component-sra-pdf .executive-container .bottom-tables-container .left-side .left-table .titles th { font-size: 8pt; padding: 5px } .component-sra-pdf .executive-container .bottom-tables-container .left-side .left-table td, .component-sra-pdf .executive-container .bottom-tables-container .left-side .left-table td .check-container span { font-size: 8pt } .component-sra-pdf .executive-container .bottom-tables-container .left-side .left-table table .img-content img { width: 85px } .component-sra-pdf .executive-container .bottom-tables-container .right-side { display: table-cell; vertical-align: top } .component-sra-pdf .executive-container .bottom-tables-container .right-side .right-title { color: #293e40; font: 1.4rem GilroyBold; font-family: GilroyBold; font-weight: bolder; padding-bottom: 5px } .component-sra-pdf .executive-container .bottom-tables-container .right-side .one-column-table table tr th { font-size: 8pt; padding: 5px } .component-sra-pdf .executive-container .bottom-tables-container .right-side .one-column-table table tr td { padding-top: 0 } .component-sra-pdf .executive-container .bottom-tables-container .right-side .one-column-table table .txt, .component-sra-pdf .executive-container .bottom-tables-container .right-side .one-column-table table tr td span { font-size: 8pt } .component-sra-pdf .project-plan-container { background-color: #fff; display: block; height: 1020px; padding: 40px; position: relative; width: 100% } .component-sra-pdf .project-plan-container .second-title { padding-bottom: 5px } .component-sra-pdf .project-plan-container .description p { margin-top: 0 } .component-sra-pdf table { border-collapse: collapse; text-align: left; width: 100% } .component-sra-pdf table .check-container { display: table; margin: 5px 0 } .component-sra-pdf table .check-container .square { display: table-cell; margin: 3px 0 } .component-sra-pdf table .check-container .square img { height: 10px; width: 10px } .component-sra-pdf table .check-container .txt { display: table-cell; padding-left: 15px } .component-sra-pdf table .titles th { background-color: #293e40; color: #fff; padding: 15px } .component-sra-pdf table .titles th.light-blue { background-color: #72d0e2; color: #000 } .component-sra-pdf table .img-content { padding: 0; text-align: center } .component-sra-pdf table .img-content img { height: auto; width: 115px } .component-sra-pdf table td { padding: 0 10px } .component-sra-pdf table .width-5 { width: 5% } .component-sra-pdf table .width-10 { width: 10% } .component-sra-pdf table .width-13 { width: 13% } .component-sra-pdf table .width-15 { width: 15% } .component-sra-pdf table .width-20 { width: 20% } .component-sra-pdf table .width-25 { width: 25% } .component-sra-pdf table .width-27 { width: 27% } .component-sra-pdf table .width-28 { width: 28% } .component-sra-pdf table .width-30 { width: 30% } .component-sra-pdf table .width-35 { width: 35% } .component-sra-pdf table .width-37 { width: 37% } .component-sra-pdf table .width-60 { width: 60% } .component-sra-pdf table, .component-sra-pdf td, .component-sra-pdf th { border: 2px solid #c8c8c8 } .component-sra-pdf .project-plan-container table td { padding-bottom: 5px; padding-top: 5px } .component-sra-pdf .action-container { background-color: #fff; display: block; height: 1020px; padding: 60px 40px; position: relative; width: 100% } .component-sra-pdf .first-title { clear: both; padding-top: 30px } .component-sra-pdf .separator { border: 0; border-color: #293e40; margin: 0 } .component-sra-pdf .second-title { padding-bottom: 15px; padding-top: 10px } .component-sra-pdf .content-list ul { padding-left: 20px } .component-sra-pdf .content-list ul li { list-style: disc } .component-sra-pdf .description { width: 100% } .component-sra-pdf .three-column-container { display: table; padding: 10px 0; text-align: center; width: 100% } .component-sra-pdf .three-column-container .column-item { display: table-cell; padding: 0 60px } .component-sra-pdf .three-column-container .column-item .item-image img { height: auto; width: 110px } .component-sra-pdf .three-column-container .column-item .item-image.column img { height: auto; width: 190px } .component-sra-pdf .column_1_3 .header { padding-left: 20px } .component-sra-pdf .column_1_3 .left { float: left; padding-left: 20px; width: 50% } .component-sra-pdf .column_1_3 .left .header span { font-size: 18px } .component-sra-pdf .column_1_3 .left .header p { padding: 5px 0 } .component-sra-pdf .column_1_3 .left .body { background-color: #f7f7f7; display: inline-block; height: 100px; margin-left: 0; margin-right: 0; margin-top: 10px; padding: 20px; width: 50% } .component-sra-pdf .column_1_3 .left .body.right { float: right; width: 49% } .component-sra-pdf .column_1_3 .left .body.left { float: left; width: 49% } .component-sra-pdf .column_1_3 .left .body .header { padding-bottom: 40px } .component-sra-pdf .column_1_3 .left .body .header span { font-size: 16px } .component-sra-pdf .column_1_3 .left .body .item .title .arrow-container { padding-left: 5px } .component-sra-pdf .column_1_3 .right { float: left; padding-left: 20px; width: 100% } .component-sra-pdf .one-column-table { padding-bottom: 30px } .component-sra-pdf .one-column-table table tbody { line-height: 1.5 } .component-sra-pdf .one-column-table table tbody tr:nth-child(2) td { padding-top: 1.7rem } .component-sra-pdf .column_table { margin-bottom: 40px } .component-sra-pdf .two_column_two_table { text-align: center; width: 100% } .component-sra-pdf .two_column_two_table .left { display: inline-block; margin-right: 6%; width: 37% } .component-sra-pdf .two_column_two_table .right { display: inline-block; width: 56% } .component-sra-pdf .two_column_two_table table { padding: 10px 20px } .component-sra-pdf .two_column_two_table table tbody tr { height: 30.6px } .component-sra-pdf .two_column_two_table .second-title { text-align: left } .component-sra-pdf .header-nav .left-content { float: left; width: 20% } .component-sra-pdf .header-nav .left-content .left-title { position: relative } .component-sra-pdf .header-nav .left-content .left-title:after { background-color: #72d0e2; bottom: -20px; content: ""; height: 2px; left: 0; position: absolute; width: 40% } .component-sra-pdf .header-nav .right-content { float: left; width: 70% } .component-sra-pdf .header-nav .right-content .nav-title { float: left; padding-right: 20px } .component-sra-pdf .header-nav .right-content ol { list-style-type: none; margin-top: 0 } .component-sra-pdf .header-nav .right-content ol li { display: table; float: left; margin-right: 10px; max-width: 140px } .component-sra-pdf .header-nav .right-content ol li.active { font-weight: 700 } .component-sra-pdf .header-nav .right-content ol li div { display: table-cell } .component-sra-pdf .header-nav .right-content ol li .left { padding-right: 10px } .component-sra-pdf .header-nav .right-content ol li .right { width: 140px } .component-sra-pdf .header-nav .right-logo { position: absolute; right: 30px; top: 21px } .component-sra-pdf .header-nav .right-logo .img-content img { height: auto; width: 170px } .component-sra-pdf .footer { bottom: 40px; height: 22px; left: 0; position: absolute; right: 0 } .component-sra-pdf .footer .left { left: 0; padding-left: 60px; position: absolute } .component-sra-pdf .footer .left img { height: auto; width: 40mm } .component-sra-pdf .footer .right { padding-right: 60px; position: absolute; right: 0 } .component-sra-pdf .footer .bolder { font-weight: bolder; padding-left: 5px; padding-right: 5px } .accordion-container { cursor: pointer; padding: 1.6rem 0 } .accordion-container .link-list-component .link-list-component-inner-wrapper, .accordion-container .link-list-component .link-list-content .link-list-block { padding: 0 } .accordion-container .link-list-component .link-list-block-title h5, .accordion-container .link-list-component .link-list-section-title { display: none } .accordion-container .accordion-container-question, .accordion-container .accordion-container-title { overflow: hidden; position: relative } .accordion-container .accordion-container-question p, .accordion-container .accordion-container-title p { font-size: 1.6rem; font-weight: 700; line-height: 1.7; margin: 0 2.6rem 0 0 } .accordion-container .accordion-container-question:after, .accordion-container .accordion-container-title:after { border-bottom: .1rem solid #293e40; border-right: .1rem solid #293e40; bottom: 0; content: ""; cursor: pointer; display: inline-block; height: .8rem; margin: auto; opacity: .6; position: absolute; right: .8rem; top: 0; transform: rotate(45deg); transform-origin: center center; transition: all .5s; width: .8rem } .accordion-container .accordion-container-answer, .accordion-container .accordion-container-content { display: none; overflow: hidden } .accordion-container .accordion-container-answer p, .accordion-container .accordion-container-content p { font-size: 1.4rem; line-height: 1.7; margin: 0 2.6rem 0 0 } .accordion-container .accordion-container-content { width: 100% } .accordion-container.show-hr-line { border-bottom: .1rem solid rgba(41,62,64,.2) } .accordion-container:hover .accordion-container-question:after { opacity: 1 !important } .accordion-container.accordion-container-expanded .accordion-container-question p, .accordion-container.accordion-container-expanded .accordion-container-title p { font-size: 1.6rem; font-weight: 700; line-height: 1.7; margin: 0 2.6rem 0 0 } .accordion-container.accordion-container-expanded .accordion-container-question:after, .accordion-container.accordion-container-expanded .accordion-container-title:after { opacity: 1; transform: rotate(225deg); transition: all .5s } .accordion-container.accordion-container-expanded .accordion-container-answer, .accordion-container.accordion-container-expanded .accordion-container-content { display: inline-block } .accordion-container.accordion-container-expanded .accordion-container-answer p, .accordion-container.accordion-container-expanded .accordion-container-content p { font-size: 1.4rem; line-height: 1.7; margin: 0 2.6rem 0 0 } @media only screen and (min-width: 768px) { .accordion-container { padding: 2.4rem 0 } .accordion-container .accordion-container-answer p, .accordion-container .accordion-container-content p, .accordion-container .accordion-container-question p, .accordion-container .accordion-container-title p, .accordion-container.accordion-container-expanded .accordion-container-answer p, .accordion-container.accordion-container-expanded .accordion-container-content p, .accordion-container.accordion-container-expanded .accordion-container-question p, .accordion-container.accordion-container-expanded .accordion-container-title p { font-size: 1.6rem } } @media only screen and (min-width: 1024px) { .accordion-container { padding: 3.2rem 0 } .accordion-container .accordion-container-question p, .accordion-container .accordion-container-title p { font-size: 2rem } .accordion-container .accordion-container-answer p, .accordion-container .accordion-container-content p { font-size: 1.8rem } .accordion-container.accordion-container-expanded .accordion-container-question p, .accordion-container.accordion-container-expanded .accordion-container-title p { font-size: 2rem; line-height: 1.7 } .accordion-container.accordion-container-expanded .accordion-container-answer p, .accordion-container.accordion-container-expanded .accordion-container-content p { font-size: 1.8rem; line-height: 1.7 } } @media only screen and (min-width: 1700px) { .accordion-container { padding: 4rem 0 } .accordion-container .accordion-container-question p, .accordion-container .accordion-container-title p, .accordion-container.accordion-container-expanded .accordion-container-question p, .accordion-container.accordion-container-expanded .accordion-container-title p { font-size: 2.2rem } } .faq-component { height: auto; max-width: calc(100vw - 2rem); overflow: visible; padding: .8rem 2rem 2.4rem 0 } .faq-component h3 { border-bottom: 1px solid rgba(41,62,64,.2); padding: 1.6rem 0 } .faq-component .accordion-container .accordion-container-question p { font-size: 1.6rem; font-weight: 700; line-height: 2.72rem; margin: 0 2.6rem 0 0 } .faq-component .accordion-container .accordion-container-answer p { font-size: 1.4rem; line-height: 2.38rem; margin: 0 2.6rem 0 0 } @media(min-width: 768px) { .faq-component { max-width: 100%; padding: .8rem 4rem 3.2rem 0 } .faq-component h3 { padding: 2.4rem 0 } .faq-component .accordion-container .accordion-container-answer p, .faq-component .accordion-container .accordion-container-question p { font-size: 1.6rem; line-height: 2.72rem } } @media(min-width: 1024px) { .faq-component { padding: .8rem 2rem 4rem 0 } .faq-component h3 { padding: 3.2rem 0 } .faq-component .accordion-container .accordion-container-question p { font-size: 2rem; line-height: 3.4rem } .faq-component .accordion-container .accordion-container-answer p { font-size: 1.8rem; line-height: 3.06rem } } @media(min-width: 1700px) { .faq-component { max-width: 100%; padding: .8rem 1.5rem 4.8rem 0 } .faq-component h3 { padding: 4rem 0 } .faq-component .accordion-container .accordion-container-question p { font-size: 2.2rem; line-height: 3.74rem } .faq-component .accordion-container .accordion-container-answer p { font-size: 1.8rem; line-height: 3.06rem } } .event-speaker-wrapper { display: flex; flex-direction: column; padding: 2.4rem 0 1.6rem; width: calc(100% - 2rem) } .event-speaker-wrapper .event-speaker-img .img-wrapper { border-radius: 50%; line-height: 0; margin-bottom: 1.6rem; margin-right: 2rem; max-height: 10rem; max-width: 10rem; overflow: hidden; position: relative; width: 100%; z-index: 99 } .event-speaker-wrapper .event-speaker-img img { height: auto; transition: all .25s ease; width: 100% } .event-speaker-wrapper .event-speaker-img img:hover { transform: scale(1.1); transition: transform .3s ease-in-out } .event-speaker-wrapper .icon-link-sec-text-sec { display: flex; flex: 9 9 9; flex-direction: column } .event-speaker-wrapper .icon-link-sec-text-sec h3 { font-size: 1.6rem; line-height: 2.72rem } .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation { flex-grow: 1; margin-bottom: .8rem } .accordion.section ul.list-unstyled .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation li.icon-link-sec-job-title, .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation .accordion.section ul.list-unstyled li.icon-link-sec-job-title, .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation .icon-link-sec-job-title.medium-body-copy { font-size: 1.4rem; line-height: 2.2rem } .event-speaker-wrapper .icon-link-sec-text-sec .cta-component { margin-bottom: 0; margin-top: 0 } .event-speaker-wrapper .icon-link-sec-text-sec .cta-component a { font-size: 1.4rem } @media only screen and (min-width: 768px) { .event-speaker-wrapper { display: flex; flex-direction: row; padding-bottom: 2.4rem; padding-top: 3.2rem } .event-speaker-wrapper .event-speaker-img { flex: 3 } .event-speaker-wrapper .event-speaker-img .img-wrapper { margin-bottom: 0; max-height: 11.2rem; max-width: 11.2rem } .event-speaker-wrapper .icon-link-sec-text-sec { flex: 9 } .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation { margin-bottom: 1.6rem } .event-speaker-wrapper .icon-link-sec-text-sec .cta-component { margin: unset; margin-top: .5rem } } @media only screen and (min-width: 1024px) { .event-speaker-wrapper { padding-bottom: 3.2rem; padding-top: 3.2rem } .event-speaker-wrapper .icon-link-sec-text-sec h3 { font-size: 1.8rem; line-height: 3.06rem } .accordion.section ul.list-unstyled .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation li.icon-link-sec-job-title, .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation .accordion.section ul.list-unstyled li.icon-link-sec-job-title, .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation .icon-link-sec-job-title.medium-body-copy { font-size: 1.6rem; line-height: 2.6rem } .event-speaker-wrapper .icon-link-sec-text-sec .cta-component a { font-size: 1.6rem } .event-speaker-wrapper .event-speaker-img .img-wrapper { max-height: 13rem; max-width: 13rem } } @media only screen and (min-width: 1700px) { .event-speaker-wrapper .event-speaker-img .img-wrapper { max-height: 16rem; max-width: 16rem } } .event-timing-component { margin-right: 5rem; padding: 3.2rem 0 2.4rem } .event-timing-component .event-timing-date, .event-timing-component .event-timing-hour { align-items: center; display: flex } .event-timing-component .event-timing-date { margin-top: .8rem } .event-timing-component .event-timing-date .date-icon { height: 2.4rem; margin-right: .8rem; width: 2.4rem } .event-timing-component .event-timing-hour { margin-top: .2rem } .event-timing-component .event-timing-hour .hour-icon { height: 2.4rem; margin-right: .8rem; width: 2.4rem } .event-timing-component .cta-container { margin-top: 1.6rem } @media(min-width: 768px) { .event-timing-component { padding: 4rem 0 3.2rem } } @media(min-width: 1700px) { .event-timing-component { padding: 4.8rem 0 4rem } } .event-text-image { padding-bottom: 1.6rem } .event-text-image:last-of-type { padding-bottom: 0 } .event-text-image:first-of-type { padding-top: .8rem } .event-text-image .event-item { align-items: start !important; display: flex } .event-text-image .event-item .event-img { height: 9.5rem; margin-right: 1.6rem; max-width: 9.5rem; overflow: hidden; width: 25% } .event-text-image .event-item .event-img img { height: auto; transition: all .25s linear; width: 100% } .event-text-image .event-item .event-link { width: 75% } .event-text-image .event-item .event-name { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; font-family: GilroyBold; overflow: hidden; transition: all .25s linear } .event-text-image > a:hover .event-img img { transform: scale(1.1) } .event-text-image > a:hover .event-name { background-position: 0 100%; transition: all .25s linear } @media(min-width: 768px) { .event-text-image:first-of-type { padding-top: 1.6rem } } @media(min-width: 1024px) { .event-text-image { padding-bottom: 2.4rem } .event-text-image:first-of-type { padding-top: 2.4rem } } @media(min-width: 1700px) { .event-text-image:first-of-type { padding-top: 3.2rem } .event-text-image .event-item .event-img { margin-right: 2.4rem } } .event-session { display: flex; flex-direction: column; padding: 1.6rem 0; width: calc(100% - 5rem) } .event-session .event-session-title-wrapper { flex: 3; margin: 0 0 10px } .event-session .event-session-title-wrapper .event-session-title { font: 1.8rem GilroyBold; line-height: 2.34rem } .event-session .event-session-content-wrapper { flex: 9 } .event-session .event-session-content-wrapper .event-session-card .event-session-card-title { font-family: GilroyBold } .event-session .event-session-content-wrapper .event-session-card .event-session-card-description { margin-bottom: 8px } .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time { display: flex; flex-direction: column } .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time .event-session-card-date { align-items: center; display: flex; flex-direction: row; margin-bottom: .8rem; margin-right: 24px } .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time .event-session-card-date .session-card-date-img { height: 24px; margin-right: 8px; width: 24px } .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time .event-session-card-time { align-items: center; display: flex; display: -webkit-flex; flex-direction: row } .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time .event-session-card-time .session-card-time-img { height: 24px; margin-right: 8px; width: 24px } .event-session .event-session-content-wrapper .event-session-card:not(:last-child) { margin-bottom: 32px } .event-session.text-only .event-session-title-wrapper { display: none } .event-session.text-only .event-session-content-wrapper { flex: 1 } .event-session.text-only .event-session-content-wrapper .event-session-card-date-time { display: none } @media(min-width: 768px) { .event-session { padding: 3.2rem 0; width: calc(100% - 4rem) } .event-session, .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time { flex-direction: row } .event-session .event-session-content-wrapper .event-session-card .event-session-card-date-time .event-session-card-date { margin-bottom: 0 } } @media(min-width: 1700px) { .event-session { padding: 4rem 0 } } .component-event-speaker-container { padding: 2.4rem 2rem 2.4rem 0 } .component-event-speaker-container .title-text { margin-bottom: 1.6rem } .component-event-speaker-container .speaker-cards { display: flex; flex-direction: column } .component-event-speaker-container .speaker-cards .event-speaker-img .img-wrapper { max-height: 6.5rem; max-width: 6.5rem } @media only screen and (min-width: 768px) { .component-event-speaker-container { margin: 3.2rem 0 .8rem } .component-event-speaker-container .speaker-cards { flex-direction: row; flex-wrap: wrap } .component-event-speaker-container .speaker-cards .title-text { flex: 3 } .component-event-speaker-container .speaker-cards .speaker-cards { flex: 9 } .component-event-speaker-container .event-speaker-wrapper { margin-bottom: 2.4rem; width: 50% } .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec h3 { font: 1.6rem GilroyRegular; line-height: 2.8rem } .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation { margin-bottom: 0 } } @media only screen and (min-width: 1024px) { .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec h3 { font: 1.8rem GilroyRegular; line-height: 2.8rem } } @media only screen and (min-width: 1700px) { .component-event-speaker-container { margin: 4rem 0 .8rem } .component-event-speaker-container .event-speaker-wrapper { margin-bottom: 3.2rem } .component-event-speaker-container .event-speaker-wrapper .event-speaker-img { max-height: 8rem; max-width: 8rem } .accordion.section ul.list-unstyled .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-text-item-designation li.icon-link-sec-job-title, .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-text-item-designation .accordion.section ul.list-unstyled li.icon-link-sec-job-title, .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-text-item-designation .icon-link-sec-job-title.medium-body-copy { line-height: 2.9rem } .component-event-speaker-container .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-job-title { font-size: 1.4rem; line-height: 2.38rem } } .event-overlay-container .show-hr-line { border-bottom: 1px solid rgba(41,62,64,.2) } .event-overlay-container .component-overlay-new-right-col-nav-sec { display: flex; flex-direction: column; height: 8rem; justify-content: center } .event-overlay-container .component-overlay-new-right-col-nav-sec .overlay-sticky-banner { padding: 0 } .event-overlay-container.component-overlay-new .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .eventSession, .event-overlay-container.component-overlay-new .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .eventSpeaker, .event-overlay-container.component-overlay-new .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .eventTiming { width: calc(100% - 2rem) } .event-overlay-container .interstitial-component { padding-top: 2.4rem } .event-overlay-container .interstitial-component .interstitial-full-bleed-img-wrapper { height: auto } .event-overlay-container .component-overlay-new-right-col-text-sec { height: calc(100vh - 12rem); margin-bottom: 0; padding-right: 3px } .accordion.section ul.list-unstyled .event-overlay-container li, .event-overlay-container .accordion.section ul.list-unstyled li, .event-overlay-container .medium-body-copy { font-size: 1.1rem; line-height: 1.2rem } @media(min-width: 768px) { .event-overlay-container .component-overlay-new-right-col-nav-sec { height: 10rem } .accordion.section ul.list-unstyled .event-overlay-container li, .event-overlay-container .accordion.section ul.list-unstyled li, .event-overlay-container .medium-body-copy { font-size: 1.6rem; line-height: 2.72rem } } @media(min-width: 1024px) { .event-overlay-container .component-overlay-new-right-col-nav-sec { height: 12rem } .event-overlay-container.component-overlay-new .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { overflow-x: hidden } .accordion.section ul.list-unstyled .event-overlay-container li, .event-overlay-container .accordion.section ul.list-unstyled li, .event-overlay-container .medium-body-copy { font-size: 1.6rem; line-height: 2.72rem } } @media(min-width: 1700px) { .event-overlay-container .component-overlay-new-right-col-nav-sec { height: 15rem } .accordion.section ul.list-unstyled .event-overlay-container li, .event-overlay-container .accordion.section ul.list-unstyled li, .event-overlay-container .medium-body-copy { font-size: 1.6rem; line-height: 2.72rem } } .component-overlay-speakers .component-overlay-new-right-col-text-sec { padding-right: 15px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { height: calc(100vh - 16rem); padding-bottom: 48px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec { padding-bottom: 0; padding-top: 0; width: calc(100% - 2rem) } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list { border-bottom: 1px solid #e6e6e6; padding-bottom: 0 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info { display: flex; display: -webkit-flex; flex-direction: row; margin: 48px 0 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .overlay-speakers-info-img { align-items: center; display: flex; flex: 3 3 3; -webkit-flex: 3 3 3; height: 180px; margin-right: 20px; min-width: 180px; width: 180px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .overlay-speakers-info-img img { border-radius: 50%; width: 100% } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .icon-link-sec-text-sec { display: flex; display: -webkit-flex; flex: 9 9 9; -webkit-flex: 9 9 9; flex-direction: column } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .icon-link-sec-text-sec .icon-link-sec-list-item-designation { flex-grow: 1; -webkit-flex-grow: 1; margin-bottom: 16px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-biography { display: flex; display: -webkit-flex; flex-direction: row; margin: 40px 0 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-biography .overlay-speakers-biography-title { flex: 3 3 3; -webkit-flex: 3 3 3; margin-right: 20px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-biography .overlay-speakers-biography-body { flex: 9 9 9; -webkit-flex: 9 9 9 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-biography .overlay-speakers-biography-body .overlay-speakers-biography-body-description { -webkit-margin-before: 0; -webkit-margin-after: 0; margin-block-end: 0; margin-block-start: 0 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions { display: flex; display: -webkit-flex; flex-direction: row; margin: 40px 0 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-title { flex: 3; -webkit-flex: 3; margin-right: 20px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container { flex: 9; -webkit-flex: 9 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card .overlay-speakers-sessions-card-description { margin-bottom: 8px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card .overlay-speakers-sessions-card-date-time { display: flex; display: -webkit-flex; flex-direction: row } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card .overlay-speakers-sessions-card-date-time .overlay-speakers-sessions-card-date { display: flex; display: -webkit-flex; flex-direction: row; margin-right: 24px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card .overlay-speakers-sessions-card-date-time .overlay-speakers-sessions-card-date .overlay-speakers-sessions-card-date-img { background-color: #293e40; height: 12px; margin-right: 8px; width: 12px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card .overlay-speakers-sessions-card-date-time .overlay-speakers-sessions-card-time { display: flex; display: -webkit-flex; flex-direction: row } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card .overlay-speakers-sessions-card-date-time .overlay-speakers-sessions-card-time .overlay-speakers-sessions-card-time-img { background-color: #293e40; height: 12px; margin-right: 8px; width: 12px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .overlay-speakers-sessions .overlay-speakers-sessions-container .overlay-speakers-sessions-card:not(:last-child) { margin-bottom: 32px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec hr { -webkit-margin-before: unset; -webkit-margin-after: unset; border: 1px solid gray; display: block; margin-block-end: unset; margin-block-start: unset } @media only screen and (max-width: 320px) { .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll { height: calc(100vh - 10rem) } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info { flex-direction: column; margin-bottom: 16px; margin-top: 24px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .overlay-speakers-info-img { flex: 1 1 1; -webkit-flex: 1 1 1; height: 100px; margin-bottom: 16px; max-height: 100px; max-width: 100px; width: 100px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .overlay-speakers-info-img img { max-width: 100px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .icon-link-sec-text-sec { flex: 1 1 1; -webkit-flex: 1 1 1 } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .icon-link-sec-text-sec .icon-link-sec-list-item-designation { margin-bottom: 8px } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info .icon-link-sec-text-sec .cta-component { margin: unset } .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-biography, .component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-sessions { margin: 16px 0 } } @media only screen and (min-width: 321px)and (max-width:768px) { .component-overlay-new.component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info { margin-bottom: 24px; margin-top: 32px } .component-overlay-new.component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-biography, .component-overlay-new.component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-sessions { margin: 24px 0 } } @media only screen and (min-width: 769px)and (max-width:1024px) { .component-overlay-new.component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-info { margin-bottom: 32px; margin-top: 40px } .component-overlay-new.component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-biography, .component-overlay-new.component-overlay-speakers .component-overlay-new-right-col-text-sec .component-overlay-new-right-col-scroll .icon-link-container .component-overlay-new-right-col-icon-link-sec .icon-link-sec-list .overlay-speakers-sessions { margin: 32px 0 } } .event-overlay-navigation-container .component-overlay-container-new.single-overlay .overlay-nav-btn { display: block !important } .event-overlay-navigation-container .event-overlay-container .component-overlay-new-right-col-nav-sec .overlay-sticky-banner { padding-right: 9rem } .component-link-grid { height: 100%; width: 100% } .component-link-grid .site-width-1700 { margin: auto; max-width: 100%; padding-left: 0; padding-right: 0 } .component-link-grid.align-to-top .link-grid-left .link-grid-content-container { padding-top: 6rem } .component-link-grid.align-to-top .link-grid-right .link-grid-item-wrapper { padding-bottom: 6rem } .component-link-grid.align-to-top.no-padding .link-grid-left .link-grid-content-container { padding-top: 0 } .component-link-grid.align-to-top.no-padding .link-grid-right .link-grid-item-wrapper { padding-bottom: 0 } .component-link-grid.align-to-top.small-padding .link-grid-left .link-grid-content-container { padding-top: 2.1rem } .component-link-grid.align-to-top.small-padding .link-grid-right .link-grid-item-wrapper { padding-bottom: 3.2rem } .component-link-grid .link-grid-outer-wrapper { height: auto; overflow: hidden; position: relative; width: 100% } .component-link-grid .link-grid-inner-wrapper { height: 100% } .component-link-grid .link-grid-content { display: flex; flex-direction: column } .component-link-grid .link-grid-right-bg { display: none } .component-link-grid .link-grid-left { height: 100%; position: unset; width: 100% } .component-link-grid .link-grid-left .link-grid-left-bg { display: none } .component-link-grid .link-grid-left .link-grid-content-container { padding-bottom: 2.4rem; padding-top: 6rem; position: relative } .component-link-grid .link-grid-left .link-grid-content-container h2 { line-height: 2.2rem; margin: 0 } .component-link-grid .link-grid-left .link-grid-content-container p.link-grid-description { margin-top: 1.6rem } .component-link-grid .link-grid-left .link-grid-content-container .link-grid-cta { margin-top: .4rem } .component-link-grid .link-grid-left .link-grid-content-container .link-grid-quote-container, .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-description, .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-title { display: none } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container { display: block } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-icon img { width: 1.2rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-text { font-family: GilroySemiBold; font-size: 2rem; line-height: 2.6rem; margin-bottom: .8rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-name { font-family: GilroySemiBold; font-size: 1.4rem; line-height: 2.38rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-title { font-size: 1.4rem; line-height: 2.38rem } .component-link-grid .link-grid-left .link-grid-eyebrow { -webkit-margin-before: 0; font-family: GilroySemiBold; margin-block-start: 0; margin-bottom: .8rem; padding-bottom: .4rem; position: relative } .component-link-grid .link-grid-left .link-grid-eyebrow:after { background: #293e40; bottom: 0; content: ""; display: block; height: .2rem; position: absolute; width: 2.8rem } .component-link-grid .link-grid-right { align-items: center; display: flex; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper { align-items: center; display: flex; flex-direction: column; flex-wrap: wrap; padding-bottom: 6rem; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-load-more { display: none } .component-link-grid .link-grid-right .link-grid-item-wrapper.load-more .link-grid-load-more { border: .1rem solid rgba(41,62,64,.1); color: #293e40; cursor: pointer; display: block; font: 1.4rem GilroySemiBold; line-height: 1.4; margin: 3.2rem auto 0; padding: 1rem 3.2rem } .component-link-grid .link-grid-right .link-grid-item-wrapper.load-more .link-grid-load-more:hover { background: rgba(41,62,64,.2) } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item { padding: 1.2rem 1rem; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.link-grid-item-hidden { display: none } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item a.link-grid-item-link { cursor: default } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item a.link-grid-item-link.clickable { cursor: pointer } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item a.link-grid-item-link.clickable .link-grid-item-title { background-image: linear-gradient(to right,var(--brand-green-darker,var(--acapulco)) 50%,transparent 50%); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline-block; overflow: hidden; padding-bottom: .4rem; transition: all .25s linear } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item a.link-grid-item-link.clickable:hover .link-grid-item-title { background-position: 0 100%; transition: all .25s linear } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.container-size-img .link-grid-arrow, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.container-size-img .link-grid-item-info { display: none } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.container-size-img .link-grid-item-img { max-height: 9.2rem; max-width: 21.7rem; overflow: hidden; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.container-size-img .link-grid-item-img img { height: auto; transition: all .25s ease-in-out; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.container-size-img a.link-grid-item-link.clickable:hover .link-grid-item-img { overflow: hidden } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.container-size-img a.link-grid-item-link.clickable:hover .link-grid-item-img img { transform: scale(1.2); transform-origin: top left; transition: transform .3s ease-in-out } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-img { border-radius: 50%; max-height: 13.1rem; max-width: 13.1rem; overflow: hidden; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-img img { overflow: hidden; transition: all .25s linear; width: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image a.link-grid-item-link.clickable .link-grid-item-title { background-image: none; background-size: 0,0 } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image a.link-grid-item-link.clickable:hover .link-grid-item-img img { transform: scale(1.2); transform-origin: center center } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-description { line-height: 1.5 } .component-link-grid .link-grid-right .link-grid-item-wrapper.mobile-two-column, .component-link-grid .link-grid-right .link-grid-item-wrapper.two-column { flex-direction: row } .component-link-grid .link-grid-right .link-grid-item-wrapper.mobile-two-column .link-grid-item, .component-link-grid .link-grid-right .link-grid-item-wrapper.two-column .link-grid-item { flex: 0 0 50%; max-width: 50% } .component-link-grid .link-grid-right .link-grid-item-wrapper.mobile-two-column .link-grid-item.circle-image .link-grid-item-img, .component-link-grid .link-grid-right .link-grid-item-wrapper.two-column .link-grid-item.circle-image .link-grid-item-img { margin-bottom: 1.6rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-img { height: auto; margin-bottom: .8rem; max-height: 3.2rem; width: 3.2rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-img img { width: 100% } .accordion.section ul.list-unstyled .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info .accordion.section ul.list-unstyled li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info .link-grid-item-title.medium-body-copy { display: inline-block; font-family: GilroySemiBold; line-height: 2.2rem; margin-bottom: .8rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info .link-grid-item-description { padding-bottom: .8rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info .link-grid-item-description.mob-tab-hide { display: none } @media only screen and (min-width: 768px) { .component-link-grid .link-grid-left .link-grid-content-container { padding-bottom: 4.8rem; padding-top: 6rem } .component-link-grid .link-grid-left .link-grid-content-container h2 { line-height: 2.8rem } .component-link-grid .link-grid-left .link-grid-content-container .link-grid-description { margin-bottom: 2rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-icon img { width: 2.8rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-text { font-size: 2.2rem; line-height: 2.86rem; margin-bottom: 1.6rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-name, .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-title { font-size: 1.6rem; line-height: 2.72rem } .component-link-grid .link-grid-left .link-grid-eyebrow { margin-bottom: 2.4rem } .component-link-grid .link-grid-right { padding: 0 2rem } .component-link-grid .link-grid-right .link-grid-item-wrapper { align-items: normal; flex-direction: row; justify-content: space-between; padding-bottom: 4.8rem } .component-link-grid .link-grid-right .link-grid-item-wrapper.load-more .link-grid-load-more { display: none } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item { flex: 0 0 33.333333%; max-width: 33.333333%; padding: 1.6rem 1rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item a.link-grid-item-link { display: flex; flex-direction: column; height: 100% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item a.link-grid-item-link .link-grid-item-info { flex: 1 0 auto } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.link-grid-item-hidden { display: block } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image { padding-right: 4rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-img { max-height: 18rem; max-width: 18rem } .component-link-grid .link-grid-right .link-grid-item-wrapper.three-column .link-grid-item { flex: 0 0 33.333333%; max-width: 33.333333% } .component-link-grid .link-grid-right .link-grid-item-wrapper.four-column .link-grid-item { flex: 0 0 25%; max-width: 25% } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-img { margin-bottom: 1.6rem; max-height: 4.5rem; width: 4.5rem } .accordion.section ul.list-unstyled .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info .accordion.section ul.list-unstyled li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-info .link-grid-item-title.medium-body-copy { margin-bottom: 1.6rem } } @media only screen and (min-width: 1024px) { .component-link-grid .link-grid-left .link-grid-content-container { padding-bottom: 2.8rem; padding-top: 8rem } .component-link-grid .link-grid-right .link-grid-item-wrapper { padding-bottom: 8rem } .component-link-grid .link-grid-right .link-grid-item-wrapper.mobile-two-column, .component-link-grid .link-grid-right .link-grid-item-wrapper.two-column { flex-direction: row } .component-link-grid .link-grid-right .link-grid-item-wrapper.mobile-two-column .link-grid-item, .component-link-grid .link-grid-right .link-grid-item-wrapper.two-column .link-grid-item { flex: 0 0 50%; max-width: 50% } .component-link-grid .link-grid-right .link-grid-item-wrapper.mobile-two-column .link-grid-item.circle-image .link-grid-item-img, .component-link-grid .link-grid-right .link-grid-item-wrapper.two-column .link-grid-item.circle-image .link-grid-item-img { margin-bottom: 1.6rem } .component-link-grid.small-padding .link-grid-left .link-grid-content-container { padding-top: 4rem } .component-link-grid.small-padding .link-grid-right .link-grid-item-wrapper { padding-bottom: 4rem } .component-link-grid .link-grid-left .link-grid-content-container h2 { line-height: 3.6rem } .component-link-grid .link-grid-left .link-grid-content-container p.link-grid-description { margin-top: 2.4rem } .component-link-grid .link-grid-left .link-grid-content-container .link-grid-cta { margin-top: 1rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-text { font-size: 2.8rem; line-height: 3.64rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-name, .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-title { font-size: 1.8rem; line-height: 3.06rem } .component-link-grid .link-grid-left .link-grid-eyebrow { margin-bottom: 1.6rem } .component-link-grid .link-grid-left .link-grid-eyebrow:after { width: 3.4rem } .component-link-grid .link-grid-right { padding: 0 3rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item { max-width: 41%; padding: 2.4rem 8rem 4rem 1rem } .accordion.section ul.list-unstyled .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info .accordion.section ul.list-unstyled li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info .link-grid-item-title.medium-body-copy, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-img { margin-bottom: 2.4rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info .link-grid-item-description.mob-tab-hide { display: inline-block } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item-img { margin-bottom: 2.4rem } } @media only screen and (min-width: 1700px) { .component-link-grid .site-width-1700 { max-width: 170rem; padding-left: 2rem; padding-right: 2rem } .component-link-grid .link-grid-outer-wrapper { height: 100%; overflow: unset; position: relative; width: 100% } .component-link-grid .link-grid-outer-wrapper:before { content: ""; padding-top: 52.4633207373%; width: 100% } .component-link-grid .link-grid-outer-wrapper:after { clear: both; content: ""; display: table } .component-link-grid .link-grid-right-bg { background: #f7f7f7; bottom: 0; display: inline-block; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100% } .component-link-grid .link-grid-left-bg { background: inherit; height: 100%; position: absolute; width: 100% } .component-link-grid .link-grid-left-bg:before { background: inherit; content: ""; display: block; height: 100%; left: -980%; position: absolute; width: 1000% } .component-link-grid.align-to-top .link-grid-left .link-grid-content-container { padding-top: 8rem } .component-link-grid.align-to-top .link-grid-right .link-grid-item-wrapper { padding-bottom: 0 } .component-link-grid .link-grid-left .link-grid-content-container { padding-bottom: 8rem; padding-top: 8rem } .component-link-grid.small-padding .link-grid-left .link-grid-content-container { padding-bottom: 4rem; padding-top: 4rem } .component-link-grid .link-grid-content { flex-direction: row } .component-link-grid .link-grid-left { padding-left: 4rem; padding-right: 0; position: relative; right: 2rem } .component-link-grid .link-grid-left .link-grid-content-container { background: inherit; display: flex; flex-direction: column; justify-content: center; padding: 8rem 4rem 8rem 0 } .component-link-grid .link-grid-left .link-grid-content-container.no-padding { padding: 0 } .component-link-grid .link-grid-left .link-grid-content-container.small-top-padding { padding: 4rem 0 } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-icon img { width: 3.6rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-quote-text { font-size: 3.6rem; line-height: 4.68rem; margin-bottom: 3.2rem } .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-name, .component-link-grid .link-grid-left .link-grid-content-container.quote .link-grid-quote-container .link-grid-attribution-title { font-size: 1.8rem; line-height: 3.06rem } .component-link-grid .link-grid-left .link-grid-content-container h2 { line-height: 4.8rem } .component-link-grid .link-grid-left .link-grid-left-bg { display: block; position: unset } .component-link-grid .link-grid-left .link-grid-eyebrow:after { width: 4rem } .component-link-grid .link-grid-right { fill: unset !important; stroke: unset !important; background-color: unset !important; opacity: unset !important } .component-link-grid .link-grid-right .link-grid-item-wrapper { padding-bottom: 0 } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item { padding: 2.4rem 4rem 4.8rem 0 } .accordion.section ul.list-unstyled .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info .accordion.section ul.list-unstyled li.link-grid-item-title, .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-info .link-grid-item-title.medium-body-copy { margin-bottom: .8rem } .component-link-grid .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image:last-child { padding-right: 0 } } .component-link-grid.speaker-variation .link-grid-inner-wrapper.site-width-1700 { max-width: 170rem; padding-left: 1rem; padding-right: 1rem; width: 100% } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container { padding: 5.6rem 0 4rem } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container .link-grid-title { padding-bottom: 3.2rem } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container .link-grid-cta { margin: 0 } .component-link-grid.speaker-variation .link-grid-right { display: flex; flex-direction: column } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper { padding-bottom: 1.6rem } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image { display: none; padding: 0 0 2.4rem } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link { align-items: center; display: flex } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link.clickable .link-grid-item-title { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0) !important; background-size: 205% .2rem !important; margin-bottom: 0; padding-bottom: 0 } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-img { margin-bottom: 0 } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-info { padding-left: 2rem; width: 100% } .component-link-grid.speaker-variation .link-grid-right .load-more-container { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto 5.6rem; width: 100% } .component-link-grid.speaker-variation .link-grid-right .load-more-container:before { background-color: #d8dbdc; content: ""; height: 1px; top: 5rem; width: 100% } .component-link-grid.speaker-variation .link-grid-right .load-more-container .load-more-button { border: 1px solid #d8dbdc; border-top: none; cursor: pointer; font-family: GilroySemiBold; font-size: 14px; padding: 10px 32px } @media only screen and (min-width: 768px) { .component-link-grid.speaker-variation .link-grid-inner-wrapper.site-width-1700 { padding-left: 1.5rem; padding-right: 1.5rem } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container { display: flex; max-width: 100% } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container .link-grid-title { flex: 1; padding-bottom: 0 } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container .link-grid-cta { margin-top: 0; text-align: end } .component-link-grid.speaker-variation .link-grid-right { padding: 0 1.5rem } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper { justify-content: flex-start; padding-bottom: 0 } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image { padding: 0 1.5rem 4rem } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link { align-items: center } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-img { margin-bottom: 1.6rem; max-height: none; max-width: none } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-img .component-asset-block { aspect-ratio: 1/1; border-radius: 50%; margin: 0 1.6rem; overflow: hidden } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-info { padding-left: unset; text-align: center } } @media only screen and (min-width: 1024px) { .component-link-grid.speaker-variation .link-grid-inner-wrapper.site-width-1700 { padding-left: 2rem; padding-right: 2rem } .component-link-grid.speaker-variation .link-grid-left .link-grid-content-container { padding: 8rem 0 5.6rem } .component-link-grid.speaker-variation .link-grid-right { padding: 0 2rem } .component-link-grid.speaker-variation .link-grid-right .load-more-container { margin: 0 auto 8rem } .component-link-grid.speaker-variation .link-grid-right .load-more-container .load-more-button:hover { background-color: #d8dbdc } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image { padding: 0 1.5rem 5.6rem } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-img { margin-bottom: 2.4rem } .component-link-grid.speaker-variation .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-img .component-asset-block { margin: 0 2.4rem } } @media only screen and (min-width: 1700px) { .component-link-grid.speaker-variation .link-grid-content { flex-direction: column } .component-link-grid.speaker-variation .link-grid-content .link-grid-left { max-width: 100%; padding-right: 2rem; right: 0 } .component-link-grid.speaker-variation .link-grid-content .link-grid-left .link-grid-content-container { flex-direction: row; padding: 8rem 0 6.4rem } .component-link-grid.speaker-variation .link-grid-content .link-grid-right { max-width: 100% } .component-link-grid.speaker-variation .link-grid-content .link-grid-right .link-grid-item-wrapper { padding-bottom: .8rem } .component-link-grid.speaker-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image { padding: 0 2rem 5.6rem } .component-link-grid.speaker-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item.circle-image .link-grid-item-link .link-grid-item-img .component-asset-block { margin: 0 4.8rem } } .component-link-grid.contact-variation .link-grid-inner-wrapper.site-width-1700 { max-width: 170rem; padding-left: 0; padding-right: 0; width: 100% } .component-link-grid.contact-variation.no-padding .link-grid-content .link-grid-right { padding-left: 0 } .component-link-grid.contact-variation .link-grid-outer-wrapper { overflow: hidden } .component-link-grid.contact-variation .link-grid-content { flex-direction: column } .component-link-grid.contact-variation .link-grid-content .link-grid-left { max-width: 100%; padding: 0 2rem; right: 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-left .link-grid-content-container { flex: 0 0 100%; flex-direction: row; max-width: 100%; padding: 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-left .link-grid-content-container .link-grid-title { flex: 1; padding-bottom: 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-left .link-grid-content-container .link-grid-cta { margin: 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-left .link-grid-content-container h2 { line-height: 1.3 } .component-link-grid.contact-variation .link-grid-content .link-grid-right { display: flex; flex-direction: column; max-width: 100%; padding: 0 2rem } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper { padding-bottom: 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item-text-container { padding-left: 16px } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item-text-container .link-grid-arrow svg { width: 18px } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item { flex: 0 0 100%; max-width: 100%; padding: 2.4rem 0 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-link { display: flex; flex-direction: row } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-img { max-height: 3.2rem; width: 3.2rem } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-title { margin-bottom: .8rem !important; padding-bottom: 0 !important } @media screen and (min-width: 768px) { .component-link-grid.contact-variation .link-grid-content .link-grid-left { padding: 2.4rem 2rem 0 } } @media screen and (min-width: 1024px) { .component-link-grid.contact-variation .link-grid-content .link-grid-left { padding: 4rem 0 0 3rem } .component-link-grid.contact-variation .link-grid-content .link-grid-right { padding-left: 3rem; padding-right: 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item-text-container { padding-left: 2.4rem } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item { padding: 4rem 0 0 } .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item .link-grid-item-img { max-height: 4.8rem; width: 4.8rem } } @media screen and (min-width: 1700px) { .component-link-grid.contact-variation .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item { flex: 0 0 50%; max-width: 50%; padding: 5.6rem 4rem 0 0 } .component-link-grid.contact-variation.link-grid__item-full-width .link-grid-content .link-grid-right .link-grid-item-wrapper .link-grid-item { max-width: inherit; padding-right: 0 } } .videoContainer { background-color: #f7f7f7; display: flex; justify-content: center } .component-video-container { background-color: #f7f7f7; display: flex; flex-wrap: wrap; margin-bottom: 3.2rem; max-width: 170rem; width: 100% } .component-video-container .player-container { display: inline-block } .component-video-container .player-container .mobile-only-line { border: .5px solid rgba(41,62,64,.2); margin: auto -30px 3.2rem } .component-video-container .player-container section[data-assettype=bc_video] .bc-player-default_default.not-hover.vjs-has-started.vjs-paused.vjs-user-active .vjs-control-bar:not(.vjs-focus-within):not(.vjs-control-bar-visible), .component-video-container .player-container section[data-assettype=bc_video] .bc-player-default_default.not-hover.vjs-has-started.vjs-playing.vjs-user-active .vjs-control-bar:not(.vjs-focus-within):not(.vjs-control-bar-visible), .component-video-container .player-container section[data-assettype=bc_video] .bc-player-default_default.vjs-has-started.vjs-playing.vjs-user-inactive .vjs-control-bar:not(.vjs-focus-within):not(.vjs-control-bar-visible) { transform: translateY(5.6rem) } .component-video-container .player-container section[data-assettype=bc_video] .vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-panel { display: flex; width: 4rem } .component-video-container .player-container section[data-assettype=bc_video] .vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-panel .vjs-mute-control { display: flex } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar { align-items: center; display: flex; height: 5.6rem; justify-content: center } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-control .vjs-icon-placeholder:before { align-items: center; display: flex; justify-content: center } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar span { color: #fff; font-size: 1.4rem } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-progress-control { height: 100% !important; position: unset; top: 0 } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-progress-control .vjs-progress-holder { height: .3rem } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-custom-control-spacer { display: none } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-current-time { order: 1 } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-time-control { order: 2 } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-duration { order: 3 } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-volume-panel { order: 4 } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-volume-panel .vjs-volume-level .vjs-slider-vertical .vjs-volume-level:before { font-size: .9em; left: -.3em; position: absolute; top: -.5em } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-volume-panel .vjs-volume-level .vjs-icon-volume-high:before { content: "" } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-volume-panel .vjs-volume-control { align-items: center; bottom: 100%; display: flex; height: 100%; left: 0; position: absolute; width: 100% } .component-video-container .player-container section[data-assettype=bc_video] .vjs-control-bar .vjs-fullscreen-control { order: 5 } .component-video-container .player-list-container { display: inline-block } .component-video-container .video-player .videosjs-placeholder-dimensions { height: auto } .component-video-container .video-player .vjs-volume-level { background-color: #fff } .component-video-container .video-player .video-js { height: 36vw; width: 100% } .component-video-container .video-player .video-js .video-js .vjs-control { padding-right: .4rem; width: 3.2rem } .component-video-container .video-player .video-js .vjs-play-progress { background-color: #fff } .component-video-container .video-player .video-js .vjs-dock-text, .component-video-container .video-player .video-js .vjs-share-control { display: none } .component-video-container .video-player .video-js.video-target .vjs-big-play-button { align-items: center; border: solid; display: flex; height: 4.4rem; justify-content: center; width: 4.4rem } .component-video-container .video-player .video-js.video-target .vjs-big-play-button.only-bc-btn { font-size: 2.8em; line-height: 0 } .component-video-container .video-player .video-js.video-target .vjs-big-play-button .vjs-icon-placeholder:before { position: relative } .component-video-container .video-player .video-js .vjs-big-play-button { background-color: transparent; border-radius: 1.3em; bottom: 0; display: block; font-size: 4em; left: 0; line-height: 1.4em; margin: auto; position: absolute; right: 0; top: 0; width: 1.5em; z-index: 1 } .component-video-container .video-player .video-js .vjs-big-play-button span { color: #fff; font-size: 4rem } .component-video-container .video-player .video-js.vjs-has-started.vjs-playing .vjs-big-play-button { display: none } .component-video-container .video-player .video-js.vjs-has-started .vjs-big-play-button, .component-video-container .video-player .video-js.vjs-has-started.vjs-ended .vjs-big-play-button { display: block } .component-video-container .video-player .video-js.brightcove .vjs-big-play-button { border: 4px solid #fff; height: 1.5em } .component-video-container .video-player .video-js.vjs-ended .vjs-big-play-button .vjs-icon-placeholder:before { content: "" } .component-video-container .video-player .video-js .vjs-control-bar { background-color: rgba(43,51,63,.7); height: 32px } .component-video-container .video-player .video-js .vjs-control-bar .vjs-control .vjs-icon-placeholder:before, .component-video-container .video-player .video-js .vjs-control-bar .vjs-control.vjs-time-control span { align-items: center; color: #fff; display: flex; justify-content: center } .component-video-container .video-player .video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control .vjs-volume-bar { margin-top: 1.6em } .component-video-container .video-player .video-js .vjs-control-bar .vjs-remaining-time { display: none } .component-video-container .video-player .vjs-overlay.vjs-overlay-background { background-color: rgba(41,62,64,.8); bottom: 0; left: 0; margin: 0; padding: 0; right: 0; text-align: left; top: 0; width: 100% } .component-video-container .video-player .vjs-overlay.vjs-overlay-background .overlay-links a { color: #fff } .component-video-container .video-player .vjs-overlay.title .overlay-container .overlay-main-title { -webkit-box-orient: vertical; -webkit-line-clamp: 2; display: block; font-family: GilroyBold; line-height: 3.9rem; max-height: 11em; overflow: hidden; padding: 32px 40px; position: relative; text-overflow: ellipsis } .component-video-container .video-player .vjs-overlay.title .overlay-container .overlay-main-title h2 { color: #fff; font-size: 3rem; line-height: 4rem; margin: 0 } .component-video-container .video-player .vjs-overlay.title .overlay-container .overlay-main-title:before { bottom: 0; color: #fff; content: "..."; font-size: 3em; position: absolute; right: 14px; visibility: hidden } .component-video-container .video-player .vjs-overlay.title .overlay-container .overlay-main-title:after { background-color: rgba(41,62,64,.8); color: #fff; content: ""; font-size: 3em; height: 1em; margin-top: .2em; position: absolute; right: 14px; visibility: hidden; width: 1em } .component-video-container .video-player .vjs-overlay.links .overlay-container { height: 100% } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side { background-color: #293e40; height: 100%; padding: 50px 24px 24px; width: 45% } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section { margin-bottom: 3.2rem } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-title .overlay-txt { font-family: GilroyBold; font-size: 2rem } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-link a { font-size: 1.4rem !important; line-height: normal } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-link a .cta-title-link-arrow { margin-left: 0; transform: scale(.7) } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-link a .cta-title-link-next { display: inline-block; line-height: 0; margin-left: 5px; vertical-align: bottom } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-link a .cta-title-link-next svg { transform: scale(.7) } .component-video-container .vjs-youtube .vjs-progress-control, .component-video-container section[data-assettype=dam_video] .vjs-progress-control { height: auto; position: absolute; right: 0; top: -3px; width: 100% } .component-video-container .vjs-youtube .vjs-progress-control .vjs-slider, .component-video-container section[data-assettype=dam_video] .vjs-progress-control .vjs-slider { margin: 0 } .component-video-container .vjs-youtube .vjs-progress-control .vjs-slider .vjs-slider-bar:before, .component-video-container section[data-assettype=dam_video] .vjs-progress-control .vjs-slider .vjs-slider-bar:before { display: none } .component-video-container .vjs-youtube .vjs-remaining-time, .component-video-container section[data-assettype=dam_video] .vjs-remaining-time { align-items: center; display: flex; flex: 1; padding-left: 5px } .component-video-container .video-playlist .playlist-container .playlist-title { margin-bottom: 16px } .component-video-container .video-playlist .playlist-container .playlist-wrapper { height: 400px; overflow-x: hidden; overflow-y: auto; visibility: hidden } .component-video-container .video-playlist .playlist-container .playlist-wrapper:hover { overflow-y: auto; visibility: visible } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list { display: flex; flex-direction: column; visibility: visible } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item { background-color: #f1f1f1; display: none; height: 96.75px; margin-bottom: 16px; max-height: 96.75px; position: relative } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item:first-child { margin-top: 8px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item:last-child { margin-bottom: 0 } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail { height: 96.75px; max-height: 96.75px; min-width: 172px; overflow: hidden; position: relative; width: 172px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-duration { background-color: #293e40; border-radius: .2rem; bottom: .8rem; color: #fff; font-size: 1.2rem; letter-spacing: .1rem; padding: .2rem .4rem; position: absolute; right: .8rem } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay { background-color: rgba(129,181,161,.8); height: 100%; left: 0; opacity: 0; position: absolute; top: 0; width: 100% } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .play-icon { background-color: transparent; border: 2px solid #fff; border-radius: 50%; bottom: 0; display: block; height: 32px; left: 0; margin: auto; padding: 0; position: absolute; right: 0; top: 0; transition: background-color .5s ease; -webkit-user-select: none; -moz-user-select: none; user-select: none; width: 32px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .play-icon:after { border-color: transparent transparent transparent #fff; border-style: solid; border-width: 6px 0 6px 10px; box-sizing: border-box; content: ""; display: block; left: calc(50% - 3.5px); position: absolute; top: calc(50% - 6px) } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-image { transition: all .3s ease; width: 100% } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item.show-item { background-color: #fff; display: flex; flex-direction: row } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item.show-item:hover .video-thumbnail-overlay { opacity: 1 } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item.show-item:hover .video-thumbnail-image { transform: scale(1.2) } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item.hideVideo, .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item.show-item.hideVideo { display: none } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description { font-family: GilroySemiBold; margin-bottom: 14px; margin-top: 14px; padding-left: 14px; padding-right: 14px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description p { -webkit-margin-after: 0; -webkit-margin-before: 0; -webkit-margin-end: 0; -webkit-margin-start: 0; line-height: 1.6em; margin: 0; margin-block-end: 0; margin-block-start: 0; margin-inline-end: 0; margin-inline-start: 0; max-height: 4.8em; overflow: hidden; padding-right: 1rem; position: relative; top: 50%; transform: translateY(-50%); width: 100% } .component-video-container .below-video { color: #293e40; display: flex; flex-direction: row; padding: 32px } .component-video-container .below-video .titles { flex: 6; padding-left: 0; padding-right: 40px } .component-video-container .below-video .titles .video-title { margin-bottom: 16px } .component-video-container .below-video .cta-section { border-left: 1px solid rgba(41,62,64,.2); flex: 4; padding-left: 40px } .component-video-container .below-video .cta-section .cta-component { display: block; margin: 0 0 24px; white-space: nowrap } .component-video-container .below-video .cta-section .cta-component a .cta-title-link-arrow { margin-right: 0 } .component-video-container .video-filter-container { padding-top: 1.6rem; width: 100% } .component-video-container .video-filter-container .video-filter-title { align-items: center; display: flex; font-family: GilroyBold; font-size: 18px; padding-left: 2rem } .component-video-container .video-filter-container .generic-dropdown-container { display: block; flex: 1; padding: 0 1rem; position: relative } .component-video-container .video-filter-container .generic-dropdown-container .header-section { align-items: center; -moz-appearance: none; -webkit-appearance: none; appearance: none; border: 1px solid #293e40; color: #333; display: flex; float: right; font-family: GilroySemiBold; font-size: 16px; height: 56px; line-height: 1.75; margin: 16px 0; padding-left: 16px; padding-right: 16px; position: relative; width: 100%; -ms-word-break: normal; word-break: normal } .component-video-container .video-filter-container .generic-dropdown-container .header-section .thumbnail { padding-right: 8px; padding-top: 5px } .component-video-container .video-filter-container .generic-dropdown-container .header-section .thumbnail img { opacity: .6 } .component-video-container .video-filter-container .generic-dropdown-container .header-section:after { border-bottom: 1px solid #293e40; border-right: 1px solid #293e40; content: ""; cursor: pointer; display: inline-block; height: 8px; opacity: .6; position: absolute; right: 16px; transform: rotate(45deg); transform-origin: center center; transition: all .5s; width: 8px } .component-video-container .video-filter-container .generic-dropdown-container .header-section:hover { cursor: pointer } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options { clear: both; height: 0; left: 1rem; position: absolute; right: 1rem; top: 57px; visibility: hidden; z-index: 2 } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options ul { background: #fff; border: 1px solid #293e40; display: flex; flex-direction: column; padding: 0 } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options ul li { align-items: center; display: flex; height: 40px; padding: 0 40px } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options ul li:hover { background: hsla(0,0%,78%,.1) } .component-video-container .video-filter-container .generic-dropdown-container.open .header-section:after { transform: rotate(225deg) } .component-video-container .video-filter-container .generic-dropdown-container.open .dropdown-options { height: 100%; visibility: visible } .component-video-container .video-filter-container .generic-dropdown-container:hover .header-section .thumbnail img, .component-video-container .video-filter-container .generic-dropdown-container:hover .header-section:after { opacity: 1 } .component-video-container .video-filter-container .generic-dropdown-container:hover .dropdown-options { cursor: pointer } .component-video-container .component-filter-new { margin-top: 0 } .component-video-container .component-filter-new .filter-select-box { width: 28.6rem } .component-video-container .component-filter-new .filter-select-box .show-icon { left: 1.5rem; position: absolute } .component-video-container .component-filter-new .filter-select-box .filter-select-text { display: block; font-size: 1.4rem; left: 4.5rem; max-width: 55%; padding-top: 1.2rem; position: absolute } .component-video-container .component-filter-new .filter-select-box .filter-chevron { position: absolute; right: 1.5rem } .component-video-container .component-filter-new .filter-select-box .filter-chevron svg { transform: rotate(180deg) } @supports(-webkit-line-clamp:3) { .video-description p { -webkit-box-orient: vertical; -webkit-line-clamp: 3; display: -webkit-box } .video-description p:after, .video-description p:before { visibility: hidden } } @media only screen and (min-width: 769px)and (max-width:1024px) { .component-video-container .video-filter-container .generic-dropdown-container { min-width: 30rem; padding-right: 0 } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options { right: 0 } .component-video-container .video-player .video-js .vjs-big-play-button { font-size: 3em } .component-video-container .video-player .video-js .vjs-big-play-button span { font-size: 3rem } .component-video-container .video-player .video-js .vjs-big-play-button.only-bc-btn { font-size: 2.2em } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side { padding: 24px } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-title .overlay-txt { font-size: 1.2em } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-link a { font-size: .8em !important } .component-video-container .below-video { padding: 24px } .component-video-container .below-video .titles { padding-right: 24px } .component-video-container .below-video .cta-section { padding-left: 24px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item { height: 63px; max-height: 63px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item:first-child { margin-top: unset } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail { height: 63px; max-height: 63px; min-width: 112px; width: 112px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .video-duration { bottom: 4px; left: 4px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description p { line-height: 1.4em; max-height: 2.8em } @supports(-webkit-line-clamp:2) { .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description p { -webkit-line-clamp: 2 } } } @media only screen and (min-width: 321px)and (max-width:767px) { .component-video-container { display: block } .component-video-container .video-filter-container .video-filter-title { padding-left: 1rem } .component-video-container .player-container { max-width: 100% } .component-video-container .video-player .video-js { height: 53vw } .component-video-container .video-player .video-js .vjs-big-play-button { font-size: 3em } .component-video-container .video-player .video-js .vjs-big-play-button span { font-size: 3rem } .component-video-container .video-player .video-js .vjs-big-play-button span:before { line-height: 5.1rem } .component-video-container .video-player .video-js .vjs-big-play-button.only-bc-btn { font-size: 2.2em } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section .overlay-link a span svg { transform: scale(.6) } .component-video-container .below-video { flex-direction: column; padding: 16px 0 } .component-video-container .below-video .titles { padding-bottom: 2.4rem; padding-right: 16px } .component-video-container .below-video .cta-section { border-left: 0; border-top: 1px solid rgba(41,62,64,.2); padding: 24px 0 0 } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item { background-color: #fff; display: flex; flex-direction: row; height: unset; max-height: unset } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item:first-child { margin-top: unset } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail { height: auto; max-height: unset; max-width: 27.7rem; width: unset } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .video-duration { bottom: 16px; left: 16px } .component-video-container .vjs-control-bar { height: 25px } } @media only screen and (max-width: 320px) { .component-video-container { display: block } .component-video-container .video-filter-container { padding: 0 1rem } .component-video-container .video-filter-container .video-filter-title { padding-left: 0; padding-top: 1.6rem } .component-video-container .video-filter-container .generic-dropdown-container { padding: 0 } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options { left: 0; right: 0 } .component-video-container .player-container { max-width: 100% } .component-video-container .video-player .video-js { height: 48vw } .component-video-container .video-player .video-js .vjs-big-play-button { font-size: 2em } .component-video-container .video-player .video-js .vjs-big-play-button span { display: flex; font-size: 3rem; line-height: 0 } .component-video-container .video-player .video-js .vjs-big-play-button.only-bc-btn { font-size: 1.4em } .component-video-container .video-player .video-js .vjs-control-bar { height: 3.2rem } .component-video-container .video-player .video-js .vjs-control-bar .vjs-play-control { height: 3.2rem; width: 3.2rem } .component-video-container .video-player .vjs-overlay.links .overlay-container .overlay-left-side { display: none } .component-video-container .video-player .vjs-overlay.title .overlay-container .overlay-main-title { display: none; max-height: 5.5em; padding-top: 15px } .component-video-container .video-player .vjs-overlay.title .overlay-container .overlay-main-title h2 { font-size: 1.7rem; line-height: 2rem } .component-video-container .video-playlist .playlist-container { display: block } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item { background-color: #fff; display: flex; flex-direction: row; height: unset; height: 73.125px; max-height: unset; max-height: 73.125px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item:first-child { margin-top: unset } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail { height: 73.125px; max-height: 73.125px; min-width: 130px; width: 130px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .video-duration { bottom: 8px; left: 8px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description { padding-left: 8px; padding-right: 8px } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description p { line-height: 1.2em; max-height: 3.6em } .component-video-container .video-playlist .player-list-container { display: block } .component-video-container .below-video { flex-direction: column; padding: 16px 0 0 } .component-video-container .below-video .titles { border-right: 0; padding: 0 0 24px } .component-video-container .below-video .titles .video-title { margin-bottom: 8px } .component-video-container .below-video .cta-section { border-left: none; border-top: 1px solid rgba(41,62,64,.2); padding: 24px 0 0 } } @media(max-width: 768px) { .component-video-container .video-filter-container .generic-dropdown-container .header-section { height: 50px } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options { top: 51px } .component-video-container .video-filter-container .generic-dropdown-container .dropdown-options ul li { height: 48px; padding: 0 16px } } @media(min-width: 767px) { .component-video-container .video-filter-container .generic-dropdown-container { max-width: 43rem } } @media only screen and (max-width: 767px) { .playlist-wrapper { height: 100% !important } .component-video-container .video-player .video-js .vjs-control-bar .vjs-control .vjs-current-time { display: none } .component-video-container .video-player .video-js .vjs-control-bar .vjs-control .vjs-duration { display: flex } } @media only screen and (min-width: 768px) { .component-video-container { margin-bottom: 4rem } .component-video-container .below-video { background-color: #fff } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .play-icon { height: 4rem; width: 4rem } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-thumbnail .video-thumbnail-overlay .play-icon:after { border-width: 9px 0 9px 15px; left: calc(50% - 6px); top: calc(50% - 9px) } .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list .video-item .video-description { padding-left: 1.6rem; padding-right: 1.6rem } .component-video-container .player-container .mobile-only-line { margin: 4rem -30rem } .component-video-container .video-filter-container { display: flex } .component-video-container .video-player .video-js.video-target .vjs-big-play-button { border: .5rem solid #fff; border-radius: 100%; height: 8.8rem; width: 8.8rem } .component-video-container .video-player .video-js .vjs-big-play-button span { display: flex; font-size: 5rem } .component-video-container .video-player .overlay-container .overlay-main-title { display: block } .component-video-container .video-player .video-js .vjs-control-bar { height: 4.8rem } .component-video-container .video-player .video-js .vjs-control-bar .vjs-control { width: 4.8rem } .component-video-container .component-filter-new { max-width: 35rem; width: auto } .component-video-container .component-filter-new .filter-select-box { margin: initial } .component-video-container .component-filter-new .filter-options { width: 28.6rem } .video-js .vjs-volume-panel .vjs-mute-control:hover ~ .vjs-volume-control.vjs-volume-vertical { bottom: 100%; left: 0; position: absolute; transition: none; width: 100% } .video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical { transition: none } .video-js .vjs-control-bar .vjs-current-time, .video-js .vjs-control-bar .vjs-duration, .video-js .vjs-control-bar .vjs-time-divider { display: flex } .video-js .vjs-control-bar .vjs-current-time { display: flex; justify-content: flex-end; padding-right: 0 } .video-js .vjs-control-bar .vjs-duration { margin-right: 30%; padding-left: 0 } .video-js .vjs-control-bar .vjs-time-divider { align-items: center; justify-content: center; padding: .3rem 0 0 } } @media only screen and (min-width: 1024px) { .component-video-container { margin-bottom: 4.8rem } .component-video-container .player-container .mobile-only-line { display: none } .component-video-container .player-list-container { border-left: .15rem solid #d3d3d3 } } @media only screen and (min-width: 1700px) { .component-video-container { margin-bottom: 6.6rem } .component-video-container .video-player .video-js.video-target .vjs-big-play-button { height: 8.8rem; width: 8.8rem } .component-video-container .video-player .video-js .vjs-big-play-button span { display: flex; font-size: 6rem } .component-video-container .video-player .video-js .vjs-control-bar { height: 5.6rem } .video-js .vjs-time-control { display: flex } } .vjs-button > .vjs-icon-placeholder:before { font-size: 2.8rem } .video-js .vjs-dock-shelf { margin-right: 2rem; margin-top: .8rem } .video-js .vjs-share-control { margin-right: 2px !important } .video-js .vjs-dock-text .vjs-dock-title, .video-js .vjs-share-control span { font-size: 1.5rem } .video-js .vjs-dock-text .vjs-dock-description { font-size: 1.2rem } .video-js .vjs-social-overlay { align-items: center; display: flex; justify-content: center } .video-js .vjs-social-overlay .vjs-modal-dialog-content { background-color: #fff; box-shadow: 0 0 10px 2px #293e40; color: #293e40; font-family: GilroyRegular; height: auto; left: 20px; position: relative; width: 85% } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-title { font-size: 2.8rem !important; margin-bottom: 0 } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-description { font-family: GilroyRegular; font-size: 1.5rem !important; margin: 0 } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-share-links { padding: 2rem 0 } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-share-links a { padding-right: .5em !important } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-share-links a:before { font-size: 1.4rem } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-share-links a:nth-child(2) { display: none } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-label-text { font-size: 1.4rem; font-weight: 700 } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-direct-link input, .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-embed-code input { color: #293e40 !important; outline: 1px solid #293e40; width: 100% } .video-js .vjs-social-overlay .vjs-modal-dialog-content .vjs-social-embed-code { margin-bottom: 10px } .video-js .vjs-social-overlay .vjs-close-button { color: #000; height: 4em; position: relative; right: 2em; top: -16.5em; width: 4em } @media only screen and (min-width: 768px) { .video-js .vjs-dock-shelf { margin-right: 3.5rem } .video-js .vjs-social-overlay .vjs-modal-dialog-content { width: 70% } } @media only screen and (min-width: 1024px) { .video-js .vjs-dock-shelf { margin-right: 5rem } .video-js .vjs-social-overlay .vjs-modal-dialog-content { width: 50% } } @media only screen and (min-width: 1700px) { .video-js .vjs-social-overlay .vjs-modal-dialog-content { width: 45% } } @supports(-ms-ime-align:auto) { .video-js .vjs-big-play-button .vjs-icon-placeholder:before { top: .5rem } @media only screen and (min-width: 768px) { .video-js .vjs-big-play-button .vjs-icon-placeholder:before { top: 1rem } } @media only screen and (max-width: 768px) { .component-video-container .video-playlist .playlist-container .playlist-wrapper .items-list { overflow-x: hidden; overflow-y: hidden } } } div#video-filter:focus, div#video-filter:focus-visible { outline-color: #3eaa2b; outline-style: solid; outline-width: 3px } .dropdown-options > ul > li:focus, .dropdown-options > ul > li:focus-visible { outline-color: #3eaa2b; outline-style: solid; outline-width: 3px } .component-small-marquee { padding: 0; position: relative; z-index: 1 } .component-small-marquee .content-main.center-alignment { text-align: center } .component-small-marquee .content-main.center-alignment .flex-box-col-lg-10 { margin: auto } .component-small-marquee .content-main.center-alignment .flex-box-col-lg-10 .title { padding-bottom: 1.6rem } .component-small-marquee .content-main.center-alignment .flex-box-col-lg-10 .description { text-align: center } .component-small-marquee .content-main.center-alignment .flex-box-col-lg-10 .small-marquee-text-cta-section { padding-top: 2.4rem } .component-small-marquee .content-main.center-alignment .flex-box-col-lg-10 .small-marquee-text-cta-section .cta-component.cta-rectangle-box { margin-right: 0 } .component-small-marquee .bg { bottom: 0; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100%; z-index: -1 } .component-small-marquee.padding-top-160 { padding-top: 11.2rem } .component-small-marquee.padding-top-56, .component-small-marquee.padding-top-80 { padding-top: 5.6rem } .component-small-marquee.padding-top-32 { padding-top: 3.2rem } .component-small-marquee.padding-bottom-80 { padding-bottom: 5.6rem } .component-small-marquee.padding-bottom-56 { padding-bottom: 4rem } .component-small-marquee.padding-bottom-32 { padding-bottom: 1.6rem } .component-small-marquee .breadcrumb-container .component-breadcrumbs { padding: 2.4rem 0; position: relative } .component-small-marquee .breadcrumb-container .component-breadcrumbs ul:after { width: 0 } .component-small-marquee .label { padding-bottom: 1rem; position: relative } .component-small-marquee .label span { font-family: GilroySemiBold; font-size: 1.2rem; font-weight: 500; line-height: 3.74rem } .component-small-marquee .label:after { background: #474d52; bottom: 0; content: ""; display: block; height: .2rem; position: absolute; width: 2.8rem } .component-small-marquee .title { padding-bottom: 1.6rem; padding-top: .8rem } .component-small-marquee .title h1, .component-small-marquee .title h2 { margin-bottom: 0; padding-bottom: 0 } .component-small-marquee .description { color: #293e40; font-size: 1.8rem; line-height: 3.4rem; padding: 0; text-align: left } .component-small-marquee .description p:last-child { margin-bottom: 0 } .component-small-marquee .description p:first-child { margin-top: 1.6rem } .component-small-marquee .description ul { padding-left: 1.7rem } .component-small-marquee .description ul li { list-style: disc } .component-small-marquee .small-marquee-text-cta-section { padding-top: 2.4rem } .component-small-marquee .logo-image-wrapper { height: 6.4rem; margin-top: 2.4rem } .component-small-marquee .logo-image-wrapper .logo-image { height: 100%; width: auto } .component-small-marquee .reduced-top-padding { padding-top: 0 !important } .component-small-marquee .reduced-top-padding h1.reduced-top-padding-title { padding-top: 1.2rem } .component-small-marquee.small-marquee-uf-variation .content-main { padding-left: 0 } .component-small-marquee.small-marquee-uf-variation .content-main .flex-box-col-lg-10, .component-small-marquee.small-marquee-uf-variation .content-main .flex-box-col-md-12, .component-small-marquee.small-marquee-uf-variation .content-main .flex-box-col-sm-6 { padding-left: 0; padding-right: 0 } .component-small-marquee.small-marquee-uf-variation .logo-image-wrapper { margin-bottom: 2.4rem } .component-small-marquee.small-marquee-uf-variation .reduced-top-padding h1.reduced-top-padding-title { padding-top: 0 } .component-small-marquee.small-marquee-uf-variation .annotation-section { padding-bottom: 3.2rem } .component-small-marquee.small-marquee-uf-variation .description { font-family: GilroyRegular } .component-small-marquee.small-marquee-uf-variation .description p { /*font-family: GilroyBold*/ } .component-small-marquee.small-marquee-uf-variation .description p:first-child { margin-top: 0 } .component-small-marquee.small-marquee-uf-variation .description ul { font-family: GilroyRegular; margin-bottom: 1.6rem } .component-small-marquee.small-marquee-uf-variation .flex-box-col-lg-10, .component-small-marquee.small-marquee-uf-variation .flex-box-col-md-12, .component-small-marquee.small-marquee-uf-variation .flex-box-col-sm-6 { max-width: 100% } .component-small-marquee.small-marquee-brand-variation { padding-bottom: 5.6rem } .component-small-marquee.small-marquee-brand-variation .label { padding-bottom: 0 } .component-small-marquee.small-marquee-brand-variation .label span { font-size: 1.6rem } .component-small-marquee.small-marquee-brand-variation .label:after { display: none } .component-small-marquee.small-marquee-brand-variation .title { padding-bottom: .8rem; padding-top: .8rem } .component-small-marquee.small-marquee-brand-variation .title h1, .component-small-marquee.small-marquee-brand-variation .title h2 { padding-top: 0 } @media only screen and (min-width: 768px) { .component-small-marquee .small-marquee-text-cta-section { padding-top: 3.2px } .component-small-marquee .label .gable-green-text { font-size: 1.4rem } .component-small-marquee .description { font-size: 2rem } .component-small-marquee.small-marquee-brand-variation .label span { font-size: 1.8rem } .component-small-marquee.small-marquee-brand-variation .title { padding-bottom: 1.6rem } .component-small-marquee.small-marquee-brand-variation .description { font-size: 2rem } } @media only screen and (min-width: 1024px) { .component-small-marquee.padding-top-160 { padding-top: 16rem } .component-small-marquee.padding-top-80 { padding-top: 8rem } .component-small-marquee.padding-top-56 { padding-top: 5.6rem } .component-small-marquee.padding-top-32 { padding-top: 3.2rem } .component-small-marquee.padding-bottom-80 { padding-bottom: 8rem } .component-small-marquee.padding-bottom-56 { padding-bottom: 5.6rem } .component-small-marquee.padding-bottom-32 { padding-bottom: 3.2rem } .component-small-marquee .small-marquee-text-cta-section { padding-top: 4rem } .component-small-marquee .title { padding-bottom: 2.4rem; padding-top: 1.6rem } .component-small-marquee .title h1, .component-small-marquee .title h2 { margin-bottom: 0; padding-bottom: 0 } .component-small-marquee .description p:first-child { margin-top: 3.2rem } .component-small-marquee .label .gable-green-text { font-size: 1.8rem } .component-small-marquee.small-marquee-brand-variation .description { font-size: 2.4rem } } @media only screen and (min-width: 1700px) { .component-small-marquee .title { padding-bottom: 2.4rem; padding-top: .8rem } .component-small-marquee .description { font-size: 2.2rem } .component-small-marquee .label .gable-green-text { font-size: 2rem } .component-small-marquee .small-marquee-text-cta-section { padding-top: 5.6rem } .component-small-marquee.small-marquee-brand-variation .label span { font-size: 2rem } .component-small-marquee.small-marquee-brand-variation .description { font-size: 2.8rem } } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column { padding-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .label { padding-top: 8rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .title { padding-bottom: .4rem; padding-top: 3.2rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .title h1 { padding-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .description { padding-bottom: 6.4rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .description p { margin-bottom: 1.6rem; margin-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .description ul { margin-bottom: 0; margin-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-right-column { padding-top: 8.5rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-right-column .title-component .title-component-inner-wrapper { padding-top: 0 } @media only screen and (min-width: 768px)and (max-width:1023px) { .component-small-marquee { padding-top: 56px !important } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .label { padding-top: 7rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .title { padding-top: 2.4rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .title h1 { padding-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-right-column { padding-top: 7.6rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-right-column .title-component .title-component-inner-wrapper { padding-top: 0 } } @media only screen and (max-width: 767px) { .component-small-marquee { padding-top: 56px !important } .component-small-marquee.small-marquee-uf-variation .annotation-section { padding-bottom: 1.6rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .label { padding-top: 4rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .title { padding-top: 2.4rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .description, .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .title h1 { padding-bottom: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .description p { margin-bottom: .8rem; margin-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-left-column .component-small-marquee .description ul { margin-bottom: 0; margin-top: 0 } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-right-column { padding-top: 2.4rem } .eloqua-form-core-wrapper.is-demonow-page .split-50.eloqua-form-right-column .title-component .title-component-inner-wrapper { padding-top: 0 } } .component-copy-content { background-color: #fff } .component-copy-content h2 { font-size: 2.2rem } .component-copy-content h4 { font-size: 2.2rem; margin-top: 5.6rem } .component-copy-content li, .component-copy-content p { font-size: 1.6rem } .component-copy-content ul { -webkit-padding-start: 2.5rem; margin: 3.2rem 0 0; padding-inline-start: 2.5rem } .component-copy-content ul li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; color: #293e40; font-size: 1.6rem; list-style: disc } .component-copy-content .cta-container { margin: 2.4rem 0 0 } .component-copy-content .cta-container .cta-component.cta-rectangle-box { margin-right: 1rem } .component-copy-content .main-content-container { padding: 6rem 0 } @media(min-width: 320px) { .component-copy-content h2 { font-size: 2.2rem } .component-copy-content h4 { font-size: 1.8rem; margin-top: 5.6rem } .component-copy-content li, .component-copy-content p { font-size: 1.8rem } .component-copy-content .cta-container { margin: 2.4rem 0 0 } .component-copy-content .main-content-container { padding: 6rem 0 } } @media(min-width: 768px) { .component-copy-content h2 { font-size: 2.8rem } .component-copy-content h4 { font-size: 2.2rem; margin-top: 6.4rem } .component-copy-content li, .component-copy-content p { font-size: 2rem } .component-copy-content .cta-container { margin: 3.2rem 0 0 } .component-copy-content .main-content-container { padding: 6rem 0 } .component-copy-content ul li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; font-size: 2rem } } @media(min-width: 1024px) { .component-copy-content h2 { font-size: 3.6rem } .component-copy-content h4 { font-size: 2.4rem; margin-top: 6.4rem } .component-copy-content li, .component-copy-content p { font-size: 2rem } .component-copy-content .cta-container { margin: 3.2rem 0 0 } .component-copy-content .main-content-container { padding: 8rem 0 } .component-copy-content ul li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; font-size: 2.2rem } } @media(min-width: 1700px) { .component-copy-content h2 { font-size: 4.8rem } .component-copy-content h4 { font-size: 2.8rem; margin-top: 6.4rem } .component-copy-content li, .component-copy-content p { font-size: 2.2rem } .component-copy-content .cta-container { margin: 3.2rem 0 0 } .component-copy-content .main-content-container { padding: 11rem 0 } .component-copy-content ul li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; font-size: 2.2rem } } .component-promo-tile .content-box { position: relative } .component-promo-tile .cta-title-link-arrow { visibility: hidden } .component-promo-tile .promo-tile-content { display: flex; flex-grow: 1 } .component-promo-tile .clickable:hover h5 { background-position: 0 100%; transition: all .25s linear } .component-promo-tile .clickable h5 { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; overflow: hidden; padding-bottom: 2px; transition: all .25s linear } .component-promo-tile .component-tile-overlay { height: 100%; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 20 } .component-promo-tile .component-tile-overlay .cta-component, .component-promo-tile .component-tile-overlay .cta-component a { cursor: pointer; height: 100%; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 20 } .component-promo-tile .component-tile-overlay .cta-component a { background: transparent } .component-promo-tile .promo-tile-content > :first-child, .component-promo-tile .promo-tile-content > :nth-child(2) { border-top: 4px solid #fff } .component-promo-tile .promo-tile-content > :nth-child(2) .content-box-container { padding-top: 0 } .component-promo-tile .content-box-container { align-items: center; display: flex; padding: 1.2rem 0 2.4rem .8rem } @media(min-width: 320px) { .component-promo-tile h5 { margin-right: .5rem } .component-promo-tile .img-container { margin: 0 1.6rem 0 0 } .component-promo-tile .img-container .component-asset-block { min-width: 75px } .component-promo-tile .img-container .component-asset-block img { height: 75px; width: auto } .component-promo-tile .promo-tile-content { flex-direction: column; margin: 2.4rem 0 1rem } .component-promo-tile .promo-tile-content > :nth-child(3) { border-top: 4px solid #293e40 } .component-promo-tile .promo-tile-content > :nth-child(3) .content-box-container { background: hsla(200,2%,75%,.2); padding: 1.8rem 0 2.4rem .8rem } .component-promo-tile .promo-tile-content > :nth-child(3) .down-arrow { border-color: hsla(200,2%,75%,.2) transparent; border-style: solid; border-width: 14px 16px 0; height: 0; margin: 0 auto; width: 0 } .component-promo-tile .description-container { align-items: center; display: flex } .component-promo-tile .title-container { width: 14.4rem } .component-promo-tile .description { display: none } } @media(min-width: 768px) { .component-promo-tile .img-container { margin: 0 1.6rem 1.6rem 0 } .component-promo-tile .img-container .component-asset-block { min-width: 75px } .component-promo-tile .img-container .component-asset-block img { height: 75px; width: 75px } .component-promo-tile .cta-component { width: 22.9rem } .component-promo-tile h5 { margin-bottom: .8rem; margin-top: 0 } .component-promo-tile .content-box-container { display: block; padding: 1.6rem .8rem .8rem 1.6rem } .component-promo-tile .promo-tile-content { flex-direction: row } .component-promo-tile .promo-tile-content > :first-child { border-top: 6px solid #fff; order: 2 } .component-promo-tile .promo-tile-content > :nth-child(2) { border-top: 6px solid #fff; order: 3 } .component-promo-tile .promo-tile-content > :nth-child(3) { border-top: 6px solid #293e40; order: 1 } .component-promo-tile .promo-tile-content > :nth-child(2) .content-box-container, .component-promo-tile .promo-tile-content > :nth-child(3) .content-box-container { padding: 1.6rem .8rem .8rem 1.6rem } .component-promo-tile .content-box { margin-right: 1rem; min-width: 22.9rem } .component-promo-tile .title-container { width: 20.5rem } .component-promo-tile .description-container { display: block; margin-bottom: .8rem; margin-top: 1.6rem } .component-promo-tile .promo-tile-content > :nth-child(2) { margin-right: 0 } } @media(min-width: 1024px) { .component-promo-tile .img-container { margin: 0 1.6rem 0 0; min-width: 75px } .component-promo-tile .img-container .component-asset-block img { height: 75px; width: 75px } .component-promo-tile .cta-component { width: 30.8rem } .component-promo-tile .content-box-container { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; min-width: 0; padding: 1.6rem .8rem .8rem 1.6rem } .component-promo-tile .content-box { min-width: 30.8rem } .component-promo-tile .content-box-container > .title-container { flex: 1 0 60%; text-align: left } .component-promo-tile .content-box-container > .img-container { text-align: left } .component-promo-tile .description-container { margin-top: .8rem } .component-promo-tile .description { align-items: flex-start; display: flex; flex: 0 1 100%; margin-top: 0 } } @media(min-width: 1700px) { .component-promo-tile h5 { margin-right: 0 } .component-promo-tile .cta-component { width: 52.9rem } .component-promo-tile .content-box-container { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; min-height: 15.5rem; padding: 2.4rem 1.6rem 2.4rem 2.4rem; width: 52.9rem } .component-promo-tile .promo-tile-content > :nth-child(3) .content-box-container { padding: 1.6rem .8rem 2.4rem 1.6rem } .component-promo-tile .promo-tile-content > :first-child .content-box-container, .component-promo-tile .promo-tile-content > :nth-child(2) .content-box-container { padding: 1.6rem .8rem .8rem 1.6rem } .component-promo-tile .promo-tile-content > :first-child .promo-tile-arrow, .component-promo-tile .promo-tile-content > :nth-child(2) .promo-tile-arrow { margin-top: 1.6rem } .component-promo-tile a.content-box { width: 52.9rem } .component-promo-tile .content-box { margin-right: 1.4rem; min-width: 52.9rem } .component-promo-tile .img-container { height: 11rem; margin: 0 2.4rem 0 0 } .component-promo-tile .img-container .component-asset-block { min-width: 110px } .component-promo-tile .img-container .component-asset-block img { height: 110px; width: 110px } .component-promo-tile .title-container { align-self: baseline } .component-promo-tile .title-container h5 { width: 35.5rem } .component-promo-tile .description-container { align-items: flex-start; display: flex; flex-flow: row wrap; margin: 0; width: 35.5rem } .component-promo-tile .content-box-container > .img-container, .component-promo-tile .content-box-container > .title-container { flex: 0 1 auto; text-align: left } .component-promo-tile .description { flex: 0 1 auto; margin: 0 } } .component-intro { position: relative } .component-intro .component-intro-outer-container .component-intro-inner-container { margin: auto; max-width: 170rem; padding: 5.6rem 2rem 3.2rem; position: relative } .billboard-marquee-component .billboard-marquee-eyebrow .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container span, .billboard-marquee-component .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .eyebrow { font-family: GilroyBold; font-size: 1.2rem; letter-spacing: -.2px; line-height: 2.08rem; opacity: .6; padding: 0 0 .8rem } .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container h1, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container h2 { margin: 0; padding: 0 0 3.2rem } .component-intro .component-intro-outer-container .component-intro-image-layer { opacity: 0; overflow: hidden; position: relative; right: -10%; transition-duration: .75s; transition-property: margin,opacity,right; transition-timing-function: ease } .component-intro.hide-mobile-image .component-intro-inner-container .component-intro-text-container h1, .component-intro.hide-mobile-image .component-intro-inner-container .component-intro-text-container h2 { padding: 0 } .component-intro.hide-mobile-image .component-intro-image-layer { display: none } .component-intro.slide-in-image .component-intro-outer-container .component-intro-inner-container .component-intro-image-layer { opacity: 1; right: 0 } .component-intro.slide-in-image-start .component-intro-outer-container .component-intro-inner-container .component-intro-image-layer { opacity: 1; right: 0; transition-delay: .75s } @media only screen and (min-width: 768px) { .component-intro .component-intro-outer-container .component-intro-inner-container { height: 28.1rem; padding: 5.6rem 3rem 4.8rem } .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container { max-width: 48% } .billboard-marquee-component .billboard-marquee-eyebrow .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container span, .billboard-marquee-component .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .eyebrow { font-size: 1.4rem; letter-spacing: normal; line-height: 2.6rem; padding: 0 0 1.6rem } .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container h1, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container h2 { padding: 0 } .component-intro .component-intro-outer-container .component-intro-image-layer { align-items: center; bottom: 0; display: flex; margin: auto 0 auto auto; max-height: 100%; max-width: 41%; padding: 5.6rem 0 4.8rem; position: absolute; top: 0; transition-duration: .75s } .component-intro.hide-mobile-image .component-intro-image-layer { display: flex } } @media only screen and (min-width: 1024px) { .component-intro .component-intro-outer-container .component-intro-inner-container { height: 38rem; padding: 8rem 4rem 6.4rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container span, .billboard-marquee-component .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .eyebrow { font-size: 1.8rem; line-height: 2.86rem; padding: 0 0 2.4rem } .component-intro .component-intro-outer-container .component-intro-image-layer { padding: 8rem 0 6.4rem } } @media only screen and (min-width: 1700px) { .component-intro .component-intro-outer-container .component-intro-inner-container { height: 55.1rem; padding: 8rem 4rem; position: static } .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container { max-width: 49% } .billboard-marquee-component .billboard-marquee-eyebrow .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container span, .billboard-marquee-component .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-intro .component-intro-outer-container .component-intro-inner-container .component-intro-text-container .eyebrow { font-size: 2rem; line-height: 3.12rem } .component-intro .component-intro-outer-container .component-intro-image-layer { max-width: 41%; padding: 8rem 0 } .component-intro.large-top-padding .component-intro-outer-container .component-intro-inner-container, .component-intro.large-top-padding .component-intro-outer-container .component-intro-inner-container .component-intro-image-layer { padding-top: 12rem } } .component-link-grid-new { position: relative } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container { margin: auto; max-width: 170rem; padding: 5.6rem 2rem; position: relative } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container { padding: 0 0 4rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container span, .billboard-marquee-component .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .eyebrow { color: #fff; font-family: GilroyBold; font-size: 1.2rem; letter-spacing: .05rem; line-height: 1; opacity: .6; padding: 0 0 .8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h2, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h3 { color: #fff; line-height: 1.3; margin: 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h2 { font-size: 2.2rem; padding: 0 0 .8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h3 { font-size: 2rem; padding: 0 0 .8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container p { color: #fff; margin: 0; padding: 0 0 2.4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item { display: flex; padding: 0 0 3.2rem; position: relative } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:last-of-type { padding: 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item a { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item a ~ .link-grid-item-text-container strong { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline; overflow: hidden; padding-bottom: .4rem; transition: all .25s linear } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item a ~ .link-grid-item-text-container:after { content: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjODFCNUExIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMSA2aDIxTTE4IDExbDUtNS01LTUiLz48L2c+PC9zdmc+"); display: block; margin: .8rem 0 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item a:hover ~ .link-grid-item-text-container strong { background-position: 0 100%; transition: all .25s linear } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item .component-asset-block { height: auto; margin: 0 1.6rem 0 0; max-height: 3.2rem; max-width: 3.2rem; width: 100% } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item .link-grid-item-text-container p { color: #fff; margin: 0; padding: 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item .link-grid-item-text-container p strong { font-family: GilroySemibold } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item.link-grid-new-center-title .link-grid-item-text-container { align-items: center; display: flex } .component-link-grid-new.hide-mobile-description .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item-text-container p:nth-of-type(n+2) { display: none } @media(min-width: 768px) { .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container { padding: 5.6rem 3rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container { padding: 0 0 4rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container span, .billboard-marquee-component .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .eyebrow { font-size: 1.4rem; padding: 0 0 1.6rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h2 { font-size: 2.8rem; padding: 0 0 1.6rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h3 { font-size: 2.4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container { display: flex; flex-wrap: wrap; justify-content: space-between } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item { padding: 0 0 3.2rem; width: 48% } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:last-of-type, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:nth-last-of-type(2) { padding: 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item .component-asset-block { margin: 0 2.4rem 0 0; max-height: 4rem; max-width: 4rem } .component-link-grid-new.hide-mobile-description .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item-text-container p:nth-of-type(n+2) { display: block } } @media(min-width: 1024px) { .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container { min-height: 33.8vw; padding: 8rem 4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container { padding: 0 0 5.6rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container span, .billboard-marquee-component .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .eyebrow { font-size: 1.8rem; padding: 0 0 2.4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h2 { font-size: 3.6rem; padding: 0 0 2.4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h3 { font-size: 2.8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container p { padding: 0 0 3.2rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item { padding: 0 0 4rem; width: 39% } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:last-of-type, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:nth-last-of-type(2) { padding: 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item .component-asset-block { max-height: 4.8rem; max-width: 4.8rem } .component-link-grid-new.padding-zero .component-link-grid-new-outer-container .component-link-grid-new-inner-container { padding-bottom: 0; padding-top: 0 } .component-link-grid-new.padding-40 .component-link-grid-new-outer-container .component-link-grid-new-inner-container { padding-bottom: 4rem; padding-top: 4rem } } @media(min-width: 1700px) { .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container { align-items: center; display: flex; justify-content: space-between; min-height: 64.4rem; padding: 8rem 4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container { max-width: 65.2rem; padding: 0 } .billboard-marquee-component .billboard-marquee-eyebrow .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container span, .billboard-marquee-component .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .billboard-marquee-component .billboard-marquee-eyebrow span, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container .eyebrow { font-size: 2rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h1 { font-size: 7.2rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h2 { font-size: 6.4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container h3 { font-size: 4.4rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-text-container p { padding: 0 0 4.8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container { max-width: 78.8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item { padding: 2.8rem 0; width: 47% } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:first-of-type, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:nth-of-type(2) { padding: 0 0 2.8rem } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:last-of-type, .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item:nth-last-of-type(2) { padding: 2.8rem 0 0 } .component-link-grid-new .component-link-grid-new-outer-container .component-link-grid-new-inner-container .component-link-grid-new-icon-container .link-grid-item .component-asset-block { max-height: 6.4rem; max-width: 6.4rem } .component-link-grid-new.large-top-padding .component-link-grid-new-outer-container .component-link-grid-new-inner-container { padding-bottom: 12rem; padding-top: 12rem } } .type-module-component { padding: 70px 0 } .type-module-component .image-col { margin-left: 30px; margin-right: 30px; max-width: 830px } .type-module-component .image-col .img-responsive { width: auto } .type-module-component .new-text-jumbo { margin-left: auto; margin-right: auto; max-width: 910px; padding: 0 80px } .type-module-component .new-text-jumbo .accent-bar { display: none; margin-bottom: 10px } .type-module-component .new-text-jumbo .cta-list { margin-top: 15px } .type-module-component .new-text-jumbo .cta-list a { letter-spacing: .3em } .type-module-component .new-text-jumbo .link-list-component ul { margin: 15px 0 15px 20px } .type-module-component .new-text-jumbo .link-list-component ul li { font-size: 16px; line-height: 24px; list-style-type: disc; text-align: left } .type-module-component.accent-bar-left .accent-bar { margin-left: 0; margin-right: auto } .type-module-component.variation-hero .new-text-jumbo { max-width: 580px } .type-module-component.variation-hero .title-block { color: #fff; letter-spacing: .3em } .type-module-component.variation-stand-alone { padding: 70px 0 20px } .type-module-component.variation-demonow-clipboard, .type-module-component.variation-demonow-page, .type-module-component.variation-demonow-screenshot, .type-module-component.variation-solution-page, .type-module-component.variation-solution-page-center { padding: 70px 0 } .type-module-component.variation-solution-page .image-col { height: auto; margin: 0 auto 40px; max-height: 240px; max-width: 330px } .type-module-component.variation-solution-page .subtitle-block h1, .type-module-component.variation-solution-page .subtitle-block h2, .type-module-component.variation-solution-page .subtitle-block h3, .type-module-component.variation-solution-page .subtitle-block h4, .type-module-component.variation-solution-page .subtitle-block h5, .type-module-component.variation-solution-page .subtitle-block h6, .type-module-component.variation-solution-page .text-block, .type-module-component.variation-solution-page .title-block { text-align: left } .type-module-component.variation-solution-page .cta-list { margin-top: 25px; text-align: left } .type-module-component.variation-demonow-page { padding: 70px 0 } .type-module-component.variation-demonow-page .text-col { position: relative; z-index: 2 } .type-module-component.variation-demonow-page .image-col { bottom: 0; height: 100%; left: 0; margin: 0; max-width: 100%; position: absolute; right: 0; top: 0; z-index: 1 } .type-module-component.variation-demonow-page .image-col .image-component { height: 100% } .type-module-component.variation-demonow-page .image-col .image-component .img-responsive { height: 100%; width: 100% } .type-module-component.variation-demonow-page .subtitle-block h1, .type-module-component.variation-demonow-page .subtitle-block h2, .type-module-component.variation-demonow-page .subtitle-block h3, .type-module-component.variation-demonow-page .subtitle-block h4, .type-module-component.variation-demonow-page .subtitle-block h5, .type-module-component.variation-demonow-page .subtitle-block h6, .type-module-component.variation-demonow-page .text-block, .type-module-component.variation-demonow-page .title-block { text-align: left } .type-module-component.variation-demonow-page .cta-list { margin-top: 25px; text-align: left } .type-module-component.variation-demonow-page .new-text-jumbo { max-width: 650px; padding: 0 50px } .type-module-component.variation-demonow-screenshot { padding: 70px 0 } .type-module-component.variation-demonow-screenshot .image-col { height: auto; margin: 30px auto 0; padding: 0 20px; width: 700px } .type-module-component.variation-demonow-screenshot .subtitle-block h1, .type-module-component.variation-demonow-screenshot .subtitle-block h2, .type-module-component.variation-demonow-screenshot .subtitle-block h3, .type-module-component.variation-demonow-screenshot .subtitle-block h4, .type-module-component.variation-demonow-screenshot .subtitle-block h5, .type-module-component.variation-demonow-screenshot .subtitle-block h6, .type-module-component.variation-demonow-screenshot .text-block, .type-module-component.variation-demonow-screenshot .title-block { text-align: left } .type-module-component.variation-demonow-screenshot .cta-list { margin-top: 25px; text-align: left } .type-module-component.variation-demonow-screenshot .new-text-jumbo { max-width: 650px; padding: 0 50px } .type-module-component.variation-demonow-clipboard { padding: 70px 0 0 } .type-module-component.variation-demonow-clipboard .image-col { height: 100%; margin: 30px auto 0; width: auto !important } .type-module-component.variation-demonow-clipboard .image-col .img-responsive { max-width: none; position: relative; width: auto !important } .type-module-component.variation-demonow-clipboard .subtitle-block h1, .type-module-component.variation-demonow-clipboard .subtitle-block h2, .type-module-component.variation-demonow-clipboard .subtitle-block h3, .type-module-component.variation-demonow-clipboard .subtitle-block h4, .type-module-component.variation-demonow-clipboard .subtitle-block h5, .type-module-component.variation-demonow-clipboard .subtitle-block h6, .type-module-component.variation-demonow-clipboard .text-block, .type-module-component.variation-demonow-clipboard .title-block { text-align: left } .type-module-component.variation-demonow-clipboard .cta-list { margin-top: 25px; text-align: left } .type-module-component.variation-demonow-clipboard .new-text-jumbo { max-width: 650px; padding: 0 50px } .type-module-component.variation-solution-page-center .image-col { height: auto; margin: 0 auto 40px; max-height: 240px; max-width: 330px } .type-module-component.variation-solution-page-center .subtitle-block h1, .type-module-component.variation-solution-page-center .subtitle-block h2, .type-module-component.variation-solution-page-center .subtitle-block h3, .type-module-component.variation-solution-page-center .subtitle-block h4, .type-module-component.variation-solution-page-center .subtitle-block h5, .type-module-component.variation-solution-page-center .subtitle-block h6, .type-module-component.variation-solution-page-center .text-block, .type-module-component.variation-solution-page-center .title-block { text-align: center } .type-module-component.variation-solution-page-center .cta-list { margin-top: 25px; text-align: center } .type-module-component.variation-title-top { padding: 70px 0 } .type-module-component.variation-title-top .image-component { height: auto; margin: 40px auto; max-height: 240px; max-width: 330px } .type-module-component.variation-title-top .new-text-jumbo { padding: 0 80px } .type-module-component.variation-title-top .text-block, .type-module-component.variation-title-top .title-block { text-align: left } .type-module-component.variation-title-top .cta-list { margin-top: 25px; text-align: left } .type-module-component.variation-half { padding: 70px 0 } .type-module-component.variation-half .image-col { height: auto; margin: 0 auto 40px; max-height: 240px; max-width: 330px } .type-module-component.variation-half .new-text-jumbo { max-width: 480px; padding: 0 40px } .type-module-component.variation-half .text-block, .type-module-component.variation-half .title-block { text-align: left } .type-module-component.variation-half .cta-list { margin-top: 25px; text-align: left } .type-module-component.variation-dark { padding: 72px 0 60px } .type-module-component.variation-dark .new-text-jumbo .text-block { color: #fff } .type-module-component.variation-left { display: table; margin: 0 auto; max-width: 1160px; overflow: hidden; padding: 70px 0 } .type-module-component.variation-left .text-col { display: table-cell; padding: 0 50px 0 0; vertical-align: middle; width: 50% } .type-module-component.variation-left .image-col { display: table-cell; margin: 0; padding: 0 10px 0 0; vertical-align: middle; width: 50% } .type-module-component.variation-left .new-text-jumbo { margin-left: 0; max-width: 450px; padding-left: 0; padding-right: 0 } .type-module-component.variation-left .new-text-jumbo .text-block, .type-module-component.variation-left .new-text-jumbo .title-block { text-align: left } .type-module-component.variation-left .new-text-jumbo .cta-list { margin-top: 15px; text-align: left } .type-module-component.variation-right { display: table; margin: 0 auto; max-width: 1160px; overflow: hidden; padding: 70px 0 } .type-module-component.variation-right .text-col { display: table-cell; padding-left: 50px; vertical-align: middle; width: 50% } .type-module-component.variation-right .image-col { display: table-cell; margin: 0; padding: 0 10px 0 0; vertical-align: middle; width: 50% } .type-module-component.variation-right .new-text-jumbo { max-width: 450px; padding-left: 0; padding-right: 0; text-align: left } .type-module-component.variation-right .new-text-jumbo .text-block { text-align: left } .type-module-component.variation-right .new-text-jumbo .cta-list { margin-top: 15px; text-align: left } .type-module-component.type-module-circle-variation { border: 3px solid #e24037; border-radius: 50%; height: 294px; margin: auto; padding: 30px 0; position: relative; width: 294px } .type-module-component.type-module-circle-variation .new-text-jumbo { padding: 0 } .type-module-component.type-module-circle-variation .new-text-jumbo .title-block { padding-top: 15px; position: relative } .type-module-component.type-module-circle-variation .new-text-jumbo .title-block h2, .type-module-component.type-module-circle-variation .new-text-jumbo .title-block h6, .type-module-component.type-module-circle-variation .new-text-jumbo .title-block p { position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%) } .type-module-component.type-module-circle-variation .new-text-jumbo .subtitle-block { min-height: 85px; position: relative } .type-module-component.type-module-circle-variation .new-text-jumbo .subtitle-block h2, .type-module-component.type-module-circle-variation .new-text-jumbo .subtitle-block h6, .type-module-component.type-module-circle-variation .new-text-jumbo .subtitle-block p { font-weight: 100; left: 50%; line-height: 1.714289em !important; margin: 0; position: absolute; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%) } .type-module-component.type-module-circle-variation .new-text-jumbo .text-block { margin-top: -6px } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list { margin-top: 0 } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn-text.btn-blue { bottom: -43px !important; color: #258dfc !important; left: 50%; position: absolute; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%) } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn-text.btn-blue:hover { color: #5da8db !important } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn-variation-circle-full-cover { border-radius: 50% } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn.btn-variation-refresh.btn-rounded-square-full { margin: 0 !important } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn.btn-variation-refresh { bottom: -62px; left: 50%; margin: 0; position: absolute; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); white-space: nowrap } .type-module-component.type-module-circle-variation .image-col { height: 63px } .type-module-component.type-module-circle-variation .accent-bar { display: none !important } .type-module-component.type-module-circle-variation .accent-bar.in-circle { display: block !important; height: 2px; margin: auto; width: 14px } .type-module-component.variation-left-image-cta-pipe { margin: 0 auto; max-width: 1300px; overflow: hidden; padding: 67px 40px 64px; position: relative } .type-module-component.variation-left-image-cta-pipe .image-col { float: left; margin: 0 0 40px; width: 320px } .type-module-component.variation-left-image-cta-pipe .text-col { padding-left: 390px } .type-module-component.variation-left-image-cta-pipe .text-col .new-text-jumbo { max-width: none; padding: 0; text-align: left } .type-module-component.variation-left-image-cta-pipe .text-col .new-text-jumbo .cta-list { margin-top: 30px } .type-module-component.variation-left-image-cta-pipe .text-col .link-list-component { margin: 40px 0 0 } .textJumboRefresh .type-module-component.variation-left-image-cta-pipe:before, .type-module-component.variation-left-image-cta-pipe + .type-module-component.variation-left-image-cta-pipe:before { background: rgba(0,0,0,.1); bottom: auto; content: ""; height: 1px; left: 40px; margin: auto; position: absolute; right: 40px; top: 0; width: auto } .textJumboRefresh:first-of-type .type-module-component.variation-left-image-cta-pipe:before { display: none } body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .site-content .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn.btn-variation-refresh { color: #293e40 !important } @media(max-width: 1279px) { .type-module-component.variation-demonow-screenshot .image-col { margin-left: -30% } } @media(max-width: 1023px) { .type-module-component.variation-demonow-screenshot .image-col { margin-left: -45% } } @media(max-width: 960px) { .type-module-component.variation-demonow-screenshot .image-col { margin-left: -68% } } @media(max-width: 767px) { .type-module-component.variation-left { display: block; width: 100% } .type-module-component.variation-left.variation-reverse { display: table } .type-module-component.variation-left.variation-reverse .image-col { display: table-header-group; margin: 0 auto; max-width: 480px; padding: 0 } .type-module-component.variation-left.variation-reverse .image-col .image-component { margin: 0 auto 60px; max-width: 480px } .type-module-component.variation-left.variation-reverse .text-col .new-text-jumbo { padding-bottom: 0; padding-top: 0 } .type-module-component.variation-left .new-text-jumbo { margin-left: auto; padding-bottom: 0; padding-top: 0 } .type-module-component.variation-left .image-col { display: block; margin: 0 auto; max-width: 480px; padding: 35px 40px 0 } .type-module-component.variation-left .text-col { display: block; padding: 0 } .type-module-component.variation-right { display: block; padding: 70px 0; width: 100% } .type-module-component.variation-right.variation-reverse { display: table } .type-module-component.variation-right.variation-reverse .image-col { display: table-footer-group; margin: 0 auto; max-width: 480px; padding: 0 } .type-module-component.variation-right.variation-reverse .image-col .image-component { margin: 60px auto 0; max-width: 480px } .type-module-component.variation-right.variation-reverse .text-col .new-text-jumbo { padding-bottom: 0; padding-top: 0 } .type-module-component.variation-right .new-text-jumbo { display: block; padding-bottom: 0; padding-top: 0 } .type-module-component.variation-right .text-col { display: block; padding-left: 0 } .type-module-component.variation-right .image-col { display: block; margin: 0 auto; max-width: 480px; padding: 0 40px 50px } .type-module-component .new-text-jumbo { padding-left: 40px !important; padding-right: 40px !important } .type-module-component .image-col, .type-module-component .text-col { float: none !important; width: auto !important } .type-module-component.variation-demonow-page { padding: 50px 0 } .type-module-component.variation-demonow-screenshot { padding: 50px 0 0 } .type-module-component.variation-demonow-screenshot .image-col { margin-left: 0; padding: 0 20px !important } .type-module-component.variation-demonow-clipboard { padding: 50px 0 0 } .type-module-component.variation-demonow-clipboard .image-col .img-responsive { left: 0 !important; width: 100% !important } .type-module-component.variation-left-image-cta-pipe .image-col { float: none; margin: 0 auto; max-width: 300px } .type-module-component.variation-left-image-cta-pipe .text-col { padding: 40px 0 0 } .type-module-component.variation-left-image-cta-pipe .text-col .new-text-jumbo { padding: 0 20px !important } } @media(max-width: 479px) { .type-module-component.variation-right .text-col { padding-left: 0 } .type-module-component .image-col { margin-left: 0; margin-right: 0 } .type-module-component.variation-demonow-clipboard .image-col, .type-module-component.variation-demonow-screenshot .image-col, .type-module-component.variation-solution-page .image-col, .type-module-component.variation-solution-page-center .image-col { height: auto; padding: 0 40px } .type-module-component.variation-demonow-clipboard .image-col { padding: 0 } } @media(min-width: 768px)and (max-width:1279px) { .type-module-component .new-text-jumbo { max-width: 780px } .type-module-component.variation-left { max-width: 1000px; width: auto } .type-module-component.variation-left .text-col { padding: 0 50px 0 60px; width: 50% } .type-module-component.variation-left .image-col { padding: 0 80px 0 30px } .type-module-component.variation-right { max-width: 1000px; width: auto } .type-module-component.variation-right .text-col { padding-left: 40px; padding-right: 60px } .type-module-component.variation-right .image-col { padding: 0 30px 0 70px } } @media(min-width: 1280px) { .type-module-component .new-text-jumbo { max-width: 940px } .type-module-component.variation-left .text-col { padding-right: 90px } .type-module-component.variation-right .text-col { padding-left: 90px } .type-module-component.variation-half .new-text-jumbo { max-width: 550px } .type-module-component.variation-half .new-text-jumbo .link-list-component ul li { font-size: 20px; line-height: 30px } } @media(max-width: 768px) { .type-module-component.type-module-circle-variation .new-text-jumbo { padding: 0 !important } .type-module-component.type-module-circle-variation .new-text-jumbo .cta-list a.btn-variation-circle-full-cover { pointer-events: none; -webkit-pointer-events: none; -moz-pointer-events: none } } .eloqua-form-core-wrapper { margin: auto; max-width: 170rem } .eloqua-form-core-wrapper .textJumboRefresh .container { max-width: none; padding: 0 } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot { padding: 0 } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo { padding: 0 2rem } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .title-block { margin: 0 } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .text-block li, .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .text-block p { color: #293e40; font-size: 14px; line-height: 28px; margin: 0 } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .text-block ul { padding-left: 20px } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .text-block ul li { -webkit-font-smoothing: antialiased; color: #293e40; list-style: disc } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .image-col { width: auto } @media screen and (min-width: 768px) { .eloqua-form-core-wrapper .split-50.eloqua-form-left-column { padding: 0 1rem } .eloqua-form-core-wrapper .split-50.eloqua-form-left-column:after { background-color: rgba(41,62,64,.2); bottom: 10px; content: ""; height: auto; position: absolute; right: 0; top: 20px; width: 1px } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo { padding: 0 2rem } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .text-block li, .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .new-text-jumbo .text-block p { font-size: 16px; line-height: 28px } .eloqua-form-core-wrapper .textJumboRefresh .container .type-module-component.variation-demonow-screenshot .image-col { margin: 0 } } @media screen and (min-width: 1280px) { .eloqua-form-core-wrapper .split-50.eloqua-form-left-column { padding: 4rem 2rem } .eloqua-form-core-wrapper .split-50.eloqua-form-left-column:after { background-color: rgba(41,62,64,.2); bottom: 6rem; content: ""; height: auto; position: absolute; right: 0; top: 6rem; width: 1px } } .component-live-stream-overlay { bottom: -100%; display: none; left: 0; position: absolute; right: 0; top: 0; z-index: 1100 } .component-live-stream-overlay .modal-background { background-color: #68a1af; height: 100%; opacity: .8; width: 100% } .component-live-stream-overlay .close { height: 2rem; position: absolute; right: 1.7rem; top: 2.4rem; width: 2rem } .component-live-stream-overlay .close .component-overlay-close-btn svg { height: 1.5rem; opacity: .6; width: 1.5rem } .component-live-stream-overlay .close .component-overlay-close-btn svg g { stroke: #fff } .component-live-stream-overlay .close .component-overlay-close-btn:hover { cursor: pointer } .component-live-stream-overlay .close .component-overlay-close-btn:hover svg { opacity: 1 } .component-live-stream-overlay .modal-container { margin-left: auto; margin-right: auto; position: absolute; top: 6rem; width: 100% } .component-live-stream-overlay .modal-container .modal-wrapper { margin: auto } .component-live-stream-overlay .modal-container .modal-content { background-color: #fff; left: 0; right: 0 } .component-live-stream-overlay .modal-container .video-container { background: #000 } .component-live-stream-overlay .modal-container .video-container .live-icon { height: 3.4rem; position: absolute; right: .8rem; top: .8rem; width: 6.7rem; z-index: 100 } .component-live-stream-overlay .modal-container .video-container .live-icon img { height: 100%; width: 100% } .component-live-stream-overlay .modal-container .video-container.dam-video, .component-live-stream-overlay .modal-container .video-container.img, .component-live-stream-overlay .modal-container .video-container.youtube, .component-live-stream-overlay .modal-container .video-container > .video-js { height: auto; overflow: hidden; padding-bottom: 56.25%; position: relative; top: 0; width: 100% } .component-live-stream-overlay .modal-container .video-container.dam-video iframe, .component-live-stream-overlay .modal-container .video-container.dam-video img, .component-live-stream-overlay .modal-container .video-container.dam-video video, .component-live-stream-overlay .modal-container .video-container.img iframe, .component-live-stream-overlay .modal-container .video-container.img img, .component-live-stream-overlay .modal-container .video-container.img video, .component-live-stream-overlay .modal-container .video-container.youtube iframe, .component-live-stream-overlay .modal-container .video-container.youtube img, .component-live-stream-overlay .modal-container .video-container.youtube video, .component-live-stream-overlay .modal-container .video-container > .video-js iframe, .component-live-stream-overlay .modal-container .video-container > .video-js img, .component-live-stream-overlay .modal-container .video-container > .video-js video { height: auto; left: 0; position: absolute; top: 50%; transform: translateY(-50%); width: 100% !important } .component-live-stream-overlay .modal-container .video-container.dam-video iframe:focus, .component-live-stream-overlay .modal-container .video-container.dam-video img:focus, .component-live-stream-overlay .modal-container .video-container.dam-video video:focus, .component-live-stream-overlay .modal-container .video-container.img iframe:focus, .component-live-stream-overlay .modal-container .video-container.img img:focus, .component-live-stream-overlay .modal-container .video-container.img video:focus, .component-live-stream-overlay .modal-container .video-container.youtube iframe:focus, .component-live-stream-overlay .modal-container .video-container.youtube img:focus, .component-live-stream-overlay .modal-container .video-container.youtube video:focus, .component-live-stream-overlay .modal-container .video-container > .video-js iframe:focus, .component-live-stream-overlay .modal-container .video-container > .video-js img:focus, .component-live-stream-overlay .modal-container .video-container > .video-js video:focus { border: 0; outline: none } .component-live-stream-overlay .modal-container .video-container.dam-video { display: flex; height: 100%; justify-content: center; width: auto } .component-live-stream-overlay .modal-container .video-container.dam-video video { height: 100%; left: unset; width: auto !important } .component-live-stream-overlay .modal-container .video-container.youtube iframe { height: 100%; top: 0; transform: unset } .component-live-stream-overlay .modal-container .content-container { padding: 2.4rem 1.6rem } .component-live-stream-overlay .modal-container .content-container .main-content.sidebar-present { border-bottom: .1rem solid rgba(41,62,64,.2); margin-bottom: 1.6rem; padding-bottom: 1.6rem } .component-live-stream-overlay .modal-container .content-container .main-content.no-vertical-bar { border-bottom: 0 } .component-live-stream-overlay .modal-container .content-container .main-content .description { display: none; padding-top: 1.6rem } .component-live-stream-overlay .modal-container .content-container .main-content .description p { margin: 0 } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown { height: 4.2rem } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown.hide { display: none } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-day, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-hour, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-min, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-sec { display: inline-block } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-day .label-copy, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-day h5, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-hour .label-copy, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-hour h5, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-min .label-copy, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-min h5, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-sec .label-copy, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-sec h5 { color: rgba(41,62,64,.8) } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-day { border-right: .1rem solid rgba(41,62,64,.8); padding-right: 1.6rem } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-hour, .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-min { border-right: .1rem solid rgba(41,62,64,.8); padding-left: 1.6rem; padding-right: 1.6rem } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown .countdown-sec { padding-left: 1.6rem } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown + .cta-container { padding-top: 2.4rem } .component-live-stream-overlay .modal-container .content-container .sidebar-content .cta-container .cta-component { display: block; margin-bottom: 0; margin-top: 0 } .component-live-stream-overlay .modal-container .content-container .sidebar-content .cta-container .cta-component + .cta-component { margin-top: 2.4rem } @media only screen and (min-width: 768px) { .component-live-stream-overlay .modal-container { top: 8rem } .component-live-stream-overlay .modal-container .video-container .live-icon { right: 2.4rem; top: 2.4rem } .component-live-stream-overlay .modal-container .content-container { display: flex; padding: 2.4rem } .component-live-stream-overlay .modal-container .content-container .main-content { width: 100% } .component-live-stream-overlay .modal-container .content-container .main-content .description { display: inline-block } .component-live-stream-overlay .modal-container .content-container .main-content.sidebar-present { border-bottom: 0; border-right: .1rem solid rgba(41,62,64,.2); margin-bottom: 0; margin-right: 2.4rem; padding-bottom: 0; padding-right: 2.4rem; width: 62% } .component-live-stream-overlay .modal-container .content-container .main-content.no-vertical-bar { border-right: 0 } .component-live-stream-overlay .modal-container .content-container .sidebar-content { width: 37% } .component-live-stream-overlay .modal-container .content-container .sidebar-content .countdown + .cta-container { padding-top: 3.2rem } } @media only screen and (min-width: 1024px) { .component-live-stream-overlay .modal-container .content-container .sidebar-content { width: 37.5% } .component-live-stream-overlay .modal-container .content-container .sidebar-content .cta-container .cta-component a { font-size: 1.6rem !important } .component-live-stream-overlay .modal-container .content-container .sidebar-content .cta-container .cta-component a .cta-title-link-arrow { margin-right: 0 } } @media only screen and (min-width: 1700px) { .component-live-stream-overlay .modal-container { left: 50%; margin-left: -85rem } .component-live-stream-overlay .modal-container .video-container .live-icon { right: 3.2rem; top: 3.2rem } .component-live-stream-overlay .modal-container .content-container { padding: 3.2rem } .component-live-stream-overlay .modal-container .content-container .main-content.sidebar-present { margin-right: 4rem; padding-right: 4rem } .component-live-stream-overlay .modal-container .content-container .sidebar-content { width: 37% } .component-live-stream-overlay .modal-container .content-container .sidebar-content .cta-container .cta-component a { font-size: 1.8rem !important } .component-live-stream-overlay .modal-container .content-container .sidebar-content .cta-container .cta-component a .cta-title-link-arrow { margin-right: 4rem } } .horizontal-tabbed-component { position: relative } .horizontal-tabbed-component .tabs-background-white { background: #fff } .horizontal-tabbed-component .tabs-background-transparent { background: transparent } .horizontal-tabbed-component .flex-box-col-md-12 .flex-box-col-md-12 { padding-left: 0 } .horizontal-tabbed-component .tabbed-content-wrapper .ajax-loader { display: none } .horizontal-tabbed-component .tabbed-content-wrapper .ajax-loader.visible { display: block; position: fixed; z-index: 9998 } .horizontal-tabbed-component .tabbed-content-wrapper .ajax-loader.visible .loader-icon { bottom: 0; height: 10rem; left: 0; margin: auto; overflow: visible; position: fixed; right: 0; top: 0; width: 10rem } .horizontal-tabbed-component .tabbed-content-wrapper .ajax-loader.visible img { height: 100%; width: 100% } .horizontal-tabbed-component .tabbed-content-wrapper .author-mode-view { display: flex; flex-wrap: wrap } .horizontal-tabbed-component-inner-wrapper.default-padding, .horizontal-tabbed-component-inner-wrapper.padding-40, .horizontal-tabbed-component-inner-wrapper.padding-80 { padding-bottom: 3.2rem; padding-top: 3.2rem } .horizontal-tabbed-component-inner-wrapper .tabbed-title h2 { margin: 0 } .horizontal-tabbed-component-inner-wrapper .tabs-background-white { background: #fff } .horizontal-tabbed-component-inner-wrapper .tabs-background-transparent { background: transparent } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper { position: relative } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper ul { display: flex; overflow-y: hidden } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper li { margin-right: 2.4rem; padding: 2.4rem 0 .8rem } .horizontal-tabbed-component-inner-wrapper .horizontalTabbed { width: 100% } .horizontal-tabbed-component-inner-wrapper .horizontal-rule { border-top: .1rem solid rgba(41,62,64,.2); margin-left: 20px; margin-right: 20px } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list { -webkit-padding-start: 0; margin: 0; overflow-y: scroll; padding-inline-start: 0; padding: 0 2rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list::-webkit-scrollbar { display: none } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-right:after { background-image: linear-gradient(90deg,hsla(0,0%,97%,0) 0,#f7f7f7); content: ""; display: block; height: 100%; position: absolute; right: 0; width: 10% } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-left:before { background-image: linear-gradient(270deg,hsla(0,0%,97%,0) 0,#f7f7f7); content: ""; display: block; height: 100%; left: 0; position: absolute; width: 10%; z-index: 10 } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .current { border-bottom: .5rem solid #293e40 } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .current .tab-name { font-family: GilroyBold; opacity: 1 } .horizontal-tabbed-component-inner-wrapper .tab-link:hover .tab-name { opacity: 1 } .horizontal-tabbed-component-inner-wrapper .tab-name { color: #293e40; cursor: pointer; font-family: GilroyRegular; opacity: .6; white-space: nowrap } .horizontal-tabbed-component-inner-wrapper .tabbed-content-wrapper { display: none; font-family: GilroyRegular } .horizontal-tabbed-component-inner-wrapper .tabbed-item { background: #fff; margin-bottom: 2.4rem } .horizontal-tabbed-component-inner-wrapper .tabbed-content-wrapper.current { display: block } @media only screen and (min-width: 768px) { .horizontal-tabbed-component-inner-wrapper.default-padding, .horizontal-tabbed-component-inner-wrapper.padding-40, .horizontal-tabbed-component-inner-wrapper.padding-80 { padding-bottom: 4rem; padding-top: 4rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper .tab-link { margin-right: 2.4rem; padding: 2.4rem 0 1.6rem } .horizontal-tabbed-component-inner-wrapper .tabbed-content-wrapper { display: none; flex-wrap: wrap } .horizontal-tabbed-component-inner-wrapper .tabbed-item { margin-right: 3rem; max-width: 30.5%; min-width: 30.5% } .horizontal-tabbed-component-inner-wrapper .tabbed-item:nth-child(3n+0) { margin-right: 0 } } @media only screen and (min-width: 1024px) { .horizontal-tabbed-component-inner-wrapper.default-padding { padding-bottom: 6.4rem; padding-top: 6.4rem } .horizontal-tabbed-component-inner-wrapper.padding-40 { padding-bottom: 4rem; padding-top: 4rem } .horizontal-tabbed-component-inner-wrapper.padding-80 { padding-bottom: 8rem; padding-top: 8rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-left:before, .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-right:after { display: none } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper li { margin-right: 3.2rem; padding: 3.2rem 0 1.9rem } .horizontal-tabbed-component-inner-wrapper .tab-name { font-size: 2rem; line-height: 2.8rem } .horizontal-tabbed-component-inner-wrapper .tabbed-item { margin-right: 4rem; max-width: 30.5%; min-width: 30.5% } .horizontal-tabbed-component-inner-wrapper .tabbed-item-text-title span { font-size: 2rem } } @media only screen and (min-width: 1700px) { .horizontal-tabbed-component-inner-wrapper.default-padding { padding-bottom: 8rem; padding-top: 8rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper .tab-link { margin-right: 4.8rem; padding: 4rem 0 1.9rem } .horizontal-tabbed-component-inner-wrapper .tabbed-content-wrapper { justify-content: normal } .horizontal-tabbed-component-inner-wrapper .tabbed-item { margin-right: 4rem; min-width: 30.85% } .horizontal-tabbed-component-inner-wrapper .tabbed-item-text-title span { font-size: 2.2rem } } .component-tabbed-component { overflow: hidden; position: relative } .component-tabbed-component .top-right-circle { background: #fff; border-radius: 100%; display: block; height: 27rem; position: absolute; right: -10rem; top: -22.2rem; width: 27rem } .component-tabbed-component .tabs-background-white { background: #fff } .component-tabbed-component .tabs-background-transparent { background: transparent } .component-tabbed-component .tabbed-card-content-wrapper .ajax-loader { display: none } .component-tabbed-component .tabbed-card-content-wrapper .ajax-loader.visible { display: block; position: fixed; z-index: 9998 } .component-tabbed-component .tabbed-card-content-wrapper .ajax-loader.visible .loader-icon { bottom: 0; height: 10rem; left: 0; margin: auto; overflow: visible; position: fixed; right: 0; top: 0; width: 10rem } .component-tabbed-component .tabbed-card-content-wrapper .ajax-loader.visible img { height: 100%; width: 100% } .component-tabbed-component .tabbed-card-content-wrapper .author-mode-cards-view { display: flex; flex-wrap: wrap } @media screen and (min-width: 768px) { .component-tabbed-component .top-right-circle { height: 35rem; right: -13rem; top: -28.8rem; width: 35rem } } @media screen and (min-width: 1024px) { .component-tabbed-component .top-right-circle { height: 44rem; right: -17rem; top: -33.8rem; width: 44rem } } @media screen and (min-width: 1700px) { .component-tabbed-component .top-right-circle { height: 51rem; right: -20rem; width: 50rem } } .component-tabbed-component.variation-csc .component-tabbed-component-outer-wrapper { margin: auto; max-width: 170rem; padding-left: 2rem; padding-right: 2rem } @media screen and (min-width: 768px) { .component-tabbed-component.variation-csc .component-tabbed-component-outer-wrapper { padding-left: 3rem; padding-right: 3rem } } @media screen and (min-width: 1024px) { .component-tabbed-component.variation-csc .component-tabbed-component-outer-wrapper { padding-left: 4rem; padding-right: 4rem } } .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper { padding-left: 0; padding-right: 0 } .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link { background-color: transparent; margin: 0 2rem; padding-left: 0; padding-right: 0 } .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link:first-of-type { margin-left: 0 } .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link.current { border-bottom: .5rem solid #293e40 } .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link.current a { font-family: GilroyBold } .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link a { font-family: inherit; font-size: 1.4rem; letter-spacing: inherit; line-height: inherit } @media screen and (min-width: 1024px) { .component-tabbed-component.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link a { font-size: 1.8rem } } .component-tabbed-component-inner-wrapper.default-padding { padding-bottom: 4rem; padding-top: 6.2rem } .component-tabbed-component-inner-wrapper .badges-image { position: absolute; right: .5rem; top: 1.5rem } .component-tabbed-component-inner-wrapper .badges-image img { height: 6.6rem; width: 10rem } .component-tabbed-component-inner-wrapper.padding-40, .component-tabbed-component-inner-wrapper.padding-80 { padding-bottom: 3.2rem; padding-top: 3.2rem } .component-tabbed-component-inner-wrapper .tabbed-title { font-size: 2rem; margin: 0; width: 53% } .component-tabbed-component-inner-wrapper .tabbed-subtitle { font-family: GilroySemiBold } .component-tabbed-component-inner-wrapper .tabs-background-white { background: #fff } .component-tabbed-component-inner-wrapper .tabs-background-transparent { background: transparent } .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper { position: relative } .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper ul { display: flex } .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper li { margin-right: 3rem; padding: 2rem 0 } .component-tabbed-component-inner-wrapper .horizontal-rule { height: .1rem } .component-tabbed-component-inner-wrapper .horizontal-tabs-list { -webkit-padding-start: 0; margin: 0; overflow-y: scroll; padding-inline-start: 0 } .component-tabbed-component-inner-wrapper .horizontal-tabs-list::-webkit-scrollbar { display: none } .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-right:after { background-image: linear-gradient(90deg,hsla(0,0%,97%,0) 0,#f7f7f7); content: ""; display: block; height: 100%; position: absolute; right: 0; width: 10% } .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-left:before { background-image: linear-gradient(270deg,hsla(0,0%,97%,0) 0,#f7f7f7); content: ""; display: block; height: 100%; left: 0; position: absolute; width: 10%; z-index: 10 } .component-tabbed-component-inner-wrapper .horizontal-tabs-list .current { border-bottom: .2rem solid } .component-tabbed-component-inner-wrapper .horizontal-tabs-list .current:hover .tab-name { text-shadow: none } .component-tabbed-component-inner-wrapper .horizontal-tabs-list .current .tab-name { font-family: gilroyBold } .component-tabbed-component-inner-wrapper .tab-link:hover .tab-name { text-shadow: .5px .1px .1px } .component-tabbed-component-inner-wrapper .tab-name { white-space: nowrap } .component-tabbed-component-inner-wrapper .tabbed-content { padding-left: 0; padding-right: 0; padding-top: 3.2rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper { display: none; flex-wrap: wrap } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper.current { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-item { border-radius: .5rem; margin-bottom: 2rem; padding: 3rem; width: 100% } .component-tabbed-component-inner-wrapper .tabbed-card-item:last-child { margin-bottom: 0 } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-image { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-item-text { display: flex; flex-direction: column; justify-content: center; margin-left: 2rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-image { height: 6.7rem; width: 6.7rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-eyebrow, .component-tabbed-component-inner-wrapper .tabbed-card-item-text-title { display: block } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-eyebrow { font-family: gilroyBold; font-size: 1rem; opacity: .6; padding-bottom: .8rem; text-transform: uppercase } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-title { font-size: 1.6rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list { margin: 2rem 0 0 } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list ul { margin: 0; padding-left: 1.4rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list li { list-style: disc; padding-bottom: 1rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list li:last-child { padding-bottom: 0 } .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-left:after, .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-left:before, .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-right:after, .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-right:before { display: none } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.cloud-color-text + .tabbed-card-item .tabbed-card-item-text-list ul li, .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.cloud-color-text + .tabbed-card-item .tabbed-card-item-text-title { color: #f7f7f7 } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.gable-green-color-text + .tabbed-card-item .tabbed-card-item-text-list ul li, .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.gable-green-color-text + .tabbed-card-item .tabbed-card-item-text-title { color: #293e40 } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.pure-white-color-text + .tabbed-card-item .tabbed-card-item-text-list ul li, .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.pure-white-color-text + .tabbed-card-item .tabbed-card-item-text-title { color: #fff } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.acapulco-color-text + .tabbed-card-item .tabbed-card-item-text-list ul li, .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.acapulco-color-text + .tabbed-card-item .tabbed-card-item-text-title { color: #81b5a1 } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.cloud-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.cloud-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li:before { color: #f7f7f7; content: "•"; font-size: 2.5rem; font-weight: 700; margin-right: 1rem; position: relative; top: -.5rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.gable-green-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.gable-green-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li:before { color: #293e40; content: "•"; font-size: 2.5rem; font-weight: 700; margin-right: 1rem; position: relative; top: -.5rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.pure-white-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.pure-white-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li:before { color: #fff; content: "•"; font-size: 2.5rem; font-weight: 700; margin-right: 1rem; position: relative; top: -.5rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.acapulco-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.acapulco-color-bullet + .tabbed-card-item .tabbed-card-item-text-list ul li:before { color: #81b5a1; content: "•"; font-size: 2.5rem; font-weight: 700; margin-right: 1rem; position: relative; top: -.5rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.cloud-color-bground + .tabbed-card-item { background: #f7f7f7 } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.gable-green-color-bground + .tabbed-card-item { background: #293e40 } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.pure-white-color-bground + .tabbed-card-item { background: #fff } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.acapulco-color-bground + .tabbed-card-item { background: #81b5a1 } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options.light-blue-color-bground + .tabbed-card-item { background: #deebee } @media only screen and (min-width: 768px) { .component-tabbed-component-inner-wrapper.default-padding { padding-top: 8rem } .component-tabbed-component-inner-wrapper.padding-40, .component-tabbed-component-inner-wrapper.padding-80 { padding-bottom: 4rem; padding-top: 4rem } .component-tabbed-component-inner-wrapper .tabbed-title { font-size: 2.2rem; width: 75% } .component-tabbed-component-inner-wrapper .tabbed-subtitle { font-size: 1.6rem; width: 91% } .component-tabbed-component-inner-wrapper .badges-image { top: 3rem } .component-tabbed-component-inner-wrapper .badges-image img { width: 11.8rem } .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper li { margin-right: 2.5rem; padding: 2rem 0 } .component-tabbed-component-inner-wrapper .tabbed-content { padding-top: 2rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper { display: none; flex-wrap: wrap } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper.current { display: flex } .component-tabbed-component-inner-wrapper .tabbed-card-item { margin-bottom: 0; margin-right: 3rem; padding: 2rem; width: calc(33.33% - 2rem) } .component-tabbed-component-inner-wrapper .tabbed-card-item:last-child { margin-right: 0 } .component-tabbed-component-inner-wrapper .tabbed-card-item-image { height: 4rem; width: 4rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text { margin-left: 1rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list { margin-bottom: 1rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-title { font-family: gilroyBold; font-size: 1.4rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-eyebrow { padding-bottom: .4rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list li { font-size: 1.2rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper .card-author-options + .tabbed-card-item .tabbed-card-item-text-list ul { -webkit-padding-start: 0; padding-inline-start: 0 } .component-tabbed-component-inner-wrapper.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link { margin: 0 3rem; padding-left: 0; padding-right: 0 } .component-tabbed-component-inner-wrapper.variation-csc .component-tabbed-component-inner-wrapper .horizontal-tabs-list li.tab-link a { font-size: 1.4rem } } @media only screen and (min-width: 1024px) { .component-tabbed-component-inner-wrapper.default-padding { padding-bottom: 4rem; padding-top: 10rem } .component-tabbed-component-inner-wrapper.padding-40 { padding-bottom: 4rem; padding-top: 4rem } .component-tabbed-component-inner-wrapper.padding-80 { padding-bottom: 8rem; padding-top: 8rem } .component-tabbed-component-inner-wrapper .badges-image { top: 4rem } .component-tabbed-component-inner-wrapper .badges-image img { height: 12.2rem; width: 18.6rem } .component-tabbed-component-inner-wrapper .tabbed-title { font-size: 2.4rem } .component-tabbed-component-inner-wrapper .tabbed-subtitle { width: 80% } .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-left:before, .component-tabbed-component-inner-wrapper .horizontal-tabs-list.fade-right:after { display: none } .component-tabbed-component-inner-wrapper .tabbed-content { padding-top: 4rem } .component-tabbed-component-inner-wrapper .tabbed-card-item { margin-right: 4rem; padding: 2rem; width: calc(33.33% - 2.67rem) } .component-tabbed-component-inner-wrapper .tabbed-card-item-image { height: 6.7rem; width: 6.7rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text { margin-left: 2.5rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-title { font-size: 1.8rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list ul { padding-left: 1.8rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list li { font-size: 1.4rem } } @media only screen and (min-width: 1700px) { .component-tabbed-component-inner-wrapper.default-padding { padding-bottom: 6rem; padding-top: 10.6rem } .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper li { margin-right: 8rem } .component-tabbed-component-inner-wrapper .badges-image { top: 9.4rem } .component-tabbed-component-inner-wrapper .badges-image img { height: 15.3rem; width: 23.1rem } .component-tabbed-component-inner-wrapper .tabbed-title { font-size: 3.6rem } .component-tabbed-component-inner-wrapper .tabbed-subtitle { font-size: 1.8rem; width: 54% } .component-tabbed-component-inner-wrapper .tabbed-content { padding-top: 3rem } .component-tabbed-component-inner-wrapper .tabbed-card-content-wrapper { justify-content: normal } .component-tabbed-component-inner-wrapper .tabbed-card-item { display: flex; padding-left: 4rem; width: calc(33.53% - 3rem) } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-image { align-items: center; flex-direction: column } .component-tabbed-component-inner-wrapper .tabbed-card-item-image { margin-bottom: 1rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text { margin-left: 0; text-align: center } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-title { font-size: 2rem } .component-tabbed-component-inner-wrapper .tabbed-card-item-text-list { display: flex; flex-direction: column; justify-content: center; margin: 0 0 0 6rem } } .component-feedback-and-rating { bottom: -100%; display: none; left: 0; position: absolute; right: 0; top: 0; z-index: 1100 } .component-feedback-and-rating .close { cursor: pointer; position: absolute; right: 40px; text-align: right; top: 30px } .component-feedback-and-rating .modal-background { background-color: #293e40; height: 100%; opacity: .8; position: absolute; width: 100% } .component-feedback-and-rating .modal-content { background-color: #fff; height: 78rem; left: 0; margin: 6rem auto; max-height: calc(100vh - 10rem); overflow-y: auto; position: fixed; right: 0; width: 28rem } .component-feedback-and-rating .modal-content .new-content { display: none } .component-feedback-and-rating .modal-content.success .new-content { display: flex; flex-direction: column; justify-content: center; min-width: 28rem; padding: 2rem } .component-feedback-and-rating .modal-content.success .default-content { display: none } .component-feedback-and-rating .separator { border-top: 1px solid #e6e6e6 } .component-feedback-and-rating .title-container { display: flex; justify-content: space-between; padding: 3rem 1.6rem 1.6rem } .component-feedback-and-rating .rating-container { padding: 2.4rem 1.6rem 3.2rem } .component-feedback-and-rating .rating-container .error-message { color: red; display: none; margin-bottom: 0 } .component-feedback-and-rating .rating-container.error .error-message { display: block } .component-feedback-and-rating .star-rating-container { color: #979797; direction: rtl; font-size: 2.6rem; margin-bottom: 0; margin-left: 1rem; margin-top: 2.4rem; padding: 0; text-align: left; unicode-bidi: bidi-override } .component-feedback-and-rating .star-rating-container li { margin-right: 1.6rem } .component-feedback-and-rating .star-rating-container li:first-child { margin-right: 0 } .component-feedback-and-rating .star-rating-container > li { display: inline-block; position: relative; width: 1em } .component-feedback-and-rating .star-rating-container > li.selected, .component-feedback-and-rating .star-rating-container > li.selected ~ li, .component-feedback-and-rating .star-rating-container > li:hover, .component-feedback-and-rating .star-rating-container > li:hover ~ li { color: transparent } .component-feedback-and-rating .star-rating-container > li.selected:before, .component-feedback-and-rating .star-rating-container > li.selected ~ li:before, .component-feedback-and-rating .star-rating-container > li:hover:before, .component-feedback-and-rating .star-rating-container > li:hover ~ li:before { color: #000; content: "★"; left: 0; padding-right: 2.4rem; position: absolute } .component-feedback-and-rating .feedback-container { padding: 1.6rem 1.6rem 3.2rem } .component-feedback-and-rating .feedback, .component-feedback-and-rating .feedback-textarea-container { height: 10.4rem; position: relative; width: 24.8rem } .component-feedback-and-rating .feedback { border: 1px solid #e6e6e6; font-size: 1.4rem; margin: 0; resize: none } .component-feedback-and-rating .feedback-textarea-counter-container { bottom: 0; margin: 0; position: absolute; right: .5rem } .component-feedback-and-rating .email-container { padding: 2.4rem 1.6rem 3.2rem } .component-feedback-and-rating .email-container :-moz-placeholder, .component-feedback-and-rating .email-container :-ms-input-placeholder, .component-feedback-and-rating .email-container ::-moz-placeholder, .component-feedback-and-rating .email-container ::-webkit-input-placeholder { color: #9f9f9f } .component-feedback-and-rating .email-container input { border: 1px solid #e6e6e6; margin-top: 2.4rem; padding: 1.6rem; width: 24.8rem } .component-feedback-and-rating .email-container .error-message { color: red; display: none; margin-bottom: 0 } .component-feedback-and-rating .email-container.error .error-message { display: block } .component-feedback-and-rating .submit-container { align-items: center; display: flex; flex-direction: column; justify-content: center; padding: 4rem 0 } .component-feedback-and-rating .submit-container .cta-component.cta-rectangle-box { margin-right: 0 } .component-feedback-and-rating .submit-container .error-message { color: red; display: none; margin-bottom: 0; margin-left: 1.6rem } .component-feedback-and-rating .submit-container.error .error-message { display: block } @media only screen and (min-width: 768px) { .component-feedback-and-rating .modal-content { margin-top: 8.8rem; padding-left: 3.2rem; padding-right: 3.2rem; width: 64rem } .component-feedback-and-rating .modal-content.success { padding-left: 5rem; padding-right: 5rem } .component-feedback-and-rating .modal-content.success .new-content { height: 65.1rem } .component-feedback-and-rating .modal-content.success .default-content { display: none } .component-feedback-and-rating .feedback, .component-feedback-and-rating .feedback-textarea-container { height: 10.4rem; width: 51.2rem } .component-feedback-and-rating .email-container input { width: 28.8rem } .component-feedback-and-rating .submit-container { display: block; justify-content: flex-start } .component-feedback-and-rating .submit-container .error-message { margin-left: 0 } } @media only screen and (min-width: 1024px) { .component-feedback-and-rating .modal-content.success .new-content { min-width: 28rem } .component-feedback-and-rating .modal-content.success .default-content { display: none } } @media only screen and (min-width: 1700px) { .component-feedback-and-rating .modal-content.success .new-content { min-width: 28rem } .component-feedback-and-rating .modal-content.success .default-content { display: none } } .component-gallery { position: relative } .component-gallery.pure-white-text .gallery-eyebrow, .component-gallery.pure-white-text .gallery-eyebrow p, .component-gallery.pure-white-text .gallery-title h2 { color: #fff } .component-gallery .content-wrapper { z-index: 2 } .component-gallery .content-wrapper.extra-padding { padding-bottom: 5.6rem; padding-top: 0 } .component-gallery .content-wrapper .content-container { padding-bottom: 1.6rem; padding-top: 5.6rem } .component-gallery .content-wrapper .content-container .row { margin: 0 } .component-gallery .content-wrapper .content-container .gallery-eyebrow { padding-bottom: 1.6rem } .component-gallery .content-wrapper .content-container .gallery-eyebrow, .component-gallery .content-wrapper .content-container .gallery-eyebrow p { font-family: GilroyBold; font-size: 1.2rem; letter-spacing: -.2px; line-height: 2.08rem; opacity: .6; text-transform: uppercase } .component-gallery .content-wrapper .content-container .gallery-eyebrow p, .component-gallery .content-wrapper .content-container .gallery-eyebrow p p { color: inherit; margin: 0; padding: 0 } .component-gallery .content-wrapper .content-container .gallery-title a, .component-gallery .content-wrapper .content-container .gallery-title h2 { margin: 0 0 2.4rem } .component-gallery .content-wrapper .content-container .gallery-title a { border-bottom: .2rem solid; border-color: inherit; font-family: inherit; font-size: inherit } .component-gallery .content-wrapper .content-container .col-content { display: flex; flex-direction: column } .component-gallery .content-wrapper .content-container .text-primary { height: 100% } .component-gallery .content-wrapper .content-container .text-primary + .gallery-social-icons .gallery-title h2 { padding-bottom: 2.4rem } .component-gallery .content-wrapper .content-container .gallery-social-icons { align-items: flex-end; bottom: 0; display: flex; height: 4.8rem; justify-content: flex-start } .component-gallery .content-wrapper .content-container .gallery-social-icons .social-icon { height: 2.4rem; margin-right: 2.4rem; width: 2.4rem } .component-gallery .content-wrapper .content-container .gallery-social-icons .social-icon img { height: 100%; width: 100% } .component-gallery .gallery-wrapper .col { overflow: hidden } .component-gallery .gallery-wrapper .col-first, .component-gallery .gallery-wrapper .col-second { flex: 0 0 100%; max-width: 100% } .component-gallery .gallery-wrapper img { height: auto; left: 100%; position: absolute; top: 0; width: 100% } .component-gallery .gallery-wrapper img:first-of-type { transform: translateX(-100%) } .component-gallery .gallery-wrapper .image-group-a { padding-top: 50%; position: relative; transform: scale(1.02) } .component-gallery .gallery-wrapper .image-group-b, .component-gallery .gallery-wrapper .image-group-c, .component-gallery .gallery-wrapper .image-group-d { padding-top: 100%; position: relative; transform: scale(1.02) } .component-gallery .gallery-wrapper .gallery-buttons-wrapper { bottom: 0; display: flex; height: 33.333333%; left: 0; position: absolute; width: 50% } .component-gallery .gallery-wrapper .gallery-buttons-wrapper button { height: 100%; width: 50% } .component-gallery .gallery-wrapper .gallery-prev-wrapper { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .component-gallery .gallery-wrapper .gallery-prev-wrapper button { height: 100%; width: 100% } .component-gallery .gallery-wrapper button.gallery-next, .component-gallery .gallery-wrapper button.gallery-prev { border: 0; cursor: pointer; margin: 0; outline: none; padding: 0; position: relative } .component-gallery .gallery-wrapper button.gallery-next:after, .component-gallery .gallery-wrapper button.gallery-prev:after { background-image: url(../../../content/dam/servicenow-assets/ui-prototyping/images/icon-arrow-long-white.svg); background-position: -2.8rem top; background-repeat: no-repeat; content: ""; height: 1.2rem; margin-top: -.6rem; position: absolute; right: 50%; top: 50%; transition: all .3s; width: 5.6rem } .component-gallery .gallery-wrapper button.gallery-next[disabled]:after, .component-gallery .gallery-wrapper button.gallery-prev[disabled]:after { opacity: .4 } .component-gallery .gallery-wrapper button.gallery-next:hover:not([disabled]):after, .component-gallery .gallery-wrapper button.gallery-prev:hover:not([disabled]):after { background-position: -2rem top } .component-gallery .gallery-wrapper .gallery-next-wrapper { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .component-gallery .gallery-wrapper .gallery-next-wrapper button { height: 100%; width: 100% } .component-gallery .gallery-wrapper button.gallery-prev { background-color: #81b5a1 } .component-gallery .gallery-wrapper button.gallery-prev:after { margin-right: -2.4rem; transform: rotate(180deg) } .component-gallery .gallery-wrapper button.gallery-next { background-color: #293e40 } .component-gallery .gallery-wrapper button.gallery-next:after { left: 50%; margin-left: -2.4rem } @media only screen and (min-width: 768px) { .component-gallery .content-wrapper { height: 44.444444%; margin-bottom: 0; position: absolute; width: 100% } .component-gallery .content-wrapper.extra-padding { padding-bottom: 5.6rem; padding-top: 5.6rem } .component-gallery .content-wrapper .col, .component-gallery .content-wrapper .row { height: 100% } .component-gallery .content-wrapper .content-container { height: 100%; padding-bottom: .8rem; padding-top: 1.6rem } .component-gallery .content-wrapper .content-container .gallery-eyebrow { padding-bottom: .8rem } .component-gallery .content-wrapper .content-container .gallery-eyebrow, .component-gallery .content-wrapper .content-container .gallery-eyebrow p { font-size: 1.4rem; letter-spacing: normal; line-height: 2.6rem } .component-gallery .gallery-wrapper .col-empty { padding-top: 40% } .component-gallery .gallery-wrapper .col-first { flex: 0 0 62.5%; max-width: 62.5% } .component-gallery .gallery-wrapper .col-second { flex: 0 0 37.5%; max-width: 37.5% } .component-gallery .gallery-wrapper button.gallery-next:after, .component-gallery .gallery-wrapper button.gallery-prev:after { background-position: -3.6rem top; margin-right: -2rem; width: 4.8rem } .component-gallery .gallery-wrapper button.gallery-next:hover:not([disabled]):after, .component-gallery .gallery-wrapper button.gallery-prev:hover:not([disabled]):after { background-position: -2.8rem top } .component-gallery .gallery-wrapper button.gallery-prev { background-color: #293e40 } .component-gallery .gallery-wrapper button.gallery-next { background-color: #81b5a1 } @supports(-ms-ime-align:auto) and (-webkit-text-stroke:initial) { .component-gallery .gallery-wrapper .col-first .row:first-of-type { height: 44.5% } } } @media only screen and (min-width: 1024px) { .component-gallery .content-wrapper.extra-padding { padding-bottom: 8rem; padding-top: 8rem } .component-gallery .content-wrapper .content-container { padding-bottom: 1.6rem; padding-top: 3.2rem } .component-gallery .content-wrapper .content-container .gallery-eyebrow, .component-gallery .content-wrapper .content-container .gallery-eyebrow p { font-size: 1.8rem; line-height: 2.86rem } .component-gallery .gallery-wrapper button.gallery-next:after, .component-gallery .gallery-wrapper button.gallery-prev:after { background-position: -2.8rem top; width: 5.6rem } .component-gallery .gallery-wrapper button.gallery-next:hover:not([disabled]):after, .component-gallery .gallery-wrapper button.gallery-prev:hover:not([disabled]):after { background-position: -2rem top } } @media only screen and (min-width: 1700px) { .component-gallery .content-wrapper.xl-extra-padding { padding-bottom: 12rem; padding-top: 12rem } .component-gallery .content-wrapper .content-container { padding-bottom: 5.6rem; padding-top: 6.4rem } .component-gallery .content-wrapper .content-container .gallery-social-icons .social-icon { height: 3.2rem; width: 3.2rem } .component-gallery .content-wrapper .content-container .gallery-eyebrow { padding-bottom: 2.4rem } .component-gallery .content-wrapper .content-container .gallery-eyebrow, .component-gallery .content-wrapper .content-container .gallery-eyebrow p { font-size: 2rem; line-height: 3.12rem } .component-gallery .gallery-wrapper button.gallery-next:after, .component-gallery .gallery-wrapper button.gallery-prev:after { width: 7.6rem } } .component-ticker { padding-bottom: 5.6rem; padding-top: 5.6rem; position: relative } .component-ticker h2, .component-ticker h2 a { margin: 0 0 2.4rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-ticker span, .billboard-marquee-component .component-ticker .billboard-marquee-eyebrow, .component-ticker .billboard-marquee-component .billboard-marquee-eyebrow, .component-ticker .billboard-marquee-component .billboard-marquee-eyebrow span, .component-ticker .eyebrow { margin-bottom: 1.6rem; opacity: .6; text-transform: uppercase } .component-ticker .row { padding-left: 1rem; padding-right: 1rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-ticker.text-gable-green span, .billboard-marquee-component .component-ticker.text-gable-green .billboard-marquee-eyebrow, .component-ticker.text-gable-green .billboard-marquee-component .billboard-marquee-eyebrow, .component-ticker.text-gable-green .billboard-marquee-component .billboard-marquee-eyebrow span, .component-ticker.text-gable-green .eyebrow, .component-ticker.text-gable-green a, .component-ticker.text-gable-green h2, .component-ticker.text-gable-green h5 { color: #293e40 } .component-ticker.text-gable-green h2 a, .component-ticker.text-gable-green h5 a { border-bottom: .2rem solid #293e40; cursor: pointer } .billboard-marquee-component .billboard-marquee-eyebrow .component-ticker.text-pure-white span, .billboard-marquee-component .component-ticker.text-pure-white .billboard-marquee-eyebrow, .component-ticker.text-pure-white .billboard-marquee-component .billboard-marquee-eyebrow, .component-ticker.text-pure-white .billboard-marquee-component .billboard-marquee-eyebrow span, .component-ticker.text-pure-white .eyebrow, .component-ticker.text-pure-white a, .component-ticker.text-pure-white h2, .component-ticker.text-pure-white h5 { color: #fff } .component-ticker.text-pure-white h2 a, .component-ticker.text-pure-white h5 a { border-bottom: .2rem solid #fff; cursor: pointer } .component-ticker h2 a, .component-ticker h5 a { font-family: inherit; font-size: inherit; line-height: inherit } .component-ticker .content-main { margin-bottom: 5.6rem; min-height: 26.5rem; padding-left: 1rem; padding-right: 1rem } .component-ticker .ticker-component-image { padding-top: 56.25%; position: relative } .component-ticker .ticker-component-image img { height: auto; left: 0; position: absolute; top: 0; width: 100% } .component-ticker .ticker-images { display: none; padding-top: 56.25%; position: relative } .component-ticker .ticker-images img { height: auto; left: 0; opacity: 0; position: absolute; top: 0; width: 100% } .component-ticker .ticker { height: 4.8rem; position: relative } .component-ticker .ticker-list { display: flex; left: 100%; position: absolute } .component-ticker .ticker-item { margin-left: 1.6rem; margin-right: 1.6rem } .component-ticker .ticker-item img { height: 4.8rem; width: auto } .component-ticker .ticker-item:hover .solid { opacity: 1 } .component-ticker .solid { opacity: 0; position: absolute; top: 0; transition: opacity .4s } @media only screen and (min-width: 768px) { .component-ticker .col { -ms-flex-positive: 1; flex-basis: 0; flex-grow: 1; max-width: 100% } .component-ticker .col-md-6 { -ms-flex: 0 0 50%; max-width: 50% } .component-ticker .row { padding-left: 0; padding-right: 0 } .component-ticker .content-main { margin-bottom: 6.4rem; margin-left: auto; margin-right: auto; min-height: unset; padding-left: 1.5rem; padding-right: 1.5rem } .component-ticker .ticker-item { margin-left: 2rem; margin-right: 2rem } .component-ticker .ticker-images { display: block } .component-ticker .ticker, .component-ticker .ticker-item img { height: 5.6rem } } @media only screen and (min-width: 1024px) { .component-ticker { padding-bottom: 8rem; padding-top: 8rem } .component-ticker h2, .component-ticker h2 a { margin-bottom: 4rem } .component-ticker .content-main, .component-ticker .row { padding-left: 2rem; padding-right: 2rem } .component-ticker .content-main { margin-bottom: 8rem; max-width: 170rem } .component-ticker .ticker-item { margin-left: 2.4rem; margin-right: 2.4rem } .component-ticker .ticker, .component-ticker .ticker-item img { height: 6.4rem } } @media only screen and (min-width: 1700px) { .component-ticker.ticker-padding-120 { padding-bottom: 12rem; padding-top: 12rem } .component-ticker.ticker-padding-80 { padding-bottom: 8rem; padding-top: 8rem } .component-ticker .content-main { margin-bottom: 12rem; max-width: 170rem } .billboard-marquee-component .billboard-marquee-eyebrow .component-ticker span, .billboard-marquee-component .component-ticker .billboard-marquee-eyebrow, .component-ticker .billboard-marquee-component .billboard-marquee-eyebrow, .component-ticker .billboard-marquee-component .billboard-marquee-eyebrow span, .component-ticker .eyebrow { margin-bottom: 2.4rem } .component-ticker .ticker-item { margin-left: 4rem; margin-right: 4rem } .component-ticker .ticker, .component-ticker .ticker-item img { height: 12.8rem } } .component-marquee-animated { height: 70rem; overflow: hidden; padding-top: 7.2rem; position: relative } .component-marquee-animated video { display: block } .component-marquee-animated h1 { margin-bottom: 1.6rem !important; padding: 0 !important } .component-marquee-animated h1 a { font-family: inherit; font-size: inherit; line-height: inherit } .billboard-marquee-component .billboard-marquee-eyebrow .component-marquee-animated.text-gable-green span, .billboard-marquee-component .component-marquee-animated.text-gable-green .billboard-marquee-eyebrow, .component-marquee-animated.text-gable-green .billboard-marquee-component .billboard-marquee-eyebrow, .component-marquee-animated.text-gable-green .billboard-marquee-component .billboard-marquee-eyebrow span, .component-marquee-animated.text-gable-green .eyebrow, .component-marquee-animated.text-gable-green a, .component-marquee-animated.text-gable-green h1 { color: #293e40 } .component-marquee-animated.text-gable-green h1 a { border-bottom: 2px solid #293e40; cursor: pointer } .billboard-marquee-component .billboard-marquee-eyebrow .component-marquee-animated.text-pure-white span, .billboard-marquee-component .component-marquee-animated.text-pure-white .billboard-marquee-eyebrow, .component-marquee-animated.text-pure-white .billboard-marquee-component .billboard-marquee-eyebrow, .component-marquee-animated.text-pure-white .billboard-marquee-component .billboard-marquee-eyebrow span, .component-marquee-animated.text-pure-white .eyebrow, .component-marquee-animated.text-pure-white a, .component-marquee-animated.text-pure-white h1 { color: #fff } .component-marquee-animated.text-pure-white h1 a { border-bottom: 2px solid #fff; cursor: pointer } .billboard-marquee-component .billboard-marquee-eyebrow .component-marquee-animated span, .billboard-marquee-component .component-marquee-animated .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow span, .component-marquee-animated .eyebrow { font-size: 1.2rem; margin-bottom: .8rem; opacity: .6; text-transform: uppercase } .component-marquee-animated .row { padding-left: 1rem; padding-right: 1rem } .component-marquee-animated .content-video { bottom: 0; left: 50%; margin-left: -960px; position: absolute; transform: scale(.666666); transform-origin: bottom center } .component-marquee-animated .content-main { height: 100%; position: relative } .component-marquee-animated .cta-container .cta-component { margin-bottom: 1.6rem; margin-top: 0 } .component-marquee-animated .cta-video-container { margin-bottom: 2.4rem } .component-marquee-animated .semibold { font-family: GilroySemiBold } .component-marquee-animated .title p { padding: 0 } .component-marquee-animated .text-secondary { position: relative } .component-marquee-animated .captions { left: 0; position: absolute; top: 0; visibility: hidden } .component-marquee-animated .captions:first-child { visibility: visible } .component-marquee-animated .captions .caption { margin-bottom: .8rem } .component-marquee-animated .captions .caption .name { font-family: GilroySemiBold } .component-marquee-animated .captions .caption:last-child { margin-bottom: 0 } .component-marquee-animated .captions p { line-height: 1.3; margin: 0 } .component-marquee-animated .captions p:first-child { margin-top: 0 } @media only screen and (min-width: 768px) { .component-marquee-animated { height: 80rem; padding-top: 94px } .billboard-marquee-component .billboard-marquee-eyebrow .component-marquee-animated span, .billboard-marquee-component .component-marquee-animated .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow span, .component-marquee-animated .eyebrow { font-size: 1.4rem; margin-bottom: 1.6rem } .component-marquee-animated .content-video { transform: scale(.75) } .component-marquee-animated .cta-container .cta-component { margin-bottom: 3.2rem } .component-marquee-animated .cta-video-container { margin-bottom: 2.4rem } .component-marquee-animated .captions .caption { margin-bottom: 1.6rem } } @media only screen and (min-width: 1024px) { .component-marquee-animated { height: 70rem; padding-bottom: 5.6rem; padding-top: 12rem } .component-marquee-animated h1 { margin-bottom: 4rem !important } .billboard-marquee-component .billboard-marquee-eyebrow .component-marquee-animated span, .billboard-marquee-component .component-marquee-animated .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow span, .component-marquee-animated .eyebrow { font-size: 1.8rem } .component-marquee-animated .row { padding-left: 2rem; padding-right: 2rem } .component-marquee-animated .row:last-child { bottom: 0; position: absolute; width: 100% } .component-marquee-animated .content-video { transform: scale(1) } .component-marquee-animated .cta-video-container { margin-bottom: 0 } .component-marquee-animated .text-secondary { display: flex; justify-content: flex-end } .component-marquee-animated .captions { bottom: 0; left: 0; position: absolute; top: inherit } } @media only screen and (min-width: 1700px) { .component-marquee-animated { height: 90rem; padding-bottom: 6.4rem; padding-top: 18rem } .component-marquee-animated h1 { margin-bottom: 4.8rem !important } .billboard-marquee-component .billboard-marquee-eyebrow .component-marquee-animated span, .billboard-marquee-component .component-marquee-animated .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow, .component-marquee-animated .billboard-marquee-component .billboard-marquee-eyebrow span, .component-marquee-animated .eyebrow { font-size: 2rem; margin-bottom: 2.4rem } .component-marquee-animated .content-video { transform: scale(1.33) } .component-marquee-animated .captions .caption { margin-bottom: 2.4rem } } .component-profile, .component-profile .profile-wrapper { height: 100%; min-height: 48rem; position: relative } .component-profile .profile-wrapper { width: 100vw } .component-profile .profiles { cursor: default !important; height: 100%; left: 0; padding-left: 1rem; position: absolute; top: 0; visibility: hidden; width: 100vw; z-index: 888 !important } .component-profile .profiles:first-child { visibility: visible } .component-profile .profile-images { height: 100%; left: 0; position: absolute; top: 0; width: 100vw; z-index: 1 } .component-profile .profile-images .profile-portrait { height: 100%; left: 50%; margin-left: -27rem; overflow: hidden; position: absolute; right: 0; top: 0 } .component-profile .profile-images .profile-portrait img { height: 100%; width: auto } .component-profile .profile-images .signature { bottom: 2.4rem; position: absolute } .component-profile .profile-images .signature img { display: block; height: auto; width: 100% } .component-profile .profile-content { height: 100%; min-height: 48rem; padding-top: 5.6rem; position: relative; z-index: 2 } .component-profile .profile-content .top-content .profile-eyebrow { padding-bottom: 1.6rem } .component-profile .profile-content .top-content .profile-eyebrow, .component-profile .profile-content .top-content .profile-eyebrow p { color: #293e40; font-family: GilroyBold; font-size: 1.2rem; letter-spacing: -.2px; line-height: 2.08rem; opacity: .6; text-transform: uppercase } .component-profile .profile-content .top-content .profile-eyebrow p, .component-profile .profile-content .top-content .profile-eyebrow p p { color: inherit; margin: 0; padding: 0 } .component-profile .profile-content .top-content .profile-title { padding-bottom: 2.4rem } .component-profile .profile-content .top-content .profile-title a, .component-profile .profile-content .top-content .profile-title h2 { margin: 0 } .component-profile .profile-content .bottom-content { bottom: 3.2rem; position: absolute } .component-profile .profile-content .bottom-content .profile-job-title { color: #293e40; padding-bottom: 1.6rem } .component-profile .profile-content .bottom-content .jobs-cta { padding-bottom: 11.5rem } .component-profile .profile-content .cta-component { margin-bottom: 0; margin-top: 0 } .component-profile .profile-content .cta-component a .cta-play-video-svg, .component-profile .profile-content .cta-component a .cta-title-link-arrow { margin-right: 0 } .component-profile .content-controls { bottom: 3.2rem; padding-left: 1rem; position: absolute; z-index: 890 } .component-profile .content-controls .profiles-page-control { display: flex; position: relative } .component-profile .content-controls .profiles-page-control button { background-color: #fff; border: 0; border-radius: 50%; cursor: pointer; height: .8rem; margin-right: 1.6rem; outline: 0; padding: 0; width: .8rem } .component-profile .content-controls .profiles-page-control button:last-child { margin-right: 0 } .component-profile .content-controls .profiles-page-control button[disabled] { background-color: #293e40; cursor: default } @media only screen and (min-width: 768px) { .component-profile { height: 56.16rem; min-height: 56.16rem } .component-profile .profiles { padding-left: 1.5rem } .component-profile .profile-images .profile-portrait { margin-left: -38rem } .component-profile .profile-images .signature { bottom: 3.2rem } .component-profile .profile-content .top-content { min-height: unset } .component-profile .profile-content .top-content .profile-eyebrow, .component-profile .profile-content .top-content .profile-eyebrow p { font-size: 1.4rem; letter-spacing: normal; line-height: 2.6rem } .component-profile .profile-content .top-content .profile-title { padding-bottom: 3.2rem } .component-profile .profile-content .bottom-content { bottom: 4rem } .component-profile .profile-content .bottom-content .profile-job-title { padding-bottom: 2.4rem } .component-profile .profile-content .bottom-content .jobs-cta { padding-bottom: 3.6rem } .component-profile .content-controls { bottom: 4rem; padding-left: 1.5rem } } @media only screen and (min-width: 1024px) { .component-profile { height: 64rem; min-height: 64rem } .component-profile .profiles { padding-left: 2rem } .component-profile .profile-images { overflow: hidden } .component-profile .profile-images .profile-portrait { left: 0; margin-left: 0; transform: scale(1.2); transform-origin: top center } .component-profile .profile-images .profile-portrait img { height: auto; width: 100% } .component-profile .profile-images .signature { bottom: 0; width: 100% } .component-profile .profile-content { padding-top: 8rem } .component-profile .profile-content .top-content .profile-eyebrow, .component-profile .profile-content .top-content .profile-eyebrow p { font-size: 1.8rem; line-height: 2.86rem } .component-profile .profile-content .top-content .profile-title { padding-bottom: 4rem } .component-profile .content-controls { padding-left: 2rem } .component-profile .content-controls .profiles-page-control button { height: 1.2rem; width: 1.2rem } } @media only screen and (min-width: 1700px) { .component-profile { height: 89.1rem; min-height: 89.1rem } .component-profile .profiles { width: 100% } .component-profile .profile-content { padding-top: 8rem } .component-profile .profile-content.extra-padding { padding-top: 12rem } .component-profile .profile-content .top-content .profile-eyebrow { padding-bottom: 2.4rem } .component-profile .profile-content .top-content .profile-eyebrow, .component-profile .profile-content .top-content .profile-eyebrow p { font-size: 2rem; line-height: 3.12rem } .component-profile .profile-content .top-content .profile-title { padding-bottom: 4.8rem } .component-profile .profile-content .bottom-content .jobs-cta { padding-bottom: 6.8rem } .component-profile .profile-images { margin: auto; max-width: 170rem } .component-profile .profile-images .profile-portrait { transform: scale(1.3) } .component-profile .content-controls .profiles-page-control button { height: 1.2rem; width: 1.2rem } } .component-profile-content { padding-bottom: 5.6rem; padding-top: 5.6rem; position: relative } .component-profile-content .content-intro { display: flex; flex-direction: column; margin-bottom: 3.2rem; position: relative } .component-profile-content .content-intro .content-intro-text { order: 1; padding-left: 0; padding-right: 0 } .component-profile-content .content-intro .content-intro-text .intro-name { margin-bottom: 1.6rem } .component-profile-content .content-intro .content-intro-text .intro-name img { height: auto; width: 100% } .component-profile-content .content-intro .content-intro-text .intro-title p { margin: 0; padding: 0 } .component-profile-content .content-intro .content-intro-text .intro-title .semibold { font-family: GilroySemiBold } .component-profile-content .content-intro .content-intro-image { margin-bottom: 3.2rem; order: 0; padding-left: 0; padding-right: 0 } .component-profile-content .content-intro .content-intro-image img { height: auto; width: 100% } .component-profile-content .content-intro .content-intro-notes { bottom: 0; display: none; left: 0; position: absolute; width: 30% } .component-profile-content .content-intro .content-intro-notes img { height: auto; width: 100% } .component-profile-content .content-video { margin-left: -1rem; padding-left: 0; padding-right: 0; width: 107% } .component-profile-content .content-video .video-ratio-wrapper { background: #222 } .component-profile-content .content-video .video-ratio-wrapper.dam-video, .component-profile-content .content-video .video-ratio-wrapper.img, .component-profile-content .content-video .video-ratio-wrapper.youtube, .component-profile-content .content-video .video-ratio-wrapper > .video-js { height: auto; margin-bottom: 3.2rem; overflow: hidden; padding-bottom: 41.66%; position: relative; top: 0; width: 100% } .component-profile-content .content-video .video-ratio-wrapper.dam-video iframe, .component-profile-content .content-video .video-ratio-wrapper.dam-video img, .component-profile-content .content-video .video-ratio-wrapper.dam-video video, .component-profile-content .content-video .video-ratio-wrapper.img iframe, .component-profile-content .content-video .video-ratio-wrapper.img img, .component-profile-content .content-video .video-ratio-wrapper.img video, .component-profile-content .content-video .video-ratio-wrapper.youtube iframe, .component-profile-content .content-video .video-ratio-wrapper.youtube img, .component-profile-content .content-video .video-ratio-wrapper.youtube video, .component-profile-content .content-video .video-ratio-wrapper > .video-js iframe, .component-profile-content .content-video .video-ratio-wrapper > .video-js img, .component-profile-content .content-video .video-ratio-wrapper > .video-js video { height: 100%; left: 0; left: 50%; position: absolute; transform: translateX(-50%); width: auto } .component-profile-content .content-video .video-ratio-wrapper.dam-video iframe:focus, .component-profile-content .content-video .video-ratio-wrapper.dam-video img:focus, .component-profile-content .content-video .video-ratio-wrapper.dam-video video:focus, .component-profile-content .content-video .video-ratio-wrapper.img iframe:focus, .component-profile-content .content-video .video-ratio-wrapper.img img:focus, .component-profile-content .content-video .video-ratio-wrapper.img video:focus, .component-profile-content .content-video .video-ratio-wrapper.youtube iframe:focus, .component-profile-content .content-video .video-ratio-wrapper.youtube img:focus, .component-profile-content .content-video .video-ratio-wrapper.youtube video:focus, .component-profile-content .content-video .video-ratio-wrapper > .video-js iframe:focus, .component-profile-content .content-video .video-ratio-wrapper > .video-js img:focus, .component-profile-content .content-video .video-ratio-wrapper > .video-js video:focus { border: 0; outline: none } .component-profile-content .content-video .video-ratio-wrapper.youtube iframe { width: 100% } .component-profile-content .content-story { padding-bottom: 3.2rem; padding-left: 0; padding-right: 0 } .component-profile-content .content-story h2 { margin: 0 0 .8rem } .component-profile-content .content-story p { margin: 0 0 3.2rem } .component-profile-content .content-story p:last-of-type { margin: 0 } .component-profile-content .content-story p + .cta-component { margin: 2.4rem 0 1rem } .component-profile-content .content-story .cta-component { display: block; margin-bottom: 0; margin-top: 2.4rem } .component-profile-content .content-story .cta-component:nth-of-type(2) { margin: 1rem 0 0 } .component-profile-content .content-story .cta-component .cta-text-arrow { padding-top: 1rem } .component-profile-content .content-story-image { padding-left: 0; padding-right: 0 } .component-profile-content .content-story-image .image-ratio-wrapper { height: auto; margin-bottom: 3.2rem; overflow: hidden; padding-bottom: 56.25%; position: relative; top: 0; width: 100% } .component-profile-content .content-story-image .image-ratio-wrapper img { height: auto; left: 0; position: absolute; top: 50%; transform: translateY(-50%); width: 100% !important } .component-profile-content .content-gallery { display: flex } .component-profile-content .content-gallery img { height: auto; width: 100% } @media only screen and (min-width: 768px) { .component-profile-content .content-intro { flex-direction: row } .component-profile-content .content-intro .content-intro-text { order: 0 } .component-profile-content .content-intro .content-intro-text .intro-name { margin-bottom: 2.4rem } .component-profile-content .content-intro .content-intro-image { margin-bottom: 0; order: 1; padding-right: 0 } .component-profile-content .content-intro .content-intro-notes { display: block; width: 100% } .component-profile-content .content-video { margin-left: 0; padding-left: 1.5rem; padding-right: 1.5rem; width: 100% } .component-profile-content .content-video .video-ratio-wrapper .play-video-button { bottom: 2.4rem; height: 4rem; left: 3.9rem; width: 4rem } .component-profile-content .content-story p + .cta-component { margin: 2.4rem 4rem 0 0 } .component-profile-content .content-story .cta-component { display: inline-block; margin-bottom: 0; margin-top: 0 } .component-profile-content .content-story .cta-component.cta-text-arrow { margin-bottom: 1rem } .component-profile-content .content-story .cta-component:nth-of-type(2) { margin-top: 2.4rem } } @media only screen and (min-width: 1024px) { .component-profile-content { padding-bottom: 8rem; padding-top: 8rem } .component-profile-content .content-intro { margin-bottom: 4rem } .component-profile-content .content-intro .content-intro-text { align-items: flex-end; display: flex; flex-direction: column; padding-right: 2rem } .component-profile-content .content-intro .content-intro-text .intro-name { align-self: flex-start; margin-bottom: 3.2rem } .component-profile-content .content-intro .content-intro-image { padding-left: 2rem } .component-profile-content .content-intro .content-intro-notes .notes-ratio-wrapper { height: auto; overflow: hidden; padding-bottom: 56.25%; position: relative; width: 100% } .component-profile-content .content-intro .content-intro-notes .notes-ratio-wrapper img { bottom: 0; height: auto; left: 0; position: absolute; width: 100% !important } .component-profile-content .content-video { margin-bottom: 4rem; padding-left: 2rem; padding-right: 2rem } .component-profile-content .content-story-wrapper { display: flex; flex-direction: row; margin-bottom: 4rem } .component-profile-content .content-story { order: 0; padding-bottom: 4rem; padding-right: 2rem } .component-profile-content .content-story:last-of-type { margin-bottom: 0 } .component-profile-content .content-story p { margin: 0 0 4rem } .component-profile-content .content-story p:last-of-type { margin: 0 } .component-profile-content .content-story p + .cta-component { margin: 3.2rem 4rem 0 0 } .component-profile-content .content-story .cta-component { margin: 0 } .component-profile-content .content-story .cta-component:nth-of-type(2) { margin: 3.2rem 0 0 } .component-profile-content .content-story h2 { margin: 3.2rem 0 1.6rem } .component-profile-content .content-story.right-side { order: 1; padding-left: 2rem; padding-right: 0 } .component-profile-content .content-story-image { order: 0; padding-right: 2rem } .component-profile-content .content-story-image .image-ratio-wrapper { height: 100%; padding-bottom: 17.77%; width: auto } .component-profile-content .content-story-image .image-ratio-wrapper img { height: 100%; left: 50%; top: 0; transform: translateX(-50%); width: auto !important } .component-profile-content .content-story-image:last-of-type { margin-bottom: 0 } .component-profile-content .content-story-image.right-side { order: 1; padding-left: 2rem } } @media only screen and (min-width: 1700px) { .component-profile-content { padding-bottom: 12rem; padding-top: 12rem } .component-profile-content .content-intro { margin-bottom: 4.8rem } .component-profile-content .content-intro .content-intro-text .intro-name { margin-bottom: 4rem } .component-profile-content .content-intro .content-intro-notes { width: 41.666667% } .component-profile-content .content-story-wrapper, .component-profile-content .content-video { margin-bottom: 4.8rem } .component-profile-content .content-story-wrapper:last-of-type { margin-bottom: 0 } .component-profile-content .content-story { margin-right: 8.333333%; padding-bottom: 12rem; padding-left: 4.8rem } .component-profile-content .content-story h2 { margin: 12rem 0 2.4rem } .component-profile-content .content-story p { margin: 0 0 5.6rem } .component-profile-content .content-story p:last-of-type { margin: 0 } .component-profile-content .content-story p + .cta-component { margin: 4rem 4rem 0 0 } .component-profile-content .content-story .cta-component:nth-of-type(2) { margin-top: 4rem } .component-profile-content .content-story.right-side { margin-left: 8.333333%; padding-right: 4.8rem } } .expando { display: none; overflow: hidden; position: relative; width: 100% } .expando.active { top: 0 } .expando-close-button { background-color: #fff; border: 0; border-radius: 50%; box-shadow: 0 .2rem .5rem 0 rgba(0,0,0,.25); cursor: pointer; height: 3.2rem; position: absolute; right: .8rem; top: 5.4rem; width: 3.2rem } .expando-close-button .close-icon { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-close-dark1.svg); background-repeat: no-repeat; background-size: contain; height: 1.5rem; left: .75rem; opacity: .6; position: absolute; top: .75rem; width: 1.5rem } .expando-close-button:hover .close-icon { opacity: 1 } .expando-close-button:focus { outline: none } .expando-close-button.sticky { position: fixed } @media only screen and (min-width: 768px) { .expando-close-button { height: 4.8rem; right: 1.6rem; top: 7rem; width: 4.8rem } .expando-close-button .close-icon { height: 2.25rem; left: 1.25rem; top: 1.25rem; width: 2.25rem } } @media only screen and (min-width: 1024px) { .expando-close-button { background-size: auto; height: 5.6rem; top: 8rem; width: 5.6rem } .expando-close-button .close-icon { height: 2.75rem; left: 1.4rem; top: 1.4rem; width: 2.75rem } } @media only screen and (min-width: 1700px) { .expando-close-button { height: 6.4rem; right: 3.2rem; width: 6.4rem } .expando-close-button .close-icon { height: 3.2rem; left: 1.6rem; top: 1.6rem; width: 3.2rem } } .component-slider { overflow: hidden; position: relative } .component-slider.gable-green-background .slider-pagination .pagination-wrapper .circle { background-color: #fff } .component-slider.pure-white-background .slider-pagination .pagination-wrapper .circle { background-color: #293e40 } .component-slider.pure-white-background .slider-wrapper .slider .card-description span, .component-slider.pure-white-background .slider-wrapper .slider .card-title h3 { color: #293e40 } .component-slider .slider-wrapper { -ms-overflow-style: none; display: flex; overflow: hidden } .component-slider .slider-wrapper::-webkit-scrollbar { display: none } .component-slider .slider-wrapper .slider { flex: none; padding: 0 1rem 4rem; position: relative; width: 100% } .component-slider .slider-wrapper .slider .content { padding: 0 1rem } .component-slider .slider-wrapper .slider .card-index { display: none } .component-slider .slider-wrapper .slider .card-image .component-asset-block, .component-slider .slider-wrapper .slider .card-image .image-div, .component-slider .slider-wrapper .slider .card-image img { height: auto; width: 100% } .component-slider .slider-wrapper .slider .card-image { margin: 3.2rem auto; padding: 0 } .component-slider .slider-wrapper .slider .card-title { margin-bottom: .8rem; padding: 0 } .component-slider .slider-wrapper .slider .card-description { margin-bottom: 1.6rem; padding: 0 } .component-slider .slider-wrapper .slider .card-cta { margin-bottom: 2.4rem } .component-slider .slider-wrapper .slider .card-cta .card-cta-link { color: #81b5a1; font-family: gilroySemibold; margin: 0 } .component-slider .slider-pagination .pagination-wrapper { display: flex; justify-content: center; margin-bottom: 3.2rem; margin-top: -4rem; padding: 0 } .component-slider .slider-pagination .pagination-wrapper .circle { border-radius: 50%; cursor: pointer; height: .8rem; margin-right: 1.6rem; opacity: .4; width: .8rem } .component-slider .slider-pagination .pagination-wrapper .circle.active { opacity: 1 } @media only screen and (min-width: 768px) { .component-slider .slider-wrapper .slider .card-description, .component-slider .slider-wrapper .slider .card-image, .component-slider .slider-wrapper .slider .card-title { padding: inherit; padding-left: 0 } .component-slider .slider-wrapper .slider .card-title { margin-bottom: 1.6rem } } @media only screen and (min-width: 1024px) { .component-slider.gable-green-background .slider-wrapper .slider { border-right: .1rem solid hsla(0,0%,100%,.4) } .component-slider.gable-green-background .slider-controls .arrows { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-page-arrow-light.svg) } .component-slider.gable-green-background .slider-controls .close-button { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-close-light.svg) } .component-slider.pure-white-background .slider-wrapper .slider { border-right: .1rem solid rgba(41,62,64,.4) } .component-slider.pure-white-background .slider-controls .arrows { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-page-arrow-dark.svg) } .component-slider.pure-white-background .slider-controls .close-button { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-close-dark.svg) } .component-slider .slider-controls { display: flex; position: absolute; right: 1.6rem; top: 1.6rem; z-index: 21 } .component-slider .slider-controls.hide-it { display: none } .component-slider .slider-controls .arrows { background-size: contain; cursor: pointer; height: 3.2rem; width: 3.2rem } .component-slider .slider-controls .arrows.disabled { opacity: .4; pointer-events: none } .component-slider .slider-controls .left-arrow { transform: rotate(180deg) } .component-slider .slider-controls .right-arrow { margin: 0 1.6rem } .component-slider .slider-controls .close-button { background-size: contain; cursor: pointer; height: 3.2rem; width: 3.2rem } .component-slider .slider-wrapper { display: flex; justify-content: space-evenly } .component-slider .slider-wrapper .slider { flex: 1; padding: 0; position: relative; transition: flex .4s ease } .component-slider .slider-wrapper .slider:last-child { border-right: 0 } .component-slider .slider-wrapper .slider.hoverable.fade-state .card-title { opacity: .4; transition: opacity .25s ease-in-out } .component-slider .slider-wrapper .slider.hoverable .card-text { flex: none; height: -moz-fit-content; height: fit-content; max-width: 100%; position: static } .component-slider .slider-wrapper .slider.hoverable .card-title { margin-top: 10rem; padding-left: .4rem; width: 18rem } .component-slider .slider-wrapper .slider.hoverable .card-title h3 { font-size: 3.6rem; line-height: 4.68rem } .component-slider .slider-wrapper .slider.hoverable .card-image { height: 80% } .component-slider .slider-wrapper .slider.hoverable .card-cta { left: 5.5rem; margin-bottom: 10rem; transform: translateX(-100%); transition: transform .4s } .component-slider .slider-wrapper .slider.hoverable .card-cta .card-cta-link { opacity: 0 } .component-slider .slider-wrapper .slider.hoverable:hover { flex: 1.2 } .component-slider .slider-wrapper .slider.hoverable:hover .card-image { transform: translateX(-54%); transition: .4s } .component-slider .slider-wrapper .slider.hoverable:hover .card-cta { left: 2rem; transform: translateX(0) } .component-slider .slider-wrapper .slider.hoverable:hover .card-cta .card-cta-link, .component-slider .slider-wrapper .slider.hoverable:hover .card-title { opacity: 1 } .component-slider .slider-wrapper .slider .card-index { display: none } .component-slider .slider-wrapper .slider .content { height: 100%; min-height: 57.6rem; overflow: hidden; padding: 0; position: relative } .component-slider .slider-wrapper .slider .card-cta { bottom: 0; margin-bottom: 0; padding-left: 2rem; position: absolute } .component-slider .slider-wrapper .slider .card-cta .card-cta-link { padding-right: .6rem } .component-slider .slider-wrapper .slider .card-image { bottom: 0; left: 100%; margin: auto; padding: 0; position: absolute; top: 0 } .component-slider .slider-wrapper .slider .card-image .component-asset-block, .component-slider .slider-wrapper .slider .card-image .image-div, .component-slider .slider-wrapper .slider .card-image img { height: 100%; width: auto } .component-slider .slider-wrapper .slider .card-image .component-asset-block { width: max-content !important; width: -moz-max-content } .component-slider .slider-wrapper .slider .card-description { display: none } .component-slider .slider-wrapper.slider-full-wide { justify-content: inherit; overflow-x: hidden; transition: opacity .25s ease-in } .component-slider .slider-wrapper.slider-full-wide .slider { border-right: 0; flex: none; transition: none } .component-slider .slider-wrapper.slider-full-wide .content-overlay { display: none } .component-slider .slider-wrapper.slider-full-wide .card-image { left: 10% !important; transition: none } .component-slider .slider-wrapper.slider-full-wide .card-image img { transition: opacity .25s ease-in } .component-slider .slider-wrapper.slider-full-wide .content { display: flex; justify-content: flex-end; min-height: 49.6rem } .component-slider .slider-wrapper.slider-full-wide .card-title { margin-bottom: 1.6rem; padding-left: 0 } .component-slider .slider-wrapper.slider-full-wide .card-description { margin-bottom: 2.4rem; padding-left: 0 } .component-slider .slider-wrapper.slider-full-wide .card-cta { margin-top: 0; padding: 0; position: relative !important } .component-slider .slider-wrapper.slider-full-wide .card-text { display: flex; flex-direction: column; justify-content: flex-end; margin-bottom: 8rem } .component-slider .slider-wrapper .content-overlay { cursor: pointer; height: 100%; margin: 0; padding: 0; position: absolute; width: 100% } .component-slider .slider-wrapper .content-overlay .cta-component, .component-slider .slider-wrapper .content-overlay a { cursor: pointer; height: 100%; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 20 } .component-slider .slider-wrapper .content-overlay a { background: transparent } .component-slider .slider-pagination { display: none } } @media only screen and (min-width: 1700px) { .component-slider .slider-controls { right: 3.2rem; top: 3.2rem } .component-slider .slider-controls .arrows { height: 6.4rem; width: 6.4rem } .component-slider .slider-controls .right-arrow { margin: 0 3.2rem } .component-slider .slider-controls .close-button { height: 6.4rem; width: 6.4rem } .component-slider .slider-wrapper .slider.hoverable .card-title { margin-top: 12rem; padding-left: 2rem; width: 27.5rem } .component-slider .slider-wrapper .slider.hoverable .card-title h3 { font-size: 4.8rem; line-height: 6.24rem } .component-slider .slider-wrapper .slider.hoverable .card-cta { left: 7rem; margin-bottom: 12rem } .component-slider .slider-wrapper .slider.hoverable:hover .card-image { transform: translateX(-66.6%) } .component-slider .slider-wrapper .slider.hoverable:hover .card-cta { left: 5rem } .component-slider .slider-wrapper .slider .content { min-height: 71.4rem } .component-slider .slider-wrapper.slider-full-wide .card-description { margin-bottom: 3.2rem } .component-slider .slider-wrapper.slider-full-wide .card-text { margin-bottom: 12rem } } .champions-rule-config .config-wrapper { padding: 0 2rem } .champions-rule-config .config-wrapper .rule-filter { display: flex; padding: 2rem 0 } .champions-rule-config .config-wrapper .level-option, .champions-rule-config .config-wrapper .role-options { padding-right: 3rem } .champions-rule-config .config-wrapper .level-contents .level-item { border-top: 1px solid #ddd } .champions-rule-config .config-wrapper .level-contents .level-properties { display: flex; justify-content: space-between; padding-top: 1rem } .champions-rule-config .config-wrapper .level-contents .milestones-wrapper .milestone-item { padding-left: 3rem } #drop-search { background-color: #fff; height: calc(100vh - 5.2rem); max-height: 0; overflow: hidden !important; position: relative; top: 0; transition: max-height .5s } #drop-search .component-dotcom-search-solr { color: inherit; display: none; flex: none; max-width: 100vw; padding: 0; right: 0; top: -.2rem !important; width: 100% } #drop-search .component-dotcom-search-solr, #drop-search .component-dotcom-search-solr .search-panel-solr { border: 0; box-sizing: border-box; font: inherit; font-size: 100%; margin: 0; position: relative; vertical-align: baseline } #drop-search .component-dotcom-search-solr .search-panel-solr { background: #293e40; color: #fff; display: block !important; padding: 0 0 0 10%; text-align: left; top: 0 } #drop-search .component-dotcom-search-solr .search-panel-solr:before { content: url(../../../content/dam/servicenow-assets/images/meganav/search-icon.svg); filter: brightness(0) invert(1); height: 1.6rem; left: 1%; position: absolute; top: 1.6rem; transform: scale(.8); z-index: 10 } #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr { -webkit-appearance: none; background: transparent; background-color: transparent; border: 0; border-radius: 10rem; bottom: 0; box-sizing: border-box; color: inherit; cursor: pointer; display: none; filter: alpha(opacity=20); font: inherit; font-size: 100%; height: 3rem; line-height: 8rem !important; margin: auto !important; opacity: 1; padding: 0; position: absolute !important; right: 10rem; text-shadow: 0 .1rem 0 #fff; top: 0; vertical-align: baseline; width: 3rem; z-index: 1000 } #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr:after, #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr:before { background-color: #fff; content: " "; display: block; position: absolute } #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr:before { background-color: #fff; content: " "; display: block; height: .3rem; left: .5rem; position: absolute; top: 1.4rem; transform: rotate(45deg); width: 2rem } #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr:after { background-color: #fff; content: " "; display: block; height: .3rem; left: .5rem; position: absolute; top: 1.4rem; transform: rotate(135deg); width: 2rem } #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr.hover-clear:after, #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr.hover-clear:before { background-color: #81b5a1; content: " "; display: block; position: absolute; transform: translateZ(1) } #drop-search .component-dotcom-search-solr .search-panel-solr .search-click-solr { border: 0; box-sizing: border-box; color: #fff; cursor: pointer; display: inline-block; font-size: 1.4rem; line-height: 6rem; margin: 0; opacity: .8; padding: 0 3rem; position: absolute; right: 0; top: auto !important; vertical-align: baseline; z-index: 999 } #drop-search .component-dotcom-search-solr .search-panel-solr .search-click-solr:hover { background-color: hsla(0,0%,100%,.1); color: #fff; opacity: 1 } #drop-search .component-dotcom-search-solr .search-panel-solr form { border: 0; box-sizing: border-box; color: inherit; font-size: 100%; font: inherit; height: 6rem; line-height: 6rem; margin: .2rem; padding: 0; position: relative; vertical-align: baseline; width: 80% } #drop-search .component-dotcom-search-solr .search-panel-solr form input { background: #293e40; border: none; color: #fff; font-family: GilroyRegular; font-size: 1.6rem; height: 6rem; line-height: 2.5rem; margin: 0 auto; padding: 0; width: 100% !important } #drop-search .component-dotcom-search-solr .search-panel-solr form input::-moz-placeholder { color: hsla(0,0%,100%,.6) } #drop-search .component-dotcom-search-solr .search-panel-solr form input::placeholder { color: hsla(0,0%,100%,.6) } #drop-search .component-dotcom-search-solr .search-panel-solr form input:focus { color: #fff; outline: none } #drop-search .component-dotcom-search-solr .search-panel-solr form input::-ms-clear { display: none } #drop-search .component-dotcom-search-solr .direct-keywords-solr { background: transparent; color: inherit; height: 100%; padding: 5.6rem 0 10rem 10%; position: absolute; text-align: center; top: 8rem } #drop-search .component-dotcom-search-solr .direct-keywords-solr div.byline { color: #293e40; font-family: GilroySemiBold; font-size: 2.4rem; text-align: left } #drop-search .component-dotcom-search-solr .direct-keywords-solr div.keywords { align-items: center; display: flex; flex-flow: row wrap; justify-content: flex-start; padding: 4rem 0 } #drop-search .component-dotcom-search-solr .direct-keywords-solr div.keywords span { background: #fff; border: .1rem solid #ccc; border-radius: 10rem; cursor: pointer; font-size: 1.8rem; margin: 1.5rem 1.5rem 1.5rem 0; padding: 1.25rem 3.2rem } #drop-search .component-dotcom-search-solr .direct-keywords-solr div.keywords span a { color: #293e40; font-size: 1.8rem; line-height: 1.7; text-decoration: none } #drop-search .component-dotcom-search-solr .direct-keywords-solr div.keywords span:hover { background: transparent; border: .1rem solid #000 } #drop-search .component-dotcom-search-solr .drop-panelx-solr { background: #fff; color: #293e40; font: 1.4rem GilroySemiBold; height: calc(100vh - 11.2rem); left: 0; overflow-y: auto; padding: 1rem 0; position: absolute; z-index: 999 } #drop-search .component-dotcom-search-solr .drop-panelx-solr li { border: 0; box-sizing: border-box; cursor: pointer; display: block; font-size: 2.2rem; line-height: 3rem; list-style: none; margin: 0; padding: 2rem 9.5rem 2rem 5.5rem; position: relative; text-align: left !important; vertical-align: baseline } #drop-search .component-dotcom-search-solr .drop-panelx-solr li:hover { background-color: #f7f7f7 } #drop-search .component-dotcom-search-solr .drop-panelx-solr .kw b { font-family: GilroyBold } #drop-search .component-dotcom-search-solr .drop-panelx-solr div { line-height: 2rem } #drop-search .component-dotcom-search-solr .drop-panelx-solr .view-all { font-size: 2.2rem; line-height: 2rem; margin: 3rem 0; padding: 0 0 0 5.5rem } #drop-search .component-dotcom-search-solr .drop-panelx-solr .view-all a { font-size: 2.2rem !important; text-decoration: none; vertical-align: bottom } #drop-search .component-dotcom-search-solr .drop-panelx-solr .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow { transform: translate(1rem) } #drop-search .component-dotcom-search-solr .drop-panelx-solr .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow svg #polyline-3 { transform: translate(0) } #drop-search .component-dotcom-search-solr .drop-panelx-solr .view-all .cta-component.cta-text-arrow a:hover .UF-link-arrow svg { width: 100px } @media only screen and (min-width: 480px) { .cols .search-panel-solr:before { left: 3% } } @media only screen and (min-width: 768px) { #drop-search { height: calc(100vh - 5.2rem) } #drop-search .component-dotcom-search-solr { max-width: 50vw } #drop-search .component-dotcom-search-solr .search-panel-solr form input { font-size: 1.4rem } #drop-search .component-dotcom-search-solr .search-panel-solr .drop-panelx-solr { display: none; height: calc(100vh - 13rem); overflow-x: hidden; width: 50vw !important } } @media only screen and (min-width: 1280px) { #drop-search { flex: 1; height: calc(100vh - 8rem); position: absolute } #drop-search .component-dotcom-search-solr .search-panel-solr:before { left: 5%; top: 3.8rem; transform: none } #drop-search .component-dotcom-search-solr .search-panel-solr .search-clear-solr { right: 13rem } #drop-search .component-dotcom-search-solr .search-panel-solr .search-click-solr { font-size: 1.8rem; line-height: 10.6rem; padding: 0 5rem } #drop-search .component-dotcom-search-solr .search-panel-solr .drop-panelx-solr { height: calc(100vh - 18.6rem) } #drop-search .component-dotcom-search-solr .search-panel-solr .drop-panelx-solr li { padding: 2rem 9.5rem } #drop-search .component-dotcom-search-solr .search-panel-solr .drop-panelx-solr .view-all { padding: 0 0 0 9.5rem } #drop-search .component-dotcom-search-solr .search-panel-solr form { height: 10.6rem; line-height: 10.6rem } #drop-search .component-dotcom-search-solr .search-panel-solr form input { font-size: 2.2rem; height: 10.6rem; padding: .1rem 0 } } @media only screen and (min-width: 1600px) { #drop-search .component-dotcom-search-solr:before { content: ""; height: 10.6rem; position: fixed; width: 100% } #drop-search .component-dotcom-search-solr:after { background-color: #f7f7f7; content: ""; height: 100%; position: fixed; top: 10.6rem; width: 100%; z-index: -1 } .off .component-dotcom-search-solr:after, .off .component-dotcom-search-solr:before { display: none !important } } @media only screen and (min-width: 1700px) { #meganav18 .mega-drop .rowsflex #drop-search { width: 50vw } } .searchSolrResults .flex-box-container { justify-content: center; width: 100% } .searchSolrResults .dismiss-filter { background-color: #293e40; cursor: pointer; left: 0; opacity: 0; position: fixed; right: 0; top: 0; transition: opacity .2s } .searchSolrResults .dismiss-filter.open { bottom: 0; opacity: .7; z-index: 1000 } .searchSolrResults .search-solr-input-page-result-container { background-color: #293e40; display: flex; justify-content: center } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box { padding-bottom: 2.4rem; padding-top: 2.4rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result { position: relative } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .search-click-solr-page-result { display: none } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result form { position: relative } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result form .search-input-page-result { background-color: #f7f7f7; border: none; border-radius: .2rem; color: #293e40; font-family: GilroyRegular; font-size: 1.8rem; height: 4rem; outline: none; padding-left: 1.6rem; padding-right: 4rem; width: 100% } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result form .search-input-page-result::-ms-clear { display: none } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result form img { cursor: pointer; max-width: 2.2rem; position: absolute; right: 1.6rem; top: .9rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result { background: #fff; box-shadow: 0 .2rem .5rem 0 #293e40; color: #293e40; display: none; flex-direction: column; left: 0; max-height: 87.2rem; overflow-y: hidden; padding: .6rem 0; position: absolute; right: 0; z-index: 1 } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .kw { font-family: GilroySemiBold; font-size: 1.6rem; letter-spacing: .03rem; line-height: 1em; padding: 1.6rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .kw b { font-family: GilroyRegular; font-weight: 400 } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .kw:hover { background-color: #f7f7f7; cursor: pointer } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .view-all { padding: 1.6rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .view-all a { align-items: center; color: #293e40; display: flex; font-size: 1.6rem; justify-content: center } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow { transform: translate(1rem) } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow svg #polyline-3 { transform: translate(0) } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .view-all .cta-component.cta-text-arrow a:hover .UF-link-arrow svg { width: 100px } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result { background: #fff; box-shadow: 0 .2rem .5rem 0 #293e40; color: #293e40; display: none; flex-direction: column; left: 0; max-height: 40vh; overflow-y: auto; padding: .6rem 0; position: absolute; right: 0; z-index: 1 } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result div.byline { color: #4f4f4f; font-family: GilroyRegular; font-size: 1.4rem; letter-spacing: .11rem; padding: 2rem 1.6rem; text-align: left; text-transform: uppercase } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result div.keywords span { background: transparent; border: none; border-radius: 0; cursor: pointer; display: block; font-family: GilroySemiBold; margin: 0; padding: 2rem 1.6rem; text-align: left } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result div.keywords span a { background-image: none; color: var(--gable-green); display: block; font-family: GilroyBold; font-size: 1.6rem; letter-spacing: .03rem; line-height: 1em } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result div.keywords span:hover { background-color: #f7f7f7; text-decoration: none } .searchSolrResults.more-than-seven-suggestions .search-solr-container { min-height: 86rem } .searchSolrResults.seven-or-less-suggestions .search-solr-container { min-height: 62rem } .searchSolrResults .search-solr-container { display: flex; position: relative; width: 100% } .searchSolrResults .search-solr-container .fill-left-gap { background: #f7f7f7; display: none; height: 100%; left: -296rem; position: absolute; width: 300rem } @media(min-width: 768px) { .searchSolrResults .search-solr-container .filters-visible .fill-left-gap { display: block } } .searchSolrResults .search-solr-container :not(.filters-visible) .left-side-container { flex: 0 0 0; padding: 0 } @media(max-width: 767px) { .searchSolrResults .search-solr-container .left-side-container { flex: 0 0 0; padding: 0 } } .searchSolrResults .search-solr-container .left-search-solr-side { -ms-overflow-style: none; background-color: #f7f7f7; bottom: 0; height: 100%; left: 0; opacity: 0; padding: 4.8rem 3rem 0; position: fixed; scrollbar-width: none; top: 0; transition: opacity .2s; width: 83.33%; z-index: -1 } .searchSolrResults .search-solr-container .left-search-solr-side::-webkit-scrollbar { display: none } @media(min-width: 768px) { .searchSolrResults .search-solr-container .left-search-solr-side { padding: 0 1.6rem 0 0; width: auto } } @media(min-width: 1024px) { .searchSolrResults .search-solr-container .left-search-solr-side { margin-right: -4rem; padding-right: 2.4rem } } @media(min-width: 1700px) { .searchSolrResults .search-solr-container .left-search-solr-side { padding-right: 4rem } } .searchSolrResults .search-solr-container .left-search-solr-side.open { display: block !important; height: 100%; opacity: 1; overflow-y: scroll; z-index: 1001 } .searchSolrResults .search-solr-container .left-search-solr-side .more-section .new-filter-list { margin-bottom: 5rem } .searchSolrResults .search-solr-container .left-search-solr-side .filter-top-section { align-items: flex-end; display: flex; justify-content: space-between } .searchSolrResults .search-solr-container .left-search-solr-side .filter-top-section .clear-all-container span { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 .2rem; color: #293e40; cursor: pointer; display: none; font-family: GilroySemiBold; margin-bottom: 1.4rem; padding-bottom: .2rem; transition: all .25s linear } .searchSolrResults .search-solr-container .left-search-solr-side .filter-top-section .clear-all-container span:hover { background-position: 0 100%; background-size: 205% .2rem; transition: all .25s linear } .searchSolrResults .search-solr-container .left-search-solr-side .filter-top-section, .searchSolrResults .search-solr-container .left-search-solr-side .sort-top-section { border-bottom: 1px solid rgba(41,62,64,.4); padding-bottom: .8rem } .searchSolrResults .search-solr-container .left-search-solr-side .filter-top-section .filter-title, .searchSolrResults .search-solr-container .left-search-solr-side .sort-top-section .filter-title { color: #293e40; font-family: GilroyBold } .searchSolrResults .search-solr-container .left-search-solr-side .filter-top-section .filter-title.more-filter, .searchSolrResults .search-solr-container .left-search-solr-side .sort-top-section .filter-title.more-filter { padding-top: 6.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container { display: block; padding-bottom: 4rem } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section { border-bottom: 1px solid rgba(41,62,64,.4); padding: 2.4rem .8rem 0 } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section .sort-input-row { padding-bottom: 2.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section .sort-input-row .container { color: #293e40; cursor: pointer; font-family: GilroyRegular; font-size: 1.6rem; padding-left: 3.3rem; padding-top: .4rem; position: relative; -webkit-user-select: none; -moz-user-select: none; user-select: none } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section .sort-input-row .container input { cursor: pointer; opacity: 0; position: absolute } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section .sort-input-row .container input:checked ~ .checkmark:after { background-color: #497e6e; display: block; height: 1.4rem; left: .3rem; top: .3rem; width: 1.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section .sort-input-row .container .checkmark { border: .2rem solid #ced2d3; border-radius: 50%; cursor: pointer; height: 2.4rem; left: 0; position: absolute; top: 0; width: 2.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .sort-container .sort-bottom-section .sort-input-row .container .checkmark:after { border-radius: 50%; content: ""; display: none; height: 1.4rem; left: .5rem; position: absolute; top: .5rem; width: 1.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container { padding-bottom: 6rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container:not(:last-child) { border-bottom: 1px solid rgba(41,62,64,.4) } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .container { color: #293e40; cursor: pointer; display: flex; font-family: GilroyRegular; font-size: 1.6rem; padding-left: 3.2rem; padding-top: .4rem; position: relative; -webkit-user-select: none; -moz-user-select: none; user-select: none } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .container input { cursor: pointer; opacity: 0; position: absolute } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .container input:checked ~ .checkmark:after { background-color: #497e6e; border-radius: .2rem; display: block; height: 1.4rem; left: .3rem; top: .3rem; width: 1.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .container .checkmark { border: .2rem solid #ced2d3; border-radius: .4rem; cursor: pointer; height: 2.4rem; left: 0; position: absolute; width: 2.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .container .checkmark:after { border-radius: .4rem; content: ""; display: none; height: 1.4rem; left: .5rem; position: absolute; top: .5rem; width: 1.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec { align-items: center; display: flex; justify-content: space-between; padding-top: 2.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .title-container { display: flex } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .title-container h5 { color: #293e40; font-family: GilroySemiBold; padding-right: 16px } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .title-arrow { cursor: pointer; transition-duration: .2s } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .title-arrow svg { height: 1.7rem; width: 1.4rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .title-arrow svg path { stroke: #293e40; opacity: .6 } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .title-arrow.up { transform: rotate(180deg); transition-duration: .2s } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .container .checkmark { top: 0 } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec { max-height: 8600px; padding: 1.6rem 3.6rem 2.4rem 1.6rem; transition: max-height .2s linear } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec .filter-inner { padding-bottom: 1.9rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec .filter-inner:last-child { padding-bottom: 0 } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec .load-more-sec { cursor: pointer; font-family: GilroySemiBold; font-size: 1.6rem; padding-left: 3.5rem } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec .load-more-sec-childs { display: none } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec .load-more-sec-childs.open { display: block } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec .container .checkmark { top: 0 } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-collapse-sec.collapsed { height: 0; max-height: 0; transition: max-height .2s linear; visibility: collapse } .searchSolrResults .search-solr-container .left-search-solr-side .filter-apply-container { background-color: #293e40; bottom: 0; color: #fff; display: block; height: 4.8rem; left: 0; position: fixed; width: 85% } .searchSolrResults .search-solr-container .left-search-solr-side .filter-apply-container .aplly-filter-submit-button { align-items: center; border: 0; color: #fff; cursor: pointer; display: flex; display: -moz-flex; display: -ms-flex; display: -o-flex; font-family: GilroySemiBold; font-size: 1.8rem; height: 100%; justify-content: center; margin: 0; padding: 0 4rem; text-align: center } .searchSolrResults .search-solr-container .right-search-solr-side { padding-top: 3.2rem } @media(min-width: 1024px) { .searchSolrResults .search-solr-container .filters-visible .right-search-solr-side { padding-left: calc(8.3333% - 2rem) } } @media(min-width: 1024px)and (min-width:1700px) { .searchSolrResults .search-solr-container .filters-visible .right-search-solr-side { padding-left: 2rem } } @media(min-width: 768px) { .searchSolrResults .search-solr-container .left-search-solr-side, .searchSolrResults .search-solr-container .right-search-solr-side { padding-top: 4rem } } @media(min-width: 1024px) { .searchSolrResults .search-solr-container .left-search-solr-side, .searchSolrResults .search-solr-container .right-search-solr-side { padding-top: 4.8rem } } @media(min-width: 1700px) { .searchSolrResults .search-solr-container .left-search-solr-side, .searchSolrResults .search-solr-container .right-search-solr-side { padding-top: 6.4rem } } .searchSolrResults .search-solr-results { font-size: 1.2rem; position: relative; text-align: left } .searchSolrResults .search-solr-results .spellcheck { color: #293e40; display: inline-block; font-family: GilroyRegular; vertical-align: bottom } .searchSolrResults .search-solr-results .spellcheck a, .searchSolrResults .search-solr-results .spellcheck span { font-family: GilroySemiBold; font-style: oblique } .searchSolrResults .search-solr-results .spellcheck a { cursor: pointer } .searchSolrResults .search-solr-results .container { color: #293e40; padding-left: 0; padding-right: 0 } .searchSolrResults .search-solr-results .container .type-module-component.component { padding-top: 0 } .searchSolrResults .search-solr-results .container .new-text-jumbo { margin-left: 0 !important; padding-left: 0 !important } .searchSolrResults .search-solr-results .container .new-text-jumbo .spellcheck { font-size: 2.8rem; line-height: 2.8rem; margin-bottom: 2rem } .searchSolrResults .search-solr-results .container .new-text-jumbo a, .searchSolrResults .search-solr-results .container .new-text-jumbo span { font-size: 2.8rem; line-height: 2.8rem } .searchSolrResults .search-solr-results .search-solr-results-title h3 { font-size: 2.2rem; margin-bottom: .8rem } .searchSolrResults .search-solr-results .search-solr-results-title p { margin: 0 } .searchSolrResults .search-solr-results .search-solr-results-header { display: none } .searchSolrResults .search-solr-results .search-solr-results-header .search-summary h1 { padding: 0 } .searchSolrResults .search-solr-results .search-solr-results-header .search-summary .spellcheck { color: #293e40; font-size: 1.6rem; line-height: 1.6rem } .searchSolrResults .search-solr-results .search-solr-results-header .search-summary a, .searchSolrResults .search-solr-results .search-solr-results-header .search-summary span { font-size: 1.6rem; line-height: 1.6rem } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container { position: absolute } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container { display: block; flex: 1; margin-top: .8rem; position: relative } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .header-section { align-items: center; appearance: none; -moz-appearance: none; -webkit-appearance: none; border: .1rem solid #293e40; color: #333; display: flex; float: right; font-family: GilroySemiBold; font-size: 1.6rem; height: 5rem; line-height: 1.75; padding: 0 2.4rem; position: relative; width: 100%; word-break: normal; -ms-word-break: normal } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .header-section .thumbnail { padding-right: .8rem; padding-top: .5rem } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .header-section .thumbnail img { opacity: .6 } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .header-section:hover { cursor: pointer } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .dropdown-options { visibility: hidden; z-index: 2 } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .dropdown-options ul { background: #fff; border: .1rem solid #293e40; border-top: none; display: flex; flex-direction: column; left: 0; min-height: auto; min-width: auto; padding: 0; width: 100% } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .dropdown-options ul li { align-items: center; display: flex; height: 4rem; margin: 0; padding: 0 4rem } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container .dropdown-options ul li:not(:first-child):hover { background: hsla(0,0%,78%,.25) } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container.open .dropdown-options { height: 100%; visibility: visible } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container:hover .header-section .thumbnail img { opacity: 1 } .searchSolrResults .search-solr-results .search-solr-results-header .sort-by-container .dropdown-container:hover .dropdown-options { cursor: pointer } .searchSolrResults .search-solr-results h1 { color: #293e40; font-family: GilroyBold; font-size: 1.6rem; font-weight: 500 !important; line-height: 1.1; margin-bottom: 1rem; margin-top: 0; padding-bottom: 0 } .searchSolrResults .search-solr-results h3 { font-family: GilroyBold } .searchSolrResults .search-solr-results .text-component .error-message { font-size: 1.6rem; line-height: 2.4rem } .searchSolrResults .search-solr-results ul { min-height: 20rem; min-width: 32rem; padding: 0 } .searchSolrResults .search-solr-results ul li { list-style: none; margin: 3.2rem auto 3.2rem 0 } .searchSolrResults .search-solr-results ul li:hover .solr-results-item-title .underline { transition: width .25s linear; width: 100% } .searchSolrResults .search-solr-results ul li a { display: block } .searchSolrResults .search-solr-results ul li a div div h5 { font-family: GilroyBold; line-height: 1.98rem; margin-bottom: .8rem } .searchSolrResults .search-solr-results ul li a div div h5 .solr-results-item-title { display: inline-block; max-width: 100%; width: auto } .searchSolrResults .search-solr-results ul li a div div h5 .solr-results-item-title .title { color: #293e40; display: block; font-family: GilroyBold; font-size: 1.8rem; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100% } .searchSolrResults .search-solr-results ul li a div div h5 .solr-results-item-title .title:visited { color: #258dfc } .searchSolrResults .search-solr-results ul li a div div h5 .solr-results-item-title .underline { background: #81b5a1; display: flex; height: .2rem; transition: width .25s linear; width: 0 } .searchSolrResults .search-solr-results ul li a div div p { color: #293e40; font-family: GilroyRegular; margin: 0 0 1rem; overflow: hidden } .searchSolrResults .search-solr-results ul li:first-child { margin-top: 2.4rem } .searchSolrResults .search-solr-results ul li:last-child { margin-bottom: 4rem } .searchSolrResults .search-solr-results .filter-btn-container { display: inline-block; padding-bottom: 2.4rem; padding-top: .8rem } .searchSolrResults .search-solr-results .filter-btn-container .filter-header-section { align-items: center; -moz-appearance: none; -webkit-appearance: none; appearance: none; border: 1px solid #293e40; color: #333; cursor: pointer; display: flex; font-family: GilroySemiBold; font-size: 1.6rem; height: 3.4rem; line-height: .75; padding-left: 2.4rem; padding-right: 2.4rem; position: relative; width: 100%; -ms-word-break: normal } .searchSolrResults .search-solr-results .filter-btn-container .filter-header-section .thumbnail img { opacity: 1 } .searchSolrResults .search-solr-results .filter-btn-container .filter-header-section .filter-section-right { color: #333; padding-left: 8px } .searchSolrResults .search-solr-results .content_pagination { padding-left: 4rem; padding-right: 4rem; text-align: center } .searchSolrResults .search-solr-results .pagination { display: inline-block } .searchSolrResults .search-solr-results .pagination a { color: #293e40; float: left; font-family: GilroyRegular; font-size: 1.1rem; font-weight: 700; padding: .7rem 1.2rem; text-decoration: none } .searchSolrResults .search-solr-results .pagination a.active { background-color: #f7f7f7 } .searchSolrResults .search-solr-results .pagination a:hover:not(.active) { background-color: #81b5a1 } .searchSolrResults .search-solr-results #load-indicator { align-items: center; display: flex; flex-direction: column } .searchSolrResults .search-solr-results .bottom-section { align-items: center; display: flex; flex-direction: column; justify-content: center; margin-bottom: 5.6rem; width: 100% } .searchSolrResults .search-solr-results .bottom-section .solr-load-more { background: none; border: .05rem solid rgba(41,62,64,.2); border-top: none; color: #293e40; cursor: pointer; font-family: GilroySemiBold; font-size: 1.4rem; font-weight: 700; outline: none; padding: 1.3rem 3.2rem } .searchSolrResults .search-solr-results .bottom-section .solr-load-more:hover { background: rgba(41,62,64,.2) } .searchSolrResults .search-solr-results .bottom-section .total-results { border-bottom: .05rem solid rgba(41,62,64,.2); color: #5b6f70; font-family: inherit; font-size: 1.4rem; text-align: center; width: 100% } @media only screen and (min-width: 768px) { .searchSolrResults .dismiss-filter { display: none } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box { padding-bottom: 4rem; padding-top: 4rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result .byline, .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .direct-keywords-solr-page-result .keywords span { padding: 2rem 1.6rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result { max-height: 65.2rem } .searchSolrResults.more-than-seven-suggestions .search-solr-container { min-height: 55rem } .searchSolrResults.seven-or-less-suggestions .search-solr-container { min-height: 50rem } .searchSolrResults .search-solr-container .left-search-solr-side { display: none; opacity: 1; position: relative; z-index: 0 } .searchSolrResults .search-solr-container .left-search-solr-side.open { display: block; opacity: 1 } .searchSolrResults .search-solr-container .left-search-solr-side .filter-apply-container, .searchSolrResults .search-solr-container .left-search-solr-side .sort-container { display: none } .searchSolrResults .search-solr-container .left-search-solr-side .all-filter-container .new-filter-list .filter-list-inner-container .filter-item-container .filter-header-sec .container .checkmark { top: .4rem } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-header { display: flex } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-header .sort-by-container { right: 0; width: 20rem } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-header .sort-by-container .dropdown-container .header-section { height: 5.6rem } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-header .sort-by-container .dropdown-container .header-section:after { border-bottom: .2rem solid #293e40; border-right: .2rem solid #293e40; content: ""; cursor: pointer; display: inline-block; height: .8rem; opacity: .6; position: absolute; right: 1.6rem; transform: rotate(45deg); transform-origin: center center; transition: all .5s; width: .8rem } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-header .sort-by-container .dropdown-container.open .header-section:after { transform: rotate(225deg) } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-header .sort-by-container .dropdown-container:hover .header-section:after { opacity: 1 } .searchSolrResults .search-solr-container .right-search-solr-side.col-md-9 { flex: auto } .searchSolrResults .search-solr-container .right-search-solr-side.col-md-9 .search-solr-results ul li div div h5 .solr-results-item-title { width: auto } .searchSolrResults .search-solr-container .right-search-solr-side.col-md-9 .search-solr-results ul li div div h5 .solr-results-item-title .title { overflow: visible; text-overflow: clip; white-space: normal } .searchSolrResults .search-solr-container .right-search-solr-side .filter-btn-container { display: none } .searchSolrResults .search-solr-container .search-solr-results .search-solr-results-title h3 { font-size: 2.4rem } } @media only screen and (min-width: 768px)and (max-width:1024px) { .searchSolrResults .search-solr-results .content_pagination { padding-left: 0; padding-right: 0 } .searchSolrResults.has-secondary-nav { margin-top: 6.36rem } .searchSolrResults .search-solr-container .left-search-solr-side.hide-filters-container { display: none !important } } @media(max-width: 767px) { .searchSolrResults .search-solr-results ul { min-width: 100% } .searchSolrResults .search-solr-results .content_pagination { padding-left: 0; padding-right: 0; text-align: center } .searchSolrResults.has-secondary-nav { margin-top: 4.9rem } } @media(min-width: 1024px) { .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box { padding-bottom: 5.6rem; padding-top: 5.6rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result form .search-input-page-result { height: 6.4rem; padding-left: 2.4rem; padding-right: 6rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result form img { max-width: 2.8rem; right: 2.4rem; top: 1.7rem } .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .kw, .searchSolrResults .search-solr-input-page-result-container .search-solr-input-page-result-box .search-panel-solr-page-result .drop-panelx-solr-page-result .view-all { padding: 2rem 2.4rem } .searchSolrResults .search-solr-container .search-solr-results .bottom-section { margin-bottom: 8rem } .searchSolrResults .search-solr-container .search-solr-results .bottom-section .solr-load-more { font-size: 1.8rem; padding: 1.7rem 4rem } .searchSolrResults .search-solr-container .search-solr-results .search-solr-results-title h3 { font-size: 2.8rem } .searchSolrResults .search-solr-container .left-search-solr-side.hide-filters-container { display: none !important } .searchSolrResults.has-secondary-nav { margin-top: 8rem } } @media(min-width: 1700px) { .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results ul li { margin: 4.8rem auto 4.8rem 0 } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results ul li:last-child { margin-bottom: 6.4rem } .searchSolrResults .search-solr-container .right-search-solr-side.col-md-9 { max-width: 80%; width: 80% } .searchSolrResults .search-solr-container .right-search-solr-side .search-solr-results-title h3 { font-size: 3.6rem } } .component-your-progress { position: relative } .component-your-progress .tabs-background-white { background: #fff } .component-your-progress .tabs-background-transparent { background: transparent } @media only screen and (min-width: 1700px) { .component-your-progress { max-width: 75% } } .component-your-progress-inner-wrapper.default-padding, .component-your-progress-inner-wrapper.padding-40, .component-your-progress-inner-wrapper.padding-80 { padding-bottom: 3.2rem; padding-top: 3.2rem } .component-your-progress-inner-wrapper .title h2 { margin: 0 } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper { position: relative } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper ul { display: flex } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper ul .tab-link, .component-your-progress-inner-wrapper .horizontal-tabs-wrapper ul .tab-name { cursor: pointer } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper li { padding: 2rem } .component-your-progress-inner-wrapper .tabs-background-white { background: #fff } .component-your-progress-inner-wrapper .tabs-background-transparent { background: transparent } .component-your-progress-inner-wrapper .horizontal-rule { border-bottom: .1rem solid rgba(41,62,64,.2) } .component-your-progress-inner-wrapper .horizontal-tabs-list { -webkit-padding-start: 0; margin: 0; overflow-y: auto; padding-inline-start: 0 } .component-your-progress-inner-wrapper .horizontal-tabs-list::-webkit-scrollbar { display: none } .component-your-progress-inner-wrapper .horizontal-tabs-list.fade-right:after { background-image: linear-gradient(90deg,hsla(0,0%,97%,0) 0,#f7f7f7); content: ""; display: block; height: 100%; position: absolute; right: 0; width: 10% } .component-your-progress-inner-wrapper .horizontal-tabs-list.fade-left:before { background-image: linear-gradient(270deg,hsla(0,0%,97%,0) 0,#f7f7f7); content: ""; display: block; height: 100%; left: 0; position: absolute; width: 10%; z-index: 10 } .component-your-progress-inner-wrapper .horizontal-tabs-list .current { background: #81b5a1 } .component-your-progress-inner-wrapper .horizontal-tabs-list .current .tab-name { color: #fff; font-family: GilroySemibold; opacity: 1 } .component-your-progress-inner-wrapper .tab-link:hover .tab-name { opacity: 1 } .component-your-progress-inner-wrapper .tab-name { color: #293e40; opacity: .6; white-space: nowrap } .component-your-progress-inner-wrapper .content { padding-left: 0; padding-right: 0; padding-top: 4rem } .component-your-progress-inner-wrapper .content .your-progress-hidden-elements, .component-your-progress-inner-wrapper .your-progress .your-progress-content-wrapper { display: none } .component-your-progress-inner-wrapper .your-progress .your-progress-content-wrapper.current { display: block } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay { bottom: 0; left: 0; overflow: auto; position: fixed; right: 0; top: 0; z-index: 999 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay.disable { display: none } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-wrapper, .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-outer-wrapper { padding: 0; width: 100% } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-outer-wrapper { background-color: #293e40; display: flex; justify-content: center; opacity: .3 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-wrapper { background: #fff; height: 100%; overflow-y: auto } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon { cursor: pointer; height: 1.6rem; position: absolute; right: 2rem; top: 3.2rem; width: 1.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:hover { opacity: 1 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:after, .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:before { background-color: #fff; content: " "; height: 1.6rem; left: 1rem; position: absolute; width: .2rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:before { transform: rotate(45deg) } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:after { transform: rotate(-45deg) } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper h2 { -webkit-margin-after: 0; -webkit-margin-before: 0; background-color: #81b5a1; color: #fff; margin-block-end: 0; margin-block-start: 0; padding-bottom: 2.4rem; padding-top: 2.4rem; text-align: center } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content { display: flex; flex-direction: column; justify-content: center; padding-top: 2.4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .overlay-image-content { display: flex; height: 11.4rem; justify-content: center; margin: auto; width: 14.2rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .overlay-text-content { align-items: center; display: flex; justify-content: center; padding-top: 2.4rem; text-align: center } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .overlay-text-content p { margin: .8rem auto } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .completed-by { font-family: GilroySemiBold; opacity: .6 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .items-group { margin: 0 2rem; padding-bottom: 4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .items-group .items-group-title { font-family: GilroyBold; padding-bottom: 1.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .todo-items { border: .1rem solid #dedede; border-left: 1rem solid #81b5a1; padding: 1.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .todo-items:last-child { margin-bottom: 0 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .todo-items .cta-component { margin-bottom: 0; margin-top: 1.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .todo-items a { width: 100% } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .condition-div { align-items: center; display: flex; justify-content: center } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .condition-div:last-child { display: none } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .condition-div span { font-family: GilroyBold; margin: .8rem 2.4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .condition-div hr { border: 0; border-bottom: .05rem solid #e1e1e1; border-top: .05rem solid #e1e1e1; display: inline-block; flex: 1 1 auto; height: 0; margin: 0 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items .completed-count { opacity: .7 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items .items-done { padding-bottom: 1.6rem; padding-left: 2.5rem; position: relative } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items .items-done:before { border: .8rem solid #81b5a1; border-radius: 1.2rem; content: " "; display: block; height: 0; left: 0; position: absolute; top: .6rem; width: 0 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items .items-done:after { border: solid #fff; border-width: 0 .2rem .2rem 0; content: " "; display: block; height: .8rem; left: .6rem; position: absolute; top: .9rem; transform: rotate(45deg); width: .45rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items .items-done:last-child { padding-bottom: 0 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items .items-done .items-done-text { opacity: .6 } .component-your-progress-inner-wrapper .your-progress .progress-level-item { margin-bottom: 3rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head { margin-bottom: 1.5rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-left { display: flex; flex-direction: column-reverse; margin-bottom: 2.8rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-icon-text, .component-your-progress-inner-wrapper .your-progress .progress-level-head-subtitle, .component-your-progress-inner-wrapper .your-progress .progress-level-head-title { align-items: center; display: flex } .component-your-progress-inner-wrapper .your-progress .progress-level-head-title-text { font-size: 1.8rem; margin-right: 1rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-subtitle-text, .component-your-progress-inner-wrapper .your-progress .progress-level-head-subtitle-value { font-family: GilroySemibold; font-size: 1.8rem; margin: 0 .4rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-icon { margin-right: 1.6rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-icon img { height: 6rem; width: 5rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-flag { border: .2rem solid #81b5a1; border-radius: 2rem; color: #81b5a1; font-family: GilroyBold; font-size: 1.2rem; margin-bottom: 1.2rem; padding: .6rem 2rem; text-transform: uppercase; width: -moz-fit-content; width: fit-content } .component-your-progress-inner-wrapper .your-progress .progress-level-head-right-share-cta .cta-component { margin: 0 } .component-your-progress-inner-wrapper .your-progress .progress-level-body-wrapper { display: flex; overflow-y: auto } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item { border: .2rem solid rgba(41,62,64,.2); cursor: pointer; min-height: 11.5rem; position: relative; width: 17.5rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item:not(:first-child) { border-left: 0 } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-wrapper { align-items: left; display: flex; flex-direction: column; min-width: 17rem; padding: 2.5rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-title { font-family: GilroySemibold; font-size: 1.3rem; text-align: left } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-image { padding-bottom: 1.2rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-overlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-your-progress-inner-wrapper .your-progress .progress-item-completed { background: #d9e8ed; font-size: 16px; list-style-type: none; position: relative } .component-your-progress-inner-wrapper .your-progress .progress-item-completed:before { border: 1rem solid #81b5a1; border-radius: 100%; content: " "; display: block; height: 0; position: absolute; right: 1.5rem; top: 1rem; width: 0 } .component-your-progress-inner-wrapper .your-progress .progress-item-completed:after { border: solid #fff; border-width: 0 .2rem .2rem 0; content: " "; display: block; height: 1rem; position: absolute; right: 2.2rem; top: 1.4rem; transform: rotate(45deg); width: .5rem } @media only screen and (min-width: 768px) { .component-your-progress-inner-wrapper .title h2 { font-size: 2.8rem } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper li { padding: 2rem 3rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay { display: flex; justify-content: center } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-outer-background { background: #293e40; height: 100%; opacity: .7; width: 100% } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-wrapper { bottom: 0; height: inherit; margin: 7.2rem 0; overflow: visible; position: absolute; top: 0 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon { right: -2.4rem; top: -2.4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:after, .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-close-icon:before { background-color: #fff } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper { height: 100%; overflow-y: auto } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper h2 { font-size: 2.8rem; padding-bottom: 4.7rem; padding-left: 4rem; padding-top: 4.7rem; text-align: inherit } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .items-group { margin: 0 4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content { flex-direction: row; justify-content: flex-start; padding-top: 4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .overlay-image-content { margin: 0 } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .overlay-text-content { padding-bottom: 0; padding-top: 0; text-align: left } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content .overlay-text-content p { margin-bottom: 1.6rem; margin-top: .8rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .items-group-title { padding-bottom: 1.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .todo-items { padding: 2.4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .pending-items .todo-items .cta-component { margin-top: .8rem; width: auto } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items { padding-bottom: 4.8rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head { align-items: center; display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 2.8rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-left { align-items: flex-end; flex-direction: row; margin-bottom: 0 } .component-your-progress-inner-wrapper .your-progress .progress-level-head-flag { height: -moz-fit-content; height: fit-content; margin-bottom: 0; margin-left: 1.6rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item { width: 25% } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-image img { height: 9.1rem; width: 11.3rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-wrapper { padding: 2.5rem 5rem 2.5rem 2.5rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-title-infodot-content { transform: translateX(-50%); width: 30rem } .component-your-progress-inner-wrapper .your-progress.default-padding, .component-your-progress-inner-wrapper .your-progress.padding-40, .component-your-progress-inner-wrapper .your-progress.padding-80 { padding-bottom: 4rem; padding-top: 4rem } .component-your-progress-inner-wrapper .your-progress .horizontal-tabs-wrapper li { margin-right: 2.4rem; padding: 2.4rem 0 1.6rem } .component-your-progress-inner-wrapper .your-progress .content { padding-top: 2.4rem } } @media only screen and (min-width: 1024px) { .component-your-progress-inner-wrapper.default-padding { padding-bottom: 6.4rem; padding-top: 6.4rem } .component-your-progress-inner-wrapper.padding-40 { padding-bottom: 4rem; padding-top: 4rem } .component-your-progress-inner-wrapper.padding-80 { padding-bottom: 8rem; padding-top: 8rem } .component-your-progress-inner-wrapper .horizontal-tabs-list.fade-right:after, .component-your-progress-inner-wrapper .horizontal-tabs-list.fade-right:before { display: none } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper li { padding: 2.4rem 3rem } .component-your-progress-inner-wrapper .content { padding-top: 3.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper h2 { padding-bottom: 5.9rem; padding-top: 5.9rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .items-group { padding-bottom: 4.8rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items { padding-bottom: 5.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content { padding-top: 4.6rem } .component-your-progress-inner-wrapper .your-progress .progress-item-completed:before { border: 1.2rem solid #81b5a1 } .component-your-progress-inner-wrapper .your-progress .progress-item-completed:after { right: 2.4rem; top: 1.6rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-title-text { font-size: 2.2rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-icon img { height: 6rem; width: 5rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-title { font-size: 1.6rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item { min-height: 15rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-flag { margin-left: 3.2rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-image { padding-bottom: .8rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-image img { height: 11.4rem; width: 14.2rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-title-infodot-icon { height: 2.4rem; width: 2.4rem } } @media only screen and (min-width: 1700px) { .component-your-progress-inner-wrapper.default-padding { padding-bottom: 8rem; padding-top: 8rem } .component-your-progress-inner-wrapper .horizontal-tabs-wrapper li .tab-name { font-size: 1.6rem } .component-your-progress-inner-wrapper .content { padding-top: 4.8rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-subtitle-text, .component-your-progress-inner-wrapper .your-progress .progress-level-head-subtitle-value { font-family: GilroyBold; font-size: 2.2rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head { margin-bottom: 3.2rem } .component-your-progress-inner-wrapper .your-progress .progress-item-completed:before { border: 1.5rem solid #81b5a1 } .component-your-progress-inner-wrapper .your-progress .progress-item-completed:after { height: 1.4rem; right: 2.6rem; width: .7rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item-title { font-size: 1.8rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper h2 { padding-bottom: 5.6rem; padding-left: 4rem; padding-top: 5.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .items-group { padding-bottom: 5.6rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .completed-items { padding-bottom: 6.4rem } .component-your-progress-inner-wrapper .your-progress .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-image-text-content { padding-top: 5.6rem } .component-your-progress-inner-wrapper .your-progress .progress-level-head-icon img { height: 10rem; width: 8.4rem } .component-your-progress-inner-wrapper .your-progress .progress-level-body-progress-item { min-height: 17.5rem } } .component-champions-common .right-rail-component { padding: 4.8rem 0 } .component-champions-common .right-rail-component .outer-wrapper { padding: 0 1rem } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper { padding: 2.4rem 0 } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .title { border-bottom: .1rem solid rgba(41,62,64,.1); display: flex } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .component-tabbed-component .tab-link.current .tab-name { font-family: GilroySemiBold } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .content { padding-top: 1.6rem } .component-champions-common .left-rail-component.hidden-elem { display: none } .component-champions-common .privacy-switch, .component-champions-common .share-switch { align-items: center; display: flex } .component-champions-common .privacy-switch .on-off, .component-champions-common .share-switch .on-off { font-family: GilroySemiBold; opacity: .6 } .component-champions-common .privacy-switch .public-private-switch, .component-champions-common .privacy-switch .switch, .component-champions-common .share-switch .public-private-switch, .component-champions-common .share-switch .switch { -webkit-appearance: none; background-color: rgba(41,62,64,.3); border-radius: 4.3rem; cursor: pointer; height: 2.6rem; margin-bottom: 0; margin-left: .8rem; margin-top: 0; outline: none; position: relative; width: 5rem } .component-champions-common .privacy-switch .public-private-switch:after, .component-champions-common .privacy-switch .switch:after, .component-champions-common .share-switch .public-private-switch:after, .component-champions-common .share-switch .switch:after { background-color: #fff; border-radius: 100%; content: ""; height: 2.2rem; left: .3rem; position: absolute; top: .3rem; transition: .3s; width: 2.2rem } .component-champions-common .privacy-switch .public-private-switch:checked, .component-champions-common .privacy-switch .switch:checked, .component-champions-common .share-switch .public-private-switch:checked, .component-champions-common .share-switch .switch:checked { background-color: #64ddac } .component-champions-common .privacy-switch .public-private-switch:checked:after, .component-champions-common .privacy-switch .switch:checked:after, .component-champions-common .share-switch .public-private-switch:checked:after, .component-champions-common .share-switch .switch:checked:after { transform: translateX(2.4rem) } .component-champions-common .privacy-switch .public-private-switch:focus, .component-champions-common .privacy-switch .switch:focus, .component-champions-common .share-switch .public-private-switch:focus, .component-champions-common .share-switch .switch:focus { outline-color: transparent } .component-champions-common .infodot-wrapper { align-items: center; display: flex; position: relative } .component-champions-common .infodot-wrapper.hidden { visibility: hidden } .component-champions-common .infodot-wrapper .infodot-icon { align-items: center; background: #dedede; border-radius: 100%; cursor: pointer; display: flex; font-family: GilroySemibold; font-size: 1.4rem; height: 2.4rem; justify-content: center; width: 2.4rem } .component-champions-common .infodot-wrapper .infodot-content { background: #f7f7f7; bottom: calc(100% + 2.5rem); box-shadow: .2rem .2rem .5rem #999,-.2rem .2rem .5rem #999; left: 4.75rem; position: absolute; transform: translateX(-50%); width: 30rem; z-index: 3 } .component-champions-common .infodot-wrapper .infodot-content.hide-infodot-content { display: none } .component-champions-common .infodot-wrapper .infodot-title { display: block; font-family: GilroyBold; font-size: 1.2rem; padding-bottom: .8rem } .component-champions-common .infodot-wrapper .infodot-desc { display: block; font-family: GilroySemibold; font-size: 1.4rem; padding-bottom: .8rem } .component-champions-common .infodot-wrapper .infodot-arrow-triangle { left: 35%; overflow: visible; position: relative } .component-champions-common .infodot-wrapper .infodot-arrow-triangle:after { background: #f7f7f7; box-shadow: .6rem -.5rem .4rem -.3rem rgba(0,0,0,.4); content: ""; height: 2.5rem; position: absolute; top: -1.4rem; transform: rotate(135deg); width: 2.5rem } .component-champions-common .infodot-wrapper .infodot-content-wrapper { padding: 2.4rem } .component-champions-common .infodot-wrapper .infodot-content-wrapper ul { margin: 0 } .component-champions-common .infodot-wrapper .infodot-content-wrapper ul li { font-family: GilroyRegular; font-size: 1.4rem; list-style: disc; padding-bottom: .8rem } .component-champions-common .infodot-wrapper .infodot-content-wrapper .infodot-close-icon { cursor: pointer; height: 1.6rem; position: absolute; right: 1.6rem; top: 1.6rem; width: 1.6rem } .component-champions-common .infodot-wrapper .infodot-content-wrapper .infodot-close-icon:hover { opacity: 1 } .component-champions-common .infodot-wrapper .infodot-close-icon:after, .component-champions-common .infodot-wrapper .infodot-close-icon:before { background-color: #333; content: " "; height: 1.6rem; left: 1rem; position: absolute; width: .2rem } .component-champions-common .infodot-wrapper .infodot-close-icon:before { transform: rotate(45deg) } .component-champions-common .infodot-wrapper .infodot-close-icon:after { transform: rotate(-45deg) } @media only screen and (min-width: 768px) { .component-champions-common .infodot-wrapper .infodot-content { left: 5.25rem; position: absolute; top: -12.5rem } .component-champions-common .infodot-wrapper .infodot-content .infodot-arrow-triangle { left: 33% } .component-champions-common .right-rail-component .outer-wrapper { padding: 0 1.6rem } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper { padding: 3.2rem 0 } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .content { padding-top: 1.6rem } } @media only screen and (min-width: 1024px) { .component-champions-common .infodot-wrapper .infodot-content { bottom: 5rem !important; display: table; top: unset !important } .component-champions-common .infodot-wrapper .infodot-content .infodot-content-wrapper { height: 100% !important } .component-champions-common .right-rail-component { padding: 5.6rem 0 } .component-champions-common .right-rail-component .outer-wrapper { padding: 0 2rem } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper { padding: 4rem 0 } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .content { padding-top: 2.4rem } } @media only screen and (min-width: 1700px) { .component-champions-common .left-rail-component { float: left; max-width: 66.6%; width: 100% } .component-champions-common .right-rail-component { clear: right; float: right; max-width: 33.3%; padding: 0 0 2.4rem; position: relative; top: -8.8rem } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper { padding: 0 0 4rem } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .title { border-bottom: 0 } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .title-element { padding-bottom: 0 } .component-champions-common .right-rail-component .outer-wrapper .inner-wrapper .content { padding-top: 3.2rem } } .component-account-linking { position: relative; width: 100% } .component-account-linking .comp-full-bleed-bg-color { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-account-linking .title { border-bottom: 0 !important } .component-account-linking .title .infodot-wrapper { padding-left: 12px } .component-account-linking .content .account-linking-overlay { align-items: center; bottom: 0; display: flex; justify-content: center; left: 0; overflow: auto; position: fixed; right: 0; top: 0; z-index: 999 } .component-account-linking .content .account-linking-overlay .cancel-arrow-cta, .component-account-linking .content .account-linking-overlay .ok-box-cta, .component-account-linking .content .account-linking-overlay .unlink-box-cta, .component-account-linking .content .account-linking-overlay.disable { display: none } .component-account-linking .content .account-linking-overlay.unlink .cancel-arrow-cta, .component-account-linking .content .account-linking-overlay.unlink .unlink-box-cta { display: inherit } .component-account-linking .content .account-linking-overlay.unlink .cancel-arrow-cta { align-items: center; display: flex; margin-left: 3rem } .component-account-linking .content .account-linking-overlay.error-message .account-address-text, .component-account-linking .content .account-linking-overlay.error-message .overlay-description-2, .component-account-linking .content .account-linking-overlay.success-message .account-address-text, .component-account-linking .content .account-linking-overlay.success-message .overlay-description-2, .component-account-linking .content .account-linking-overlay.unlink .cancel-arrow-cta .cta-title-link-arrow { display: none } .component-account-linking .content .account-linking-overlay.ok-close .cta-section { justify-content: center } .component-account-linking .content .account-linking-overlay.ok-close .overlay-circle-icon { border: .1rem solid #c8c8c8; border-radius: 100%; height: 5rem; margin-left: auto; margin-right: auto; margin-top: 3.2rem; position: relative; width: 5rem } .component-account-linking .content .account-linking-overlay.ok-close .overlay-circle-icon.check:after { border: solid #81b5a1; border-width: 0 .5rem .5rem 0; content: " "; display: block; height: 2rem; position: absolute; right: 1.8rem; top: 1.2rem; transform: rotate(45deg); width: 1.1rem } .component-account-linking .content .account-linking-overlay.ok-close .ok-box-cta { display: inherit } .component-account-linking .content .account-linking-overlay.ok-close .ok-box-cta .cta-component { margin-right: 0 !important } .component-account-linking .content .account-linking-overlay .overlay-outer-background { background: #293e40; height: 100%; opacity: .7; width: 100% } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper { background: #fff; overflow: visible; padding: 0; position: absolute } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-header { align-items: center; display: flex; justify-content: center; margin-top: 2.4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-header h4 { font-size: 2rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-body { display: flex; flex-direction: column; justify-content: center; padding: 1.6rem; padding-bottom: 3.2rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section { display: flex; justify-content: center } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .cta-component { margin: 0 } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .ok-box-cta, .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .ok-box-cta .cta-component, .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .ok-box-cta .cta-component a { width: 100% } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .ok-box-cta a { text-align: center } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .text-section { padding-bottom: 3.2rem; text-align: center } .component-account-linking .content .account-linking-overlay .overlay-content-close-button { cursor: pointer; height: 1.2rem; position: absolute; right: 0; top: -2.8rem; width: 1.2rem } .component-account-linking .content .account-linking-overlay .overlay-content-close-button:hover { opacity: 1 } .component-account-linking .content .account-linking-overlay .overlay-content-close-button:after, .component-account-linking .content .account-linking-overlay .overlay-content-close-button:before { background-color: #fff; content: " "; height: 1.6rem; left: 1rem; position: absolute; width: .2rem } .component-account-linking .content .account-linking-overlay .overlay-content-close-button:before { transform: rotate(45deg) } .component-account-linking .content .account-linking-overlay .overlay-content-close-button:after { transform: rotate(-45deg) } .component-account-linking .content .empty-list-message { margin-bottom: 2.4rem } .component-account-linking .content .empty-list-message .empty-text p { display: inline; margin: 0 } .component-account-linking .content .empty-list-message .empty-text p a { font-family: gilroySemiBold } .component-account-linking .content .account-list-template-hidden { display: none } .component-account-linking .content .account-list-wrapper .account-list-item { border: .1rem solid #d7d7d7; display: flex; flex-direction: column; margin-bottom: .8rem; padding: 1.8rem } .component-account-linking .content .account-list-wrapper .account-list-item:last-child { margin-bottom: 0 } .component-account-linking .content .account-list-wrapper .account-list-item.verified { padding: .8rem 1.6rem } .component-account-linking .content .account-list-wrapper .account-list-item.verified .account-address { padding-bottom: 0 } .component-account-linking .content .account-list-wrapper .account-address { font-size: 1.6rem; padding-bottom: .8rem; position: relative } .component-account-linking .content .account-list-wrapper .account-address-text { display: inline-block; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 90% } .component-account-linking .content .account-list-wrapper .verify-link { color: #adadad } .component-account-linking .content .account-list-wrapper .verify-text { padding-bottom: 1.6rem } .component-account-linking .content .account-list-wrapper .links { display: flex; flex-direction: column; line-height: 1.3 } .component-account-linking .content .account-list-wrapper .verified .verify-link.hidden { display: none } .component-account-linking .content .account-list-wrapper .verified .verified-chevron { cursor: pointer; position: absolute; right: 1.6rem } .component-account-linking .content .account-list-wrapper .verified .verified-chevron:before { border-style: solid; border-width: .15rem .15rem 0 0; content: ""; display: inline-block; height: 1rem; left: 1rem; position: relative; right: 0; top: .4rem; transform: rotate(135deg); transition: all .4s; vertical-align: top; width: 1rem } .component-account-linking .content .account-list-wrapper .verified .verified-chevron.rotate:before { top: 1rem; transform: rotate(-45deg); transition: all .4s } .component-account-linking .content .account-list-wrapper .verified .links { line-height: inherit } .component-account-linking .content .account-list-wrapper .cancel-btn, .component-account-linking .content .account-list-wrapper .resend-btn, .component-account-linking .content .account-list-wrapper .unlink-btn { font-family: gilroySemibold; text-decoration: underline } .component-account-linking .content .account-list-wrapper .resend-btn { padding-bottom: 1.6rem } .component-account-linking .content .account-list-wrapper .resend-btn.disabled { opacity: .4; pointer-events: none } .component-account-linking .content .account-list-wrapper .unlink-btn { padding: .8rem 0 } .component-account-linking .content .add-new-account { padding-top: 2.4rem } .component-account-linking .content .add-new-account .account-input-div { border: .2rem solid #c8c8c8; height: 5.4rem; margin-bottom: 1.6rem; position: relative; width: 100% } .component-account-linking .content .add-new-account .account-input-div.invalid { border-color: #c00; margin-bottom: 3.6rem } .component-account-linking .content .add-new-account .account-input-div.invalid .floating-label, .component-account-linking .content .add-new-account .account-input-div.invalid .invalid-email-message { color: #c00 } .component-account-linking .content .add-new-account .account-input-div.disabled { opacity: .4; pointer-events: none } .component-account-linking .content .add-new-account .account-input-box { border: none; font-size: 1.6rem; height: 4.8rem; margin-bottom: .6rem; outline: none; padding: 1.6rem 0 0 1.6rem !important; width: 100% } .component-account-linking .content .add-new-account .account-input-box:focus ~ .floating-label, .component-account-linking .content .add-new-account .account-input-box:not(:focus):valid ~ .floating-label { bottom: 1rem; font-size: 1.2rem; left: 1.6rem; opacity: 1; top: .8rem } .component-account-linking .content .add-new-account .floating-label { font-size: 1.2rem; left: 1.6rem; pointer-events: none; position: absolute; top: 1.6rem; transition: all .2s ease } .component-account-linking .content .add-new-account .invalid-email-message.hidden { display: none } .component-account-linking .content .add-new-account .add-account-btn .cta-component { margin: 0 } .component-account-linking .content .add-new-account .add-account-btn .cta-component.disabled { opacity: .4; pointer-events: none } @media only screen and (min-width: 768px) { .component-account-linking .content { padding-top: .8rem !important } .component-account-linking .content .account-linking-overlay .overlay-content-close-button { right: -1rem; top: -3rem } .component-account-linking .content .account-linking-overlay .overlay-content-close-button:after, .component-account-linking .content .account-linking-overlay .overlay-content-close-button:before { height: 2.1rem } .component-account-linking .content .account-linking-overlay.unlink .overlay-content-wrapper .overlay-circle-icon { display: none } .component-account-linking .content .account-linking-overlay.unlink .overlay-content-wrapper .overlay-header { margin-top: 4.8rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-header { margin-bottom: 1.6rem; margin-top: 2.4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-circle-icon { height: 6rem; width: 6rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-circle-icon.check:after { right: 2.3rem; top: 1.8rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .text-section { padding-bottom: 4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section { align-items: center; display: flex } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .cta-component { margin-right: 4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .ok-box-cta { width: inherit } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-header-content { padding-left: 6%; padding-right: 6% } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-body { padding: 0 12% 4.8rem } .component-account-linking .content .account-list-wrapper .account-list-item { padding: 1.6rem 2.4rem !important } .component-account-linking .content .account-list-wrapper .account-address { display: flex } .component-account-linking .content .account-list-wrapper .account-address .account-address-text { padding-right: .8rem; width: inherit } .component-account-linking .content .account-list-wrapper .links { flex-direction: row } .component-account-linking .content .account-list-wrapper .verify-text { padding-bottom: .8rem } .component-account-linking .content .account-list-wrapper .resend-btn { padding-bottom: 0; padding-right: 2.4rem } .component-account-linking .content .account-list-wrapper .unlink-btn { padding-top: 1.6rem } .component-account-linking .content .add-new-account { align-items: center; align-items: flex-start; display: flex; padding-top: 3.2rem } .component-account-linking .content .add-new-account .account-input-div { margin-bottom: 0; margin-right: 1.6rem; width: 50% } .component-account-linking .content .add-new-account .cta-component a { align-items: center; display: flex; height: 5.4rem } } @media only screen and (min-width: 1024px) { .component-account-linking .content .account-linking-overlay .overlay-content-close-button { right: -2.4rem; top: -4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-circle-icon { height: 8rem; width: 8rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-circle-icon.check:after { right: 3.2rem; top: 2.6rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-header { margin-bottom: 2.4rem; margin-top: 4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-body { padding-bottom: 6.4rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .cta-section .cta-component { margin-right: 3rem } .component-account-linking .content .empty-list-message { font-family: gilroySemiBold } .component-account-linking .content .empty-list-message .empty-text { font-size: 1.8rem } .component-account-linking .content .account-list-wrapper .account-list-item { border-bottom: .1rem solid #d7d7d7; margin-bottom: .8rem; width: 55% } .component-account-linking .content .account-list-wrapper .account-list-item:first-child { border-bottom: .1rem solid #d7d7d7 } .component-account-linking .content .add-new-account { width: 55% } .component-account-linking .content .add-new-account .account-input-div { width: 100% } } @media only screen and (min-width: 1700px) { .component-account-linking .title h1 { font-size: 3.2rem } .component-account-linking .content .account-linking-overlay.ok-close .overlay-circle-icon { height: 8rem; margin-top: 8rem; width: 8rem } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-header { margin-bottom: 3.2rem; margin-top: 5.6rem !important } .component-account-linking .content .account-linking-overlay .overlay-content-wrapper .overlay-body { padding-bottom: 6.4rem; padding-left: 7.2rem; padding-right: 7.2rem } .component-account-linking .content .account-list-wrapper { display: inherit } .component-account-linking .content .account-list-wrapper .account-list-item { border-left: 0; border-right: 0; border-top: .1rem solid #dedede; margin-bottom: 0; padding: 1.6rem 0 !important; width: inherit } .component-account-linking .content .account-list-wrapper .account-list-item:first-child { border-bottom: 0 } .component-account-linking .content .account-list-wrapper .account-list-item:last-child { border-bottom: .1rem solid #dedede } .accordion.section ul.list-unstyled .component-account-linking .content .account-list-wrapper .account-list-item li, .component-account-linking .content .account-list-wrapper .account-list-item .accordion.section ul.list-unstyled li, .component-account-linking .content .account-list-wrapper .account-list-item .medium-body-copy { font-size: 1.6rem } .component-account-linking .content .add-new-account { display: block; padding-top: 4rem; width: inherit } .component-account-linking .content .add-new-account .account-input-div { margin-bottom: 2.4rem; width: 100% } } .component-share-resume { position: relative; width: 100% } .component-share-resume .comp-full-bleed-bg-color { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-share-resume .outer-wrapper .inner-wrapper .infodot-wrapper.hidden { visibility: none } .component-share-resume .outer-wrapper .inner-wrapper .title { padding-bottom: 1.6rem } .component-share-resume .outer-wrapper .inner-wrapper .content { padding: 0 !important } .component-share-resume .outer-wrapper .inner-wrapper .content .content-head { align-items: center; display: flex; justify-content: space-between; padding-bottom: 2.4rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body p { font-family: GilroySemibold; margin: 0 } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .account-url { font-size: 1.3rem !important; opacity: .7; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-section { padding-top: 2.4rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-component { margin-bottom: 0; margin-top: 0 } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-component.cta-text-arrow { padding-top: 1.6rem } @media only screen and (min-width: 768px) { .component-share-resume .outer-wrapper .inner-wrapper .flex-div { border-bottom: .1rem solid rgba(41,62,64,.1); display: flex; justify-content: space-between; padding-bottom: 1.6rem } .component-share-resume .outer-wrapper .inner-wrapper .title-element { padding-bottom: 0 !important } .component-share-resume .outer-wrapper .inner-wrapper .subtitle { padding-top: 0 } .component-share-resume .outer-wrapper .inner-wrapper .content-subtitle { padding-right: 1.6rem } .component-share-resume .outer-wrapper .inner-wrapper .content-subtitle .private-public { font-family: GilroyBold; font-size: 1.8rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .account-url { font-size: 1.6rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-section { display: flex } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-section .cta-component { margin-right: 2.4rem; padding: 0 } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-section .open-profile { align-items: center; display: flex } } @media only screen and (min-width: 1024px) { .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-section { padding-top: 3.2rem } } @media only screen and (min-width: 1700px) { .component-share-resume { float: right; max-width: 25% } .component-share-resume .outer-wrapper .inner-wrapper .content .content-head { position: inherit; right: 3.2rem; top: 3.2rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-head .private-public { font-size: 2rem; margin-right: 1.6rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-section { flex-direction: column; padding-top: 1.6rem } .component-share-resume .outer-wrapper .inner-wrapper .content .content-body .cta-component.cta-text-arrow { padding-top: 1.6rem } } .component-achievements-view { padding-bottom: 4.8rem } .component-achievements-view .component-achievements-hidden-elements { display: none } .component-achievements-view .achievements-section { padding-top: 4.8rem } .component-achievements-view .achievements-section#section-community .achievements-subtitle, .component-achievements-view .achievements-section#section-nowLearning .achievements-subtitle, .component-achievements-view .achievements-section.hide { display: none } .component-achievements-view .achievements-section .achievements-section-title { padding-bottom: 2.4rem } .component-achievements-view .achievements-section .achievements-tile-container { display: flex; flex-wrap: wrap } .component-achievements-view .achievements-section .achievements-tile { align-items: center; border: .1rem solid #f0f0f0; display: none; flex-direction: column; justify-content: center; opacity: 0; padding: 3.2rem .8rem 2.4rem } .component-achievements-view .achievements-section .achievements-tile:nth-child(-n+6) { display: flex; opacity: 1 } .component-achievements-view .achievements-section .achievements-tile .achievements-icon { height: 6.2rem; margin-bottom: 1.6rem; width: 4.5rem } .component-achievements-view .achievements-section .achievements-tile .achievements-icon img { height: auto; width: 100% } .component-achievements-view .achievements-section .achievements-tile .achievements-icon img[src=""], .component-achievements-view .achievements-section .achievements-tile .achievements-icon img[src=undefined] { display: none } .component-achievements-view .achievements-section .achievements-tile .achievements-icon:hover { cursor: pointer } .component-achievements-view .achievements-section .achievements-tile .tooltip { background-color: #293e40; border-radius: .5rem; bottom: 95%; display: none; justify-content: center; position: absolute; right: 0; width: calc(100vw - 4rem); z-index: 1 } .component-achievements-view .achievements-section .achievements-tile .tooltip:after { border-color: #293e40 transparent transparent } .component-achievements-view .achievements-section .achievements-tile .tooltip .tooltip-body { background-color: #293e40; border-radius: .75rem; color: #fff !important; display: inline-block; font-size: 1.4rem; padding: 2rem 2rem 2.4rem; width: 100%; z-index: 1 } .component-achievements-view .achievements-section .achievements-tile .tooltip .tooltip-body .tooltip-title { font-family: GilroySemiBold; padding-bottom: 1.5rem } .component-achievements-view .achievements-section .achievements-tile .tooltip .tooltip-body .tooltip-description { font-family: GilroyRegular; line-height: 1.4 } .component-achievements-view .achievements-section .achievements-tile .tooltip .tooltip-arrow { align-self: center; background-color: #293e40; bottom: -.5rem; height: 2.5rem; position: absolute; right: 20.5%; transform: rotate(45deg); width: 2.5rem } .component-achievements-view .achievements-section .achievements-tile .tooltip img { padding: 0 1.5rem; position: absolute; right: 0; top: 1.5rem; z-index: 10000 } .component-achievements-view .achievements-section .achievements-tile .tooltip img:hover { cursor: pointer; opacity: .8 } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(odd) .tooltip { left: 0 } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(odd) .tooltip .tooltip-arrow { left: 20.5% } .component-achievements-view .achievements-section .achievements-tile .achievements-title { font-family: GilroySemiBold; font-size: 1.6rem; text-align: center } .component-achievements-view .achievements-section .view-all-cta { align-items: center; display: flex; justify-content: center; padding-top: 2.4rem; width: 100% } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box { margin-right: 0; width: 100% } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box a { text-align: center; width: 100% } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box a:hover { background-color: #293e40 } .component-achievements-view .achievements-section .view-all-cta hr { display: none } .component-achievements-view .show-all .achievements-tile { display: flex; opacity: 1; transition: opacity 1s ease-out } @media only screen and (min-width: 768px) { .component-achievements-view { padding-bottom: 5.6rem } .component-achievements-view .achievements-section { padding-top: 5.6rem } .component-achievements-view .achievements-section .achievements-section-title { padding-bottom: 3.2rem } .component-achievements-view .achievements-section .achievements-tile .achievements-icon { height: 6.9rem; width: 5rem } .component-achievements-view .achievements-section .achievements-tile .tooltip { width: 110% } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(odd) .tooltip, .component-achievements-view .achievements-section .achievements-tile:nth-of-type(odd) .tooltip .tooltip-arrow { left: unset } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+3) .tooltip .tooltip-arrow { left: 51% } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+1) .tooltip { left: 0 } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+1) .tooltip .tooltip-arrow { left: 42% } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+2) .tooltip { left: -1.5rem } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+2) .tooltip .tooltip-arrow { left: 46% } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box { margin-left: 2.4rem; margin-right: 2.4rem; width: auto } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box a { flex: 0 0 11rem; width: auto } .component-achievements-view .achievements-section .view-all-cta hr { border: 0; border-bottom: .05rem solid #e1e1e1; border-top: .05rem solid #e1e1e1; display: inline-block; flex: 1 1 auto; height: 0; margin: 0 } } @media only screen and (min-width: 1024px) { .component-achievements-view { padding-bottom: 6.4rem } .component-achievements-view .achievements-section { padding-top: 6.4rem } .component-achievements-view .achievements-section .achievements-section-title { padding-bottom: 4rem } .component-achievements-view .achievements-section .achievements-tile .achievements-icon { height: 7.6rem; width: 5.5rem } .component-achievements-view .achievements-section .achievements-tile .tooltip { left: unset; right: unset; width: 100% } .component-achievements-view .achievements-section .achievements-tile .tooltip .tooltip-arrow { right: unset } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(odd) .tooltip .tooltip-arrow { left: unset } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+2) .tooltip { left: 0 } .component-achievements-view .achievements-section .view-all-cta { padding-top: 3.2rem } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box a { flex: 0 0 13rem } } @media only screen and (min-width: 1700px) { .component-achievements-view .achievements-section .achievements-tile { padding: 4.8rem 1.6rem 2.4rem } .component-achievements-view .achievements-section .achievements-tile .achievements-icon { height: 10rem; width: 5.8rem } .component-achievements-view .achievements-section .achievements-tile .tooltip { width: 110% } .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+1) .tooltip, .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+2) .tooltip, .component-achievements-view .achievements-section .achievements-tile:nth-of-type(3n+3) .tooltip, .component-achievements-view .achievements-section .achievements-tile:nth-of-type(odd) .tooltip { left: unset; right: unset } .component-achievements-view .achievements-section .view-all-cta { padding-top: 2.4rem } .component-achievements-view .achievements-section .view-all-cta .cta-component.cta-rectangle-box a { flex: 0 0 15rem } } .championAchievements { width: 100% } .champions-ajax-loader { background: transparent; bottom: 0; display: block; height: 100vh; left: 0; position: fixed; right: 0; top: 0; width: 100vw; z-index: 9999 } .edit-achievements-component .tab-link { padding: 2rem !important } @media only screen and (min-width: 768px) { .edit-achievements-component .tab-link { padding: 2rem 3rem !important } } .component-edit-achievements { width: 100% } .component-edit-achievements .edit-achievements-wrapper .persona-table { margin-top: 3rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row { align-items: baseline; display: flex; flex-direction: column } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .persona-title { font-family: GilroySemiBold; font-size: 2.2rem; padding-bottom: .8rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .achieved-by { display: none } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles { font-size: 1.3rem; padding-bottom: 1.5rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles .switch.public { margin-left: 1.2rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles label.set-public { margin-right: 1.6rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles input[type=radio] { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: #9b9b9b; border: 0; border-radius: 5rem; display: inline-block; height: 1.2rem; margin-right: .5rem; outline: none; position: relative; top: .5rem; width: 1.2rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles input[type=radio].switch.public { background-color: #81b5a1 } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles label { cursor: pointer; font-family: GilroySemiBold; text-decoration: underline } .component-edit-achievements .edit-achievements-wrapper .persona-table:not(:first-of-type) .privacy-toggles { display: none } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile { border-left: .1rem solid #c8c8c8; border-right: .1rem solid #c8c8c8; border-top: .1rem solid #c8c8c8; padding-bottom: 3.2rem; padding-top: 2.4rem; width: 100% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile:last-of-type { border-bottom: .1rem solid #c8c8c8; margin-bottom: 3rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-icon { display: inline-block; height: auto; vertical-align: top; width: 3.3rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-icon img { height: 3.5rem; width: 3.5rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-icon img[src=""], .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-icon img[src=undefined] { display: none } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data { display: inline-block } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data .achievement-label { font-family: GilroyBold; font-size: 1.4rem; padding-bottom: 1.2rem; padding-top: 1rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data .date { font-size: 1.3rem; padding-bottom: 2.6rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data .achievement-subtitle { font-family: gilroySemibold } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .privacy-toggle .privacy-switch .public-private-switch { height: 2.8rem; width: 5.8rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .privacy-toggle .privacy-switch .public-private-switch:after { height: 2.2rem; width: 2.2rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .privacy-toggle .privacy-switch .public-private-switch:checked:after { transform: translateX(3rem) } @media only screen and (min-width: 768px) { .component-edit-achievements .edit-achievements-wrapper .persona-table { margin-top: 4rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row { flex-direction: row; padding-bottom: 2.1rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .persona-title { padding-bottom: 0; width: 33.5% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .achieved-by { display: inline-block; font-size: 1.3rem; width: 33.5% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .privacy-toggles { padding-bottom: 0 } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile { align-items: center; display: flex; height: 8rem; padding-bottom: 2.4rem; padding-left: 2rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile:last-of-type { margin-bottom: 5.4rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-icon { width: 8.67% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-icon img { height: 6.1rem; width: 6.1rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data { align-items: center; display: flex; padding: 0; width: 58% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data .achievement-label { padding: 0 1rem 0 0; width: 40% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data .date { padding: 0; width: 25% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .privacy-toggles { width: 33.33% } } @media only screen and (min-width: 1024px) { .component-edit-achievements .edit-achievements-wrapper .persona-table { margin-top: 4.8rem } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .persona-title { width: 33% 8 } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .achieved-by { width: 33.4% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-tile .achievement-data .achievement-label { padding-right: 1.5rem } } @media only screen and (min-width: 1700px) { .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .persona-title { width: 33.3% } .component-edit-achievements .edit-achievements-wrapper .persona-table .persona-heading-row .achieved-by { width: 33.5% } } .component-champions-breadcrumb .breadcrumb-wrapper a.breadcrumb-link .back-arrow-icon { display: inline-block; transform: rotate(180deg) } .component-champions-breadcrumb .breadcrumb-wrapper a.breadcrumb-link .breadcrumb-link-text { display: inline-block; font-family: GilroySemiBold; padding-left: 1rem } .component-champions-breadcrumb .breadcrumb-wrapper a.breadcrumb-link:hover { opacity: .6 } .component-progressive-profile { display: none; height: 100%; width: 100% } .component-progressive-profile .progress-profile-film { background-color: #293e40; bottom: 0; height: 100%; left: 0; opacity: .8; position: absolute; right: 0; top: 0; width: 100%; z-index: 100000 } .component-progressive-profile .pp-container { background: #fff; height: auto; left: 50%; margin: auto; padding: 5rem 3rem; position: absolute; top: 8rem; transform: translate(-50%); z-index: 100001 } .component-progressive-profile .pp-container .pp-close-btn { cursor: pointer; display: inline-block !important; position: absolute; right: -3rem; top: -3rem } .component-progressive-profile .pp-container .pp-close-btn::hover, .component-progressive-profile .pp-container .pp-close-btn:hover { opacity: .7 } .component-progressive-profile .pp-container .pp-close-btn svg g { stroke: #fff } @media(max-width: 767px) { .component-progressive-profile .pp-container .pp-close-btn { right: 3rem } } .component-progressive-profile .pp-container .pp-header-sec h2.headline { color: #293e40; font-family: GilroyBold; font-size: 2.4rem; line-height: normal; margin: 0 0 1.6rem } .component-progressive-profile .pp-container .pp-header-sec div.subhead { color: #293e40; font-family: GilroyRegular; font-size: 1.6rem; margin: 1.6rem 0 2.4rem } .component-progressive-profile .pp-container form#progressive-profile-form label { background: #f6f6f6; display: block; height: 4.4rem; margin-bottom: .8rem; position: relative; width: 100% } .component-progressive-profile .pp-container form#progressive-profile-form label .placeholder { color: #9f9f9f; cursor: text; font-family: GilroySemiBold; font-size: 1.4rem; left: 0; letter-spacing: 0; line-height: 2.72rem; padding-left: 0; position: absolute; right: 0; text-align: left; text-decoration: none; text-indent: 2rem; text-transform: none; top: 10px; transition: top .3s,font-size .3s; z-index: 1 } .component-progressive-profile .pp-container form#progressive-profile-form label .placeholder.focus { color: #9f9f9f; font-size: 1.2rem; top: 0; z-index: 3 } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap { position: relative; z-index: 2 } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap input { background-color: transparent; border: 0; color: #293e40; font-family: GilroySemiBold; font-size: 1.4rem; height: 4.4rem; letter-spacing: 0; line-height: 2.72rem; margin-bottom: .8rem; text-align: left; text-decoration: none; text-indent: 2rem; text-transform: none; width: 100% } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap input.focus { padding-top: 2rem } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap select { -moz-appearance: none; -webkit-appearance: none; background-color: transparent; background-image: url(https://www.servicenow.com/content/dam/servicenow/images/demo-asset/icon/arrow-down.png); background-position: 97%; background-repeat: no-repeat; border: 0; color: #9f9f9f !important; font-family: GilroySemiBold; font-size: 1.4rem; font-weight: 300; height: 4.4rem; letter-spacing: 0; line-height: 2.72rem; margin-bottom: .8rem; padding-bottom: 0; padding-left: 2rem; padding-top: 0; text-align: left; text-decoration: none; text-indent: 2rem; text-indent: .1rem; text-transform: none; width: 100% } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap select.focus { padding-top: 0 !important } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap option { color: #9f9f9f } .component-progressive-profile .pp-container form#progressive-profile-form label .input-wrap li div div p label { display: none } .component-progressive-profile .pp-container form#progressive-profile-form .terms-container { margin-top: 1.6rem; position: relative } .component-progressive-profile .pp-container form#progressive-profile-form .terms-container span:first-of-type { display: block; padding-left: 3rem } .component-progressive-profile .pp-container form#progressive-profile-form .terms-container span:first-of-type p { display: inline } .component-progressive-profile .pp-container form#progressive-profile-form .terms-container div.terms-checkbox { background: #e2e2e2; border-radius: 20%; display: block; height: 1.8rem; position: absolute; top: 0; width: 1.8rem; z-index: 5 } .component-progressive-profile .pp-container form#progressive-profile-form .terms-container div.terms-checkbox.onCliked:before { background: #9b9b9b; border-radius: 20%; content: ""; display: block; height: 1rem; left: .4rem; position: absolute; top: .4rem; width: 1rem; z-index: 5 } .component-progressive-profile .pp-container form#progressive-profile-form .is-required { color: #b33233; display: none; font-family: GilroySemiBold; font-size: 1rem; letter-spacing: 0; margin-bottom: 1.6rem; text-align: left; text-decoration: none; text-transform: none } .component-progressive-profile .pp-container form#progressive-profile-form .is-required.on { display: block } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container { display: none; margin-top: 1.4rem; position: relative } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .optin-label { background: 0; color: #293e40; height: auto } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec { padding-top: 1rem } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group { display: inline-block; position: relative } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group::first-child, .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group:first-child { margin-right: 3rem } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group input { left: 0; position: absolute; top: 0 } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group .fake-radio-btn { background: #e2e2e2; border-radius: 50%; color: #293e40 !important; display: block; font-size: 1.4rem; height: 1.8rem; padding-top: 0; position: absolute; top: 0; width: 1.8rem } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group .fake-radio-btn:before { border-radius: 50%; content: ""; display: block; height: 1rem; left: .4rem; position: absolute; top: .4rem; width: 1rem } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group span { font-size: 1.4rem; padding-left: 3rem } .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group #optin-no-pp:checked ~ #optin-no-fake:before, .component-progressive-profile .pp-container form#progressive-profile-form .gdpr-container .radio-btn-selection-sec .radio-label-group #optin-yes-pp:checked ~ #optin-yes-fake:before { background: #9b9b9b } .component-progressive-profile .pp-container form#progressive-profile-form .pp-update-btn { margin-bottom: 0; margin-top: 1.6rem } .component-progressive-profile .pp-container form#progressive-profile-form p.field-p.custom-dropdown { margin-bottom: 0; margin-top: 0 } .component-progressive-profile .pp-container form#progressive-profile-form .LV_validation_message.LV_invalid { display: none } .pp-spinner { bottom: 0; height: 100%; left: 0; position: fixed; right: 0; top: 0; visibility: hidden; width: 100%; z-index: -1 } .pp-spinner.active { visibility: visible; z-index: 11 } .pp-spinner .pp-spinner-film { background-color: #fff; height: 100%; opacity: .5; position: absolute; width: 100% } .pp-spinner .pp-spinner-roller { color: official; display: inline-block; height: 100px; left: 50%; margin-left: 15px; position: absolute; top: 40%; transform: translate(-50%); width: 100px } .pp-spinner .pp-spinner-roller div { animation: pp-spinner-roller 1.2s linear infinite; transform-origin: 42px 42px } .pp-spinner .pp-spinner-roller div:after { background: #293e40; border-radius: 20%; content: " "; display: block; height: 18px; left: 39px; position: absolute; top: 3px; width: 6px } .pp-spinner .pp-spinner-roller div:first-child { animation-delay: -1.1s; transform: rotate(0deg) } .pp-spinner .pp-spinner-roller div:nth-child(2) { animation-delay: -1s; transform: rotate(30deg) } .pp-spinner .pp-spinner-roller div:nth-child(3) { animation-delay: -.9s; transform: rotate(60deg) } .pp-spinner .pp-spinner-roller div:nth-child(4) { animation-delay: -.8s; transform: rotate(90deg) } .pp-spinner .pp-spinner-roller div:nth-child(5) { animation-delay: -.7s; transform: rotate(120deg) } .pp-spinner .pp-spinner-roller div:nth-child(6) { animation-delay: -.6s; transform: rotate(150deg) } .pp-spinner .pp-spinner-roller div:nth-child(7) { animation-delay: -.5s; transform: rotate(180deg) } .pp-spinner .pp-spinner-roller div:nth-child(8) { animation-delay: -.4s; transform: rotate(210deg) } .pp-spinner .pp-spinner-roller div:nth-child(9) { animation-delay: -.3s; transform: rotate(240deg) } .pp-spinner .pp-spinner-roller div:nth-child(10) { animation-delay: -.2s; transform: rotate(270deg) } .pp-spinner .pp-spinner-roller div:nth-child(11) { animation-delay: -.1s; transform: rotate(300deg) } .pp-spinner .pp-spinner-roller div:nth-child(12) { animation-delay: 0s; transform: rotate(330deg) } @keyframes pp-spinner-roller { 0% { opacity: 1 } to { opacity: 0 } } .eloquaForm .component-eloqua-form-base.ppAlternative .form-1 { padding-top: 0 !important } .eloquaForm .component-eloqua-form-base.ppAlternative .not-download-page { display: block } .eloquaForm .component-eloqua-form-base.ppAlternative .download-page, .eloquaForm .component-eloqua-form-base.ppAlternative .eloqua-sign-in, .eloquaForm .component-eloqua-form-base.ppAlternative .sing-in-account, .eloquaForm .component-eloqua-form-base.ppAlternative .sn-password, .eloquaForm .component-eloqua-form-base.ppAlternative .text-download-page, .eloquaForm .component-eloqua-form-base.ppAlternative li.sn-id-section { display: none !important } .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child form.formless { padding-top: 0 !important } .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-show-input:not(.UF-hide-init):not(.button-wrapper) { display: block !important } .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-show-input:not(.UF-hide-init):not(.button-wrapper).UF-checkbox { display: table !important } .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-submit-btn .button-wrapper.UF-show-input { display: block !important } .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-hide-input, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-send-verification-email, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-sign-in-account, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .UF-submit-btn .button-wrapper button.uf-submit-form-download, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .text-download-page, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .uf-eloqua-sign-in, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child .uf-sn-password, .universalForm .section-component-universal-form .inner-view.ppAlternative:first-child li.uf-sn-id-section:not(.UF-hide-init):not(.button-wrapper) { display: none !important } .overflow-scroll { overflow-x: unset } #meganav18 #tab-UF-myaccount-mobile:before, #tab-UF-myaccount a:not(.signed-in):before { content: url(https://a.icons8.com/ovjZlkZj/jxLS21/group-3.png) } #meganav18 #tab-UF-myaccount-mobile { cursor: pointer; font-size: 24px; opacity: .6; position: fixed; right: 75px; top: 30px; z-index: 1000 } #meganav18 #tab-UF-myaccount-mobile:before, #tab-UF-myaccount a:before { display: block; height: 2.4rem; width: 2.4rem } #meganav18 #tab-UF-myaccount-mobile:before, #tab-UF-myaccount a:not(.signed-in):before { content: url(https://www.servicenow.com/content/dam/servicenow-assets/public/en-us/images/company-library/icon/sign-out.svg) !important } #meganav18 #tab-UF-myaccount-mobile.logged:before, #tab-UF-myaccount a.signed-in:before, #tab-UF-myaccount.logged a:before { content: url(https://www.servicenow.com/content/dam/servicenow-assets/public/en-us/images/company-library/icon/sign-in.svg) !important } #meganav18 #tab-UF-myaccount-mobile:before, #tab-UF-myaccount a:before { content: url(https://a.icons8.com/ovjZlkZj/jxLS21/group-3.png) } .component-columns .section-component-universal-form .uf-assets-container.in-100-width .media-list-wrapper .full-bleed-asset { margin-left: 0; margin-right: 0 } .universalForm .left-side .component-small-marquee .description ul { padding-left: 4rem } #password-0 { clip: rect(1px,1px,1px,1px); height: 1px; overflow: hidden; width: 1px } .universalForm .section-component-universal-form .chromeAutofill { opacity: 0; position: absolute } .universalForm .section-component-universal-form .UF-account-linking-overlay { align-items: center; bottom: 0; display: flex; justify-content: center; left: 0; overflow: auto; position: fixed; right: 0; top: 0; z-index: 999 } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-ok-box-cta, .universalForm .section-component-universal-form .UF-account-linking-overlay .cancel-arrow-cta, .universalForm .section-component-universal-form .UF-account-linking-overlay .unlink-box-cta { display: none } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-outer-background { background: #293e40; height: 100%; opacity: .7; width: 100% } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper { background: #fff; overflow: visible; padding: 0; position: absolute } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-header { align-items: center; display: flex; justify-content: center; margin-top: 2.4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-header h4 { font-size: 2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-body { display: flex; flex-direction: column; justify-content: center; padding: 1.6rem 1.6rem 3.2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section { display: flex; justify-content: center } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .cta-component { margin: 0 } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .UF-ok-box-cta { width: inherit } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .UF-ok-box-cta .cta-component, .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .UF-ok-box-cta .cta-component a { width: 100% } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .UF-ok-box-cta a { text-align: center } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .text-section { padding-bottom: 3.2rem; text-align: center } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button { cursor: pointer; height: 1.2rem; position: absolute; right: 0; top: -2.8rem; width: 1.2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button:hover { opacity: 1 } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button:before { background-color: #fff; content: " "; height: 1.6rem; left: 1rem; position: absolute; transform: rotate(45deg); width: .2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button:after { background-color: #fff; content: " "; height: 1.6rem; left: 1rem; position: absolute; transform: rotate(-45deg); width: .2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .disable { display: none } .universalForm .section-component-universal-form .UF-account-linking-overlay .unlink .cancel-arrow-cta, .universalForm .section-component-universal-form .UF-account-linking-overlay .unlink .unlink-box-cta { display: inherit } .universalForm .section-component-universal-form .UF-account-linking-overlay .unlink .cancel-arrow-cta .cta-title-link-arrow { display: none } .universalForm .section-component-universal-form .UF-account-linking-overlay .cta-section { justify-content: center } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-circle-icon { border: .1rem solid #c8c8c8; border-radius: 100%; height: 5rem; margin-left: auto; margin-right: auto; margin-top: 3.2rem; position: relative; width: 5rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-circle-icon .x-icon { height: 1.2rem; position: absolute; right: 2.4rem; top: 1.1rem; width: 1.2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-circle-icon .x-icon:hover { opacity: 1 } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-circle-icon .x-icon:before { background-color: #81b5a1; content: " "; height: 2.6rem; left: 1rem; position: absolute; transform: rotate(45deg); width: .4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-circle-icon .x-icon:after { background-color: #81b5a1; content: " "; height: 2.6rem; left: 1rem; position: absolute; transform: rotate(-45deg); width: .4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-ok-box-cta { display: inherit } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-ok-box-cta .cta-component { margin-right: 0 !important } .universalForm .section-component-universal-form textarea { box-sizing: border-box } .universalForm .section-component-universal-form li { list-style: none } .universalForm .section-component-universal-form .botcapture { display: none } .universalForm .section-component-universal-form p.manage-profile-accounts-servicenow { margin-top: 2.4rem } .universalForm .section-component-universal-form .UF-gable-green { color: #293e40 } .universalForm .section-component-universal-form .right-bkg-color-dark { background-color: #f7f7f7 } .universalForm .section-component-universal-form .right-bkg-color-light { background-color: #fff } .universalForm .section-component-universal-form .cta-component.cta-text-arrow a .cta-title-link-arrow svg #polyline-3 { transform: translate(0) } .universalForm .section-component-universal-form .partials-view.right-bkg-color-light { background-color: #fff } .universalForm .section-component-universal-form .partials-view.right-bkg-color-light .UF-check, .universalForm .section-component-universal-form .partials-view.right-bkg-color-light .UF-fake-radio-btn, .universalForm .section-component-universal-form .partials-view.right-bkg-color-light .container-textarea .UF-floating-label, .universalForm .section-component-universal-form .partials-view.right-bkg-color-light .mp-email-container, .universalForm .section-component-universal-form .partials-view.right-bkg-color-light input, .universalForm .section-component-universal-form .partials-view.right-bkg-color-light select, .universalForm .section-component-universal-form .partials-view.right-bkg-color-light textarea { background-color: #f7f7f7 !important } .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark { background-color: #f7f7f7 } .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark .UF-check, .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark .UF-fake-radio-btn, .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark .container-textarea .UF-floating-label, .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark .mp-email-container, .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark input, .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark select, .universalForm .section-component-universal-form .partials-view.right-bkg-color-dark textarea { background-color: #fff !important } .universalForm .section-component-universal-form .partials-view.padding-top-80 { padding-top: 8rem } .universalForm .section-component-universal-form .partials-view.padding-top-40 { padding-top: 4rem } .universalForm .section-component-universal-form .partials-view.padding-bottom-80 { padding-bottom: 8rem } .universalForm .section-component-universal-form .partials-view.padding-bottom-40 { padding-bottom: 4rem } .universalForm .section-component-universal-form .cta-component.cta-text-arrow a .cta-title-link-arrow { vertical-align: baseline } .universalForm .section-component-universal-form .uf-assets-container.in-100-width .logo-asset-container, .universalForm .section-component-universal-form .uf-assets-container.in-100-width .restricted-asset { margin: auto; max-width: 170rem; padding-left: 2rem; padding-right: 2rem; width: 100% } .universalForm .section-component-universal-form .uf-assets-container.UF-hide-assets-container { display: none } .universalForm .section-component-universal-form .UF-container { display: flex; flex-direction: row; flex-wrap: wrap } .universalForm .section-component-universal-form .UF-container.variation-100 { margin: auto; max-width: 170rem } .universalForm .section-component-universal-form .UF-container.form-on-left { flex-direction: row-reverse } .universalForm .section-component-universal-form .UF-container .all-fields-required { color: #333; font-size: 1.4rem; padding-bottom: .8rem; padding-top: .2rem } .universalForm .section-component-universal-form .UF-container .UF-border-right { border-right: 1px solid #f7f7f7 } .universalForm .section-component-universal-form .UF-container .UF-container-50 { min-height: .1rem; padding-left: 2rem; padding-right: 2rem; width: 50% } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .inner-content-container.UF-container-rounded-corners { border-radius: .6rem; padding: 2rem 4rem !important } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side { position: relative } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container { padding-left: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container .media-list-wrapper .restricted-asset { padding-left: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .full-bleed-asset { max-width: none } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .full-bleed-asset.right-bigger { bottom: 0; left: 0; position: absolute; right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .logo-asset-container { padding-left: 0; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { margin-left: 0; margin-right: 0; padding-left: 2rem; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .left-side-full-bleed-asset { display: none } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text { line-height: 1.5; padding-left: 0; padding-right: 1rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text .text-component { color: #293e40; padding-left: 0; padding-right: 1rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side { padding-left: 6.4rem; padding-top: 19.1rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .small-text { color: #333; font-family: GilroySemiBold; font-size: 1.4rem; padding-top: 1rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .UF-header.login { padding-top: 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .full-bleed-asset { max-width: none } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .left-side-full-bleed-asset { display: block } .universalForm .section-component-universal-form .UF-container .UF-container-100 { margin-left: auto; margin-right: auto; min-height: .1rem; padding-left: 2rem; padding-right: 2rem; width: 100% } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .hide, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .hide { display: none } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset.UF-continue-btn, .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset.UF-submit-btn, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset.UF-continue-btn, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset.UF-submit-btn { margin: 2.4rem 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .UF-header h2, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .UF-header h2 { margin-bottom: 1.6rem } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .UF-header .login-description, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .UF-header .login-description { color: var(--brand-black,var(--gable-green)); margin: 1.6rem 0 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .UF-form-container, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .UF-form-container { padding: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset h4.download-asset-resources, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset h4.download-asset-resources { margin: 2.4rem 0 .8rem } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul { margin-bottom: 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul.additional-resources-list, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul.additional-resources-list { -webkit-padding-start: 0; padding: 0; padding-inline-start: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul.additional-resources-list li, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul.additional-resources-list li { list-style: none; margin: 2.4rem 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul.additional-resources-list li:first-child, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul.additional-resources-list li:first-child { margin-top: .8rem } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul.additional-resources-list li:last-child:not(.hide), .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul.additional-resources-list li:last-child:not(.hide) { margin-bottom: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul.additional-resources-list li a, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul.additional-resources-list li a { background-image: linear-gradient(90deg,#81b5a1 100%,transparent 0); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 .2rem; display: inline; overflow: hidden; padding-bottom: .5rem; transition: all .25s linear } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset ul.additional-resources-list li a:hover, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset ul.additional-resources-list li a:hover { background-size: 100% .2rem } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .view-all, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .view-all { margin: 2.4rem 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .view-all .cta-component, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .view-all .cta-component { margin: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow { vertical-align: bottom } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow #Secondary-CTA-Dark, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .view-all .cta-component.cta-text-arrow a .cta-title-link-arrow #Secondary-CTA-Dark { stroke: #293e40 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .video-list-container, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .video-list-container { display: flex; display: -webkit-flex; flex-direction: column; height: 0; margin-top: 2.4rem; overflow: hidden; padding-bottom: 56.25%; padding-top: 30px; position: relative } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .video-list-container .video-item, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .video-list-container .video-item { height: 100%; left: 0; margin-top: 0; position: absolute; top: 0; width: 100% } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view.download-asset .video-list-container .video-item .container, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view.download-asset .video-list-container .video-item .container { padding: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100 .inner-view .video-js.brightcove, .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-view .video-js.brightcove { font-size: 1.4rem; padding-bottom: 56.25%; width: 100% } .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light { background-color: #fff } .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light .UF-check, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light .UF-fake-radio-btn, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light .container-textarea .UF-floating-label, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light .mp-email-container, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light input, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light select, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-colorUF-container-50-light textarea, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light .UF-check, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light .UF-fake-radio-btn, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light .container-textarea .UF-floating-label, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light .mp-email-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light input, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light select, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-colorUF-container-50-light textarea { background-color: #f7f7f7 !important } .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark { background-color: #f7f7f7 } .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark .UF-check, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark .UF-fake-radio-btn, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark .container-textarea .UF-floating-label, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark .mp-email-container, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark input, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark select, .universalForm .section-component-universal-form .UF-container .UF-container-100.right-bkg-color-dark textarea, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark .UF-check, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark .UF-fake-radio-btn, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark .container-textarea .UF-floating-label, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark .mp-email-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark input, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark select, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-bkg-color-dark textarea { background-color: #fff !important } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-top-0, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-top-0 { padding-top: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-top-80, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-top-80 { padding-top: 8rem } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-top-40, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-top-40 { padding-top: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-bottom-80, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-bottom-80 { padding-bottom: 8rem } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-bottom-40, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-bottom-40 { padding-bottom: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-bottom-0 fieldset#db_data_container, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-bottom-0 fieldset#db_data_container { display: none } .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-bottom-0 form, .universalForm .section-component-universal-form .UF-container .UF-container-100.padding-bottom-0 form .UF-submit-btn li, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-bottom-0 form, .universalForm .section-component-universal-form .UF-container .UF-container-50.padding-bottom-0 form .UF-submit-btn li { margin: 0; padding: 0 } .universalForm .section-component-universal-form .UF-container .UF-email-validation-title { color: #b33233 } .universalForm .section-component-universal-form .UF-container .UF-email-validation-title-off { display: none } .universalForm .section-component-universal-form .inner-view .wrapper-ul ul { padding-left: 1.5rem } .universalForm .section-component-universal-form .inner-view .wrapper-ul ul li { color: #293e40; font-size: 1.6rem; line-height: 2.72rem; list-style: disc } .universalForm .section-component-universal-form .inner-view .avatar { margin: 2.4rem 0 } .universalForm .section-component-universal-form .inner-view .avatar .avatar-img { height: auto; padding-bottom: 0; width: 6.4rem } .universalForm .section-component-universal-form .inner-view .global-form-disclaimer { clear: both } .universalForm .section-component-universal-form .inner-view .UF-formless-wrong-user, .universalForm .section-component-universal-form .inner-view .UF-greetings { align-items: center; display: flex; flex-direction: row } .universalForm .section-component-universal-form .inner-view .UF-formless-wrong-user h6, .universalForm .section-component-universal-form .inner-view .UF-greetings h6 { margin-right: .5rem } .universalForm .section-component-universal-form .inner-view .manage-your-profile .mp-email-container { background: #f7f7f7; cursor: default; margin-bottom: .8rem; position: relative; width: 100% } .universalForm .section-component-universal-form .inner-view .manage-your-profile .mp-email-container .mp-email-placeholder { bottom: 1rem; color: #497e6e; font-size: 1.2rem; left: 2rem; letter-spacing: normal; opacity: 1; pointer-events: none; position: absolute; top: 8px; z-index: 1 } .universalForm .section-component-universal-form .inner-view .manage-your-profile .mp-email-container .mp-email-field { border: 0; color: #293e40; font-size: 1.6rem; font-stretch: normal; font-style: normal; font-weight: 400; height: 5.6rem; letter-spacing: 0; line-height: 3.72rem; padding: 2rem 1rem 0 2rem; text-transform: none; width: 100% } .universalForm .section-component-universal-form .inner-view .manage-your-profile .uf-manage-profile-text-below { margin: 0; padding-bottom: 3.2rem; padding-top: 0 } .universalForm .section-component-universal-form .inner-view .small-text { color: #333; font-family: GilroySemiBold; font-size: 1.4rem; padding-top: 1rem } .universalForm .section-component-universal-form .inner-view a.sticky-cta { background-color: #293e40; bottom: 0; color: #fff; cursor: pointer; display: none; font-family: GilroySemiBold; font-size: 1.8rem; height: 5rem; line-height: 5rem; position: fixed; right: 0; text-align: center; width: 100%; z-index: 1 } .universalForm .section-component-universal-form .inner-view a.sticky-cta.sticky-cta-show { display: block } .universalForm .section-component-universal-form .UF-navigation-section { display: none } .universalForm .section-component-universal-form .UF-auto-login-message { display: none; margin-top: 1.5rem; padding-bottom: 75% } .universalForm .section-component-universal-form .UF-auto-login-message.UF-show-messg { display: block } .universalForm .section-component-universal-form .UF-auto-login-message.UF-show-messg .UF-auto-login-counter { font-size: inherit } .universalForm .section-component-universal-form .UF-back-arrow-container, .universalForm .section-component-universal-form .UF-general-back-arrow-container { display: none } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-link-arrow, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-link-arrow { color: var(--acapulco); display: inline-block; margin: 0; overflow: auto; transform: rotate(180deg) } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn { font-weight: 500; margin-bottom: 1rem; margin-top: 1rem; position: static; transform: translate(-7.5rem) } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a { color: #fff; font-family: GilroySemiBold; font-weight: 500; vertical-align: bottom } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a .UF-arrow-text, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a .UF-arrow-text, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a .UF-arrow-text, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a .UF-arrow-text { display: inline-block } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a .UF-link-arrow, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a .UF-link-arrow, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a .UF-link-arrow, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a .UF-link-arrow { vertical-align: text-top } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a .UF-link-arrow svg, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a .UF-link-arrow svg, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a .UF-link-arrow svg, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a .UF-link-arrow svg { height: 1.3rem; transform: translate(-2rem); transition: all .25s linear } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a .UF-link-arrow svg path, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a .UF-link-arrow svg path, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a .UF-link-arrow svg path, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a .UF-link-arrow svg path { fill: #81b5a1 } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a .UF-link-arrow svg #polyline-3, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a .UF-link-arrow svg #polyline-3, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a .UF-link-arrow svg #polyline-3, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a .UF-link-arrow svg #polyline-3 { transform: translate(0) } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a:hover .UF-link-arrow, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a:hover .UF-link-arrow, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a:hover .UF-link-arrow, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a:hover .UF-link-arrow { display: inline-block } .universalForm .section-component-universal-form .UF-back-arrow-container .UF-back-btn a:hover .UF-link-arrow svg, .universalForm .section-component-universal-form .UF-back-arrow-container .UF-general-back-btn a:hover .UF-link-arrow svg, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-back-btn a:hover .UF-link-arrow svg, .universalForm .section-component-universal-form .UF-general-back-arrow-container .UF-general-back-btn a:hover .UF-link-arrow svg { transform: translate(-1rem) } .universalForm .section-component-universal-form .UF-general-back-arrow-container.backShow { display: block } .universalForm .section-component-universal-form .UF-fifty-percent { width: 50% } .universalForm .section-component-universal-form .text-download-page { text-align: left } .universalForm .section-component-universal-form .download-img-container { position: relative } .universalForm .section-component-universal-form .download-img-container img { height: auto; width: 100% } .universalForm .section-component-universal-form .UF-error-msg { color: #b33233; display: none; font-family: GilroyRegular; font-size: 1.4rem; padding: 2.4rem 0 } .universalForm .section-component-universal-form .UF-show-error-message { display: block } .universalForm .section-component-universal-form .UF-form-container { padding-top: .8rem } .universalForm .section-component-universal-form .UF-form-container form { margin-bottom: 2.4rem } .universalForm .section-component-universal-form .UF-form-container form ul { -webkit-padding-start: 0; -webkit-margin-before: 0; -webkit-margin-after: 0; margin: 0; margin-block-end: 0; margin-block-start: 0; padding: 0; padding-inline-start: 0 } .universalForm .section-component-universal-form .UF-form-container form ul li { margin-bottom: .8rem; position: relative; width: 100% } .universalForm .section-component-universal-form .UF-form-container form ul li .field-p { margin-bottom: 0; margin-top: 0 } .universalForm .section-component-universal-form .UF-form-container form ul li.hide { display: none } .universalForm .section-component-universal-form .UF-form-container form ul .UF-fifty-percent { float: left; width: 50% } .universalForm .section-component-universal-form .UF-form-container form ul .UF-clear { clear: both } .universalForm .section-component-universal-form .UF-form-container form .is-required { color: #b33233; display: none; font-family: GilroyRegular; font-size: 1rem; letter-spacing: 0; margin-bottom: 1.6rem; text-align: left; text-decoration: none; text-transform: none } .universalForm .section-component-universal-form .UF-form-container form .is-required.on { display: block } .universalForm .section-component-universal-form .UF-form-container form .UF-no-padding { padding: 0 } .universalForm .section-component-universal-form .UF-form-container form .UF-right-padding-8px { padding-right: .8rem } .universalForm .section-component-universal-form .UF-form-container form .UF-row { display: flex; flex-wrap: wrap } .universalForm .section-component-universal-form .UF-form-container form .UF-row select { background-position: 93.5% } .universalForm .section-component-universal-form .UF-form-container form input { background: #f7f7f7; border: 0; color: #293e40; font-family: GilroyRegular; font-size: 1.4rem; height: 5.6rem; line-height: 3.72rem; text-transform: none; width: 100% } .universalForm .section-component-universal-form .UF-form-container form input:focus { outline: 1px solid #81b5a1 } .universalForm .section-component-universal-form .UF-form-container form input::-ms-clear, .universalForm .section-component-universal-form .UF-form-container form input::-ms-reveal { display: none } .universalForm .section-component-universal-form .UF-form-container form input .UF-input-error { outline: 1px solid #b33233 } .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:focus ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:not(:focus):disabled ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:not(:focus):valid ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form select.UF-validate:focus ~ .UF-floating-label:not(.UF-floating-label-initial), .universalForm .section-component-universal-form .UF-form-container form select.UF-validate:not(:focus):not(.UF-border-error) ~ .UF-floating-label:not(.UF-floating-label-initial), .universalForm .section-component-universal-form .UF-form-container form select.custom-dropdown__select:focus ~ .UF-floating-label:not(.UF-floating-label-initial), .universalForm .section-component-universal-form .UF-form-container form select.custom-dropdown__select:not(:focus):not(.UF-border-error) ~ .UF-floating-label:not(.UF-floating-label-initial) { bottom: 10px; color: #497e6e; font-size: 1.2rem; left: 2rem; opacity: 1; top: .8rem } .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:focus ~ .UF-floating-label.UF-border-error-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:not(:focus):disabled ~ .UF-floating-label.UF-border-error-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:not(:focus):valid ~ .UF-floating-label.UF-border-error-label, .universalForm .section-component-universal-form .UF-form-container form select.UF-validate:focus ~ .UF-floating-label:not(.UF-floating-label-initial).UF-border-error-label, .universalForm .section-component-universal-form .UF-form-container form select.UF-validate:not(:focus):not(.UF-border-error) ~ .UF-floating-label:not(.UF-floating-label-initial).UF-border-error-label, .universalForm .section-component-universal-form .UF-form-container form select.custom-dropdown__select:focus ~ .UF-floating-label:not(.UF-floating-label-initial).UF-border-error-label, .universalForm .section-component-universal-form .UF-form-container form select.custom-dropdown__select:not(:focus):not(.UF-border-error) ~ .UF-floating-label:not(.UF-floating-label-initial).UF-border-error-label { color: #b33233 } .universalForm .section-component-universal-form .UF-form-container form select.UF-has-floating-label { padding-top: 2rem } .universalForm .section-component-universal-form .UF-form-container form .UF-input-error .UF-floatingPlaceholder:focus ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-input-error .UF-floatingPlaceholder:not(:focus):valid ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-input-error select.UF-validate:focus ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-input-error select.UF-validate:not(:focus):valid ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-input-error select.custom-dropdown__select:focus ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-input-error select.custom-dropdown__select:not(:focus):valid ~ .UF-floating-label { color: #b33233 } .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder { font-size: 1.6rem; font-stretch: normal; font-style: normal; font-weight: 400; letter-spacing: 0; padding: 2rem 1rem 0 2rem } .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder#password { padding-right: 10rem } .universalForm .section-component-universal-form .UF-form-container form .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floating-label-initial { color: #5b6f70; cursor: text; font-size: 1.6rem; left: 2rem; line-height: 1.7; pointer-events: none; position: absolute; top: 1.5rem; transition: all .2s ease; z-index: 1 } .universalForm .section-component-universal-form .UF-form-container form select { -webkit-appearance: none; background: #f7f7f7; background-image: url(https://www.servicenow.com/content/dam/servicenow/images/demo-asset/icon/arrow-down.png); background-position: 97%; background-repeat: no-repeat; border: 0; color: #5b6f70; cursor: pointer; font-family: GilroyRegular; font-size: 1.6rem; height: 5.6rem; line-height: normal; padding-left: 2rem; text-align: left; width: 100% } .universalForm .section-component-universal-form .UF-form-container form select:focus { outline: 1px solid #81b5a1 } .universalForm .section-component-universal-form .UF-form-container form select:focus::-ms-value { background-color: #f7f7f7; color: #5b6f70 } .universalForm .section-component-universal-form .UF-form-container form select::-ms-expand { display: none } .universalForm .section-component-universal-form .UF-form-container form select option { font-size: 1.4rem } .universalForm .section-component-universal-form .UF-form-container form select:focus { background-image: url(https://www.servicenow.com/content/dam/servicenow/images/demo-asset/icon/arrow-up.png) } .universalForm .section-component-universal-form .UF-form-container form .LV_validation_message, .universalForm .section-component-universal-form .UF-form-container form label.label-position { display: none } .universalForm .section-component-universal-form .UF-form-container form .container-textarea textarea { moz-appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: #f7f7f7; border: 0; border-top: .5rem solid transparent; color: #293e40; font-family: GilroyRegular; font-size: 1.6rem; height: 18.8rem; resize: none; text-transform: none; width: 100% } .universalForm .section-component-universal-form .UF-form-container form .container-textarea textarea.UF-floatingPlaceholder { padding: 3rem 2rem 0 } .universalForm .section-component-universal-form .UF-form-container form .container-textarea textarea.UF-floatingPlaceholder:focus ~ .UF-floating-label { left: .2rem; top: .2rem } .universalForm .section-component-universal-form .UF-form-container form .container-textarea textarea:focus { outline: 1px solid #81b5a1; padding-top: 3.5rem } .universalForm .section-component-universal-form .UF-form-container form .container-textarea textarea .UF-input-error { outline: 1px solid #b33233 } .universalForm .section-component-universal-form .UF-form-container form .container-textarea .UF-floating-label { background-color: #f7f7f7; height: 3rem; left: .2rem !important; line-height: 1.7; margin-top: 0; padding-left: 1.7rem; padding-top: 1.4rem; right: 1.7rem; top: .2rem !important } .universalForm .section-component-universal-form .UF-form-container form .container-textarea.UF-right-padding-8px .UF-floating-label { right: 3rem } .universalForm .section-component-universal-form .UF-form-container form .UF-real-checkbox { display: none } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox { display: table; margin-top: 1.6rem } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox.global-form-disclaimer .UF-acceptance { padding: 0 } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-acceptance { display: table-cell; font-size: 1.4rem; padding-left: 8px; vertical-align: middle } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-acceptance a { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% 2px; color: #293e40; font-size: 1.4rem; padding-left: 4px; transition: all .25s linear } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-acceptance a:hover { background-position: 0 100%; -webkit-transition: all .25s linear; transition: all .25s linear } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-acceptance span { display: block; font-size: 1rem; font-weight: bolder } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-check { background: #f7f7f7; border: 2px solid rgba(41,62,64,.2); border-radius: 20%; cursor: pointer; display: block; height: 16px; top: 0; width: 16px } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-check:before { border-radius: 20%; content: ""; display: block; height: .8rem; left: .4rem; position: absolute; top: .4rem; width: .8rem } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .two-lines-alignment, .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .two-lines-alignment:before { margin-top: 1rem } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-sponsor-email-optin, .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .all-together { display: table-cell; padding-left: 1rem; vertical-align: top } .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .UF-sponsor-email-optin .uf-inner-p, .universalForm .section-component-universal-form .UF-form-container form .UF-checkbox .all-together .uf-inner-p { display: inline } .universalForm .section-component-universal-form .UF-form-container form .UF-clear.first { overflow: hidden } .universalForm .section-component-universal-form .UF-form-container form .UF-clear.first .UF-checkbox .UF-check:before { top: 2rem } .universalForm .section-component-universal-form .UF-form-container form .UF-real-checkbox:checked + div .UF-check:before { background: #497e6e } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip { color: #293e40; display: none; font-size: 1.4rem; padding-top: 8px } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip.active { display: block } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip.active + .UF_validation_message { display: none } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req { line-height: 21px; margin-bottom: 4px; padding-left: 20px; position: relative } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req:last-child { margin-bottom: 24px } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req:not(.req-met) { color: #5b6f70 } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req:not(.req-met) .progress-indicator:before { align-items: center; color: #b33233; content: "×"; display: flex; font-size: 28px; height: 15px; left: 0; position: absolute; text-align: center; top: 49%; transform: translateY(-50%) } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req.req-met .progress-indicator { height: 22px; transform: rotate(45deg); width: 22px } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req.req-met .progress-indicator:after, .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req.req-met .progress-indicator:before { background-color: #83b4a1; content: ""; position: absolute; transform: rotate(45deg) } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req.req-met .progress-indicator:before { height: 11px; left: 7px; top: 5px; width: 2px } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req.req-met .progress-indicator:after { height: 2px; left: 1px; top: 12px; width: 5px } @media(min-width: 1024px) { .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip { background: #fff; bottom: calc(100% + 15px); box-shadow: 0 0 6px 0 rgba(41,62,64,.2); color: #293e40; display: block; max-width: 296px; padding: 24px; position: absolute; right: 0; visibility: hidden; z-index: 1001 } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .UF-interactive-password-title { display: block } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .tooltip-carrot { background: #fff; border-top-color: #fff; border-width: 10px 10px 0; bottom: -7px; box-shadow: 3px 3px 3px 0 rgba(41,62,64,.2); display: block; height: 15px; opacity: 1; position: absolute; right: 30px; transform: rotate(45deg); width: 15px; z-index: 0 } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip.active { visibility: visible } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-tooltip .pwd-req:last-child { margin-bottom: 0 } } .universalForm .section-component-universal-form .UF-form-container form .UF-interactive-password-title { display: none; font-family: GilroySemiBold; margin: 0 0 8px } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass { position: absolute; right: 20px; top: 1.5rem; z-index: 3 } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass, .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-show-pass { color: #5b6f70; font-family: GilroyRegular; font-size: 1.6rem; font-stretch: normal; font-style: normal; line-height: 27.2px } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-show-pass { cursor: pointer } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass { display: inline-block; padding-left: 16px; position: relative } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password { background-color: #fff; bottom: 150%; box-shadow: 0 0 10px gray; left: 6rem; margin-left: -1040%; padding: 2.4rem; position: absolute; text-align: left; visibility: hidden; width: 296px; z-index: 1 } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password:after { border: 12px solid transparent; border-top-color: #fff; content: ""; left: 89%; margin-left: -5px; position: absolute; top: 100% } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password p:before { content: url(../../../content/dam/servicenow-assets/public/en-us/digital-graphics/icons/packages-check-mark.png); left: -17px; position: absolute; top: 1px; transform: scale(1.2) } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password p { position: relative } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password p.UF-fail:before { display: none } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password.only-change-password { padding: 0 } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password.only-change-password .inner-tooltip { height: 14rem; overflow-y: scroll; padding: 2.4rem } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass:before { background: hsla(0,0%,62%,.471); border-radius: 1.4rem; content: "?"; display: inline-block; font-size: 1.6rem; height: 1.4rem; line-height: 1.4rem; text-align: center; text-decoration: none; width: 1.4rem } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-label { color: #293e40; font-size: 1.4rem; margin-bottom: .8rem } .universalForm .section-component-universal-form .UF-form-container form .UF-active-optin-sec { margin-bottom: 0; padding-top: .8rem } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec { margin: .8rem 0 0 } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec .UF-real-radio-btn { display: none } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec .UF-real-radio-btn:checked ~ label:before { background: #497e6e } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec .UF-radio-label-group { display: inline-block; position: relative } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec .UF-radio-label-group:first-child { margin-right: 3.2rem } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec .UF-radio-label-group .UF-fake-radio-btn { background: #f7f7f7; border: 2px solid rgba(41,62,64,.2); border-radius: 50%; color: #293e40; display: inline-block; font-size: 1.4rem; height: 1.6rem; margin: 0 .8rem 0 0; padding-top: 0; top: .4rem; width: 1.6rem } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec .UF-radio-label-group .UF-fake-radio-btn:before { border-radius: 50%; content: ""; cursor: pointer; display: block; height: .8rem; left: .4rem; position: absolute; top: .4rem; width: .8rem } .universalForm .section-component-universal-form .UF-form-container form .UF-radio-btn-selection-sec.UF-radio-border-error .UF-radio-label-group .radio-label-error { border-color: #b33233 } .universalForm .section-component-universal-form .UF-form-container form .UF_validation_message { display: none; font-size: 1.2rem; padding-top: .4rem } .universalForm .section-component-universal-form .UF-form-container form .UF_validation_message:before { content: ""; display: inline-block; height: 1.6rem; margin-right: .6rem; width: 1.6rem } .universalForm .section-component-universal-form .UF-form-container form .UF_validation_message.UF_invalid { color: #b33233; display: flex } .universalForm .section-component-universal-form .UF-form-container form .UF_validation_message.UF_invalid:before { content: url(../../../content/dam/servicenow/images/global/icons/icon-error.svg) } .universalForm .section-component-universal-form .UF-form-container form .UF_validation_message.UF_warning { color: #293e40; display: flex } .universalForm .section-component-universal-form .UF-form-container form .UF_validation_message.UF_warning:before { content: url(../../../content/dam/servicenow/images/global/icons/icon-warning.svg) } .universalForm .section-component-universal-form .UF-form-container form .UF-border-error, .universalForm .section-component-universal-form .UF-form-container form .UF-border-error:focus { outline: 1px solid #b33233 } .universalForm .section-component-universal-form .UF-form-container form .UF-border-error-label { color: #b33233 } .universalForm .section-component-universal-form .UF-form-container form .UF-check.UF-checkbox-border-error-label { border-color: #b33233 } .universalForm .section-component-universal-form .UF-form-container form .accountNameText { display: none } .universalForm .section-component-universal-form .UF-form-container form .accountNameText.showTxt { display: block } .universalForm .section-component-universal-form .UF-continue-btn, .universalForm .section-component-universal-form .UF-submit-btn { margin: 2.4rem 0 0 } .universalForm .section-component-universal-form .UF-continue-btn .uf-submit-form-download, .universalForm .section-component-universal-form .UF-submit-btn .uf-submit-form-download { display: none } .universalForm .section-component-universal-form .UF-continue-btn button, .universalForm .section-component-universal-form .UF-submit-btn button { outline: none } .universalForm .section-component-universal-form .UF-continue-btn a, .universalForm .section-component-universal-form .UF-continue-btn button, .universalForm .section-component-universal-form .UF-submit-btn a, .universalForm .section-component-universal-form .UF-submit-btn button { background: var(--brand-green-darker,transparent); border: .2rem solid var(--brand-green-darker,#293e40); border-radius: var(--btn-border-radius,unset); color: var(--brand-black,#293e40); cursor: pointer; display: inline-block; font-family: GilroySemiBold; font-size: 1.8rem; padding: 1.5rem 4rem; transition: color .25s ease } .universalForm .section-component-universal-form .UF-continue-btn a:hover, .universalForm .section-component-universal-form .UF-continue-btn button:hover, .universalForm .section-component-universal-form .UF-submit-btn a:hover, .universalForm .section-component-universal-form .UF-submit-btn button:hover { background: var(--brand-green,#293e40); border: .2rem solid var(--brand-green,#293e40); color: var(--brand-black,var(--pure-white)) } .universalForm .section-component-universal-form .UF-continue-btn .UF-send-verification-email-hide, .universalForm .section-component-universal-form .UF-submit-btn .UF-send-verification-email-hide { display: none } .universalForm .section-component-universal-form .UF-continue-btn .UF-send-verification-email-show, .universalForm .section-component-universal-form .UF-submit-btn .UF-send-verification-email-show { display: inline-block } .universalForm .section-component-universal-form .additional-bottom-section .separator-text { color: #293e40; font-size: 1.8rem; height: auto; margin-bottom: 3.2rem; margin-top: 3.2rem; overflow: hidden; text-align: center } .universalForm .section-component-universal-form .additional-bottom-section .separator-text:before { background-color: #293e40; content: ""; display: inline-block; height: .2rem; margin-left: -50%; margin-right: 2.4rem; opacity: .1; position: relative; right: .5em; vertical-align: middle; width: 50% } .universalForm .section-component-universal-form .additional-bottom-section .separator-text:after { background-color: #293e40; content: ""; display: inline-block; height: .2rem; left: .5em; margin-left: 2.4rem; margin-right: -50%; opacity: .1; position: relative; vertical-align: middle; width: 50% } .universalForm .section-component-universal-form .additional-bottom-section .separator { height: auto; margin-bottom: 3.2rem; margin-top: 3.2rem; overflow: hidden; text-align: center } .universalForm .section-component-universal-form .additional-bottom-section .separator:after { background-color: #293e40; content: ""; display: block; height: .2rem; opacity: .1; position: relative; vertical-align: middle; width: 100% } .universalForm .section-component-universal-form .image-container { padding-top: 4.8rem } .universalForm .section-component-universal-form form.showing-loading-spinner { position: relative } .universalForm .section-component-universal-form .lds-roller { color: official; display: inline-block; height: 10rem; position: relative; width: 10rem } .universalForm .section-component-universal-form .lds-roller div { animation: lds-roller-my-account 1.2s linear infinite; transform-origin: 4.2rem 4.2rem } .universalForm .section-component-universal-form .lds-roller div:after { background: #293e40; border-radius: 20%; content: " "; display: block; height: 1.8rem; left: 3.9rem; position: absolute; top: .3rem; width: .6rem } .universalForm .section-component-universal-form .lds-roller div:first-child { animation-delay: -1.1s; transform: rotate(0deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(2) { animation-delay: -1s; transform: rotate(30deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(3) { animation-delay: -.9s; transform: rotate(60deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(4) { animation-delay: -.8s; transform: rotate(90deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(5) { animation-delay: -.7s; transform: rotate(120deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(6) { animation-delay: -.6s; transform: rotate(150deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(7) { animation-delay: -.5s; transform: rotate(180deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(8) { animation-delay: -.4s; transform: rotate(210deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(9) { animation-delay: -.3s; transform: rotate(240deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(10) { animation-delay: -.2s; transform: rotate(270deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(11) { animation-delay: -.1s; transform: rotate(300deg) } .universalForm .section-component-universal-form .lds-roller div:nth-child(12) { animation-delay: 0s; transform: rotate(330deg) } @keyframes lds-roller { 0% { opacity: 0 } to { opacity: 0 } } .universalForm .section-component-universal-form .loading-layer { bottom: 0; display: none; left: 0; position: absolute; right: 0; top: 0 } .universalForm .section-component-universal-form .loading-layer.show-loading-layer { display: block; z-index: 101 } .universalForm .section-component-universal-form .loading-layer .loading-film { position: absolute } .universalForm .section-component-universal-form .loading-layer .lds-roller { left: 50%; top: 30%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 11 } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper { max-width: none; padding: 0 } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper .component-overlay-new-right-col { height: 100vh; right: -2rem !important } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper .component-overlay-new-right-col .partials-view { min-height: .1rem; padding-left: 16.666667%; padding-right: 16.666667%; position: relative; width: 100% } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper .component-overlay-new-right-col .partials-view.component-overlay-new-right-col-scroll { max-width: none; overflow-y: auto } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper .component-overlay-new-right-col .partials-view:before { left: unset } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper .component-overlay-new-right-col .partials-view .image-container { margin: 0 -2% } .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section { display: block } .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section .UF-overlay-close-btn { cursor: pointer } .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section .UF-overlay-close-btn.UF-close-btn-mobile { display: inline-block !important; padding: 0 5rem; position: absolute; right: 0; top: 6.4rem; z-index: 10000 } .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section .UF-overlay-close-btn.UF-close-btn-mobile svg g { stroke: #293e40 } .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section .UF-overlay-close-btn.UF-close-btn-mobile svg { opacity: .3 } .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section .UF-overlay-close-btn.UF-close-btn-mobile:hover svg, .universalForm .section-component-universal-form .form-in-overlay .UF-navigation-section .UF-overlay-close-btn.UF-close-btn-mobile:hover svg g { opacity: 1 } .universalForm .section-component-universal-form .form-in-overlay .media-list-wrapper .full-bleed-asset { left: 0; margin-left: 0; margin-right: 0; position: absolute; right: 0 } .universalForm .section-component-universal-form .form-in-page .uf-assets-container.no-image { display: none } .universalForm .section-component-universal-form .create-account .UF-hide-input, .universalForm .section-component-universal-form .create-account .UF-hide-optin, .universalForm .section-component-universal-form .create-account .UF-show-input, .universalForm .section-component-universal-form .formless .UF-hide-input, .universalForm .section-component-universal-form .formless .UF-hide-optin, .universalForm .section-component-universal-form .formless .UF-show-input, .universalForm .section-component-universal-form .manage-your-profile .UF-hide-input, .universalForm .section-component-universal-form .manage-your-profile .UF-hide-optin, .universalForm .section-component-universal-form .manage-your-profile .UF-show-input { display: none !important } .universalForm .section-component-universal-form .create-account .UF-show-input-edit-mode, .universalForm .section-component-universal-form .formless .UF-show-input-edit-mode, .universalForm .section-component-universal-form .manage-your-profile .UF-show-input-edit-mode { display: block !important } .universalForm .section-component-universal-form .delete-account .UF-back-arrow-container, .universalForm .section-component-universal-form .forgot-password .UF-back-arrow-container, .universalForm .section-component-universal-form .manage-your-profile .UF-back-arrow-container, .universalForm .section-component-universal-form .uf-sign-in-inner .UF-back-arrow-container { display: inline-block; position: static } .universalForm .section-component-universal-form .validate-email h4.validateemail-sent-message { display: none } .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-100.padding-bottom-40, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-100.padding-bottom-80, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-100.padding-top-40, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-100.padding-top-80, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-50.padding-bottom-40, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-50.padding-bottom-80, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-50.padding-top-40, .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-50.padding-top-80 { padding-bottom: 0; padding-top: 0 } .universalForm .section-component-universal-form .uf-sign-in-inner .section-component-universal-form .UF-container .UF-container-50.right-side .UF-form-container { margin: 0 } .universalForm .exceedError { padding: 2rem 0 } .UF_global-div p.login-description { margin-bottom: 1.6rem; margin-top: 1.6rem } .secondaryEmailPopUp .component-secondary-email-popup { display: none; height: 100%; width: 100% } .secondaryEmailPopUp .component-secondary-email-popup .secondary-email-popup-film { background-color: #293e40; bottom: 0; height: 100%; left: 0; opacity: .8; position: absolute; right: 0; top: 0; width: 100%; z-index: 100000 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container { background: #fff; height: auto; left: 50%; margin: auto; padding: 5rem 3rem; position: absolute; top: 8rem; transform: translate(-50%); z-index: 100001 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-close-btn { cursor: pointer; display: inline-block !important; position: absolute; right: -3rem; top: -3rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-close-btn::hover, .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-close-btn:hover { opacity: .7 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-close-btn svg g { stroke: #fff } @media(max-width: 767px) { .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-close-btn { right: 3rem } } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-header-sec h2.headline { color: #293e40; font-family: GilroyBold; font-size: 2.4rem; line-height: normal; margin: 0 0 1.6rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container .sepopup-header-sec div.subhead { color: #293e40; font-family: GilroyRegular; font-size: 1.6rem; margin: 1.6rem 0 2.4rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label { background: #f6f6f6; display: block; height: 4.4rem; margin-bottom: .8rem; position: relative; width: 100% } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .placeholder { color: #9f9f9f; cursor: text; font-family: GilroySemiBold; font-size: 1.4rem; left: 0; letter-spacing: 0; line-height: 2.72rem; padding-left: 0; position: absolute; right: 0; text-align: left; text-decoration: none; text-indent: 2rem; text-transform: none; top: 10px; transition: top .3s,font-size .3s; z-index: 1 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .placeholder.focus { color: #9f9f9f; font-size: 1.2rem; top: 0; z-index: 3 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap { position: relative; z-index: 2 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap input { background-color: transparent; border: 0; color: #293e40; font-family: GilroySemiBold; font-size: 1.4rem; height: 4.4rem; letter-spacing: 0; line-height: 2.72rem; margin-bottom: .8rem; text-align: left; text-decoration: none; text-indent: 2rem; text-transform: none; width: 100% } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap input.focus { padding-top: 2rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap select { -moz-appearance: none; -webkit-appearance: none; background-color: transparent; background-image: url(https://www.servicenow.com/content/dam/servicenow/images/demo-asset/icon/arrow-down.png); background-position: 97%; background-repeat: no-repeat; border: 0; color: #9f9f9f !important; font-family: GilroySemiBold; font-size: 1.4rem; font-weight: 300; height: 4.4rem; letter-spacing: 0; line-height: 2.72rem; margin-bottom: .8rem; padding-bottom: 0; padding-left: 2rem; padding-top: 0; text-align: left; text-decoration: none; text-indent: 2rem; text-indent: .1rem; text-transform: none; width: 100% } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap select.focus { padding-top: 0 !important } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap option { color: #9f9f9f } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form label .input-wrap li div div p label { display: none } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .terms-container { margin-top: 1.6rem; position: relative } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .terms-container span:first-of-type { display: block; padding-left: 3rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .terms-container span:first-of-type p { display: inline } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .terms-container div.terms-checkbox { background: #e2e2e2; border-radius: 20%; display: block; height: 1.8rem; position: absolute; top: 0; width: 1.8rem; z-index: 5 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .terms-container div.terms-checkbox.onCliked:before { background: #9b9b9b; border-radius: 20%; content: ""; display: block; height: 1rem; left: .4rem; position: absolute; top: .4rem; width: 1rem; z-index: 5 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .is-required { color: #b33233; display: none; font-family: GilroySemiBold; font-size: 1rem; letter-spacing: 0; margin-bottom: 1.6rem; text-align: left; text-decoration: none; text-transform: none } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .is-required.on { display: block } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container { display: none; margin-top: 1.4rem; position: relative } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .optin-label { background: 0; color: #293e40; height: auto } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec { padding-top: 1rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group { display: inline-block; position: relative } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group::first-child, .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group:first-child { margin-right: 3rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group input { left: 0; position: absolute; top: 0 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group .fake-radio-btn { background: #e2e2e2; border-radius: 50%; color: #293e40 !important; display: block; font-size: 1.4rem; height: 1.8rem; padding-top: 0; position: absolute; top: 0; width: 1.8rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group .fake-radio-btn:before { border-radius: 50%; content: ""; display: block; height: 1rem; left: .4rem; position: absolute; top: .4rem; width: 1rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group span { font-size: 1.4rem; padding-left: 3rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group #optin-no-pp:checked ~ #optin-no-fake:before, .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .gdpr-container .radio-btn-selection-sec .radio-label-group #optin-yes-pp:checked ~ #optin-yes-fake:before { background: #9b9b9b } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .sepopup-update-btn { margin-bottom: 0; margin-top: 1.6rem } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form p.field-p.custom-dropdown { margin-bottom: 0; margin-top: 0 } .secondaryEmailPopUp .component-secondary-email-popup .sepopup-container form#secondary-email-form .LV_validation_message.LV_invalid { display: none } @media screen and (max-width: 320px) { .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass .UF-info-pass .UF-tooltip-text-password { left: 7.5rem } .universalForm .section-component-universal-form .form-in-overlay form .UF-right-pass .UF-info-pass .UF-tooltip-text-password { left: 8rem } } @media screen and (min-width: 320px)and (max-width:1023px) { #meganav18 #tab-UF-myaccount-mobile { display: block; top: 12px } .universalForm .section-component-universal-form .form-in-overlay .component-overlay-new-inner-wrapper .component-overlay-new-right-col { padding: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .logo-asset-container { padding-right: 0 } .universalForm .section-component-universal-form .UF-container form .UF-floating-label { top: 1.35rem } } @media screen and (min-width: 768px) { .universalForm .section-component-universal-form .UF-container.form-on-left { flex-wrap: nowrap } .universalForm .section-component-universal-form .UF-container .inner-view a.sticky-cta.sticky-cta-show { display: none } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container { padding-left: 3rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { padding-left: 3rem; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .inner-content-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .uf-assets-container .media-list-wrapper .logo-asset-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .uf-assets-container .media-list-wrapper .restricted-asset { padding-left: 1rem } } @media screen and (max-width: 1023px) { #meganav18 #tab-UF-myaccount-mobile { display: block; top: 20px } .universalForm .form-in-overlay .component-overlay-container-new .component-overlay-new-inner-wrapper .component-overlay-new-right-col { -webkit-overflow-scrolling: touch; overflow-y: auto; padding: 0; right: 0 !important } .universalForm .form-in-overlay .component-overlay-container-new .component-overlay-new-inner-wrapper .component-overlay-new-right-col .partials-view { padding-left: 6.666667%; padding-right: 6.666667% } .universalForm .form-in-overlay .component-overlay-container-new.content-UF.no-left-image.single-overlay.overlay-modal-open { min-height: 100vh; width: 100% } .universalForm .form-in-overlay .component-overlay-container-new.content-UF.no-left-image.single-overlay.overlay-modal-open .component-UF .component-overlay-new-right-col { right: 0 !important } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button { right: -1rem; top: -3rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button:after, .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button:before { height: 2.1rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-header { margin-bottom: 1.6rem; margin-top: 2.4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-circle-icon { height: 6rem; width: 6rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-circle-icon:after { right: 2.3rem; top: 1.8rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-circle-icon .x-icon { right: 2.9rem; top: 1.5rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .text-section { padding-bottom: 4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section { align-items: center; display: flex } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .cta-component { margin-right: 4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .UF-ok-box-cta { width: inherit } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-header-content { padding-left: 6%; padding-right: 6% } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-body { padding: 0 12% 4.8rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .unlink .overlay-content-wrapper .overlay-circle-icon { display: none } .universalForm .section-component-universal-form .UF-account-linking-overlay .unlink .overlay-content-wrapper .overlay-header { margin-top: 4.8rem } .universalForm .section-component-universal-form .UF-container .UF-container-50 { width: 100% } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side { padding-left: 2rem; padding-top: 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .UF-header.login { padding-top: 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-top-40, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-top-48, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-top-56, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-top-80 { padding-top: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-bottom-40, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-bottom-48, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-bottom-56, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .padding-bottom-80 { padding-bottom: 5.6rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .full-bleed-asset { margin-left: -2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side { padding: 0 0 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container .contentRouterItem, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container .smallMarquee { padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-top-40, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-top-48, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-top-56, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-top-80 { padding-top: 2.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-bottom-40, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-bottom-48, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-bottom-56, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .mediaList .media-list-wrapper .padding-bottom-80 { padding-top: 3.2rem } .universalForm .section-component-universal-form .UF-container.form-on-top { flex-wrap: wrap-reverse } .universalForm .section-component-universal-form .UF-container.form-on-top .UF-container-50.right-side { padding-bottom: 0 } .universalForm .section-component-universal-form .UF-container.form-on-top .UF-container-50.left-side { padding-bottom: 8rem } .universalForm .section-component-universal-form .UF-container.form-on-top .UF-container-50.left-side .component-small-marquee { padding-top: 4rem !important } .universalForm .section-component-universal-form .UF-form-container form .UF-right-padding-8px { padding-right: 0 } .universalForm .section-component-universal-form .UF-form-container form label { height: 4.8rem } .universalForm .section-component-universal-form .UF-form-container form input { height: 4.8rem; padding-left: 1.6rem } .universalForm .section-component-universal-form .UF-form-container form select { font-size: 1.4rem; height: 4.8rem; line-height: 1.5 } .universalForm .section-component-universal-form .UF-form-container form ul .UF-fifty-percent { width: 100% } .universalForm .section-component-universal-form .UF-form-container form ul .UF-right-padding-8px { padding-right: 0 } .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:focus ~ .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floatingPlaceholder:not(:focus):valid ~ .UF-floating-label { left: 1.6rem; top: 8px } .universalForm .section-component-universal-form .UF-form-container form .UF-floating-label { font-size: 1.4rem; line-height: 1.5 } .universalForm .section-component-universal-form .UF-form-container form .UF-right-pass { top: 1rem } .universalForm .section-component-universal-form .UF-form-container form .container-textarea .UF-floating-label { right: 1.5rem } .universalForm .section-component-universal-form .image-container { padding-top: 4rem } .universalForm .section-component-universal-form .additional-bottom-section .separator-text { font-size: 1.6rem } .universalForm .section-component-universal-form .additional-bottom-section .separator-text:before { margin-right: 1.6rem } .universalForm .section-component-universal-form .additional-bottom-section .separator-text:after { margin-left: 1.6rem } } @media screen and (min-width: 1024px) { #meganav18 #tab-UF-myaccount-mobile { display: none !important } .universalForm .form-in-overlay .component-overlay-new-inner-wrapper .partials-view.component-overlay-new-right-col-scroll { height: 100%; max-width: 100vw !important; overflow-y: auto !important; width: 100% } .universalForm .form-in-overlay .component-overlay-new-inner-wrapper .partials-view #map-dialog { z-index: 10200 } .universalForm .form-in-overlay .component-overlay-new-inner-wrapper .partials-view #map-overlay { z-index: 10100 } .universalForm .section-component-universal-form .UF-container .UF-container-100 { padding-left: 4rem; padding-right: 3rem; width: 97rem } .universalForm .section-component-universal-form .UF-container .UF-container-50 .inner-content-container.UF-container-rounded-corners { border-radius: 1.2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50 .all-fields-required { padding-top: 1rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container .media-list-wrapper .restricted-asset { padding-right: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .left-side-full-bleed-asset { display: block } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { padding-left: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text { padding-left: 0; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text .text-component { max-width: 100%; padding-left: 0; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side:after { background-color: #cfcfcf; bottom: 8rem; content: ""; height: auto; position: absolute; right: 0; top: 8rem; width: .1rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side.padding-top-40:after { top: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side.padding-top-0:after { top: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side.padding-bottom-40:after { bottom: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side.padding-bottom-0:after { bottom: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side.no-line-separator:after { display: none } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .inner-content-container { padding-left: 2rem; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .left-side-full-bleed-asset { display: none } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .logo-asset-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .restricted-asset { padding-left: 3rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper.media-list-demo .logo-asset-container { padding-left: 0 } .universalForm .section-component-universal-form .UF-container .inner-view .wrapper-ul ul li { font-size: 1.8rem; line-height: 3.06rem } .universalForm .section-component-universal-form .uf-assets-container.in-100-width .logo-asset-container, .universalForm .section-component-universal-form .uf-assets-container.in-100-width .restricted-asset { padding-left: 4rem; padding-right: 3rem } .universalForm .section-component-universal-form .UF-form-container form .UF-floating-label, .universalForm .section-component-universal-form .UF-form-container form .UF-floating-label-initial { line-height: 1; top: 2rem } .universalForm .section-component-universal-form .UF-form-container form select { line-height: 3.72rem } .universalForm .UF-container.form-on-top .UF-container-50.right-side { padding-bottom: 4rem } .UF_global-body-override.site-body-content-wrapper { overflow: visible } } @media screen and (min-width: 1024px)and (max-width:1699px) { #meganav18 #tab-UF-myaccount-mobile { display: block } .universalForm .section-component-universal-form .UF-account-linking-overlay .UF-overlay-content-close-button { right: -2.4rem; top: -4rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-circle-icon { height: 8rem; width: 8rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-circle-icon:after { right: 3.2rem; top: 2.6rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-circle-icon .x-icon { right: 3.8rem; top: 2.5rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-header { margin-bottom: 3.2rem; margin-top: 4rem; margin-top: 5.6rem !important } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .overlay-body { padding-bottom: 6.4rem; padding-left: 7.2rem; padding-right: 7.2rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-content-wrapper .cta-section .cta-component { margin-right: 3rem } .universalForm .section-component-universal-form .UF-account-linking-overlay .overlay-circle-icon { height: 8rem; margin-top: 8rem; width: 8rem } .universalForm .section-component-universal-form .UF-form-container form ul .UF-fifty-percent { padding-right: 0; width: 100% } .universalForm .section-component-universal-form .UF-container .UF-container-100 { padding-left: 3rem } .universalForm .section-component-universal-form .UF-container.UF-container-equal-widths .UF-container-50.left-side, .universalForm .section-component-universal-form .UF-container.UF-container-equal-widths .UF-container-50.right-side { width: 50% } .universalForm .section-component-universal-form .UF-container.UF-container-equal-widths .UF-container-50.right-side { padding-right: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side { width: 58% } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container { padding-left: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .logo-asset-container { padding-left: 0; padding-right: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { padding-left: 2rem; padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text { padding-left: 0; padding-right: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text .text-component { padding-left: 0; padding-right: 1.5rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side { padding-left: 2.4rem; width: 42% } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .UF-form-container form ul .UF-fifty-percent { padding-right: 0; width: 100% } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .UF-form-container form .UF-right-padding-8px { padding-right: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .uf-assets-container .media-list-wrapper .restricted-asset { padding-right: 2rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .uf-assets-container .media-list-wrapper .full-bleed-asset { margin-left: -2.4rem } .universalForm .section-component-universal-form .uf-assets-container.in-100-width .logo-asset-container, .universalForm .section-component-universal-form .uf-assets-container.in-100-width .restricted-asset { padding-left: 3rem } } @media screen and (min-width: 1200px) { .universalForm .UF-container .UF-container-100 { width: 117rem } } @media screen and (min-width: 1700px) { .universalForm .section-component-universal-form .UF-container.UF-container-equal-widths .UF-container-50.right-side { padding-left: 3rem } .universalForm .section-component-universal-form .UF-container.UF-container-equal-widths .UF-container-50.right-side .inner-content-container { max-width: 78rem } .universalForm .section-component-universal-form .UF-container.UF-container-equal-widths .UF-container-50.left-side .inner-content-container { max-width: 79rem; padding-left: 0; padding-right: 1rem } .universalForm .section-component-universal-form .UF-container .inner-view .wrapper-ul ul li { font-size: 2rem; line-height: 3.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container { margin-left: auto; max-width: 830px; padding-left: 3rem; padding-right: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .logo-asset-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { margin-right: auto; max-width: 83rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { margin-left: auto; margin-right: 0; padding-left: 3rem; padding-right: 6rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .logo-asset-container { margin-right: -2rem; padding-left: 0; padding-right: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .text { padding-right: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .inner-content-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .logo-asset-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .restricted-asset { margin-right: auto; max-width: 830px; padding-right: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .full-bleed-asset { margin-left: -6.4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper.media-list-demo .logo-asset-container { max-width: none; padding-right: 0 } } @media screen and (min-width: 1900px) { .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .inner-content-container { padding-left: 4rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .logo-asset-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { padding-left: 0 } .universalForm .section-component-universal-form .UF-container .UF-container-50.left-side .media-list-wrapper .restricted-asset { margin-left: auto; margin-right: 0; max-width: 79rem; padding-left: 0; padding-right: 6rem } .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .inner-content-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .logo-asset-container, .universalForm .section-component-universal-form .UF-container .UF-container-50.right-side .media-list-wrapper .restricted-asset { padding-right: 8rem } } .universalForm .section-component-universal-form.styles-old-template { -webkit-tap-highlight-color: unset; color: #000; font: 1.4rem/normal GilroyRegular } .universalForm .section-component-universal-form.styles-old-template .UF_global-div p.login-description { margin-bottom: 1.6rem; margin-top: 1.6rem } .universalForm .section-component-universal-form.styles-old-template h1 { font-family: GilroyBold } .universalForm .section-component-universal-form.styles-old-template .component-small-marquee .label span { font-size: 2.2rem } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper { background-color: #fff !important } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper { max-width: unset; padding: 0 } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container { display: flex; flex-wrap: wrap } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .flex-box-col-sm-6 { -webkit-box-flex: 0; flex: 0 0 100%; -ms-flex: 0 0 100%; -webkit-flex: 0 0 100%; max-width: 100% } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .uf-assets-container .container { max-width: 100% } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .tablet-spacing { left: 0; margin: 0; padding: 0 } .universalForm .section-component-universal-form.styles-old-template .component-overlay-container-new { left: 0; overflow-y: auto } .universalForm .section-component-universal-form.styles-old-template .site-width-1700 { margin: auto; max-width: 170rem; padding-left: 1rem; padding-right: 1rem; width: 100% } .universalForm .section-component-universal-form.styles-old-template .gable-green:before { background-color: #293e40 !important } .universalForm .section-component-universal-form.styles-old-template .pure-white { fill: #fff !important; stroke: #fff !important } .universalForm .section-component-universal-form.styles-old-template .component-small-marquee .description ul li { list-style: disc } .universalForm .section-component-universal-form.styles-old-template li { list-style: none } .universalForm .section-component-universal-form.styles-old-template .description ul li { list-style: disc } .universalForm .section-component-universal-form.styles-old-template .UF-checkbox-clear { clear: both } .universalForm .section-component-universal-form.styles-old-template a { letter-spacing: 0; line-height: 14px; text-decoration: none } .universalForm .section-component-universal-form.styles-old-template a, .universalForm .section-component-universal-form.styles-old-template h1, .universalForm .section-component-universal-form.styles-old-template h2, .universalForm .section-component-universal-form.styles-old-template h3, .universalForm .section-component-universal-form.styles-old-template h4, .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6, .universalForm .section-component-universal-form.styles-old-template p, .universalForm .section-component-universal-form.styles-old-template span { font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; -webkit-font-smoothing: antialiased; color: #293e40 } .universalForm .section-component-universal-form.styles-old-template h1, .universalForm .section-component-universal-form.styles-old-template h2, .universalForm .section-component-universal-form.styles-old-template h3, .universalForm .section-component-universal-form.styles-old-template h4, .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6 { font-weight: 400 !important; letter-spacing: -.2px; margin: 0 } .universalForm .section-component-universal-form.styles-old-template p a:hover { background-size: 100% 100%; cursor: pointer } .universalForm .section-component-universal-form.styles-old-template a:hover { cursor: pointer; text-decoration: none } .universalForm .section-component-universal-form.styles-old-template p a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background: -webkit-linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; font-size: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out; -moz-transition: background .25s ease-out; -ms-transition: background .25s ease-out; -o-transition: background .25s ease-out; -webkit-transition: background .25s ease-out } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 { font-size: 2.2rem; line-height: 2.86rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 span.super-case, .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 sup { font-size: 6.6px; top: .5rem } .universalForm .section-component-universal-form.styles-old-template h2 { font-family: GilroyBold; font-size: 2.2rem; line-height: 2.86rem; margin: 2rem 0 } .universalForm .section-component-universal-form.styles-old-template h2 span.super-case, .universalForm .section-component-universal-form.styles-old-template h2 sup { font-size: 6.6px; top: .5rem } .universalForm .section-component-universal-form.styles-old-template h3 { font-family: GilroyBold; font-size: 2rem; line-height: 2.6rem } .universalForm .section-component-universal-form.styles-old-template h3 span.super-case, .universalForm .section-component-universal-form.styles-old-template h3 sup { font-size: 6px; top: .58rem } .universalForm .section-component-universal-form.styles-old-template h4 { font-family: GilroyBold; font-size: 1.8rem; line-height: 2.34rem } .universalForm .section-component-universal-form.styles-old-template h4 span.super-case, .universalForm .section-component-universal-form.styles-old-template h4 sup { font-size: 5.4px; top: .44rem } .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6 { font-family: GilroyBold; font-size: 1.6rem; line-height: 2.08rem } .universalForm .section-component-universal-form.styles-old-template h5 span.super-case, .universalForm .section-component-universal-form.styles-old-template h5 sup, .universalForm .section-component-universal-form.styles-old-template h6 span.super-case, .universalForm .section-component-universal-form.styles-old-template h6 sup { font-size: 4.8px; top: .44rem } .universalForm .section-component-universal-form.styles-old-template p, .universalForm .section-component-universal-form.styles-old-template span { font-family: GilroyRegular } .universalForm .section-component-universal-form.styles-old-template p { -webkit-margin-after: 1em; -webkit-margin-before: 1em; font-weight: 400; margin: 0; margin-block-end: 1em; margin-block-start: 1em } .universalForm .section-component-universal-form.styles-old-template p, .universalForm .section-component-universal-form.styles-old-template span { font-size: 1.4rem; letter-spacing: -.2px } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li p, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li p, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span { font-size: 1.6rem; line-height: 2.72rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span.super-case, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li sup, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span.super-case, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li sup, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p span.super-case, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span.super-case, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy sup { font-size: 4.8px; top: .4rem } .universalForm .section-component-universal-form.styles-old-template input { font-family: Arial } .universalForm .section-component-universal-form.styles-old-template .UF-general-back-arrow-container .UF-general-back-btn span { font-family: GilroySemiBold } @media screen and (min-width: 768px) { .universalForm .section-component-universal-form.styles-old-template h1, .universalForm .section-component-universal-form.styles-old-template h2, .universalForm .section-component-universal-form.styles-old-template h3, .universalForm .section-component-universal-form.styles-old-template h4, .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6 { letter-spacing: normal } .universalForm .section-component-universal-form.styles-old-template a, .universalForm .section-component-universal-form.styles-old-template body, .universalForm .section-component-universal-form.styles-old-template h1, .universalForm .section-component-universal-form.styles-old-template h2, .universalForm .section-component-universal-form.styles-old-template h3, .universalForm .section-component-universal-form.styles-old-template h4, .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6, .universalForm .section-component-universal-form.styles-old-template li, .universalForm .section-component-universal-form.styles-old-template p, .universalForm .section-component-universal-form.styles-old-template span { Letter-spacing: normal } .universalForm .section-component-universal-form.styles-old-template h1 { font-size: 3.6rem; line-height: 4.68rem } .universalForm .section-component-universal-form.styles-old-template h1 span.super-case { top: .9rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 { font-size: 2.2rem; line-height: 2.86rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 span.super-case, .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 sup { top: .55rem } .universalForm .section-component-universal-form.styles-old-template h2 { font-size: 3.2rem; line-height: 3.64rem } .universalForm .section-component-universal-form.styles-old-template h2 span.super-case, .universalForm .section-component-universal-form.styles-old-template h2 sup { font-size: 9.6px; top: .8rem } .universalForm .section-component-universal-form.styles-old-template h3 { font-size: 2.4rem; line-height: 3.12rem } .universalForm .section-component-universal-form.styles-old-template h3 span.super-case, .universalForm .section-component-universal-form.styles-old-template h3 sup { font-size: 7.2px; top: .55rem } .universalForm .section-component-universal-form.styles-old-template h4 { font-size: 2.2rem; line-height: 2.86rem } .universalForm .section-component-universal-form.styles-old-template h4 span.super-case, .universalForm .section-component-universal-form.styles-old-template h4 sup { font-size: 6.6px; top: .55rem } .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6 { font-size: 2rem; line-height: 2.6rem } .universalForm .section-component-universal-form.styles-old-template h5 span.super-case, .universalForm .section-component-universal-form.styles-old-template h5 sup, .universalForm .section-component-universal-form.styles-old-template h6 span.super-case, .universalForm .section-component-universal-form.styles-old-template h6 sup { font-size: 6px; top: .55rem } .accordion.section .universalForm .section-component-universal-form.styles-old-template .accordion-panel, .accordion.section .universalForm .section-component-universal-form.styles-old-template .accordion-panel p, .accordion.section .universalForm .section-component-universal-form.styles-old-template .accordion-panel span, .universalForm .section-component-universal-form.styles-old-template .accordion.section .accordion-panel, .universalForm .section-component-universal-form.styles-old-template .accordion.section .accordion-panel p, .universalForm .section-component-universal-form.styles-old-template .accordion.section .accordion-panel span, .universalForm .section-component-universal-form.styles-old-template .large-body-copy, .universalForm .section-component-universal-form.styles-old-template .large-body-copy p, .universalForm .section-component-universal-form.styles-old-template .large-body-copy span, .universalForm .section-component-universal-form.styles-old-template .xlarge-body-copy, .universalForm .section-component-universal-form.styles-old-template .xlarge-body-copy p, .universalForm .section-component-universal-form.styles-old-template .xlarge-body-copy span { font-size: 2rem; line-height: 3.4rem } .accordion.section .universalForm .section-component-universal-form.styles-old-template .accordion-panel span.super-case, .accordion.section .universalForm .section-component-universal-form.styles-old-template .accordion-panel sup, .universalForm .section-component-universal-form.styles-old-template .accordion.section .accordion-panel span.super-case, .universalForm .section-component-universal-form.styles-old-template .accordion.section .accordion-panel sup, .universalForm .section-component-universal-form.styles-old-template .large-body-copy p span.super-case, .universalForm .section-component-universal-form.styles-old-template .large-body-copy span.super-case, .universalForm .section-component-universal-form.styles-old-template .large-body-copy sup, .universalForm .section-component-universal-form.styles-old-template .xlarge-body-copy p span.super-case, .universalForm .section-component-universal-form.styles-old-template .xlarge-body-copy span.super-case, .universalForm .section-component-universal-form.styles-old-template .xlarge-body-copy sup { font-size: 6px; top: .6rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li p, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li p, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span { font-size: 1.8rem; line-height: 3.06rem } } @media screen and (min-width: 1024px) { .universalForm .section-component-universal-form.styles-old-template { letter-spacing: normal } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper { background-color: transparent !important } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .partials-view.component-overlay-new-right-col-scroll { right: -2rem !important } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .flex-box-col-lg-6, .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .flex-box-col-sm-6 { min-height: .1rem; position: relative; width: 100% } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .flex-box-col-lg-6 { -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50% } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .tablet-spacing { padding-left: 2rem; padding-right: 2rem } .universalForm .section-component-universal-form.styles-old-template .site-width-1700 { padding-left: 1.5rem; padding-right: 1.5rem } .universalForm .section-component-universal-form.styles-old-template h1 { font-size: 3.6rem; line-height: 4.68rem } .universalForm .section-component-universal-form.styles-old-template h1 span.super-case { top: .9rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 { font-size: 2.2rem; line-height: 2.86rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 span.super-case, .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 sup { top: .55rem } .universalForm .section-component-universal-form.styles-old-template h2 { font-size: 3.2rem; line-height: 3.64rem } .universalForm .section-component-universal-form.styles-old-template h2 span.super-case, .universalForm .section-component-universal-form.styles-old-template h2 sup { font-size: 9.6px; top: .8rem } .universalForm .section-component-universal-form.styles-old-template h3 { font-size: 2.4rem; line-height: 3.12rem } .universalForm .section-component-universal-form.styles-old-template h3 span.super-case, .universalForm .section-component-universal-form.styles-old-template h3 sup { font-size: 7.2px; top: .55rem } .universalForm .section-component-universal-form.styles-old-template h4 { font-size: 2.4rem; line-height: 3.64rem } .universalForm .section-component-universal-form.styles-old-template h4 span.super-case, .universalForm .section-component-universal-form.styles-old-template h4 sup { font-size: 6.6px; top: .55rem } .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6 { font-size: 2rem; line-height: 2.6rem } .universalForm .section-component-universal-form.styles-old-template h5 span.super-case, .universalForm .section-component-universal-form.styles-old-template h5 sup, .universalForm .section-component-universal-form.styles-old-template h6 span.super-case, .universalForm .section-component-universal-form.styles-old-template h6 sup { font-size: 6px; top: .55rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li p, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li p, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span { font-size: 1.8rem; line-height: 3.06rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span.super-case, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li sup, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span.super-case, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li sup, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p span.super-case, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span.super-case, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy sup { font-size: 5.4px; top: .45rem } } @media screen and (min-width: 1700px) { .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .component-overlay-new-right-col { right: -2rem !important } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .flex-box-col-sm-6 { min-height: .1rem; padding-left: 2rem; position: relative; width: 100% } .universalForm .section-component-universal-form.styles-old-template .form-in-overlay .component-overlay-new-outter-wrapper .component-overlay-new-inner-wrapper .flex-box-container .flex-box-col-lg-6 { -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50% } .universalForm .section-component-universal-form.styles-old-template .site-width-1700 { padding-left: 2rem; padding-right: 2rem } .universalForm .section-component-universal-form.styles-old-template h1 { font-size: 4.8rem; line-height: 6.24rem } .universalForm .section-component-universal-form.styles-old-template h1 span.super-case, .universalForm .section-component-universal-form.styles-old-template h1 sup { font-size: 14.4px; top: 1.1rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 { font-size: 4.2rem; line-height: 5.46rem } .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 span.super-case, .universalForm .section-component-universal-form.styles-old-template body:not(.en) h1 sup { font-size: 12.6px; top: 1rem } .universalForm .section-component-universal-form.styles-old-template h2 { font-size: 3.6rem; line-height: 4.68rem } .universalForm .section-component-universal-form.styles-old-template h2 span.super-case, .universalForm .section-component-universal-form.styles-old-template h2 sup { font-size: 10.8px; top: .8rem } .universalForm .section-component-universal-form.styles-old-template h3 { font-size: 2.8rem; line-height: 3.64rem } .universalForm .section-component-universal-form.styles-old-template h3 span.super-case, .universalForm .section-component-universal-form.styles-old-template h3 sup { font-size: 8.4px; top: .64rem } .universalForm .section-component-universal-form.styles-old-template h4 { font-size: 2.8rem; line-height: 3.64rem } .universalForm .section-component-universal-form.styles-old-template h4 span.super-case, .universalForm .section-component-universal-form.styles-old-template h4 sup { font-size: 7.2px; top: .5rem } .universalForm .section-component-universal-form.styles-old-template h5, .universalForm .section-component-universal-form.styles-old-template h6 { font-size: 2.4rem; line-height: 3.12rem } .universalForm .section-component-universal-form.styles-old-template h5 span.super-case, .universalForm .section-component-universal-form.styles-old-template h5 sup, .universalForm .section-component-universal-form.styles-old-template h6 span.super-case, .universalForm .section-component-universal-form.styles-old-template h6 sup { font-size: 6.6px; top: .5rem } .universalForm .section-component-universal-form.styles-old-template p span.super-case { top: .3rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy { font-size: 2rem; line-height: 3.4rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li p, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li p, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span { font-size: 1.8rem; line-height: 3.06rem } .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li span.super-case, .accordion.section ul.list-unstyled .universalForm .section-component-universal-form.styles-old-template li sup, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li span.super-case, .universalForm .section-component-universal-form.styles-old-template .accordion.section ul.list-unstyled li sup, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy p span.super-case, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy span.super-case, .universalForm .section-component-universal-form.styles-old-template .medium-body-copy sup { font-size: 5.4px; top: .35rem } } .events-signed-in-view.view-your-profile .UF-header .UF-greetings p, .events-signed-in-view.view-your-profile .UF-header .login-title, .events-signed-in-view.view-your-profile .UF-manage-profile, .events-signed-in-view.view-your-profile .additional-bottom-section { display: none !important } .events-signed-in-view.view-your-profile .avatar { margin-bottom: 16px !important } .events-signed-in-view.view-your-profile .UF-header .UF-greetings h2 { margin-bottom: 8px !important; margin-top: 0 !important } @media screen and (min-width: 1024px) { .events-signed-in-view.view-your-profile .UF-header .UF-greetings h2 { margin-bottom: 16px !important } } .events-signed-in-view.view-your-profile .UF-manage-registration { margin-bottom: 24px; margin-top: 30px } .universalForm .section-component-universal-form .multistep-form .UF-form-container form ul .UF-fifty-percent { clear: both; padding: 0; width: 100% } .universalForm .section-component-universal-form .multistep-form .hide-dropdown { display: none !important } .universalForm .section-component-universal-form .multistep-form ul { opacity: 1 } .universalForm .section-component-universal-form .multistep-form.multistep-form-switch ul { opacity: 0 } .universalForm .section-component-universal-form .multistep-form .multistep-form-status { margin: 0 0 2.4rem } .universalForm .section-component-universal-form .multistep-form .multistep-form-status .multistep-form-status-text { margin: 0 0 .4rem } .universalForm .section-component-universal-form .multistep-form .multistep-form-status .multistep-status-bar { background-color: #a7d4df; display: inline-block; height: 1.5rem; margin: 0 .8rem 0 0; opacity: 1; width: calc(50% - 8px) } .universalForm .section-component-universal-form .multistep-form .multistep-form-status .multistep-status-bar:last-child { margin: 0 0 0 .8rem } .universalForm .section-component-universal-form .multistep-form .multistep-form-buttons { text-align: right } .universalForm .section-component-universal-form .multistep-form .multistep-form-buttons .UF-continue-btn, .universalForm .section-component-universal-form .multistep-form .multistep-form-buttons .UF-submit-btn { display: inline-block } .universalForm .section-component-universal-form .multistep-form .multistep-form-buttons .multistep-form-button { background: transparent; border: .2rem solid #293e40; color: #293e40; cursor: pointer; display: inline-block; font-family: GilroySemiBold; font-size: 1.8rem; margin: 2.4rem 0 0; padding: 1.5rem 4rem; transition: color .25s ease } .universalForm .section-component-universal-form .multistep-form .multistep-form-buttons .multistep-form-button:hover { background: #293e40; border: .2rem solid #293e40; color: #fff } .universalForm .section-component-universal-form .multistep-form .multistep-form-buttons + .wrapper-ul { text-align: right } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-1 .multistep-form-status .multistep-form-status-text:before { content: "1 of 2" } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-1 .multistep-form-status .multistep-status-bar:last-child { opacity: .2 } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-1 li { display: none } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-1 li.multistep-form-step-1-field { display: block } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-1 .multistep-form-button:before { content: "Next" } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-status .multistep-form-status-text:before { content: "2 of 2" } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 li.multistep-form-step-1-field { display: none } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-buttons .multistep-form-button, .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-buttons .multistep-form-button:focus, .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-buttons .multistep-form-button:hover { background-color: transparent; border-color: transparent; color: #293e40 } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-buttons .multistep-form-button:before { content: "Back" } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-buttons .uf-submit-form { background-color: #fff !important; color: #293e40 !important } .universalForm .section-component-universal-form .multistep-form.multistep-form-step-2 .multistep-form-buttons .uf-submit-form:hover { background-color: #293e40 !important; color: #fff !important } @media screen and (min-width: 1024px) { .universalForm .section-component-universal-form .multistep-form .multistep-status-bar, .universalForm .section-component-universal-form .multistep-form ul, .universalForm .section-component-universal-form .multistep-form.multistep-form-switch ul { transition: opacity .25s } } .universalForm .section-component-universal-form .multistep-form .UF-hide-input + .multistep-form-status { display: none !important } .universalForm .section-component-universal-form .multistep-form .login li { display: inherit } .universalForm .section-component-universal-form .multistep-form .login .multistep-form-button, .universalForm .section-component-universal-form .multistep-form .login .multistep-form-status { display: none !important } .inner-view .UF-send-verification-email:focus, .inner-view .UF-send-verification-email:focus-visible { outline-color: #3eaa2b; outline-style: solid; outline-width: 3px } .universalForm .uf-contact-experience-wrapper .UF-container form .container-textarea .UF-floating-label, .universalForm .uf-contact-experience-wrapper .UF-container form input, .universalForm .uf-contact-experience-wrapper .UF-container form select, .universalForm .uf-contact-experience-wrapper .UF-container form textarea { background-color: var(--pure-white) !important } .universalForm .uf-contact-experience-wrapper .UF-container .right-bkg-color-light form .container-textarea .UF-floating-label, .universalForm .uf-contact-experience-wrapper .UF-container .right-bkg-color-light form input, .universalForm .uf-contact-experience-wrapper .UF-container .right-bkg-color-light form select, .universalForm .uf-contact-experience-wrapper .UF-container .right-bkg-color-light form textarea { background-color: var(--cloud) !important } .universalForm .uf-contact-experience-wrapper .UF-container .UF-continue-btn { margin: 2.4rem 0 0 } .universalForm .uf-contact-experience-wrapper .UF-container .UF-ce-hide-input { display: none !important } .universalForm .uf-contact-experience-wrapper .UF-container .UF-ce-show-input { display: block !important } .universalForm .uf-contact-experience-wrapper .UF-container .uf-contact-experience .UF-form-container { padding-top: 0 } .universalForm .uf-contact-experience-wrapper .UF-container .uf-contact-experience .UF-container-100 { padding: 0 } .universalForm .uf-contact-experience-wrapper .UF-container .uf-contact-experience .additional-bottom-section .login-description { margin-bottom: 0; margin-top: 2.4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top { flex-wrap: wrap-reverse } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .padding-top-0 { padding-top: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side { padding-bottom: 3.2rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.left-side { padding-bottom: 5.6rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.left-side:after { display: none } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .component-small-marquee.small-marquee-uf-variation { padding-top: 0 !important } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .component-small-marquee.small-marquee-uf-variation .title { display: none } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .component-small-marquee.small-marquee-uf-variation h1, .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .component-small-marquee.small-marquee-uf-variation h2 { padding-top: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .content-router-text-column, .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .contentRouterItem, .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .inner-content-wrapper { display: none } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left { flex-direction: row-reverse } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side { padding-bottom: 4rem; width: 100% } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container { background-color: var(--cloud); border-radius: 6px; margin-left: 0; padding-left: 0 !important } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience { padding: 2.4rem 1.6rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience .login-title { margin-bottom: 1.6rem; margin-top: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience .uf-ce-description { display: none; margin-bottom: 2.4rem; margin-top: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience .uf-ce-description.uf-after-sign-in-text { display: block; margin-bottom: 1.6rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience .UF-link-arrow { color: var(--brand-black) } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .inner-content-wrapper { padding: 0 1.6rem 2.4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.left-side { padding-bottom: 5.6rem; width: 100% } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.left-side .inner-content-container { padding-left: 0 !important } @media screen and (min-width: 768px) { .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.left-side .inner-content-container { padding-left: 2rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side .inner-content-container { padding-left: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left { flex-wrap: nowrap } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.left-side { padding-left: 0; padding-right: 0; width: 50% } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side { padding-bottom: 5.6rem; padding-right: 0; width: 50% } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50 .contentRouterItem, .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50 .inner-content-wrapper { display: block } } @media screen and (min-width: 1024px) { .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side { padding-bottom: 8rem; padding-right: 4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side .login-title { display: none } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side .download-asset .login-title { display: block } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side .inner-content-container { padding-right: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.left-side { padding-bottom: 8rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .component-small-marquee.small-marquee-uf-variation { padding-bottom: 4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .component-small-marquee.small-marquee-uf-variation .title, .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .contentRouterItem, .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50 .inner-content-wrapper { display: block } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50 .inner-content-container { border-radius: 1.2rem; padding-right: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.left-side { padding-right: 4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side { padding: 0 0 8rem 4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .login-title { display: block } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience { padding: 4rem 2.4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience .uf-ce-description { display: block } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience .additional-bottom-section { display: none } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .inner-content-wrapper { padding: 0 2.4rem 4rem } } @media(min-width: 1700px) { .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.left-side { padding-left: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.left-side .inner-content-container { padding-left: 4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side { padding-right: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-top .UF-container-50.right-side .inner-content-container { max-width: 785px; padding-right: 4rem } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.left-side .inner-content-container { margin-left: unset; margin-right: auto } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side { padding-left: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container { margin-left: auto; margin-right: unset; max-width: 805px; padding-left: 4rem !important; padding-right: 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .uf-contact-experience { padding: 4rem 4rem 4rem 0 } .universalForm .uf-contact-experience-wrapper .UF-container.form-on-left .UF-container-50.right-side .inner-content-container .inner-content-wrapper { padding: 0 4rem 4rem 0 } } .secondaryNavBackgroundScrollLock { left: 0; position: fixed; right: 0 } @media only screen and (min-width: 768px) { .secondaryNavBackgroundScrollLock { position: relative } } .homepage .component-secondary-nav { top: 71px } .component-secondary-nav { z-index: 998 } .component-secondary-nav.sticky-secondary-nav { background: #fff; -moz-box-shadow: 0 0 15px 5px rgba(41,62,64,.2); -webkit-box-shadow: 0 0 15px 5px rgba(41,62,64,.2); box-shadow: 0 0 15px 5px rgba(41,62,64,.2); position: fixed !important; top: 0 !important; transition: .25s ease-in; width: 100%; z-index: 1000 } .component-secondary-nav.transparent-secondary-nav { position: absolute; width: 100% } .component-secondary-nav .nav-content { align-items: center; display: flex; justify-content: space-between; min-height: 4.8rem } .component-secondary-nav .nav-content .nav-btn { width: 1.3rem } .component-secondary-nav .nav-title h6 a { font-family: GilroyBold; font-size: 1.6rem } .component-secondary-nav .sub-accordion-chevron, .component-secondary-nav .title-chevron { align-items: center; display: flex; justify-content: space-between; min-height: 4.8rem; padding-left: 1rem; padding-right: 2rem; width: 100% } .component-secondary-nav .sub-accordion-chevron { display: inline-flex; height: inherit; padding: 0; pointer-events: none; width: auto } .component-secondary-nav .nav-btn { display: inline-block } .component-secondary-nav .nav-tab-list-item { display: flex; font-family: GilroySemibold; justify-content: space-between } .component-secondary-nav .rotate { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); -moz-transition: all .1s linear; -webkit-transition: all .1s linear; transition: all .1s linear } .component-secondary-nav .scroll-after, .component-secondary-nav .scroll-before { display: none } .component-secondary-nav .nav-links { background: #fff; display: block; height: 0; left: 0; overflow: hidden; overflow-y: hidden; width: 100% } .component-secondary-nav .nav-links > .wrapper > .secondaryNavItem > li { display: block; padding: 1.2rem 1rem; width: 100% } .component-secondary-nav .nav-tab-sub-list-container { margin-bottom: 0; padding: 0 } .component-secondary-nav .nav-tab-sub-list-container li { padding: 1.2rem 0 } .component-secondary-nav .nav-tab-sub-list-container li:last-child { padding-bottom: 0 } .component-secondary-nav #nav-check:not(:checked) + .nav-links { background: transparent; height: 0 } .component-secondary-nav #nav-check:checked + .nav-links { height: calc(100vh - 5rem); overflow-y: auto; padding: 1rem; z-index: 11 } .component-secondary-nav #nav-check, .component-secondary-nav .date-cta, .component-secondary-nav .nav-date { display: none } .component-secondary-nav .date-cta { z-index: 1 } .component-secondary-nav .custom-cta { bottom: 0; display: block; left: 0; padding: 0; position: fixed; width: 100%; z-index: 11 } .component-secondary-nav .custom-cta .nav-cta { padding: 0 } .component-secondary-nav .custom-cta .cta-component { margin: 0; width: 100% } .component-secondary-nav .custom-cta .cta-component a { align-items: center; background: #293e40; color: #fff !important; display: flex; justify-content: center; min-height: 4.8rem; text-align: center; width: 100% } @media only screen and (min-width: 768px) { .component-secondary-nav .nav-content { margin: 0 1.7rem } .component-secondary-nav .component-secondary-nav-wrapper { min-height: 5rem; padding: 0 1.35rem; position: relative; width: 100% } .component-secondary-nav .title-chevron { height: 100%; padding: 0 3.2rem 0 0; width: auto } .component-secondary-nav .nav-title { align-items: center; cursor: pointer; display: flex; height: 100% } .component-secondary-nav .nav-title h6 a { font-size: 2rem; line-height: 2.72rem; white-space: nowrap } .component-secondary-nav .nav-btn { display: none } .component-secondary-nav .nav-links { align-items: center; background-color: transparent; display: flex !important; flex: auto; float: right; font-size: 1.8rem; height: auto !important; justify-content: flex-end; overflow: visible; padding: 0; position: static; width: auto; z-index: 1 } .component-secondary-nav .active-link { border-bottom: .3rem solid #293e40; margin-bottom: -.3rem; opacity: 1 !important } .component-secondary-nav .fade-state { opacity: .6 !important } .component-secondary-nav .nav-tab-list-item { cursor: pointer; font-size: 1.4rem; line-height: 2.38rem } .component-secondary-nav .nav-tab-sub-list-container { background: #fff; border: .1rem solid #f7f7f7; display: none; font-family: GilroyRegular; min-width: 22.4rem; padding: 1.2rem 2rem; position: absolute; z-index: 1 } .component-secondary-nav .nav-tab-sub-list-container li { padding: 1.2rem 0 } .component-secondary-nav .nav-tab-sub-list-container li:last-child { padding-bottom: 1.2rem } .component-secondary-nav .nav-tab-sub-list-container li a { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; display: inline; overflow: hidden; padding-bottom: .5rem; -moz-transition: all .25s linear; -webkit-transition: all .25s linear; transition: all .25s linear } .component-secondary-nav .nav-tab-sub-list-container li a:hover { background-position: 0 100%; transition: all .25s linear } .component-secondary-nav .wrapper { align-items: center; display: flex; font-family: GilroySemibold; overflow: hidden; padding: .3rem 0; transition: 1s } .component-secondary-nav .scroll-after, .component-secondary-nav .scroll-before { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-page-arrow-dark.svg); background-position: 50%; background-repeat: no-repeat; background-size: contain; cursor: pointer; display: none; height: 1rem; padding: 0 2.4rem; width: 1.2rem } .component-secondary-nav .scroll-after { background-position: 100%; padding-right: 0 } .component-secondary-nav .scroll-before { padding-left: 2.4rem; transform: rotate(180deg) } .component-secondary-nav .nav-links > .wrapper > .secondaryNavItem > li { display: inline-block; padding: 0 2.4rem 0 0; text-decoration: none; white-space: nowrap } .component-secondary-nav .nav-links > .wrapper > .secondaryNavItem:last-child li { padding-right: 0 } .component-secondary-nav .hide-visibility { visibility: hidden } .component-secondary-nav .sub-accordion-chevron { display: none } .component-secondary-nav .date-cta { align-items: center; display: flex; font-family: GilroyRegular; margin-left: 2.4rem } .component-secondary-nav .nav-date { border-left: .1rem solid #293e40; display: none; padding: 0 2.4rem } .component-secondary-nav .nav-date span { display: block } .component-secondary-nav .nav-cta { padding: 0 } .component-secondary-nav .nav-cta .cta-rectangle-box { margin-right: 0 } .component-secondary-nav .nav-cta .cta-rectangle-box a { width: -moz-max-content; width: max-content } } @media only screen and (min-width: 1024px) { .component-secondary-nav .component-secondary-nav-wrapper { min-height: 8rem; padding: 0 2rem } .component-secondary-nav .nav-content { margin: 0 2.2rem; min-height: 8rem } .component-secondary-nav .nav-title h6 a { font-size: 2rem; line-height: 2.6rem } .component-secondary-nav .nav-tab-list-item { font-size: 1.6rem; line-height: 2.72rem } .component-secondary-nav .nav-date { display: none } .component-secondary-nav .date-cta { margin-left: 3.2rem } .component-secondary-nav .nav-links > .wrapper > .secondaryNavItem > li { padding-right: 3.2rem } } @media only screen and (min-width: 1700px) { .component-secondary-nav .nav-date { display: block } .component-secondary-nav .nav-title h6 a { font-size: 2rem } .component-secondary-nav .scroll-after, .component-secondary-nav .scroll-before { display: none } .component-secondary-nav .date-cta { margin-left: 4.8rem } .component-secondary-nav .nav-links > .wrapper > li { padding-right: 4.8rem } } .media-list-wrapper.flex-box-col-lg-10, .media-list-wrapper.flex-box-col-md-12, .media-list-wrapper.flex-box-col-sm-6 { max-width: 100%; padding-left: 0; padding-right: 0 } .media-list-wrapper.flex-box-col-lg-10 .restricted-asset, .media-list-wrapper.flex-box-col-md-12 .restricted-asset, .media-list-wrapper.flex-box-col-sm-6 .restricted-asset { padding-left: 0 } .media-list-wrapper .full-bleed-asset .component-asset-block, .media-list-wrapper .logo-asset-container .component-asset-block, .media-list-wrapper .restricted-asset .component-asset-block { display: flex } .media-list-wrapper .full-bleed-asset .component-asset-block picture > img, .media-list-wrapper .full-bleed-asset .component-asset-block > img, .media-list-wrapper .full-bleed-asset .component-asset-block > svg, .media-list-wrapper .full-bleed-asset .component-asset-block > video, .media-list-wrapper .logo-asset-container .component-asset-block picture > img, .media-list-wrapper .logo-asset-container .component-asset-block > img, .media-list-wrapper .logo-asset-container .component-asset-block > svg, .media-list-wrapper .logo-asset-container .component-asset-block > video, .media-list-wrapper .restricted-asset .component-asset-block picture > img, .media-list-wrapper .restricted-asset .component-asset-block > img, .media-list-wrapper .restricted-asset .component-asset-block > svg, .media-list-wrapper .restricted-asset .component-asset-block > video { height: 100%; max-width: 100%; width: 100% } .media-list-wrapper .logo-asset-container { align-items: center; display: flex; flex-flow: wrap; justify-content: space-between } .media-list-wrapper .logo-asset-container .component-asset-block { max-width: 21.7rem; padding-bottom: 2.4rem; width: 50% } .media-list-wrapper .logo-asset-container .component-asset-block img, .media-list-wrapper .logo-asset-container .component-asset-block svg { height: auto; max-height: 9.2rem; padding-right: 2rem; width: 100% } .media-list-wrapper .full-bleed-asset { margin-left: -2rem; margin-right: -2rem } .media-list-wrapper .full-bleed-asset .component-asset-block { display: block } .media-list-wrapper .padding-top-80 { padding-top: 8rem } .media-list-wrapper .padding-top-56 { padding-top: 5.6rem } .media-list-wrapper .padding-top-48 { padding-top: 4.8rem } .media-list-wrapper .padding-top-40 { padding-top: 4rem } .media-list-wrapper .padding-top-16 { padding-top: 1.6rem } .media-list-wrapper .padding-bottom-80 { padding-bottom: 8rem } .media-list-wrapper .padding-bottom-56 { padding-bottom: 5.6rem } .media-list-wrapper .padding-bottom-48 { padding-bottom: 4.8rem } .media-list-wrapper .padding-bottom-40 { padding-bottom: 4rem } .media-list-wrapper .padding-bottom-16, .media-list-wrapper.media-list-demo { padding-bottom: 1.6rem } .accordion.section .media-list-wrapper.media-list-demo .accordion-panel, .media-list-wrapper.media-list-demo .accordion.section .accordion-panel, .media-list-wrapper.media-list-demo .large-body-copy { font-size: 1.8rem; line-height: 1.7; padding: .6rem 0 } .media-list-wrapper.media-list-demo .logo-asset-container { justify-content: normal } .media-list-wrapper.media-list-demo .logo-asset-container .component-asset-block { max-width: none; padding-left: 0; padding-right: 0; width: 100% } .media-list-wrapper.media-list-demo .logo-asset-container img, .media-list-wrapper.media-list-demo .logo-asset-container svg { max-height: none; padding-right: 0 } @media only screen and (min-width: 768px) { .accordion.section .media-list-wrapper.media-list-demo .accordion-panel, .media-list-wrapper.media-list-demo .accordion.section .accordion-panel, .media-list-wrapper.media-list-demo .large-body-copy { font-size: 2rem; padding: .4rem 0 } .media-list-wrapper.media-list-demo .logo-asset-container .component-asset-block { padding-bottom: 2.4rem; width: 100% } } @media only screen and (min-width: 1700px) { .accordion.section .media-list-wrapper.media-list-demo .accordion-panel, .media-list-wrapper.media-list-demo .accordion.section .accordion-panel, .media-list-wrapper.media-list-demo .large-body-copy { font-size: 2.2rem; padding: .2rem 0 } } @media only screen and (min-width: 1024px) { .media-list-wrapper.media-list-full-width { padding-left: 4rem; padding-right: 4rem } .media-list-wrapper.media-list-full-width p { font-family: GilroyBold; font-size: 3.6rem; line-height: 1.3; margin: 0; padding-top: 8rem; text-align: center } .media-list-wrapper.media-list-full-width .logo-asset-container { flex-flow: inherit; padding-top: 80px } } @media only screen and (min-width: 768px) { .media-list-wrapper .logo-asset-container .component-asset-block { padding-bottom: 4rem; width: 33.3% } } @keyframes spinning-circle { to { transform: rotate(1turn) } } .universalForm .section-component-universal-form .mids-progressive-profile .UF-form-container form ul .UF-fifty-percent { padding-right: 0; width: 100% } .mids-progressive-profile > .UF-form-container > form ul { opacity: 0; transition: .25s ease; visibility: hidden } .mids-progressive-profile > .UF-form-container > form.showing-loading-spinner .loading-layer { display: block !important } .mids-progressive-profile > .UF-form-container.reveal-mids-form > form ul { opacity: 1; visibility: visible } .mids-progressive-profile.show-email-only-view .mids-pp-hidden.initial-field { display: none } .mids-progressive-profile.show-email-only-view .mids-pp-hidden.display-email-field { display: block } .mids-progressive-profile .mids-pp-hidden { box-shadow: none; display: none; opacity: 1; transition: opacity .25s ease,visibility .25s ease; visibility: visible } .mids-progressive-profile .mids-pp-hidden.display-email-field, .mids-progressive-profile .mids-pp-hidden.initial-field { display: block } .mids-progressive-profile .mids-pp-hidden [name], .mids-progressive-profile .mids-pp-hidden input, .mids-progressive-profile .mids-pp-hidden select { box-shadow: none !important } .mids-progressive-profile .mids-pp-hidden.display-email-field { position: relative } .mids-progressive-profile .mids-pp-hidden.display-email-field:after { background: url(../../../content/dam/servicenow-assets/public/en-us/images/global/loading-icon.svg) no-repeat; background-size: 100%; content: ""; display: block; height: 3rem; margin-top: 1.5rem; opacity: 0; position: absolute; right: 1.5rem; top: 0; visibility: hidden; width: 3rem } .mids-progressive-profile.loading-form-view .mids-pp-hidden:not(.display-email-field) { opacity: 0; visibility: hidden } .mids-progressive-profile.loading-form-view .mids-pp-hidden.display-email-field:after { animation: spinning-circle 2s linear infinite; opacity: 1; visibility: visible } .mids-progressive-profile .disable-btn { opacity: .8; pointer-events: none } .edit .component-achievements.manage-profile .header-controls { display: flex } .edit .component-achievements.manage-profile .manage-profile-tagline { display: block } .preview .component-achievements .title-content, .public .component-achievements .title-content { max-width: 100% } .component-achievements.error .header-content, .preview .getting-started, .public .getting-started { display: none } .component-achievements { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; color: #293e40; font-weight: 400; margin-bottom: 80px; width: 100% } .component-achievements .horizontal-rule { margin-left: 0; margin-right: 0 } .component-achievements .header-content { display: flex; flex-direction: column; margin-bottom: 4rem } .component-achievements .achievements-tabbed-content { margin: 0 -20px; padding-top: 0 } .component-achievements .title-content { margin-bottom: 30px } .component-achievements .header-title { color: inherit; font-size: 2.2rem; line-height: 3.4rem } .component-achievements .header-title .achievements-name { color: inherit; font-size: inherit } .component-achievements .tagline { color: inherit; line-height: 2.3rem } .component-achievements .getting-started-tagline { display: none } .component-achievements.getting-started .getting-started-tagline { display: block } .component-achievements.getting-started .header-title { margin-bottom: 1.8rem } .component-achievements.getting-started .title-content { max-width: 100% } .component-achievements .manage-profile-tagline { display: none; line-height: 2.3rem } .component-achievements .header-controls { align-items: flex-start; display: none; flex-direction: column } .component-achievements .public-toggle { font-size: 1.8rem } .component-achievements .cta-btn-settings { align-items: center; display: flex; font-family: GilroyBold; font-size: 1.4rem; margin-top: 2rem } .component-achievements .cta-btn-settings .icon-sprite { color: #81b5a1; height: 22px; margin-right: 10px; padding-left: 0; padding-right: 0; width: 22px } @media only screen and (min-width: 768px) { .component-achievements .achievements-tabbed-content { margin: 0 -40px; padding-top: 0 } .component-achievements .header-content { flex-direction: row; justify-content: space-between; margin: 0; padding-left: 0; padding-right: 0 } .component-achievements .tagline { margin-bottom: 0 } .component-achievements .header-controls { align-items: flex-end; min-width: 300px } } @media only screen and (min-width: 1024px) { .component-achievements .achievements-tabbed-content { margin: 0; padding-top: 3rem } .component-achievements .title-content { margin-bottom: 0; max-width: 535px } .component-achievements .header-title { font-size: 2.8rem; line-height: 2.2rem; margin-bottom: 2.5rem } .component-achievements .cta-btn-settings, .component-achievements .public-toggle, .component-achievements .tagline { font-size: 1.8rem } .component-achievements .cta-btn-settings { margin-top: 2.6rem } } @media only screen and (min-width: 1200px) { .component-achievements .title-content { margin-bottom: 20px; max-width: 790px } .component-achievements .header-title { line-height: 3.6rem; margin-bottom: 4rem } } .getting-started .achievements-getting-started { display: block } .achievements-getting-started { background: #68a1af; background: linear-gradient(45deg,#68a1af 85%,#293e40 0,#293e40); color: #fff; display: none; margin-top: 4rem; padding: 30px 10.5% 40px; width: 100% } .achievements-getting-started .card, .achievements-getting-started h3, .achievements-getting-started h4, .achievements-getting-started p { color: inherit } .achievements-getting-started .header-content { display: flex; flex-direction: column; justify-content: space-between } .achievements-getting-started .main-icon { align-self: center; height: 120px; margin-bottom: 2rem; width: 220px } .achievements-getting-started .main-icon-img { width: inherit } .achievements-getting-started .title-content { max-width: 100% } .achievements-getting-started .header-title { font-size: 2.2rem } .achievements-getting-started .heading { font-size: 1.6rem; line-height: 2.6rem; margin-top: 1.2rem } .achievements-getting-started .tagline { font-family: GilroyBold; font-size: 1.6rem; line-height: 2.3rem; margin-bottom: 2rem; margin-top: 1.5rem } .achievements-getting-started .body-content { display: flex; flex-direction: column; justify-content: stretch } .achievements-getting-started .card { display: flex; flex-direction: row; margin-bottom: 2rem; margin-right: 0; width: 100% } .achievements-getting-started .card-content { display: flex; flex-direction: column; height: 100% } .achievements-getting-started .icon-badge { align-self: flex-start; height: 50px; margin-right: 1rem; width: 50px } .achievements-getting-started .badge-img { height: inherit; width: inherit } .achievements-getting-started .body { flex-grow: 1; line-height: 2rem; margin-bottom: 1.5rem; margin-top: .5rem } .achievements-getting-started .cta-btn-arrow { align-self: flex-start; color: inherit; display: inline-block; height: 30px; margin-top: 1rem; width: 30px } @media only screen and (min-width: 768px) { .achievements-getting-started { background: linear-gradient(45deg,#68a1af 79.8%,#293e40 0,#293e40); padding: 50px 8% } .achievements-getting-started .body-content { flex-direction: row; flex-wrap: wrap } .achievements-getting-started .header-content { flex-direction: row; justify-content: flex-start } .achievements-getting-started .title-content { margin-right: 2.6rem; max-width: 40% } .achievements-getting-started .main-icon { align-self: flex-start; height: auto; margin-left: 3.8rem; margin-right: 10rem; width: 220px } .achievements-getting-started .icon-badge { margin-right: 1.8rem } .achievements-getting-started .card { margin-right: 2.8rem; max-width: 40% } } @media only screen and (min-width: 1024px) { .achievements-getting-started { background: linear-gradient(45deg,#68a1af 86%,#293e40 0,#293e40); padding: 80px 8.4% } .achievements-getting-started .body-content { flex-wrap: nowrap; padding-bottom: 4rem; position: relative } .achievements-getting-started .header-content { justify-content: space-between } .achievements-getting-started .header-content .title-content { max-width: 52% } .achievements-getting-started .main-icon { height: 140px; margin: 0; width: 277px } .achievements-getting-started .header-title { font-size: 3.6rem; line-height: 4.6rem; margin: 0 } .achievements-getting-started .heading { font-size: 1.8rem } .achievements-getting-started .tagline { font-size: 1.4rem; line-height: 3rem } .achievements-getting-started .card { flex-direction: column; margin-right: 4.5rem; width: 33% } .achievements-getting-started .card:last-child { margin-right: 0 } .achievements-getting-started .icon-badge { height: 70px; margin-bottom: 1rem; margin-right: 0; width: 70px } .achievements-getting-started .body { line-height: 2.3rem } .achievements-getting-started .cta-btn-arrow { bottom: 0; height: 53px; position: absolute; width: 53px } } .achievements-edit-overlay { color: #293e40 } .achievements-edit-overlay .cancel-btn { margin-left: 3rem } .achievements-edit-overlay .horizontal-rule { margin-left: 0; margin-right: 0 } .achievements-edit-overlay .header-controls { display: flex; flex-direction: column; justify-content: space-between; margin: 2.8rem .6rem } .achievements-edit-overlay .toggle-button { margin-top: 1.4rem } .achievements-edit-overlay .champions-achievements { margin: 0 -30px } .achievements-edit-overlay .champions-achievements .tab-link:first-child { margin-left: 3.6rem } .achievements-edit-overlay .badge-row-container.row-content { align-items: flex-start; border-bottom: 1px solid #c8c8c8; display: flex; flex-direction: column; justify-content: stretch; margin: 0 3.6rem; padding: 3rem 0; position: relative } .achievements-edit-overlay .badge-row-container.row-content .left-column { margin-right: 10.4rem; max-width: -moz-fit-content; max-width: fit-content } .achievements-edit-overlay .badge-row-container.row-content .mid-column { max-width: 100% } .achievements-edit-overlay .badge-row-container.row-content .right-column { position: absolute; right: 0; top: 2.8rem } .achievements-edit-overlay .badge-icon { height: 50px; margin-bottom: 1rem; width: 50px } .achievements-edit-overlay .badge-icon-img { height: 100%; width: 100% } .achievements-edit-overlay .privacy-info { align-items: flex-start; display: flex; flex-direction: column; flex-grow: 1 } .achievements-edit-overlay .badge-title { font-family: GilroyBold; margin: 0 8rem 0 0 } .achievements-edit-overlay .earned-on { font-family: GilroySemibold; margin-top: 2rem; opacity: .6 } .achievements-edit-overlay .reveal-more-btn.btn { background: none; display: flex; font-size: 1.4rem; justify-content: center; width: 100% } .achievements-edit-overlay .reveal-more-btn.btn .show-count { font-size: inherit } @media only screen and (min-width: 768px) { .achievements-edit-overlay .achievements-tabbed-content { padding-top: 0 } .achievements-edit-overlay .toggle-button { margin-top: 0 } .achievements-edit-overlay .champions-achievements { margin: 0 } .achievements-edit-overlay .champions-achievements .tab-link:first-child { margin-left: 0 } .achievements-edit-overlay .badge-row-container.row-content { align-items: center; flex-direction: row; margin: 0; padding: 2rem 0 } .achievements-edit-overlay .badge-row-container.row-content .badge-title { font-size: 1.8rem } .achievements-edit-overlay .badge-row-container.row-content .privacy-info { align-items: flex-start } .achievements-edit-overlay .badge-row-container.row-content .left-column { margin-right: 4rem } .achievements-edit-overlay .badge-row-container.row-content .right-column { left: 0; position: relative; top: 0 } .achievements-edit-overlay .header-controls { flex-direction: row } .achievements-edit-overlay .badge-icon { margin-bottom: 0 } .achievements-edit-overlay .reveal-more-btn.btn { margin-bottom: 1.6rem; margin-top: 4rem } } @media only screen and (min-width: 1024px) { .achievements-edit-overlay .achievements-tabbed-content { padding-top: 0 } .achievements-edit-overlay .badge-row-container.row-content { padding: 1.5rem 0 } .achievements-edit-overlay .badge-row-container.row-content .privacy-info { align-items: center; flex-direction: row; justify-content: space-between; margin-right: 6.4rem } .achievements-edit-overlay .earned-on { white-space: nowrap; width: 200px } .achievements-edit-overlay .badge-title { font-size: 18px; margin-right: 0; max-width: 220px } .achievements-edit-overlay .badge-icon { height: 80px; width: 80px } .achievements-edit-overlay .reveal-more-btn.btn { font-size: 1.8rem; margin-bottom: 1rem } } @media only screen and (min-width: 1200px) { .achievements-edit-overlay .badge-row-container.row-content .privacy-info { margin-right: 12.4rem } .achievements-edit-overlay .badge-row-container.row-content .badge-title { font-size: 18px; max-width: 350px } } .manage-profile { color: #293e40 } .manage-profile .achievements-edit { display: block } .edit .achievements-edit .badge-container { cursor: pointer } .edit .achievements-edit .badge-container:hover > .badge-content { left: 0; top: -2.4rem; z-index: 1 } .edit .achievements-edit .badge-container:hover > .badge-content .badge-icon-img { filter: drop-shadow(0 0 15px rgba(0,0,0,.6)) } .edit .achievements-edit .badge-container:hover > .badge-content > .badge-info { display: block } .achievements-edit { display: none } .achievements-edit .tabbed-content { background: rgba(104,161,175,.2); padding-bottom: 1rem } .achievements-edit .badge-row-container { display: flex; flex-wrap: wrap; padding: 0; width: 100% } .achievements-edit .badge-container { display: flex; margin: 5.5rem 2rem; position: relative; width: calc(50% - 40px) } .achievements-edit .badge-content { align-items: center; display: flex; flex-direction: column; text-align: center; width: 100% } .achievements-edit .badge-icon { height: 7.2rem; margin-bottom: 1rem; width: 7.2rem } .achievements-edit .badge-icon-img { height: 100%; width: 100% } .achievements-edit .badge-title { color: inherit; font-family: GilroyBold; font-size: 1.4rem; line-height: 2.3rem } .achievements-edit .badge-info { display: none; text-align: center } .achievements-edit .earned-on { color: inherit; margin-bottom: 0 } .achievements-edit .profile-type:before { background: #64ddac; border-radius: 50%; content: ""; display: inline-block; height: 10px; margin-right: 10px; margin-top: 15px; width: 10px } .achievements-edit .profile-type.public:before { background: #64ddac } .achievements-edit .profile-type.private:before { background: #ccc } @media only screen and (min-width: 768px) { .achievements-edit .tabbed-content { background: none; padding-bottom: 0 } .achievements-edit .badge-row-container { background: rgba(104,161,175,.2); flex-wrap: nowrap; padding: 6rem 5.3rem } .achievements-edit .badge-container { margin-bottom: 0; margin-top: 0; min-height: 15.5rem; width: calc(25% - 40px) } .achievements-edit .badge-container:hover > .badge-content { top: -3.4rem } } @media only screen and (min-width: 1024px) { .achievements-edit .badge-row-container { margin-bottom: 1rem; padding-bottom: 4rem; padding-top: 6rem } .achievements-edit .badge-row-container:hover > .badge-content { top: -1.4rem } .achievements-edit .badge-container { min-height: 22rem } .achievements-edit .badge-icon { height: 10.4rem; width: 10.4rem } .achievements-edit .badge-title { font-size: 2.2rem; line-height: 2.8rem; max-width: 238px } } .achievements-edit .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-wrapper ul { padding: 0 } .component-champions-overlay { bottom: 0; left: 0; overflow: auto; position: fixed; right: 0; top: 0; z-index: 1001 } .component-champions-overlay.disable { display: none } .component-champions-overlay .overlay-content-wrapper, .component-champions-overlay .overlay-outer-wrapper { padding: 0; width: 100% } .component-champions-overlay .overlay-outer-wrapper { background-color: #293e40; display: flex; justify-content: center; opacity: .3 } .component-champions-overlay .overlay-content-wrapper { background: #fff; height: 100%; overflow-y: auto } .component-champions-overlay .overlay-close-icon { cursor: pointer; height: 1.6rem; position: absolute; right: 2rem; top: 3.2rem; width: 1.6rem } .component-champions-overlay .overlay-close-icon:hover { opacity: 1 } .component-champions-overlay .overlay-close-icon:after, .component-champions-overlay .overlay-close-icon:before { background-color: #fff; content: " "; height: 1.6rem; left: 1rem; position: absolute; width: .2rem } .component-champions-overlay .overlay-close-icon:before { transform: rotate(45deg) } .component-champions-overlay .overlay-close-icon:after { transform: rotate(-45deg) } .component-champions-overlay .overlay-content-inner-wrapper .overlay-title-wrapper { background-color: #81b5a1 } .component-champions-overlay .overlay-content-inner-wrapper .overlay-title { -webkit-margin-after: 0; -webkit-margin-before: 0; color: #fff; margin-block-end: 0; margin-block-start: 0; margin-left: 2rem; padding-bottom: 2.4rem; padding-top: 2.4rem; width: 80% } .component-champions-overlay .overlay-content-inner-wrapper .overlay-progress-text-content { padding: 0 2rem } .component-champions-overlay .overlay-content-inner-wrapper hr { border: .5px solid #e1e1e1; margin-bottom: 3.1rem } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { align-items: center; background: #293e40; cursor: pointer; display: flex; font-family: gilroyBold; height: 4rem; justify-content: center; line-height: 1.3; margin: 0 auto; width: 100% } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn + .cta-component { margin-top: 2rem } .component-champions-overlay .overlay-footer { padding-bottom: 3rem; text-align: center } .component-champions-overlay .cancel-btn { position: relative } .component-champions-overlay .cancel-btn:before { content: ""; display: block; height: 100%; position: absolute; width: 100%; z-index: 1 } .component-champions-overlay .hide { display: none !important } @media only screen and (min-width: 768px) { .component-champions-overlay { display: flex; justify-content: center } .component-champions-overlay .overlay-outer-background { background: #293e40; height: 100%; opacity: .7; width: 100% } .component-champions-overlay .overlay-content-wrapper { bottom: 0; height: inherit; margin: 7.2rem 0; overflow: visible; position: absolute; top: 0 } .component-champions-overlay .overlay-close-icon { right: -2.4rem; top: -2.4rem } .component-champions-overlay .overlay-close-icon:after, .component-champions-overlay .overlay-close-icon:before { background-color: #fff } .component-champions-overlay .overlay-content-inner-wrapper { height: 100%; overflow-y: auto } .component-champions-overlay .overlay-content-inner-wrapper h2 { font-size: 2.8rem; padding-bottom: 4.7rem; padding-left: 4rem; padding-top: 4.7rem; text-align: inherit } .component-champions-overlay .overlay-content-inner-wrapper .items-group { margin: 0 4rem } .component-champions-overlay .overlay-content-inner-wrapper .overlay-text-content { flex-direction: row; justify-content: flex-start; margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 0; padding-top: 3rem } .component-champions-overlay .overlay-content-inner-wrapper .overlay-text-content .overlay-text-content { display: flex; justify-content: space-between; padding-bottom: 3.2rem; padding-top: 0; text-align: left } } @media only screen and (min-width: 1024px) { .component-champions-overlay .overlay-footer { padding: 0 0 4rem } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { font-size: 1.8rem } .component-champions-overlay .overlay-content-inner-wrapper hr { margin-bottom: 4.1rem } .component-champions-overlay .overlay-content-inner-wrapper .overlay-text-content { padding-top: 8rem } .component-champions-overlay .overlay-content-inner-wrapper .overlay-title { font-size: 3.6rem } .component-champions-overlay .overlay-content-inner-wrapper h2 { padding-bottom: 5.9rem; padding-top: 5.9rem } } @media only screen and (min-width: 1700px) { .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { font-size: 1.8rem } .component-champions-overlay .overlay-content-inner-wrapper h2 { font-size: 3.6rem; padding-bottom: 5.6rem; padding-left: 4rem; padding-top: 5.6rem } .component-champions-overlay .overlay-content-inner-wrapper .overlay-text-content { align-items: center; padding: 8rem 0 0 } .component-champions-overlay .overlay-content-inner-wrapper .items-list { width: 100% } .component-champions-overlay .overlay-footer { padding-bottom: 8rem } } .component-reveal-more { display: flex; flex-direction: column; margin-bottom: 24px } .component-reveal-more .reveal-more-btn { align-self: center; border: none; color: #293e40; cursor: pointer; display: flex; flex-direction: row; font-family: GilroySemiBold; font-size: 1.4rem; margin: 36px auto; outline: none; padding: 0; position: relative } .component-reveal-more .reveal-more-btn .icon-sprite { align-self: center; height: 14px; margin-left: 10px; width: 14px } .component-reveal-more .reveal-more-btn:before { content: ""; height: 100%; left: 0; margin: 0; position: absolute; width: 100%; z-index: 1 } .component-reveal-more .reveal-more-btn .show-count { font-family: GilroyRegular; font-size: inherit; margin-right: 14px } .component-reveal-more .hide { display: none !important } @media only screen and (min-width: 768px) { .component-reveal-more .reveal-more-btn { font-size: 1.8rem } } .toggle-button { align-items: center; display: flex } .toggle-button .toggle-label { color: inherit } .toggle-button .toggle-label + .toggle-switch, .toggle-button .toggle-switch + .toggle-label { margin-left: 20px } .toggle-button .toggle-switch { -webkit-appearance: none; background-color: rgba(41,62,64,.3); border: 0; border-radius: 4.3rem; cursor: pointer; height: 2rem; margin: 0; outline: none; position: relative; width: 4.2rem } .toggle-button .toggle-switch:after { background-color: #fff; border-radius: 100%; content: ""; display: block; height: 1.4rem; margin: 3px; transition: .3s; width: 1.4rem } .toggle-button .toggle-switch:checked { background-color: #81b5a1 } .toggle-button .toggle-switch:checked:after { transform: translateX(2.1rem) } .toggle-button .toggle-switch:focus { outline-color: transparent } @media only screen and (min-width: 1024px) { .toggle-button .toggle-switch { height: 2.8rem; width: 5.8rem } .toggle-button .toggle-switch:after { height: 2.2rem; margin: 3px; width: 2.2rem } .toggle-button .toggle-switch:checked:after { transform: translateX(2.9rem) } } .component-now-creators-common .main-content { padding-left: .5rem; padding-right: .5rem } .component-now-creators-common .flex-box-container { justify-content: center } .component-now-creators-common .side-nav { color: #293e40; margin-bottom: 4rem } .component-now-creators-common .side-nav .sidebar-container { margin-left: -2rem; margin-right: -2rem } .component-now-creators-common .side-nav .side-nav-item { align-items: center; border-bottom: 1px solid #c8c8c8; cursor: pointer; display: flex; font-family: GilroyBold; font-size: 1.4rem; line-height: 2.8rem; padding: 2.4rem 2rem; width: 100% } .component-now-creators-common .side-nav .side-nav-label { color: inherit; font-family: inherit; font-size: inherit; line-height: inherit } .component-now-creators-common .side-nav .sidebar-icon { color: #81b5a1; height: 2.2rem; margin-right: 1.5rem; width: 2.6rem } .component-now-creators-common .side-nav .icon-sprite { height: inherit; width: inherit } .component-now-creators-common .hide { display: none !important } .component-now-creators-common button { background: none; border: none; color: currentColor; cursor: pointer; margin: 0; outline: none; padding: 0 } .component-now-creators-common .row-content { align-items: center; border-bottom: 1px solid #ccc; display: flex; justify-content: space-between; padding: 30px 0 } .component-now-creators-common .row-content .left-column { max-width: 40% } .component-now-creators-common .row-content .mid-column { max-width: 60% } .component-now-creators-common .row-content .right-column { text-align: right } @media only screen and (min-width: 768px) { .component-now-creators-common .main-content { padding-left: 1.5rem; padding-right: 1.5rem } .component-now-creators-common .side-nav .sidebar-container { display: flex; margin-left: -3rem; margin-right: -3rem } .component-now-creators-common .side-nav .side-nav-item { font-size: 1.6rem; justify-content: center } .component-now-creators-common .side-nav .side-nav-item:first-child { border-right: 1px solid #c8c8c8 } } @media only screen and (min-width: 1024px) { .component-now-creators-common .main-content { padding-left: 2rem; padding-right: 2rem } .component-now-creators-common .side-nav { flex-basis: 100%; max-width: 100% } .component-now-creators-common .side-nav .sidebar-container { margin-left: -4rem; margin-right: -4rem } .component-now-creators-common .side-nav .side-nav-item { font-size: 1.8rem } } @media only screen and (min-width: 1200px) { .component-now-creators-common { margin-top: 8.4rem } .component-now-creators-common .main-content { flex-basis: 75%; max-width: 75% } .component-now-creators-common .side-nav { flex-basis: 25% } .component-now-creators-common .side-nav .sidebar-container { flex-direction: column; margin-left: 0; margin-right: 0 } .component-now-creators-common .side-nav .side-nav-item { justify-content: flex-start; line-height: 3rem; padding-left: 0; padding-right: 0 } .component-now-creators-common .side-nav .side-nav-item:first-child { border-right: 0; border-top: 1px solid #c8c8c8 } } .component-now-creators-milestones { position: relative } .component-now-creators-milestones .tabs-background-white { background: #fff } .component-now-creators-milestones .tabs-background-transparent { background: transparent } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-outer-wrapper { padding: 0 } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper { padding: 3rem 0 } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper { padding: 0 1rem } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .horizontal-tabs-wrapper ul { overflow-y: hidden } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .tabs .tab-link { margin-right: 3rem } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .tabs .tab-link.current { font-family: GilroyBold } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .content { padding-top: 6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .tabbed-content-wrapper { display: none } .component-now-creators-milestones .tabbed-content-outer-wrapper .tabbed-content-wrapper.current { display: block } .component-now-creators-milestones .tabbed-content-outer-wrapper .text-content { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial { padding-top: 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper { padding: 0 2rem 1rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .percentage, .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .text-content { display: block } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper { padding: 2rem 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { font-family: gilroyBold; font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-percentage { width: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-percentage-tip { left: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .label-copy { font-family: GilroyRegular } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper { display: none } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-left { margin-bottom: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-head { padding: 3rem 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper { border-bottom: 1px solid #e1e1e1; padding-bottom: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper.all-done .progress-level-body-progress-item { background: #81b5a1 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper.all-done .progress-level-body-progress-item .progress-level-body-progress-item-title { color: #fff } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper.all-done .progress-level-body-progress-item .milestone-completed-text { color: #293e40 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper.all-done .progress-level-body-progress-item .milestone-icon.check { background: url(../../../content/dam/servicenow-assets/images/unauthorable/completed-white-circle.svg); background-size: contain } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper .progress-level-body-progress-item:first-child:after { border: 1px solid #c8c8c8; border-radius: 100px; content: ""; display: none; height: 9px; left: -3.8rem; position: absolute; top: 46%; width: 9px } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper .progress-level-body-progress-item:first-child:before { border: .5px solid #c8c8c8; content: ""; display: none; left: -3rem; position: absolute; top: 48%; width: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:last-child .progress-level-body-wrapper { border-bottom: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level { background: rgba(104,161,175,.2) } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level .milestone-completed-text { color: rgba(41,62,64,.6) } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level .progress-level-body-progress-item-title { color: #fff } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level .progress-level-body-wrapper { border-bottom: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head { margin-bottom: 1.4rem; padding-bottom: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title-content { display: flex; justify-content: space-between; width: 100% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-icon-text, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title { align-items: center; display: flex } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle { display: inline; margin: 1.1rem 0 2rem auto; max-width: 13rem; text-align: right } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title-text { font-size: 2rem; margin-right: 1.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle-text { font-size: 1.4rem; margin-right: .5rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle-text, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle-value { font-family: GilroyBold } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-icon { margin-right: 1.9rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-icon img { height: auto; width: 6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { align-items: center; border: .2rem solid #81b5a1; border-radius: 2rem; color: #81b5a1; display: flex; font-family: GilroyBold; font-size: 1.2rem; height: 3.1rem; padding: 0 2rem; text-transform: uppercase; width: 10rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-about-text { margin-top: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-wrapper { display: flex; overflow-y: auto; overflow: visible } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-wrapper .progress-level-body-progress-item:hover { box-shadow: 0 25px 39px 6px rgba(41,62,64,.23) } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-wrapper:not(.all-done) .progress-level-body-progress-item:hover { background: #68a1af !important } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-wrapper:not(.all-done) .progress-level-body-progress-item:hover .milestone-completed-text, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-wrapper:not(.all-done) .progress-level-body-progress-item:hover .milestone-eyebrow-text, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-wrapper:not(.all-done) .progress-level-body-progress-item:hover .progress-level-body-progress-item-title { color: #fff } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body { overflow: auto; padding: 0 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body .slider-pagination { display: none } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item { background: #dbebee; border-bottom-right-radius: 3rem; cursor: pointer; margin-left: 0; margin-right: 2rem; min-height: 11.5rem; padding: 0; position: relative; width: 26rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:not(:first-child) { border-left: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item hr, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:after, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:before { display: none } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper { align-items: left; display: flex; flex-direction: column; padding: 1.5rem 2rem; width: 26rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper .milestone-icon { bottom: 2rem; height: 4rem; position: absolute; right: 2rem; width: 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper .milestone-icon.arrow { background: url(../../../content/dam/servicenow-assets/images/unauthorable/arrowinwhitecircle.svg); background-size: contain } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper .milestone-icon.check { background: url(../../../content/dam/servicenow-assets/images/unauthorable/check.svg); background-size: contain } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { font-family: GilroyBold; letter-spacing: .2rem; opacity: .6; text-transform: uppercase } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { font-family: GilroyBold; margin-bottom: 7.9rem; margin-right: 2.6rem; margin-top: 2.3rem; text-align: left } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-completed-text { bottom: 3.2rem; font-family: gilroyBold; left: 2rem; position: absolute } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-overlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-item-completed { font-size: 1.6rem; list-style-type: none; position: relative } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-item-completed .milestone-completed-text { color: #81b5a1 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-item-completed .milestone-arrow { bottom: 2rem; height: 4rem; position: absolute; right: 2rem; width: 4rem } @media only screen and (min-width: 768px) { .component-now-creators-milestones .horizontal-tabs-wrapper { padding: 0 1.5rem } .component-now-creators-milestones .horizontal-tabs-wrapper .tab-link { margin: 0 3rem 0 0 } .component-now-creators-milestones .title h2 { font-size: 2.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper, .component-now-creators-milestones .tabbed-content-outer-wrapper .component-tabbed-component-inner-wrapper { padding: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .component-tabbed-component-inner-wrapper .tabbed-content { padding: 6rem 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .component-progress-bar .progress-bar { margin: 1rem 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial { padding-bottom: 0 2rem 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .label-copy { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head { align-items: center; display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 0; padding-left: 0; padding-right: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-head-title-text { font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-head-icon-text { padding-bottom: 1rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-head-flag { font-size: 1.4rem; width: 11rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-about-text { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-left { align-items: flex-end; flex-direction: row; width: 100% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { height: -moz-fit-content; height: fit-content; margin-bottom: 0; margin-left: 1.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { font-size: 1rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item { margin-right: 3rem; width: calc(25% - 25px) } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item hr { border: .5px solid #c8c8c8; display: block; left: 100%; position: absolute; top: 44%; width: 100% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:last-child { margin-right: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:last-child hr { display: none } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { font-size: 1.4rem; line-height: 2.72rem; margin-bottom: 5.9rem; margin-right: 0; margin-top: 1.1rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle { max-width: 19rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper { padding: 2rem; width: auto } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper .milestone-completed-text { bottom: 3rem; margin-left: -.9rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper .milestone-icon { height: 3.4rem; width: 3.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-completed-text { bottom: 3rem; font-size: 1.2rem; left: 2rem; line-height: 1.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper.default-padding, .component-now-creators-milestones .tabbed-content-outer-wrapper.padding-40, .component-now-creators-milestones .tabbed-content-outer-wrapper.padding-80 { padding-bottom: 4rem; padding-top: 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .horizontal-tabs-wrapper li { margin-right: 2.4rem; padding: 2.4rem 0 1.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .content { padding-top: 2.4rem } } @media only screen and (min-width: 1024px) { .component-now-creators-milestones.default-padding { padding-bottom: 6.4rem; padding-top: 6.4rem } .component-now-creators-milestones.padding-40 { padding-bottom: 4rem; padding-top: 4rem } .component-now-creators-milestones.padding-80 { padding-bottom: 8rem; padding-top: 8rem } .component-now-creators-milestones .content { padding-top: 8rem } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .tabbed-content { padding: 8rem 0 } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .tabs .tab-link { margin-right: 4rem } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .tabs .tab-link .tab-name { font-size: 1.8rem } .component-now-creators-milestones.component-tabbed-component .component-tabbed-component-inner-wrapper .content { padding-top: 8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { font-size: 1.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial { display: flex; padding: 2rem 2rem 8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .text-content { font-size: 1.4rem; padding-top: 0; width: 85% } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper { padding-bottom: 0; padding-top: 8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .progress-level-head-left { margin-bottom: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper { display: flex } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-image img { margin-right: 4rem; width: 16.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-message { font-family: GilroyBold; font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-by { color: rgba(41,61,64,.6); display: block; font-family: GilroyBold; font-size: 1.2rem; letter-spacing: 1.83px; padding-top: 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper h2 { padding-bottom: 5.9rem; padding-top: 5.9rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper .activity-items .completed-status .completed-status-icon { height: 4.3rem; width: 4.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title-text { font-size: 1.8rem; line-height: 3.06rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-icon img { height: auto; width: 5rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item { flex-grow: 0; flex-shrink: 0; margin-left: 2rem; margin-right: 0; min-height: 15rem; width: calc(25% - 20px) } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:first-child:after, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:first-child:before { display: inline-block !important } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper { display: flex; justify-content: space-between } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-head { margin-bottom: 0; padding: 4rem 2rem; width: 25.6% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-head .progress-level-head-flag { font-size: 1.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-body { align-items: center; display: flex; overflow: visible; padding-right: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-body, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-head { border-bottom: 1px solid #e1e1e1; padding-bottom: 4rem; padding-top: 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-body-wrapper { border-bottom: 0; padding-bottom: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .milestone-completed-text { bottom: 3rem; font-size: 1.2rem; left: 3rem; line-height: 1.2rem; margin-left: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-head { padding: 8rem 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level .progress-level-body, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level .progress-level-head, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:last-child .progress-level-body, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:last-child .progress-level-head { border-bottom: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-icon-text, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title-content { align-items: flex-start; display: flex; flex-direction: column } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title .progress-level-head-title-text { font-size: 2.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle { margin: 1.1rem auto 1.1rem 0; text-align: left } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle span { font-family: GilroyBold; font-size: 1.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper { padding: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { margin-left: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-image { padding-bottom: .8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-image img { height: 11.4rem; width: 14.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-about-text { font-size: 1.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .component-progress-bar .progress-bar { margin: 2rem 0 } } @media only screen and (min-width: 1700px) { .component-now-creators-milestones { padding: 0 } .component-now-creators-milestones.default-padding { padding-bottom: 8rem; padding-top: 8rem } .component-now-creators-milestones .content { padding-top: 8rem } .component-now-creators-milestones .component-tabbed-component-outer-wrapper { padding: 0 } .component-now-creators-milestones .component-tabbed-component-outer-wrapper .component-tabbed-component-inner-wrapper { padding: 6rem 0 4rem } .component-now-creators-milestones .component-tabbed-component-outer-wrapper .component-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-name { font-size: 1.8rem } .component-now-creators-milestones .component-tabbed-component-outer-wrapper .component-tabbed-component-inner-wrapper .horizontal-tabs-list .tabbed-content { padding: 8rem 0 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial { padding-bottom: 8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar { margin: 2rem 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper { padding-top: 8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .text-content { width: 65% } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-image img { width: 18.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-message { font-size: 2.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-by { padding-top: 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-wrapper { padding: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .milestone-icon { height: 4rem; width: 4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-item-inner-wrapper { border-bottom: 1px solid #e1e1e1 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-item-inner-wrapper .progress-level-body, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-item-inner-wrapper .progress-level-head { border-bottom: none } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:first-child.completed-level .progress-level-item-inner-wrapper, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:last-child, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item:last-child .progress-level-item-inner-wrapper { border-bottom: 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper .progress-level-body-progress-item hr { top: 50% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper .progress-level-body-progress-item:first-child:before { margin-top: .6rem; top: 50% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item .progress-level-body-wrapper .progress-level-body-progress-item:first-child:after { margin-top: .2rem; top: 50% !important } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-head { margin: 0; padding: 4rem 2rem; width: 28.7% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-body { border-bottom: 3.2rem; padding: 4rem 0 4rem 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-head-title .progress-level-head-title-text { font-size: 2.2rem; padding: 2rem 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .progress-level-head-subtitle { font-size: 1.4rem; margin: 0 auto 4rem 0 } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-about-text { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title-text { padding-bottom: 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-completed-text { font-size: 1.4rem; left: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper h2 { padding-bottom: 5.6rem; padding-left: 4rem; padding-top: 5.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper .milestone-status { line-height: 1.5 } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper .overlay-text-content { align-items: center } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper .overlay-progress-text-content { padding-top: 8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-overlay .overlay-content-inner-wrapper .items-list { width: 100% } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-icon img { height: auto; width: 8.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item { margin-left: 0; margin-right: 4rem; min-height: 17.5rem; width: calc(25% - 30px) } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item .progress-level-body-progress-item-title { font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:first-child:after { left: -7.8rem !important; top: 46.4% !important } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item:first-child:before { left: -7rem !important; width: 7rem !important } } .your-progress-overlay .your-progress-overlay-content { padding: 0 1rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { padding-bottom: 1.5rem; padding-top: 2.9rem } .your-progress-overlay .your-progress-overlay-content .milestone-status { border: 2px solid #81b5a1; border-radius: 3.2rem; display: inline-block; font-family: gilroySemibold; margin-bottom: 4rem; padding: .6rem 2.2rem } .your-progress-overlay .your-progress-overlay-content hr { border: .5px solid #e1e1e1; margin: 0 !important } .your-progress-overlay .your-progress-overlay-content .activity-items { padding: 3rem 0 } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title { line-height: 1.6; padding-bottom: 1.6rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list { padding-top: 2.2rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list.all-done .check { background: url(../../../content/dam/servicenow-assets/images/unauthorable/completed-white-circle.svg) !important; background-size: contain !important } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list .activity-item { background: rgba(104,161,175,.2); display: block } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list.all-done .activity-item { background: #81b5a1 } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list.all-done .activity-item-description, .your-progress-overlay .your-progress-overlay-content .activity-items .items-list.all-done .activity-item-title { color: #fff } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list .condition-div { align-items: center; display: flex; justify-content: center } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list .condition-div:last-child { display: none } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list .condition-div span { font-family: GilroyBold; margin: .8rem 2.4rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list .condition-div hr { border: 0; border-bottom: .05rem solid #e1e1e1; border-top: .05rem solid #e1e1e1; display: inline-block; flex: 1 1 auto; height: 0; margin: 0 } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item { border-bottom-right-radius: 4rem; padding: 2.2rem 2rem 0; position: relative } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { display: block; font-family: gilroySemibold; line-height: 1.7 } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { display: block; line-height: 1.6; padding-top: 1rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description p { display: inline } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status { align-items: center; display: flex; justify-content: flex-end; padding-bottom: 2rem; padding-top: 1.3rem; width: 100% } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status .completed-status-icon { height: 4.5rem; margin-left: 2rem; width: 4.5rem } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status .completed-status-icon.check { background: url(../../../content/dam/servicenow-assets/images/unauthorable/check.svg); background-size: contain } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status .completed-status-icon.arrow { background: url(../../../content/dam/servicenow-assets/images/unauthorable/arrowinwhitecircle.svg); background-size: contain } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { font-family: gilroySemibold } @media only screen and (min-width: 768px) { .your-progress-overlay { display: flex; justify-content: center } .your-progress-overlay .your-progress-overlay-content { height: 100%; overflow-y: auto; padding: 0 } .your-progress-overlay .your-progress-overlay-content .items-group { margin: 0 4rem } .your-progress-overlay .your-progress-overlay-content .your-progress-title-content { align-items: center; display: flex; justify-content: space-between; padding-bottom: 3rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { padding: 0 } .your-progress-overlay .your-progress-overlay-content .activity-items { display: flex } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title-text { font-size: 1.4rem; line-height: 1.6 } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title { padding-left: 0; padding-right: 3.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list { margin-left: auto; padding: 0 } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item { padding: 3rem } .your-progress-overlay .your-progress-overlay-content .milestone-status { margin-bottom: 0; max-height: 4.6rem; min-width: 18rem; text-align: center } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status { padding-bottom: 0; padding-top: 2.2rem } } @media only screen and (min-width: 1024px) { .your-progress-overlay .your-progress-overlay-content .activity-items { padding: 4rem 0 } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title-text { font-size: 1.8rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { font-family: GilroyBold; font-size: 1.8rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { font-size: 1.4rem } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { font-family: GilroyBold; font-size: 1.4rem } .your-progress-overlay .your-progress-overlay-content .your-progress-title-content { padding: 0 0 4rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { font-size: 2.8rem } } @media only screen and (min-width: 1700px) { .your-progress-overlay .your-progress-overlay-content .your-progress-title-content { padding-bottom: 4rem } .your-progress-overlay .your-progress-overlay-content .your-progress-title-content h5 { font-size: 2.8rem } .your-progress-overlay .your-progress-overlay-content .activity-items { padding: 4rem 0 } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item { padding: 2rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { font-size: 1.8rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { padding: 2rem 0 0 } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { font-size: 1.4rem } .your-progress-overlay .your-progress-overlay-content .milestone-status { font-size: 1.8rem; line-height: 3.06rem } } .your-progress-overlay .your-progress-overlay-content .activity-items .items-list.all-done .activity-item + .activity-item { margin-top: 2rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-link .tab-name { color: rgba(41,62,64,.6); font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .text-content, .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-link.current .tab-name { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { color: #293e40; font-size: 1.6rem; line-height: 2.7rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .label-copy { color: #293e40; font-size: 1.2rem; line-height: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title h5.progress-level-head-title-text { color: #293e40; font-size: 2rem; line-height: 2.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle span { color: rgba(41,62,64,.6); font-size: 1.2rem; line-height: 1.8rem; margin: 1.1rem 0 2rem auto } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { color: #84b6a0; font-size: 1.4rem; line-height: 2.6rem; width: 11rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { color: #293e40; font-size: 1.2rem; line-height: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { color: #293e40; font-size: 1.6rem; line-height: 2.7rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .milestone-completed-text { font-size: 1.4rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { color: #293e40; font-size: 1.6rem; line-height: 2.7rem } .your-progress-overlay .your-progress-overlay-content .milestone-status { color: #81b5a1; font-size: 1.6rem; line-height: 2.6rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title-text { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { font-family: GilroyBold; font-size: 1.6rem; line-height: 2.7rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { font-family: GilroyRegular; font-size: 1.4rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { color: rgba(41,62,64,.6); font-family: GilroyBold; font-size: 1.6rem; line-height: 2.7rem } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { color: #fff; font-family: GilroyBold; font-size: 1.6rem; line-height: 2.7rem } @media screen and (min-width: 768px) { .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .horizontal-tabbed-component-inner-wrapper .tab-name { font-size: 1.4rem } .component-now-creators-milestones .tabbed-content { padding-top: 6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title h5.progress-level-head-title-text { color: #293e40; font-size: 1.8rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-about-text { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle span { color: rgba(41,62,64,.6); font-size: 1.2rem; line-height: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { color: #84b6a0; font-size: 1.4rem; line-height: 2.3rem; width: 11rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { color: #293e40; font-size: 1rem; line-height: 1.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .milestone-completed-text { font-size: 1.2rem; line-height: 1.8rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { color: #293e40; font-size: 1.7rem; line-height: 2.7rem } .your-progress-overlay .your-progress-overlay-content .milestone-status { color: #81b5a1; font-size: 1.5rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title-text { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { font-family: GilroyBold; font-size: 1.6rem; line-height: 2.7rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { font-family: GilroyRegular; font-size: 1.2rem; line-height: 1.8rem } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { color: rgba(41,62,64,.6); font-family: GilroyBold; font-size: 1.6rem; line-height: 1.6rem } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { color: #fff; font-family: GilroyBold; font-size: 1.6rem; line-height: 1.9rem } } @media screen and (min-width: 1024px) { .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-link .tab-name { color: rgba(41,62,64,.6); font-size: 1.8rem; line-height: 2.3rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-link.current .tab-name { color: #293e40; font-size: 1.8rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content { padding-top: 8rem } .component-now-creators-milestones .horizontal-tabs-wrapper .tab-link { margin-right: 4rem } .component-now-creators-milestones .horizontal-tabbed-component-inner-wrapper .tab-name { font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-message { color: #293d40; font-size: 1.8rem; line-height: 2.7rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-by { color: rgba(41,61,64,.6); font-size: 1.2rem; line-height: 1.8rem; margin-left: 1.2rem; text-indent: -1.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .text-content { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { color: #293e40; font-size: 1.8rem; line-height: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .label-copy { color: #293e40; font-size: 1.4rem; line-height: 2.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title h5.progress-level-head-title-text { color: #293e40; font-size: 2.2rem; line-height: 3.4rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle span { color: rgba(41,62,64,.6); font-size: 1.4rem; line-height: 2.3rem; margin: 1.1rem 0 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { color: #84b6a0; font-size: 1.4rem; line-height: 2.6rem; width: 11rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-about-text { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { color: #293e40; font-size: 1rem; line-height: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .milestone-completed-text { font-size: 1.2rem; line-height: 1.8rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { color: #293e40; font-size: 2.8rem; line-height: 3rem; max-width: 65% } .your-progress-overlay .your-progress-overlay-content .milestone-status { color: #81b5a1; font-size: 1.6rem; line-height: 2.6rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title-text { color: #293e40; font-size: 1.8rem; line-height: 3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { font-family: GilroyBold; font-size: 1.8rem; line-height: 3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { font-family: GilroyRegular; font-size: 1.4rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { color: rgba(41,62,64,.6); font-family: GilroyBold; font-size: 1.4rem; line-height: 2.3rem } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { color: #fff; font-family: GilroyBold; font-size: 1.8rem; line-height: 2.2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-head-icon-text { padding-bottom: 0 } } @media screen and (min-width: 1700px) { .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-link .tab-name { color: rgba(41,62,64,.6); font-size: 1.8rem; line-height: 2.3rem } .horizontal-tabbed-component-inner-wrapper .horizontal-tabs-list .tab-link.current .tab-name { color: #293e40; font-size: 1.8rem; line-height: 2.3rem } .component-now-creators-milestones .horizontal-tabbed-component-inner-wrapper .tab-name { font-size: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-message { color: #293d40; font-size: 2.2rem; line-height: 2.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .testimonial-wrapper .testimonial-by { color: rgba(41,61,64,.6); font-size: 1.2rem; line-height: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .text-content { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .progress-bar-title { color: #293e40; font-size: 1.8rem; line-height: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .your-progress-percentage-testimonial .percentage-wrapper .progress-bar-wrapper .label-copy { color: #293e40; font-size: 1.4rem; line-height: 2.6rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-title h5.progress-level-head-title-text { color: #293e40; font-size: 2.2rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle, .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-subtitle span { color: rgba(41,62,64,.6); font-size: 1.4rem; line-height: 2.3rem; margin: 1.1rem 0 2rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head-flag { color: #84b6a0; font-size: 1.4rem; line-height: 2.6rem; width: 11rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-head .progress-level-about-text { color: #293e40; font-size: 1.4rem; line-height: 2.3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .milestone-eyebrow-text { color: #293e40; font-size: 1.2rem; line-height: 1.8rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-body-progress-item-title { color: #293e40; font-size: 1.8rem; line-height: 3rem } .component-now-creators-milestones .tabbed-content-outer-wrapper .progress-level-item-inner-wrapper .milestone-completed-text { font-size: 1.4rem; line-height: 1.6rem } .your-progress-overlay .your-progress-overlay-content .overlay-milestone-title { color: #293e40; font-size: 2.8rem; line-height: 3rem; max-width: 65% } .your-progress-overlay .your-progress-overlay-content .milestone-status { color: #81b5a1; font-size: 1.6rem; line-height: 2.6rem } .your-progress-overlay .your-progress-overlay-content .activity-items .items-title-text { color: #293e40; font-size: 1.8rem; line-height: 3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-title { font-family: GilroyBold; font-size: 1.8rem; line-height: 3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .activity-item-description { font-family: GilroyRegular; font-size: 1.4rem; line-height: 2.3rem } .your-progress-overlay .your-progress-overlay-content .activity-items .completed-status-text { color: rgba(41,62,64,.6); font-family: GilroyBold; font-size: 1.4rem; line-height: 1.6rem } .component-champions-overlay .overlay-content-inner-wrapper .close-overlay-btn { color: #fff; font-family: GilroyBold; font-size: 1.8rem; line-height: 2.2rem } .component-now-creators-milestones .tabbed-content { padding-top: 8rem } .horizontal-tabbed-component-inner-wrapper .horizontal-rule { margin: auto; max-width: 162rem } .component-now-creators-milestones .horizontal-tabbed-component-inner-wrapper .horizontal-rule { margin: auto; max-width: 163.5rem } } .component-account-linking-new { position: relative; width: 100% } .component-account-linking-new .comp-full-bleed-bg-color { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: -1 } .component-account-linking-new .content .account-list-template-hidden, .component-account-linking-new .hide { display: none } .component-account-linking-new .content .account-list-wrapper .account-list-item { border: .1rem solid #d7d7d7; display: flex; flex-direction: column; margin-bottom: .8rem; padding: 1.8rem } .component-account-linking-new .content .account-list-wrapper .account-list-item:last-child { margin-bottom: 0 } .component-account-linking-new .content .account-list-wrapper .account-list-item.verified { padding: .8rem 1.6rem } .component-account-linking-new .content .account-list-wrapper .account-list-item.verified .account-address { padding-bottom: 0 } .component-account-linking-new .content .account-list-wrapper .account-address { font-size: 1.6rem; padding-bottom: .8rem; position: relative } .component-account-linking-new .content .account-list-wrapper .account-address-text { display: inline-block; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 90% } .component-account-linking-new .content .account-list-wrapper .verify-link { color: #adadad } .component-account-linking-new .content .account-list-wrapper .verify-text { padding-bottom: 1.6rem } .component-account-linking-new .content .account-list-wrapper .links { display: flex; flex-direction: column; line-height: 1.3 } .component-account-linking-new .content .account-list-wrapper .verified .verify-link.hidden { display: none } .component-account-linking-new .content .account-list-wrapper .verified .verified-chevron { cursor: pointer; position: absolute; right: 1.6rem } .component-account-linking-new .content .account-list-wrapper .verified .verified-chevron:before { border-style: solid; border-width: .15rem .15rem 0 0; content: ""; display: inline-block; height: 1rem; left: 1rem; position: relative; right: 0; top: .4rem; transform: rotate(135deg); transition: all .4s; vertical-align: top; width: 1rem } .component-account-linking-new .content .account-list-wrapper .verified .verified-chevron.rotate:before { top: 1rem; transform: rotate(-45deg); transition: all .4s } .component-account-linking-new .content .account-list-wrapper .verified .links { line-height: inherit } .component-account-linking-new .content .account-list-wrapper .cancel-btn, .component-account-linking-new .content .account-list-wrapper .resend-btn, .component-account-linking-new .content .account-list-wrapper .unlink-btn { font-family: GilroySemibold; text-decoration: underline } .component-account-linking-new .content .account-list-wrapper .resend-btn { padding-bottom: 1.6rem } .component-account-linking-new .content .account-list-wrapper .resend-btn.disabled { opacity: .4; pointer-events: none } .component-account-linking-new .content .account-list-wrapper .unlink-btn { padding: .8rem 0 } .component-account-linking-new .content .add-new-account { padding-top: 2.4rem } .component-account-linking-new .content .add-new-account .account-input-div { border: none; height: auto; margin-bottom: 1.6rem; padding: 0 } .component-account-linking-new .content .add-new-account .add-account-btn .cta-component { margin: 0 } .component-account-linking-new .content .add-new-account .add-account-btn .cta-component.disabled { opacity: .4; pointer-events: none } @media only screen and (min-width: 768px) { .component-account-linking-new .content { padding-top: .8rem !important } .component-account-linking-new .content .account-list-wrapper .account-list-item { padding: 1.6rem 2.4rem !important } .component-account-linking-new .content .account-list-wrapper .account-address { display: flex } .component-account-linking-new .content .account-list-wrapper .account-address .account-address-text { padding-right: .8rem; width: inherit } .component-account-linking-new .content .account-list-wrapper .links { flex-direction: row; margin-left: auto; text-align: right } .component-account-linking-new .content .account-list-wrapper .verify-text { padding-bottom: .8rem } .component-account-linking-new .content .account-list-wrapper .resend-btn { padding-bottom: 0; padding-right: 2.4rem } .component-account-linking-new .content .account-list-wrapper .unlink-btn { padding-top: 1.6rem } .component-account-linking-new .content .add-new-account { align-items: center; align-items: flex-start; display: flex; padding-top: 3.2rem } .component-account-linking-new .content .add-new-account .account-input-div { margin-bottom: 0; margin-right: 1.6rem; width: 50% } .component-account-linking-new .content .add-new-account .cta-component a { align-items: center; display: flex; height: 5.4rem } } @media only screen and (min-width: 1024px) { .component-account-linking-new .content .empty-list-message { font-family: GilroySemiBold } .component-account-linking-new .content .empty-list-message .empty-text { font-size: 1.8rem } .component-account-linking-new .content .account-list-wrapper .account-list-item { border-bottom: .1rem solid #d7d7d7; margin-bottom: .8rem; width: 55% } .component-account-linking-new .content .account-list-wrapper .account-list-item:first-child { border-bottom: .1rem solid #d7d7d7 } .component-account-linking-new .content .add-new-account { width: 55% } .component-account-linking-new .content .add-new-account .account-input-div { width: 100% } } @media only screen and (min-width: 1700px) { .component-account-linking-new .title h1 { font-size: 3.2rem } .component-account-linking-new .content .account-list-wrapper { display: inherit } .component-account-linking-new .content .account-list-wrapper .account-list-item { border-left: 0; border-right: 0; border-top: .1rem solid #dedede; margin-bottom: 0; padding: 1.6rem 0 !important; width: inherit } .component-account-linking-new .content .account-list-wrapper .account-list-item:first-child { border-bottom: 0 } .component-account-linking-new .content .account-list-wrapper .account-list-item:last-child { border-bottom: .1rem solid #dedede } .accordion.section ul.list-unstyled .component-account-linking-new .content .account-list-wrapper .account-list-item li, .component-account-linking-new .content .account-list-wrapper .account-list-item .accordion.section ul.list-unstyled li, .component-account-linking-new .content .account-list-wrapper .account-list-item .medium-body-copy { font-size: 1.6rem } .component-account-linking-new .content .add-new-account { display: block; padding-top: 4rem; width: inherit } .component-account-linking-new .content .add-new-account .account-input-div { margin-bottom: 2.4rem; width: 100% } } .account-linking-new-overlay .account-linking-overlay-content { margin-top: 3rem; padding: 0 1rem } .account-linking-new-overlay .account-linking-overlay-content .bold-text { font-family: gilroyBold } .account-linking-new-overlay .account-linking-overlay-content .banner-text-wrapper { align-items: start; display: flex; margin-bottom: 4rem; margin-top: 2rem } .account-linking-new-overlay .account-linking-overlay-content .banner-icon { margin-right: 1rem } .account-linking-new-overlay .account-linking-overlay-content .banner-text { opacity: .7 } .account-linking-new-overlay .account-linking-overlay-content .verify-link { padding: 0 } .account-linking-new-overlay .account-linking-overlay-content .account-link-btn { align-items: center; background: #293e40; border: 1px solid #293e40; color: #fff; cursor: pointer; display: flex; height: 4.8rem; justify-content: center; width: 100% } .account-linking-new-overlay .account-linking-overlay-content .add-account-label { margin-bottom: 2.1rem; margin-top: 1.4rem } .account-linking-new-overlay .account-linking-overlay-content .icon-text { align-items: center; display: flex } .account-linking-new-overlay .account-linking-overlay-content .add-icon { margin-right: 10px } .account-linking-new-overlay .account-linking-overlay-content .account-item { border-top: 1px solid #dedede; padding-bottom: 25px; padding-top: 25px } .account-linking-new-overlay .account-linking-overlay-content .primary-account-label { color: #81b5a1; margin-top: 8px } .account-linking-new-overlay .account-linking-overlay-content .unlink-btn { margin-bottom: 1.5rem; margin-top: 2.3rem } .account-linking-new-overlay .account-linking-overlay-content .unlink-group { padding: 0 } .account-linking-new-overlay .account-linking-overlay-content .unlink-label { display: none; font-size: 1.4rem; line-height: 2.3rem } .account-linking-new-overlay .account-linking-overlay-content .hide { display: none !important } .account-linking-new-overlay .account-linking-overlay-content .verified .account-address { align-items: center; display: flex; justify-content: space-between } .account-linking-new-overlay .account-linking-overlay-content .label-account { display: none } .account-linking-new-overlay .account-linking-overlay-content .account-input-div { border: none; height: auto; margin-bottom: 1.6rem; position: relative; width: 100% } .account-linking-new-overlay .account-linking-overlay-content .account-input-div.invalid { border-color: #c00; margin-bottom: 3.6rem } .account-linking-new-overlay .account-linking-overlay-content .account-input-div.invalid .account-input-box { border-color: #c00 } .account-linking-new-overlay .account-linking-overlay-content .account-input-div.invalid .floating-label, .account-linking-new-overlay .account-linking-overlay-content .account-input-div.invalid .invalid-email-message { color: #c00; display: block; margin-left: 1.6rem } .account-linking-new-overlay .account-linking-overlay-content .account-input-div.disabled { opacity: .4; pointer-events: none } .account-linking-new-overlay .account-linking-overlay-content .account-input-box { border: .2rem solid #c8c8c8; font-size: 1.6rem; height: 4.8rem; margin-bottom: .6rem; outline: none; padding: 1.6rem 1rem 0 2.6rem !important; width: 100% } .account-linking-new-overlay .account-linking-overlay-content .account-input-box:focus ~ .floating-label, .account-linking-new-overlay .account-linking-overlay-content .account-input-box:not(:focus):valid ~ .floating-label { bottom: 1rem; font-size: 1.2rem; left: 1.6rem; opacity: 1; top: .8rem } .account-linking-new-overlay .account-linking-overlay-content .floating-label { font-size: 1.4rem; left: 1.6rem; pointer-events: none; position: absolute; top: 1.6rem; transition: all .2s ease } .account-linking-new-overlay .account-linking-overlay-content .invalid-email-message.hidden { display: none } .account-linking-new-overlay .account-linking-overlay-content .add-account-box { background: #293e40; color: #fff; font-size: 1.6rem; height: 4.8rem; margin-bottom: 3rem; outline: none; width: 100% } .account-linking-new-overlay .account-linking-overlay-content .resend-btn { background: #293e40; border: 0; color: #fff; font-size: 1.6rem; margin-bottom: 1.6rem; margin-top: 2.4rem; padding: 1.25rem; width: 100% } .account-linking-new-overlay .account-linking-overlay-content .pending-text { margin-top: 8px; opacity: .6 } .account-linking-new-overlay .account-linking-overlay-content .cancel-btn, .account-linking-new-overlay .account-linking-overlay-content .resend-btn { display: block; width: 100% } @media only screen and (min-width: 768px) { .account-linking-new-overlay .account-linking-overlay-content { margin: 0; padding: 0 } .account-linking-new-overlay .account-linking-overlay-content .content-subtitle { padding-top: 1.4rem } .account-linking-new-overlay .account-linking-overlay-content .banner-text-wrapper { margin: 3.8rem 0 } .account-linking-new-overlay .account-linking-overlay-content .banner-icon { height: 2rem; margin-top: .3rem; width: 2rem } .account-linking-new-overlay .account-linking-overlay-content .add-account-label { margin-top: 3.4rem } .account-linking-new-overlay .account-linking-overlay-content .add-account-hidden-elements { align-items: top; display: flex; justify-content: space-between; margin-bottom: 2.2rem } .account-linking-new-overlay .account-linking-overlay-content .account-input-div { margin-bottom: 0; padding: 0; width: 60% } .account-linking-new-overlay .account-linking-overlay-content .add-account-box { margin-bottom: 0; width: 30% } .account-linking-new-overlay .account-linking-overlay-content .primary-account { align-items: center; display: flex; justify-content: space-between } .account-linking-new-overlay .account-linking-overlay-content .primary-account-label { border: 2px solid #81b5a1; border-radius: 24px; margin-top: 0; padding: 12px 20px } .account-linking-new-overlay .account-linking-overlay-content .pending, .account-linking-new-overlay .account-linking-overlay-content .unlink-hidden-elements { align-items: center; display: flex; justify-content: space-between } .account-linking-new-overlay .account-linking-overlay-content .unlink-description { font-size: 1.4rem; line-height: 1.3 } .account-linking-new-overlay .account-linking-overlay-content .unlink-group { padding: 0; width: 50% } .account-linking-new-overlay .account-linking-overlay-content .resend-btn { margin-top: 1.6rem; padding: 1.25rem 2rem; width: auto } .account-linking-new-overlay .account-linking-overlay-content .verify-link { display: flex; justify-content: flex-end; padding: 0; text-align: right } .account-linking-new-overlay .account-linking-overlay-content .verify-link .icon-text { justify-content: flex-end; margin-left: auto; text-align: right } .account-linking-new-overlay .account-linking-overlay-content .unlink-btn { height: inherit; padding: .75rem 2rem; white-space: nowrap; width: inherit } } @media only screen and (min-width: 1024px) { .account-linking-new-overlay .account-linking-overlay-content .banner-text-wrapper { margin-bottom: 2rem; margin-top: 4rem } .account-linking-new-overlay .account-linking-overlay-content .banner-icon { height: 3rem; margin-top: 0; width: 3rem } .account-linking-new-overlay .account-linking-overlay-content .banner-text { margin-top: 2px } .account-linking-new-overlay .account-linking-overlay-content .add-account-label { margin-bottom: 3.4rem; margin-top: 2rem } .account-linking-new-overlay .account-linking-overlay-content .add-account-hidden-elements { margin-bottom: 3.9rem } .account-linking-new-overlay .account-linking-overlay-content .unlink-label { display: block; font-size: 1.8rem; line-height: 2.8rem } .account-linking-new-overlay .account-linking-overlay-content .resend-btn { padding: 1.25rem 3rem } .account-linking-new-overlay .account-linking-overlay-content .label-account { display: inherit; margin-top: 2rem } .account-linking-new-overlay .account-linking-overlay-content .account-input-div, .account-linking-new-overlay .account-linking-overlay-content .add-account-box, .account-linking-new-overlay .account-linking-overlay-content .label-account { padding: 0 } .account-linking-new-overlay .account-linking-overlay-content .account-address-text, .account-linking-new-overlay .account-linking-overlay-content .add-account-text, .account-linking-new-overlay .account-linking-overlay-content .content-subtitle, .account-linking-new-overlay .account-linking-overlay-content .pending-cancel-button, .account-linking-new-overlay .account-linking-overlay-content .pending-text, .account-linking-new-overlay .account-linking-overlay-content .primary-account-address, .account-linking-new-overlay .account-linking-overlay-content .resend-btn { font-size: 1.8rem } } @media only screen and (min-width: 1700px) { .account-linking-new-overlay .account-linking-overlay-content .pending .links { display: flex } .account-linking-new-overlay .account-linking-overlay-content .pending .links .pending-cancel-button-icon, .account-linking-new-overlay .account-linking-overlay-content .pending .links .pending-text { align-items: center; display: flex; margin-top: 0; white-space: nowrap } .account-linking-new-overlay .account-linking-overlay-content .resend-btn { margin-left: 40px; margin-right: 80px } .account-linking-new-overlay .account-linking-overlay-content .unlink-hidden-title { display: none } .account-linking-new-overlay .account-linking-overlay-content .unlink-group { display: flex; width: 100% } .account-linking-new-overlay .account-linking-overlay-content .unlink-description { align-items: center; display: flex; margin-right: 100px; width: 60% } .account-linking-new-overlay .account-linking-overlay-content .unlink-btn { margin-right: 40px; width: auto } .account-linking-new-overlay .account-linking-overlay-content .account-link-btn { padding: .6rem 5rem } } .component-csc-marquee { padding: 8rem 0; position: relative } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-full-bleed-left-asset-section { bottom: 0; left: 0; max-width: 12rem; position: absolute } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-full-bleed-right-asset-section { bottom: -.4rem; max-width: 15%; position: absolute; right: 0 } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper { text-align: center } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper h1 { font-family: GilroyRegular; font-size: 2.2rem; line-height: 2.8rem; padding: 4rem 0 } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper h1.regular-h1 { font-family: GilroyRegular } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component { margin-right: 0 } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component a { font-family: GilroyBold; font-size: 1.4rem; line-height: 1.7rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component.cta-rectangle-box { border-radius: 5px; line-height: 1.7rem; margin: 2.5rem 0 } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-asset-section { display: none } .component-csc-marquee.mobile-left-aligned .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper { text-align: left } .component-csc-marquee.mobile-right-aligned .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper { text-align: right } .component-csc-marquee.disable-full-bleed-background .component-csc-background-container { display: block; height: 100%; left: 0; margin: auto; max-width: 170rem; position: absolute; right: 0; top: 0; width: 100% } .component-csc-marquee .component-asset-block { display: none } .component-csc-marquee .component-asset-block:nth-of-type(2) { display: block } @media only screen and (min-width: 768px) { .component-csc-marquee { padding: 12rem 0 8rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-full-bleed-right-asset-section { max-width: 8rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content { align-items: center; display: flex } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper { text-align: left !important } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper h1 { font-size: 2.8rem; line-height: 1.3; padding: 3rem 0 } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component.cta-rectangle-box a { border-radius: 0; font-size: 2.2rem; line-height: 2.8rem; padding: 1.6rem 3.2rem } .component-csc-marquee .component-asset-block { display: block } .component-csc-marquee .component-asset-block:nth-of-type(2) { display: none } } @media only screen and (min-width: 1024px) { .component-csc-marquee { padding: 13.8rem 0 8rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content { justify-content: space-between } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper { min-width: 45.5% } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component a { font-family: GilroyBold } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component.cta-text-arrow a { font-size: 1.4rem !important } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper .cta-component.cta-rectangle-box a { font-size: 2.2rem !important; padding: 1.6rem 3.9rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-asset-section { display: block; min-width: 45.5% } } @media only screen and (min-width: 1700px) { .component-csc-marquee { padding: 14.8rem 0 8rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content { margin-left: 0 } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper h1 { font-family: GilroyRegular; font-size: 3.6rem; line-height: 4.6rem } .component-csc-marquee .component-csc-marquee-outer-wrapper .component-csc-marquee-inner-wrapper .component-csc-marquee-content .component-csc-marquee-content-innerwrapper h1 b { font-family: GilroySemibold } } .component-explore-hub { color: #293e40; transform: translateZ(0) } .component-explore-hub .padding-zero-top { padding-top: 0 } .component-explore-hub .padding-zero-bot { padding-bottom: 0 } .component-explore-hub .padding-40-top { padding-top: 4rem } .component-explore-hub .padding-40-bot { padding-bottom: 4rem } .component-explore-hub .padding-80-top { padding-top: 8rem } .component-explore-hub .padding-80-bot { padding-bottom: 8rem } .component-explore-hub .explore-hub-inner-wrapper { padding-top: 4rem } .component-explore-hub .tiles-wrapper, .component-explore-hub .topics-wrapper { display: none } .component-explore-hub .breadcrumb { display: flex; margin-bottom: 2.3rem } .component-explore-hub .active { display: block } .component-explore-hub .not-active { display: none } .component-explore-hub .breadcrumb-back-arrow { align-items: flex-end; cursor: pointer; display: flex; margin-right: 1.2rem; margin-top: .7rem; transform: rotate(180deg) } .component-explore-hub .breadcrumb-back-arrow img { width: 2.4rem } .component-explore-hub .breadcrumb-text { font-family: gilroyBold } .component-explore-hub .breadcrumb-text .selected-persona, .component-explore-hub .breadcrumb-text .selected-persona-text, .component-explore-hub .breadcrumb-text .selected-topic, .component-explore-hub .breadcrumb-text .selected-topic-text { display: none } .component-explore-hub .breadcrumb-text span { font-size: 1.8rem } .component-explore-hub .breadcrumb-text.show-persona .selected-persona, .component-explore-hub .breadcrumb-text.show-persona .selected-persona-text, .component-explore-hub .breadcrumb-text.show-topic .selected-topic, .component-explore-hub .breadcrumb-text.show-topic .selected-topic-text { display: inline } .component-explore-hub .selected-persona, .component-explore-hub .selected-topic { border-bottom: .2rem solid #81b5a1; color: #81b5a1; cursor: pointer } .component-explore-hub .wrapper-title { font-size: 1.8rem; margin-bottom: 2.02rem; margin-top: 2rem } .component-explore-hub .wrapper-subtitle { padding-bottom: 4rem; padding-left: 2rem } .component-explore-hub .wrapper-subtitle:before { content: "—"; font-size: 1.6rem; margin-left: -2rem; margin-top: -.2rem; position: absolute } .component-explore-hub .wrapper-content { scrollbar-width: none } .component-explore-hub .wrapper-content .persona-item:first-child .persona-text { height: auto } .component-explore-hub .persona-item { cursor: pointer; margin-bottom: 1rem; opacity: 1; padding: 0 } .component-explore-hub .flyToUp { transform: translateY(-30px); z-index: 2 } .component-explore-hub .fadeOut, .component-explore-hub .flyToUp { opacity: 0; pointer-events: none; transition: all 1s ease-in-out !important } .component-explore-hub .setToBottom { opacity: 0; pointer-events: none; transform: translateY(30px) } .component-explore-hub .flyFromBottom { opacity: 1; pointer-events: none; transform: translate(0); transition: all 1s ease-in-out !important } .component-explore-hub .wrapper-content-inner { margin-left: auto; margin-right: auto; max-width: 42.5rem } .component-explore-hub .persona-image { border-radius: .8rem; overflow: hidden; position: relative } .component-explore-hub .person { width: 100% } .component-explore-hub .badge-wrapper { align-items: center; bottom: 1rem; display: flex; left: 1rem; position: absolute } .component-explore-hub .badge-wrapper .badge { height: 3.2rem; width: 3.2rem } .component-explore-hub .badge-wrapper .title { color: #fff; font-family: gilroyBold; font-size: 1.6rem; margin-left: .9rem } .component-explore-hub .persona-text { background: #fff; height: 0; overflow: hidden; transition: transform .6s ease-out } .component-explore-hub .persona-text-subtitle, .component-explore-hub .persona-text-title { display: none } .component-explore-hub .persona-text-list { margin: 3rem; padding-left: 2rem; position: relative } .component-explore-hub .persona-text-list li { padding-bottom: 2rem; padding-left: 0 } .component-explore-hub .persona-text-list li:before { color: #81b5a1; content: "•"; display: inline-block; font-size: 2.2rem; font-weight: 700; margin-left: -2rem; margin-top: -4px; position: absolute; width: 1em } .component-explore-hub .persona-text-list li:last-child { padding-bottom: 0 } .component-explore-hub .persona-cta { padding-bottom: 3rem; padding-left: 5rem } .component-explore-hub .persona-cta a { font-family: gilroyBold } .component-explore-hub .persona-cta .cta-component { margin: 0 } .component-explore-hub .active-persona { margin-bottom: 1rem } .component-explore-hub .active-persona .persona-image { border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin-bottom: 0 } .component-explore-hub .topic-element { align-items: center; border-radius: .5rem; cursor: pointer; display: flex; font-size: 1.6rem; justify-content: center; margin-top: 1rem; padding: 3rem 2rem } .component-explore-hub .topic-title { font-family: gilroyBold; text-align: center } .component-explore-hub .topics-wrapper .wrapper-title { margin-top: 0; padding-right: 5rem } .component-explore-hub .topics-wrapper .dynamic-text { display: inline } .component-explore-hub .tiles-wrapper { width: 100% } .component-explore-hub .tiles-wrapper .reveal-more-btn { background: transparent } .component-explore-hub .resource-item { background-color: #fff; border-bottom: 4px solid; border-radius: 6px; box-shadow: 0 0 13px 0 rgba(41,62,64,.03); display: flex; margin-top: 1rem; min-height: 18.8rem; position: relative } .component-explore-hub .resource-item.link, .component-explore-hub .resource-item.search { border-bottom-color: #81b5a1 } .component-explore-hub .resource-item.blog, .component-explore-hub .resource-item.page { border-bottom-color: #fc726d } .component-explore-hub .resource-item.calendar, .component-explore-hub .resource-item.download { border-bottom-color: #68a1af } .component-explore-hub .resource-item.video { border-bottom-color: #8686bc } .component-explore-hub .resource-item.tool, .component-explore-hub .resource-item.undefined { border-bottom-color: #293e40 } .component-explore-hub .resource-item.learning { border-bottom-color: #e9bcbc } .component-explore-hub .resource-item-inner-wrapper { display: flex; flex-direction: column; padding: 3rem } .component-explore-hub .resource-source { font-family: gilroyBold; font-size: 1rem; margin-bottom: 2rem; text-transform: uppercase } .component-explore-hub .resource-title { display: flex; flex-grow: 1; font-family: gilroySemibold; font-size: 1.6rem; margin-bottom: 2rem } .component-explore-hub .resource-tagline-wrapper { align-items: center; display: flex } .component-explore-hub .resource-tagline-image { height: auto; margin-right: 1.6rem; width: 1.7rem } .component-explore-hub .resource-tagline-text { font-size: 1.4rem } .component-explore-hub .resource-icon { height: 4rem; position: absolute; right: 2rem; top: 1.8rem; width: 4rem } .component-explore-hub .resource-icon.link { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/link-icon.svg) } .component-explore-hub .resource-icon.page { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/page-icon.svg) } .component-explore-hub .resource-icon.download { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/download-icon.svg) } .component-explore-hub .resource-icon.video { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/video-icon.svg) } .component-explore-hub .resource-icon.calendar { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/calendar-icon.svg) } .component-explore-hub .resource-icon.blog { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/blog-icon.svg) } .component-explore-hub .resource-icon.tool { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/tools-icon.svg) } .component-explore-hub .resource-icon.search { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/search-icon.svg) } .component-explore-hub .resource-icon.learning { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/learning-icon.svg) } @media only screen and (max-width: 767px) { .component-explore-hub .persona-text { width: 100% !important } .component-explore-hub .left-scroll-arrow, .component-explore-hub .right-scroll-arrow { display: none } } @media only screen and (min-width: 768px) { .component-explore-hub .explore-hub-inner-wrapper { flex-direction: column; padding-top: 5rem } .component-explore-hub .wrapper-title { margin-top: 0 } .component-explore-hub .breadcrumb { margin-bottom: 4rem } .component-explore-hub .breadcrumb-text span { font-size: 2.2rem } .component-explore-hub .wrapper-content { position: relative } .component-explore-hub .wrapper-content .left-scroll-arrow, .component-explore-hub .wrapper-content .right-scroll-arrow { border-radius: 100%; cursor: pointer; position: absolute; top: calc(50% - 3.5rem); z-index: 3 } .component-explore-hub .wrapper-content .left-scroll-arrow { left: -2rem; transform: rotate(180deg) } .component-explore-hub .wrapper-content .right-scroll-arrow { right: -2rem } .component-explore-hub .wrapper-content-inner { display: flex; max-width: inherit; overflow: hidden } .component-explore-hub .wrapper-content-inner .persona-item:last-child { margin-right: 0 } .component-explore-hub .topics-wrapper .wrapper-title { padding-right: 0 } .component-explore-hub .topics-wrapper .wrapper-content { display: flex; flex-direction: column; flex-flow: wrap } .component-explore-hub .topics-wrapper .wrapper-content:after { content: ""; flex: auto } .component-explore-hub .topics-wrapper .topic-element { margin-bottom: 2rem; margin-right: 2.8rem; min-height: 12rem; overflow: hidden; padding: 3.4rem 5.5rem; position: relative; width: 48% } .component-explore-hub .topics-wrapper .topic-element:nth-child(2n+2) { margin-right: 0 } .component-explore-hub .topics-wrapper .topic-element .topic-dots { background: radial-gradient(#f7f7f7 1px,transparent 0),radial-gradient(#f7f7f7 1px,transparent 0),transparent; background-position: 9px 14px,5px 10px,0 0,0 0,0 0; background-size: 8px 8px,8px 8px; bottom: 2.7rem; height: 3.2rem; opacity: .4; position: absolute; right: 0; width: 2rem } .component-explore-hub .topics-wrapper .topic-element .topic-circle { background-color: hsla(0,0%,100%,.4); border-radius: 100%; bottom: -6rem; height: 9rem; position: absolute; right: -5rem; width: 9rem } .component-explore-hub .topics-wrapper .topic-title { font-size: 2rem } .component-explore-hub .tiles-wrapper .resource-item { display: flex } .component-explore-hub .tiles-wrapper .tiles-grid-wrapper { display: flex; flex-direction: column; flex-flow: wrap } .component-explore-hub .tiles-wrapper .resource-item { margin-bottom: 3rem; margin-right: 2.8rem; width: 48% } .component-explore-hub .tiles-wrapper .resource-item:nth-child(2n+2) { margin-right: 0 } .component-explore-hub .tiles-wrapper .resource-item:hover { box-shadow: 0 18px 20px 0 rgba(0,0,0,.06); transform: scale(1.02); transition: all .1s ease-in-out !important } .component-explore-hub .tiles-wrapper .resource-icon { right: 3rem; top: 2rem } .component-explore-hub .tiles-wrapper .topic-title { font-size: 2rem } .component-explore-hub .resource-item-inner-wrapper { display: flex; flex-flow: column nowrap; padding: 3rem } .component-explore-hub .wrapper-title { font-size: 2.2rem } .component-explore-hub .wrapper-content-inner { overflow: hidden !important; transition: transform 1s ease-in } .component-explore-hub .persona-item { display: flex; margin-bottom: 0; margin-right: 30px; min-width: 30.7%; position: relative; transition: all .2s ease-in-out } .component-explore-hub .persona-item:not(.active-persona) .persona-text { transition: left .2s ease-in-out,opacity .2s ease-in-out,width 1s ease-in-out } .component-explore-hub .persona-image { height: 43.1rem; width: 100%; z-index: 2 } .component-explore-hub .person { height: 100%; margin-top: 0; width: 100% } .component-explore-hub .badge-wrapper .title { font-size: 2rem } .component-explore-hub .persona-text { height: auto; height: 100%; left: 0; opacity: 0; position: absolute; transition: left .2s ease-in-out,opacity .2s ease-in-out,width .1s ease-in-out; width: 100%; z-index: 1 } .component-explore-hub .persona-text-subtitle, .component-explore-hub .persona-text-title { display: block; font-family: gilroySemibold; font-size: 2rem; padding-left: 5.4rem; padding-right: 3.9rem } .component-explore-hub .persona-text-title { padding-top: 1.5rem } .component-explore-hub .persona-text-subtitle { color: #81b5a1 } .component-explore-hub .persona-text-list { margin: 1.6rem 2.7rem 1.7rem 2.4rem; min-width: 18.3rem; padding-left: 3rem } .component-explore-hub .persona-text-list li { padding-bottom: 1.4rem } .component-explore-hub .persona-text-list li:before { margin-left: -3rem } .component-explore-hub .wrapper-content .persona-item:first-child .persona-text { height: 100% } .component-explore-hub .persona-cta { bottom: 0; padding-bottom: 2.5rem; padding-left: 5.4rem; position: absolute } .component-explore-hub .persona-cta a { font-family: gilroyBold } .component-explore-hub .badge-wrapper { flex-direction: column; left: 0; text-align: center; top: 71%; width: 100% } .component-explore-hub .badge-wrapper .badge { height: 5.1rem; margin-bottom: 1.3rem; width: 5.1rem } .component-explore-hub .active-persona { background-color: #fff; margin-right: 38.5%; transition: all .2s ease-in-out } .component-explore-hub .active-persona .persona-image, .component-explore-hub .active-persona .persona-text { padding: 0 } .component-explore-hub .active-persona .persona-text { display: initial; left: 100%; opacity: 1; width: 113% } } @media only screen and (min-width: 1024px) { .component-explore-hub .explore-hub-inner-wrapper { padding-top: 8rem } .component-explore-hub .topics-wrapper .topic-element { margin-bottom: 3rem; margin-right: 4rem; min-height: 11rem; padding: 2.9rem 4.5rem; width: 30.5% } .component-explore-hub .topics-wrapper .topic-element .topic-dots { background-position: 10px 3px,3px 10px,0 0,0 0,0 0; background-size: 14px 14px,14px 14px; bottom: 5.4rem; height: 5.2rem; width: 3.2rem } .component-explore-hub .topics-wrapper .topic-element .topic-circle { bottom: -4.5rem; height: 10rem; right: -3rem; width: 10rem } .component-explore-hub .topics-wrapper .topic-element:nth-child(2n+2) { margin-right: 4rem } .component-explore-hub .topics-wrapper .topic-element:nth-child(3n+3) { margin-right: 0 } .component-explore-hub .topics-wrapper .wrapper-content.light-hover-background .topic-element:hover { background-color: #fff !important; box-shadow: 0 18px 20px 0 rgba(0,0,0,.06); transform: scale(1.02); transition: all .1s ease-in-out !important } .component-explore-hub .topics-wrapper .wrapper-content.light-hover-background .topic-element:hover .topic-title { color: #293e40 !important } .component-explore-hub .topics-wrapper .wrapper-content.dark-hover-background .topic-element:hover { background-color: #293e40 !important; box-shadow: 0 18px 20px 0 rgba(0,0,0,.06); transform: scale(1.02); transition: all .1s ease-in-out !important } .component-explore-hub .topics-wrapper .wrapper-content.dark-hover-background .topic-element:hover .topic-title { color: #fff !important } .component-explore-hub .resource-item { border-bottom: 8px solid; min-height: 29.3rem } .component-explore-hub .tiles-wrapper .resource-icon { bottom: 4rem; right: 3rem; top: auto } .component-explore-hub .tiles-wrapper .tiles-grid-wrapper { margin: 0 8rem } .component-explore-hub .wrapper-title { font-size: 2.4rem } .component-explore-hub .wrapper-subtitle { font-size: 1.6rem } .component-explore-hub .resource-title { font-size: 2rem; margin-bottom: 5rem } .component-explore-hub .resource-tagline-wrapper { margin-bottom: 2rem } .component-explore-hub .resource-source { margin-bottom: 4rem } .component-explore-hub .persona-item { margin-right: 4rem; min-width: calc(25% - 3rem) } .component-explore-hub .badge-wrapper { top: 68% } .component-explore-hub .badge-wrapper .title { font-size: 2.2rem; padding: 0 } .component-explore-hub .persona-text-subtitle, .component-explore-hub .persona-text-title { font-size: 2.2rem } .component-explore-hub .persona-text-list { padding-left: 1rem } .component-explore-hub .persona-text-list li:before { margin-left: -2.1rem } .component-explore-hub .persona-cta { padding-bottom: 2.3rem; padding-left: 4rem } .component-explore-hub .persona-image { height: 41.1rem } .component-explore-hub .persona-text-subtitle, .component-explore-hub .persona-text-title { padding-left: 4rem; padding-right: 4.4rem } .component-explore-hub .persona-text-title { padding-top: 1.6rem } .component-explore-hub .persona-text-list { margin: 1.6rem 2.5rem 1.6rem 2rem; padding-left: 2rem } .component-explore-hub .persona-text-list li { padding-bottom: 1.2rem } .component-explore-hub .active-persona { margin-right: calc(26.2% + 4rem) } .component-explore-hub .active-persona .persona-text { width: calc(100% + 4rem) } } @media only screen and (min-width: 1700px) { .component-explore-hub .breadcrumb-text span { font-size: 2.8rem } .component-explore-hub .breadcrumb-back-arrow { margin-top: 1.2rem } .component-explore-hub .tiles-wrapper .tiles-grid-wrapper { margin: 0 } .component-explore-hub .tiles-wrapper .resource-item { margin-bottom: 3rem; margin-right: 4rem; width: 23.14% } .component-explore-hub .tiles-wrapper .resource-item:nth-child(2n+2) { margin-right: 4rem } .component-explore-hub .tiles-wrapper .resource-item:nth-child(4n+4) { margin-right: 0 } .component-explore-hub .topics-wrapper .topic-element { margin-right: 4rem; min-height: 18.3rem; padding: 6.15rem 5.5rem; transition: transform .5s; width: 23.14% } .component-explore-hub .topics-wrapper .topic-element .topic-dots { height: 6rem } .component-explore-hub .topics-wrapper .topic-element .topic-circle { bottom: -5.5rem; height: 11rem; right: -5rem; width: 11rem } .component-explore-hub .topics-wrapper .topic-element:nth-child(2n+2), .component-explore-hub .topics-wrapper .topic-element:nth-child(3n+3) { margin-right: 4rem } .component-explore-hub .topics-wrapper .topic-element:nth-child(4n+4) { margin-right: 0 } .component-explore-hub .topics-wrapper .topic-title { font-size: 2.4rem } .component-explore-hub .persona-text-title { padding-top: 3rem } .component-explore-hub .persona-text-list { margin: 2.6rem 3rem 2rem 4rem; padding-left: 2.5rem } .component-explore-hub .persona-text-list li { padding-bottom: 1.4rem } .component-explore-hub .persona-text-list li:before { margin-left: -2.5rem } .component-explore-hub .persona-cta { padding-bottom: 4.2rem; padding-left: 6.5rem } .component-explore-hub .wrapper-title { font-size: 2.8rem } .component-explore-hub .wrapper-subtitle { font-size: 1.8rem } .component-explore-hub .persona-text-subtitle, .component-explore-hub .persona-text-title { font-size: 2.4rem; padding-left: 6.5rem; padding-right: 3rem } .component-explore-hub .badge-wrapper .badge { height: 5.6rem; width: 5.6rem } .component-explore-hub .badge-wrapper .title { font-size: 2.4rem } .component-explore-hub .person { margin-top: unset; width: unset } .component-explore-hub .persona-item { margin-right: 2.5%; min-width: 14.6% } .component-explore-hub .persona-image { height: 46.8rem } .component-explore-hub .wrapper-content-inner { overflow: hidden !important } .component-explore-hub .wrapper-content .left-scroll-arrow, .component-explore-hub .wrapper-content .right-scroll-arrow { display: none !important } .component-explore-hub .active-persona { margin-right: 19.5% } .component-explore-hub .active-persona .persona-text { width: 117% } } .dv-topic-filter .mobile-header { margin-bottom: 4rem } @media(min-width: 1024px) { .dv-topic-filter .mobile-header { display: none } } .dv-topic-filter .mobile-header .mobile-title { font: normal 1.8rem GilroyBold; margin-bottom: 1rem } @media(min-width: 768px) { .dv-topic-filter .mobile-header .mobile-title { font-size: 2.2rem; margin-bottom: .6rem } } .dv-topic-filter .mobile-header .mobile-desc { font-size: 1.4rem; margin: 0 } @media(min-width: 768px) { .dv-topic-filter .mobile-header .mobile-desc { font-size: 1.6rem } } .dv-topic-filter .items-list { border-bottom: .1rem solid transparent; font-family: GilroyBold } @media(min-width: 1024px) { .dv-topic-filter .items-list { border-left: .1rem solid #e6e6e6; font-family: GilroyRegular } } .dv-topic-filter .items-list .dv-item { border-bottom: .1rem solid #e6e6e6; padding: 3rem 0 } .dv-topic-filter .items-list .dv-item span { font-family: GilroyRegular; font-size: inherit } .dv-topic-filter .items-list .dv-item.has-sub-items .item-name span { background-size: 0; font-family: GilroyBold } .dv-topic-filter .items-list .dv-item .item-name span { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 0 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; overflow: hidden; pointer-events: none; transition: all .25s linear } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item { border: none !important; margin-bottom: 3rem; padding: 0 } .dv-topic-filter .items-list .dv-item.selected { transition: all 0s } .dv-topic-filter .items-list .dv-item .item-name span { background-position: 100% 100% } .dv-topic-filter .items-list .dv-item.selected .item-name span { font-family: GilroyBold } .dv-topic-filter .items-list .dv-item:not(.selected) .item-name:hover span { background-position: 0 100% } } @media(min-width: 1700px) { .dv-topic-filter .items-list .dv-item { margin-bottom: 6rem } } .dv-topic-filter .items-list .dv-item:first-child { border-top: .1rem solid #e6e6e6 } .dv-topic-filter .items-list .dv-item:last-child { margin: 0 } .dv-topic-filter .items-list .dv-item .item-header { align-items: center; cursor: pointer; display: flex } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .item-header { padding: .2rem 0 .2rem 2rem } .dv-topic-filter .items-list .dv-item .selected .item-header { border-left: .3rem solid #a6cabd; margin-left: -.1rem } } .dv-topic-filter .items-list .dv-item .item-name { font-size: 1.6rem; margin-right: 3.4rem } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .item-name { font-size: 1.4rem } } @media(min-width: 1700px) { .dv-topic-filter .items-list .dv-item .item-name { font-size: 2rem } } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .selected .item-name { font-family: GilroyBold } } .dv-topic-filter .items-list .dv-item .arrow { color: #81b5a1; flex: 0 0 1.4rem; margin-left: auto } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .arrow.fa-chevron-right { display: none } } .dv-topic-filter .items-list .dv-item .arrow.fa-chevron-up, .dv-topic-filter .items-list .dv-item .opened .arrow.fa-chevron-right { display: none } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .opened .arrow.fa-chevron-up, .dv-topic-filter .items-list .dv-item .opened-desktop .arrow.fa-chevron-up { display: block } } .dv-topic-filter .items-list .dv-item .arrow.fa-chevron-down { display: none } .dv-topic-filter .items-list .dv-item .opened .arrow.fa-chevron-down { display: block } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .arrow.fa-chevron-down { display: block } .dv-topic-filter .items-list .dv-item .opened .arrow.fa-chevron-down, .dv-topic-filter .items-list .dv-item .opened-desktop .arrow.fa-chevron-down { display: none } } .dv-topic-filter .items-list .dv-item .sub-items { display: none; list-style-type: none; margin: 3rem 0 0; padding: 0 4.8rem 0 0 } .dv-topic-filter .items-list .dv-item .sub-items span { font-family: GilroyRegular; font-size: inherit } .dv-topic-filter .items-list .dv-item .opened .sub-items { display: block } @media(min-width: 1024px) { .dv-topic-filter .items-list .dv-item .opened-desktop .sub-items { display: block } } .dv-topic-filter .sub-item { align-items: center; cursor: pointer; display: block; font-size: 1.4rem; margin-top: 2rem; padding: 0 !important } .dv-topic-filter .sub-item span { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 0 100%; background-repeat: no-repeat; background-size: 205% 2px; display: inline; font-family: GilroyRegular; overflow: hidden; pointer-events: none; transition: all .25s linear } @media(min-width: 1024px) { .dv-topic-filter .sub-item { display: block; font-size: 1.2rem; margin-left: 1.8rem; margin-top: 1.5rem; padding: 0 0 0 3.2rem !important; text-indent: -1.7rem } .dv-topic-filter .sub-item:before { content: "-"; margin-right: 1rem } .dv-topic-filter .sub-item.selected { border-left: .3rem solid #a6cabd; font-family: GilroyBold; margin-left: -.1rem; padding-left: 4.8rem !important; transition: all 0s } .dv-topic-filter .sub-item span { background-position: 100% 100% } .dv-topic-filter .sub-item:not(.selected):hover span { background-position: 0 100% } } @media(min-width: 1700px) { .dv-topic-filter .sub-item { font-size: 1.4rem } } .cards-grid .loading { animation: spin .9s linear infinite; border: 1.2rem solid #f3f3f3; border-radius: 50%; border-top-color: #a6cabd; display: none; height: 5.5rem; margin-top: 3rem; width: 5.5rem } .cards-grid .loading .loading { display: block } .cards-grid .no-results { display: none; font-size: 1.7rem; margin-top: 3rem } .cards-grid .no-results .no-results { display: block } .cards-grid .cards-list { margin: 0 -1.5rem } @media(min-width: 650px) { .cards-grid .cards-list { display: flex; flex-wrap: wrap; padding: 0 4rem } } @media(min-width: 1024px) { .cards-grid .cards-list { padding: 0 } } @media(min-width: 1700px) { .cards-grid .cards-list { margin: 0 -2rem } } .cards-grid .card-item { background-color: #fff; border-bottom: .4rem solid; border-radius: .6rem; display: block; height: 33rem; line-height: 1.3; margin: 1.5rem; overflow: hidden; padding: 2.2rem 2.5rem; position: relative; transform: translateZ(0) } @media(min-width: 650px) { .cards-grid .card-item { padding: 2.2rem; width: calc(50% - 3rem) } } @media(min-width: 768px) { .cards-grid .card-item { height: 32.5rem } } @media(min-width: 1024px) { .cards-grid .card-item { background-color: #f7f7f7; height: 32.8rem; margin: 1.5rem 2rem; padding: 3rem; transition: transform .25s; width: calc(50% - 4rem) } } @media(min-width: 1700px) { .cards-grid .card-item { height: 35.2rem; margin: 2rem; width: calc(33.333% - 4rem) } } .cards-grid .card-item .link { border-color: #81b5a1 } .cards-grid .card-item .video { border-color: #8686bc } .cards-grid .card-item .download { border-color: #68a1af } .cards-grid .card-item .page { border-color: #fc726d } .cards-grid .card-item .search { border-color: #81b5a1 } .cards-grid .card-item .tool { border-color: #293e40 } .cards-grid .card-item .learning { border-color: #e9bcbc } .cards-grid .card-item .blog { border-color: #fc726d } .cards-grid .card-item .calendar { border-color: #68a1af } .cards-grid .card-item.example-card { display: none } @media(min-width: 1024px) { .cards-grid .card-item:hover { box-shadow: 0 18px 20px 0 rgba(0,0,0,.06); transform: scale(1.02); transition: all .1s ease-in } } .cards-grid .resource-source { font: normal 1rem gilroyBold; margin-bottom: 2.5rem; text-transform: uppercase } .cards-grid .resource-title { font: normal 1.6rem gilroySemibold; margin-bottom: 2rem } @media(min-width: 768px) { .cards-grid .resource-title { font-size: 1.5rem } } @media(min-width: 1024px) { .cards-grid .resource-title { font-size: 1.6rem } } @media(min-width: 1700px) { .cards-grid .resource-title { font-size: 2rem } } .cards-grid .resource-desc { font-size: 1.4rem } @media(min-width: 768px) { .cards-grid .resource-desc { font-size: 1.35rem } } @media(min-width: 1024px) { .cards-grid .resource-desc { font-size: 1.4rem } } @media(min-width: 1700px) { .cards-grid .resource-desc { font-size: 1.8rem } } .cards-grid .card-item .resource-tagline-wrapper { display: none } .cards-grid .card-item.track-asset .resource-tagline-wrapper { align-items: center; bottom: 8.5rem; display: flex; margin: 2rem 0 0; position: absolute } @media(min-width: 1024px) { .cards-grid .card-item.track-asset .resource-tagline-wrapper { bottom: 3.5rem; margin-right: 11.2rem } } @media(min-width: 1700px) { .cards-grid .card-item.track-asset .resource-tagline-wrapper { bottom: 4.1rem } } .cards-grid .card-item.track-asset .resource-tagline-wrapper .resource-tagline-image { height: 2.8rem; margin-right: 1rem; width: auto } @media(min-width: 768px) { .cards-grid .card-item.track-asset .resource-tagline-wrapper .resource-tagline-image { height: 3rem } } .cards-grid .card-item.track-asset .resource-tagline-wrapper .resource-tagline-text { display: table; font-size: 1.4rem } .cards-grid .card-item.track-asset .resource-icon { bottom: 2.6rem } @media(min-width: 768px) { .cards-grid .card-item.track-asset .resource-icon { bottom: 2.6rem } } @media(min-width: 1024px) { .cards-grid .card-item.track-asset .resource-icon { bottom: 3.6rem } } .cards-grid .card-item .resource-icon { background-size: cover; border-radius: 50%; bottom: 3.6rem; height: 4rem; position: absolute; right: 3rem; width: 4rem } .cards-grid .card-item .link .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/link-icon.svg) } .cards-grid .card-item .video .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/video-icon.svg) } .cards-grid .card-item .download .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/download-icon.svg) } .cards-grid .card-item .page .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/page-icon.svg) } .cards-grid .card-item .search .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/search-icon.svg) } .cards-grid .card-item .tool .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/tools-icon.svg) } .cards-grid .card-item .learning .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/learning-icon.svg) } .cards-grid .card-item .blog .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/blog-icon.svg) } .cards-grid .card-item .calendar .resource-icon { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/csc/calendar-icon.svg) } @media(min-width: 768px) { .cards-grid .card-item .resource-icon { bottom: 2.6rem } } @media(min-width: 1024px) { .cards-grid .card-item .resource-icon { bottom: 3.6rem } } .cards-grid .show-more { align-items: center; cursor: pointer; display: none; justify-content: center; margin: 2.1rem auto 1.5rem; width: 15rem } @media(min-width: 650px) { .cards-grid .show-more { margin: 1.6rem auto 1.5rem } } @media(min-width: 1024px) { .cards-grid .show-more { margin: 1.5rem auto 0 } } @media(min-width: 1700px) { .cards-grid .show-more { margin: 2rem auto 0 } } .cards-grid .show-more .show-more { display: flex } .cards-grid .show-more-txt { font-size: 1.6rem; margin-right: 1rem } @media(min-width: 1700px) { .cards-grid .show-more-txt { font-size: 1.8rem } } .dv-dropdown-filter { align-items: center; color: #777; font-size: 1.5rem; justify-content: space-between; margin-bottom: 1.3rem } @media(min-width: 1024px) { .dv-dropdown-filter { display: flex } } .dv-dropdown-filter .left-txt { display: none; font-size: 1.2rem } @media(min-width: 1024px) { .dv-dropdown-filter .left-txt { display: block } } @media(min-width: 1700px) { .dv-dropdown-filter .left-txt { font-size: 1.5rem } } .dv-dropdown-filter .dropdown-field { position: relative; z-index: 1 } @media(min-width: 1024px) { .dv-dropdown-filter .dropdown-field { display: flex; height: 3.9rem } } .dv-dropdown-filter .capt-label { display: none; margin-top: 1.1rem } @media(min-width: 1024px) { .dv-dropdown-filter .capt-label { display: block } } .dv-dropdown-filter .dropdown-wrapper { height: 100% } .dv-dropdown-filter .dropdown { border-bottom: 1px solid #ccc; color: #333; font-size: 1.6rem; height: 100%; margin: 3.8rem 0; overflow: hidden } @media(min-width: 768px) { .dv-dropdown-filter .dropdown { margin: 3.8rem 0 2.3rem } } @media(min-width: 1024px) { .dv-dropdown-filter .dropdown { background: #fff; border: .1rem solid #444; border-radius: .5rem; font-size: 1.4rem; margin: 0 0 0 1.5rem; padding: 0 1.3rem .7rem } } .dv-dropdown-filter .dropdown .opened { height: auto; overflow: visible } .dv-dropdown-filter .drop-caption { align-items: center; cursor: pointer; display: flex; font-family: GilroyBold; height: 3.9rem; justify-content: space-between } @media(min-width: 1024px) { .dv-dropdown-filter .drop-caption { border-bottom: .1rem solid #ccc } } .dv-dropdown-filter .dropdown .close-arrow, .dv-dropdown-filter .dropdown .opened .open-arrow { display: none } .dv-dropdown-filter .dropdown .opened .close-arrow { display: block } .dv-dropdown-filter .dropdown .drop-options { display: none; padding: 1.4rem 0 2.3rem } @media(min-width: 768px) { .dv-dropdown-filter .dropdown .drop-options { padding: .6rem 0 1.5rem } } @media(min-width: 1024px) { .dv-dropdown-filter .dropdown .drop-options { display: block; padding: .7rem 3rem 0 0 } } .dv-dropdown-filter .dropdown .opened .drop-options { display: block } .dv-dropdown-filter .drop-opt { cursor: pointer; font-family: GilroyBold; padding: .7rem 0 } @media(min-width: 768px) { .dv-dropdown-filter .drop-opt { padding: 1.5rem 0 } } @media(min-width: 1024px) { .dv-dropdown-filter .drop-opt { font-family: GilroyRegular; padding: .5rem 0 } } .dv-dropdown-filter .drop-opt.slcted { font-family: GilroyBold } @media(max-width: 1023px) { body.disable-scroll-mobile { overflow: hidden } } .grid-content-cards-component { background: #fff; font-family: GilroyRegular; padding: 3rem 0 4rem; position: relative; z-index: 1 } .grid-content-cards-component .cards-overlay-visible { z-index: auto } @media(min-width: 768px) { .grid-content-cards-component { padding: 4rem 0 } } @media(min-width: 1024px) { .grid-content-cards-component { background: transparent } } .grid-content-cards-component .grid-cards-title { display: none; font-family: GilroyRegular; font-size: 2rem; margin: 0 0 4.5rem } @media(min-width: 1024px) { .grid-content-cards-component .grid-cards-title { display: block; margin: 0 0 4rem } } @media(min-width: 1700px) { .grid-content-cards-component .grid-cards-title { font-size: 2.4rem } .grid-content-cards-component .dv-cols { flex-wrap: nowrap } .grid-content-cards-component .filters-col { flex: 0 0 33rem; margin-right: 5.5rem } .grid-content-cards-component .cards-col { flex: 0 1 100%; max-width: none } } .grid-content-cards-component .right-col { background: #f7f7f7; bottom: 0; display: none; left: 0; overflow: auto; padding-bottom: 2.5rem; position: fixed; right: 0; top: 0; z-index: 10001 } .grid-content-cards-component .cards-overlay-visible .right-col { display: block } @media(min-width: 1024px) { .grid-content-cards-component .right-col { background: transparent; display: block; overflow: visible; padding: 0 0 0 2rem; position: static } } @media(min-width: 1700px) { .grid-content-cards-component .right-col { padding: 0 0 0 3rem } } .grid-content-cards-component .overlay-header { background: #fff; padding-top: 2rem } @media(min-width: 1024px) { .grid-content-cards-component .overlay-header { display: none } } .grid-content-cards-component .close-overlay { display: block; font-size: 4.5rem; line-height: 2.2rem; margin: 0 2rem 0 auto; width: 2.2rem } .grid-content-cards-component .close-overlay:before { content: "×" } .grid-content-cards-component .selected-topic { border-top: 1px solid #e6e6e6; color: #333; font: normal 1.6rem GilroyBold; margin-top: 1.5rem; padding: 2rem } .grid-content-cards-component .dv-dropdown-cards-grid { border-top: 1px solid transparent; padding: 0 2rem } @media(min-width: 1024px) { .grid-content-cards-component .dv-dropdown-cards-grid { border: none; padding: 0 } } .track-asset > * { pointer-events: none } .component-csc-meganav { align-items: center; background-color: #fff; display: flex; height: 5.7rem; justify-content: space-between; left: 0; padding: 2rem; position: absolute; right: 0; top: 0; transition: all .5s ease; transition-property: background-color,opacity; z-index: 898 } .component-csc-meganav .csc-meganav-icon img { height: 2rem } .component-csc-meganav .csc-meganav-icon img.csc-meganav-marquee-icon { display: none } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons { display: flex; flex-direction: row-reverse } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-menu-toggle, .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search-icon { border: none; cursor: pointer; outline: none } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-menu-toggle { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMSAxMC41aDIyTTEgMS41aDIyIi8+PC9nPjwvc3ZnPg==); background-position: 50%; background-repeat: no-repeat; background-size: 2rem; display: inline-block; height: 2rem; margin: 0 0 0 2rem; vertical-align: middle; width: 2rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input { border: none; color: #293e40; display: none; flex-grow: 1; font-family: GilroyBold; font-size: 1.6rem; max-width: 100%; opacity: 0; outline: none; transition: opacity .5s ease } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input::-ms-clear { display: none } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGVsbGlwc2UgdHJhbnNmb3JtPSJyb3RhdGUoLTQ1IDExLjk4MiAxMi4wODUpIiBjeD0iMTEuOTgyIiBjeT0iMTIuMDg1IiByeD0iNy44MTMiIHJ5PSI3LjkwOSIvPjxwYXRoIGQ9Im0xOC40MjYgMTguNDc3IDUuMzk3IDUuMzk3IiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIi8+PC9nPjwvc3ZnPg=="); background-position: 50%; background-repeat: no-repeat; background-size: 2rem; display: inline-block; height: 2rem; margin: 0 0 0 2rem; vertical-align: middle; width: 2rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu { background-color: #f7f7f7; display: none; padding: 0 2rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul { margin: 0; padding: 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li a { color: rgba(41,62,64,.6); display: block; font-family: GilroyBold; font-size: 1.8rem; padding: 2rem 0; width: 100% } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li a b { color: #293e40; font-family: inherit; font-size: inherit; line-height: inherit } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li + li, .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li:first-child { border-top: 1px solid #d8d8d8 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel { background-color: #fff; border-bottom: .4rem solid #293e40; display: none } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul { margin: 0; padding: 0 2rem } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li { border-bottom: 1px solid #d8d8d8 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:last-child { border-bottom: none } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li > div { width: 100% } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li + li, .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:first-child { align-items: center; display: flex; margin-bottom: 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li + li > div, .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:first-child > div { width: 100% } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li + li > div:nth-last-child(2), .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) { align-items: center; display: flex; padding-left: .4rem; position: absolute; width: 2rem; z-index: 1 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li + li > div:nth-last-child(2) > span, .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) > span { align-items: center; background: transparent; border: none; cursor: pointer; display: flex; flex-direction: column; height: 2rem; margin-right: .2rem; outline: none; padding: 0; position: relative; transform: rotate(-45deg) } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li + li > div:nth-last-child(2) > span:before, .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) > span:before { border: .22rem solid #979797; border-radius: 50%; content: ""; display: inline-block; height: 1.25rem; width: 1.25rem } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li + li > div:nth-last-child(2) > span:after, .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) > span:after { background: #979797; border-radius: .5rem; bottom: 0; content: ""; display: inline-block; height: .75rem; position: absolute; width: .2rem } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul .category-link a { background-color: #fff; border-top: .1rem solid #eee; color: #293e40; display: inline-block; font-family: GilroyRegular; font-size: 1.4rem; font-style: italic; line-height: 1.7rem; margin: 0; outline: 0; padding: 2.2rem 2.6rem; position: relative; width: 100%; z-index: 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul .category-link a:first-child { border-top: 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul .category-link a:before { background: transparent; content: ""; padding: inherit; position: absolute; width: 100% } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul .category-link a b { color: #293e40 } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:not(.category-link) a { color: #979797; display: inline-block; font-family: GilroySemiBold,Arial,sans-serif; font-size: 1.4rem; line-height: 1.7rem; margin: 0; outline: 0; padding: 2.2rem 2.6rem; position: relative; width: 100% } .component-csc-meganav .csc-meganav-container .csc-meganav-search-panel ul li:not(.category-link) a b { color: #293e40; font-family: inherit; font-size: inherit; line-height: inherit; pointer-events: none } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li a { color: #293e40 } .component-csc-meganav.open { background: #fff; position: fixed; z-index: 999 } .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-toggle { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQwIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMTcuNTM2IDE3LjU1NiAyIDJNMiAxNy41NTYgMTcuNTM2IDIiLz48L2c+PC9zdmc+) } .component-csc-meganav.open .csc-meganav-container .csc-meganav-search { display: none } .component-csc-meganav.open .csc-meganav-menu { border-top: 1px solid #d8d8d8; bottom: 0; display: block; height: 100%; left: 0; overflow: hidden; position: fixed; right: 0; top: 5.7rem; width: 100% } .component-csc-meganav.search-open { background: #fff; z-index: 999 } .component-csc-meganav.search-open .csc-meganav-menu, .component-csc-meganav.search-open .csc-meganav-menu-toggle { display: none } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search { align-items: center; background: #fff; display: flex; height: 5.7rem; left: 0; margin: 0; padding: 2rem; position: fixed; right: 0; top: 0 } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search:after { background-color: #f7f7f7; border-top: 1px solid #d8d8d8; bottom: 0; content: ""; display: block; height: 100%; left: 0; margin: 0; overflow: hidden; position: fixed; right: 0; top: 5.7rem; width: 100% } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search input { display: block; opacity: 1 } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search .csc-meganav-search-icon { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQwIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMTcuNTM2IDE3LjU1NiAyIDJNMiAxNy41NTYgMTcuNTM2IDIiLz48L2c+PC9zdmc+) } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel { border-top: 1px solid #d8d8d8; bottom: 0; display: block; height: 100%; left: 0; margin: 0; overflow: hidden; position: fixed; right: 0; top: 5.7rem; width: 100%; z-index: 1 } @media screen and (min-width: 768px) { .component-csc-meganav { height: 7.1rem; padding: 3rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons div { margin: 0 0 0 3rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input { padding: 1.5rem 0 } .component-csc-meganav.open .csc-meganav-menu { padding: 0 3rem; top: 7.1rem } .component-csc-meganav.open .csc-meganav-menu ul li a { font-size: 2.2rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search { height: 7.1rem; padding: 0 3rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search input { font-size: 2.2rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel, .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search:after { top: 7.1rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel ul { padding: 0 3rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel ul li + li > div, .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel ul li:first-child > div, .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel ul li > div { margin: 0 } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-search-panel ul li:not(.category-link) a { font-size: 1.6rem; line-height: 2rem } } @media screen and (min-width: 1024px) { .component-csc-meganav, .component-csc-meganav.open { height: 11rem; z-index: 898 } .component-csc-meganav .csc-meganav-container, .component-csc-meganav.open .csc-meganav-container { display: flex } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-menu-toggle, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-menu-toggle { display: none } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search { align-items: center; background-color: #fff; border: 1px solid #293e40; border-radius: 1rem; display: flex; height: 7rem; justify-content: center; left: auto; margin: 0; position: relative; right: auto; top: auto; transition: width .5s ease; width: 7rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { bottom: 2.5rem; margin: 0; padding: 0; position: absolute; right: 2.5rem; top: 2.5rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel { height: 0; transition: height .5s ease } .component-csc-meganav .csc-meganav-container .csc-meganav-menu, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu { align-items: center; background-color: transparent; border: none; display: flex; height: 7rem; opacity: 1; padding: 0; position: absolute; right: 10rem; transition: opacity .5s ease; width: auto } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul { display: flex; max-width: 100%; white-space: nowrap } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul li { padding: 0 2.5rem 0 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li a, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul li a { color: #293e40; font-size: 1.4rem; padding: 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li + li, .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li:first-child, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul li + li, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul li:first-child { border: none; margin-bottom: 0 } .component-csc-meganav.search-open:after { background-color: transparent; bottom: 0; content: ""; height: 100%; left: 0; opacity: .2; position: fixed; right: 0; top: 0; width: 100%; z-index: -1 } .component-csc-meganav.search-open #csc_search_container { flex-grow: 1 } .component-csc-meganav.search-open .csc-meganav-container { width: 100% } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu { opacity: 0; transition: opacity .5s ease } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search { height: 7rem; width: 77rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search:after { display: none } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input { font-family: GilroySemibold; font-size: 1.6rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGVsbGlwc2UgdHJhbnNmb3JtPSJyb3RhdGUoLTQ1IDExLjk4MiAxMi4wODUpIiBjeD0iMTEuOTgyIiBjeT0iMTIuMDg1IiByeD0iNy44MTMiIHJ5PSI3LjkwOSIvPjxwYXRoIGQ9Im0xOC40MjYgMTguNDc3IDUuMzk3IDUuMzk3IiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIi8+PC9nPjwvc3ZnPg=="); background-position: 50%; background-repeat: no-repeat; background-size: 2rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel { background-color: #fff; border-bottom: .4rem solid #293e40; border-radius: 0 0 .4rem .4rem; border-top: none; bottom: auto; height: auto; left: -1px; position: absolute; right: -1px; top: 6rem; width: auto } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul { border-top: .2rem solid #f7f7f7; padding: .5rem 0 0 } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li:hover { background-color: #f7f7f7 } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li + li, .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li:first-child { border: none } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li + li:hover, .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li:first-child:hover { background-color: #f7f7f7 } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li + li > div:nth-last-child(2), .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) { left: 2.6rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul .category-link a { background-color: #fff; font-size: 1.6rem; padding: 1rem 5.2rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li:not(.category-link) a { font-family: GilroySemibold; font-size: 1.6rem; padding: 1.2rem 0 1.2rem 5.4rem } } @media screen and (min-width: 1700px) { .component-csc-meganav { margin: auto; max-width: 170rem } .component-csc-meganav, .component-csc-meganav.open { height: 11.7rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu { right: 47.7rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul { display: flex } .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul li { padding: 0 6rem 0 0 } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search { background-position: 39.4rem; position: relative; width: 44.7rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input { bottom: 0; display: block; font-family: GilroySemibold; font-size: 1.8rem; height: 6.8rem; left: 3.3rem; opacity: 1; padding: 0; position: absolute; top: 0; transition: width .5s; width: 32.1rem } .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon, .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { bottom: 2.5rem; position: absolute; right: 3.3rem; top: 2.5rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search { width: 106.4rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search input { font-size: 1.8rem; width: 91.2rem } .component-csc-meganav.search-open .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel ul li:not(.category-link) a { font-size: 1.8rem; padding-right: 1.3rem } } .is-csc-marquee-page .cscMegaNav { padding-top: 0 !important } .is-csc-marquee-page .component-csc-meganav { background-color: transparent; height: 6rem; position: absolute } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon img { height: 1.2rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon img.csc-meganav-marquee-icon { display: block } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon img.csc-meganav-white-icon { display: none } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon:before { background-color: #293e40; border-radius: 50%; content: ""; height: 30rem; left: -13rem; position: absolute; top: -23rem; width: 30rem; z-index: -1 } .is-csc-marquee-page .component-csc-meganav.open { background-color: #fff; position: fixed } .is-csc-marquee-page .component-csc-meganav.open .csc-meganav-icon { visibility: hidden } .is-csc-marquee-page .component-csc-meganav.open .csc-meganav-menu { top: 6rem } @media screen and (min-width: 768px) { .is-csc-marquee-page .component-csc-meganav { height: 6.4rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon img { height: 1.4rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon:before { border-radius: 50%; height: 42rem; height: 44rem; left: -19rem; left: -22rem; top: -31rem; top: -32rem; width: 42rem; width: 44rem } .is-csc-marquee-page .component-csc-meganav.open .csc-meganav-menu { top: 6.4rem } .is-csc-marquee-page .component-csc-meganav.search-open .csc-meganav-search { height: 6.4rem } .is-csc-marquee-page .component-csc-meganav.search-open .csc-meganav-search-panel, .is-csc-marquee-page .component-csc-meganav.search-open .csc-meganav-search:after { top: 6.4rem } } @media screen and (min-width: 1024px) { .is-csc-marquee-page .component-csc-meganav { background-color: transparent; height: 12rem; padding: 3rem 4rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon img { height: 2rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-icon:before { border-radius: 50%; height: 40rem; left: -32rem; top: -26rem; width: 60rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-container .csc-meganav-menu { right: 12rem } .is-csc-marquee-page .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li a { color: #fff } .is-csc-marquee-page .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search { border: none } .is-csc-marquee-page .component-csc-meganav .csc-meganav-container .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-panel { left: 0; right: 0 } } @media screen and (min-width: 1700px) { .is-csc-marquee-page .component-csc-meganav { background-color: transparent } .is-csc-marquee-page .component-csc-meganav .csc-meganav-container .csc-meganav-menu { right: 49.7rem } } @media screen and (min-width: 1024px) { .is-csc-marquee-page.csc-meganav-dark .component-csc-meganav .csc-meganav-container .csc-meganav-menu ul li a, .is-csc-marquee-page.csc-meganav-dark .component-csc-meganav.open .csc-meganav-container .csc-meganav-menu ul li a { color: #293e40 } } .cscMegaNav { padding-top: 5.7rem } @media screen and (min-width: 768px) { .cscMegaNav { padding-top: 7.1rem } } @media screen and (min-width: 1024px) { .cscMegaNav { padding-top: 11rem } } @media screen and (min-width: 1700px) { .cscMegaNav { padding-top: 11.7rem } } .section.cscArcIntro .csc-arc-intro-comp { font-size: 1.4rem; margin: 3rem 0 2rem } .section.cscArcIntro .csc-arc-intro-comp .desc-body ul li p { margin-bottom: 0 } @media(min-width: 768px) { .section.cscArcIntro .csc-arc-intro-comp { font-size: 1.2rem; margin: 4rem 0 2rem } } @media(min-width: 1024px) { .section.cscArcIntro .csc-arc-intro-comp { font-size: 1.6rem; margin: 4rem 0 } } @media(min-width: 1700px) { .section.cscArcIntro .csc-arc-intro-comp { font-size: 1.4rem; margin: 6rem 0 4rem } } .csc-arc-intro-comp .arc-title { font-family: GilroyBold; font-size: 1.8rem; margin: 2rem 0 } @media(min-width: 768px) { .csc-arc-intro-comp .arc-title { font-size: 2.8rem } } @media(min-width: 1024px) { .csc-arc-intro-comp .arc-title { font-size: 3.6rem } } @media(min-width: 1700px) { .csc-arc-intro-comp .arc-title { font-size: 4.8rem } } .csc-arc-intro-comp .color-title { font-size: inherit } .csc-arc-intro-comp .desc-body p:first-child { margin: 0 0 2rem } @media(min-width: 768px) { .csc-arc-intro-comp .desc-body p:first-child { font-size: 1.6rem; margin: 0 0 2.2rem } } @media(min-width: 1700px) { .csc-arc-intro-comp .desc-body p:first-child { font-size: 1.8rem; margin: 0 0 3rem } } .section.cscArcIntro ul { display: block !important; list-style: disc outside; padding: 0 0 0 1.5rem !important } .section.cscArcIntro ul li { list-style: inherit; margin: 3rem 0; padding: 0 0 0 .8rem !important } @media(min-width: 768px) { .section.cscArcIntro ul li { margin: 1.5rem 0 } } @media(min-width: 1700px) { .section.cscArcIntro ul li { margin: 2rem 0 } } .section.cscFeaturedResourceCard { position: relative } .csc-featured-card { border-radius: .4rem; line-height: 1.5; margin: 2rem 0; overflow: hidden; padding: 3rem 3rem 2rem; position: relative; z-index: 1 } @media(min-width: 768px) { .csc-featured-card { display: flex; margin: 4rem 0; padding: 3rem 3.2rem } } @media(min-width: 1024px) { .csc-featured-card { padding: 3rem 4.2rem } } @media(min-width: 1700px) { .csc-featured-card { margin: 6rem 0; padding: 4rem 5.8rem 4rem 4rem } } .csc-featured-card .dv-left-col { flex: 0 1 100%; min-width: 0 } @media(min-width: 768px) { .csc-featured-card .dv-left-col { padding-right: 2.9rem } } @media(min-width: 1024px) { .csc-featured-card .dv-left-col { padding-right: 11.7rem } } @media(min-width: 1700px) { .csc-featured-card .dv-left-col { padding-right: 5.4rem } } .billboard-marquee-component .billboard-marquee-eyebrow .csc-featured-card span, .billboard-marquee-component .csc-featured-card .billboard-marquee-eyebrow, .csc-featured-card .billboard-marquee-component .billboard-marquee-eyebrow, .csc-featured-card .billboard-marquee-component .billboard-marquee-eyebrow span, .csc-featured-card .eyebrow { display: none; font: normal 1rem GilroyBold; letter-spacing: .08rem; margin-bottom: .5rem } .billboard-marquee-component .billboard-marquee-eyebrow .csc-featured-card span.na, .billboard-marquee-component .csc-featured-card .na.billboard-marquee-eyebrow, .csc-featured-card .billboard-marquee-component .billboard-marquee-eyebrow span.na, .csc-featured-card .billboard-marquee-component .na.billboard-marquee-eyebrow, .csc-featured-card .eyebrow.na { color: #99c3b3 } @media(min-width: 768px) { .billboard-marquee-component .billboard-marquee-eyebrow .csc-featured-card span, .billboard-marquee-component .csc-featured-card .billboard-marquee-eyebrow, .csc-featured-card .billboard-marquee-component .billboard-marquee-eyebrow, .csc-featured-card .billboard-marquee-component .billboard-marquee-eyebrow span, .csc-featured-card .eyebrow { display: block } } .csc-featured-card div.card-title { font-family: GilroyBold; font-size: 1.4rem } @media(min-width: 768px) { .csc-featured-card div.card-title { font-size: 1.6rem } } @media(min-width: 1024px) { .csc-featured-card div.card-title { font-size: 2rem } } @media(min-width: 1700px) { .csc-featured-card div.card-title { font-size: 2.2rem } } .csc-featured-card .card-desc { font-size: 1.4rem; margin: 1rem 0 3rem } @media(min-width: 768px) { .csc-featured-card .card-desc { font-size: 1.6rem; margin: 1rem 0 2.5rem } } @media(min-width: 1024px) { .csc-featured-card .card-desc { font-size: 1.4rem; margin: .5rem 0 3.6rem } } @media(min-width: 1700px) { .csc-featured-card .card-desc { font-size: 1.8rem; margin: 1rem 0 3.8rem } } .csc-featured-card .card-desc p { font-size: inherit } .csc-featured-card .dv-left-col .cta-component a { background: none !important } .csc-featured-card .dv-right-col { display: none; max-width: 37rem; width: 33.33% } @media(min-width: 768px) { .csc-featured-card .dv-right-col { align-self: flex-end; display: block } } .csc-featured-card .dv-right-col .component-asset-block > .video-js, .csc-featured-card .dv-right-col .component-asset-block > video { height: 19rem } .csc-featured-card .dv-star { height: 4.2rem; position: absolute; right: 0; top: 0; width: 4.4rem } @media(min-width: 768px) { .csc-featured-card .dv-star { height: 3.4rem; width: 3.8rem } } @media(min-width: 1024px) { .csc-featured-card .dv-star { height: 5rem; width: 5rem } } @media(min-width: 1700px) { .csc-featured-card .dv-star { height: 4.8rem; width: 5rem } } .csc-featured-card .back-circle { background: #293e40; border-radius: 50%; bottom: 0; height: 200%; left: 0; position: absolute; width: 200% } .csc-featured-card .star-icon { color: #fff; font-size: 1.2rem; position: absolute; right: 1rem; top: 1.1rem } @media(min-width: 768px) { .csc-featured-card .star-icon { right: .8rem; top: .7rem } } @media(min-width: 1024px) { .csc-featured-card .star-icon { right: 1.3rem; top: 1.3rem } } @media(min-width: 1700px) { .csc-featured-card .star-icon { top: 1.5rem } } .section.cscFeaturedResourceCard .dots-bck { bottom: -3.7rem; display: none; height: 15rem; opacity: .18; position: absolute; right: -2.5rem; width: 14rem } @media(min-width: 1024px) { .section.cscFeaturedResourceCard .dots-bck { display: block } } .component-ucsc-offramp-tiles { position: relative } .component-ucsc-offramp-tiles .cq-Editable-dom .cscOffRampTile { height: auto; margin-bottom: 1rem } .component-ucsc-offramp-tiles .cq-Editable-dom .hover-content { display: block } .component-ucsc-offramp-tiles .padding-zero-top { padding-top: 0 } .component-ucsc-offramp-tiles .padding-zero-bot { padding-bottom: 0 } .component-ucsc-offramp-tiles .padding-40-top { padding-top: 4rem } .component-ucsc-offramp-tiles .padding-40-bot { padding-bottom: 4rem } .component-ucsc-offramp-tiles .padding-80-top { padding-top: 8rem } .component-ucsc-offramp-tiles .padding-80-bot { padding-bottom: 8rem } .component-ucsc-offramp-tiles .left-scroll-arrow, .component-ucsc-offramp-tiles .right-scroll-arrow { display: none } .component-ucsc-offramp-tiles .title { margin-bottom: 1rem; margin-top: 0 } .component-ucsc-offramp-tiles .subtitle { margin-bottom: 2rem } .component-ucsc-offramp-tiles .offramp-tiles-inner-wrapper { overflow: hidden; padding: 0; scrollbar-width: none } .component-ucsc-offramp-tiles .pure-white-cta path, .component-ucsc-offramp-tiles .pure-white-cta polyline { stroke: #fff !important } .component-ucsc-offramp-tiles .gable-green-cta path, .component-ucsc-offramp-tiles .gable-green-cta polyline { stroke: #293e40 !important } .component-ucsc-offramp-tiles .cscOffRampTile { border-radius: .6rem; margin-bottom: 1rem; padding: 2rem; position: relative; transition: all .2s ease-in-out } .component-ucsc-offramp-tiles .cscOffRampTile .comp-full-bleed-bg-color { border-radius: .6rem } .component-ucsc-offramp-tiles .cscOffRampTile .title { font-size: 1.6rem } .component-ucsc-offramp-tiles .cscOffRampTile .cta { text-align: right } .component-ucsc-offramp-tiles .cscOffRampTile.active { background-color: #81b5a1 } .component-ucsc-offramp-tiles .cscOffRampTile.active .static-content { display: none } .component-ucsc-offramp-tiles .cscOffRampTile.active .hover-content { display: block } .component-ucsc-offramp-tiles .cscOffRampTile.active .chevron { margin-top: 3px } .component-ucsc-offramp-tiles .cscOffRampTile.active .chevron:before { color: #fff; transform: rotate(-45deg); transition: all .2s ease-in-out } .component-ucsc-offramp-tiles .cscOffRampTile.active .patch { background: radial-gradient(#fff 1.1px,transparent 0),radial-gradient(#fff 1.1px,transparent 0),transparent; background-position: 11px 21px,1px 11px,0 0,0 0,0 0; background-size: 20px 20px,20px 20px; height: 8rem } .component-ucsc-offramp-tiles .static-content .cta { display: none } .component-ucsc-offramp-tiles .dark-variation.static-content .text { color: #fff } .component-ucsc-offramp-tiles .dark-variation.patch { background: radial-gradient(#fff 1.1px,transparent 0),radial-gradient(#fff 1.1px,transparent 0),transparent; background-position: 11px 21px,1px 11px,0 0,0 0,0 0; background-size: 20px 20px,20px 20px } .component-ucsc-offramp-tiles .dark-variation.chevron:before { color: #fff } .component-ucsc-offramp-tiles .dark-variation.comp-full-bleed-bg-color { fill: #293e40 !important; stroke: #293e40 !important; background-color: #293e40 !important } .component-ucsc-offramp-tiles .chevron { align-items: center; display: flex; height: 2rem; justify-content: center; position: absolute; right: 2rem; top: 2rem; width: 2rem } .component-ucsc-offramp-tiles .chevron:before { border-style: solid; border-width: .2rem .2rem 0 0; color: #293e40; content: ""; display: inline-block; height: 1rem; transform: rotate(-225deg); transition: all .2s ease-in-out; width: 1rem } .component-ucsc-offramp-tiles .title { font-family: gilroyBold; font-size: 1.8rem } .component-ucsc-offramp-tiles .text { margin-top: .6rem } .component-ucsc-offramp-tiles .hover-content { color: #fff; display: none } .component-ucsc-offramp-tiles .cta-component { margin: 0 } .component-ucsc-offramp-tiles .cta-component a { font-family: gilroyBold } .component-ucsc-offramp-tiles .links { font-family: gilroyBold; padding-left: .4rem } .component-ucsc-offramp-tiles .links li { align-items: baseline; display: flex; margin-bottom: 1.5rem } .component-ucsc-offramp-tiles .links li:before { content: "›"; font-size: 1.8rem; margin-right: .75rem } .component-ucsc-offramp-tiles .links li a { color: #fff; font-family: gilroyBold; text-decoration: underline } .component-ucsc-offramp-tiles .patch { background: radial-gradient(#5b6f70 1.1px,transparent 0),radial-gradient(#5b6f70 1.1px,transparent 0),transparent; background-position: 11px 21px,1px 11px,0 0,0 0,0 0; background-size: 20px 20px,20px 20px; bottom: 0; height: 5.2rem; opacity: .4; position: absolute; right: 0; width: 5rem } @media only screen and (min-width: 768px) { .component-ucsc-offramp-tiles .left-scroll-arrow, .component-ucsc-offramp-tiles .right-scroll-arrow { display: none } .component-ucsc-offramp-tiles .offramp-tiles-outer-wrapper { display: flex; justify-content: center } .component-ucsc-offramp-tiles .offramp-tiles-inner-wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 } .component-ucsc-offramp-tiles .title { font-size: 2.2rem } .component-ucsc-offramp-tiles .subtitle { margin-bottom: 4rem } .component-ucsc-offramp-tiles .cscOffRampTile { display: table-cell; margin-bottom: 2rem; width: 47.5% } .component-ucsc-offramp-tiles .cscOffRampTile .title { font-size: 1.8rem } .component-ucsc-offramp-tiles .text { font-size: 1.4rem } .component-ucsc-offramp-tiles .cta a { font-size: 1.4rem !important } .component-ucsc-offramp-tiles .links { width: 88% } .component-ucsc-offramp-tiles .links li { font-size: 1.4rem; margin-bottom: .6rem } .component-ucsc-offramp-tiles .active .patch { display: none } } @media only screen and (min-width: 1024px) { .component-ucsc-offramp-tiles .left-scroll-arrow, .component-ucsc-offramp-tiles .right-scroll-arrow { display: unset } .component-ucsc-offramp-tiles .offramp-tiles-inner-wrapper { flex-wrap: unset; padding: 1.8rem 2rem 4rem } .component-ucsc-offramp-tiles .offramp-tiles-inner-wrapper:after { content: "."; display: block; height: 4rem; margin-left: -2.4rem; opacity: 0; padding: 0; width: 4rem } .component-ucsc-offramp-tiles .inner-wrapper { padding: 4rem 0 0 } .component-ucsc-offramp-tiles .chevron { display: none } .component-ucsc-offramp-tiles h3.title { margin: 0 2rem } .component-ucsc-offramp-tiles .title { margin-bottom: 1.8rem } .component-ucsc-offramp-tiles .cta { margin-right: -2.8rem } .component-ucsc-offramp-tiles .cscOffRampTile { height: 100%; margin-bottom: 0; margin-right: 4rem; min-width: calc(33.6% - 3rem); overflow: hidden; padding: 3rem; position: relative; width: 30.5% } .component-ucsc-offramp-tiles .cscOffRampTile .title { margin-bottom: 1rem } .component-ucsc-offramp-tiles .cscOffRampTile .static-content { height: calc(100% - 6rem); position: absolute; width: calc(100% - 6rem) } .component-ucsc-offramp-tiles .cscOffRampTile .static-content .cta { bottom: 0; display: block; position: absolute; right: 0 } .component-ucsc-offramp-tiles .cscOffRampTile .hover-content { display: flex; flex-direction: column; height: 100%; visibility: hidden } .component-ucsc-offramp-tiles .cscOffRampTile .hover-content .cta { margin-top: auto } .component-ucsc-offramp-tiles .cscOffRampTile .hover-content a { text-decoration: none } .component-ucsc-offramp-tiles .cscOffRampTile .hover-content a:hover { text-decoration: underline } .component-ucsc-offramp-tiles .cscOffRampTile:hover { background-color: #81b5a1; box-shadow: 0 18px 20px 0 rgba(0,0,0,.06); transform: scale3d(1.02,1.02,1.02) } .component-ucsc-offramp-tiles .cscOffRampTile:hover .comp-full-bleed-bg-color, .component-ucsc-offramp-tiles .cscOffRampTile:hover .static-content { display: none } .component-ucsc-offramp-tiles .cscOffRampTile:hover .hover-content { visibility: unset } .component-ucsc-offramp-tiles .cscOffRampTile:hover .patch { display: none } .component-ucsc-offramp-tiles .patch { height: 9rem; right: -1.5rem; top: 0 } .component-ucsc-offramp-tiles .title { font-size: 2.4rem; padding: 0 } .component-ucsc-offramp-tiles .left-scroll-arrow, .component-ucsc-offramp-tiles .right-scroll-arrow { border-radius: 100%; cursor: pointer; height: 8.3rem; position: absolute; top: calc(50% - 2rem); width: 8.3rem; z-index: 3 } .component-ucsc-offramp-tiles .left-scroll-arrow { left: 0; transform: rotate(180deg) } .component-ucsc-offramp-tiles .right-scroll-arrow { right: 0 } } @media only screen and (min-width: 1700px) { .component-ucsc-offramp-tiles .title { font-size: 2.8rem; margin-bottom: 1.6rem } .component-ucsc-offramp-tiles .links { margin: 0 } .component-ucsc-offramp-tiles .offramp-tiles-inner-wrapper { padding: 1.6rem 1rem 2rem } .component-ucsc-offramp-tiles .cscOffRampTile { min-width: calc(20.66% + 4rem) } .component-ucsc-offramp-tiles .cscOffRampTile .title { font-size: 2rem; margin-bottom: 1.6rem } } .partner-listing-component { background-color: #f7f7f7; display: block; overflow: hidden; padding: 2rem 0 } .partner-listing-component .partner-listing-section { display: flex; flex-direction: column } .partner-listing-component .partner-listing-inner-wrapper { margin: auto; max-width: 124rem } .partner-listing-component select { -webkit-appearance: none; background: #fff; background-image: url(https://www.servicenow.com/content/dam/servicenow/images/demo-asset/icon/arrow-down.png); background-position: 97%; background-repeat: no-repeat; border: 0; color: #fff; cursor: pointer; font-family: GilroyRegular; height: 5.6rem; height: 4.8rem; line-height: 3.72rem; outline: none; padding-left: 2rem; text-align: left; width: 100% } .partner-listing-component select option { color: #5f6e70 } .partner-listing-component .filter-dropdown-component { position: relative } .partner-listing-component .filter-dropdown-component .title { display: none } .partner-listing-component .filter-dropdown-component span { line-height: 5.2rem; margin: 0 0 0 2rem; overflow: hidden; pointer-events: none; position: absolute; text-overflow: ellipsis; white-space: nowrap; width: 80% } .partner-listing-component .filter-dropdown-component span strong { font-family: GilroyBold; font-style: bold } .partner-listing-component .partner-finder-search-container, .partner-listing-component .view-filters { margin: 0 auto 4.8rem; max-width: 44rem } .partner-listing-component .partner-finder-search-container .search-by-partner-type:after { content: "OR"; display: block; font-family: GilroySemibold; font-size: 12px; font-weight: 500; line-height: 40px; margin-left: auto; margin-right: auto; text-align: center; width: 30px } .partner-listing-component .partner-finder-search-container .search-by-partner-type span { color: #666; font-family: GilroySemibold; font-size: 18px; font-style: italic; font-weight: 500 } .partner-listing-component .partner-finder-search-container .search-by-partner-type span strong { color: #999; font-size: 11px; font-style: normal; font-weight: 700 } .partner-listing-component .partner-finder-search-container .search-area .search-field { background: #fff; border: 0; display: block; height: 48px; line-height: 6rem; margin: 0; padding: 0; position: relative; vertical-align: baseline; width: 100% } .partner-listing-component .partner-finder-search-container .search-area .search-field input { background: none; border: 0; color: #293e40; font-family: GilroySemibold; font-size: 1.6rem; height: 100%; margin: 0; outline: none; padding: 0; position: absolute; text-indent: 20px; vertical-align: baseline; width: 100% } .partner-listing-component .partner-finder-search-container .search-area .search-field button { background-color: transparent; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGVsbGlwc2UgdHJhbnNmb3JtPSJyb3RhdGUoLTQ1IDExLjk4MiAxMi4wODUpIiBjeD0iMTEuOTgyIiBjeT0iMTIuMDg1IiByeD0iNy44MTMiIHJ5PSI3LjkwOSIvPjxwYXRoIGQ9Im0xOC40MjYgMTguNDc3IDUuMzk3IDUuMzk3IiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIi8+PC9nPjwvc3ZnPg=="); background-position: 50%; background-repeat: no-repeat; border: none; height: 100%; margin: 0; padding: 0; position: absolute; right: 2rem; width: 4rem; z-index: 1 } .partner-listing-component .faceted-area { background-color: #f7f7f7; margin: auto auto 80px; max-width: 33rem; position: relative } .partner-listing-component .faceted-area .filter-title { display: none; margin-bottom: 30px } .partner-listing-component .faceted-area .filter-title span { font-size: 14px; font-weight: 700 } .partner-listing-component .faceted-area .faceted-area-box { background-color: #fff; height: 52px; margin-bottom: 14px; padding: 16px 15px 20px; position: relative } .partner-listing-component .faceted-area .faceted-area-box h4 { color: #333; display: inline-block; font-size: 12px; font-weight: 500; margin: -.8rem 0 0; width: 82% } .partner-listing-component .faceted-area .faceted-area-box:after { background-color: #fff; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAYAAAAxrNxjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0MEZCNkJGQTQ3MjA2ODExODIyQUU3MzE3RTk4NUU2OSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1MDJDMUZGMDNCNDgxMUUzQTI1Q0I5Mzg4MkFCQUMxNyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1MDJDMUZFRjNCNDgxMUUzQTI1Q0I5Mzg4MkFCQUMxNyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RkU2NTJERUEzMzIwNjgxMTgyMkFBOTQ5QjkzRTZCMjAiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NDBGQjZCRkE0NzIwNjgxMTgyMkFFNzMxN0U5ODVFNjkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6gvmjvAAAAbUlEQVR42mK0sbGRY2BguAHEnAzYwT0g1mICEo+AuIcBNygG4p9MUE4HED/BomgvEG8AMWAKvwFxOZqiP0BcAOMwIUksB+JjSPyZQHwFm8L/QJwPxP+A+C0Q1yMbz4Jm3RkgXgTE56CK4QAgwABYeBUy1+/pZgAAAABJRU5ErkJggg=="); background-repeat: no-repeat; content: ""; height: .7rem; pointer-events: none; position: absolute; right: 2rem; top: 2.3rem; width: 1rem } .partner-listing-component .faceted-area .faceted-area-box.expanded { height: auto } .partner-listing-component .faceted-area .faceted-area-box.expanded:after { transform: rotate(180deg) } .partner-listing-component .faceted-area .faceted-area-box.expanded .faceted-area-filters { display: block; margin: 0; padding: 0 } .partner-listing-component .faceted-area .faceted-area-box.expanded .faceted-area-filters li { margin: 1rem 0 } .partner-listing-component .faceted-area .faceted-area-box.expanded .faceted-area-filters li input { margin: 0 1rem 0 0; pointer-events: none; position: relative; top: .1rem } .partner-listing-component .faceted-area .reset-filter .btn-reset-filter { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4JpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyM0Y4RDFDNzFFMjA2ODExODIyQURBOUUyNUMxRUI1NSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo3Q0Y2NEVGRTc4OTMxMUU0OUJEM0VBMTkwMUEwQUQ5QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo3Q0Y2NEVGRDc4OTMxMUU0OUJEM0VBMTkwMUEwQUQ5QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNCAoTWFjaW50b3NoKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjc1YjA5OWI2LTA1OGMtNDk0OS1iN2JjLWNkZjg0YWMyY2ZhMiIgc3RSZWY6ZG9jdW1lbnRJRD0iYWRvYmU6ZG9jaWQ6cGhvdG9zaG9wOjdmMDdiZDdiLWI2MjUtMTE3Ny04YWU3LWFhODE3ZjEzN2I2MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqB3e+cAAAI5SURBVHjarJbdS9NRGMc35yQICi82CExWSMq87Mq7MIKgMmn5got5E0KDmE4iuimGxIiVLwyDLvSmCKQXEJVd2MSr/oNcLimiYOGNBXmlm34f+A5+jN/L+b088OHAOYfzPOc5zznn689kMj4bdh4MgUugG4TAEdgFX0ARLIFfqgs2K85rB8/AIGjSGT9LroKnYAFMgYrVwk0Kzke4u2FQAx9AAkTBKXCCmUlwTNa8B7bALbcZmAQ54AcrIA12dOb9IK/BBfAc3ABvQIRHZDuAOJ2LTYBZxeMqgz4G/8fMuVkAbeAVd5624VxrL1QmGdWAXI2TYBXM+LwxqYukSgbOgVFwCB545LwXzHHDX8GGWQbkngfAGie7tQ7wHgS57kf2GQZwme2yB85P8xhbG/oKbHUDiLL97NK57PYd6DTIimQioBdAiG3FZQByc65Y1EVeAnjJ97xOkBP+afryDgK4z2sshNl3oOkTkhJASluVOrYOxl1m4wzbXb13QKK6bfDEboMBUHUZwEW2JaOHaA9cY9p9mr7rDX1O7SbbotlLWGYmqhZZsWtd3FyVWsH0JfzEmqhZ1IUdy9HPIn9My6d43uedpXmM++CJU0EiizzitbFjKeoCucZj4LcTQSIfUxa0gB4TQdIo36ZBjM7lQ3vrVJLJmfWDv1Q4JX4scSqdFhJhn4x9o/P/4I6VLlARpQX+D4/BXS4eM5lfY7U/BD+9UsUVCoosxWkvZXmYtVGX5Zt0/l21UI4FGAC1G3gMp62ilAAAAABJRU5ErkJggg==") no-repeat 100%; color: #8a9298; cursor: pointer; display: block; font-family: GilroyBold; font-size: 12px; font-size: 1.2rem; margin: 0 9px 0 auto; padding: 15px 30px 15px 0; transition: background .25s ease 0s; width: 80px } .partner-listing-component .faceted-area .reset-filter .btn-reset-filter:active { box-shadow: inset 0 0 0 transparent } .partner-listing-component .view-filters { text-align: center } .partner-listing-component .view-filters .btn-view-filters { background-color: transparent; border: none; color: #333; font-family: GilroyBold; font-size: 1.6rem; margin: 0 1.5rem } .partner-listing-component .view-filters .btn-view-filters:after { color: #d1232b; content: "+"; margin-left: 10px } .partner-listing-component .view-filters.view-open .btn-view-filters:after { content: "-" } .partner-listing-component .partner-listing-results .partner-listing-section-header h3, .partner-listing-component .partner-listing-results .partner-listing-section-header img, .partner-listing-component .partner-listing-results h2 { margin-left: 20px } .partner-listing-component .partner-listing-results .partner-listing-section-item { background-color: #fff; float: none; height: auto; margin: 0 auto; position: relative; width: 100% } .partner-listing-component .partner-listing-results .partner-listing-section-item a { height: 100%; position: absolute; width: 100%; z-index: 1 } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component { border-bottom: 1px solid #efefef; display: flex; height: auto; margin: 0 auto; max-width: 440px; padding: 0 10px; position: static } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component img { bottom: 0; margin: auto; max-height: 40px; max-width: 85px; position: absolute; top: 0; width: auto } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component .partner-title { background: none; color: #666; display: block; font-size: 1.6rem; height: auto; left: 0; line-height: 26px; margin: 0 0 0 11rem; padding: 15px 0; position: static; text-align: left; white-space: normal } .partner-listing-component .partner-listing-results .partner-listing-section-item .navigation-tile-item-text { display: none } .partner-listing-component .partner-listing-results .partner-listing-section-item:last-of-type { height: auto } .partner-listing-component .partner-listing-results .partner-listing-section-item:last-of-type .image-component { border-bottom: none } .partner-listing-component .partner-listing-section-item .navigation-tile-item-text { height: 50px; width: 100% } .partner-listing-component .partner-listing-program-section .no-partners-found { margin-left: 20px } .partner-listing-component .results-pagination { display: none; text-align: center } .partner-listing-component .results-pagination ul { margin: 0; padding: 0 } .partner-listing-component .results-pagination li { display: inline } .partner-listing-component .results-pagination li + li.show-more-media-section:before { content: "|"; padding: 0 .5rem } @media screen and (min-width: 768px) { .partner-listing-component .partner-finder-search-container, .partner-listing-component .view-filters { max-width: 61rem } .partner-listing-component .partner-listing-results { margin: auto; width: 76rem } .partner-listing-component .partner-listing-results .partner-listing-section { display: flex; flex-direction: row; flex-wrap: wrap; margin: auto -1rem } .partner-listing-component .partner-listing-results .partner-listing-section-item { background-color: #fff; height: 24rem; margin: 0 1rem 2rem; position: relative; width: 24rem } .partner-listing-component .partner-listing-results .partner-listing-section-item:last-of-type { height: 24rem } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component, .partner-listing-component .partner-listing-results .partner-listing-section-item .video-component { background-color: #fff; display: block; height: 100%; overflow: hidden; width: 100% } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component img, .partner-listing-component .partner-listing-results .partner-listing-section-item .video-component img { bottom: 45px; left: 0; margin: auto; max-height: 140px; max-width: 180px; position: absolute; right: 0; top: 0 } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component .partner-title, .partner-listing-component .partner-listing-results .partner-listing-section-item .video-component .partner-title { background-color: rgba(0,0,0,.6); bottom: 0; color: #fff; display: block; font-family: GilroyRegular; font-size: 14px; font-size: 1.6rem; height: 45px; line-height: 45px; margin: 0; overflow: hidden; padding: 0 20px 0 10px; position: absolute; text-align: center; text-overflow: ellipsis; white-space: nowrap; width: 240px; z-index: 1 } .partner-listing-component .partner-listing-results .partner-listing-section-item a { bottom: 0; left: 0; position: absolute; right: 0; top: 0 } } @media screen and (min-width: 1280px) { .partner-listing-component { padding: 2rem } .partner-listing-component .view-filters { display: none } .partner-listing-component .faceted-area { clear: left; display: block; float: left; margin-right: 5rem; width: 31rem } .partner-listing-component .faceted-area .faceted-area-box { background-position: 275px 25px } .partner-listing-component .faceted-area .filter-title { display: block; font-family: GilroyBold } .partner-listing-component .partner-finder-search-container { display: flex; max-width: none } .partner-listing-component .partner-finder-search-container .search-area, .partner-listing-component .partner-finder-search-container .search-by-partner-type { margin: 0; width: 60.5rem } .partner-listing-component .partner-finder-search-container .search-by-partner-type { margin: 0 4rem 0 0; position: relative } .partner-listing-component .partner-finder-search-container .search-by-partner-type:after { position: absolute; right: -3.5rem; top: 6px } .partner-listing-component .partner-listing-results { float: left } .partner-listing-component .partner-listing-results .partner-listing-section-item .navigation-tile-item-text { background-color: rgba(0,0,0,.8); display: block; height: 240px; left: 0; opacity: 0; position: absolute; text-align: center; top: 0; transition: .5s; width: 240px } .partner-listing-component .partner-listing-results .partner-listing-section-item .navigation-tile-item-text .text-component { margin: 20px auto 0; width: 220px } .partner-listing-component .partner-listing-results .partner-listing-section-item .navigation-tile-item-text .text-component p { color: #fff; font-size: 14px; height: 120px; line-height: 20px; overflow: hidden } .partner-listing-component .partner-listing-results .partner-listing-section-item .navigation-tile-item-text:after { bottom: 6rem; content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYCAYAAADKx8xXAAAACXBIWXMAAAsTAAALEwEAmpwYAAA55GlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMwNjcgNzkuMTU3NzQ3LCAyMDE1LzAzLzMwLTIzOjQwOjQyICAgICAgICAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iCiAgICAgICAgICAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIKICAgICAgICAgICAgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIgogICAgICAgICAgICB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIKICAgICAgICAgICAgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iCiAgICAgICAgICAgIHhtbG5zOmV4aWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vZXhpZi8xLjAvIj4KICAgICAgICAgPHhtcDpDcmVhdG9yVG9vbD5BZG9iZSBQaG90b3Nob3AgQ0MgMjAxNSAoTWFjaW50b3NoKTwveG1wOkNyZWF0b3JUb29sPgogICAgICAgICA8eG1wOkNyZWF0ZURhdGU+MjAxNi0wNi0yMFQxMDoxMjozMi0wNzowMDwveG1wOkNyZWF0ZURhdGU+CiAgICAgICAgIDx4bXA6TW9kaWZ5RGF0ZT4yMDE2LTA2LTI5VDE0OjUyOjIzLTA3OjAwPC94bXA6TW9kaWZ5RGF0ZT4KICAgICAgICAgPHhtcDpNZXRhZGF0YURhdGU+MjAxNi0wNi0yOVQxNDo1MjoyMy0wNzowMDwveG1wOk1ldGFkYXRhRGF0ZT4KICAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9wbmc8L2RjOmZvcm1hdD4KICAgICAgICAgPHBob3Rvc2hvcDpDb2xvck1vZGU+MzwvcGhvdG9zaG9wOkNvbG9yTW9kZT4KICAgICAgICAgPHhtcE1NOkluc3RhbmNlSUQ+eG1wLmlpZDo1ZDlmYTEzZS1kMjNjLTQ0ZjctOTYyZS1jZjhjMmU0NjUyODM8L3htcE1NOkluc3RhbmNlSUQ+CiAgICAgICAgIDx4bXBNTTpEb2N1bWVudElEPnhtcC5kaWQ6OTY1ZDJmYjItNWJmMy00NzUxLWE5ODMtZGY2N2U0YjhlN2U0PC94bXBNTTpEb2N1bWVudElEPgogICAgICAgICA8eG1wTU06T3JpZ2luYWxEb2N1bWVudElEPnhtcC5kaWQ6OTY1ZDJmYjItNWJmMy00NzUxLWE5ODMtZGY2N2U0YjhlN2U0PC94bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ+CiAgICAgICAgIDx4bXBNTTpIaXN0b3J5PgogICAgICAgICAgICA8cmRmOlNlcT4KICAgICAgICAgICAgICAgPHJkZjpsaSByZGY6cGFyc2VUeXBlPSJSZXNvdXJjZSI+CiAgICAgICAgICAgICAgICAgIDxzdEV2dDphY3Rpb24+Y3JlYXRlZDwvc3RFdnQ6YWN0aW9uPgogICAgICAgICAgICAgICAgICA8c3RFdnQ6aW5zdGFuY2VJRD54bXAuaWlkOjk2NWQyZmIyLTViZjMtNDc1MS1hOTgzLWRmNjdlNGI4ZTdlNDwvc3RFdnQ6aW5zdGFuY2VJRD4KICAgICAgICAgICAgICAgICAgPHN0RXZ0OndoZW4+MjAxNi0wNi0yMFQxMDoxMjozMi0wNzowMDwvc3RFdnQ6d2hlbj4KICAgICAgICAgICAgICAgICAgPHN0RXZ0OnNvZnR3YXJlQWdlbnQ+QWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCk8L3N0RXZ0OnNvZnR3YXJlQWdlbnQ+CiAgICAgICAgICAgICAgIDwvcmRmOmxpPgogICAgICAgICAgICAgICA8cmRmOmxpIHJkZjpwYXJzZVR5cGU9IlJlc291cmNlIj4KICAgICAgICAgICAgICAgICAgPHN0RXZ0OmFjdGlvbj5zYXZlZDwvc3RFdnQ6YWN0aW9uPgogICAgICAgICAgICAgICAgICA8c3RFdnQ6aW5zdGFuY2VJRD54bXAuaWlkOjVkOWZhMTNlLWQyM2MtNDRmNy05NjJlLWNmOGMyZTQ2NTI4Mzwvc3RFdnQ6aW5zdGFuY2VJRD4KICAgICAgICAgICAgICAgICAgPHN0RXZ0OndoZW4+MjAxNi0wNi0yOVQxNDo1MjoyMy0wNzowMDwvc3RFdnQ6d2hlbj4KICAgICAgICAgICAgICAgICAgPHN0RXZ0OnNvZnR3YXJlQWdlbnQ+QWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCk8L3N0RXZ0OnNvZnR3YXJlQWdlbnQ+CiAgICAgICAgICAgICAgICAgIDxzdEV2dDpjaGFuZ2VkPi88L3N0RXZ0OmNoYW5nZWQ+CiAgICAgICAgICAgICAgIDwvcmRmOmxpPgogICAgICAgICAgICA8L3JkZjpTZXE+CiAgICAgICAgIDwveG1wTU06SGlzdG9yeT4KICAgICAgICAgPHRpZmY6T3JpZW50YXRpb24+MTwvdGlmZjpPcmllbnRhdGlvbj4KICAgICAgICAgPHRpZmY6WFJlc29sdXRpb24+NzIwMDAwLzEwMDAwPC90aWZmOlhSZXNvbHV0aW9uPgogICAgICAgICA8dGlmZjpZUmVzb2x1dGlvbj43MjAwMDAvMTAwMDA8L3RpZmY6WVJlc29sdXRpb24+CiAgICAgICAgIDx0aWZmOlJlc29sdXRpb25Vbml0PjI8L3RpZmY6UmVzb2x1dGlvblVuaXQ+CiAgICAgICAgIDxleGlmOkNvbG9yU3BhY2U+NjU1MzU8L2V4aWY6Q29sb3JTcGFjZT4KICAgICAgICAgPGV4aWY6UGl4ZWxYRGltZW5zaW9uPjE0PC9leGlmOlBpeGVsWERpbWVuc2lvbj4KICAgICAgICAgPGV4aWY6UGl4ZWxZRGltZW5zaW9uPjI0PC9leGlmOlBpeGVsWURpbWVuc2lvbj4KICAgICAgPC9yZGY6RGVzY3JpcHRpb24+CiAgIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgCjw/eHBhY2tldCBlbmQ9InciPz6dU31PAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAMeSURBVHjafJRLaJxVHMXP/z6+12Tme89MsBCsj4U1Ox+I9bESKi4UjKgLkRah2G1BFDRgLRikuGimBkRXBaOiWFARLbhx0S5NHBJcKFizaGYSkzbpzHzz3ft31dqYTA7cxYX7u+fecw8Xl8fv5tfyJsdhwlGUTCVJQsyM/UaW1Ykej5vc8j3M2yFagz4INieSaxbG/2dt/QZGSCyK4t2Xe+s4Il1Muz4ItiMMP6eEPlBP4uookOIwapJUhyLYi3Oqio5gvFFsYwv2KQXnIpN1u93V/i5HIrnKPPy5Czr8arFxTgiFj3UNKYkfLeM0YCnLG94uR2a+NUnjpCkUPfKODL5+UAoc7/fxF5tUamyygdvtdm/dWdy+CxM22Ihvpssbb/9QWJz3Q9wv9Zox/LCALPK07vy3eI+44yh/KEyTS8eycf79jrv42ewAp0njmTxtulmWSWbeedSbStLcV1ZMWsl3HiY5/74f4MywwAXTe4mZviBo3hMEgHoS+0ZSHxDjk6RWzuoQn5d9tOz2hCZ1ZSQIAESEMM3IAWoTJDdaegyXzRAzVNy7LwgA9axBpRAkweMx7N8tXUXH2p2p7iVm4zAPQdYoYoYlASZgpGOa5pIgLQkmw8U9B8lfPqdcXILBzGBQH+moCT6oJDblfZPCX/7EqeKCtXjP9A+urF/tqP8DWVZXhgAJGjDxxJNOZfG09vBBcQ3fwiZj1XBjV3PyNJOEUklDAoKfeJ68P2akwJu96/heyqmwlm4GQQAAUACQJAmBlRbEEUO6pMqnXyd37gXHwdHeFv6seFNRpfbV8lKbb2aiojgNlHAaVgyvseEuJL81LbxTDwiNV3olNqvRodqYsySEwO1BKkUgYLAJVkd8Kq+eUbVTIQPHym0UcRR6rn9dssHCrws74hcWrBnqZEI4/6mX/lQS4wT1sdRZJd/xt5iNu/DbIu/+AaLa8QkhPprzMvxiezjr0EpQCR8F0RWC5Xa7vedD02Npg2e1i3k7xGeV4DvP1UeV0F0L5nZ7cWQfxYd6DLN2iC9r1dlKELwoSXRKhmQ2cr8q/jsA3PduVHy/pp8AAAAASUVORK5CYII="); position: absolute } .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component + a > .navigation-tile-item-text:hover, .partner-listing-component .partner-listing-results .partner-listing-section-item .image-component:hover + a > .navigation-tile-item-text { opacity: 1; transition: .5s } } .partner-listing-component .faceted-area .faceted-area-box .faceted-area-header { margin: -20px -20px 0; padding: 20px } .partner-listing-component .faceted-area .faceted-area-box ul { list-style: none; padding-left: 20px } .partner-listing-component .faceted-area .faceted-area-box ul li { width: 240px } .partner-listing-component .faceted-area .faceted-area-box ul li span { font-size: 12px; font-weight: 300 } .partner-listing-component .faceted-area .faceted-area-box ul li .filter-dropdown-component { border: 2px solid #efefef; margin-bottom: 10px } .partner-listing-component .faceted-area .faceted-area-box ul li .filter-dropdown-component .filter-value { font-style: normal; padding: 0 30px 0 10px } .partner-listing-component .faceted-area .faceted-area-box ul li .filter-dropdown-component .filter-value span { font-weight: 500 } .partner-listing-component .faceted-area .faceted-area-box .faceted-area-filters { display: none } .partner-listing-component .partner-listing-results h2 { clear: both; color: #333; font-size: 24px; font-weight: 500; margin-bottom: 20px } .partner-listing-component .partner-listing-results hr { border-top: 1px solid #cbcbcb; margin-bottom: 35px } .partner-listing-component .partner-listing-results .partner-listing-section-header { clear: both; float: left; width: 100% } .partner-listing-component .partner-listing-results .partner-listing-section-header img { float: left; margin: 0 15px 10px 0 } .partner-listing-component .partner-listing-results .partner-listing-section-header h3 { color: #333; font-size: 24px; font-weight: 300; line-height: 40px; margin: 0 } .partner-listing-component .partner-listing-results > .no-partners-found { display: block; margin-bottom: 20px; margin-top: 10px; text-align: center } .partner-listing-component .results-pagination { width: auto } .partner-listing-component .partner-listing-program-section { clear: both; display: block; float: none; width: 100% } .horizontal-line-component hr { background-color: #293e40; border: none; height: .1rem; margin: 0; opacity: .2 } .horizontal-line-component.horizontal-line-2px hr { height: .2rem; margin: 0; padding: 0 } .horizontal-line-component.padding-top-40 { padding-top: 4rem } .horizontal-line-component.padding-top-80 { padding-top: 8rem } .horizontal-line-component.padding-bottom-40 { padding-bottom: 4rem } .horizontal-line-component.padding-bottom-80 { padding-bottom: 8rem } .carousel-nc { position: relative } .carousel-nc .inner-wrapper { z-index: 2 } .carousel-nc .title { font-size: 1.8rem } .carousel-nc .subtitle { display: block; font-size: 1.4rem; margin-top: 1rem } .carousel-nc .subtitle:before { content: "—"; padding-right: 1rem } .carousel-nc .default-spacing { padding-bottom: 4.5rem; padding-top: 6rem } .carousel-nc .carousel-nc-outer-wrapper { margin-top: 3rem; position: relative } .carousel-nc .carousel-nc-outer-wrapper.no-scroll .left-scroll-arrow, .carousel-nc .carousel-nc-outer-wrapper.no-scroll .right-scroll-arrow { display: none !important } .carousel-nc .carousel-nc-inner-wrapper { display: flex; overflow: hidden; padding: 0 } .carousel-nc .carousel-nc-inner-wrapper .cq-Editable-dom--container { display: flex; flex-wrap: wrap } .carousel-nc .corner-image { position: absolute; right: 0; top: 0; width: 42% } .carousel-nc .patch { background: radial-gradient(#5b6f70 1.1px,transparent 0),radial-gradient(#5b6f70 1.1px,transparent 0),transparent; background-position: 15px 28px,3px 11px,0 0,0 0,0 0; background-size: 25px 33px,25px 33px; bottom: 0; height: 10rem; left: 0; opacity: .4; position: absolute; width: 10rem; z-index: 1 } .carousel-nc .cscMeetOtherElement { max-width: 100%; min-width: 100%; padding: 0; position: relative } .carousel-nc .cscMeetOtherElement .item-overlay { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .carousel-nc .cscMeetOtherElement .item-overlay .cta-component { cursor: pointer; height: 100%; margin: 0; opacity: 0; padding: 0; position: absolute; width: 100% } .carousel-nc .cscMeetOtherElement .item-overlay .cta-component a { background: transparent; cursor: pointer; height: 100%; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 2 } .carousel-nc .cscMeetOtherElement .item-content { display: flex; flex-direction: column; height: 100% } .carousel-nc .cscMeetOtherElement .image-text-content { display: flex; padding: 3rem 1.7rem 3rem 3rem; width: 100% } .carousel-nc .cscMeetOtherElement:hover .cta-text-arrow a .cta-title-link-arrow svg { transform: translate(-.5rem) } .carousel-nc .cscMeetOtherElement .image .cus-logo-svg { border-radius: 100%; height: 8.5rem; min-width: 8.5rem; width: 8.5rem } .carousel-nc .cscMeetOtherElement .text { display: flex; flex-direction: column; margin-left: 1.5rem } .carousel-nc .cscMeetOtherElement .cta { margin-top: auto; padding: 0 1.7rem 3rem 3rem } .carousel-nc .cscMeetOtherElement .name { font-family: gilroySemiBold; word-break: break-all } .carousel-nc .cscMeetOtherElement .text-cta { display: none } .carousel-nc .cscTestimonialElement { border-radius: 3px; max-width: 100%; min-width: 100%; position: relative } .carousel-nc .cscTestimonialElement .comp-full-bleed-bg-color { border-radius: 6px } .carousel-nc .cscTestimonialElement .item-content { height: 100%; padding: 2rem } .carousel-nc .cscTestimonialElement .image { display: flex; justify-content: center } .carousel-nc .cscTestimonialElement .component-asset-block { padding-bottom: 2rem; width: 50% } .carousel-nc .cscTestimonialElement .testimonial-by, .carousel-nc .cscTestimonialElement .testimonial-text { color: #fff; display: block } .carousel-nc .cscTestimonialElement .testimonial-text { font-family: gilroyBold } .carousel-nc .cscTestimonialElement .testimonial-by { display: flex; margin-top: auto; padding-top: 2rem } .carousel-nc .cscTestimonialElement .testimonial-by:before { content: "—"; padding-right: 1rem } .carousel-nc .cscTestimonialElement .image-text-content { display: flex; flex-direction: column; height: 100% } .carousel-nc .cscTestimonialElement.cq-Editable-dom { margin-bottom: 1rem } .carousel-nc .left-scroll-arrow, .carousel-nc .right-scroll-arrow { border-radius: 100%; cursor: pointer; height: 6rem; position: absolute; top: calc(50% - 3rem); width: 6rem; z-index: 3 } .carousel-nc .left-scroll-arrow { left: -1rem; transform: rotate(180deg) } .carousel-nc .right-scroll-arrow { right: -1rem } @media only screen and (min-width: 768px) { .carousel-nc .title { font-size: 2.2rem } .carousel-nc .subtitle { font-size: 1.6rem } .carousel-nc .default-spacing { padding-bottom: 6rem; padding-top: 5rem } .carousel-nc .carousel-nc-outer-wrapper { margin-top: 4rem } .carousel-nc .cscMeetOtherElement { margin-right: 3rem; max-width: calc(50% - 1.5rem); min-width: calc(50% - 1.5rem) } .carousel-nc .cscMeetOtherElement .image .cus-logo-svg { height: 9.4rem; min-width: 9.4rem; width: 9.4rem } .carousel-nc .cscMeetOtherElement .item-content { flex-direction: row } .carousel-nc .cscMeetOtherElement .name { font-size: 2rem } .carousel-nc .cscMeetOtherElement .text-cta { display: block; margin-top: auto } .carousel-nc .cscMeetOtherElement .cta { display: none } .carousel-nc .cscTestimonialElement { margin-right: 3rem; max-width: calc(32.6% - 1.5rem); min-width: calc(32.6% - 1.5rem) } .carousel-nc .cscTestimonialElement .item-content { padding: 2.2rem 3rem 3rem } .carousel-nc .cscTestimonialElement .component-asset-block { width: calc(50% + 1.5rem) } .carousel-nc .corner-image { width: 24% } .carousel-nc .left-scroll-arrow, .carousel-nc .right-scroll-arrow { height: 7rem; top: calc(50% - 3.5rem); width: 7rem } .carousel-nc .left-scroll-arrow { left: -2rem; transform: rotate(180deg) } .carousel-nc .right-scroll-arrow { right: -2rem } } @media only screen and (min-width: 1024px) { .carousel-nc .title { font-size: 2.4rem; padding-bottom: 0 } .carousel-nc .default-spacing { padding-bottom: 6rem; padding-top: 6rem } .carousel-nc .cscMeetOtherElement { margin-right: 4rem; max-width: calc(33.6% - 2rem); min-width: calc(33.6% - 2rem) } .carousel-nc .cscMeetOtherElement .text { justify-content: center; margin-left: 2rem; padding-top: .7rem } .carousel-nc .cscMeetOtherElement .name { padding-bottom: 1rem } .carousel-nc .cscMeetOtherElement .company { padding-bottom: 2rem } .carousel-nc .cscMeetOtherElement .text-cta { margin-top: auto } .carousel-nc .cscMeetOtherElement .text-cta a { font-size: 1.4rem !important } .carousel-nc .cscMeetOtherElement .image .cus-logo-svg { height: 6.2rem; min-width: 6.2rem; width: 6.2rem } .carousel-nc .cscMeetOtherElement .image-text-content { padding: 3rem } .carousel-nc .cscMeetOtherElement .cta-title-link-arrow { position: absolute } .carousel-nc .cscTestimonialElement { margin-right: 4rem; max-width: calc(33.6% - 2rem); min-height: 15rem; min-width: calc(32.6% - 2rem) } .carousel-nc .cscTestimonialElement .image-text-content { align-items: flex-end } .carousel-nc .cscTestimonialElement .image { left: 2rem; position: absolute; top: 2.2rem; width: 19% } .carousel-nc .cscTestimonialElement .item-content { padding: 2.2rem } .carousel-nc .cscTestimonialElement .testimonial-text { font-size: 1.6rem; padding-left: 1rem; width: 71% } .carousel-nc .cscTestimonialElement .testimonial-by { padding-left: 1rem; width: 71% } .carousel-nc .cscTestimonialElement .component-asset-block { max-height: 13rem; width: auto } .carousel-nc .cscTestimonialElement .cus-logo-svg, .carousel-nc .cscTestimonialElement img { width: auto } .carousel-nc .corner-image { width: 20% } .carousel-nc .left-scroll-arrow, .carousel-nc .right-scroll-arrow { height: 8.3rem; top: calc(50% - 4.15rem); width: 8.3rem } } @media only screen and (min-width: 1700px) { .carousel-nc .title { font-size: 2.8rem } .carousel-nc .subtitle { font-size: 1.8rem; margin-top: 2rem } .carousel-nc .cscMeetOtherElement { max-width: calc(33% - 2rem); min-width: calc(33% - 2rem) } .carousel-nc .cscMeetOtherElement .image-text-content { padding: 3rem 4rem } .carousel-nc .cscMeetOtherElement .image .cus-logo-svg { height: 17rem; min-width: 17rem; width: 17rem } .carousel-nc .cscMeetOtherElement .text { margin-left: 5rem; padding-top: 1.5rem } .carousel-nc .cscMeetOtherElement .company, .carousel-nc .cscMeetOtherElement .experience, .carousel-nc .cscMeetOtherElement .role { font-size: 1.4rem } .carousel-nc .cscMeetOtherElement .text-cta { margin-bottom: .4rem } .carousel-nc .cscTestimonialElement { margin-right: 4rem; max-width: calc(32.9% - 2rem); min-width: calc(32.9% - 2rem) } .carousel-nc .cscTestimonialElement .component-asset-block { width: 13.5rem } .carousel-nc .cscTestimonialElement .image { left: 3rem; min-width: 25%; top: 3rem; width: 25% } .carousel-nc .cscTestimonialElement .item-content { padding: 3rem } .carousel-nc .cscTestimonialElement .image-text-content { min-height: 14rem } .carousel-nc .cscTestimonialElement .testimonial-text { font-size: 1.8rem; padding-left: 3rem } .carousel-nc .cscTestimonialElement .testimonial-by { font-family: gilroySemibold; padding-left: 3rem } .carousel-nc .cscTestimonialElement .testimonial-by, .carousel-nc .cscTestimonialElement .testimonial-text { width: 69% } .carousel-nc .cscTestimonialElement .component-asset-block { max-height: inherit; width: auto } .carousel-nc .cscTestimonialElement .cus-logo-svg { height: auto; width: 100% } .carousel-nc .corner-image { width: 13% } .carousel-nc.no-scroll .left-scroll-arrow, .carousel-nc.no-scroll .right-scroll-arrow { display: none !important } } .component-promotional-banner { transition: opacity .5s linear } .component-promotional-banner.hide { display: none } .component-promotional-banner.fat-banner.default-spacing { padding: 4rem 0 } .component-promotional-banner.fat-banner .close-button { right: 2rem; top: 2rem } .component-promotional-banner.fat-banner .cta-element { text-align: center } .component-promotional-banner.thin-banner.default-spacing { padding: 4rem 0 3.5rem } .component-promotional-banner.thin-banner .title { font-size: 1.4rem } .component-promotional-banner.thin-banner .cta-component a { font-family: gilroyBold } .component-promotional-banner.thin-banner .close-button { right: 1rem; top: 1rem } .component-promotional-banner .banner-container { padding: 0 1rem } .component-promotional-banner .inner-banner-container { border-radius: 4px; margin: 0 1rem; padding: 2rem 0 3rem; position: relative } .component-promotional-banner .content-wrapper { margin: 0 auto; position: relative; width: 80% } .component-promotional-banner .title { margin-bottom: 1rem; width: 80% } .component-promotional-banner .subtitle { display: block; margin-bottom: 2rem } .component-promotional-banner .close-button { cursor: pointer; height: 1.6rem; position: absolute; width: 1.6rem } .component-promotional-banner .close-button img { width: inherit } .component-promotional-banner .cta-component { margin: 0 } .component-promotional-banner .left-icon { left: 0; top: 0 } .component-promotional-banner .right-icon { bottom: 0; display: flex; right: 0 } .component-promotional-banner .left-icon, .component-promotional-banner .right-icon { position: absolute } @media only screen and (min-width: 768px) { .component-promotional-banner.thin-banner .inner-banner-container { padding: 2rem 0 } .component-promotional-banner.thin-banner.default-spacing { padding: 4rem 0 } .component-promotional-banner.fat-banner .inner-banner-container { padding: 3rem 0 } .component-promotional-banner .inner-banner-container { margin: 0 2rem } .component-promotional-banner .content-wrapper { padding-right: 6rem; width: 91.4% } } @media only screen and (min-width: 1024px) { .component-promotional-banner.thin-banner.default-spacing { padding: 4rem 0 6rem } .component-promotional-banner.thin-banner .inner-banner-container { padding: 2.5rem 0 } .component-promotional-banner.thin-banner .text-elements { display: flex; flex-direction: row } .component-promotional-banner.thin-banner .title { margin-bottom: 0; margin-right: 1rem; width: auto } .component-promotional-banner.thin-banner .subtitle { align-items: center; display: flex } .component-promotional-banner.thin-banner .cta-component a { font-size: 1.4rem !important } .component-promotional-banner.thin-banner .text-elements { width: 81% } .component-promotional-banner.fat-banner.default-spacing { padding: 6rem 0 } .component-promotional-banner.fat-banner .cta-element { margin-right: 4rem } .component-promotional-banner.fat-banner .text-elements { width: 67% } .component-promotional-banner.fat-banner .title { font-size: 2.4rem } .component-promotional-banner .banner-container { padding: 0 2rem } .component-promotional-banner .title { display: inline-block; padding: 0 } .component-promotional-banner .content-wrapper { align-items: center; display: flex; justify-content: space-between; padding-right: 0; width: 91.5% } .component-promotional-banner .subtitle { margin-bottom: 0 } } @media only screen and (min-width: 1700px) { .component-promotional-banner.thin-banner.default-spacing { padding: 8rem 0 6rem } .component-promotional-banner.thin-banner .title { margin-right: 3rem } .component-promotional-banner.thin-banner .content-wrapper { width: 95% } .component-promotional-banner.fat-banner.default-spacing { padding: 6rem 0 } .component-promotional-banner.fat-banner .content-wrapper { width: 88% } .component-promotional-banner .cta-element { margin-right: 0 } .component-promotional-banner .text-elements { width: 78% } } .cscPromotionalBanner.section.cq-Editable-dom .hide { display: block !important } .resource-list.resource-list-new { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: var(--cloud); margin: auto; position: relative } .resource-list.resource-list-new .resources_content { line-height: 1.6em } .resource-list.resource-list-new .resources_content p { color: var(--brand-black); padding: 0 } .resource-list.resource-list-new .resources_content .resources-filter-clear-all { border-bottom: 2px solid var(--brand-green-darker); cursor: pointer; margin-bottom: .8rem; margin-left: auto } .resource-list.resource-list-new .resources_content .resources-filter-button { align-self: flex-start; border: .1rem solid var(--brand-green-darker); border-radius: .6rem; color: var(--brand-black); cursor: pointer; display: flex; font-weight: 600; height: 3.6rem; justify-content: center; line-height: 3.6rem; margin-bottom: 4rem; width: 100% } .resource-list.resource-list-new .resources_content .resources-filter-button:before { background-color: transparent; background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/platform/icons/filter-icon.png) !important; background-position: 4px 10px; background-repeat: no-repeat; background-size: 1.6rem 1.6rem; content: ""; display: block; height: 3.8rem; margin-left: -3.2rem; width: 3.2rem } .resource-list.resource-list-new .resources_content .resource-cards-wrapper { width: 100% } .resource-list.resource-list-new .resources_content .filter_wrapper { background: var(--cloud); height: 100%; left: -100%; overflow: scroll; padding: 5.6rem 2rem 7rem; position: fixed; top: 0; transition: all .3s linear,padding 0s,top 0s,width 0s; width: 100%; z-index: 1000 } .resource-list.resource-list-new .resources_content .filter_wrapper.open { left: 0 } .resource-list.resource-list-new .resources_content .filter_wrapper.open .resources-view-results-wrapper { background-color: var(--pure-white); bottom: 0; cursor: pointer; display: none; font-family: GilroySemiBold; height: 6.4rem; left: -100%; padding: 1.4rem 2rem; position: fixed; text-align: center; transition: all .3s linear; width: 100% } .resource-list.resource-list-new .resources_content .filter_wrapper.open .resources-view-results-wrapper .resources-view-results { background: var(--brand-green-darker); border-radius: 6px; display: block; height: 3.6rem; line-height: 3.6rem } .resource-list.resource-list-new .resources_content .filter_wrapper.open .resources-view-results-wrapper.show { display: block; left: 0 } .resource-list.resource-list-new .resources_content .filter_wrapper .close-resources-filter { background-color: var(--pure-white); border-radius: 100px; box-shadow: var(--powder-light-gray) 0 8px 24px; box-sizing: content-box; color: var(--brand-black); height: 1.6rem; padding: 8px; position: absolute; right: 2rem; top: 1rem; width: 1.6rem; z-index: 1001 } .resource-list.resource-list-new .resources_content .filter_wrapper .close-resources-filter .svg-icon { height: auto; pointer-events: none; width: 100% } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-filter-top-heading-wrapper { align-items: center; border-bottom: .1rem solid var(--brand-black); display: flex; margin-bottom: 2.4rem; width: 28rem } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-filter-top-heading-wrapper .resources-filter-refine-by { margin-bottom: .8rem } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-filter-facet-header { cursor: pointer; margin-bottom: 24px; padding-right: 20px; position: relative } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-filter-facet-header:after { background: url(../../../content/dam/servicenow-assets/images/unauthorable/platform/icons/up-arrow.svg) no-repeat; background-size: 15px; content: ""; cursor: pointer; height: 15px; position: absolute; right: 0; top: 50%; transform: translateY(-50%) rotate(180deg); transition: transform .2s; width: 15px } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-filter-facet-header.resources-filter-collapsed:after { transform: translateY(-50%) rotate(0deg) } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-filter-facet-header.resources-filter-collapsed + .dropdown { display: none } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper { border-bottom: .1rem solid var(--brand-black); margin-bottom: 2.4rem } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper .resources-filter-option { margin-bottom: 1.6rem; position: relative } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper .resources-filter-labels { cursor: pointer; display: inline-block; margin: 0; padding-left: 3.6rem; vertical-align: middle } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper .resources-filter-input-hidden { height: 0; margin: 0; opacity: 0; padding: 0; position: absolute; width: 0 } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper .resources-filter-input-hidden[checked=checked] + .resources-filter-input:after { background: var(--brand-black); border-radius: 50%; content: " "; display: inline-block; height: 12px; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 12px } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper .resources-filter-input { border: 2px solid var(--brand-black); border-radius: 50%; cursor: pointer; height: 2rem; left: 0; margin-left: 0; margin-right: 1.6rem; position: absolute; top: .2rem; width: 2rem } .resource-list.resource-list-new .resources_content .filter_wrapper .dropdown_wrapper .resources-filter-load-more-button { cursor: pointer; display: inline-block; font-family: GilroySemiBold; font-weight: 600; margin-bottom: 2.4rem; padding-left: 3.6rem } .resource-list.resource-list-new .resources_content .filterbar { background: #f7f7f7; margin-bottom: 2.4rem; position: relative } .resource-list.resource-list-new .resources_content .filterbar .resources-filter-clear-all { border-bottom: none; display: inherit; margin-bottom: 4rem; margin-right: auto } .resource-list.resource-list-new .resources_content .filterbar .resources-filter-clear-all span { border-bottom: .2rem solid var(--brand-green-darker); padding-bottom: .2rem } .resource-list.resource-list-new .resources_content .filterbar a.filterpill { display: block; padding-right: 2rem } .resource-list.resource-list-new .resources_content .filterbar div { display: inline-block; font-size: 1.2rem; padding-right: 0 } .resource-list.resource-list-new .resources_content .filterbar .filterpill { background: #fff; border-radius: 5rem; color: var(--brand-black); font-family: GilroyBold; font-size: 1rem; font-weight: 700; letter-spacing: 1px; line-height: 1.2; margin-bottom: 1.6rem; margin-right: 1rem; padding: 1.2rem 4rem 1.2rem 2rem; position: relative; text-transform: uppercase; width: auto } .resource-list.resource-list-new .resources_content .filterbar .filterpill .close { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-close-dark1.svg); background-repeat: no-repeat; background-size: contain; height: 1.3rem; position: absolute; right: 1.5rem; top: calc(50% - .7rem); width: 1.3rem } .resource-list.resource-list-new .resources_content .filterbar .results { padding-bottom: 1.6rem } .resource-list.resource-list-new .resources_content .no-results-wrapper { margin-bottom: 4rem } .resource-list.resource-list-new .resources_content .no-results-wrapper h3 { margin-bottom: 1.6rem } .resource-list.resource-list-new .resources_content .no-results-wrapper .desktop-only, .resource-list.resource-list-new .resources_content .no-results-wrapper:not(.d-none) + .filterbar h3 { display: none } .resource-list.resource-list-new .resources_content .all_resources h3, .resource-list.resource-list-new .resources_content .featured_resources h3 { margin-bottom: 1.6rem } .resource-list.resource-list-new .resources_content .searchbar { display: block; overflow: visible; padding-bottom: 4rem; padding-top: 4rem; position: relative } .resource-list.resource-list-new .resources_content .searchbar input::-ms-clear { display: none } .resource-list.resource-list-new .resources_content .searchbar input:focus::-moz-placeholder { color: transparent } .resource-list.resource-list-new .resources_content .searchbar input:focus::placeholder { color: transparent } .resource-list.resource-list-new .resources_content .searchbar .searchbox { background: url(../../../content/dam/servicenow-assets/images/unauthorable/platform/icons/search-icon.svg) 16px no-repeat; background-color: var(--pure-white); border: none; border-radius: .6rem; color: var(--brand-black); display: block; font-size: 1.4rem; height: 6.4rem; outline: none; padding-left: 64px; padding-right: 48px; width: 100% } .resource-list.resource-list-new .resources_content .searchbar .searchbox:focus { font-weight: 400; outline: none } .resource-list.resource-list-new .resources_content .searchbar .searchbox:focus + #clear, .resource-list.resource-list-new .resources_content .searchbar .searchbox:focus + #clear.hidden { display: block } .resource-list.resource-list-new .resources_content .searchbar #clear { bottom: 0; cursor: pointer; height: 1.6rem; margin: auto; position: absolute; right: 1.6rem; top: 0; width: 1.6rem; z-index: 2 } .resource-list.resource-list-new .resources_content .searchbar #clear.hidden, .resource-list.resource-list-new .resources_content .searchbar .searchbutton { display: none } .resource-list.resource-list-new .resources_content #resource_cards { box-sizing: border-box; height: auto; margin-bottom: .8rem; position: relative; width: 100% } .resource-list.resource-list-new .resources_content #resource_cards .card_list { display: flex; flex-wrap: wrap; width: 100% } .resource-list.resource-list-new .resources_content #resource_cards .wrapper { background: #fff; border-radius: .6rem; height: calc(100vw - 3rem); margin-bottom: 2.4rem; max-height: 27rem; position: relative; transition: all .2s ease-in-out; width: 100% } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card { background: var(--pure-white) no-repeat 1.6rem 2.4rem; background-size: 6.4rem; border-radius: .6rem; position: absolute; width: 100% } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .overlink { bottom: 0; cursor: pointer; height: 100%; left: 0; position: absolute; right: 0; top: 0; z-index: 25 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content { height: calc(25vw - 13rem); margin: 10rem 1.6rem 2.4rem; max-height: 23.5rem; min-height: 14.6rem; overflow: hidden; position: relative; width: calc(100% - 6rem) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .bottom { bottom: 0; color: #7c7c7c; left: 0; position: absolute } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .bottom .author { color: #000 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .category { font-size: 12px; font-weight: 700; margin-bottom: 1.2rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .title { -webkit-line-clamp: 3; -webkit-box-orient: vertical; color: #000; display: -webkit-box; font-size: 2rem; font-weight: 300; line-height: normal; overflow: hidden } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE4LjgzNC40OWExLjUgMS41IDAgMSAwLTIuMjIgMi4wMmwyLjQ5IDIuNzM4SDEuNWExLjUgMS41IDAgMSAwIDAgM2gxNy42MDRsLTIuNDkgMi43MzlhMS41IDEuNSAwIDAgMCAyLjIyIDIuMDE4bDQuNzcxLTUuMjQ4YTEuNSAxLjUgMCAwIDAgMC0yLjAxOEwxOC44MzQuNDlaIiBmaWxsPSIjODZFRDc4Ii8+PC9zdmc+"); background-position: 100%; background-repeat: no-repeat; bottom: 0; padding-right: 3.6rem; position: absolute; transition: bottom .1s linear,opacity .1s linear } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta, .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta span { font-size: 14px; font-weight: 600; line-height: 16px } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .featured_flag { background-color: #ffde1d; color: var(--brand-black); display: none; font-family: GilroyBold; line-height: 1; padding: .4rem .8rem; position: absolute; right: 1.6rem; text-align: center; top: 3.8rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore { display: none; height: 6rem; margin: 0 3rem 3rem; opacity: 1; transition: all .3s ease; visibility: visible; width: calc(100% - 6rem) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .readmore_btn { background: url(../../../content/dam/servicenow/images/resources/button_readmore_bg.png) top no-repeat; background-size: contain; color: #fff; display: block; float: left; font-size: 1.1rem; height: 4.9rem; margin-right: .5rem; padding-top: 1.3rem; text-align: center; width: 16.4rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social { float: left; margin-top: 1rem; width: 15rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social a { background-position: 0 0; background-repeat: no-repeat; display: block; float: left; height: 2.5rem; margin-left: 1.2rem; width: 2.5rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social a:hover { background-position: 100% 100% } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social a:fb_link { background-image: url(../../../content/dam/servicenow/images/resources/icon_facebook.png) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social a.li_link { background-image: url(../../../content/dam/servicenow/images/resources/icon_linkedin.png) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social a.tw_link { background-image: url(../../../content/dam/servicenow/images/resources/icon_twitter.png) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .readmore .social a.gg_link { background-image: url(../../../content/dam/servicenow/images/resources/icon_googleplus.png) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.featured .featured_flag { display: block } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.ataglance { background-image: url(../../../content/dam/servicenow/images/resources/icon_ataglance.png) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.casestudy { background-image: url(../../../content/dam/servicenow/images/resources/icon-case-study-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.datasheet { background-image: url(../../../content/dam/servicenow/images/resources/icon-datasheet-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.ebook { background-image: url(../../../content/dam/servicenow/images/resources/icon-ebook-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.infographic { background-image: url(../../../content/dam/servicenow/images/resources/icon-infographic-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.recap { background-image: url(../../../content/dam/servicenow/images/resources/icon-recap-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.report { background-image: url(../../../content/dam/servicenow/images/resources/icon-analyst-report-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.solutionbrief { background-image: url(../../../content/dam/servicenow/images/resources/icon-solution-brief-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.video { background-image: url(../../../content/dam/servicenow/images/resources/icon-video-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.webinar { background-image: url(../../../content/dam/servicenow/images/resources/icon-webinar-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.whitepaper { background-image: url(../../../content/dam/servicenow/images/resources/icon-white-paper-64.svg) } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list, .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted h3 { margin: 0 0 1.6rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper { height: auto; max-height: none; overflow: hidden } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card { background-image: none; height: 100%; overflow: hidden; position: relative } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .image { background-position: 50%; background-size: cover; max-width: 100%; overflow: hidden; padding-bottom: 56.25%; position: relative } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .large-image { display: none } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content { height: 15.7rem; margin: 2.4rem 1.6rem; max-height: none; min-height: 0; width: auto } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content .title { -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content .body { display: none } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content .cta { bottom: 1.6rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card.video .image:after { background-image: url(../../../content/dam/servicenow/images/resources/icon-video-64.svg); background-position: 50%; bottom: 0; content: ""; filter: brightness(0) invert(1); height: 6rem; left: 0; margin: auto; position: absolute; right: 0; top: 0; width: 6rem } .resource-list.resource-list-new .resources_content .resources-pagination-text { color: var(--brand-brand); display: flex; justify-content: center } .resource-list.resource-list-new .resources_content .loadmorecontainer { text-align: center } .resource-list.resource-list-new .resources_content .loadmore { background: transparent; border: .2rem solid var(--brand-green-darker,#293e40); border-radius: var(--btn-border-radius,unset); color: var(--brand-black,#293e40); cursor: pointer; display: totalResourcesvideo block; justify-content: center; margin-bottom: 5.6rem; margin-top: .8rem; overflow: hidden; position: relative; transition: color .25s ease } .resource-list.resource-list-new .resources_content .loadmore p { font-family: GilroySemiBold; font-size: 1.4rem; font-weight: 600; margin: 1rem 4rem; position: relative; z-index: 1 } .resource-list.resource-list-new .resources_content .loadmore:after { background-color: var(--brand-green); content: ""; height: 100%; left: 0; left: -100%; opacity: unset; position: absolute; top: 0; transition: all .2s ease; width: 100%; z-index: 0 } .resource-list.resource-list-new .resources_content .loadmore:hover { border-color: var(--brand-green,#293e40); color: var(--brand-black,var(--pure-white)) } .resource-list.resource-list-new .resources_content .loadmore:hover:after { left: 0 } @media(min-width: 768px) { .resource-list.resource-list-new .resources_content .loadmore { display: inline-block } } @media(min-width: 1024px) { .resource-list.resource-list-new .resources_content .loadmore p { font-size: 1.6rem } } @media(min-width: 1920px) { .resource-list.resource-list-new .resources_content .loadmore p { font-size: 1.8rem } } .resource-list.resource-list-new .resources_content .loadmore a { display: block; padding: 1.4rem 0 } .resource-list.resource-list-new .resources_content ul { border: 0; font: inherit; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline } .resource-list.resource-list-new a input, .resource-list.resource-list-new a:active, .resource-list.resource-list-new a:focus, .resource-list.resource-list-new a:hover, .resource-list.resource-list-new a:visited { outline: none } .resource-list.resource-list-new a .current { font-weight: 700 } .resource-list.resource-list-new .resources-loading-spinner { background-color: hsla(0,0%,100%,.5); bottom: 0; display: none; height: 100%; left: 0; position: fixed; right: 0; top: 0; width: 100%; z-index: -1 } .resource-list.resource-list-new .resources-loading-spinner.active { align-items: center; display: flex; justify-content: center; z-index: 1000 } .resource-list.resource-list-new .resources-loading-spinner:after { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/platform/icons/loading-spinner-default.gif); background-size: cover; content: " "; display: block; height: 100px; width: 100px } @media screen and (min-width: 768px) { .resource-list.resource-list-new .resources_content .close-resources-filter, .resource-list.resource-list-new .resources_content .resources-filter-button { display: none } .resource-list.resource-list-new .resources_content .filter_wrapper { left: auto; margin-right: 2rem; min-width: 30rem; overflow: hidden; padding: 0 0 2rem; position: static; transform: none; width: 30rem; z-index: auto } .resource-list.resource-list-new .resources_content .filter_wrapper .filters { height: 100%; max-height: 100vh; overflow-y: scroll; padding: 0 2rem 0 0; position: sticky } .resource-list.resource-list-new .resources_content .filter_wrapper .resources-view-results-wrapper { display: none } .resource-list.resource-list-new .resources_content .filter_wrapper.open .resources-view-results-wrapper.show { display: none; left: -100% } .resource-list.resource-list-new .resources_content .resources-filter-clear-all { border-bottom-color: transparent } .resource-list.resource-list-new .resources_content .resources-filter-clear-all:hover { border-bottom-color: var(--brand-green-darker) } .resource-list.resource-list-new .resources_content .resources-content-wrapper { display: flex; flex-direction: row } .resource-list.resource-list-new .resources_content .resources-content-wrapper .filterbar .resources-filter-clear-all { display: none } .resource-list.resource-list-new .resources_content .resources-content-wrapper .filterbar .results { padding-bottom: 4rem } .resource-list.resource-list-new .resources_content .no-results-wrapper h3 { margin-bottom: 2.4rem } .resource-list.resource-list-new .resources_content .no-results-wrapper .mobile-only { display: none } .resource-list.resource-list-new .resources_content .no-results-wrapper .desktop-only { display: block } .resource-list.resource-list-new .resources_content .all_resources h3, .resource-list.resource-list-new .resources_content .featured_resources h3 { margin-bottom: 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper { max-height: 32.4rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card { background-position: 2.4rem 3.2rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content { margin: 126px 24px 32px; min-height: 16.8rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .title { font-size: 2rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta, .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta span { font-size: 16px; line-height: 1.5 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card.featured .featured_flag { right: 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted h3 { margin: 0 0 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content { height: 17.8rem; margin: 3.2rem 2.4rem 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content .cta { bottom: 0 } .resource-list.resource-list-new .resources_content .searchbar .searchbox { padding-right: 16rem } .resource-list.resource-list-new .resources_content .searchbar .searchbutton { align-items: center; background: transparent; border: .2rem solid var(--brand-green-darker,#293e40); border-radius: var(--btn-border-radius,unset); bottom: 0; color: var(--brand-black,#293e40); cursor: pointer; display: flex; height: 4.8rem; justify-content: center; margin: auto; overflow: hidden; padding: 1.6rem; position: absolute; right: 1.6rem; top: 0; -webkit-transition: color .25s ease; -moz-transition: color .25s ease; -ms-transition: color .25s ease; transition: color .25s ease } .resource-list.resource-list-new .resources_content .searchbar .searchbutton p { font-family: GilroySemiBold; font-size: 1.4rem; font-weight: 600; margin: 0; padding: .8rem; position: relative; z-index: 1 } .resource-list.resource-list-new .resources_content .searchbar .searchbutton:after { background-color: var(--brand-green); content: ""; height: 100%; left: 0; left: -100%; opacity: unset; position: absolute; top: 0; transition: all .2s ease; -webkit-transition: all .2s ease; width: 100%; z-index: 0 } .resource-list.resource-list-new .resources_content .searchbar .searchbutton:focus, .resource-list.resource-list-new .resources_content .searchbar .searchbutton:hover { border-color: var(--brand-green,#293e40); color: var(--brand-black,var(--pure-white)); outline: none } .resource-list.resource-list-new .resources_content .searchbar .searchbutton:focus:after, .resource-list.resource-list-new .resources_content .searchbar .searchbutton:hover:after { left: 0 } .resource-list.resource-list-new .resources_content .searchbar #clear { right: 13rem } .resource-list.resource-list-new.fixed .resource-cards-wrapper { padding-left: 32rem } .resource-list.resource-list-new.fixed .resources_content .filter_wrapper { overflow-y: hidden; padding: 6rem 0 0; position: fixed; width: 28rem; z-index: 100 } .resource-list.resource-list-new.fixed .resources_content .filter_wrapper .resources-filter-top-heading-wrapper { background-color: var(--cloud); position: fixed; top: 0; z-index: 2 } .resource-list.resource-list-new.fixed .resources_content .filter_wrapper .filters { height: 100% } } @media screen and (min-width: 1024px) { .resource-list.resource-list-new .resources_content #resource_cards { margin-bottom: .8rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper { flex-basis: calc(50% - 20px); margin: 0 0 4rem; max-height: 35.5rem; max-width: calc(50% - 20px) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper:nth-child(odd) { margin-right: 40px } .resource-list.resource-list-new .resources_content #resource_cards .wrapper:nth-child(2n) { margin-right: 0 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card { border-radius: 6px } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content { margin: 126px 24px 32px; min-height: 20rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .category { margin-bottom: 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta { bottom: -2rem; opacity: 0 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta, .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .cta span { font-size: 16px; line-height: 1.5 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper:hover .card .card_content .cta { bottom: 0; opacity: 1 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content { height: 14.5rem; margin: 2.4rem 1.6rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content .cta { bottom: -2rem; opacity: 0 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper:hover .card .card_content .cta { bottom: 0; opacity: 1 } .resource-list.resource-list-new .resources_content .searchbar { padding-bottom: 4.8rem; padding-top: 4.8rem } .resource-list.resource-list-new .resources_content .searchbar .searchbox { background-position-x: 3.2rem; font-size: 1.8rem; height: 8rem; padding-left: 8.4rem; padding-right: 22rem } .resource-list.resource-list-new .resources_content .searchbar .searchbutton { height: 6.4rem; padding: 1.6rem 3.2rem } .resource-list.resource-list-new .resources_content .searchbar .searchbutton p { font-size: 1.8rem } .resource-list.resource-list-new .resources_content .searchbar #clear { right: 19rem } .resource-list.resource-list-new.fixed .resources_content .filter_wrapper { padding: 6.4rem 0 0 } } @media screen and (min-width: 1366px) { .resource-list.resource-list-new:before { background-color: var(--cloud); bottom: 0; content: ""; height: 100%; left: -50%; margin: auto; position: absolute; right: -50%; top: 0; width: 100vw } .resource-list.resource-list-new .resources_content #resource_cards .wrapper { margin: 0 0 4.8rem; max-height: 38rem; max-width: calc(33.33333% - 26.66667px) } .resource-list.resource-list-new .resources_content #resource_cards .wrapper:nth-child(odd) { margin-right: 0 } .resource-list.resource-list-new .resources_content #resource_cards .wrapper:nth-child(3n+2) { margin-left: 40px; margin-right: 40px } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card { background-position: 2.4rem 3.2rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content { margin: 126px 24px 32px; min-height: 16.8rem } .resource-list.resource-list-new .resources_content #resource_cards .wrapper .card .card_content .category { margin-bottom: 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .no-results-wrapper { margin-bottom: 8rem } .resource-list.resource-list-new .resources_content #resource_cards .all_resources h3, .resource-list.resource-list-new .resources_content #resource_cards .featured_resources h3, .resource-list.resource-list-new .resources_content #resource_cards .no-results-wrapper h3 { margin-bottom: 4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted h3 { margin: 0 0 4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content { height: 13.8rem; margin: 2.4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted .card_list .wrapper .card .card_content .title { -webkit-line-clamp: 3 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list { grid-row-gap: 48px; grid-column-gap: 40px; display: grid; grid-template-columns: repeat(3,calc(33.33333% - 26.66667px)); margin: 0 0 4rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper { height: auto; margin: 0; max-height: none; max-width: none; min-height: 0; min-width: 0; width: auto } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper .card .image { transition: transform .25s } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child { grid-column: 1/3; grid-row: 1/3 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card { height: 100% } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .image { display: none } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .large-image { background-size: cover; display: block; height: 100%; max-height: none; position: absolute; transition: transform .25s; width: 100% } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content { bottom: 0; height: auto; margin: 12rem 7.2rem; max-height: none; position: absolute } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .body, .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .category, .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .title { color: var(--pure-white) } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .category:before { display: none } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .title { font-size: 2.8rem; margin: 0 0 3.2rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .body { display: block; margin: 0 0 3.2rem } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .cta { -webkit-box-pack: center; -ms-flex-pack: center; background: var(--brand-green-darker,#293e40); border: .2rem solid var(--brand-green-darker,#293e40); border-radius: var(--btn-border-radius,unset); bottom: 0; color: var(--brand-black,var(--pure-white)); cursor: pointer; display: inline-block; opacity: 1; overflow: hidden; padding: 1.6rem 3.2rem; position: relative; transition: color .25s ease } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .cta span { font-family: GilroySemiBold; font-size: 1.8rem; font-weight: 600; position: relative; z-index: 1 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child .card .card_content .cta:after { background-color: var(--brand-green); content: ""; height: 100%; left: 0; left: -100%; opacity: unset; position: absolute; top: 0; transition: all .2s ease; width: 100%; z-index: 0 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child:hover .card .large-image { transform: scale(1.02); transition: transform .25s } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child:hover .card .card_content .cta { border-color: var(--brand-green,#293e40); color: var(--brand-black,var(--pure-white)) } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:first-child:hover .card .card_content .cta:after { left: 0 } .resource-list.resource-list-new .resources_content #resource_cards .featured_resources_highlighted.bento-box .card_list .wrapper:hover .card .image { transform: scale(1.02); transition: transform .25s } .resource-list.resource-list-new .resources_content .searchbar { padding-bottom: 8rem; padding-top: 8rem } .resource-list.resource-list-new .resources_content .searchbar .searchbox { height: 9.6rem } .resource-list.resource-list-new.fixed .resources_content .filter_wrapper { padding: 7rem 0 0 } } body[data-currentPage^="/content/servicenow/www/locale-sites/de-de"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-au"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-gb"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-in"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-nz"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-sg"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/es-es"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/fr-fr"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/it-it"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/ja-jp"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/ko-kr"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/nl-nl"] .productResources, body[data-currentPage^="/content/servicenow/www/locale-sites/pt-br"] .productResources { float: left } body[data-currentPage^="/content/servicenow/www/locale-sites/de-de"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-au"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-gb"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-in"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-nz"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-sg"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/en-us"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/es-es"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/fr-fr"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/it-it"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/ja-jp"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/ko-kr"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/nl-nl"] .productResources .product-resources, body[data-currentPage^="/content/servicenow/www/locale-sites/pt-br"] .productResources .product-resources { clear: none !important; width: 100% } .component-link-module { position: relative } .component-link-module .default-spacing { padding-bottom: 3rem; padding-top: 6rem } .component-link-module .link-module-elements { padding: 1rem 1rem 0 } .component-link-module .link-module-element { align-items: center; display: flex; margin-bottom: 3rem; position: relative } .component-link-module .link-module-element:last-child { margin-bottom: 0 } .component-link-module .title-elements { margin: 0 1rem } .component-link-module .title { font-size: 1.8rem } .component-link-module .subtitle, .component-link-module .title { display: block; padding-bottom: 2rem } .component-link-module .clickable { bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: 1 } .component-link-module .clickable:hover ~ .text-content .link { font-family: gilroyBold; padding-bottom: .1rem } .component-link-module .text-content { padding: 0 } .component-link-module .image { height: 8rem; margin-right: 2rem; width: 8rem } .component-link-module .link { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; padding: 0 0 .2rem } @media only screen and (min-width: 768px) { .component-link-module .link-module-elements { display: flex; flex-wrap: wrap; padding: 1rem 1.5rem 0 } .component-link-module .title-elements { margin: 0 1.5rem } .component-link-module .title { font-size: 2.2rem } .component-link-module .subtitle { font-size: 1.6rem } .component-link-module .subtitle, .component-link-module .title { padding-bottom: 3rem } .component-link-module .link-module-element { width: 50% } .component-link-module .link-module-element:last-child { margin-bottom: 3rem } .component-link-module .image { height: 8.8rem; margin-right: 2.5rem; width: 8.8rem } .component-link-module .link { font-size: 1.4rem } .component-link-module .text-content { padding: .5rem } } @media only screen and (min-width: 1024px) { .component-link-module .link-module-elements { padding-top: 1rem } .component-link-module .link-module-element { width: 33.33% } .component-link-module .subtitle, .component-link-module .title { padding-bottom: 2rem } .component-link-module .title { font-size: 2.2rem } .component-link-module .title-elements { margin: 0 2rem } .component-link-module .text-content { padding: 0 } .component-link-module .image { margin-right: 2.8rem } } @media only screen and (min-width: 1700px) { .component-link-module .link-module-elements { padding-top: 2rem } .component-link-module .title { font-size: 2.8rem } .component-link-module .subtitle { font-size: 1.8rem } .component-link-module .image { margin-right: 4.6rem } } .component-questionnaire-overlay { bottom: 0; display: flex; flex-direction: column; left: 0; overflow-y: auto; padding: 0 1rem; position: fixed; right: 0; top: 0; z-index: 1000 } .component-questionnaire-overlay .header-wrapper { display: flex; justify-content: space-between; margin-top: 2.1rem } .component-questionnaire-overlay .content-type { display: flex; flex-grow: 1 } .component-questionnaire-overlay .sn-logo { height: 2.4rem; width: 7.5rem } .component-questionnaire-overlay .close-btn { cursor: pointer; display: flex; height: 2.4rem; justify-content: flex-end; width: 2.4rem } .component-questionnaire-overlay .close-text { display: none } .component-questionnaire-overlay .close-icon { align-items: center; display: flex; height: 2.2rem; justify-content: center; position: relative; transform: rotate(45deg); width: 2.2rem } .component-questionnaire-overlay .close-icon:after, .component-questionnaire-overlay .close-icon:before { background: #293e40; content: ""; display: block; height: 2.2rem; position: absolute; width: .15rem } .component-questionnaire-overlay .close-icon:before { transform: rotate(90deg); transform-origin: center center } .component-questionnaire-overlay .hide, .component-questionnaire-overlay.hide { display: none !important } .component-questionnaire-overlay .disabled { opacity: .4; pointer-events: none; transition: opacity .5s } .component-questionnaire-overlay .nav-buttons { margin-bottom: 4rem; margin-top: auto } .component-questionnaire-overlay .nav-buttons .go-to-response-cta { margin-top: 1rem; padding-bottom: 1.4rem; text-align: center } .component-questionnaire-overlay .nav-buttons .error-message { color: #fc726d; display: block; margin-bottom: 3.7rem } .component-questionnaire-overlay .nav-buttons .cta-component { margin-bottom: 4rem; margin-right: 0 } .component-questionnaire-overlay .nav-buttons .cta-component, .component-questionnaire-overlay .nav-buttons a { text-align: center; width: 100% } .component-questionnaire-overlay .nav-buttons .previous-btn { cursor: pointer; display: flex; font-family: gilroyBold; justify-content: center } .component-questionnaire-overlay .nav-buttons .previous-btn img { padding-left: 1.5rem; transform: rotate(180deg) } .component-questionnaire-overlay .progress-bar { background-color: #e1e1e1; border-radius: .5rem; height: .7rem; width: 100% } .component-questionnaire-overlay .progress-bar .progress-bar-percentage { transition: width 1s } .component-questionnaire-overlay .questionTeamSizing, .component-questionnaire-overlay .stepperTeamSizing { display: flex } .component-questionnaire-overlay .questionTeamSizing .cq-Editable-dom, .component-questionnaire-overlay .stepperTeamSizing .cq-Editable-dom { flex-direction: column } .component-questionnaire-overlay .stepper { display: flex; flex-direction: column; margin-top: 4.5rem; text-align: center } .component-questionnaire-overlay .stepper .component-asset-block { display: none } .component-questionnaire-overlay .stepper .step-title-copy { margin-bottom: 2.4rem; margin-left: auto; margin-right: auto; width: 80% } .component-questionnaire-overlay .stepper .step-subcopy { display: block; margin: 0 1.6rem 7.1rem } .component-questionnaire-overlay .stepper.stepper-circles .step-subcopy { margin-bottom: 3.4rem } .component-questionnaire-overlay .stepper .circles { font-family: gilroyBold; margin-bottom: 3.2rem; margin-left: auto; margin-right: auto; padding-left: 1.5rem; text-align: left; width: -moz-fit-content; width: fit-content } .component-questionnaire-overlay .stepper .circles .circle-step:last-child .circle-number { margin-bottom: 0 } .component-questionnaire-overlay .stepper .circles .circle-step:last-child .circle-number:after { display: none } .component-questionnaire-overlay .stepper .circle-step.done .circle-number { background-color: #293e40; font-size: 1.2rem; height: 2.3rem; margin-left: 3px; width: 2.3rem } .component-questionnaire-overlay .stepper .circle-step.done .circle-number:before { border: 1px solid #b8d9e2; border-width: 0 .2rem .2rem 0; content: " "; display: block; height: 11px; left: 6.5px; position: absolute; top: 3px; transform: rotate(45deg); width: 6px } .component-questionnaire-overlay .stepper .circle-step.current .circle-number { background-color: #fff; border-color: #fff; height: 3.5rem; margin-left: -3px; margin-right: 1.8rem; width: 3.5rem } .component-questionnaire-overlay .stepper .circle-step.current .circle-number:after { height: 2.3rem } .component-questionnaire-overlay .stepper .circle-step.todo { opacity: .4 } .component-questionnaire-overlay .stepper .circle-step.todo .circle-number { background-color: #293e40; color: #b8d9e2; font-size: 1.2rem; height: 2.3rem; margin-left: 3px; width: 2.3rem } .component-questionnaire-overlay .stepper .circle-number { align-items: center; border: .2rem solid #293e40; border-radius: 50%; display: inline-flex; height: 3rem; justify-content: center; margin-bottom: 2.8rem; margin-right: 2.4rem; position: relative; width: 3rem } .component-questionnaire-overlay .stepper .circle-number:after { border: 1px solid #293e40; content: ""; height: 2.4rem; opacity: .2; position: absolute; top: 115% } .component-questionnaire-overlay .questions { display: flex; flex-direction: column; margin-top: 5.2rem; width: 100% } .component-questionnaire-overlay .questions .questions-title { margin-bottom: 1.6rem } .component-questionnaire-overlay .questions .progress-bar { background-color: transparent; height: auto; margin-bottom: 3.8rem; position: relative } .component-questionnaire-overlay .questions .progress-bar .progress-bar-bg { background-color: #e1e1e1; height: .7rem; width: 100% } .component-questionnaire-overlay .questions .progress-bar .percentage-text { line-height: 1.3; margin-bottom: 0; margin-top: 2rem } .component-questionnaire-overlay .questions .progress-bar .progress-bar-percentage { background-color: #81b5a1; height: .7rem; position: absolute; top: 0 } .component-questionnaire-overlay .questions .question-item, .component-questionnaire-overlay .questions .question-wrapper { display: flex; flex-direction: column; flex-grow: 1 } .component-questionnaire-overlay .questions .question-copy { margin-bottom: 2.5rem } .component-questionnaire-overlay .questions .question-subcopy { display: block; margin-bottom: 3rem } .component-questionnaire-overlay .questions .question-subcopy p { display: inline } .component-questionnaire-overlay .questions .input-field { border: .2rem solid #293e40; border-radius: .5rem; font-size: inherit; outline: none; padding: 2.5rem; text-align: center; width: 100% } .component-questionnaire-overlay .questions .input-field.empty { border: .2rem solid rgba(41,62,64,.4) } .component-questionnaire-overlay .questions .input-field.error { border: .2rem solid #fc726d } .component-questionnaire-overlay .questions .input-field::-moz-placeholder { opacity: .6 } .component-questionnaire-overlay .questions .input-field::placeholder { opacity: .6 } .component-questionnaire-overlay .questions .question-type { margin-bottom: 5rem } .component-questionnaire-overlay .questions .input { display: block; position: relative } .component-questionnaire-overlay .questions .input-field-validation { color: #fc726d; display: block; position: absolute; text-align: center; top: 8rem } .component-questionnaire-overlay .questions .option-input { display: none } .component-questionnaire-overlay .questions .option-input:checked + .option-label { background-color: #81b5a1; color: #fff } .component-questionnaire-overlay .questions .option-element { margin-bottom: 1.5rem } .component-questionnaire-overlay .questions .option-element:last-child { margin-bottom: 0 } .component-questionnaire-overlay .questions .option-label { border: 2px solid #81b5a1; border-radius: .5rem; cursor: pointer; display: block; font-family: gilroySemibold; padding: 2.5rem 0; text-align: center } .component-questionnaire-overlay .questions .option-label:hover { background-color: #81b5a1; box-shadow: 0 11px 8px -8px rgba(41,62,64,.23); color: #fff } .component-questionnaire-overlay .questions .facet-element { margin-bottom: 2rem; position: relative } .component-questionnaire-overlay .questions .facet-element:last-child { margin-bottom: 0 } .component-questionnaire-overlay .questions .facet-group-label { display: inline-block; margin-bottom: .6rem; margin-top: 2rem } .component-questionnaire-overlay .questions .facet-input { cursor: pointer; height: 2rem; min-height: 2rem; min-width: 2rem; opacity: 0; position: absolute; width: 2rem; z-index: 2 } .component-questionnaire-overlay .questions .facet-label { align-items: center; display: flex; margin-left: 3rem } .component-questionnaire-overlay .questions .facet-label-text { cursor: pointer; margin-right: 1.4rem } .component-questionnaire-overlay .questions .facet-box { background-color: transparent; border: .2rem solid #81b5a1; border-radius: .5rem; cursor: pointer; height: 2rem; left: 0; pointer-events: none; position: absolute; top: 3px; transition: all .3s ease-out; width: 2rem; z-index: 1 } .component-questionnaire-overlay .questions .facet-box:after { background-color: transparent; border: solid #81b5a1; border-radius: 0; border-width: 0 .3rem .3rem 0; content: ""; height: 1.2rem; left: .5rem; opacity: 1; position: absolute; top: .1rem; transform: rotate(0deg) scale(0); transition: all .3s ease-out; width: .6rem } .component-questionnaire-overlay .questions .facet-box.active:after { transform: rotate(45deg) scale(1) } .component-questionnaire-overlay .questions .link-out { border-radius: 100%; box-shadow: -2px .5px 5px #c8c8c8; display: inline-table; height: 12px; padding: 12px; position: relative; transform: rotate(270deg); width: 12px } .component-questionnaire-overlay .questions .link-out:before { background-color: #000; bottom: 8px; content: ""; height: 13px; position: absolute; right: 7px; transform: rotate(-45deg); transform-origin: bottom; width: 2px } .component-questionnaire-overlay .questions .link-out:after { border-bottom-style: solid; border-bottom-width: 2px; border-right-style: solid; border-right-width: 2px; content: ""; display: inline-block; height: 9px; left: 8px; position: absolute; top: 8px; width: 9px } .component-questionnaire-overlay .responses { width: 100% } .component-questionnaire-overlay .responses .duplicate-back-button { margin-bottom: 5rem; margin-top: 7rem } .component-questionnaire-overlay .responses .duplicate-back-button .previous-btn { justify-content: left } .component-questionnaire-overlay .responses .next-btn { flex-direction: column } .component-questionnaire-overlay .responses .responses-subcopy, .component-questionnaire-overlay .responses .responses-title-copy { display: block; margin-bottom: 1.6rem } .component-questionnaire-overlay .responses .responses-table { padding-top: .8rem } .component-questionnaire-overlay .responses .responses-question-copy, .component-questionnaire-overlay .responses .responses-question-error, .component-questionnaire-overlay .responses .responses-question-response { display: block } .component-questionnaire-overlay .responses .responses-question-error { color: #fc726d; padding-top: 1.6rem } .component-questionnaire-overlay .responses .response-table-head { background-color: #f7f7f7 } .component-questionnaire-overlay .responses .question-your-response-label { display: none; font-family: gilroyBold } .component-questionnaire-overlay .responses .question-step-label { display: block; font-family: gilroyBold; padding: 1.6rem 1.8rem 1.4rem } .component-questionnaire-overlay .responses .questions-group { margin-bottom: 3rem } .component-questionnaire-overlay .responses .questions-item { border: 1px solid rgba(0,0,0,.1); border-top: 0; padding: 1.8rem 2.4rem 3.3rem 1.8rem } .component-questionnaire-overlay .responses .questions-item.error { border: 1px solid #fc726d } .component-questionnaire-overlay .responses .cta-title-link-arrow { margin-left: 1.5rem !important } .component-questionnaire-overlay .responses .responses-question-copy { font-family: gilroySemiBold } .component-questionnaire-overlay .responses .responses-question-response { padding-left: 1.2rem; padding-top: 3rem } .component-questionnaire-overlay .responses .responses-question-response .input { font-family: gilroyBold; margin-left: -1.2rem !important; opacity: 1 } .component-questionnaire-overlay .responses .option-group-label { font-family: gilroySemiBold; padding-bottom: 1.6rem; padding-top: 1.4rem } .component-questionnaire-overlay .responses .option-group-label:first-child { padding-top: 0 } .component-questionnaire-overlay .responses .option-item { font-family: gilroySemiBold; opacity: .4; padding-bottom: 1.6rem } .component-questionnaire-overlay .responses .option-item:last-child { padding-bottom: 0 } .component-questionnaire-overlay .responses .selected { font-family: gilroyBold; opacity: 1; position: relative } .component-questionnaire-overlay .responses .selected:before { content: "•"; font-size: 2rem; left: -12px; position: absolute; top: -4px } .component-questionnaire-overlay .responses .questions-item .cta-component { margin-bottom: 0 !important; margin-left: 0 !important; margin-top: 0 !important } .component-questionnaire-overlay .responses .questions-item .cta-component a { padding-bottom: 0 !important; padding-left: 0 !important } .component-questionnaire-overlay .responses .nav-buttons:not(.duplicate-back-button) .previous-btn { display: none } .component-questionnaire-overlay .report { position: relative } .component-questionnaire-overlay .report .horizontalTabbed { display: block } .component-questionnaire-overlay .report .horizontalTabbed .component-tabbed-component-inner-wrapper { margin-bottom: 0 } .component-questionnaire-overlay .report .horizontalTabbed .tab-link:last-child { margin-right: 0 } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper { margin-bottom: 4rem; padding: 0 } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper .tab-name:hover a { cursor: pointer; font-family: gilroySemiBold } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper a { font-size: inherit } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper .current a { font-family: gilroyBold } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper .tab-name { text-shadow: none } .component-questionnaire-overlay .report .title-copy { border-bottom: 1px solid #ddd; margin-bottom: 2rem; margin-top: 3rem; padding-bottom: 3rem } .component-questionnaire-overlay .report .title-subcopy { font-family: gilroyRegular } .component-questionnaire-overlay .report .static-text { display: block } .component-questionnaire-overlay .report .report-numbers { padding-bottom: 1.4rem; padding-top: 2.5rem } .component-questionnaire-overlay .report #donut-chart { display: flex; height: 26.3rem; justify-content: center; margin-bottom: 3.2rem } .component-questionnaire-overlay .report #donut-chart svg { height: 26.5rem; width: 26.5rem } .component-questionnaire-overlay .report #donut-chart g:not(.slices) { transform: translate(131px,131px) } .component-questionnaire-overlay .report #donut-chart .chart-line-1 { font-family: gilroyRegular } .component-questionnaire-overlay .report #donut-chart .report-numbers { font-size: 3.6rem } .component-questionnaire-overlay .report #donut-chart path { stroke: none } .component-questionnaire-overlay .report #donut-chart text { stroke: none; fill: #293e40; text-anchor: middle; color: #293e40; font-family: gilroyBold } .component-questionnaire-overlay .report .table-outer-wrapper { margin-top: 3rem; padding-bottom: 1rem } .component-questionnaire-overlay .report .table-title-copy { padding-bottom: 2rem } .component-questionnaire-overlay .report .table-title-copy b { font-family: gilroyBold } .component-questionnaire-overlay .report .table-inner-wrapper { margin-top: 4rem } .component-questionnaire-overlay .report .report-table-right { display: block } .component-questionnaire-overlay .report .report-table-left { padding: 0 } .component-questionnaire-overlay .report .report-table-head { border: 1px solid #ddd; border-bottom: none; padding: 1.2rem 0 1.2rem 2rem } .component-questionnaire-overlay .report .report-table-item { font-family: gilroyBold; padding: 2rem 0 2rem 2rem } .component-questionnaire-overlay .report .report-table-item:nth-child(2) { box-shadow: inset .8rem 0 0 0 #e8a679 } .component-questionnaire-overlay .report .report-table-item:nth-child(3) { box-shadow: inset .8rem 0 0 0 #db8f8f } .component-questionnaire-overlay .report .report-table-item:nth-child(4) { box-shadow: inset .8rem 0 0 0 #8686bc } .component-questionnaire-overlay .report .report-table-item:nth-child(5) { box-shadow: inset .8rem 0 0 0 #7aabb9 } .component-questionnaire-overlay .report .report-table-item:nth-child(6) { box-shadow: inset .8rem 0 0 0 #81b5a1 } .component-questionnaire-overlay .report .report-table-item:nth-child(7) { box-shadow: inset .8rem 0 0 0 #b8d9e2 } .component-questionnaire-overlay .report .report-table-head { border-top-left-radius: 1rem; border-top-right-radius: 1rem; display: flex } .component-questionnaire-overlay .report .report-table-head .report-table-left { min-width: 45% } .component-questionnaire-overlay .report .report-table-item { border: 1px solid rgba(0,0,0,.1); border-bottom: none; display: flex; position: relative } .component-questionnaire-overlay .report .report-table-item:last-child { border-bottom: 1px solid rgba(0,0,0,.1); border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem } .component-questionnaire-overlay .report .report-table-item:last-child.report-table-item { background-color: #f7f7f7; box-shadow: none; padding: 2rem 0 2rem 2rem } .component-questionnaire-overlay .report .report-table-item .numbers-text { min-width: 45% } .component-questionnaire-overlay .report .report-table-item .role-info-icon { align-items: center; background: #fff; border-radius: 100%; box-shadow: 0 2px 4px 0 rgba(41,62,64,.4); cursor: pointer; display: inline-flex; font-family: gilroyBold,Gilroy-Bold,Roboto; font-size: 14px; height: 24px; justify-content: center; margin-left: .8rem; position: relative; width: 24px } .component-questionnaire-overlay .report .role-info-content { display: inline-block } .component-questionnaire-overlay .report .role-info-text { background: #293e40; border-radius: .5rem; color: #fff; font-family: gilroySemibold; left: 0; padding: 1.5rem 4rem; position: absolute; top: -110% } .component-questionnaire-overlay .report .role-info-triangle { background: #293e40; content: ""; height: 25px; left: -2px; position: absolute; top: -39px; transform: rotate(135deg); width: 25px } .component-questionnaire-overlay .report .inline-link { margin-bottom: 3rem } .component-questionnaire-overlay .report .static-text-table { border: 1px solid #ddd; border-radius: .6rem; margin-bottom: 6rem } .component-questionnaire-overlay .report .static-text-table .static-table-head { border-top-left-radius: .6rem; border-top-right-radius: .6rem; padding: 1.6rem 1.8rem } .component-questionnaire-overlay .report .static-text-table .left-head, .component-questionnaire-overlay .report .static-text-table .right-head { color: #fff; font-family: gilroyBold } .component-questionnaire-overlay .report .static-text-table .right-head { display: none } .component-questionnaire-overlay .report .static-text-table .static-table-item { border-bottom: 1px solid #ddd; padding: 3rem 1.6rem 3rem 1.8rem } .component-questionnaire-overlay .report .static-text-table .left-text, .component-questionnaire-overlay .report .static-text-table .right-text { display: block } .component-questionnaire-overlay .report .static-text-table .left-text { font-family: gilroySemibold; padding-bottom: 2.2rem } .component-questionnaire-overlay .report .response-table-head { background-color: #8686bc; border-top-left-radius: .6rem; border-top-right-radius: .6rem; box-shadow: inset 0 0 0 1000px #8686bc } .component-questionnaire-overlay .report .response-table-head span { color: #fff } .component-questionnaire-overlay .report .nav-buttons { margin-bottom: 4.5rem } .component-questionnaire-overlay .report .nav-buttons .submit-btn { display: flex; flex-direction: column-reverse } .component-questionnaire-overlay .report .nav-buttons .cta-component { margin-bottom: 2rem; width: 100% } .component-questionnaire-overlay .report .scroll-top-btn { bottom: 0; cursor: pointer; height: 5rem; position: absolute; right: 0; width: 5rem } .component-questionnaire-overlay .report .scroll-top-btn .scroll-top-icon { bottom: 2rem; height: 5rem; position: fixed; width: 5rem } @media print,screen and (min-width: 768px) { .component-questionnaire-overlay { padding: 0 1.5rem } .component-questionnaire-overlay .header-wrapper { margin-top: 5rem } .component-questionnaire-overlay .sn-logo { height: 2.6rem; width: 9.1rem } .component-questionnaire-overlay .nav-buttons { align-items: center; display: flex; flex-direction: row-reverse; justify-content: space-between; margin-bottom: 7.7rem } .component-questionnaire-overlay .nav-buttons .cta-component { margin: 0 } .component-questionnaire-overlay .nav-buttons .error-message { position: absolute; text-align: center; width: 100% } .component-questionnaire-overlay .nav-buttons.show-error .cta-component { margin-top: 7.4rem } .component-questionnaire-overlay .next-btn { align-items: center; display: flex; position: relative } .component-questionnaire-overlay .next-btn .go-to-response-cta { margin-right: 2.8rem; padding-bottom: 0; white-space: nowrap } .component-questionnaire-overlay .stepper { margin-top: 5.5rem } .component-questionnaire-overlay .stepper .component-asset-block { display: block } .component-questionnaire-overlay .stepper .component-asset-block img { height: 17rem; width: auto } .component-questionnaire-overlay .stepper .step-title-copy { margin-top: 7.4rem } .component-questionnaire-overlay .stepper .step-subcopy { margin: 0 3rem 9.6rem } .component-questionnaire-overlay .stepper.stepper-circles .step-subcopy { margin-bottom: 8.9rem } .component-questionnaire-overlay .stepper .circles { display: flex; margin-bottom: 7.4rem } .component-questionnaire-overlay .stepper .circles .circle-step:last-child .circle-number { margin-bottom: 1rem } .component-questionnaire-overlay .stepper .circle-step { align-items: center; display: flex; flex-direction: column; margin-right: 2.3rem } .component-questionnaire-overlay .stepper .circle-step.done { margin-right: 2.6rem } .component-questionnaire-overlay .stepper .circle-step.done .circle-number { background-color: #293e40; font-size: 1.2rem; height: 3.4rem; margin-bottom: 1.8rem; margin-left: 3px; width: 3.4rem } .component-questionnaire-overlay .stepper .circle-step.done .circle-number:before { border-width: 0 .3rem .3rem 0; height: 15px; left: 11.5px; top: 6px; width: 8px } .component-questionnaire-overlay .stepper .circle-step.done .circle-number:after { margin-left: 1.4rem } .component-questionnaire-overlay .stepper .circle-step.current { margin-right: 2.6rem } .component-questionnaire-overlay .stepper .circle-step.current .circle-number { height: 4.8rem; margin-left: 0; margin-right: 0; margin-top: -6px; width: 4.8rem } .component-questionnaire-overlay .stepper .circle-step.current .circle-number:after { height: 1px } .component-questionnaire-overlay .stepper .circle-step.todo .circle-number { background-color: #293e40; color: #b8d9e2; font-size: 1.8rem; height: 3.4rem; margin-bottom: 1.8rem !important; margin-left: 0; width: 3.4rem } .component-questionnaire-overlay .stepper .circle-text { text-align: center; width: 90px } .component-questionnaire-overlay .stepper .circle-number { font-family: gilroySemibold; font-size: 1.8rem; height: 4.8rem; margin-bottom: 1rem; margin-right: 0; width: 4.8rem } .component-questionnaire-overlay .stepper .circle-number:after { height: 1px; left: 100%; margin-left: .7rem; top: 45%; width: 5.4rem } .component-questionnaire-overlay .questions { margin-top: 8rem } .component-questionnaire-overlay .questions .progress-bar { margin-bottom: 3rem } .component-questionnaire-overlay .questions .question-copy { margin-bottom: 2rem } .component-questionnaire-overlay .questions .question-subcopy { display: block; margin-bottom: 2.4rem } .component-questionnaire-overlay .questions .input { justify-content: flex-start } .component-questionnaire-overlay .questions .input-field { padding: 2rem; text-align: center; width: 37.4rem } .component-questionnaire-overlay .questions .input-field-validation { top: 7.8rem } .component-questionnaire-overlay .questions .question-type { margin-bottom: 6.1rem } .component-questionnaire-overlay .questions .question-type.options { display: flex } .component-questionnaire-overlay .questions .option-element { margin-bottom: 0; margin-right: 1.5rem } .component-questionnaire-overlay .questions .option-label { align-items: center; display: flex; height: 100%; justify-content: center; padding: 3rem 1rem; width: 13rem } .component-questionnaire-overlay .questions .facet-label { margin-left: 4rem } .component-questionnaire-overlay .responses .submit-btn { position: relative } .component-questionnaire-overlay .responses .questions-item { display: flex; padding-bottom: 2rem } .component-questionnaire-overlay .responses .nav-buttons:not(.duplicate-back-button) { justify-content: center } .component-questionnaire-overlay .responses .duplicate-back-button { flex-direction: row; margin-bottom: 3rem } .component-questionnaire-overlay .responses .response-table-head { display: flex } .component-questionnaire-overlay .responses .responses-question-copy { font-family: gilroyBold } .component-questionnaire-overlay .responses .question-step-label { padding: 2rem 2.4rem 1.6rem; width: 48% } .component-questionnaire-overlay .responses .question-step-label, .component-questionnaire-overlay .responses .question-your-response-label { padding: 2rem 2.4rem 1.6rem } .component-questionnaire-overlay .responses .question-your-response-label { display: block; padding-left: 10%; width: 40% } .component-questionnaire-overlay .responses .questions-text { width: 48% } .component-questionnaire-overlay .responses .responses-question-response { padding-left: 11%; padding-top: 0; width: 42% } .component-questionnaire-overlay .responses .responses-question-response .input { margin-left: 0 !important } .component-questionnaire-overlay .responses .questions-item .cta-component a { padding: 0 !important } .component-questionnaire-overlay .report .horizontalTabbed { width: -moz-fit-content; width: fit-content } .component-questionnaire-overlay .report .title-copy { margin-top: 4rem; padding-bottom: 2rem } .component-questionnaire-overlay .report .table-outer-wrapper { margin-top: 3.6rem; padding-bottom: 0 } .component-questionnaire-overlay .report .table-title-copy { padding-bottom: 1.5rem } .component-questionnaire-overlay .report .table-inner-wrapper { margin-top: 2.4rem } .component-questionnaire-overlay .report .report-numbers { padding-bottom: 1.8rem } .component-questionnaire-overlay .report #donut-chart { height: 29rem; margin-bottom: 4.8rem } .component-questionnaire-overlay .report #donut-chart svg { transform: scale(1.23) } .component-questionnaire-overlay .report .table-title-copy { font-family: gilroySemibold } .component-questionnaire-overlay .report .report-table-head, .component-questionnaire-overlay .report .report-table-item { padding: 1.2rem 0 1rem 4rem } .component-questionnaire-overlay .report .report-table-head { border-top-left-radius: .6rem; border-top-right-radius: .6rem } .component-questionnaire-overlay .report .report-table-head .report-table-left { min-width: 34% } .component-questionnaire-overlay .report .report-table-item:last-child { border-bottom-left-radius: .6rem; border-bottom-right-radius: .6rem } .component-questionnaire-overlay .report .report-table-item:last-child.report-table-item { padding: 2rem 0 2rem 4rem } .component-questionnaire-overlay .report .report-table-item .numbers-text { min-width: 34% } .component-questionnaire-overlay .report .report-table-item:nth-child(2) { box-shadow: inset 3.4rem 0 0 -1rem #e8a679 } .component-questionnaire-overlay .report .report-table-item:nth-child(3) { box-shadow: inset 3.4rem 0 0 -1rem #db8f8f } .component-questionnaire-overlay .report .report-table-item:nth-child(4) { box-shadow: inset 3.4rem 0 0 -1rem #8686bc } .component-questionnaire-overlay .report .report-table-item:nth-child(5) { box-shadow: inset 3.4rem 0 0 -1rem #7aabb9 } .component-questionnaire-overlay .report .report-table-item:nth-child(6) { box-shadow: inset 3.4rem 0 0 -1rem #81b5a1 } .component-questionnaire-overlay .report .report-table-item:nth-child(7) { box-shadow: inset 3.4rem 0 0 -1rem #b8d9e2 } .component-questionnaire-overlay .report .role-info-content { position: relative } .component-questionnaire-overlay .report .role-info-text { bottom: 4rem; left: -12.5rem; padding: 1rem 4rem; top: auto; width: 27.4rem } .component-questionnaire-overlay .report .static-text-table { margin-bottom: 3rem } .component-questionnaire-overlay .report .static-text-table:last-child { margin-bottom: 4rem } .component-questionnaire-overlay .report .static-text-table .static-table-head, .component-questionnaire-overlay .report .static-text-table .static-table-item { display: flex } .component-questionnaire-overlay .report .static-text-table .right-head { display: initial } .component-questionnaire-overlay .report .static-text-table .left-head, .component-questionnaire-overlay .report .static-text-table .left-text { max-width: 48%; min-width: 48% } .component-questionnaire-overlay .report .static-text-table .right-head, .component-questionnaire-overlay .report .static-text-table .right-text { padding-left: 6% } .component-questionnaire-overlay .report .nav-buttons { margin-bottom: 6rem } .component-questionnaire-overlay .report .nav-buttons .submit-btn { display: flex; flex-direction: row } .component-questionnaire-overlay .report .nav-buttons .cta-component { margin-bottom: 0; margin-left: 1.5rem } .component-questionnaire-overlay .report .nav-buttons .cta-component a { white-space: nowrap } } @media print,screen and (min-width: 1024px) { .component-questionnaire-overlay { padding: 0 2rem } .component-questionnaire-overlay .header-wrapper { margin-top: 3.3rem } .component-questionnaire-overlay .close-btn { align-items: center; height: auto; width: auto } .component-questionnaire-overlay .close-text { display: block; font-family: gilroyBold; margin-right: 1rem } .component-questionnaire-overlay .close-icon { border: .1rem solid #293e40; border-radius: 50%; height: 3rem; width: 3rem } .component-questionnaire-overlay .close-icon:after, .component-questionnaire-overlay .close-icon:before { height: 1.4rem; left: 50%; top: 50%; width: .2rem } .component-questionnaire-overlay .close-icon:before { transform: translate(-50%,-50%) rotate(90deg) } .component-questionnaire-overlay .close-icon:after { transform: translate(-50%,-50%) } .component-questionnaire-overlay .sn-logo { height: 3rem; width: 12.6rem } .component-questionnaire-overlay .nav-buttons { margin-bottom: 6.4rem } .component-questionnaire-overlay .nav-buttons.show-error { align-items: baseline } .component-questionnaire-overlay .nav-buttons.show-error .cta-component { margin-top: 6rem } .component-questionnaire-overlay .next-btn .go-to-response-cta { margin-right: 3.8rem } .component-questionnaire-overlay .stepper { margin-top: 2.5rem; width: 100% } .component-questionnaire-overlay .stepper .component-asset-block img { height: 17.7rem } .component-questionnaire-overlay .stepper .step-title-copy { margin-bottom: 3rem; margin-top: 4.9rem } .component-questionnaire-overlay .stepper .step-subcopy { margin: 0 auto 6rem; width: 65% } .component-questionnaire-overlay .stepper .circles, .component-questionnaire-overlay .stepper.stepper-circles .step-subcopy { margin-bottom: 4.5rem } .component-questionnaire-overlay .questions { margin-top: 11rem } .component-questionnaire-overlay .questions .question-copy, .component-questionnaire-overlay .questions .questions-title { margin-bottom: 3rem } .component-questionnaire-overlay .questions .question-subcopy { display: block; margin-bottom: 3rem } .component-questionnaire-overlay .questions .input-field { padding: 3.1rem; text-align: center } .component-questionnaire-overlay .questions .input-field-validation { top: 10rem } .component-questionnaire-overlay .questions .question-type { justify-content: center; margin-bottom: 3.1rem; width: -moz-max-content; width: max-content } .component-questionnaire-overlay .questions .option-label { padding: 3.7rem 2.3rem; width: 17.3rem } .component-questionnaire-overlay .questions .option-element { margin-right: 2rem } .component-questionnaire-overlay .questions .facet-label { margin-left: 5rem } .component-questionnaire-overlay .questions .facet-element { margin-bottom: 3.2rem } .component-questionnaire-overlay .responses { display: flex; flex-direction: column-reverse } .component-questionnaire-overlay .responses .responses-table { margin-bottom: 6rem } .component-questionnaire-overlay .responses .nav-buttons:not(.duplicate-back-button) { justify-content: space-between; margin-bottom: .5rem; margin-top: 9.8rem } .component-questionnaire-overlay .responses .nav-buttons:not(.duplicate-back-button) .previous-btn { display: initial } .component-questionnaire-overlay .responses .duplicate-back-button { display: none } .component-questionnaire-overlay .responses .questions-item { padding-bottom: 1.5rem; padding-top: 1.5rem } .component-questionnaire-overlay .responses .responses-question-response { padding-left: 12%; width: 45% } .component-questionnaire-overlay .responses .question-step-label, .component-questionnaire-overlay .responses .question-your-response-label { padding: 1.8rem 2.4rem 1.6rem } .component-questionnaire-overlay .responses .question-your-response-label { padding-left: 11% } .component-questionnaire-overlay .responses .responses-question-error { padding-top: 1.6rem } .component-questionnaire-overlay .responses .selected:before { left: -18px } .component-questionnaire-overlay .report .fte-report { width: 93% } .component-questionnaire-overlay .report .inline-link, .component-questionnaire-overlay .report .title-copy { margin-bottom: 4rem } .component-questionnaire-overlay .report .report-numbers { padding-bottom: 2rem; padding-top: 4rem } .component-questionnaire-overlay .report #donut-chart { margin-bottom: 6rem } .component-questionnaire-overlay .report .table-outer-wrapper { margin-top: 4rem } .component-questionnaire-overlay .report .table-inner-wrapper { margin-top: 3rem } .component-questionnaire-overlay .report .report-table-head .report-table-left, .component-questionnaire-overlay .report .report-table-item .numbers-text { min-width: 30% } .component-questionnaire-overlay .report .report-table-item .role-info-icon { margin-left: 1rem } .component-questionnaire-overlay .report .role-info-text { left: -11rem; padding: 1.5rem 4rem; width: 25rem } .component-questionnaire-overlay .report .static-table { width: 100% } .component-questionnaire-overlay .report .static-text-table:last-child { margin-bottom: 12rem } .component-questionnaire-overlay .report .static-text-table .left-head, .component-questionnaire-overlay .report .static-text-table .left-text { max-width: 52%; min-width: 52% } .component-questionnaire-overlay .report .static-text-table .right-text { padding-left: 6.6% } } @media only screen and (min-width: 1700px) { .component-questionnaire-overlay .header-wrapper { margin-top: 4.4rem; padding-left: 4rem; padding-right: 4rem } .component-questionnaire-overlay .content-type { padding-left: 16rem; padding-right: 16rem } .component-questionnaire-overlay .close-btn { align-items: inherit } .component-questionnaire-overlay .next-btn .go-to-response-cta { margin-right: 4.5rem } .component-questionnaire-overlay .stepper .component-asset-block img { height: 23.6rem } .component-questionnaire-overlay .stepper .step-title-copy { margin-bottom: 3.2rem; margin-top: 4.9rem } .component-questionnaire-overlay .stepper .step-subcopy { font-family: GilroySemiBold; margin: 0 auto 17rem; width: 85% } .component-questionnaire-overlay .stepper.stepper-circles .step-subcopy { margin-bottom: 6.5rem } .component-questionnaire-overlay .stepper .circles { margin-bottom: 5rem } .component-questionnaire-overlay .questions { margin-top: 9.3rem } .component-questionnaire-overlay .questions .questions-title { margin-bottom: 2rem } .component-questionnaire-overlay .questions .progress-bar { margin-bottom: 3.2rem } .component-questionnaire-overlay .questions .progress-bar .percentage-text { margin-top: 1.5rem } .component-questionnaire-overlay .questions .question-copy { margin-bottom: 5.1rem } .component-questionnaire-overlay .questions .question-subcopy { margin-bottom: 4rem } .component-questionnaire-overlay .questions .input-field { padding: 2.9rem } .component-questionnaire-overlay .questions .question-type { margin-bottom: 10.8rem } .component-questionnaire-overlay .questions .facet-element { margin-bottom: 4rem } .component-questionnaire-overlay .questions .facet-box { top: 6px } .component-questionnaire-overlay .questions .option-label { padding: 3.2rem 2rem } .component-questionnaire-overlay .responses .nav-buttons:not(.duplicate-back-button) { margin-bottom: 2rem } .component-questionnaire-overlay .responses .responses-table { margin-top: 4.2rem } .component-questionnaire-overlay .responses .questions-group { margin-bottom: 5rem } .component-questionnaire-overlay .report .fte-report { width: 64% } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper { margin-bottom: 8rem } .component-questionnaire-overlay .report .component-tabbed-component-inner-wrapper a { font-family: gilroyRegular } .component-questionnaire-overlay .report .title-copy { margin-top: 8rem; padding-bottom: 4rem } .component-questionnaire-overlay .report .table-title-copy { font-family: gilroyRegular } .component-questionnaire-overlay .report .table-inner-wrapper { margin-top: 4rem } .component-questionnaire-overlay .report .static-table { width: 100% } .component-questionnaire-overlay .report .static-text-table .static-table-item { padding: 1.5rem 1.6rem 2rem 1.8rem } .component-questionnaire-overlay .report .static-text-table .left-head, .component-questionnaire-overlay .report .static-text-table .left-text { max-width: 32%; min-width: 32% } .component-questionnaire-overlay .report .scroll-top-btn { right: -12rem } } @media print { body.no-scroll { overflow-y: auto; position: relative } .cscVideoContentMarquee .ucsc-variation-team-sizing, body.no-scroll .csc-sNowGlobalNav, body.no-scroll .cscMegaNav { display: none } .component-questionnaire-overlay { display: block; position: static; -webkit-print-color-adjust: exact } .component-questionnaire-overlay .close-btn, .component-questionnaire-overlay .horizontalTabbed, .component-questionnaire-overlay .nav-buttons, .component-questionnaire-overlay .role-info-content, .component-questionnaire-overlay .scroll-top-btn { display: none !important } .component-questionnaire-overlay .questions-item, .component-questionnaire-overlay .response-table-head, .component-questionnaire-overlay .static-table-head, .component-questionnaire-overlay .static-table-item, .component-questionnaire-overlay .table-outer-wrapper { -moz-column-break-inside: avoid; break-inside: avoid } .component-questionnaire-overlay .right-text, .component-questionnaire-overlay .static-table-head { page-break-inside: avoid } } .text-component ol li, .text-component ul li { list-style: unset } .component-solution-planner { padding: 0 0 6rem; position: relative } .component-solution-planner .solution-planner-inner-wrapper { margin: auto; max-width: 170rem; padding: 0 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row { display: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.visible-workflow, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row:first-child { display: block } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row .add-solution-button { border: 1px solid #293e40; border-radius: .5rem; color: #293e40; cursor: pointer; display: none; font-family: GilroyBold; padding: 2rem 6rem; text-align: center } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .add-solution-button { display: block } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution.next-workflow .add-solution-button, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution:nth-last-child(2) .add-solution-button { display: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div { background-color: #f7f7f7; left: 25%; margin: 0 0 1rem; opacity: 0; padding: 1.8rem 2rem 4rem 2.2rem; position: relative } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div p { font-family: GilroyBold; margin: 0 0 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div ul { margin: 0; padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div ul li { margin: 0; padding: 0 0 2rem 3rem; position: relative } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div ul li img { height: auto; left: 0; max-height: 1rem; max-width: 1rem; position: absolute; top: .5rem; width: 100% } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div ul li:last-child { padding-bottom: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3).visible-outcome div { left: 0; opacity: 1; transition: left .75s,opacity .75s } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: .2rem .2rem; font-family: GilroySemibold; font-size: inherit; line-height: 2rem; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .25s ease-out } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a:hover, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a:hover { font-family: GilroyBold !important } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a.solution-planner-clear-form, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a.solution-planner-clear-form { font-family: GilroySemibold } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a.solution-planner-clear-form.disabled, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a.solution-planner-clear-form.disabled { pointer-events: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a.solution-planner-clear-row, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a.solution-planner-clear-row { display: none !important; position: absolute; right: 0; top: 2rem } .component-solution-planner .solution-planner-inner-wrapper p { color: #293e40; font-family: GilroyRegular; margin: 0 } .component-solution-planner .solution-planner-inner-wrapper div.workflow-label { border: 1px solid #293e40; border-radius: .5rem; font-family: GilroyBold; padding: 2rem; text-align: center } .component-solution-planner .solution-planner-inner-wrapper div.workflow-label.active { background-color: #293e40; color: #fff; cursor: pointer } .component-solution-planner .solution-planner-inner-wrapper div.workflow-label.active:hover { background-color: #81b5a1; border-color: #81b5a1 } .component-solution-planner .solution-planner-inner-wrapper div.workflow-label.inactive { background-color: transparent; color: #293e40; opacity: .4; pointer-events: none } .component-solution-planner .solution-planner-inner-wrapper div.workflow-label.empty { border: none; color: #293e40; font-family: GilroyRegular; opacity: .4; padding: 0; text-align: left } .component-solution-planner .solution-planner-inner-wrapper div.workflow-label.filled { color: #293e40; cursor: pointer; font-family: GilroyBold; text-align: center } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row { padding: 3rem 1rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row h5 { font-family: GilroyBold } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row .comp-full-bleed-bg-color { border-radius: .5rem .5rem 0 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row h5, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row p { margin: 0; padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row h5, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row p { margin-bottom: 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row { padding: 0 2rem; position: relative } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row { padding: 3.5rem 0 0; position: relative } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row { border-top: 1px solid rgba(41,62,64,.4) } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column { padding: 2rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column + .solution-planner-column { border-top: 1px solid rgba(41,62,64,.4) } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h5 { color: #293e40; font-family: GilroyBold; padding: 0 0 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 { color: #293e40; font-family: GilroyBold; font-size: 1rem !important; padding: 0 0 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 span { display: block; font-family: inherit; font-size: inherit; line-height: inherit } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .empty-state { opacity: .4 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-column:first-child h6 span { display: inline } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row { padding: 0; position: relative } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6 { color: #293e40; font-family: GilroyBold; font-size: 1rem !important; padding: 0 0 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6 span { font-family: inherit; font-size: inherit; line-height: inherit } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row p { padding: 0 0 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .comp-full-bleed-bg-color { border-radius: 0 0 .5rem .5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-text { padding: 3rem 2rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-button { background-color: #fff; border-radius: 0 0 .5rem .5rem; padding: 3rem 2rem; text-align: center } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-button.disabled-cta-section { background-color: #f7f7f7 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box { background-color: #293e40; display: inline-block; margin: 0 auto } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box a { border-color: #293e40; text-align: center } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box:hover a { border-color: #81b5a1 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box.disabled { opacity: .4; pointer-events: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box.disabled .cta-background-full { display: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box.add-solution-button { margin: 1rem 0 3rem } @media screen and (min-width: 768px) { .component-solution-planner .solution-planner-inner-wrapper { padding: 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div { padding: 1.8rem 2rem 3rem 2.2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a.solution-planner-clear-row, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row a.solution-planner-clear-row { top: 3.2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row { align-items: center; display: flex; padding: 3rem 1.5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row h5 { margin-bottom: 1rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row p { margin-bottom: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row .solution-planner-top-column:last-of-type { text-align: right } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row { padding: 0 3rem 1.5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row div.workflow-label { padding: 2rem 6rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row { padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row { border-top: 1px solid rgba(41,62,64,.4) } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column { padding: 3rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column + .solution-planner-column { border-top: 1px solid rgba(41,62,64,.4) } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h5, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 { padding: 0 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 span { display: inline } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row p { padding: 0 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .comp-full-bleed-bg-color { border-radius: 0 0 .5rem .5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box { margin: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-text { padding: 3rem 3rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-button { background-color: #fff; border-radius: 0 0 .5rem .5rem; padding: 3rem; text-align: left } } @media screen and (min-width: 1024px) { .component-solution-planner .solution-planner-inner-wrapper { padding: 0 4rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row:first-child { display: flex } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div { margin: 0 0 1rem; padding: 1.8rem 2rem 1rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div p { margin: 0 0 1.4rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row a.solution-planner-clear-row, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h5 { display: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row { padding: 3.5rem 1rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row h5 { margin-bottom: 1rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row p { margin-bottom: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row .solution-planner-top-column:last-of-type { padding: 0 3rem 0 0; text-align: right } .component-solution-planner .solution-planner-inner-wrapper .solution-body-container { display: flex } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row { padding: 0 2.5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row { display: flex; padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .add-solution-button { display: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row div.workflow-label { align-items: center; display: flex; flex-grow: 1; justify-content: center; padding: 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row div.workflow-label.filled { flex-grow: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row { border-top: 1px solid rgba(41,62,64,.4) } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row .empty-state, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row div.workflow-label.empty, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row h6 { display: none } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column { display: flex; flex-direction: column; padding: 3rem 0; width: 36% } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column + .solution-planner-column { border-top: none; padding: 3rem 0 3rem 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column + .solution-planner-column div.workflow-label.filled { text-align: left } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column:first-child { width: 28% } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column:first-child div.workflow-label { padding: 2rem 4rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column:first-child div.workflow-label.active { display: block } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 { min-height: 5.4rem; padding: 0 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-column:first-child h6 span, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 span { display: block } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .comp-full-bleed-bg-color { border-radius: 0 0 0 .5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row { padding: 3rem 2.6rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6 { min-height: 5.4rem; padding: 0 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6 span { display: block } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row p { padding: 0 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .comp-full-bleed-bg-color { border-radius: 0 0 .5rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box { margin: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box a { padding-left: 2rem !important; padding-right: 2rem !important } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-button, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-text { background: none; margin: 0; padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-button .cta-component a, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .download-report-text .cta-component a { height: 6rem; text-align: center; width: 18.2rem } } @media screen and (min-width: 1700px) { .component-solution-planner { padding: 0 0 7.5rem } .component-solution-planner .solution-planner-inner-wrapper { padding: 0 4rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div { margin: 0 0 1rem; padding: 2rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-row.complete-solution .solution-planner-column:nth-child(3) div p { font-size: 1.6rem; margin: 0 0 1.4rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row { padding: 3rem 1rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row h5 { margin-bottom: 1.5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row p { margin-bottom: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-top-row .solution-planner-top-column:last-of-type { padding: 0 2rem 0 0; text-align: right } .component-solution-planner .solution-planner-inner-wrapper .solution-body-container { display: flex } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row { flex-grow: 1; max-width: 81.7%; padding: 0 5rem 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row { display: flex; padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row + .solution-planner-row { border-top: 1px solid rgba(41,62,64,.4) } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column { padding: 3rem 0; width: 36rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column:first-child { width: 36rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column:nth-child(3) { width: 37rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-row .solution-planner-column + .solution-planner-column { border-top: none; margin: 0 0 0 7.5rem; padding: 3rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 { margin: 0 0 3rem; min-height: 0; padding: 0; width: auto !important } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .solution-planner-column:first-child h6 span, .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row h6 span { display: inline } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-middle-row .comp-full-bleed-bg-color { border-radius: 0 0 0 .5rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row { max-width: 18.3%; padding: 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6 { margin: 0 0 3rem; min-height: 0; padding: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row h6 span { display: inline } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row p { padding: 0 0 3rem } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .comp-full-bleed-bg-color { border-radius: 0 0 .5rem 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box { display: inline-block; margin: 0 } .component-solution-planner .solution-planner-inner-wrapper .solution-planner-bottom-row .cta-component.cta-rectangle-box a { width: 23.6rem } } .solution-planner-overlay { background-color: rgba(0,0,0,.4); bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 1000 } .solution-planner-overlay, .solution-planner-overlay .focus-area-overlay-container, .solution-planner-overlay .problem-statement-overlay-container { display: none } .solution-planner-overlay.active-overlay { display: flex } .solution-planner-overlay.active-overlay.focus-area-overlay .focus-area-overlay-container { display: block } .solution-planner-overlay.active-overlay.focus-area-overlay .focus-area-overlay-container .workflow-problem-option { display: none } .solution-planner-overlay.active-overlay.focus-area-overlay .focus-area-overlay-container .workflow-problem-option.selected-option, .solution-planner-overlay.active-overlay.focus-area-overlay .focus-area-overlay-container .workflow-problem-option.show-option, .solution-planner-overlay.active-overlay.problem-statement-overlay .problem-statement-overlay-container { display: block } .solution-planner-overlay .solution-planner-overlay-container { background-color: #f7f7f7; height: 100%; overflow-y: auto; overflow-y: overlay; padding: 6rem 0 0; width: 100% } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-close { position: absolute; right: 2rem; top: 2.4rem; z-index: 2 } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-close svg { height: 100%; max-height: 2.4rem; max-width: 2.4rem; width: 100% } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-close svg g { stroke: #293e40 } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top { background-color: #fff; height: 6rem; padding: 0 2rem; position: fixed; top: 0; width: 100%; z-index: 1 } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top a { height: 6rem; line-height: 6rem } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top a img { max-width: 7.6rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container { min-height: calc(100% - 132px); padding: 4rem 2rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container h3, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { font-family: GilroyBold; margin: 0; padding: 0 0 1rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul { margin: 0; padding: 0 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li { margin: 0; padding: 2rem 2rem 1.5rem 4rem; position: relative } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li + li, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li + li { border-top: 1px solid #d8d8d8 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li .workflow-problem-option-button, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li .workflow-problem-option-button { border: 2px solid #293e40; border-radius: 50%; cursor: pointer; height: 1.5rem; left: 0; margin: -2rem 0 0; opacity: .4; position: absolute; top: 6rem; width: 1.5rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li.selected-option .workflow-problem-option-button, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li.selected-option .workflow-problem-option-button { opacity: 1 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li.selected-option .workflow-problem-option-button:after, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li.selected-option .workflow-problem-option-button:after { background: #81b5a1; border-radius: 50%; content: " "; display: inline-block; height: .9rem; left: .1rem; position: absolute; top: .1rem; width: .9rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li input, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li input { display: none } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li h5, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li h5 { cursor: pointer; font-family: GilroyBold; margin: 0; padding: 0 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li p, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li p { cursor: pointer; font-family: GilroyRegular; margin: 0; padding: 1.5rem 0 0 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li label, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li label { cursor: pointer } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { max-width: 75%; padding: 0 0 4rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h5 { font-family: GilroyBold; margin: 0; padding: 2rem 0 0 4rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h5:first-child { padding-top: 0 } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h5.empty-title:first-child { display: none } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h5.empty-title + ul { padding-top: 0 } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h5.empty-title + ul li.workflow-problem-option + li.workflow-problem-option { border-top: 1px solid #d8d8d8 } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul { border-bottom: 1px solid #d8d8d8; padding: 1.2rem 0 2rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul:last-of-type { border-bottom: none } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li:first-child { padding-top: 0 } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li:first-child .workflow-problem-option-button { top: .1rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li .workflow-problem-option-button { margin: 0; top: 2.1rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li h5 { font-family: GilroyRegular } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li h5.empty-title:first-child { display: none } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li h5.empty-title + ul { margin-top: 0; padding-top: 0 } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li + li { border-top: none } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li:last-child { padding-bottom: 0 } .solution-planner-overlay .solution-planner-overlay-container .submit-button { background-color: #f7f7f7; margin: auto; padding: 0 2rem 6rem; text-align: center; width: 100% } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component { display: inline-block } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component a { text-align: center; width: 28rem } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component.disabled { opacity: .4; pointer-events: none } @media screen and (min-width: 768px) { .solution-planner-overlay .solution-planner-overlay-container { overflow: hidden; padding-top: 10rem } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-close { right: 3rem; top: 4.2rem } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top { height: 10rem; padding: 0 3rem } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top a { height: 10rem; line-height: 10rem } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top a img { max-width: 9.1rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container { height: calc(100% - 240px); min-height: 0; overflow-y: auto; overflow-y: overlay; padding: 0 3rem 4rem; position: relative; top: 8rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container h3, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { max-width: none; position: fixed; top: 13rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul { padding: 0 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li .workflow-problem-option-button, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li .workflow-problem-option-button { margin: 0; top: 2.6rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li p, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li p { padding: 2rem 0 0 } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container { top: 10rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul { border-bottom: none; padding: 1.5rem 0 2rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li .workflow-problem-option-button { top: 2.2rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul + h5 { border-top: 1px solid #d8d8d8 } .solution-planner-overlay .solution-planner-overlay-container .submit-button { bottom: 0; position: fixed; text-align: right } .solution-planner-overlay .solution-planner-overlay-container .submit-button:before { background: #f7f7f7; background: linear-gradient(0deg,#f7f7f7,hsla(0,0%,97%,0)); content: ""; display: block; height: 4rem; left: 0; pointer-events: none; position: absolute; right: 0; top: -5rem; width: 100%; z-index: 1 } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component { margin: 0 } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component a { padding-bottom: 2.4rem !important; padding-top: 2.4rem !important; width: 22rem } } @media screen and (min-width: 1024px) { .solution-planner-overlay.focus-area-overlay .solution-planner-overlay-container { height: 56rem } .solution-planner-overlay.focus-area-overlay .solution-planner-overlay-container .focus-area-overlay-container { height: calc(100% - 196px) } .solution-planner-overlay.focus-area-overlay .solution-planner-overlay-container .focus-area-overlay-container .solution-planner-overlay-options-container { height: 100% } .solution-planner-overlay.focus-area-overlay .solution-planner-overlay-container .submit-button:before { display: none } .solution-planner-overlay .solution-planner-overlay-container { border-radius: .5rem; height: 70rem; margin: auto; max-height: 90%; overflow-y: initial; padding: 0; position: relative; width: 60rem } .solution-planner-overlay .solution-planner-overlay-container .solution-planner-overlay-top { display: none } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container { margin-top: 11rem; overflow: visible; padding: 0 3.5rem 2rem; top: 0 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container h3, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { max-width: 55%; position: absolute; top: -8rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container .solution-planner-overlay-options-container, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container .solution-planner-overlay-options-container { height: 100%; overflow-y: auto; overflow-y: overlay } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li { border-top: none !important; padding: 0 2rem 2.5rem 3.5rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li + li, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li + li { border-top: none } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li .workflow-problem-option-button, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li .workflow-problem-option-button { top: .6rem } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li h5 + p, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li h5 + p { padding: 1.5rem 0 0 } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul div, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul div { height: 100%; overflow-y: auto; overflow-y: overlay } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul + h5, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul + h5 { border: none; padding-top: 1rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container { height: calc(100% - 204px); margin-top: 13rem; padding: 0 3.5rem 5rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { top: -10rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h5, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul { padding: 0 0 3rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container ul li .workflow-problem-option-button { top: .1rem } .solution-planner-overlay .solution-planner-overlay-container .submit-button { border-radius: 0 0 5px 5px; bottom: 0; height: 12.5rem; left: 0; padding: 3rem; position: absolute; right: 0; text-align: right; width: auto } .solution-planner-overlay .solution-planner-overlay-container .submit-button:before { top: -4.1rem } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component { margin: 0 } .solution-planner-overlay .solution-planner-overlay-container .submit-button .cta-component a { width: 22rem } .solution-planner-overlay.problem-statement-overlay .solution-planner-overlay-container { width: 80rem } .solution-planner-overlay.problem-statement-overlay .solution-planner-overlay-container .submit-button { border-top: 1px solid #d8d8d8 } } @media screen and (min-width: 1700px) { .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container h3, .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { max-width: none } .solution-planner-overlay .solution-planner-overlay-container .focus-area-overlay-container ul li { padding: 0 2rem 2rem 3.5rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container { margin-top: 10rem; padding: 0 3.5rem 2rem } .solution-planner-overlay .solution-planner-overlay-container .problem-statement-overlay-container h3 { margin-top: 3rem } .solution-planner-overlay .solution-planner-overlay-container .submit-button { left: 3rem; padding: 3rem 0; right: 3rem } .solution-planner-overlay.problem-statement-overlay .solution-planner-overlay-container { width: 123rem } } .component-solution-planner-report { background-color: #b4b2d9; border-radius: 1rem 1rem 0 0; box-shadow: 0 2px 5px 2px rgba(0,0,0,.2); height: 227rem; margin: 8rem auto 3rem; position: relative; width: 161.6rem } .component-solution-planner-report .solution-planner-report-cover { height: 227rem; padding: 9rem 9rem 0; position: relative } .component-solution-planner-report .solution-planner-report-cover .servicenow-logo { padding: 0 0 20rem; width: 24rem } .component-solution-planner-report .solution-planner-report-cover .servicenow-logo img { width: 100% } .component-solution-planner-report .solution-planner-report-cover h3 { font-family: GilroyBold; font-size: 10rem; line-height: 1.1; padding: 0 0 3rem; width: 84rem } .component-solution-planner-report .solution-planner-report-cover p { font-family: GilroyRegular; font-size: 2.8rem; line-height: 1 } .component-solution-planner-report .solution-planner-report-cover .solution-planner-report-cover-image { bottom: -.4rem; left: 0; margin: 0; padding: 15rem 0 0; position: absolute; right: 0 } .component-solution-planner-report .solution-planner-report-cover .solution-planner-report-cover-image img { width: 100% } .component-solution-planner-report .solution-planner-report-page { background-color: #fff; border-radius: 1rem 0 0 0 } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-header { background-color: #b4b2d9; background-image: url(../../../content/dam/servicenow-assets/public/en-us/CSC/data-files/solution-planner/PDF-Images/solution-planner-report-header-graphic.png); background-position: 100%; background-repeat: no-repeat; background-size: auto 100%; border-radius: 1rem 0 0 0; height: 8rem; padding: 3rem 6rem } .component-solution-planner-report .solution-planner-report-page .servicenow-logo { width: 15rem } .component-solution-planner-report .solution-planner-report-page img { width: 100% } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body { height: 219rem; padding: 7rem 6rem 5rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body h3 { font-family: GilroyBold; font-size: 4.8rem; line-height: 1; padding: 0 0 2rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body p { font-family: GilroyRegular; font-size: 2.4rem; line-height: 1.7; margin: 0; padding: 0 } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body span { color: inherit; font-size: inherit } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products { display: inline-block; float: left; height: 73rem; margin-top: 6rem; width: 72rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .solution-planner-products-header { background-color: #b4b2d9; border-radius: 1rem 1rem 0 0; height: 8rem; padding: 2rem 4rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .solution-planner-products-header h4 { font-family: GilroyBold; font-size: 3rem; line-height: 1.3; padding: 0 0 5rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .solution-planner-products-body { background-color: #f7f7f7; height: 65rem; padding: 5rem 4rem 6rem; position: relative } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products ul { margin: 0; padding: 0 } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products li { display: inline-block; font-family: GilroyRegular; font-size: 2rem; padding: 0 0 3rem 2.2rem; position: relative; vertical-align: top; width: 30rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products li:before { color: #8686ba; content: "•"; font-size: 2.4rem; left: 0; line-height: 2.4rem; position: absolute } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products li:nth-child(2n) { margin-left: 2rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .service-planner-cta-container { bottom: 6rem; left: 0; margin: auto; position: absolute; right: 0; width: 54rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .service-planner-cta-container .service-planner-cta { background-color: #293e40; border: 2px solid #293e40; color: #fff; font-family: GilroyBold; font-size: 2rem; height: 7.2rem; line-height: 7.2rem; text-align: center } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .service-planner-cta-container .service-planner-cta + .service-planner-cta { background-color: transparent; color: #293e40; margin: 3rem 0 0 } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-products .service-planner-cta-container a { color: inherit; font-family: inherit; font-size: inherit } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-summary { background-color: #f7f7f7; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAK8AAACvCAYAAACLko51AAAMSGlDQ1BJQ0MgUHJvZmlsZQAASImVVwdYU8kWnltSSWiBCEgJvYkiSJcSQotUqYKNkAQSSgwJQcTusqjg2kUEbOiKiKKrKyBrRV3rIthdy8OCysq6WLCh8iYFdN3vvfe9831z758z5/ynZO69MwDo1PCk0lxUF4A8SYEsPjyYNSk1jUV6BBBABWSgDYx5fLmUHRcXBaAM3f8ub65DayhXXJRc/5z/r6InEMr5ACBxEGcI5Pw8iH8GAC/hS2UFABC9od56ZoFUiadAbCCDCUIsVeIsNS5R4gw1rlTZJMZzIN4NAJnG48myANBugXpWIT8L8mjfhNhVIhBLANAhQxzAF/EEEEdAPCovb4YSQzvgkPEVT9bfODOGOXm8rGGsrkUl5BCxXJrLm/V/tuN/S16uYiiGHRw0kSwiXlkz7NvNnBmRSkyDuFeSERMLsT7E78QClT3EKFWkiEhS26OmfDkH9gwwIXYV8EIiITaFOEySGxOl0WdkisO4EMMVghaJC7iJGt8lQnlogoazRjYjPnYIZ8o4bI1vI0+miqu0P6XISWJr+G+KhNwh/tfFosQUdc4YtVCcHAOxNsRMeU5CpNoGsykWcWKGbGSKeGX+NhD7CiXhwWp+bFqmLCxeYy/Lkw/Viy0RibkxGlxVIEqM0PDs5vNU+RtB3CKUsJOGeITySVFDtQiEIaHq2rEOoSRJUy/WJS0Ijtf4vpTmxmnscaowN1ypt4LYVF6YoPHFAwrgglTz4zHSgrhEdZ54RjZvQpw6H7wIRAEOCAEsoIAjA8wA2UDc3tvcC3+pZ8IAD8hAFhACF41myCNFNSOB1wRQDP6ESAjkw37BqlkhKIT6T8Na9dUFZKpmC1UeOeAxxHkgEuTC3wqVl2Q4WjJ4BDXif0Tnw1xz4VDO/VPHhpoojUYxxMvSGbIkhhJDiBHEMKIjboIH4H54FLwGweGGe+M+Q9l+sSc8JnQSHhCuEboIt6aLF8m+qYcFokEXjBCmqTnj65pxO8jqgQfj/pAfcuNM3AS44ONgJDYeCGN7QC1Hk7my+m+5/1bDV13X2FFcKShlBCWI4vCtp7aTtscwi7KnX3dInWvGcF85wzPfxud81WkBvEd+a4ktwQ5gZ7AT2DnsMNYMWNgxrAW7iB1R4uFV9Ei1ioaixavyyYE84n/E42liKjspd21w7XH9qJ4rEBYp34+AM0M6SybOEhWw2PDNL2RxJfzRo1hurm6uACi/I+rX1Cum6vuAMM9/0eUfB8CnDCqzvuh41gAcegwA480XnfVL+HisBOBIB18hK1TrcOWFAL9POvCJMgbmwBo4wHrcgCfwA0EgFEwAsSARpIJpsMsiuJ5lYCaYAxaCUlAOVoJ1oApsBtvATrAH7AfN4DA4AX4FF0AHuAZuw9XTDZ6BPvAGDCAIQkLoCAMxRiwQW8QZcUO8kQAkFIlC4pFUJB3JQiSIApmDfIeUI6uRKmQrUo/8hBxCTiDnkE7kFnIf6UFeIh9QDKWhBqgZaoeOQb1RNhqJJqJT0Sw0Hy1GS9DlaCVai+5Gm9AT6AX0GtqFPkP7MYBpYUzMEnPBvDEOFoulYZmYDJuHlWEVWC3WiLXC//kK1oX1Yu9xIs7AWbgLXMEReBLOx/PxefgyvArfiTfhp/Ar+H28D/9MoBNMCc4EXwKXMImQRZhJKCVUEHYQDhJOw6epm/CGSCQyifZEL/g0phKzibOJy4gbiXuJx4mdxIfEfhKJZExyJvmTYkk8UgGplLSBtJt0jHSZ1E16R9YiW5DdyGHkNLKEvIhcQd5FPkq+TH5CHqDoUmwpvpRYioAyi7KCsp3SSrlE6aYMUPWo9lR/aiI1m7qQWkltpJ6m3qG+0tLSstLy0ZqoJdZaoFWptU/rrNZ9rfc0fZoTjUObQlPQltPqaMdpt2iv6HS6HT2InkYvoC+n19NP0u/R32kztEdrc7UF2vO1q7WbtC9rP9eh6NjqsHWm6RTrVOgc0Lmk06tL0bXT5ejydOfpVuse0r2h26/H0BurF6uXp7dMb5feOb2n+iR9O/1QfYF+if42/ZP6DxkYw5rBYfAZ3zG2M04zug2IBvYGXINsg3KDPQbtBn2G+objDJMNiwyrDY8YdjExph2Ty8xlrmDuZ15nfhhhNoI9Qjhi6YjGEZdHvDUaaRRkJDQqM9prdM3ogzHLONQ4x3iVcbPxXRPcxMlkoslMk00mp016RxqM9BvJH1k2cv/I301RUyfTeNPZpttML5r2m5mbhZtJzTaYnTTrNWeaB5lnm681P2reY8GwCLAQW6y1OGbxB8uQxWblsipZp1h9lqaWEZYKy62W7ZYDVvZWSVaLrPZa3bWmWntbZ1qvtW6z7rOxsIm2mWPTYPO7LcXW21Zku972jO1bO3u7FLvFds12T+2N7Ln2xfYN9ncc6A6BDvkOtQ5XHYmO3o45jhsdO5xQJw8nkVO10yVn1NnTWey80blzFGGUzyjJqNpRN1xoLmyXQpcGl/ujmaOjRi8a3Tz6+RibMWljVo05M+azq4drrut219tj9cdOGLtobOvYl25Obny3arer7nT3MPf57i3uL8Y5jxOO2zTupgfDI9pjsUebxydPL0+ZZ6Nnj5eNV7pXjdcNbwPvOO9l3md9CD7BPvN9Dvu89/X0LfDd7/uXn4tfjt8uv6fj7ccLx28f/9Dfyp/nv9W/K4AVkB6wJaAr0DKQF1gb+CDIOkgQtCPoCduRnc3ezX4e7BosCz4Y/Jbjy5nLOR6ChYSHlIW0h+qHJoVWhd4LswrLCmsI6wv3CJ8dfjyCEBEZsSriBteMy+fWc/smeE2YO+FUJC0yIbIq8kGUU5QsqjUajZ4QvSb6ToxtjCSmORbEcmPXxN6Ns4/Lj/tlInFi3MTqiY/jx8bPiT+TwEiYnrAr4U1icOKKxNtJDkmKpLZkneQpyfXJb1NCUlandE0aM2nupAupJqni1JY0Ulpy2o60/smhk9dN7p7iMaV0yvWp9lOLpp6bZjItd9qR6TrTedMPpBPSU9J3pX/kxfJqef0Z3IyajD4+h7+e/0wQJFgr6BH6C1cLn2T6Z67OfJrln7Umq0cUKKoQ9Yo54irxi+yI7M3Zb3Nic+pyBnNTcvfmkfPS8w5J9CU5klMzzGcUzeiUOktLpV35vvnr8vtkkbIdckQ+Vd5SYAA37BcVDorvFfcLAwqrC9/NTJ55oEivSFJ0cZbTrKWznhSHFf84G5/Nn902x3LOwjn357Lnbp2HzMuY1zbfen7J/O4F4Qt2LqQuzFn42yLXRasXvf4u5bvWErOSBSUPvw//vqFUu1RWemOx3+LNS/Al4iXtS92Xblj6uUxQdr7ctbyi/OMy/rLzP4z9ofKHweWZy9tXeK7YtJK4UrLy+qrAVTtX660uXv1wTfSaprWstWVrX6+bvu5cxbiKzeup6xXruyqjKls22GxYueFjlajqWnVw9d4a05qlNW83CjZe3hS0qXGz2ebyzR+2iLfc3Bq+tanWrrZiG3Fb4bbH25O3n/nR+8f6HSY7ynd8qpPUde2M33mq3qu+fpfprhUNaIOioWf3lN0de0L2tDS6NG7dy9xbvg/sU+z746f0n67vj9zfdsD7QOPPtj/XHGQcLGtCmmY19TWLmrtaUls6D0041Nbq13rwl9G/1B22PFx9xPDIiqPUoyVHB48VH+s/Lj3eeyLrxMO26W23T046efXUxFPtpyNPn/017NeTZ9hnjp31P3v4nO+5Q+e9zzdf8LzQdNHj4sHfPH472O7Z3nTJ61JLh09Ha+f4zqOXAy+fuBJy5der3KsXrsVc67yedP3mjSk3um4Kbj69lXvrxe+Fvw/cXnCHcKfsru7dinum92r/5fivvV2eXUfuh9y/+CDhwe2H/IfPHskffewueUx/XPHE4kn9U7enh3vCejr+mPxH9zPps4He0j/1/qx57vD857+C/rrYN6mv+4XsxeDLZa+MX9W9Hve6rT+u/96bvDcDb8veGb/b+d77/ZkPKR+eDMz8SPpY+cnxU+vnyM93BvMGB6U8GU+1FcDgQDMzAXhZBwA9Fe4dOgCgTlaf81SCqM+mKgT+E1afBVXiCUBdEABJCwCIgnuUTXDYQkyDd+VWPTEIoO7uw0Mj8kx3NzUXDZ54CO8GB1+ZAUBqBeCTbHBwYOPg4KftMNlbABzPV58vlUKEZ4MtY5Soo/s5+Fb+DQ3+f0J0eAEMAAAACXBIWXMAABYlAAAWJQFJUiTwAAACBGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS40LjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iPgogICAgICAgICA8ZXhpZjpQaXhlbFlEaW1lbnNpb24+MjA0PC9leGlmOlBpeGVsWURpbWVuc2lvbj4KICAgICAgICAgPGV4aWY6UGl4ZWxYRGltZW5zaW9uPjI4NjwvZXhpZjpQaXhlbFhEaW1lbnNpb24+CiAgICAgICAgIDx0aWZmOk9yaWVudGF0aW9uPjE8L3RpZmY6T3JpZW50YXRpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgrkyS4+AAAG6UlEQVR4Ae3d3W4bNxCG4XVgI/d/Ye5ZgfagKRKkQaG0CVoXNVI0VkQnUmRZu+KSnOEM55URWNLyZ/jNAx0EknV1f3+/nbiRgKMEPj88TJ/+/2+6dlQzpZLAlOBu7j5Mr//8Hbx48JPAHu7t65+mu0//Ti/8lE6lkRM4hvvqj9+m7XYL3sggvJz9FO6+bl5590nw22QCc3BTseA12TKKSgkswU3XwZtS4GYugUtwU8HgNdc2CsqBC16cmEsgFy54zbUudkFr4II3thVTp18LF7ym2he3mBK44I3rxczJS+GC10wLYxZSAxe8Mc2YOPXn7dd3h6U32aT3KpTc+H/ektSYU5XAI9y/P0y3b8rhpgLAW9UGJq9N4Anc92WvuPs9wbtPgt/iCbSEm4oFr3jL2CAl0BpuWhO8KQVuoglIwE0Fg1e0bSwuBRe82BJNQBIueEVbF3txabjgje1L7PQacMEr1r64C2vBBW9cYyIn14QLXpEWxlxUGy54YzprfuoecMHbvI3xFuwFF7zxrDU9cU+44G3ayliL9YYL3ljemp3WAlzwNmtnrIU2+zeSV74ftzY1/rh0bYKB5j/sPrqTPnf2+AmIznBT7OANhK/mqAnu5u7j479XBuCCt6abgebu4f7w5ufJClzwBgJYetRjuL9s3k7b3Y+VG29Gt9IJg3VYhpviAq9BNBZKsg4XvBaUGKzBA1zwGoTTuyQvcMHbW4qx/T3BBa8xPD3L8QYXvD21GNrbI1zwGgLUqxSvcMHbS4yRfT3DBa8RRD3K8A4XvD3UGNhzBLjgNQBJu4RR4IJXW07n/UaCC97OmDS3Hw0ueDX1dNxrRLjg7QhKa+tR4YJXS1CnfUaGC95OqDS2HR0ueDUUddgjAlzwdoAlvWUUuOCVlqS8fiS44FXGJbldNLjgldSkuHZEuOBVBCa1VVS44JUSpbRuZLjgVUImsU10uOCVUKWwJnC/hsxfzFHA1nIL4H5PE7zfszB/D7hPWwTep3mYfQTc560B7/NMzD0D3PMtAe/5XMw8C9z5VoB3PpvuV4C73ALwLufT7SpwL0cP3ssZqY8Abl7k4M3LSW0UcPOjBm9+VuIjE9z3u6+LSt+6Y+3LS8QPX7ABeAtCk5iyh3sL3Ox4wZsdldxA4JZlC96y3JrNAm55lOAtz656JnDrIgRvXX7Fs4FbHN1hIngPUejdAW6brMHbJsfsVYCbHdXFgeC9GFG7AcBtl2VaCbxt85xdDbiz0RRfAG9xdPkTgZuf1ZqR4F2TVsFY4BaEljkFvJlBlQwDbklq+XPAm5/VqpHAXRVX0WDwFsW2PAm4y/m0ugreVkl+Wwe4jQNdWA68C+GsvQTctYnVjQdvXX6H2cA9RKF2B7wNogZugxALlgBvQWjHU4B7nIbuffBW5A3civAaTAVvYYjALQyu4TTwFoQJ3ILQBKaAd2WowF0ZmOBw8K4IF7grwlIYCt7MkIGbGZTiMPBmhA3cjJA6DAHvhdCBeyGgjpfBuxA+cBfCMXAJvDNNAO5MMIaeBu+ZZgD3TCgGnwLvSVOAexKI4YfgPWoOcI/CcHAXvN+aBFwHWk9KBO8uEOCeqHDyMDxe4DqReqbM0HiBe0aEo6fC4gWuI6UzpYbEC9wZDc6eDocXuM6ELpQbCi9wFyQ4vBQGL3Ad6rxQcgi8wL2gwOnl4fEC16nMjLKHxgvcDAGOhwyLF7iOVWaWPiRe4GZ23/mw4fAC17nIFeUPhRe4Kzo/wNBh8AJ3AI0rjzAEXuCu7Pogw93jBe4gEguO4RovcAs6PtAUt3iBO5DCwqO4xAvcwm4PNs0dXuAOJrDiOK7wArei0wNOdYMXuAPqqzySC7zArezyoNPN4wXuoPIaHMs0XuA26PDAS5jFC9yB1TU6mkm8wG3U3cGXMYcXuIOLa3g8U3iB27CzAZYygxe4AbQ1PqIJvMBt3NUgy3XHC9wg0gSO2RUvcAU6GmjJbniBG0iZ0FG74AWuUDeDLauOF7jBhAkeVxUvcAU7GXBpNbzADahL+MgqeIEr3MWgy4vjBW5QWQrHFsULXIUOBt5CDC9wA6tSOroIXuAqdS/4Ns3xAje4KMXjN8ULXMXOsdXUDC9w0aSdQBO8wNVuG/ulBKrxAhdIvRKowgvcXm1j35RAMV7gAqh3AkV4gdu7beyfEliNF7jAsZLAKrzAtdI26kgJZOMFLmCsJZCFF7jW2kY9KYGLeIELFKsJLOIFrtW2UVdKYBYvcAFiOoGrGbzANd02itslcLX7efbKC1xseEngCV7gemkbdaYEDniBCwhvCTziBa63tlFvSuAFcIHgNYHrv+7/mX589+v09uNmenlz4/Uc1B0sgZfXN9MX7SOOgyXaNHAAAAAASUVORK5CYII="); background-position: 100% 100%; background-repeat: no-repeat; background-size: 9rem; display: inline-block; height: 73rem; margin: 6rem 0 0 4rem; padding: 2rem 4rem; width: 72rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-summary h4 { font-family: GilroyBold; font-size: 3rem; line-height: 1.3; padding: 0 0 5rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-summary h5 { font-family: GilroyBold; font-size: 1.68rem; padding: 0 0 3rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-summary p { font-family: GilroyRegular; font-size: 2rem; margin: 0; padding: 0 0 6rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-summary ul { margin: 0; padding: 0 } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-summary li { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAZCAYAAABU+vysAAAMSGlDQ1BJQ0MgUHJvZmlsZQAASImVVwdYU8kWnltSSWiBCEgJvYkiSJcSQotUqYKNkAQSSgwJQcTusqjg2kUEbOiKiKKrKyBrRV3rIthdy8OCysq6WLCh8iYFdN3vvfe9831z758z5/ynZO69MwDo1PCk0lxUF4A8SYEsPjyYNSk1jUV6BBBABWSgDYx5fLmUHRcXBaAM3f8ub65DayhXXJRc/5z/r6InEMr5ACBxEGcI5Pw8iH8GAC/hS2UFABC9od56ZoFUiadAbCCDCUIsVeIsNS5R4gw1rlTZJMZzIN4NAJnG48myANBugXpWIT8L8mjfhNhVIhBLANAhQxzAF/EEEEdAPCovb4YSQzvgkPEVT9bfODOGOXm8rGGsrkUl5BCxXJrLm/V/tuN/S16uYiiGHRw0kSwiXlkz7NvNnBmRSkyDuFeSERMLsT7E78QClT3EKFWkiEhS26OmfDkH9gwwIXYV8EIiITaFOEySGxOl0WdkisO4EMMVghaJC7iJGt8lQnlogoazRjYjPnYIZ8o4bI1vI0+miqu0P6XISWJr+G+KhNwh/tfFosQUdc4YtVCcHAOxNsRMeU5CpNoGsykWcWKGbGSKeGX+NhD7CiXhwWp+bFqmLCxeYy/Lkw/Viy0RibkxGlxVIEqM0PDs5vNU+RtB3CKUsJOGeITySVFDtQiEIaHq2rEOoSRJUy/WJS0Ijtf4vpTmxmnscaowN1ypt4LYVF6YoPHFAwrgglTz4zHSgrhEdZ54RjZvQpw6H7wIRAEOCAEsoIAjA8wA2UDc3tvcC3+pZ8IAD8hAFhACF41myCNFNSOB1wRQDP6ESAjkw37BqlkhKIT6T8Na9dUFZKpmC1UeOeAxxHkgEuTC3wqVl2Q4WjJ4BDXif0Tnw1xz4VDO/VPHhpoojUYxxMvSGbIkhhJDiBHEMKIjboIH4H54FLwGweGGe+M+Q9l+sSc8JnQSHhCuEboIt6aLF8m+qYcFokEXjBCmqTnj65pxO8jqgQfj/pAfcuNM3AS44ONgJDYeCGN7QC1Hk7my+m+5/1bDV13X2FFcKShlBCWI4vCtp7aTtscwi7KnX3dInWvGcF85wzPfxud81WkBvEd+a4ktwQ5gZ7AT2DnsMNYMWNgxrAW7iB1R4uFV9Ei1ioaixavyyYE84n/E42liKjspd21w7XH9qJ4rEBYp34+AM0M6SybOEhWw2PDNL2RxJfzRo1hurm6uACi/I+rX1Cum6vuAMM9/0eUfB8CnDCqzvuh41gAcegwA480XnfVL+HisBOBIB18hK1TrcOWFAL9POvCJMgbmwBo4wHrcgCfwA0EgFEwAsSARpIJpsMsiuJ5lYCaYAxaCUlAOVoJ1oApsBtvATrAH7AfN4DA4AX4FF0AHuAZuw9XTDZ6BPvAGDCAIQkLoCAMxRiwQW8QZcUO8kQAkFIlC4pFUJB3JQiSIApmDfIeUI6uRKmQrUo/8hBxCTiDnkE7kFnIf6UFeIh9QDKWhBqgZaoeOQb1RNhqJJqJT0Sw0Hy1GS9DlaCVai+5Gm9AT6AX0GtqFPkP7MYBpYUzMEnPBvDEOFoulYZmYDJuHlWEVWC3WiLXC//kK1oX1Yu9xIs7AWbgLXMEReBLOx/PxefgyvArfiTfhp/Ar+H28D/9MoBNMCc4EXwKXMImQRZhJKCVUEHYQDhJOw6epm/CGSCQyifZEL/g0phKzibOJy4gbiXuJx4mdxIfEfhKJZExyJvmTYkk8UgGplLSBtJt0jHSZ1E16R9YiW5DdyGHkNLKEvIhcQd5FPkq+TH5CHqDoUmwpvpRYioAyi7KCsp3SSrlE6aYMUPWo9lR/aiI1m7qQWkltpJ6m3qG+0tLSstLy0ZqoJdZaoFWptU/rrNZ9rfc0fZoTjUObQlPQltPqaMdpt2iv6HS6HT2InkYvoC+n19NP0u/R32kztEdrc7UF2vO1q7WbtC9rP9eh6NjqsHWm6RTrVOgc0Lmk06tL0bXT5ejydOfpVuse0r2h26/H0BurF6uXp7dMb5feOb2n+iR9O/1QfYF+if42/ZP6DxkYw5rBYfAZ3zG2M04zug2IBvYGXINsg3KDPQbtBn2G+objDJMNiwyrDY8YdjExph2Ty8xlrmDuZ15nfhhhNoI9Qjhi6YjGEZdHvDUaaRRkJDQqM9prdM3ogzHLONQ4x3iVcbPxXRPcxMlkoslMk00mp016RxqM9BvJH1k2cv/I301RUyfTeNPZpttML5r2m5mbhZtJzTaYnTTrNWeaB5lnm681P2reY8GwCLAQW6y1OGbxB8uQxWblsipZp1h9lqaWEZYKy62W7ZYDVvZWSVaLrPZa3bWmWntbZ1qvtW6z7rOxsIm2mWPTYPO7LcXW21Zku972jO1bO3u7FLvFds12T+2N7Ln2xfYN9ncc6A6BDvkOtQ5XHYmO3o45jhsdO5xQJw8nkVO10yVn1NnTWey80blzFGGUzyjJqNpRN1xoLmyXQpcGl/ujmaOjRi8a3Tz6+RibMWljVo05M+azq4drrut219tj9cdOGLtobOvYl25Obny3arer7nT3MPf57i3uL8Y5jxOO2zTupgfDI9pjsUebxydPL0+ZZ6Nnj5eNV7pXjdcNbwPvOO9l3md9CD7BPvN9Dvu89/X0LfDd7/uXn4tfjt8uv6fj7ccLx28f/9Dfyp/nv9W/K4AVkB6wJaAr0DKQF1gb+CDIOkgQtCPoCduRnc3ezX4e7BosCz4Y/Jbjy5nLOR6ChYSHlIW0h+qHJoVWhd4LswrLCmsI6wv3CJ8dfjyCEBEZsSriBteMy+fWc/smeE2YO+FUJC0yIbIq8kGUU5QsqjUajZ4QvSb6ToxtjCSmORbEcmPXxN6Ns4/Lj/tlInFi3MTqiY/jx8bPiT+TwEiYnrAr4U1icOKKxNtJDkmKpLZkneQpyfXJb1NCUlandE0aM2nupAupJqni1JY0Ulpy2o60/smhk9dN7p7iMaV0yvWp9lOLpp6bZjItd9qR6TrTedMPpBPSU9J3pX/kxfJqef0Z3IyajD4+h7+e/0wQJFgr6BH6C1cLn2T6Z67OfJrln7Umq0cUKKoQ9Yo54irxi+yI7M3Zb3Nic+pyBnNTcvfmkfPS8w5J9CU5klMzzGcUzeiUOktLpV35vvnr8vtkkbIdckQ+Vd5SYAA37BcVDorvFfcLAwqrC9/NTJ55oEivSFJ0cZbTrKWznhSHFf84G5/Nn902x3LOwjn357Lnbp2HzMuY1zbfen7J/O4F4Qt2LqQuzFn42yLXRasXvf4u5bvWErOSBSUPvw//vqFUu1RWemOx3+LNS/Al4iXtS92Xblj6uUxQdr7ctbyi/OMy/rLzP4z9ofKHweWZy9tXeK7YtJK4UrLy+qrAVTtX660uXv1wTfSaprWstWVrX6+bvu5cxbiKzeup6xXruyqjKls22GxYueFjlajqWnVw9d4a05qlNW83CjZe3hS0qXGz2ebyzR+2iLfc3Bq+tanWrrZiG3Fb4bbH25O3n/nR+8f6HSY7ynd8qpPUde2M33mq3qu+fpfprhUNaIOioWf3lN0de0L2tDS6NG7dy9xbvg/sU+z746f0n67vj9zfdsD7QOPPtj/XHGQcLGtCmmY19TWLmrtaUls6D0041Nbq13rwl9G/1B22PFx9xPDIiqPUoyVHB48VH+s/Lj3eeyLrxMO26W23T046efXUxFPtpyNPn/017NeTZ9hnjp31P3v4nO+5Q+e9zzdf8LzQdNHj4sHfPH472O7Z3nTJ61JLh09Ha+f4zqOXAy+fuBJy5der3KsXrsVc67yedP3mjSk3um4Kbj69lXvrxe+Fvw/cXnCHcKfsru7dinum92r/5fivvV2eXUfuh9y/+CDhwe2H/IfPHskffewueUx/XPHE4kn9U7enh3vCejr+mPxH9zPps4He0j/1/qx57vD857+C/rrYN6mv+4XsxeDLZa+MX9W9Hve6rT+u/96bvDcDb8veGb/b+d77/ZkPKR+eDMz8SPpY+cnxU+vnyM93BvMGB6U8GU+1FcDgQDMzAXhZBwA9Fe4dOgCgTlaf81SCqM+mKgT+E1afBVXiCUBdEABJCwCIgnuUTXDYQkyDd+VWPTEIoO7uw0Mj8kx3NzUXDZ54CO8GB1+ZAUBqBeCTbHBwYOPg4KftMNlbABzPV58vlUKEZ4MtY5Soo/s5+Fb+DQ3+f0J0eAEMAAAACXBIWXMAABYlAAAWJQFJUiTwAAACAmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS40LjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iPgogICAgICAgICA8ZXhpZjpQaXhlbFlEaW1lbnNpb24+NDg8L2V4aWY6UGl4ZWxZRGltZW5zaW9uPgogICAgICAgICA8ZXhpZjpQaXhlbFhEaW1lbnNpb24+NTY8L2V4aWY6UGl4ZWxYRGltZW5zaW9uPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4K931AJwAAAwpJREFUSA29l1lT4lAQhU8gLAKiJTCyPLrjhvr//4EPboBF6ZM6gjBqEAhrmJxmwiAm4IJ2VUgqye370d2nGxRd1/v4AdP1DkqlGm5vNVSrTYRCXqRSC0gkwggEPFB+AoQQ+fwDTk5+Q9Oaw68dDvtxdJTC7m4cruHdb7poNOwhuB0jc3PzLHDqN+2PvpnwRqM9jMTLS8t2q3q9Az77FhBC1Ott5HIlnJ3dy0Z2FIoC+P2qHDMHGUC0kM2WcHp6L0B2ELw3N+dBMhnG0lJgthHpmxS1WhsXF0WcnxOi48QgEBsbMayvx+DxuGcHQgjmegBRNOvDGYJy3dyMIZNJYWHBL7AzSQ0hqtWWGQVGoohm0xkiGPRia+sX9vcToHwt+zIIITSNEPcSjWaza/l+dWZhBgJepNOESGJ+3vfquYAYRh/tdldy2usZUsUsJOZuknEdGxSVweJstZwhGIl0Oi6RYFcdN5XOnp50XF//kYPaZ9tdXY1IC6YDO+O652ddlEGZtts9u9fASIRCPmxvL2NvLwEnf0qp9NQ/Pr6V3NK5ZVy8sxOX9jv+DSwItuxc7gGdjhOEYqbA+89PQmaK5X/8rFYqddzdVTEKwZdqtYECeM1ZYMHwvcfHhsyNy8vyFAifrOV6pnqSqZ2O4ehsHIbOBhB3IES3a9j6Vsx8hMM+SQWjyu45zVSmgFrmADIF8MYsGMMwpHYKhQoKhTJY1HZGCPqjPFkXPt90CPpRNK3Wz2aLYJ2wKzqZ2+2C261IFMbTaK1xuSyIpEB4vZNVZ63jWeXLa2tRkR6bkRMMI9Czr0nxR4jFxTmzWyZMmS5Plf4ohIDww1IIryfB8LmdEYKDK5NJSuue1n/sfAwT+FkYQkQi/yFU9f3pGAUagvDmR2FYM5FIUCLBSaqqn//B9wrkIzCEiEaDODhImaM8ahby5yG47xuQ98Bw01gsiMPDlDkKCGH28S+aLcgoDGsgny9Lp6Vy2BdisZC0bc4jPp+FTf07wWFWLL7g6qoi0o7H57GyEhGVcKDNyv4C94OdGGt5H3IAAAAASUVORK5CYII="); background-position: left .6rem; background-repeat: no-repeat; background-size: auto 1.3rem; font-family: GilroyRegular; font-size: 2rem; padding: 0 0 3rem 3.8rem; position: relative } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-product-summaries-item { -moz-column-break-inside: avoid; break-inside: avoid-column; display: inline-block; padding: 4rem 0 0; vertical-align: top; width: 72rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-product-summaries-item a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: 2px 2px; font-family: GilroyBold; font-size: 2rem; padding-bottom: .1rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-product-summaries-item h6 { padding: 0 0 2.5rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-product-summaries-item p { font-family: GilroyRegular; font-size: 2rem; margin: 0 } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-product-summaries-item:nth-child(2n) { margin-left: 4rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-legal { bottom: 4rem; left: 6rem; position: absolute } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-legal a { background: linear-gradient(#81b5a1,#81b5a1) bottom repeat-x; background-size: 1px 1px; font-family: GilroyBold; font-size: 1.4rem; padding-bottom: .1rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-legal span { color: #b4b2d9; padding: 0 1rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-legal p { display: inline; font-size: 1rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-footer { bottom: 5rem; position: absolute; right: 10rem } .component-solution-planner-report .solution-planner-report-page .solution-planner-report-body .solution-planner-footer p { font-size: 1.8rem } body.preventScroll { overflow: hidden } .component-champions-overlay.component-cea-overlay { bottom: 0; left: 0; overflow: auto; position: fixed; right: 0; top: 0; z-index: 1001 } .component-champions-overlay.component-cea-overlay.disable { display: none } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper, .component-champions-overlay.component-cea-overlay .overlay-outer-wrapper { padding: 0; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-outer-wrapper { background-color: #68a1af; display: flex; justify-content: center; opacity: .3 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper { background: #fff; height: 100%; overflow-y: auto } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon { cursor: pointer; height: 1.8rem; position: absolute; right: 2rem; top: 2rem; width: 1.8rem; z-index: 1 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon:hover { opacity: 1 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon:after, .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon:before { background-color: #293e40; content: " "; height: 1.8rem; left: 1rem; position: absolute; width: .2rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon:before { transform: rotate(45deg) } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon:after { transform: rotate(-45deg) } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper { display: flex; flex-flow: column } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content { display: flex; flex-flow: column; padding: 2rem 2rem 0; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-title-wrapper { background: none } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-title-wrapper .overlay-title { -webkit-margin-after: 0; -webkit-margin-before: 0; color: #293e40; font-family: GilroyRegular; font-size: 2rem; margin-block-end: 0; margin-block-start: 0; margin-bottom: 1.5rem; margin-left: 0; padding-bottom: 0; padding-left: 0; padding-top: 0; width: 100% } .accordion.section ul.list-unstyled .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-body-copy li, .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-body-copy .accordion.section ul.list-unstyled li, .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-body-copy .medium-body-copy { margin: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta { padding-bottom: 3rem; text-align: center } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta.disabled { display: none } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-component a { font-family: GilroyBold } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-component .csc-cta a { padding: initial } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-rectangle-box { margin-top: 3rem; padding-left: 0; padding-right: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-rectangle-box a:hover { color: #fff !important } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .close-overlay-btn { align-items: center; background: #293e40; color: #fff; cursor: pointer; display: flex; font-family: GilroyBold; font-size: 1.4rem; height: auto; justify-content: center; line-height: 1.5; margin-left: auto; margin-right: auto; padding: 1.5rem; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow { margin-left: 1.5rem; width: auto } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow .cancel-btn { align-items: center; display: flex; flex-flow: row nowrap; position: relative } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow .cancel-btn:hover .cta-title-link-arrow svg { transform: translate(-1.2rem) } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow .cancel-btn .cta-title-link-arrow { margin-left: 1rem; width: 40px } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow .cancel-btn .cta-title-link-arrow svg { height: 1rem; -moz-transform: translate(-1.5rem); -ms-transform: translate(-1.5rem); -webkit-transform: translate(-1.5rem); transform: translate(-1.5rem); -moz-transition: all .25s linear; -ms-transition: all .25s linear; -webkit-transition: all .25s linear; transition: all .25s linear } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow .cancel-btn:before { content: ""; display: block; height: 100%; position: absolute; width: 100%; z-index: 1 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper { height: 22rem; max-height: 22rem; min-height: 22rem; overflow-y: hidden; padding: 0; position: relative } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper .component-asset-block { position: absolute; top: -15vw; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper img { height: auto; width: 100% } .component-champions-overlay.component-cea-overlay .hide { display: none !important } @media only screen and (min-width: 421px) { .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper .component-asset-block { top: -27vw } } @media only screen and (min-width: 768px) { .component-champions-overlay.component-cea-overlay { display: flex; justify-content: center } .component-champions-overlay.component-cea-overlay .overlay-outer-background { background: #293e40; height: 100%; opacity: .7; position: fixed; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper { bottom: 0; margin: 0; position: absolute; top: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon { right: 2.4rem; top: 2.4rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper { height: auto; overflow-y: initial } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .items-group { margin: 0 4rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content { padding-left: 3rem; padding-right: 3rem; padding-top: 3rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-title-wrapper .overlay-title { font-size: 2.2rem; margin-bottom: 3rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta { text-align: left } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .close-overlay-btn { font-size: 1.4rem !important; line-height: 1.5; margin-left: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-component { display: block; margin: 0; padding: 0; vertical-align: initial; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-rectangle-box { margin-right: 3rem; margin-top: 3rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow { margin-left: 0; margin-top: 2rem; padding: 0; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-text-arrow .cancel-btn { font-size: 1.4rem !important; line-height: 1.5 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper .component-asset-block { top: -28vw } } @media only screen and (min-width: 1024px) { .component-champions-overlay.component-cea-overlay .overlay-content-wrapper { bottom: 0; flex: 0 0 92.383%; height: inherit; margin: 21.5rem 0; max-height: 51.2rem; max-width: 94.6rem; min-height: 51.2rem; overflow: visible; position: absolute; top: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-close-icon { right: 3rem; top: 3rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper { flex-flow: row-reverse nowrap; height: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper { height: auto; max-height: none; max-width: 45.5rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper .component-asset-block { top: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content { flex-grow: 1; height: 100%; margin: 0; max-width: none; position: relative } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-title-wrapper .overlay-title { font-size: 2.8rem; margin-bottom: 2rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-title-wrapper .overlay-title br { display: initial } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta { align-items: center; bottom: 3rem; display: flex; flex-flow: row nowrap; padding: 0; position: absolute; width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .close-overlay-btn { font-size: 1.4rem; margin-right: 3rem; margin-top: 0 } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-title-link-arrow svg { height: 1rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-component { margin-bottom: 0; margin-top: 0 } } @media only screen and (min-width: 1700px) { .component-champions-overlay.component-cea-overlay .overlay-content-wrapper { flex: 0 0 62.6478%; margin-top: 17.3rem; max-height: 57.5rem; max-width: 106.5rem; min-height: 57.5rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .items-list { width: 100% } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-image-wrapper { height: auto; max-height: none; max-width: 51rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content { align-items: flex-start; padding-bottom: 3rem; padding-left: 3rem; padding-top: 4rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-title-wrapper .overlay-title { font-size: 3.6rem; margin-bottom: 3rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta { align-items: center; bottom: 4rem } .component-champions-overlay.component-cea-overlay .overlay-content-wrapper .overlay-content-inner-wrapper .overlay-text-content .overlay-cta .cta-rectangle-box { margin-right: 3.2rem } } .event-variation .k21-profile-skipped, .secondary-event-variation .k21-profile-skipped { display: none } .event-variation .left-side .smallMarquee ul, .secondary-event-variation .left-side .smallMarquee ul { margin-top: 2rem } .event-variation .left-side .smallMarquee ul li, .secondary-event-variation .left-side .smallMarquee ul li { margin-bottom: 0 } .event-variation .sponsor-email-opt-in, .secondary-event-variation .sponsor-email-opt-in { margin-top: 16px } .event-variation .UF-form-container p, .secondary-event-variation .UF-form-container p { margin-bottom: 0 } .event-variation .UF-secondary-cta, .secondary-event-variation .UF-secondary-cta { margin: 0 } .event-variation #password-0, .event-variation .UF-recaptcha-container, .event-variation .UF-rf-error, .event-variation .separator, .event-variation .server-error, .event-variation .terms-and-conditions-login, .event-variation:not(.login-view) .login .login-description, .secondary-event-variation #password-0, .secondary-event-variation .UF-recaptcha-container, .secondary-event-variation .UF-rf-error, .secondary-event-variation .separator, .secondary-event-variation .server-error, .secondary-event-variation .terms-and-conditions-login, .secondary-event-variation:not(.login-view) .login .login-description { display: none } .event-variation:not(.login-view) .login .login-description.show, .secondary-event-variation:not(.login-view) .login .login-description.show { display: block } .event-variation:not(.login-view) .login #email, .secondary-event-variation:not(.login-view) .login #email { margin-bottom: 0 } .event-variation .hide, .secondary-event-variation .hide { display: none } .event-variation .server-error, .secondary-event-variation .server-error { color: #b33233; font-size: 22px } .event-variation .UF-container-50.left-side, .secondary-event-variation .UF-container-50.left-side { order: 2 } .event-variation .UF-container-50 .UF-header.login, .event-variation .UF-container-50 .title, .event-variation .UF-container-50 .title h1, .secondary-event-variation .UF-container-50 .UF-header.login, .secondary-event-variation .UF-container-50 .title, .secondary-event-variation .UF-container-50 .title h1 { padding-top: 0 !important } .event-variation .server-error.show, .secondary-event-variation .server-error.show { display: block } .event-variation .login #password, .secondary-event-variation .login #password { display: none } .event-variation .rf-error, .event-variation .rf-error a, .secondary-event-variation .rf-error, .secondary-event-variation .rf-error a { color: #b33233; font-family: GilroyRegular; font-size: 1.8rem } .event-variation .UF-login-btn, .event-variation .UF-secondary-cta, .secondary-event-variation .UF-login-btn, .secondary-event-variation .UF-secondary-cta { display: none } .event-variation .create-account .UF-auto-login-message.UF-show-messg, .secondary-event-variation .create-account .UF-auto-login-message.UF-show-messg { padding-bottom: 0 } .event-variation .create-account .UF-secondary-cta, .event-variation .create-account .UF-submit-btn, .secondary-event-variation .create-account .UF-secondary-cta, .secondary-event-variation .create-account .UF-submit-btn { display: none } .event-variation li#email, .secondary-event-variation li#email { position: relative } .event-variation li#email:after, .secondary-event-variation li#email:after { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/global/loading-icon.svg); background-size: contain; content: ""; height: 25px; opacity: 0; position: absolute; right: 20px; top: 16px; width: 25px } .event-variation .verifying-user-email li#email:after, .secondary-event-variation .verifying-user-email li#email:after { opacity: 1 } .event-variation .UF-submit-btn a, .secondary-event-variation .UF-submit-btn a { background-color: #293e40 !important; color: #fff !important } .event-variation .UF-login-btn a, .event-variation .UF-rf-error-btn a, .event-variation .UF-submit-btn a, .event-variation .UF-user-check-btn a, .event-variation .UF-user-register-btn a, .event-variation .cta--primary a, .secondary-event-variation .UF-login-btn a, .secondary-event-variation .UF-rf-error-btn a, .secondary-event-variation .UF-submit-btn a, .secondary-event-variation .UF-user-check-btn a, .secondary-event-variation .UF-user-register-btn a, .secondary-event-variation .cta--primary a { background-color: #293e40; color: #fff; display: inline-block; font-family: GilroySemiBold; padding: 14px 40px; transition: all .2s linear } .event-variation .UF-login-btn a:hover, .event-variation .UF-rf-error-btn a:hover, .event-variation .UF-submit-btn a:hover, .event-variation .UF-user-check-btn a:hover, .event-variation .UF-user-register-btn a:hover, .event-variation .cta--primary a:hover, .secondary-event-variation .UF-login-btn a:hover, .secondary-event-variation .UF-rf-error-btn a:hover, .secondary-event-variation .UF-submit-btn a:hover, .secondary-event-variation .UF-user-check-btn a:hover, .secondary-event-variation .UF-user-register-btn a:hover, .secondary-event-variation .cta--primary a:hover { background-color: #3e5153 !important } .event-variation .UF-login-btn a.disabled, .event-variation .UF-rf-error-btn a.disabled, .event-variation .UF-submit-btn a.disabled, .event-variation .UF-user-check-btn a.disabled, .event-variation .UF-user-register-btn a.disabled, .event-variation .cta--primary a.disabled, .secondary-event-variation .UF-login-btn a.disabled, .secondary-event-variation .UF-rf-error-btn a.disabled, .secondary-event-variation .UF-submit-btn a.disabled, .secondary-event-variation .UF-user-check-btn a.disabled, .secondary-event-variation .UF-user-register-btn a.disabled, .secondary-event-variation .cta--primary a.disabled { background-color: #e1e1e1; color: #c8c8c8; pointer-events: none } .event-variation .UF-login-btn, .event-variation .UF-user-check-btn, .event-variation .UF-user-register-btn, .secondary-event-variation .UF-login-btn, .secondary-event-variation .UF-user-check-btn, .secondary-event-variation .UF-user-register-btn { margin: 24px 0 } .event-variation .inner-view.showing-loading-spinner, .secondary-event-variation .inner-view.showing-loading-spinner { position: relative } .event-variation .inner-view.showing-loading-spinner form.login .show-loading-layer, .secondary-event-variation .inner-view.showing-loading-spinner form.login .show-loading-layer { background: #fff; box-shadow: 0 0 0 10px #fff } .event-variation .inner-view[data-events-home-page-path*="apj/ja"] #language, .event-variation .inner-view[data-events-home-page-path*=ams] #language, .event-variation .inner-view[data-events-home-page-path*=emea] #language, .secondary-event-variation .inner-view[data-events-home-page-path*="apj/ja"] #language, .secondary-event-variation .inner-view[data-events-home-page-path*=ams] #language, .secondary-event-variation .inner-view[data-events-home-page-path*=emea] #language { display: none } .event-variation.login-view .terms-and-conditions-login, .secondary-event-variation.login-view .terms-and-conditions-login { display: block } .event-variation.login-view .terms-and-conditions-login.ignore, .secondary-event-variation.login-view .terms-and-conditions-login.ignore { display: none } .event-variation.login-view .login #password, .secondary-event-variation.login-view .login #password { display: block } .event-variation.login-view .login .UF-secondary-cta, .secondary-event-variation.login-view .login .UF-secondary-cta { display: inline-block } .event-variation.login-view .login .UF-login-btn, .secondary-event-variation.login-view .login .UF-login-btn { display: block } .event-variation.login-view .login .UF-user-check-btn, .event-variation.rf-error-view .UF-form-container, .event-variation.rf-error-view .UF-header.login, .secondary-event-variation.login-view .login .UF-user-check-btn, .secondary-event-variation.rf-error-view .UF-form-container, .secondary-event-variation.rf-error-view .UF-header.login { display: none } .event-variation.rf-error-view .UF-rf-error, .secondary-event-variation.rf-error-view .UF-rf-error { display: block } .event-variation.section-component-universal-form .change-password-thankyou .pwd-reset-thank-you-ctas, .secondary-event-variation.section-component-universal-form .change-password-thankyou .pwd-reset-thank-you-ctas { padding-top: 24px } .event-variation.section-component-universal-form .change-password-thankyou .pwd-reset-thank-you-ctas .cta--primary, .secondary-event-variation.section-component-universal-form .change-password-thankyou .pwd-reset-thank-you-ctas .cta--primary { display: inline-block; margin-right: 32px } .event-variation.section-component-universal-form .change-password-thankyou .cta-component.cta-text-arrow a .cta-title-link-arrow svg #polyline-3, .secondary-event-variation.section-component-universal-form .change-password-thankyou .cta-component.cta-text-arrow a .cta-title-link-arrow svg #polyline-3 { transform: translate(1rem) } @media screen and (min-width: 1024px) { .event-variation .UF-container-50.left-side, .secondary-event-variation .UF-container-50.left-side { order: 1 } .event-variation .UF-container-50.right-side, .secondary-event-variation .UF-container-50.right-side { order: 2 } } .event-variation .verifying-user-email li#email:after, .secondary-event-variation .verifying-user-email li#email:after { animation: spin 1s linear infinite } @media screen and (max-width: 1024px) { .event-variation #language .UF-floating-label, .secondary-event-variation #language .UF-floating-label { top: .01rem } } .event-invitation-popup { align-items: center; bottom: 0; display: flex; justify-content: center; left: 0; position: fixed; right: 0; top: 0; z-index: 1000 } .event-invitation-popup .event-invitation-popup-backdrop { background-color: #293e40; height: 100%; left: 0; opacity: .7; position: absolute; top: 0; width: 100%; z-index: 99 } .event-invitation-popup .event-invitation-popup-window { background-color: #fff; margin: 0 20px; max-width: 768px; width: 100%; z-index: 100 } .event-invitation-popup .event-invitation-popup-window-greetings { background-color: #293e40; color: #fff; font-family: GilroySemiBold; padding: 15px 30px } .event-invitation-popup .event-invitation-popup-window-content { background-color: #fff; padding: 20px 30px } .event-invitation-popup .event-invitation-popup-window-cta-section { margin-top: 20px } .event-invitation-popup .event-invitation-popup-window-cta-section .cta-rectangle-box a { border: none } .event-invitation-popup .event-invitation-popup-window-cta-section .cta-rectangle-box a:hover { color: #fff !important } .event-invitation-popup .event-invitation-popup-window-cta-section .cta-text-arrow { margin: 15px 0 } @media screen and (min-width: 768px) { .event-invitation-popup .event-invitation-popup-window-greetings { padding: 25px 40px } .event-invitation-popup .event-invitation-popup-window-content { padding: 25px 40px 30px } } .title-text { position: relative } .title-text .title-text-wrapper { padding-left: 2rem; padding-right: 2rem } .title-text li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #293e40; list-style: unset } @media only screen and (min-width: 768px) { .title-text .title-text-wrapper { padding-left: 3rem; padding-right: 3rem } } @media only screen and (min-width: 1024px) { .title-text .title-text-wrapper { padding-left: 4rem; padding-right: 4rem } } .component-csc-meganav-container { position: relative; z-index: 99 } .component-csc-meganav-container .back-close { background-color: #fff; border-bottom: 1px solid #999; display: none; padding: 2rem; position: fixed; width: 100%; z-index: 999 } .component-csc-meganav-container .back-close .back-btn { flex: 1; position: relative } .component-csc-meganav-container .back-close .back-btn #back { display: none; font-family: GilroySemiBold; font-size: 1.4rem; padding-left: 2rem } .component-csc-meganav-container .back-close .back-btn #back:after, .component-csc-meganav-container .back-close .back-btn #back:before { background-color: #293e40; content: ""; display: inline-block; height: 2px; left: 0; position: absolute; width: 1rem } .component-csc-meganav-container .back-close .back-btn #back:before { top: calc(50% - .4rem); transform: rotate(-45deg) } .component-csc-meganav-container .back-close .back-btn #back:after { bottom: calc(50% - .4rem); transform: rotate(45deg) } .component-csc-meganav-container .back-close .close-btn { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQwIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMTcuNTM2IDE3LjU1NiAyIDJNMiAxNy41NTYgMTcuNTM2IDIiLz48L2c+PC9zdmc+); background-size: 2rem; cursor: pointer; height: 2rem; position: relative; width: 2rem; z-index: 10 } .component-csc-meganav-container.meganav-open .back-close { display: flex } .component-csc-meganav-container.hide-login .csc-meganav-login, .component-csc-meganav-container.hide-search #csc_search_container { display: none !important } .component-csc-meganav-container.hide-logo .csc-meganav-upper-deck { justify-content: flex-end !important } .component-csc-meganav-container.hide-logo .csc-meganav-login, .component-csc-meganav-container.hide-main-nav .csc-meganav-toggle, .component-csc-meganav-container.hide-main-nav .upper-level-nav { display: none !important } .component-csc-meganav-container .csc-meganav-outer-wrapper { background-color: #293e40; width: 100% } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper { padding: 0 2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { align-items: center; display: flex; flex-direction: row; height: 5.4rem; justify-content: space-between } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo { align-items: center; display: flex; height: 1.2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo a { align-items: center; display: flex; height: 100% } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo img { height: 100%; max-height: .8rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1 { color: #fff; display: inline; font-family: GilroyBold; font-size: 1rem; line-height: 1; margin: 0; padding: 0 0 0 1.1rem; position: relative; top: .1rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1:before { background-color: #fff; content: ""; height: .9rem; left: .5rem; position: absolute; width: .1rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons { display: flex; flex-direction: row; justify-content: flex-end; width: 8rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login, .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search-icon, .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-toggle { border: none; cursor: pointer; display: inline-block; outline: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-menu-buttons { display: inline } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-menu-buttons .csc-meganav-toggle { display: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search input { border: none; color: #293e40; display: none; flex-grow: 1; font-family: GilroyBold; font-size: 1.6rem; line-height: 1.5; max-width: 100%; opacity: 0; outline: none; transition: opacity .5s ease } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search input::-ms-clear { display: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjIiIHN0eWxlPSJmaWxsOiNmZmYiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGVsbGlwc2UgdHJhbnNmb3JtPSJyb3RhdGUoLTQ1IDExLjk4MiAxMi4wODUpIiBjeD0iMTEuOTgyIiBjeT0iMTIuMDg1IiByeD0iNy44MTMiIHJ5PSI3LjkwOSIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I2ZmZjtzdHJva2Utb3BhY2l0eToxIi8+PHBhdGggZD0iTTIxLjA4OSAxNy4zNzR2Ny42MzMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHRyYW5zZm9ybT0icm90YXRlKC00NSAyMS4wODkgMjEuMTQpIiBzdHlsZT0iZmlsbDojZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTojZmZmO3N0cm9rZS1vcGFjaXR5OjEiLz48L2c+PC9zdmc+"); background-position: 50%; background-repeat: no-repeat; background-size: 1.5rem; height: 5.4rem; vertical-align: middle; width: 1.5rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMjYgMjYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI2IDI2IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiIGlkPSJzdHlsZTYzIj4uc3Qwe2ZpbGw6IzI5M2U0MH08L3N0eWxlPjxnIGlkPSJnNjkiPjxnIGlkPSJnNjciPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xMyAyNS41QzYuMTEgMjUuNS41IDE5Ljg5LjUgMTNTNi4xMS41IDEzIC41IDI1LjUgNi4xMSAyNS41IDEzIDE5Ljg5IDI1LjUgMTMgMjUuNXptMC0yMy4zM0M3LjAzIDIuMTcgMi4xNyA3LjAzIDIuMTcgMTNTNy4wMyAyMy44MyAxMyAyMy44MyAyMy44MyAxOC45NyAyMy44MyAxMyAxOC45NyAyLjE3IDEzIDIuMTd6IiBpZD0icGF0aDY1IiBzdHlsZT0iZmlsbDojZmZmIi8+PC9nPjwvZz48ZyBpZD0iZzgzIj48ZGVmcyBpZD0iZGVmczcyIj48Y2lyY2xlIGlkPSJTVkdJRF8xXyIgY3g9IjEzIiBjeT0iMTMiIHI9IjEwLjg4Ii8+PC9kZWZzPjxjbGlwUGF0aCBpZD0iU1ZHSURfMl8iPjx1c2UgeGxpbms6aHJlZj0iI1NWR0lEXzFfIiBzdHlsZT0ib3ZlcmZsb3c6dmlzaWJsZSIgaWQ9InVzZTc0Ii8+PC9jbGlwUGF0aD48ZyBjbGlwLXBhdGg9InVybCgjU1ZHSURfMl8pIiBpZD0iZzgxIiBzdHlsZT0iY2xpcC1wYXRoOnVybCgjU1ZHSURfMl8pIj48ZyBpZD0iZzc5Ij48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTYuNCAxNC45Yy44Ny0uODcgMS40LTIuMDcgMS40LTMuMzkgMC0yLjY1LTIuMTYtNC44MS00LjgxLTQuODFzLTQuODEgMi4xNi00LjgxIDQuODFjMCAxLjMyLjU0IDIuNTIgMS40IDMuMzktMy4wOC45Ni01LjI1IDMuMTktNS4yNSA1Ljc4djYuMjFhLjk2Ljk2IDAgMCAwIDEuOTIgMHYtNi4yMWMwLTIuMzYgMy4wOC00LjM2IDYuNzMtNC4zNnM2LjczIDIgNi43MyA0LjM2djYuMjFhLjk2Ljk2IDAgMCAwIDEuOTIgMHYtNi4yMWMuMDItMi41OS0yLjE1LTQuODItNS4yMy01Ljc4em0tNi4yOC0zLjM5YTIuODggMi44OCAwIDEgMSA1Ljc2MS4wMDEgMi44OCAyLjg4IDAgMCAxLTUuNzYxLS4wMDF6IiBpZD0icGF0aDc3IiBzdHlsZT0iZmlsbDojZmZmIi8+PC9nPjwvZz48L2c+PC9zdmc+"); background-position: 50%; background-repeat: no-repeat; background-size: 1.6rem; height: 5.4rem; margin: 0 0 0 1rem; position: relative; width: 1.6rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login a { height: 100%; position: absolute; width: 100% } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login span { display: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-toggle { background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIxMiI+PGcgc3R5bGU9ImZpbGw6I2ZmZiI+PHBhdGggZD0iTTEgMTAuNWgyMm0tMjItOWgyMiIgc3R5bGU9ImZpbGw6I2QwYjIwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2Utd2lkdGg6MS43OTk5OTk5NTtzdHJva2UtbWl0ZXJsaW1pdDo0O3N0cm9rZS1kYXNoYXJyYXk6bm9uZTtzdHJva2UtZGFzaG9mZnNldDowO3N0cm9rZTojZmZmO3N0cm9rZS1vcGFjaXR5OjEiIHN0cm9rZT0iIzI5M0U0MSIgc3Ryb2tlLXdpZHRoPSIxLjgiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVjYXA9InNxdWFyZSIvPjwvZz48L3N2Zz4="); background-position: 50%; background-repeat: no-repeat; background-size: 1.7rem .8rem; height: 5.4rem; margin: 0 0 0 1.3rem; width: 1.7rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-lower-deck, .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu { display: none } .component-csc-meganav-container.signed-in:not(.login-open) .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMjYgMjYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI2IDI2IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiIGlkPSJzdHlsZTYzIj4uc3Qwe2ZpbGw6IzI5M2U0MH08L3N0eWxlPjxlbGxpcHNlIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjEuODtzdHJva2Utb3BhY2l0eToxIiBpZD0icGF0aDIxNTMiIGN4PSIxMi45NDciIGN5PSIxMi44NzYiIHJ4PSIxMi4yMDQiIHJ5PSIxMi4zNDYiLz48ZyBpZD0iZzY5IiBzdHlsZT0iZmlsbDojMjkzZDQwO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lO3N0cm9rZS1vcGFjaXR5OjEiPjxnIGlkPSJnNjciIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLW9wYWNpdHk6MSI+PHBhdGggY2xhc3M9InN0MCIgZD0iTTEzIDI1LjVDNi4xMSAyNS41LjUgMTkuODkuNSAxM1M2LjExLjUgMTMgLjUgMjUuNSA2LjExIDI1LjUgMTMgMTkuODkgMjUuNSAxMyAyNS41em0wLTIzLjMzQzcuMDMgMi4xNyAyLjE3IDcuMDMgMi4xNyAxM1M3LjAzIDIzLjgzIDEzIDIzLjgzIDIzLjgzIDE4Ljk3IDIzLjgzIDEzIDE4Ljk3IDIuMTcgMTMgMi4xN3oiIGlkPSJwYXRoNjUiIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLW9wYWNpdHk6MSIvPjwvZz48L2c+PGcgaWQ9Imc4MyIgc3R5bGU9ImZpbGw6IzI5M2Q0MDtmaWxsLW9wYWNpdHk6MSI+PGRlZnMgaWQ9ImRlZnM3MiI+PGNpcmNsZSBpZD0iU1ZHSURfMV8iIGN4PSIxMyIgY3k9IjEzIiByPSIxMC44OCIvPjwvZGVmcz48Y2xpcFBhdGggaWQ9IlNWR0lEXzJfIj48dXNlIHhsaW5rOmhyZWY9IiNTVkdJRF8xXyIgc3R5bGU9Im92ZXJmbG93OnZpc2libGUiIGlkPSJ1c2U3NCIvPjwvY2xpcFBhdGg+PGcgY2xpcC1wYXRoPSJ1cmwoI1NWR0lEXzJfKSIgaWQ9Imc4MSIgc3R5bGU9ImZpbGw6IzI5M2Q0MDtmaWxsLW9wYWNpdHk6MTtjbGlwLXBhdGg6dXJsKCNTVkdJRF8yXykiPjxnIGlkPSJnNzkiIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjEiPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNi40IDE0LjljLjg3LS44NyAxLjQtMi4wNyAxLjQtMy4zOSAwLTIuNjUtMi4xNi00LjgxLTQuODEtNC44MXMtNC44MSAyLjE2LTQuODEgNC44MWMwIDEuMzIuNTQgMi41MiAxLjQgMy4zOS0zLjA4Ljk2LTUuMjUgMy4xOS01LjI1IDUuNzh2Ni4yMWEuOTYuOTYgMCAwIDAgMS45MiAwdi02LjIxYzAtMi4zNiAzLjA4LTQuMzYgNi43My00LjM2czYuNzMgMiA2LjczIDQuMzZ2Ni4yMWEuOTYuOTYgMCAwIDAgMS45MiAwdi02LjIxYy4wMi0yLjU5LTIuMTUtNC44Mi01LjIzLTUuNzh6bS02LjI4LTMuMzlhMi44OCAyLjg4IDAgMSAxIDUuNzYxLjAwMSAyLjg4IDIuODggMCAwIDEtNS43NjEtLjAwMXoiIGlkPSJwYXRoNzciIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjEiLz48L2c+PC9nPjwvZz48L3N2Zz4=") } .component-csc-meganav-container.signed-in:not(.login-open) .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login a { display: none } .component-csc-meganav-container.open .csc-meganav-outer-wrapper { background: #fff; position: fixed; z-index: 999 } .component-csc-meganav-container.open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { justify-content: flex-end } .component-csc-meganav-container.open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo { display: none } .component-csc-meganav-container.open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-toggle { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQwIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMTcuNTM2IDE3LjU1NiAyIDJNMiAxNy41NTYgMTcuNTM2IDIiLz48L2c+PC9zdmc+); background-size: 2rem; width: 2rem } .component-csc-meganav-container.open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-login, .component-csc-meganav-container.open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search { display: none } .component-csc-meganav-container.search-open { background: #fff; position: fixed; z-index: 999 } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu, .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login, .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-toggle { display: none !important } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search { align-items: center; background: #fff; display: flex; height: 5.7rem; left: 0; margin: 0; padding: 2rem; position: fixed; right: 0; top: 0 } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search:after { background-color: #f7f7f7; border-top: 1px solid #d8d8d8; bottom: 0; content: ""; display: block; height: 100%; left: 0; margin: 0; overflow: hidden; position: fixed; right: 0; top: 5.7rem; width: 100% } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search input { display: block; opacity: 1 } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search .csc-meganav-search-icon { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQwIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMTcuNTM2IDE3LjU1NiAyIDJNMiAxNy41NTYgMTcuNTM2IDIiLz48L2c+PC9zdmc+); background-size: 2rem; width: 2rem } .component-csc-meganav-container.login-open { background: #fff; height: 5.8rem; position: fixed; width: 100%; z-index: 999 } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper { background: none } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper:after { background-color: #f7f7f7; border-top: 1px solid #d8d8d8; bottom: 0; content: ""; display: block; height: 100%; left: 0; margin: 0; overflow: hidden; position: fixed; right: 0; top: 5.7rem; width: 100% } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { justify-content: flex-end } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-toggle { display: none } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-login { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkiIGhlaWdodD0iMTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQwIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMTcuNTM2IDE3LjU1NiAyIDJNMiAxNy41NTYgMTcuNTM2IDIiLz48L2c+PC9zdmc+); background-size: 2rem 2rem; width: 2rem } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-login a { display: none } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu { display: block; left: 0; position: fixed; top: 6rem; width: 100%; z-index: 99 } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul { margin: 0; padding: 2rem } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li { margin: 0; padding: 1.4rem 0 } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li a { font-family: GilroySemiBold } .component-csc-meganav-container.login-open, .component-csc-meganav-container.meganav-open, .component-csc-meganav-container.open, .component-csc-meganav-container.search-open { z-index: 999 } @media screen and (min-width: 768px) { .component-csc-meganav-container .back-close { padding: 2rem 3rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper { padding: 0 3rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { height: 6.6rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo { align-items: center; display: flex; height: 1.1rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo img { max-height: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1 { font-size: 1.2rem; margin-right: .6rem; padding: 0 0 0 1.3rem; top: .2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1:before { height: 1rem; left: .6rem; top: .1rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-search { height: 7.1rem; padding: 0 3rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-search input { font-size: 2.2rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-search:after { top: 7.1rem } .component-csc-meganav-container.login-open .csc-meganav-menu-login-menu { display: block; left: 0; position: fixed; top: 6rem; width: 100%; z-index: 99 } .component-csc-meganav-container.login-open ul { margin: 0; padding: 0 3rem } .component-csc-meganav-container.login-open ul li { font-family: GilroySemiBold; margin: 0; padding: 1.4rem 0 } .component-csc-meganav-container.login-open ul li a { font-family: GilroySemiBold } } @media screen and (min-width: 1024px) { .component-csc-meganav-container { position: static } .component-csc-meganav-container .back-close { display: none !important } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper { margin: auto; max-width: 170rem; padding: 0 4rem; position: relative } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { height: 7.3rem; padding: 2.6rem 0 .9rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo { height: 1.8rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo img { max-width: 11.7rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1 { font-size: 1.8rem; padding: 0 0 0 1.9rem; top: .3rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1:before { height: 1.3rem; left: .9rem; top: .2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons { align-items: center; width: auto } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-toggle { display: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search { align-items: center; background-color: #fff; border: 1px solid #fff; border-radius: 1rem; display: flex; height: 3.8rem; justify-content: center; left: auto; margin: 0; padding: 0 1.2rem; position: relative; right: auto; top: auto; transition: width .5s ease; width: 3.8rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search input { font-family: GilroyBold; font-size: 1.4rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGVsbGlwc2UgdHJhbnNmb3JtPSJyb3RhdGUoLTQ1IDExLjk4MiAxMi4wODUpIiBjeD0iMTEuOTgyIiBjeT0iMTIuMDg1IiByeD0iNy44MTMiIHJ5PSI3LjkwOSIvPjxwYXRoIGQ9Im0xOC40MjYgMTguNDc3IDUuMzk3IDUuMzk3IiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIi8+PC9nPjwvc3ZnPg=="); background-position: 50%; background-repeat: no-repeat; background-size: 1.7rem; position: absolute; right: 1.1rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { background: none; height: auto; margin: 0 0 0 1.3rem; width: auto } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login a { position: static } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login span { color: #fff; display: inline; font-family: GilroyRegular; font-size: 1.6rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-lower-deck { display: block; height: 4.5rem; overflow: inherit; width: 100% } .component-csc-meganav-container.search-open { background: none; position: static } .component-csc-meganav-container.search-open:after { background-color: transparent; bottom: 0; content: ""; height: 100%; left: 0; opacity: .2; position: fixed; right: 0; top: 0; width: 100%; z-index: -1 } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { display: block !important } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-search { width: 43.3rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-search:after { display: none } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-search .csc-meganav-search-icon { right: 1.1rem; width: 1.5rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu { background-color: #fff; border-top: 5px solid #81b5a1; box-shadow: 0 2px 4px 0 rgba(0,0,0,.3); display: block; left: auto; margin: auto; opacity: 0; pointer-events: none; position: absolute; right: 4rem; top: 7rem; transition: opacity .4s; width: 20rem; z-index: 999 } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul { margin: 0; padding: 1.4rem 2.2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li { font-family: GilroyRegular; margin: 0; padding: 1rem 0 } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li a, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li a { font-family: GilroyRegular; font-size: 1.4rem } .component-csc-meganav-container.login-open { background-color: #293e40; height: auto; position: static } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper { background-color: #293e40 } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper:after { display: none } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { justify-content: space-between } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search { display: flex } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu { opacity: 1; pointer-events: auto; transition: opacity .4s } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu:before { content: ""; height: 6rem; position: absolute; right: 0; top: -6rem; width: 6rem } .component-csc-meganav-container.signed-in .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMjYgMjYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI2IDI2IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiIGlkPSJzdHlsZTYzIj4uc3Qwe2ZpbGw6IzI5M2U0MH08L3N0eWxlPjxlbGxpcHNlIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjEuODtzdHJva2Utb3BhY2l0eToxIiBpZD0icGF0aDIxNTMiIGN4PSIxMi45NDciIGN5PSIxMi44NzYiIHJ4PSIxMi4yMDQiIHJ5PSIxMi4zNDYiLz48ZyBpZD0iZzY5IiBzdHlsZT0iZmlsbDojMjkzZDQwO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lO3N0cm9rZS1vcGFjaXR5OjEiPjxnIGlkPSJnNjciIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLW9wYWNpdHk6MSI+PHBhdGggY2xhc3M9InN0MCIgZD0iTTEzIDI1LjVDNi4xMSAyNS41LjUgMTkuODkuNSAxM1M2LjExLjUgMTMgLjUgMjUuNSA2LjExIDI1LjUgMTMgMTkuODkgMjUuNSAxMyAyNS41em0wLTIzLjMzQzcuMDMgMi4xNyAyLjE3IDcuMDMgMi4xNyAxM1M3LjAzIDIzLjgzIDEzIDIzLjgzIDIzLjgzIDE4Ljk3IDIzLjgzIDEzIDE4Ljk3IDIuMTcgMTMgMi4xN3oiIGlkPSJwYXRoNjUiIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLW9wYWNpdHk6MSIvPjwvZz48L2c+PGcgaWQ9Imc4MyIgc3R5bGU9ImZpbGw6IzI5M2Q0MDtmaWxsLW9wYWNpdHk6MSI+PGRlZnMgaWQ9ImRlZnM3MiI+PGNpcmNsZSBpZD0iU1ZHSURfMV8iIGN4PSIxMyIgY3k9IjEzIiByPSIxMC44OCIvPjwvZGVmcz48Y2xpcFBhdGggaWQ9IlNWR0lEXzJfIj48dXNlIHhsaW5rOmhyZWY9IiNTVkdJRF8xXyIgc3R5bGU9Im92ZXJmbG93OnZpc2libGUiIGlkPSJ1c2U3NCIvPjwvY2xpcFBhdGg+PGcgY2xpcC1wYXRoPSJ1cmwoI1NWR0lEXzJfKSIgaWQ9Imc4MSIgc3R5bGU9ImZpbGw6IzI5M2Q0MDtmaWxsLW9wYWNpdHk6MTtjbGlwLXBhdGg6dXJsKCNTVkdJRF8yXykiPjxnIGlkPSJnNzkiIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjEiPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNi40IDE0LjljLjg3LS44NyAxLjQtMi4wNyAxLjQtMy4zOSAwLTIuNjUtMi4xNi00LjgxLTQuODEtNC44MXMtNC44MSAyLjE2LTQuODEgNC44MWMwIDEuMzIuNTQgMi41MiAxLjQgMy4zOS0zLjA4Ljk2LTUuMjUgMy4xOS01LjI1IDUuNzh2Ni4yMWEuOTYuOTYgMCAwIDAgMS45MiAwdi02LjIxYzAtMi4zNiAzLjA4LTQuMzYgNi43My00LjM2czYuNzMgMiA2LjczIDQuMzZ2Ni4yMWEuOTYuOTYgMCAwIDAgMS45MiAwdi02LjIxYy4wMi0yLjU5LTIuMTUtNC44Mi01LjIzLTUuNzh6bS02LjI4LTMuMzlhMi44OCAyLjg4IDAgMSAxIDUuNzYxLjAwMSAyLjg4IDIuODggMCAwIDEtNS43NjEtLjAwMXoiIGlkPSJwYXRoNzciIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjEiLz48L2c+PC9nPjwvZz48L3N2Zz4="); background-position: 50%; background-repeat: no-repeat; background-size: 2.2rem; height: 2.2rem; margin: 0 1.6rem 0 1.4rem; position: relative; width: 2.2rem } .component-csc-meganav-container.signed-in .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login:after { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTMuMzMgMS43MzggNy42NzUgNi44OTdhMSAxIDAgMCAxLTEuMjU2LjA3NGwtLjA5Mi0uMDc0TC42NyAxLjczOEExIDEgMCAwIDEgMS45MjYuMTg3bC4wOTEuMDc0IDQuOTg0IDQuNTQzTDExLjk4My4yNjFhMSAxIDAgMCAxIDEuMzMtLjAxN2wuMDgzLjA4MmExIDEgMCAwIDEgLjAxNyAxLjMyOWwtLjA4Mi4wODNaIiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4="); background-position: 50%; background-repeat: no-repeat; content: ""; height: 1rem; position: absolute; right: -1.5rem; top: .8rem; width: 1rem } } @media screen and (min-width: 1700px) { .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { height: 10.8rem; padding: 4.2rem 0 1.1rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo { height: 2.3rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo img { height: auto; max-width: 12.9rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1 { font-size: 2.4rem; padding: 0 0 0 2.1rem; top: .1rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo h1:before { height: 1.8rem; left: 1rem; top: .3rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons { align-items: center; width: auto } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-toggle { display: none } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search { height: 4.6rem; width: 42.6rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search input { bottom: 0; display: block; font-family: GilroyBold; font-size: 1.8rem; height: 4.2rem; left: 2rem; opacity: 1; padding: 0; position: absolute; top: .1rem; transition: width .5s; width: 34.4rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-search .csc-meganav-search-icon { background-size: 2rem; position: absolute; right: 1.6rem; width: 2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { background: none; height: auto; margin: 0 0 0 2.3rem; width: auto } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login span { font-size: 1.8rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-lower-deck { height: 6rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-search { width: 80rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-search input { width: 76rem } .component-csc-meganav-container.search-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons #csc_search_container .csc-meganav-search .csc-meganav-search-icon { right: 1.6rem; width: 2rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu { right: 4.2rem; top: 9.6rem; width: 23.6rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul { padding: 1.7rem 2.8rem } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li { padding: .7rem 0 } .component-csc-meganav-container .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li a, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-menu-login-menu ul li a { font-family: GilroyRegular; font-size: 1.6rem } .component-csc-meganav-container.login-open { background-color: #293e40; height: auto; position: static } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper { background-color: #293e40 } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper:after { display: none } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck { justify-content: space-between } .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-logo, .component-csc-meganav-container.login-open .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-search { display: flex } .component-csc-meganav-container.signed-in .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMjYgMjYiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI2IDI2IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiIGlkPSJzdHlsZTYzIj4uc3Qwe2ZpbGw6IzI5M2U0MH08L3N0eWxlPjxlbGxpcHNlIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjEuODtzdHJva2Utb3BhY2l0eToxIiBpZD0icGF0aDIxNTMiIGN4PSIxMi45NDciIGN5PSIxMi44NzYiIHJ4PSIxMi4yMDQiIHJ5PSIxMi4zNDYiLz48ZyBpZD0iZzY5IiBzdHlsZT0iZmlsbDojMjkzZDQwO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lO3N0cm9rZS1vcGFjaXR5OjEiPjxnIGlkPSJnNjciIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLW9wYWNpdHk6MSI+PHBhdGggY2xhc3M9InN0MCIgZD0iTTEzIDI1LjVDNi4xMSAyNS41LjUgMTkuODkuNSAxM1M2LjExLjUgMTMgLjUgMjUuNSA2LjExIDI1LjUgMTMgMTkuODkgMjUuNSAxMyAyNS41em0wLTIzLjMzQzcuMDMgMi4xNyAyLjE3IDcuMDMgMi4xNyAxM1M3LjAzIDIzLjgzIDEzIDIzLjgzIDIzLjgzIDE4Ljk3IDIzLjgzIDEzIDE4Ljk3IDIuMTcgMTMgMi4xN3oiIGlkPSJwYXRoNjUiIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmU7c3Ryb2tlLW9wYWNpdHk6MSIvPjwvZz48L2c+PGcgaWQ9Imc4MyIgc3R5bGU9ImZpbGw6IzI5M2Q0MDtmaWxsLW9wYWNpdHk6MSI+PGRlZnMgaWQ9ImRlZnM3MiI+PGNpcmNsZSBpZD0iU1ZHSURfMV8iIGN4PSIxMyIgY3k9IjEzIiByPSIxMC44OCIvPjwvZGVmcz48Y2xpcFBhdGggaWQ9IlNWR0lEXzJfIj48dXNlIHhsaW5rOmhyZWY9IiNTVkdJRF8xXyIgc3R5bGU9Im92ZXJmbG93OnZpc2libGUiIGlkPSJ1c2U3NCIvPjwvY2xpcFBhdGg+PGcgY2xpcC1wYXRoPSJ1cmwoI1NWR0lEXzJfKSIgaWQ9Imc4MSIgc3R5bGU9ImZpbGw6IzI5M2Q0MDtmaWxsLW9wYWNpdHk6MTtjbGlwLXBhdGg6dXJsKCNTVkdJRF8yXykiPjxnIGlkPSJnNzkiIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjEiPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xNi40IDE0LjljLjg3LS44NyAxLjQtMi4wNyAxLjQtMy4zOSAwLTIuNjUtMi4xNi00LjgxLTQuODEtNC44MXMtNC44MSAyLjE2LTQuODEgNC44MWMwIDEuMzIuNTQgMi41MiAxLjQgMy4zOS0zLjA4Ljk2LTUuMjUgMy4xOS01LjI1IDUuNzh2Ni4yMWEuOTYuOTYgMCAwIDAgMS45MiAwdi02LjIxYzAtMi4zNiAzLjA4LTQuMzYgNi43My00LjM2czYuNzMgMiA2LjczIDQuMzZ2Ni4yMWEuOTYuOTYgMCAwIDAgMS45MiAwdi02LjIxYy4wMi0yLjU5LTIuMTUtNC44Mi01LjIzLTUuNzh6bS02LjI4LTMuMzlhMi44OCAyLjg4IDAgMSAxIDUuNzYxLjAwMSAyLjg4IDIuODggMCAwIDEtNS43NjEtLjAwMXoiIGlkPSJwYXRoNzciIHN0eWxlPSJmaWxsOiMyOTNkNDA7ZmlsbC1vcGFjaXR5OjEiLz48L2c+PC9nPjwvZz48L3N2Zz4="); background-position: 50%; background-repeat: no-repeat; background-size: 3.2rem; height: 3.2rem; margin: 0 2.4rem 0 2.3rem; position: relative; width: 3.2rem } .component-csc-meganav-container.signed-in .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login:after { background-position: 50%; background-repeat: no-repeat; height: 1.2rem; position: absolute; right: -1.6rem; top: 1.4rem; width: 1.2rem } .component-csc-meganav-container.signed-in .csc-meganav-outer-wrapper .csc-meganav-inner-wrapper .csc-meganav-upper-deck .csc-meganav-menu-buttons .csc-meganav-menu-login span { display: none } } .csc-meganav-search-panel { background-color: #fff; border-bottom: .4rem solid #293e40; display: none } .csc-meganav-search-panel ul { margin: 0; padding: 0 2rem } .csc-meganav-search-panel ul li { border-bottom: 1px solid #d8d8d8 } .csc-meganav-search-panel ul li:last-child { border-bottom: none } .csc-meganav-search-panel ul li > div { width: 100% } .csc-meganav-search-panel ul li + li, .csc-meganav-search-panel ul li:first-child { align-items: center; display: flex; margin-bottom: 0 } .csc-meganav-search-panel ul li + li > div, .csc-meganav-search-panel ul li:first-child > div { width: 100% } .csc-meganav-search-panel ul li + li > div:nth-last-child(2), .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) { align-items: center; display: flex; padding-left: .4rem; position: absolute; width: 2rem; z-index: 1 } .csc-meganav-search-panel ul li + li > div:nth-last-child(2) > span, .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) > span { align-items: center; background: transparent; border: none; cursor: pointer; display: flex; flex-direction: column; height: 2rem; margin-right: .2rem; outline: none; padding: 0; position: relative; transform: rotate(-45deg) } .csc-meganav-search-panel ul li + li > div:nth-last-child(2) > span:before, .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) > span:before { border: .22rem solid #979797; border-radius: 50%; content: ""; display: inline-block; height: 1.25rem; width: 1.25rem } .csc-meganav-search-panel ul li + li > div:nth-last-child(2) > span:after, .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) > span:after { background: #979797; border-radius: .5rem; bottom: 0; content: ""; display: inline-block; height: .75rem; position: absolute; width: .2rem } .csc-meganav-search-panel ul .category-link a { background-color: #fff; border-top: .1rem solid #eee; color: #293e40; display: inline-block; font-family: GilroyRegular; font-size: 1.4rem; font-style: italic; line-height: 1.7rem; margin: 0; outline: 0; padding: 2.2rem 2.6rem; position: relative; width: 100%; z-index: 0 } .csc-meganav-search-panel ul .category-link a:first-child { border-top: 0 } .csc-meganav-search-panel ul .category-link a:before { background: transparent; content: ""; padding: inherit; position: absolute; width: 100% } .csc-meganav-search-panel ul .category-link a b { color: #293e40 } .csc-meganav-search-panel ul li:not(.category-link) a { color: #979797; display: inline-block; font-family: GilroySemiBold,Arial,sans-serif; font-size: 1.4rem; line-height: 1.7rem; margin: 0; outline: 0; padding: 2.2rem 2.6rem; position: relative; width: 100% } .csc-meganav-search-panel ul li:not(.category-link) a b { color: #293e40; font-family: inherit; font-size: inherit; line-height: inherit; pointer-events: none } @media screen and (min-width: 1024px) { .csc-meganav-search-panel { height: 0; transition: height .5s ease } } @media screen and (min-width: 1700px) { .csc-meganav-search-panel { height: 0; transition: height .5s ease } } .component-csc-meganav-container.search-open .csc-meganav-search-panel { border-top: 1px solid #d8d8d8; bottom: 0; display: block; height: 100%; left: 0; margin: 0; overflow: hidden; overflow-y: auto; overflow-y: overlay; padding: 0 0 5rem; position: fixed; right: 0; top: 5.7rem; width: 100%; z-index: 1 } @media screen and (min-width: 768px) { .component-csc-meganav-container.search-open .csc-meganav-search-panel ul { padding: 0 3rem } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li + li > div, .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:first-child > div, .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li > div { margin: 0 } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:not(.category-link) a { font-size: 1.6rem; line-height: 2rem } } @media screen and (min-width: 1024px) { .component-csc-meganav-container.search-open .csc-meganav-search-panel { background-color: #fff; border-bottom: .4rem solid #293e40; border-radius: 0 0 .4rem .4rem; border-top: none; bottom: auto; height: auto; left: -1px; overflow: hidden; padding: 0; position: absolute; right: -1px; top: 2.8rem; width: auto; z-index: 4 } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul { border-top: .2rem solid #f7f7f7; padding: .5rem 0 0 } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:hover { background-color: #f7f7f7 } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li + li, .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:first-child { border: none } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li + li:hover, .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:first-child:hover { background-color: #f7f7f7 } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li + li > div:nth-last-child(2), .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:first-child > div:nth-last-child(2) { left: 2.6rem } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul .category-link a { background-color: #fff; font-size: 1.6rem; padding: 1rem 5.2rem } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:not(.category-link) a { font-family: GilroySemibold; font-size: 1.6rem; padding: 1.2rem 0 1.2rem 5.4rem } } @media screen and (min-width: 1700px) { .component-csc-meganav-container.search-open .csc-meganav-search-panel { top: 3.7rem } .component-csc-meganav-container.search-open .csc-meganav-search-panel ul li:not(.category-link) a { font-size: 1.8rem; padding-right: 1.3rem } } .csc-meganav-tooltip { display: none; left: 2rem; pointer-events: none; position: absolute; right: 2rem; top: 0; z-index: 999 } .csc-meganav-tooltip .csc-meganav-tooltip-container { background-color: #f7f7f7; border-radius: .5rem; box-shadow: .2rem .2rem .5rem rgba(0,0,0,.4); padding: 1.9rem 1.6rem; position: relative; text-align: center; z-index: 2 } .csc-meganav-tooltip .csc-meganav-tooltip-container span { font-family: GilroyRegular; font-size: 1.4rem; pointer-events: none } .csc-meganav-tooltip.show-tooltip { display: block } .csc-meganav-tooltip div:after, .csc-meganav-tooltip:after { background-color: #f7f7f7; bottom: -10px; content: ""; height: 20px; left: 50%; margin-left: -1rem; position: absolute; transform: rotate(45deg); width: 20px } .csc-meganav-tooltip:after { box-shadow: .2rem .2rem .5rem rgba(0,0,0,.4); z-index: -1 } @media screen and (min-width: 768px) { .csc-meganav-tooltip { left: unset; right: unset } .csc-meganav-tooltip .csc-meganav-tooltip-container { padding: 1.6rem 1.9rem; width: 14.5rem } } @media screen and (min-width: 1024px) { .csc-meganav-tooltip .csc-meganav-tooltip-container:before { display: none } } @media screen and (min-width: 1700px) { .csc-meganav-tooltip .csc-meganav-tooltip-container { padding: 1.8rem 2.4rem; width: 15.7rem } } .component-csc-meganav-container.meganav-open .csc-meganav-lower-deck { display: block !important } .component-csc-meganav-container .nav-dropdown { background-color: #f7f7f7; display: none; height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; z-index: 800 } .component-csc-meganav-container .nav-dropdown.groups-active { display: block } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper { display: flex; flex-flow: column; height: 100vh; padding: 0 2rem; position: absolute; top: 6rem; width: 100% } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper:before { border-bottom: 1px solid #d8d8d8; content: attr(data-title); font-family: GilroyRegular; font-size: 1.4rem; padding: 1.4rem 0; text-align: center } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col { border-bottom: 1px solid #d8d8d8 } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title { display: inline-block; padding: 1.4rem 2.8rem 1.4rem 0; position: relative; width: 100% } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title span { font-family: GilroySemiBold; font-size: 1.4rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title:after, .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title:before { background-color: #293e40; content: ""; display: inline-block; height: 2px; position: absolute; right: 0; width: 1rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title:before { top: 2.1rem; transform: rotate(45deg) } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title:after { top: 2.7rem; transform: rotate(-45deg) } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links { display: none } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items { padding: 0 0 2.5rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item { display: inline } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .nav-dropdown-item-link .nav-dropdown-item-text { font-family: GilroySemiBold; font-size: 1.4rem; margin-right: -.3rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icons { display: inline; white-space: nowrap } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icons .icon { margin-bottom: 2px; margin-left: .5rem; vertical-align: middle } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icons .icon.lock-icon { height: .9rem; width: .8rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icons .icon.new-icon { height: 1.3rem; width: 2.7rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item[data-icon-lock=true] { opacity: .4 } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item[data-icon-lock=true]:hover { background-position: 100% 100%; transition: all .25s linear } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item[data-icon-lock=true] .nav-dropdown-item-link { cursor: default } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .links-active { background-color: #f7f7f7; display: flex; flex-flow: column; height: 100vh; left: 0; padding: 0 2rem; position: absolute; top: 0; width: 100%; z-index: 850 } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .links-active:before { border-bottom: 1px solid #d8d8d8; content: attr(data-title); font-family: GilroyRegular; font-size: 1.4rem; margin: 0 0 1.8rem; padding: 1.4rem 0; text-align: center } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col:last-child { border-bottom: none } .component-csc-meganav-container.signed-in .nav-dropdown-item[data-icon-lock=true] { opacity: unset !important } .component-csc-meganav-container.signed-in .nav-dropdown-item[data-icon-lock=true] .nav-dropdown-item-link { cursor: pointer !important } @media only screen and (min-width: 768px) { .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper { padding: 0 3rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper:before { font-size: 1.6rem; padding: 1.4rem 6.1rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title { padding: 1.4rem 4.8rem 1.4rem 0 } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title span { font-size: 1.6rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items { padding: 0 0 2.8rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .nav-dropdown-item-link .nav-dropdown-item-text { margin-right: -.3rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icon { margin-left: .6rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .links-active { padding: 0 3rem } .component-csc-meganav-container .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .links-active:before { font-size: 1.6rem; margin: 0 0 2.8rem; padding: 1.4rem 6.1rem } } @media only screen and (min-width: 1024px) { .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown { background-color: unset; box-shadow: 0 1px 3px 0 rgba(0,0,0,.3); height: unset; left: 0; position: absolute; top: unset; z-index: 850 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .back-close { display: none } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper { background-color: #fff; flex-flow: row; height: unset; padding: 2.8rem 0; position: unset; top: unset } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper:after, .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper:before { display: none } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col { border-bottom: none; border-right: .1rem solid #979797; flex: 1; padding: 0 2.1rem; white-space: normal } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title { border-bottom: unset; padding: 0 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title span { font-family: GilroyBold; font-size: 1.8rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title:after, .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title:before { display: none } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .links-active { display: unset } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links { display: block; font-family: GilroyRegular; font-size: 1.4rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items { padding: 1.2rem 0 0 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .nav-dropdown-item-link .nav-dropdown-item-text { font-family: GilroyRegular } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icon.new-icon { height: 1.2rem; width: 2.5rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item[data-icon-lock=false] .nav-dropdown-item-text { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0); background-position: 100% 100%; background-repeat: no-repeat; background-size: 205% .2rem; transition: all .25s linear } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item[data-icon-lock=false] .nav-dropdown-item-text:hover { background-position: 0 100%; transition: all .25s linear } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items:first-child { padding: 2rem 0 0 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col:last-child { border: none } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown[data-columns="3"] { left: 4rem; width: 100% } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown[data-columns="2"] { width: 66.6666666667% } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown[data-columns="1"] { width: 33.3333333333% } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown[data-columns="1"] .nav-dropdown-group-items:first-child { padding: 0 !important } .component-csc-meganav-container.signed-in .nav-dropdown-item[data-icon-lock=true] .nav-dropdown-item-text { background-image: linear-gradient(90deg,#81b5a1 50%,transparent 0) !important; background-position: 100% 100% !important; background-repeat: no-repeat !important; background-size: 205% .2rem !important; transition: all .25s linear !important } .component-csc-meganav-container.signed-in .nav-dropdown-item[data-icon-lock=true] .nav-dropdown-item-text:hover { background-position: 0 100% !important; transition: all .25s linear !important } } @media only screen and (min-width: 1700px) { .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown { box-shadow: 0 2px 4px 0 rgba(0,0,0,.3) } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper { padding: 4.7rem 0 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col { padding: 0 4.7rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-title span { font-size: 2rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links { font-size: 1.6rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items { padding: 1.4rem 0 0 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items:first-child { padding: 4rem 0 0 } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .nav-dropdown-item-link .nav-dropdown-item-text { font-size: 1.6rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icon { margin-left: .8rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icon.lock-icon { height: 1.4rem; width: 1.2rem } .component-csc-meganav-container .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper .nav-dropdown-col .nav-dropdown-group-links .nav-dropdown-group-items .nav-dropdown-item .icon.new-icon { height: 2rem; width: 4rem } } .upper-level-nav { background-color: #f7f7f7; display: block; height: 100vh; left: 0; overflow-y: overlay; position: fixed; top: 0; width: 100%; z-index: 50 } .upper-level-nav .nav-main-links-wrapper { background-color: #f7f7f7; display: flex; flex-flow: column; height: auto; position: absolute; top: 5.9rem; width: 100% } .upper-level-nav .nav-main-links-wrapper .nav-link { border-bottom: 1px solid #d8d8d8; margin: 0 2rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span { display: inline-block; display: block; font-family: GilroySemiBold; font-size: 1.4rem; line-height: 1.5; position: relative; width: 100% } .upper-level-nav .nav-main-links-wrapper .nav-link > span .tool-tip { display: none } .upper-level-nav .nav-main-links-wrapper .nav-link > span:after, .upper-level-nav .nav-main-links-wrapper .nav-link > span:before { background-color: #293e40; content: ""; display: inline-block; height: 2px; position: absolute; right: 0; width: 1rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span:before { top: 2.1rem; transform: rotate(45deg) } .upper-level-nav .nav-main-links-wrapper .nav-link > span:after { top: 2.7rem; transform: rotate(-45deg) } .upper-level-nav .nav-main-links-wrapper .nav-link > span a { display: block; font-family: GilroySemiBold; font-size: 1.4rem; line-height: 1.5; padding: 1.4rem 2.8rem 1.4rem 0 } .upper-level-nav .nav-main-links-wrapper .nav-link:nth-last-child(2) > span { border-bottom: none } .upper-level-nav .nav-main-links-wrapper .nav-link[data-dropdown=false] > span:after, .upper-level-nav .nav-main-links-wrapper .nav-link[data-dropdown=false] > span:before { content: none } .upper-level-nav .nav-main-links-wrapper .nav-link.gated:hover > span .tool-tip { display: block } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span > a { cursor: default; pointer-events: none } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span:after, .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span:before, .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span > a { filter: opacity(.3) } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span .tool-tip { filter: drop-shadow(0 .2rem .4rem rgba(0,0,0,.2)); left: 0; position: absolute; top: -5rem; width: 100% } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span .tool-tip .box { background-color: #fff; border-radius: 4px; display: inline-block; font-size: 1.3rem; font-weight: 600; padding: 1.7rem 0; text-align: center; width: 100% } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span .tool-tip .arrow { border-left: 1.2rem solid transparent; border-right: 1.2rem solid transparent; border-top: 1.2rem solid #c8c8c8; bottom: -1.2rem; height: 0; position: absolute; right: 2.5rem; width: 0 } @media only screen and (min-width: 768px) { .upper-level-nav .nav-main-links-wrapper .nav-link { margin: 0 3rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span a { display: inline-block; font-family: GilroySemiBold; font-size: 1.6rem; line-height: 1.7; padding: 1.3rem 4.1rem 1.3rem 0 } } @media only screen and (min-width: 1024px) { .upper-level-nav { background-color: initial; display: block; height: 4.5rem; left: auto; overflow-y: initial; position: relative; top: auto; width: auto; z-index: auto } .upper-level-nav::-webkit-scrollbar { display: none } .upper-level-nav.scrolled { padding-left: 4rem } .upper-level-nav.last-nav-link-padding .nav-link:nth-last-child(2) { padding-right: 150rem } .upper-level-nav.scroll { -ms-overflow-style: none; background-color: #293e40; max-height: 5.3rem; overflow: inherit; padding-right: 2.8rem; scrollbar-width: none } .upper-level-nav.scroll::-webkit-scrollbar { display: none } .upper-level-nav.scroll .nav-main-links-wrapper { touch-action: none } .upper-level-nav.scroll .nav-main-links-wrapper .nav-link.partially-visible > span { cursor: default } .upper-level-nav.scroll .scroll-arrow { background-color: #293e40; border-radius: 50%; box-shadow: 0 0 12px 0 rgba(0,0,0,.53); cursor: pointer; height: 2.4rem; position: absolute; top: 1rem; width: 2.4rem; z-index: 2 } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow { left: 0 } .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow { right: 0 } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:after, .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:before, .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:after, .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:before { background-color: #fff; content: ""; display: inline-block; height: 1px; position: absolute; width: .8rem } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:after, .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:before { left: 30% } .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:after, .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:before { right: 30% } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:before { top: calc(50% - .3rem); transform: rotate(-45deg) } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:after { top: calc(50% + .2rem); transform: rotate(45deg) } .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:before { top: calc(50% - .3rem); transform: rotate(45deg) } .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:after { top: calc(50% + .2rem); transform: rotate(-45deg) } .upper-level-nav .back-close { display: none } .upper-level-nav .nav-main-links-wrapper { -ms-overflow-style: none; background-color: #293e40; display: block; height: auto; overflow-x: auto; overflow-y: hidden; position: static; scrollbar-width: none; top: auto; white-space: nowrap } .upper-level-nav .nav-main-links-wrapper::-webkit-scrollbar { display: none } .upper-level-nav .nav-main-links-wrapper .nav-link { border-bottom: none; display: inline-block; margin: 0 2rem 0 0; transition: border-bottom .4s ease } .upper-level-nav .nav-main-links-wrapper .nav-link:nth-last-child(2) { margin-right: 0 } .upper-level-nav .nav-main-links-wrapper .nav-link:not(.gated):hover > span { border-bottom: .5rem solid #81b5a1 !important; cursor: pointer; transition: border-bottom .4s ease } .upper-level-nav .nav-main-links-wrapper .nav-link:not(.gated).partially-visible:hover > span, .upper-level-nav .nav-main-links-wrapper .nav-link:not(.gated).partially-visible:hover > span a { cursor: default } .upper-level-nav .nav-main-links-wrapper .nav-link:not(.gated).active > span { border-bottom: .5rem solid #81b5a1 !important; transition: border-bottom .1s ease } .upper-level-nav .nav-main-links-wrapper .nav-link[data-dropdown=false] > span a { padding-right: 0 } .upper-level-nav .nav-main-links-wrapper .nav-link[data-dropdown=true]:hover > span { border-bottom: .5rem solid #293e40 !important; transition: border-bottom .4s ease } .upper-level-nav .nav-main-links-wrapper .nav-link[data-dropdown=true].active > span { border-bottom: .5rem solid #81b5a1 !important; transition: border-bottom .1s ease } .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown { display: initial; opacity: 0; pointer-events: none; transition: opacity .4s } .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown.active { opacity: 1; pointer-events: auto; transition: opacity .4s } .upper-level-nav .nav-main-links-wrapper .nav-link .nav-dropdown .nav-dropdown-wrapper { height: auto; overflow: hidden; top: 0 } .upper-level-nav .nav-main-links-wrapper .nav-link > span { border-bottom: .5rem solid #293e40; color: #fff; font-weight: 400; padding-left: 0; padding-right: 2.6rem; transition: border-bottom .4s ease; white-space: nowrap; z-index: 1 } .upper-level-nav .nav-main-links-wrapper .nav-link > span:after, .upper-level-nav .nav-main-links-wrapper .nav-link > span:before { background-color: #fff; bottom: 50%; display: inline-block; height: 1px; width: .55rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span:before { right: 10.6px; top: auto; transform: rotate(-140deg) } .upper-level-nav .nav-main-links-wrapper .nav-link > span:after { right: 6.6px; top: auto; transform: rotate(140deg) } .upper-level-nav .nav-main-links-wrapper .nav-link > span a { color: #fff; display: block; font-family: GilroyRegular; padding: .65rem 0 } .upper-level-nav .nav-main-links-wrapper .nav-link:nth-last-child(2) > span { border-bottom: .5rem solid #293e40 } .upper-level-nav .nav-main-links-wrapper .nav-link[data-dropdown=false] > span { padding-right: .5rem } .upper-level-nav .nav-main-links-wrapper .nav-link.gated:hover > span .tool-tip { display: block } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span .tool-tip { bottom: -7rem; top: auto } .upper-level-nav .nav-main-links-wrapper .nav-link.gated > span .tool-tip .arrow { border-bottom: 1.2rem solid #fff; border-top: none; bottom: auto; top: -1.2rem } } @media only screen and (min-width: 1700px) { .upper-level-nav { height: 6rem } .upper-level-nav.scrolled { padding-left: 5.5rem } .upper-level-nav.scroll .scroll-arrow { height: 3rem; top: 1.2rem; width: 3rem } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:after, .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:before, .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:after, .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:before { width: 1rem } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:before { top: calc(50% - .4rem); transform: rotate(-45deg) } .upper-level-nav.scroll .scroll-arrow.left-scroll-arrow:after { top: calc(50% + .3rem); transform: rotate(45deg) } .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:before { top: calc(50% - .4rem); transform: rotate(45deg) } .upper-level-nav.scroll .scroll-arrow.right-scroll-arrow:after { top: calc(50% + .3rem); transform: rotate(-45deg) } .upper-level-nav .nav-main-links-wrapper .nav-link { margin-right: 2.6rem } .upper-level-nav .nav-main-links-wrapper .nav-link:nth-last-child(2) { margin-right: 0 } .upper-level-nav .nav-main-links-wrapper .nav-link > span { padding-right: 3rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span:after, .upper-level-nav .nav-main-links-wrapper .nav-link > span:before { width: .825rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span:before { right: 1.1rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span:after { right: .5rem } .upper-level-nav .nav-main-links-wrapper .nav-link > span a { font-size: 1.8rem; padding: 1.23rem 0 } } .component-video-content-marquee { padding: 6rem 0 4rem; position: relative } .component-video-content-marquee .video-content-marquee-container { margin: auto; max-width: 170rem; padding: 0 2rem } .component-video-content-marquee .video-content-marquee-container .asset-column { padding: 0 0 2rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-js, .component-video-content-marquee .video-content-marquee-container .asset-column img, .component-video-content-marquee .video-content-marquee-container .asset-column video { height: auto; max-width: 100%; width: 100% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-poster { display: none } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-tech { position: relative } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .bc-player-default_default.not-hover.vjs-has-started.vjs-paused.vjs-user-active .vjs-control-bar:not(.vjs-focus-within):not(.vjs-control-bar-visible), .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .bc-player-default_default.not-hover.vjs-has-started.vjs-playing.vjs-user-active .vjs-control-bar:not(.vjs-focus-within):not(.vjs-control-bar-visible), .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .bc-player-default_default.vjs-has-started.vjs-playing.vjs-user-inactive .vjs-control-bar:not(.vjs-focus-within):not(.vjs-control-bar-visible) { transform: translateY(5.6rem) } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-panel { display: flex; width: 4rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-layout-small:not(.vjs-fullscreen) .vjs-volume-panel .vjs-mute-control { display: flex } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar { align-items: center; display: flex; height: 5.6rem; justify-content: center } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-control .vjs-icon-placeholder:before { align-items: center; display: flex; justify-content: center } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar span { color: #fff; font-size: 1.4rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-progress-control { height: 100% !important; position: unset; top: 0 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-progress-control .vjs-progress-holder { height: .3rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-custom-control-spacer { display: none } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-current-time { order: 1 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-time-control { order: 2 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-duration { order: 3 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-volume-panel { order: 4 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-volume-panel .vjs-volume-level .vjs-slider-vertical .vjs-volume-level:before { font-size: .9em; left: -.3em; position: absolute; top: -.5em } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-volume-panel .vjs-volume-level .vjs-icon-volume-high:before { content: "" } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-volume-panel .vjs-volume-control { align-items: center; bottom: 100%; display: flex; height: 100%; left: 0; position: absolute; width: 100% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-control-bar .vjs-fullscreen-control { order: 5 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .videosjs-placeholder-dimensions { height: auto } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-volume-level { background-color: #fff } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js { width: 100% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .video-js .vjs-control { padding-right: .4rem; width: 3.2rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-play-progress { background-color: #fff } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-dock-text, .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-share-control { display: none } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button { align-items: center; border: solid; display: flex; height: 4.4rem; justify-content: center; width: 4.4rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button.only-bc-btn { font-size: 2.8em; line-height: 0 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button .vjs-icon-placeholder:before { position: relative } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button { background-color: transparent; border-radius: 1.3em; bottom: 0; display: block; font-size: 4em; left: 0; line-height: 1.4em; margin: auto; position: absolute; right: 0; top: 0; width: 1.5em; z-index: 1 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button span { color: #fff; font-size: 4rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js.vjs-has-started.vjs-playing .vjs-big-play-button { display: none } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js.vjs-has-started .vjs-big-play-button, .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js.vjs-has-started.vjs-ended .vjs-big-play-button { display: block } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button { border: 4px solid #fff; height: 1.5em } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js.vjs-ended .vjs-big-play-button .vjs-icon-placeholder:before { content: "" } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar { background-color: rgba(43,51,63,.7); height: 32px } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar .vjs-control .vjs-icon-placeholder:before, .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar .vjs-control.vjs-time-control span { align-items: center; color: #fff; display: flex; justify-content: center } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-control .vjs-volume-bar { margin-top: 1.6em } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar .vjs-remaining-time { display: none } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.vjs-overlay-background { background-color: rgba(41,62,64,.8); bottom: 0; left: 0; margin: 0; padding: 0; right: 0; text-align: left; top: 0; width: 100% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.vjs-overlay-background .overlay-links a { color: #fff } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.title .overlay-container .overlay-main-title { -webkit-box-orient: vertical; -webkit-line-clamp: 2; display: block; font-family: GilroyBold; line-height: 3.9rem; max-height: 11em; overflow: hidden; padding: 32px 40px; position: relative; text-overflow: ellipsis } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.title .overlay-container .overlay-main-title h2 { color: #fff; font-size: 3rem; line-height: 4rem; margin: 0 } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.title .overlay-container .overlay-main-title:before { bottom: 0; color: #fff; content: "..."; font-size: 3em; position: absolute; right: 14px; visibility: hidden } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.title .overlay-container .overlay-main-title:after { background-color: rgba(41,62,64,.8); color: #fff; content: ""; font-size: 3em; height: 1em; margin-top: .2em; position: absolute; right: 14px; visibility: hidden; width: 1em } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.links .overlay-container { height: 100% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.links .overlay-container .overlay-left-side { background-color: #293e40; height: 100%; padding: 50px 24px 24px; width: 45% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.links .overlay-container .overlay-left-side .overlay-link-section { display: none } .component-video-content-marquee .video-content-marquee-container .text-column h1, .component-video-content-marquee .video-content-marquee-container .text-column h2, .component-video-content-marquee .video-content-marquee-container .text-column h3 { margin: 0 0 2rem } .component-video-content-marquee .video-content-marquee-container .text-column .body-container ol, .component-video-content-marquee .video-content-marquee-container .text-column .body-container p, .component-video-content-marquee .video-content-marquee-container .text-column .body-container ul { margin: 0 } .component-video-content-marquee .video-content-marquee-container .text-column .body-container ul { display: block; padding: 0 0 0 2rem } .component-video-content-marquee .video-content-marquee-container .text-column .body-container ul li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; list-style: disc; margin: 0; padding: 0 } .component-video-content-marquee .video-content-marquee-container .text-column .body-container ol { display: block; padding: 0 0 0 2rem } .component-video-content-marquee .video-content-marquee-container .text-column .body-container ol li { -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; list-style: decimal; margin: 0; padding: 0 } .component-video-content-marquee .video-content-marquee-container .text-column .cta-component { display: block; margin: 2rem 0; text-align: center } .component-video-content-marquee.asset-on-right .video-content-marquee-container { flex-direction: row-reverse } .component-video-content-marquee.hide-mobile-asset .asset-column { display: none } .component-video-content-marquee.middle-aligned-asset .video-content-marquee-container { align-items: center } .component-video-content-marquee.top-padding-zero { padding-top: 0 !important } .component-video-content-marquee.top-padding-large { padding-top: 12rem } .component-video-content-marquee.bottom-padding-zero { padding-bottom: 0 !important } .component-video-content-marquee.bottom-padding-large { padding-bottom: 8rem } .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column { text-align: center } @media screen and (min-width: 768px) { .component-video-content-marquee { padding: 4rem 0 3rem } .component-video-content-marquee .video-content-marquee-container { display: flex; justify-content: space-between; padding: 0 3rem } .component-video-content-marquee .video-content-marquee-container .asset-column { padding: 0; width: 48% } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .overlay-container .overlay-main-title { display: block } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar { height: 5.6rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-control-bar .vjs-control { width: 4.8rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .vjs-overlay.links .overlay-container .overlay-left-side { padding: 24px } .component-video-content-marquee .video-content-marquee-container .text-column { width: 48% } .component-video-content-marquee .video-content-marquee-container .text-column h1, .component-video-content-marquee .video-content-marquee-container .text-column h2, .component-video-content-marquee .video-content-marquee-container .text-column h3 { margin: 0 0 1rem } .component-video-content-marquee .video-content-marquee-container .text-column .body-container { padding: 0 0 2rem } .component-video-content-marquee .video-content-marquee-container .text-column .body-container + .cta-component { margin: 1rem 1rem 1rem 0 } .component-video-content-marquee .video-content-marquee-container .text-column .cta-component { display: inline-block } .component-video-content-marquee .video-content-marquee-container .text-column .cta-component.cta-text-arrow { margin-right: -.5rem } .component-video-content-marquee.hide-mobile-asset .asset-column { display: block } .component-video-content-marquee.top-padding-large { padding-top: 8rem } .component-video-content-marquee.bottom-padding-large { padding-bottom: 6rem } .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column { text-align: right } .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column .video-js, .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column img, .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column video { max-width: 30.1rem } } @media screen and (min-width: 1024px) { .component-video-content-marquee { padding: 4rem 0 3rem } .component-video-content-marquee .video-content-marquee-container { padding: 0 4rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button { border: .5rem solid #fff; border-radius: 100%; height: 8.8rem; width: 8.8rem } .component-video-content-marquee .video-content-marquee-container .asset-column .video-player .video-js .vjs-big-play-button span { display: flex; font-size: 5rem; font-size: 6rem } .component-video-content-marquee .video-content-marquee-container .text-column .body-container + .cta-component { margin: 1rem 2rem 1rem 0 } .component-video-content-marquee .video-content-marquee-container .text-column .cta-component { display: inline-block } .component-video-content-marquee .video-content-marquee-container .text-column .cta-component.cta-text-arrow { margin-right: 0 } .component-video-content-marquee.top-padding-large { padding-top: 8rem } .component-video-content-marquee.bottom-padding-large { padding-bottom: 6rem } .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column { text-align: center } .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column .video-js, .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column img, .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column video { max-width: 31.1rem } } @media screen and (min-width: 1700px) { .component-video-content-marquee { padding: 4rem 0 3.6rem } .component-video-content-marquee .video-content-marquee-container { padding: 0 4rem } .component-video-content-marquee .video-content-marquee-container .asset-column, .component-video-content-marquee .video-content-marquee-container .text-column { width: 78.9rem } .component-video-content-marquee .video-content-marquee-container .text-column h1, .component-video-content-marquee .video-content-marquee-container .text-column h2, .component-video-content-marquee .video-content-marquee-container .text-column h3 { margin: 0 0 2rem } .component-video-content-marquee.top-padding-large { padding-top: 8rem } .component-video-content-marquee.bottom-padding-large { padding-bottom: 7.2rem } .component-video-content-marquee.small-asset .video-content-marquee-container { justify-content: space-around } .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column .video-js, .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column img, .component-video-content-marquee.small-asset .video-content-marquee-container .asset-column video { max-width: 34.9rem } } .component-tabbed-component .video-content-marquee-container { padding-left: 0 !important; padding-right: 0 !important } .component-event-navigation { align-items: center; background-color: #fff; display: flex; height: 5.6rem; left: 0; opacity: 1; padding: 0 2rem; position: fixed; right: 0; top: 0; transition: all .25s linear; z-index: 2 } .component-event-navigation .navigation-cta.nav-cta-manage-registration, .component-event-navigation .navigation-cta.nav-cta-register-now { display: none } .component-event-navigation .navigation-events-inner-wrapper { align-items: center; display: flex; justify-content: space-between; width: 100% } .component-event-navigation .navigation-link-group { background-color: #fff; display: block; height: 100vh; left: 0; margin: 0; padding: 1.2rem 0; position: absolute; top: 5.6rem; width: 100%; z-index: 101 } .component-event-navigation .navigation-link-group.signed-in-state .navigation-link-divider, .component-event-navigation .navigation-link-group.signed-in-state .navigation-link-item:nth-last-child(-n+2) { display: none } .component-event-navigation .navigation-logo, .component-event-navigation .navigation-logo-link { align-items: center; display: flex } .component-event-navigation .navigation-logo-icon { cursor: pointer; width: 14rem } .component-event-navigation .navigation-link { color: #293e40; cursor: pointer; display: block; font-family: gilroySemibold; font-size: 1.8rem; padding: 1.2rem 2rem } .component-event-navigation .add-shades .navigation-link { color: #5b6f70 } .component-event-navigation .apply-default-shade { color: #293e40 !important } .component-event-navigation .navigation-link-divider { padding: 1rem } .component-event-navigation .navigation-link-divider:before { border-bottom: .1rem solid #bec5c5; content: ""; display: block } .component-event-navigation .navigation-links-wrapper { display: none } .component-event-navigation.mobile-collapse .navigation-links-wrapper { display: block } .component-event-navigation.shadow-enable { box-shadow: 0 0 1.5rem .5rem rgba(41,62,64,.2) } .component-event-navigation.temporary-transparent { background: transparent } .component-event-navigation.hide-nav { opacity: 0; transition: all .25s linear } .component-event-navigation.logo-only .nav-menu-toggle, .component-event-navigation.logo-only .navigation-cta-wrapper, .component-event-navigation.logo-only .navigation-links-wrapper { display: none } .component-event-navigation .nav-menu-toggle { background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgc3Ryb2tlPSIjMjkzRTQxIiBzdHJva2Utd2lkdGg9IjEuOCIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBzdHJva2UtbGluZWNhcD0ic3F1YXJlIj48cGF0aCBkPSJNMSAxMC41aDIyTTEgMS41aDIyIi8+PC9nPjwvc3ZnPg==); background-position: 50%; background-repeat: no-repeat; background-size: 2rem; display: inline-block; height: 2rem; margin: 0 0 0 1.5rem; vertical-align: middle; width: 5rem } .component-event-navigation .navigation-cta-wrapper { width: 100% } .component-event-navigation .navigation-cta { background-color: #293e40; padding: 1rem; text-align: center } .component-event-navigation .navigation-cta-btn { color: #fff; font-family: gilroySemibold } .component-event-navigation .navigation-sign-in { float: right } .component-event-navigation .navigation-sign-in-button { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/now-at-work/2021/signed-out.svg); background-position: 100% 0; background-repeat: no-repeat; background-size: 2rem 2rem; display: block; line-height: 2rem; width: 6.5rem } .component-event-navigation .navigation-sign-in-button.signed-in { background-image: url(../../../content/dam/servicenow-assets/public/en-us/images/now-at-work/2021/signed-in.svg); height: 2rem; width: 2rem } .component-event-navigation .navigation-sign-in-button.signed-in .hide { display: none } @media only screen and (min-width: 768px) { .component-event-navigation { padding: 0 3rem } .component-event-navigation .navigation-logo-icon { width: 16rem } .component-event-navigation .navigation-link { padding: 1.2rem 3rem } .component-event-navigation .navigation-sign-in-button { background-size: 2.5rem 2.5rem; line-height: 2.5rem; width: 8.5rem } .component-event-navigation .navigation-sign-in-button.signed-in { height: 2.5rem; width: 2.5rem } } @media only screen and (max-width: 1023px) { .component-event-navigation .navigation-cta { bottom: 0; left: 0; position: fixed; width: 100%; z-index: 900 } } @media only screen and (min-width: 1024px) { .component-event-navigation { height: 8rem; padding: 0 4rem } .component-event-navigation.transparent { background: transparent; position: absolute } .component-event-navigation.transparent:after { display: none } .component-event-navigation .navigation-logo-link { margin-right: 5.6rem } .component-event-navigation .nav-menu-toggle { display: none } .component-event-navigation .navigation-events-inner-wrapper { align-items: center } .component-event-navigation .navigation-cta-wrapper, .component-event-navigation .navigation-links-wrapper { display: flex } .component-event-navigation .navigation-links-wrapper { width: 100% } .component-event-navigation .navigation-link-group { background: inherit; display: flex; height: auto; padding: 1.2rem 2.4rem; position: relative; top: 0; width: 100% } .component-event-navigation .navigation-link-item { margin: 0 2.4rem } .component-event-navigation .navigation-link { font-family: gilroyRegular; padding: 1rem 0 } .component-event-navigation .navigation-link.active { border-bottom: 5px solid #293e40; color: #293e40 !important } .component-event-navigation .navigation-link-item:nth-last-child(-n+2) { display: none } .component-event-navigation .navigation-cta { display: block; padding: 1.3rem 3.2rem } .component-event-navigation .navigation-cta-btn { white-space: nowrap } .component-event-navigation .navigation-sign-in { align-items: center; display: flex; margin-left: 2.4rem } .component-event-navigation .sign-in-text { font-size: 1.8rem } .component-event-navigation .navigation-cta-wrapper { width: auto } } @media only screen and (min-width: 1700px) { .component-event-navigation { padding: 0 } .component-event-navigation .navigation-events-inner-wrapper { margin: auto; max-width: 1700px; padding: 0 4rem } .component-event-navigation .navigation-logo-icon { width: 18rem } .component-event-navigation .navigation-logo-link { margin-right: 9.6rem } .component-event-navigation .navigation-link { font-size: 1.8rem } } body.disable-scroll, body.profile-overlay-open { overflow: hidden } body.profile-overlay-open .component-profile-overlay .overlay-background { background-color: rgba(41,62,64,.8); margin-left: 0; opacity: 1; transition: visibility .3s,background-color .3s .2s,opacity .3s linear; visibility: visible; z-index: 1000 } body.profile-overlay-open.profile-overlay-close .component-profile-overlay .overlay-background { background-color: rgba(41,62,64,0); opacity: 0; visibility: hidden } body .component-profile-overlay.registered .profile-overlay-content .profile-overlay-registered { display: block } body .component-profile-overlay.registered .profile-overlay-content .profile-overlay-not-registered { display: none } body .component-profile-overlay .overlay-background { background-color: rgba(41,62,64,0); height: 100vh; margin-left: -10000px; opacity: 0; position: fixed; top: 0; visibility: hidden; width: 100%; z-index: -1 } body .component-profile-overlay .profile-overlay-content { background: #fff; font-size: medium; height: 100vh; overflow-y: auto; padding: 90px 12px 80px; position: absolute; right: 0; width: 100%; z-index: 0 } body .component-profile-overlay .profile-overlay-content .overlay-title .user-name { display: inline-block; font-size: inherit } body .component-profile-overlay .profile-overlay-content .overlay__close-btn { box-sizing: content-box; color: #293e40; cursor: pointer; height: 1.6rem; opacity: .3; padding: 10px; position: absolute; right: 3rem; top: 5.3rem; transition: all .2s ease-in-out; width: 1.6rem; z-index: 1001 } body .component-profile-overlay .profile-overlay-content .overlay__close-btn .svg-icon { pointer-events: none } body .component-profile-overlay .profile-overlay-content .overlay__close-btn:hover { opacity: 1 } body .component-profile-overlay .profile-overlay-content .profile-overlay-registered { display: none } body .component-profile-overlay .profile-overlay-content .profile-overlay-not-registered p, body .component-profile-overlay .profile-overlay-content .profile-overlay-registered p { margin-bottom: 40px } body .component-profile-overlay .profile-overlay-content .anchor-link { margin-bottom: 24px } body .component-profile-overlay .profile-overlay-content .anchor-link a { background-image: linear-gradient(#81b5a1,#81b5a1); background-position: bottom; background-repeat: repeat-x; background-size: .2rem .2rem; color: #293e40; font-family: inherit; padding-bottom: .1rem; position: relative; text-decoration: none; transition: background .2s ease-out } body .component-profile-overlay .profile-overlay-content .anchor-link a:hover { background-size: 100% 120%; color: inherit } @media only screen and (min-width: 768px) { body .component-profile-overlay .overlay-background .profile-overlay-content { padding-left: 22px; padding-right: 22px } } @media only screen and (min-width: 1024px) { body .component-profile-overlay .overlay-background .profile-overlay-content { padding-left: 40px; padding-right: 40px; width: 47.6% } body .component-profile-overlay .overlay-background .profile-overlay-content .overlay__close-btn { right: 4rem } } @media only screen and (min-width: 1700px) { body .component-profile-overlay .overlay-background .profile-overlay-content { padding-left: 60px; padding-right: 60px } } .billBoardMarquee .now-at-work-register-btn, .billBoardMarquee .now-at-work-sessions-btn, .billBoardMarquee .now-at-work-sign-in-btn, .billBoardMarquee .now-at-work-video-btn, .marqueeMedium .now-at-work-register-btn, .marqueeMedium .now-at-work-sessions-btn, .marqueeMedium .now-at-work-sign-in-btn, .marqueeMedium .now-at-work-video-btn { display: none } .accordion.section + .accordion.section .accordion-wrapper { padding-top: 0 } .accordion.section b { font-family: GilroySemiBold } .accordion.section .accordion-wrapper { margin: 0 auto; max-width: 1700px; padding: 56px 20px } .accordion.section .accordion-wrapper[data-accordion-variation=default] .accordion-panel-expanded { display: block } .accordion.section .accordion-wrapper[data-accordion-variation=default] .accordion-panel-hidden { display: none } .accordion.section ul { -webkit-padding-start: 22px; padding-inline-start: 22px } .accordion.section ul li { list-style: disc; margin-bottom: 16px } .accordion.section ul li:last-child { margin-bottom: 24px } .accordion.section ul.list-unstyled { -webkit-padding-start: 0; padding-inline-start: 0 } .accordion.section ul.list-unstyled li { list-style: none } .accordion.section .accordion-expand-wrapper { bottom: 2px; display: inline-block; position: absolute; right: 0 } .accordion.section .accordion-expand-wrapper a { background-image: linear-gradient(#81b5a1,#81b5a1); background-position: bottom; background-repeat: repeat-x; background-size: .2rem .2rem; color: inherit; display: inline; font-weight: 400; line-height: 1.5; padding: 1px 0; position: relative; text-decoration: none; transition: background .25s ease-out } .accordion.section .accordion-expand-wrapper a:hover { background-size: 100% 100% } .accordion.section .accordion-item-header { margin: 0; padding-top: 24px } .accordion.section .accordion-item[data-cmp-expanded] .accordion-item-icon { transform: translateY(-50%) rotate(270deg) } .accordion.section .accordion-item-icon { background: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-carret-right.svg) no-repeat; background-size: 10px; content: ""; cursor: pointer; height: 15px; position: absolute; right: 0; top: 50%; transform: translateY(-50%) rotate(90deg); transition: transform .2s; width: 15px } .accordion.section .accordion-button { background: #fff; border: none; border-bottom: 1px solid rgba(41,62,64,.2); color: #293e40; cursor: pointer; display: block; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: 30px; margin-bottom: 24px; outline: none; padding: 0; position: relative; text-align: left; width: 100% } .accordion.section .accordion-item-title { color: #293e40; display: inline-block; font-family: inherit; font-size: inherit; line-height: inherit; margin-bottom: 0; padding-bottom: 8px; pointer-events: none; width: calc(100% - 45px) } .accordion.section .accordion-main-title { margin: 24px 0; padding-right: 80px; position: relative } .accordion.section .accordion-panel { color: #293e40; line-height: 1.7 } .accordion.section .accordion-panel p { margin-bottom: 24px; margin-top: 0 } .accordion.section .accordion-panel a, .accordion.section .accordion-panel li, .accordion.section .accordion-panel p { color: #293e40; font-size: inherit } .accordion.section .accordion-wrapper[data-accordion-variation=slide-down] .accordion-panel { overflow-y: hidden; transition: height .5s ease-in-out } .accordion.section .accordion-wrapper[data-accordion-variation=slide-down] .accordion-panel-hidden { height: 0 } @media only screen and (min-width: 768px) { .accordion.section .accordion-wrapper { padding: 56px 30px } } @media only screen and (min-width: 1024px) { .accordion.section .accordion-wrapper { padding: 56px 40px } .accordion.section ul li:last-child { margin-bottom: 24px } .accordion.section .accordion-panel p { margin-bottom: 32px } .accordion.section .accordion-title { margin-top: 32px; padding-right: 100px } } @media only screen and (min-width: 1700px) { .accordion.section.multiple-accordions-first .accordion-wrapper { padding-bottom: 56px } .accordion.section .accordion-wrapper { padding: 80px 40px } .accordion.section + .accordion.section .accordion-wrapper { padding-bottom: 54px } .accordion.section .accordion-main-title { margin: 32px 0 24px } .accordion.section .accordion-item-title { padding-bottom: 16px } .accordion.section .accordion-item-icon { right: 20px } } .billboard-marquee-component { position: relative } .billboard-marquee-component .billboard-marquee-component-outter-wrapper { padding: 4rem 0 } .billboard-marquee-component .billboard-marquee-subtitle p, .billboard-marquee-component .billboard-marquee-title h1 { margin: 0; padding: 0 } .billboard-marquee-component .billboard-marquee-eyebrow, .billboard-marquee-component .billboard-marquee-title { margin-bottom: .8rem } .billboard-marquee-component .billboard-marquee-counter-endtime { padding: 1.6rem 0 } .billboard-marquee-component .billboard-marquee-text-cta-section-cta { margin-top: 1.6rem } .billboard-marquee-component .billboard-marquee-background, .billboard-marquee-component .billboard-marquee-background img, .billboard-marquee-component .billboard-marquee-background picture { height: auto; margin-bottom: -2px; width: 100% } .billboard-marquee-component .expired { display: none !important } .billboard-marquee-component .billboard-marquee-counter-endtime { display: flex } .billboard-marquee-component .billboard-marquee-counter-endtime .label-copy { text-transform: none } .billboard-marquee-component .counter-time-hour, .billboard-marquee-component .counter-time-min, .billboard-marquee-component .counter-time-sec { padding-left: .5rem } @media only screen and (min-width: 768px) { .billboard-marquee-component { align-items: center; display: flex; flex-direction: column; justify-content: center; max-height: 56rem; min-height: 56rem; position: relative } .billboard-marquee-component .billboard-marquee-background, .billboard-marquee-component .billboard-marquee-background img, .billboard-marquee-component .billboard-marquee-background picture { height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center top; object-position: center top; position: absolute; top: 0; z-index: 1 } .billboard-marquee-component .billboard-marquee-component-outter-wrapper { display: flex; position: relative; width: 100%; z-index: 100 } } @media only screen and (min-width: 1024px) { .billboard-marquee-component { max-height: 68rem; min-height: 68rem } .billboard-marquee-component .billboard-marquee-counter-endtime { padding: 2.4rem 0 } .billboard-marquee-component .billboard-marquee-title { margin-bottom: 1.6rem } .billboard-marquee-component .billboard-marquee-text-cta-section-cta { margin-top: 2.4rem } } @media only screen and (min-width: 1700px) { .billboard-marquee-component { max-height: 90rem; min-height: 68rem } .billboard-marquee-component .billboard-marquee-background, .billboard-marquee-component .billboard-marquee-background img, .billboard-marquee-component .billboard-marquee-background picture { max-width: 2560px } .billboard-marquee-component .billboard-marquee-component-outter-wrapper { height: calc(100vh - 208px) } } .magazine-marquee-component { position: relative } .magazine-marquee-component .magazine-marquee-content-wrapper { max-width: 1700px; padding: 4rem 0; width: 100% } .magazine-marquee-component .magazine-marquee-header-section { padding: 0 2rem } .magazine-marquee-component .magazine-marquee-eyebrow, .magazine-marquee-component .magazine-marquee-eyebrow span { font-family: GilroySemiBold; font-size: 1.4rem; letter-spacing: .05rem; line-height: 1.5 } .magazine-marquee-component .magazine-marquee-subtitle p, .magazine-marquee-component .magazine-marquee-title h1 { margin: 0; padding: 0 } .magazine-marquee-component .magazine-marquee-eyebrow, .magazine-marquee-component .magazine-marquee-title { margin-bottom: .8rem } .magazine-marquee-component .magazine-marquee-text-cta-section-cta { margin-bottom: -3.2rem; margin-top: 3.2rem } .magazine-marquee-component .magazine-marquee-text-cta-section-cta .cta-component { margin-bottom: 32px; margin-right: 32px; margin-top: 0 } .magazine-marquee-component .cta-component { margin-top: 0 } .magazine-marquee-component .magazine-marquee-background, .magazine-marquee-component .magazine-marquee-background img, .magazine-marquee-component .magazine-marquee-background picture { height: auto; width: 100% } @media only screen and (min-width: 768px) { .magazine-marquee-component { align-items: center; display: flex; flex-direction: column; justify-content: center; max-height: 48rem; min-height: 48rem; position: relative } .magazine-marquee-component .magazine-marquee-header-section { padding: 0 3rem } .magazine-marquee-component .magazine-marquee-eyebrow, .magazine-marquee-component .magazine-marquee-eyebrow span { font-size: 1.8rem } .magazine-marquee-component .magazine-marquee-background { height: 100%; left: auto; margin: 0; max-width: 50%; position: absolute; right: 0; top: 0; width: 100% } .magazine-marquee-component .magazine-marquee-background img, .magazine-marquee-component .magazine-marquee-background picture { height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center top; object-position: center top; position: absolute; top: 0; z-index: 1 } } @media only screen and (min-width: 1024px) { .magazine-marquee-component { height: calc(100vh - 208px); max-height: 72rem; min-height: 50rem } .magazine-marquee-component .magazine-marquee-header-section { padding: 0 4rem } .magazine-marquee-component .magazine-marquee-title { margin-bottom: 1.6rem } .magazine-marquee-component .magazine-marquee-text-cta-section-cta { margin-top: 4rem } .magazine-marquee-component .magazine-marquee-text-cta-section-cta .cta-component { margin-bottom: 4rem; margin-right: 4rem } } @media only screen and (min-width: 1700px) { .magazine-marquee-component { max-height: 90rem; min-height: 68rem } .magazine-marquee-component .magazine-marquee-background, .magazine-marquee-component .magazine-marquee-background img, .magazine-marquee-component .magazine-marquee-background picture { height: 100%; top: 0; width: 100% } } .component-overlay-speaker-container { background-color: #fff; height: 100vh; opacity: 0; overflow-x: hidden; overflow-y: scroll; overscroll-behavior-y: none; position: fixed; top: 0; width: 100%; z-index: -1 } .component-overlay-speaker-container .component-overlay-speaker-left-col, .component-overlay-speaker-container .component-overlay-speaker-right-col { opacity: 0; right: -10%; z-index: -1 } .component-overlay-speaker-container .component-overlay-speaker-left-col .component-overlay-speaker-left-background:before { bottom: 0; content: ""; display: block; height: 100%; left: -100%; position: absolute; width: 1000% } .component-overlay-speaker-container .component-overlay-speaker-left-col .component-overlay-speaker-right-col-background-img { padding-top: 100% } .component-overlay-speaker-container .component-overlay-speaker-left-col .component-overlay-speaker-right-col-background-img img { bottom: 0; height: 100%; left: 50%; position: absolute; transform: translate(-50%) } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec { margin-left: -2rem; opacity: 0; padding: 0 2rem; position: fixed; z-index: -1 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec.top-menu-active { bottom: 0; opacity: 1; width: 100%; z-index: 100 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-person-info { display: inline-block; padding: 1rem 0; position: relative; vertical-align: middle } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-person-info p { color: #fff !important; margin: 0 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-person-info .person-name { font-family: GilroySemiBold } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav { display: inline-block; height: 1.6rem; line-height: 0; margin: 0; position: absolute; right: 5%; top: 50%; transform: translateY(-50%); vertical-align: middle } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn { cursor: pointer; display: inline-block } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous-btn { position: absolute; right: 4rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn.no-more-click { opacity: .4; pointer-events: none } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn svg { opacity: .6 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn:hover svg { opacity: 1 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .component-overlay-speaker-close-btn.overlay-close-btn-desktop { display: none } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .component-overlay-speaker-close-btn.overlay-close-btn-desktop svg { opacity: .6 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .component-overlay-speaker-close-btn.overlay-close-btn-desktop:hover svg { opacity: 1 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec .component-overlay-speaker-new-right-col-scroll { padding-bottom: 7.4rem; padding-top: 2.4rem } .component-overlay-speaker-container .component-overlay-speaker-close-btn.overlay-close-btn-mobile { position: fixed; right: 2rem; top: 2rem; z-index: 10000 } .component-overlay-speaker-container .component-overlay-speaker-close-btn.overlay-close-btn-mobile svg g { stroke: #293e40 } .component-overlay-speaker-container.single-overlay .overlay-nav-btn { display: none !important } .component-overlay-speaker-container.overlay-modal-open { opacity: 1; z-index: 99997 } .component-overlay-speaker-container.overlay-modal-open.no-slide-in-effect .component-overlay-speaker-left-col { right: 0 !important } .component-overlay-speaker-container .component-overlay-speaker { height: 0 } .component-overlay-speaker-container .component-overlay-speaker.active-overlay { height: auto } .component-overlay-speaker-container .component-overlay-speaker.active-overlay .component-overlay-speaker-left-col { opacity: 1; right: 0; z-index: 9998 } .component-overlay-speaker-container .component-overlay-speaker.active-overlay .component-overlay-speaker-right-col { opacity: 1; right: 0; z-index: 9999 } .component-overlay-speaker-container .component-overlay-speaker.active-overlay .component-overlay-speaker-left-col.overlay-col-fade-in { transition: all .25s linear .15s } .component-overlay-speaker-container .component-overlay-speaker.active-overlay .component-overlay-speaker-left-col.overlay-col-slide-in, .component-overlay-speaker-container .component-overlay-speaker.active-overlay .component-overlay-speaker-right-col.overlay-col-slide-in { transition: all .25s linear } .component-overlay-speaker-container .component-overlay-speaker.no-transition .component-overlay-speaker-left-col, .component-overlay-speaker-container .component-overlay-speaker.no-transition .component-overlay-speaker-right-col { transition: none !important } .component-overlay-speaker-container .component-overlay-speaker.hide-image-section .component-overlay-speaker-left-col { display: none !important } .component-overlay-speaker-container .component-overlay-speaker.hide-image-section .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec .component-overlay-speaker-new-right-col-scroll { padding-top: 8rem } .component-overlay-speaker-container .eventSpeaker { margin-bottom: 2.4rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper { flex-direction: row; gap: 2rem; padding: 0 } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .event-speaker-img { align-self: center; flex: 3 } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .event-speaker-img .img-wrapper { margin: 0; max-height: unset; max-width: unset } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec { align-self: center; flex: 9 } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-job-title, .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec h3 { font-size: 2rem; line-height: 2.6rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-list-item-designation { margin-bottom: 0 } .component-overlay-speaker-container .eventHeader .text-component h4 { font-family: GilroyRegular; font-size: 2rem; font-style: normal; line-height: 2.6rem } .component-overlay-speaker-container .eventHeader .text-component h4:before { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAkCAYAAADLsGk3AAAAAXNSR0IArs4c6QAABnVJREFUWAm1WX1sFEUUnzd7hRaLKJRC/Qr8YZS2oLUR9R+610KbAo1AcpBAAgLGiIoGAibGP6gG/AJBjYIhEYyiCVaNpkqBtPfRogJJIUrvSAwSo4ZA70Ba+t27HX9zl2u3d7u3e9dzknZn3tdv3rydN2/2iGXQ5ldVTbsVEdtJiKUOUp7+zdt8OgMztlTK1bqCAdGzXWNiMVf4Rr/bfdZIkYyIZrTyhQunDIS17ZqmvQiZyVIOBoYF0asBr3sPEQkz3XTpD6vL7hgSXS8zJjYLwfLjWHi+4vd59iZi2Xak2OmsYhFxGDO912hSRKwpjyavbfc2hoz46dBKK6oWRZh2mAlxt7Ee/Tg5h68729JyPc63dOQJlyuvqzP0thDiBShZyNMVh8JWX/B4fHGAdJ7ldXWT+rp63kEUnrPCwsL9w5iyOuBraZMYKSc2d8mSO8M9vceYYI/bnhBRhDP2ustZsbO+vl6zq1dSUzNV9A81CSbm29VhwELUdqyqVN80daS8pqaob2DwBJyYa9uwThCGPw60ejfpSKbdskWL7hocCp9E1EtMhVIy6CMsXnIrq62d3j8w1JaJE8ToJ8aV5Ssr1eeTLSdT5lVXFw4MDp/KxAm8XqdIoWUBn3tzUkRcLpfivxY6gRBXJcOmoBB9m0PK7nRSscTq6Aw2Y8HUFJaTWFisb5jCdgc8njNxpiPeiT87gtd3YbOl40RQ4cqGDm/LD3Ebdp/+a8G3IKvalYcDncia6wOtnmOJOmMiUqouVCNa2JMoZDaG4RPE857ye49dNZMxo5dUVlZqYa3FjJ9Il+mdO5T1HS0t1xJ5cjyyR5BhuCbCe42EkmgyMxFt9fvctZk4EcUKi31Jdg0IcCCMw++lgM+72MwJqTbyajV4W9fiBC0zsDWWJFMeiTV+r/coAMbybI6AtQGv7zwrcekE1hpnhbvBSjYaEblCQhOvWQlLPiex8SKcsCNrJCM3uBDaDiNeEo2U9XackHqK/Bckqkb6s06XRPsR4jekTqZNFMyohe4mK31E+wM4gVPeXotGRGgMoU7dEOZLvLBgS2opay5eRkssFBy/5z1w/zZra6MSVKK68jURCuGonzhKTu5FDx6P5/tkjn3KY7W1t9/q7Q8hheak0kI6r0s3nTuYuPGopROMAjh8xuWEnHh3/7Cso1I6gervQrpOSNsOwTQbBaE4VFJVVcyGta2oAudArwB/slw/zxXW2OF2n0y8H4Bn0KyxOPFD89Tq0rAY3oIs+iCMRLGIiXPcwaNYBoYZFS9wfody5EkjZpyG/YGSmc2E4ZF0HefJJ5z4FTfFZ63KkzkVaiPKkaV63cQ+9tDfiEqRORY7j9S5SV+eSBscZ8J9icYSxzB6j5lhKYuM91BYhNtKKpzPJOqOGQuyxsLFLTUWzrqIaJujqhv1tpG1aKqekGlfgmuCHShd4FxhZgM34exgyX2m0UHcWkfeJI7VzIrx2OQF14jtR2l+m6EzIjuLFscSEXFA3irlGCUTyzMEzZCIhZkRHgwbnhVIu7kZmjVTK+rr7l0nmRzGb5pJZU7XFhvpIvN0GdHHR4thcWSJ7Dsi6BGjyf0viyZYucTiTNBfRqDjoQli02Qhmmwj+1gIhDxn5H1EnE0GHCdFCKXxypVoQaq3hPBnHQtRdsiKmjOFTuvBstHHKv3bfvDgcKItfIfMOhYOz+sNDQ0RPqWg4KQETgQdzxiv1h9G+hOn5B9HGZDVDU+Colj8l4aGfuL8MyPgTGlIhceNdNsbG/vw4ftzI17GNE5RrNiGdHB8FGY9GRvTK+IqrCh0RE/S9yfw3HdRm/XqaZn2Meew0JQvpH7shnj5ctf0WbOlcXl7G18j+sTv9XxqZuTqn5duFs6a3Y9NWmMmY5eOLXHwYqs7+jbFIgLNlc6KD7FSX9k1YiSHFTrPqWCrEU9Pw3fh9yH7tZ6Wdp+o3ZE7YVtcD06NNlWtdwQ13xH8qLJqlGqzR+w0p0nL7X4eklidwvclShqXTQSdGP2s5PAV+s9DYxyJS5YscK6GM3swLorTzJ/UjdV9D3fsnUYp11wvxilW1TW4o+xB9TzTSlZmPCSLfYVc3eX11uNT0WgzdESyo7+LhELVTGMolUUZSDMBOA3PHsEoiHvMOVxmPLk5ytH25uZxpVSJdTN4o4ZEBFgELDEjhkW3sJdCMSzuzp808eiZpqZuOb/E9h/pUlKEVNCHKQAAAABJRU5ErkJggg=="); background-position: 0 0; background-repeat: no-repeat; background-size: 100%; content: ""; display: block; height: 1.6rem; left: 0; margin-bottom: .8rem; position: relative; top: 0; width: 1.6rem } .component-overlay-speaker-container .eventSession { margin: 4.8rem 0 } .component-overlay-speaker-container .eventSession .event-session { flex-direction: column; padding: 0; width: calc(100% - 2rem) } .component-overlay-speaker-container .eventSession .event-session .event-session-title-wrapper { margin-bottom: 2.4rem } .component-overlay-speaker-container .eventSession .event-session .event-session-card-title { padding-bottom: .8rem } .component-overlay-speaker-container .eventSession .event-session .event-session-card-description p { margin: 0 } .component-overlay-speaker-container .eventSession .event-session .event-session-card-date-time { color: #5b6f70; margin: 1.6rem 0 } .component-overlay-speaker-container .eventSession .event-session .event-session-card-date-time .event-session-card-date, .component-overlay-speaker-container .eventSession .event-session .event-session-card-date-time .event-session-card-time { font-size: 12px } .component-overlay-speaker-container .eventSession .event-session .event-session-card-cta { display: flex; flex-wrap: wrap } .component-overlay-speaker-container .eventSession .event-session .event-session-card-cta .event-session-card-cta-2 { align-self: center } @media only screen and (min-width: 768px) { .component-overlay-speaker-container .component-overlay-speaker-left-col .component-overlay-speaker-right-col-background-img { padding-top: 56.25% } .component-overlay-speaker-container .component-overlay-speaker-left-col .component-overlay-speaker-right-col-background-img img { height: 115% } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec { margin-left: -3rem; padding: 0 3rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper { gap: 3rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-job-title, .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec h3 { font-size: 2.4rem; line-height: 3.12rem } .component-overlay-speaker-container .eventHeader .text-component h4 { font-size: 2.4rem; line-height: 3.1rem } .component-overlay-speaker-container .eventSession .event-session { width: calc(100% - 1.2rem) } .component-overlay-speaker-container .eventSession .event-session .event-session-title { font-size: 2.2rem } .component-overlay-speaker-container .eventSession .event-session .event-session-card-title { padding-bottom: .8rem } } @media only screen and (min-width: 1024px) { .component-overlay-speaker-container { overflow-y: hidden } .component-overlay-speaker-container .component-overlay-speaker-left-col .component-overlay-speaker-right-col-background-img img { height: 100% } .component-overlay-speaker-container .component-overlay-speaker-right-col:before { bottom: 0; content: ""; display: block; height: 100%; position: absolute; right: -1000%; width: 1000% } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec { bottom: unset; margin-left: 0; padding: 0 0 0 2.4rem; position: relative } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-person-info { padding: 3.2rem 0 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav { right: 0 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous-btn { right: 11.2rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next-btn { position: absolute; right: 5.6rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .component-overlay-speaker-close-btn.overlay-close-btn-desktop { display: inline-block } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec:before { content: ""; display: block; height: 100%; left: -2rem; position: absolute; width: 1000% } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec { overflow-y: scroll; padding-left: 2.4rem; scrollbar-width: none } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec::-webkit-scrollbar { display: none } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec .component-overlay-speaker-new-right-col-scroll { padding-bottom: 4.8rem; padding-top: 4.8rem } .component-overlay-speaker-container .component-overlay-speaker-close-btn.overlay-close-btn-mobile { display: none } .component-overlay-speaker-container .component-overlay-speaker.hide-image-section .component-overlay-speaker-left-col { display: unset !important } .component-overlay-speaker-container .component-overlay-speaker.hide-image-section .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec .component-overlay-speaker-new-right-col-scroll { padding-top: 4.8rem } .component-overlay-speaker-container .eventSpeaker { margin-bottom: 4rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper { gap: 4rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .event-speaker-img { flex: 4 } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec { flex: 8 } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec h3 { font-size: 2.8rem; line-height: 3.64rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-job-title { font-size: 2rem; line-height: 3.4rem } .component-overlay-speaker-container .eventHeader .text-component h4 { font-size: 2.8rem; line-height: 3.6rem } .component-overlay-speaker-container .eventSession { margin: 4rem 0 } .component-overlay-speaker-container .eventSession .event-session { width: 100% } .component-overlay-speaker-container .eventSession .event-session .event-session-card-title { padding-bottom: 1.6rem } .component-overlay-speaker-container .eventSession .event-session .event-session-card-date-time { margin: 2.4rem 0 } .component-overlay-speaker-container .eventSession .event-session .cta-component a { font-size: 1.8rem } } @media only screen and (min-width: 1700px) { .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec { padding-left: 6.4rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-person-info { padding: 5.6rem 0 } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-previous-btn { right: 10.4rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-nav-sec .overlay-nav .overlay-nav-btn.overlay-nav-next-btn { right: 4.8rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec { padding-left: 6.4rem } .component-overlay-speaker-container .component-overlay-speaker-right-col .component-overlay-speaker-right-col-text-sec .component-overlay-speaker-new-right-col-scroll { padding-bottom: 5.6rem; padding-top: 5.6rem } .component-overlay-speaker-container .eventSpeaker { margin-bottom: 5.6rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec h3 { font-size: 2.8rem; line-height: 4.68rem } .component-overlay-speaker-container .eventSpeaker .event-speaker-wrapper .icon-link-sec-text-sec .icon-link-sec-job-title { font-size: 2.2rem; line-height: 3.7rem } .component-overlay-speaker-container .eventHeader .text-component h4 { font-size: 3.6rem; line-height: 4.7rem } .component-overlay-speaker-container .eventSession { margin: 5.6rem 0 } .component-overlay-speaker-container .eventSession .event-session .event-session-title { font-size: 2.4rem } .component-overlay-speaker-container .eventSession .event-session .event-session-card-title { padding-bottom: 2.4rem } } /*! Video.js Default Styles (http://videojs.com) Version GENERATED_AT_BUILD Create your own skin at http://designer.videojs.com */ .vjs-default-skin { color: #ccc } @font-face { font-display: swap; font-family: VideoJS; font-style: normal; font-weight: 400; src: url(../../../etc.clientlibs/servicenow-www/clientlibs/servicenow-www-fonts/resources/vjs.eot); src: url(../../../etc.clientlibs/servicenow-www/clientlibs/servicenow-www-fonts/resources/vjs.eot?#iefix) format("embedded-opentype"),url(../../../etc.clientlibs/servicenow-www/clientlibs/servicenow-www-fonts/resources/vjs.woff) format("woff"),url(../../../etc.clientlibs/servicenow-www/clientlibs/servicenow-www-fonts/resources/vjs.ttf) format("truetype") } .vjs-default-skin .vjs-slider { background-color: #333; background-color: rgba(51,51,51,.9); cursor: pointer; outline: 0; padding: 0; position: relative } .vjs-default-skin .vjs-slider:focus { box-shadow: 0 0 2em #fff } .vjs-default-skin .vjs-slider-handle { left: 0; position: absolute; top: 0 } .vjs-default-skin .vjs-slider-handle:before { content: ""; font-family: VideoJS; font-size: 1em; left: 0; line-height: 1; position: absolute; text-align: center; text-shadow: 0 0 1em #fff; top: 0; transform: rotate(-45deg) } .vjs-default-skin .vjs-control-bar { background-color: #07141e; background-color: rgba(7,20,30,.7); bottom: 0; display: none; height: 3em; left: 0; position: absolute; right: 0 } .vjs-default-skin.vjs-has-started .vjs-control-bar { display: block; opacity: 1; transition: visibility .1s,opacity .1s; visibility: visible } .vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar { display: block; opacity: 0; transition: visibility 1s,opacity 1s; visibility: hidden } .vjs-default-skin.vjs-controls-disabled .vjs-control-bar, .vjs-default-skin.vjs-using-native-controls .vjs-control-bar { display: none } @media �screen { .vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before { content: "" } } .vjs-default-skin .vjs-control { float: left; height: 3em; margin: 0; outline: none; padding: 0; position: relative; text-align: center; width: 4em } .vjs-default-skin .vjs-control:before { font-family: VideoJS; font-size: 1.5em; height: 100%; left: 0; line-height: 2; position: absolute; text-align: center; text-shadow: 1px 1px 1px rgba(0,0,0,.5); top: 0; width: 100% } .vjs-default-skin .vjs-control:focus:before, .vjs-default-skin .vjs-control:hover:before { text-shadow: 0 0 1em #fff } .vjs-default-skin .vjs-control-text { clip: rect(0 0 0 0); border: 0; height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px } .vjs-default-skin .vjs-play-control { cursor: pointer; width: 5em } .vjs-default-skin .vjs-play-control:before { content: "" } .vjs-default-skin.vjs-playing .vjs-play-control:before { content: "" } .vjs-default-skin .vjs-mute-control, .vjs-default-skin .vjs-volume-menu-button { cursor: pointer; float: right } .vjs-default-skin .vjs-mute-control:before, .vjs-default-skin .vjs-volume-menu-button:before { content: "" } .vjs-default-skin .vjs-mute-control.vjs-vol-0:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before { content: "" } .vjs-default-skin .vjs-mute-control.vjs-vol-1:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before { content: "" } .vjs-default-skin .vjs-mute-control.vjs-vol-2:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before { content: "" } .vjs-default-skin .vjs-volume-control { float: right; width: 5em } .vjs-default-skin .vjs-volume-bar { height: .6em; margin: 1.1em auto 0; width: 5em } .vjs-default-skin .vjs-volume-menu-button .vjs-menu-content { height: 2.9em } .vjs-default-skin .vjs-volume-level { background: #66a8cc url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC") -50% 0 repeat; height: .5em; left: 0; position: absolute; top: 0 } .vjs-default-skin .vjs-volume-bar .vjs-volume-handle { height: .5em; width: .5em } .vjs-default-skin .vjs-volume-handle:before { font-size: .9em; height: 1em; left: -.2em; top: -.2em; width: 1em } .vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content { left: -4em; width: 6em } .vjs-default-skin .vjs-progress-control { font-size: .3em; height: 1em; left: 0; position: absolute; right: 0; top: -1em; transition: all .4s; width: auto } .vjs-default-skin:hover .vjs-progress-control { font-size: .9em; transition: all .2s } .vjs-default-skin .vjs-progress-holder { height: 100% } .vjs-default-skin .vjs-progress-holder .vjs-load-progress, .vjs-default-skin .vjs-progress-holder .vjs-play-progress { display: block; height: 100%; left: 0; margin: 0; padding: 0; position: absolute; top: 0 } .vjs-default-skin .vjs-play-progress { background: #66a8cc url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC") -50% 0 repeat } .vjs-default-skin .vjs-load-progress { background: #646464; background: hsla(0,0%,100%,.4) } .vjs-default-skin .vjs-seek-handle { height: 100%; width: 1.5em } .vjs-default-skin .vjs-seek-handle:before { padding-top: .1em } .vjs-default-skin .vjs-time-controls { font-size: 1em; line-height: 3em } .vjs-default-skin .vjs-current-time, .vjs-default-skin .vjs-duration { float: left } .vjs-default-skin .vjs-remaining-time { display: none; float: left } .vjs-time-divider { float: left; line-height: 3em } .vjs-default-skin .vjs-fullscreen-control { cursor: pointer; float: right; width: 3.8em } .vjs-default-skin .vjs-fullscreen-control:before { content: "" } .vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before { content: "" } .vjs-default-skin .vjs-big-play-button { background-color: #07141e; background-color: rgba(7,20,30,.7); border: .1em solid #3b4249; border-radius: .8em; box-shadow: 0 0 1em hsla(0,0%,100%,.25); cursor: pointer; display: block; font-size: 3em; height: 2.6em; left: .5em; opacity: 1; position: absolute; text-align: center; top: .5em; transition: all .4s; vertical-align: middle; width: 4em; z-index: 2 } .vjs-default-skin.vjs-big-play-centered .vjs-big-play-button { left: 50%; margin-left: -2.1em; margin-top: -1.4em; top: 50% } .vjs-default-skin.vjs-controls-disabled .vjs-big-play-button, .vjs-default-skin.vjs-has-started .vjs-big-play-button, .vjs-default-skin.vjs-using-native-controls .vjs-big-play-button { display: none } .vjs-default-skin .vjs-big-play-button:focus, .vjs-default-skin:hover .vjs-big-play-button { background-color: #505050; background-color: rgba(10,20,50,.75); border-color: #fff; box-shadow: 0 0 3em #fff; outline: 0; transition: all 0s } .vjs-default-skin .vjs-big-play-button:before { content: ""; font-family: VideoJS; height: 100%; left: 0; line-height: 2.6em; position: absolute; text-align: center; text-shadow: .05em .05em .1em #000; width: 100% } .vjs-loading-spinner { animation: spin 1.5s linear infinite; display: none; font-size: 4em; height: 1em; left: 50%; line-height: 1; margin-left: -.5em; margin-top: -.5em; opacity: .75; position: absolute; top: 50%; width: 1em } .vjs-default-skin .vjs-loading-spinner:before { content: ""; font-family: VideoJS; height: 1em; left: 0; position: absolute; text-align: center; text-shadow: 0 0 .1em #000; top: 0; width: 1em } @keyframes spin { 0% { transform: rotate(0deg) } to { transform: rotate(359deg) } } .vjs-default-skin .vjs-menu-button { cursor: pointer; float: right } .vjs-default-skin .vjs-menu { border-left: 2em solid transparent; border-right: 2em solid transparent; border-top: 1.55em solid rgba(7,40,50,.5); bottom: 0; display: none; height: 0; left: 0; margin-bottom: 3em; position: absolute; width: 0 } .vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content { background-color: #07141e; background-color: rgba(7,20,30,.7); bottom: 1.5em; box-shadow: -.2em -.2em .3em hsla(0,0%,100%,.2); display: block; left: -5em; margin: 0; max-height: 15em; overflow: auto; padding: 0; position: absolute; width: 10em } .vjs-default-skin .vjs-menu-button:hover .vjs-menu { display: block } .vjs-default-skin .vjs-menu-button ul li { font-size: 1.2em; line-height: 1.4em; list-style: none; margin: 0; padding: .3em 0; text-align: center; text-transform: lowercase } .vjs-default-skin .vjs-menu-button ul li.vjs-selected { background-color: #000 } .vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus, .vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover, .vjs-default-skin .vjs-menu-button ul li:focus, .vjs-default-skin .vjs-menu-button ul li:hover { background-color: #fff; background-color: hsla(0,0%,100%,.75); box-shadow: 0 0 1em #fff; color: #111; outline: 0 } .vjs-default-skin .vjs-menu-button ul li.vjs-menu-title { cursor: default; font-size: 1em; font-weight: 700; line-height: 2em; margin: 0 0 .3em; padding: 0; text-align: center; text-transform: uppercase } .vjs-default-skin .vjs-subtitles-button:before { content: "" } .vjs-default-skin .vjs-captions-button:before { content: "" } .vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before, .vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before { box-shadow: 0 0 1em #fff } .video-js { background-color: #000; font-family: Arial,sans-serif; font-size: 10px; font-style: normal; font-weight: 400; padding: 0; position: relative; -webkit-user-select: none; -moz-user-select: none; user-select: none; vertical-align: middle } .video-js .vjs-tech { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .video-js:-moz-full-screen { position: absolute } body.vjs-full-window { height: 100%; margin: 0; overflow-y: auto; padding: 0 } .video-js.vjs-fullscreen { bottom: 0; height: 100% !important; left: 0; overflow: hidden; position: fixed; _position: absolute; right: 0; top: 0; width: 100% !important; z-index: 1000 } .video-js:-webkit-full-screen { height: 100% !important; width: 100% !important } .video-js.vjs-fullscreen.vjs-user-inactive { cursor: none } .vjs-poster { background-position: 50% 50%; background-repeat: no-repeat; background-size: contain; cursor: pointer; height: 100%; margin: 0; padding: 0; position: relative; width: 100% } .vjs-poster img { display: block; margin: 0 auto; max-height: 100%; padding: 0; width: 100% } .video-js.vjs-using-native-controls .vjs-poster { display: none } .video-js .vjs-text-track-display { bottom: 4em; left: 1em; position: absolute; right: 1em; text-align: center } .video-js .vjs-text-track { background-color: #000; background-color: rgba(0,0,0,.5); display: none; font-size: 1.4em; margin-bottom: .1em; text-align: center } .video-js .vjs-subtitles { color: #fff } .video-js .vjs-captions { color: #fc6 } .vjs-tt-cue { display: block } .vjs-default-skin .vjs-hidden { display: none } .vjs-lock-showing { display: block !important; opacity: 1; visibility: visible } .video-js .vjs-overlay { color: #fff; position: absolute; text-align: center } .video-js .vjs-overlay-no-background { max-width: 33% } .video-js .vjs-overlay-background { background-color: #646464; background-color: hsla(0,0%,100%,.4); border-radius: 3px; padding: 10px; width: 33% } .video-js .vjs-overlay-top-left { left: 5px; top: 5px } .video-js .vjs-overlay-top { left: 50%; margin-left: -16.5%; top: 5px } .video-js .vjs-overlay-top-right { right: 5px; top: 5px } .video-js .vjs-overlay-right { right: 5px; top: 50%; transform: translateY(-50%) } .video-js .vjs-overlay-bottom-right { bottom: 3.5em; right: 5px } .video-js .vjs-overlay-bottom { bottom: 3.5em; left: 50%; margin-left: -16.5% } .video-js .vjs-overlay-bottom-left { bottom: 3.5em; left: 5px } .video-js .vjs-overlay-left { left: 5px; top: 50%; transform: translateY(-50%) } .video-js .vjs-overlay-center { left: 50%; margin-left: -16.5%; top: 50%; transform: translateY(-50%) } .video-js .vjs-no-flex .vjs-overlay-center, .video-js .vjs-no-flex .vjs-overlay-left, .video-js .vjs-no-flex .vjs-overlay-right { margin-top: -15px } .search-container { -webkit-font-smoothing: antialiased; background: #fff; box-shadow: 0 3px 10px 3px rgba(41,62,64,.1); display: flex; flex-direction: column; justify-content: space-between; position: relative } .search-container .search-icon-container { background: url(../../../content/dam/servicenow-assets/images/meganav/search-icon.svg) 20px no-repeat; flex-grow: 1 } .search-container input, .search-container select { background: none; border: none; border-radius: 0; color: #293e40; flex-grow: 1; font-family: GilroyRegular; height: 64px; padding-left: 5.2rem; padding-right: 2.4rem; position: relative; width: 100% } .search-container input:focus, .search-container select:focus { outline-color: #81b5a1; outline-offset: 0; outline-style: solid; outline-width: 1px } .search-container #search-input-all { display: block } .search-container #search-input-mobile { display: none } .search-container .job-search, .search-container .search-btn { background: #293e40; color: #fff !important; font-family: GilroySemiBold; font-size: 1.6rem; height: 64px; line-height: 1.7; outline: none; padding-left: 40px; padding-right: 40px; transition: background-color .3s; white-space: nowrap; width: 100% } .search-container .job-search:hover, .search-container .search-btn:hover { background-color: #3e5153; cursor: pointer } .search-container a.job-search { align-items: center; display: flex; justify-content: center } .search-container select { -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: transparent !important; border: none; border-radius: 0 0 0 0; display: block; flex-grow: 1; font-family: GilroyRegular; line-height: 2.5; padding-left: 4.9rem } .search-container .select-icon-container { background: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-location.svg) 20px no-repeat; border-left: 0; border-top: .2rem solid rgba(41,62,64,.13); flex-grow: 1; position: relative } .search-container .select-icon-container:before { background-image: url(../../../content/dam/servicenow-assets/images/unauthorable/icon-carret-right.svg); background-repeat: no-repeat; content: ""; height: 2.5rem; left: 1.6rem; left: unset; pointer-events: none; position: absolute; right: 1.6rem; top: 1.1rem; top: 2.8rem; transform: rotate(90deg); width: 2.5rem } @media(min-width: 768px) { .search-container .search-icon-container { background-position-x: 20px } .search-container .job-search, .search-container .search-btn { font-size: 1.8rem; height: 80px; min-width: 154px; width: auto } .search-container input, .search-container select { height: 80px; padding-left: 5.2rem; padding-right: 2.4rem } .search-container input { font-size: 1.8rem } .search-container #search-input-all { display: none } .search-container #search-input-mobile { display: block } .search-container .select-icon-container { background-position-x: 30px } .search-container .select-icon-container:after { left: 4rem; top: 1.5rem } .search-container .select-icon-container:before { right: 4rem; top: 3.2rem } } @media(min-width: 1024px) { .search-container { flex-direction: row; margin-top: 80px } .search-container .search-icon-container { background-position-x: 28px } .search-container .job-search, .search-container .search-btn { min-width: 206px } .search-container input, .search-container select { padding-left: 6.4rem; padding-right: 3.2rem } .search-container .select-icon-container { border-left: .2rem solid rgba(41,62,64,.13); border-top: none } .search-container .select-icon-container:after { left: 2.4rem; top: 2rem } .search-container .select-icon-container:before { right: 2.4rem; top: 3.6rem } } @media(min-width: 1700px) { .search-container .job-search, .search-container .search-btn { font-size: 2rem; height: 96px; min-width: 236px } .search-container input, .search-container select { height: 96px } .search-container input { font-size: 2rem } .search-container .select-icon-container:after { left: 4rem; top: 3.5rem } .search-container .select-icon-container:before { right: 4rem; top: 4rem } }