#bgflag {
background: url(http://www.eventscongressing.com/intro/bg.png) center center no-repeat;
}
#bgflag:hover {
background: url(http://www.eventscongressing.com/intro/bg-hover.png) center center no-repeat;
}
#enflag {
background: url(http://www.eventscongressing.com/intro/en.png) center center no-repeat;
}
#enflag:hover {
background: url(http://www.eventscongressing.com/intro/en-hover.png) center center no-repeat;
}
/* ----------------------------------------
 Animations
------------------------------------------- */

/* Animation Delays */
.slide-in-left{
	opacity:0;
	animation-name:slideinleft;
	-webkit-animation-name:slideinleft;
	animation-delay:1.5s;
	-webkit-animation-delay:1.5s;
}
.slide-in-top{
	opacity:0;
	animation-name:slideintop;
	-webkit-animation-name:slideintop;
	animation-delay:1s;
	-webkit-animation-delay:1s;
}
.slide-in-bottom{
	opacity:0;
	animation-name:slideinbottom;
	-webkit-animation-name:slideinbottom;
	animation-delay:2s;
	-webkit-animation-delay:2s;
}
.slide-in-bottom-nav{
	opacity:0;
	animation-name:slideinbottomnav;
	-webkit-animation-name:slideinbottomnav;
	animation-delay:2.5s;
	-webkit-animation-delay:2.5s;
}

.slide-out-left{
	opacity:1;
	animation-name:slideoutleft;
	-webkit-animation-name:slideoutleft;
}

/* Animation Common Settings */
.slide-in-left, 
.slide-in-top, 
.slide-in-bottom,
.slide-in-bottom-nav,
.slide-out-left{
	animation-fill-mode:forwards;
	animation-duration:1.3s;
	animation-timing-function:ease;
	animation-iteration-count:1;
	animation-direction:alternate;
	animation-play-state:running;
	-webkit-animation-fill-mode:forwards;
	-webkit-animation-duration:1.3s;
	-webkit-animation-timing-function:ease;
	-webkit-animation-iteration-count:1;
	-webkit-animation-direction:alternate;
	-webkit-animation-play-state:running;
}

/* Animation Keyframes */
@keyframes slideinleft {
	0%   {left:-100px; opacity:0;}
	100% {left:0px; opacity:1;}
}
@-webkit-keyframes slideinleft /* Safari and Chrome */ {
	0%   {left:-100px; opacity:0;}
	100% {left:0px; opacity:1;}
}

@keyframes slideintop {
	0%   {opacity:0;}
	100% {opacity:1;}
}
@-webkit-keyframes slideintop /* Safari and Chrome */ {
	0%   {opacity:0;}
	100% {opacity:1;}
}

@keyframes slideinbottom {
	0%   {bottom:100px; opacity:0;}
	100% {bottom:32px; opacity:1;}
}
@-webkit-keyframes slideinbottom /* Safari and Chrome */ {
	0%   {bottom:100px; opacity:0;}
	100% {bottom:32px; opacity:1;}
}

@keyframes slideinbottomnav {
	0%   {bottom:100px; opacity:0;}
	100% {bottom:40px; opacity:1;}
}
@-webkit-keyframes slideinbottomnav /* Safari and Chrome */ {
	0%   {bottom:100px; opacity:0;}
	100% {bottom:40px; opacity:1;}
}

@keyframes slideoutleft {
	0%   {left:0; opacity:1;}
	100% {left:-100px; opacity:0;}
}
@-webkit-keyframes slideoutleft /* Safari and Chrome */ {
	0%   {left:0; opacity:1;}
	100% {left:-100px; opacity:0;}
}