@charset "utf-8";
/* CSS Document */

/* GLOBAL */

/*html {
    overflow-x: hidden;
	max-width:100%;
}*/

@font-face {
    font-family: 'Gill Sans';
    src: url('GillSansStd.otf');
}

html {
	overflow-y: hidden; 
	overflow-x: hidden;
}

body {
	font-family: 'Gill Sans', 'Gill Sans MT', Gill Sans, 'sans-serif';
	color: rgba(221,221,221,1.00);
	background-color: rgba(32,32,32,1.00);
	vertical-align: top;
	text-align: center;
	margin:  0px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	width: 100%;
}

hr {
	color: rgba(221,221,221,1.00);
	background-color: rgba(221,221,221,1.00);
	text-align: center;
	height: 0.3vh;
	width: 67%;
	border-width:0;
	margin-top:  1vh;
	margin-right: auto;
	margin-bottom: 1vh;
	margin-left: auto;
}

h1 {
	font-size: clamp(2.75vh, 3.25vw, 4.5vh);
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	text-align: center;
	max-height: 10vh;
}

h2 {
	font-size: clamp(1.5vh, 1.75vw, 3vh);
	line-height: normal;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

h3 {
	font-size: clamp(1.25vh, 1.75vw, 3vh);
	line-height: normal;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

a:link {
	color: #EEE;
	text-decoration: underline;
	outline: none;
	font-weight: bold;
}

a:visited {
	color: #EEE;
	text-decoration: underline;
	outline: none;
	font-weight: bold;
}

a:hover {
	text-decoration: underline;
	color: aqua;
	outline: none;
	font-weight: bold;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

a:active {
	text-decoration: underline;
	outline: none;
	color: #FFF;
	font-weight: bold;
}

:focus {outline:none;}

/* DIVS */

div.textlayout {
	display: flex;
	flex-flow: column;
	align-items: center; 		/* Center vertically */
	justify-content: center;
	width: 90%;
	margin: auto;
	padding-top: 2vw;
	padding-bottom: 6vw;
}

.text_block {
	display: block;
	float: none;
	clear: both;
	font-size: clamp(1.75vh, 1.75vw, 3vh);
	line-height: normal;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	text-align: left;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

.text_block_centered {
	display: block;
	float: none;
	clear: both;
	font-size: clamp(1.75vh, 1.75vw, 3vh);
	line-height: normal;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	text-align: center;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

.textMonospaceBold {
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
}

div.flexlayout {
	display: flex;
    align-items: center; 		/* Center vertically */
    justify-content: center; 	/* Center horizontally */
	width: 100vw; 				/* Full viewport width */
	height: 100vh;  			/* Full viewport height */
	max-width:100%;
}

div.thumblayout {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	margin: auto;
	width: 90%;
	height: 100%; 
	gap: 4vw;
	padding-top: 2vw;
	padding-bottom: 6vw;

}

div.video_thumblayout {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin: auto;
	width: 90%;
	height: 100%; 
	gap: 4vw;
	padding-top: 2vw;
	padding-bottom: 6vw;
	text-decoration: none;
}

div.video_thumblayout a {
	text-decoration: none;
}

div.video_thumblayout img {
	width: 100%;				/* image must have some width and height for object-fit to work */
	height: 18vw;
	object-fit: contain;
}

div.video_thumblayout figure {
	margin: 0;
	padding: 0;
}

div.video_thumblayout figcaption {
	font-size: 2vw;
	font-style: italic;
	line-height: 2.5vw;
	margin: 0;
}

.image_big {
	width: 100%;				/* image must have some width and height for object-fit to work */
	height: 100%;
	object-fit: contain;
	max-width: 100vw;
    max-height: 100vh;
}

.image_medium img {
	object-fit: contain;
	width: 40vw;
}

div.video_container {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin: auto;
	width: 90vw;
	height: 100%;
	padding-top: 3vw;
	padding-bottom: 2vw;
}

.video_single {
	width: 67vw;
	object-fit: contain;
}

div.video_lightbox_layout {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: auto;
	width: 99vw; 
	padding-right: 1vw;
	height: 100vh;  			/* Full viewport height */
	background-color: rgba(0,0,0,1.00);
}

span.video_lightbox_container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: auto;
	width: 90vw;
	height: 100vh;
}

span.video_lightbox video {
	margin: 0;
	padding: 0;
	width: 85vw;
	max-height: 75vh;
	max-width: 85vw;
}

a.video_lightbox_close,
a.video_lightbox_prev,
a.video_lightbox_next {
  z-index: 999999;
  position: fixed;
  text-decoration: none;
  color: rgba(221,221,221,1.00);
  font-size: clamp(6vh, 8vw, 10vh);
}

a.video_lightbox_close {
  top: 2%;
  right: 2%
}

a.video_lightbox_prev,
a.video_lightbox_next {
  top: 50%;
  transform: translate(0%, -50%);
}

a.video_lightbox_prev {
  left: 1%;
}

a.video_lightbox_next {
  right: 1%;
}

/* NAVBAR */

#navbar {

	margin: auto;
/*	width: 100%;*/
	overflow: hidden;
	position: relative;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	text-align: center;
	padding-top: 2vw;
	padding-right: 1vw;
	padding-bottom: clamp(0.5vw, 1vh, 1vh);
	padding-left: 0px;
	border: 0px none #000;
	width: 99vw;
}

#navbar ul {
	clear: left;
	float: left;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: relative;
	left: 50%;
	text-align: center;
}

#navbar li {
	display:block;
	float:left;
	list-style:none;
	margin:0;
	padding:0;
	position:relative;
	right:50%;
}

.button {
	color: rgba(221,221,221,1.00);
	display: block;
	float: center;
	text-align: center;
	height: clamp(5vw, 5vw, 8vw);
	line-height: clamp(5vw, 5vw, 8vw);
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: clamp(2.5vw, 2.5vw, 4vw);
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	background-attachment: scroll;
	background-color: rgba(0,0,0,1.00);
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-left: 1.5vw;
	padding-right: 1.5vw;
	padding-top: 0;
	padding-bottom: 0;
	outline: none; /* hide dotted outline in Firefox */
} 

.button_current {
	color: #000;
	display: block;
	float: center;
	text-align: center;
	height: clamp(5vw, 5vw, 8vw);
	line-height: clamp(5vw, 5vw, 8vw);
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size: clamp(2.5vw, 2.5vw, 4vw);
	font-weight: bold;
	font-variant: normal;
	background-attachment: scroll;
	background-color: rgba(192,192,192,1.00);
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-left: 1.5vw;
	padding-right: 1.5vw;
	padding-top: 0;
	padding-bottom: 0;
	outline: none; /* hide dotted outline in Firefox */
} 

a.button:link {
	text-decoration: none;
}

a.button:active {
	color: crimson;
	outline: none; /* hide dotted outline in Firefox */
	text-decoration: none;
}
