﻿/*
==========================================================================================================
	█   █▀▀█ █▀▀█ █▀▀    █▀▀█ █▀▀█ █▀▀▀ █▀▀ █▀▀ 
 	█   █  █ █▄▄▀ █▀▀    █▄▄█ █▄▄█ █ ▀█ █▀▀ ▀▀█ 
	▀▀▀ ▀▀▀▀ ▀ ▀▀ ▀▀▀    █    ▀  ▀ ▀▀▀▀ ▀▀▀ ▀▀▀ 
==========================================================================================================
*/
.lore_mini { display: inline-block; width: 200px; height: 140px; margin: 10px; border-radius: 12px; border: 1px solid #4e4e4e; box-shadow: 2px 2px 4px rgba(0,0,0,0.25); }
.lore_mini:hover a { text-decoration:none;}
.lore_mini_title { font-size: 15px; color: white; text-align: center; border-radius: 10px 10px 0 0; height: 20px; width:200px; font-weight:bold; }
.lore_mini_art { height: 100px; width:200px; box-shadow: inset 0 2px 4px #424242, inset 0 -2px 4px #4e4e4e; filter: saturate(0.75); transition: 0.2s; }
.lore_mini:hover .lore_mini_art { filter: saturate(1.25);}
.lore_mini_tagline { font-size: 14px; text-align: center; border-radius: 0 0 10px 10px; height: 20px; width:200px; }
.lore_mini_title > span, .lore_mini_tagline > span { color: white; text-align: center; max-width: 180px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;  }

.lore_head_wrapper { margin: 0 -10px 20px -10px; font-size: 16px; position: relative; background-color: #363339; }
.lore_block_art { text-align: center; position: relative; width: 800px; height: 400px; margin: auto; max-width: 100%; background-position: center center; }
.lore_block_art > img { border-radius: 16px; box-shadow: 2px 2px 6px rgba(0,0,0,0.5); } 
.lore_block_underart_wrap { position: absolute; bottom: -20px; left: 0; right: 0; display: flex; height: 1.5em; font-size: 16px; text-align: center; padding: 5px; box-shadow: 0 2px 2px black, 0 -2px 2px black; background: linear-gradient(to right, #445, #fff 30%, #fff 70%, #445 100%); } 
.lore_block_underart { width: 900px; display: flex; margin: auto; color: black; }
.lore_block_underart_row { flex: 1; text-align: center; font-family: 'Russo One'; text-shadow: 0 0 1px rgba(255,255,255,0.5), 0 0 2px rgba(255,255,255,0.5); }
.lore_block_underart_row_label { display: inline-block; padding-right: 5px; }
.lore_block_underart_row * { vertical-align: middle; }
.lore_mainblock { max-width: 900px; margin: auto; font-size: 16px; box-shadow: -20px 0 20px -20px #ccc,20px 0 20px -20px #ccc; padding: 16px; }
.lore_wide_row { font-family: "Russo One"; font-size: 16px; text-align: center; padding: 5px; box-shadow: 0 2px 2px black, 0 -2px 2px black; background: linear-gradient(to right, #445, #fff 30%, #fff 70%, #445 100%); }
.lore_wide_row h2 { margin:0; padding:0; }

.lore_2section_block { display:flex; }
.lore_block_box { margin: 0 10px 10px 0; flex: 1; border-radius: 10px; border: 1px solid black; text-align: center; font-size: 15px; max-width: 48%; padding-bottom: 20px; }
.lore_story_link_title { font-size: 16px; font-family: "Russo One"; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.lore_story_link_byline { font-size: 12px; }
.lore_story_link { display: inline-block; margin: 5px 10px 5px 10px; flex: 1; width: 250px; text-align: center; }
.lore_story_link:hover { text-decoration: none; color: #3e666f; }
.lore_story_link::after { content: ""; display: block; height: 1px; background: linear-gradient(to right,transparent,#eee,transparent); margin-top: 2px; }
.lore_story_link::before { content: ""; display: block; height: 1px; background: linear-gradient(to right,transparent,#eee,transparent); margin-bottom: 2px; }
.lore_story_link:hover::after, .lore_story_link:hover::before { background: linear-gradient(to right,transparent,#aaa,transparent); }

.lore_event_participants_list { text-align:center; }
.lore_event_participants_header { font-family: Russo One; font-size: 18px; text-align: center; } 
.lore_event_participants_header::before, .lore_event_participants_header::after { content: ""; display: block; height: 1px; background: linear-gradient(to right,transparent,#bbb,transparent); margin-bottom: 2px; }
.lore_event_participants { padding-bottom: 10px; }

.lore_page_block { max-width:1000px; margin:auto; text-align:center;}
.lore_page_block > * { vertical-align: top; }

.lore_recent_block { width: 480px; border: 1px solid black; border-radius: 20px; background-position: top center; display: inline-block; margin: 5px; max-height: 480px; min-height: 380px; height: 380px; overflow: hidden; }
.lore_recent_block-header { margin: 10px 10px 60px 10px; text-align: center; height: 60px; color: white; font-size: 36px; }
.lore_recent_block-link { height: 35px; margin-top: 45px; text-align: center; }
.lore_recent_block-link a { background-color: #404050; font-size: 14px; font-weight: bold; color: #C0C0D0; text-decoration: none; display: inline-block; padding: 3px 8px 3px 8px; text-align: center; border-radius: 20px; width: 200px; }
.lore_recent_block-link a:hover { color: #DDF; background-color: #505060; transition: color 200ms linear, background-color 200ms linear; -webkit-transition: color 200ms linear, background-color 200ms linear; -ms-transition: color 200ms linear, background-color 200ms linear; }
.lore-infostrip { height: 70px; background-color: rgba(0,0,0,0.5); background-position:top center; margin: 7px 0 7px 0; -webkit-transition: background-color 250ms linear, box-shadow 250ms linear; -ms-transition: background-color 250ms linear, box-shadow 250ms linear; transition: background-color 250ms linear, box-shadow 250ms linear; }
.lore-infostrip-item {width: 100%; } 
.lore-infostrip-item:hover { text-decoration: none; } 
.lore-infostrip-flex { display: flex; height: 70px; } 
.lore-infostrip-art-left { flex: 0; min-width: 150px; text-align: center; } 
.lore-infostrip-art-left > img { max-height: 60px; margin: 5px; border-radius: 4px; }
.lore-infostrip-details { flex: 1; color: white; text-shadow: 0 0 1px black, 0 0 2px black, 0 0 4px black; text-align: left; }
.lore-infostrip-details-title { font-size: 22px; font-family: Russo One; color: white; line-height: 32px; }
.lore-infostrip-details-credit { color: white; font-size: 18px; }
.lore-infostrip:hover { background-color: rgba(0,0,0,0.7); box-shadow: inset 0 0 2px rgba(100,180,200,0.5), 0 0 4px rgba(100,180,190,0.5); -webkit-transition: background-color 250ms linear, box-shadow 250ms linear; -ms-transition: background-color 250ms linear, box-shadow 250ms linear; transition: background-color 250ms linear, box-shadow 250ms linear; }

#lore_recent_pw_block	{ background-image: linear-gradient(black 0, rgba(0,0,0,0.5) 10%, transparent 20%, transparent 80%,rgba(0,0,0,0.5) 90%, black 100%), url('https://www.mtgnexus.com/img/lore/recent_pw.jpg'); }
#lore_recent_leg_block	{ background-image: linear-gradient(black 0, rgba(0,0,0,0.5) 10%, transparent 20%, transparent 80%,rgba(0,0,0,0.5) 90%, black 100%), url('https://www.mtgnexus.com/img/lore/recent_leg.jpg'); }
#lore_recent_event_block	{ background-image: linear-gradient(black 0, rgba(0,0,0,0.5) 10%, transparent 20%, transparent 80%,rgba(0,0,0,0.5) 90%, black 100%), url('https://www.mtgnexus.com/img/lore/recent_events.jpg'); }
#lore_recent_plane_block	{ background-image: linear-gradient(black 0, rgba(0,0,0,0.5) 10%, transparent 20%, transparent 80%,rgba(0,0,0,0.5) 90%, black 100%), url('https://www.mtgnexus.com/img/lore/recent_planes.jpg'); }

.lore_block_box_header { border-radius: 8px 8px 0 0; color: white; font-family: Russo One; font-size: 18px; padding: 6px; }


.lore_graphic_link { border-radius: 12px; position: relative; box-shadow: inset 2px 2px 3px rgba(255,255,255,0.5),inset -2px -2px 3px rgba(0,0,0,0.5), 2px 2px 4px rgba(0,0,0,0.5); height: 30vw; max-height: 360px; background-position: top center; max-width: 260px; width: 24%; display:inline-block; }
.lore_graphic_link_bottom { position: absolute; bottom: 0; left: 0; right: 0; height: 60px; background-image: linear-gradient(transparent,black 50%); border-radius: 0 0 12px 12px; color: white; text-align: center; font-family: Russo One; font-size: 18px; }
.lore_graphic_link_text { position: absolute; bottom: 10px; left: 0; right: 0; }
.lore_graphic_link_planes { background-image: url('https://www.mtgnexus.com/img/lore/planes.jpg'); }
.lore_graphic_link_planeswalkers { background-image: url('https://www.mtgnexus.com/img/lore/planeswalkers.jpg'); }
.lore_graphic_link_events { background-image: url('https://www.mtgnexus.com/img/lore/events.jpg'); }
.lore_graphic_link_legends { background-image: url('https://www.mtgnexus.com/img/lore/legends.jpg'); }

/*
==========================================================================================================
	█   █▀▀█ █▀▀█ █▀▀    █▀▀█ █▀▀▄ █▀▄▀█ ▀█▀ █▄  █ 
 	█   █  █ █▄▄▀ █▀▀    █▄▄█ █  █ █ ▀ █  █  █▀█▄█ 
	▀▀▀ ▀▀▀▀ ▀ ▀▀ ▀▀▀    ▀  ▀ ▀▀▀  ▀   ▀ ▀▀▀ ▀  ▀▀ 
==========================================================================================================
*/
.lka_main_button { display: block; width: 400px; margin: auto; text-align: center; font-size: 24px; background: linear-gradient(to bottom,#566 0, #9ab 100%); border-radius: 10px; padding: 10px; color: white; text-shadow: 1px 1px 1px black; box-shadow: 2px 2px 4px black; }
.lka_header { font-family: "Russo One"; font-size: 24px; text-align: center; padding: 5px; color: white; box-shadow: 0 2px 2px black, 0 -2px 2px black; margin: 5px -9px 5px -9px;}
.lka_listing { min-width: 560px; text-align: left; margin: auto; font-size: 15px; width: 800px; max-width: 100%;  border-spacing: 0 10px; border-collapse: separate; }
.lka_listing tr { background-color: #EFE; box-shadow: 1px 1px 3px black; }
.lka_listing tr:nth-child(2n) { background-color:#EEF; }
.lka_listing thead tr { background-color:black; color:white; }
.lka_listing img { width:100px; height:auto; }
.lka_listing tr th:nth-child(n+5), .lka_listing tr td:nth-child(n+5) { text-align:center; }
.lka_listing tr td:nth-child(2) { font-weight:bold; }
.lka_listing td , .lka_listing th { height: 50px; }
.lka_listing a { display: inline-block; width: 1.1em; height: 1.2em; background: linear-gradient(to bottom,rgba(128,128,128,0.5), rgba(64,64,64,0.5)); border-radius: 6px; padding: 0.2em; margin-right: 0.25em; }
.lka_listing a:nth-child(1) { background-color:#FCB; }
.lka_listing a:nth-child(2) { background-color:#AEF; }
.lka_listing a i.icon { color:black !important; text-shadow: 1px 1px rgba(255,255,255,0.4); }

.lka_input { padding: 5px; font-size: 18px; width: 95%; border: 2px inset #eee; border-radius: 6px; }
select.lka_input { width: 97.2%; }
.lka_input_row { display:flex; }
.lka_block { flex:1; margin: 5px 0 5px 0; }
.lka_label { display: block; font-size: 18px; font-family: "Russo One"; margin-top: 10px; }
#lka_css, #lka_summary { width:95%; padding: 5px; border-width: 2px; border-radius: 6px; height:140px; }
.lka_wrap { display:flex; }
.lka_left { flex:1; }
.lka_right { max-width: 300px; width: 300px; background: linear-gradient(to right, #ffffff 0%,#dce4e4 2%,#bbcbca 2%,#f7f7f7 100%); padding-left: 20px; }
.lka_block_right { margin-bottom: 25px; }
.lka_button_row { text-align: center; margin:5px 0 5px 0; padding: 5px 0 5px 0; border-top:1px dotted #bbb; border-bottom:1px dotted #bbb; }
.lka_btn { padding: 10px; color: white; border-radius: 10px; }
.lka_btn:hover { color:white; text-decoration:underline; }
.lka_img_prev { max-width:70%; margin-left:15%; border-radius:8px; min-width: 200px; min-height: 100px; }
.lka_revert_btn { font-size: 14px; width: 100%; padding: 5px; border: 2px outset #eee; border-radius: 8px; background-color: rgba(255,255,255,0.5); margin:5px 0 5px 0;}
.lka_revision_list { height: 250px; overflow-y: auto; }
.lka_input_info { text-align: center; font-size: 12px; }
#lka_slug_generator { cursor:pointer; background: radial-gradient(at top left, #f5f5f5 0%,#c3c3c3 50%,#b1b1b1 51%,#ededed 100%); height: 13px; width: 12px; float: right; border-radius: 100%; padding: 3px 4px 4px 4px; color: #333; text-shadow: 1px 1px white; box-shadow: 1px 1px 2px black; position: relative; bottom: -29px; right: -5px; }
#lka_slug_generator:hover { background: radial-gradient(at top left, #f0f0f0 0%,#c0c0c0 50%,#a8a8a8 51%,#e5e5e5 100%) }
@media screen and (max-width: 920px) { 
	.lka_wrap { display:block; } 
	.lka_right { max-width: none; width:100%; display:flex; background: linear-gradient(to bottom,#dce4e4 0%, #bbcbca 1%,#f7f7f7 100%); padding-left: 0px; } 
	.lka_right > div {width:50%; padding:5px;} 
}
.lka_scroll_list { font-size: 0.8em; max-height: 160px; overflow: auto; height: 160px; padding: 2px 20px 2px 20px; }
.lka_scroll_list_wrap { position:relative; }
.lka_scroll_list_wrap:after { content:""; position:absolute; top:0; left:0; right:0; height: 10px; background: linear-gradient(to bottom, white, transparent) }
.lka_scroll_list_wrap:before { content:""; position:absolute; bottom:0; left:0; right:0; height: 10px; background: linear-gradient(to bottom, transparent,white) }
.lka_scroll_list_line { display: flex; margin: 0.2em; padding: 0.2em; border-width: 1px; border-color: #aaa #999; border-style: solid; border-radius: 8px; font-weight: bold; background: linear-gradient(#DDD,#EEE,#DDD); }
.lka_scroll_list_line_btn { border-radius: 8px; padding: 2px 6px; color: white; }
.lka_scroll_list_line_item { width: 80%; }
.lka_scroll_list_line_buttons { width:20%; text-align:right; }
.lka_scroll_list_line .autocard { vertical-align: bottom; height: 70%; }
.lka_tiny_btn { font-size: 13px; font-family: Exo; border-radius: 8px; padding: 2px 4px; margin-top: -2px; background: linear-gradient(#444,#888 10%,#000); color: white; }
.lka_tiny_btn:hover { background: linear-gradient(#555,#AAA 10%,#333); color: white; }
.lka_info { text-align: center; font-size: 0.9em; }
.lka_err { box-shadow: inset 1px 1px 1px white, inset -1px -1px 1px white; background-image: linear-gradient(to bottom left, rgba(255,0,0,0.1), transparent, rgba(255,0,0,0.1), transparent, rgba(255,0,0,0.1)), linear-gradient(to bottom right, rgba(255,0,0,0.1), transparent, rgba(255,0,0,0.1), transparent, rgba(255,0,0,0.1)); background-size: 6px 5px; }
.lka_err_gray { box-shadow: inset 1px 1px 1px white, inset -1px -1px 1px white; background-image: linear-gradient(to bottom left, rgba(128,128,128,0.1), transparent, rgba(128,128,128,0.1), transparent, rgba(128,128,128,0.1)), linear-gradient(to bottom right, rgba(128,128,128,0.1), transparent, rgba(128,128,128,0.1), transparent, rgba(128,128,128,0.1)); background-size: 6px 5px; }

#lka_pop_cardlink, #lka_pop_storylink , #lka_pop_eventlink{ position: absolute; top: 0px; left: 0px; border-radius: 4px 0px 100% 0px; height: 35px; width: 35px; margin: 0; padding: 0; line-height: 25px; font-size: 20px; text-shadow: -1px -1px black; }
#lka_pop_cardlink i, #lka_pop_storylink i  , #lka_pop_eventlink i{ position: absolute; top: 4px; left: 6px; }
