@import url("font-awesome.min.css");
@import url("https://fonts.googleapis.com/css?family=Oleo+Script:400|Open+Sans:300,300italic,600,600italic,800");

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

	}

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

	}

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

	}

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

	}

/* Basic */

	@-ms-viewport {
		width: device-width;
	}

/* Wrappers */

	#header-wrapper {
		padding: 4.5em 0 1em 0;
	}

	#features-wrapper {
		padding: 3em 0 3em 0;
	}

	#main-wrapper {
		background: #fff;
		box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.05);
		padding: 5em 0 5em 0;
	}

/* Header */

	#header {
		
	}

		#logo h1 {
			background: #ff4486;
			color: #fff;
			border-radius: 6px;
			font-family: 'Oleo Script', serif;
			font-weight: 400;
			padding: 0.25em 0.2em 0.25em 0.2em;
			font-size: 3.25em;
			letter-spacing: 0.05em;
			display: inline-block;
			vertical-align: middle;
		}

		#logo span {
			font-weight: 800;
			line-height: 4.5em;
			letter-spacing: 0.025em;
			font-size: 0.9em;
			vertical-align: middle;
			margin: 0 0 0 1.25em;
		}

/* Nav */

	#nav {
		position: absolute;
		right: 0;
		top: 0;
		font-size: 0.9em;
	}

		#nav ul li {
			float: left;
			line-height: 4.5em;
			padding-left: 1.5em;
		}

			#nav ul li a, #nav ul li span {
				-moz-transition: background-color .25s ease-in-out;
				-webkit-transition: background-color .25s ease-in-out;
				-ms-transition: background-color .25s ease-in-out;
				transition: background-color .25s ease-in-out;
				font-weight: 800;
				letter-spacing: 0.025em;
				color: #696969;
				text-decoration: none;
				border-radius: 6px;
				padding: 0.5em 1em 0.5em 1em;
			}

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

			#nav ul li:hover a, #nav ul li:hover span {
				background: #fff;
			}

			#nav ul li.active a, #nav ul li.active span {
				background: #fff;
			}

			#nav ul li.current a {
				background: #444;
				color: #fff;
			}

	.dropotron {
		background: #fff;
		letter-spacing: 0.025em;
		color: #696969;
		text-decoration: none;
		border-radius: 6px;
		padding: 0.75em 0;
		min-width: 15em;
		box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), 0 0.25em 0.25em 0.1em rgba(0, 0, 0, 0.025);
		margin-top: calc(-0.75em + 1px);
		margin-left: -1px;
	}

		.dropotron li {
			border-top: solid 1px #eee;
			line-height: 3em;
		}

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

			.dropotron li > a, .dropotron li > span {
				-moz-transition: color .25s ease-in-out, background-color .25s ease-in-out;
				-webkit-transition: color .25s ease-in-out, background-color .25s ease-in-out;
				-ms-transition: color .25s ease-in-out, background-color .25s ease-in-out;
				transition: color .25s ease-in-out, background-color .25s ease-in-out;
				text-decoration: none;
				color: inherit;
				display: block;
				padding: 0 1.5em;
			}

				.dropotron li > a:hover, .dropotron li > span:hover {
					background: #eee;
				}

			.dropotron li.active > a, .dropotron li.active > span {
				background: #eee;
			}

		.dropotron.level-0 {
			font-size: 0.8em;
			margin-left: 1.5em;
			margin-top: 0;
		}

			.dropotron.level-0:before {
				content: '';
				position: absolute;
				top: -0.5em;
				left: 1em;
				border-bottom: solid 0.75em #ffffff;
				border-left: solid 0.75em transparent;
				border-right: solid 0.75em transparent;
				z-index: 1;
			}
/* Medium */

	#navPanel, #navToggle {
		display: none;
	}

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

			ul.menu li {
				display: block;
				border: 0 !important;
				padding: 0 !important;
				margin: 0 !important;
			}

			ul.actions li {
				display: block;
				padding: 0;
				margin: 1em 0 0 0;
			}

				ul.actions li:first-child {
					margin-top: 0;
				}

		/* Wrappers */

			#header-wrapper {
				padding: 3em 0 1em 0;
				text-align: center;
			}

			#footer-wrapper {
				padding: 6em 0 4em 0;
			}

		/* Header */

			#header {
				margin: 0 auto;
			}

		/* Nav */

			#nav {
				display: none;
			}

		/* Off-Canvas Navigation */

			#page-wrapper {
				-moz-backface-visibility: hidden;
				-webkit-backface-visibility: hidden;
				-ms-backface-visibility: hidden;
				backface-visibility: hidden;
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				padding-bottom: 1px;
			}

			#navToggle {
				-moz-backface-visibility: hidden;
				-webkit-backface-visibility: hidden;
				-ms-backface-visibility: hidden;
				backface-visibility: hidden;
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				display: block;
				height: 44px;
				left: 0;
				position: fixed;
				top: 0;
				width: 100%;
				z-index: 10001;
			}

				#navToggle .toggle {
					width: 70px;
					height: 50px;
					opacity: 0.35;
				}

					#navToggle .toggle:before {
						display: inline-block;
						font-family: FontAwesome;
						text-decoration: none;
						font-style: normal;
						font-weight: normal;
						-webkit-font-smoothing: antialiased;
						-moz-osx-font-smoothing: grayscale;
						position: absolute;
						left: 6px;
						top: 6px;
						background: rgba(0, 0, 0, 0.5);
						width: 58px;
						height: 38px;
						border-radius: 6px;
						content: '\f0c9';
						color: #fff;
						text-align: center;
						line-height: 38px;
						font-size: 20px;
					}

					#navToggle .toggle:active {
						opacity: 0.75;
					}

			#navPanel {
				-moz-backface-visibility: hidden;
				-webkit-backface-visibility: hidden;
				-ms-backface-visibility: hidden;
				backface-visibility: hidden;
				-moz-transform: translateX(-275px);
				-webkit-transform: translateX(-275px);
				-ms-transform: translateX(-275px);
				transform: translateX(-275px);
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				display: block;
				height: 100%;
				left: 0;
				overflow-y: auto;
				position: fixed;
				top: 0;
				width: 275px;
				z-index: 10002;
				background: #fff;
				box-shadow: inset -3px 0px 0px 0px #dfdfdf;
				padding: 0 23px 0 20px;
			}

				#navPanel .link {
					display: block;
					text-decoration: none;
					height: 54px;
					line-height: 54px;
					border-top: solid 1px #e8e8e8;
					color: #696969;
				}

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

				#navPanel .indent-1 {
					display: inline-block;
					width: 1em;
				}

				#navPanel .indent-2 {
					display: inline-block;
					width: 2em;
				}

				#navPanel .indent-3 {
					display: inline-block;
					width: 3em;
				}

				#navPanel .indent-4 {
					display: inline-block;
					width: 4em;
				}

				#navPanel .indent-5 {
					display: inline-block;
					width: 5em;
				}

				#navPanel .depth-0 {
					color: #444;
					font-weight: 800;
				}

			body.navPanel-visible #page-wrapper {
				-moz-transform: translateX(275px);
				-webkit-transform: translateX(275px);
				-ms-transform: translateX(275px);
				transform: translateX(275px);
			}

			body.navPanel-visible #navToggle {
				-moz-transform: translateX(275px);
				-webkit-transform: translateX(275px);
				-ms-transform: translateX(275px);
				transform: translateX(275px);
			}

			body.navPanel-visible #navPanel {
				-moz-transform: translateX(0);
				-webkit-transform: translateX(0);
				-ms-transform: translateX(0);
				transform: translateX(0);
			}

	}

/* Small */

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

			ul.menu li {
				display: block;
				border: 0 !important;
				padding: 0 !important;
				margin: 0 !important;
			}

			ul.actions li {
				display: block;
				padding: 0;
				margin: 1em 0 0 0;
			}

				ul.actions li:first-child {
					margin-top: 0;
				}


		/* Wrappers */

			#header-wrapper {
				padding: 3em 0 1.5em 0;
			}

			#banner-wrapper {
				padding: 0 15px 0 15px;
			}

			#features-wrapper {
				padding: 0 15px 40px 15px;
			}

			#main-wrapper, #footer-wrapper {
				padding: 40px 30px 40px 30px;
			}

	}