html{
  width: 100%;
  overflow: hidden;
  padding:0px;margin:0px;
}

body{
padding:0px;margin:0px;}



  /*ROTATE FUNCTIE*/
  #logo{
  margin: 0 auto;
	height: 500px;
	width: 600px;
  animation: roll 3s infinite;
  transform: roll(30deg);
	}

	@keyframes roll {
  	0% {transform: rotate(0);}
  	100% {transform: rotate(360deg);}

	@keyframes roll { 
  	0% {transform: rotate(0);}
  	100% {transform: rotate(360deg);}
	
  @-webkit-keyframes roll { 
  	0% {transform: rotate(0);}
  	100% {transform: rotate(360deg);}
	
  @-moz-keyframes roll { 
  	0% {transform: rotate(0);}
  	100% {transform: rotate(360deg);}
	
  @-ms-keyframes roll { 
  	0% {transform: rotate(0);}
  	100% {transform: rotate(360deg);}
	
  @-o-keyframes roll { 
  	0% {transform: rotate(0);}
  	100% {transform: rotate(360deg);}
  }


/*VERTICAL FLIP-OVER FUNCTIE*/
/*#logo{
  height: 500px;
  width: 500px;
  animation: rotate 3s linear infinite;
  }

  @keyframes rotate {
    0% {transform: rotateX(0);}
    50% {transform: rotateX(180deg);}
    100% {transform: rotateX(360deg);}
  }
  
  @-webkit-keyframes rotate { 
    0% {transform: rotateX(0);}
    50% {transform: rotateX(180deg);}
    100% {transform: rotateX(360deg);}
  }
  
  @-moz-keyframes rotate { 
    0% {transform: rotateX(0);}
    50% {transform: rotateX(180deg);}
    100% {transform: rotateX(360deg);}
  }
  
  @-ms-keyframes rotate { 
    0% {transform: rotateX(0);}
    50% {transform: rotateX(180deg);}
    100% {transform: rotateX(360deg);}
  }
  
  @-o-keyframes rotate { 
    0% {transform: rotateX(0);}
    50% {transform: rotateX(180deg);}
    100% {transform: rotateX(360deg);}
  }*/


/*HORIZONTAL FLIP-OVER FUNCTIE*/
/*#logo{
  position: absolute;
  height: 500px;
  width: 500px;
  animation: rotate 3s linear infinite;
  }

  @keyframes rotate {
    0% {transform: rotateY(0);}
    50% {transform: rotateY(180deg);}
    100% {transform: rotateY(360deg);}
  }
  
  @-webkit-keyframes rotate { 
    0% {transform: rotateY(0);}
    50% {transform: rotateY(180deg);}
    100% {transform: rotateY(360deg);
  }
  
  @-moz-keyframes rotate { 
    0% {transform: rotateY(0);}
    50% {transform: rotateY(180deg);}
    100% {transform: rotateY(360deg);
  }
  
  @-ms-keyframes rotate { 
    0% {transform: rotateY(0);}
    50% {transform: rotateY(180deg);}
    100% {transform: rotateY(360deg);
  }
  
  @-o-keyframes rotate { 
    0% {transform: rotateY(0);}
    50% {transform: rotateY(180deg);}
    100% {transform: rotateY(360deg);
  }

  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}*/


/*SCALE FUNCTIE*/
/*#logo{
    position: absolute;
    margin-top: 10px;
    width: 600px;
    height: 500px;
    text-align: center;
    animation: scale 3s linear infinite;
  }

    @keyframes scale {
      25% {transform: scale(1.0);}
      50% {transform: scale(1.0);}
      75% {transform: scale(1.1);}
      100% {transform: scale(1.0);}
    }
    
    @-webkit-keyframes rotate { 
      25% {transform: scale(1.0);}
      50% {transform: scale(1.0);}
      75% {transform: scale(1.1);}
      100% {transform: scale(1.0);}
    }
  
    @-moz-keyframes rotate { 
      25% {transform: scale(1.0);}
      50% {transform: scale(1.0);}
      75% {transform: scale(1.1);}
      100% {transform: scale(1.0);}
    }
  
    @-ms-keyframes rotate { 
      25% {transform: scale(1.0);}
      50% {transform: scale(1.0);}
      75% {transform: scale(1.1);}
      100% {transform: scale(1.0);}
    }
  
    @-o-keyframes rotate { 
      25% {transform: scale(1.0);}
      50% {transform: scale(1.0);}
      75% {transform: scale(1.1);}
      100% {transform: scale(1.0);}
    } 
*/