@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
@charset "UTF-8";
@import url('http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600');
@import url('font-awesome.min.css');

/*
	Parallelism by HTML5 UP
	html5up.net | @n33co
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

	@import "libs/skel";

	@include skel-breakpoints((
		desktop: '(min-width: 737px)',
		mobile: '(max-width: 736px)'
	));

	@include skel-layout((
		reset: 'full',
		boxModel: 'border'
	));

/* Basic */

	body {
		position: relative;
		background-color: #12151D;
		color: #999;
		color: rgba(255, 255, 255, 0.6);
		font-family: 'Source Sans Pro';
		font-weight: 400;

		&.is-loading {
			*, *:before, *:after {
				@include vendor('animation', 'none !important');
				@include vendor('transition', 'none !important');
			}
		}
	}

	a {
		color: #fff;
		color: rgba(255, 255, 255, 0.85);
		text-decoration: none;
		@include vendor('transition', 'color 0.25s ease-in-out');

		&:hover {
			color: #d64760;
		}
	}

	h1, h2, h3, h4, h5, h6 {
		font-weight: 400;
		color: #fff;
		letter-spacing: -0.05em;
	}

	strong, b {
		color: #fff;
		color: rgba(255, 255, 255, 0.85);
		font-weight: 600;
	}

/* List */

	ul {
		&.contact {
			cursor: default;
			margin: 0 0 1em 0;

			li {
				display: inline-block;
				font-size: 1.5em;

				span {
					display: none;
				}

				a {
					opacity: 0.35;
					color: #fff;
					@include vendor('transition', 'opacity 0.25s ease-in-out');

					&:hover {
						opacity: 1.0;
					}
				}
			}
		}
	}

/* Item */

	.item {
		&.thumb {
			display: block;
			position: relative;
			background: #1a1f2c;
			background: rgba(255, 255, 255, 0.25);
			cursor: default;

			h2 {
				position: absolute;
				bottom: 0;
				left: 0;
				background: #1a1f2c;
				background: rgba(18, 21, 29, 0.85);
				width: 100%;
				padding: 1em;
				font-weight: 400;
				line-height: 1em;
				z-index: 2;
			}

			img {
				display: block;
				z-index: 1;
			}
		}
	}

/* Icons */

	.icon {
		position: relative;
		text-decoration: none;

		&:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			text-transform: none !important;
		}

		> .label {
			display: none;
		}
	}

/* Wrapper */

	#wrapper {
		position: relative;
		z-index: 1;
	}

/* Main */

	#main {
	}

/* Header */

	#header {
		position: relative;
		background: #d64760 url('images/overlay.png');
		color: #fff;
		cursor: default;

		p {
			opacity: 0.65;
		}
	}

/* Desktop */

	@include breakpoint(desktop) {

		/* Basic */

			html {
				height: 100%;
			}

			body {
				@include vendor('background-image', ('url("images/overlay.png")', 'linear-gradient(top, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.65))', 'url("../../images/bg.jpg")'));
				background-position: top left, bottom left, auto;
				background-size: auto, 100% 100%, cover;
				background-repeat: repeat, no-repeat, auto;
				padding: 0;
				font-size: 12pt;
				line-height: 1.75em;
				height: 100%;
				min-height: 450px;
				min-width: 1000px;
			}

		/* List */

			ul {
				&.contact {
					margin-bottom: 0.5em;

					li {
						margin-left: 1em;
					}
				}
			}

		/* Wrapper */

			#wrapper {
				height: 100%;
				overflow: hidden;
				@include vendor('transition', 'filter 0.25s ease-in-out');

				&.overlayed {
					@include vendor('filter', 'blur(3px)');
				}
			}

		/* Main */

			#main {
				width: 100%;
				position: absolute;
			}

		/* Reel */

			#reel {
				position: relative;
				opacity: 0;

				.item {
					display: block;
					float: left;
					position: relative;
					overflow: hidden;
				}
			}

		/* Header */

			#header {
				padding: 2em 3em;
				xmin-height: 212px;
				vertical-align: middle;

				&:before {
					content: '';
					display: inline-block;
					height: 100%;
					vertical-align: middle;
				}

				.inner {
					display: inline-block;
					vertical-align: middle;
				}

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

				p {
					font-size: 1.25em;
					line-height: 1.5em;
					margin: 0.5em 0 0 0;
				}
			}

		/* Footer */

			#footer {
				position: fixed;
				bottom: 0;
				left: 0;
				width: 100%;
				overflow: hidden;

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

				.left {
					padding: 2em;
					text-align: left;
				}

				.right {
					position: absolute;
					bottom: 0;
					right: 0;
					padding: 2em;
					text-align: right;
				}

				.copyright {
					li {
						display: inline-block;
						margin-left: 1em;
						padding-left: 1em;
						border-left: solid 1px #333;
						border-left-color: rgba(255, 255, 255, 0.25);
						line-height: 1em;

						&:first-child {
							border-left: 0;
							margin-left: 0;
							padding-left: 0;
						}
					}
				}
			}

		/* Popup */

			.poptrox-popup {
				background: #1a1f2c;
				background: rgba(18, 21, 29, 0.9);
				box-shadow: 0px 0px 0px 10px #fff, 0px 10px 60px 10px rgba(8, 11, 19, 0.55);
				cursor: default;

				.loader {
					display: block;
					width: 48px;
					height: 48px;
					position: absolute;
					top: 50%;
					left: 50%;
					margin: -24px 0 0 -24px;
					background: url('images/loader.gif');
					opacity: 0.25;
				}

				.caption {
					position: absolute;
					bottom: 0;
					left: 0;
					background: #1a1f2c;
					background: rgba(18, 21, 29, 0.85);
					display: block;
					width: 100%;
					line-height: 75px;
					text-align: center;
					font-size: 1.25em;
					color: #fff;
				}

				.nav-next, .nav-previous, .closer {
					text-decoration: none;
					font-weight: normal;
					font-style: normal;
					@include vendor('transition', 'opacity 0.25s ease-in-out');
					opacity: 0.35;

					&:hover {
						opacity: 1.0;
					}
				}

				.nav-next, .nav-previous {
					-moz-osx-font-smoothing: grayscale;
					-webkit-font-smoothing: antialiased;
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					text-transform: none !important;
					width: 150px;
					height: 75px;
					position: absolute;
					bottom: 0;
					cursor: pointer;
					font-size: 3em;
					line-height: 75px;
				}

				.nav-next {
					right: 0;
					text-align: right;
					padding-right: 30px;
					&:before {
						content: '\f105';
					}
				}

				.nav-previous {
					left: 0;
					text-align: left;
					padding-left: 30px;
					&:before {
						content: '\f104';
					}
				}

				.closer {
					width: 35px;
					height: 35px;
					font-size: 2em;
					line-height: 35px;
					text-align: center;
					position: absolute;
					top: -70px;
					right: -70px;
					cursor: pointer;
					border-radius: 40px;
					box-shadow: 0px 0px 0px 1px #fff;

					&:before {
						content: "\00d7";
					}
				}
			}

	}

/* Mobile */

	@include breakpoint(mobile) {

		/* Basic */

			body {
				font-size: 12pt;
				line-height: 1.75em;
			}

		/* List */

			ul {
				&.contact {
					li {
						margin: 0 0.35em 0 0.35em;
					}
				}
			}

		/* Item */

			.item {
				border: 0;

				&.thumb {
					width: 50%;
					float: left;
					height: 9em;
					position: relative;

					h2 {
						display: none;
					}

					a {
						position: absolute;
						left: 0;
						top: 0;
						width: 100%;
						height: 100%;
					}

					img {
						display: none;
					}
				}
			}

		/* Wrapper */
			#wrapper.overlayed {
				@include vendor('filter', 'blur(1px)');
			}

		/* Header */

			#header {
				padding: 2.5em 1.5em;
				text-align: center;

				h1 {
					font-size: 2em;
				}

				p {
					font-size: 1em;
					line-height: 1.5em;
					margin: 0.75em 0 0 0;
				}
			}

		/* Main */

			#main {
				overflow: hidden;
			}

		/* Footer */

			#footer {
				padding: 4em 1em;
				text-align: center;

				br {
					display: none;
				}

				.right {
					border-top: solid 1px rgba(255, 255, 255, 0.1);
					margin: 4em 0 0 0;
					padding: 4em 0 0 0;
				}

				.copyright {
					margin: 2em 0 0 0;
				}
			}

		/* Popup */

			.poptrox-popup {
				background: #0a0f1c;
				box-shadow: 0px 0px 30px 10px rgba(8, 11, 19, 0.85);
				border: solid 2.5px #fff;
				@include vendor('box-sizing', 'content-box');
			}

	}