* {
    --kickoff-pink: #f1a7dc;
    --kickoff-light-pink: #F6E0EF;
    --essens-pink: #dc0069;
    --essens-blue: #002e5d;
    --essens-light-darker-blue: #A3B1C6;
    --essens-light-blue: #EFF5FA;
}

html, body {
    background: var(--kickoff-light-pink);
}

body {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.krasa-img-bg {
    background-image: url('/images/krasa.svg');
    background-repeat: no-repeat;
    /*background-size: 54px;
    background-position-x: 90%;
    background-position-y: 50px;*/
    top: -10%;
    right: -70px;
    height: 130%;
    width: 54px;
    background-size: 54px;

    &.lg-big {
        @media (min-width: 992px) {
            width: 80px;
            background-size: 80px;
            right: -100px;
        }
    }
}

.pink {
    color: var(--essens-pink);
}
.blue {
    color: var(--essens-blue);
}


.no-click {
    pointer-events: none;
}

.btn-pink {
    background-color: var(--essens-pink);
    color: white;
    border: 1px solid var(--essens-pink);
    font-weight: bold;

    &:focus,
    &:hover {
        background-color: white;
        color: var(--essens-pink);
        border: 1px solid var(--essens-pink);
    }
}


.vertical-line {
    display: inline-block;
    width: 2px;
    height: 20px;
    background-color: var(--kickoff-light-pink);
}