p, span, a, ul, li, button {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

strong {
    font-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Open Sans', "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serify;
    line-height: 1.5em;
    font-weight: 300;
}

strong {
    font-weight: 400;
}

.tile {
    width:100%;
    display: inline-block;
    box-sizing: border-box;
    background: #fff;
    padding: 18px;
    margin-bottom: 5px;
    pointer-events:none;
}

.title {
    margin-top: 0px;
}

.purple, .blue, .red, .orange, .green,  .blue-greenish {
    color: #fff;
}

.purple {
    background: #5133AB;
}

    .purple:hover {
        background: darken(#5133AB, 10%);
    }

.red {
    background: #AC193D;
}

    .red:hover {
        background: darken(#AC193D, 10%);
    }


.green {
    background: #00A600;
}

    .green:hover {
        background: darken(#00A600, 10%);
    }


.blue {
    background: #2672EC;
}

    .blue:hover {
        background: darken(#2672EC, 10%);
    }


.orange {
    background: #F77F00 /*#DC572E*/;
}

    .orange:hover {
        background: darken#F77F00, 10%);
    }

.yellow {
    background: #FCBF49;
}

    .yellow:hover {
        background: #f0a81d;
    }

.yellow-light {
    background: #EAE2B7;
}

    .yellow-light:hover {
        background: darken(#EAE2B7, 10%);
    }

.blue-greenish {
    background: #78C0A8;
}

    .blue-greenish:hover {
        background: darken(#78C0A8, 10%);
    }