body {}

.course-preview-container {
    width: 1140px;
    position: relative;
}

.course-preview {
    position: absolute;
    top: 5vh;
    /* top: 0; */
    box-shadow: inset 0 5px 5px 24px #f1f4f6, inset 0 -7px 5px 21px #f1f4f6, inset 10px 0 0 20px #26756e, inset -10px 0 0 20px #26756e, inset 0px 14px 0 20px #26756e, inset 0px -17px 0 20px #26756e, inset 0px 0px 0 350px #ffffff;
}

@media all and (max-width: 420px) {

    .course-preview {
        position: absolute;
        top: 15vh;
        /* top: 0; */
    }
}

.rocket-contener {
    position: absolute;
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 5px;
    text-align: center;
}

.rocket-contener>a {
    margin: 0 10px;
    box-shadow: 0 -7px 0 15px #fff, -4px -3px 0 15px #04756f;
}

.rocket-contener>a:last-child {
    margin: 0 10px;
    box-shadow: 0 -7px 0 15px #fff, 5px -2px 0 14px #04756f;
}

body {
    margin: 0px 0px 0px 0px;
}

.btn-rocket,
.btn-rocket-link {
    position: relative;
    display: inline-block;
    width: 250px;
    height: 102px;
}

.btn-rocket-link:hover {
    animation-name: shake;
    animation-iteration-count: infinite;
    animation-duration: 1.2s;
    animation-timing-function: linear;
}

.btn-rocket {
    background-image: url('img/rocket.png');
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 250px;
}

.btn-course-refresh {
    background-image: url('img/rocket_refresh.png');
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.blocking-info {
    position: relative;
    z-index: 1;
}

.loader-wrapper {
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: 0 auto;
    width: 960px;
    height: 650px;
}

.loader-para {
    background-image: url('img/para_zw.png');
    width: 460px;
    height: 335px;
    position: absolute;
    top: 60px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: 0 auto;
    top: 100px;
}

.loader-compas {
    background-image: url('img/kompas.gif');
    width: 200px;
    height: 201px;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: 0 auto;
    top: 30%;
}

.description {
    position: absolute;
    top: 20px;
    font-size: 18px;
    margin-left: 50px;
    width: calc(90% - 3px);
    background-color: #ffffff
}

@keyframes shake {
    0% {
        left: -5px;
    }

    50% {
        left: 5px;
    }

    100% {
        left: -5px
    }
}

iframe {
    transition: all .3s ease-in-out;
    opacity: 0;
}

iframe[data-iframe='loaded'] {
    opacity: 1;
}

.loading-animation {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.loading-animation img {
    box-shadow: 0 0 50px -20px #26756e;
}