@import "compass/reset";
@import "compass/css3";

$text-shadow : 1px 1px 1px rgba(0, 0, 0, 0.2);

$major-height: 24px;
$minor-height: 12px;

$fonts: "Open Sans", helvetica, arial, sans-serif;


// Flatby Color Scheme
$main-background: #edeae9;
$dark-background: #444;
$color-background: #6ea164;

$primary-text-color: #707070;
$primary-link-color: #ffffff;
$secondary-text-color: #838383;
$navigation-link-color: #cecece;

$universal-border-color: #595959;
$universal-border-color-light: #cdcdcd;




body {
	font-family: $fonts;
	font-weight: 100;
	background: $main-background;
	color: $primary-text-color;
	line-height: 1.75em;
	font-size: 1em;
}

h1, h2, h3, h4, h5 {
	margin-bottom: $minor-height;

	&.big {
		font-weight: 900;
	}
}

h1 {
	font-size: 2.2em;
	line-height: 1em;
}

h2 {
	font-size: 1.5em;
}

h3 {
	font-size: 1.2em;
}

h4 {
	font-size: 1.1em;
}

a {
	color: inherit;
}

p {
	margin-bottom: 1em;
}

strong {
	font-weight: 500;
}

.clear {
	clear: both;
}

.lefty {
	float: left;
}

img.lefty {
	margin-right: 12px;
}

.righty {
	float: right;
}

img.righty {
	margin-left: 12px;
}

ul {
	margin: 0;
	padding: 0;

	li {
		padding-left: 1em;
		list-style: inside disc;
	}
}

//
// Generic Structure Styles
//

section, article, .container {
	@include box-sizing(border-box);
	padding: 2em;
	background: #fff;
//	border-radius: 4px;
	position: relative;

	article {
		float: left;
		width: 50%;
	}

	&.blank {
		padding: 0;
		background: none;
	}

	&.wide {
		@include box-sizing(border-box);
		max-width: 100%;
		> div {
			@include box-sizing(border-box);
			width: 100%;
		}
	}

	&.blurb {
		text-align: center;
		background: #252525;

		background-image: linear-gradient(top, rgb(68,68,68) 0%, rgb(36,36,36) 100%);
		background-image: -o-linear-gradient(top, rgb(68,68,68) 0%, rgb(36,36,36) 100%);
		background-image: -moz-linear-gradient(top, rgb(68,68,68) 0%, rgb(36,36,36) 100%);
		background-image: -webkit-linear-gradient(top, rgb(68,68,68) 0%, rgb(36,36,36) 100%);
		background-image: -ms-linear-gradient(top, rgb(68,68,68) 0%, rgb(36,36,36) 100%);

		background-image: -webkit-gradient(
			linear,
			left top,
			left bottom,
			color-stop(0, rgb(68,68,68)),
			color-stop(1, rgb(36,36,36))
		);

		color: #f0f0f0;

		> div {
			padding: 3em 3em;
		}

		h1, h2, p {
			text-shadow: $text-shadow;
		}

		h1 {
			font-weight: 100;
			font-size: 6em;
			opacity: 1;
			text-transform: uppercase;
			letter-spacing: 0.2em;
			margin-bottom: $major-height;
		}

		h2 {
			margin-bottom: 0.3em;
			font-size: 1.2em;
			text-transform: uppercase;
			letter-spacing: 0.2em;
			color: #949494;
		}

		p {
			margin-bottom: 0;
			font-size: 1em;
			color: #949494;
		}
	}

	img {
		max-width: 100%;
	}

	p {
		&.last-child {

		}
	}
}



body > section, body > header, body > footer, .container {
	max-width: 1180px;
	margin: 0 auto;
	margin-bottom: 20px;
}

//
// Site Navigation (menu, breadcrumbs, tabs, dropdowns)
//

nav {
	&.navigation {

		&.big {
			ul {
				li {
					a {
						padding: 1.5em;

						&.focus {
							padding: 1.5em;
						}
					}
				}
			}
		}

		background: $dark-background;
		margin-top: 2em;
	//	border-radius: 4px;
		
		> ul {
			list-style: none;
			margin: 0;
			padding: 0;
			

			> li {
				display: inline;
				border: 0;
				padding: 0;

				&:first-child {
					a {
						&:hover {
							border-bottom-left-radius: 4px;
							border-top-left-radius: 4px;
						}
					}
				}

				&.last-menu-item {
					a {
						&:hover {
							border-bottom-right-radius: 4px;
							border-top-right-radius: 4px;
						}
					}
				}

				&.lefty {
					float: right;
				}

				> a {
					color: $navigation-link-color;
					display: block;
					font-weight: 500;
					text-shadow: none;
					float: left;
					background: inherit;
					padding: 1em 1.5em;
					text-decoration: none;

					&:hover {
						background: rgba(255, 255, 255, 0.2);
					}

					&.focus {
						background: rgba(255, 255, 255, 0.2);
						padding: 1em 1.8em;
					}

					&.navigation-home {
						&:hover {
							background: #00986a;
							color: $primary-link-color;
						}
					}

					&.navigation-settings {
						&:hover {
							background: #00986a;
							color: $primary-link-color;
						}
					}

					&.navigation-user {
						&:hover {
							background: #00986a;
							color: $primary-link-color;
						}
					}
				}
			}
		}
	}

	&.tabs {
		background: none;

		ul {

			li {

				a {
					
					color: inherit;
					border: 1px solid rgba(0, 0, 0, 0.0);

					border-bottom: 1px solid $universal-border-color-light;

					&.active {
						border: 1px solid $universal-border-color-light;
						border-bottom: 1px solid rgba(0, 0, 0, 0.0);
						margin-right: -1px;
					}

					&:hover {
						background: rgba(0, 0, 0, 0.1);
					}
				}
			}
		}
	}

	&.breadcrumbs {
		padding-left: 1em;
		font-size: 0.85em;
		color: $secondary-text-color;

		ul {
			li {
				display: inline;

				&:last-child {
					font-weight: 500;
					color: $dark-background;
				}

				a {
					display: inline;
					float: none;
					text-decoration: none;
					color: inherit;

					&:hover {
						color: $dark-background;
					}
				}

				i {
					position: relative;
					margin-left: 4px;
					margin-right: 4px;
				}
			}
		}
	}
}


ul.dropdown {
	display: inline-block;
	border-radius: 4px;
	background: $dark-background;
	color: #fff;
	min-width: 350px;

	&:before {
		content: ' ';
		display: block;
		background: none;
		width: 1px;
		height: 1px;
		position: absolute;
		left: 20px;
		top: -10px;
		border: 5px solid rgba(0, 0, 0, 0.0);
		border-bottom: 5px solid $dark-background;
	}

	li {
		list-style: none;
		margin: 0;
		padding: 0;

		a {
			display: block;
			padding: 0.75em 1em;
			border-bottom: 1px solid $universal-border-color;
			text-decoration: none;
			color: $navigation-link-color;

			&:hover {
				background: rgba(0, 0, 0, 0.2);
			}
		}

		&:last-child {
			a {
				border-bottom: 0;
			}
			
		}
	}
}

//
// Typography Stuff
//

.typography {
	
}


//
// Buttons & Forms
//

.button, input[type="button"], button {
	@include box-sizing(border-box);
	background: $dark-background;
	padding: 1em 3em;
	margin: 0;
	text-decoration: none;
	color: #fff;
	border: 0px;
	font-size: 1em;
	font-family: "Open Sans", helvetica, arial, sans-serif;
	cursor: pointer;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
	position: relative;
	display: inline-block;

	transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;

	&:hover {
		background: #000;
	}

	&.button-and-icon {
		padding-left: 6.5em;

		div {
			background: rgba(0, 0, 0, 0.2);
			display: inline-block;
			padding: 1em 1.4em;
			position: absolute;
			top: 0px;
			left: 0px;
		}
	}

	&.button-small {
		padding: 0.5em 1.5em;
		font-size: 0.8em;
		font-weight: 500;
	}

	&.button-inverted {
		background: #f9f9f9;
		color: #444;
		border: 3px solid #ececec;
	}

	&.button-submit {
		background: #00986a;
		
		&:hover {
			background: #000;
		}
	}

	&.button-cancel {
		background: #a1a1a1;
		
		&:hover {
			background: #000;
		}
	}

	&.button-delete {
		background: #d74518;
		
		&:hover {
			background: #000;
		}
	}

	&.button-adjacent {
		border-bottom-left-radius: 0;
		border-top-left-radius: 0;
	}

	&.button-cta {
		display: inline-block;
		font-size: 1.3em;
		background: $dark-background;
		margin-top: 1em;
		padding: 1em 4em;
		text-transform: uppercase;
		font-weight: 500;
		letter-spacing: 0.2em;

		&:hover {
			background: #000;
		}
	}

	&.button-buy {
		display: inline-block;
		width: 100%;
		text-align: center;
		font-weight: 500;
		text-transform: uppercase;
		margin-top: 1em;

		&:hover {
			background: #000;
		}
	}

	.notification {
		position: absolute;
		right: 0px;
		top: 0px;
		font-size: 0.75em;
		line-height: 1em;
		background: #e27066;
		display: block;
		padding: 0.5em;
		color: #fff;
	}
}

label {
	display: block;
	margin-bottom: 1em;

	h2 {
		font-size: 1em;
		margin: 0;
		margin-bottom: 0.2em;
	}
}

form {
	h1 {
		margin-left: 14px;
	}

	label {
		margin-left: 14px;
	}
}

input[type="text"], input[type="password"], textarea {
	background: #f6f6f6;
	border: 0;
	font-family: "Open Sans", helvetica, arial, sans-serif;
	padding: 1em 1.3em;
	margin: 0;
	margin-left: -14px;
	font-weight: 100;
	font-size: 1em;

	&.long {
		width: 350px;
	}

	&.button-adjacent {
		border-bottom-right-radius: 0;
		border-top-right-radius: 0;
	}
}

textarea {
	width: 400px;
	height: 180px;

	&.long {
		width: 600px;
	}
}

hr {
	width: 100%;
	height: 1px;
	background: #8d8d8d;
	margin-top: 1em;
	margin-bottom: 1em;
	border: 0px;
	opacity: 0.2;
}

//
// Generic site elements (items, featured items, sliders, )
//

.item {
	@include box-sizing(border-box);
	border-radius: 4px;
	width: 33%;
	background: #fff;

	.item-info {
		padding: 1em 2em;
		padding-bottom: 2em;
	}

	h1 {
		font-size: 1.5em;
		font-weight: 500;
	}

	p {
		font-size: 0.9em;
		color: #7d7d7d;
	}

	img {
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
	}
}

.item-featured {
	@include box-sizing(border-box);
//	border-radius: 4px;
	background: #fff;

	.item-info {
		padding: 2em;

		.button-buy {
			width: auto;
			margin-left: -10px;
		}
	}

	img {
		width: 50%;
		float: left;
		margin-right: 2em;
		border-radius: 0px;
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}
}

.price {
	display: block;
	font-size: 1.4em;
	font-weight: 500;
}

.slider {
	text-align: center;
	position: relative;
	height: 450px;
	overflow: hidden;

	img {
		max-width: 100%;
		width: 100%;
		width: auto;
		position: absolute;
		left: 0px;
		top: 0px;
		z-index: 100;
	}

	* {
		position: relative;
		z-index: 101;
	}

	h1 {
		font-weight: 500;
		color: #fff;
		font-size: 4em;
		margin-top: 100px;
	}

	h2 {
		color: #fff;
	}

	.slider-controls {
		position: absolute;
		top: 45%;
		width: 100%;
		z-index: 101;

		a {
			text-decoration: none;
			position: absolute;
			display: block;
			width: 40px;
			height: 40px;
			background: rgba(0, 0, 0, 0.3);
			text-align: center;
			color: #fff;

			&:hover {
				background: rgba(0, 0, 0, 0.8);
			}

			i {
				position: relative;
				top: 4px;
				opacity: 0.8;
			}

			&.slider-control-left {
				left: 0px;
			}

			&.slider-control-right {
				right: 0px;
			}
		}
	}
}

.progress-bar {
	@include box-sizing(border-box);
	background: #cecece;
	color: #fff;
	font-weight: 500;
	text-shadow: $text-shadow;

	> div {
		background: #6ea164;
		padding: 1em;
	}

	.progress-bar-10 {
		width: 10%;
	}
	
	.progress-bar-20 {
		width: 20%;
	}
	
	.progress-bar-30 {
		width: 30%;
	}
	
	.progress-bar-40 {
		width: 40%;
	}
	
	.progress-bar-50 {
		width: 50%;
	}
	
	.progress-bar-60 {
		width: 60%;
	}
	
	.progress-bar-70 {
		width: 70%;
	}
	
	.progress-bar-80 {
		width: 80%;
	}
	
	.progress-bar-90 {
		width: 90%;
	}
	
	.progress-bar-100 {
		width: 100%;
	}

	&.progress-bar-small {
		> div {
			padding: 0.2em 1em;
		}
	}
}

.item-header {
	color: #fff;
	font-weight: 500;
	display: block;
	text-align: center;
	background: $dark-background;
	font-size: 1.3em;
	padding: 1em;
	letter-spacing: 2px;
	margin: 0;
	text-decoration: none;
}

.comments {
	h1, h2 {// Going to have to switch this to something i can @extend
		margin-left: 14px;
	}

	h1 {
		margin-bottom: 0.1em;
	}

	h2 {
		font-size: 1em;
	}

	form {
		h2 {
			margin-left: 0px;
		}

		textarea {
			height: 80px;
		}
	}

	.comment {
		h3 {
			font-weight: 500;
			margin-bottom: 0;
		}

		p {
			font-size: 0.9em;
		}

		padding: 1.5em;
		border: 1px solid #e8e8e8;
		margin-bottom: 1em;
	}
}

.item-footer {
	@extend h1;
	@extend .item-header;
	font-size: 1em;

	&.green {
		background: #00986a;
	}
}

.activity {
	@include box-sizing(border-box);
	background: $dark-background;
	width: 300px;

	.activity-list-update {
		padding: 6px;
		color: #e0e0e0;
		font-size: 0.9em;
		border-top: 1px solid #5a5a5a;
		line-height: 1.3em;

		&:hover {
			background: rgba(0, 0, 0, 0.1);
		}
	}


	h1 {

	}

	p {
		position: relative;
		top: 1em;
	}

	h2 {
		font-size: 1em;
		font-weight: 500;
		opacity: 0.5;
	}

	img {
		float: left;
		margin: 10px;
	}
}



//
// Presentation styles for flatby
//

section.flatby {
	@extend .blurb;
	border-radius: 0px;
	background: none;
	background-repeat: no-repeat;
	background-position: center 40px;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABrCAYAAACBtCeBAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkY1RTEyMEU1MENCNjExRTM5NkJEQTQxNTIxOEMzMkVFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkY1RTEyMEU2MENCNjExRTM5NkJEQTQxNTIxOEMzMkVFIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RjVFMTIwRTMwQ0I2MTFFMzk2QkRBNDE1MjE4QzMyRUUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RjVFMTIwRTQwQ0I2MTFFMzk2QkRBNDE1MjE4QzMyRUUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4+pJRhAAAGzklEQVR42uzdXUwc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);

	h1 {
		font-size: 1.3em;
		color: #727272;
		text-shadow: none;
		font-weight: 100;
		margin-top: 140px;
		text-transform: none;
		letter-spacing: 0px;

		span {
			font-weight: 500;
		}
	}

	h2 {
		font-size: 0.9em;
		letter-spacing: 0px;
		font-weight: 500;
		font-weight: 100;
		text-shadow: none;
		text-transform: none;

		a {
			font-weight: 500;
		}
	}

	hr {
		margin-top: 80px;
	}
}

.progress-steps {

	.step {
		background: #fff;
		border-right: 1px solid #f5f5f5;
		@include box-sizing(border-box);
		width: 33.3%;
		float: left;
		text-align: center;
		padding: 3em 1em;
		display: block;
		text-decoration: none;
		height: 360px;

		&:last-child {
			border-right: 0px;
		}

		i {
			opacity: 0.2;
		}

		h1 {
			font-size: 1.5em;
			margin-top: 20px;
		}

		ul {
			display: block;
			text-align: left;
			list-style-type: disc;
			width: 60%;
			margin: 0 auto;
			font-size: 0.8em;

			li {
				margin: 0;
				list-style: none;
			}
		}

		.button {
			text-shadow: none;
			font-weight: 500;

			&:hover {
				background: #fff;
			}
		}

		&:hover {
			background: $color-background;
			color: #fff;
		}
	}
}

.date {
	border-radius: 12px;
	border: 4px solid #f7f7f7;
	width: 120px;
	color: #444;
	@include box-sizing(border-box);background-image: linear-gradient(bottom, rgb(245,245,245) 35%, rgb(255,255,255) 68%);
	background-image: -o-linear-gradient(bottom, rgb(245,245,245) 35%, rgb(255,255,255) 68%);
	background-image: -moz-linear-gradient(bottom, rgb(245,245,245) 35%, rgb(255,255,255) 68%);
	background-image: -webkit-linear-gradient(bottom, rgb(245,245,245) 35%, rgb(255,255,255) 68%);
	background-image: -ms-linear-gradient(bottom, rgb(245,245,245) 35%, rgb(255,255,255) 68%);

	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.35, rgb(245,245,245)),
		color-stop(0.68, rgb(255,255,255))
	);

	span {
		display: block;
		width: 100%;
		text-align: center;
		height: 50px;
		@include box-sizing(border-box);

		&.month {
			font-weight: 800;
			font-size: 12px;
			padding-left: 10px;
			text-transform: uppercase;
			color: #cecece;
			text-align: left;

			background-image: linear-gradient(bottom, rgb(245,245,245) 0%, rgb(255,255,255) 100%);
			background-image: -o-linear-gradient(bottom, rgb(245,245,245) 0%, rgb(255,255,255) 100%);
			background-image: -moz-linear-gradient(bottom, rgb(245,245,245) 0%, rgb(255,255,255) 100%);
			background-image: -webkit-linear-gradient(bottom, rgb(245,245,245) 0%, rgb(255,255,255) 100%);
			background-image: -ms-linear-gradient(bottom, rgb(245,245,245) 0%, rgb(255,255,255) 100%);

			background-image: -webkit-gradient(
				linear,
				left bottom,
				left top,
				color-stop(0, rgb(245,245,245)),
				color-stop(1, rgb(255,255,255))
			);
		}

		&.day {
			font-weight: 800;
			font-size: 72px;
			position: relative;
			top: -15px;
		}

		&:first-child {
			border-bottom: 1px solid #e9e9e9;
		}
	}
}

.close {
	position: absolute;
	top: 2px;
	right: 10px;
	text-decoration: none;
	opacity: 0.5;

	&:hover {
		opacity: 1;
	}
}

//
// Alerts
//

.flash {
	position: relative;
	padding: 1em;
//	border-radius: 4px;
	color: #fff;
	background: #303030;
	text-align: center;
	margin-bottom: 1em;

	p {
		margin-bottom: 0;
	}

	&.error {
		background: #f2594b;
	}

	&.success {
		background: #14a19a;
	}
}




