@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap');
@font-face {
	font-family: 'LCALLIG';
	src: local("Lucida Calligraphy"), url('/css/LCALLIG.ttf') format('truetype');
}
@font-face {
	font-family: 'CALISTOMT';
	src: local("Calisto MT"), url('/css/CALIST.ttf') format('truetype');
}
:root {
    --doc-bg-color: #242527;
	--pColor:#999;/*rgba(89,153,99,1.00);*/
	--aColor:#BCA4D3/*rgba(133,119,187,1.00);#BCA4D3;#BFBFBF;#74BA59*/;
}
    html {
        height: 100%;
        scroll-behavior: smooth;
    }
	body {
		overflow-x: hidden;
		background: #242527;
        color: #999; 
        font-family: "Merriweather", serif;
	}
	#indexFrame {
		width: 0px; height:515px;
		border: 0px;
		position: fixed;left: 0px;top:0px;z-index: 6;
		overflow: auto;
		overflow-x: hidden;
		transition:.5s ease;
		border-radius:0px 12px 11px 0px;
		box-shadow:0px 0px 6px 1px rgba(57, 191, 117, .5),0px 0px 20px 10px rgba(0, 0, 0, 0.77),inset 0px 0px 0px 20px #1F1F1F;
	}
	.initIndex{
		width: 20px;position: absolute;left: 0px;top: 5px; z-index: 5;
	}
	svg {
		position: absolute;
	}
	.divHeader {
		display:flex;align-items: center;justify-content: center;
		filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
		margin: 0 auto;
	}
	.divSideHeader {
		position: relative;padding-left: 50px;
        max-width: 667px;margin: auto;
		filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
	}
	.svgHeader {
		filter: url(#svgfilter);
        will-change: filter;
		font-size: 3.5em;
        text-align: center;
	}
	.svgSubHeader {
		filter: url(#svgfilter);
		font-size: 2.5em;
        text-align: center;
	}
	.svgSubHeader2 {
		filter: url(#svgfilter) drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
		font-size: 1.8em;
		text-indent: 50px;
		font-family:"Calisto MT";
		color:rgb(105, 112, 83);
	}
	.home {
		position: fixed; top: 0px; left: 0px; width: 100px; height: 100px;z-index: 1; cursor: pointer;
		transition: 0.4s;
        border-radius: 50%;
        background-image:radial-gradient(circle at 50% 52%, rgba(112, 104, 158, 0.44) 0%, rgb(27, 15, 46) 42%, rgba(38, 38, 41, 0.63) 53%);
	}
	.home:hover{
		filter:hue-rotate(0deg) brightness(140%) contrast(120%);
		transition: 0.4s;
	}
    .openindex:hover{
		filter:hue-rotate(0deg) brightness(140%) contrast(120%);
		transition: 0.4s;
	}
    .openindex {
		position: fixed; top: 0px; left: 10px; width: 100px; z-index: 1; cursor: pointer;
		transition: 0.4s;
        border-radius: 50%;
        background-image:radial-gradient(circle at 50% 52%, rgba(112, 104, 158, 0.44) 0%, rgb(27, 15, 46) 42%, rgba(38, 38, 41, 0.63) 53%);
    }
   h1.h1 {
        padding-top: 1em;
        padding-bottom: 1em;
		font-size: 3.5em;
		letter-spacing: 1px;
	}
    h1, h2, h3 {
        font-family: 'CALISTOMT';
		filter:url(#svgfilter) brightness(116%) contrast(96%) drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
/*		filter:url("/images/filters.svg#svgfilter") brightness(116%) contrast(96%) drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
*/      will-change: filter;
		color:rgba(33,56,37,1.00);
        text-align: center; 
        margin: 0;
        padding: 0;
        font-size: 100%;
        font-weight: normal;
	}
    h2.h2 {
		font-size: 2.5em;
        padding: 1em;
		letter-spacing: 1px;
	}
    .seo-h1 {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        border: 0;
        padding: 0;
        white-space: nowrap;
        clip-path: inset(100%);
        clip: rect(0 0 0 0);
        overflow: hidden;
    }
    h3.h3 {
		filter: url(#svgfilter) drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
		font-size: 2em;
		text-indent: 50px;
		font-family:"Calisto MT";
		color:rgb(105, 112, 83);
        max-width: 667px;margin: auto;
    }
    h3 {
 		position: relative;
        padding: 1em 0 1em 50px;
        max-width: 667px;
		filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, .7));
        text-align: left;
		font-size: 2em;
    }
	.center {
		text-align: center; 
        display: block; 
        margin: 0 auto;
        max-width: 667px;
	}
    .center img {
        max-width: 100%; 
        height: auto;
    }
    aside, aside > p {
		font-family: "Lucida Calligraphy";
		font-size: 1.06em;
		text-align: center;
		color: rgba(159, 189, 164, 0.98);
        line-height:29px;
	}
	header {
		font-family:"Calisto MT";
        text-shadow:0px 0px 1px rgba(0, 3, 1, 1);
        font-weight: bold;
        color:rgba(94, 62, 62, 1);
		font-size: 3em;
	}
	.svgLink {
		filter: url(#svgfilter);
        will-change: filter;
		font-size: 2.1em;
		padding: .1em;
        text-align: center;
	}
	.svgLink > a {
		color:rgba(66,117,75,1.00);
		transition: 0.3s;
	}
	.svgLink > a:hover {
		color: rgba(89,153,99,1.00);
		transition: 0.3s;
	}
	.title {
		display:block;margin: 0 auto;
		margin-bottom: 2em;
		filter: drop-shadow(0px 3px 3px rgba(0, 0, 0, .8)) ;
	}
	.divide {
		font-size: 3em; text-align: center; font-family: 'Lucida Calligraphy', 'LCALLIG';
		filter: url(#svgfilter);text-shadow:1px 2px 3px rgba(0, 0, 0, 1);
        will-change: filter;
        font-weight: bold;   color:rgba(94, 62, 62, 1);
	}
	a {
		text-decoration: none;
        color: var(--aColor, rgba(89,153,99,1.00)); 
		cursor: pointer;
		transition: 0.2s;
		display: inline-block;
		position: relative;
	}
	a:hover {
		color: #AF86D7;
		transition: 0.2s;
	}
    p > a:not(.exclude)::after{
        content: "";
        background-color: #BCA4D3;
        position: absolute;
        display: block;
        width: 100%;
        height: 1px;
        bottom: 0;
        left: 0;
        transform: scaleX(0);
        transition: transform 0.3s ease;
    }
    p > a:hover::after {
      transform: scaleX(1);
    }
	div > p {
		text-align: center;
	}
	p {
/*		color: #8dbc94;
		color: #957C61;
*/
        color: #999; 
        font-family: "Merriweather", serif;
        font-weight: 300;
        font-style: normal;
        font-size: 1.1rem;
        line-height: 1.5;
		max-width: 667px;
		margin: auto;
		text-align: justify;
	}
    .firstLetter::first-letter {
        font-size:200%;
        vertical-align:-20%;
        line-height:75%;
    }
	a > img:hover:not(.home) {
		filter:hue-rotate(41deg) brightness(104%) contrast(192%);
		transition: 0.4s;
	}
	a > img {
		filter:hue-rotate(0deg) brightness(100%) contrast(100%);
		transition: 0.4s;
	}
	.vidbtn:hover {
		filter: drop-shadow(2px -1px 0px rgba(65, 168, 111, 1)) drop-shadow(-1px 1px 0px rgba(0, 0, 0, 1));
		transition: 0.3s;
	}
	li {
        color: #999; 
        font-family: "Merriweather", "CALISTOMT", serif;
/*		color: #8dbc94;
		font-family: 'Calisto MT', "CALISTOMT";
		font-size: 1.2em;
*/		max-width: 667px;
		margin: auto;
	}
	.gatepart{
		filter:hue-rotate(185deg) invert(86%) ;
	}
	.asterpart {
		filter:invert(86%) opacity(86%) hue-rotate(184deg) drop-shadow(0px 9px 4px rgba(0, 0, 0, 1));
	}

	.frame {box-shadow:0px -1px 9px 2px rgba(57, 191, 117, 1),0px 0px 11px 10px rgba(10, 9, 6, 0.62);}
	.iFrame2 {
		width:350px; height:250px;
		border: 0px;
		display:block;
		margin: 0 auto;
	}
    nav > .endshow {
		display:block;margin: 0 auto;
        border-radius: 50%;
        background-image:radial-gradient(circle at 50% 52%, rgba(112, 104, 158, 0.44) 0%, rgb(27, 15, 46) 42%, rgba(38, 38, 41, 0.63) 53%);
        cursor: pointer;
        width: 100px;
    }
	nav > .endshow:hover{
		filter:hue-rotate(0deg) brightness(140%) contrast(120%);
		transition: 0.4s;
	}
	.bottom {
		display:block;margin: 0 auto;
		position: relative;	
	}
	.bottom > div {
		display:block;margin: 0 auto;
		height: 50px; 
		padding: 5px;
		padding-bottom: 20px;
		text-align: center;
	}
	.bottom > div > a > img{
        border-radius: 50%;
        background-image:radial-gradient(circle at 50% 52%, rgba(112, 104, 158, 0.44) 0%, rgb(27, 15, 46) 42%, rgba(38, 38, 41, 0.63) 53%);
	}
	.bottom > div > a > img:hover{
		filter:hue-rotate(0deg) brightness(140%) contrast(120%);
		transition: 0.4s;
	}
	.bottom-index {
		display:block; margin:0 auto;
		width:100px; height:100px;
        border-radius: 50%;
        background-image:radial-gradient(circle at 50% 52%, rgba(112, 104, 158, 0.44) 0%, rgb(27, 15, 46) 42%, rgba(38, 38, 41, 0.63) 53%);
	}
    .imgStyle {
        filter: drop-shadow(3px 4px 6px rgba(0, 0, 0, 1));margin: auto;display: block; 
    }

	footer, .footer {
		position: relative; bottom: 5px; text-align: center;
		padding-top: 5em;
		padding-bottom: 2em;
		font-family: Garamond;
		font-size: 1em;
		z-index: 1;
	}
	footer::after, .footer::after {
		content: "Optimised for Chrome on PC. Not suitable for touch screens. \A Copyright \000A9 2018-2026 Edmund Wood; all rights reserved. \A No tracking, no consents necessary.";white-space: pre;
	}  

.nogo {
		cursor: not-allowed;
		filter:initial;
	}
.window-shadow-scroll{
	width: 20px;position: absolute;right: -21px;top: 0px; z-index: 5;
	border-radius:0px 12px 11px 0px;
	box-shadow:0px 0px 20px 10px rgba(0, 0, 0, 0.50);
}
.window-shadow-top{
	position: fixed;left:0px;top: 0px; width: 100%; z-index: 5;
	border-radius:0px 12px 11px 0px;
	box-shadow:0px 0px 20px 10px rgba(0, 0, 0, 0.50);
}
.window-shadow-bottom{
	position: fixed;left:0px;bottom: 0px; width: 100%; z-index: 5;
	border-radius:0px 12px 11px 0px;
	box-shadow:0px 0px 20px 10px rgba(0, 0, 0, 0.50);
}
input{border-radius: 15px;}
button:focus {outline:0;}
input:focus {outline:0;}
textarea:focus {outline:0;}

::-webkit-scrollbar {
  width: 20px;
}
::-webkit-scrollbar-track {
	box-shadow:inset 0px 0px 3px 0px rgba(57, 191, 117, 1);
	border-radius: 10px;
	background:rgba(0, 0, 0, .1);
}
::-webkit-scrollbar-thumb {
	box-shadow:inset 0px -2px 2px 0px rgba(9, 33, 20, 1),inset 1px -1px 2px 0px rgba(55, 191, 116, 0.46),inset 0px -1px 7px 6px rgba(0, 0, 0, 1),inset 2px 9px 6px 4px rgba(57, 191, 117, 1);
	background:rgb(85, 85, 85);
	border-radius:20px;
}
::-webkit-scrollbar-thumb:hover {
  background: #888; 
}
::-webkit-scrollbar-corner {
  background: #222; 
}