Media queries basically help to render content on sites depending on the screen's resolution. Our website is already responsive, so you can go and resize your browser to see the changes take effect. In our case, adding media queries won't make a major difference, but we are going to do a little bit of customization to make it render and look better. Let's go ahead and add media breakpoints, and see how certain content within the website changes its size and layout depending on whether you are viewing the website on a tab, mobile, or desktop:
/* media queries */
@media (min-width:1200px) {
.jumbotron img.showcase-img{
width:61%;
margin: 5px 0 0 40px;
}
}
@media (min-width:991px) {
.show-img {
display:none;
}
}
@media(min-width: 768px) and (max-width:990px){
.jumbotron img.app-btn{
width:30...