#backgrounds {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: -1;
}

#backgrounds>div {
	position: fixed;
	width: 100%;

	top: 0px;
	height: 100%;
	overflow: hidden;
}

#backgrounds>div>div {
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: auto;
}


#b1 { z-index: -1;}
#b2 { z-index: -2;}
#b3 { z-index: -3;}
#b4 { z-index: -4;}

#b1 .img { background-image: url(../img/background1.png); background-position: center top; background-position: fixed; }
#b2 .img { background-image: url(../img/background2.png); background-position: center center; background-position: fixed; }
#b3 .img { background-image: url(../img/background1.png); background-position: center top; background-position: fixed; }
#b4 .img { background-image: url(../img/background3.png); background-position: left center; background-position: fixed; }


@media screen and (max-width:840px) {
	#background-player,
	#background-player-cover { display: none !important; }
}

#background-player {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: auto;
}

#b1>#background-player-cover {
	content: "";
	position: absolute;
	top: 0; bottom: 0;
	left: 0; right: 0;
	background-image: url(../img/video_cover.svg);
	background-size: 7px 4px;
}

/**/
@media (min-aspect-ratio: 16/9) {
  #background-player-local { height: 300%; top: -100%; }
}

@media (max-aspect-ratio: 16/9) {
  #background-player-local { width: 300%; left: -100%; }
}

@supports (object-fit: cover) {
  #background-player-local {
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
  }
}

#background-player-local {
	position: absolute;
	width: 100%; height: 100%;
}

#background-player-local {
	position: absolute;
	display: block;
	width: 100%; height: 100%;
	z-index: -5;
}

@media screen and (max-width:840px) {
	#background-player-local { display: none; }
}