header{
//border-bottom:2px ridge grey;

height:110px;
/* background-image:url('logo/company_logo_1.png');
background-repeat:no-repeat; */
/* background-position-x:80px; */
//width:100%;
overflow-x:hidden;
}
#logocontainer
{
position: relative;
float: left;
width: 1000px;
overflow: hidden;
height: 105px;
}
#cube1
{
	height:60px;
	width:60px;
	background:url(logo/cube.png) no-repeat;
	position:absolute;
	left: 45px;
	animation-name:cube1;
	animation:cube1 500ms;
	/*animation-delay:1s;*/
	-webkit-animation-name:cube1;
	-webkit-animation:cube1 500ms;
/*	-webkit-animation-delay:1s;	*/
	top:8px;
}
@-webkit-keyframes cube1
{
	0%{transform:translateY(-200px);
		-webkit-animation-timing-function:linear;}
	100%{transform:translateY(8px);
		-webkit-animation-timing-function:linear;
		top:8px;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}
@keyframes cube1
{
	0%{transform:translateX(-200px);
		animation-timing-function:linear;}
	100%{transform:translateX(8px);
	
		animation-timing-function:linear;
		top:8px;}
}

#cube2
{
	height:60px;
	width:60px;
	background:url(logo/cube.png) no-repeat;
	position:absolute;
	left: 16px;
	top:26px;
	animation-name:cube2;
	animation:cube2 500ms;
	animation-delay:300ms;
	-webkit-animation-name:cube2;
	-webkit-animation:cube2 500ms;
	-webkit-animation-delay:300ms;	
}
@-webkit-keyframes cube2
{
	0%{transform:translateY(-200px);
		-webkit-animation-timing-function:linear;}
	100%{transform:translateY(26px);
		-webkit-animation-timing-function:linear;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}
@keyframes cube2
{
	0%{transform:translateX(-200px);
		animation-timing-function:linear;
		}
	100%{transform:translateX(26px);
		animation-timing-function:linear;
		top:26px;}
}

#cube3
{
	height:60px;
	width:60px;
	background:url(logo/cube.png) no-repeat;
	position:absolute;
	top: 45px;
	left: 45px;
	animation-name:cube3;
	animation:cube3 1s;
	animation-delay:500ms;
	-webkit-animation-name:cube3;
	-webkit-animation:cube3 1s;
	-webkit-animation-delay:500ms;	
}

@-webkit-keyframes cube3
{
	0%{transform:translateX(1920px);
		-webkit-animation-timing-function:linear;
		/*opacity:0;*/}
	100%{transform:translateX(119px);
			opacity:1;
		-webkit-animation-timing-function:linear;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}

@keyframes cube3
{
	0%{transform:translateX(1920px);
		animation-timing-function:linear;
		/*opacity:0;*/
		}
	100%{transform:translateX(119px);
	opacity:1;
		animation-timing-function:linear;
		transform: translateZ(0) scale(1.0, 1.0);
		}
}

#logob
{
width:31px;
height:39px;
background:url(logo/logo_B.jpg);
background-repeat:no-repeat;
position:absolute;
left:117px;
top:26px;
	animation-name:logob;
	animation:cube3 600ms;
	//animation-delay:2s;
	-webkit-animation-name:logob;
	-webkit-animation:logob 600ms;
	//-webkit-animation-delay:2s;	
}

@-webkit-keyframes logob
{
	0%{transform:translateY(-200px);
		-webkit-animation-timing-function:linear;
		/*opacity:0;*/}
	100%{transform:translateY(35px);
			opacity:1;
		-webkit-animation-timing-function:linear;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}

@keyframes logob
{
	0%{transform:translateY(-200px);
		animation-timing-function:linear;
		/*opacity:0;*/
		}
	100%{transform:translateY(35px);
	opacity:1;
		animation-timing-function:linear;
		transform: translateZ(0) scale(1.0, 1.0);
		}
}


#logoc
{
width:33px;
height:39px;
background:url(logo/logo_C.jpg);
background-repeat:no-repeat;
position:absolute;
left: 148px;
top: 26px;
	animation-name:logoc;
	animation:logoc 700ms;
	//animation-delay:2.5s;
	-webkit-animation-name:logoc;
	-webkit-animation:logoc 700ms;
	//-webkit-animation-delay:2.5s;	
}

@-webkit-keyframes logoc
{
	0%{transform:translateY(-200px);
		-webkit-animation-timing-function:linear;
		/*opacity:0;*/}
	100%{transform:translateY(26px);
			opacity:1;
		-webkit-animation-timing-function:linear;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}

@keyframes logoc
{
	0%{transform:translateY(-200px);
		animation-timing-function:linear;
		/*opacity:0;*/
		}
	100%{transform:translateY(26px);
	opacity:1;
		animation-timing-function:linear;
		transform: translateZ(0) scale(1.0, 1.0);
		}
}


#logol
{
width:29px;
height:39px;
background:url(logo/logo_L.jpg);
background-repeat:no-repeat;
position:absolute;
left: 181px;
top: 26px;
	animation-name:logol;
	animation:logol 800ms;
	//animation-delay:2.7s;
	-webkit-animation-name:logol;
	-webkit-animation:logol 800ms;
	//-webkit-animation-delay:2.7s;	
}

@-webkit-keyframes logol
{
	0%{transform:translateY(-200px);
		-webkit-animation-timing-function:linear;
		/*opacity:0;*/}
	100%{transform:translateY(26px);
			opacity:1;
		-webkit-animation-timing-function:linear;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}

@keyframes logol
{
	0%{transform:translateY(-200px);
		animation-timing-function:linear;
		/*opacity:0;*/
		}
	100%{transform:translateY(-26px);
	opacity:1;
		animation-timing-function:linear;
		transform: translateZ(0) scale(1.0, 1.0);
		}
}

#logobar
{
width:16px;
height:94px;
background:url(logo/bar.png);
background-repeat:no-repeat;
position:absolute;
left: 210px;
top: 0px;
	animation-name:logobar;
	animation:logobar 1s;
	animation-delay:0.8s;
	-webkit-animation-name:logobar;
	-webkit-animation:logobar 1s;
	-webkit-animation-delay:0.8s;	
}

@-webkit-keyframes logobar
{
	0%{transform:translateY(200px);
		-webkit-animation-timing-function:linear;
		opacity:0;}
		10%{opacity:1;}
	100%{transform:translateY(9px);
			
		-webkit-animation-timing-function:linear;
		-webkit-transform: translateZ(0) scale(1.0, 1.0);}
}

@keyframes logobar
{
	0%{transform:translateY(200px);
		animation-timing-function:linear;
		opacity:0;
		}
		10%{opacity:1;}
	100%{transform:translateY(9px);
	opacity:1;
		animation-timing-function:linear;
		transform: translateZ(0) scale(1.0, 1.0);
		}
}
.logoimage 
{
overflow: hidden;
width: 188px;
height: 94px;
position: relative;
left: 216px;
}

.fadingeffect {
//height:94px;
z-index:2;
    position:absolute;
    top:0; bottom:0; right:0;
    width:0%;
    background:white;
	animation-name:showHide;
	animation:showHide 2s cubic-bezier(1,0,.75,.25);
	//animation-delay:4.5s;
	-webkit-animation-name:showHide;
	-webkit-animation:showHide 2s cubic-bezier(1,0,.75,.25);
	//-webkit-animation-delay:4.5s;
    //-moz-animation: showHide 5s ease-in; /* Firefox */
    //-webkit-animation: showHide 5s ease-in; /* Safari and Chrome */
    //-ms-animation: showHide 5s ease-in; /* IE10 */
    //-o-animation: showHide 5s ease-in; /* Opera */

}
@-webkit-keyframes showHide { /* Chrome, Safari */
    0% {width:100%}
    100% {width:0%;}
}
@-moz-keyframes showHide { /* FF */
    0% {width:100%}
    100% {width:0%;}
}
@-ms-keyframes showHide { /* IE10 */
    0% {width:100%}
    100% {width:0%;}
}
@-o-keyframes showHide { /* Opera */
    0% {width:100%}
    100% {width:0%;}
}
@keyframes showHide {
    0% {width:100%}
    100% {width:0%;}
}