@import url(font-awesome.min.css);
@import url("https://fonts.googleapis.com/css?family=Raleway:300,700");

/* Containers */

	.container {
		margin-left: auto;
		margin-right: auto;
	}

	.container.\31 25\25 {
		width: 100%;
		max-width: 100em;
		min-width: 80em;
	}

	.container.\37 5\25 {
		width: 60em;
	}

	.container.\35 0\25 {
		width: 40em;
	}

	.container.\32 5\25 {
		width: 20em;
	}

	.container {
		width: 80em;
	}

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

		.container.\31 25\25 {
			width: 100%;
			max-width: 100em;
			min-width: 80em;
		}

		.container.\37 5\25 {
			width: 60em;
		}

		.container.\35 0\25 {
			width: 40em;
		}

		.container.\32 5\25 {
			width: 20em;
		}

		.container {
			width: 80em;
		}

	}

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

		.container.\31 25\25 {
			width: 100%;
			max-width: 81.25em;
			min-width: 65em;
		}

		.container.\37 5\25 {
			width: 48.75em;
		}

		.container.\35 0\25 {
			width: 32.5em;
		}

		.container.\32 5\25 {
			width: 16.25em;
		}

		.container {
			width: 65em;
		}

	}

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

		.container.\31 25\25 {
			width: 100%;
			max-width: 112.5%;
			min-width: 90%;
		}

		.container.\37 5\25 {
			width: 67.5%;
		}

		.container.\35 0\25 {
			width: 45%;
		}

		.container.\32 5\25 {
			width: 22.5%;
		}

		.container {
			width: 90%;
		}

	}

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

		.container.\31 25\25 {
			width: 100%;
			max-width: 112.5%;
			min-width: 90%;
		}

		.container.\37 5\25 {
			width: 67.5%;
		}

		.container.\35 0\25 {
			width: 45%;
		}

		.container.\32 5\25 {
			width: 22.5%;
		}

		.container {
			width: 90%;
		}

	}

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

		.container.\31 25\25 {
			width: 100%;
			max-width: 112.5%;
			min-width: 90%;
		}

		.container.\37 5\25 {
			width: 67.5%;
		}

		.container.\35 0\25 {
			width: 45%;
		}

		.container.\32 5\25 {
			width: 22.5%;
		}

		.container {
			width: 90%;
		}

	}

/* Feature */

	.features {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-moz-justify-content: center;
		-webkit-justify-content: center;
		-ms-justify-content: center;
		justify-content: center;
		margin-bottom: 2em;
	}

	.feature {
		padding: 2em 2em 0.1em 2em;
		border-style: solid;
		border-background: #ffffff;
		border-width: medium;
		margin-left: -1px;
		margin-top: -1px;
		width: 33.33333%;
	}

		.feature .fa {
			font-size: 2.8em;
			margin-bottom: 0.7em;
		}

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

			.feature {
				padding: 2em 1.5em 0.1em 1.5em;
			}

		}

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

			.feature {
				padding: 2em 1em 0.1em 1em;
				width: 50%;
			}

		}

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

			.feature {
				padding: 2em 0.5em 0.1em 0.5em;
				width: 100%;
			}

		}

	.feature {
		border-color: #e3e3e3;
		
	}

		.feature .fa {
			color: #00cdcf;
		}

/* Wrapper */

	.wrapper {
		padding: 6em 0 4em 0;
		position: relative;
	}

		.wrapper > .inner {
			margin: 0 auto;
			width: 65em;
		}

			.wrapper > .inner.narrow {
				width: 35em;
			}

		.wrapper.style1 {
			background-color: #00cdcf;
			color: #ffffff;
		}

			.wrapper.style1 input, .wrapper.style1 select, .wrapper.style1 textarea {
				color: #ffffff;
			}

			.wrapper.style1 a {
				color: #00cdcf;
			}

			.wrapper.style1 strong, .wrapper.style1 b {
				color: #ffffff;
			}

			.wrapper.style1 h1, .wrapper.style1 h2, .wrapper.style1 h3, .wrapper.style1 h4, .wrapper.style1 h5, .wrapper.style1 h6 {
				color: #ffffff;
			}

			.wrapper.style1 blockquote {
				border-left-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 code {
				background: rgba(255, 255, 255, 0.075);
				border-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 hr {
				border-bottom-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 .box {
				border-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 ul.alt li {
				border-top-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 header h2, .wrapper.style1 header h3 {
				border-bottom-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 header p {
				color: #99ebeb;
			}

			.wrapper.style1 table tbody tr {
				border-color: rgba(255, 255, 255, 0.25);
			}

				.wrapper.style1 table tbody tr:nth-child(2n + 1) {
					background-color: rgba(255, 255, 255, 0.075);
				}

			.wrapper.style1 table th {
				color: #ffffff;
			}

			.wrapper.style1 table thead {
				border-bottom-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 table tfoot {
				border-top-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 table.alt tbody tr td {
				border-color: rgba(255, 255, 255, 0.25);
			}

			.wrapper.style1 .feature {
				border-color: rgba(255, 255, 255, 0.25);
			}

				.wrapper.style1 .feature .fa {
					color: #009a9c;
				}

		.wrapper.style2 {
			background-color: #f7f7f7;
			color: #444;
		}

			.wrapper.style2 input, .wrapper.style2 select, .wrapper.style2 textarea {
				color: #555;
			}

			.wrapper.style2 a {
				color: #00cdcf;
			}

			.wrapper.style2 strong, .wrapper.style2 b {
				color: #555;
			}

			.wrapper.style2 h1, .wrapper.style2 h2, .wrapper.style2 h3, .wrapper.style2 h4, .wrapper.style2 h5, .wrapper.style2 h6 {
				color: #555;
			}

			.wrapper.style2 blockquote {
				border-left-color: #ddd;
			}

			.wrapper.style2 code {
				background: #fff;
				border-color: #ddd;
			}

			.wrapper.style2 hr {
				border-bottom-color: #ddd;
			}

			.wrapper.style2 .box {
				border-color: #ddd;
			}

			.wrapper.style2 ul.alt li {
				border-top-color: #ddd;
			}

			.wrapper.style2 header h2, .wrapper.style2 header h3 {
				border-bottom-color: #ddd;
			}

			.wrapper.style2 header p {
				color: #bbb;
			}

			.wrapper.style2 table tbody tr {
				border-color: #ddd;
			}

				.wrapper.style2 table tbody tr:nth-child(2n + 1) {
					background-color: #fff;
				}

			.wrapper.style2 table th {
				color: #555;
			}

			.wrapper.style2 table thead {
				border-bottom-color: #ddd;
			}

			.wrapper.style2 table tfoot {
				border-top-color: #ddd;
			}

			.wrapper.style2 table.alt tbody tr td {
				border-color: #ddd;
			}

			.wrapper.style2 .feature {
				border-color: #ddd;
			}

				.wrapper.style2 .feature .fa {
					color: #00cdcf;
				}

		.wrapper.style3 {
			background-color: #009a9c;
			color: #ddd;
		}

			.wrapper.style3 input, .wrapper.style3 select, .wrapper.style3 textarea {
				color: #fff;
			}

			.wrapper.style3 a {
				color: #00cdcf;
			}

			.wrapper.style3 strong, .wrapper.style3 b {
				color: #fff;
			}

			.wrapper.style3 h1, .wrapper.style3 h2, .wrapper.style3 h3, .wrapper.style3 h4, .wrapper.style3 h5, .wrapper.style3 h6 {
				color: #fff;
			}

			.wrapper.style3 blockquote {
				border-left-color: #ddd;
			}

			.wrapper.style3 code {
				background: #00b4b5;
				border-color: #ddd;
			}

			.wrapper.style3 hr {
				border-bottom-color: #ddd;
			}

			.wrapper.style3 .box {
				border-color: #ddd;
			}

			.wrapper.style3 label {
				color: #fff;
			}

			.wrapper.style3 input[type="text"],
			.wrapper.style3 input[type="password"],
			.wrapper.style3 input[type="email"],
			.wrapper.style3 select,
			.wrapper.style3 textarea {
				background: #00b4b5;
				border-color: #ddd;
			}

				.wrapper.style3 input[type="text"]:focus,
				.wrapper.style3 input[type="password"]:focus,
				.wrapper.style3 input[type="email"]:focus,
				.wrapper.style3 select:focus,
				.wrapper.style3 textarea:focus {
					border-color: #00cdcf;
					box-shadow: 0 0 0 1px #00cdcf;
				}

			.wrapper.style3 .select-wrapper:before {
				color: #ddd;
			}

			.wrapper.style3 input[type="checkbox"] + label,
			.wrapper.style3 input[type="radio"] + label {
				color: #ddd;
			}

				.wrapper.style3 input[type="checkbox"] + label:before,
				.wrapper.style3 input[type="radio"] + label:before {
					background: #00b4b5;
					border-color: #ddd;
				}

			.wrapper.style3 input[type="checkbox"]:checked + label:before,
			.wrapper.style3 input[type="radio"]:checked + label:before {
				background-color: #00cdcf;
				border-color: #00cdcf;
				color: #ffffff;
			}

			.wrapper.style3 input[type="checkbox"]:focus + label:before,
			.wrapper.style3 input[type="radio"]:focus + label:before {
				border-color: #00cdcf;
				box-shadow: 0 0 0 1px #00cdcf;
			}

			.wrapper.style3 ::-webkit-input-placeholder {
				color: #00cdcf !important;
			}

			.wrapper.style3 :-moz-placeholder {
				color: #00cdcf !important;
			}

			.wrapper.style3 ::-moz-placeholder {
				color: #00cdcf !important;
			}

			.wrapper.style3 :-ms-input-placeholder {
				color: #00cdcf !important;
			}

			.wrapper.style3 .formerize-placeholder {
				color: #00cdcf !important;
			}

			.wrapper.style3 ul.alt li {
				border-top-color: #ddd;
			}

			.wrapper.style3 header h2, .wrapper.style3 header h3 {
				border-bottom-color: #ddd;
			}

			.wrapper.style3 header p {
				color: #00cdcf;
			}

			.wrapper.style3 table tbody tr {
				border-color: #ddd;
			}

				.wrapper.style3 table tbody tr:nth-child(2n + 1) {
					background-color: #00b4b5;
				}

			.wrapper.style3 table th {
				color: #fff;
			}

			.wrapper.style3 table thead {
				border-bottom-color: #ddd;
			}

			.wrapper.style3 table tfoot {
				border-top-color: #ddd;
			}

			.wrapper.style3 table.alt tbody tr td {
				border-color: #ddd;
			}

			.wrapper.style3 .feature {
				border-color: #ddd;
			}

				.wrapper.style3 .feature .fa {
					color: #00cdcf;
				}

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

			.wrapper {
				padding: 5em 0 3em 0;
			}

				.wrapper > .inner {
					width: 60em;
				}

		}

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

			.wrapper {
				padding: 4em 2em 2em 2em;
			}

				.wrapper > .inner {
					width: 100%;
				}

		}

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

			.wrapper {
				padding: 3em 1.5em 1em 1.5em;
			}

				.wrapper > .inner.narrow {
					width: 100%;
				}

		}

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

			.wrapper {
				padding: 2em 1em 0.1em 1em;
			}

				.wrapper > .inner.narrow {
					width: 100%;
				}

		}


/* Footer */

	#footer {
		background-color: #000000;
		color: #444;
		padding: 5em 0 4em 0;
		position: relative;
	}

		#footer input, #footer select, #footer textarea {
			color: #555;
		}

		#footer a {
			color: #00cdcf;
		}

		#footer strong, #footer b {
			color: #555;
		}

		#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6 {
			color: #555;
		}

		#footer blockquote {
			border-left-color: #ddd;
		}

		#footer code {
			background: #fff;
			border-color: #ddd;
		}

		#footer hr {
			border-bottom-color: #ddd;
		}

		#footer:before {
			background-color: #ddd;
			content: '';
			height: 1px;
			left: 30%;
			position: absolute;
			top: 0;
			width: 40%;
		}

		#footer .copyright {
			color: #bbb;
			font-size: 0.9em;
			margin: 0 0 2em 0;
			padding: 0;
			text-align: center;
			//text-transform: lowercase;
		}

			#footer .copyright li {
				border-left: solid 1px #e3e3e3;
				display: inline-block;
				list-style: none;
				margin-left: 1.5em;
				padding-left: 1.5em;
			}

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

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

			#footer {
				padding: 4em 2em 3em 2em;
			}

		}

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

			#footer {
				padding: 3em 2em 2em 2em;
			}

				#footer:before {
					width: 75%;
					left: 12.5%;
				}

		}

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

			#footer {
				padding: 3em 2em 1em 2em;
			}

				#footer:before {
					width: 85%;
					left: 7.5%;
				}

				#footer .copyright li {
					display: block;
					border-left: 0;
					margin-left: 0;
					padding-left: 0;
				}

		}

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

			#footer {
				padding: 2em 1em 0.1em 1em;
			}

		}