html, body {
	margin: 0;
	padding: 0;
	border: 0;
	height: 100%;
	overflow:hidden;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;			
}

.logo {
	width: 271px;
	height: 99px;
	float: left;
	margin-left: 30px;
	margin-top: 15px;
}

body {background-color:#08090E;}

.preload {
    display: none !important; /* Preloads the background image */
}

#bg {
   width: 100%;
    height: 100%;
  background: url('../background-1.jpg') no-repeat center bottom fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;   
    -webkit-animation: myfirst 4s ; /* Chrome, Safari, Opera */
    animation: myfirst 4s ;
    animation-delay:0s;
  }
  
   /* Chrome, Safari, Opera */
  @-webkit-keyframes myfirst {
    from {opacity: 0.0;}
    to {opacity: 1;}
  }

  /* Standard syntax */
  @keyframes myfirst {
    from {opacity: 0.0;}
    to {opacity: 1;}  
  }
  
  
  
  @media only screen and (max-width:320px) {
	#bg {
		background: url('../background-320.jpg') no-repeat center bottom fixed;
	}
}
@media only screen and (min-width:321px) and (max-width: 960px) {
	#bg {
		background: url('../background-960.jpg') no-repeat center bottom fixed;
	}
}
@media only screen and (min-width:961px) and (max-width: 1200px) {
	#bg {
		background: url('../background-1200.jpg') no-repeat center bottom fixed;
	}
}


/* ============== LINK STYLE for <p> ============= */

a {
	font-family: Arial, Helvetica, sans-serif;
	font-size:100%;
	font-weight:bold;
    padding-top: 1px;
    letter-spacing: 1pt;
    margin-top:250px;
    text-align: center;
	
}

/* unvisited link */
a.p-link:link {
	color: #256CFF;
	text-decoration: none;
}

/* visited link */
a.p-link:visited {
	color: blue;
}

/* hover */
a.p-link:hover {
	text-decoration: underline;
}

/* active */
a.p-link:active {
	color: red;
}

H1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size:116%;
    color: #E8E8E8;
    font-style: normal;
    padding-top: 1px;
    letter-spacing: 1pt;
    margin-left:15px;
    margin-right:15px;
    padding-top:150px;
    text-align: center;
	font-stretch: extra-expanded;	
}

@media all and (max-width:320px) {
	H1 {
		font-size: 100%;
	}
}
@media all and (min-width:321px) and (max-width: 960px) {
	H1 {
		font-size: 115%;
	}
}
@media all and (min-width:961px) and (max-width: 1200px) {
	H1 {
		font-size: 120%;
	}
}
@media all and (min-width: 1201px) {
	H1 {
		font-size: 140%;
	}
}


p {
	font-size: 116%;
	font-family: "lato Medium", Arial, sans-serif;	
	color: #E8E8E8;
	letter-spacing: 1pt;
    margin-left:30px;
    margin-right:30px;
    padding-top:5px;
    text-align: center;
	font-stretch: extra-expanded;
    font-weight:300;
	/* Improve Lato rendering in Safari */
	-webkit-text-stroke: rgba(255,255,255,0.01) 0.1px;  
}
@media all and (max-width:320px) {
	p {
		font-size: 90%;
	}
}
@media all and (min-width:321px) and (max-width: 960px) {
	p {
		font-size: 100%;
	}
}
@media all and (min-width:961px) and (max-width: 1200px) {
	p {
		font-size: 114%;
	}
}
@media all and (min-width: 1201px) {
	p {
		font-size: 116%;
	}
}
.small {
	font-size: 0.75em;
	font-weight: 400;
	padding-left: 15px;
	letter-spacing: 1px;
	}