How to change the Full Calendar plugin events's border colour?

Question

I have this full calendar (v3.4.0) plugin. I have downloaded the CSS for it from here. I have almost fully customised it. However, I have spent an hour trying to figure out how to change the border-color for all the events. I have found out this eventBorderColor form full calendar docs but I am not sure how I can use it.

I have tried the following but none of them worked:

fc-time-grid-event fc-v-event fc-event fc-start fc-end {
    border-color: red;
}

and this:

.fc-event {
    border: 5px solid red;
}

I have tried this one from this question:

.fc-event-inner {
    border: 5px solid red;
}

Screen shot of the events:

Screen shot of the Developer's Tool: There are some styles that are given using inline styles and they don't exist in the file. These inline styles seem to have higher priority when I try to take out the border-color the actual border is applied.

Any help would be much appreciated.

Thank you

Answer 1

try:

border: 5px solid red !important;

Answer 2

I have fixed the problem by using borderColor: 'red' in JavaScript for each event when I am displaying it on the calendar.