Multiple VirtualHosts For XAMPP Not Working

Ok, so I'm at my wits end. I've been trying to get this up and running for the better part of a week and it I don't understand why it's not working.

Background

I have two wordpress sites, one dev and one prod. I would like to be able to view both of them on my local machine. However, what I'm seeing is that when I type in local.www.mysite.org or local.dev.mysite.org none of the images show up. In inspected the links and they are all pointed to localhost/image.jpg. I have XAMPP installed and it's working fine. The sites are pointing to the correct databases with data in their. If I don't use Virtual Hosts the site comes up perfectly fine.

This is what I have in my hosts file:

Hosts

127.0.0.1 localhost
127.0.0.1 local.www.mysite.org
127.0.0.1 local.dev.mysite.org

httpd-vhosts.conf

<VirtualHost *:80>
  DocumentRoot "D:/xampp/htdocs"
  ServerName localhost
</VirtualHost>

<VirtualHost *:80>
  DocumentRoot "C:/sites/www.mysite.org"
  ServerName local.www.mysite.org
  ServerAlias local.www.mysite.org
  <Directory "C:/sites/www.mysite.org">
    AllowOverride All
    Require all Granted
  </Directory>
</VirtualHost>

<VirtualHost *:80>
    DocumentRoot "C:/sites/www.mysite.org"
    ServerName local.www.mysite.org
    ServerAlias local.www.mysite.org
  <Directory "C:/sites/www.mysite.org">
    AllowOverride All
    Require all Granted
  </Directory>
</VirtualHost>

Question

Is there something that I've written in, incorrectly? Left something out? Really don't know where I could have gone wrong here.

thanks, Justin