Sorun birkaç şeyden kaynaklanıyor olabilir. Sayfayı görmeden net bir şey söylemek zor. Ne yapmaya çalıştığın da önemli burada. Bottom ile aşağıdaki element ile arasına 100px boşluk atmaya çalışıyorsan bunu bu yazdığın kodlar ile başaramazsın.

İlk olarak; İki media kodunu da max-width olarak kullanmışsınız, 768px için kullandığınız max-width aynı zamanda 320px'i de kapsıyor ve !important kullandığınız için biri diğerini engelliyor olabilir.

İkinci seçenek daha anlamlı, bottom: özelliğini yalnızca position:abolute durumlarda kullanmanız ve sadece sayfada veya div içerisinde genel kapsayıcı alanın içinde, aşağıdan hizalanmasını istediğiniz divler için kullanmanız daha sağlıklı olacaktır, siz hem margin-bottom hem de bottom kullanmaya çalışıyorsunuz.

Site adresi verebilirseniz daha iyi yardımcı olabiliriz ya da tam olarak yapmak istediğinizi ve alanın görselini atabilirsiniz. Başka türlü bir şey söylemek çok zor, göründüğü üzere çok sağlıksız bir kod yazımı mevcut, position:relative olan bir div elemanına left ve bottom kullanmaya gerek olacağını düşünmüyorum. Bu yüzden ne yapmak istediğinizi bilmeden yardımcı olmak zor.