* { margin: 0px; }
* { padding: 0px; }

html{ height: 100%; }
body{
    background-image: url(./foto/background.JPG);
    background-size: cover;                         /* изменить размер фонового изображения, чтобы оно покрывало весь контейнер, даже если для этого придется растянуть изображение или немного обрезать один из краев */
    height: 100%;
}

header h1{
    text-align: center;
    margin-top: 2%;
    font-size: 4em;
    text-transform: uppercase;
    font-weight: 800;
}

div.galery{
    width: 75%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-top: 2%;
    height: 80%;
}

div.galery figure img{
    margin-bottom: 5px;
    margin-right: 1px;
    width: 460px;                                   /* манипуляции шириной пропорционально изменяют и высоту изображений, но если хочется можно высоту задать вручную */
}

div.galery figure{
    float: left;
    margin-bottom: 35px;
}

div.galery figure img:hover{
    animation-name: my_animation;
    animation-duration: 1s;
    animation-fill-mode: forwards;                  /* при завершении анимации она остаётся в конце изменённой */
}
@keyframes my_animation{
    100% { transform: scale(1.5); }                 /* scale масштабирует объект в 1,5 раза */
}


figcaption{
    font-size: 1.3em;
    font-weight: 600;
    text-shadow: 1px 1px 2px white;
}

.download{
    position: fixed;   
    bottom: 0;
    right: 0;
    margin-right: 10em;
    margin-bottom: 10em;
}

.download a{
    color: blue;
}