moving thumbnails to the right of main image in single product page

I had may thumnbails at the right of the main image in single product page , avada theme. I used this CSS:
@media(min-width: 980px) {
.single-product.woocommerce div.product .summary {
width: 40%;

.single-product.woocommerce div.product .images {
    width: 57%;

.single-product.woocommerce div.product .images .woocommerce-main-image {
    float: right;
    width: 70%;

.single-product.woocommerce div.product .images .thumbnails{
    float: left;
    width: 28%;

.single-product.woocommerce div.product .images .thumbnails>a {
    width: 75%;
    margin-top: 0;
    margin-bottom: 15px;


After, woocommerce update, ( now i am using 3.0.5) the single product page broke, and the custom CSS is not working anymore,
Can someone tell me how to movethumbails to the right?