/* Styles for blocks are used in both the frontend and admin - so be specific */

.mbgpreviewer-contain { position: relative; width: 100%; overflow: hidden; }
.mbgpreviewer-sizer { width: 100%; visibility: hidden; }

.mbgpreviewer-img { opacity: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 0; transition: opacity .6s ease; z-index: 1; background-position: top center; background-repeat: no-repeat; background-size: 100%; }
.mbgpreviewer-img.active { opacity: .99; z-index: 2; }

.mbgpreviewer-img img { position: absolute; bottom: 4em; right: -4em; width: 100%; transition: all .6s ease; }
.mbgpreviewer-img.active img { bottom: 0; right: 0; }

.mbgpreviewer-img .mbgpreviewer-button { position: absolute; bottom: 4em; right: 0; opacity: 0; transition: .6s ease; transition-delay: .3s; color: #fff; }
.mbgpreviewer-img.active .mbgpreviewer-button { right: 20px; opacity: .99; }

.mbgpreviewer-img .mbgpreviewer-button { display: none; }
.touch-device .mbgpreviewer-img .mbgpreviewer-button { display: block; }






@media screen and (min-width: 783px) {


	.mbgpreviewer-contain a { color: #1B365D; }
	.mbgpreviewer-contain a.active { color: #1c7fb5; }

	.mbgpreviewer-content { position: absolute; z-index: 3; left: 0; top: 2em; padding: 2em; background-color: rgba(255,255,255,.8); }

	.mbgpreviewer-content ul,
	.mbgpreviewer-content li { list-style-type: none; margin: 0; padding: 0; }

	.mbgpreviewer-contain h2 { color: #1B365D; margin: 1rem 0; }
	/*.mbgpreviewer-contain h2 { padding-bottom: .5em; background: transparent url("../../assets/css/img/blue-dashes.svg") no-repeat bottom left; } */

	.mbgpreviewer-list { color: #1B365D; list-style-type: none; margin: 0; padding: .25em 0; display: inline-block; text-decoration: none; }
	.mbgpreviewer-list:before { display: inline-block; content: '\f0a9'; font-family: 'Font Awesome 5 Free'; font-weight: 900; margin-right: .5em; }


	.mbgpreviewer-content ul.two-column { column-count: 2; }
	.mbgpreviewer-content ul.three-column { column-count: 3; column-gap:0px; }

}

@media (min-width: 1000px) {
}

@media screen and (max-width: 1000px) and (min-width: 783px) {
	.mbgpreviewer-img img { width: 80%; }
	.mbgpreviewer-img .mbgpreviewer-button { bottom: auto; top: 20px; }
}

@media (max-width: 782px) {
	.mbgpreviewer-sizer { }

	.mbgpreviewer-contain { text-align: center; }

	.mbgpreviewer-img { }
	.mbgpreviewer-sizer { width: 100%; margin-bottom: 4em; }

	.mbgpreviewer-img.active img { bottom: 2em; }

	.mbgpreviewer-content ul,
	.mbgpreviewer-content li { list-style-type: none; margin: 0; padding: 0; }
	.mbgpreviewer-content li { display: inline-block; padding: 0 .25em .5em; }

	.mbgpreviewer-list { display: inline-block; padding: .1em .25em 0; text-decoration: none; border: 1px solid #1B365D; margin: 0; }
	.mbgpreviewer-list.active { color: #fff; background-color: #1B365D; }

	.mbgpreviewer-imgs { position: relative; }

	.mbgpreviewer-content { z-index: 3; }

	.mbgpreviewer-img .mbgpreviewer-button { display: block; bottom: 0; }
	.mbgpreviewer-img.active .mbgpreviewer-button { }
}