body {
    font-family: sans-serif;
}

nav {
    font-family: sans-serif;
}


#cf {
    position: relative;    
    width: 800px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}

#cf img {
    position: absolute;
    left: 0;
/*    -webkit-transition: opacity 2s ease-in-out;
    -moz-transition: opacity 2s ease-in-out;
    -o-transition: opacity 2s ease-in-out;
    transition: opacity 2s ease-in-out; */
}

/*#cf img.top:hover {
    opacity:0;
}
*/

@-webkit-keyframes cfFadeInOut {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}

@-moz-keyframes cfFadeInOut {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}

@-o-keyframes cfFadeInOut {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}

@keyframes cfFadeInOut {
  0% {
  opacity:1;
}
45% {
opacity:1;
}
55% {
opacity:0;
}
100% {
opacity:0;
}
}

#cf img.top {
-webkit-animation-name: cfFadeInOut;
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 6s;
-webkit-animation-direction: alternate;

-moz-animation-name: cfFadeInOut;
-moz-animation-timing-function: ease-in-out;
-moz-animation-iteration-count: infinite;
-moz-animation-duration: 6s;
-moz-animation-direction: alternate;

-o-animation-name: cfFadeInOut;
-o-animation-timing-function: ease-in-out;
-o-animation-iteration-count: infinite;
-o-animation-duration: 6s;
-o-animation-direction: alternate;

animation-name: cfFadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 6s;
animation-direction: alternate;
}




.text-email {
    position: absolute;
    top: 500px;
    left: auto;
    margin-left: auto;
    margin-right: auto;
}

#blank-space {
    position: relative;
    left: 0;
    width: 800px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}