body, html {
    height: 100%;	
    background-color: rgba(0, 0, 0, 1);
	font-family: 'Montserrat', sans-serif;
	font-size:16px;
	color:white;
	line-height:1.5;
	-webkit-font-smoothing: antialiased;
	scroll-behavior:smooth;
}

.smaller {
	font-family: 'Montserrat', sans-serif;
	font-size:14px;
}

.smaller p {
	margin-left:20px;
}



.top-bg {
 
    top: calc(7vw + 3em);
	width:100%
    background-color: rgba(0, 0, 0, 1);
	position:relative;

}

.dt {
	overflow: hidden;
	text-overflow:clip;
	display:inline-block;
	text-align:left;
}
.ndt{
	overflow:hidden;
	text-overflow:clip;
	display:inline-block;
	text-align:left;
}

h1 {
	color:white;
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	font-weight:300;
	font-size: 40px; 
}
h2 {
	color:white;
	font-family: 'Montserrat', sans-serif;
	font-weight:bold;
	font-size: 20px; 
	margin:0.2em;
}
h3 {
	color:white;
	font-family: 'Montserrat', sans-serif;
	font-weight:bold;
	font-size: 18px; 
	margin:0.2em;
}

a h2:hover{
	color: #26ffed;
}

a:link {
	text-decoration: none; color: #FFFFFF;
}
a:visited {
	text-decoration: none; color: #FFFFFF;
}
a:hover {
	text-decoration: none; color: #26ffed;
}
a:active {
	text-decoration: none; color: #26ffed;
}



.header-title-builtin {
	color:white;
	display:inline-block;
	float:right;
	padding-right:2em;
	padding-top:1em;
	bottom:0px;
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	/*font-weight:700;*/
	font-size: 19px; 
	z-index:1002;
}
.header-title-builtin:hover{
	color: #26ffed;
	cursor:pointer;
}

.header-title {
	color:white !important;
	display:inline-block;
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	/*font-weight:700;*/
	font-size: 19px; 
	z-index:1002;
}
.header-title:hover{
	color: #26ffed !important;
	cursor:pointer;
}

.hamburger{
	display:none;
	position:fixed;
	top:0;
	right:0;
	height:2em;
}
.nothamburger{
	display:inline-block;
}

.header-bg {
	position: fixed;
	top:0px;
	right:0px;
	font-size:19px;
	border-width: 0px 0px 2px 0px;
	border-style:solid;
	border-color: #26ffed;
	width:100%;
	display:inline-block;
	background-color:black;
	height:3em;
	z-index:999;
}
.dropdown-content {
	right:0;
	top:2.5em;
	display: none;
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	/*font-weight:700;*/
	font-size: 19px; 
	color:white;
	position: fixed;
	background-color: #292929;
	min-width: 160px;
	box-shadow: 0px 0.5em 1em 0px rgba(0,0,0,0.2);
	z-index: 1003;
}







.dropdown-container {
	
	z-index: 1003 !important;
	
}

.fai {
	padding-right:0.5em;
}

.dropdown-content a {
  color: white;
  padding: 0.75em 1em;
  text-decoration: none;
  display: block;
  border-style:solid;
  border-color:black;
  border-width:1px;
}	

.dropdown-content a:hover {
	background-color: #393939;
	color: #26ffed;
}
#dropdown-container:hover + #dropdown-content{
  display: block;
  z-index: 1003;
}
#dropdown-container:focus + #dropdown-content {
display: block;
  z-index: 1003;
}	
#dropdown-content:hover {
  display: block;
  z-index: 1003;
}
#dropdown-content:focus {
  display: block;
  z-index: 1003;
}
	
	
.title-text1 {
	position:fixed;
	visibility:hidden;
	left: 12vw;
	color:#fcf707;
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	/*font-weight:900;*/
	font-size:7vw;
	z-index:1001;
	display:inline-block;
	white-space: nowrap;
	
	-webkit-text-stroke: 0.02em black;
   	text-shadow:
       0.03em 0.03em 1px #000;
     
}
.title-text2 {
	position:fixed;
	
	visibility:hidden;
	color:#fcf707;
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	/*font-weight:900;*/
	font-size:7vw;
	z-index:1001;
	display:inline-block;
	white-space: nowrap;
	
	-webkit-text-stroke: 0.02em black;
   	text-shadow:
       0.03em 0.03em 1px #000;
}

.maincontent {
	width:80%;
	max-width:1200px;
	border-style:solid;
	border-radius:1em;
	border-color:#353535;
	background-color:#353535;
	margin: auto;
	box-sizing: border-box;
	padding:10px;
}

.nobg {
	border-color:black;
	background-color:black;
}


.sectioncontent {
	width:100%;
	border-style:solid;
	border-radius:1em;
	border-color:#353535;
	background-color:#353535;
	margin: 20px auto;
	box-sizing: border-box;
	padding:10px;
}




hr {
    margin: auto;
    width: 40%;
}

#formview {
	display:block;
	left:0px;
	width:75%;
	max-width: 700px;
}

#formview textarea {
	height:8em;
	margin-bottom:1em;
	width:100%;
}

input {
	margin-bottom: 0.5em;
	width:75%;
}

input, textarea {
	border: 1px solid #292929;
	background: #FFFFFF;
	color: DimGrey;
	padding:1em;
	font-size:16;
	line-height:1.5;
	font-family: 'Montserrat', sans-serif;
}

button {
	font-family: 'Fredoka One', sans-serif;
	font-variant: small-caps;
	/*font-weight:700;*/
	font-size: 16px; 
	color:white;
	background-color: #292929;
	min-width: 160px;
	box-shadow: 0px 0.5em 1em 0px rgba(0,0,0,0.2);
	padding: 0.75em 1em;
	border-style:solid;
	border-color:black;
	border-width:1px;
}

.btnSelect {
	background-color: #393939;
}

.btnUnselect {
	color: #ccc;
}

button:hover {
	background-color: #393939;
	color: #26ffed;
}




.wrapper {
	padding: 5px;
	max-width: 960px;
	width: 95%;
	margin: 20px auto;
}
.rows {
	display:flex;
	flex-flow: row wrap;
	justify-content:center;
	margin: 10px 0;
}

.row{
	flex: 1;
	border: 4px solid #26ffed;
	margin: 10px;
	padding: 10px;
	outline: 2px solid black;
	flex-basis:100%;
	&:first-child { margin-left: 0; }
	&:last-child { margin-right: 0; }
}
.row i {
	float:left;
	margin-right:10px;
	padding:20px 10px; 
	width:100px; 
	height:80px; 
	font-size:80px; 
	text-align:center; 
	color:DimGrey; 
	background-color:LightGray
}
.row img {
	float:left;
	margin-right:10px;
}

.row p {
	display:block;
	vertical-align:top;
	margin-top:0;
	color: #ccc;
}
	

.columns {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin: 5px 0;
}
.column {
	flex: 1;
	border: 4px solid #26ffed;
	margin: 10px;
	padding: 10px;
	outline: 2px solid black;
	&:first-child { margin-left: 0; }
	&:last-child { margin-right: 0; }
}
.column p {
		color: #ccc;
}
	

@media screen and (max-width: 1000px) {
	.hamburger{
		display:inline-block;
	}
	.nothamburger{
		display:none;
	}
	.header-title{
		font-size:19px;
	}
	.header-title-builtin{
		font-size:19px;
	}
	.header-bg{
		font-size:19px;
	}
	.dropdown-content{
		font-size:19px;
	}
}
@media screen and (max-width: 500px) {
	.hamburger{
		display:inline-block;
	}
	.nothamburger{
		display:none;
	}
	.header-title{
		font-size:4vw;
	}
	.header-title-builtin{
		font-size:4vw;
	}
	.header-bg{
		font-size:4vw;
	}
	.dropdown-content{
		font-size:4vw;
	}
	h1 {
		font-size:25px;
	}
	h2 {
		font-size:16px;
	}
	.maincontent {
		width:98%;
	}
	
	body,li {
		font-size:12px;
	}
	p { font-size:12px;}
	
	button { 
		font-size: 12px;
		min-width: 90px;	
	}
}


@media screen and (max-width: 1000px) {
	.columns .column {
		margin-bottom: 10px;
		margin-top: 10px;
		flex-basis: 40%;
	}
	.column:first-child { flex-basis:100%;}
}	

@media screen and (max-width: 700px) {
	.columns .column {
		flex-basis: 100%;
		margin: 0 0 10px 10px;
	}
}