/* CSS Document */
.promo, .promo:after {
	height: 550px;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 01;
	overflow: hidden;
	background: #111;
}
.promo:after {
	content: '';
	height: 25px;
	width: 100%;
	background: rgba(35,35,35,0.7) url(../gfk/lines.png) repeat-x top left;
	z-index: 03;
}
.promo li span {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 550px;
	width: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: none;
	-webkit-backface-visibility: hidden;
	-webkit-animation: imageAnimation 18s linear infinite 0s;
	-moz-animation: imageAnimation 18s linear infinite 0s;
	-o-animation: imageAnimation 18s linear infinite 0s;
	-ms-animation: imageAnimation 18s linear infinite 0s;
	animation: imageAnimation 18s linear infinite 0s;
	opacity: 0;
	z-index: 02;
}
.promo div {
	text-align: left;
	position: absolute;
	bottom: 8%;
	left: 0%;
	right: 0%;
	height: auto;
	width: 1020px;
	margin: 0 auto;
	padding: 0 40px;
	-webkit-animation: titleAnimation 18s ease-in-out 1 0s;
	-moz-animation: titleAnimation 18s ease-in-out 1 0s;
	-o-animation: titleAnimation 18s ease-in-out 1 0s;
	-ms-animation: titleAnimation 18s ease-in-out 1 0s;
	animation: titleAnimation 18s ease-in-out 1 0s;
	z-index: 04;
	box-sizing: border-box;
}
.promo article {
	color: #fff;
	height: auto;
	width: 460px;
	padding: 15px 25px 25px 25px;
	background: rgba(000,000,000,0.7);
	background-image: url(../gfk/lines.png);
	background-position: bottom;
	background-repeat: repeat-x;
	border-radius: 2px;
}
.promo article h2 {
	margin: 5px 0;
}
.promo article p {
	font-size: 1rem;
	font-weight: 400;
	margin: 5px 0;
}
.promo article a {
	margin: 15px 10px 0 0;
	display: inline-block;
}
.promo a:link, .promo a:visited {
	color: #444;
	font-size: 0.8rem;
	height: auto;
	width: auto;
	padding: 4px 16px;
	border: none;
	border-radius: 2px;
	background: #fff;
}
.promo a:hover, .promo a:active {
	color: #fff;
	background: #00bdf2;
}
.promo li:nth-child(1) span {
	background-image: url(../promo/all-solutions-electrical-fleet.jpg);
}
.promo li:nth-child(2) span {
	background-image: url(../promo/all-solutions-electrical-testing.jpg);
	-webkit-animation-delay: 6s;
	-moz-animation-delay: 6s;
	-o-animation-delay: 6s;
	-ms-animation-delay: 6s;
	animation-delay: 6s;
}
.promo li:nth-child(3) span {
	background-image: url(../promo/all-solutions-electrical-testing-light.jpg);
	-webkit-animation-delay: 12s;
	-moz-animation-delay: 12s;
	-o-animation-delay: 12s;
	-ms-animation-delay: 12s;
	animation-delay: 12s;
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation {
 0% {
opacity: 0;
 -webkit-animation-timing-function: ease-in;
}
 6% {
opacity: 1;
 -webkit-animation-timing-function: ease-out;
}
 27% {
opacity: 1;
}
 33% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@-moz-keyframes imageAnimation {
 0% {
opacity: 0;
 -moz-animation-timing-function: ease-in;
}
 6% {
opacity: 1;
 -moz-animation-timing-function: ease-out;
}
 27% {
opacity: 1;
}
 33% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@-o-keyframes imageAnimation {
 0% {
opacity: 0;
 -o-animation-timing-function: ease-in;
}
 6% {
opacity: 1;
 -o-animation-timing-function: ease-out;
}
 27% {
opacity: 1;
}
 33% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@-ms-keyframes imageAnimation {
 0% {
opacity: 0;
 -ms-animation-timing-function: ease-in;
}
 6% {
opacity: 1;
 -ms-animation-timing-function: ease-out;
}
 27% {
opacity: 1;
}
 33% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
@keyframes imageAnimation {
 0% {
opacity: 0;
 animation-timing-function: ease-in;
}
 6% {
opacity: 1;
 animation-timing-function: ease-out;
}
 27% {
opacity: 1;
}
 33% {
opacity: 0;
}
 100% {
opacity: 0;
}
}
/* Animation for the title */
@-webkit-keyframes titleAnimation {
 0% {
opacity: 0;
-webkit-transform:translateX(500px);
}
 3% {
opacity: 1;
-webkit-transform:translateX(-100px);
}
 5% {
opacity: 1;
-webkit-transform:translateX(50px);
}
 7% {
opacity: 1;
-webkit-transform:translateX(-10px);
}
 8% {
opacity: 1;
-webkit-transform:translateX(0px);
}
 22% {
opacity: 1;
}
100% {
opacity: 1;
-webkit-transform:translateX(0px);
}
}
@-moz-keyframes titleAnimation {
 0% {
opacity: 0;
-moz-transform:translateX(500px);
}
 3% {
opacity: 1;
-moz-transform:translateX(-100px);
}
 5% {
opacity: 1;
-moz-transform:translateX(50px);
}
 7% {
opacity: 1;
-moz-transform:translateX(-10px);
}
 8% {
opacity: 1;
-moz-transform:translateX(0px);
}
 22% {
opacity: 1;
}
100% {
opacity: 1;
-moz-transform:translateX(0px);
}
}
@-o-keyframes titleAnimation {
 0% {
opacity: 0;
-o-transform:translateX(500px);
}
 3% {
opacity: 1;
-o-transform:translateX(-100px);
}
 5% {
opacity: 1;
-o-transform:translateX(50px);
}
 7% {
opacity: 1;
-o-transform:translateX(-10px);
}
 8% {
opacity: 1;
-o-transform:translateX(0px);
}
 22% {
opacity: 1;
}
100% {
opacity: 1;
-o-transform:translateX(0px);
}
}
@-ms-keyframes titleAnimation {
 0% {
opacity: 0;
-ms-transform:translateX(500px);
}
 3% {
opacity: 1;
-ms-transform:translateX(-100px);
}
 5% {
opacity: 1;
-ms-transform:translateX(50px);
}
 7% {
opacity: 1;
-ms-transform:translateX(-10px);
}
 8% {
opacity: 1;
-ms-transform:translateX(0px);
}
 22% {
opacity: 1;
}
100% {
opacity: 1;
-ms-transform:translateX(0px);
}
}
@keyframes titleAnimation {
 0% {
opacity: 0;
transform:translateX(500px);
}
 3% {
opacity: 1;
transform:translateX(-100px);
}
 5% {
opacity: 1;
transform:translateX(50px);
}
 7% {
opacity: 1;
transform:translateX(-10px);
}
 8% {
opacity: 1;
transform:translateX(0px);
}
 22% {
opacity: 1;
}
100% {
opacity: 1;
transform:translateX(0px);
}
}
/* Show at least something when animations not supported */
.no-cssanimations .promo li span {
	opacity: 1;
}