Changing background toolbar colour and text colour in tinymce editor

Question

I have used this code in my init call for tinymce to point at my main css file:

<script>
            tinymce.init({
                selector: 'textarea',
                content_css:'default.css'
            });

This works well and within that CSS i use this to alter the background colour of the body of my editor :

.mce-content-body {
background: #474F52;
}

I now want to add to this the appropriate CSS overrides for the toolbar colour - the button colour and the text colour as per:

Please help! I have searched far and wide to no avail.

Answer 1

/* toolbar */
.mce-toolbar-grp {
    background-color: #000 !important; /* uses !important or override .mce-panel background-color/image */
    background-image: none !important;
}

/* text color */
#tinymce {
   color: #dd9900;
}

/* button text color */
.mce-ico {
   color: #dd9900;
}

/* button background color */
.mce-btn button {
    background-color: #000000;
}