.la-line-spin-clockwise-fade,
.la-line-spin-clockwise-fade > div {
    position: relative;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.la-line-spin-clockwise-fade {
    display: block;
    font-size: 0;
    color: #fff;
}
.la-line-spin-clockwise-fade.la-dark {
    color: #333;
}
.la-line-spin-clockwise-fade > div {
    display: inline-block;
    float: none;
    background-color: currentColor;
    border: 0 solid currentColor;
}
.la-line-spin-clockwise-fade {
    width: 32px;
    height: 32px;
}
.la-line-spin-clockwise-fade > div {
    position: absolute;
    width: 10px;
    height: 10px;
    margin: 2px;
    margin-top: -5px;
    margin-left: -1px;
    border-radius: 0;
    -webkit-animation: line-spin-clockwise-fade 1s infinite ease-in-out;
       -moz-animation: line-spin-clockwise-fade 1s infinite ease-in-out;
         -o-animation: line-spin-clockwise-fade 1s infinite ease-in-out;
            animation: line-spin-clockwise-fade 1s infinite ease-in-out;
}
.la-line-spin-clockwise-fade > div:nth-child(1) {
    top: 15%;
    left: 50%;
    -webkit-transform: rotate(0deg);
       -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
         -o-transform: rotate(0deg);
            transform: rotate(0deg);
    -webkit-animation-delay: -.875s;
       -moz-animation-delay: -.875s;
         -o-animation-delay: -.875s;
            animation-delay: -.875s;
}
.la-line-spin-clockwise-fade > div:nth-child(2) {
    top: 25.2512626585%;
    left: 74.7487373415%;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-animation-delay: -.75s;
       -moz-animation-delay: -.75s;
         -o-animation-delay: -.75s;
            animation-delay: -.75s;
}
.la-line-spin-clockwise-fade > div:nth-child(3) {
    top: 50%;
    left: 85%;
    -webkit-transform: rotate(90deg);
       -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
         -o-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-animation-delay: -.625s;
       -moz-animation-delay: -.625s;
         -o-animation-delay: -.625s;
            animation-delay: -.625s;
}
.la-line-spin-clockwise-fade > div:nth-child(4) {
    top: 74.7487373415%;
    left: 74.7487373415%;
    -webkit-transform: rotate(135deg);
       -moz-transform: rotate(135deg);
        -ms-transform: rotate(135deg);
         -o-transform: rotate(135deg);
            transform: rotate(135deg);
    -webkit-animation-delay: -.5s;
       -moz-animation-delay: -.5s;
         -o-animation-delay: -.5s;
            animation-delay: -.5s;
}
.la-line-spin-clockwise-fade > div:nth-child(5) {
    top: 84.9999999974%;
    left: 50.0000000004%;
    -webkit-transform: rotate(180deg);
       -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
         -o-transform: rotate(180deg);
            transform: rotate(180deg);
    -webkit-animation-delay: -.375s;
       -moz-animation-delay: -.375s;
         -o-animation-delay: -.375s;
            animation-delay: -.375s;
}
.la-line-spin-clockwise-fade > div:nth-child(6) {
    top: 74.7487369862%;
    left: 25.2512627193%;
    -webkit-transform: rotate(225deg);
       -moz-transform: rotate(225deg);
        -ms-transform: rotate(225deg);
         -o-transform: rotate(225deg);
            transform: rotate(225deg);
    -webkit-animation-delay: -.25s;
       -moz-animation-delay: -.25s;
         -o-animation-delay: -.25s;
            animation-delay: -.25s;
}
.la-line-spin-clockwise-fade > div:nth-child(7) {
    top: 49.9999806189%;
    left: 15.0000039834%;
    -webkit-transform: rotate(270deg);
       -moz-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
         -o-transform: rotate(270deg);
            transform: rotate(270deg);
    -webkit-animation-delay: -.125s;
       -moz-animation-delay: -.125s;
         -o-animation-delay: -.125s;
            animation-delay: -.125s;
}
.la-line-spin-clockwise-fade > div:nth-child(8) {
    top: 25.2506949798%;
    left: 25.2513989292%;
    -webkit-transform: rotate(315deg);
       -moz-transform: rotate(315deg);
        -ms-transform: rotate(315deg);
         -o-transform: rotate(315deg);
            transform: rotate(315deg);
    -webkit-animation-delay: 0s;
       -moz-animation-delay: 0s;
         -o-animation-delay: 0s;
            animation-delay: 0s;
}
.la-line-spin-clockwise-fade.la-2x {
    width: 64px;
    height: 64px;
}
.la-line-spin-clockwise-fade.la-2x > div {
    width: 8px;
    height: 15px;
    margin-top: -10px;
    margin-left: -2px;
    border-radius: 5px;
}
.loadingcat{
    width: auto;
    height: 60vh;
    position: fixed;
    left: 50%;
    right: 50%;
    bottom: 0;
    transform: translate(-50%, 0);
}
.loading{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -70%);
}
.loadingwrapper{
    width: 100%;
    height: 100%;
    z-index: 999;
    position: fixed;
    top: 0;
    left: 0;
}
.loadingpage{
    background-image: url(pictures/loadingpage.jpg);
    background-size: 100%;
    background-position: center bottom;
    background-repeat: no-repeat;
    width: 100%;
    height: 100vh;
}
.bar{
    background-color: var(--color_green);
    height: 100%;
    position: absolute;
}

@-webkit-keyframes line-spin-clockwise-fade {
    50% {
        opacity: .2;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes line-spin-clockwise-fade {
    50% {
        opacity: .2;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes line-spin-clockwise-fade {
    50% {
        opacity: .2;
    }
    100% {
        opacity: 1;
    }
}
@keyframes line-spin-clockwise-fade {
    50% {
        opacity: .2;
    }
    100% {
        opacity: 1;
    }
}
@keyframes bar{
    0%{
        width: 100%;
        opacity: .3;
    }
    100%{
        width: 0%;
        opacity: .8;
    }
}

@media screen and (max-width: 1023px){
    .loadingpage{
        background-image: url(pictures/loadingpagemobile.jpg);
        background-position: center;
    }
    .loadingcat{
        height: 55vh;
    }
}