@charset "utf-8";

@font-face { 
    font-family: "INSB";
    src: url("/site/fonts/inform-std-bold.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
 }

main {
	display: block;
	width: fit-content;
	margin: auto;
}

.hrblack {
	display: block;
	border-bottom: 0.075rem solid #000000;
	margin: 1.25rem auto 1.075rem auto;
}

#introduction {
	display: inline-block;
	vertical-align: top;
	font-size: 1rem;
	line-height: 1.375rem;
	width: 67.5rem;
	margin: 1rem 0.75rem 1rem auto;
	background-color: #363636;
	border-radius: 1rem;
	padding: 1rem 0rem 1rem 0rem;
	text-align: left;
}
#title, #mtitle {
	display: block;
}
h1 {
	font-family: "INSB";
	font-size: 1.25rem;
	text-align: center;
	color: #FFED00;
	padding-top: 0.25rem;
}
#text {
	display: block;
}
#text p {
    display: block;
    margin-block-start: 0.75em;
    margin-block-end: 0.75em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	padding: 0rem 1rem 0rem 1.5rem;
}
#text > .hrblack {
	width: 65.5rem;
}

#mtext {
	display: block;
	margin: auto;
}
#mtext p {
    display: block;
    margin-block-start: 0.75em;
    margin-block-end: 0.75em;
    margin-inline-start: 0;
    margin-inline-end: 0;
	padding: 0rem 1rem 0rem 1.5rem;
}
#mreadmore {
	display: block;
	text-align: right;
	padding-right: 1.5rem;
}
#mreadmore.inactive {
	display: none;
}
#mreadmoretext {
	display: none;
}
#mreadmoretext.active {
	display: block;
}
#mreadmore > button {
	border: none;
	cursor: pointer;
	background-color: transparent;
	font-size: 1em;
	color: #FFED00;
	padding: 0;
}
#mreadmore > button:hover {
	transition: 0.25s;
	color: #9A9999;
}

#gallerylinks {
	display: inline-block;
	vertical-align: top;
	width: 29.25rem;
	height: auto;
	margin: 1rem auto 1rem auto;
	background-color: #363636;
	border-radius: 1rem;
	padding: 1.25rem 1rem 1rem 1rem;
	overflow-x: hidden;
	scroll-behavior: smooth;
}
#gallerylinks > .hrblack {
	width: 26.75rem;
}

#linkdt, #linkdt a {
	display: block;
	font-size: 1rem;
	line-height: 1.25rem;
	color: #FFFFFF;
	width: fit-content;
	margin: 1rem auto 1rem auto;
}
#linkdt a:hover {
	transition: 0.25s;
	color: #9A9999;
}
#link {
	display: block;
    position: absolute;
    top: 0rem;
    right: 0rem;
    font-size: 1rem;
    height: 1rem;
    padding: 2rem 1.5rem 1.25rem 0.75rem;
    border-radius: 0rem 1rem 0rem 1rem;
    color: #FFFFFF;
    width: fit-content;
    background-color: rgba(0,0,0,0.75);
}
#linkm, #linkm a {
	display: block;
	font-size: 1rem;
	line-height: 1.5rem;
	color: #FFFFFF;
	width: fit-content;
	margin: 1rem auto 1rem auto;
	text-align: center;
}

#name {
	display: inline-block;
	padding-left: 0.5rem;
}
#email {
	display: inline-block;
	float: right;
	padding-right: 0.5rem;
}

#mname {
	display: inline-block;
	padding-left: 1.5rem;
}
#memail {
	display: inline-block;
	float: right;
	padding-right: 1.5rem;
}

#image {
	display: block;
	position: relative;
	width: 27.25rem;
	height: 18.82rem;
	background-color: #000000;
	margin-bottom: 1rem;
	padding: 1rem;
	line-height: 0rem;
	border-radius: 1rem;
}
#image a:hover {
	transition: 0.25s;
	filter: brightness(50%);
}
#image a > figure {
	display: block;
	animation-name: slideAnimation;
	animation-duration: 15s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	background-size: contain;
	background-repeat: no-repeat;
	color: transparent;
	opacity: 0;
	position: absolute;
	margin-top: 0;
	width: 25.25rem;
	height: 16.82rem;
	border-radius: 1rem;
	z-index: 0;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0;
	margin-inline-end: 0;
}

#image a > figure:nth-child(1) { background-image: url("slideshow-01.jpg"); }
#image a > figure:nth-child(2) { animation-delay: 3s; background-image: url("slideshow-02.jpg"); }
#image a > figure:nth-child(3) { animation-delay: 6s; background-image: url("slideshow-03.jpg"); }
#image a > figure:nth-child(4) { animation-delay: 9s; background-image: url("slideshow-04.jpg"); }
#image a > figure:nth-child(5) { animation-delay: 12s; background-image: url("slideshow-05.jpg"); }

@keyframes
slideAnimation {
0% { animation-timing-function: ease-in-out; opacity: 0; }
1.667% { animation-timing-function: ease-in-out; opacity: 1; }
18.333% { animation-timing-function: ease-in-out; opacity: 1 }
20% { animation-timing-function: ease-in-out; opacity: 0 }
100% { animation-timing-function: ease-in-out; opacity: 0 }
}




@media screen and (min-width: 1265px) {
#mtext {
	display: none;
}
#link {
	display: none;
}
}

@media screen and (max-width: 1264px) {
#introduction {
	display: block;
	width: 64.75rem;
	margin: 1rem auto 1rem auto;
}
#text {
	display: none;
}
#mtext > .hrblack {
	width: 62.75rem;
}
#gallerylinks {
	width: 64.75rem;
	margin: 0rem auto 1rem auto;
	padding-bottom: 0rem;
}
#gallerylinks > .hrblack {
	display: none;
}
#image {
	width: 62.75rem;
	height: 42.46rem;
}
#image a > figure {
	width: 60.75rem;
	height: 40.46rem;
}
#linkdt {
	display: none;
}
#name, #email {
	display: none;
}
}

@media screen and (min-width: 850px) {
#mtitle {
	display: none;
}
}

@media screen and (max-width: 849px) {
#introduction {
	width: 42.25rem;
}
#introduction h1 {
	line-height: 1.5em;
}
#title {
	display: none;
}
#mtitle {
	display: block;
}
#mtext > .hrblack {
	width: 40.25rem;
}
#gallerylinks {
	width: 42.25rem;
}
#gallerylinks > .hrblack {
	display: none;
}
#image {
	width: 40.25rem;
	height: 27.47rem;
}
#image a > figure {
	width: 38.25rem;
	height: 25.47rem;
}
}

@media screen and (min-width: 450px) {
#linkm {
	display: none;
}
}

@media screen and (max-width: 449px) {
#introduction {
	width: 21.25rem;
}
#mtext > .hrblack {
	width: 19.25rem;
}
#gallerylinks {
	width: 21.25rem;
}
#image {
	width: 19.25rem;
	height: 13.49rem;
}
#image a > figure {
	width: 17.25rem;
	height: 11.49rem;
}
#link {
	display: none;
}
}