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

Envato Authors ThemeForest
#1

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?