/* CSS Document */

* { padding:0; margin:0; }

body {  background:url(../generator-files/background.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  overflow-x: hidden; background-color:#261e18;}

#info { width:815px; margin-left:auto; margin-right:auto; }
p {
    font-size: 14px;
    font-family: 'fira_sans_otregular';
	color:#fff;
	opacity:0.6;
}

@font-face {
    font-family: 'fira_sans_otregular';
    src: url('../fonts/firasansot-regular-webfont.html');
    src: url('../fonts/firasansot-regular-webfontd41dd41d.html?#iefix') format('embedded-opentype'),
         url('../fonts/firasansot-regular-webfont.woff') format('woff'),
         url('../fonts/firasansot-regular-webfont-2.html') format('truetype'),
         url('../fonts/firasansot-regular-webfont-3.html#fira_sans_otregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'oswaldbook';
    src: url('../fonts/oswald-regular-webfont.html');
    src: url('../fonts/oswald-regular-webfontd41dd41d.html?#iefix') format('embedded-opentype'),
         url('../fonts/oswald-regular-webfont-2.html') format('woff'),
         url('../fonts/oswald-regular-webfont-3.html') format('truetype'),
         url('../fonts/oswald-regular-webfont-4.html#oswaldbook') format('svg');
    font-weight: normal;
    font-style: normal;
}


#nav {width:100%; height:75px; color: #fff;
padding: 10px 0 10px 0;
-webkit-box-shadow: inset 0 1px rgba(255,255,255,.27);
-moz-box-shadow: inset 0 1px rgba(255,255,255,.27);
box-shadow: inset 0 1px rgba(255,255,255,.27);
border: solid 1px #640e03;
background-image: -webkit-linear-gradient(bottom, #5f0d02, #a81704);
background-image: -moz-linear-gradient(bottom, #5f0d02, #a81704);
background-image: -o-linear-gradient(bottom, #5f0d02, #a81704);
background-image: linear-gradient(to top, #5f0d02, #a81704);}


#logo { width:445px; height:138px; background-image:url(logogen.html); margin-left:auto; margin-right:auto; }
#generator { width: 1125px; height:340px; background-image:url(gen.html); background-repeat:no-repeat; background-position:center; margin-left:auto; margin-right:auto; margin-top:100px; }
#generatorr { width: 1125px; height:340px; margin-left:auto; margin-right:auto; margin-top:100px; }

#Loading { width:1125px; text-align:center; margin-left:auto; margin-right:auto; padding-top:125px; }

#ShowText { font-size:36px; width:1125px; text-align:center; margin-left:auto; margin-right:auto; padding-top:125px; font-family: 'Tahoma';
text-transform: uppercase; color:#fff; text-shadow:#333 2px 2px 2px;}

#download { width:590px; text-align:center; margin-left:auto; margin-right:auto; padding-top:140px; }
#download a:link {color:#FFF;}    
#download a:visited {color:#FFF; text-decoration:none;}  
#download a:hover {color:#FFF; text-decoration:none;}    
#download a:active {color:#FFF; text-decoration:none;} 

.reveal {
	-moz-box-shadow:inset 0px 1px 0px 0px #f29c93;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;
	box-shadow:inset 0px 1px 0px 0px #f29c93;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100));
	background:-moz-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
	background:-webkit-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
	background:-o-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
	background:-ms-linear-gradient(top, #fe1a00 5%, #ce0100 100%);
	background:linear-gradient(to bottom, #fe1a00 5%, #ce0100 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100',GradientType=0);
	background-color:#fe1a00;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border-bottom-right-radius:0px;
	border-top-right-radius:0px;
	border:1px solid #d83526;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family: 'Tahoma';
	font-size:18px;
	font-weight:bold;
	padding:9px 29px;
	text-decoration:none;
	text-shadow:0px 1px 0px #b23e35;
}
.reveal:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00));
	background:-moz-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
	background:-webkit-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
	background:-o-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
	background:-ms-linear-gradient(top, #ce0100 5%, #fe1a00 100%);
	background:linear-gradient(to bottom, #ce0100 5%, #fe1a00 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00',GradientType=0);
	background-color:#ce0100;
}
.reveal:active {
	position:relative;
	top:1px;
}

.generate {
	-moz-box-shadow:inset 0px 1px 0px 0px #caefab;
	-webkit-box-shadow:inset 0px 1px 0px 0px #caefab;
	box-shadow:inset 0px 1px 0px 0px #caefab;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #60bd0f), color-stop(1, #417a12));
	background:-moz-linear-gradient(top, #60bd0f 5%, #417a12 100%);
	background:-webkit-linear-gradient(top, #60bd0f 5%, #417a12 100%);
	background:-o-linear-gradient(top, #60bd0f 5%, #417a12 100%);
	background:-ms-linear-gradient(top, #60bd0f 5%, #417a12 100%);
	background:linear-gradient(to bottom, #60bd0f 5%, #417a12 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#60bd0f', endColorstr='#417a12',GradientType=0);
	background-color:#60bd0f;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border-bottom-left-radius:0px;
	border-top-left-radius:0px;
	border:1px solid #268a16;
	display:inline-block;
	cursor:pointer;
	
	font-family: 'Tahoma';
	font-size:18px;
	font-weight:bold;
	padding:9px 29px;
	text-decoration:none;
	
}
.generate:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #417a12), color-stop(1, #60bd0f));
	background:-moz-linear-gradient(top, #417a12 5%, #60bd0f 100%);
	background:-webkit-linear-gradient(top, #417a12 5%, #60bd0f 100%);
	background:-o-linear-gradient(top, #417a12 5%, #60bd0f 100%);
	background:-ms-linear-gradient(top, #417a12 5%, #60bd0f 100%);
	background:linear-gradient(to bottom, #417a12 5%, #60bd0f 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#417a12', endColorstr='#60bd0f',GradientType=0);
	background-color:#417a12;
}
.generate:active {
	position:relative;
	top:1px;
}

h1 { font-family: 'oswaldbook'; font-size:20px; }
#consoles { width:424px; height:23px; background-image:url(footer-icons.html); margin-left:auto; margin-right:auto; margin-top:20px; margin-bottom:10px;}


/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
.fade-in {
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
}
 
.fade-in.one {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
animation-delay: 0.7s;
}
 
.fade-in.two {
-webkit-animation-delay: 1.2s;
-moz-animation-delay:1.2s;
animation-delay: 1.2s;
}
 
.fade-in.three {
-webkit-animation-delay: 1.6s;
-moz-animation-delay: 1.6s;
animation-delay: 1.6s;
}