.header-top-logo {
height: 100%;
width: fit-content;
background-color: yellow;
}

.header-top-logo img {
    height: 300px;
    }

.header-nav {
width: 120px;
height: 100%;
background-color: blue;
}

 body {
background-color: gray;    
 background-size: cover;
  background-image: url("../image/When\ I\ am\ 65.jpg"); 
 }
 

 #photo-viewer-top {
	position: absolute;
    left: 300px;
    top: 50px;
	height: 800px;
    width: 1200px;
	overflow: hidden;
    border: 10px solid blue;
	visibility: hidden;
}

#photo-viewer-top.is-loading::after {
	content: url("../image/load.gif");
	position: absolute;
	top: 0;
	align-content: center;
}

#photo-viewer-top img {
	position: absolute;
	max-width: 100%;
	max-height: 100%;
	top: 0%;
	left: 0%;
	height: 800px;
	width: 1200px;
}

 #photo-viewer-bottom {
	position: absolute;
    left: 30px;
    top: 890px;
	height: 800px;
    width: 1200px;
	overflow: hidden;
    border: 10px solid blue;
	margin-top: 30px;
	visibility: hidden;
}

#photo-viewer-bottom.is-loading::after {
	content: url("../image/load.gif");
	position: absolute;
	top: 0;
	align-content: center;
}

#photo-viewer-bottom img {
	position: absolute;
	max-width: 100%;
	max-height: 100%;
	top: 0%;
	left: 0%;
	height: 800px;
	width: 1200px;
}

.thumbnails {
	margin:50px 30px 30px 20px; 
	object-fit: cover;
	height: 150px;
	width: 240px;
	border: 6px solid black;
	overflow: hidden;
}

.thumbnails img {
	width: 100%;
	height: 100%;
}

.thumbnails_right {
	position: absolute;
	margin:60px 30px 30px 50px; 
	left: 1230px;
	object-fit: cover;
	height: 150px;
	width: 240px;
	border: 6px solid black;
	overflow: hidden;
}

.thumbnails_right img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

figure {
  background-color: bisque;
  width: fit-content;
}

.tagline {
	margin-top: 30px;
	width: fit-content;
	font-size: x-large;
	color: black;
	background-color: lightcyan;
	display: flex;
	justify-content: center;
	align-items: center;
}

.jukebox {
	margin-top: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.center {
	display: flex;
	justify-content: center;
	align-items: center;
}

#trailer {
	position: absolute;
	top: 1790px;
	left: 30px;
}

#thumbnails_right_1 {
	top: 860px;
}

#thumbnails_right_2 {
	top: 1060px;
}

#thumbnails_right_3 {
	top: 1260px;
}

#thumbnails_right_4 {
	top: 1460px;
}


figcaption {
	text-align: center;
}

.border {
	height: 1px;
	width: 1100px;
	border: 5px solid white;
	margin: 30px 100px 30px 100px;
}

.visible {
	visibility: visible;
}

.invisible {
	visibility: hidden;
}