/* mobile first in base and page css*/ /* small tablets */ @media only screen and (min-width: 600px) { } /*images width will be 95% of view port width until this pixel width with you can set */ @media only screen and (min-width: 450px) { } @media only screen and (min-device-width: 600px) and (max-device-width: 799px) { } /* tablets */ @media only screen and (min-width: 800px) { } @media only screen and (min-device-width: 800px) and (max-device-width: 1199px) { } /* desktop */ @media only screen and (min-width: 1200px) { /*this left justifies the individual elements left*/ /*.section__content--hero { align-items: flex-start; }*/ /*this moves all the elements together left and down*/ /*.section--hero { align-items: flex-start; justify-content: flex-end; }*/ } @media only screen and (min-device-width: 1200px) and (max-device-width: 1800px) { } /* large */ @media screen and (min-width: 1800px) { }