body {
  background-color: #F0F2D6;
}

.floatingHead {
  width: 75%;
  height: auto;
  position: relative; 
  margin: auto; 
  margin-top: 30%;
  margin-bottom: 2%;
  left: 0; 
  right: 0; 
}

.icon {
  width: 8%;
  height: auto ;
  margin: 2%;
}

@media only screen and (orientation : landscape) {    
  .floatingHead { 
    width: 40%;
    height: auto;
    position: relative; 
    margin: auto; 
    margin-top: 1%;
    margin-bottom: 2%;  
  }

  .icon {
    width: 5%;
    height: auto ;
    margin: 2%;
  }
}

.name {
  font-style: italic;
}

#rotator img {
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
  }
  
  #rotator img:hover {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  }