/* General */

.mods-related 					{  }
.mods-related h2 				{ margin: 32px 0 12px; font-size: 20px; font-weight: 300; }
.mods-related .section 			{ overflow: hidden; }
.mods-related .items 			{ margin: 12px 0 16px; display: flex; flex-wrap: wrap; margin-right: -16px; }
.mods-related .items .item 		{ position: relative; padding-left: 132px; width: 305px; height: 100px; font-size: 16px; overflow: hidden; margin: 0 16px 16px 0; white-space: nowrap; flex-shrink: 0; flex-grow: 1; }
.mods-related .items .item p 		{ display: block; text-overflow: ellipsis; overflow: hidden; }
.mods-related .items .item .title 	{ margin: 9px 4px 0 12px; }
.mods-related .items .item .author 	{ margin: 0 4px 0 12px; font-size: 12px; color: #999; }
.mods-related .items .item img 		{ position: absolute; top: 12px; left: 12px; }
.mods-related .items .item:hover 	{ text-decoration: none; }
.mods-related .items .item:hover .title { text-decoration: underline; }

/* List */

.content-head 			{ padding: 15px; }
.content-head h1 		{ margin: 0 0 0.4em; }

.content-head .latest 		{ border: 1px solid #ccc; border-radius: 3px; float: right; padding: 8px 12px 6px; width: 200px; }
.content-head .latest .title 	{ padding: 0 0 8px; }
.content-head .latest .title a 	{ color: #222; }
.content-head .latest ul li 	{ font-size: 12px; border-top: 1px solid #ddd; line-height: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.content-head .latest ul span 	{ font-size: 10px; color: #aaa; }

.content-head .lead-info 		{ font-size: 12px; }

.content-box #info-tabs .labels { border-bottom: none; }

.mod-upload-button a 		{ background-color: #428bca; color: #fff; padding: 3px 14px; border-radius: 4px; font-size: 13px; opacity: 0.9; }
.mod-upload-button a:hover 	{ text-decoration: none; opacity: 1; }

.mods-list 							{ padding: 0; max-width: 1100px; margin-top: 15px; }
.mods-list .list .mod 				{ display: block; min-height: 96px; color: #222; padding: 15px 0 15px 150px; position: relative; border-bottom: 1px solid #e2e2e2; }
.mods-list .list .mod:last-child 	{ border-bottom: none; }
.mods-list .list .mod:hover 		{ text-decoration: none; }
.mods-list .list .mod:hover .title 	{ text-decoration: underline; }
.mods-list .list .mod .thumbnail 	{ position: absolute; top: 15px; left: 15px; width: 128px; height: 96px; background: no-repeat center; }
.mods-list .list .mod .title 		{ font-size: 16px; color: #08c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mods-list .list .mod .extra 		{ font-size: 12px; color: #989898; }
.mods-list .list .mod .info 		{ font-size: 12px; color: #1a1a1a; margin-top: 11px; padding-right: 172px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.mods-list .header 					{ padding: 0 15px 15px; }
.mods-list .header .pages 			{ font-size: 14px; }
.mods-list .header .sort 			{ float: right; font-size: 14px; }
.mods-list .header .sort select 	{ margin: 0 0 0 4px; }

.mods-list #info-tabs .labels 	{ border-bottom: none; }

.mods-browse				{ margin-right: 10px;padding: 24px 0;}
.mods-browse p.title		{ font-size: 20px; padding: 0 24px; margin: 0 0 12px; }
.mods-browse hr 			{ display: none; border: none; height: 1px; background: #ccc; }

.mods-browse .mod-search 	{ padding: 0 24px; margin-bottom: 24px; }
.mods-browse .mod-search input 	{ width: 100%; }
.mods-browse .mod-upload 	{ padding: 0 24px; font-size: 14px; }

/* List */

.mod-list 					{ display: flex; margin: 0 -5px; overflow: auto; padding: 10px 0; }
.mod-list 					{ background: transparent; box-shadow: none; margin-bottom: 25px; }
.mod-list .mod 				{ background: #fff; position: relative; margin: 0 5px 5px; padding: 16px; max-width: 160px; flex: 0 0 160px; box-sizing: border-box; box-shadow: 0 1px 5px rgba(0,0,0,.1); border-radius: 2px; }
.mod-list .mod:before 		{ content: ''; position: absolute; width: 160px; height: 160px; top: 0; left: 0; }
.mod-list .mod:hover:before { background: rgba(0,0,0,.2); }
.mod-list .mod .img 		{ width: 128px; height: 128px; background-position: center; background-size: cover; margin-bottom: 26px; }
.mod-list .mod .title,
.mod-list .mod .author 		{ display: block; font-size: 13px; white-space: nowrap; width: 100%; overflow: hidden; text-overflow: ellipsis; margin-bottom: 0; color: #222; }
.mod-list .mod .author 		{ color: #aaa; margin-top: 3px; }

/*section.full .mod-list 		{ max-width: calc(100vw - 280px); }*/

/* View */

section article.mod 		{ padding-bottom: 24px; }

.mod-title 					{ background: #fff no-repeat; min-height: 76px; padding: 0 15px 0 150px; }
.mod-title h1				{ line-height: 1em; padding-bottom: 5px; margin: 0 0 15px; }
.mod-title .author-box 		{ margin: 0 0 0 2px; font-size: 15px; color: #444; }

.mod-info 			{ font-size: 13px; margin-left: 0; list-style: none; }
.mod-info li 		{ line-height: 21px; }
.mod-info li 		{ max-width: 500px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mod-info span 		{ color: #999; font-size: 11px; margin-left: 4px; }
.mod-info a 		{ font-size: 12px; color: #999; }
.mod-info a:hover 	{ color: #4078c0; }

.mod-details 			{ display: flex; justify-content: space-between; align-items: flex-end; margin-top: 20px; }
.mod-details .approval 	{ margin: 0 auto 15px; }

.mod-details .download 		{ color: #fff; background-color: #428bca; border-color: #357ebd; }
.mod-details .download 		{ display: inline-block; margin: 0; cursor: pointer; white-space: nowrap; padding: 0 32px; border-radius: 4px; line-height: 40px; height: 40px; }
.mod-details .download:hover 	{ background-color: #337ab7; text-decoration: none; }
.mod-details .download:active 	{ box-shadow: inset 2px 3px 12px rgba(0,0,0,.3); outline: none; }
.mod-details .download span 	{ opacity: .75; font-size: 13px; margin-left: 12px; }

.mod-title .donate 		{ display: inline-block; text-align: center; margin-left: 12px; opacity: 0.7; }
.mod-title .donate.inactive { opacity: 0.5; }
.mod-title .donate.inactive a { background: #e6e6e6; }
.mod-title .donate:hover { opacity: 1; }
.mod-title .donate a 	{ position: relative; display: inline-block; padding: 0 8px 0 24px; font-size: 11px; line-height: 24px; }
.mod-title .donate a 	{ background: #ffca28; border: 1px solid rgba(0,0,0,0.3); border-radius: 4px; color: #000; }
.mod-title .donate img 	{ position: absolute; left: 4px; top: 3px; height: 18px; }

.mod-details .install-help 		{ width: 174px; text-align: center; margin: 4px 0 0; padding: 0; display: none; }
.mod-details .install-help a 		{ font-size: 12px; color: #149f5b; border-bottom: 1px dotted #149f5b; }
.mod-details .install-help a:hover 	{ border-style: solid; text-decoration: none; }

.tab-description 				{ word-break: break-word; }
.tab-description img 			{ max-width: 100%; }
.tab-description p:last-child 	{ padding-bottom: 0; }
.tab-description span.bold 		{ font-weight: 700; }
.tab-description span.italic 	{ font-weight: 300; font-style: italic; }
.tab-description pre 			{ border: 1px solid #bbb; }

.tab-changelog h2 			{ margin: 0 0 12px; }
.tab-changelog h2 span 		{ font-size: 12px; color: #888; margin-left: 12px; }
.tab-changelog .download 	{ float: right; font-size: 12px; }
.tab-changelog pre 			{ border: 1px solid #bbb; }

.tab-information 			{ font-size: 14px; line-height: 2; }
.tab-information dt 		{ font-weight: bold; float: left; width: 110px; }
.tab-information dd 		{ margin: 0; }

.tab-comments 				{ margin-bottom: 1px; }
.tab-comments .add-comment  { margin-top: 66px; }

/* -- */

.approval 			{ position: relative; width: 125px; text-align: center; font-size: 12px; color: #aaa; height: 30px; }
.approval.static 	{ width: auto; height: 2px; margin-top: 12px; }

.approval .button 		{ display: inline-block; width: 16px; height: 16px; opacity: 0.2; }
.approval .button:hover 	{ opacity: 0.8; }
.approval .button-like 		{ background: url(/images/rating/like.png); float: left; }
.approval .button-dislike 	{ background: url(/images/rating/dislike.png); float: right; margin-top: 3px; }

.approval .like 		{ position: absolute; background: #5cb85c; height: 2px; box-shadow: inset 0 -1px 0 rgba(0,0,0,.15); bottom: 0; left: 0; border-right: 1px solid #fff; }
.approval .dislike 		{ position: absolute; background: #d9534f; height: 2px; box-shadow: inset 0 -1px 0 rgba(0,0,0,.15); bottom: 0; left: 0; right: 0; }

.approval.static .like 	{ bottom: auto; top: 0; }
.approval.static .dislike 	{ bottom: auto; top: 0; }

.approval.approved .button-like 	{ opacity: .6; }
.approval.approved .button-dislike 	{ opacity: .05; }
.approval.disapproved .button-like 	{ opacity: .05; }
.approval.disapproved .button-dislike 	{ opacity: .6; }

.mods-list .list .mod:last-child { border-bottom: 1px solid #e2e2e2; } /* cheeky override */
.mods-list .load-mods 		{ border-top: 1px solid #f6f6f6; text-align: center; line-height: 60px; height: 60px; }
.mods-list .load-mods a 	{ display: block; }
.mods-list .load-mods.fin 	{ background: url(/images/fin.png) no-repeat center center; opacity: 0.8; }
.mods-list .load-mods.fin a 	{ display: none; }

.mod-upload-button 		{ float: right; }

/* Comments */

#comments-tab 							{  }
#comments-tab p 						{ margin: 0 0 15px; font-size: 15px; }
#comments-tab p:last-child 				{ margin-bottom: 0; }
#comments-tab .add-comment 				{ margin-top: 36px; }
#comments-tab .add-comment textarea 	{ width: 100%; height: 160px; padding: 6px 12px; color: #555; background-color: #fff; border: 1px solid #949494; border-radius: 4px; box-shadow: inset 0 0 6px rgba(0,0,0,.1); }

#comments-tab .add-comment.sub 			{ margin: 24px 0 0 32px; display: none; }
#comments-tab .add-comment.sub textarea { height: 88px; }

#comments-tab .comment 					{ position: relative; border-bottom: 1px solid #949494; padding: 0 0 24px 36px; margin-bottom: 24px; }
#comments-tab .comment > .content 		{ padding: 12px 16px; background-color: #f8f8f8; border-radius: 3px; }
#comments-tab .comment > .reply 		{ font-size: 14px; /* padding-top: 4px; margin-top: 8px; border-top: 1px dotted #aaa; */ }
#comments-tab .comment > .reply p 		{ padding: 0 0 8px; }
#comments-tab .comment > .reply .right 		{ float: right; }
#comments-tab .comment:last-child		{ border-bottom: none; }

#comments-tab .subcomment 			{ position: relative; padding-left: 32px; margin-top: 12px; }
#comments-tab .subcomment > .content 		{ padding: 6px 12px; background-color: #f8f8f8; border-radius: 3px; }

#comments-tab .comment .author 			{ font-size: 11px; margin-top: 8px; color: #888; }
#comments-tab .comment .author .name 		{ color: #404040; }
#comments-tab .comment .author .spacer 		{ margin: 0 8px; color: #ccc; }
#comments-tab .comment .author a 		{ color: #888; }
#comments-tab .comment .author .links 		{ opacity: 0; transition: opacity 0.2s ease-in-out; }
#comments-tab .comment .author .actions 	{ float: right; margin-top: -8px; }
#comments-tab .comment:hover .author .links 	{ opacity: 1; }

#comments-tab .comment .content p:last-child 	{ padding-bottom: 0; }
#comments-tab .comment .content .bold 		{ font-weight: 700; }
#comments-tab .comment .content .italic 	{ font-weight: 300; font-style: italic; }
#comments-tab .comment .content pre 		{ background: #eee; border: 1px solid #ccc; border-radius: 3px; box-shadow: inset 0 0 18px rgba(0,0,0,.08); padding: 10px; margin-bottom: 12px; }
#comments-tab .comment .content pre 		{ font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif; }
#comments-tab .comment .content.unseen 		{ border-left: 3px solid #c53928; }

#comments-tab .comment.spammy			{ opacity: 0.9; }
#comments-tab .comment.spammy:before		{ content: 'Detected as spam, pending review'; display: block; margin-bottom: 8px; }
#comments-tab .comment.spammy .content		{ opacity: 0.5; }
#comments-tab .comment.spammy .rating		{ display: none; }

#comments-tab.list .comment 			{ padding: 0; margin-bottom: 24px; border-bottom: none; }
#comments-tab.list .comment .author 		{ margin-left: 2px; }

#comment-edit .page-links 		{ display: none; }
#comment-edit .links 			{ margin-left: 24px; }

#comments-tab .comment > .content 	{background-color: #e6e6e6;word-wrap: break-word;}
#comments-tab .subcomment > .content 	{ background-color: #e6e6e6; }


/* Extra */

blockquote 		{ margin: 2px 0 12px; background: #f0f0f0; border: 1px solid #ccc; padding: 6px 12px 12px; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,.1); }
blockquote b 		{ display: block; position: relative; padding-left: 20px; margin-bottom: 10px; border-bottom: 1px solid #ccc; padding-bottom: 4px; font-size: 12px; }
blockquote b:before 	{ content: '“'; position: absolute; font-size: 45px; top: -12px; left: -2px; font-family: helvetica; color: #2884c6; }

#formatting 			{ display: none; background: #f1f1f1; padding: 16px; border-radius: 3px; }

.formatting 			{ font-size: 14px; margin: 18px 0 0; width: 100%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.1); border-radius: 3px; }
.formatting th 			{ padding: 4px 6px; text-align: left; font-weight: bold; }
.formatting td 			{ padding: 6px; border-top: 1px solid #c0c0c0; }
.formatting td.code 		{ font-family: monospace; }
.formatting td.note 		{ font-size: 12px; color: #808080; }
.formatting h2 			{ margin: 4px 0; }

pre 			{ background: #eee; border-radius: 4px; box-shadow: inset 0 0 18px rgba(0,0,0,.08); padding: 10px 14px; margin-bottom: 12px; white-space: pre-wrap; }
pre 			{ font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif; font-size: 12px; }