@font-face { font-family: 'OpenSansLightweight'; src: url('data:font/woff;base64,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'); font-weight: normal; font-style: normal; } /* inspired from http://www.456bereastreet.com/archive/201012/font-face_tip_define_font-weight_and_font-style_to_keep_your_css_simple/ */ @font-face { font-family: 'OpenSans'; src: url(/vstatic/0/javascripts/../fonts/open-sans-regular-e67a7cc1e101b17989ccdeb2ac83fd17.woff2) format('woff2'), url(/vstatic/0/javascripts/../fonts/open-sans-regular-9b9e773e79b51eae48f5182dd2bdc418.woff) format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSans'; src: url(/vstatic/0/javascripts/../fonts/open-sans-bold-849f4436ed94d2b287f8914bac0ddac6.woff2) format('woff2'), url(/vstatic/0/javascripts/../fonts/open-sans-bold-471b398e92fd13c4c272a5df2a907d89.woff) format('woff'); font-weight: bold; font-style: normal; } /* -------- Extra sizes --------- */ @font-face { font-family: 'OpenSans-light'; src: url(/vstatic/0/javascripts/../fonts/opensans-light-0bc159ee7593b56a2341085c7f5b8572.woff2) format('woff2'), url(/vstatic/0/javascripts/../fonts/opensans-light-c86d4a75ae86bc0212d8b3981df73341.woff) format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSans-semibold'; src: url(/vstatic/0/javascripts/../fonts/open-sans-semibold-62e2ae617ea12d2f8a79bf3012de0694.woff2) format('woff2'), url(/vstatic/0/javascripts/../fonts/open-sans-semibold-55832dc63da9afde65ff03bbebb5f8d7.woff) format('woff'); font-weight: normal; font-style: bold; } @font-face { font-family: 'OpenSans-bold'; src: url(/vstatic/0/javascripts/../fonts/open-sans-bold-849f4436ed94d2b287f8914bac0ddac6.woff2) format('woff2'), url(/vstatic/0/javascripts/../fonts/open-sans-bold-471b398e92fd13c4c272a5df2a907d89.woff) format('woff'); font-weight: normal; font-style: bold; } @font-face { font-family: 'OpenSans-extrabold'; src: url(/vstatic/0/javascripts/../fonts/opensans-extrabold-97bfe1b577c0f9deb4060191767781b9.woff2) format('woff2'), url(/vstatic/0/javascripts/../fonts/opensans-extrabold-f766fda7ceb407a904f6b2cdc83ae95a.woff) format('woff'); font-weight: normal; font-style: bold; } /* Tachyons COLOR VARIABLES Grayscale - Solids - Transparencies Colors */ /* Here is simple purposal for change/hack default value from tachyons. */ :root { /*GRAY GRADIENT*/ /*RED GRADIENT*/ /*ORANGE GRADIENT*/ /*YELLOW GRADIENT*/ /*GREEN GRADIENT*/ /*LIGHT BLUE GRADIENT*/ /*BLUE GRADIENT*/ /*PURPLE GRADIENT*/ /*PINK GRADIENT*/ /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ _______ _______ .______ .______ _______ ______ ___ .___________. _______ _______ | \ | ____|| _ \ | _ \ | ____| / | / \ | || ____|| \ | .--. || |__ | |_) | | |_) | | |__ | ,----' / ^ \ `---| |----`| |__ | .--. | | | | || __| | ___/ | / | __| | | / /_\ \ | | | __| | | | | | '--' || |____ | | | |\ \----.| |____ | `----./ _____ \ | | | |____ | '--' | |_______/ |_______|| _| | _| `._____||_______| \______/__/ \__\ |__| |_______||_______/ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */ /* orange hover (button secondary) */ /* Point club - Rakuten color */ /* icons */ /* This var is not use by tachyons */ /* Used in alerts */ /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ _______ .__ __. _______ _______ _______ .______ .______ _______ ______ ___ .___________. _______ _______ | ____|| \ | | | \ | \ | ____|| _ \ | _ \ | ____| / | / \ | || ____|| \ | |__ | \| | | .--. | ______| .--. || |__ | |_) | | |_) | | |__ | ,----' / ^ \ `---| |----`| |__ | .--. | | __| | . ` | | | | | |______| | | || __| | ___/ | / | __| | | / /_\ \ | | | __| | | | | | |____ | |\ | | '--' | | '--' || |____ | | | |\ \----.| |____ | `----./ _____ \ | | | |____ | '--' | |_______||__| \__| |_______/ |_______/ |_______|| _| | _| `._____||_______| \______/__/ \__\ |__| |_______||_______/ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */ } /* stylelint-disable */ /* CUSTOM MEDIA QUERIES Media query values can be changed to fit your own content. There are no magic bullets when it comes to media query width values. They should be declared in em units - and they should be set to meet the needs of your content. You can also add additional media queries, or remove some of the existing ones. These media queries can be referenced like so: @media (--breakpoint-not-small) { .medium-and-larger-specific-style { background-color: red; } } @media (--breakpoint-medium) { .medium-screen-specific-style { background-color: red; } } @media (--breakpoint-large) { .large-and-larger-screen-specific-style { background-color: red; } } */ /* Media Queries */ /* inside scope */ /* from breakpoint value, included */ /* >= 320px */ /* >= 576px */ /* >= 768px */ /* >= 992px */ /* >= 1200px */ /* >= 1492px */ /* inside scope strict */ /* from breakpoint value, excluded */ /* > 768px */ /* Overriding Tachyons */ /* stylelint-disable */ .react-autosuggest__suggestion--highlighted { background-color: #ddd; } #PageForm input::-webkit-input-placeholder { color: #9C9C9C; font-size: 14px; } #PageForm input::-moz-placeholder { color: #9C9C9C; font-size: 14px; } #PageForm input:-ms-input-placeholder { color: #9C9C9C; font-size: 14px; } #PageForm input::-ms-input-placeholder { color: #9C9C9C; font-size: 14px; } #PageForm input::placeholder { color: #9C9C9C; font-size: 14px; } /* Headings modifiers To display text as headings. .heading_1 - heading 1 .heading_2 - heading 2 .heading_3 - heading 3 .heading_4 - heading 4 .heading_5 - heading 5 .heading_6 - heading 6 Markup:

P tags with .{{modifier_class}} class

*/ h1, h2, h3, h4, .heading_1, .heading_2, .heading_3, .heading_4, .heading_5, .heading_6 { font-weight: bold; } h1, .heading_1 { line-height: 2.6rem; font-size: 2rem; } h2, .heading_2 { line-height: 2.4rem; font-size: 1.8rem; } h3, .heading_3 { line-height: 2.1rem; font-size: 1.6rem; } h4, .heading_4 { line-height: 1.8rem; font-size: 1.4rem; } h5, .heading_5 { line-height: 1.6rem; font-size: 1.2rem; } h6, .heading_6 { line-height: 14px; font-size: 1.1rem; } /* additionnal commons markup */ .listStyle_none { list-style-type: none; } .text { color: #4D4D4D; color: #4D4D4D; } .pointer_none { pointer-events: none; } /* should be use if flex must be hide in a conditionnal way, because of organisations of css. */ .helper_display-flex { display: -webkit-box; display: -webkit-flex; display: flex; } /* flex helper */ .helper_hideText { overflow: hidden; text-indent: -9999px; outline: none; } /* flex helper */ .helper_flex-occupy { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; } /* When showing element depending from a breakpoint, that mean by default it's hidden */ .helper_show-AboveTablet, .helper_show-BelowDesktop { display: none; } .helper_hide-BelowPhone { display: inherit; } .helper_hide-BelowTablet { display: inherit; } /* Rappels : --phone: 320px; --landscape: 576px; --tablet: 768px; --desktop: 992px; --wide: 1200px; --max: 1492px; */ @media screen and (max-width: 75em) { .helper_hide-BelowWide { display: none ; } } @media screen and (max-width: 93.25em) { .helper_hide-BelowMax { display: none ; } } @media screen and (max-width: 62em) { .helper_show-BelowDesktop { display: inherit; } .helper_hide-BelowDesktop { display: none !important; } } @media screen and (max-width: 36em) { .helper_hide-BelowLandscape { display: none !important; } } @media screen and (min-width: 36em) { .helper_hide-AboveLandscape { display: none !important; } } @media screen and (max-width: 20em) { .helper_hide-BelowPhone { display: none !important; } header { padding-top: 1.2rem; } } @media screen and (min-width: 48em) { .helper_hide-AboveTablet { display: none !important; } } /* use this to hide strictly after breakpoint value */ @media screen and (min-width: 48.063em) { .helper_hide-AboveTabletStrict { display: none !important; } } @media screen and (max-width: 48em) { .helper_hide-BelowTablet { display: none !important; } } @media screen and (min-width: 48em) { .helper_show-AboveTablet { display: inherit; } } @media screen and (min-width: 62em) { .helper_hide-AboveDesktop { display: none !important; } } @media screen and (min-width: 20em) { .helper_hide-AbovePhone { display: none !important; } } @media screen and (min-width: 48em) { .helper_hide-Cat { display: none; } } /* ====================================== Overlay ====================================== */ .helper-structure_overlay { position: absolute; top: 0; left: 0; } /* ====================================== Extra z-index ====================================== */ .z-10 { z-index: 10; } .z-11 { z-index: 11; } .z-12 { z-index: 12; } .z-13 { z-index: 13; } .z-14 { z-index: 14; } .z-15 { z-index: 15; } .z-16 { z-index: 16; } .z-17 { z-index: 17; } .z-18 { z-index: 18; } .z-19 { z-index: 19; } .z-20 { z-index: 20; } .z-21 { z-index: 21; } .z-22 { z-index: 22; } .z-23 { z-index: 23; } .z-24 { z-index: 24; } .z-25 { z-index: 25; } .z-26 { z-index: 26; } .z-27 { z-index: 27; } .z-28 { z-index: 28; } .z-29 { z-index: 29; } .z-30 { z-index: 30; } /* ====================================== screen reader only ====================================== */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } img { max-width: 100%; } /* More informations here: https://la-cascade.io/layout-sur-12-colonnes-avec-flexbox/; */ .grid_container { z-index: 9999; margin: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; } .grid_row { height: auto; -webkit-flex-wrap: wrap; flex-wrap: wrap; display: -webkit-box; display: -webkit-flex; display: flex; padding: 0 8px; box-sizing: content-box; } /* IMPORTANT * Because of IE11 bug and misunderstanding of calc() functionnality inside flex, * flex shorthandwriting must be avoided. * > https://github.com/philipwalton/flexbugs#flexbug-8 */ .grid_col { margin: 0 8px; overflow: hidden; -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: -webkit-calc(100% / 12 - 8px * 2); flex-basis: calc(8.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 12 - var(--margin) * 2); flex-basis: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - 8px * 2); max-width: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - var(--margin) * 2); max-width: calc(8.33333% - 16px) } .grid_col.col_nogutter { max-width: 8.33333%; max-width: -webkit-calc(100% / 12); max-width: 8.33333%; } .row_nogutter { padding: 0; } .col_nogutter { margin: 0; box-sizing: border-box; } .grid_col-2 { -webkit-box-flex: 2; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-shrink: 2; flex-shrink: 2; -webkit-flex-basis: -webkit-calc(100% / 6 - 8px * 2); flex-basis: calc(16.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / 6 - var(--margin) * 2); flex-basis: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - 8px * 2); max-width: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - var(--margin) * 2); max-width: calc(16.66667% - 16px) } .grid_col-2.col_nogutter { max-width: 16.66667%; max-width: -webkit-calc(100% / 6); max-width: 16.66667%; } .grid_col-3 { -webkit-box-flex: 3; -webkit-flex-grow: 3; flex-grow: 3; -webkit-flex-shrink: 3; flex-shrink: 3; -webkit-flex-basis: -webkit-calc(100% / 4 - 8px * 2); flex-basis: calc(25% - 16px); -webkit-flex-basis: -webkit-calc(100% / 4 - var(--margin) * 2); flex-basis: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - 8px * 2); max-width: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - var(--margin) * 2); max-width: calc(25% - 16px) } .grid_col-3.col_nogutter { max-width: 25%; max-width: -webkit-calc(100% / 4); max-width: 25%; } .grid_col-4 { -webkit-box-flex: 4; -webkit-flex-grow: 4; flex-grow: 4; -webkit-flex-shrink: 4; flex-shrink: 4; -webkit-flex-basis: -webkit-calc(100% / 3 - 8px * 2); flex-basis: calc(33.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 3 - var(--margin) * 2); flex-basis: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px) } .grid_col-4.col_nogutter { max-width: 33.33333%; max-width: -webkit-calc(100% / 3); max-width: 33.33333%; } .grid_col-5 { -webkit-box-flex: 5; -webkit-flex-grow: 5; flex-grow: 5; -webkit-flex-shrink: 5; flex-shrink: 5; -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - 8px * 2); flex-basis: calc(41.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); flex-basis: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - 8px * 2); max-width: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); max-width: calc(41.66667% - 16px) } .grid_col-5.col_nogutter { max-width: 41.66667%; max-width: -webkit-calc(100% / (12 / 5)); max-width: 41.66667%; } .grid_col-6 { -webkit-box-flex: 6; -webkit-flex-grow: 6; flex-grow: 6; -webkit-flex-shrink: 6; flex-shrink: 6; -webkit-flex-basis: -webkit-calc(100% / 2 - 8px * 2); flex-basis: calc(50% - 16px); -webkit-flex-basis: -webkit-calc(100% / 2 - var(--margin) * 2); flex-basis: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - 8px * 2); max-width: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - var(--margin) * 2); max-width: calc(50% - 16px) } .grid_col-6.col_nogutter { max-width: 50%; max-width: -webkit-calc(100% / 2); max-width: 50%; } .grid_col-7 { -webkit-box-flex: 7; -webkit-flex-grow: 7; flex-grow: 7; -webkit-flex-shrink: 7; flex-shrink: 7; -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - 8px * 2); flex-basis: calc(58.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); flex-basis: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - 8px * 2); max-width: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); max-width: calc(58.33333% - 16px) } .grid_col-7.col_nogutter { max-width: 58.33333%; max-width: -webkit-calc(100% / (12 / 7)); max-width: 58.33333%; } .grid_col-8 { -webkit-box-flex: 8; -webkit-flex-grow: 8; flex-grow: 8; -webkit-flex-shrink: 8; flex-shrink: 8; -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - 8px * 2); flex-basis: calc(66.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); flex-basis: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - 8px * 2); max-width: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); max-width: calc(66.66667% - 16px) } .grid_col-8.col_nogutter { max-width: 66.66667%; max-width: -webkit-calc(100% / (12 / 8)); max-width: 66.66667%; } .grid_col-9 { -webkit-box-flex: 9; -webkit-flex-grow: 9; flex-grow: 9; -webkit-flex-shrink: 9; flex-shrink: 9; -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - 8px * 2); flex-basis: calc(75% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); flex-basis: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - 8px * 2); max-width: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); max-width: calc(75% - 16px) } .grid_col-9.col_nogutter { max-width: 75%; max-width: -webkit-calc(100% / (12 / 9)); max-width: 75%; } .grid_col-10 { -webkit-box-flex: 10; -webkit-flex-grow: 10; flex-grow: 10; -webkit-flex-shrink: 10; flex-shrink: 10; -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - 8px * 2); flex-basis: calc(83.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); flex-basis: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - 8px * 2); max-width: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); max-width: calc(83.33333% - 16px) } .grid_col-10.col_nogutter { max-width: 83.33333%; max-width: -webkit-calc(100% / (12 / 10)); max-width: 83.33333%; } .grid_col-11 { -webkit-box-flex: 11; -webkit-flex-grow: 11; flex-grow: 11; -webkit-flex-shrink: 11; flex-shrink: 11; -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - 8px * 2); flex-basis: calc(91.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); flex-basis: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - 8px * 2); max-width: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); max-width: calc(91.66667% - 16px) } .grid_col-11.col_nogutter { max-width: 91.66667%; max-width: -webkit-calc(100% / (12 / 11)); max-width: 91.66667%; } .grid_col-12 { -webkit-box-flex: 12; -webkit-flex-grow: 12; flex-grow: 12; -webkit-flex-shrink: 12; flex-shrink: 12; -webkit-flex-basis: -webkit-calc(100% - 8px * 2); flex-basis: calc(100% - 16px); -webkit-flex-basis: -webkit-calc(100% - var(--margin) * 2); flex-basis: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% - 8px * 2); max-width: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% - var(--margin) * 2); max-width: calc(100% - 16px) } .grid_col-12.col_nogutter { max-width: 100%; } /* phone: 320px; landscape: 576px; tablet: 768px; desktop: 992px; wide: 1200px; max: 1492px; */ /* Max */ @media screen and (max-width: 1492px) { .grid_col-0-BelowMax { display: none; } .grid_col-1-BelowMax { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: 0; flex-basis: 0; max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - 8px * 2); max-width: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - var(--margin) * 2); max-width: calc(8.33333% - 16px) } .grid_col-1-BelowMax.col_nogutter { max-width: 8.33333%; max-width: -webkit-calc(100% / 12); max-width: 8.33333%; } .grid_col-2-BelowMax { -webkit-box-flex: 2; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-shrink: 2; flex-shrink: 2; -webkit-flex-basis: -webkit-calc(100% / 6 - 8px * 2); flex-basis: calc(16.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / 6 - var(--margin) * 2); flex-basis: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - 8px * 2); max-width: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - var(--margin) * 2); max-width: calc(16.66667% - 16px) } .grid_col-2-BelowMax.col_nogutter { max-width: 16.66667%; max-width: -webkit-calc(100% / 6); max-width: 16.66667%; } .grid_col-3-BelowMax { -webkit-box-flex: 3; -webkit-flex-grow: 3; flex-grow: 3; -webkit-flex-shrink: 3; flex-shrink: 3; -webkit-flex-basis: -webkit-calc(100% / 4 - 8px * 2); flex-basis: calc(25% - 16px); -webkit-flex-basis: -webkit-calc(100% / 4 - var(--margin) * 2); flex-basis: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - 8px * 2); max-width: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - var(--margin) * 2); max-width: calc(25% - 16px) } .grid_col-3-BelowMax.col_nogutter { max-width: 25%; max-width: -webkit-calc(100% / 4); max-width: 25%; } .grid_col-4-BelowMax { -webkit-box-flex: 4; -webkit-flex-grow: 4; flex-grow: 4; -webkit-flex-shrink: 4; flex-shrink: 4; -webkit-flex-basis: -webkit-calc(100% / 3 - 8px * 2); flex-basis: calc(33.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 3 - var(--margin) * 2); flex-basis: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px) } .grid_col-4-BelowMax.col_nogutter { max-width: 33.33333%; max-width: -webkit-calc(100% / 3); max-width: 33.33333%; } .grid_col-5-BelowMax { -webkit-box-flex: 5; -webkit-flex-grow: 5; flex-grow: 5; -webkit-flex-shrink: 5; flex-shrink: 5; -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - 8px * 2); flex-basis: calc(41.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); flex-basis: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - 8px * 2); max-width: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); max-width: calc(41.66667% - 16px) } .grid_col-5-BelowMax.col_nogutter { max-width: 41.66667%; max-width: -webkit-calc(100% / (12 / 5)); max-width: 41.66667%; } .grid_col-6-BelowMax { -webkit-box-flex: 6; -webkit-flex-grow: 6; flex-grow: 6; -webkit-flex-shrink: 6; flex-shrink: 6; -webkit-flex-basis: -webkit-calc(100% / 2 - 8px * 2); flex-basis: calc(50% - 16px); -webkit-flex-basis: -webkit-calc(100% / 2 - var(--margin) * 2); flex-basis: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - 8px * 2); max-width: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - var(--margin) * 2); max-width: calc(50% - 16px) } .grid_col-6-BelowMax.col_nogutter { max-width: 50%; max-width: -webkit-calc(100% / 2); max-width: 50%; } .grid_col-7-BelowMax { -webkit-box-flex: 7; -webkit-flex-grow: 7; flex-grow: 7; -webkit-flex-shrink: 7; flex-shrink: 7; -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - 8px * 2); flex-basis: calc(58.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); flex-basis: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - 8px * 2); max-width: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); max-width: calc(58.33333% - 16px) } .grid_col-7-BelowMax.col_nogutter { max-width: 58.33333%; max-width: -webkit-calc(100% / (12 / 7)); max-width: 58.33333%; } .grid_col-8-BelowMax { -webkit-box-flex: 8; -webkit-flex-grow: 8; flex-grow: 8; -webkit-flex-shrink: 8; flex-shrink: 8; -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - 8px * 2); flex-basis: calc(66.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); flex-basis: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - 8px * 2); max-width: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); max-width: calc(66.66667% - 16px) } .grid_col-8-BelowMax.col_nogutter { max-width: 66.66667%; max-width: -webkit-calc(100% / (12 / 8)); max-width: 66.66667%; } .grid_col-9-BelowMax { -webkit-box-flex: 9; -webkit-flex-grow: 9; flex-grow: 9; -webkit-flex-shrink: 9; flex-shrink: 9; -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - 8px * 2); flex-basis: calc(75% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); flex-basis: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - 8px * 2); max-width: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); max-width: calc(75% - 16px) } .grid_col-9-BelowMax.col_nogutter { max-width: 75%; max-width: -webkit-calc(100% / (12 / 9)); max-width: 75%; } .grid_col-10-BelowMax { -webkit-box-flex: 10; -webkit-flex-grow: 10; flex-grow: 10; -webkit-flex-shrink: 10; flex-shrink: 10; -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - 8px * 2); flex-basis: calc(83.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); flex-basis: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - 8px * 2); max-width: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); max-width: calc(83.33333% - 16px) } .grid_col-10-BelowMax.col_nogutter { max-width: 83.33333%; max-width: -webkit-calc(100% / (12 / 10)); max-width: 83.33333%; } .grid_col-11-BelowMax { -webkit-box-flex: 11; -webkit-flex-grow: 11; flex-grow: 11; -webkit-flex-shrink: 11; flex-shrink: 11; -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - 8px * 2); flex-basis: calc(91.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); flex-basis: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - 8px * 2); max-width: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); max-width: calc(91.66667% - 16px) } .grid_col-11-BelowMax.col_nogutter { max-width: 91.66667%; max-width: -webkit-calc(100% / (12 / 11)); max-width: 91.66667%; } .grid_col-12-BelowMax { -webkit-box-flex: 12; -webkit-flex-grow: 12; flex-grow: 12; -webkit-flex-shrink: 12; flex-shrink: 12; -webkit-flex-basis: -webkit-calc(100% - 8px * 2); flex-basis: calc(100% - 16px); -webkit-flex-basis: -webkit-calc(100% - var(--margin) * 2); flex-basis: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% - 8px * 2); max-width: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% - var(--margin) * 2); max-width: calc(100% - 16px) } .grid_col-12-BelowMax.col_nogutter { max-width: 100%; } } /* Wide */ @media screen and (max-width: 1200px) { .grid_col-0-BelowWide { display: none; } .grid_col-1-BelowWide { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: 0; flex-basis: 0; max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - 8px * 2); max-width: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - var(--margin) * 2); max-width: calc(8.33333% - 16px) } .grid_col-1-BelowWide.col_nogutter { max-width: 8.33333%; max-width: -webkit-calc(100% / 12); max-width: 8.33333%; } .grid_col-2-BelowWide { -webkit-box-flex: 2; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-shrink: 2; flex-shrink: 2; -webkit-flex-basis: -webkit-calc(100% / 6 - 8px * 2); flex-basis: calc(16.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / 6 - var(--margin) * 2); flex-basis: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - 8px * 2); max-width: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - var(--margin) * 2); max-width: calc(16.66667% - 16px) } .grid_col-2-BelowWide.col_nogutter { max-width: 16.66667%; max-width: -webkit-calc(100% / 6); max-width: 16.66667%; } .grid_col-3-BelowWide { -webkit-box-flex: 3; -webkit-flex-grow: 3; flex-grow: 3; -webkit-flex-shrink: 3; flex-shrink: 3; -webkit-flex-basis: -webkit-calc(100% / 4 - 8px * 2); flex-basis: calc(25% - 16px); -webkit-flex-basis: -webkit-calc(100% / 4 - var(--margin) * 2); flex-basis: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - 8px * 2); max-width: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - var(--margin) * 2); max-width: calc(25% - 16px) } .grid_col-3-BelowWide.col_nogutter { max-width: 25%; max-width: -webkit-calc(100% / 4); max-width: 25%; } .grid_col-4-BelowWide { -webkit-box-flex: 4; -webkit-flex-grow: 4; flex-grow: 4; -webkit-flex-shrink: 4; flex-shrink: 4; -webkit-flex-basis: -webkit-calc(100% / 3 - 8px * 2); flex-basis: calc(33.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 3 - var(--margin) * 2); flex-basis: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px) } .grid_col-4-BelowWide.col_nogutter { max-width: 33.33333%; max-width: -webkit-calc(100% / 3); max-width: 33.33333%; } .grid_col-5-BelowWide { -webkit-box-flex: 5; -webkit-flex-grow: 5; flex-grow: 5; -webkit-flex-shrink: 5; flex-shrink: 5; -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - 8px * 2); flex-basis: calc(41.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); flex-basis: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - 8px * 2); max-width: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); max-width: calc(41.66667% - 16px) } .grid_col-5-BelowWide.col_nogutter { max-width: 41.66667%; max-width: -webkit-calc(100% / (12 / 5)); max-width: 41.66667%; } .grid_col-6-BelowWide { -webkit-box-flex: 6; -webkit-flex-grow: 6; flex-grow: 6; -webkit-flex-shrink: 6; flex-shrink: 6; -webkit-flex-basis: -webkit-calc(100% / 2 - 8px * 2); flex-basis: calc(50% - 16px); -webkit-flex-basis: -webkit-calc(100% / 2 - var(--margin) * 2); flex-basis: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - 8px * 2); max-width: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - var(--margin) * 2); max-width: calc(50% - 16px) } .grid_col-6-BelowWide.col_nogutter { max-width: 50%; max-width: -webkit-calc(100% / 2); max-width: 50%; } .grid_col-7-BelowWide { -webkit-box-flex: 7; -webkit-flex-grow: 7; flex-grow: 7; -webkit-flex-shrink: 7; flex-shrink: 7; -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - 8px * 2); flex-basis: calc(58.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); flex-basis: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - 8px * 2); max-width: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); max-width: calc(58.33333% - 16px) } .grid_col-7-BelowWide.col_nogutter { max-width: 58.33333%; max-width: -webkit-calc(100% / (12 / 7)); max-width: 58.33333%; } .grid_col-8-BelowWide { -webkit-box-flex: 8; -webkit-flex-grow: 8; flex-grow: 8; -webkit-flex-shrink: 8; flex-shrink: 8; -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - 8px * 2); flex-basis: calc(66.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); flex-basis: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - 8px * 2); max-width: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); max-width: calc(66.66667% - 16px) } .grid_col-8-BelowWide.col_nogutter { max-width: 66.66667%; max-width: -webkit-calc(100% / (12 / 8)); max-width: 66.66667%; } .grid_col-9-BelowWide { -webkit-box-flex: 9; -webkit-flex-grow: 9; flex-grow: 9; -webkit-flex-shrink: 9; flex-shrink: 9; -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - 8px * 2); flex-basis: calc(75% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); flex-basis: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - 8px * 2); max-width: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); max-width: calc(75% - 16px) } .grid_col-9-BelowWide.col_nogutter { max-width: 75%; max-width: -webkit-calc(100% / (12 / 9)); max-width: 75%; } .grid_col-10-BelowWide { -webkit-box-flex: 10; -webkit-flex-grow: 10; flex-grow: 10; -webkit-flex-shrink: 10; flex-shrink: 10; -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - 8px * 2); flex-basis: calc(83.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); flex-basis: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - 8px * 2); max-width: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); max-width: calc(83.33333% - 16px) } .grid_col-10-BelowWide.col_nogutter { max-width: 83.33333%; max-width: -webkit-calc(100% / (12 / 10)); max-width: 83.33333%; } .grid_col-11-BelowWide { -webkit-box-flex: 11; -webkit-flex-grow: 11; flex-grow: 11; -webkit-flex-shrink: 11; flex-shrink: 11; -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - 8px * 2); flex-basis: calc(91.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); flex-basis: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - 8px * 2); max-width: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); max-width: calc(91.66667% - 16px) } .grid_col-11-BelowWide.col_nogutter { max-width: 91.66667%; max-width: -webkit-calc(100% / (12 / 11)); max-width: 91.66667%; } .grid_col-12-BelowWide { -webkit-box-flex: 12; -webkit-flex-grow: 12; flex-grow: 12; -webkit-flex-shrink: 12; flex-shrink: 12; -webkit-flex-basis: -webkit-calc(100% - 8px * 2); flex-basis: calc(100% - 16px); -webkit-flex-basis: -webkit-calc(100% - var(--margin) * 2); flex-basis: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% - 8px * 2); max-width: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% - var(--margin) * 2); max-width: calc(100% - 16px) } .grid_col-12-BelowWide.col_nogutter { max-width: 100%; } } /* Desktop */ @media screen and (max-width: 992px) { .grid_col-0-BelowDesktop { display: none; } .grid_col-1-BelowDesktop { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: 0; flex-basis: 0; max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - 8px * 2); max-width: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - var(--margin) * 2); max-width: calc(8.33333% - 16px) } .grid_col-1-BelowDesktop.col_nogutter { max-width: 8.33333%; max-width: -webkit-calc(100% / 12); max-width: 8.33333%; } .grid_col-2-BelowDesktop { -webkit-box-flex: 2; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-shrink: 2; flex-shrink: 2; -webkit-flex-basis: -webkit-calc(100% / 6 - 8px * 2); flex-basis: calc(16.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / 6 - var(--margin) * 2); flex-basis: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - 8px * 2); max-width: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - var(--margin) * 2); max-width: calc(16.66667% - 16px) } .grid_col-2-BelowDesktop.col_nogutter { max-width: 16.66667%; max-width: -webkit-calc(100% / 6); max-width: 16.66667%; } .grid_col-3-BelowDesktop { -webkit-box-flex: 3; -webkit-flex-grow: 3; flex-grow: 3; -webkit-flex-shrink: 3; flex-shrink: 3; -webkit-flex-basis: -webkit-calc(100% / 4 - 8px * 2); flex-basis: calc(25% - 16px); -webkit-flex-basis: -webkit-calc(100% / 4 - var(--margin) * 2); flex-basis: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - 8px * 2); max-width: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - var(--margin) * 2); max-width: calc(25% - 16px) } .grid_col-3-BelowDesktop.col_nogutter { max-width: 25%; max-width: -webkit-calc(100% / 4); max-width: 25%; } .grid_col-4-BelowDesktop { -webkit-box-flex: 4; -webkit-flex-grow: 4; flex-grow: 4; -webkit-flex-shrink: 4; flex-shrink: 4; -webkit-flex-basis: -webkit-calc(100% / 3 - 8px * 2); flex-basis: calc(33.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 3 - var(--margin) * 2); flex-basis: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px) } .grid_col-4-BelowDesktop.col_nogutter { max-width: 33.33333%; max-width: -webkit-calc(100% / 3); max-width: 33.33333%; } .grid_col-5-BelowDesktop { -webkit-box-flex: 5; -webkit-flex-grow: 5; flex-grow: 5; -webkit-flex-shrink: 5; flex-shrink: 5; -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - 8px * 2); flex-basis: calc(41.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); flex-basis: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - 8px * 2); max-width: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); max-width: calc(41.66667% - 16px) } .grid_col-5-BelowDesktop.col_nogutter { max-width: 41.66667%; max-width: -webkit-calc(100% / (12 / 5)); max-width: 41.66667%; } .grid_col-6-BelowDesktop { -webkit-box-flex: 6; -webkit-flex-grow: 6; flex-grow: 6; -webkit-flex-shrink: 6; flex-shrink: 6; -webkit-flex-basis: -webkit-calc(100% / 2 - 8px * 2); flex-basis: calc(50% - 16px); -webkit-flex-basis: -webkit-calc(100% / 2 - var(--margin) * 2); flex-basis: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - 8px * 2); max-width: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - var(--margin) * 2); max-width: calc(50% - 16px) } .grid_col-6-BelowDesktop.col_nogutter { max-width: 50%; max-width: -webkit-calc(100% / 2); max-width: 50%; } .grid_col-7-BelowDesktop { -webkit-box-flex: 7; -webkit-flex-grow: 7; flex-grow: 7; -webkit-flex-shrink: 7; flex-shrink: 7; -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - 8px * 2); flex-basis: calc(58.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); flex-basis: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - 8px * 2); max-width: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); max-width: calc(58.33333% - 16px) } .grid_col-7-BelowDesktop.col_nogutter { max-width: 58.33333%; max-width: -webkit-calc(100% / (12 / 7)); max-width: 58.33333%; } .grid_col-8-BelowDesktop { -webkit-box-flex: 8; -webkit-flex-grow: 8; flex-grow: 8; -webkit-flex-shrink: 8; flex-shrink: 8; -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - 8px * 2); flex-basis: calc(66.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); flex-basis: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - 8px * 2); max-width: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); max-width: calc(66.66667% - 16px) } .grid_col-8-BelowDesktop.col_nogutter { max-width: 66.66667%; max-width: -webkit-calc(100% / (12 / 8)); max-width: 66.66667%; } .grid_col-9-BelowDesktop { -webkit-box-flex: 9; -webkit-flex-grow: 9; flex-grow: 9; -webkit-flex-shrink: 9; flex-shrink: 9; -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - 8px * 2); flex-basis: calc(75% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); flex-basis: calc(75% - 16px); max-width: -webkit-calc(76.92308% - 16px); max-width: -webkit-calc(100% / 1.3 - 8px * 2); max-width: calc(76.92308% - 16px); max-width: -webkit-calc(76.92308% - 16px); max-width: -webkit-calc(100% / 1.3 - var(--margin) * 2); max-width: calc(76.92308% - 16px) } .grid_col-9-BelowDesktop.col_nogutter { max-width: 75%; max-width: -webkit-calc(100% / (12 / 9)); max-width: 75%; } .grid_col-10-BelowDesktop { -webkit-box-flex: 10; -webkit-flex-grow: 10; flex-grow: 10; -webkit-flex-shrink: 10; flex-shrink: 10; -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - 8px * 2); flex-basis: calc(83.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); flex-basis: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - 8px * 2); max-width: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); max-width: calc(83.33333% - 16px) } .grid_col-10-BelowDesktop.col_nogutter { max-width: 83.33333%; max-width: -webkit-calc(100% / (12 / 10)); max-width: 83.33333%; } .grid_col-11-BelowDesktop { -webkit-box-flex: 11; -webkit-flex-grow: 11; flex-grow: 11; -webkit-flex-shrink: 11; flex-shrink: 11; -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - 8px * 2); flex-basis: calc(91.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); flex-basis: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - 8px * 2); max-width: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); max-width: calc(91.66667% - 16px) } .grid_col-11-BelowDesktop.col_nogutter { max-width: 91.66667%; max-width: -webkit-calc(100% / (12 / 11)); max-width: 91.66667%; } .grid_col-12-BelowDesktop { -webkit-box-flex: 12; -webkit-flex-grow: 12; flex-grow: 12; -webkit-flex-shrink: 12; flex-shrink: 12; -webkit-flex-basis: -webkit-calc(100% - 8px * 2); flex-basis: calc(100% - 16px); -webkit-flex-basis: -webkit-calc(100% - var(--margin) * 2); flex-basis: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% / 1 - 8px * 2); max-width: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% / 1 - var(--margin) * 2); max-width: calc(100% - 16px) } .grid_col-12-BelowDesktop.col_nogutter { max-width: 100%; } } /* Tablet */ @media screen and (max-width: 768px) { .grid_col-0-BelowTablet { display: none; } .grid_col-1-BelowTablet { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: 0; flex-basis: 0; max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - 8px * 2); max-width: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - var(--margin) * 2); max-width: calc(8.33333% - 16px) } .grid_col-1-BelowTablet.col_nogutter { max-width: 8.33333%; max-width: -webkit-calc(100% / 12); max-width: 8.33333%; } .grid_col-2-BelowTablet { -webkit-box-flex: 2; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-shrink: 2; flex-shrink: 2; -webkit-flex-basis: -webkit-calc(100% / 6 - 8px * 2); flex-basis: calc(16.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / 6 - var(--margin) * 2); flex-basis: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - 8px * 2); max-width: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - var(--margin) * 2); max-width: calc(16.66667% - 16px) } .grid_col-2-BelowTablet.col_nogutter { max-width: 16.66667%; max-width: -webkit-calc(100% / 6); max-width: 16.66667%; } .grid_col-3-BelowTablet { -webkit-box-flex: 3; -webkit-flex-grow: 3; flex-grow: 3; -webkit-flex-shrink: 3; flex-shrink: 3; -webkit-flex-basis: -webkit-calc(100% / 4 - 8px * 2); flex-basis: calc(25% - 16px); -webkit-flex-basis: -webkit-calc(100% / 4 - var(--margin) * 2); flex-basis: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - 8px * 2); max-width: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - var(--margin) * 2); max-width: calc(25% - 16px) } .grid_col-3-BelowTablet.col_nogutter { max-width: 25%; max-width: -webkit-calc(100% / 4); max-width: 25%; } .grid_col-4-BelowTablet { -webkit-box-flex: 4; -webkit-flex-grow: 4; flex-grow: 4; -webkit-flex-shrink: 4; flex-shrink: 4; -webkit-flex-basis: -webkit-calc(100% / 3 - 8px * 2); flex-basis: calc(33.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 3 - var(--margin) * 2); flex-basis: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px) } .grid_col-4-BelowTablet.col_nogutter { max-width: 33.33333%; max-width: -webkit-calc(100% / 3); max-width: 33.33333%; } .grid_col-5-BelowTablet { -webkit-box-flex: 5; -webkit-flex-grow: 5; flex-grow: 5; -webkit-flex-shrink: 5; flex-shrink: 5; -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - 8px * 2); flex-basis: calc(41.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); flex-basis: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - 8px * 2); max-width: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); max-width: calc(41.66667% - 16px) } .grid_col-5-BelowTablet.col_nogutter { max-width: 41.66667%; max-width: -webkit-calc(100% / (12 / 5)); max-width: 41.66667%; } .grid_col-6-BelowTablet { -webkit-box-flex: 6; -webkit-flex-grow: 6; flex-grow: 6; -webkit-flex-shrink: 6; flex-shrink: 6; -webkit-flex-basis: -webkit-calc(100% / 2 - 8px * 2); flex-basis: calc(50% - 16px); -webkit-flex-basis: -webkit-calc(100% / 2 - var(--margin) * 2); flex-basis: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - 8px * 2); max-width: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - var(--margin) * 2); max-width: calc(50% - 16px) } .grid_col-6-BelowTablet.col_nogutter { max-width: 50%; max-width: -webkit-calc(100% / 2); max-width: 50%; } .grid_col-7-BelowTablet { -webkit-box-flex: 7; -webkit-flex-grow: 7; flex-grow: 7; -webkit-flex-shrink: 7; flex-shrink: 7; -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - 8px * 2); flex-basis: calc(58.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); flex-basis: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - 8px * 2); max-width: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); max-width: calc(58.33333% - 16px) } .grid_col-7-BelowTablet.col_nogutter { max-width: 58.33333%; max-width: -webkit-calc(100% / (12 / 7)); max-width: 58.33333%; } .grid_col-8-BelowTablet { -webkit-box-flex: 8; -webkit-flex-grow: 8; flex-grow: 8; -webkit-flex-shrink: 8; flex-shrink: 8; -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - 8px * 2); flex-basis: calc(66.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); flex-basis: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - 8px * 2); max-width: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); max-width: calc(66.66667% - 16px) } .grid_col-8-BelowTablet.col_nogutter { max-width: 66.66667%; max-width: -webkit-calc(100% / (12 / 8)); max-width: 66.66667%; } .grid_col-9-BelowTablet { -webkit-box-flex: 9; -webkit-flex-grow: 9; flex-grow: 9; -webkit-flex-shrink: 9; flex-shrink: 9; -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - 8px * 2); flex-basis: calc(75% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); flex-basis: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - 8px * 2); max-width: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); max-width: calc(75% - 16px) } .grid_col-9-BelowTablet.col_nogutter { max-width: 75%; max-width: -webkit-calc(100% / (12 / 9)); max-width: 75%; } .grid_col-10-BelowTablet { -webkit-box-flex: 10; -webkit-flex-grow: 10; flex-grow: 10; -webkit-flex-shrink: 10; flex-shrink: 10; -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - 8px * 2); flex-basis: calc(83.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); flex-basis: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - 8px * 2); max-width: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); max-width: calc(83.33333% - 16px) } .grid_col-10-BelowTablet.col_nogutter { max-width: 83.33333%; max-width: -webkit-calc(100% / (12 / 10)); max-width: 83.33333%; } .grid_col-11-BelowTablet { -webkit-box-flex: 11; -webkit-flex-grow: 11; flex-grow: 11; -webkit-flex-shrink: 11; flex-shrink: 11; -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - 8px * 2); flex-basis: calc(91.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); flex-basis: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - 8px * 2); max-width: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); max-width: calc(91.66667% - 16px) } .grid_col-11-BelowTablet.col_nogutter { max-width: 91.66667%; max-width: -webkit-calc(100% / (12 / 11)); max-width: 91.66667%; } .grid_col-12-BelowTablet { -webkit-box-flex: 12; -webkit-flex-grow: 12; flex-grow: 12; -webkit-flex-shrink: 12; flex-shrink: 12; -webkit-flex-basis: -webkit-calc(100% / 1 - 8px * 2); flex-basis: calc(100% - 16px); -webkit-flex-basis: -webkit-calc(100% / 1 - var(--margin) * 2); flex-basis: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% / 1 - 8px * 2); max-width: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% / 1 - var(--margin) * 2); max-width: calc(100% - 16px) } .grid_col-12-BelowTablet.col_nogutter { max-width: 100%; } } /* Landscape */ @media screen and (max-width: 576px) { .grid_col-0-BelowLandscape { display: none; } .grid_col-1-BelowLandscape { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; -webkit-flex-shrink: 1; flex-shrink: 1; -webkit-flex-basis: 0; flex-basis: 0; max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - 8px * 2); max-width: calc(8.33333% - 16px); max-width: -webkit-calc(8.33333% - 16px); max-width: -webkit-calc(100% / 12 - var(--margin) * 2); max-width: calc(8.33333% - 16px) } .grid_col-1-BelowLandscape.col_nogutter { max-width: 8.33333%; max-width: -webkit-calc(100% / 12); max-width: 8.33333%; } .grid_col-2-BelowLandscape { -webkit-box-flex: 2; -webkit-flex-grow: 2; flex-grow: 2; -webkit-flex-shrink: 2; flex-shrink: 2; -webkit-flex-basis: -webkit-calc(100% / 6 - 8px * 2); flex-basis: calc(16.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / 6 - var(--margin) * 2); flex-basis: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - 8px * 2); max-width: calc(16.66667% - 16px); max-width: -webkit-calc(16.66667% - 16px); max-width: -webkit-calc(100% / 6 - var(--margin) * 2); max-width: calc(16.66667% - 16px) } .grid_col-2-BelowLandscape.col_nogutter { max-width: 16.66667%; max-width: -webkit-calc(100% / 6); max-width: 16.66667%; } .grid_col-3-BelowLandscape { -webkit-box-flex: 3; -webkit-flex-grow: 3; flex-grow: 3; -webkit-flex-shrink: 3; flex-shrink: 3; -webkit-flex-basis: -webkit-calc(100% / 4 - 8px * 2); flex-basis: calc(25% - 16px); -webkit-flex-basis: -webkit-calc(100% / 4 - var(--margin) * 2); flex-basis: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - 8px * 2); max-width: calc(25% - 16px); max-width: -webkit-calc(25% - 16px); max-width: -webkit-calc(100% / 4 - var(--margin) * 2); max-width: calc(25% - 16px) } .grid_col-3-BelowLandscape.col_nogutter { max-width: 25%; max-width: -webkit-calc(100% / 4); max-width: 25%; } .grid_col-4-BelowLandscape { -webkit-box-flex: 4; -webkit-flex-grow: 4; flex-grow: 4; -webkit-flex-shrink: 4; flex-shrink: 4; -webkit-flex-basis: -webkit-calc(100% / 3 - 8px * 2); flex-basis: calc(33.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / 3 - var(--margin) * 2); flex-basis: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px) } .grid_col-4-BelowLandscape.col_nogutter { max-width: 33.33333%; max-width: -webkit-calc(100% / 3); max-width: 33.33333%; } .grid_col-5-BelowLandscape { -webkit-box-flex: 5; -webkit-flex-grow: 5; flex-grow: 5; -webkit-flex-shrink: 5; flex-shrink: 5; -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - 8px * 2); flex-basis: calc(41.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); flex-basis: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - 8px * 2); max-width: calc(41.66667% - 16px); max-width: -webkit-calc(41.66667% - 16px); max-width: -webkit-calc(100% / (12 / 5) - var(--margin) * 2); max-width: calc(41.66667% - 16px) } .grid_col-5-BelowLandscape.col_nogutter { max-width: 41.66667%; max-width: -webkit-calc(100% / (12 / 5)); max-width: 41.66667%; } .grid_col-6-BelowLandscape { -webkit-box-flex: 6; -webkit-flex-grow: 6; flex-grow: 6; -webkit-flex-shrink: 6; flex-shrink: 6; -webkit-flex-basis: -webkit-calc(100% / 2 - 8px * 2); flex-basis: calc(50% - 16px); -webkit-flex-basis: -webkit-calc(100% / 2 - var(--margin) * 2); flex-basis: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - 8px * 2); max-width: calc(50% - 16px); max-width: -webkit-calc(50% - 16px); max-width: -webkit-calc(100% / 2 - var(--margin) * 2); max-width: calc(50% - 16px) } .grid_col-6-BelowLandscape.col_nogutter { max-width: 50%; max-width: -webkit-calc(100% / 2); max-width: 50%; } .grid_col-7-BelowLandscape { -webkit-box-flex: 7; -webkit-flex-grow: 7; flex-grow: 7; -webkit-flex-shrink: 7; flex-shrink: 7; -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - 8px * 2); flex-basis: calc(58.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); flex-basis: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - 8px * 2); max-width: calc(58.33333% - 16px); max-width: -webkit-calc(58.33333% - 16px); max-width: -webkit-calc(100% / (12 / 7) - var(--margin) * 2); max-width: calc(58.33333% - 16px) } .grid_col-7-BelowLandscape.col_nogutter { max-width: 58.33333%; max-width: -webkit-calc(100% / (12 / 7)); max-width: 58.33333%; } .grid_col-8-BelowLandscape { -webkit-box-flex: 8; -webkit-flex-grow: 8; flex-grow: 8; -webkit-flex-shrink: 8; flex-shrink: 8; -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - 8px * 2); flex-basis: calc(66.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); flex-basis: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - 8px * 2); max-width: calc(66.66667% - 16px); max-width: -webkit-calc(66.66667% - 16px); max-width: -webkit-calc(100% / (12 / 8) - var(--margin) * 2); max-width: calc(66.66667% - 16px) } .grid_col-8-BelowLandscape.col_nogutter { max-width: 66.66667%; max-width: -webkit-calc(100% / (12 / 8)); max-width: 66.66667%; } .grid_col-9-BelowLandscape { -webkit-box-flex: 9; -webkit-flex-grow: 9; flex-grow: 9; -webkit-flex-shrink: 9; flex-shrink: 9; -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - 8px * 2); flex-basis: calc(75% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); flex-basis: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - 8px * 2); max-width: calc(75% - 16px); max-width: -webkit-calc(75% - 16px); max-width: -webkit-calc(100% / (12 / 9) - var(--margin) * 2); max-width: calc(75% - 16px) } .grid_col-9-BelowLandscape.col_nogutter { max-width: 75%; max-width: -webkit-calc(100% / (12 / 9)); max-width: 75%; } .grid_col-10-BelowLandscape { -webkit-box-flex: 10; -webkit-flex-grow: 10; flex-grow: 10; -webkit-flex-shrink: 10; flex-shrink: 10; -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - 8px * 2); flex-basis: calc(83.33333% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); flex-basis: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - 8px * 2); max-width: calc(83.33333% - 16px); max-width: -webkit-calc(83.33333% - 16px); max-width: -webkit-calc(100% / (12 / 10) - var(--margin) * 2); max-width: calc(83.33333% - 16px) } .grid_col-10-BelowLandscape.col_nogutter { max-width: 83.33333%; max-width: -webkit-calc(100% / (12 / 10)); max-width: 83.33333%; } .grid_col-11-BelowLandscape { -webkit-box-flex: 11; -webkit-flex-grow: 11; flex-grow: 11; -webkit-flex-shrink: 11; flex-shrink: 11; -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - 8px * 2); flex-basis: calc(91.66667% - 16px); -webkit-flex-basis: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); flex-basis: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - 8px * 2); max-width: calc(91.66667% - 16px); max-width: -webkit-calc(91.66667% - 16px); max-width: -webkit-calc(100% / (12 / 11) - var(--margin) * 2); max-width: calc(91.66667% - 16px) } .grid_col-11-BelowLandscape.col_nogutter { max-width: 91.66667%; max-width: -webkit-calc(100% / (12 / 11)); max-width: 91.66667%; } .grid_col-12-BelowLandscape { -webkit-box-flex: 12; -webkit-flex-grow: 12; flex-grow: 12; -webkit-flex-shrink: 12; flex-shrink: 12; -webkit-flex-basis: -webkit-calc(100% / 1 - 8px * 2); flex-basis: calc(100% - 16px); -webkit-flex-basis: -webkit-calc(100% / 1 - var(--margin) * 2); flex-basis: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% / 1 - 8px * 2); max-width: calc(100% - 16px); max-width: -webkit-calc(100% - 16px); max-width: -webkit-calc(100% / 1 - var(--margin) * 2); max-width: calc(100% - 16px) } .grid_col-12-BelowLandscape.col_nogutter { max-width: 100%; } } .grid_col-auto, .grid_col-auto.col_nogutter { -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; max-width: none; } .col_special { /* outline: 1px solid green; max-width: 200px; background: #9f9; */ -webkit-box-flex: 1; -webkit-flex: 1 0 0; flex: 1 0 0; } .grid10_row { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; box-sizing: content-box; } /* By default occupy 100% */ .grid10_col { -webkit-box-flex: 2; -webkit-flex: 2 2 -webkit-calc(100% / 5 - 8px * 2); flex: 2 2 calc(20% - 16px); -webkit-flex: 2 2 -webkit-calc(100% / 5 - var(--margin) * 2); flex: 2 2 calc(20% - 16px); max-width: -webkit-calc(20% - 16px); max-width: -webkit-calc(100% / 5 - 8px * 2); max-width: calc(20% - 16px); max-width: -webkit-calc(20% - 16px); max-width: -webkit-calc(100% / 5 - var(--margin) * 2); max-width: calc(20% - 16px); } @media screen and (max-width: 93.25em) { .grid10_col-3-BelowMax { -webkit-box-flex: 3; -webkit-flex: 3 3 -webkit-calc(100% / 3 - 8px * 2); flex: 3 3 calc(33.33333% - 16px); -webkit-flex: 3 3 -webkit-calc(100% / 3 - var(--margin) * 2); flex: 3 3 calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px); } } @media screen and (min-width: 1492px) { .grid10-col2-aboveMax { -webkit-box-flex: 2; -webkit-flex: 2 2 -webkit-calc(100% / 5 - 8px * 2); flex: 2 2 calc(20% - 16px); -webkit-flex: 2 2 -webkit-calc(100% / 5 - var(--margin) * 2); flex: 2 2 calc(20% - 16px); max-width: -webkit-calc(20% - 16px); max-width: -webkit-calc(100% / 5 - 8px * 2); max-width: calc(20% - 16px); max-width: -webkit-calc(20% - 16px); max-width: -webkit-calc(100% / 5 - var(--margin) * 2); max-width: calc(20% - 16px); } .grid10-col8-aboveMax { -webkit-box-flex: 8; -webkit-flex: 8 8 -webkit-calc(100% / 1.25 - 8px * 2); flex: 8 8 calc(80% - 16px); -webkit-flex: 8 8 -webkit-calc(100% / 1.25 - var(--margin) * 2); flex: 8 8 calc(80% - 16px); max-width: -webkit-calc(80% - 16px); max-width: -webkit-calc(100% / 1.25 - 8px * 2); max-width: calc(80% - 16px); max-width: -webkit-calc(80% - 16px); max-width: -webkit-calc(100% / 1.25 - var(--margin) * 2); max-width: calc(80% - 16px); } } @media screen and (max-width: 48em) { /* below 768px */ .grid10_col-3-BelowTablet { -webkit-box-flex: 3; -webkit-flex: 3 3 -webkit-calc(100% / 3 - 8px * 2); flex: 3 3 calc(33.33333% - 16px); -webkit-flex: 3 3 -webkit-calc(100% / 3 - var(--margin) * 2); flex: 3 3 calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - 8px * 2); max-width: calc(33.33333% - 16px); max-width: -webkit-calc(33.33333% - 16px); max-width: -webkit-calc(100% / 3 - var(--margin) * 2); max-width: calc(33.33333% - 16px); } } @media screen and (max-width: 36em) { /* below 576px */ .grid10_col-3-BelowLandscape { margin: 0; padding-top: 2rem; padding-bottom: 2rem; -webkit-box-flex: 0; -webkit-flex: 0 0 -webkit-calc(100%); flex: 0 0 100%; max-width: 100%; max-width: -webkit-calc(100%); max-width: 100%; } } /* README Instead of installing the entire npm package slick-carousel to use only the css files, this CSS was copied and pasted from slick.css and slick-theme.css of https://github.com/kenwheeler/slick. In addition it is avoiding configuring webpack to look into the node_modules to retrieve the css of the slick-carousel Random Comment */ @charset 'UTF-8'; /* slick-theme.css from https://github.com/kenwheeler/slick */ /* Slider */ /* .slick-loading .slick-list { background: #fff url('./ajax-loader.gif') center center no-repeat; } */ /* Slider */ /* !important Loader resource below was commented in order to avoid adding assets */ /* .slick-loading .slick-list { background: #fff url('./ajax-loader.gif') center center no-repeat; } */ /* Icons */ /* !important: font face was modified for Priceminister, formats other than woff have been removed */ /* Arrows */ /* .slick-prev, .slick-next { position: absolute; width: 24px; height: 24px; border-radius: 0%; background-color: rgba(255, 255, 255, 0.9); background-repeat: no-repeat; border: none; background-position-y: 14px; color: transparent; transition: all 0.3s ease-in-out; cursor: pointer; font-size: 0; line-height: 0; top: 37%; outline: none; z-index: 1; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { background-color: white; outline: none; // background: transparent; // } .slick-prev:hover::before, .slick-prev:focus::before, .slick-next:hover::before, .slick-next:focus::before { opacity: 1; } */ .slick-prev, .slick-next { background-position: 50% 50%; } .slick-prev { background-image: url('https://pmcdn.staticpmrk.com/visuels/canopy-commons/left-arrow-grey.svg'); background-size: contain; left: -2000px; /* top: 0; */ } .slick-next { background-image: url('https://pmcdn.staticpmrk.com/visuels/canopy-commons/right-arrow-grey.svg'); background-size: contain; right: -2000px; } .lg .slick-prev { left: -60px; /* top: 0; */ } .sm .slick-prev { left: -28px; /* top: 0; */ } .lg .slick-next { right: -60px; } .sm .slick-next { right: -28px; } .lg .slick-prev, .lg .slick-next { width: 56px; height: 56px; } .sm .slick-prev, .sm .slick-next { width: 24px; height: 24px; } /* .slick-prev:hover, .slick-next:hover, .slick-prev:focus, .slick-next:focus { background-color: white; outline: none; } */ .slick-prev.slick-arrow.slick-disabled, .slick-next.slick-arrow.slick-disabled { opacity: 0; cursor: default; } /* Dots */ .slick-dots { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; position: relative; width: 100%; padding: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 8px; height: 8px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots button { font-size: 0; padding: 0; line-height: 0; display: block; width: 8px; height: 8px; border-radius: 8px; border: 0; outline: none; cursor: pointer; color: transparent; background-color: rgba(0, 0, 0, .4); } .slick-dots li button { background-color: rgba(0, 0, 0, .15); } .slick-dots .slick-active button { background-color: rgba(0, 0, 0, .4); } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } /* .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } */ .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; } /* .slick-prev { left: -25px; } [dir='rtl'] .slick-prev { right: -25px; left: auto; } .slick-prev:before { content: '←'; } [dir='rtl'] .slick-prev:before { content: '→'; } .slick-next { right: -25px; } [dir='rtl'] .slick-next { right: auto; left: -25px; } .slick-next:before { content: '→'; } [dir='rtl'] .slick-next:before { content: '←'; } */ /* Icons */ /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track::before, .slick-track::after { display: table; content: ''; } .slick-track::after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .galleryPhoto .slick-prev, .galleryPhoto .slick-next { position: absolute; width: 24px; height: 24px; border-radius: 0%; background-color: rgba(255, 255, 255, .9); background-repeat: no-repeat; border: none; color: transparent; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor: pointer; font-size: 0; line-height: 0; top: 37%; outline: none; z-index: 1; } .galleryPhoto .slick-prev:hover, .galleryPhoto .slick-prev:focus, .galleryPhoto .slick-next:hover, .galleryPhoto .slick-next:focus { background-color: white; outline: none; /* left: ; */ /* background: transparent; */ } .galleryPhoto .slick-prev:hover::before, .galleryPhoto .slick-prev:focus::before, .galleryPhoto .slick-next:hover::before, .galleryPhoto .slick-next:focus::before { opacity: 1; } .galleryPhoto .lg .slick-prev, .galleryPhoto .lg .slick-next { width: 56px; height: 56px; } .galleryPhoto .sm .slick-prev, .galleryPhoto .sm .slick-next { width: 24px; height: 24px; } /* reset */ html { background: #ddd; font-size: 62.5%; font-family: OpenSansLightweight, Arial, Helvetica, sans-serif; } input[type=text]::-ms-clear { display: none; } p,body { margin: 0; } /* Titles */ header { padding-top: 0; } /* ================================== to detect current breakpoint ================================== */ /* ORDER is important ! */ body::before { content: "max"; display: none; } @media screen and (max-width: 1491px) { body::before { content: "wide"; display: none; } } @media screen and (max-width: 1199px) { body::before { content: "desktop"; display: none; } } @media screen and (max-width: 991px) { body::before { content: "tablet"; display: none; } } @media screen and (max-width: 767px) { body::before { content: "landscape"; display: none; } } @media screen and (max-width: 575px) { body::before { content: "phone"; display: none; } } /* ================================== Main Structure && ADS ================================== */ .structure_ads-left { display: none; direction: rtl; } .structure_ads-left::before { content: ""; height: 100%; width: 100%; background-position-x: right; } .structure_ads-right { display: none; -webkit-box-ordinal-group: 3; -webkit-order: 2; order: 2; } .structure_ads-right::before { content: ""; height: 100%; width: 100%; background-position-x: left; } /* .structure_content-nolimit */ .structure_content-main { width: 100%; -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; overflow: hidden; max-width: 2000px; margin: 0 auto; } .structure_content-main section { background-color: #fff; } .structure_wrapper-ad > div { display: block; margin: 8px auto; } #div-gpt-ad-habillage { margin: 0 auto; } .structure_wrapper-global { display: -webkit-box; display: -webkit-flex; display: flex; } @media screen and (min-width: 1292px) { .structure_ads-generic { -webkit-box-flex: 0; -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-basis: 150px; flex-basis: 150px; } } @media screen and (min-width: 1492px) { .structure_ads-generic { -webkit-box-flex: 0; -webkit-flex-grow: 0; flex-grow: 0; -webkit-flex-basis: 150px; flex-basis: 150px; } } @media screen and (min-width: 1900px) { .structure_ads-generic { -webkit-flex-basis: 150px; flex-basis: 150px; -webkit-box-flex: 1; -webkit-flex-grow: 1; flex-grow: 1; width: auto; } } /*# sourceMappingURL=global-inline.34fee79a3fb3df8a309d.css.map*/