@charset "utf-8";

.page_title { background:url(/images/2014/inbox/title-bar.png) no-repeat; width:789px; height:56px; }
.page_desc span { display:none; }
.page_desc.desc_artworks span.desc_artworks { display:block; }
.page_desc.desc_letters span.desc_letters { display:block; }

.categories { position:relative; margin:50px 0 30px 0; }
.categories .category { position:relative; display:inline-block; vertical-align:middle; width:162px; height:52px; cursor:pointer; }
.categories .category.cartworks { background:url(/images/2014/inbox/toggle-left.png) no-repeat; }
.categories .category.cletters { background:url(/images/2014/inbox/toggle-right.png) no-repeat; }
.categories .category.current { background-position:bottom; }
.categories .category p { margin-top:12px; text-shadow:none; }
.categories .category.current p { margin-top:15px; text-shadow: 1px 1px 0 #fff,-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,0px 1px 0 #fff,1px 0px 0 #fff,0px -1px 0 #fff,-1px 0px 0 #fff,1px 3px 7px #000; }
.categories .logo { position:absolute; background:url(/images/2014/inbox/inbox-icon.png) no-repeat; width:65px; height:65px; top:-9px; left:50%; margin-left:-32px; }
.categories .logo.artworks { background-position:top; }
.categories .logo.letters { background-position:bottom; }

.c_list { display:none; }
.c_list.current { display:block; }

.year { background:url(/images/2014/inbox/small-title-bar.png) no-repeat; width:270px; height:52px; position:relative; border:1px solid transparent; margin:40px auto 10px auto; }
.year p { margin-top:16px; }

.season_box { position:relative; text-align:center; }
.season_box .top, .season_box .middle, .season_box .bottom { width:954px; position:relative; margin:auto; }
.season_box .top { background:url(/images/2014/inbox/bar-default-top.png) no-repeat; height:31px; }
.season_box .middle { background:url(/images/2014/inbox/bar-default-body.png) repeat-y; height:auto; min-height:15px; }
.season_box .bottom { background:url(/images/2014/inbox/bar-default-bottom.png) no-repeat; height:30px; }

.season_box .list { position:relative; font-size:0px; width:870px; text-align:left; margin:auto; display:none; }
.season_box.selected .list { display:block; }
.season_box .list .blank { font-size:30px; }
.season_box .artwork { position:relative; background:url(/images/2014/inbox/frame-artwork.png) no-repeat; width:300px; height:215px; display:inline-block; margin:0 -5px; cursor:pointer; }
.season_box .artwork .image { position:absolute; width:238px; height:167px; top:24px; left:31px; text-align:center; }
.season_box .artwork .image img { border-radius:16px; }
.season_box .artwork .image img.horizontal { max-width:100%; }
.season_box .artwork .image img.vertical { max-height:100%; }
.season_box .artwork .absolute { position:absolute; top:0; left:0; }

.season_holder { position:absolute; width:930px; left:51px; top:13px; text-align:left; cursor:pointer; }
.season_holder .label { position:relative; text-transform:capitalize; }
.season_holder .holder_button { background:url(/images/2014/button/circle.png) no-repeat; width:60px; height:60px; text-align:center; position:absolute; top:-5px; right:0; color:#529900; font-size:3rem; font-weight:bold; }
.season_holder .holder_button p { display:none; margin-top:15px; margin-left:2px; }
.season_holder .holder_button p.close { margin-top:11px; }
.season_holder .holder_button p.open { display:block; }
.season_box.selected .season_holder .holder_button p.open { display:none; }
.season_box.selected .season_holder .holder_button p.close { display:block; }

.c_letters .season_box .list { position:relative; width:100%; }
.season_box .letter { position:relative; width:914px; margin:auto; }
.season_box .letter .letter_top { background:url(/images/2014/inbox/bar-inner-top.png); width:100%; height:31px; }
.season_box .letter .letter_middle { background:url(/images/2014/inbox/bar-inner-body.png); width:100%; height:auto; min-height:15px; }
.season_box .letter .letter_bottom { background:url(/images/2014/inbox/bar-inner-bottom.png); width:100%; height:31px; }
.season_box .letter_holder { width:893px; position:absolute; border:0px solid red; top:10px; left:10px; cursor:pointer; }
.season_box .letter_holder .labels { font-size:18px; width:90%; position:relative; margin:auto; top:5px; }
.season_box .letter_holder .labels div p { margin-left:20px; }
.season_box .letter_holder .labels .age { font-size:12px; }
.season_box .letter_holder .labels .age p { margin-bottom:5px; margin-top:0px; }
.season_box .letter_holder .labels .name { border-top:2px solid #592202; }
.season_box .letter_holder .labels .name p { margin-top:5px; }
.season_box .letter_holder .icon { position:absolute; left:6px; top:3px; }
.season_box .letter_holder .icon_letter { position:absolute; right:0px; top:-3px; background:url(/images/2014/button/circle.png) no-repeat; width:60px; height:60px; border:1px solid transparent; text-align:center; }
.season_box .letter_holder .icon_letter img { margin-top:18px; }

.popup { color:#592202; display:none; }
.popup.show { display:block; }
.layerdim { position:fixed; width:100%; height:100%; top:0px; left:0px; background-color:#000; opacity:0.5; }
.layerpop { top:0px; position:fixed; width:632px; left:50%; margin-left:-316px; text-align:center; }
.layerpop .top, .layerpop .middle, .layerpop .bottom { width:632px; }
.layerpop .top { background:url(/images/2014/inbox/frame-light-display-top.png) no-repeat; height:31px; }
.layerpop .middle { background:url(/images/2014/inbox/frame-light-display-body.png) repeat-y; height:auto;}
.layerpop .bottom { background:url(/images/2014/inbox/frame-light-display-bottom.png) no-repeat; height:31px; }
.layerpop .age { font-size:15px; }
.layerpop .individual_content { width:585px; position:relative; margin:20px auto 0px auto; font-size:15px; max-height: 580px; overflow-x: hidden; }
.layerpop .individual_content::-webkit-scrollbar { width: 12px; }
.layerpop .individual_content::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; }
.layerpop .individual_content::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #BD956B; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); }

.layerpop .individual_content img { border-radius:12px; max-height:411px; max-width:585px; }
.layerpop .btnclose { background:url(/images/2014/button/circle.png) no-repeat; width:60px; height:60px; text-align:center; position:absolute; top:6px; right:7px; color:#529900; font-size:3rem; font-weight:bold; cursor:pointer; }
.layerpop .btnclose p { margin-top:7px; margin-left:1px; }
.layerpop .indicator { position:relative; text-align:center; }
.layerpop .indicator div { display:inline-block; vertical-align:middle; }
.layerpop .indicator .symbol { width:170px; height:60px; background:url(../../images/2019/button_updates/status.png) no-repeat; margin:0 20px; }
.layerpop .indicator .symbol.bm { width:170px; height:60px; background:url(../../images/2019/button_updates/status-bm.png) }
.layerpop .indicator .symbol.winner { background-position:top; }
.layerpop .indicator .symbol.artworks { background-position:center; }
.layerpop .indicator .symbol.letters { background-position:bottom; }
.layerpop .indicator .button { width:203px; height:70px; cursor:pointer; visibility:visible; }
.layerpop .indicator .button.hide { visibility:hidden; }
.layerpop .indicator .prev { background:url(../../images/2019/button_updates/btn-previous-1.png) no-repeat; }
.layerpop .indicator .prev:hover { background:url(../../images/2019/button_updates/btn-previous-2.png) no-repeat; }

.layerpop .indicator .prev.bm { background:url(../../images/2019/button_updates/btn-kembali-1.png) no-repeat; }
.layerpop .indicator .prev.bm:hover { background:url(../../images/2019/button_updates/btn-kembali-2.png) no-repeat; }

.layerpop .indicator .next { background:url(../../images/2019/button_updates/btn-next-1.png) no-repeat; }
.layerpop .indicator .next:hover { background:url(../../images/2019/button_updates/btn-next-2.png) no-repeat; }

.layerpop .indicator .next.bm { background:url(../../images/2019/button_updates/btn-seterusnya-1.png) no-repeat; }
.layerpop .indicator .next.bm:hover { background:url(../../images/2019/button_updates/btn-seterusnya-2.png) no-repeat; }

.letters_content { display:none; }

.airbornes .airborne.bird.purplel { left:-70px; }
.airbornes .airborne.bird.greenr { top:630px; right:-10px; }
.airbornes .airborne.bird.pinkr { top:665px; right:-30px; }


@media screen and (max-width: 768px) {
	.page_title {
		width: 98%;
		background-size: 100%;
	}

	.page_title p {
		margin-top: .5rem;
		font-size: 3.5rem;
	}

	.page_desc {
		width: 90%;
	}

	.categories {
		margin: 20px 0 10px 0;
	}

	.season_box {
		margin: 0 20px;
	}

	.season_box .top, .season_box .middle, .season_box .bottom {
		width: 100%;
		background-size: 100%;
	}

	.season_box .top, .season_box .bottom {
		height: 2.3rem;
	}

	.season_box .letter {
		width: 90%;
	}

	.season_box .letter .letter_top, .season_box .letter .letter_middle, .season_box .letter .letter_bottom {
		width: 100%;
		background-size: 100%;
	}

	.season_box .letter .letter_top, .season_box .letter .letter_bottom {
		height: 2.3rem;
		background-repeat: no-repeat;
	}

	.bm .season_box .letter .letter_top, .season_box .letter .letter_bottom {
		height: 2rem;
		background-repeat: no-repeat;
	}

	.season_box .letter .letter_middle {
		height: 50px;
	}

	.season_box .middle {
		min-height: 56px;
	}

	.season_box .list {
		width: 100%;
    	flex-wrap: wrap;
    	justify-content: center;
    	align-items: center;
	}

	.season_box.selected .list {
		display: flex;
	}

	.season_box.selected .middle {
		padding-top: 15%
	}

	.season_holder {
		width: 100%;
		padding: 0 5%;
    	display: flex;
    	justify-content: space-between;
		box-sizing: border-box;
		left: auto;
	}

	.season_holder .holder_button {
		position: relative;
		font-size: 30px;
		right: -3%;
	}

	.season_holder .holder_button p {
		margin-top: 20%;
	}

	.season_box .letter_holder {
		width: 95%;
	}

	.c_letters .season_box.selected .middle {
		padding-top: 18%
	}

	.c_letters .c_letter {
		margin-bottom: 10px;
	}

	.c_letters .letter_holder .labels {
		width: 74%;
	}

	.c_letters .letter_holder .labels .name {
		font-size: 12px;
	}

	.season_box .letter_holder .icon {
		top: -1px
	}

	.layerpop {
		width: 90%;
		margin: auto;
		left: 5%;
		top: 10%
	}

	.layerpop .individual_content {
		width: 90%;
		max-height: 400px !important;
	}

	.layerpop .individual_content img {
		width: 100%;
	}

	.layerpop .top, .layerpop .middle, .layerpop .bottom {
		width: 100%;
		background-size: 100%;
	}

	.layerpop .middle .name {
		padding: 0 20%;
	}

	.layerpop .top, .layerpop .bottom {
		height: 3.6rem;
	}

	.layerpop .btnclose p {
		font-size: 20px;
		margin-top: 27%;
	}

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

	.layerpop .indicator .button {
		height: 40px;
		background-size: 100%;
	}

	.layerpop .indicator .next:hover {
		background-size: 100%;
	}

	.layerpop .indicator .prev:hover {
		background-size: 100%;
	}

	.layerpop .indicator .symbol {
		height: 35px;
		background-size: 100%;
	}

	.layerpop .indicator .next.bm {
		background-size: 100%;
	}

	.layerpop .indicator .prev.bm {
		background-size: 100%;
	}

	.layerpop .indicator .next.bm:hover {
		background-size: 100%;
	}

	.layerpop .indicator .prev.bm:hover {
		background-size: 100%;
	}

	.layerpop .indicator .symbol.bm {
		height: 25px;
		background-size: 100%;
	}
}

@media screen and (max-height: 768px) {
	.layerpop .individual_content {
		max-height: 558px;
	}
}

@media screen and (max-height: 700px) {
	.layerpop .individual_content {
		max-height: 500px;
	}
}