#banner { margin: 5px; display: flex; align-items: center; flex-direction: column; } #banner img { border: 1px solid #3c3c3f; border-radius: 5px; } #banner img.banner-show { width: 100%; opacity: 1; transition: opacity 1s, visibility 0s; } #banner img.banner-hide { height: 0; width: 0; opacity: 0; visibility: hidden; transition: opacity 1s, visibility 0s 1s; } /* Для второго баннера */ #banner2 { margin: 5px; display: flex; align-items: center; flex-direction: column; } #banner2 img { border: 1px solid #3c3c3f; border-radius: 5px; } #banner2 img.banner-show { width: 100%; opacity: 1; transition: opacity 1s, visibility 0s; } #banner2 img.banner-hide { height: 0; width: 0; opacity: 0; visibility: hidden; transition: opacity 1s, visibility 0s 1s; } /* Для 3его баннера */ #banner3 { margin: 5px; display: flex; align-items: center; flex-direction: column; } #banner3 img { border: 1px solid #3c3c3f; border-radius: 5px; } #banner3 img.banner-show { width: 100%; opacity: 1; transition: opacity 1s, visibility 0s; } #banner3 img.banner-hide { height: 0; width: 0; opacity: 0; visibility: hidden; transition: opacity 1s, visibility 0s 1s; }