/* Generic */
body, img, p, h1, h2, h3, ul, ol, li, form, blockquote, hr {margin:0px; padding:0px;}
html, body {font-family:arial; font-size:12px; border:0px; color:#ddd;}
a:hover {text-decoration:underline; cursor:pointer;}
body {margin:0px 40px;}
gap, lilgap {display:inline-block; min-width:25px;}
	lilgap {min-width:8px;}
h2 {color:#72B3C3; font-size:13px; margin-bottom:10px;}
	.hrAdmin, .hrReport {margin:8px 0px; padding:0px;}
	.hrAdmin {width:50%; min-width:480px;}
span {display:inline-block; vertical-align:top;}
/**/
.buttonStyle {width:32px; height:32px; background:url('./layout/style.png');}
	.listTopCorner {position:absolute; top:-12px; left:-12px;}
	.listTopCorner2 {position:absolute; top:-12px; right:-12px;}
.tL {text-align:left;}
.tagNew {position:relative; width:56px; height:32px;}

/* Container */
#container {width:100%; height:100%; max-width:1600px; padding:0 0 30px 0; margin:0px auto;}

/* Header */
#header {width:100%; height:108px;}
#header h1 {padding:30px 0px 0px 20px;}

/* Menu Bar */
.wideLI {width:256px;}
#menu {width:100%; height:30px;}
	#menu ul {background:linear-gradient(to bottom, #14222B 70%, #284458 100%); position:relative; display:inline-block; width:calc(100% - 180px); height:30px; margin-left:160px; padding:0px; border-radius:8px 8px 0px 0px;}
	#menu ul li {float:left; line-height:30px; display:inline-block; font-weight:bold; text-transform:uppercase; font-family: "Lucida Sans", Arial, sans-serif;}
	#menu ul li a {display:inline-block; position:relative; color:#C0CDCF; transition:all 0.25s ease;}
	#menu ul li a:hover {color:#fff; cursor:pointer;}
	#menu ul li a span {display:inline-block; height:30px; padding:0px 24px;}
	#menu ul .menuDivider {display:inline-block; width:1px; border:0px; margin-top:0px; height:30px; background:#2B404D;}
	#menu ul li.current_page_item {height:35px; margin-top:-5px;}
	#menu ul li.current_page_item a {background: linear-gradient(to bottom, #D8D8E0 0%, #FFF 27.5%); border-radius: 4px 4px 0px 0px; margin-top: 0px; color: #1A272E;}
	#menu ul li.current_page_item a:hover {color: #1A272E;}
	#menu ul li.current_page_item a span {height: 35px;}
.underBar {position:fixed; text-align:center; text-decoration:none; width:74px; background:linear-gradient(to bottom, #14222B 70%, #284458 100%); border-radius:4px; margin-top:2px; line-height:22px; vertical-align:middle; font-weight:bold;}
	.underBar:hover {text-decoration:none;}
.underCheckbox {text-transform:capitalize; display:inline-block; min-width:250px; height:32px; white-space:nowrap; font-weight:normal; border:1px solid #555; border-top:0 solid black; border-radius:0 0 4px 4px; padding-left:4px;}
	.underCheckbox input {width:13px; height:13px; margin:1px;}

/* Buttons */
.button1 {
	border-radius:3px; font-size:14px; font-family: "Lucida Sans", Arial, sans-serif; color:white; width:104px; line-height:40px; text-align:center; margin:0px 8px; font-weight:bold;
	background:linear-gradient(to bottom, rgb(112,176,240) 0px, rgb(64,128,200) 4px, rgb(64,128,200) 40%, rgb(32,96,160) calc(100% - 4px));  border:1px solid rgb(64,128,192); cursor:pointer;
}
	.buttonH25 {line-height:25px;}
	.buttonH30 {line-height:30px;}
	.buttonW64 {width:64px;}
.buttonEdit {background:linear-gradient(to bottom, rgb(240,192,64) 0px, rgb(200,144,80) 4px, rgb(200,144,80) 40%, rgb(184,104,72) calc(100% - 6px), rgb(160,80,64) calc(100% - 4px)); border:1px solid rgb(160,80,64);}
/*Used for page bar*/
.pageButton {width:2em; line-height:30px; padding-bottom:2px; color:#ccc; background:linear-gradient(to bottom, #666 calc(100% - 8px), #999 100%); font-size:24px; text-align:center; border-radius:4px; border:2px solid #555;}

.selectImgButton1, .selectImgButton2 {cursor:pointer; box-shadow:-4px 4px 2px rgba(0,0,0,0.5); width:200px; height:80px; position:relative; padding:8px; border:2px solid rgb(192,200,240); border-radius:8px;}
	.selectImgButton1 {background: url(./layout/submit_music_button.png) no-repeat center, linear-gradient(white 55%, rgb(168,176,240) 100%);}
	.selectImgButton2 {background: url(./layout/submit_game_button.png) no-repeat center, linear-gradient(white 55%, rgb(168,176,240) 100%);}
.selectImgOver {padding:8px; width:200px; height:80px; position:absolute; background:rgba(0,8,32,0.3); top:-2px; left:-2px; opacity:0; border:2px solid rgb(128,144,192); border-radius:8px; transition:opacity 0.3s;}
	.selectImgOver:hover {opacity:1;}

.closeX {width:32px; height:32px; background:url('./layout/style.png') -297px -66px; cursor:pointer;}
	.closeXTopCorner{position:fixed;}
	.closeXRight{float:right}

.ratingsIcon, .downloadIcon, .errorIcon {width:32px; height:32px; margin:0px; padding:0px; background:url('./layout/style.png');}
	.ratingsIcon {background-position:-33px -66px;}
	.downloadIcon {background-position:-231px -66px;}
	.errorIcon {background-position:-264px -66px;}

#deleteBox, #reportBox {text-align:center; width:324px; padding:8px; height:240px; border-radius:8px; background:linear-gradient(to bottom, #222 0%, #333 calc(0% + 64px)); border:2px solid #666;}

.spamBox {width:84px; height:84px; position:relative; border:1px solid rgb(192,208,240); border-radius:5px; margin:2px;}

.spanBoxI {position:absolute; bottom:0px; right:0px;}
	.spanBoxI input {box-shadow:-2px 2px 0px rgba(0,0,0,0.5); width:16px; height:16px;}

#reportBox{width:400px; height:500px;}

.pageScroll div span gap {min-width:32px;}

/* Project */
project {display:table; width:100%;}

/* Combined */
sidebar, mainbar {vertical-align:top; display:table-cell; height:100%;}

/* Mainbar */
mainbar {width:calc(100% - 302px); border-radius:8px 0 0 0; background:linear-gradient(to right, #222 calc(100% - 32px), #333 calc(100% - 1px), #222 100%); padding:40px 0px 40px 0px;}
	mainbar a {text-decoration:none; font-weight:bold; color:rgb(206,20,51);}
	mainbar h2 {color:#ccc; font-size:28px; margin:0px 30px 0px 30px;}
	mainbar h3 {color:#bbb; font-size:13px; margin:0px 30px 30px 30px; line-height:1.2;}
	mainbar li{margin-left:56px;}
		mainbar h3 a{color:#587384;}
		mainbar hr {height:1px; margin:24px 0px; padding:0px; width:100%; border:0 solid black; background:#cbcbcb;}
		mainbar p {line-height: 1.4; text-align:justify; margin:0px 20px 20px 30px;}
		mainbar input, mainbar textarea {font-family:arial; font-size:13px; border:2px solid #444; background:linear-gradient(to bottom, #222 0%, #333 60%); border-radius:2px; color:#ccc}

/* Custom Checkbox */
.cbox_contain {display:inline-block; position:relative; vertical-align:top; cursor:pointer; font-size:21px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
.cbox_contain input {display:none;}
.cbox_contain {position:relative;}
.cbox_contain input:checked ~ .checkmark {background: #41a6Ff; height:24px; width:24px; border:2px solid rgb(168,192,200);}
.cbox_contain input:checked ~ .checkmark:after {display: block;}
.checkmark {text-align:left; position:absolute; height:24px; width:24px; border:2px solid #444; background:linear-gradient(to bottom, #222 0%, #333 60%); border-radius:4px;}
.checkmark:hover {background:linear-gradient(to bottom, #000 0%, #222 60%);}
.checkmark:after {content:""; position:absolute; display:none;}
.checkmark:after {left:9px; top:3px; width:5px; height:14px; border:solid #f0f0ff; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

/* Sidebar */
.monthHeader {background:#555; padding:2px 0px;}

sidebar {width:298px; border-radius:0 8px 0 0; background:linear-gradient(to bottom, #222 0%, #333 calc(0% + 16px)); border-top:1px solid #333; border-right: 1px solid #333; border-left: 1px solid #222; padding:0px; margin:0px;}
	sidebar a{color:#7FA0A9; font-weight:normal; text-decoration:none;}
	sidebar hr{height:0px; border:0px solid black; border-bottom:1px solid #EEF6F8; border-top:1px solid rgb(205,218,233);}
	sidebar h2 {color:#72B3C3; font-size:13px; margin-bottom:10px;}
	sidebar li {list-style-type:none; font-weight:bold; padding:12px; text-align:justify; background:linear-gradient(to bottom, rgba(0,0,0,0) calc(100% - 16px), rgba(34,34,34,1) 100%);}
.sideTop {width:140px; padding:5px 0px; margin:8px 0px; text-align:center; font-weight:bold; cursor:pointer;}
.sidebarWrap, .sidebarColumn {overflow:hidden; text-overflow:ellipsis;}
.sidebarColumn {max-width:240px;}
.sidebarLight {background:#fff; color:#555;}
.sidebarDark {background:#555; color:#fff;}

/* Top Ten Downloads */
.sideTopX {margin:2px 0px 2px 4px; width:288px;}
.sideTop1 {width:40px;}
.sideTop2 {width:240px; font-weight:normal;}
	.sideTop2 input {display:inline-block; text-decoration:none; font-weight:bold; color:rgb(206,20,51); background:rgba(0,0,0,0); border:0 black solid; margin:0px; margin-left:-2px; padding:0px; cursor:pointer;}
	.sideTop2 input:hover {text-decoration:underline;}

/* Footer */
footer, footer2 {display:inline-block; width:calc(100% - 20px); padding:10px; color:rgb(178,209,228); font-weight:bold;}
footer {background:rgb(22,34,43);}
footer2 {background:rgb(26,39,46); border-radius:0 0 8px 8px; border-top:1px solid rgb(43,64,77);}
footer a, footer2 a {color:rgb(178,209,228);}

/* -- PAGE STUFF -- */
/* Home */
#searchResult0, #searchResult1 {width:208px; background:url('./layout/search_magnifier.png') no-repeat 1px 1px, linear-gradient(to bottom, #14222B 70%, #284458 100%); color:#C0CDCF; border:2px solid #C0CDCF; border-radius:4px; margin:0px 8px; padding-left:24px}
.homeGap {height:24px;}
.pageScroll {display:block; height:48px; margin:8px 40px 8px 40px; border-top:2px solid rgb(68,68,68); background:linear-gradient(to bottom, rgba(0,0,0,0) calc(100% - 32px), rgba(68,68,68,1) 100%); }
.limitLine {line-height:18px; max-width:215px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
	.tagGap{margin-left:25px;}
/* Search */
div[class^="searchX"] {margin:0 40px 0 40px;}
div[class^="searchX"] span {min-height:32px; text-align:left; padding:4px;}
	div[class^="searchX"] .s1{width:calc(25% - 8px); min-width:60px;}
	div[class^="searchX"] .s2{width:calc(16% - 8px); min-width:60px;}
	div[class^="searchX"] .s3{width:calc(8.5% - 8px); min-width:60px;}
	div[class^="searchX"] span input{font-size:12px; font-weight:bold; background:rgba(0,0,0,0); border:none; margin:0px; padding:0px; cursor:pointer; width:auto;}
		div[class^="searchX"] span input:hover {text-decoration:underline;}
	div[class^="searchX"] #downloadForm {margin-top:0px; color:rgb(206,20,51);}

div[class^="searchX"] span a, .reportLink {text-decoration:none; font-weight:bold; color:#88A3B4; cursor:pointer;}
.reportLink{width:44px;}
div[class^="searchX"] span a:hover, .reportLink:hover {text-decoration:underline;}
/**/
.searchX0 {background: #333;}
.searchX1 {background: #282828;}
.searchXHeader {background:#4A4A4A;}
	.searchXHeader .s1, .searchXHeader .s2, .searchXHeader .s3, .searchXHeader .s4, .searchXHeader .s5 {font-weight:bold; font-size:16px;}
/**/
.gridBox {border:2px solid #555; width:240px; margin:16px; box-shadow:-6px 6px 0px #111; transition:all 0.4s ease;}
.gridDetails{width:100%; text-align:left; background:linear-gradient( #3a3a3a 50%, #333 75%, #222 100%);}
	.gridDetails a{text-decoration:none; font-weight:bold; color:#88A3B4; cursor:pointer; transition:color 0.3s ease;}
	.gridDetails a:hover{color:#eef;}
.gridImg, .gridInner{width:240px; height:240px; background:#ddd;}
.gridInner{position:relative;}
.gridColumn, .gridColumn2, .gridInner {opacity:0; background:rgba(0,0,0,0.5); transition: opacity 0.25s;}
	.gridColumn {position:absolute; top:0px; width:120px; height:240px;}
	.gridColumn2 {position:absolute; top:0px; width:240px; height:240px;}
	.gridCol1{left:0px;}
	.gridCol2{left:120px;}
	.gridColumn:hover, .gridColumn2:hover, .gridInner:hover {opacity: 1;}
.gridClickme,.gridClickme2{position:absolute; width:72px; height:72px; top:84px;}
	.gridClickme{ left:24px;}
	.gridClickme2{ left:84px;}
.gridTinyTag{height:14px; margin:0px 5px 0px 3px; vertical-align:middle;}

.displayOpt {border:1px solid rgb(85,85,85); background:linear-gradient(to bottom, rgba(0,0,0,0) calc(100% - 32px), rgba(85,85,85,1) 100%); width:116px; height:40px; padding-top:4px; border-radius:4px; text-align:center;}
.displayBut {width:40px; height:32px; padding:0px; margin:0px 6px; background:rgba(0,0,0,0); border:0px solid black; cursor:pointer;}
/* Page */
.coverWrap {border:3px solid #555; border-radius:8px; margin:20px 0px;}
.pageWrap {background:#333; width:446px; border:1px solid #555; border-radius:8px; margin-bottom:16px;}
.pageSpan1,.pageSpan2 {text-align:left;font-weight:bold; padding:4px 8px;}
.pageSpan1 {width:100px;}
.pageSpan2 {width:280px;}
#overCaps, #overImage {z-index:2; background:rgba(17,17,17,0.8); width:100%; height:100%; position:absolute; top:0px; left:0px; display:none; opacity:0; cursor:zoom-out;}
#pageImg, #capsImg {border:6px solid #444; position:fixed; cursor:default; margin:auto; max-width:calc(100% - 64px); max-height:calc(100% - 64px);}
.capsThumb {border:2px solid #666; box-shadow:-4px 4px 0px rgba(0,0,0,0.3); margin:7px; cursor:zoom-in;}

/*Report*/
.reportWidth {text-align:left; width:256px; margin-right:28px;}

/* -- ADMIN STUFF -- */
/* Login Box */
.loginInput {width:224px; height:32px; padding:0px 8px;}
.loginBox1 {width:360px; text-align:left; border-radius:8px; border:1px solid #bbccdd; background:linear-gradient(to bottom, rgb(205,218,223) 0%, rgb(226,238,242) calc(0% + 16px));}
.loginBox2 {width:250px; margin:8px; padding:10px; text-align:left; margin-bottom:32px; border:1px solid #666; background:#333; border-radius:8px;}
	.loginBox2 div {margin-bottom:8px;}
.loginBoxTop {width:480px; margin-bottom:24px;}
.loginWarning {font-size:16px; font-weight:bold; text-align:center;}
.loginBoxInside {width:49%; text-align:center; vertical-align:middle; font-weight:bold; font-size:16px;}
.touhouLogo1 {width:184px; height:184px; border-radius:96px; margin:16px; background:rgba(255,255,255,0.5);}
.touhouLogo2 {width:168px; height:168px; margin:8px; border-radius:84px;}

/* Buttons */
/*Default Yes & No*/
.buttonDY {font-size:20px; width:30px; height:30px; line-height:26px; padding-left:7px; padding-bottom:4px; border-radius:15px;}
/*Shift page arrangement up and down*/
.buttonLeft, .buttonRight {line-height:30px; height:30px; line-height:24px; margin:0px; width:40px;}
.buttonLeft {border-radius:16px 0 0 16px; border-right:1px solid rgb(46,80,120);}
.buttonRight {border-radius:0 16px 16px 0; border-left:1px solid rgb(128,192,248);}

/*  Admin */
.adminX{font-size:18px; text-decoration:underline; margin:16px; color:#587384;}
.x1{width:80px;}
.adminBox {width:calc(100% - 64px); border:1px solid #bbccdd; border-radius:10px; background:#222; margin-bottom:32px; padding:8px;}
	.adminBox .adminLine{width:calc(100% - 32px); line-height:36px; margin-bottom:8px; border-radius:8px 8px 0 0; padding-left:32px; background:#333; color:#ccc; font-size:22px; font-weight:bold; text-align:left;}
	.adminBox p a {text-decoration:none; font-weight:bold; color:#88B3B4; cursor:pointer; font-size:14px; width:160px;}
	.adminBox input{width:272px; height:24px; padding:0px 8px;}
	.adminBox textarea{width:272px; height:100px; padding:0px 8px;}/* maxlength="65536";*/
	.adminBox .header {font-size:16px; width:800px; padding:4px 0; margin-bottom:4px; background:#555;}
	.adminBox .form1, .adminBox .form2 {margin-bottom:8px;}
	.adminBox .form1, .adminBox .form3 {width:224px; text-align:right; padding-right:16px; font-weight:bold; line-height:1.2;}
		.adminBox .form1 div{width:224px; font-weight:normal;}
	.adminBox .form2{width:280px;}
	.adminBox .form3{width:160px; text-align:center; height:34px;}
		.adminBox .form3 div{width:160px; font-weight:normal;}
	.adminBox .editLine0, .adminBox .editLine1{padding:6px 0px 6px 6px; text-align:center;}
	.adminBox .editLine0 {background: #333;}
	.adminBox .editLine1 {background: #282828;}
	.adminBox .editLeft{text-align:left; width:280px;}
.adminDirect {width:300px; padding:8px; margin:2px; transition:all 0.3s ease; background: rgba(128,160,192,0); border-radius:6px;}
	.adminDirect:hover {padding-left:32px; width:276px; background: rgba(128,160,192,1); color:white;}

/**/
#overEdit, #overDelete, #overReport {background:rgba(17,17,17,0.8); width:100%; height:100%; position:absolute; top:0px; left:0px; display:none;}
#overEdit {z-index:3; opacity:0; cursor:zoom-out;}
#overReport {z-index:2; cursor:zoom-out;}