.cyber-gallery {
display: flex;
flex-direction: column;
gap: 20px;
max-width: 600px;
margin: 0 auto;
}
.cyber-gallery img {
width: 100%;
height: auto;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.cyber-gallery {
display: flex;
flex-direction: column;
gap: 20px;
max-width: 600px;
margin: 0 auto;
}
.cyber-gallery img {
width: 100%;
height: auto;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
- Кибербезопасность - УОПП МОБ УВД Гродненского облисполкома
- Безопасный интернет детям
- Уголовный кодекс РБ - Киберпреступления
- Атаки злоумышленников на несовершеннолетних
- Признаки мошенничества
- Не дай себя обмануть - МВД РБ
- Как не превратить iPhone в кирпич
- Комикс: Личные данные в интернете
- Безопасность в сети интернет
/* Базовые стили для страницы */
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #f4f7f6;
margin: 0;
padding: 20px;
}
.gallery-container {
max-width: 1200px;
margin: 0 auto;
padding: 10px;
}
.gallery-title {
text-align: center;
color: #1a365d;
margin-bottom: 30px;
font-size: 28px;
font-weight: 700;
}
/* Настройка адаптивной сетки (Grid) */
.image-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 20px;
}
/* Стили для каждой карточки */
.image-item {
background-color: #ffffff;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease, box-shadow 0.3s ease;
display: flex;
flex-direction: column;
}
/* Эффект при наведении мышки */
.image-item:hover {
transform: translateY(-5px);
box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}
/* Стилизация самих картинок */
.image-item img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}
/* Адаптивность для мобильных устройств */
@media (max-width: 480px) {
body {
padding: 10px;
}
.gallery-title {
font-size: 22px;
margin-bottom: 20px;
}
.image-grid {
gap: 15px;
}
}
/* Базовые стили для страницы */
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #f4f7f6;
margin: 0;
padding: 20px;
}
.gallery-container {
max-width: 1200px;
margin: 0 auto;
padding: 10px;
}
.gallery-title {
text-align: center;
color: #1a365d;
margin-bottom: 30px;
font-size: 28px;
font-weight: 700;
}
/* Настройка адаптивной сетки (Grid) */
.image-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 20px;
}
/* Стили для каждой карточки */
.image-item {
background-color: #ffffff;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
transition: transform 0.3s ease, box-shadow 0.3s ease;
display: flex;
flex-direction: column;
}
/* Эффект при наведении мышки */
.image-item:hover {
transform: translateY(-5px);
box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}
/* Стилизация самих картинок */
.image-item img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}
/* Адаптивность для мобильных устройств */
@media (max-width: 480px) {
body {
padding: 10px;
}
.gallery-title {
font-size: 22px;
margin-bottom: 20px;
}
.image-grid {
gap: 15px;
}
}