﻿#logo {
  position:absolute;
  top:0;
  text-align: center;
  height:100px;
  width:100%;
  margin:0 auto;
}



/******************************************************************************************************************************
ANIMATIONS
*******************************************************************************************************************************/

#rotate2 {
  position:relative;
  text-align: center;
  height:281px;
  width:100%;
  margin:0 auto;
}

#rotate2 h1 {
  position:absolute;
  -webkit-transition: opacity 6s ease-in-out;
  -moz-transition: opacity 6s ease-in-out;
  -o-transition: opacity 6s ease-in-out;
  transition: opacity 6s ease-in-out;
  width:100%;
  height:100%;
}

@keyframes cf4FadeInOut {
  0% {
    opacity:1;
  }
  10% {
    opacity:1;
  }
  30% {
    opacity:0;
  }
  90% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

#rotate2 h1:nth-of-type(1) {
    -webkit-animation-delay: 4s;
    -moz-animation-delay: 4s;
    -o-animation-delay: 4s;
    animation-delay: 4s;
}

#rotate2 h1:nth-of-type(2) {
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    -o-animation-delay: 0s;
    animation-delay: 0s;
}

#rotate2 h1 {
    -webkit-animation-name: cf4FadeInOut;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 8s;
    -moz-animation-name: cf4FadeInOut;
    -moz-animation-timing-function: ease-in-out;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 8s;
    -o-animation-name: cf4FadeInOut;
    -o-animation-timing-function: ease-in-out;
    -o-animation-iteration-count: infinite;
    -o-animation-duration: 8s;
    animation-name: cf4FadeInOut;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 8s;
}


