So for some reason it is working now....
This is what i did.
/* #Media Queries
================================================== */
/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
#top .logo a {
left: 47px;
}
.logo {
left: 47px;
}
#top .main_menu .menu li{
margin-left: 0;
}
}
/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
}
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 794px) {
#top .logo a {
left: 0;
}
.logo {
left: 0;
}
.mobileMenu {
width:100%;
}
.main_menu {
padding-bottom: 0;
}
}
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {}
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {}
I thought i was targeting it correctly the first billion times but maybe not.. I used inspector to figure out what was over riding my custom.css
It works on my desktop, iphone, and nexus 7...
who knows what it was...
thanks for working it out with me..