.clearfix {
    &::after {
        content: "";
        display: table;
        clear: both;
    }
}


.crontab.widget {

    .cron-value {
        display: inline-block;
        margin-right: 2px;
    }

    .crontab_summary {
        margin-top: 1em;
    }

    .editarea {
        display: none;
        width: 100%;

        .active {
            background-color: yellow;
        }

        .select_all {
            margin: 1em 0;
        }

        .editcontainer {
            .clearfix;

            button {
                display: block;
                vertical-align: top;
                float: left;

                // reset button styles
                margin: 0 2px 2px 0;
                padding: 0.4em;

                &:last-child::after {
                    clear: both;
                }
            }
        }

        &.minute .editcontainer button {
            width: 3em;

            &:nth-child(11),
            &:nth-child(21),
            &:nth-child(31),
            &:nth-child(41),
            &:nth-child(51) {
                clear: left;
            }
        }
        &.hour .editcontainer button {
            width: 3em;

            &:nth-child(13) {
                clear: left;
            }
        }
        &.dow .editcontainer button {
            min-width: 5em;
        }
        &.dom .editcontainer button {
            width: 3em;

            &:nth-child(8),
            &:nth-child(15),
            &:nth-child(22),
            &:nth-child(29) {
                clear: left;
            }
        }
        &.month .editcontainer button {
            min-width: 7em;
            
            &:nth-child(4),
            &:nth-child(7),
            &:nth-child(10) {
                clear: left;
            }
        }
        &.year .editcontainer button {
            min-width: 4em;

            &:nth-child(11),
            &:nth-child(21),
            &:nth-child(31),
            &:nth-child(41),
            &:nth-child(51),
            &:nth-child(61),
            &:nth-child(71),
            &:nth-child(81),
            &:nth-child(91) {
                clear: left;
            }
        }

    }

}
