/**
 * @file
 */

 .blazy,
 .blazy *,
 .blazy *::before,
 .blazy *::after {
   box-sizing: border-box;
 }

 /* The lazyloaded element: IMG, IFRAME, DIV. */
 .b-lazy,
 .b-responsive {
   display: block;
   height: auto;
   min-height: 1px;
   opacity: 0;
   transition: opacity 500ms ease-in-out;
 }

 /* Needed to display preloader with CSS BG image, otherwise hidden. */
 .b-loaded,
 .b-error,
 .b-bg.media--loading {
   opacity: 1;
 }

 .b-bg {
   background-size: cover;
   background-position: center center;
   background-repeat: no-repeat;
 }

 /* The .blazy container is not always preset such at lightboxes. */
 .litebox,
 .blazy iframe,
 .media iframe {
   border: 0 none;
   display: block;
   max-width: 100%;
 }

 /** Fix for conflict with Bootstrap CSS if not using aspect ratio. */
 .blazy .media {
   display: block;
   position: relative;
 }

 /* Be sure to add width to the container accordingly, otherwise collapsed. */
 .field[data-blazy] {
   min-width: 50%;
 }