
.period-title {
    select {
        background: none;
        padding: 5px;
        border: none;
        outline: 0;
        font-size:15px;
    }
}


.PeriodTitle {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: stretch;

    .ToggleButtons {
        flex: 1 1 auto;
    }

    .PeriodControls {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        align-content: center;

        flex: 10 0 auto;
        text-align: center;
        justify-content: center;

        button {
            background-color: #FFFFFF;
            border: 1px solid #CECECE;
            padding: 10px 15px;
            flex: 0 0 auto;

            &:hover {
                background-color: #1287ed;
                color: #FFFFFF;
            }
        }

        .PeriodType {
            cursor:pointer;
            padding: 10px;
            flex: 0 1 auto;
            * {
                text-align: center;
            }

            .value {
                font-size: 1.25em;
            }

        }

    }

}

