Usar floats es mala idea.
La primer opción es convertir ese div a inline-block y asignar text-align: center al padre.
Está sencillito.
https://jsfiddle.net/ys0jtjy3/
Código CSS:
Ver original.contenedor {text-align: center;}
.contenedor>div {display: inline-block;}
.rojo {background-color: red; width: 200px; height:100px;}
La segunda opción es que investigues acerca del flexbox:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
----
Aparte de eso unos comentarios. No puede ser que requieras veinte important! eso indica que no estás controlando tu css, sino que simplemente estás parchando los atributos.
Otra cosa. No estás separando qué parte es importante del comportamiento de tus objetos, y cual parte es solamente estética. No es de que sea indispensable, pero, otra vez, indica un poco de orden al elaborar el código.