@charset "UTF-8";


body {
 background-color:#0F0F0f;
	background-image: linear-gradient(to top, rgba(255,0,0,0.5), rgba(255,0,0,0)); 
background-attachment: fixed;
 background-size: cover;
}
#wrapper {
	max-width: 60%;
	height: auto;
	margin: 0 auto;
	background-color: #000;
}

header {
	/* height: 5em; */
	width: 100%;
	margin: 0 auto;
	font-variant: smail-caps;
	overflow: auto;
}
nav a:hover {
	color:#FF00C5;
}

nav {
	padding-right: 1em;
	padding-top: 0.5em;
	width: 70%;
	float: right;
	padding-bottom: 0.5em;
}

nav ul {
	margin: 0;
	padding: 0;
}

nav li {
	display: inline-block;
	padding-left: 3.8em;
	color: #FFFFFF;
	font-family: "Reggae One", serif;
	font-size: 1em;
}

nav ul li a {
	text-decoration: inline;
	color: #ff2200;
	font-variant: small-caps;
	font-family:"Reggae One", serif;
  font-weight: 400;
  font-style: normal;
}

#GG {
	display: black;
	width: 14%;
	height: auto; 
	color: #fff;
	font-size: 2.2em;
	float: left;
	padding-top: .6em;
	padding-left: 1.3em;
}


main {
	background-size: cover;
	background-image: url("Images/footprint.png");
	width: 100%;
	clear:both;
	padding-top: 2em;
}


h1 {
	margin: 0;
	color: #fff;
	object-fit: cover;
	float:center;
	padding-left: 5em;
	padding-top: 1.5em;
	font-family:"Reggae One", serif;
  font-weight: 400;
  font-style: normal;
}

h2 {
	font-family:"Reggae One", serif;
	font-size: 1.5em;
	text-align: center;
	color: white
}
h4 {font-family:"Reggae One", serif;
	font-size: .8em;
	text-align: center;
	color: #00D9FF;
	padding: 2em;
}
p{
	font-family:"Reggae One", serif;
	font-size: 1em;
	text-align: center;
	color: red
}
h3 {
	font-family:"Reggae One", serif;
	font-size: 1.1em;
	text-align: center;
	color: white; 
}


.container1 {
  position: relative;
  width: 40%;
	margin-left: 20em;
	margin: 0 auto;
	padding-bottom: 3em
 

}

/* Make the image to responsive */
.image1 {
  display: block;
  width:100%;


 /*  height: auto; */
}

/* The overlay effect - lays on top of the container and over the image */
.overlay1 {
  position: absolute;
  bottom: 0;
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.5); /* Black see-through */
  color: #f1f1f1;
  width: 80%;
  transition: .5s ease;
  opacity:0;
  color: white;
  font-size: 20px;
  padding: 20px;
  text-align: left;
  font-family:"Reggae One", serif;
}

.container1:hover .overlay1 {
  opacity: 1;
}
@-webkit-keyframes colorchangeFooter {
       0% {background: rgb(163, 43, 8,);}
     25% {background: rgb(232, 67, 12);}
     50% {background: rgb(232, 90, 155);}
     75% {background-color: #99D2E4;}
     100% {background: rgb(48, 97, 105);}
}

@-moz-keyframes colorchangeFooter {
      0% {background: rgba(122, 122, 122, 0.8);}
     25% {background: rgba(13, 237, 255, 0.8);}
     50% {background: rgb(232, 90, 155);}
     75% {background-color: #949494;}
     100% {background: rgba(122, 122, 122, 0.8);}	
}

@-o-keyframes colorchangeFooter {
       0% {background: rgba(122, 122, 122, 0.8);}
     25% {background: rgba(13, 237, 255, 0.8);}
     50% {background: rgb(232, 90, 155);}
     75% {background-color: #949494;}
     100% {background: rgba(122, 122, 122, 0.8);}
}

@keyframes colorchangeFooter {
      0% {background: rgba(122, 122, 122, 0.8);}
     25% {background: rgba(13, 237, 255, 0.8);}
     50% {background: rgb(232, 90, 155);}
     75% {background-color: #949494;}
     100% {background: rgba(122, 122, 122, 0.8);}
}

footer {
    background: rgba(122, 122, 122, 0.8);  
     -webkit-animation: colorchangeFooter 30s infinite alternate;
     -moz-animation: colorchangeFooter 30s infinite alternate;
     -o-animation: colorchangeFooter 30s infinite alternate;
     animation: colorchangeFooter 30s infinite alternate;
     height: 30px;
	padding: 15px 0 0 2%;
	font: "Reggae One", serif;
	
	
}