@import (https://dev.surfvibes.de/wp-content/themes/gp-child-surfvibes/css/fonts.css);



:root {

    --primary-clr: #263952;

    --darker-primary-clr: #263952;

    --light-grey: #f3f3f3;

    --cta-clr: #00C6BF;

	--hover-cta-clr: #03f5ed;

    --darker-cta-clr: #018a97;

    --beige-clr: #ece5d4;

    --font-headlines: 'DM Sans', Helvetica, sans-serif;

    --font-body: 'DM Sans', sans-serif;

}



body {

    background: transparent;

    font-size: 18px;

    font-family: var(--font-body);

}

h1 {

    display: none;

}



#leao-no-result {

    background: transparent;

    border: none;

    padding: 0;

    color: #fff;

    font-size: 20px;

}



#leao-events > .row:first-child {

    margin-left: -10px;

}



/* kalender */

#leao-calendar {

    border: none;

    padding: 0 10px 0 0px;

    background: transparent;

}

#leao-calendar-navi {

    padding-left: 0px;

}

a.btn-calendar-navi {

    margin-right: 15px;

    background-color: var(--cta-clr);

    color: #fff;

}

a.btn-calendar-navi :hover {

    background: #008bc4;

}



/* kursbox */

.leao-event {

    padding-bottom: 20px;

}

.leao-event-inner {

    position: relative;

    padding: 15px 15px 15px 20px;

    background: var(--beige-clr);

    border: none;

    border-radius: 10px;

}

.leao-event-inner > .row > a .col-xs-4 {

    padding-right: 10px;

}

.leao-event-inner > .row > .col-xs-8 {

    padding-left: 10px;

}

@media (min-width: 500px) {

    .leao-event-inner > .row > a .col-xs-4 {

        width: 20%;

        padding-right: 10px;

    }

    .leao-event-inner > .row > .col-xs-8 {

        width: 80%;

        padding-left: 10px;

    }

}

.almostBookedOut::after {

    position: absolute;

    top: 15px;

    right: 15px;

    content: '';

    background: orange;

    width: 30px;

    height: 30px;

    border-radius: 50%;

}

.almostBookedOut .eventtext {

    color: #ff6e00;

}

.eventname,

.eventprice {

    color: var(--primary-clr);

}

.eventstartday {

    color: var(--primary-clr);

}

.eventstartmonthshort {

    background: var(--primary-clr);

}

.btn-primary {

    color: #fff;

    background-color: var(--cta-clr);

    border: none;

    padding: 7px 20px;

    border-radius: 10px;

    font-size: 18px;

}

.leao-event-inner .btn-sm {

    padding: 3px 15px;

    font-size: 17px;

    line-height: 1.5;

    border-radius: 3px;

}