/* STYLESHEET MADE BY GOTHLLY (C) 2016-2022 ALL RIGHTS RESERVED | DON'T: COPY, TRACE, SELL, EDIT, STEAL OR REVAMP MY WORK. YOU'RE WARNED! */

#Button {padding:0;margin:0 auto;} 
#Button img { position:absolute;transition: all .6s ease-in-out;}  
#Button img.novisible {opacity:0;filter:alpha(opacity=0);} 
#Button:hover img.novisible {opacity:1;filter:alpha(opacity=100);}
#Button:hover img.visible {opacity:0;filter:alpha(opacity=0);}
#Button img.visible:hover {opacity:0;filter:alpha(opacity=0);}
  
#Button2 {padding:0;margin:0 auto;}
#Button2 img { position:absolute;transition: all .6s ease-in-out;}
#Button2 img.novisible {opacity:0;filter:alpha(opacity=0);}
#Button2:hover img.novisible {opacity:1;filter:alpha(opacity=100);}
#Button2:hover img.visible {opacity:1;filter:alpha(opacity=100);}
#Button2 img.visible:hover {opacity:0;filter:alpha(opacity=100);}
#Button2 {animation-name: floating;animation-duration: 2s;animation-iteration-count: infinite;animation-timing-function: ease-in-out;}
  @keyframes floating {
     from { transform: translate(0,  0px); }
     65%  { transform: translate(0, 15px); }
     to   { transform: translate(0, -0px); }}
  
#Button3 {padding:0;margin:0 auto;}  
#Button3 img { position:absolute;transition: all .6s ease-in-out;} 
#Button3 img.novisible {opacity:0;filter:alpha(opacity=0);}  
#Button3:hover img.novisible {opacity:1;filter:alpha(opacity=100);margin-top: -10px;}  
#Button3:hover img.visible {opacity:1;filter:alpha(opacity=0);margin-top: -10px;} 
#Button3 img.visible:hover {opacity:0;filter:alpha(opacity=0);}

#Button4 {padding:0;margin:0 auto;}  
#Button4 img { position:absolute;transition: all .6s ease-in-out;} 
#Button4 img.novisible {opacity:0;filter:alpha(opacity=0);}  
#Button4:hover img.novisible {opacity:1;filter:alpha(opacity=100);margin-top: -10px;}  
#Button4:hover img.visible {opacity:1;filter:alpha(opacity=0);margin-top: -10px;} 
#Button4 img.visible:hover {opacity:0;filter:alpha(opacity=0);}
#Button4 {animation-name: floating;animation-duration: 2s;animation-iteration-count: infinite;animation-timing-function: ease-in-out;}
  @keyframes floating {
     from { transform: translate(0,  0px); }
     65%  { transform: translate(0, 20px); }
     to   { transform: translate(0, -0px); }}