/* expo */

.expo {
	padding: 15px 15px 60px;
	font-size: 1.8em;
}
.expo .fa {
	color: #4E9742;
	font-size: 3em;
}

/* expo end */

/* diverse */

#limit {
	max-width: inherit !important;
}
.input-mini {
	width: auto;
}
/* diverse end */


/* my custom logo */
#logo a{
	line-height: 90px;
	height: 90px;
	font-size: 24px;
	padding: 25px 0;
}
.l1 {
	font-weight: 700;
	letter-spacing: 3px;
	color: #fff;
	padding: 12px 14px;
	background-color: #2d841f;
	border-radius: 1.5px;
	animation: logo 5s ease-out infinite;
}

.l2 {
	font-weight: 600;
	padding-left: 4px;
}

@keyframes logo {
	0% {
		background-color: #2d841f;
	}
	23% {
		background-color: #2d981f;
		border-radius: 5px;
	}
	46% {
		background-color: #2d7a1f;
		border-radius: 8px;
	}
	69% {
		background-color: #2d5c1f;	
		border-radius: 5px;
	}
	92% {
		background-color: #2d701f;	
	}
	100% {
		background-color: #2d841f;	
	}
}

/* my custom logo end */

/* flow animation */
.flowimg {
	position: relative;
	animation: flowimg  1.5s ease-out;
}

.flowtitle {
	font-size: 30px;
	font-weight: bold;
	margin: 30px 0;
	position: relative;
	animation: flowtitle 1.5s ease-out;
}
.flowtext {
	font-size: 24px;
	animation: flowtext 4.5s ease forwards;
}

@keyframes flowimg {
  0% {
    left: -2000px;
  }
  100% {
   left: 0px;
  }
}

@keyframes flowtitle {
  0% {
	right: -2000px;
  }
  100% {
    right: 0px;
  }
}

@keyframes flowtext{
  0% {
   opacity: 0;
   visibility: hidden;
  } /* equals 50% delay of animatin-time - use for browser without css animation to overcome visibility problems */
  50% {
   opacity: 0;
   visibility: hidden;
  }
  100% {
    opacity: 1;
	visibility: visible;
  }
}
/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
.flowimg {
	background-image: url("/images/elements/handheld-xs.jpg");
	background-repeat: no-repeat;
	height: 100%;
}
.flow {
	height: 205px;
}
.flowmain {
	margin-top: 20px;
}
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
.flowimg {
	background-image: url("/images/elements/handheld-sm.jpg");
}
.flow {
	height: 256px;
}
.flowmain {
	margin-top: 45px;
	}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.flowimg {
	background-image: url("/images/elements/handheld-md.jpg");
}
.flow {
	height: 312px;
}
.flowmain {
	margin-top: 73px;
	}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
.flowimg {
	background-image: url("/images/elements/handheld.jpg");
}
.flow {
	height: 390px;
}
.flowmain {
	margin-top: 112px;
	}
}
/* flow animation end */