html, body, .container {
  height: 100%;
background-color: #961a1d; 
}

/* Reset */
html, body, h1, p, a, div, section {
  margin: 0;
  padding: 0;
  font-size: 100%;
  font: inherit;
}

.headerbar {
  width: 100%;
  height: 102px;
  z-index: 9999;
  position: fixed;
}

/* navigation bar */


#cryptobar{
    float: left;
  width: 100%;
    position: relative;
    left: 0%;
height: auto;
margin-top: 0px;
margin-bottom: 35px;
	z-index: 1;
}

section#logohere{
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

#logohead{
background-image: url(../images/passcodehq_logo.png);
    display:block;
    width: 100%;
height: 300px;
margin-top: 2%;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
	z-index: 1;
}


section#statement{
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

#slang{
background-image: url(../images/cryptostatement.png);
    display:block;
    width: 100%;
height: 350px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
	z-index: 1;
}

/* Sign-Up Form begins*/

section#form{
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#form .msg{
box-sizing: content-box;
font-family: 'Source Code Pro', 'Lato', Arial, Helvetica, san-serif;
  font-weight: 400;
color: white;
font-size: 1.2em;
padding: 0;
max-width: 50ch;
letter-spacing: .1em;
	line-height: 1.2em;
margin: 2rem auto; 

text-align: center;
}

#borderBottom{
  height: 10px;
  width: 50%;
  position: relative;
  border-bottom: 2px solid #f51c40;
  background: none;
bottom: 10%;
}

#borderTop{
left: 250px;
  height: 10px;
  width: 50%;
  position: relative;
  border-top: 2px solid #f51c40;
  background: none;
top: 10%;
}

#mailchimp{
font-family: 'Source Code Pro', 'Lato', Arial, Helvetica, san-serif;
margin: 2rem auto; 
  font-weight: 400;
max-width: 450px;
border: 0px solid #000000;
padding: 0;
	z-index: 1;
}

label{
padding: 1rem 0 .25rem;
display: block;
color: #ffffff;
font-size: 18px;
  text-transform: uppercase;
}

input{
display: block;
  padding: .5rem;
font-size: 18px;
border: 2px  solid #be1e2d;
border-bottom: 2px  solid #fe021a;
background: #be1e2d;
color: #ffffff;
width: 95%;
outline: none;
}

.button {
width: auto;
  padding: .5rem;
font-family: 'Source Code Pro', 'Lato', Arial, Helvetica, san-serif;
letter-spacing: .2em;
  color: #fff;
  border-top: 1px solid #25aae1;
  border-bottom: 1px solid #25aae1;
margin: 1rem 0;
background: #000000;
  border-radius: 3px;
  text-decoration: none;
  text-align: center;
  text-transform: uppercase;
cursor: pointer;
    border-color: #000000;
}

.button:hover {
    background: #353535;
    color: #fff;
    border-color: #a1a1a1;
}


/* Sign-Up Form ends*/



section {
position: static;
float:left;
 width: 100%;
margin: 0 0 2% 0;
height: auto;
}

section#slide {
  background-image: url(../slides/Slide5.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: relative;
  background-size: cover;
  background-color:#464646;
  /* SHORTHAND CSS NOTATION
    *    background: url(../slides/Slide5.jpg);  */
}

section#slide {
  height: 100%;
}

section#slide{
  margin: 0;
  padding: 0;
}

.upperltr{
  text-transform: uppercase;
}

.hevyletter{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: white;
  font-size: 1.8em;
letter-spacing: 3px;
}

/* Social Start */

section#social{
position: static;
float: left;
 width: 100%;
margin: 0;
padding:  .5em 0;
text-align: center;
height: auto;
cursor: pointer;
background: none;
}


/* Social Start Ends*/

section#footer {
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#footer .footinfo{
box-sizing: content-box;
	border-top: 0px;
max-width: 60ch;
	text-transform: uppercase;
	letter-spacing: 2px;
text-align: center;
font-family: 'Source Code Pro', 'Lato', Arial, Helvetica, san-serif;
	font-weight: 400; 
	line-height: 1.5em;
	font-size: 0.75em;	
	color: #000;
padding: 0;
margin: 1rem auto; 
background: transparent;
z-index: 10;
}

/*main content area*/

div#content{
	position:absolute; 
	left:0px;
	top: 0px;
	width: 0px;
	height:0px;
	z-index:1;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	border: 0px;
	font-family: Arial, Helvetica, san-serif; 
	font-weight: normal; 
	font-size: 11px; 	
	color: #ffffff;
	overflow: auto;
	visibility: visible;
}

/*use for images, float can also be use on a div*/

img#name{
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
letter-spacing: 100%;
float: left;
}

/*if you just use a name rather than a tag you need the period*/
.text{
font-family: Arial, Helvetica, Times, Times New Roman, san-serif; 
font-weight: normal; 
font-style: normal;
font-size: 11px; 	
line-height: normal;
text-decoration: none;
text-indent: 0px;
word-spacing: normal;
color: #000000;
	}

a:link {  
	color:#000;
	text-decoration:none; 
font-family: Arial, Helvetica, Times, Times New Roman, san-serif; 
	font-weight: bold; 
	font-size: 14px; 	
	}

a:visited { 
	color:#fff;
	text-decoration:none; 
font-family: Arial, Helvetica, Times, Times New Roman, san-serif;  
	font-weight: bold; 
	font-size: 14px; 	
}

a:hover {  
	color: #3ba400;
	text-decoration:none; 
font-family: Arial, Helvetica, Times, Times New Roman, san-serif;  
	font-weight: bold; 
	font-size: 14px; 	
}

a img {
	width: auto; 
	height: auto; 
border: 0px;
}

/* Screen 1366 */
@media only screen and (min-width: 1100px) and (max-width: 1366px) {


.hevyletter{
  font-size: 1.5em;
}

}
/* Screen 1366 ENDS */

/* Screen 1024 */
@media only screen and (min-width: 900px) and (max-width: 1024px) {


/* Screen 1024 ENDS */