@font-face {
	font-family: 'TitlingGothicFBComp-Bold';
	src: url('../fonts/TitlingGothicFBComp-Bold.eot');
	src: local('☺'), url('../fonts/TitlingGothicFBComp-Bold.woff') format('woff'), 
	url('../fonts/TitlingGothicFBComp-Bold.ttf') format('truetype'), 
	url('../fonts/TitlingGothicFBComp-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

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

html{
   	background: red;
   	overflow: hidden;
    height: 100%;
    -moz-osx-font-smoothing: grayscale;
  	-webkit-font-smoothing: antialiased;
  	font-smoothing: antialiased;
  	font-weight: 400;
}

body{
	height: 100%;
    overflow: auto;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
}

.flash{
	position: absolute;
   	left: 0;
   	top: 0;
   	width: 100%;
   	height: 100%;
   	-moz-animation: flash .001s infinite;
	-webkit-animation: flash .001s infinite;
   	animation: flash .001s infinite;
   	transition: opacity .1s linear;
   	z-index:1;
}

.flash-img{
	display: block;
	background: url(../img/black.png) no-repeat center; 
	background-size: cover; 
	position: absolute;
   	top: 0;
   	left: 0;
   	width: 100%;
   	min-height: 100%;
}

.contain{
	position: absolute;
    top: 0;
    left: 0;
    background: #000;
    width: 100%;
    height: 100%;
    transition: background .4s linear;
    z-index:2;
}

.logo img{
	position: fixed;
	margin: auto;
	top: 30px;
	left: 0;
	right: 0;
	max-width: 8em;
	z-index: 3;
}

.main{
	text-align: center;
	position: relative;
	top: 52%;
	height: 37%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 5;
	margin-bottom: 30px;
}

.main ul{
	display: block;
	padding: 0;
	margin: 0 auto;
}

.main ul li{
	display: block;
	list-style: none;
	padding: 0;
	margin: 0 auto;
	/*height: calc(60% / 3);*/
	height: 80pt;
	z-index:4;
}

.main ul li a{
	display: inline-block;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 68pt;
    letter-spacing: 2px;
    z-index: 4;
    height: 80px;
}

.main ul li a:hover { 
	font-size: 0;
 }

.main ul li a:hover:before {
	display: inline-block;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 68pt;
    letter-spacing: 2px;
    z-index:4;
	content: attr(data-hover);
	height: 80px;
}

.footer{
	position: absolute;
	display: block;
	padding: 0;
	margin: 0 auto;
	text-align: center;
	width: 100%;
	z-index:4;
	bottom: 15px;
	margin-bottom: 20px;
	left: 0;
}

.footer img{
	position: relative;
	bottom: 5;
	margin: auto;
	left: 0;
	right: 0;
	max-width: 7em;
	z-index: 4;
}

.footer p{
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 12pt;
    letter-spacing: 1px;
    z-index: 4;
}

.today{
	min-width:420px
}

.contain{
	position: fixed;
}

@-webkit-keyframes flash {
   	0% {
   	    opacity: 0
   	}

   	100% {
   	    opacity: 1
   	}
}

@keyframes flash {
   	0% {
   	    opacity: 0
   	}

   	100% {
   	    opacity: 1
   	}
}

@media only all and (min-width: 1600px) { 
  html{
  max-width: 1400px;
  margin: 0 auto !important;
  }
}

@media only all and (min-width: 1200px) { 

}

@media only all and (max-width: 1200px) { 
	.main ul li a {
		font-size: 57pt;
	}

	.main ul li {
		height: 65pt;
	}

	.main ul li a:hover:before {
		font-size: 57pt;
	}
}

@media only all and (max-width: 760px) { 

}

@media only all and (max-width: 520px) {
.logo img{
	position: fixed;
	margin: auto;
	top: 15px;
	left: 0;
	right: 0;
	max-width: 6em;
	z-index: 3;
	}

.main ul li{
	display: block;
	list-style: none;
	padding: 0;
	margin: 0 auto;
	/*height: calc(60% / 3);*/
	height: 38pt;
	z-index:4;
}

.main ul li a{
	display: inline-block;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 34pt;
    letter-spacing: 2px;
    z-index: 4;
    height: 47px;
}

.main ul li a:hover:before {
	display: inline-block;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 34pt;
    letter-spacing: 2px;
    z-index:4;
	content: attr(data-hover);
	height: 47px;
}

.footer img{
	position: relative;
	margin: auto;
	left: 0;
	right: 0;
	max-width: 5em;
	z-index: 4;
}

.footer p{
	color: white;
	margin-bottom: 13px;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 8pt;
    letter-spacing: 1px;
    z-index: 4;
}

.today{
	min-width:0px
}
}

@media only all and (max-width: 320px) {
.logo img{
	position: fixed;
	margin: auto;
	top: 15px;
	left: 0;
	right: 0;
	max-width: 5em;
	z-index: 3;
	}

.main{
	text-align: center;
	position: relative;
	top: 55%;
	height: 37%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 5
}

.main ul li{
	display: block;
	list-style: none;
	padding: 0;
	margin: 0 auto;
	/*height: calc(60% / 3);*/
	height: 30pt;
	z-index:4;
}

.main ul li a{
	display: inline-block;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 28pt;
    letter-spacing: 2px;
    z-index: 4;
}

.main ul li a:hover:before {
	display: inline-block;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 28pt;
    letter-spacing: 2px;
    z-index:4;
	content: attr(data-hover);
}

.footer img{
	position: relative;
	margin: auto;
	left: 0;
	right: 0;
	max-width: 4em;
	z-index: 4;
}

.footer p{
	margin-top: 3px;
	margin-bottom: 13px;
	color: white;
	text-decoration:none;
	font-family: 'TitlingGothicFBComp-Bold';
	font-size: 7pt;
    letter-spacing: 1px;
    z-index: 4;
}

.today{
	min-width:0px
}
}