.thumbnails{ margin: 1rem 0rem; // max-width: 300px; min-width: 250px; height: auto; width: calc(100% / 4 ); background: white; transform: scale(1); @include shadow; a{ display: block; height: 100%; & > .__wrap{ padding: 1rem; } } .__media{ margin-right: 1rem; figure{ height: 100%; img{ width: 100%; height: 100%; object-fit: cover; } } } .__content{ margin-top: 1rem; } .d-flex{ // padding: 1rem; } } .thumbnails{ figure{ height: 120px; margin: 0; img{ width: 100%; height: 100%; object-fit: cover; } } } .programme{ .row{ margin: 0; } .thumbnails{ width: 100%; margin: 0; figure{ height: 250px; } } } @media screen and (min-width: 992px) { .programme{ .row{ margin: $gutter1 calc(-#{$gutter1}); } .thumbnails{ width: calc( 50% - #{$gutter1} * 2); margin: 0 $gutter1; figure{ height: 250px; } } } } .thumbnails_participants{ figure{ & > div{ width: 100px; height: 100px; margin-left: 0.5rem; img{ border-radius: 50%; width: 100%; height: 100%; object-fit: cover; } } figcaption{ &.__info{ padding: 4rem 0.5rem 0.5rem 0.5rem; margin-top: -3rem; background: white; .__name{ text-transform: uppercase; } .__qualite{ } } } } } article{ .__publications{ & > div{ article{ width: 100%; @include shadow; figure{ padding: 1rem; .__media{ margin-right: 1rem; } figcaption { width: 80%; } } } } } .__bibliographie{ & > div{ article{ width: 100%; a{ & > div { p, span, div{ display: inline; background: white; } } } } } } } .container { &.publications{ section{ article{ width: 100%; @include shadow; figure{ padding: 1rem; .__media{ margin-right: 1rem; } figcaption { width: 80%; } } } } } &.bilbiographie{ article{ width: 100%; a{ & > div { p, span, div{ display: inline; background: white; } } } } } } @media screen and (min-width: 992px) { article{ .__publications{ & > div{ margin: 0 calc(-#{$gutter1}); article{ width: calc( 50% - #{$gutter1} * 2); margin: 0 $gutter1; @include shadow; figure{ padding: 1rem; .__media{ margin-right: 1rem; } figcaption { width: 80%; } } } } } .__bibliographie{ & > div{ margin: 0 calc(-#{$gutter1}); article{ width: calc( 100% / 3 - #{$gutter1} * 3); margin: 0 $gutter1; figure{ padding: 1rem; .__media{ margin-right: 1rem; } figcaption { width: 80%; } } } } } } .container { &.publications{ section{ article{ width: calc( 50% - #{$gutter1} * 2); margin: 0 $gutter1; @include shadow; figure{ padding: 1rem; .__media{ margin-right: 1rem; } figcaption { width: 80%; } } } } .views{ &.__publications{ article{ width: calc( 25% - #{$gutter1} * 4); } } } } &.bibliographie{ article{ width: calc( 100% / 3 - #{$gutter1} * 3); margin: 0 $gutter1; figure{ padding: 1rem; .__media{ margin-right: 1rem; } figcaption { width: 80%; } } } } } }