body {
font: 16px/1.3 Helvetica, Arial, sans-serif;
}
.title {
font-weight: normal;
font-size: 26px;
margin: 2rem 0;
}
.title .seg {
color: #000;
text-decoration: none;
}
.title .sep {
color: #bbb;
}
.container {
max-width: 720px;
margin: 2rem;
}
.max {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
background-color: black;
justify-content: space-between;
}
.max .container {
padding: 1rem 2rem;
margin: 0;
width: 100%;
max-width: initial;
background: rgba(255,255,255,.9);
opacity: 0;
transition: opacity .2s;
}
.max .container:hover {
opacity: 1;
}
/* photoset */
.photoset {
margin-bottom: 3rem;
}
.photoset a {
text-decoration: none;
color: #000;
}
.photoset img {
width: 100%;
}
.photoset h3 {
text-align: center;
margin: 1rem 0 0;
font-size: 20px;
font-weight: normal;
}
/* photo */
.photo {
margin-bottom: 3rem;
}
.max .photo {
flex: 1;
}
.photo a {
text-decoration: none;
color: #000;
/* height: 100%; */
/* width: 100%; */
/* display: block; */
/* background-repeat: no-repeat; */
/* background-size: contain; */
/* background-position: 2rem 0; */
}
.photo img {
max-height: 100%;
max-width: 100%;
}
.photo h3 {
margin: 1rem 0;
font-size: 16px;
font-weight: normal;
}