Submit Button Color

The proper place to do styling is in the theme. Webform doesn't control submit button appearance. There are enough CSS classes that the submit button can easily be selected in CSS.

For me it has been a big struggle to change style css for Submit Button, even if you say so, it is not that easy as in my experience i've been trying to modify easily the CSS Style color attribute and I am able with easy selectors to change it for other elements but for WebForm the only way that I was able to change is using a selector like this:

.btn a, .more-link a, input[type="submit"], input[type="reset"], ul.links li a, .view-portfolio .views-field-view-node a, #block-poll-recent ul.links li a, #filters li a, .content ul.pager li a, .content ul.pager li.pager-current, .view .date-nav-wrapper .date-prev a, .view .date-nav-wrapper .date-next a, .form-submit {color: #ffffff;}

Maybe you can point us in a good direction to do something better.

PS: I am not a CSS expert but for the basics I am ok.

Your example combines a bunch of selectors for a while bunch of different things. The one that is actually active is probably: input[type="submit"]

I suggest you use this: input.webform-submit

My solution after several attemps and testing class by class modify or remove any style as required:

input[type="submit"], .form-submit{    
    cursor: pointer;
    padding: 4px 17px;
    margin-bottom: 1em;
    margin-right: 1em;
    color: #5a5a5a;
    text-align: center;
    font-weight: normal;
    font-size: 1.077em;
    font-family: "Lucida Grande",Verdana,sans-serif;
    border: 1px solid #e4e4e4;
    border-bottom: 1px solid #b4b4b4;
    border-left-color: #d2d2d2;
    border-right-color: #d2d2d2;
    background: url(/themes/seven/images/buttons.png) 0 0 repeat-x;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    text-decoration:none;
}
input[type="submit"]:hover, .form-submit:hover {
    background: #666;
    color: #fff;
    border-color: #555;
    text-shadow: #222 0 -1px 0;
}

I have found a module that adds classes to any webform button but I was not able to use the custom class:

https://www.drupal.org/project/webform_button_classes

Thank you Liam seems to be it was exactly your solution, my mistake is that I was adding input[type="submit"] a and input[type="submit"] a:hover and as I understand the "a" or "a:hover" were not necessary

You may need to learn more about how CSS selectors work. input[type="submit"] a would select an a element inside an input element that has a type attribute with value submit. That doesn't make sense. A comma in a selector separates multiple selectors. The rule will apply to all of them.