:active,
:focus {
    outline: none!important
}

html {
    font-size: 20px
}

body {
    font-family: 'Roboto', sans-serif;
    line-height: 1.4;
    color: rgba(0, 0, 0, .94)
}

h1 {
    font-size: 1.8rem;
    font-weight: 700
}

h1 small {
    margin-left: .3rem;
    color: rgba(0, 0, 0, .6);
    font-size: 60%
}

h2 {
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    font-size: 1rem
}

a {
    text-decoration: none;
    color: #336184
}

.btn,
a {
    transition: background-color .15s ease-in-out;
    will-change: background-color
}

p {
    margin: 0 0 .5rem
}

p:last-of-type {
    margin: 0 0 2rem
}

footer {
    margin-top: 2rem;
    font-size: 90%
}

footer a {
    font-style: italic
}

footer path {
    fill: #9d252d
}

.btn {
    padding: .6rem .8rem .64rem;
    border: none;
    color: #fff;
    cursor: pointer;
    font-family: inherit;
    font-size: 85%;
    line-height: 1
}

.icon {
    height: .6rem;
    margin: 0 .1rem
}

main {
    display: block;
    width: 100%;
    position: absolute;
    z-index: 999;
    /*margin:2.5rem auto*/
    margin: 0;
}

main .btn {
    /*width:100%;*/
    display: block;
    margin: 0 .25rem .75rem 0;
    background-color: #2e4b61;
    border-radius: .2rem;
    font-size: 70%;
    letter-spacing: .03em;
    text-transform: uppercase
}

@media (min-width:768px) {
    main {
        max-width: 40rem
    }
    main .btn {
        width: auto;
        display: inline-block
    }
    main .btn:hover {
        background-color: #213545
    }
    main .btn-danger {
        background-color: #9d252d
    }
    main .btn-danger:hover {
        background-color: #7c1d23
    }
}

main #events {
    font-family: 'Montserrat', sans-serif;
    font-size: 80%
}

.slide-menu {
    width: 100%;
    background-color: #212121
}

.slide-menu,
.slide-menu a {
    font-size: .8rem;
    color: #fff
}

.slide-menu a {
    padding: .9rem 1.4rem;
    border-bottom: 1px solid #353333;
    text-decoration: none
}

.slide-menu a:hover,
.slide-menu a:active {
    background-color: #A52530
}

.slide-menu .controls {
    display: flex;
    margin-bottom: 1rem
}

.slide-menu .btn {
    padding: .75rem 1.5rem;
    flex: 1 0 auto;
    font-size: 90%;
    color: #fff;
    /*background-color:#000;*/
    text-transform: uppercase
}

.slide-menu .btn:first-of-type {
    text-align: left
}

.slide-menu .btn:first-of-type:before {
    content: "◄";
    margin-right: .5rem
}

.slide-menu .btn:last-of-type {
    text-align: right
}

.slide-menu .btn:last-of-type:before {
    content: "✕";
    margin-right: .5rem
}

.slide-menu .slide-menu__backlink {
    text-transform: uppercase
}

#test-menu-left p {
    font-size: 110%;
    padding-left: 1.25rem;
    padding-right: 1.25rem
}