I'm trying to style the social console and not winning. I copied the code below from the gravity skin as it has all the basics I wanted but the console keeps pulling from the module.css instead of my skin.css. Is there something I have missed?

.threeColSocial .console {
width: 250px;
height: auto;
background-color: #484848 !important; /* Menu Background Color */
}

.threeColSocial .console-none div {
cursor: pointer;
cursor: hand;
float:left;
height: auto;
width: 250px;
padding:0px;
margin:0px;
text-align:left;
}

.threeColSocial .console-none h3 {
padding:10px 8px 10px 40px;
margin: 0;
border-bottom: solid 1px #fff;
background: url('images/arrow.png') 18px center no-repeat;

color: #eee;
font-size:13px;
line-height: 1;
font-weight: bold;
}

.threeColSocial .console-none div div { display:none; }
.threeColSocial .console-mouseon { background-color:#d3222a; /* Menu Hover Background Color */ }