﻿p	{
	font-family:'Poppins', sans-serif;
}

a:link       { text-decoration: none }

a:visited    { text-decoration: none }

a:hover      { text-decoration: underline }

a:link       {
	color: rgb(102, 102, 102)
}

a:active     { color: rgb(204, 51, 0) }
a:visited    { color: rgb(102, 102, 102) }

.element {
  border-radius: 50%;
  height: 14px;
  width: 14px;
  margin: 0 auto;
  background-color: #d7801c;
  animation-name: stretch;
  animation-duration: 4s; 
  animation-timing-function: ease-out; 
  animation-delay: 0;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: backwards;
  animation-play-state: paused;
  -webkit-animation-name: stretch;
  -webkit-animation-duration: 4s; 
  -webkit-animation-timing-function: ease-out; 
  -webkit-animation-delay: 0;
  -webkit-animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-fill-mode: backwards;
  -webkit-animation-play-state: paused;
}

.element2 {
  border-radius: 50%;
  height: 35px;
  width: 35px;
  margin: 0 auto;
  background-color: #F6F;
  animation-name: stretch2;
  animation-duration: 10s; 
  animation-timing-function: ease-out; 
  animation-delay: 0;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: backwards;
  animation-play-state: paused;
  -webkit-animation-name: stretch2;
  -webkit-animation-duration: 10s; 
  -webkit-animation-timing-function: ease-out; 
  -webkit-animation-delay: 0;
  -webkit-animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-fill-mode: backwards;
  -webkit-animation-play-state: paused;
}

@keyframes stretch {
  0% {
	transform:none;
    /*transform: scale(.1);*/
	opacity:0.0;
  }
  100% {
    /*transform: scale(1.0);*/
	transform:none;
	opacity:1.0;
  }
}
  
@-webkit-keyframes stretch {
  0% {
	transform:none;
    /*transform: scale(.1);*/
	opacity:0.0;
  }
  100% {
    /*transform: scale(1.0);*/
	transform:none;
	opacity:1.0;
  }
}

@keyframes stretch2 {
  0% {
	transform:none;
    /*transform: scale(.1);*/
	opacity:0.0;
  }
  100% {
    /*transform: scale(1.0);*/
	transform:none;
	opacity:0.5;
  }
}
  
@-webkit-keyframes stretch2 {
  0% {
	transform:none;
    /*transform: scale(.1);*/
	opacity:0.0;
  }
  100% {
    /*transform: scale(1.0);*/
	transform:none;
	opacity:0.5;
  }
}

* { padding: 0; margin: 0; }
html, body { height: 100%; width: 100%; }

/******** + Sticky Footer including Header ********/
#content {
    min-height: 100%;
    margin-bottom: -200px; /* Equivalent to footer's height */
    
    /* padding-top   : 50px;  Equivalent to header's height */
    padding-bottom: 200px; /* Equivalent to footer's height */
    
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#header {
    height: 50px;
    position: fixed;
    top: 0;
    left: 0; right: 0; /* Make it fill the whole horizontal space */
}

#footer {
    height: 200px;
    position: relative;
    z-index: 1;
}
/*************** - Sticky Footer ******************/



