/* Fonts
/* ------------------------------ */
@font-face {
	font-family: icomoon;
	src: url('../style_font/icomoon.eot');
	src: url('../style_font/icomoon.eot?#iefix') format('embedded-opentype'),
	     url('../style_font/icomoon.woff') format('woff'),
	     url('../style_font/icomoon.ttf') format('truetype'),
	     url('../style_font/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal; }

@font-face {
	font-family: 'Bebas Kai';
	src: url('../style_font/BebasKai-Regular.eot');
	src: url('../style_font/BebasKai-Regular.eot?#iefix') format('embedded-opentype'),
	     url('../style_font/BebasKai-Regular.woff') format('woff'),
	     url('../style_font/BebasKai-Regular.ttf') format('truetype'),
	     url('../style_font/BebasKai-Regular.svg#c28975f7bc16b5c3daf2206ee900d152') format('svg');
    font-weight: normal;
    font-style: normal; }
/* ------------------------------ */
/* Fonts */

/* Global
/* ------------------------------ */
html, body {
	margin: 0; padding: 0;
	width: 100%; height: 100%; }

body {
	background-color: #2A2929;
	color: #797979;
	font-size: 0px;
	min-width: 1280px;
	overflow-y: scroll; }

* {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	font-family: 'Bebas Kai', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	-moz-osx-font-smoothing: grayscale !important;
	 -webkit-font-smoothing: antialiased !important; }
/* ------------------------------ */
/* Global */



/* Section: #wrapper
/* ------------------------------ */
#wrapper {
	position: relative;
	min-height: 100%;
	width: 100%; height: auto; }
/* ------------------------------ */
/* Section: #wrapper */

/* Section: #header
/* ------------------------------ */
#header {
	background-color: #4A4A4A;
	border-collapse: collapse;
	margin: 0; padding: 0;
	min-width: 1280px;
	position: fixed;
	top: 0; right: 0; bottom: auto; left: 0;
	width: 100%; height: 80px;
	z-index: 100; }

#header > a {
	display: block;
	position: absolute;
	top: 0; right: 0; bottom: 0; left: calc(50% - 625px / 2);
	z-index: 101; }

#header > div {
	margin: 0 auto; padding: 20px;
	text-align: center;
	width: 625px; height: 100%; }

#header > div:first-of-type,
#header > div:last-of-type {
	margin: 0; padding: 25px 20px;
	position: absolute;
	text-align: left;
	width: calc(50% - 625px / 2); height: 100%; }

#header > div:first-of-type { top: 0; right: auto; bottom: 0; left: 0; }
#header > div:last-of-type { top: 0; right: 0; bottom: 0; left: auto; }
/* ------------------------------ */
/* Section: #header */

/* Section: #menu
/* ------------------------------ */
#menu {
	background-color: #323131;
	margin: 0; padding: 40px 20px;
	overflow-y: auto;
	position: fixed;
	width: auto; height: auto;
	z-index: 100; }

#menu { top: 80px; right: auto; bottom: 0; left: -100%; }
#menu.true { top: 80px; right: auto; bottom: 0; left: 0; }

#menu > * {
	margin: 80px 0; padding; 0; }

#menu > *:first-child { margin-top: 0; }
#menu > *:last-child { margin-bottom: 0; }
/* ------------------------------ */
/* Section: #menu */

/* Section: #content
/* ------------------------------ */
#content {
	margin: 80px 0 0; padding: 0; }
/* ------------------------------ */
/* Section: #content */

/* Section: #lightbox
/* ------------------------------ */
#lightbox {
	background-color: rgba(0, 0, 0, 0.75);
	display: none;
	margin: 0; padding: 40px 20px;
	padding-top: 120px;
	overflow: auto;
	position: fixed;
	text-align: center;
	top: 0; right: 0; bottom: 0; left: 0;
	width: 100%; height: auto;
	z-index: 50; }

#lightbox > div {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	top: 90px; bottom: 10px; right: 10px; left: 10px; }
/* ------------------------------ */
/* Section: #lightbox */



/* Component: .-about
/* ------------------------------ */
.-about {
	margin: 0 auto; padding: 40px 20px;
	width: 1280px; height: auto; }

.-about > div {
	display: inline-block;
	margin: 0 20px; padding: 0;
	vertical-align: top; }

.-about > div:first-of-type { margin-left: 0; width: 290px; }
.-about > div:nth-child(2) { width: 580px; }
.-about > div:last-of-type { margin-right: 0; width: 290px; }

.-about > div > div {
	margin: 50px 0; padding: 0; }

.-about > div > div:first-of-type { margin-top: 0; }
.-about > div > div:last-of-type { margin-bottom: 0; }

.-about > div > .-image { margin-bottom: 10px !important; }
.-about > div > .-social { margin-top: 10px !important; }

.-about > div > div > * {
	margin: 10px 0; padding: 0; }

.-about > div > div > *:first-child { margin-top: 0; }
.-about > div > div > *:last-child { margin-bottom: 0; }

.-about > div > div > h3 {
	color: #C2C2C2;
	font-size: 20px;
	font-weight: normal;
	letter-spacing: 1px;
	line-height: 30px;
	text-transform: uppercase; }

.-about > div > div > div { padding-left: 30px; }
.-about > div > div > div { padding-right: 30px; }

.-about > div > div > img {
	border: none;
	display: block;
	width: 290px; height: auto; }
/* ------------------------------ */
/* Component: .-about */

/* Component: .-album
/* ------------------------------ */
.-album {
	margin: 0 auto; padding: 20px 20px;
	width: 1280px; height: auto; }

.-album > * {
	margin: 10px 0; padding: 0; }

.-album > *:first-child { margin-top: 0; }
.-album > *:last-child { margin-bottom: 0; }
/* ------------------------------ */
/* Component: .-album */

/* Component: .-album-list
/* ------------------------------ */
.-album-list {
	list-style-type: none;
	margin: 0; padding: 0;
	text-align: center;
	white-space: nowrap;
	width: 100%; height: 87px; }

.-album-list > li {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	position: relative;
	width: 155px; height: 87px; }

.-album-list > li > div {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0; }

.-album-list > li.active > div,
.-album-list > li:hover > div {
	background-color: rgba(0, 0, 0, 0.50); }

.-album-list > li > div > div {
	display: table;
	width: 100%; height: 100%; }

.-album-list > li > div > div > a {
	color: transparent;
	display: table-cell;
	font-size: 18px;
	margin: 0; padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	vertical-align: middle;
	white-space: normal; }

.-album-list > li.active > div > div > a,
.-album-list > li:hover > div > div > a {
	color: #FFFFFF; }
/* ------------------------------ */
/* Component: .-album-list */

/* Component: .-album-player
/* ------------------------------ */
.-album-player {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	width: 1240px; height: 698px; }
/* ------------------------------ */
/* Component: .-album-player */

/* Component: .-biography
/* ------------------------------ */
.-biography > div > p {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 17px;
	line-height: 21px;
	margin: 0; padding: 0;
	text-align: justify; }
/* ------------------------------ */
/* Component: .-biography */

/* Component: .-contact
/* ------------------------------ */
.-contact > div > ul {
	list-style-type: none;
	margin: 0; padding: 0; }

.-contact > div > ul > li {
	display: block;
	margin: 20px 0; padding: 0; }

.-contact > div > ul > li:first-of-type { margin-top: 0; }
.-contact > div > ul > li:last-of-type { margin-bottom: 0; }

.-contact > div > ul > li > * {
	display: block;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	line-height: 16px; }

.-contact > div > ul > li > strong {
	color: #C2C2C2; }

.-contact > div > ul > li > span a {
	color: #FFFFFF;
	font-family: Helvetica, Arial, sans-serif;
	text-decoration: none; }

.-contact > div > ul > li > span a:hover {
	text-decoration: underline; }
/* ------------------------------ */
/* Component: .-contact */

/* Component: .-content
/* ------------------------------ */
.-content {
	margin: 0 auto; padding: 40px 20px;
	width: 1280px; height: auto; }

.-content > div {
	margin: 20px 0; padding: 0; }

.-content > div:first-of-type { margin-top: 0; }
.-content > div:last-of-type { margin-bottom: 0; }

.-content > div > * {
	margin: 10px 0; padding: 0; }

.-content > div > *:first-child { margin-top: 0; }
.-content > div > *:last-child { margin-bottom: 0; }

.-content > div > h3 {
	color: #C2C2C2;
	font-size: 24px;
	font-weight: normal;
	text-transform: uppercase; }

.-content > div > p {
	font-size: 18px;
	line-height: 22px;
	margin: 0; padding: 0;
	text-align: justify; }

.-content > div > p { padding-left: 30px; }
.-content > div > p { padding-right: 30px; }
/* ------------------------------ */
/* Component: .-content */

/* Component: .-grid
/* ------------------------------ */
.-grid {
	list-style-type: none;
	margin: 0; padding: 0; }

.-grid > li {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	position: relative;
	width: 20%; height: auto; }

@media screen and ( min-width: 1536px ) { .-grid > li { width: calc(100% / 6); } }
@media screen and ( min-width: 1792px ) { .-grid > li { width: calc(100% / 7); } }
@media screen and ( min-width: 2048px ) { .-grid > li { width: calc(100% / 8); } }
@media screen and ( min-width: 2304px ) { .-grid > li { width: calc(100% / 9); } }
@media screen and ( min-width: 2560px ) { .-grid > li { width: calc(100% / 10); } }
@media screen and ( min-width: 2816px ) { .-grid > li { width: calc(100% / 11); } }
@media screen and ( min-width: 3072px ) { .-grid > li { width: calc(100% / 12); } }
@media screen and ( min-width: 3328px ) { .-grid > li { width: calc(100% / 13); } }
@media screen and ( min-width: 3584px ) { .-grid > li { width: calc(100% / 14); } }
@media screen and ( min-width: 3840px ) { .-grid > li { width: calc(100% / 15); } }
@media screen and ( min-width: 4096px ) { .-grid > li { width: calc(100% / 16); } }

.-grid > li:after {
	content: "";
	display: block;
	padding-top: 56.25%; }

.-grid > li > div {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0; }

.-grid > li.active > div,
.-grid > li:hover > div {
	background-color: rgba(0, 0, 0, 0.50); }

.-grid > li > div > div {
	display: table;
	width: 100%; height: 100%; }

.-grid > li > div > div > a {
	color: transparent;
	display: table-cell;
	font-size: 24px;
	margin: 0; padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	vertical-align: middle; }

.-grid > li.active > div > div > a,
.-grid > li:hover > div > div > a {
	color: #FFFFFF; }
/* ------------------------------ */
/* Component: .-grid */

/* Component: .-location
/* ------------------------------ */
.-location {
	color: #C2C2C2;
	display: inline-block;
	font-size: 20px;
	letter-spacing: 1px;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 100%; height: auto; }
/* ------------------------------ */
/* Component: .-location */

/* Component: .-logo
/* ------------------------------ */
.-logo,
.-logo > img {
	border: none;
	display: block;
	width: 585px; height: 40px; }
/* ------------------------------ */
/* Component: .-logo */

/* Component: .-menu
/* ------------------------------ */
.-menu {
	display: block;
	list-style-type: none;
	margin: 0; padding: 0;
	width: 150px; height: auto; }

.-menu > li {
	display: block;
	margin: 0; padding: 0;
	text-align: center; }

.-menu > li + li:before {
	color: #C2C2C2;
	content: "—";
	display: block;
	font-size: 16px;
	line-height: 18px;
	margin: 10px 0; padding: 0; }

.-menu > li > a {
	color: #C2C2C2;
	display: inline-block;
	font-size: 20px;
	letter-spacing: 1px;
	line-height: 22px;
	margin: 0; padding: 0;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
	width: auto; height: 20px; }

.-menu > li > a.active { color: #797979; }
.-menu > li > a:hover { color: #797979; }
/* ------------------------------ */
/* Component: .-menu */

/* Component: .-menu-option
/* ------------------------------ */
.-menu-option {
	display: table;
	width: 100%; height: 100%; }

.-menu-option > div {
	display: table-cell;
	margin: 0; padding: 0 10px;
	vertical-align: middle;
	width: auto; height: 100%; }

.-menu-option > div:first-of-type { width: 30px; text-align: right; }
/* ------------------------------ */
/* Component: .-menu-option */

/* Component: .-menu-search
/* ------------------------------ */
.-menu-search {
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	background-color: #313131;
	background-image: url('../style_img/search.png');
	background-position: center right 5px;
	background-repeat: no-repeat;
	border: none;
	border-radius: 15px;
	color: #FFFFFF;
	display: none;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 15px;
	margin: 0; padding: 5px 15px;
	max-width: 160px;
	width: 100%; height: 25px; }

.-menu-search:focus {
	box-shadow: 0 0 2px rgba(255, 255, 255, 0.5);
	outline: none; }

body[data-type$='_grid'] .-menu-search { display: inline-block; }
/* ------------------------------ */
/* Component: .-menu-search */

/* Component: .-menu-trigger
/* ------------------------------ */
.-menu-trigger {
	border-radius: 5px;
	color: #C2C2C2;
	cursor: pointer;
	display: inline-block;
	font-family: icomoon;
	font-size: 30px;
	line-height: 30px;
	width: 30px; height: 30px; }

.-menu-trigger:hover { color: #797979; }
/* ------------------------------ */
/* Component: .-menu-trigger */

/* Component: .-scrollable
/* ------------------------------ */
.-scrollable {
	position: relative;
	width: 100%; height: auto; }

.-scrollable > .content {
	overflow-x: hidden;
	width: 100%; height: auto; }

.-scrollable > .after,
.-scrollable > .before {
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	display: block;
	position: absolute;
	width: 70px; height: 100%; }

.-scrollable > .after { background-image: url("../style_img/arrow.right.png"); }
.-scrollable > .after { top: 0; right: -70px; bottom: 0; left: auto; }

.-scrollable > .before { background-image: url("../style_img/arrow.left.png"); }
.-scrollable > .before { top: 0; right: auto; bottom: 0; left: -70px; }
/* ------------------------------ */
/* Component: .-scrollable */

/* Section: .-social
/* ------------------------------ */
.-social > ul {
	list-style-type: none;
	margin: 0; padding: 0;
	text-align: center; }

.-social > ul > li {
	display: inline-block;
	margin: 0 5px; padding: 0; }

.-social > ul > li:first-of-type { margin-left: 0; }
.-social > ul > li:last-of-type { margin-right: 0; }

.-social > ul > li > a {
	color: #C2C2C2;
	display: block;
	font-family: icomoon;
	font-size: 30px;
	line-height: 30px;
	text-decoration: none;
	width: 30px; height: 30px; }

.-social > ul > li > a.facebook:after {		content: '\f082'; }
.-social > ul > li > a.google_plus:after {	content: '\f0d4'; }
.-social > ul > li > a.instagram:after {	content: '\f16d'; }
.-social > ul > li > a.linkedin:after {		content: '\f08c'; }
.-social > ul > li > a.pinterest:after {	content: '\f0d3'; }
.-social > ul > li > a.tumblr:after {		content: '\f174'; }
.-social > ul > li > a.twitter:after {		content: '\f081'; }
.-social > ul > li > a.vimeo:after {		content: '\f194'; }
.-social > ul > li > a.youtube:after {		content: '\f166'; }

.-social > ul > li > a.facebook:hover {		color: #3B5998; }
.-social > ul > li > a.google_plus:hover {	color: #DD4B39; }
.-social > ul > li > a.instagram:hover {	color: #517FA4; }
.-social > ul > li > a.linkedin:hover {		color: #007BB6; }
.-social > ul > li > a.pinterest:hover {	color: #CB2027; }
.-social > ul > li > a.tumblr:hover {		color: #32506D; }
.-social > ul > li > a.twitter:hover {		color: #00ACED; }
.-social > ul > li > a.vimeo:hover {		color: #AAD450; }
.-social > ul > li > a.youtube:hover {		color: #BB0000; }
/* ------------------------------ */
/* Section: .-social */
