@font-face{
    src: url('../fonts/BrixSansRegular.otf');
    font-family: "BrixRegular";
    font-style: normal;
    font-weight: 400;
}

@font-face{
    src: url('../fonts/BrixSansBold.otf');
    font-family: "BrixBold";
    font-style: normal;
    font-weight: 400;
}

html, body  {
    font-family: 'BrixRegular' !important;
    font-size: 34px !important;
    color: #002EA7;
}



.app-width {
    /*  max-width: 500px; */
}
.dialog-width {
    max-width: 450px;
}

.v-toolbar__title{
    font-size: 20px !important;
}
.v-list__tile {
    font-size: 16px !important;
}
button.primary {
    background-color: #002EA7 !important;

}
button.primary:hover {
    background-color: #3358B9;
}

button.secondary {
    background-color: #0074c6 !important;

}
button.secondary:hover {
    background-color: #33A0d8;
}



/* Preloader */
.sk-preloader {
    position: relative;
    width: 28px;
    height:28px;
    margin:auto;
}

.sk-preloader .wBall {
    position: absolute;
    width: 27px;
    height: 27px;
    opacity: 0;
    transform: rotate(225deg);
    -o-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    animation: orbit 3.6325s infinite;
    -o-animation: orbit 3.6325s infinite;
    -ms-animation: orbit 3.6325s infinite;
    -webkit-animation: orbit 3.6325s infinite;
    -moz-animation: orbit 3.6325s infinite;
}

.sk-preloader .wBall .wInnerBall{
    position: absolute;
    width: 3px;
    height: 3px;
    background: rgb(0,46,167);
    left:0px;
    top:0px;
    border-radius: 3px;
}

.sk-preloader #wBall_1 {
    animation-delay: 0.796s;
    -o-animation-delay: 0.796s;
    -ms-animation-delay: 0.796s;
    -webkit-animation-delay: 0.796s;
    -moz-animation-delay: 0.796s;
}

.sk-preloader #wBall_2 {
    animation-delay: 0.153s;
    -o-animation-delay: 0.153s;
    -ms-animation-delay: 0.153s;
    -webkit-animation-delay: 0.153s;
    -moz-animation-delay: 0.153s;
}

.sk-preloader #wBall_3 {
    animation-delay: 0.3165s;
    -o-animation-delay: 0.3165s;
    -ms-animation-delay: 0.3165s;
    -webkit-animation-delay: 0.3165s;
    -moz-animation-delay: 0.3165s;
}

.sk-preloader #wBall_4 {
    animation-delay: 0.4695s;
    -o-animation-delay: 0.4695s;
    -ms-animation-delay: 0.4695s;
    -webkit-animation-delay: 0.4695s;
    -moz-animation-delay: 0.4695s;
}

.sk-preloader #wBall_5 {
    animation-delay: 0.633s;
    -o-animation-delay: 0.633s;
    -ms-animation-delay: 0.633s;
    -webkit-animation-delay: 0.633s;
    -moz-animation-delay: 0.633s;
}

/** CSS für alle **/
@media only screen and (max-width: 599px) {
    body, p {
        font-size: 24px !important;
    }
    h3 {
        font-size: 26px !important;
    }
    .ui-btn {
        width: 1em !important;
        height: 1em !important;
    }
    .intro-logo {
        width: 90% !important;
        margin-top: 1em !important;
    }
    .animation-world.world-image{
        width: 90% !important;
        margin-top: 0em !important;
    }
    .animation-world.world-component{
        width: 90% !important;
        margin-top: 0em !important;
    }
    div.v-progress-circular svg {
        /*
        transform: rotate(-90deg) !important;
        height: 350px !important;
        top: 0px;

         */
    }
    .product-in-topic {
        margin-left: 0 !important;
    }
    div.progress-bar {
        max-width: 88%;
    }
    div.v-progress-linear {
        margin-left:0;
    }

    .circle-one, .circle-two, .circle-three {
        transform: scale(0.8);
    }
    @media only screen and (min-width: 600px) {
        .circle-one, .circle-two, .circle-three {
            transform: scale(0.9);
        }
    }
    .circle-one img, .circle-two img, .circle-three img {
        width: 35px;
        height: 35px;
    }
}