/* =Imports
============================================================================== */

@import url('normalize.css');

/* =Global
============================================================================== */

	/* Structure
	-------------------------------------------------------------------------- */
		
		html {
			font-size: 62.5%;
		}
		
		body {
			color: #333;
			font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
			font-weight: 600;
			font-size: 1.9rem;
			line-height: 1.618;
			text-shadow: 0 1px 2px #ffffff, 0 2px 3px #ffffff, 0 2px 7px #ffffff, 0 2px 10px #ffffff, 0 2px 20px #ffffff;
			background: #fff url(../../assets/img/bg.gif) 50% 50px no-repeat;
			background-size: 90% auto;
			background-attachment: fixed;
		}

		/* row - useful for clearing blocks of content, such as columns */

		.row {
			max-width: 1000px;
			margin: 0 auto 100px auto;
			padding: 0 5%;
			position: relative;
		}

		.row:after {
			content: "";
			display: table;
			clear: both;
		}

		/* remove left and right padding, useful for nested rows */

		.row.row-no-padding {
			padding: 0;
		}

		/* no max-width */

		.row.row-full {
			max-width: none;
		}

		/* grid columns */

		[class^="col-"] {
			width: 100%;
			min-height: 1px; /* used so that even if a column is empty, it still maintains its width */
			margin-right: 5%;
			float: left;
			box-sizing: border-box;
		}

		[class^="col-"]:last-child {
			margin-right: 0%;
		}

		.col-center {
			margin-left: auto;
			margin-right: auto;
			float: none;
		}

		.col-right {
			margin-left: 0;
			margin-right: 0;
			float: right;
		}

		.col-offset-1 {
			padding-left: 5%;
		}

		.col-offset-2 {
			padding-left: 10%;
		}

		@media (max-width: 767px) {
			[class^="col-"] + [class^="col-"] {
				margin-top: 25px;
			}
			[class^="col-"] + [class^="col-"].no-mobile-margin {
				margin-top: 0;
			}
			.col-offset-1,
			.col-offset-2 {
				padding-left: 0;
			}
		}

		@media (min-width: 768px) {
			.col-1   { width: calc(100% / 12 - 5% * 11 / 12); }
			.col-2   { width: calc(100% / 6 - 5% * 10 / 12); }
			.col-3   { width: calc(100% / 4 - 5% * 9 / 12); }
			.col-4   { width: calc(100% / 3 - 5% * 8 / 12); }
			.col-5   { width: calc(100% / 2.4 - 5% * 7 / 12); }
			.col-6   { width: calc(100% / 2 - 5% * 6 / 12); }
			.col-7   { width: calc(100% / 1.714285714285714 - 5% * 5 / 12); }
			.col-8   { width: calc(100% / 1.5 - 5% * 4 / 12); }
			.col-9   { width: calc(100% / 1.333333333333333 - 5% * 3 / 12); }
			.col-10  { width: calc(100% / 1.2 - 5% * 2 / 12); }
			.col-11  { width: calc(100% / 1.090909090909091 - 5% * 1 / 12); }
			.col-12  { width: 100%; }
		}

	/* Typography
	-------------------------------------------------------------------------- */

		/* headings */

		h1,
		h2,
		h3,
		h4,
		h5,
		h6 {
			margin: 35px 0 15px 0;
			color: #1017f0;
			font-family: "Palatino Linotype", "Book Antiqua", "Garamond", serif;
			font-weight: 700;
			line-height: 1.1;
		}

		h1:first-child,
		h2:first-child,
		h3:first-child,
		h4:first-child,
		h5:first-child,
		h6:first-child {
			margin-top: 0; /* ensures titles only have top margin if they have preceding content */
		}

		h1 {
			font-size: 6rem;
			margin: 40px 0 25px 0;
		}

		h2 {
			font-size: 5rem;
			margin: 40px 0 15px 0;
		}

		h3 {
			font-size: 3.5rem;
			margin: 40px 0 15px 0;
		}

		h4 {
			font-size: 2.4rem;
		}

		h5 {
			font-size: 2.0rem;
		}

		h6 {
			font-size: 1.4rem;
		}

		@media (max-width: 767px) {
			h1 {
				font-size: 4.0rem;
			}
			h2 {
				font-size: 3.4rem;
			}
			h3 {
				font-size: 2.6rem;
			}
		}

		/* paragraphs and lists */

		p,
		ul,
		ol,
		dl {
			margin: 0 0 20px 0;
		}

		ul,
		ol {
			padding-left: 25px;
		}

		ul > *,
		ol > * {
			margin: 0;
		}

		dl dt,
		dl dd {
			margin: 0;
		}

		/* lead paragraph with bigger font */

		.lead {
			font-size: 2.0rem;
		}

		/* strong */

		strong {
			font-weight: 700;
		}

		/* small */

		small {
			font-size: 1.4rem;
			display: inline-block;
		}

		/* anchors */

		a,
		a:visited {
			color: #1017f0;
			text-decoration: none;
			transition: color 0.12s linear;
		}

		a:hover {
			color: #004080; /* replace $link-color-hover with your desired color */
		}

		/* uppercase */

		.uppercase {
			text-transform: uppercase;
		}

		/* center text */

		.text-center {
			text-align: center;
		}

		/* base color */

		.color-base {
			color: #333;
		}

	/* Alignment
	-------------------------------------------------------------------------- */

		/* fade in and up */
		
		.fade-up { position: relative; }

/* =Header
============================================================================== */
		
	/* Base
	-------------------------------------------------------------------------- */
		
		#header {
			max-width: 1000px;
			margin: 0 auto;
			padding: 10% 5%;
			text-align: center;
			position: relative;
		}

		@media (min-width: 1000px) {
			#header {
				padding: 100px 5%;
			}
		}

		#header h1 {
			margin: 0;
		}

		#header h4 {
			margin: 15px 0;
			color: #333;
		}

/* =Content
============================================================================== */
		
	/* Base
	-------------------------------------------------------------------------- */
		
		#main {
			max-width: 1000px;
			margin: 0 auto;
			padding: 0 5%;
			position: relative;
		}

	/* Buttons
	-------------------------------------------------------------------------- */

		.btn {
			border: 0;
			font-weight: 600;
			text-align: center;
			text-shadow: none;
			display: inline-block;
			border-radius: 50px;
			box-sizing: border-box;
		}

		.btn:hover {
			cursor: pointer;
		}

		.btn:focus {
			outline: none;
		}

		/* add some margin for when multiple buttons are side by side */
		.btn-margin-right {
			margin-right: 10px;
		}

		/* make it a full-width button */
		.btn-block {
			width: 100%;
			display: block;
		}

		/* full-width button in mobile only */
		@media (max-width: 767px) {
			.btn-block-mobile {
				width: 100%;
				display: block;
			}
		}

		/* sizes */

		.btn-lg {
			padding: 15px 30px;
			font-size: 1.8rem;
		}

		.btn-lg[class*="btn-outline"] {
			padding: 13px 28px;
		}

		.btn-md {
			padding: 11px 25px 10px 25px;
			font-size: 1.6rem;
		}

		.btn-md[class*="btn-outline"] {
			padding: 9px 23px 8px 23px;
		}

		.btn-sm {
			padding: 8px 15px;
			font-size: 1.5rem;
		}

		.btn-sm[class*="btn-outline"] {
			padding: 6px 13px;
		}

		/* plain text button without background or border */

		.btn-plain {
			background: none;
			border: none;
		}

		/* blue styles */

		.btn-solid-blue,
		.btn-solid-blue:visited {
			color: #ffffff;
			background-color: #1017f0;
			transition: background-color 0.1s linear;
		}

		.btn-solid-blue:hover {
			color: #ffffff;
			background-color: #000000;
		}

		.btn-solid-blue:disabled {
			opacity: 0.4;
		}

		.btn-solid-blue:disabled:hover {
			background-color: #1017f0;
		}

		.btn-outline-blue,
		.btn-outline-blue:visited {
			color: #1017f0;
			border: 2px solid #1017f0;
			background: transparent;
			transition: color 0.1s linear, border-color 0.1s linear;
		}

		.btn-outline-blue:hover {
			color: #000000;
			border-color: #000000;
		}

		.btn-outline-blue:disabled {
			opacity: 0.4;
		}

		.btn-outline-blue:disabled:hover {
			color: #1017f0;
			border: 2px solid #1017f0;
		}

		/* button icons */

		.btn svg {
			margin-right: 5px;
			vertical-align: middle;
			position: relative;
			top: -2px;
		}

/* =Footer
============================================================================== */
		
	/* Base
	-------------------------------------------------------------------------- */
			
		#footer {
			max-width: 1000px;
			margin: 0 auto;
			padding: 0 5%;
			color: #bbb;
			text-align: center;
			font-size: 1.4rem;
		}