second one is going to be max dash width and that's going to be up to NUMBER_TOKEN pixels so that's for bigger tablets then we can duplicate this two more times the one with the max width not the min width in here we're gonna have NUMBER_TOKEN pixels and the last one is going to have NUMBER_TOKEN pixels so for extra extra small devices so for the smallest of devices we can just decrease the size of the heading so let's do dot app underscore underscore newsletter dash heading hNUMBER_TOKEN font dash size is NUMBER_TOKEN pixels if we go below NUMBER_TOKEN let's try doing that right here responsive let's do NUMBER_TOKEN. yeah it's still going outside and the font size is definitely too big let's also decrease the line height to be NUMBER_TOKEN pixels there we go now when we implement this as well this is actually going to be fixed so let's start implementing this dot app underscore underscore newsletter padding is two ram on top and bottom and zero on left and right and border is none let's save it there we go already just a bit better but still not good let's do this one up to NUMBER_TOKEN pixels next so that's going to be dot app underscore underscore newsletter dash input flex dash direction is going to be column like this and also width is going to be NUMBER_TOKEN okay this still didn't make it better let's also do one more thing right here dot app underscore underscore newsletter dash input and then we target the input itself we can say margin is zero on top zero on right two ram on bottom and zero on left and also width is one hundred percent okay and this is it this width property actually fixed the problem so now you might be wondering we were taking a look at the smallest size possible NUMBER_TOKEN pixels that's below NUMBER_TOKEN right so why wasn't the issue fixed when we implement something here well if you think about it NUMBER_TOKEN is also smaller than NUMBER_TOKEN and also smaller than NUMBER_TOKEN and in here we have max width so these styles and these styles as well as these styles are going to be applied on NUMBER_TOKEN pixels device that's why now we've made it work for all devices all the way from the smallest to something like an iphone there we go and also tablets let's check that out let's do ipad mini and if we collapse this a bit that's looking beautiful now let's just make a fix for the devices above NUMBER_TOKEN pixels dot app underscore underscore newsletter dash input and then we target the input and we're just going to set the font dash size to NUMBER_TOKEN ram just to make it a bit bigger on extra large devices so now if you expand this it's looking great the last thing we have to do is the part below our newsletter and that's going to be what usually we call an actual real footer and this is actually if i may say a really great looking footer it's going to be divided into a few parts this specific div that is the entire footer this smaller div with three different columns that contains the content and then the trademark at the bottom so let's code it out we can go back to our code by collapsing this not in the newsletter not in the footer overlay as well and we can also close all of the other files where we have to go is into app and then footer now we've coded out these two components but now is the time that we code out the footer itself so as i've told you our footer is going to be a div more
NO_SEGMENT_TOKEN