@import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Rye&family=Merienda&family=Noto+Sans+Symbols+2&family=Orbitron&family=VT323&family=Roboto+Mono:wght@200;400&display=swap');

/* Colors
	 Header Text: #ffffff
	 Text: #d8d8d8
	 Background: #0f0f0f
*/

:root {
	--main_text_blue_color: rgba(99, 138, 255, 0.9);
	--main_border_blue_color: rgba(67,111,243,1.0);
	--main_headerText_color: #c2c7cc;
	--main_subText_color: #8b8e91;
	--main_subText_colorTeal: #00f1ff;
	--main_button_green_color: rgba(0,187,23,90%);
	--main_button_orange_color: rgba(255,164,7,70%);
	--main_genTitle_color: #99a8b8;
}

html {
	overflow-y: scroll;
	overflow-x: hidden;
	scroll-behavior: smooth;
}

body {
	/*overflow-y: scroll;*/
	overflow-x: hidden;
	/*background-color: #111821;*/
	/*background: no-repeat center center fixed;*/
	width: auto;
	max-width: 100%;
	height: 100%;
	background: #000000; /*Backup*/
	background-size: cover;
	background-image: linear-gradient(rgba(67,111,243,8%) 0%, transparent 50%, rgba(67,111,243,8%) 100%), url('Hex_7.jpg');
	background-repeat: no-repeat, no-repeat;
	background-position: center;
	background-attachment: fixed;
	/*cursor: url("src/img/CustomCursor_5_5s.png"), auto;*/
	font-family: verdana; /*backup font*/
}

.noscroll {
	margin: 0;
	height: 100%;
	overflow: hidden;
	/*position: fixed;*/
}

main {
	text-align:center;
	margin-top: 20px;
	/*margin-bottom: 40px;*/
}

nav {
	cursor: default;
}

/*.fullContent {
	display: none;
}*/

header {

}

footer {

}

a {
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}

br {
	/*cursor: url("src/img/CustomCursor_5_5s.png"), auto;*/
}

#myBtn {
	display: none;
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 1004;
	outline: none;
	cursor: pointer;
	font-size: 38px;
	padding-top: 10px;
	padding-left: 30px;
	padding-right: 20px;
	transition: .2s all ease-in;
	color: rgba(215,215,215);
	border: solid 2px rgba(56,56,56,30%);
	background-color: rgba(56,56,56,75%);
	border-radius: 80% 0 0 0;
	box-shadow: 0px 0px 6px 2px #d7d7d7;
	font-family: 'Noto Sans Symbols 2', sans-serif;
	-webkit-appearance: none;
	-webkit-font-smoothing: antialiased;
	font-synthesis: none;
	text-rendering: optimizeLegibility;
}

#myBtn::after {
	/*content: "⮝";*/
	/*content: "⇪";*/
	/*content: '⛰';*/
	/*content: '⭱';*/
	/*content: '⮴';*/
	content: '🡱';
}

#myBtn:focus {
	color: rgba(215,215,215);
	background-color: rgba(56,56,56,75%);
}

#myBtn:hover {
	color: rgba(215,215,215);
	background-color: rgba(56,56,56,75%);
}

#myBtn:active {
	color: #383838;
	background-color: rgba(215,215,215);
}

/*Custom hamburger menu icon - not in use*/
/*#menu_button {
	margin-top: 2vmin;
	margin-left: 2vmin;
	width: 8vmin;
	height: 8vmin;
	background-size: 100%;*/
	/* inline SVG element! */
	/*background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 120 80" width="40" height="40" version="1.0" xmlns="http://www.w3.org/2000/svg"><rect x="15" width="90" height="15" rx="10"></rect><rect x="15" y="30" width="90" height="15" rx="10"></rect><rect x="15" y="60" width="90" height="15" rx="10"></rect></svg>');
}*/


.closebtnT {
    margin: 0 auto;
    /*padding: 1em 2em;*/
    /*min-width: 200px;*/
    min-height: 50px;
    cursor: pointer;
    position: relative;
    height: 8vh;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    /*letter-spacing: 8px;*/
    gap: 0.5em;
}

.closebtnP, .closebtnA {
	margin: 0 auto;
	/*min-width: 20px;*/
	/*min-height: 50px;*/
	cursor: pointer;
	position: relative;
	width: 48px;
	/*height: 2vh;*/
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	align-content: center;
}

.xBtnTXT {
	font-family: 'nasalization', sans-serif;
	font-size: 24px !important;
	text-decoration: none;
	text-align: center;
	color: var(--main_headerText_color);
	padding: 0;
	margin: 0;
	display: inline-flex;
	letter-spacing: 4px;
	transition: all 0.5s ease-in-out;
	font-kerning: normal;

	--move: 0px;
	transform: translateX(var(--move));
	--letterSpace: 0.2em;
	letter-spacing: var(--letterSpace);
}

.xBtn {
	transition: all 0.5s ease-in-out;
	animation: xBtnOpacity 2s cubic-bezier(.31,.01,.51,.99);
}

/*.xBtnTXTLeft {*/
	/*padding: 0;
	padding-left: 12px;*/
	/*transform: scale(-1, 1);
}*/

.closebtnT:hover .xBtnTXT:first-of-type {
	--move: 18px;
	--letterSpace: -0.075em;
}

.closebtnT:hover .xBtnTXT:last-of-type {
	--move: -18px;
	--letterSpace: -0.075em;
}

/*.xBtn:hover .xBtnTXT {
	letter-spacing: -0.05em;
}*/

#xBtnLineBL, #xBtnLineBR, #xBtnLineTL, #xBtnLineTR,
#xBtnLineWTL, #xBtnLineWBR, #xBtnLineWBL, #xBtnLineWTR, #xBtnLineStTemp, #xBtnLineStTempW {
	transition: all 0.5s ease-in-out;
	stroke-dashoffset: 25;
	stroke-dasharray: 30;
	fill: none;
	stroke: var(--main_border_blue_color);
	stroke-width: 10px;
	stroke-linejoin: miter;
	stroke-linecap: round;
	filter: drop-shadow(0px 0px 3px var(--main_border_blue_color)) drop-shadow(0px 0px 8px var(--main_text_blue_color));
}

#xBtnLineWTL, #xBtnLineWBR, #xBtnLineWBL, #xBtnLineWTR, #xBtnLineStTempW {
	stroke-width: 2px;
	stroke: white;
	stroke-dashoffset: 10;
	filter: drop-shadow(0px 0px 3px white);
}

#xBtnLineStTemp, #xBtnLineStTempW {
	stroke-dashoffset: 0;
	stroke-dasharray: 0;
}

.xBtn #xBtnLineTL, .xBtn #xBtnLineWTL {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveTLReverse 0.5s ease-in-out forwards;
}

.xBtn #xBtnLineBR, .xBtn #xBtnLineWBR {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveBRReverse 0.5s ease-in-out forwards;
}

.xBtn #xBtnLineBL, .xBtn #xBtnLineWBL {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveBLReverse 0.5s ease-in-out forwards;
}

.xBtn #xBtnLineTR, .xBtn #xBtnLineWTR {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveTRReverse 0.5s ease-in-out forwards;
}

.xBtn:hover #xBtnLineTL, .xBtn:hover #xBtnLineWTL {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveTL 0.5s ease-in-out forwards;
	/*letter-spacing: 0px;*/
}
.xBtn:hover #xBtnLineBR, .xBtn:hover #xBtnLineWBR {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveBR 0.5s ease-in-out forwards;
	/*letter-spacing: 0px;*/
}
.xBtn:hover #xBtnLineBL, .xBtn:hover #xBtnLineWBL {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveBL 0.5s ease-in-out forwards;
	/*letter-spacing: 0px;*/
}
.xBtn:hover #xBtnLineTR, .xBtn:hover #xBtnLineWTR {
	transition: transform 0.5s ease-in-out;
	animation: xBtnMoveTR 0.5s ease-in-out forwards;
	/*letter-spacing: 0px;*/
}

@keyframes xBtnOpacity {
    100% {
        opacity: 100%;
    }
/*    75% {
        opacity: 50%;
    }
    50% {
        opacity: 25%;
    }*/
    0% {
        opacity: 0%;
    }
}

@keyframes xBtnTXTSpace {
	0% {
		letter-spacing: 8px;
	}
	100% {
		letter-spacing: 0px;
	}
}
@keyframes xBtnMoveTL {
	to {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}
	from {
		/*transform: translate(-25%,-25%);*/
		stroke-dashoffset: 25;
	}
}
@keyframes xBtnMoveBR {
	to {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}
	from {
		/*transform: translate(25%,25%);*/
		stroke-dashoffset: 25;
	}
}
@keyframes xBtnMoveBL {
	to {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}
	from {
		/*transform: translate(-25%,25%);*/
		stroke-dashoffset: 25;
	}
}
@keyframes xBtnMoveTR {
	to {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}
	from {
		/*transform: translate(25%,-25%);*/
		stroke-dashoffset: 25;
	}
}

@keyframes xBtnMoveTLReverse {
	from {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}

	to {
		/*transform: translate(-25%,-25%);*/
		stroke-dashoffset: 25;
	}
}

@keyframes xBtnMoveBRReverse {
	from {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}

	to {
		/*transform: translate(25%,25%);*/
		stroke-dashoffset: 25;
	}
}

@keyframes xBtnMoveBLReverse {
	from {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}

	to {
		/*transform: translate(-25%,25%);*/
		stroke-dashoffset: 25;
	}
}

@keyframes xBtnMoveTRReverse {
	from {
		/*transform: translate(0,0);*/
		stroke-dashoffset: 10;
	}

	to {
		/*transform: translate(25%,-25%);*/
		stroke-dashoffset: 25;
	}
}

#mobileMenu {
	display: none;
}

.fullMenu {
	display: inline-block;
}

.imgLogo {
    width: 16%;
    margin-left: auto;
    margin-right: auto;
}

.headerTxt {
	color: var(--main_headerText_color);
	font-size: 42px;
	/*font-family: 'nasalization', sans-serif;
	font-family: 'Orbitron', sans-serif;*/
	font-family: 'Audiowide', cursive;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1.2em;
	line-height: 1.8;
	font-weight: normal;
	/*transform: scale(1, 0.9);*/
	margin: auto;
	margin-top: 24px;
	margin-bottom: 42px;
	overflow: visible;
	text-shadow: -1px 1px 2px var(--main_headerText_color);
	/*animation: 10s ease-in-out headerColorChange infinite;*/
}

.headerTxt span {
	position: relative;
	/*left: 2%;*/
}

.headerBorder span {
	width: 90%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1em;
	background: linear-gradient(to right, #5a7eea 4px, transparent 4px) 0 0, linear-gradient(to left, #5a7eea 4px, transparent 4px) 100% 100%, linear-gradient(to bottom, #5a7eea 4px, transparent 4px) 0 0, linear-gradient(to top, #5a7eea 4px, transparent 4px) 100% 100%;
	background-repeat: no-repeat;
	background-size: 20px 20px;
}

.imgLogoMid, .viewMoreFeatures {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.viewMoreFeatures {
	text-align: center;
	color: #abafb3;
	color: #99a8b8;
	font-size: 16px;
	line-height: 1.4;
	font-family: 'Merienda', cursive; 
	/*font-family: 'Roboto Mono', monospace;*/
	/*font-weight: 400;*/
	display: block;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
}

@keyframes headerColorChange {
 0% {
	 text-shadow: 0 0 4px #ffa407;
	 color: #080808;
 }
 25% {
   text-shadow: 0 0 4px #436ff3;
	 color: #080808;
 }
 50% {
   text-shadow: 0 0 4px #00bb17;
	 color: #080808;
 }
 75% {
   text-shadow: 0 0 4px #436ff3;
	 color: #080808;
 }
 100% {
   text-shadow: 0 0 4px #ffa407;
	 color: #080808;
 }
}

h1 a,
h1 a:visited,
h1 a:hover,
h1 a:active {
	text-decoration: none;
	color: var(--main_headerText_color);
}

nav {
	color: var(--main_subText_color);
	width: 100%;
	font-size: 12px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: space-between;
	justify-content: center;
	align-items: stretch;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding-top: 10px;
	padding-bottom: 10px;
}

.buttonNav {
	color: var(--main_subText_color);
	width: 100%;
	font-size: 12px;
	display: block;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

/*.imgSocial {
	width: 16.66667%;
	height: 100%;
}*/

/*.socialBar {
	width: 100%;
	display: inline-flex;
	padding-top: 15px;
	padding-bottom: 15px;
}
*/
.socialBar {
	display: inline-flex;
	padding-top: 8px;
	padding-bottom: 8px;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	/* align-content: center; */
	flex-wrap: nowrap;
	flex-direction: row;
}

.socialProps {
	width: 80%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.socialProps img {
	width: 24%;
	max-width: 100%;
	height: auto;
}

.socialProps a {
	margin-left: auto;
	margin-right: auto;
}

a.link4 {
	color: #262a30;
	background-color: transparent;
	text-decoration: none;
	display: inline;
	text-align: center;
}

.socialHover:hover {
	filter: drop-shadow(0 0 2px #ffffff) brightness(1.25);
	animation: fadeinout 2s Ease-in-out infinite;
}

.twitterX:hover {
	content: url("src/icons/Twitter_X.png");
}

.menuIcon {
	width: 52px;
	text-align: center;
	vertical-align: middle;
	margin-left: auto;
	margin-right: auto;
}

.pageButtonColor,
.pageButtonColorSkew {
	text-align: center;
	font-family: 'Audiowide', cursive;
	/*font-family: 'Kdam Thmor Pro', sans-serif;
	font-family: 'Merienda', cursive;*/
	/*font-family: 'Orbitron', sans-serif;*/
	/*font-family: 'Roboto', sans-serif;
	font-family: 'Roboto Mono', monospace;
	font-family: 'Sora', sans-serif;*/
	/*font-family: 'Ubuntu', sans-serif;*/
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	transition: .3s all ease-in;
	color: var(--main_text_blue_color);
	
 	font-size: 22px;
	padding: 10px;
	padding-left: 14px;
	padding-right: 14px;
	margin: 4px 1px;
 	text-decoration: none;
 	border: solid 2px rgba(67,111,243,30%);
 	background-color: rgba(67,111,243,15%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}

.pageButtonColorSkew {
	/*transform: skew(-30deg);*/
}

	.pageButtonColor:hover,
	.pageButtonColorSkew:hover {
		/*color: #ffa407;*/
		color: var(--main_subText_colorTeal);
		/*border: solid 2px rgba(255,164,7,70%);*/
		border: solid 2px var(--main_subText_colorTeal);
		cursor: pointer;
		/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
		transition: .15s all ease-in;
		border-radius: 25% / 10%;
		/*border-radius: 50% / 15%;*/
		/*transform: skew(-30deg);*/
	}
	.pageButtonColor:active,
	.pageButtonColorSkew:active {
		color: #00bb17;
		border: solid 2px var(--main_subText_colorTeal);
		cursor: pointer;
		/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
		transition: .15s all ease-in;
		border-radius: 50% / 15%;
	}
/*.pageButtonColor:hover .pageButtonTxt,
.pageButtonColorSkew:hover .pageButtonTxt {
	transform: skew(30deg);
}*/

/*Has to be below .pageButtonColor*/
.noPaddingTB {
	/*padding-top: 0;*/
	/*padding-bottom: 0;*/
	padding-top: 5px;
	padding-bottom: 5px;
}

#main-main {
	margin-top: 0;
	background: rgb(0,0,0);
	background: radial-gradient(circle, rgba(67,111,243,0.1) 0%, rgba(9,9,121,0.1) 42%, rgba(0,0,0,0.1) 100%);
}

.mainGrid {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: space-between;
	justify-content: space-around;
	align-items: center;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 40px;
}

.img-hover-zoom {
	height: auto;
	overflow: hidden;
	/*transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);*/
}

	.img-hover-zoom img {
		/*border-radius: 24% 24%;*/
		transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);
	}

	.img-hover-zoom:hover img {
		transform: scale(1.2) translate(0,6px);
		border-radius: 8px;
	}

	.img-hover-zoom:hover {
		transform: translate(0,-12px);
	}

.glowBorder {
	/*transition: transform 1s cubic-bezier(.31,.01,.51,.99);*/
}
	.glowBorder .img-hover-zoom {
		border-radius: 24% 24%;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px var(--main_border_blue_color);
		/*animation: imgFrameRGB 4s Ease-in-out infinite;*/
		transition: transform 0.4s cubic-bezier(.31,.01,.51,.99),
					border-radius 0.4s cubic-bezier(.31,.01,.51,.99);
	}
/*	.glowBorder img {
		animation: imgFrameReverse 0.8s Ease-in-out;
	}*/

/*To work on*/
.glowBorder span {
	animation: txtFrameReverse 0.8s cubic-bezier(.31,.01,.51,.99);
	/*transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);*/
}

	.glowBorder:hover .img-hover-zoom,
	.glowBorder:hover img {
		color: #436ff3;
		border: 10px #436ff3;
		border-radius: 8px;
		/*border-radius: 2% 18%;*/
		box-shadow: 0 0 1px 4px #000000, 0 0 25px 15px var(--main_border_blue_color);
		/*animation: imgFrame 0.5s Ease-in-out;*/
		/*animation: imgFrame 0.8s Ease-in-out*/ /*, colorChange 2s Ease-in-out infinite*//*;*/
		animation: imgFrameRGB 8s Ease-in-out infinite;
		/*transform: translate(0,-10px);*/
	}

.glowBorder:hover span {
	border-bottom: 1px solid var(--main_subText_color);
	border-top: 1px solid var(--main_subText_color);
	border-radius: 50px;
	background-color: rgba(67,111,243,10%);
	animation: txtFrame 0.8s cubic-bezier(.31,.01,.51,.99);
	/*transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);*/
}

.img2 {
	max-width: 100%;
	/*border-radius: 50% / 12%;*/
	/*border-radius: 2% 18%;*/
	border-radius: 24% 24%;
	/*border-radius: 50%;*/
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 600px;
	height: auto;
	top: 0;
	left: 0;
}

@keyframes imgFrameBasic {
	0% {
		box-shadow: 0 0 1px 4px #000000, 0 0 4px 2px #000000, 0 0 18px 1px var(--main_border_blue_color);
	}

	12% {
		box-shadow: 0 0 1px 4px #000000, -2px 0 4px 2px #000000, 0 0 14px 1px var(--main_border_blue_color);
	}

	32% {
		box-shadow: 0 0 1px 4px #000000, 0 -2px 4px 2px #000000, 0 0 16px 1px var(--main_border_blue_color);
	}

	68% {
		box-shadow: 0 0 1px 4px #000000, 2px 0 4px 2px #000000, 0 0 12px 1px var(--main_border_blue_color);
	}

	84% {
		box-shadow: 0 0 1px 4px #000000, 0 2px 4px 2px #000000, 0 0 12px 1px var(--main_border_blue_color);
	}

	100% {
		box-shadow: 0 0 1px 4px #000000, 0 0 4px 2px #000000, 0 0 18px 1px var(--main_border_blue_color);
	}
}

@keyframes imgFrameRGB {
	0% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px var(--main_border_blue_color); /*blue*/
	}

	12.5% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(67, 243, 243, 1); /*teal*/
	}

	25% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(78, 243, 67, 1); /*green*/
	}

	37.5% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(240, 243, 67, 1); /*yellow*/
	}

	50% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(243, 124, 67, 1); /*orange*/
	}

	62.5% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(243, 67, 67, 1); /*red*/
	}

	75% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(243, 67, 189, 1); /*pink*/
	}

	87.5% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px rgba(167, 67, 243, 1); /*purple*/
	}

	100% {
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 8px var(--main_border_blue_color); /*blue*/
	}
}
@keyframes txtRGB {
	0% {
		color: var(--main_border_blue_color); /*blue*/
	}

	12.5% {
		color: rgba(67, 243, 243, 1); /*teal*/
	}

	25% {
		color: rgba(78, 243, 67, 1); /*green*/
	}

	37.5% {
		color: rgba(240, 243, 67, 1); /*yellow*/
	}

	50% {
		color: rgba(243, 124, 67, 1); /*orange*/
	}

	62.5% {
		color: rgba(243, 67, 67, 1); /*red*/
	}

	75% {
		color: rgba(243, 67, 189, 1); /*pink*/
	}

	87.5% {
		color: rgba(167, 67, 243, 1); /*purple*/
	}

	100% {
		color: var(--main_border_blue_color); /*blue*/
	}
}
@keyframes imgFrame {
	0% {
		border-radius: 24% 24%;
		box-shadow: 0 0 1px 4px #000000, 0 0 12px 1px var(--main_border_blue_color);
	}

	100% {
		border-radius: 8px;
		box-shadow: 0 0 1px 4px #000000, 0 0 25px 15px var(--main_border_blue_color);
	}
}

@keyframes imgFrameReverse {
	0% {
		border-radius: 8px;
		box-shadow: 0 0 1px 4px #000000, 0 0 25px 15px var(--main_border_blue_color);
	}

	100% {
		border-radius: 24% 24%;
		box-shadow: 0 0 1px 4px #000000, 0 0 12px 1px var(--main_border_blue_color);
	}
}

@keyframes txtFrame {
	0% {
		border-radius: 8px;
	}

	100% {
		border-radius: 50px;
	}
}

@keyframes txtFrameReverse {
	0% {
		border-radius: 50px;
	}

	50% {
		border-radius: 8px;
	}
}

.container {
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin-left: auto;
	margin-right: auto;
	width: 27%;
	margin: 5px;
	margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	border-top: 2px solid rgba(0, 0, 0, 0);
	/*animation: fadeLine 5s ease-in-out;*/
	/*transition: fadeLine 5s ease-in-out;*/
}

.container:hover .overlay {
	opacity: 1;
	color: #d3dce6;
	/*text-transform: uppercase;*/
	font-weight: bold;
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

@keyframes fadeLine {
	0% {
		border-top: 2px solid rgba(0, 0, 0, 0);
		/*opacity: 0;*/
	}

	100% {
		/*opacity: 1;*/
		border-top: 2px solid var(--main_subText_color);
	}
}

.mainMobileView {
	display: none;
}

.mainDesktopView {
	display: block;
}

.overlay {
	position: relative;
	margin-left: -50vw;
	margin-right: -50vw;
	height: auto;
	color: var(--main_subText_color);
	transition: color .75s ease;
	background-color: #008CBA;
}

.dateContainer {
	margin-bottom: 12px;
}

.dateContainerBottom {
	margin-bottom: -12px;
	display: flex;
	justify-content: center;
}

#date {
	/*font-family: 'Audiowide', cursive;*/
	font-family: 'nasalization', sans-serif;
	color: rgba(67,111,243,60%);
	/*color: rgba(0,187,23,70%);*/
	/*color: rgba(255,164,7,70%);*/
	border-bottom: 1px ridge #c7c7c7;
	/*border-left: 1px ridge #969696;*/
	/*border-right: 1px ridge #969696;*/
	padding: 8px;
	border-radius: 20% / 30% 30% 84px 84px;
	box-shadow: 0px 6px 12px -8px #ffffff;
	letter-spacing: 6px;
	font-size: 14px;
	text-transform: uppercase;
}

#dateInverse {
	font-family: 'nasalization', sans-serif;
	color: rgba(67,111,243,55%);
	border-top: 1px ridge #c7c7c7;
	padding: 8px;
	padding-bottom: 12px;
	padding-top: 4px;
	border-radius: 20% / 84px 84px 30% 30%;
	box-shadow: 0px -6px 12px -8px #ffffff;
	letter-spacing: 6px;
	font-size: 14px;
	text-transform: uppercase;
}

.captionContainer {
	/*transition: color .75s ease;*/
	opacity: 1;
	padding: 5px;
	/*box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
	transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);
}

	.captionContainer span {
		font-size: 24px;
		font-family: 'Audiowide', cursive;
		font-weight: 200;
		text-align: center;
		border-bottom: 1px solid var(--main_subText_color);
		border-top: 1px solid var(--main_subText_color);
		padding: 8px 12px 8px 12px;
		border-radius: 8px;
		transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);
	}

.lineBox {
	padding-bottom: 8px;
}

.linkMain {
	color: var(--main_subText_color);
	background-color: transparent;
	text-decoration: none;
}

	.linkMain:visited {
		color: var(--main_subText_color);
	}

	.linkMain:hover, .linkMain:active {
		/*color: #d4d4d4;*/
		color: var(--main_subText_colorTeal);
	}

.showcase {
	height: 100vh;
	display:inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	/*color: #fff;*/
	padding: 0 20px;
}

.video-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	/*background: var(--primary-color) url('./https://traversymedia.com/downloads/cover.jpg') no-repeat center
		center/cover;*/
}

.video-container video {
	min-width: 100%;
	min-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}

.video-container:after {
	content: '';
	z-index: 1;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	/*background: rgba(0, 0, 0, 0.5);*/
	position: absolute;
}

.content {
	z-index: 2;
	position: absolute;
	top: 75%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: rgba(52, 71, 128,40%);
	width: 100%;
	/*padding-top: 10px;*/
	padding-bottom: 2px;
	/*border: 12px double #181818;
	outline: 12px dashed #181818;
	outline-offset: -12px;*/
}
.moveUp {
	/*animation: 1s cubic-bezier(.86,0,.07,1) slideInFromBelow;*/
}

@keyframes slideInFromBelow {
  0% {
    /*transform: translateY(400px);*/
    transform: translateY(24px);
  }
  100% {
    transform: translateY(0px);
  }
}

polygon {
  stroke: #24b3ff;
  stroke-width: 2;
	stroke-linecap: square;
  /*stroke-dasharray: 50, 750;*/
  stroke-dasharray: 50;
  stroke-dashoffset: 0;
  fill: none;
  /*animation: border 10s linear infinite;*/
}

.lineBox {
	width: 80%;
}

#line1 {
	stroke: #8ad6ff;
	animation: border 10s linear infinite;
}
#line2 {
	animation: borderReverse 10s linear infinite reverse;
}
#line3a, #line3b, #line3c , #line3d {
	visibility: hidden;
}
.line3 {
	stroke: #8ad6ff;
	stroke-dasharray: 0;
	/*stroke-dasharray: 50;
	stroke-dashoffset: 100;*/
}
.borderLine:hover .line3 {
	animation: borderReverseReverse 1s cubic-bezier(.77,0,.18,1) forwards;
}
.line4a {
	fill: none;
	stroke: #8ad6ff;
	stroke-width: 1;
	stroke-dasharray: 0 1000;
	stroke-dashoffset: 0;
	animation: borderLeftToRight 5s ease-in-out forwards infinite;
}
.line4b {
	fill: none;
	stroke: #8ad6ff;
	stroke-width: 1;
	stroke-dasharray: 10 0;
	stroke-dashoffset: 100;
	animation: borderLeftToRightReverse 5s ease-in-out reverse infinite;
}
@keyframes border {
  0% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: 50;
  }
}
@keyframes borderReverse {
	0% {
    stroke-dashoffset: 0;
  }
	50% {
    stroke-dashoffset: 50;
  }
	100% {
    stroke-dashoffset: 0;
  }
}
@keyframes borderReverseReverse {
	from {
		stroke-dasharray: 0 100;
		stroke-dashoffset: 50;
  }
	to {
		stroke-dasharray: 100 0;
		stroke-dashoffset: 100;
  }
}
@keyframes borderLeftToRight {
	0% {
		stroke-dasharray: 10 500;
		stroke-dashoffset: 0;
  }
	50% {
		stroke-dasharray: 10 0;
		stroke-dashoffset: 100;
  }
	100% {
		stroke-dasharray: 10 500;
		stroke-dashoffset: 0;
  }
}
@keyframes borderLeftToRightReverse {
	0% {
		stroke-dasharray: 10 0;
		stroke-dashoffset: 100;
  }
	50% {
		stroke-dasharray: 10 500;
		stroke-dashoffset: 0;
  }
	100% {
		stroke-dasharray: 10 0;
		stroke-dashoffset: 100;
  }
}

.borderz {
	/*border: 12px double #181818;*/
	/*border: 8px solid #181818;*/
	border: 8px solid #0D0C1D;
	/*outline: 12px dashed #181818;
	outline-offset: -12px;*/
}

.gradient-border {
  --borderWidth: 3px;
  border-radius: var(--borderWidth);
}
.gradient-border:after {
  content: '';
  position: absolute;
  top: calc(-1 * var(--borderWidth));
  left: calc(-1 * var(--borderWidth));
  height: calc(100% + var(--borderWidth) * 2);
  width: calc(100% + var(--borderWidth) * 2);
  background: linear-gradient(45deg,
															#00466b,
															#194a6b,
															#32546b,
															#435c6b,
															#59636b,
															#707070);
  border-radius: calc(2 * var(--borderWidth));
  z-index: -1;
  animation: animatedgradient 8s ease-in-out alternate infinite;
  background-size: 300% 300%;
	opacity: 0.4;
}

@keyframes animatedgradient {
	0% {
		background-position: 0% 50%;
	}
	33% {
		background-position: 50% 100%;
	}
	66% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 50% 0%;
	}
}

.landPageBtn {
	display: inline-block;
	font-size: 60px;
	/*font-family: 'Orbitron', sans-serif;*/
	/*font-family: nasalization, sans-serif;*/
	font-family: 'Audiowide', cursive;
	font-weight: 100;
	text-align: center;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	transition: .4s all ease-in-out;
	color: #E8AEB7;
	padding: 10px;
	padding-left: 14px;
	padding-right: 14px;
	margin-top: 16px;
 	text-decoration: none;
 	border: solid 2px rgba(67,111,243,30%);
 	background-color: rgba(67,111,243,15%);
	border-radius: 0%;
	box-shadow: 0px 0px 24px 2px #436ff3;
	text-shadow: 0 0 6px #000000;
	-webkit-background-clip: padding-box; /* for Safari */
  background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}
.landPageBtn:hover {
	color: #EEE5E9;
	background-color: rgba(67,111,243,50%);
	font-weight: 1000;
	transition: .2s all ease-in-out;
	border-radius: 50% / 15%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	box-shadow: none;
	text-shadow: none;
	filter: none;
	animation-play-state: paused;
}

.glowFade2 {
	border-radius: 5px;
	filter: drop-shadow(0 0 2px #000000)
					drop-shadow(0 0 4px #111111);
	animation: fadeNout 4s Ease-in-out infinite;
}
.glowFade2:hover {
	transition: .2s all ease-in-out;
	animation: none;
	filter: drop-shadow(0 0 1px rgba(0, 0, 0, 1))
					drop-shadow(0 0 2px rgba(17, 17, 17, 1));
	box-shadow: 0px 0px 2px 2px #436ff3;
}
@keyframes fadeNout {
	0% {
		/*opacity: 100%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 1))
						drop-shadow(0 0 4px rgba(17, 17, 17, 1));
		box-shadow: 0px 0px 24px 2px #436ff3;
	}
	20% {
		/*opacity: 20%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4))
						drop-shadow(0 0 4px rgba(17, 17, 17, 0.4));
		box-shadow: 4px 4px 16px 2px #436ff3;
	}
	30% {
		/*opacity: 20%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4))
						drop-shadow(0 0 4px rgba(17, 17, 17, 0.4));
		box-shadow: 2px 4px 22px 2px #436ff3;
	}
	50% {
		/*opacity: 90%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.9))
						drop-shadow(0 0 4px rgba(17, 17, 17, 0.9));
		box-shadow: -4px 0px 20px 2px #436ff3;
	}
	60% {
		/*opacity: 40%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.7))
						drop-shadow(0 0 4px rgba(17, 17, 17, 0.7));
		box-shadow: 0px -4px 28px 2px #436ff3;
	}
	70% {
		/*opacity: 40%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.7))
						drop-shadow(0 0 4px rgba(17, 17, 17, 0.7));
		box-shadow: 2px -2px 24px 2px #436ff3;
	}
	90% {
		/*opacity: 100%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 1))
						drop-shadow(0 0 4px rgba(17, 17, 17, 1));
		box-shadow: -2px 0px 18px 2px #436ff3;
	}
	100% {
		/*opacity: 100%;*/
		filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.9))
						drop-shadow(0 0 4px rgba(17, 17, 17, 0.9));
		box-shadow: 0px 0px 24px 2px #436ff3;
	}
}

#landHeadText {
	/*margin-top: 16px;*/
	margin-bottom: 2px;
	font-size: 28px;
	/*font-family: 'Orbitron', sans-serif;*/
	/*font-family: nasalization, sans-serif;*/
	font-family: 'Audiowide', cursive;
	/*font-style: normal;
	font-weight: 400;*/
	text-align: center;
	/*color: #a4a7ab;*/
	color: #EEE5E9;
	text-shadow: 1px 0 4px rgba(99, 138, 255, 1);
	text-shadow: 1px 0 4px #310A31;
}
#tMute {
	/*margin-top: 12px;*/
	font-size: 32px;
	/*font-family: 'Orbitron', sans-serif;*/
	/*font-family: nasalization, sans-serif;*/
	font-family: 'Audiowide', cursive;
	/*font-style: normal;
	font-weight: 400;*/
	text-align: center;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	/*color: var(--main_text_blue_color);*/
	/*color: #847996;*/
	color: #EEE5E9;
	/*color: rgba(20, 33, 73);*/
	background-color: rgba(67,111,243,0%);
	border: solid 2px rgba(67,111,243,0%);
	/*text-shadow: 1px 0 4px var(--main_text_blue_color);*/
	text-shadow: 1px 0 4px #181818;
}
#tMute:hover {
	/*color: var(--main_text_blue_color);*/
	text-shadow: 1px 0 16px #181818;
	/*text-decoration: underline;*/
	transition: .15s all ease-in;
}

.aButton {
	text-decoration: none;
	/*color: inherit;*/
	/*cursor: pointer;*/
}

.welcomeContent {
	/*cursor: url("src/img/CustomCursor_2.png"), auto;*/
}

.welcome {
	margin-top: 40px;
	margin-bottom: 40px;
	/*display: block;*/
	position: relative;
	/*cursor: pointer;*/
	/*cursor: url("src/img/CustomCursor_2.png"), auto;*/
}

.imgWel {
	max-width: 100%;
	border-radius: 25% / 12%;
	display: block;
	margin: 24px;
	margin-left: auto;
	margin-right: auto;
	/*width: 600px;*/
	width: 40%;
	height: auto;
	top:0;
  left:0;
	z-index: 10;
	position: relative;
}
.glowBorderN {
	color: #436ff3;
	border: 4px #436ff3;
	box-shadow: 0 0 2px 6px #000000,
							0 0 28px 12px #436ff3;
	animation: colorChangeN 5s Ease-in-out infinite;
}

@keyframes colorChangeN {
  0% {
		box-shadow: 0 0 2px 6px #000000,
								0 0 28px 12px #ffa407;
  } 25% {
		box-shadow: 0 0 2px 6px #000000,
								0 0 28px 12px #436ff3;
  } 50% {
		box-shadow: 0 0 2px 6px #000000,
								0 0 28px 12px #00bb17;
  } 75% {
		box-shadow: 0 0 2px 6px #000000,
								0 0 28px 12px #436ff3;
  } 100% {
		box-shadow: 0 0 2px 6px #000000,
								0 0 28px 12px #ffa407;
	}
}

.dropdown {
	display: inline-block;
	text-align: left;
	cursor: default; 
}

.dropdown-content {
	display: none;
	position: absolute;
	z-index: 1;
}

.dropdown-content a {
	float: none;
	text-decoration: none;
	display: block;
	text-align: left;
	/*padding-top: 24px;*/
}

	.dropdown-content .pageButtonColor {
		/*background-color: rgba(0,0,0,0.8);*/
		/*background-color: rgba(67,111,243,50%);*/
		background-size: cover;
		background-image: linear-gradient(rgba(67,111,243,15%),rgba(67,111,243,15%)), url('Hex_7.jpg');
		background-color: rgba(67,111,243,15%);
		background-repeat: no-repeat, no-repeat;
		background-position: center;
		background-attachment: fixed;
	}

/*.dropdown:has(.dropdown-content:hover) {*/
.dropdown:hover .dropdownButton .pageButtonColor {
	color: #00bb17;
	border: solid 2px rgba(0,187,23,70%);
	transition: .15s all ease-in;
	border-radius: 50% / 15%;
}

.dropdown:hover .dropdown-content {
	display: inline-flex;
	flex-direction: column;
	justify-content: left;
	align-items: flex-start;
}

.menuButtons {
	width: 100%;
}

.fadeScroll {
	transition: opacity 0.5s ease-in-out;
}
.fadeOut { opacity: 0; }
.fadeIn { opacity: 1; }

hr.rounded {
	border-top: 1px solid #000000;
	border-radius: 5px;
	box-shadow: 0 0 1px #ffffff, 0 0 10px #969696, 0 0 15px #ffffff;
}
.rounded3Back {
	position: absolute;
	/*top: 50%;
	left: 1%;
	transform: translate(0, 50%);*/
	width: 98%;
	border-top: 1px solid #000000;
	/*border-radius: 5px;*/
	/*box-shadow: 0 0 2px 6px #000000,
							0 0 56px 24px #436ff3;*/
	z-index: 1;
	display: inline;
	vertical-align: middle;
}
.roundTop {
	top: 25%;
	left: 0;

}
.roundBottom {
	top: 70%;
	left: 0;

}
.roundGreen1 {
	transform: translate(50%, 0);
	box-shadow: 0 0 2px 6px #000000,
							0 0 42px 18px #00bb17,
							0 0 56px 24px #006600;
}
.roundOrange1 {
	transform: translate(-50%, 0);
	box-shadow: 0 0 2px 6px #000000,
							0 0 28px 12px #ffa407,
							0 0 56px 24px #c98002;
}
.roundGreen2 {
	transform: translate(-50%, 0);
	box-shadow: 0 0 2px 6px #000000,
							0 0 42px 18px #00bb17,
							0 0 56px 24px #006600;
}
.roundOrange2 {
	transform: translate(50%, 0);
	box-shadow: 0 0 2px 6px #000000,
							0 0 28px 12px #ffa407,
							0 0 56px 24px #c98002;
}

.closeWel {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 36px;
	text-align: center;
	font-size: 32px;
	padding: 6px;
	padding-left: 10px;
	padding-right: 10px;
}

.indexDescr {
	color: var(--main_headerText_color);
	font-size: 20px;
	font-family: 'Merienda', cursive;
	text-align: center;
	width: 90%;
	margin: auto;
	margin-bottom: 24px;
	padding-bottom: 12px;
	margin-top: 24px;
	padding-top: 0;
}

#consentContainer {
	display: block;
	position: fixed;
	bottom: 0;
	left: 50%;
	width: 80%;
	/*right: -50%;*/
	z-index: 1008;
	outline: none;
	transform: translate(-50%, -5%);
	margin: 0 auto;
	padding: 12px;
	border: 2px solid #ffffff;
	background: #151718;
	border-radius: 8px;
	box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px var(--main_border_blue_color);
	animation: rgbRotate 10s Ease-in-out infinite;
}

@keyframes rgbRotate {
	0% {
		border-color: #ff0000;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #ff0000;
	}

	16.7% {
		border-color: #ff00ff;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #ff00ff;
	}

	33.33% {
		border-color: #0000ff;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #0000ff;
	}

	50% {
		border-color: #00fff0;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #00fff0;
	}

	66.7% {
		border-color: #00ff00;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #00ff00;
	}

	83.33% {
		border-color: #ffff00;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #ffff00;
	}

	100% {
		border-color: #ff0000;
		box-shadow: 0 0 1px 4px #000000, 0 0 24px 1px #ff0000;
	}
}

#consentDescr, #consentRDescr {
	text-align: center;
	font-family: 'Audiowide', cursive;
	font-size: 20px;
	padding-bottom: 12px;
	color: var(--main_subText_color);
}
#consentRDescr {
	font-size: 16px;
	padding-bottom: 0;
}
#consentRDescr span {
	border-bottom: 1px solid #ffffff;
	color: #ffffff;
}

	#yesToConsent, #noToConsent {
		margin-bottom: 12px;
	}

/*--------------------------------------------------------------------*/
/*---------------------------New Photo Page----------------------------*/

.titles {
	text-align: center;
	font-size: 42px;
	font-family: 'Orbitron', sans-serif;
	color: #777a7d;
	padding-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	text-decoration: underline #777a7d 4px;
}

.hamS {
	font-size: 16px;
}

.containerGrid {
  /*display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(3, 1fr);
	grid-template-rows: fit-content(100%);*/
	display: flex;
	object-fit: contain;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: space-between;
	justify-content: center;
	align-items: center;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}

.containerGrid img, .containerGrid video {
	height: 200px;
	/*border-radius: 20% / 12%;
	border-radius: 12%;*/
	margin-left: 8px;
	margin-right: 8px;
	margin-top: 8px;
	margin-bottom: 8px;
	padding: 6px;
}
.mainPhoto img, .mainPhoto video {
	height: 250px;
}

.img4 {
}

.containerGrid img:hover, .containerGrid video:hover {
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	color: #436ff3;
	border: 10px #436ff3;
	/*border-radius: 0px;*/
	box-shadow: 0 0 1px 4px #000000, 0 0 25px 15px #436ff3;
	-webkit-box-shadow: 0 0 1px 4px #000000, 0 0 25px 15px #436ff3;
	-webkit-appearance: none;
}

.arrow {
	display: inline-flex;
	flex-wrap: nowrap;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding-left: 24px;
	padding-right: 24px;
	background-color: rgba(0,0,0,0);
	color: rgba(67,111,243,50%);
	text-shadow: #ffffff 0 0 6px;
	border: none;
	font-size: 58px;
	line-height: 1;
}

.arrow:hover {
	color: var(--main_headerText_color);
	text-shadow: var(--main_border_blue_color) 0 0 4px;
	cursor: pointer;
}

@keyframes borderChange {
  from {
		border-radius: 20% / 12%;
  }
  to {
		border-radius: 0;
  }
}

/* The Modal (background) */
.modal {
	 display: none; /* Hidden by default */
	 position: fixed; /* Stay in place */
	 z-index: 1000; /* Sit on top */
	 left: 0;
	 right: 0;
	 top: 0;
	 bottom: 0;
	 width: 100%; /* Full width */
	 height: 100%; /* Full height */
	 overflow: auto; /* Enable scroll if needed */
	 background-color: rgb(0,0,0); /* Fallback color */
	 background-color: rgba(0,0,0,0.75); /* Black w/ opacity */
	 -webkit-backdrop-filter: blur(42px);
	 backdrop-filter: blur(42px);
}
.modalPhoto {
	/*display: block;*/
	display: flex;
	/*	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);*/
	max-width: 90%;
	max-height: 90%;
	bottom: 0;
	left: 0;
	margin: auto;
	position: fixed;
	right: 0;
	top: 0;
	-o-object-fit: contain;
	object-fit: contain;
	vertical-align: middle;
	flex-direction: column;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: center;
	align-items: center;
}
.modalPhotoContent {
	margin: auto;
	margin-top: 5px;
	margin-bottom: 5px;
	/*display: block;*/
	/*width: 80%;*/
	max-width: 90%;
	max-height: 80%;
	padding: 12px;
	/*border-radius: 20% / 12%;*/
	box-shadow: 0 0 1px 4px #000000,
						 0 0 25px 15px #436ff3;
 -webkit-box-shadow: 0 0 1px 4px #000000,
						 0 0 25px 15px #436ff3;
 -webkit-appearance: none;
}
/* Modal Content (Image) */
.modal-content {
	 margin: auto;
	 margin-top: auto;
	 margin-bottom: auto;
	 display: block;
	 /*width: 80%;*/
	 max-width: 80%;
	 max-height: 60%;
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 transform: translate(-50%, -50%);
	 padding: 12px;
	 /*border-radius: 20% / 12%;*/
	 box-shadow: 0 0 1px 4px #000000,
 							0 0 25px 15px #436ff3;
 	-webkit-box-shadow: 0 0 1px 4px #000000,
 							0 0 25px 15px #436ff3;
 	-webkit-appearance: none;
}

#photoText, .photoTextDescr, #photoTextCapt {
	color: var(--main_headerText_color);
	font-size: 18px;
	font-family: 'Merienda', cursive;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	/*margin: auto;*/
	/*display: flex;
	justify-content: center;*/
}
.photoTextDescr {
	margin-bottom: 24px;
	padding-bottom: 18px;
	margin-top: 8px;
	padding-top: 0;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	width: 90%;
	display: block;
	/*border-bottom: 1px solid var(--main_subText_color);*/
}
#photoText {
	margin-bottom: 24px;
	font-size: 18px;
}
#photoTextCapt {
	width: 75%;
	/*background-color: black;
	box-shadow: 0 0 1px 4px #000000;
	-webkit-box-shadow: 0 0 24px 24px #000000;
	-webkit-appearance: none;*/
}
#photoTextCapt span {
	background-color: black;
	/*box-shadow: 0 10px 18px 18px #000000;*/
	/*-webkit-box-shadow: 0 10px 18px 18px #000000;*/
	box-shadow: 0 0 4px 4px #000000, 0 2px 24px 4px #436ff3;
	-webkit-box-shadow: 0 0 4px 4px #000000, 0 2px 24px 4px #436ff3;
	-webkit-appearance: none;
	/*text-decoration: overline;*/
	/*border-top: solid 1px var(--main_headerText_color);*/
	/*border-bottom: solid 1px var(--main_headerText_color);*/
	border: solid 1px var(--main_subText_color);
	padding: 12px;
	padding-bottom: 8px;
	padding-top: 8px;
	line-height: 2;
}

.photoBorderBottom {
	padding-bottom: 12px;
	margin-bottom: 12px;
	margin-left: auto;
	margin-right: auto;
	/*width: 60%;*/
	text-align: center;
	position: relative;
	display: inline-block;
}

.photoBorderTop {
	padding-top: 12px;
	margin-top: 12px;
	margin-left: auto;
	margin-right: auto;
	/*width: 60%;*/
	text-align: center;
	position: relative;
	display: inline-block;
}

.photoBorderTop:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	border-top: 1px solid var(--main_subText_color);
	content: "";
}

.photoBorderBottom:after {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	border-bottom: 1px solid var(--main_subText_color);
	content: "";
}

.photoHeaderSpacing {
	/*padding-top: 12px;*/
	margin-top: 0px;
}

#mNav {
	width: 0%;
}

/*.PhotoHeaderInner {
	height: 2vh;
}*/

.modalButtonGroup {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-around;
	align-items: center;
}

#closeButton, #leftArrow, #rightArrow {
	display: block;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	font-size: 96px;
	line-height: normal;
	color: var(--main_text_blue_color);
	transition: 0.3s all ease-in-out;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	font-family: 'Rye', cursive;
	text-decoration: none;
	border: 0;
	padding-left: 5vw;
	padding-right: 5vw;
	background-color: rgba(0,0,0,0%);
	-webkit-appearance: none;
}
#closeButton:hover, #closeButton:active {
	color: rgba(99, 138, 255, 0.5);
}

#leftArrow:hover, #rightArrow:hover,
#leftArrow:active, #rightArrow:active {
	color: rgba(182, 200, 255, 0.9);
	text-shadow: 0 0 6px #ffffff;
}

.cancelButton {
	text-decoration: line-through;
	cursor: default;
	border: solid 2px rgba(80, 83, 92,30%);
	background-color: rgba(80, 83, 92,15%);
	color: rgba(80, 83, 92, 0.9);
	box-shadow: 0px 0px 6px 2px #50535c;
	-webkit-box-shadow: 0px 0px 6px 2px #50535c;
	-webkit-appearance: none;
}
.cancelButton:hover {
	border: solid 2px rgba(80, 83, 92,30%);
	background-color: rgba(80, 83, 92,15%);
	color: rgba(80, 83, 92, 0.9);
	transition: .3s all ease-in;
	border-radius: 4%;
}

.aboutCPhoto {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
}
.aboutCPhotoText {
	text-align: justify;
	color: #abafb3;
	text-indent: 42px;
	line-height: 1.8;
	font-size: 18px;
	font-family: 'Merienda', cursive;
}
.captionContainerPhoto {
	opacity: 1;
	padding: 5px;
	transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);
}
.captionContainerPhoto span {
	font-size: 24px;
	font-family: 'Audiowide', cursive;
	font-weight: 200;
	text-align: center;
	padding: 12px;
	margin-bottom: 8px;
	transition: transform 0.4s cubic-bezier(.31,.01,.51,.99);
}
.capHover {
	padding-bottom: 8px;
}
	.capHover:hover span {
		border-bottom: 1px solid var(--main_subText_color);
		border-top: 1px solid var(--main_subText_color);
		color: rgb(0 229 255);
	}

/*-------------------------End Photo Page--------------------------*/
/*--------------------------------------------------------------------*/

/*--------------------------------------------------------------------*/
/*---------------------------Software Page----------------------------*/

/*
.typicalWrapper::after {
  content: "|";
  animation: blink 1s infinite step-start;
}

@keyframes blink {
  50% { opacity: 0; }
}*/

#typing {
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}

.title {
	color: #64a2e8;
	font-size: 42px;
	font-family: 'Orbitron', sans-serif;
	font-family: 'Audiowide', cursive;
	text-align: center;
	text-decoration: underline;
	margin: 0;
	margin-top: 24px;
}

.sContainer {
	width: 90%;
	margin: auto;
}
.sContainer p {
	font-family: 'VT323', monospace;
	color: var(--main_subText_color);
	font-size: 28px;
	text-align: left;
	text-decoration: underline;
	margin: 0;
	/*margin-top: 12px;*/
	word-wrap: break-word;
}
.sContainer ul {
	/*width: 80%;*/
	/*cursor: pointer;*/
	font-family: 'VT323', monospace;
	font-size: 24px;
	color: #3870ff;
	text-align: left;
	/*text-decoration: underline;*/
	margin: auto;
	/*margin-top: 12px;*/
	position: relative;
	list-style: none;
	margin-left: 0;
	/*padding-left: 1.2em;*/
}
.sContainer li {
	padding-top: 6px;
	padding-bottom: 6px;
}
.sContainer ul li:before {
	content: "{";
}
.sContainer a {
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}
.sContainer a:hover {
	color: #3870ff;
}
.projLink {
	color: var(--main_headerText_color);
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	text-decoration: underline;
	word-wrap: break-word;
}
.projLink:hover {
	color: #3870ff;
}
.projLink:visited {
	color: var(--main_headerText_color);
}
.showHideLink{
	color: var(--main_headerText_color);
}
.showHideAll{
	color: var(--main_headerText_color);
	text-decoration: underline;
}
.descr {
	display: none;
}
.underline{
	text-decoration: underline;
}
.lg-view {
	display: inline;
}
.topDescr{
	color: #3870ff;
}
.topDescrIn {
	color: var(--main_headerText_color);
}
.dates {
	color: #64696b;
	color: green;
}
.types {
	color: #64a2e8;
}
.underDescr {
	color: var(--main_subText_color);
}
.softPhoto {
	width: 40vw;
	height: 30vh;
	overflow: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--main_headerText_color) #3870ff;
	margin: 4px;
	margin-left: 22px;
	border: 12px solid #111111;
	box-shadow: 0 0 8px 2px #111111;
}

.softImgContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-evenly;
	align-items: center;
	width: 90%;
	margin: 0 auto;
	padding: 24px;
}
	.softImgContainer img {
		max-width: 90%;
		width: 28%;
		box-shadow: 0 0 1px 4px #000000, 0 0 8px 2px #000000, 0 0 32px 0px var(--main_border_blue_color);
	}
.softImgHide {
	display: block;
}

/*-------------------------End Software Page--------------------------*/
/*--------------------------------------------------------------------*/
/*-----------------------------------------------------------------*/
/*---------------------------Portfolio Page----------------------------*/
/*[id*='port'] {*/
#port * {
	-webkit-text-size-adjust: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.topDescPort {
	text-align: center;
	width: 50%;
	margin-left: 25%;
	margin-right: 25%;
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-size: 20px;
	font-weight: 300;
	color: #a2a6a9;
}

.secDescPort {
	text-align: center;
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
}
.tocPort {
	text-align: center;
	/*text-align: left;*/
	/*color: #99a8b8;*/
	color: #a2a6a9;
	font-size: 22px;
	line-height: 1.4;
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	/*margin-left: 10%;
	margin-right: 10%;*/
	display: flex;
	justify-content: center;
}

.tocListPort {
	line-height: 1.5;
	list-style-type: square;
	/*list-style-type: none;*/
	font-style: normal;
	display: table;
	padding-inline-start: 0;
}

	.tocListPort li {
		display: table-cell;
		line-height: 2;
		text-decoration: underline;
	}

		.tocListPort li:hover span {
			text-decoration: underline;
		}

	.tocListPort a, .tocListPort a:visited {
		/*color: #889cb3;*/
		color: #a2a6a9;
		text-decoration: none;
	}

		.tocListPort a:hover {
			color: #0099ff;
		}

/* The Modal (background) */
.modalPort {
	display: none; /* Hidden by default */
	position: fixed; /* Stay in place */
	z-index: 1000; /* Sit on top */
	padding-top: 25px; /* Location of the box */
	padding-bottom: 25px;
	left: 0;
	top: 0;
	width: 100%; /* Full width */
	height: 100%; /* Full height */
	overflow: auto; /* Enable scroll if needed */
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,0,0.42); /* Black w/ opacity */
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
	/*overflow-y: scroll;*/
}

/* Modal Content (Image) */
.modalPort-content {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#captionPort {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 700px;
	text-align: center;
	color: #ccc;
	padding: 10px 0;
	/*height: 150px;*/
}

/* The Close Button */
.closeBtnPort {
	font-size: 34px;
	font-weight: bold;
	transition: 0.3s;
	margin: 0 auto;
	/*position: absolute;*/
	width: 100px;
	left: 42.5%;
	height: auto;
	line-height: 1em;
	display: block;
	/* ------------------- */

	text-align: center;
	font-family: 'Orbitron', sans-serif;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	transition: .3s all ease-in;
	color: var(--main_text_blue_color);
	/*padding: 12px;*/
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: none;
	border: solid 2px rgba(67,111,243,30%);
	background-color: rgba(67,111,243,15%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}

	.closeBtnPort span {
		display: inline-block;
		/*position: absolute;*/
		padding: 0px;
		vertical-align: text-top;
		/*line-height: 24px;*/
	}

	.closeBtnPort:hover {
		color: #ffa407;
		border: solid 2px rgba(255,164,7,70%);
		cursor: pointer;
		/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
		transition: .15s all ease-in;
		border-radius: 50% / 15%;
	}

	.closeBtnPort:active {
		color: #00bb17;
		border: solid 2px rgba(0,187,23,70%);
		cursor: pointer;
		/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
		transition: .15s all ease-in;
		border-radius: 50% / 15%;
	}

#bodyTextPort {
	width: 80%;
	max-width: 700px;
	text-align: center;
	margin: auto;
	display: block;
	background-color: rgba(0,0,0,0.75);
	padding: 1px 30px 10px 30px;
	border-radius: 12px;
	line-height: 1.5;
}

#vcontainerPort {
	position: relative;
	margin: 10px auto;
	text-align: center;
	width: 80%;
	max-width: 700px;
	height: auto;
}

.videoPort {
	width: 100%;
	max-width: 700px;
	height: 420px;
}

.topCloseButton {
	display: none;
}
/*-------------------------End Portfolio Page--------------------------*/
/*--------------------------------------------------------------------*/
/*-----------------------------------------------------------------*/
/*---------------------------About Page----------------------------*/
.imgLogoStyle {
	width: 90%;
	border-radius: 40% / 8%;
}
.imgLogoSignContainer {
    text-align: center;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
	margin-top: 2%;
	margin-bottom: 3%;
}
.imgLogoSign {
	/*width: 34%;*/
	max-width: 256px;
	max-height: 80px;
	text-align: center;
	flex-basis: 100%;
}
.aboutC {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.headContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	align-content: flex-start;
	align-items: center;
	padding-top: 5%;
	padding-bottom: 5%;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
.headIMGContainer{
	width: 100%;
	text-align: center;
	max-width: 400px;
	/*margin-left: auto;*/
	/*margin-right: auto;*/
}
.AheadIMGContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: center;
	align-items: center;
}
.aboutLogo {
    width: 100%;
    max-width: 300px;
}
.aboutPortrait {
    /*margin-right: 10%;
    margin-left: 10%;*/
}
.greeting {
	text-align: center;
	font-size: 28px;
	color: #abafb3;
	line-height: 1.4;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-weight: 300;
	/*	margin-left: 10%;
	margin-right: 10%;*/
}
.aboutCText {
	text-align: justify;
	color: #abafb3;
	color: #99a8b8;
	font-size: 16px;
	line-height: 1.4;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-weight: 400;
	display: block;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
#readMoreTextTitle {
	display: block;
	width: 40%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
#readMoreLink {
	/*text-decoration: underline;*/
	text-align: center;
	border-bottom: 1px solid;
	border-bottom-color: inherit;
}
.toc {
	/*text-align: center;*/
	text-align: left;
	color: #99a8b8;
	font-size: 18px;
	line-height: 1.4;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-weight: 400;
	margin-left: 5%;
	/*margin-right: auto;*/
	margin-bottom: auto;
	margin-top: 2%;
	/*width: 90%;*/
}
.tocList {
	font-size: 16px;
}
.tocList li:hover span {
	text-decoration: underline;
}
.tocList li::before {
	content: "-";
}
.tocList a, .tocList a:visited {
	color: #889cb3;
	text-decoration: none;
}
.tocList a:hover {
	color: #0099ff;
}
.formatting {
	display: flex;
	gap: 20px 50px;
	min-width: 25%;
	flex-direction: row;
	flex-wrap: wrap;
	/*text-decoration: overline;*/
	align-content: stretch;
	justify-content: space-between;
	align-items: center;
	list-style: none;
	text-align: center;
}
.formatting li {
	color: #889cb3;
	font-weight: bold;
	flex-shrink: 3;
	flex-grow: 4;
	max-width: 30ch;
	border: 1px solid grey;
	box-shadow: 0px 0px 4px 1px #436ff3;
	padding: 4px 6px;
	-webkit-appearance: none;
	/*border-top: 1px solid grey;
	border-right: 1px solid grey;
	border-bottom: 1px solid grey;*/
}
.formatting li::before {
	/*content: "_";*/
}
.formatting li::after {
	/*content: "_";*/
}
.formatting li:hover {
	background-color: rgba(67,111,243,15%);
}
.linkSkill {
	color: #889cb3;
	font-weight: bold;
	/*border: 1px solid grey;*/
	text-decoration: none;

}
.linkSkill:visited {
	color: #889cb3;
	font-weight: bold;
	text-decoration: none;
}
.linkSkill:hover {
	/*text-decoration: underline;*/
	color: #ffffff;
}
.resumeStats {
	/*font-family: 'Times New Roman';
	font-family: 'Audiowide', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	font-size: 18px;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.2;
	width: 90%;
}
.resumeStatsHeaderTop {
	font-size: 34px;
	color: #99a8b8;
	font-family: 'Audiowide', cursive;
	font-style: normal;
	font-weight: 300;
	text-align: center;
	display: block;
	padding-top: 18px;
	padding-bottom: 18px;
}
.resumeStatsHeader {
	font-size: 28px;
	color: #99a8b8;
	font-family: 'Audiowide', cursive;
	font-style: normal;
	font-weight: bold;
	text-decoration: underline;
}
.resumeStatsDate {
	font-size: 17px;
	font-style: normal;
	font-weight: 200;
}
.resumeStatsTitle {
	font-style: normal;
	font-weight: bold;
	line-height: 1.5;
	color: #889cb3;
}
.resumeStatsPlace {
	color: #057bf3;
	font-style: normal;
	font-weight: 200;
}
.resumeStatsList {
	line-height: 1.5;
	list-style-type: square;
	/*list-style-type: none;*/
	font-style: normal;
}
/*.resumeStatsList li:before {
	content: "▷";
}*/
.rDownloads {
	display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  flex-direction: row;
  align-content: stretch;
  align-items: flex-start;
}
.rDownloads a {
	flex-shrink: 2;
	flex-grow: 4;
}
.rLink {
	background-color: transparent;
	text-decoration: none;
	display: inline;
	text-align: center;
	padding: 15px;
	font-family: garamond;
	font-family: 'Orbitron', sans-serif;
	color: #a2a6a9;
	font-size: 16px;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	width: 20%;
}

.rLink:hover, .rLink:active {
	color: #0099ff;
	text-decoration: underline;
}

.rLink img {
	filter: invert(0.5);
	width: 40px;
}

.rLink:hover img {
	filter: invert(1);
}
a.link3 {
	color: #abafb3;
	background-color: transparent;
	text-decoration: underline;
	text-align: inherit;
	padding: 0;
	margin: 0;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}
a.link3:hover {
	color: #0099ff;
	background-color: transparent;
	text-align: inherit;
	padding: 0;
	margin: 0;
}
a.linkG {
    color: #abafb3;
    background-color: transparent;
    text-decoration: none;
    text-align: inherit;
    padding: 0;
    margin: 0;
    margin-left: auto;
    margin-right: auto;
    cursor: pointer;
    /*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}
	a.linkG:visited {
		color: #889cb3;
		background-color: transparent;
		text-decoration: none;
		text-align: inherit;
		padding: 0;
		margin: 0;
		margin-left: auto;
		margin-right: auto;
	}
	a.linkG:hover {
		color: #0099ff;
		background-color: transparent;
		text-decoration: none;
		text-align: inherit;
		padding: 0;
		margin: 0;
		margin-left: auto;
		margin-right: auto;
	}
.text {
	color: var(--main_subText_color);
	font-size: 24px;
	font-family: garamond;
	text-align: center;
	opacity: 1;
	position: absolute;
	padding: 5px;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/*-------------------------End About Page--------------------------*/
/*-----------------------------------------------------------------*/

/*----------------------------------------------------------------------*/
/*---------------------------Sitemap Page----------------------------*/

.textSMap { /*text4*/
	/*color: var(--main_subText_color);*/
	font-size: 18px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: center;
	text-decoration: none;
	word-wrap: break-word;
	width: 75%;
	padding: 8px;
	margin: 0 auto;
}

.aboutSMapTitle { /*about4Title*/
	color: var(--main_subText_color);
	font-size: 22px;
	text-align: center;
}

.listTitles {
	/*text-decoration: underline;*/
	font-size: 24px;
	text-align: center;
	border: 1px solid var(--main_headerText_color);
	list-style: none;
	margin-top: 6px;
	margin-bottom: 6px;
	padding-top: 6px;
	padding-bottom: 6px;
}

.listTitles:hover {
	color: var(--main_subText_color);
	text-decoration: none;
}

.liTitle {
	text-decoration: none;
}
.liTitle:hover {
	text-decoration: underline;
	color: var(--main_subText_color);
}
.liTitle::after {
	content: ' >';
	text-decoration: none;
}
.ulSMap { /*ul4*/
	/*color: var(--main_subText_color);*/
	font-size: 22px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: left;
	text-decoration: none;
	word-wrap: break-word;
	line-height: 1.5;
	/*list-style: disclosure-closed;*/
	list-style: none;
}
.ulSMap .divContent::before {
	content: '<> ';
	text-decoration: none;
}
.ulSMap li {
	margin-top: 6px;
	margin-bottom: 6px;
	padding-top: 6px;
	padding-bottom: 6px;
	list-style: none;
}
.ulSMap a:hover {
	color: #3870ff;
	text-decoration: underline;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}
.secCont {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
/*.secCont:hover {
	background-color: rgba(67,111,243,15%);
}*/
.secCont:hover .listTitles {
	color: #00bb17;
	background-color: rgba(67,111,243,15%);
}
/*.ulSMap li ul li {
	text-decoration: underline;
	color: green;
}*/
.tab1 {
	padding-left: 5%;
}
.tab2 {
	padding-left: 10%;
}
.tab3 {
	padding-left: 15%;
}

#photoList1,
#photoList2,
#photoList3,
#photoList4 {
	display: none;
}

/*-------------------------End Sitemap Page--------------------------*/
/*-----------------------------------------------------------------*/

/*----------------------------------------------------------------------*/
/*---------------------------Wordsearch Page----------------------------*/

h3 {
	color: var(--main_headerText_color);
	font-size: 42px;
	/*font-family: 'Orbitron', sans-serif;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 400;
	text-align: center;
	/*text-decoration: underline;*/
	margin: 0;
	margin-top: 24px;
}
h3 span {
	border-bottom: solid 1px var(--main_headerText_color);
}

.pText, .pTextH {
	color: var(--main_headerText_color);
	font-size: 20px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	/*text-align: center;*/
	text-align: justify;
	width: 90%;
	margin: auto;
	margin-bottom: 24px;
	padding-bottom: 24px;
	margin-top: 24px;
	padding-top: 24px;
}

.pTextH {
	margin-bottom: 0;
	padding-bottom: 0;
	margin-top: 8px;
	padding-top: 0;
}
.pText #notes {
	border-bottom: solid 1px var(--main_headerText_color);
}

a.linkWS {
	color: #abafb3;
	background-color: transparent;
	text-decoration: none;
	text-align: inherit;
	padding: 0;
	margin: 0;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}
a.linkWS span {
	border-bottom: solid 1px var(--main_headerText_color);
}
a.linkWS:hover, a.linkWS:hover span {
	color: #0099ff;
	background-color: transparent;
	text-align: inherit;
	padding: 0;
	margin: 0;
	border-bottom: solid 1px #0099ff;
}

.point {
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	border-bottom: solid 1px var(--main_headerText_color);
}

#ws-main {
	text-align: center;
	margin: auto;
	width: 90%;
	background-color: Transparent;
	background-repeat:no-repeat;
	border:solid #c2c6cc;
	box-shadow: 0px 0px 6px 6px #c2c6cc;
	-webkit-box-shadow: 0px 0px 6px 6px #c2c6cc;
	justify-content: center;
  align-items: center;
}

.ws-input {
	text-align: center;
	/*padding: 12px;*/
	margin: auto;
}

#ws-output {
	/*border:solid #c2c6cc;*/
	width: 90%;
	text-align: center;
	margin: auto;
	margin-top: 24px;
	margin-bottom: 24px;
	color: var(--main_headerText_color);
	font-size: 42px;
	/*font-family: 'Orbitron', sans-serif;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
}
#ws-output-underline {
	font-weight: 400;
	border-bottom: solid 1px var(--main_headerText_color);
}

#textbox1, #textbox2, #textbox3, #textbox4, #textbox5 {
	text-align: center;
	text-transform: uppercase;
	font-size: 38px;
	font-family: 'Audiowide', cursive;
	line-height: 2;
	padding: 18px;
	margin: 12px;
	width: 42px;
	height: 42px;
	border: solid #3870ff;
	box-shadow: 0px 0px 4px 4px #3870ff;
	-webkit-box-shadow: 0px 0px 4px 4px #3870ff;
	border-radius: 12px;
}

 #textbox6, #textbox7 {
	 text-align: center;
	 text-transform: uppercase;
	 font-size: 38px;
	 font-family: 'Audiowide', cursive;
	 line-height: 2;
	 padding: 18px;
	 margin: 12px;
	 width: 210px;
	 height: 42px;
	 border: solid #c2c6cc;
	 border-radius: 12px;
 }

 #textbox6 {
	 border: solid #00e000;
	 box-shadow: 0px 0px 4px 4px #00e000;
	 -webkit-box-shadow: 0px 0px 4px 4px #00e000;
 }

 #textbox7 {
	 border: solid #ff3b14;
	 box-shadow: 0px 0px 4px 4px #ff3b14;
	 -webkit-box-shadow: 0px 0px 4px 4px #ff3b14;
 }

 #textbox1:focus, #textbox2:focus, #textbox3:focus,
 #textbox4:focus, #textbox5:focus, #textbox6:focus,
 #textbox7:focus {
	 outline: 0;
	 border: solid #fca417;
	 box-shadow: inset 0px 0px 2px 2px #000000,
	  					 0px 0px 4px 4px #fca417;
	 -webkit-box-shadow: inset 0px 0px 2px 2px #000000,
	  					 0px 0px 4px 4px #fca417;
 }

#submit, #reset {
	color: #c2c6cc;
	text-align: center;
	text-transform: uppercase;
	font-size: 24px;
	font-family: 'Orbitron', sans-serif;
	/*font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 400;*/
	padding: 12px;
	padding-left: 20px;
	padding-right: 20px;
	margin: 32px;
	border: 2px solid #3870ff;
	border-radius: 12px;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	background-color: rgba(56, 112, 255, .1);
	box-shadow: 0 0 0 #000000;
	-webkit-box-shadow: 0 0 0 #000000;
	-webkit-appearance: none;
	/*animation: compact 4s infinite;*/
}

#submit:hover, #reset:hover {
	color: #ffffff;
	background-color: rgba(56, 112, 255, .75);
	text-shadow: 2px 2px 2px #000000,
							 -1px -1px 2px #000000;
	box-shadow: inset 0px 0px 2px 2px #000000;
	-webkit-box-shadow: inset 0px 0px 2px 2px #000000;
	/*animation: compact 4s infinite;*/
}

#submit:active, #reset:active {
	color: #3870ff;
	background-color: rgba(56, 112, 255, .5);
	text-shadow: 4px 4px 2px #000000,
							 -1px -1px 2px #000000;
							 /*-8px 8px 2px #000000,
							 8px -8px 2px #000000;*/
	box-shadow: inset 0px 0px 2px 2px #000000;
	-webkit-box-shadow: inset 0px 0px 2px 2px #000000;
	/*animation: compact reverse 2s infinite;*/
}

#output {
	word-wrap: break-word;
	line-height: 2;
	color: var(--main_headerText_color);
	font-size: 24px;
	font-family: 'verdana';
	/*text-align: center;*/
	text-align: justify;
}

@keyframes compact {
		from {
			text-shadow: 8px 8px 2px #000000,
									 -8px -8px 2px #000000,
									 -8px 8px 2px #000000,
									 8px -8px 2px #000000;
		}
		to {
			text-shadow: 2px 2px 2px #000000,
									 -1px -1px 2px #000000;
		}
}

#loading {
		text-align: center;
		margin: auto;
		border: 6px dotted #3870ff;
		border-top: 12px ridge #3870ff;
		border-bottom: 12px ridge #3870ff;
		border-radius: 50%;
		width: 70px;
		height: 70px;
		animation: spin 1.5s linear infinite;
}

@keyframes spin {
		100% {
				transform: rotate(360deg);
		}
}


/*-------------------------End Wordsearch Page--------------------------*/
/*----------------------------------------------------------------------*/

/*--------------------------------------------------------------------*/
/*-------------------------Photoshoot Page----------------------------*/

.PSphotos {
	width: 90%;
	margin: auto;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: space-between;
	justify-content: space-evenly;
	align-items: center;
}
.PSphotosInner {
	width: 100%;
	margin: auto;
	position: relative;
	object-fit: contain;
	/*display: inline-block;*/
	text-align: center;

	border: solid 2px rgba(67,111,243,30%);
 	background-color: rgba(67,111,243,15%);
	/*border-radius: 4%;*/
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.img5 {
	max-width: 100%;
	display: inline;
	margin-left: auto;
	margin-right: auto;
	height: 200px;
	position: relative;
	object-fit: contain;
	padding: 12px;
	/*border: solid 2px rgba(67,111,243,0%);
	border-radius: 4%;*/
}
/*.img5:hover {
	border: solid 2px rgba(67,111,243,30%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}*/

.descrITClick,
.descrITLink {
	text-align: center;
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	text-decoration: none;
	color: #a2a6a9;
	font-size: 18px;
	margin: auto;
	margin-bottom: 24px;
	line-height: 1.2;
	width: 90%;
	word-wrap: break-word;
	display: block;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}

.descrITClick:hover {
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	text-decoration: underline;
}

/*-------------------------End Photoshoot Page--------------------------*/
/*----------------------------------------------------------------------*/

/*--------------------------------------------------------------------*/
/*-----------------------Computer Repair Page-------------------------*/

.titleIT {
	color: #64a2e8;
	font-size: 42px;
	font-family: 'Audiowide', cursive;
	text-align: center;
	text-decoration: underline;
	margin: auto;
	word-wrap: break-word;
}
.descrTitleIT {
	text-align: left;
	word-wrap: break-word;
	width: 90%;
	line-height: 2;
	text-decoration: none;
	font-size: 28px;
	color: var(--main_genTitle_color);
	font-family: 'Audiowide', cursive;
	font-style: normal;
	font-weight: 300;
	display: block;
	padding-top: 18px;
	padding-bottom: 18px;
	margin: auto;
}
.descrIT{
	text-align: left;
	/*font-family: 'verdana';*/
	/*font-family: 'Orbitron', sans-serif;
	text-decoration: none;
	margin: auto;
	line-height: 2;
	letter-spacing: 0.15em;

	color: var(--main_subText_color);
	font-size: 20px;
	width: 90%;*/

	/*font-family: 'Times New Roman';
	font-family: 'Audiowide', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	text-decoration: none;
	color: #a2a6a9;
	font-size: 18px;
	margin: auto;
	line-height: 1.2;
	width: 90%;
	word-wrap: break-word;
	/*cursor: url("src/img/CustomCursor_5_5s.png"), auto;*/
}
.descrIT ul {
	list-style: none;
	line-height: 2.5;
}
.descrIT ul li:before {
	/*content: "&#9655;";*/
	content: "▷";
}

/*----------------------End Computer Repair Page------------------------*/
/*----------------------------------------------------------------------*/

/*--------------------------------------------------------------------*/
/*---------------------------Contact Page-----------------------------*/

.pContact {
	/*color: var(--main_headerText_color);*/
	font-size: 22px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: center;
	text-decoration: none;
	word-wrap: break-word;
	padding: 24px;
	margin: auto;
	margin-top: 24px;
	margin-bottom: 24px;
}

.busCard {
	width: 600px;
}

/*--------------------------End Contact Page----------------------------*/
/*----------------------------------------------------------------------*/

/*------------------------------------------------------------------*/
/*---------------------------README Page----------------------------*/

.paraTextFull {
	width: 75%;
	margin: auto;
}
.paraTextTitle {
	color: var(--main_headerText_color);
	font-size: 42px;
	/*font-family: 'Orbitron', sans-serif;*/
	/*font-family: nasalization, sans-serif;*/
	font-family: 'Audiowide', cursive;
	/*font-family: 'Merienda', cursive;*/
	text-align: center;
	text-decoration: underline;
	word-wrap: break-word;
	padding: 4px;
	margin: auto;
	margin-top: 8px;
	margin-bottom: 8px;
}
.paraTextPara {
	/*color: var(--main_headerText_color);*/
	font-size: 22px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: justify;
	text-decoration: none;
	word-wrap: break-word;
	padding: 24px;
	margin: auto;
	margin-top: 24px;
	margin-bottom: 24px;
}

/*-------------------------End README Page--------------------------*/
/*------------------------------------------------------------------*/

/*-----------------------------------------------------------------*/
/*----------------------------404 Page-----------------------------*/


.fof {
	display: block;
	/*font-family: 'Orbitron', sans-serif;*/
	/*font-family: 'Merienda', cursive;*/
	/*font-family: 'Audiowide', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: center;
	/*color: var(--main_subText_color);*/
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	/*margin: 40px;*/
	margin-left: auto;
	margin-right: auto;
}

.fof h1 {
	font-size: 28px;
	font-family: 'Audiowide', cursive;
}

.fof h2 {
	font-size: 18px;
	padding-bottom: 20px;
	padding-top: 0px;
}

.fof img {
	width: 600px;
	border-radius: 20% / 12%;
}

.fof button {
	text-align: center;
	font-family: 'Audiowide', cursive;
	/*font-family: 'Orbitron', sans-serif;*/
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	transition: .3s all ease-in;
	color: var(--main_text_blue_color);
 	font-size: 22px;
	padding: 10px;
	padding-left: 14px;
	padding-right: 14px;
 	text-decoration: none;
 	border: solid 2px rgba(67,111,243,30%);
 	background-color: rgba(67,111,243,15%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}

.fof:hover {
	border: 5px blue;
}

.fof button:hover {
	color: #ffa407;
	border: solid 2px rgba(255,164,7,70%);
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	transition: .15s all ease-in;
	border-radius: 25% / 10%;
	/*border-radius: 50% / 15%;*/
	/*transform: skew(-30deg);*/
}
.fof button:active {
	color: #00bb17;
	border: solid 2px rgba(0,187,23,70%);
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
	transition: .15s all ease-in;
	border-radius: 50% / 15%;
}

.welcome4 {
	position: relative;
	/*cursor: pointer;*/
	/*cursor: url(https://www.schuylermeyer.com/src/img/CustomCursor_5_4s.png), auto;*/
	/*cursor: url("src/img/CustomCursor_5_5s.png"), auto;*/
}

.about4Title {
	color: var(--main_subText_color);
	font-size: 22px;
	text-align: center;
}
.ul4 {
	/*color: var(--main_subText_color);*/
	font-size: 18px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: left;
	text-decoration: none;
	word-wrap: break-word;
	line-height: 1.5;
	/*list-style: disclosure-closed;*/
	list-style: none;
}
.ul4 li::before {
	content: '<>';
	text-decoration: none;
}
.ul4 li {
	padding-top: 6px;
	padding-bottom: 6px;
}
.ul4 a:hover {
	color: #3870ff;
	text-decoration: underline;
	cursor: pointer;
	/*cursor: url("src/img/CustomCursor_6_2p.png"), auto;*/
}
.text4 {
	/*color: var(--main_subText_color);*/
	font-size: 18px;
	/*font-family: 'Merienda', cursive;*/
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 300;
	color: #a2a6a9;
	text-align: justify;
	text-decoration: none;
	word-wrap: break-word;
	width: 75%;
	padding: 24px;
	margin: auto;
	/*margin-top: 24px;
	margin-bottom: 24px;*/
}

/*---------------------------End 404 Page-----------------------------*/
/*--------------------------------------------------------------------*/

/*------------------------------------------------------------------*/
/*-------------------Test Fantasy Spreadsheet Page------------------*/

.fs_title {
	color: var(--main_subText_color);
	padding: 10px;
	margin: 10px;
	margin-left: 5%;
	margin-bottom: 0;
	/*width: 90%;*/
	text-align: left;
	font-size: 36px;
	font-family: 'Orbitron', sans-serif;
}

/*----------------End Test Fantasy Spreadsheet Page-----------------*/
/*------------------------------------------------------------------*/

/*------------------------------------------------------------------*/
/*-------------------Test Scoreboard Page------------------*/

#scoreboard {
  border: 1px solid var(--main_subText_color);
	text-align: center;
	color: var(--main_subText_color);
	font-size: 21px;
	/*width: auto;*/
	font-family: 'Orbitron', sans-serif;
	padding: 5px;
	background-color: rgba(20,20,20,0.5);
	font-weight: bold;
	border:solid #c2c6cc;
	box-shadow: 0px 0px 6px 4px #c2c6cc;
	-webkit-box-shadow: 0px 0px 6px 4px #c2c6cc;
	-webkit-appearance: none;
  margin-left: auto;
  margin-right: auto;
	width: 90%;
}
#scoreboard th {
	border: 1px solid var(--main_subText_color);
	text-align: center;
	color: var(--main_subText_color);
	font-size: 21px;
	width:auto;
	font-family: 'Orbitron', sans-serif;
	padding: 5px;
	background-color: rgba(20,20,20,0.5);
	font-weight: bold;
}
#scoreboard td {
	border: 1px solid var(--main_subText_color);
	text-align: center;
	font-size: 21px;
	width:auto;
	/*font-family: 'Orbitron', sans-serif;*/
	font-family: 'Roboto', monospace;
	padding: 5px;
	background-color: rgba(20,20,20,0.5);
	font-weight: bold;
	color: inherit;
}
#time {
	display: table-caption;
	width: 100%;
	/*width: 7ch;*/
	/*font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;*/
}
#minutes {
	/*font-family: 'Roboto', monospace;*/
}
#seconds {
	/*font-family: 'Roboto', monospace;*/
}
/*
#scoreboard tr:hover {
	background-color: #7e29ff;
	text-shadow: 2px 1px 2px black;
}
#scoreboard tr:visited {
	color: inherit;
}
#scoreboard tr:hover.noHover {
	color: inherit;
	background-color: inherit;
}
#scoreboard td:hover.noHover {
	color: inherit;
	background-color: inherit;
}*/

/*----------------End Test Scoreboard Page-----------------*/
/*---------------------------------------------------------*/

/*--------------------------------------------------------*/
/*-------------------Photo Tutorial Page------------------*/

/*.img-comp-container {
	position: relative;
	height: 800px;*/ /*should be the same height as the images*/
/*}

.img-comp-img {
	position: absolute;
	width: auto;
	height: auto;
	overflow: hidden;
}

	.img-comp-img img {
		height: 800px;
		display: block;
		vertical-align: middle;
	}

.img-comp-slider {
	position: absolute;
	z-index: 9;
	cursor: ew-resize;*/
	/*set the appearance of the slider:*/
	/*width: 40px;
	height: 40px;
	background-color: #2196F3;
	opacity: 0.7;
	border-radius: 50%;
}*/

.compareContainer {
	display: flex;
	flex-wrap: nowrap;
	align-content: flex-start;
	justify-content: center;
	align-items: flex-start;
}

.captionCompare {
	text-align: center;
}

#comparison {
	width: 600px;
	height: 400px;
	max-width: 800px;
	max-height: 800px;
	overflow: hidden;
	border: 8px solid #000000;
	/*margin-bottom: 100px;*/
}

	#comparison figure {
		background-image: url(./src/img/phTut-imgEdit.jpg);
		background-size: cover;
		position: relative;
		font-size: 0;
		width: 100%;
		height: 100%;
		margin: 0;
	}

	#comparison figure > img {
		position: relative;
		width: 100%;
	}

	#comparison figure div {
		background-image: url(./src/img/phTut-imgUnedit.jpg);
		background-size: cover;
		position: absolute;
		width: 50%;
		box-shadow: 0 5px 10px -2px rgba(0,0,0,0.3);
		overflow: hidden;
		bottom: 0;
		height: 100%;
	}

#comparison2 {
	width: 600px;
	height: 400px;
	max-width: 800px;
	max-height: 800px;
	overflow: hidden;
	border: 8px solid #000000;
}

#comparison2 figure {
	background-image: url(./src/img/phTut-img2Edit.jpg);
	background-size: cover;
	position: relative;
	font-size: 0;
	width: 100%;
	height: 100%;
	margin: 0;
}

#comparison2 figure > img {
	position: relative;
	width: 100%;
}

#comparison2 figure div {
	background-image: url(./src/img/phTut-img2Unedit.jpg);
	background-size: cover;
	position: absolute;
	width: 50%;
	box-shadow: 0 5px 10px -2px rgba(0,0,0,0.3);
	overflow: hidden;
	bottom: 0;
	height: 100%;
}

.editSliders {
	/*	background-image: url(./src/img/phTut-imgSliders.jpg);
	background-repeat: no-repeat, no-repeat;*/
	overflow-x: hidden;
	overflow-y: scroll;
	width: 300px;
	height: 400px;
	border: 8px solid #000000;
	border-left: 4px solid #000000;
	border-right: 4px solid #000000;
}

.editSliders::-webkit-scrollbar {
	/*width: 6px; -- looks to be actual size in Lightroom*/
	width: 12px; /* but going to make bigger for readability*/
}

.editSliders::-webkit-scrollbar-track {
	background-color: #000000;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}

	.editSliders::-webkit-scrollbar-button {
		background: repeating-linear-gradient( 90deg, #282828, #000000, #282828, #000000, #282828, #000000, #282828, #000000, #282828 );
		border-top: 1px solid #282828;
		border-bottom: 1px solid #282828;
		height: 42px;
	}

.editSliders::-webkit-scrollbar-thumb {
	background-color: #919191;
	outline: 1px solid slategrey;
	border-radius: 2px 2px 4px 4px;
}

.editSliders::-webkit-scrollbar-thumb:hover {
	background-color: #cacaca;
	outline: 1px solid slategrey;
}
	
input[type=range] {
	-webkit-appearance: none;
	-moz-appearance: none;
	position: relative;
	top: -12%;
	left: 0;
	background-color: rgba(0,0,0,0);
	background-repeat: no-repeat;
	background-size: 90%;
	width: 100%;
	margin: 0;
}

.sliderContainer {
	display: flex;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	position: relative;
	width: 100%;
	top: -12%;
}
.sliderArrows {
	color: var(--main_border_blue_color);
	font-size: 42px;
	line-height: 1.1em;
	filter: drop-shadow(0 0 2px var(--main_border_blue_color));
	cursor: default;
}

input[type=range]:focus {
	outline: none;
}

input[type=range]:active {
	/*background-color: rgba(0,0,0,0.5);*/
	background-size: 90%;
	background: linear-gradient( 
		0deg, 
		rgba(0,0,0,0), 
		rgba(0,0,0,0), 
		rgba(0,0,0,0), 
		rgba(0,0,0,0), 
		rgba(0,0,0,0.8), 
		rgba(0,0,0,0), 
		rgba(0,0,0,0),
		rgba(0,0,0,0), 
		rgba(0,0,0,0));
	outline: none;
	border: none;
}

input[type=range]::-moz-range-track {
	-moz-appearance: none;
	width: 100%;
	background-color: rgba(255,255,255,0);
	position: relative;
	outline: none;
}

input[type=range]::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 50px;
	height: 25px;
	border-radius: 96px / 24px;
	color: rgba(99, 138, 255, 1);
	border: solid 2px var(--main_border_blue_color);
	background: var(--main_border_blue_color);
	box-shadow: 0px 0px 6px 2px #436ff3;
	cursor: pointer;
}

input[type=range]::-moz-range-thumb {
	-moz-appearance: none;
	width: 50px;
	height: 25px;
	border-radius: 96px / 24px;
	color: rgba(99, 138, 255, 1);
	border: solid 2px var(--main_border_blue_color);
	background: var(--main_border_blue_color);
	box-shadow: 0px 0px 6px 2px #436ff3;
	cursor: pointer;
}

input[type=range]:focus::-webkit-slider-thumb {
	background: rgba(67,111,243,80%);
}

input[type=range]:focus::-moz-range-thumb {
	background: rgba(67,111,243,80%);
}



/*-------------------End Photo Tutorial Page------------------*/
/*------------------------------------------------------------*/

/*-------------------------------------------------------*/
/*-------------------Start Odd Job Page------------------*/



/*-------------------End Odd Job Page------------------*/
/*-----------------------------------------------------*/

/*----------------------------------------------------------*/
/*-------------------Start Automation Page------------------*/

#controlPanelContainer {
	border: solid 2px var(--main_headerText_color);
	width: 400px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	padding: 6px;
	background: rgba(0,0,0,0.5);
}
#controlPanel {
	border: solid 2px var(--main_headerText_color);
	width: 370px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	padding: 6px;
	background: rgba(0,0,0,0.5);
}
#middleContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-between;
	align-items: center;
	padding: 8px;
	padding-left: 12px;
	padding-right: 18px;
}
#textControlContainer {
	width: auto;
	text-align: left;
	/*font-family: 'Roboto Mono', monospace;*/
	font-family: 'Orbitron', sans-serif;
	font-style: normal;
	font-size: 20px;
	/*font-weight: 300;*/
	color: #a2a6a9;
	padding-left: 4px;
}
.currentButton {
	margin-left: 20px;
}
#currentBroken, #currently {
	color: var(--main_headerText_color);
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 200;
	font-size: 18px;
	line-height: 1.8;
	text-align: left;
}
#currently {
	padding-bottom: 2px;
	border-top: solid thin var(--main_headerText_color);
	/*border-bottom: solid thin var(--main_headerText_color);*/
}
#currentBroken {
	color: #848484;
}

.currSpan {
	/*text-decoration: underline;*/
	color: var(--main_border_blue_color);
	/*border-top: solid thin var(--main_headerText_color);*/
	border-bottom: solid thin #848484;
	font-weight: 400;
	padding-bottom: 2px;
	line-height: 1.8;
}

#batteryBar {
	padding: 6px 6px;
	width: 354px;
	height: 60px;
	border: solid 2px var(--main_headerText_color);
	position: relative;
	border-radius: 8px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	background: rgba(0,0,0,0.5);
}
	#batteryBar:before {
		content: " ";
		top: 15px;
		right: 368px;
		height: 42px;
		width: 4px;
		position: absolute;
		background: var(--main_headerText_color);
		border-radius: 4px 0 0 4px;
	}	
	#batteryBar:after {
		content: " ";
		top: 23px;
		right: -12px;
		height: 28px;
		width: 12px;
		position: absolute;
		background: var(--main_headerText_color);
		border-radius: 0 4px 4px 0;
	}
.bbar {
	/*cursor: pointer;*/
	display: inline-block;
	text-align: center;
	width: 0;
	border: solid thin #4d4f51;
	border-radius: 4px;
	padding: 14px;
	height: 30px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	background: transparent;
	transition: background 2s;
}

	.bbar.active {
		background: var(--main_button_green_color);
	}
#visualDisplay {
	width: 370px;
	height: 208px;
}
#vdVID {
	display: none;
	width: 100%;
	height: auto;
}
#outContainer {
	margin-left: auto;
	margin-right: auto;
}
#textInfoContainter {
	color: #848484;
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-size: 18px;
	font-weight: 200;
	margin-left: auto;
	margin-right: auto;
	width: 400px;
	padding: 6px;
	text-align: center;
	border: solid 2px var(--main_headerText_color);
	border-top: 0;
}
#textInfoContainter span {
	/*text-decoration: underline;*/
	border-bottom: solid 1px var(--main_border_blue_color);
}
#textInfoContainter li::before {
	content: "> ";
	color: var(--main_border_blue_color);
}
#textInfoContainter li {
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	list-style-type: none;
	text-decoration: none;
}


/*-------------------End Automation Page------------------*/
/*--------------------------------------------------------*/

/*-------------------------------------------------------*/
/*-------------------Start Library Page------------------*/

.formContainer {
	display: flex;
	width: 90%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-content: center;
	align-items: flex-start;
}

.topForms {
	color: var(--main_headerText_color);
}

.formContainer, .topForms, .forms input, 
.topForms select, .forms select {
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-weight: 400;
	line-height: 1.4;
}

/*.forms label {
	text-decoration: underline;
}*/

.topForms select, .forms legend, .forms select {
	font-weight: bold;
}

.forms {
	color: var(--main_headerText_color);
	text-align: left;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-evenly;
	align-items: center;
}

	/*.forms > * {*/
	/*.forms label {*/
		/*line-height: 1.2em;*/
		/*padding-top: 24px;
		padding-bottom: 24px;
		margin-bottom: 24px;
	}*/
	
	.forms legend {
		/*text-decoration: underline;*/
		font-size: 24px;
		letter-spacing: 4px;
	}

/*-------------------End Library Page------------------*/
/*-----------------------------------------------------*/

/*-------------------Start Color Page------------------*/
/*-----------------------------------------------------*/

.homeLink {
	font-family: 'Roboto Mono', monospace;
	font-family: 'Audiowide', cursive;
	font-style: normal;
	font-size: 16px;
	color: #000000;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	/*text-shadow: 1px 0px 0px black,2px 1px 1px white;*/
	letter-spacing: 2px;
	text-decoration: none;
	border-bottom: solid 1px #000000;
	-webkit-filter: invert(1);
	filter: invert(1);
	mix-blend-mode: difference;
}

	.homeLink:hover {
		border-top: solid 1px #000000;
	}
	.homeLink:visited {
		/*color: inherit;*/
	}

.titleBack {
	color: var(--main_text_blue_color);
	text-shadow: 1px 1px 2px black;
	background-color: rgba(67,111,243,15%);
	padding: 4px;
	border: solid 1px var(--main_border_blue_color);
	border-radius: 8px;
	box-shadow: 0px 0px 6px 2px #436ff3;
	letter-spacing: 2px;
	line-height: 2;
}

.labelText {
	color: #f4f4f4;
	font-family: 'Roboto Mono', monospace;
	font-style: normal;
	font-size: 22px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	/*vertical-align: super;*/
}

#colorPicker {
	background-color: #2b2c47;
	width: 84px;
	height: 42px;
	border: solid 2px var(--main_border_blue_color);
	border-radius: 4px;
	padding: 1px;
	padding-top: 1px;
	padding-bottom: 1px;
	outline: none;
	-webkit-appearance: none;
	z-index: 10;
	cursor: pointer;
}

input[type="color"]::-moz-color-swatch {
	border: none;
}

input[type="color"]::-webkit-color-swatch-wrapper {
	padding: 0;
	border-radius: 0;
}

input[type="color"]::-webkit-color-swatch {
	border: none;
}

.colorBottom {
	/*background-color: #000000;*/
	text-align: center;
	/*color: #000000;*/
	color: #8b8e91;
	font-size: 14px;
	width: 90%;
	font-family: 'Orbitron', sans-serif;
	position: fixed;
	left: 50%;
	bottom: 0%;
	transform: translate(-50%, -50%);
	margin: 0 auto;
	border-top: 1px solid #000000;
	/*	-webkit-filter: invert(1);
	filter: invert(1);
	mix-blend-mode: difference;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: #000000;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;*/
}

#colorArrow {
	text-align: center;
	font-size: 42px;
	color: #000000;
	transform: translate(0%, 25%);
	animation: arrow-anim 4s ease-in-out infinite;
}

@keyframes arrow-anim {
	0% {
		transform: translate(0%, 25%);
	}
	50% {
		transform: translate(0%, -10%);
	}
	100% {
		transform: translate(0%, 25%);
	}
}

/*-------------------End Color Page------------------*/
/*---------------------------------------------------*/

/*-------------------Start 3D Page------------------*/
/*--------------------------------------------------*/

/*:not(:defined) > * {
	display: none;
}*/

/*html {
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}*/

#3D {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}

model-viewer {
	width: 80%;
	height: 90%;
	padding: 24px 0;
	background-color: rgba(0,0,0,0);
	box-shadow: 0px 0px 30px 15px #436ff3;
	-webkit-box-shadow: 0px 0px 30px 15px #436ff3;
	background-color: rgba(18,18,18,0.6);
}


.progress-bar {
	display: block;
	width: 33%;
	height: 10%;
	max-height: 2%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate3d(-50%, -50%, 0);
	border-radius: 25px;
	box-shadow: 0px 3px 10px 3px rgba(0, 0, 0, 0.5), 0px 0px 5px 1px rgba(0, 0, 0, 0.6);
	border: 1px solid rgba(255, 255, 255, 0.9);
	background-color: rgba(0, 0, 0, 0.5);
}

	.progress-bar.hide {
		visibility: hidden;
		transition: visibility 0.3s;
	}

.update-bar {
	background-color: rgba(255, 255, 255, 0.9);
	width: 0%;
	height: 100%;
	border-radius: 25px;
	float: left;
	transition: width 0.3s;
}

#ar-button {
	background-image: url(ar_icon.png);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: 12px 50%;
	background-color: #fff;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	bottom: 16px;
	padding: 0px 16px 0px 40px;
	font-family: Roboto Regular, Helvetica Neue, sans-serif;
	font-size: 14px;
	color: #4285f4;
	height: 36px;
	line-height: 36px;
	border-radius: 18px;
	border: 1px solid #DADCE0;
}

	#ar-button:active {
		background-color: #E8EAED;
	}

	#ar-button:focus {
		outline: none;
	}

	#ar-button:focus-visible {
		outline: 1px solid #4285f4;
	}

@keyframes circle {
	from {
		transform: translateX(-50%) rotate(0deg) translateX(50px) rotate(0deg);
	}

	to {
		transform: translateX(-50%) rotate(360deg) translateX(50px) rotate(-360deg);
	}
}

@keyframes elongate {
	from {
		transform: translateX(100px);
	}

	to {
		transform: translateX(-100px);
	}
}

model-viewer > #ar-prompt {
	position: absolute;
	left: 50%;
	bottom: 60px;
	animation: elongate 2s infinite ease-in-out alternate;
	display: none;
}

model-viewer[ar-status="session-started"] > #ar-prompt {
	display: block;
}

model-viewer > #ar-prompt > img {
	animation: circle 4s linear infinite;
}

/*-------------------End 3D Page------------------*/
/*------------------------------------------------*/

/*-------------------Start Services on Main------------------*/
/*-----------------------------------------------------------*/

.servsContainer {
	text-align: center;
	margin-bottom: 12px;
}

.servs {
	font-family: 'nasalization', sans-serif;
	color: rgba(255,143,0,80%);
	border-bottom: 1px ridge #c7c7c7;
	padding: 8px;
	padding-left: 12px;
	padding-right: 12px;
	border-radius: 20% / 30% 30% 84px 84px;
	box-shadow: 0px 6px 12px -8px #ffffff;
	letter-spacing: 6px;
	font-size: 14px;
	text-transform: uppercase;
}

.servsINV {
	font-family: 'nasalization', sans-serif;
	color: rgba(255,143,0,80%);
	border-top: 1px ridge #c7c7c7;
	padding: 8px;
	padding-left: 12px;
	padding-right: 12px;
	padding-bottom: 12px;
	padding-top: 4px;
	border-radius: 20% / 84px 84px 30% 30%;
	box-shadow: 0px -6px 12px -8px #ffffff;
	letter-spacing: 6px;
	font-size: 14px;
	text-transform: uppercase;
}
.serviceContainerOuter {
	width: 90%;
	margin: 0 auto;
	background: rgb(0,0,0);
	background: radial-gradient(circle, rgba(67,111,243,0.1) 0%, rgba(9,9,121,0.1) 42%, rgba(0,0,0,0.1) 100%);
}
.serviceContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	align-items: center;
	width: 90%;
	/*width: 100%;*/
	text-align: center;
	margin: 40px auto;
}
.SCinnerContainer {
	display: inline-flex;
	margin: auto;
	min-width: 6%;
	text-align: center;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-around;
	align-items: center;
}
.SCinnerContainerTools {
	padding: 12px;
}
.SCimg {
	height: 100%;
	text-align: center;
}
	.SCimg img {
		max-width: 100%;
		width: 304px;
		height: 171px;
		border-radius: 24% 24%;
		position: relative;
		object-fit: cover;
		box-shadow: 0 0 1px 1px #000000, 0 0 8px 1px var(--main_button_orange_color);
		transition: border-radius 0.2s cubic-bezier(.31,.01,.51,.99);
	}
	.SCimg:hover img {
		border-radius: 8px;
		box-shadow: 0 0 1px 1px #000000, 0 0 8px 1px var(--main_button_orange_color);
		/*box-shadow: 0 0 1px 4px #000000, 0 0 18px 1px var(--main_button_green_color);*/
		animation: rgbRotate 10s Ease-in-out infinite;
	}

.SCimgTools img {
	width: 304px;
	height: 304px;
	/*aspect-ratio: 1 / 1;*/
	box-shadow: 0 0 1px 1px #000000, 0 0 8px 1px var(--main_border_blue_color);
}
@keyframes SCimgFrame {
	0% {
		border-radius: 24% 24%;
		box-shadow: 0 0 1px 1px #000000, 0 0 8px 1px rgba(255,143,0,100%);
	}

	100% {
		border-radius: 8px;
		box-shadow: 0 0 1px 4px #000000, 0 0 18px 1px var(--main_button_green_color);
	}
}
/*.SCslides {
	background-image: url("Photography/photos/People/Weddings/photo_16.jpg");
}*/
.SCDescrContainer {
	margin: auto;
	text-align: center;
}
.SCDescr {
	font-family: 'Audiowide', cursive;
	/*font-family: 'Roboto Mono', monospace;*/
	font-weight: 400;
	font-size: 18px;
	text-align: left;
	margin: 0;
	/*padding-left: 24px;*/
}

.SCinContMargin {
	margin-bottom: 0;
}
.SCvertLine {
	border-left: 1px solid #000000;
	border-radius: 5px;
	box-shadow: 0 0 1px #ffffff, 0 0 10px #969696, 0 0 15px #ffffff;
	transform: rotate(90deg);
	width: 112px;
	margin: 0;
}

/*-------------------End Services on Main------------------*/
/*---------------------------------------------------------*/

/*-------------------Start Would You Rather------------------*/
/*-----------------------------------------------------------*/

.generalTitle {
	text-align: center;
	word-wrap: break-word;
	width: 90%;
	line-height: 2;
	text-decoration: none;
	font-size: 28px;
	color: var(--main_genTitle_color);
	font-family: 'Audiowide', cursive;
	font-style: normal;
	font-weight: 300;
	display: block;
	padding-top: 18px;
	padding-bottom: 18px;
	margin: auto;
}

.orTitle {
	text-align: center;
	word-wrap: break-word;
	width: auto;
	line-height: 2;
	text-decoration: none;
	font-size: 18px;
	color: var(--main_genTitle_color);
	font-family: 'Audiowide', cursive;
	font-style: normal;
	font-weight: 200;
	display: block;
	margin-left: 18%;
	margin-right: 18%;
}

.ansContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	align-items: center;
}

.wurButton {
	width: auto;
	margin: 0;
	padding: 24px;
}

.wurButtonBut {
	text-align: center;
	/*font-family: 'Audiowide', cursive;*/
	font-family: 'Roboto Mono', monospace;
	cursor: pointer;
	transition: .3s all ease-in;
	color: var(--main_genTitle_color);
	font-size: 22px;
	padding: 10px;
	padding-left: 14px;
	padding-right: 14px;
	margin: 4px 1px;
	text-decoration: none;
	border: solid 2px rgba(67,111,243,30%);
	background-color: rgba(67,111,243,15%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}
	.wurButtonBut:hover {
		color: #00bb17;
		border: solid 2px rgba(0,187,23,70%);
		transition: .15s all ease-in;
		border-radius: 25% / 10%;
	}

	.wurButtonBut:active {
		/*color: #ffa407;*/
		color: var(--main_genTitle_color);
		/*border: solid 2px rgba(255,164,7,70%);*/
		border: solid 2px rgba(67,111,243,30%);
		transition: .15s all ease-in;
		/*border-radius: 50% / 15%;*/
		border-radius: 4%;
	}

.mobileView {
	display: none;
}

.titleColor {
	color: var(--main_text_blue_color);
}

/*-------------------End Would You Rather------------------*/
/*---------------------------------------------------------*/

/*-------------------Start Wrong Calculator------------------*/
/*-----------------------------------------------------------*/

.calcDiv {
	display: table;
	margin: 2em auto 3em;
}

#calculatorw {
	border: 1px solid black;
	margin-left: auto;
	margin-right: auto;
}

.calcButtons {
	width: 100%;
	padding: 20px 40px;
	font-size: 24px;
	/*font-weight: bold;*/
	text-align: center;
	font-family: 'Audiowide', cursive;
	cursor: pointer;
	transition: .3s all ease-in;
	color: var(--main_text_blue_color);
	text-decoration: none;
	border: solid 2px rgba(67,111,243,30%);
	background-color: rgba(67,111,243,15%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
}

#equalSign {
	color: #ffa407;
}

#cButton {
	color: var(--main_button_green_color);
}

#bButton {
	color: var(--main_subText_color);
}

.calcButtons:hover, #equalSign:hover, #cButton:hover, #bButton:hover {
	color: #ffa407;
	border: solid 2px rgba(255,164,7,70%);
	transition: .15s all ease-in;
	border-radius: 25% / 10%;
}

.calcButtons:active, #equalSign:active, #cButton:active, #bButton:active {
	color: #00bb17;
	border: solid 2px rgba(0,187,23,70%);
	transition: .15s all ease-in;
	border-radius: 50% / 15%;
}

.calcOutputText {
	padding: 20px 30px;
	font-size: 24px;
	font-family: 'Audiowide', cursive;
	font-weight: bold;
	text-align: right;
	color: var(--main_headerText_color);
	border: none;
	border: solid 2px rgba(67,111,243,30%);
	background-color: rgba(67,111,243,15%);
	border-radius: 4%;
	box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-box-shadow: 0px 0px 6px 2px #436ff3;
	-webkit-appearance: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	overflow: hidden;
}

.titleUnderline {
	border-bottom: solid 1px var(--main_subText_color);
}

/*-------------------End Wrong Calculator------------------*/
/*---------------------------------------------------------*/
@media (hover:hover) {
	#myBtn:hover {
		color: #383838;
		background-color: rgba(215,215,215);
	}
}

@media screen and (min-width: 2000px) {
	main {
		margin-top: 20px;
		/*margin-bottom: 40px;*/
	}
	.mainGrid {
		padding-bottom: 40px;
	}
	.imgLogoStyle {
		/*width: 45%;*/
	}
/*	.modalPhoto {
		width: 80vw;
	}
	.modalPhotoContent {
		max-height: 80%;
	}*/
	.imgLogo {
		width: 14%;
	}
	.socialProps img {
		width: 24%;
	}
	.closeBtnPort {
		/*width: 5%;*/
		left: 47.5%;
	}
/*	.SCinnerContainer {
		min-width: 4%;
	}*/
}
@media screen and (max-width: 1999px) {
	.closeBtnPort {
		/*width: 5%;*/
		left: 47.5%;
	}
	.SCimg img {
		width: 304px;
		height: 171px;
	}
	.SCimgTools img {
		width: 304px;
		height: 304px;
	}
}
@media screen and (max-width: 1630px) {
	.SCvertLine {
		transform: rotate(90deg);
		width: 112px;
		margin: 0;
	}
	.SCimg img {
		width: 208px;
		height: 117px;
	}
	.SCimgTools img {
		width: 208px;
		height: 208px;
	}
	.SCinnerContainer {
		min-width: 8%;
	}
}
	
@media screen and (max-width: 1600px) {
	.tocListPort li {
		line-height: 1.25;
	}
	.closeBtnPort {
		/*width: 10%;*/
		left: 45%;
	}
}
@media screen and (min-width: 1500px) {
	.dateContainer {
		margin-bottom: 42px;
	}
	.sContainer ul {
		font-size: 28px;
	}
	.aboutC {
		width: 100%;
		margin: auto;
	}
	.aboutCPhoto {
		margin-top: 42px;
		margin-bottom: 42px;
	}
	.aboutCPhotoText {
		font-size: 20px;
	}
	#photoTextCapt {
		width: 25%;
	}
	model-viewer {
		width: 50%;
	}
}
@media screen and (max-width: 1499px) {
	.dateContainer {
		margin-bottom: 24px;
	}
	.softImgContainer {
		/*padding-top: 12px;*/
	}
}
@media screen and (max-width: 1450px) {
	.SCvertLine {
		width: 4em;
	}
	.SCinnerContainerTools {
		display: inline;
		text-align: center;
	}
	.SCDescrTools {
		text-align: center;
	}
}
@media screen and (min-width: 1351px) {
	main {
		margin-top: 40px;
		/*margin-bottom: 40px;*/
	}
	.mainGrid {
		padding-bottom: 40px;
	}
	#photoTextCapt {
		width: 50%;
	}
	.menuIcon {
		width: 53px;
	}
	#consentContainer {
		width: 50%;
	}
	.SCinnerContainer {
		display: inline-block;
	}
}

@media screen and (max-width: 1350px) {
	main {
		margin-top: 20px;
		/*margin-bottom: 20px;*/
	}
	.mainGrid {
		padding-bottom: 20px;
	}
	.headerTxt {
		font-size: 28px;
	}
	.photoTextDescr {
		width: 90%;
	}
	.containerGrid img, .containerGrid video {
		height: 170px;
	}
	.mainPhoto img, .mainPhoto video {
		height: 190px;
	}
	.captionContainer span {
		font-size: 22px;
	}
	.imgLogoStyle {
		/*width: 60%;*/
	}
	.lineBox {
		width: 70%;
	}
	.imgWel {
		width: 60%;
	}
	.roundOrange1 {
		transform: translate(-25%, 0);
	}
	.roundGreen2 {
		transform: translate(-25%, 0);
	}
	.titles {
		padding-top: 20px;
		font-size: 34px;
	}
	.SCvertLine {
		transform: rotate(0deg);
		width: 60%;
		margin: 42px;
	}
    .SCinnerContainer {
        min-width: 15%;
    }
/*	.SCimg img {
		width: 304px;
		height: 171px;
	}*/
}

@media screen and (min-width: 1200px) {
	nav {
		padding-top: 4px;
		padding-bottom: 4px;
	}
	.headIMGContainer {
		/*margin-left: 12vw;*/
	}
}
@media screen and (max-width: 1200px) {
	nav {
		width: 90%;
		padding-top: 2px;
		padding-bottom: 2px;
	}
	main {
		margin-top: 10px;
		/*margin-bottom: 10px;*/
	}
	.mainGrid {
		padding-bottom: 10px;
	}
	.dateContainer {
		margin-bottom: 12px;
	}
	.container {
		width: 33%;
		margin: auto;
		margin-top: 20px;
		margin-bottom: 20px;
		padding: 5px;
	}
	.captionContainer span {
		font-size: 18px;
	}
	.softImgContainer {
		/*padding-top: 24px;*/
	}	
	.softImgContainer img {
		/*width: 40%;*/
		margin-top: 24px;
	}
	.socialBar {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.socialProps img {
		width: 24%;
	}
	.imgLogoStyle {
		/*width: 75%;*/
	}
	.text {
		padding: 5px;
	}
	.aboutC {
		width: 95%;
		margin-left: auto;
		margin-right: auto;
		text-align: justify;
		/*font-size: 32px;*/
	}
	.resumeStatsHeader {
		font-size: 28px;
	}
	.resumeStatsList {
		line-height: 1.25;
	}
	/*.formatting {
		text-align: justify;
	}*/
	.pageButton {
		width: auto;
		margin-top: 10px;
		margin-bottom: 10px;
	}
	.pageButtonColor, .pageButtonColorSkew {
		transform: skew(0);
		margin: 4px 1px;
		font-size: 20px;
		padding-left: 10px;
		padding-right: 10px;
	}
/*	.noPaddingTB {
		padding-top: 5px;
		padding-bottom: 5px;
	}*/
	.menuIcon {
		width: 49px;
	}
	.rDownloads {
		margin-bottom: 16px;
	}
	.rLink {
		width: 25%;
	}
	.pText, .pTextH {
		font-size: 18px;
		width: 90%;
	}
	.lg-view {
		display:none;
	}
	.titleIT {
		font-size: 28px;
	}
	.descrTitleIT{
		font-size: 22px;
	}
	.descrIT{
		font-size: 18px;
	}
	.ul4 {
		font-size: 22px;
	}
	.ulSMap {
		/*width: 90%;*/
		font-size: 22px;
	}
	.textSMap {
		width: 90%;
		font-size: 22px;
	}
	.text4 {
		font-size: 22px;
	}
	.closeWel {
		margin-bottom: 36px;
	}
	#myBtn {
		background-color: rgba(56,56,56,75%);
	}
	.imgLogo {
		width: 24%;
		margin: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
	.tocPort {
		font-size: 18px;
	}
	.tocListPort {
		display: grid;
		justify-content: center;
	}
	.closeBtnPort {
		/*width: 15%;*/
		left: 42.5%;
	}
	.topDescPort, .secDescPort {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.SCvertLine {
		transform: rotate(0deg);
		width: 60%;
		margin: 42px;
	}
/*	.SCimg img {
		width: 304px;
		height: 171px;
	}*/
	.headIMGContainer {
		/*margin-left: auto;*/
	}
}

@media screen and (max-width: 1130px) {
	.pageButtonColor, .pageButtonColorSkew {
		margin: 4px 1px;
		font-size: 18px;
		padding: 8px;
		/*padding-left: 10px;*/
		/*padding-right: 10px;*/
	}
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 48px;
	}
}

@media screen and (max-width: 1020px) {
	.pageButtonColor, .pageButtonColorSkew {
		margin: 4px 1px;
		font-size: 22px;
		padding: 8px;
		padding-left: 10px;
		padding-right: 10px;
	}
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 55px;
	}
	.SCinnerContainer {
		min-width: 20%;
	}
	.headIMGContainer {
		/*width: 90%;*/
		margin-left: auto;
		margin-right: auto;
	}
}

@media screen and (max-width: 950px) {
	.pageButtonColor, .pageButtonColorSkew {
		margin: 2px 1px;
		font-size: 22px;
		padding: 8px;
		/*padding-left: 14px;*/
		/*padding-right: 14px;*/
	}
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 55px;
	}
	.topCloseButton {
		display: block;
	}
}

@media screen and (max-width: 900px) {
	nav {
		width: 100%;
	}
	.headContainer {
		flex-wrap: wrap;
	}
	.AheadIMGContainer {
		flex-wrap: wrap;
	}
	.headerTxt {
		font-size: 24px;
	}
	.pageButtonColor, .pageButtonColorSkew {
		margin: 2px 1px;
		font-size: 16px;
		padding: 8px;
		/*padding-left: 14px;*/
		/*padding-right: 14px;*/
	}
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 45px;
	}
	.lineBox {
		width: 80%;
	}
	.captionContainer span {
		font-size: 22px;
	}
	.pageButtonTxt {
		transform: skew(0);
	}
	.descrIT{
		margin-left: 5%;
	}
	.modalPort-content {
		width: 100%;
	}
	.titles {
		font-size: 28px;
	}
}
@media screen and (max-width: 830px) {
	nav {
		width: 90%;
	}
	.pageButtonColor, .pageButtonColorSkew {
		margin: 4px 1px;
		font-size: 18px;
		padding: 8px;
/*		padding-left: 14px;
		padding-right: 14px;*/
	}
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 48px;
	}
}
@media screen and (max-width: 800px) {
	nav {
		width: 90%;
	}
	.container {
		width: 75%;
		margin: auto;
		margin-top: 20px;
		margin-bottom: 20px;
		padding: 5px;
	}
	.dropdown-content {
		/*transform: translateX(-24px);*/
	}

	.mainMobileView {
		display: inline-block;
	}

	.mainDesktopView {
		display: none;
	}

	.lineBox {
	 width: 80%;
	}
	.img5 {
		height: 175px;
		padding: 8px;
	}
/*	.modalPhoto {
		width: 80vw;
	}*/
	.busCard {
		width: 500px;
	}
	.SCvertLine {
		transform: rotate(0deg);
		width: 80%;
		margin: 42px;
	}
	.softImgContainer img {
		width: 80%;
		margin-top: 28px;
	}

	.softImgHide {
		display: none;
	}
}
@media screen and (max-width: 775px) {
	.headerBorder span {
		padding-left: 2em;
		font-size: 18px;
	}
	.SCDescr {
		font-size: 16px;
	}
	#photoTextCapt {
		width: 90%;
	}
	#photoTextCapt span {
		box-shadow: 0 0 2px 4px #000000, 0 0 0 0 #436ff3;
		-webkit-box-shadow: 0 0 2px 4px #000000, 0 0 0 0 #436ff3;
		line-height: 3;
	}
}
@media screen and (min-width: 701px) {
	#mobileMenu {
		display: none;
	}

	.fullMenu {
		display: block;
	}
}
@media screen and (max-width: 700px) {
	nav {
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}
	.buttonNav {
		width: 90%;
		margin: 2px;
		margin-left: auto;
		margin-right: auto;
	}
	#mobileMenu {
		display: block;
	}
	.fullMenu {
		display: none;
	}
	.socialProps img {
		width: 38%;
	}
	.dropdown-content {
		/*transform: translateX(-12px);*/
	}
	.dropdown:hover .dropdown-content {
		flex-wrap: wrap;
	}
	.hamS {
		font-size: 14px;
	}
	.pageButtonColor, .pageButtonColorSkew {
		width: auto;
		left: 50vw;
		padding-left: 18px;
		padding-right: 18px;
	}
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 48px;
	}
	.aButton {
		margin-left: 1px;
		margin-right: 1px;
	}
	.video-container video {
		height: 200px;
	}
	.landPageBtn {
		font-size: 42px;
	}
	#landHeadText {
		font-size: 24px;
		overflow-x: visible;
	}
	#tMute {
		font-size: 28px;
		/*color: var(--main_text_blue_color);*/
		/*color: rgba(140, 106, 6, 1);*/
		/*text-shadow: 1px 0 4px #ffffff;*/
		/*text-shadow: 1px 0 4px #000000;*/
		/*filter: invert();*/
	}
	.imgLogoStyle {
		/*width: 100%;*/
	}
	.greeting {
		font-size: 20px;
	}
	.aboutC {
		/*font-size: 32px;*/
		/*text-align: justify;*/
		width: 94%;
		margin-left: auto;
		margin-right: auto;
	}
	.aboutCText {
		text-align: left;
		width: 96%;
		margin: auto;
	}
	.resumeStats {
		line-height: 1.25;
		margin-left: 2%;
		margin-right: 2%;
	}
	.resumeStatsHeader {
		font-size: 28px;
	}
	.resumeStatsList {
		line-height: 1.25;
	}
	/*.formatting {
		text-align: left;
	}*/
	.rDownloads {
		margin-bottom: 16px;
		width: 100%;
	}
	.rLink {
		width: 30%;
	}
	.letterContainer{
		width: 90%;
		margin: auto;
	}
	#textbox1, #textbox2, #textbox3, #textbox4, #textbox5 {
		height: 32px;
		width: 6%;
		font-size: 28px;
	}
	#textbox6, #textbox7 {
		width: 184px;
		height: 32px;
		font-size: 28px;
	}
	#submit, #reset {
		font-size: 18px;
		margin: 8px;
		margin-top: 16px;
		margin-bottom: 16px;
	}
	#output {
		font-size: 22px;
		text-align: justify;
	}
	.paraTextFull {
		width: 100%;
	}
	.paraTextPara {
		font-size: 18px;
	}
/*	 .modalPhoto {
		left: 48.5%;
	}*/
	#photoText {
		font-size: 14px;
		/*transform: translate(4%, 1%);*/
		box-shadow: 0 0 1px 4px #000000;
		-webkit-box-shadow: 0 -24px 24px 24px #000000;
	}
	#closeButton {
		transform: translate(4%, 1%);
	}
	.softPhoto {
		width: 60vw;
		height: 30vh;
	}
	#myBtn {
		background-color: rgba(56,56,56,90%);
		border-radius: 0 80% 80% 0;
		padding-left: 8px;
		padding-right: 16px;
		padding-top: 0;
		padding-bottom: 0;
		font-size: 42px;
		bottom: 10%;
		left: 0;
		right: revert;
	}
	.imgLogo {
		width: 42%;
		margin: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
	.xlarge-font {
		font-size: 32px;
	}
	img.modalPort-content {
		width: 90%;
	}
	#bodyTextPort {
		width: 90%;
	}
	.closeBtnPort {
		/*width: 20%;*/
		left: 40%;
	}
	.videoPort {
		height: 200px;
	}
	.arrow {
		padding-top: 24px;
		color: var(--main_border_blue_color);
		text-shadow: #ffffff 0 2px 4px;
	}
	.arrow:hover {
		text-shadow: var(--main_border_blue_color) 0 2px 4px;
	}
	.SCDescr {
		text-align: center;
	}
	.SCinnerContainer {
		min-width: 20%;
	}
}

@media screen and (max-width: 600px) {
	nav {
		padding-top: 0px;
		padding-bottom: 0px;
	}
	.buttonNav {
		padding-top: 0px;
		padding-bottom: 0px;
	}
	.container {
		width: 94%;
		margin: auto;
		margin-top: 20px;
		margin-bottom: 20px;
		padding: 5px;
	}
	.socialBar {
		padding-top: 5px;
		padding-bottom: 5px;
	}
	.dateContainer {
		margin-bottom: 8px;
	}
	.letterContainer{
		width: 100%;
		margin: 0;
	}
	#textbox1, #textbox2, #textbox3, #textbox4, #textbox5 {
		/*height: 42px;
		width: 42px;
		font-size: 38px;*/
		height: 24px;
		width: 4%;
		font-size: 20px;
		margin: 8px;
	}
	 #textbox6, #textbox7 {
		 width: 70%;
		 height: 24px;
		 font-size: 20px;
	 }
	 .containerGrid img, .containerGrid video {
			 height: auto;
			 width: 80%;
	 }
	#photoText {
		margin: 0;
	}
	 .modalPhotoContent {
		 	box-shadow: none;
		  -webkit-box-shadow: none;
		  -webkit-appearance: none;
	 }
	 .photoTextDescr, #photoTextCapt {
	 		font-size: 17px;
	 }
	 .ul4 {
	 		font-size: 22px;
	 }
	 .ulSMap {
	 		font-size: 22px;
	 }
	 .text4 {
	 	font-size: 22px;
	 	width: 90%;
		margin: auto;
		padding: 0;
	 }
	 .textSMap {
	 	font-size: 22px;
	 	width: 90%;
		margin: auto;
		padding: 0;
	 }
	 .imgWel {
		 width: 80%;
	 }
	 .roundGreen1 {
	 	box-shadow: 0 0 2px 6px #000000,
	 							0 0 22px 18px #00bb17,
	 							0 0 42px 18px #006600;
	 }
	 .roundOrange1 {
	 	box-shadow: 0 0 2px 6px #000000,
	 							0 0 22px 12px #ffa407,
	 							0 0 42px 18px #c98002;
	 }
	 .roundGreen2 {
	 	box-shadow: 0 0 2px 6px #000000,
	 							0 0 22px 18px #00bb17,
	 							0 0 42px 18px #006600;
	 }
	 .roundOrange2 {
	 	box-shadow: 0 0 2px 6px #000000,
	 							0 0 22px 12px #ffa407,
	 							0 0 42px 18px #c98002;
	 }
	 .pageButtonColor,
	 .pageButtonColorSkew {
		 margin: 4px 1px;
		 font-size: 18px;
		 padding: 8px;
	 }
	.noPaddingTB {
		padding-top: 2px;
		padding-bottom: 2px;
	}
	.menuIcon {
		width: 48px;
	}
	 .descrIT{
		 margin-left: 0;
		 margin-right: 0;
	 }
	.busCard {
		width: 400px;
	}
	.sContainer {
		width: 92%;
	}
	.softPhoto {
		width: 50vw;
		height: 25vh;
	}
	model-viewer {
		width: 100%;
	}
	.SCDescr {
		text-align: center;
	}
	.SCinContMargin {
		margin-bottom: 24px;
	}
	.mobileView {
		display: block;
	}
}
@media screen and (max-width: 500px) {
	main {
		margin-top: 40px;
		/*margin-bottom: 40px;*/
	}
	.mainGrid {
		padding-bottom: 20px;
	}
	.headerTxt {
		font-size: 18px;
		margin-bottom: 24px;
	}
	.headerBorder {
		width: 100%;
	}
	#date {
		letter-spacing: 2px;
		font-size: 12px;
	}	
	#dateInverse {
		letter-spacing: 2px;
		font-size: 12px;
	}
	.dropdown-content {
		/*transform: translateX(0px);*/
	}
	#textbox1, #textbox2, #textbox3, #textbox4, #textbox5 {
		height: 42px;
		width: 14%;
		font-size: 20px;
		margin: 3px;
		margin-bottom: 12px;
		padding: 0;
	}
	 #textbox6, #textbox7 {
		 width: 84%;
		 height: 24px;
		 font-size: 20px;
		 padding: 12px;
	 }
	.containerGrid img, .containerGrid video {
		height: auto;
		width: 90%;
		margin-left: 4px;
		margin-right: 4px;
		margin-top: 4px;
		margin-bottom: 4px;
		padding: 8px;
	}
	.photoTextCaptCosplay {
		overflow-y: scroll;
		z-index: 1001;
		background-color: rgba(0, 0, 0, 0.5);
	}
	.paraTextFull {
		width: 100%;
	}
	.lineBox {
	 width: 70%;
	}
	.ulSMap {
		padding: 0;
	}
	.tab1 {
		padding-left: 2.5%;
	}
	.tab2 {
		padding-left: 5%;
	}
	.tab3 {
		padding-left: 7.5%;
	}
	.img5 {
		height: 150px;
		margin-left: auto;
		margin-right: auto;
		padding: 8px;
	}
	.tocPort {
		font-size: 16px;
	}
	.topDescPort {
		font-size: 18px;
	}
	#controlPanelContainer {
		border: solid 1px var(--main_headerText_color);
		width: auto;
		padding: 0;
		padding-top: 8px;
		padding-bottom: 8px;
	}
	#textInfoContainter {
		border: solid 1px var(--main_headerText_color);
		width: auto;
		padding: 0;
		padding-top: 8px;
		padding-bottom: 8px;
	}
	.wurButtonBut:hover {
		color: var(--main_genTitle_color);
		border: solid 2px rgba(67,111,243,30%);
		transition: .15s all ease-in;
		border-radius: 4%;
	}
	.calcButtons {
		padding: 1em;
		font-size: 18px;
	}
	.calcOutputText {
		padding: 1em 5px 1em 2px;
	}
	.serviceContainer {
		/*width: 40%;*/
		-ms-flex-direction: column;
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	.SCinnerContainer {
		/*min-width: 0%;*/
	}
}
@media screen and (max-width: 400px) {
	main {
		margin-top: 0px;
		/*margin-bottom: 10px;*/
	}
	.mainGrid {
		padding-bottom: 10px;
	}
/*	.modalPhoto {
		left: 47%;
		width: 84vw;
	}*/
	.modalPhotoContent {
		box-shadow: none;
		-webkit-box-shadow: none;
		-webkit-appearance: none;
	}
	#photoText {
		 /*left: 47%;*/
		 /*transform: translate(4%, 1%);*/
		 box-shadow: 0 0 1px 4px #000000;
		 -webkit-box-shadow: 0 -24px 24px 24px #000000;
	}
	#photoTextCapt {
		 /*font-size: 14px;*/
		 /*transform: translate(4%, 1%);*/
	}
	#photoTextCapt span {
		 /*box-shadow: 0 10px 18px 18px #000000;*/
		 /*-webkit-box-shadow: 0 10px 18px 18px #000000;*/
	}
	#closeButton {
		/*transform: translate(4%, 1%);*/
		width: 100%;
	}
	.photoTextCaptCosplay {
		top: 80%;
	}
	.text4 {
		width: 98%;
	}
	.textSMap {
		width: 98%;
	}
	.lineBox {
		width: 75%;
	}
	.roundTop {
		top: 25%;
	}
	.roundBottom {
		top: 65%;
	}
	.roundGreen1 {
		box-shadow: 0 0 2px 6px #000000,
								0 0 12px 8px #00bb17,
								0 0 18px 12px #006600;
	}
	.roundOrange1 {
		box-shadow: 0 0 2px 6px #000000,
								0 0 12px 8px #ffa407,
								0 0 18px 12px #c98002;
	}
	.roundGreen2 {
		box-shadow: 0 0 2px 6px #000000,
								0 0 12px 8px #00bb17,
								0 0 18px 12px #006600;
	}
	.roundOrange2 {
		box-shadow: 0 0 2px 6px #000000,
								0 0 12px 8px #ffa407,
								0 0 18px 12px #c98002;
	}
	.pageButtonColor,
	.pageButtonColorSkew {
		margin: 4px 1px;
	}
	.pageButtonTxt {
		font-size: 14px;
	}
	.busCard {
		width: 250px;
	}
	.sContainer {
		width: 95%;
	}
	.softPhoto {
		width: 100%;
		height: 100%;
		margin: 0;
	}
	.imgLogo {
		width: 90%;
	}
	.closeBtnPort {
		/*width: 90%;*/
		left: 5%;
	}
/*	.serviceContainer {
		width: 55%;
	}*/
}

/*@media screen and (max-width: 300px) {
	.serviceContainer {
		width: 80%;
	}
}*/

.displayNone {
	display: none;
}

.displayBlock {
	display: block;
}