Logo image to fit on mobile screens?

I have used the Adrina theme you will see the logo "STOP SMOKING FOR LIFE" at the top of the page of this website http://www.testingenviroment.com/stopsmoking/ I added some CSS to make the image larger on the pc (see below) the issue is on different mobile devices sometimes it is to wide what CSS do I add so it fits in the mobile screen?

.header .logo img {
width: auto;
height: auto;
padding-top: 20px;
}

 

Hi,

Apply the below code:

Code:

@media only screen and (max-width: 480px){
.header .logo img{
width: 100% !important;
}
}

Regards,
Sameer

 

perfect thank you worked a dream