/* ==========================================================================
   reset
   ========================================================================== */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,pre,a,abbr,acronym,address,cite,code,del,dfn,em,img,ins,q,s,small,strike,strong,sub,sup,var,b,u,i,ol,ul,li,form,label,article,aside,canvas,details,figure,figcaption,footer,header,hgroup,nav,output,section,summary,time,mark,audio,video { border: 0; font-size: 100%; font: inherit; vertical-align: baseline; margin: 0; padding: 0; }
article,aside,figcaption,figure,footer,nav 		{ display: block; }
body 											{ line-height: 1; }
ol, ul 											{ list-style: none; }
* 												{ margin: 0; padding: 0; }
*, *:before, *:after 							{ box-sizing: border-box; }


/* ==========================================================================
   custom
   ========================================================================== */

html, body 										{ width: 100%; height: 100%; }
body											{ display: flex; justify-content: center; align-items: center; padding: 10vh 10vw; margin: 0; width: 100vw; height: 100dvh; background: #666; font-family: Helvetica, 'Helvetica Neue', Arial, sans-serif; }
figure 											{ display: inline-block; position: relative; }
figcaption										{ position: absolute; bottom: 12%; left: 50%; transform: translate(-50%, 50%); }
a figcaption 									{ color: #333; font-weight: bold; letter-spacing: .075em; text-decoration: none; opacity: .5; font-size: min(max(.875rem,2vw),2rem); transition: opacity .5s; }
a:hover figcaption 								{ opacity: 1; }
img 											{ width: auto; max-width: min(900px, 60vw); height: auto; max-height: min(682px, 60dvh); filter: drop-shadow(0 3vh 6vh rgba(0,0,0,.25)); }