.path-actus{ .content_container{ &>div>h2:first-of-type{ text-align: center; } .layout__region--content{ .views-element-container{ display: grid; grid-template-columns: 10% minmax(0, 1fr); h2{ grid-column: 2 ; padding: 0 0 0 20px; } div{ grid-column: 2; h2{ margin : 1rem 0; } } article{ h2{ // color: white; padding: 0; a{ text-decoration: none; &:hover{ text-decoration: underline; } } } } footer{ text-align: center; margin: 1.8rem 0; grid-column: 1 / span 2 ; background: transparent; a{ display: inline-block; margin: 0 auto; background: black; color: white; font-family: "trueno"; font-weight: 500; padding: .5rem 1.5rem; font-size: 0.8rem; text-decoration: none; } } } #actus_blocks-block_2{ .programme-1{ article{ background: $col-1 !important; .field_programme{ color: $col-1; } } } .programme-2{ article{ background: $col-2 !important; .field_programme{ color: $col-2; } } } .programme-3{ article{ background: $col-eur !important; .field_programme{ color: $col-eur; } } } .programme-4{ article{ background: black; .field_programme{ color: black; } } } .programme-5{ article{ background: $col-mond !important; .field_programme{ color: $col-mond; } } } .programme-6{ article{ background: $col-ter !important; .field_programme{ color: $col-ter; } } } .programme-7{ article{ background: $col-met !important; .field_programme{ color: $col-met; } } } .slick-slide{ margin: 0 1rem; padding: 0; } article{ // div{ display: grid; grid-column: 1 / span 2; margin-top: -1rem; div:not(.field_image){ // margin: 0 1rem; } .field_programme{ grid-row: 1; z-index: 10; } .field_image{ grid-row: 2; margin-top: -.5rem; img{ width: 100%; } } .field_sous_titre{ grid-row: 3; margin: .5rem 1rem !important; } } color:white; h2{ color: white; margin: -1rem 1rem 1rem 1rem; } .field_programme{ display: block; a{ background: white; display: inline-block; width: auto; text-decoration: none; font-weight: 600; text-transform: uppercase; padding: .3rem .3rem 0 .3rem; } } } } #actus_blocks-block_1{ .slick-slide{ margin: 0 1rem; padding: 0; } .slick-slide{ // background: white; } .programme-1{ article, h2{ color: $col-1 !important; } .field_programme{ a{ background: $col-1; } } } .programme-2{ article, h2{ color: $col-2 !important; } .field_programme{ a{ background: $col-2; } } } .programme-3{ article, h2{ color: $col-eur !important; } .field_programme{ a{ background: $col-eur; } } } .programme-4{ article, h2{ color: black; } .field_programme{ a{ background: black; } } } .programme-5{ article, h2{ color: $col-mond !important; } .field_programme{ a{ background: $col-mond; } } } .programme-6{ article, h2{ color: $col-ter !important; } .field_programme{ a{ background: $col-ter; } } } .programme-7{ article, h2{ color: $col-met !important; } .field_programme{ a{ background: $col-met; } } } article{ // background: white; &>div:first-of-type{ display: grid; grid-column: 1 / span 2; margin-top: -1rem; div:not(.field_image){ // margin: 0 1rem; } .field_programme{ grid-row: 1; z-index: 10; } .field_image{ grid-row: 2; margin-top: -.5rem; img{ width: 100%; } } .field_dates_actu{ grid-row: 3; margin: .5rem 1rem; } .field_sous_titre{ grid-row: 4; margin: 0rem 1rem; } } // color:white; h2{ // color: white; // margin: -1rem 1rem 1rem 1rem; margin: .5rem 1rem !important; } .field_programme{ display: block; a{ color: white; display: inline-block; width: auto; text-decoration: none; font-weight: 600; text-transform: uppercase; padding: .3rem .3rem 0 .3rem; } } } } #actus_blocks-block_1, #actus_blocks-block_2{ .links{ visibility: hidden; } .views-row article{ display: grid; grid-template-columns: repeat( 2, minmax(0, 1fr)); position: relative; height: auto; .field_programme{ margin: 0 0 0 1rem; } h2{ grid-row: 2; grid-column: 1 / span 2; } div:first{ grid-row: 1; grid-column: 1 / span 2; } } } #home_blocks-block_3{ .views-field-field-image{ grid-column: 1; } .slick-slide{ background-color:transparent; padding: 0; .views-row{ padding: 0.4rem; } } } } //carroussel .slick-arrow{ position: absolute; height: 100%; cursor: pointer; z-index: 100; // background-color: white; opacity: 0.2; transition: opacity 250ms; width: 10%; &:hover{ opacity: .5; } } .slick-next{ right: 0; top: 0; } } }