
header img{
	display:block;
	position:relative;
	margin-left: auto;
	margin-right: auto;
	width:300px;
	margin-bottom: -20px;

}
header{
	display:inline;
	margin:auto;

}


/*====== Navigation ======*/


nav li{
	
	list-style-type: none;
	margin-right: auto;
	margin-left: auto;
	}

nav ul {
	
	text-align: center;
	margin-top: 15px;
	padding-left: 0px;
	padding-right: 0px;

}


nav ul li a{
	text-decoration: none;
	color:white;
}


/*====== Animations ======*/


@keyframes infinite-spinning {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@-webkit-keyframes infinite-spinning {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
#box1:hover {

  -webkit-animation: infinite-spinning .5s; /* Safari 4+ */
  -moz-animation:    infinite-spinning .5s; /* Fx 5+ */
  -o-animation:      infinite-spinning .5s; /* Opera 12+ */
  animation:         infinite-spinning .5s; /* IE 10+ */
}

#box1{
	display:inline-block;
}


/*====== Logo ======*/


.logo{
	font-family: 'Varela Round', sans-serif;
	font-weight: bold;
	display:block;
	position:relative;
	margin-left: auto;
	margin-right: auto;
	font-size: 4em;
	text-align: center;
	color:black;
	margin-top: 0px;
	text-shadow: #fff 0px 1px 0, #000 0 -1px 0;
	text-shadow: 0px 2px 3px #555;

}
.logosub{
	font-family: 'Varela Round', sans-serif;
	font-weight: 400;
	display:block;
	position:relative;
	margin-top: -50px;
	margin-bottom: -5px;
	margin-left: auto;
	margin-right: auto;
	font-size: 2em;
	text-align: center;
	color:gray;
	letter-spacing: .03em;
}

/*@-moz-keyframes super-rainbow {
    0%   { color: red; } 
    20%  { color: orange; }
    40%  { color: yellow; }
    60%  { color: green; }
    80%  { color: blue; }
    100% { color: violet; }
}*/


/*@-moz-keyframes super-rainbow {
   
    10%  { color: #00FF00; }
    20%  { color: #339900; }
    30%  { color: #FFFF00; }
    40%  { color: #FF9933; }
    50%  { color: #00FFFF; }
    60%  { color: #0033FF; }
    70%  { color: #FF0000; }
    80%  { color: #990000; }
    90%  { color: #9900FF; }
    100% { color: #660066; }
}*/

@-moz-keyframes super-rainbow {
   
    10%  { color: #990000; }
    20%  { color: #FF0000; }
    30%  { color: #FFFF00; }
    40%  { color: #FF9933; }
    50%  { color: #339900; }
    60%  { color: #00FF00; }
    70%  { color: #00FFFF; }
    80%  { color: #0033FF; }
    90%  { color: #660066; }
    100% { color: #9900FF; }
}
@-webkit-keyframes super-rainbow {
	
    10%  { color: #990000; }
    20%  { color: #FF0000; }
    30%  { color: #FFFF00; }
    40%  { color: #FF9933; }
    50%  { color: #339900; }
    60%  { color: #00FF00; }
    70%  { color: #00FFFF; }
    80%  { color: #0033FF; }
    90%  { color: #660066; }
    100% { color: #9900FF; }
}

#animate , #animate1, #animate2, #animate3, #animate4, #animate5, #animate6, #animate7, #animate8{
     color: black;  
     -webkit-animation: super-rainbow 15s infinite alternate linear; 
     -moz-animation: super-rainbow 15s infinite alternate linear; 

}


#animate1 {
	-webkit-animation-delay:.25s; 
	-moz-animation-delay:.25s; 
	
}

#animate2 {
	-webkit-animation-delay:.5s; 
	-moz-animation-delay:.5s; 
}

#animate3 {
	-webkit-animation-delay:.75s; 
	-moz-animation-delay:.75s; 
}

#animate4 {
	-webkit-animation-delay:1s; 
	-moz-animation-delay:1s; 
}

#animate5 {
	-webkit-animation-delay:1.25s; 
	-moz-animation-delay:1.25s; 
}

#animate6 {
	-webkit-animation-delay:1.5s; 
	-moz-animation-delay:1.5s; 
}

#animate7 {
	-webkit-animation-delay:1.75s; 
	-moz-animation-delay:1.75s; 
}

#animate8 {
	-webkit-animation-delay:2s; 
	-moz-animation-delay:2s; 
}

h1{
	font-family: 'Josefin Sans', sans-serif;
	display:block;
	position:relative;
	margin-left: auto;
	margin-right: auto;
	font-size: 4em;
	font-weight: 100;
	text-align: center;

}

h2{
	font-family: 'Josefin Sans', sans-serif;
	display:block;
	position:relative;
	margin-left: auto;
	margin-right: auto;
	font-size: 1em;
	font-weight: 400;
	text-align: center;
}
h3{
	font-family: 'Varela Round', sans-serif;
	font-weight: 400;
	display:block;
	position:relative;
	margin-left: auto;
	margin-right: auto;
	font-size: 1em;
	text-align: center;
}


/*====== Navigational Circles ======*/

.circle1
{
	
	display:inline-block;
	width:90px;
	height:90px;
	border-radius:50%;
	-moz-border-radius: 50%;
    -webkit-border-radius: 50%;

	font-size:1.2em;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 700;
	text-shadow: 1px 1px 2px black;

	color:#fff;
	line-height:90px;
	text-align:center;
	background:linear-gradient(#00FF00, #339900);
  	margin:5px 5px 5px 0px;
  	padding:5px;
  	

}

.circle2
{
	display:inline-block;
	width:90px;
	height:90px;
	border-radius:50%;
	-moz-border-radius: 50%;
    -webkit-border-radius: 50%;

	font-size:1.2em;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 700;
	text-shadow: 1px 1px 2px black;

	color:#fff;
	line-height:90px;
	text-align:center;
	background:linear-gradient(#FFFF00, #FF9933);
  	margin:5px;
  	padding:5px;
}

.circle3
{
	display:inline-block;
	width:90px;
	height:90px;
	border-radius:50%;
	-moz-border-radius: 50%;
    -webkit-border-radius: 50%;

    font-size:1.2em;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 700;
	text-shadow: 1px 1px 2px black;

	color:#fff;
	line-height:90px;
	text-align:center;
	background:linear-gradient(#00FFFF, #0033FF);
  	margin:5px;
  	padding:5px;
}

.circle4
{
	display:inline-block;
	width:90px;
	height:90px;
	border-radius:50%;
	-moz-border-radius: 50%;
    -webkit-border-radius: 50%;

    font-size:1.2em;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 700;
	text-shadow: 1px 1px 2px black;

	color:#fff;
	line-height:90px;
	text-align:center;
	background:linear-gradient(#FF0000 , #990000);
  	margin:5px;
  	padding:5px;
}

.circle5
{
	display:inline-block;
	width:90px;
	height:90px;
	border-radius:50%;
	-moz-border-radius: 50%;
    -webkit-border-radius: 50%;

    font-size:1.2em;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 700;
	text-shadow: 1px 1px 2px black;

	color:#fff;
	line-height:90px;
	text-align:center;
	
	background:linear-gradient(#9900FF , #660066);
	margin:5px;
  	padding:5px;
}














