.header-title-banner { padding-top: 108px; margin-bottom: 96px; } .header-title-banner .title { margin: 0 0 48px; color: #1E1E1E; font-size: 1.75rem; font-weight: 700; line-height: 1.33; } .header-title-banner .hero-banner { overflow: hidden; border-radius: 24px; height: 420px; position: relative; display: flex; width: 100%; } .header-title-banner .hero-banner img { display: block; position: absolute; top: 0; left: 50%; -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); height: 100%; min-width: 1200px; } @media (max-width: 1199px) { .header-title-banner { margin-bottom: 80px; } } @media (max-width: 991px) { .header-title-banner { margin-bottom: 64px; } .header-title-banner .hero-banner { height: 400px; border-radius: 16px; } } @media (max-width: 767px) { .header-title-banner { padding-top: 92px; margin-bottom: 80px; } .header-title-banner .title { margin: 0 0 32px; font-size: 1.5rem; } .header-title-banner .hero-banner { height: 360px; } } @media (max-width: 575px) { .header-title-banner { margin-bottom: 64px; } .header-title-banner .hero-banner { height: 320px; } .header-title-banner .hero-banner img { min-width: 535px; } }.title-text-bottom-video-block .content { max-width: 794px; width: 100%; margin: 0 auto; } .title-text-bottom-video-block .content .text-block { margin: 0 0 64px; } .title-text-bottom-video-block .content .title { text-align: center; margin: 0 0 24px; } .title-text-bottom-video-block .content .text { color: rgba(60, 60, 60, 0.8); font-size: 1.25em; line-height: 1.5; margin: 0 0 20px; } .title-text-bottom-video-block .video { position: relative; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 24px; overflow: hidden; z-index: 1; } .title-text-bottom-video-block .video img { width: 100%; -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s; -ms-transition: .3s; transition: .3s; } .title-text-bottom-video-block .video:hover img { -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-transition: .3s; -moz-transition: .3s; -o-transition: .3s; -ms-transition: .3s; transition: .3s; } .title-text-bottom-video-block .video .btn-play { position: absolute; width: 64px; height: 64px; display: flex; justify-content: center; align-items: center; background: rgba(28, 28, 28, 0.60); -webkit-backdrop-filter: blur(10px); -moz-backdrop-filter: blur(10px); -o-backdrop-filter: blur(10px); -ms-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: 50%; z-index: 1; } .title-text-bottom-video-block .video .btn-play:focus-visible { -webkit-backdrop-filter: none; backdrop-filter: none; -moz-box-shadow: var(--common-focus-box-shadow);; -webkit-box-shadow: var(--common-focus-box-shadow);; -o-box-shadow: var(--common-focus-box-shadow);; -ms-box-shadow: var(--common-focus-box-shadow);; box-shadow: var(--common-focus-box-shadow);; outline: none; } .title-text-bottom-video-block .video .btn-play:before { content: ''; position: relative; display: flex; width: 24px; height: 25px; background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/common/icon-play-grey.svg?1706869285"); background-repeat: no-repeat; background-size: contain; } @media (max-width: 1199px) { .title-text-bottom-video-block .content { max-width: 699px; } .title-text-bottom-video-block .content .text-block { margin: 0 0 56px; } } @media (max-width: 991px) { .title-text-bottom-video-block .content { max-width: 704px; } .title-text-bottom-video-block .content .text-block { margin: 0 0 48px; } .title-text-bottom-video-block .content .text { font-size: 1.125em; } .title-text-bottom-video-block .video img { -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .title-text-bottom-video-block .video:hover img { -moz-transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; transform: none; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } } @media (max-width: 767px) { .title-text-bottom-video-block .content .title { margin: 0 0 16px; } .title-text-bottom-video-block .content .text-block { margin: 0 0 40px; } .title-text-bottom-video-block .content .text { font-size: 1em; } } @media (max-width: 575px) { .title-text-bottom-video-block .container { padding: 0; } .title-text-bottom-video-block .content .text-block { padding: 0 20px; } .title-text-bottom-video-block .text-block .btn-link { width: 100%; } .title-text-bottom-video-block .video { margin-bottom: 0; border-radius: 0; overflow: unset; } }.text-asset-blocks-scroll-magic .content { position: relative; max-width: 1240px; padding: 0 20px; width: 100%; margin: 0 auto; } .text-asset-blocks-scroll-magic .highlight-case > .trigger { position: absolute; top: 208px; } .text-asset-blocks-scroll-magic .highlight-case #trigger-screen-in-2, .text-asset-blocks-scroll-magic .highlight-case #trigger-screen-in-3, .text-asset-blocks-scroll-magic .highlight-case #trigger-screen-in-4, .text-asset-blocks-scroll-magic .highlight-case #trigger-screen-in-5 { position: absolute; top: -27px; } .text-asset-blocks-scroll-magic .highlight-case .container > .trigger:nth-of-type(1) { top: calc(497px); } .text-asset-blocks-scroll-magic .highlight-case .container > .trigger:nth-of-type(2) { top: calc(2 * 497px); } .text-asset-blocks-scroll-magic .highlight-case .container > .trigger:nth-of-type(3) { top: calc(3 * 497px); } .text-asset-blocks-scroll-magic .highlight-case .container > .trigger:nth-of-type(4) { top: calc(4 * 497px); } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card { position: relative; display: flex; justify-content: center; align-items: center; width: 548px; height: 500px; opacity: 0; -webkit-transform: translate(0, 100px); -moz-transform: translate(0, 100px); -ms-transform: translate(0, 100px); -o-transform: translate(0, 100px); transform: translate(0, 100px); -webkit-transition: transform 1s ease-in-out, opacity 1s ease-in-out; -moz-transition: transform 1s ease-in-out, opacity 1s ease-in-out; -o-transition: transform 1s ease-in-out, opacity 1s ease-in-out; -ms-transition: transform 1s ease-in-out, opacity 1s ease-in-out; transition: transform 1s ease-in-out, opacity 1s ease-in-out; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { display: flex; flex-direction: column; justify-content: center; height: 417px; padding: 40px; border-radius: 24px; background-color: #F8F8F8; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block h3 { font-size: 2em; margin: 0 0 24px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block p { color: #3C3C3C; font-size: 1.25em; line-height: 1.5; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card.active { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; } .text-asset-blocks-scroll-magic .highlight-case .mobile-case-screen, .text-asset-blocks-scroll-magic .highlight-case .mobile-img { display: none; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show-container { position: absolute; top: 0; left: calc(50% + 32px); width: 588px; height: 500px; z-index: 10; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show { position: relative; width: 100%; height: 100%; -moz-box-shadow: 0 20px 40px rgb(34 41 69 / 12%), inset 0 2px 2px rgb(255 255 255 / 25%); -webkit-box-shadow: 0 20px 40px rgb(34 41 69 / 12%), inset 0 2px 2px rgb(255 255 255 / 25%); -o-box-shadow: 0 20px 40px rgb(34 41 69 / 12%), inset 0 2px 2px rgb(255 255 255 / 25%); -ms-box-shadow: 0 20px 40px rgb(34 41 69 / 12%), inset 0 2px 2px rgb(255 255 255 / 25%); box-shadow: 0 20px 40px rgb(34 41 69 / 12%), inset 0 2px 2px rgb(255 255 255 / 25%); border-radius: 24px; overflow: hidden; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen { position: absolute; opacity: 0; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; -ms-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen.active { opacity: 1; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen:nth-of-type(1) { opacity: 1; z-index: 1; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen:nth-of-type(2) { z-index: 2; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen:nth-of-type(3) { z-index: 3; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen:nth-of-type(4) { z-index: 4; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen:nth-of-type(5) { z-index: 5; } @media (max-width: 1199px) { .text-asset-blocks-scroll-magic .content { max-width: 100%; padding: 0 64px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card { width: 428px; height: 500px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { height: 460px; border-radius: 20px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show-container { left: calc(50% + 20px); } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block p { font-size: 1.125em; } } @media (max-width: 991px) { .text-asset-blocks-scroll-magic .content { padding: 0 32px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show-container { position: static; top: unset; left: unset; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show .highlight-case-screen { position: static; opacity: 1; } .text-asset-blocks-scroll-magic .highlight-case .mobile-case-screen { display: block; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card { -webkit-transform: unset; -moz-transform: unset; -ms-transform: unset; -o-transform: unset; transform: unset; opacity: 1; } .text-asset-blocks-scroll-magic .highlight-case .mobile-img { display: flex; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-show-container { display: none; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card.active { -webkit-transform: unset; -moz-transform: unset; -ms-transform: unset; -o-transform: unset; transform: unset; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card { max-width: 535px; width: 100%; height: unset; margin: 0 auto 24px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { height: 100%; } .text-asset-blocks-scroll-magic .lazy-img-block { justify-content: center; margin: 0 0 64px; } .text-asset-blocks-scroll-magic .highlight-case .mobile-case-screen { max-width: 535px; width: 100%; border-radius: 16px; } } @media (max-width: 767px) { .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card { margin: 0 auto 20px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { padding: 40px 32px; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block h3 { font-size: 1.5em; } .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block p { font-size: 1em; } .text-asset-blocks-scroll-magic .lazy-img-block { margin: 0 0 40px; } } @media (max-width: 575px) { .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { padding: 40px 24px; } }.asset-left-text-right-slider { background: #f8f8f8; padding: 100px 0; } .asset-left-text-right-slider .title { text-align: center; margin: 0 0 64px; } .asset-left-text-right-slider .slider-block { position: relative; } .asset-left-text-right-slider .item { display: flex !important; align-items: center; justify-content: center; gap: 64px; outline: none; } .asset-left-text-right-slider .item picture { flex-shrink: 0; max-width: 588px; width: 100%; } .asset-left-text-right-slider .item picture img { width: 100%; } .asset-left-text-right-slider .text-block { padding: 0 70px 0 0; } .asset-left-text-right-slider .text-block .text { color: #3C3C3C; font-size: 1.25em; line-height: 1.5; margin: 0 0 20px; } .asset-left-text-right-slider .text-block .text:last-child { margin: 0; } .asset-left-text-right-slider .slick-prev, .asset-left-text-right-slider .slick-next, .asset-left-text-right-slider .slick-prev:hover, .asset-left-text-right-slider .slick-prev:focus, .asset-left-text-right-slider .slick-next:hover, .asset-left-text-right-slider .slick-next:focus{ border-radius: 8px; background: rgba(17, 20, 25, 0.05); width: 34px; height: 63px; z-index: 10; } .asset-left-text-right-slider .slick-prev:focus, .asset-left-text-right-slider .slick-next:focus { -moz-box-shadow: var(--common-focus-box-shadow);; -webkit-box-shadow: var(--common-focus-box-shadow);; -o-box-shadow: var(--common-focus-box-shadow);; -ms-box-shadow: var(--common-focus-box-shadow);; box-shadow: var(--common-focus-box-shadow);; border-radius: 8px; } .asset-left-text-right-slider .slick-prev.slick-disabled, .asset-left-text-right-slider .slick-next.slick-disabled { display: none !important; } .asset-left-text-right-slider .slick-prev { left: 20px; } .asset-left-text-right-slider .slick-next { right: 20px; } .asset-left-text-right-slider .slick-prev:before, .asset-left-text-right-slider .slick-next:before { content: ''; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; width: 12px; height: 20px; background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/careers/index/icons/slider-arrow.svg?1739808794"); background-position: center; background-size: contain; background-repeat: no-repeat; opacity: 1; } .asset-left-text-right-slider .slick-next:before { -moz-transform: rotate(180deg) translate(-50%, -50%); -webkit-transform: rotate(180deg) translate(-50%, -50%); -o-transform: rotate(180deg) translate(-50%, -50%); -ms-transform: rotate(180deg) translate(-50%, -50%); transform: rotate(180deg) translate(50%, 50%); } .asset-left-text-right-slider .slick-dots li { width: 10px !important; height: 10px !important; margin: 0 6px !important; } .asset-left-text-right-slider .slick-dots li button { width: 10px !important; height: 10px !important; background: #1E1E1E !important; opacity: 0.2; border-radius: 50%; } .asset-left-text-right-slider .slick-dots li.slick-active button { background: #1E1E1E; !important; opacity: 1 !important; } .asset-left-text-right-slider .slick-dots { bottom: -38px !important; } @media (max-width: 1199px) { .asset-left-text-right-slider { padding: 80px 0; } .asset-left-text-right-slider .title { margin: 0 0 56px; } .asset-left-text-right-slider .item { gap: 40px; } .asset-left-text-right-slider .item picture { max-width: 438px; } .asset-left-text-right-slider .text-block { padding: 0 58px 0 0; } .asset-left-text-right-slider .slick-dots { bottom: -30px !important; } } @media (max-width: 991px) { .asset-left-text-right-slider { padding: 64px 0; } .asset-left-text-right-slider .title { margin: 0 0 48px; } .asset-left-text-right-slider .slider-block { max-width: 704px; width: 100%; margin: 0 auto; } .asset-left-text-right-slider .item { flex-direction: column; gap: 48px; } .asset-left-text-right-slider .text-block { padding: 0; max-width: 535px; margin: 0 auto; } .asset-left-text-right-slider .item picture { max-width: 535px; } .asset-left-text-right-slider .text-block .text { font-size: 1.125em; } } @media (max-width: 767px) { .asset-left-text-right-slider { padding: 48px 0; } .asset-left-text-right-slider .title { margin: 0 0 40px; } .asset-left-text-right-slider .item { gap: 24px; } .asset-left-text-right-slider .text-block .text { font-size: 1em; } .asset-left-text-right-slider .slick-dots { bottom: -22px !important; } }.title-asset-full-width-text .title { text-align: center; margin: 0 0 64px; } .title-asset-full-width-text picture { margin: 0 0 64px; justify-content: center; } .title-asset-full-width-text .content { display: flex; flex-direction: column; gap: 20px; max-width: 794px; width: 100%; margin: 0 auto; } .title-asset-full-width-text .content .text { color: #3C3C3C; font-size: 1.25em; line-height: 1.5; } .title-asset-full-width-text .content .text strong { color: #1E1E1E; font-weight: 600; } @media (max-width: 1199px) { .title-asset-full-width-text .title, .title-asset-full-width-text picture { margin: 0 0 56px; } .title-asset-full-width-text .content { max-width: 100%; } } @media (max-width: 991px) { .title-asset-full-width-text .title, .title-asset-full-width-text picture { margin: 0 0 48px; } .title-asset-full-width-text .content .text { font-size: 1.125em; } } @media (max-width: 767px) { .title-asset-full-width-text .title, .title-asset-full-width-text picture { margin: 0 0 40px; } .title-asset-full-width-text .content .text { font-size: 1em; } }.full-width-press-slide-blocks .text-block { max-width: 792px; width: 100%; margin: 0 auto 64px; } .full-width-press-slide-blocks h2 { text-align: center; margin-bottom: 24px; } .full-width-press-slide-blocks .arrow-block { position: relative; display: flex; overflow: hidden; user-select: none; gap: 20px; margin-bottom: 20px; } .full-width-press-slide-blocks .list { flex-shrink: 0; display: flex; gap: 20px; counter-reset: item; justify-content: space-around; min-width: 100%; animation: scroll 40s linear infinite; } .full-width-press-slide-blocks .list.reverce { animation-direction: reverse; } .full-width-press-slide-blocks .arrow-block:hover .list { animation-play-state: paused; } @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 20px)); } } @-moz-keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 20px)); } } @-webkit-keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 20px)); } } .full-width-press-slide-blocks .item { position: relative; flex: 0 0 auto; width: 220px; height: 130px; border-radius: 16px; display: flex; justify-content: center; align-items: center; background: #F8F8F8; } .full-width-press-slide-blocks .item:focus { -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; -ms-box-shadow: none; box-shadow: none; } .full-width-press-slide-blocks .item:focus .icon { -moz-box-shadow: var(--common-focus-box-shadow);; -webkit-box-shadow: var(--common-focus-box-shadow);; -o-box-shadow: var(--common-focus-box-shadow);; -ms-box-shadow: var(--common-focus-box-shadow);; box-shadow: var(--common-focus-box-shadow);; border-radius: 8px; } .full-width-press-slide-blocks .item .icon { display: flex; height: 70px; background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/common/press-icons/press-3x.webp?1707397620"); background-repeat: no-repeat; background-size: 2984px 70px; } .full-width-press-slide-blocks .item .icon.icon-wt { width: 172px; background-position: 0 0; } .full-width-press-slide-blocks .item .icon.icon-tnw { width: 113px; background-position: -182px 0; } .full-width-press-slide-blocks .item .icon.icon-bbc { width: 126px; background-position: -305px 0; } .full-width-press-slide-blocks .item .icon.icon-cnet { width: 67px; background-position: -441px 0; } .full-width-press-slide-blocks .item .icon.icon-macworld { width: 107px; background-position: -518px 0; } .full-width-press-slide-blocks .item .icon.icon-fast-company { width: 155px; background-position: -635px 0; } .full-width-press-slide-blocks .item .icon.icon-lifehacker { width: 138px; background-position: -800px 0; } .full-width-press-slide-blocks .item .icon.icon-tc { width: 74px; background-position: -948px 0; } .full-width-press-slide-blocks .item .icon.icon-oreilly { width: 143px; background-position: -1032px 0; } .full-width-press-slide-blocks .item .icon.icon-verge { width: 134px; background-position: -1185px 0; } .full-width-press-slide-blocks .item .icon.icon-bloomberg { width: 141px; background-position: -1329px 0; } .full-width-press-slide-blocks .item .icon.icon-pixel { width: 132px; background-position: -1480px 0; } .full-width-press-slide-blocks .item .icon.icon-guardian { width: 165px; background-position: -1622px 0; } .full-width-press-slide-blocks .item .icon.icon-wired { width: 154px; background-position: -1797px 0; } .full-width-press-slide-blocks .item .icon.icon-igeaks { width: 144px; background-position: -1961px 0; } .full-width-press-slide-blocks .item .icon.icon-android-central { width: 168px; background-position: -2115px 0; } .full-width-press-slide-blocks .item .icon.icon-wsj { width: 115px; background-position: -2293px 0; } @media (min-width: 1921px) { .full-width-press-slide-blocks .arrow-block { width: 1920px; margin: 0 auto 20px; } .full-width-press-slide-blocks .arrow-block:before, .full-width-press-slide-blocks .arrow-block:after { content: ''; position: absolute; width: 160px; height: 100%; z-index: 1; } .full-width-press-slide-blocks .arrow-block:before { left: 0; background: linear-gradient( 90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100% ); } .full-width-press-slide-blocks .arrow-block:after { right: 0; background: linear-gradient( 90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100% ); } } @media (max-width: 991px) { .full-width-press-slide-blocks .arrow-block { margin-bottom: 16px; } .full-width-press-slide-blocks .arrow-block { gap: 16px; } .full-width-press-slide-blocks .list { gap: 16px; } .full-width-press-slide-blocks .arrow-block:hover .list { animation-play-state: unset; } .full-width-press-slide-blocks .item { width: 190px; height: 100px; } .full-width-press-slide-blocks .item .icon { height: 49px; background-size: 2046px 49px; } .full-width-press-slide-blocks .item .icon.icon-wt { width: 119px; background-position: 0 0; } .full-width-press-slide-blocks .item .icon.icon-tnw { width: 80px; background-position: -124px 0; } .full-width-press-slide-blocks .item .icon.icon-bbc { width: 88px; background-position: -209px 0; } .full-width-press-slide-blocks .item .icon.icon-cnet { width: 46px; background-position: -302px 0; } .full-width-press-slide-blocks .item .icon.icon-macworld { width: 77px; background-position: -354px 0; } .full-width-press-slide-blocks .item .icon.icon-fast-company { width: 109px; background-position: -435px 0; } .full-width-press-slide-blocks .item .icon.icon-lifehacker { width: 97px; background-position: -548px 0; } .full-width-press-slide-blocks .item .icon.icon-tc { width: 53px; background-position: -650px 0; } .full-width-press-slide-blocks .item .icon.icon-oreilly { width: 99px; background-position: -708px 0; } .full-width-press-slide-blocks .item .icon.icon-verge { width: 93px; background-position: -812px 0; } .full-width-press-slide-blocks .item .icon.icon-bloomberg { width: 99px; background-position: -911px 0; } .full-width-press-slide-blocks .item .icon.icon-pixel { width: 85px; background-position: -1021px 0; } .full-width-press-slide-blocks .item .icon.icon-guardian { width: 116px; background-position: -1110px 0; } .full-width-press-slide-blocks .item .icon.icon-wired { width: 109px; background-position: -1231px 0; } .full-width-press-slide-blocks .item .icon.icon-igeaks { width: 101px; background-position: -1343px 0; } .full-width-press-slide-blocks .item .icon.icon-android-central { width: 117px; background-position: -1449px 0; } .full-width-press-slide-blocks .item .icon.icon-wsj { width: 77px; background-position: -1573px 0; } }.title-card-list-right-text-left { position: relative; overflow: hidden; padding: 100px 0; background: linear-gradient(96deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -webkit-linear-gradient(96deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -moz-linear-gradient(96deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -o-linear-gradient(96deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -ms-linear-gradient(96deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: linear-gradient(96deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); } .title-card-list-right-text-left .container { position: relative; display: flex; justify-content: space-between; z-index: 1; } .title-card-list-right-text-left .container:after { content: ''; position: absolute; width: 1340px; height: 670px; bottom: -103px; left: 220px; background: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/pages/home/illustration-bg-map-2x.webp?1734366936") no-repeat; background-size: contain; z-index: -1; } .title-card-list-right-text-left .left { max-width: 550px; width: 100%; } .title-card-list-right-text-left .left h2 { color: #FFF; margin-bottom: 123px; } .title-card-list-right-text-left .left .list { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; } .title-card-list-right-text-left .list .item { flex: 1 1 calc(50% - 20px); padding: 24px; border-radius: 24px; background: rgba(255, 255, 255, .08); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } .title-card-list-right-text-left .item .icon { display: flex; width: 48px; height: 48px; margin-bottom: 24px; } .title-card-list-right-text-left .item .icon.icon-employees { background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/common/components/title-card-list-right-text-left/icon-employees.svg?1706708303"); background-repeat: no-repeat; background-size: contain; } .title-card-list-right-text-left .item .icon.icon-downloads { background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/common/components/title-card-list-right-text-left/icon-downloads.svg?1706708364"); background-repeat: no-repeat; background-size: contain; } .title-card-list-right-text-left .item .icon.icon-office { background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/common/components/title-card-list-right-text-left/icon-office.svg?1706708616"); background-repeat: no-repeat; background-size: contain; } .title-card-list-right-text-left .item .icon.icon-market { background-image: url("https://cdn-rdstaticassets.readdle.com/assets/readdle/modern_2019/common/components/title-card-list-right-text-left/icon-market.svg?1739281532"); background-repeat: no-repeat; background-size: contain; } .title-card-list-right-text-left .item p { font-size: 2.5rem; font-style: normal; font-weight: 700; line-height: 133%; color: #FFFFFF; } .title-card-list-right-text-left .item .text { font-size: 1.25rem; font-style: normal; font-weight: 400; line-height: 150%; color: rgba(255, 255, 255, 0.70); } .title-card-list-right-text-left .item .text span { color: rgba(255, 255, 255, 0.80); font-weight: 600; } .title-card-list-right-text-left .right { max-width: 550px; width: 100%; } .title-card-list-right-text-left .right p { font-size: 1.25rem; font-style: normal; font-weight: 400; line-height: 150%; color: rgba(255, 255, 255, .7); margin-bottom: 24px; opacity: .8; } .title-card-list-right-text-left .right p span { font-weight: 600; color: #FFF; } @media (max-width: 1199px) { .title-card-list-right-text-left { padding: 80px 0; } .title-card-list-right-text-left .container { gap: 30px; } .title-card-list-right-text-left .container:after { left: 127px; bottom: -183px; } .title-card-list-right-text-left .left, .title-card-list-right-text-left .right { max-width: 428px; } .title-card-list-right-text-left .item .icon { width: 40px; height: 40px; margin-bottom: 15px; } .title-card-list-right-text-left .item p { font-size: 2rem; } .title-card-list-right-text-left .item .text { font-size: 1.125rem; } } @media (max-width: 991px) { .title-card-list-right-text-left { padding: 48px 0; } .title-card-list-right-text-left .container { flex-direction: column; align-items: center; gap: 40px; } .title-card-list-right-text-left .container:after { content: unset; } .title-card-list-right-text-left .left, .title-card-list-right-text-left .right { max-width: 704px; width: 100%; } .title-card-list-right-text-left .left h2 { text-align: center; margin-bottom: 32px; } .title-card-list-right-text-left .item .text br { display: none; } .title-card-list-right-text-left .right { display: flex; flex-direction: column; align-items: center; } } @media (max-width: 767px) { .title-card-list-right-text-left { background: linear-gradient(138deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -webkit-linear-gradient(138deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -moz-linear-gradient(138deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -o-linear-gradient(138deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: -ms-linear-gradient(138deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); background: linear-gradient(138deg, #0E1D50 0%, #121212 49.48%, #32174D 100%); } .title-card-list-right-text-left .left .list { flex-direction: column; gap: 10px; } .title-card-list-right-text-left .list .item { flex: unset; display: flex; gap: 12px; width: 100%; padding: 16px; } .title-card-list-right-text-left .item .icon { flex-shrink: 0; width: 32px; height: 32px; margin: 0; } .title-card-list-right-text-left .item p { line-height: 100%; margin-bottom: 10px; } } .de .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .es .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .fr .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .uk .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { height: 480px; } @media (max-width: 1199px) { .de .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .es .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .fr .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .uk .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { padding: 30px; height: 485px; } } @media (max-width: 991px) { .de .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .es .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .fr .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .uk .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { padding: 40px; height: 100%; } } @media (max-width: 767px) { .de .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .es .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .fr .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .uk .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { padding: 40px 32px; } } @media (max-width: 575px) { .de .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .es .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .fr .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block, .uk .text-asset-blocks-scroll-magic .highlight-case .highlight-case-card .text-block { padding: 40px 24px; } }