.load{
    position: fixed;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    top: 0;
    left: 0;
    background: white;
    z-index: 10; 
    -webkit-perspective: 400px;
    perspective: 400px;
    -ms-perspective: 1000px;
}

#logo1{
    position: fixed;
    height: 20vw;
    width: 20vw;
    margin-left: -10vw;
    margin-top: -10vw;
    left: 50%;
    top: 50%;
    background-image: url("slike/logo1.png");
    background-position: top;
    background-size: 100%;
    background-repeat: no-repeat;
    -webkit-animation: spinner 2s infinite ease-in-out;
    -webkit-animation-direction: alternate;
    -webkit-transform-style: preserve-3d;
    animation: spinner 2s infinite ease-in-out;
    animation-direction: alternate;
    transform-style: preserve-3d;
}

#logo2{
    position: fixed;
    height: 20vw;
    width: 20vw;
    margin-left: -10vw;
    margin-top: -10vw;
    left: 50%;
    top: 50%;
    background-image: url("slike/logo2.png");
    background-position: bottom;
    background-size: 100%;
    background-repeat: no-repeat;
    -webkit-animation: spinner 2s infinite 0.5s ease-in-out;
    -webkit-animation-direction: alternate;
    -webkit-transform-style: preserve-3d;
    animation: spinner 2s infinite 0.5s ease-in-out;
    animation-direction: alternate;
    transform-style: preserve-3d;
}

@keyframes spinner{
    100%{
        transform: rotateY(1turn);
    }
}
@-webkit-keyframes spinner{
    100%{
        transform: rotateY(1turn);
    }
}
@-ms-keyframes spinner{
    100%{
        transform: rotateY(1turn);
    }
}