/* noto-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('https://cils.org/resources/fonts/noto-sans-v27-latin/noto-sans-v27-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
       url('https://cils.org/resources/fonts/noto-sans-v27-latin/noto-sans-v27-latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


img {margin:3px;}

.logo-container {position: relative; width: 90%; padding-bottom: 30%; margin: 5%; float: left; height: 0;}
.logo-S-container {position: relative; width: 22.5%; padding-bottom: 90%; margin: 5%; float: left; height: 0;}

.sq-container {position: relative; width: 40%; padding-bottom: 40%; margin: 5%; float: left; height: 0;}
.sq-S-container {position: relative; width: 25%; padding-bottom: 25%; margin: 5%; float: left; height: 0;}

.portrait-L-container {position: relative; width: 44%; padding-bottom: 60%; margin: 1%; float: left; height: 0;}
.portrait-container {position: relative; width: 22%; padding-bottom: 30%; margin: 1%; float: left; height: 0;}
.portrait-S-container {position: relative; width: 11%; padding-bottom: 15%; margin: 1%; float: left; height: 0;}

.caption-container {width:100%; background-color: rgba(0, 0, 0, 0.5); position:absolute; bottom:0px; padding: 0px;}
.caption-container p {color:#fff; text-align:center; font-size:0.8em; margin: 0px; line-height: 1;}