Tek başınızı tüm html kodunu responsive yapmak çok büyük zaman alır. Sıfırdan tema yazarsanız daha mantıklı. Çünkü iyi bir html bilgisi gerektiriyor eğer yoksa devamlı bir sorun çıkıyor. Hazır responsive tema bulup kendinize göre düzenlerseniz daha mantıklı olacaktır. Ama yinede ben uğraşmak istiyorum derseniz genel fikir amaçlı;

@media only screen and (max-width: 479px) {
.renkDegistir{background-color:blue;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
.renkDegistir{background-color:orange;}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
.renkDegistir{background-color:red;}
}

@media only screen and (min-width: 1024px) {
.renkDegistir{background-color:black;}
}

Yukarıdaki kodlarda her ekran için sitenizde bulunan div etiketlerini girmeniz gerekiyor. css bölümünden de o divlerin nasıl görüneceğini ayarlamanız gerekiyor.