html{
    background:url('images/warpstorm.png') no-repeat center center;
	background-color: #000000;
    min-height:100%;
    background-size:cover;
	background-size:cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
}

img {
    width: 100%;
    width: auto\9; /* ie8 */
	object-fit: contain
}


@font-face {
  font-family: oldEnglishText;
  src: url('fonts/OLDENGL.TTF');
}

@font-face {
  font-family: CopperplateGothicLight;
  src: url('fonts/COPRGTL.TTF');
}


h1{
	font-family: "oldEnglishText", arial, helvetica, sans-serif;
	font-size: 15vmin;
	color: #FFCC66;
	text-align: center;
    margin: auto;
    position: absolute;
    top: 40%;
	line-height: 12vmin;
	width: 100%;
}

h2{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 6vmin;
	color: #FFCC66;
    text-align: left;
	left: 75%;
    margin: auto;
    position: absolute;
    top: 70%;
}

h3{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 6vmin;
	color: #FFCC66;
    text-align: left;
	left: 15%;
    margin: auto;
    position: absolute;
    top: 20%;
}

h4{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 6vmin;
	color: #FFCC66;
    text-align: left;
	left: 30%;
    margin: auto;
    position: absolute;
    top: 80%;
}

h5{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 6vmin;
	color: #FFCC66;
    text-align: left;
	left: 50%;
    margin: auto;
    position: absolute;
    top: 10%;
}

h6{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 3vmin;
    color: #FFCC66;
	text-align: center;
    margin: auto;
    position: absolute;
    top: 65%;
	width: 100%;
}

backtext{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 3vmin;
	color: #FFCC66;
    text-align: left;
	left: 10%;
    margin: auto;
    position: absolute;
    top: 10%;
}

titletext{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 6vmin;
	color: #FFCC66;
    text-align: center;
    margin: auto;
    position: absolute;
    top: 15%;
	width: 100%;
}

smalltitletext{
	font-family: "CopperplateGothicLight", arial, helvetica, sans-serif;
	font-size: 3vmin;
	color: #FFCC66;
	text-align: center;
	position: relative;
}

boxtext{
	font-family: "Times New Roman", Times, serif;
	font-size: 3vmin;
    color: #FFCC66;
	align: left;
	position: relative;
}

text{
	font-family: "Times New Roman", Times, serif;
	font-size: 3vmin;
    color: #FFCC66;
	text-align: left;
    position: absolute;
	top: 25%;
	left: 25%;
	right: 25%
}

a:link {
  color: #FFCC66;
}

a:visited {
  color: #FFCC66;
}

a:hover {
  color: #FFCC66;
}

a:active {
  color: #FFCC66;
}  


.fadetext1 {
  animation:  fadein1 3s;
}

.fadetext2 {
  animation:  fadein2 4s;
}

.fadetext3 {
  animation:  fadein3 5s;
}

.fadetext4 {
  animation:  fadein4 6s;
}

.fadetext5 {
  animation:  fadein1 7s;
}

.fadebox1 {
  animation:  fadein2 4s;
  width: 10vmin
  font-family: "Times New Roman", Times, serif;
  font-size: 3vmin;
  position: absolute;
  text-align: center;
  top: 30%;
  left: 40%;
  right: 40%;
}

.fadebox2 {
  animation:  fadein3 5s;
  width: 10vmin
  font-family: "Times New Roman", Times, serif;
  font-size: 3vmin;
  position: absolute;
  text-align: center;
  top: 40%;
  left: 5%;
  right: 70%;
}

.fadebox3 {
  animation:  fadein3 6s;
  width: 10vmin
  font-family: "Times New Roman", Times, serif;
  font-size: 3vmin;
  position: absolute;
  text-align: center;
  top: 45%;
  left: 70%;
  right: 10%;
}

.modgamelogo1 {
	padding-left: 20%;
	padding-right: 20%;
}

@keyframes fadein1 {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes fadein2 {
  0% { opacity: 0; }
  25% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes fadein3 {
  0% { opacity: 0; }
  40% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes fadein4 {
  0% { opacity: 0; }
  50% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes fadein5 {
  0% { opacity: 0; }
  57% { opacity: 0; }
  100% { opacity: 1; }
}

/*@-webkit-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-o-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}*/