.page-node-site{ .block-region-first{ .block-entity-fieldnodefield-fichiers{ width: 80%; margin: auto; } } .region-content{ display: grid; // width: 80%; // margin: auto; // display: flex; // flex-direction: column; grid-template-columns: repeat(8 1fr); grid-template-rows: repeat(3 auto); #block-reha-prevnextblock{ display: flex; flex-direction: row; width: 70%; grid-column: 1 /span 8; grid-row: 1; z-index: 97; height: fit-content; justify-content: space-between; margin: auto; .next-site{ border: none; padding: 0.5rem 1rem; margin-left: auto; ::after{ content: url('../../dist/images/noun-arrow-1569918-black.svg'); padding-left: 0.5rem; padding-top: 0.1rem; } } .prev-site{ border: none; padding: 0.5rem 1rem; ::before{ content: url('../../dist/images/noun-arrow-1569918-black.svg'); display: inline-block; transform: rotate(180deg); padding-left: 0.5rem; } } } #block-reha-titredepage{ display: none; } #block-reha-contenudelapageprincipale{ padding-top: 2rem; padding-bottom: 3rem; grid-column: 1 /span 8; grid-row: 2; .node-type-site{ margin: auto; display: flex; flex-direction: column; .entete_site{ background-color: white; height: 520px; width: 70%; display: flex; flex-direction: row; margin: auto; .image-site{ height: 520px; width: 771px; order: 1; .field--name-field-image{ width: 100%; margin: auto; .slick-dots{ z-index: 999; bottom: -40px; } .slick-list{ padding: 0 !important; .field__item{ display: flex; flex-direction:column; align-items: flex-start; img{ height: 520px; width: auto; object-fit: contain; } blockquote{ font-style: italic; margin: 0; p{ margin: 0; } } } } } } .infos-content-site{ background-color: $white-button; width: 20vw; height: 400px; order: 2; display: flex; flex-direction: column; margin: auto; padding: 1rem; z-index: 99; position: relative; justify-content: center; @media(max-width: 891px){ width: auto; } h1{ order: 3; margin: 0; font-size: 1.8rem; font-weight: 900; } h2{ order: 3; margin: 0; font-size: 1.3rem; font-weight: 900; } .first-row{ order: 1; display:flex; flex-direction: row; align-items: end; padding-bottom: 0.5rem; .field--name-field-numero-site { order: 1; text-transform: uppercase; font-size: 1rem; display: inline-flex; &::after{ content: '|'; padding-left: 1rem; padding-right: 1rem; } } .field--name-field-adresse-site{ order: 3; font-size: 1.2rem; .field__item{ display: flex; } .address{ margin: 0; display: inline-flex; .postal-code{ order: 2; } .locality{ order: 1; text-transform: capitalize; margin-right: 0.5rem; } .country{ display: none; } } } } .field--name-field-date-de-construction{ order: 5; font-size: 1.2rem; } .field--name-field-architecte{ order: 4; padding-top: 0.5rem; font-size: 1.2rem; .field__items{ display: flex; flex-direction: row; flex-wrap: wrap; .field__item{ display: inline; &::after{ content:','; padding-right: 0.5rem; } } } .field__item:last-of-type::after { content: ''; } } ul.links{ order: 5; text-transform: uppercase; padding: 0; margin: 0; border: none; padding-bottom: 2rem; padding-top: 0.9rem; display: inline-flex; &::after{ content:url("../../dist/images/noun-arrow-1569918-black.svg"); padding-left: 0.5rem; } } } } .body-content-site{ order: 3; // top: -60px; padding-top: 6rem; position: relative; width: 70%; margin: auto; font-size: 1.3rem; display: flex; flex-direction: row-reverse; justify-content: space-between; .summary-content{ width: 75%; } .links-content{ width: 15%; margin-top: 1.5rem; .field--type-file{ border: none; margin-bottom: 1rem; background-color: transparent; } .field__item{ padding: 0.3rem; border: solid black 1px; margin-bottom: 1rem; background-color: rgb(255, 255, 255); font-size: 0.9rem; >*{ text-transform: uppercase; } } } } } } } }