#fade_body { top: 0px !important; }

/* @group container */
#container 	{/* " !important; " is required for the overlay  in this theme (EX4) with the sliude page activated, an alternative is:   ease-in-out !important;  */
  -webkit-animation: slide-content 1.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  -moz-animation: slide-content 1.3s cubic-bezier(0.250, 0.460, 0.450, 0.940)both;
  -o-animation: slide-content 1.3s cubic-bezier(0.250, 0.460, 0.450, 0.940)both;
  animation: slide-content 1.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  
      /*-webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;*/  
    -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;  
  
    -webkit-animation-delay: 0.35s;
  animation-delay: 0.35s;  
  /*-webkit-animation-fill-mode: both;
  animation-fill-mode: both;*/  
}
/* Prevent first frame from flickering when animation starts    
    no good for speed of the page :( */
/*   -webkit-animation-fill-mode: both;
  animation-fill-mode: both; */   
  
  /* -webkit-backface-visibility: hidden; 	
      
  -webkit-transform-style: preserve-3d;
*/ 
  
@keyframes slide-content { 
0%{
opacity:0;
 transform:            scale(0.9) translateY(11px); 
 -moz-transform:    scale(0.9) translateY(11px); 
 -webkit-transform: scale(0.9) translateY(11px); 
 -o-transform:       scale(0.9) translateY(11px); 
 -ms-transform:     scale(0.9) translateY(11px); 
} 
40%{
opacity:0;
 transform:            scale(0.9) translateY(11px); 
 -moz-transform:    scale(0.9) translateY(11px);
 -webkit-transform: scale(0.9) translateY(11px); 
 -o-transform:        scale(0.9) translateY(11px);
 -ms-transform:     scale(0.9) translateY(11px); 
} 
95%{
opacity:1;
} 
100%{
opacity:1;
 transform:            scale(1) translateY(0px); 
 -moz-transform:    scale(1) translateY(0px); 
 -webkit-transform: scale(1) translateY(0px); 
 -o-transform:        scale(1) translateY(0px); 
 -ms-transform:      scale(1) translateY(0px); 
}
}

@-webkit-keyframes slide-content {
0%{
opacity:0;
 -webkit-transform: scale(0.9) translateY(11px); 
} 
40%{
opacity:0;
 -webkit-transform: scale(0.9) translateY(11px); 
} 
95%{
opacity:1;
} 
100%{
opacity:1;
 -webkit-transform: scale(1) translateY(1px);  
}
}
/* @end */

/* ---- */

/* @group left colum */
#left, .left_side 	{ 
  -webkit-animation: slide-left_column 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
  -moz-animation: slide-left_column 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
  -o-animation: slide-left_column 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
  animation: slide-left_column 1.2s cubic-bezier(0.250, 0.460, 0.450, 0.940)  ;  
   -webkit-animation-delay: 0.45s;
  animation-delay: 0.45s;
  
    /*-webkit-animation-fill-mode: both;
  animation-fill-mode: both;*/  
      -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;  
  
	/*opacity: 0;*/
}  
@keyframes slide-left_column { 
0%{opacity:0;} 
40%{opacity:0;} 
95%{opacity:1;} 
100%{opacity:1; }
}
/* Safari and Chrome */
@-webkit-keyframes slide-left_column {
0%{opacity:0;} 
40%{opacity:0;} 
95%{opacity:1;} 
100%{opacity:1;
}
}
/* @end */

/* --- */

/* @group bodyimage */
#bodyimage	{ 
  -webkit-animation: fade_bodyimage 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
  -moz-animation: fade_bodyimage 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
  -o-animation: fade_bodyimage 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
  animation: fade_bodyimage 1s cubic-bezier(0.250, 0.460, 0.450, 0.940)  ;  
   /*-webkit-animation-delay: 0.15s;
  animation-delay: 0.15s;*/  
    /*-webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;*/  
    -webkit-animation-fill-mode: backwards;
  animation-fill-mode: backwards;  
}  
@keyframes fade_bodyimage { 
0%{opacity:0;} 
40%{opacity:0;} 
95%{opacity:1;} 
100%{opacity:1; }
}
/* Safari and Chrome */
@-webkit-keyframes fade_bodyimage {
0%{opacity:0;} 
40%{opacity:0;} 
95%{opacity:1;} 
100%{opacity:1;
}
}
/* @end */