/*
	 _                   ______
	| |                  | ___ \
	| |__   __ _ _ __ ___| |_/ / ___  _ __   ___  ___
	| '_ \ / _` | '__/ _ \ ___ \/ _ \| '_ \ / _ \/ __|
	| |_) | (_| | | |  __/ |_/ / (_) | | | |  __/\__ \
	|_.__/ \__,_|_|  \___\____/ \___/|_| |_|\___||___/

	Dead simple, minimal responsive CSS boilerplate and nothing else.

	Copyright (c) 2021
	Version 1.0
	Designed and Developed by Jennifer Perrin - http://jenniferperrin.com/
 */

/*	----------------------------------------------
	THE BASICS
 	---------------------------------------------- */
html { font-size: 80%; }
body {
	font-size: 1.5em;
	line-height: 1.6;
	font-weight: 400;
	font-family: "Quicksand", Arial, sans-serif;
	color: #222222;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	margin-bottom: 1rem;
	font-weight: 400;
}
	h1 { font-size: 4.0rem; line-height: 1.2; }
	h2 { font-size: 3.6rem; line-height: 1.25; }
	h3 { font-size: 3.0rem; line-height: 1.3; }
	h4 { font-size: 2.4rem; line-height: 1.35; }
	h5 { font-size: 1.8rem; line-height: 1.5; }
	h6 { font-size: 1.5rem; line-height: 1.6; }

@media (min-width: 540px) {
	h1 { font-size: 5.0rem; }
	h2 { font-size: 4.2rem; }
	h3 { font-size: 3.6rem; }
	h4 { font-size: 3.0rem; }
	h5 { font-size: 2.4rem; }
	h6 { font-size: 1.5rem; }
}

p { margin-top: 0; }

a { color: #3580f0; text-decoration: none; transition: all 0.2s ease-in-out 0s; }
	a:hover { color: #2872d6; }

hr {
	margin-top: 3rem;
	margin-bottom: 3.5rem;
	border-width: 0;
	border-top: 1px solid #e1e1e1;
}

code {
	padding: .2rem .5rem;
	margin: 0 .2rem;
	font-size: 90%;
	white-space: nowrap;
	background: #f1f1f1;
	border: 1px solid #e1e1e1;
	border-radius: 4px;
}
	pre > code {
		display: block;
		padding: 1rem 1.5rem;
		white-space: pre;
	}

/*	----------------------------------------------
	LAYOUT
 	---------------------------------------------- */
.container {
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 2rem auto;
	padding: 0 60px;
	box-sizing: border-box;
}
.container-fluid {
	position: relative;
	width: 100%;
	margin: 2rem;
	padding: 0 60px;
	box-sizing: border-box;
}
.column, .columns {
	width: 100%;
	float: left;
	box-sizing: border-box;
}

@media (min-width: 400px) {
	.container, .container-fluid {
		width: 85%;
		padding: 0;
	}
}

@media (min-width: 540px) {
	.container { width: 80%; }
}

.container:after, .container-fluid:after {
	content: "";
	display: table;
	clear: both;
}

/*	----------------------------------------------
	FLEXGRID
 	---------------------------------------------- */
.flex-grid {
	box-sizing: border-box;
	margin: 0 auto;
	padding: 0;
}

.fg-row {
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}

.fg-row-align-center { justify-content: center; }
.fg-row-reverse { flex-direction: row-reverse; }

.fg-xs-1, .fg-sm-1, .fg-md-1, .fg-lg-1, .fg-xs-2, .fg-sm-2, .fg-md-2, .fg-lg-2,
.fg-xs-3, .fg-sm-3, .fg-md-3, .fg-lg-3, .fg-xs-4, .fg-sm-4, .fg-md-4, .fg-lg-4,
.fg-xs-5, .fg-sm-5, .fg-md-5, .fg-lg-5, .fg-xs-6, .fg-sm-6, .fg-md-6, .fg-lg-6,
.fg-xs-7, .fg-sm-7, .fg-md-7, .fg-lg-7, .fg-xs-8, .fg-sm-8, .fg-md-8, .fg-lg-8,
.fg-xs-9, .fg-sm-9, .fg-md-9, .fg-lg-9, .fg-xs-10, .fg-sm-10, .fg-md-10, .fg-lg-10,
.fg-xs-11, .fg-sm-11, .fg-md-11, .fg-lg-11, .fg-xs-12, .fg-sm-12, .fg-md-12, .fg-lg-12 {
	box-sizing: border-box;
	padding: 0.25rem;
	width: 100%;
}

@media (min-width: 540px) {
	.flex-grid { max-width: 540px; 	}
	.fg-xs-1 {
		max-width: calc(100% * (1 / 12));
		width: calc(100% * (1 / 12));
	}
	.fg-xs-2 {
		max-width: calc(100% * (2 / 12));
		width: calc(100% * (2 / 12));
	}
	.fg-xs-3 {
		max-width: calc(100% * (3 / 12));
		width: calc(100% * (3 / 12));
	}
	.fg-xs-4 {
		max-width: calc(100% * (4 / 12));
		width: calc(100% * (4 / 12));
	}
	.fg-xs-5 {
		max-width: calc(100% * (5 / 12));
		width: calc(100% * (5 / 12));
	}
	.fg-xs-6 {
		max-width: calc(100% * (6 / 12));
		width: calc(100% * (6 / 12));
	}
	.fg-xs-7 {
		max-width: calc(100% * (7 / 12));
		width: calc(100% * (7 / 12));
	}
	.fg-xs-8 {
		max-width: calc(100% * (8 / 12));
		width: calc(100% * (8 / 12));
	}
	.fg-xs-9 {
		max-width: calc(100% * (9 / 12));
		width: calc(100% * (9 / 12));
	}
	.fg-xs-10 {
		max-width: calc(100% * (10 / 12));
		width: calc(100% * (10 / 12));
	}
	.fg-xs-11 {
		max-width: calc(100% * (11 / 12));
		width: calc(100% * (11 / 12));
	}
	.fg-xs-12 {
		max-width: calc(100% * (12 / 12));
		width: calc(100% * (12 / 12));
	}
}
@media (min-width: 768px) {
	.flex-grid { max-width: 768px; }
	.fg-sm-1 {
		max-width: calc(100% * (1 / 12));
		width: calc(100% * (1 / 12));
	}
	.fg-sm-2 {
		max-width: calc(100% * (2 / 12));
		width: calc(100% * (2 / 12));
	}
	.fg-sm-3 {
		max-width: calc(100% * (3 / 12));
		width: calc(100% * (3 / 12));
	}
	.fg-sm-4 {
		max-width: calc(100% * (4 / 12));
		width: calc(100% * (4 / 12));
	}
	.fg-sm-5 {
		max-width: calc(100% * (5 / 12));
		width: calc(100% * (5 / 12));
	}
	.fg-sm-6 {
		max-width: calc(100% * (6 / 12));
		width: calc(100% * (6 / 12));
	}
	.fg-sm-7 {
		max-width: calc(100% * (7 / 12));
		width: calc(100% * (7 / 12));
	}
	.fg-sm-8 {
		max-width: calc(100% * (8 / 12));
		width: calc(100% * (8 / 12));
	}
	.fg-sm-9 {
		max-width: calc(100% * (9 / 12));
		width: calc(100% * (9 / 12));
	}
	.fg-sm-10 {
		max-width: calc(100% * (10 / 12));
		width: calc(100% * (10 / 12));
	}
	.fg-sm-11 {
		max-width: calc(100% * (11 / 12));
		width: calc(100% * (11 / 12));
	}
	.fg-sm-12 {
		max-width: calc(100% * (12 / 12));
		width: calc(100% * (12 / 12));
	}
}
@media (min-width: 992px) {
	.flex-grid { max-width: 992px; }
	.fg-md-1 {
		max-width: calc(100% * (1 / 12));
		width: calc(100% * (1 / 12));
	}
	.fg-md-2 {
		max-width: calc(100% * (2 / 12));
		width: calc(100% * (2 / 12));
	}
	.fg-md-3 {
		max-width: calc(100% * (3 / 12));
		width: calc(100% * (3 / 12));
	}
	.fg-md-4 {
		max-width: calc(100% * (4 / 12));
		width: calc(100% * (4 / 12));
	}
	.fg-md-5 {
		max-width: calc(100% * (5 / 12));
		width: calc(100% * (5 / 12));
	}
	.fg-md-6 {
		max-width: calc(100% * (6 / 12));
		width: calc(100% * (6 / 12));
	}
	.fg-md-7 {
		max-width: calc(100% * (7 / 12));
		width: calc(100% * (7 / 12));
	}
	.fg-md-8 {
		max-width: calc(100% * (8 / 12));
		width: calc(100% * (8 / 12));
	}
	.fg-md-9 {
		max-width: calc(100% * (9 / 12));
		width: calc(100% * (9 / 12));
	}
	.fg-md-10 {
		max-width: calc(100% * (10 / 12));
		width: calc(100% * (10 / 12));
	}
	.fg-md-11 {
		max-width: calc(100% * (11 / 12));
		width: calc(100% * (11 / 12));
	}
	.fg-md-12 {
		max-width: calc(100% * (12 / 12));
		width: calc(100% * (12 / 12));
	}
}
@media (min-width: 1200px) {
	.flex-grid { max-width: 1200px; }
	.fg-lg-1 {
		max-width: calc(100% * (1 / 12));
		width: calc(100% * (1 / 12));
	}
	.fg-lg-2 {
		max-width: calc(100% * (2 / 12));
		width: calc(100% * (2 / 12));
	}
	.fg-lg-3 {
		max-width: calc(100% * (3 / 12));
		width: calc(100% * (3 / 12));
	}
	.fg-lg-4 {
		max-width: calc(100% * (4 / 12));
		width: calc(100% * (4 / 12));
	}
	.fg-lg-5 {
		max-width: calc(100% * (5 / 12));
		width: calc(100% * (5 / 12));
	}
	.fg-lg-6 {
		max-width: calc(100% * (6 / 12));
		width: calc(100% * (6 / 12));
	}
	.fg-lg-7 {
		max-width: calc(100% * (7 / 12));
		width: calc(100% * (7 / 12));
	}
	.fg-lg-8 {
		max-width: calc(100% * (8 / 12));
		width: calc(100% * (8 / 12));
	}
	.fg-lg-9 {
		max-width: calc(100% * (9 / 12));
		width: calc(100% * (9 / 12));
	}
	.fg-lg-10 {
		max-width: calc(100% * (10 / 12));
		width: calc(100% * (10 / 12));
	}
	.fg-lg-11 {
		max-width: calc(100% * (11 / 12));
		width: calc(100% * (11 / 12));
	}
	.fg-lg-12 {
		max-width: calc(100% * (12 / 12));
		width: calc(100% * (12 / 12));
	}
}

/*	----------------------------------------------
	BUTTONS
 	---------------------------------------------- */
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
	display: inline-block;
	height: 38px;
	padding: 0 30px;
	color: #555555;
	text-align: center;
	font-size: 11px;
	font-weight: 600;
	line-height: 38px;
	letter-spacing: .1rem;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	background-color: transparent;
	border-radius: 4px;
	border: 1px solid #d1d1d1;
	cursor: pointer;
	box-sizing: border-box;
	transition: all 0.2s ease-in-out 0s;
}
	.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover,
	.button:focus, button:focus, input[type="submit"]:focus, input[type="reset"]:focus, input[type="button"]:focus {
		color: #333333;
		border-color: #888888;
		outline: 0;
	}
.button.button-primary, button.button-primary, input[type="submit"].button-primary, input[type="reset"].button-primary, input[type="button"].button-primary {
	color: #ffffff;
	background-color: #3580f0;
	border-color: #3580f0;
}
	.button.button-primary:hover, button.button-primary:hover, input[type="submit"].button-primary:hover, input[type="reset"].button-primary:hover, input[type="button"].button-primary:hover,
	.button.button-primary:focus, button.button-primary:focus, input[type="submit"].button-primary:focus, input[type="reset"].button-primary:focus, input[type="button"].button-primary:focus {
		color: #ffffff;
		background-color: #2872d6;
		border-color: #2872d6;
	}
.button.button-secondary, button.button-secondary, input[type="submit"].button-secondary, input[type="reset"].button-secondary, input[type="button"].button-secondary {
	color: #ffffff;
	background-color: #6c757d;
	border-color: #6c757d;
}
	.button.button-secondary:hover, button.button-secondary:hover, input[type="submit"].button-secondary:hover, input[type="reset"].button-secondary:hover, input[type="button"].button-secondary:hover,
	.button.button-secondary:focus, button.button-secondary:focus, input[type="submit"].button-secondary:focus, input[type="reset"].button-secondary:focus, input[type="button"].button-secondary:focus {
		color: #ffffff;
		background-color: #5c6872;
		border-color: #5c6872;
	}
.button.button-info, button.button-info, input[type="submit"].button-info, input[type="reset"].button-info, input[type="button"].button-info {
	color: #ffffff;
	background-color: #33c3f0;
	border-color: #33c3f0;
}
	.button.button-info:hover, button.button-info:hover, input[type="submit"].button-info:hover, input[type="reset"].button-info:hover, input[type="button"].button-info:hover,
	.button.button-info:focus, button.button-info:focus, input[type="submit"].button-info:focus, input[type="reset"].button-info:focus, input[type="button"].button-info:focus {
		color: #ffffff;
		background-color: #1eaedb;
		border-color: #1eaedb;
	}
.button.button-success, button.button-success, input[type="submit"].button-success, input[type="reset"].button-success, input[type="button"].button-success {
	color: #ffffff;
	background-color: #30ba74;
	border-color: #30ba74;
}
	.button.button-success:hover, button.button-success:hover, input[type="submit"].button-success:hover, input[type="reset"].button-success:hover, input[type="button"].button-success:hover,
	.button.button-success:focus, button.button-success:focus, input[type="submit"].button-success:focus, input[type="reset"].button-success:focus, input[type="button"].button-success:focus {
		color: #ffffff;
		background-color: #23a362;
		border-color: #23a362;
	}
.button.button-warning, button.button-warning, input[type="submit"].button-warning, input[type="reset"].button-warning, input[type="button"].button-warning {
	color: #ffffff;
	background-color: #e1b42a;
	border-color: #e1b42a;
}
	.button.button-warning:hover, button.button-warning:hover, input[type="submit"].button-warning:hover, input[type="reset"].button-warning:hover, input[type="button"].button-warning:hover,
	.button.button-warning:focus, button.button-warning:focus, input[type="submit"].button-warning:focus, input[type="reset"].button-warning:focus, input[type="button"].button-warning:focus {
		color: #ffffff;
		background-color: #d0a31b;
		border-color: #d0a31b;
	}
.button.button-danger, button.button-danger, input[type="submit"].button-danger, input[type="reset"].button-danger, input[type="button"].button-danger {
	color: #ffffff;
	background-color: #f83345;
	border-color: #f83345;
}
	.button.button-danger:hover, button.button-danger:hover, input[type="submit"].button-danger:hover, input[type="reset"].button-danger:hover, input[type="button"].button-danger:hover,
	.button.button-danger:focus, button.button-danger:focus, input[type="submit"].button-danger:focus, input[type="reset"].button-danger:focus, input[type="button"].button-danger:focus {
		color: #ffffff;
		background-color: #e31e31;
		border-color: #e31e31;
	}
.button.button-dark, button.button-dark, input[type="submit"].button-dark, input[type="reset"].button-dark, input[type="button"].button-dark {
	color: #ffffff;
	background-color: #2c323b;
	border-color: #2c323b;
}
	.button.button-dark:hover, button.button-dark:hover, input[type="submit"].button-dark:hover, input[type="reset"].button-dark:hover, input[type="button"].button-dark:hover,
	.button.button-dark:focus, button.button-dark:focus, input[type="submit"].button-dark:focus, input[type="reset"].button-dark:focus, input[type="button"].button-dark:focus {
		color: #ffffff;
		background-color: #12161b;
		border-color: #12161b;
	}

button, .button { margin-bottom: 1rem; }

/*	----------------------------------------------
	FORMS
 	---------------------------------------------- */
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select {
	height: 38px;
	padding: 6px 10px;
	background-color: #ffffff;
	border: 1px solid #d1d1d1;
	border-radius: 4px;
	box-shadow: none;
	box-sizing: border-box;
}
	input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}
textarea {
	min-height: 65px;
	padding-top: 6px;
	padding-bottom: 6px;
}
input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
	border: 1px solid #33c3f0;
	outline: 0;
}
label, legend {
	display: block;
	margin-bottom: .5rem;
	font-weight: 500;
	font-size: 90%;
}
fieldset {
	padding: 0;
	border-width: 0;
}
input[type="checkbox"], input[type="radio"] { display: inline; }
label > .label-body {
	display: inline-block;
	margin-left: .5rem;
	font-weight: normal;
}
input, textarea, select, fieldset { margin-bottom: 1rem; }

/*	----------------------------------------------
	LISTS
 	---------------------------------------------- */
ul { list-style: circle inside; }
ol { list-style: decimal inside; }
	ol, ul {
		padding-left: 0;
		margin-top: 0;
	}
	ul ul, ul ol, ol ol, ol ul {
		margin: 0.5rem 0 0.5rem 2rem;
		font-size: 90%;
	}
	li { margin-bottom: 0.5rem; }

/*	----------------------------------------------
	LIST GROUPS
 	---------------------------------------------- */
.list-group {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    border-radius: 0.25rem;
}
.list-group-item {
    position: relative;
    display: block;
    padding: 0.5rem 1rem;
    color: #212529;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.125);
	margin-bottom: 0;
}
	.list-group-item:first-child {
		border-top-left-radius: inherit;
		border-top-right-radius: inherit;
	}
	.list-group-item + .list-group-item { border-top-width: 0; }
	.list-group-item:last-child {
		border-bottom-right-radius: inherit;
		border-bottom-left-radius: inherit;
	}

/*	----------------------------------------------
	TABLES
 	---------------------------------------------- */
th { background: #f2f2f2; }
th, td {
	font-size: 90%;
	padding: 6px 12px;
	text-align: left;
	border-bottom: 1px solid #e1e1e1;
}
	th:first-child { border-top-left-radius: 4px; }
	th:last-child { border-top-right-radius: 4px; }

/*	----------------------------------------------
	UTILITIES
 	---------------------------------------------- */
pre, blockquote, dl, figure, table, p, ul, ol, form { margin-bottom: 1rem; }

.full-width {
	width: 100%;
	box-sizing: border-box;
}

.pull-right { float: right; }
.pull-left { float: left; }

.text-primary { color: #3580f0; }
.text-secondary { color: #6c757d; }
.text-info { color: #33c3f0; }
.text-success { color: #30ba74; }
.text-warning { color: #e1b42a; }
.text-danger { color: #f83345; }
.text-dark { color: #2c323b; }

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

.clearfloat {
	content: "";
	display: table;
	clear: both;
}

/*	----------------------------------------------
	MEDIA QUERIES
 	---------------------------------------------- */
@media (min-width: 400px) {}
@media (min-width: 540px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1200px) {}