
#allcover { width:94%; max-width:1400px; margin:0 auto; }

h1 { margin:0; padding:0; font-size:36pt; font-weight:normal; font-family:Arial,Tahoma; }
h2 { margin:0; padding:20px 0 0 0; font-size:26pt; font-weight:normal; font-family:Arial,Tahoma; }

.spboard { box-sizing:border-box; width:96%; max-width:1400px; margin:0 auto; padding:5px 5px 15px 5px; font-size:14pt; }
.spboard .xlink { display:inline-block; box-sizing:border-box; width:20%; padding:5px; vertical-align:top; text-align:left; color:var(--text2); }
.spboard .ximg { width:40px; height:40px; border-radius:50%; border-style:none; vertical-align:middle; }
.spboard .xlink .xname { display:inline-block; box-sizing:border-box; width:calc(100% - 40px); padding:0 0 0 4px; vertical-align:middle; }
.spboard .xlink:hover { color:var(--linkactive); }
.spboard .xmore { padding:10px 5px 5px 10px; font-size:16pt; color:var(--linkpj); }
.spboard .xmore:hover { color:var(--linkpjactive); }

.sptab { width:100%; overflow-x:auto; margin:15px 0 0 0; box-shadow:inset 0 -1px 0 var(--border); font-size:18pt; white-space:nowrap; }
.sptab .xbox { max-width:980px; margin:0 auto; text-align:left; }
.sptab a { display:inline-block; margin-bottom:1px; padding:5px 12px; vertical-align:bottom; color:var(--text2);  }
.sptab a:hover { color:var(--linkactive); }
.sptab a.active { margin:0 3px -1px 3px; margin-bottom:0; padding:5px 15px 6px 15px; border-radius:5px 5px 0 0; border-width:1px 1px 0 1px; border-style:solid; border-color:var(--border); background-color:var(--bg); color:var(--linkpj); }
.sptabbody { padding:14px 0; }

#listbox { box-sizing:border-box; width:100; max-width:1000px; margin:0 auto; color:var(--text4); font-size:12pt; }
#listbox .xcensor { font-style:italic; }
#listbox .xlink { display:block; box-sizing:border-box; padding:18px 10px; color:var(--text); }
#listbox .xlink:hover { background-color:var(--bg2); color:var(--linkactive); }
#listbox .ximg { display:inline-block; box-sizing:border-box; width:240px; aspect-ratio:1280 / 720; border-style:none; background-color:var(--bg3); vertical-align:top; }
#listbox .xtext { display:inline-block; box-sizing:border-box; width:calc(100% - 240px); padding:10px 0 0 10px; vertical-align:top; }
#listbox .xtitle { display:inline-block; box-sizing:border-box; width:100%; font-size:18pt; }
#listbox .xinfo { display:inline-block; box-sizing:border-box; width:100%; color:var(--text4); }
#listbox .xadwait { display:inline-block; box-sizing:border-box; max-width:80%; margin:10px 0 0 0; padding:10px; font-size:16pt; background-color:var(--bgyellow); font-size:14pt; }

#listbox.spclip .ximg { position:relative; background-color:var(--bg3); background-size:cover; background-position:center center; }
#listbox.spclip .xplay { position:absolute; left:50%; top:50%; display:inline-block; box-sizing:border-box; width:80px; height:80px; margin:-40px 0 0 -40px; padding:2px 0 0 10px; border:3px solid #fff; border-radius:50%; text-align:center; line-height:64px; font-size:64px; color:#fff; opacity:0.75; }
#listbox.spclip .xlink:hover .xplay { opacity:1; }

.sppage { padding:0 0 20px 0; text-align:center; }

.spbmenu { width:98%; max-width:940px; margin:0 auto; padding:20px 0 50px 0; text-align:center; font-size:18pt; }
.spbmenu a { display:inline-block; padding:5px; white-space:nowrap; color:var(--linkpj); }
.spbmenu a:hover { color:var(--linkpjactive); }
.spbmenu .xicon { width:64px; height:64px; border-style:none; vertical-align:middle; }

#sidesticky { position:absolute; right:4px; top:100px; width:300px; min-height:600px; background-color:var(--bg2); }
@media(max-width:1100px) { #sidesticky { display:none; } }

@media(max-width:1300px) {
	.spboard { font-size:13pt; }
	}
@media(max-width:1200px) {
	.spboard { width:100%; font-size:12pt; }
	.spboard .xlink { width:25%; }
	}
@media(max-width:1100px) {
	}
@media(max-width:900px) {
	#listbox .ximg { width:160px; }
	#listbox .xtext { width:calc(100% - 160px); }
	}
@media(max-width:800px) {
	.spboard .xlink { width:33%; }
	}
@media(max-width:700px) {
	.spboard { width:100%; }
	.sptab { font-size:16pt; }
	}
@media(max-width:600px) {
	.spboard { padding-right:0; }
	.spboard .xlink { width:50%; padding-left:5px; padding-right:5px; }
	}
@media(max-width:500px) {
	.sptab { font-size:14pt; }
	.sptab a { padding:5px 7px; }
	.sptab a.active { padding:5px 9px 9px 9px;  }
	.spbmenu .xicon { width:50px; height:50px; }
	#listbox { width:100%; font-size:11pt; }
	#listbox .xlink { padding:14px 0 14px 8px; }
	#listbox .ximg { width:128px; }
	#listbox .xtext { width:calc(100% - 128px); padding:0 0 0 5px; }
	#listbox .xtitle { font-size:16pt; }
	#listbox.spclip .xplay { width:54px; height:54px; margin:-27px 0 0 -27px; padding:0 0 0 5px; line-height:44px; font-size:44px; }
	}
@media(max-width:340px) {
	.sptab { font-size:12pt; }
	.sptab a { padding-left:5px; padding-right:5px; }
	#listbox .xtitle { font-size:14pt; }
	}
