:root {
    --color-main: #626262;
    --color-second:  #7d7d7d;
    --color-third:   #b4ad9e;
    --color-hover: #03a9f4;
    --font-family: "Playfair Display", sans-serif;
    --second-family: "Ubuntu", sans-serif;
}

body {
    
    font-family: var(--font-family);
    font-size: 14px;
    color: var(--color-main);
    background-color: #beffff;
}

.container {
    width: 905px;
    margin: 0 auto;
    outline: 1px solid red;
    
}

/*! header */
.header {
    padding-top: 71px;
    padding-bottom: 92px;
    /* background-color: #ffebd3; */
}

.header-nav-list {
    width: 555px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    /* outline: 1px dashed #2a2a2a; */
}

.header-nav-list-item-link {
    text-transform: lowercase;
    text-transform: uppercase;
    color: var(--color-second);
}
.header-nav-list-item-link:hover {
    color: var(--color-hover);
}

/*! section gallery */
.gallery {
    margin-bottom: 66px;
    /* background-color: #daffda; */
}

.gallery-title {
    display: none;
}

.gallery-list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 65px;
    row-gap: 130px;
}
.gallery-list-item {
    flex-basis: calc((100% - 65px) / 2);
}

.gallery-list-item-img {
    margin-bottom: 62px;
}

.gallery-list-item-link {
    display: block;
    margin-bottom: 32px;
    font-family: var(--second-family);
    font-weight: 300;
    color: var(--color-third);
}

.gallery-list-item-title {
    margin-bottom: 40px;
    font-weight: 400;
    font-size: 30px;
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

/** flex-colum-container */
.flex-colum-container {
    display: flex;
    flex-direction: column;
}

.gallery-button {
    align-self: center;
    margin-top: 90px;
    padding: 20px 48px 21px 48px;
    background-color: inherit;
}