@font-face {
    font-family: "URW DIN";
    src: url(../font/URWDIN-Regular.ttf) format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url(../font/URWDIN-Light.ttf) format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'URW DIN';
    src: url(../font/URWDIN-Thin.ttf) format('truetype');
    font-weight: 100;
    font-style: normal;
}

#layout_interact {
	font-family: 'URW DIN';
	display: flex; 
	justify-content: center; 
	align-items: center;
}

#layout_start_select_a  {
	background-color: red;
	opacity: 0;
	position: absolute;
	width: 541px;
	height: 443px;
	left: 238px;
	top: 345px;
}

#layout_start_select_b {
	background-color: red;
	opacity: 0;
	position: absolute;
    width: 391px;
    height: 443px;
    right: 326px;
    top: 345px;
}

#page_a_close, #page_b_close {
	position: absolute;
	width: 34px;
	height: 34px;
	left: 1838px;
	top: 50px;
    background-image: url("../img/button_close.png");
    background-repeat: no-repeat;
	-webkit-transition: transform 0.2s ease;
}

#page_a_back, #page_b_back {
	position: absolute;
	width: 55px;
	height: 96px;
	left: 49px;
	top: 860px;
    background-image: url("../img/button_back.png");
    background-repeat: no-repeat;
}

#page_a_for, #page_b_for {
	position: absolute;
	width: 55px;
	height: 96px;
	right: 49px;
	top: 860px;
    background-image: url("../img/button_next.png");
    background-repeat: no-repeat;
}

#page_a_caption {
	position: absolute;
	width: 760px;
	height: 91px;
	left: 51px;
	top: 54px;
    background-image: url("../img/caption_a.png");
    background-repeat: no-repeat;
}

#page_b_caption {
	position: absolute;
	width: 760px;
	height: 91px;
	left: 51px;
	top: 54px;
    background-image: url("../img/caption_b.png");
    background-repeat: no-repeat;
}

#page_a_count, #page_b_count {
	position: absolute;
	width: 150px;
	height: 37px;
	left: calc(50% - 150px/2);
	top: calc(50% - 37px/2 + 505.5px);

	font-family: 'URW DIN';
	font-style: normal;
	font-weight: 300;
	font-size: 24px;
	line-height: 34px;

	/* or 142% */
	display: flex; 
	justify-content: center; 
	align-items: center;

	color: #4D5052;
}

#page_a_content, #page_b_content {
	position: absolute;
	width: 1920px;
	height: 820px;
	left: 0px;
	top: 185px;
	display: flex; 
	justify-content: center; 
	align-items: center;
}

#page_a_content img, #page_b_content img {
	position: absolute;
	height: 100%;
	box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.45);
	outline: 1px solid transparent;
}