Changes to custom.css not appearing

The changes that I make to the custom.css file are not showing up on my live site. I have checked the “enable custom style” option. I have caching plugins but I have disabled them. I have tried disabling other plugins, but so far no luck.

I previously installed a local version of the theme and the changes displayed perfectly.

Below is the code for “custom.css”

/*
Add your custom styles in this file instead of style.css so it
is easier to update the theme. Simply copy an existing style
from style.css to this file, and modify it to your liking. 

When you update your theme, backup this file and re-add it after.
*/

/* Global */
.mystyle {
#header {padding-bottom: 55px}

.site-description { margin-left: 25px; line-height: 60px; padding: 0px 0; }

.post-title { font-weight: bold; letter-spacing: -1px; }
.single .post-title { font-size: 36px; letter-spacing: -1.5px; }
}

/* Tablet - 800px, 768px & 720px */
@media only screen and (min-width: 720px) and (max-width: 800px) {
	.mystyle {}
}

/* Mobile - 480px & 320px */
@media only screen and (max-width: 719px) {
	.mystyle {}
}

/* Mobile - 320px */
@media only screen and (max-width: 479px) {
	.mystyle {}
}

Any help would be much appreciated