/* Welcoming the C3 Fonts */

@font-face {
    font-family: FFDIN;
    src: url("../fonts/DINWeb.woff") format("woff");
    font-weight: 400;
}

@font-face {
    font-family: FFDINCond;
    src: url("../fonts/DINWeb-CondMedium.woff") format("woff");
    font-weight: 500;
}

@font-face {
    font-family: OrgonSlab;
    src: url("../fonts/OrgonSlabRegWeb.woff") format("woff");
    font-weight: 400;
}

@font-face {
    font-family: OrgonSlab;
    src: url("../fonts/OrgonSlabItaWeb.woff") format("woff");
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: OrgonSlab;
    src: url("../fonts/OrgonSlabMedWeb.woff") format("woff");
    font-weight: 500;
}

@font-face {
    font-family: OrgonSlab;
    src: url("../fonts/OrgonSlabBolWeb.woff") format("woff");
    font-weight: bold;
}

@font-face {
    font-family: C3Symbol;
    src: url("../fonts/C3Symbol.woff") format("woff");
    font-weight: 400;
}

@font-face {
  font-family: 'C3PRFM';
  src:url('../fonts/C3PRFM.eot?-540wpl');
  src:url('../fonts/C3PRFM.eot?#iefix-540wpl') format('embedded-opentype'),
    url('../fonts/C3PRFM.woff?-540wpl') format('woff'),
    url('../fonts/C3PRFM.ttf?-540wpl') format('truetype'),
    url('../fonts/C3PRFM.svg?-540wpl#C3PRFM') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  font-family: 'C3PRFM';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/*- RESET ----------------------------------- */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,
form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,
canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,
summary,time,mark,audio,video {
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  border: 0;
  font: inherit;
  font-size: 100%;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
  text-rendering: optimizeLegibility;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display: block; }
body { line-height: 1; }
ol,ul { list-style: none; }
blockquote,q { quotes: none; }
blockquote:before,blockquote:after,
q:before,q:after { content: ''; content: none; }
:focus { outline: none; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
a { text-decoration: none; }
* { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

::-webkit-input-placeholder  { color: rgba(255, 255, 255, 0.3); } /* Webkit */
:-moz-placeholder { color: rgba(255, 255, 255, 0.3); }  /* Firefox <= 18 */
::-moz-placeholder { color: rgba(255, 255, 255, 0.3); }  /* Firefox >= 19 */
:-ms-input-placeholder {  color: rgba(255, 255, 255, 0.3); } /* Internet Explorer */


/*- TYPOGRAPHY ----------------------------------- */

body {
  font-family: 'OrgonSlab';
  color: #fff;
  -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
  -webkit-text-size-adjust: 100%;
}

h1, h2, h3, h4, h5 {
  font-family: 'OrgonSlab';
  font-weight: bold;
  letter-spacing: -1px;
  line-height: 1.25em;
  margin-bottom: 5px;
  text-rendering: optimizeLegibility;
}

h1 { 
  font-size: 44px;
}

h2 {
  font-size: 36px;
  line-height: 42px;
}

h3 {
  font-size: 28px;
  line-height: 32px;
}

h4 {
  font-size: 20px;
  line-height: 22px;
}

p {
  font-family: 'OrgonSlab';
  font-size: 1em;
  font-weight: 400;
  line-height: 1.5em;
  margin-bottom: 40px;
}

a, a:visited, a:active {
  color: #ff6400;
  transition: color .15s ease-in-out;
  -moz-transition: color .15s ease-in-out;
  -webkit-transition: color .15s ease-in-out;
}

a:hover {
  color: #fff !important;
  transition: color .1s ease-in-out !important;
  -moz-transition: color .1s ease-in-out !important;
  -webkit-transition: color .1s ease-in-out !important;
}

em { 
  font-style: italic;
}

strong {
  font-weight: bold;
}


/*- GLOBAL CONTROLS & ITEMS ------------------- */

.left {
  float: left;
}

.right {
  float: right;
}

.hairline {
  border-bottom: 1px solid #ff6400;
  width: 100%;
  max-width: 940px;
  margin: 30px 0;
}

.hidden {
  visibility: hidden;
}

.c3-logo:before {
  font-family: "C3Symbol";
  content: "\0063";
}

.c3-icon-top:before {
  font-family: "C3Symbol";
  content: "\0074";
}

.notification-bar {
  position: relative;
  background-color: rgb(0, 0, 0);
  padding: 15px 0 12px;
  border-bottom: solid 1px rgba(255, 255, 255, 0.25);
  text-align: center;
  box-shadow: 0 0 0 2px rgb(0, 0, 0);
  z-index: 50;
}

.notification {
  margin-bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  width: 1000px;
  padding: 0 30px;
}

.notification-prefix {
  font-family: 'FFDIN';
  font-size: 0.95em;
  text-transform: uppercase;
  color: #ff6400;
  margin-right: 10px;
}

.body-list {
  list-style: inside square !important;
  line-height: 2em;
  padding-bottom: 2em;
}


/*- CORE WRAPPER ------------------------------ */

/* body {
	background: #000 url("../img/sbkd-digits.jpg") no-repeat center top fixed;
	background-size: cover;
} */

body {
  background: #000 url("../img/digits.gif") fixed;
}

.wrapper-site {
	width: 1000px;
	height: 100%;
	background-color: rgba(0, 0, 0, 1);
	margin-left: auto;
	margin-right: auto;
	padding: 0 30px;
	z-index: 0;
}

.wrapper-head {
	position: relative;
	width: 1000px;
	height: 120px;
	background-color: rgba(0, 0, 0, 0.8);
	padding: 30px;
	margin: 0 0 30px -30px;
	z-index: 10;
}

.wrapper-footer {
  position: relative;
  width: 1000px;
  height: 90px;
  /* background-color: rgb(100, 0, 0); */
  padding: 30px;
  margin: 30px 0 0 -30px;
  z-index: 10;
  clear: both;
}


/*- HEADER & NAV ------------------------------ */

#head {
	width: 100%;
	height: 100%;
	border-bottom: solid 1px #ff6400;
}

#head-nav {
	font-family: 'FFDIN';
	font-size: 1.2em;
	text-transform: uppercase;
	float: right;
	margin: 8px 0 0 16px;
}

#head-nav ul {
  display: inline-flex;
  display: -webkit-inline-flex;
}

#head-nav li+li {
  background: url("../img/head-nav-divider-25.png") no-repeat 15px 5px;
  padding-left: 60px;
}

.head-logo {
  float: left;
  position: relative;
  font-family: "C3Symbol";
  font-size: 38px;
  top: -8px;
  margin-right: 15px;
}

.head-sitebeat {
	background: url("../img/head-nav-beat.png") no-repeat left center;
	opacity: 0.25;
	overflow: hidden;
	height: 32px;
}


/*- FOOTER ------------------------------------ */

#foot {
  width: 100%;
  height: 100%;
  border-top: solid 1px rgba(255, 255, 255, 0.4);
  color: rgba(255, 255, 255, 0.4);
  padding-top: 22px;
}

#foot a {
  color: rgba(255, 255, 255, 0.4);
}

.foot-logo {
  float: left;
  position: relative;
  top: -9px;
  font-family: "C3Symbol";
  font-size: 22.5px;
  margin-right: 30px;
}

.foot-content {
  font-size: 0.9em;
  float: left;
}

.foot-button-top {
  float: right;
  position: relative;
  top: -8px;
  font-family: "C3Symbol";
  font-size: 23px;
}

.foot-version {
  position: absolute;
  font-family: "FFDINCond";
  font-size: 0.8em;
  color: rgba(0, 0, 0, 0.8);
  margin-top: -40px;
  text-transform: uppercase;
  padding: 4px 4px 0px 30px;
  background-color: rgba(255, 255, 255, 0.4);
  opacity: 0;
  transition: all .35s ease-in-out;
  -moz-transition: all .35s ease-in-out;
  -webkit-transition: all .35s ease-in-out;
}

.foot-version:hover {
  opacity: 1;
  padding: 4px 4px 0px 4px;
  transition: all .25s ease-in-out;
  -moz-transition: all .25s ease-in-out;
  -webkit-transition: all .25s ease-in-out;
}

@-moz-document url-prefix() {
.foot-version {
  left: 30px;
}}


/*- TUNNEL HIGHLIGHT ------------------- */

.wrapper-tunnel-highlight {
  margin: -150px 0 0 -30px;
}

.tunnel-highlight {
  background-size: auto 600px;
  background-position: top center;
  background-repeat: no-repeat;
  width: 1000px;
  height: 600px;
  margin-top: -120px;
  padding: 179px 30px 59px 30px;
  z-index: 1;
}

.tunnel-highlight-filtered {
  position: absolute;
  background-size: auto 600px;
  background-position: top center;
  background-repeat: no-repeat;
  width: 1000px;
  height: 120px;
  z-index: 2;
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE6-9 */
}

.tunnel-highlight-container {
  position: relative;
  width: 296px;
  height: 362px;
  padding: 15px;
  background-color: rgba(0, 0, 0, 0.85);
  z-index: 3;
}

.tunnel-highlight-content {
  color: #aaa;
  margin-bottom: 20px;
}

.tunnel-highlight-button {
  font-family: "FFDINCond";
  font-size: 1.2em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.8) !important;
  /* width: 150px;
  height: 37px; */
  /* padding: 3px 15px 0px 15px; */
  padding: 10px 15px 6px;
  background-color: #ff6400;
  position: absolute;
}

.tunnel-highlight-video {
  z-index: 2
}

.hairline-start {
  width: 30%;
  border-bottom-color: #ff6400;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  margin-top: 1em;
  margin-bottom: 0.5em;
}


/*- NEWSTILES -------------------------- */

.wrapper-newstiles {
  position: relative;
  display: inline-block;
}

.wrapper-newstiles li {
  float: left;
  width: 296px;
  height: 296px;
  margin-right: 26px;
}

.wrapper-newstiles li:last-child {
  margin-right: 0px;
}

.tunnel-newstile {
  background-size: auto 296px;
  background-position: top center;
  width: 296px;
  height: 296px;
}

.tunnel-newstile-filtered {
  position: relative;
  bottom: -206px;
  background-size: auto 296px;
  background-position: bottom center;
  background-repeat: no-repeat;
  width: 296px;
  height: 90px;
  z-index: 2;
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE6-9 */
}

.tunnel-newstile-overlay {
  position: relative;
  bottom: -116px;
  color: #fff !important;
  background-color: rgba(0, 0, 0, 0.8);
  border-top: 1px solid #ff6400;
  width: 296px;
  height: 90px;
  padding: 10px 12px;
  font-weight: 500;
  font-size: 1.3em;
  line-height: 1.2em;
  z-index: 10;
}

.tunnel-newstile-first {
  position: absolute;
  margin-top: 2px;
  font-family: "FFDINCond";
  font-size: 1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 1);
  padding: 6px 8px 3px 12px;
  background-color: #ff6400;
}

.tunnel-newstile-timestamp {
  position: relative;
  top: -180px;
  color: rgba(255, 255, 255, 0.5);
  background-color: rgba(15, 15, 15, 0.9);
  height: 23px;
  padding: 5px;
  font-family: "FFDINCond";
  font-size: 1em;
  text-transform: uppercase;
  opacity: 0;
  transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -webkit-transition: all .15s ease-in-out;
}

.tunnel-newstile:hover > .tunnel-newstile-timestamp {
  opacity: 1;
  transition: all .1s ease-in-out;
  -moz-transition: all .1s ease-in-out;
  -webkit-transition: all .1s ease-in-out;
}


/*- TUNNEL ABOUT ----------------------- */

.tunnel-about {
  display: inline-block;
  height: 280px;
}

.tunnel-about-content {
  float: right;
  width: 614px;
}

.tunnel-about-artwork {
  float: left;
  margin-right: 30px;
  width: 295px;
  height: 280px;
}

.tunnel-about-heading {
  font-family: 'FFDINCond';
  font-size: 3em;
  text-transform: uppercase;
  color: #ff6400;
  line-height: inherit;
  margin-bottom: 8px;
}

.tunnel-about-text p {
  font-size: 0.95em;
  line-height: 1.6em;
  margin-bottom: 20px;
}


/*- HEADINGS --------------------------- */

.heading-main {
  font-family: "FFDINCond";
  font-size: 3em;
  text-transform: uppercase;
  color: #ff6400;
  margin-top: -20px;
  margin-bottom: -10px;
}

.heading {
  position: relative;
  font-family: "FFDINCond";
  font-size: 1.8em;
  text-transform: uppercase;
  margin-bottom: 30px;
  padding-top: 30px;
  overflow: hidden;
  color: #ff6400;
}

.heading::after {
  content: url("../img/sitebeat.png") no-repeat left center;
  position: absolute;
  padding-left: 15px;
  margin-top: -1px;
  opacity: 0.3;
}


/*- PRFM ------------------------------- */

.login-label {
  font-family: 'FFDINCond';
  font-size: 1em;
  line-height: 1.4em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  display: block;
}

input {
  font-family: 'OrgonSlab';
  font-size: 0.87em;
  line-height: 1.4em;
  padding: 5px 8px;
  width: 300px;
  height: 30px;
  margin-bottom: 20px;
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-style: none;
  border-top: 1px solid rgba(0, 0, 0, 0);
  transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -webkit-transition: all .15s ease-in-out;
}

input:focus {
  background-color: rgba(255, 255, 255, 0.2);
  border-top: 1px solid;
  border-top-color: #ff6400;
  transition: all .1s ease-in-out;
  -moz-transition: all .1s ease-in-out;
  -webkit-transition: all .1s ease-in-out;
}

input[type=submit] {
  border-style: none;
  background-color: #ff6400;
  font-family: 'FFDINCond';
  font-size: 1.4em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.8);
  width: 164px;
  height: 37px;
  cursor: pointer;
  transition: all .15s ease-in-out;
  -moz-transition: all .15s ease-in-out;
  -webkit-transition: all .15s ease-in-out;
}

input[type=submit]:focus {
  color: #fff;
  transition: all .1s ease-in-out;
  -moz-transition: all .1s ease-in-out;
  -webkit-transition: all .1s ease-in-out;
}

.error {
  font-family: 'FFDINCond';
  font-size: 1em;
  text-transform: uppercase;
  margin-bottom: 20px;
  padding-top: 3px;
  background-color: rgba(255, 0, 0, 0.5);
  text-align: center;
}


/*- ERROR ------------------------------ */

.wrapper-notify {
  margin: -150px 0 0 -30px;
}

.notify-error {
  background-size: auto 700px;
  background-position: top center;
  background-repeat: no-repeat;
  width: 1000px;
  height: 700px;
  margin-top: -120px;
  padding: 179px 30px 59px 30px;
  z-index: 1;
}

.notify-error-filtered {
  position: relative;
  background-size: auto 700px;
  background-position: top center;
  background-repeat: no-repeat;
  width: 1000px;
  height: 120px;
  z-index: 2;
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray; /* IE6-9 */
}

.notify-error-container {
  position: relative;
  width: 470px;
  height: 100%;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 3;
}

.notify-error-number {
  font-family: 'FFDINCond';
  font-size: 6em;
  color: rgba(255, 255, 255, 0.3);
  margin-bottom: -10px;
}

.notify-error-content {
  margin-bottom: 50px;
}

.notify-error-button {
  font-family: "FFDINCond";
  font-size: 1.2em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.8) !important;
  /* width: 150px;
  height: 37px; */
  /* padding: 3px 15px 0px 15px; */
  padding: 10px 15px 6px;
  background-color: #ff6400;
  position: absolute;
}