/*:root .left-justify-text-mobile {
    text-align: left;
    color: yellow
}*/

/*    div {
        border: 5px solid blue;
    }*/

.align-images-top-bottom {
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
}


@media screen and (max-width: 782px) {
    :root .wp-block-media-text__content p {
        text-align: left;
        /*border: 5px solid pink;*/
    }
    
    .portfolio-row {  /* padding: top, right, bottom, left */
        padding-top: 0 !important;
    }
    
    .hide-on-mobile {
        display: none;
    }

    .mobile-reverse-column-direction {
        flex-direction: column-reverse;
    }

}


/*
@media (min-width:320px)  {  smartphones, iPhone, portrait 480x320 phones  }
@media (min-width:481px)  {  portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide.  }
@media (min-width:641px)  {  portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones  }
@media (min-width:961px)  {  tablet, landscape iPad, lo-res laptops ands desktops  }
@media (min-width:1025px) {  big landscape tablets, laptops, and desktops  }
@media (min-width:1281px) {  hi-res laptops and desktops  }

In practice, many designers convert pixels to ems, largely because ems afford better zooming. 
At standard zoom 1em === 16px, multiply pixels by 1em/16px to get ems. For example, 320px === 20em.

@media (max-width: 1250px) {

is the same as:

@media (width <= 1250px) {

*/