html, body { float: left; width: 100%; min-height: 100vh; margin: 0; padding: 0; font: 1em 'Helvetica', 'Arial'; color: #fff; font-weight: 100; text-align: left; scrollbar-color: #333 #000; scrollbar-width: thin; }
a { text-decoration: none; font-size: 1.1em; }
a:hover { text-decoration: underline; }
#themeSelector { float: left; position: absolute; top: 20px; right: 30px; cursor: pointer; z-index: 1000; }
.t1, .t1 .dropdown-toggle, .t1 .dropdown-menu, .t1 .sih, .t1 .sit, .t1 .sig, .t1 .siw, .t1 .letters, .t1 footer, .t1 .formspacer > input, .t1 .formspacer > textarea { background: radial-gradient(circle, rgba(2,40,78,1) 0%, rgba(2,0,36,1) 100%); color: #00aae4; }
.t2, .t2 .dropdown-toggle, .t2 .dropdown-menu, .t2 .sih, .t2 .sit, .t2 .sig, .t2 .siw, .t2 footer, .t2 .formspacer > input, .t2 .formspacer > textarea { background: linear-gradient(315deg, rgb(221,2,3) 0%, rgb(0,127,38) 34.89%, rgb(5,75,249) 66.98%, rgb(114,6,130) 100%); color: #ff0; }
.t3, .t3 .dropdown-toggle, .t3 .dropdown-menu, .t3 .sih, .t3 .sit, .t3 .sig, .t3 .siw, .t3 footer, .t3 .formspacer > input, .t3 .formspacer > textarea { background: linear-gradient(62deg, rgb(21,213,235) 0%, rgb(255,0,191) 100%); color: #fffff0; }
.t4, .t4 .dropdown-toggle, .t4 .dropdown-menu, .t4 .sih, .t4 .sit, .t4 .sig, .t4 .siw, .t4 footer, .t4 .formspacer > input, .t4 .formspacer > textarea { background: radial-gradient(circle, rgb(241,220,11) 0%, rgb(248,180,27) 100%); color: #000; }
.t5, .t5 .dropdown-toggle, .t5 .dropdown-menu, .t5 .sih, .t5 .sit, .t5 .sig, .t5 .siw, .t5 footer, .t5 .formspacer > input, .t5 .formspacer > textarea { background: linear-gradient(132deg, rgb(2,28,122) 0%, rgb(36,83,255) 100%); color: #7fff00; }
.t6, .t6 .dropdown-toggle, .t6 .dropdown-menu, .t6 .sih, .t6 .sit, .t6 .sig, .t6 .siw, .t6 footer, .t6 .formspacer > input, .t6 .formspacer > textarea { background: linear-gradient(132deg, rgb(2,58,40) 0%, rgb(0,36,2) 100%); color: #ffd700; }
.t7, .t7 .dropdown-toggle, .t7 .dropdown-menu, .t7 .sih, .t7 .sit, .t7 .sig, .t7 .siw, .t7 footer, .t7 .formspacer > input, .t7 .formspacer > textarea { background: radial-gradient(circle, rgb(178,40,2) 0%, rgb(136,0,2) 100%); color: #fff; }
.t8, .t8 .dropdown-toggle, .t8 .dropdown-menu, .t8 .sih, .t8 .sit, .t8 .sig, .t8 .siw, .t8 footer, .t8 .formspacer > input, .t8 .formspacer > textarea { background: linear-gradient(132deg, rgb(146,11,126) 0%, rgb(52,29,49) 100%); color: #fff; }
.t9, .t9 .dropdown-toggle, .t9 .dropdown-menu, .t9 .sih, .t9 .sit, .t9 .sig, .t9 .siw, .t9 footer, .t9 .formspacer > input, .t9 .formspacer > textarea { background: radial-gradient(circle, rgb(36,37,38) 0%, rgb(0,0,0) 100%); color: #fff; }
.t10, .t10 .dropdown-toggle, .t10 .dropdown-menu, .t10 .sih, .t10 .sit, .t10 .sig, .t10 .siw, .t10 footer, .t10 .formspacer > input, .t10 .formspacer > textarea { background: #fff; color: #000; }

.t1 a, .t1 .formspacer > label, .t1 .formspacer > label:after, .t1 .formspacer > ::placeholder { color: #00aae4; }
.t2 a, .t2 input, .t2 .belower button, .t2 button[type="submit"], button:hover, .t2 input::placeholder, .t2 .formspacer > label, .t2 .formspacer > label:after, .t2 .formspacer > ::placeholder { color: #ff0; }
.t3 a, .t3 input, .t3 .belower button, .t3 button[type="submit"], button:hover, .t3 input::placeholder, .t3 .formspacer > label, .t3 .formspacer > label:after, .t3 .formspacer > ::placeholder { color: #fffff0; }
.t4 a, .t4 .formspacer > label, .t4 .formspacer > label:after, .t4 .formspacer > ::placeholder { color: #000; }
.t4 a, .t4 input, .t4 .belower button, .t4 button[type="submit"], button:hover, .t4 input::placeholder { color: #000; }
.t5 a, .t5 .formspacer > label, .t5 .formspacer > label:after, .t5 .formspacer > ::placeholder { color: #7fff00; }
.t5 a, .t5 input, .t5 .belower button, .t5 button[type="submit"], button:hover, .t5 input::placeholder { color: #7fff00; }
.t6 a, .t6 .formspacer > label, .t6 .formspacer > label:after, .t6 .formspacer > ::placeholder { color: #ffd700; }
.t6 a, .t6 input, .t6 .belower button, .t6 button[type="submit"], button:hover, .t6 input::placeholder { color: #ffd700; }
.t7 a, .t7 input, .t7 .belower button, .t7 button[type="submit"], button:hover, .t7 input::placeholder, .t7 .formspacer > label, .t7 .formspacer > label:after, .t7 .formspacer > ::placeholder { color: #fff; }
.t8 a, .t8 .formspacer > label, .t8 .formspacer > label:after, .t8 .formspacer > ::placeholder { color: #fff; }
.t9 a, .t9 .formspacer > label, .t9 .formspacer > label:after, .t9 .formspacer > ::placeholder { color: #fff; }
.t10 a, .t10 .formspacer > label, .t10 .formspacer > label:after, .t10 .formspacer > ::placeholder { color: #000; }
.t10 a, .t10 input, .t10 .belower button, .t10 button[type="submit"], button:hover, .t10 input::placeholder { color: #000; }

.t4 .blob svg, .t10 .blob svg { display: none; }
.t4 img.svg, .t10 img.svg { display: block; }

.t4 hr, .t10 hr { box-shadow: 0px 1px 1px #006; }

.t1 .highlighted, ::selection { background: #ddd; color: #005; }
.t2 .highlighted { background: #ddd; color: #005; }
.t3 .highlighted { background: #ddd; color: #005; }
.t4 .highlighted { background: #000; color: #ff0; }
.t5 .highlighted { background: #000; color: #ff0; }
.t6 .highlighted { background: #000; color: #ff0; }
.t7 .highlighted { background: #000; color: #ff0; }
.t8 .highlighted { background: #000; color: #ff0; }
.t9 .highlighted { background: #000; color: #ff0; }
.t10 .highlighted { background: #000; color: #fff; }

.t1 svg { fill: #00aae4; }
.t1 svg:hover { border-bottom: 5px solid #00aae4; }
.t2 svg { fill: #ff0; }
.t2 svg:hover { border-bottom: 5px solid #ff0; }
.t3 svg, .t7 svg, .t8 svg, .t9 svg { fill: #fff; }
.t3 svg:hover, .t7 svg:hover, .t8 svg:hover, .t9 svg:hover { border-bottom: solid 5px #fff; }
.t4 svg, .t10 svg { fill: #000; }
.t4 svg:hover, .t10 svg:hover { border-bottom: 5px solid #000; }
.t5 svg { fill: #7fff00; }
.t5 svg:hover { border-bottom: 5px solid #7fff00; }
.t6 svg { fill: #ffd700; }
.t6 svg:hover { border-bottom: 5px solid #ffd700; }


::-webkit-scrollbar { background: rgb(2,0,36); }
::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 0 rbg(2,0,36); border-radius: 0; }
::-webkit-scrollbar-thumb { background: rgba(2,40,78,0.3); border-radius: 0; -webkit-box-shadow: inset 0 0 0 #000; font-size: 2em; display: inline-block; width: .2em; height: .4em; position: relative; border-radius: 0; z-index: 1; }
.t1::-webkit-scrollbar { background: rgb(2,0,36); }
.t1::-webkit-scrollbar-thumb { background: rgba(2,40,78,0.9); }
.t2::-webkit-scrollbar { background: linear-gradient(180deg, rgb(5,75,249) 0%, rgb(217,4,4) 100%); }
.t2::-webkit-scrollbar-thumb { background: rgba(10,10,10,0.5); }
.t3::-webkit-scrollbar { background: linear-gradient(180deg, rgb(255,0,191) 0%, rgb(150,96,211) 100%); }
.t3::-webkit-scrollbar-thumb { background: rgba(2,40,78,0.4); }
.t4::-webkit-scrollbar { background: rgb(248,180,27); }
.t4::-webkit-scrollbar-thumb { background: rgba(15,10,2,0.3); }
.t5::-webkit-scrollbar { background: linear-gradient(180deg, rgb(17,52,178) 0%, rgb(36,83,255) 100%); }
.t5::-webkit-scrollbar-thumb { background: rgba(9,9,19,0.4); }
.t6::-webkit-scrollbar { background: linear-gradient(180deg, rgb(2,49,24) 0%, rgb(0,36,2) 100%); }
.t6::-webkit-scrollbar-thumb { background: rgba(80,100,80,0.5); }
.t7::-webkit-scrollbar { background: rgb(136,0,2); }
.t7::-webkit-scrollbar-thumb { background: rgba(178,40,2,0.9); }
.t8::-webkit-scrollbar { background: linear-gradient(180deg, rgb(106,19,94) 0%, rgb(52,29,49) 100%); }
.t8::-webkit-scrollbar-thumb { background: rgba(140,100,140,0.4); }
.t9::-webkit-scrollbar { background: rgb(0,0,0); }
.t9::-webkit-scrollbar-thumb { background: rgba(136,137,138,0.3); }
.t10::-webkit-scrollbar { background: rgb(255,255,255); }
.t10::-webkit-scrollbar-thumb { background: rgba(40,40,40,0.3); }

button { width: 30px; height: 30px; padding: 1px; border: none; border-radius: 3px; border: none; }
#mainTheme { background: none; color: #123; border: 3px solid #fff0; cursor: pointer; }
#childThemes button { display: none; margin: 1px 0 0 0; cursor: pointer; }
.selected { border: 3px solid #cccf; }

.dropdown { display: inline-block; }
.dropdown-toggle { margin: 0 3px; padding: 10px; border: 0px solid #0005; border-radius: 10px 10px 0 0; box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2); cursor: pointer; }
.dropdown-menu { display: none; position: absolute; z-index: 1; min-width: 120px; margin: 0 3px; padding: 12px 16px; border-radius: 0 10px 10px 10px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); }
.show { display: block; }
.dropdown-menu label { display: block; margin-bottom: 8px; cursor: pointer; }

input[type=checkbox] { background: #0007; border-radius: 2px; appearance: none; width: 17px; height: 17px; cursor: pointer; position: relative; top: 5px; }
input[type=checkbox]:checked { background: url("data:image/gif;base64,R0lGODlhCwAKAIABAP////3cnSH5BAEKAAEALAAAAAALAAoAAAIUjH+AC73WHIsw0UCjglraO20PNhYAOw==") 3px 3px no-repeat; }
.t4 input[type=checkbox]:checked, .t10 input[type=checkbox]:checked { background: url("data:image/gif;base64,R0lGODlhCwAKAIABAP////3cnSH5BAEKAAEALAAAAAALAAoAAAIUjH+AC73WHIsw0UCjglraO20PNhYAOw==") 3px 3px no-repeat; filter: brightness(0) saturate(100%) hue-rotate(39deg); }


svg { border-bottom: 5px solid #0000; }


.gap { float: left; width: 80%; margin: 0; padding: 10px 10% 10px 10%; text-align: center; }
.gap h3 { margin: 0; padding: 0; }
.title { display: inline-block; margin: 0px 0; paddding: 0; font-size: 1.5em; }
.title a { display: inline-block; margin: 10px; padding: 0 10px; }
.pages { display: inline-block; margin: 0; padding: 0; }
.pages a { display: inline-block; margin: 10px 25px; }

.letters { float: left; width: 80%; margin: 0; padding: 10px 10%; text-align: center; }
.letters hr { margin-top: -2px; }
label { text-align: left; }
.sd { float: left; display: inline-block; width: 100%; margin: 5px 0 0 0; }
.sih, .sit, .sig, .siw { float: left; display: inline-block; width: 23%; height: 360px; margin: 0.5%; padding: 0.5%; border-radius: 5px }
.sih { width: 32%; padding: 0.15%; }
.sit { width: 20%; height: 90px; padding: 2%; }

.gb { float: left; position: relative; display: inline-block; width: 100%; height: 480px; overflow: hidden; }
.graph { float: left; display: inline-block; width: 53%; overflow: hidden; }
.spaced { margin: 50px 0 0 0; }
.graph > p { text-align: center; }
.buy { float: left; display: inline-block; width: 47%; height: 360px; overflow: hidden; }
.buy > label > input { margin: 0 0 0 49%; }
.buy p { text-align: center; }

h1 { float: left; width: 50%; margin: 30px 25% 0 25%; text-align: left; }
.blob { float: left; width: 50%; margin: 0 25% 30px 25%; font-size: 1em; text-align: left; line-height: 1.5em; }
.blob ul { float: left; margin: 0 0 30px 45px; }
.blob li { margin: 15px 0; }
.blob h3 { margin: 50px 0 0 -45px; }
.blob hr { width: 38%; }
.small { font-size: 0.7em; font-weight: 100; }
p.support { float: left; width: 100%; text-align: left; }
.smaller { font-size: 0.6em; clear: both; padding: 20px 0 0 0; text-align: center; }


hr { clear: left; float: left; width: 100%; margin: 14px 0; height: 2px; border: none; border-radius: 50px; background: none; box-shadow: 0px 1px 1px #ddd6; }



footer { position: relative; clear: both; float: left; width: 80%; margin: 0; padding: 0 10%; }

footer a:hover h5 { text-decoration: underline; }

.f { clear: left; float: left; width: 17%; margin: 0 3% 0 0; text-align: center; overflow: hidden; }
.fl { float: left; width: 100%; margin: 4px 0 4px 0; text-align: center; }
.fl h5 { display: inline-block; margin: 3px 7px; }
.fl h5 a { line-height: 1.8em; }
footer h3 { margin: 40px 0 0 0; }
.fp hr, .ft hr,.fs hr,.fc hr { width: 25%; margin: 10px 75% 15px 0; }
.fw hr { width: 15%; margin: 15px 42.5%; }
.fwn { width: 400%; margin: -25px 25% 15px -150%; }

.fp, .ft, .fs, .fc { float: left; width: 15%; margin: 0 0 0 5%; }


footer ul { list-style: none; margin: 0; padding: 0; }
footer li { list-style: none; margin: -10px 0 20px 20px; padding: 0; }
.f h3 { width: 100%; text-align: center; margin: 20px 0 0 0; }

h6 { width: 80%; margin: 0 10%; text-align: justify; line-height: 1.75em; }

a svg { position: relative; display: inline-block; width: 25px; height: auto; margin: 0 0 25px 0; padding: 5px; fill: #ccc; }



.formspacer > label { clear: both; float: left; width: 28%; height: 1.5em; margin: 15px 2% 0 0; background: none; border: none; color: #fff; text-align: right; font-size: 1.4em; line-height: 1.5em; font-weight: 600; }
.formspacer > label:after { content: ' \25b8'; }
.formspacer > label.firstname, formspacer > input#firstname { display: none; }
.formspacer > input, formspacer > textarea { float: left; width: 40.5%; height: 1.5em; margin: 15px 12% 0 0; padding: 0 .5% 0 1%; background: #ccc; border: none; color: #000; text-shadow: 5px 5px 30px #00000080; font-size: 1.4em; line-height: 1.5em; }
.formspacer > textarea { float: left; position: relative; display: inline-block; min-width: 40%; max-width: 40%; min-height: 7.5em; outline: none; border: none; margin: 15px 0 0 0; padding: 5px 1%; font-size: 1.4em; font-family: 'Arial'; }
.formspacer { clear: both; float: left; position: relative; width: 100%; margin: 15px 0 0 0; z-index: 1000; }
.formspacer > input#submit { clear: both; float: left; width: 42%; margin: 0 0 100px 30%; }
.formspacer > ::placeholder { color: #333; opacity: 1; }

@media only screen and (min-width: 100px) and (max-width: 768px) {
	.formspacer > contactsec { width: 94%; margin: 0 3%; }
	.formspacer > .contactsec h3{ font-size: 1.05em; }
	.formspacer > label { width: 100%; margin: 15px 0 0 0; text-align: center; }
	.formspacer > label:after { content: ' \25be'; }
	.formspacer > input, textarea { min-width: 96%; max-width: 96%; margin: 0 2%; padding: 5px 0; text-align: center; }
	.formspacer > input { font-size: 1.2em; }
	.formspacer > .formspacer { margin: 8% 0 5% 0; }
	.formspacer > input#submit { margin: -50px 0 0 2%; padding: 0; }
}

@media only screen and (min-width: 1381px) and (max-width: 1919px) {
	.letters { width: 100%; padding: 10px 0; }
	.sih { height: auto; }
	.graph { width: 100%; height: 360px; }
	.buy { position: absolute; width: 100%; height: 190px; left: 50%; right: 50%; bottom: 0px; transform: translate(-50%, 0%); }
	footer { width: 100%; padding: 0; }
	.f { width: 30%; margin: 0; }
	.fwn { width: 300%; margin: -25px 0 15px -100%; }
	.fp, .ft, .fs, .fc { width: 17.5%; margin: 0; }
}
@media only screen and (min-width: 1025px) and (max-width: 1380px) {
	.sih, .sit, .sig, .siw { width: 31.333%; }
	.sit { padding: 0.5%; }
	.sih { width: 32%; height: auto; }
	.graph { width: 100%; height: 360px; }
	.buy { position: absolute; width: 100%; height: 190px; left: 50%; right: 50%; bottom: 0px; transform: translate(-50%, 0%); }
	footer { width: 100%; padding: 0; }
	.f { width: 35%; margin: 0; }
	.fwn { width: 300%; margin: -25px 0 15px -100%; }
	.fp, .ft, .fs, .fc { width: 20%; margin: 0; }
	h1 { width: 90%; margin: 30px 5% 0 5%; }
	.blob { width: 80%; margin: 0 10% 30px 10%; font-size: 1em; text-align: left; line-height: 1.5em; }
}
@media only screen and (min-width: 769px) and (max-width: 1024px) {
	.letters { width: 100%; padding: 10px 0; }
	.sih, .sit, .sig, .siw { width: 48%; }
	.sit { padding: 0.5%; }
	.sih { padding: 0.5%; height: auto; }
	.graph { width: 100%; height: 360px; }
	.buy { position: absolute; width: 100%; height: 190px; left: 50%; right: 50%; bottom: 0px; transform: translate(-50%, 0%); }
	footer { width: 100%; padding: 0; }
	.f { width: 40%; margin: 0; }
	.fwn { width: 300%; margin: -25px 0 15px -100%; }
	.fp, .ft, .fs, .fc { width: 30%; margin: 0; }
	h1 { width: 90%; margin: 30px 5% 0 5%; }
	.blob { width: 80%; margin: 0 10% 30px 10%; font-size: 1em; text-align: left; line-height: 1.5em; }
	.blob ul { float: left; margin: 0 0 30px -15px; }
	.blob li { margin: 15px 0; }
	.blob h3 { margin: 50px 0 0 0; }
	.blob hr { width: 38%; }
}
@media only screen and (min-width: 100px) and (max-width: 768px) {
	.letters { width: 100%; padding: 10px 0; }
	.sih, .sit, .sig, .siw { width: 98%; }
	.sih { height: auto; padding: 0.5%; }
	.sit { padding: 0.5%; }
	.graph { width: 100%; height: 360px; }
	.buy { position: absolute; width: 100%; height: 197px; left: 50%; right: 50%; bottom: 0px; transform: translate(-50%, 0%); }
	.f { width: 100%; margin: 0; }
	.fwn { width: 300%; margin: -25px 0 15px -100%; }
	.fp, .ft, .fs, .fc { width: 50%; margin: 0; }
	h1 { width: 90%; margin: 30px 5% 0 5%; }
	.blob { width: 90%; margin: 0 5% 30px 5%; font-size: 1em; text-align: left; line-height: 1.5em; }
	.blob ul { float: left; margin: 0 0 30px -15px; }
	.blob li { margin: 15px 0; }
	.blob h3 { margin: 50px 0 0 0; }
	.blob hr { width: 38%; }
}