/* Paths */ /* Colors */ /* Global Media Queries */ /* Direction */ .pagePublications { padding-top: 40px; } @media (min-width: 768px) { .pagePublications { padding-top: 70px; } } .pagePublications > .wrap { position: relative; margin: 0 auto; padding: 0 25px 0 55px; z-index: 2; } @media (min-width: 768px) { .pagePublications > .wrap { padding: 0 25px 0 260px; } } @media (min-width: 1280px) { .pagePublications > .wrap { padding: 0 25px 0 280px; } } /* 1260 + navigation margins (25*2) + navigation 210px*/ @media (min-width: 1810px) { .pagePublications > .wrap { max-width: 1260px; margin: 0 auto; padding: 0 25px; } } .pagePublications .anchor { padding-top: 90px; margin-top: -70px; } details { border: 1px solid #f7931c; border-radius: 5px; padding: 1em 1em; margin-bottom: 1em; } details:hover{ color: #242424!important; background-color: #f9f9f9!important; } details summary:focus, details:hover summary { color: #f16521; } details.empty:hover, details.empty summary, details.empty summary:hover { color: #484848!important; background-color: transparent!important; } summary { /* forces summary to cover the details zone, so that it is entirely clickable. */ margin: -15px -20px -15px -15px; padding: 30px 40px 30px 50px; } details summary{ cursor: pointer; } details.empty summary{ cursor: auto; } details summary::before { list-style: inside; margin-top: 25px; margin-left: 45px; font-size: 100%; } details[open] summary::before { content: '\e904'; margin-top: 30px; margin-left: 38px; font-size: 65%; } details[open].empty summary::before, details.empty summary::before { display:none; } .menu-button { display: block; text-align: center; background: none; cursor: pointer; border-right: 2px solid #f7931c; padding: 10px; } @media(min-width: 768px){ .menu-button { padding: 0; border-radius: 0; } } .nav-check { display: none; } .navigation { display: block; overflow-y: auto; overflow-x: visible; height: 100%; width: 0; } @media(min-width: 768px){ .navigation { padding: 30px 15px 0 25px ; width: 100%; min-width: 190px; } } @media(min-width: 1280px){ .navigation { min-width: 210px; } } .nav-check:checked ~ .navigation { padding: 30px 15px 0 25px ; width: 100%; min-width: 210px; } .navigation li, .navigation ul { text-align: left; margin-left: 0; padding-left: 0; } .navigation li { list-style-type: none; } .navigation > ul { font-size: 20px; font-weight: bold; padding-bottom: 30px; } .navigation > ul > li > ul { font-size: 18px; font-weight: normal; } @media(min-width:768px){ .navigation > ul { font-size: 18px; } .navigation > ul > li > ul { font-size: 16px; } } @media(min-width:1280px){ .navigation > ul { font-size: 20px; } .navigation > ul > li > ul { font-size: 18px; } } .navigation a { color: #484848; } .navigation a:hover { text-decoration: underline; } .check-zone { height:100vh; } .sideMenu label:after { content: 'CATEGORIES'; font-weight: bolder; display: inline-block; position: relative; font-size: 1.1em; writing-mode: vertical-rl; text-orientation: sideways; padding-top: 15px; width: 20px; color: #f16521; } .nav-check-deactivator { display: none; } @media(min-width:768px){ .sideMenu label:after { display: none; } .nav-check-deactivator { display: block; position: fixed; background: transparent; height:100vh; width:6px; z-index: 4; left: 230px; } } @media(min-width:1280px){ .nav-check-deactivator { left: 250px; } } .sideMenu { position: fixed; height: 100vh; display: inline-flex; padding-top: 65px; background: white; z-index: 3; }