@charset "utf-8";

#header { position: fixed; top:0; background: #fff; box-shadow: 0 0 2px 0 rgba(0,0,0,0.20); width:100%; height:3.5em; max-width: inherit; display: flex; align-items: center; z-index: 999; }
#header .left { position: relative; margin-left: 0.3em; }
#header .left button.back { width:2.4em; height: 2.4em; background-color: #FFF; background-image: url("../img/btn_header_back.svg"); background-repeat: no-repeat; background-position: 50% 50%; border:none; }

.title {
	margin: 16px auto 16px;
}
.typography-subtitle2 {
	margin: 16px auto 8px;
	color: #485059;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	word-break: keep-all;
}
.caption {
	color: var(--hli-color-text-body-3, #8C959D);
	font-size: 14px;
}
.caption strong {
	display: inline-block;
	margin-bottom: 4px;
	color: var(--hli-color-text-body-1, #485059);
	font-size:  18px;
}

.mainContent {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100vh;
	text-align: center;
	padding:20px;
	box-sizing: border-box;
	overflow: hidden;
}

.content {
    width: 90%;
}
@media (min-width: 1024px) {
    .content {
        max-width: 720px;
        min-width: 480px;
    }
}

.feedback {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-top: 4px;
}

.mainColdCaseCard {
	margin-top: 64px;
	padding: 32px;
	border-radius: 20px;
	background-color: #F5F6F7;
}
.mainColdCaseCard .typography-body2 {
	margin-bottom: 16px;
}

.durationCard {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	margin-top: 32px;
	/* padding: 18px 18px 18px 18px; */
	padding: 1.3rem 2rem;
	border-radius: 20px;
	background-color: rgba(250, 120, 0, 1);
	color: #fff;
}
.durationCard > strong {
    margin-bottom: 8px;
}
.durationCard > p {
    line-height: 1.5;
    margin: 0;
    text-align: left;
    color: #fff;
}
.durationCard > #datetime {
    padding: 0 1.3rem;
}

@media (max-width: 1023px) {
	.fixedFooter {
		position: fixed;
		bottom: 20px;
		left:  20px;
		right: 20px;
		z-index: 2;
	}
}

.btnHome,.btnReset {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	border: 0;
	border-radius: 8px;
	background-color: #FA6600;
	padding: 0 16px;
	color: #FFFFFF;
	cursor: pointer;
}
.btnHome, .btnReset {
	height: 40px;
	font-size: var(--hli-font-size-title-xsmall, 1rem);
	font-weight: 300;
	line-height: 1.5;
}
.btnHome {
	width: 100%;
}