@charset "utf-8";
/* CSS Document */

body, ul, li, h1, h2, h3, h4, h5, h6{
    margin:0;
    padding:0;
    border:0;
}

.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('images/BlankColorLoading.gif') 50% 50% no-repeat rgb(249,249,249);
}

.right {
    float: right;
    width: 40%;
    height: auto;
    padding-left: 20px;
}

.Hueheader {
    height: 100vh;
    background-color: transparent;
}

.bgvid { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url("images/Holifusion_colour_explosion_2.jpg") no-repeat;
    background-size: cover; 
    background-position: center;
}

/* ------------------Header------------------ */
.Hueheader h1 {
    text-align: center;
    font-size: 135px;
    color: white;
    padding-top: 35vh;
    font-family: 'Indie Flower', cursive;
}

.Hueheader h2 {
    text-align: center;
    font-size: 50px;
    color: white;
    font-family: 'Indie Flower', cursive;
}

/* ------------------Color Body------------------ */
.Huebody {
    background-color: white;
}

.Hue1body {
    background-color: #88cc66;
}

.Hue1 {
    height: auto;
    background-color: #88cc66;
    margin-left: 5%;
    margin-right: 5%;
}

.Hue1 h1{
    text-align: center;
    font-size: 60px;
    font-family: 'Indie Flower', cursive;
}

.Hue1 h2{
    font-size: 32px;
    font-family: 'Indie Flower', cursive;
}

.Hue1 h3{
    font-size: 24px;
    font-family: 'Indie Flower', cursive;
    padding-bottom: 15px;
}

/* ------------------Hexadecimal Body------------------ */
.Hue2body {
    background-color: #66aaaa;
}

.Hue2 {
    height: auto;
    background-color: #66aaaa;
    margin-left: 5%;
    margin-right: 5%;
}

.Hue2 h1{
    text-align: center;
    font-size: 60px;
    font-family: 'Indie Flower', cursive;
}

.Hue2 h2{
    font-size: 32px;
    font-family: 'Indie Flower', cursive;
}

.Hue2 h3{
    font-size: 24px;
    font-family: 'Indie Flower', cursive;
    padding-bottom: 15px;
}

/* ------------------Credits------------------ */
.Hue3 {
    height: auto;
    background-color: white;
    margin-left: 15%;
    margin-right: 15%;
}

.Hue3 h1{
    text-align: center;
    font-size: 55px;
    font-family: 'Indie Flower', cursive;
}

.Hue3 h2{
    text-align: left;
    font-size: 35px;
    font-family: 'Indie Flower', cursive;
}

.Hue3 h3{
    text-align: center;
    font-size: 30px;
    font-family: 'Indie Flower', cursive;
}

.Hue3 h4{
    text-align: center;
    font-size: 20px;
    font-family: 'Indie Flower', cursive;
}

/* ------------------Footer------------------ */
.Huefooter {
    height: auto;
    background-color: white;
    padding-bottom: 5px;
}

.Huefooter h3 {
    text-align: center;
    font-size: 28px;
    font-family: 'Indie Flower', cursive;
    padding-top: 4vh;
}

.Huefooter h4 {
    text-align: center;
    font-size: 18px;
    font-family: 'Indie Flower', cursive;
    padding-top: 2px;
}

/* ------------------Social Links------------------ */
.SocialLinks {
    height: auto;
    text-align: center;
}

.SocialLinks a:hover {
    background-position: 0 0;
}