Hey guys.

I want to edit the Nectar Slider's caption font and 2 buttons on mobile and desktop, but I can't figure out the exact CSS classes and  code...

on desktop I need the button to be a bit smaller, and on mobile I want to enlarge the caption.

Would love to get some help.

Thank you!

Hi Tahir. thanks.

Another problem came up.

I've added a single image with the builder (the shopify logo) and targeted it with a class.

When I use the "width" attribution, the change only appears on MOBILE, but no matter what I do it doesn't change on desktop...

What can be the issue?

Thanks again.

Hi Andrew. 

I've added the css code. The Extra class is called "shopifylogo".

It looks fine on mobile but on desktop width doesn't change. 

you can see it here: big-dreams.co

thank you.

@media only screen and (max-width : 1000px) {
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .content h2 {
        font-size: 24px!important;
        line-height: 51px!important;
        margin-bottom: 6px;
        letter-spacing: -0.5px;
    }
    
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .content p span {
        font-size: 15px!important;
        line-height: 20px!important;
        padding-bottom: 7px;
    }
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .content p {
        font-size: 15px!important;
        line-height: 20px!important;
        padding-bottom: 7px;
    }
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .button a {
        font-size: 15px!important;
        padding: 2px 7px !important;
    }
    
    
    
    body #ajax-content-wrap .nectar-slider-wrap .swiper-slide .content {
        margin-top: 10px !important;
        top: 30px !important;
    }
    
    
   .shopifylogo{
        
        width:30px !important;
    }





}
/* For Mobile*/
@media only screen and (max-width : 690px) {
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .content h2 {
        font-size: 36px!important;
        line-height: 51px!important;
        margin-bottom: 9px;
        letter-spacing: -0.5px;
    }
    
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .content p span {
        font-size: 24px!important;
        line-height: 28px!important;
        margin-bottom: 39px!important;
        padding-bottom: 37px!important;
    }
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .content p {
        font-size: 16px!important;
        line-height: 20px!important;
        padding-bottom: 37px!important;
        padding-top: 17px!important;
       
    }
    body #ajax-content-wrap .nectar-slider-wrap div.swiper-slide .button a {
        font-size: 25px!important;
        padding: 2px 14px !important;
    }
    
    
    
    body #ajax-content-wrap .nectar-slider-wrap .swiper-slide .content {
        margin-top: 10px !important;
        top: 30px !important;
    }
    
     .shopifylogo{
        
        width:30px !important;
   
    }
    
    
}

Ok I've managed to solve this. thanks mate