/*************Preloader**********************/

.preloader{
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-repeat: repeat;
   z-index: 10000;
   transition: all 1s linear;
   background: #9E9E9E;
   background-size: cover;
}

.preloader .action-load{
    position: absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.preloader .logo-load{
    width: 350px;
    height: 270px;
    position: relative;
}
.preloader .logo-load .layout{
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    opacity:0;
    transform: scale(0);
    -webkit-animation-duration: 6s;
    -moz-animation-duration: 6s;
    -o-animation-duration: 6s;
    animation-duration: 6s;
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    -o-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
.preloader .logo-load .layout1{
    background: url('../img/load-layout1.png');
    -webkit-animation-name: loading1;
    -moz-animation-name: loading1;
    -o-animation-name: loading1;
    animation-name: loading1;
    -webkit-transform-origin: 50% 100% 0;
    -moz-transform-origin: 50% 100% 0;
    -o-transform-origin: 50% 100% 0;
    transform-origin: 50% 100% 0;
}


@media (max-width: 500px) {
	
.preloader .logo-load{
    width: 200px;
    height: 154px;
    position: relative;
}
	
	
	
.preloader .logo-load .layout1{
    background: url('../img/mobil-load-layout1.png') !important;
    -webkit-animation-name: loading1;
    -moz-animation-name: loading1;
    -o-animation-name: loading1;
    animation-name: loading1;
    -webkit-transform-origin: 50% 100% 0;
    -moz-transform-origin: 50% 100% 0;
    -o-transform-origin: 50% 100% 0;
    transform-origin: 50% 100% 0;
}




}	


@-webkit-keyframes loading1 {
    0%{
        opacity:0;
        -webkit-transform: scale(0);
    }
    13% {
        opacity:1;
        -webkit-transform: scale(1);
    }

    52%{
        opacity:1;
        -webkit-transform: scale(1);
    }
    64% {
        opacity:0;
        -webkit-transform: scale(1);
    }

    100% {
        opacity:0;
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes loading1 {
    0%{
        opacity:0;
        -moz-transform: scale(0);
    }
    13% {
        opacity:1;
        -moz-transform: scale(1);
    }

    52%{
        opacity:1;
        -moz-transform: scale(1);
    }
    64% {
        opacity:0;
        -moz-transform: scale(1);
    }

    100% {
        opacity:0;
        -moz-transform: scale(1);
    }
}
@-o-keyframes loading1 {
    0%{
        opacity:0;
        -o-transform: scale(0);
    }
    13% {
        opacity:1;
        -o-transform: scale(1);
    }

    52%{
        opacity:1;
        -o-transform: scale(1);
    }
    64% {
        opacity:0;
        -o-transform: scale(1);
    }

    100% {
        opacity:0;
        -o-transform: scale(1);
    }
}
@keyframes loading1 {
    0%{
        opacity:0;
        transform: scale(0);
    }
    13% {
        opacity:1;
        transform: scale(1);
    }

    52%{
        opacity:1;
        transform: scale(1);
    }
    64% {
        opacity:0;
        transform: scale(1);
    }

    100% {
        opacity:0;
        transform: scale(1);
    }
}



@-webkit-keyframes loading2 {
    0%{
        opacity:0;
        -webkit-transform: scale(0);
    }
    13% {
        opacity:0;
        -webkit-transform: scale(0);
    }
    26% {
        opacity:1;
        -webkit-transform: scale(1);
    }
    64% {
        opacity:1;
        -webkit-transform: scale(1);
    }
    76%{
        opacity:0;
        -webkit-transform: scale(1);
    }

    100% {
        opacity:0;
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes loading2 {
    0%{
        opacity:0;
        -moz-transform: scale(0);
    }
    13% {
        opacity:0;
        -moz-transform: scale(0);
    }
    26% {
        opacity:1;
        -moz-transform: scale(1);
    }
    64% {
        opacity:1;
        -moz-transform: scale(1);
    }
    76%{
        opacity:0;
        -moz-transform: scale(1);
    }

    100% {
        opacity:0;
        -moz-transform: scale(1);
    }
}
@-o-keyframes loading2 {
    0%{
        opacity:0;
        -o-transform: scale(0);
    }
    13% {
        opacity:0;
        -o-transform: scale(0);
    }
    26% {
        opacity:1;
        -o-transform: scale(1);
    }
    64% {
        opacity:1;
        -o-transform: scale(1);
    }
    76%{
        opacity:0;
        -o-transform: scale(1);
    }

    100% {
        opacity:0;
        -o-transform: scale(1);
    }
}
@keyframes loading2 {
    0%{
        opacity:0;
        transform: scale(0);
    }
    13% {
        opacity:0;
        transform: scale(0);
    }
    26% {
        opacity:1;
        transform: scale(1);
    }
    64% {
        opacity:1;
        transform: scale(1);
    }
    76%{
        opacity:0;
        transform: scale(1);
    }

    100% {
        opacity:0;
        transform: scale(1);
    }
}


@-webkit-keyframes loading3 {
    0%{
        opacity:0;
        -webkit-transform: scale(0);
    }
    26% {
        opacity:0;
        -webkit-transform: scale(0);
    }
    39%{
        opacity:1;
        -webkit-transform: scale(1);
    }
    76%{
        opacity:1;
        -webkit-transform: scale(1);
    }
    88%{
        opacity:0;
        -webkit-transform: scale(1);
    }
    100% {
        opacity:0;
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes loading3 {
    0%{
        opacity:0;
        -moz-transform: scale(0);
    }
    26% {
        opacity:0;
        -moz-transform: scale(0);
    }
    39%{
        opacity:1;
        -moz-transform: scale(1);
    }
    76%{
        opacity:1;
        -moz-transform: scale(1);
    }
    88%{
        opacity:0;
        -moz-transform: scale(1);
    }
    100% {
        opacity:0;
        -moz-transform: scale(1);
    }
}
@-o-keyframes loading3 {
    0%{
        opacity:0;
        -o-transform: scale(0);
    }
    26% {
        opacity:0;
        -o-transform: scale(0);
    }
    39%{
        opacity:1;
        -o-transform: scale(1);
    }
    76%{
        opacity:1;
        -o-transform: scale(1);
    }
    88%{
        opacity:0;
        -o-transform: scale(1);
    }
    100% {
        opacity:0;
        -o-transform: scale(1);
    }
}
@keyframes loading3 {
    0%{
        opacity:0;
        transform: scale(0);
    }
    26% {
        opacity:0;
        transform: scale(0);
    }
    39%{
        opacity:1;
        transform: scale(1);
    }
    76%{
        opacity:1;
        transform: scale(1);
    }
    88%{
        opacity:0;
        transform: scale(1);
    }
    100% {
        opacity:0;
        transform: scale(1);
    }
}


@-webkit-keyframes loading4 {
    0%{
        opacity:0;
        -webkit-transform: scale(0);
    }
    39%{
        opacity:0;
        -webkit-transform: scale(0);
    }
    52%{
        opacity:1;
        -webkit-transform: scale(1);
    }
    88%{
        opacity:1;
        -webkit-transform: scale(1);
    }
    100% {
        opacity:0;
        -webkit-transform: scale(1);
    }
}
@-moz-keyframes loading4 {
    0%{
        opacity:0;
        -moz-transform: scale(0);
    }
    39%{
        opacity:0;
        -moz-transform: scale(0);
    }
    52%{
        opacity:1;
        -moz-transform: scale(1);
    }
    88%{
        opacity:1;
        -moz-transform: scale(1);
    }
    100% {
        opacity:0;
        -moz-transform: scale(1);
    }
}
@-o-keyframes loading4 {
    0%{
        opacity:0;
        -o-transform: scale(0);
    }
    39%{
        opacity:0;
        -o-transform: scale(0);
    }
    52%{
        opacity:1;
        -o-transform: scale(1);
    }
    88%{
        opacity:1;
        -o-transform: scale(1);
    }
    100% {
        opacity:0;
        -o-transform: scale(1);
    }
}
@keyframes loading4 {
    0%{
        opacity:0;
        transform: scale(0);
    }
    39%{
        opacity:0;
        transform: scale(0);
    }
    52%{
        opacity:1;
        transform: scale(1);
    }
    88%{
        opacity:1;
        transform: scale(1);
    }
    100% {
        opacity:0;
        transform: scale(1);
    }
}