.full-width { width: 100%; display: flex; flex-direction: column; } .full-width-narrow-content { width: 100%; display: flex; flex-direction: column; align-items: center; } .full-width-narrow-content > * { width: 1200px; } @media screen and (max-width: 1280px) { .full-width-narrow-content > * { width: 900px; } } @media screen and (max-width: 1000px) { .full-width-narrow-content > * { width: 700px; } } @media screen and (max-width: 750px) { .full-width-narrow-content > * { width: 600px; } } @media screen and (max-width: 640px) { .full-width-narrow-content > * { width: 90%; } } .full-width-narrow-subcontent > * { width: 100%; display: flex; flex-direction: column; align-items: center; } .full-width-narrow-subcontent > * > * { width: 1200px; } @media screen and (max-width: 1280px) { .full-width-narrow-subcontent > * > * { width: 900px; } } @media screen and (max-width: 1000px) { .full-width-narrow-subcontent > * > * { width: 700px; } } @media screen and (max-width: 750px) { .full-width-narrow-subcontent > * > * { width: 600px; } } @media screen and (max-width: 640px) { .full-width-narrow-subcontent > * > * { width: 90%; } } @media screen and (max-width: 750px) { .it-collapsed-header-on-narrow > .it-panel-30-70-adaptive > *:first-child, .it-collapsed-header-on-narrow > .it-panel-30-70 > *:first-child { visibility: collapse; width: 0; height: 0; } } *:has(> .it-flex-center-v) { display: flex; justify-content: center; } .it-flex-wrap { display: flex; gap: 40px; flex-wrap: wrap; flex-direction: row; align-content: space-between; justify-content: center; padding: 50px 0; } .it-panel-30-70 { display: flex; flex-direction: row; justify-content: left; } .it-panel-30-70 > *:last-child { flex-grow: 1000; } .it-panel-30-70-adaptive { display: flex; flex-direction: row; justify-content: left; } .it-panel-30-70-adaptive > *:first-child { width: 30%; min-width: 30%; } @media screen and (max-width: 1280px) { .it-panel-30-70-adaptive { flex-wrap: wrap; } .it-panel-30-70-adaptive > *:first-child { width: 100%; min-width: 100%; } } .it-panel-30-70-adaptive > *:last-child { flex-grow: 1000; } .it-stripes > *:nth-child(odd) { background-color: white; } .it-stripes > *:nth-child(even) { background-color: rgb(244, 247, 247); } .it-tile-element { position: relative; height: 100%; width: 100%; overflow: hidden; } .it-tile-element > *:nth-child(1) { position: absolute; left: 0; right: 0; top: 0; bottom: 0; pointer-events: none; transition: all ease-in-out 0.25s; } .it-tile-element:hover > *:nth-child(1) { transform: scale(1.05); } .it-tile-element > *:nth-child(2) { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: linear-gradient(180deg, rgba(10, 18, 33, 0.7), rgba(140, 140, 141, 0.7)); transition: all ease-in-out 0.25s; pointer-events: none; } .it-tile-element:hover > *:nth-child(2) { opacity: .8; } .it-tile-element > *:nth-child(3) { position: absolute; left: 40px; right: 40px; top: 50px; bottom: 0; color: white; text-align: left; text-transform: uppercase; font-size: 20px; line-height: 1.4; pointer-events: none; } .it-tile-element .it-image { width: 100%; height: 100%; overflow: hidden; } .main-page > .it-content { position: absolute; top: 70px; bottom: 0; left: 0; right: 0; }