@import url(fontawesome-all.min.css);
@import url("https://use.typekit.net/dvj2bbt.css");

/* Header */

	body {
		padding-top: 3.75rem;
		position: relative;
	}

	#header {
		-moz-align-items: center;
		-webkit-align-items: center;
		-ms-align-items: center;
		align-items: center;
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-justify-content: space-between;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: space-between;
		background: #212427;
		color: #c1c5cb;
		cursor: default;
		height: 5.7em;
		left: 0;
		line-height: 2.75rem;
		padding-right: 2.75rem;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 810;
        
	}

		#header .logo {
		  width: 45%;
          height: 100%;
             display: block;
             position: relative;
           left: 3.5em;
             top: 1em;
             float: left;
            padding: 0em 0 1em 0;
          
            
		}


			

		#header a[href="#navPanel"] {
			text-decoration: none;
			color: #ffffff;
			display: none;
			padding: 0 0 0 1.25rem;
		}

			#header a[href="#navPanel"]:before {
				-moz-osx-font-smoothing: grayscale;
				-webkit-font-smoothing: antialiased;
				display: inline-block;
				font-style: normal;
				font-variant: normal;
				text-rendering: auto;
				line-height: 1;
				text-transform: none !important;
				font-family: 'Font Awesome 5 Free';
				font-weight: 900;
			}

			#header a[href="#navPanel"]:before {
				content: '\f0c9';
				float: right;
				line-height: inherit;
				margin: 0 0 0 0.625rem;
                font-size: 1.7em;
			}

		#header nav {
			-moz-flex: 0 1 auto;
			-webkit-flex: 0 1 auto;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
           font-family: josefin-sans, sans-serif;
            
		}

			#header nav > ul {
				-moz-align-items: center;
				-webkit-align-items: center;
				-ms-align-items: center;
				align-items: center;
				display: -moz-flex;
				display: -webkit-flex;
				display: -ms-flex;
				display: flex;
				line-height: inherit;
				list-style-type: none;
				margin: 0;
				padding: 0;
			}

				#header nav > ul > li {
                    font-size: 90%;
					line-height: inherit;
					padding: 0;
                    
				}

					#header nav > ul > li.opener a:before {
						content: "\f107";
						font-family: 'Font Awesome 5 Free';
						font-weight: 900;
						padding-right: 0.5rem;
                        font-size: 1.1em;
					}

					#header nav > ul > li.opener.active a {
						color: #ffffff;
					}

					#header nav > ul > li:hover a {
						color: #ffffff;
					}

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

					#header nav > ul > li a {
						color: #c1c5cb;
						display: block;
						height: 3.75rem;
						line-height: 3.75rem;
						margin-left: 0.5rem;
						padding: 0 1.5rem;
						text-decoration: none;
					}

						#header nav > ul > li a:hover, #header nav > ul > li a:focus, #header nav > ul > li a.active {
							color: #ffffff;
						}

						#header nav > ul > li a.active {
							border-bottom: 3px solid #f37721;
							font-weight: 700;
						}

					#header nav > ul > li:last-child a {
						margin-right: 0 !important;
					}

			.dropotron {
				background-color: rgba(33, 36, 39, 0.99);
				list-style-type: none;
				margin: 0;
				min-width: 10rem;
				padding: 0.5rem;
			}

				.dropotron.level-0 {
					margin: 0;
				}

				.dropotron li {
					padding: 0;
					position: relative;
                    font-size: 100%;
                    font-family: josefin-sans, sans-serif;
				}

					.dropotron li.opener > a:after {
						content: "\f105";
						font-family: 'Font Awesome 5 Free';
						font-weight: 900;
						line-height: inherit;
						padding-left: 1rem;
					}

					.dropotron li.active > a {
						background-color: #273341;
						color: #ffffff !important;
					}

				.dropotron a {
					-moz-transition: none;
					-webkit-transition: none;
					-ms-transition: none;
					transition: none;
					border-bottom: 0;
					color: #c1c5cb;
					padding: 0.5rem 1rem;
					text-decoration: none;
				}

					.dropotron a:hover {
						background-color: #2a3037;
						color: #ffffff !important;
					}


@media screen and (max-width: 1680px) {
    #header .logo {
          width: 38%;
				padding: 0 0 0 0;
        left: 2em;
        top: 0.5em;
			}
    
      
    
}

@media screen and (max-width: 1280px) {
    #header .logo {
          width: 34%;
				padding: 0 0 0 0;
        left: 2em;
        top: 0.5em;
			}
    
      
    
}


	@media screen and (max-width: 980px) {

		nav {
			display: none;
		}

		#header {
			padding-right: 1.375rem;
            height: 5.4em;
            
		}

			#header a[href="#navPanel"] {
				display: block;
			}

			#header .logo {
				 width: 32%;
                top: 0.7em;
			}

	}

	@media screen and (max-width: 736px) {

		body {
			padding-top: 44px;
		}

		#header {
			height: 4.4em;
		}

			#header .logo {
				 width: 28%;
                top: 0.4em;
			}

				#header .logo span {
					display: none;
				}

			#header a[href="#navPanel"] {
				height: 2rem;
				line-height: 2rem;
			}

	}

	@media screen and (max-width: 480px) {

		#header {
			min-width: 320px;
            height: 4em;
		}

	}

/* Nav Panel */

	#navPanel {
		-moz-transform: translateX(100%);
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
		-moz-transition: -moz-transform 1.5s ease, box-shadow 1.5s ease, visibility 1.5s;
		-webkit-transition: -webkit-transform 1.5s ease, box-shadow 1.5s ease, visibility 1.5s;
		-ms-transition: -ms-transform 1.5s ease, box-shadow 1.5s ease, visibility 1.5s;
		transition: transform 1.5s ease, box-shadow 1.5s ease, visibility 1.5s;
		-webkit-overflow-scrolling: touch;
		background: #2a3037;
		box-shadow: none;
		display: none;
		height: 100%;
		max-width: 100%;
		overflow-y: auto;
		padding: 2rem;
		position: fixed;
		right: 0;
		top: 0;
		visibility: hidden;
		width: 100%;
		z-index: 899;
        text-transform: uppercase
	}

		#navPanel.visible {
			-moz-transform: translateX(0);
			-webkit-transform: translateX(0);
			-ms-transform: translateX(0);
			transform: translateX(0);
			box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.2);
			visibility: visible;
		}

		#navPanel nav {
			display: block;
			padding: 0;
		}

		#navPanel .link {
			-moz-transition: color 0.2s;
			-webkit-transition: color 0.2s;
			-ms-transition: color 0.2s;
			transition: color 0.2s;
			border-bottom: 0;
			border-top: 0;
			color: #c1c5cb !important;
			display: block;
			padding: 0.75rem;
			text-decoration: none;
		}

			#navPanel .link:first-child {
				border-top: 0;
			}

			#navPanel .link.depth-0 {
				color: #c1c5cb !important;
                font-weight: 600;
			}

			#navPanel .link:active, #navPanel .link:focus, #navPanel .link:hover {
				color: #ffffff !important;
			}

			#navPanel .link .indent-1 {
				display: inline-block;
				width: 1.25rem;
			}

			#navPanel .link .indent-2 {
				display: inline-block;
				width: 2.5rem;
			}

		#navPanel .close {
			text-decoration: none;
			-moz-transition: color 0.2s ease-in-out;
			-webkit-transition: color 0.2s ease-in-out;
			-ms-transition: color 0.2s ease-in-out;
			transition: color 0.2s ease-in-out;
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			border: 0;
			color: #c1c5cb !important;
			cursor: pointer;
			display: block;
			height: 3.25rem;
			line-height: 3.25rem;
			padding-right: 1.25rem;
			position: absolute;
			right: 0;
			text-align: right;
			top: 0;
			vertical-align: middle;
			width: 7rem;
		}

			#navPanel .close:before {
				-moz-osx-font-smoothing: grayscale;
				-webkit-font-smoothing: antialiased;
				display: inline-block;
				font-style: normal;
				font-variant: normal;
				text-rendering: auto;
				line-height: 1;
				text-transform: none !important;
				font-family: 'Font Awesome 5 Free';
				font-weight: 900;
			}

			#navPanel .close:before {
				content: '\f00d';
				font-size: 1.7em;
			}

			#navPanel .close:hover {
				color: #ffffff;
			}

		@media screen and (max-width: 980px) {

			#navPanel {
				display: block;
			}

		}

		@media screen and (max-width: 736px) {

			#navPanel .close {
				height: 4rem;
				line-height: 4rem;
			}

		}