Q:

Desktop: Horizontal picture/content, SmartPhone: Vertical picture/content

I am using a Wordpress responsive ready theme and it works quite well except for tables or div containers. 
The main problem I have are my tables as shown on: lichtundmusik.ch/vermietung/licht
What I want:
When I watch the same page as mention above on my smartphone the picture should automaticaly change the order of the text and picture from horizontal to vertical
Illustration of what I want:Link to the Illustration
One more difficulty:
Today it is the firt time I came a cross Bootstrap and I tried to implement it but unfortunately entering the Bootstrap code in the website header is changing the whole site.
Does somebody has a solution for me? Thanks for your answers

A:

Since your output is a table, you're going to have to play some tricks with CSS to make this work. CSS-Tricks has a nice article explaining the basics. TL;DR, you need to create another media query for small screens in your css that transforms your table cells into block elements:
@media only screen and (max-width: 760px)  {
    /* Force table to not be like tables anymore */
    table, thead, tbody, th, td, tr { 
        display: block; 
    }
}

For the second part, Bootstrap is a huge framework and will change everything. For projects where I need responsiveness without the bulk, I've been using Pure CSS, which gives a lot of the responsive goodies in a 4.4KB package. 

