/*********************************************
this file is from
hello for github pages, by sng
custom styles adapted from Twenty by HTML5 Up

https://github.com/saragong/hello/blob/master/css/style.css

Project licensed under MIT
https://github.com/saragong/hello
MIT License

Copyright (c) 2019 Sara Gong

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
**********************************************/


/* Basic */

body,
#skel-layers-wrapper {
	background: #f3f6fa;
}

body.is-loading * {
	-moz-animation: none !important;
	-webkit-animation: none !important;
	-o-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
	-moz-transition: none !important;
	-webkit-transition: none !important;
	-o-transition: none !important;
	-ms-transition: none !important;
	transition: none !important;
}

body,
input,
select,
textarea {
	color: #7c8081;
	font-family: 'Lato', sans-serif;
	font-size: 15pt;
	font-weight: 300;
	letter-spacing: 0.025em;
	line-height: 1.75em;
}

a {
	-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-o-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	color: #7c8081;
	text-decoration: none;
	border-bottom: dotted 1px;
}

a:hover {
	border-bottom-color: transparent;
	color: rgb(79, 166, 209);
}

strong,
b {
	font-weight: 400;
}

p,
ul,
ol,
dl,
table,
blockquote {
	margin: 0 0 2em 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: inherit;
	font-weight: 300;
	line-height: 1.75em;
	margin-bottom: 1em;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: inherit;
	text-decoration: none;
	border: 0;
}

h2 {
	font-size: 3em;
	letter-spacing: 0.1em;
}

h3 {
	font-size: 1.15em;
	letter-spacing: 0.025em;
}

sub {
	font-size: 0.8em;
	position: relative;
	top: 0.5em;
}

sup {
	font-size: 0.8em;
	position: relative;
	top: -0.5em;
}

hr {
	border-top: solid 1px rgba(124, 128, 129, 0.2);
	border: 0;
	margin-bottom: 1.5em;
}

blockquote {
	border-left: solid 0.5em rgba(124, 128, 129, 0.2);
	font-style: italic;
	padding: 1em 0 1em 2em;
}


/* Section/Article */

section.special,
article.special {
	text-align: center;
}

header.major {
	padding-bottom: 2em;
}

header.special {
	margin-bottom: 5em;
	padding-top: 7em;
	position: relative;
	text-align: center;
}

header.special:before,
header.special:after {
	border-bottom: solid 1.5px;
	border-top: solid 1.5px;
	content: '';
	height: 7px;
	opacity: 0.1;
	position: absolute;
	top: 1.75em;
	width: 43%;
}

header.special:before {
	left: 0;
}

header.special:after {
	right: 0;
}

header.special h2 {
	margin-bottom: 0;
}

header.special h2+p {
	margin-bottom: 1em;
	padding-top: 1.5em;
}

header.special .icon {
	cursor: default;
	height: 7em;
	left: 0;
	position: absolute;
	text-align: center;
	top: 1em;
	width: 100%;
}

header.special .icon:before {
	font-size: 3.5em;
	opacity: 0.35;
}

footer> :last-child {
	margin-bottom: 0;
}

footer.major {
	padding-top: 3em;
}


/* Item */

.item {
	padding-top: 15px;
	padding-bottom: 15px;
}

.item h1 {
	font-size: 1.5em;
	letter-spacing: 0.025em;
	margin-bottom: 0em;
	font-weight: bold;
}

.item h2 {
	font-size: 15pt;
	font-weight: 300;
	letter-spacing: 0.025em;
	line-height: 1.75em;
	margin-bottom: 1em;
}

.item p {
	text-align: center;
}

.item section {
	border-bottom: 2px solid gray;
}


/* Image */

.image {
	border: 0;
	position: relative;
}

.image:before {
	content: '';
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.image.fit {
	display: block;
}

.image.fit img {
	display: block;
	width: 100%;
}

.image.featured {
	display: block;
	margin: 0 0 2em 0;
}

.image.featured img {
	display: block;
	width: 100%;
}


/* Icon */

.icon {
	position: relative;
}

.icon:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}

.icon.circle {
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	border: 0;
	border-radius: 100%;
	display: inline-block;
	font-size: 1.25em;
	height: 2.25em;
	left: 0;
	line-height: 2.25em;
	text-align: center;
	text-decoration: none;
	top: 0;
	width: 2.25em;
}

.icon.circle:hover {
	top: -0.2em;
}

.icon.circle.fa-twitter {
	background: #70aecd;
	color: white;
}

.icon.circle.fa-twitter:hover {
	background: #7fb7d2;
}

.icon.circle.fa-linkedin-square {
	background: #0077B5;
	color: white;
}

.icon.circle.fa-linkedin-square:hover {
	background: #288bbf;
}

.icon.circle.fa-facebook {
	background: #7490c3;
	color: white;
}

.icon.circle.fa-facebook:hover {
	background: #829bc9;
}

.icon.circle.fa-google-plus {
	background: #db6b67;
	color: white;
}

.icon.circle.fa-google-plus:hover {
	background: #df7b77;
}

.icon.circle.fa-github {
	background: #dcad8b;
	color: white;
}

.icon.circle.fa-github:hover {
	background: #e1b89b;
}

.icon.circle.fa-dribbble {
	background: #da83ae;
	color: white;
}

.icon.circle.fa-dribbble:hover {
	background: #df93b8;
}

.icon.featured {
	cursor: default;
	display: block;
	margin: 0 0 1.5em 0;
	opacity: 0.35;
	text-align: center;
}

.icon.featured:before {
	font-size: 5em;
	line-height: 1em;
}

.icon>.label {
	display: none;
}


/* List */

ol.default {
	list-style: decimal;
	padding-left: 1.25em;
}

ol.default li {
	padding-left: 0.25em;
}

ul.default {
	list-style: disc;
	padding-left: 1em;
}

ul.default li {
	padding-left: 0.5em;
}

ul.icons {
	cursor: default;
}

ul.icons li {
	display: inline-block;
	line-height: 1em;
	padding-left: 0.5em;
}

ul.icons li:first-child {
	padding-left: 0;
}

ul.featured-icons {
	cursor: default;
	margin: -0.75em 0 0 0;
	opacity: 0.35;
	overflow: hidden;
	position: relative;
}

ul.featured-icons li {
	display: block;
	float: left;
	text-align: center;
	width: 50%;
}

ul.featured-icons li .icon {
	display: inline-block;
	font-size: 6.25em;
	height: 1.25em;
	line-height: 1.25em;
	width: 1em;
}

ul.buttons {
	cursor: default;
}

ul.buttons:last-child {
	margin-bottom: 0;
}

ul.buttons li {
	display: inline-block;
	padding: 0 0 0 1.5em;
}

ul.buttons li:first-child {
	padding: 0;
}

ul.buttons.vertical li {
	display: block;
	padding: 1.5em 0 0 0;
}

ul.buttons.vertical li:first-child {
	padding: 0;
}


/* Button */

input[type="button"],
input[type="submit"],
input[type="reset"],
.button {
	-moz-appearance: none;
	-webkit-appearance: none;
	-o-appearance: none;
	-ms-appearance: none;
	appearance: none;
	-moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-o-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	-ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out, background-color 0.2s ease-in-out;
	background: none;
	border: solid 1px;
	color: inherit;
	cursor: pointer;
	display: inline-block;
	font-size: 0.8em;
	font-weight: 900;
	letter-spacing: 2px;
	min-width: 18em;
	padding: 0 0.75em;
	line-height: 3.75em;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.button:hover {
	background: rgba(188, 202, 206, 0.15);
	border-color: inherit;
}

input[type="button"].fit,
input[type="submit"].fit,
input[type="reset"].fit,
.button.fit {
	width: 100%;
}

input[type="button"].small,
input[type="submit"].small,
input[type="reset"].small,
.button.small {
	font-size: 0.7em;
	min-width: 14em;
	padding: 0.5em 0;
}


/* Wrapper */

.wrapper {
	margin-bottom: 5em;
	padding: 5em;
}

.wrapper.style1 {
	padding: 0;
}

.wrapper.style3 {
	background: white;
	color: inherit;
}

.wrapper.style4 {
	background: white;
	color: inherit;
	padding: 4em;
}


/* Header */

@-moz-keyframes reveal-header {
	0% {
		top: -5em;
	}
	100% {
		top: 0;
	}
}

@-webkit-keyframes reveal-header {
	0% {
		top: -5em;
	}
	100% {
		top: 0;
	}
}

@-o-keyframes reveal-header {
	0% {
		top: -5em;
	}
	100% {
		top: 0;
	}
}

@-ms-keyframes reveal-header {
	0% {
		top: -5em;
	}
	100% {
		top: 0;
	}
}

@keyframes reveal-header {
	0% {
		top: -5em;
	}
	100% {
		top: 0;
	}
}

#header {
	background: white;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.075);
	color: inherit;
	cursor: default;
	font-size: 0.8em;
	left: 0;
	padding: 1em 1.5em;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10000;
}

#header h1 {
	font-weight: 900;
	margin: 0;
}

#header h1 span {
	font-weight: 300;
}

#header nav {
	letter-spacing: 0.075em;
	position: absolute;
	right: 4.0em; /* fix here - orig 1.5*/
	text-transform: uppercase;
	top: 0.75em;
}

#header nav ul li {
	display: inline-block;
	margin-left: 1.5em;
}

#header nav ul li>ul {
	display: none;
}

#header nav ul li a {
	border: solid 1px transparent;
	color: inherit;
	display: inline-block;
	line-height: 1em;
	padding: 0.6em 0.75em;
	text-decoration: none;
}

#header nav ul li input[type="button"],
#header nav ul li input[type="submit"],
#header nav ul li input[type="reset"],
#header nav ul li .button {
	font-size: 1em;
	min-width: 0;
	width: auto;
}

#header nav ul li.submenu>a:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}

#header nav ul li.submenu>a:before {
	content: '\f107';
	margin-right: 0.65em;
}

#header nav ul li.active>a,
#header nav ul li:hover>a {
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	background: rgba(188, 202, 206, 0.15);
}

#header nav .cc-active {
	font-weight: 900;
}

#header.reveal {
	-moz-animation: reveal-header 0.5s;
	-webkit-animation: reveal-header 0.5s;
	-o-animation: reveal-header 0.5s;
	-ms-animation: reveal-header 0.5s;
	animation: reveal-header 0.5s;
}

#header.alt {
	-moz-animation: none;
	-webkit-animation: none;
	-o-animation: none;
	-ms-animation: none;
	animation: none;
	background: transparent;
	box-shadow: none;
	color: white;
	padding: 2em 2.5em;
	position: absolute;
}

#header.alt nav {
	right: 2.5em;
	top: 1.75em;
}

#header.alt nav ul li.active>a,
#header.alt nav ul li:hover>a {
	border: solid 1px;
}


/* Dropotron */

.dropotron {
	background: #fff;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.075);
	line-height: 2.25em;
	min-width: 13em;
	padding: 1em 0;
	text-transform: uppercase;
	margin-top: calc(-1em + 1px);
}

.dropotron.level-0 {
	font-size: 0.7em;
	font-weight: 400;
	margin-top: 1.5em;
}

.dropotron.level-0:before {
	border-bottom: solid 0.5em #fff;
	border-left: solid 0.5em transparent;
	border-right: solid 0.5em transparent;
	content: '';
	left: 0.75em;
	position: absolute;
	top: -0.45em;
}

.dropotron>li {
	border-top: solid 1px rgba(124, 128, 129, 0.2);
}

.dropotron>li>a {
	-moz-transition: none;
	-webkit-transition: none;
	-o-transition: none;
	-ms-transition: none;
	transition: none;
	color: inherit;
	text-decoration: none;
	padding: 0 1em;
	border: 0;
}

.dropotron>li:hover>a {
	background: rgb(79, 166, 209);
	color: white;
}

.dropotron>li:first-child {
	border-top: 0;
}


/* Banner */

@-moz-keyframes reveal-banner {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-webkit-keyframes reveal-banner {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-o-keyframes reveal-banner {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-ms-keyframes reveal-banner {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes reveal-banner {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

#banner {
	background-attachment: scroll, fixed;
	background-color: transparent;
	background-position: bottom center, top center;
	background-repeat: no-repeat;
	background-size: 25em, cover;
	color: white;
	cursor: default;
	padding: 8em 0;
	text-align: center;
}

#banner h2 {
	margin-bottom: 1em;
}

#banner p {
	font-size: 1.1em;
}

#banner .inner {
	-moz-animation: reveal-banner 1s 0.25s ease-in-out;
	-webkit-animation: reveal-banner 1s 0.25s ease-in-out;
	-o-animation: reveal-banner 1s 0.25s ease-in-out;
	-ms-animation: reveal-banner 1s 0.25s ease-in-out;
	animation: reveal-banner 1s 0.25s ease-in-out;
	-moz-animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
	background: rgba(52, 27, 43, 0.5);
	color: white;
	display: inline-block;
	opacity: 0;
	padding: 3em;
	text-align: center;
}

#banner .inner header {
	display: inline-block;
	border-bottom: solid 2px;
	border-top: solid 2px;
	margin: 0 0 2em 0;
	padding: 3px 0 3px 0;
}

#banner .inner header h2 {
	border-bottom: solid 2px;
	border-top: solid 2px;
	font-size: 2.5em;
	font-weight: 900;
	letter-spacing: 0.2em;
	margin: 0;
	padding-left: 0.05em;
	position: relative;
	text-transform: uppercase;
}

#banner .inner p {
	letter-spacing: 0.1em;
	margin: 0;
	text-transform: uppercase;
}

#banner .inner p a {
	color: inherit;
	font-weight: 400;
	text-decoration: none;
}

#banner .inner footer {
	margin: 2em 0 0 0;
}


/* Main */

#main {
	padding: 7em 0;
}

#main> :last-child {
	margin-bottom: 0;
}

#main .sidebar section {
	border-top: solid 1px rgba(124, 128, 129, 0.2);
	margin: 3em 0 0 0;
	padding: 3em 0 0 0;
}

#main .sidebar section:first-child {
	border-top: 0;
	padding-top: 0;
	margin-top: 0;
}

body.index #main {
	padding-top: 5em;
}


/* CTA */

.cta {
	background-attachment: scroll, scroll, scroll, fixed;
	background-color: none;
	background-image: none;
	background-position: top center, bottom center;
	background-repeat: no-repeat;
	background-size: 25em, 25em, auto, cover;
	color: white;
	padding: 5em 0em;
	text-align: center;
}

.cta header {
	margin-bottom: 2em;
}


/* Footer */

#footer {
	background: #e8eef4;
	color: #7c8081;
	padding: 5em 5em 10em 5em;
	text-align: center;
}

#footer .copyright {
	font-size: 0.8em;
	line-height: 1em;
}

#footer .copyright a {
	color: inherit;
}

#footer .copyright li {
	display: inline-block;
	margin-left: 1em;
	padding-left: 1em;
	border-left: dotted 1px;
}

#footer .copyright li:first-child {
	margin: 0;
	padding: 0;
	border: 0;
}


/* Layer */

#topButton .toggle {
	height: 100%;
	left: 0;
	position: absolute;
	text-align: center;
	top: 0;
	width: 100%;
}

#topButton .toggle:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}

#topButton .toggle:before {
	color: white;
	content: '\f039';
	font-size: 0.75em;
	height: 30px;
	left: 0;
	line-height: 30px;
	opacity: 0.5;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}

#topButton .toggle:after {
	background: rgba(163, 169, 170, 0.75);
	border-radius: 0 0 4px 4px;
	content: '';
	height: 30px;
	left: 50%;
	margin-left: -40px;
	position: absolute;
	top: 0;
	width: 80px;
}

#sideButton .toggle {
	height: 100%;
	left: 0;
	position: absolute;
	text-align: center;
	top: 0;
	width: 100%;
}

#sideButton .toggle:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}

#sideButton .toggle:before {
	color: white;
	content: '\f039';
	font-size: 1em;
	height: 40px;
	left: 10px;
	line-height: 40px;
	opacity: 0.5;
	position: absolute;
	top: 11px;
	width: 60px;
	z-index: 1;
}

#sideButton .toggle:after {
	background: rgba(163, 169, 170, 0.75);
	border-radius: 2px;
	content: '';
	height: 40px;
	left: 10px;
	position: absolute;
	top: 10px;
	width: 60px;
}

#topPanel,
#sidePanel {
	background: #1c2021;
	color: white;
	font-size: 0.8em;
	letter-spacing: 0.075em;
	text-transform: uppercase;
}

#topPanel nav,
#sidePanel nav {
	padding: 0.25em 0.5em 1em 0.5em;
}

#topPanel .link,
#sidePanel .link {
	border: 0;
	border-top: solid 1px rgba(255, 255, 255, 0.05);
	color: inherit;
	display: block;
	height: 3em;
	line-height: 3em;
	opacity: 0.75;
	text-decoration: none;
}

#topPanel .link.depth-0,
#sidePanel .link.depth-0 {
	font-weight: 900;
}

#topPanel .link:first-child,
#sidePanel .link:first-child {
	border-top: 0;
}

#topPanel .indent-1,
#sidePanel .indent-1 {
	display: inline-block;
	width: 1em;
}

#topPanel .indent-2,
#sidePanel .indent-2 {
	display: inline-block;
	width: 2em;
}

#topPanel .indent-3,
#sidePanel .indent-3 {
	display: inline-block;
	width: 3em;
}

#topPanel .indent-4,
#sidePanel .indent-4 {
	display: inline-block;
	width: 4em;
}

#topPanel .indent-5,
#sidePanel .indent-5 {
	display: inline-block;
	width: 5em;
}
