﻿.react-medium .darkThemeContent.grid {
	padding: 0;
}


.darkThemeContent {
	
}

	.darkThemeContent a {
		color: rgb(242, 193, 97);
		text-decoration: none;
	}

		.darkThemeContent a:hover {
			color: #fff;
		}

	.darkThemeContent p {
		color: rgba(255, 255, 255, 0.5);
		font-weight: 200;
		line-height: 22px;
		margin: 0;
		padding: 0;
		text-align: left;
	}



.characterBar .select_styled {
	display: none;
}

.react-mobile .characterBar a {
	display: none;
}



.fullWidthHeader{
	background:center center no-repeat;
	background-image: url("/img/theme/destiny/headers/forum_core_header.jpg");
	background-size:cover;
	width:100%;
	height:225px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction:column;
	position:relative;
}
	.fullWidthHeader h1{
		color: #fff;
		text-shadow: 0 1px 0 rgba(0, 0, 0, 0.55);
		text-transform: none;
		font-size: 55px;
		font-size: 3.4vw;
		letter-spacing: 25px;
		position:relative;
		text-align:center;
		text-transform:uppercase;
	}

	.react-mobile .darkThemeContent.fullWidthHeader h1 {

		font-size: 30px;
		letter-spacing: 7px;
		
	}

	.fullWidthHeader p {
		color: rgba(255, 255, 255, 0.95);
		text-shadow: 0 1px 0 rgba(0, 0, 0, 0.55);
		text-align:center;
		letter-spacing: 1px;
		font-weight: 200;
		position:relative;
	}

	.react-mobile .darkThemeContent.fullWidthHeader p {
		font-size: 14px;

	}
	
.react-large .fullWidthHeader {

	height: 150px;
}


.react-large .fullWidthHeader:before {
	background-color: rgba(11, 13, 16, 0.15); 
	content : "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 150px;
}




.react-mobile .fullWidthHeader {
	height: 125px;
}
	.react-mobile .Sub_Nav ~ #content .fullWidthHeader {
		margin-top:50px;
	}

.react-mobile .fullWidthHeader:before {
	background-color: rgba(11, 13, 16, 0.4); 
	content : "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 125px;

}





.containerMain {
	align-items: flex-start;
	display: flex;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	flex-direction: row;
	margin: 0 auto;
	padding: 0 0 15px;
}

.react-medium .containerMain {
	align-items: stretch;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	padding: 0 0 15px;
}

.react-mobile .containerMain {
	align-items: stretch;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	padding: 0 0 15px;
}


.containerMain p {
	color: rgba(255, 255, 255, 0.7);
	font-weight: 200;
	line-height: 22px;
   
}


.containerSideNav {
	-ms-flex: 1 1 auto;
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	-ms-flex-flow: column wrap;
	-webkit-flex-flow: column wrap;
	flex-flow: column wrap;
	margin-top: 13px;
	min-width: 300px;
}
	.grid .containerSideNav.grid-col-3{
		margin-top:13px;
	}



.react-medium .containerSideNav {
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	margin: 0;
	max-height: 54px;
	position: relative;
	width: 100%;
}

	.react-medium .containerSideNav .sideNav {
		background: rgb(30, 36, 43) none repeat scroll 0 0;
	}

	


.react-mobile .containerSideNav {
	max-height: none;
	padding-left: 0;
}

.containerSideNav > a {
	display: block;
	width: 100%;
}


.react-mobile .containerSideNav .sideNav {
	background: rgba(30, 36, 43, 0) none repeat scroll 0 0;
	display: none;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	position: relative;
	margin-bottom: 0;
	margin-top: 3px;
	padding-left: 0;
	width: 100%;
	z-index: 0;
}

.react-mobile .containerSideNav .sideNav.open {
	display: block;
}

.react-mobile .trigger_containerSideNav {
	display: block;
}



.trigger_containerSideNav {
	background: #2A333E none repeat scroll 0 0;
	color: #fff;
	cursor: pointer;
	display: none;
	font-size: 18px;
	font-weight: 200;
	height: 40px;
	line-height: 40px;
	margin: 0;
	padding: 0;
	text-align: center;
	width: 100%;
}

	.trigger_containerSideNav span {
		color: #fff;
		font-size: 36px;
		margin-right: 10px;
		vertical-align: sub;
	}



.navItem {
	align-items: center;
	background: #14191E;
	-ms-flex: 1 1 auto;
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	font-size: 16px;
	font-weight: 200;
	height: 45px;
	margin-bottom: 2px;
   
}

.react-large .navItem {
	height: 44px;
}

.react-medium .navItem {
	background: rgba(245, 245, 245, 0) none repeat scroll 0 0;
	box-shadow: none;
	display: inline-block;
	font-size: 14px;
	justify-content: center;
	margin-bottom: 0;
}

.react-mobile .navItem {
	display: block;
	justify-content: center;
	align-items: center;
	background: rgba(30, 36, 43, 0.5) none repeat scroll 0 0;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	font-size: 17px;
	height: 54px;
	margin-bottom: 3px;
	max-width: none;
}

.navItem.on {
	background: #191e24;
	color: rgba(245, 245, 245, 0.05);
}

.navItem.on > a span.fa-square {
	color: #fff !important;
}

.navItem.on.opened > a span.fa-square {
	color: #fff !important;
}

.navItem.opened{
	height:auto;
	padding-bottom: 5px;
}

.react-medium .navItem.on {
	background: rgba(245, 245, 245, 0) none repeat scroll 0 0;
	box-shadow: 0 -3px 0 0 rgba(206, 174, 50, 1) inset;
	color: rgba(245, 245, 245, 0);
}

.react-mobile .navItem.on {
	background: rgba(245, 245, 245, 0) none repeat scroll 0 0;
	color: rgba(245, 245, 245, 0);
}

.react-mobile .navItem:last-child {
	margin-bottom: 0;
}


.navItem a {
	color: #fff;
	display: block;
	padding: 12px 20px;
	text-decoration: none;
}

.react-large .navItem a {
	padding: 9px 20px;
}

.react-medium .navItem a {
	padding: 16px 20px;
}

.navItem:hover {
	background: #191e24;
}


.navItem .expandIcon{
	float:right;
	color: #4F545A;
	margin-top: -12px;
	margin-right: -15px;
	padding: 15px;

}
	.navItem .expandIcon:before{
		content: "";
	}
	.navItem.opened .expandIcon:before{
		content: "";
	}




.navItem .collapsible{
	display:none;
}
	.navItem.opened .collapsible{
		display:block;
	}

	.navItem .collapsible a {
		padding-left: 20px;
		padding-top: 0px;
		font-weight: 200;
		font-size: 16px;
		color: rgba(255, 255, 255, 0.45);
	}

	.navItem .collapsible a.on {
		color: white;
	}

   
	

















.containerContent {
	-ms-flex: 3 1 auto;
	-webkit-flex: 3 1 auto;
	flex: 3 1 auto;
	-ms-flex-flow: row wrap;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
}

.react-mobile .containerContent {
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	margin: 0;
	width: 100%;
}

.containerContent * {
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}




.flexBox {
	display: flex;
	margin-top: 13px;
}

.flexBox_columns {
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
}

.flexBox .sectionHeader {
	align-self: flex-start;
}



.flexBox_bg {
	background: rgba(30, 36, 43, 0.6) none repeat scroll 0 0;
	padding: 15px;
}




.flexBox_full {
	-ms-flex: 1 0 90%;
	-webkit-flex: 1 0 90%;
	flex: 1 0 90%;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: space-between;
}

	.flexBox_full .sectionHeader {
		border-bottom: 2px solid rgba(245, 245, 245, 0.12);
		padding-bottom: 11px;
	}

.react-mobile .flexBox_full {
	margin-left: 0;
}



.flexBox_half {
	-ms-flex: 1 0 50%;
	-webkit-flex: 1 0 50%;
	flex: 1 0 50%;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	max-width: 49.5%;
}

.react-mobile .flexBox_half {
	-ms-flex: 1 1 100%;
	-webkit-flex: 1 1 100%;
	flex: 1 1 100%;
	margin-left: 0;
	max-width: none;
}


.content_flexBox_half {
	-ms-align-content: flex-start;
	-webkit-align-content: flex-start;
	align-content: flex-start;
	display: flex;
	-ms-flex: 1 1 auto;
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	justify-content: space-between;
	margin-top: 14px;
}

.sectionHeader + .content_flexBox_half {
	margin-top: 0;
}



.fixedSidebar {
}

	.fixedSidebar .containerSideNav .sideNav {
		left: auto;
		position: fixed;
		top: 60px;
		width: 100%;
		z-index: 1;
	}

.scroll-hidden .fixedSidebar .containerSideNav .sideNav {
	top: 0;
}

.react-medium .fixedSidebar .containerSideNav .sideNav {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
}

.react-mobile .containerSideNav .sideNav {
	position: static;
}





.containerTags {
	color: rgba(255, 255, 255, 0.8);
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	font-style: normal;
	margin-top: 5px;
}

.containerTags:empty {
	margin-top: 0px;
}

	.containerTags .tag {
		background: rgba(205, 220, 255, 0.04) none repeat scroll 0 0;
		color: rgba(255, 255, 255, 0.5);
	}

	.containerTags.large .tag {
		font-size: 14px;
		margin: 7px 5px 0 0;
		padding: 5px 10px;
	}

	.containerTags.small .tag {
		font-size: 11px;
		font-weight: 200;
		margin: 6px 0px 0px 0px;
		padding: 2px 5px 2px 5px;
		opacity: 0.85;
		text-transform: lowercase;
	}

/*.containerTags.small .officialTag.tag, .containerTags.small .subTag.tag {
		background: rgba(205, 220, 255, 0.2) none repeat scroll 0 0;
		color: #DEDEDE;
	}*/
	
	

	.containerTags.small .tag:hover {
		opacity: 1.0;
	}











.container_textbox_dark {
	border-bottom: 1px rgb(69, 75, 82) solid;
	-ms-flex: 1 1 100%;
	-webkit-flex: 1 1 100%;
	flex: 1 1 100%;
	margin-bottom: 4px;
	padding: 10px 10px 10px 0;
	position: relative;
	

}

	.container_textbox_dark input {
		background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
		border: 0 none;
		color: #fff;
		display: block;
		outline: 0 none;
		width: 100%;
		font-size: 16px;
	}

	.container_textbox_dark .bar {
		background: rgba(206, 174, 50, 1) none repeat scroll 0 0;
		bottom: 0;
		content: "";
		display: block;
		height: 2px;
		left: 0;
		position: absolute;
		-moz-transition: all 0.6s ease 0s;
		-o-transition: all 0.6s ease 0s;
		-webkit-transition: all 0.6s ease 0s;
		transition: all 0.6s ease 0s;
	}

	.container_textbox_dark input:empty ~ .bar {
		width: 0;
	}

	.container_textbox_dark input:hover ~ .bar,
	.container_textbox_dark input:focus ~ .bar {
		width: 100%;
	}





.containerSearchBox {
	color: #fff;
}

	.containerSearchBox input {
		color: #fff;
		font-size: 18px;
	}

	.containerSearchBox .trigger_advancedSearch {
		color: rgb(242, 193, 97);
		cursor: pointer;
		font-size: 12px;
		margin-top: 7px;
	}

	.containerSearchBox .advancedSearchOptions {
		display: none;
		width:100%;
	}

		.containerSearchBox .advancedSearchOptions.open {
			display: block;
		}


		.containerSearchBox .advancedSearchOptions .sortBox {
			padding: 15px 0;
		}

.react-mobile .containerSearchBox .advancedSearchOptions .sortBox {
	display: block;
}

.containerSearchBox .select_styled {
	margin-right: 20px;
}



.react-mobile .containerSearchBox .select_styled {
	margin: 0 0 4px;
	width: 100%;
}

	.react-mobile .containerSearchBox .select_styled select {
		font-size: 15px;
		height: 45px;
		padding-left: 5px;
		width: 100%;
	}


.darkThemeContent .sortBox {
	align-items: center;
	display: flex;
	-ms-flex: 1 1 auto;
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	justify-content: flex-start;
}

	.darkThemeContent .sortBox .on {
		color: #797F88;
	}



.react-mobile .darkThemeContent .sortBox {
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	flex-direction: column;
	display: none;
	order: 2;
}

	.react-mobile .darkThemeContent .sortBox.open {
		display: block;
	}


.darkThemeContent .select_styled {
	display: inline-block;
	position: relative;
}

	.darkThemeContent .select_styled.disabled {
		opacity: .3;
	}

.react-medium .darkThemeContent .select_styled {
	margin: 0 0 4px;
	width: 100%;
}

.darkThemeContent .select_styled:after {
	color: rgba(245, 245, 245, 1);
	content: "";
	font-family: FontAwesome;
	position: absolute;
	pointer-events: none;
	right: 14px;
	top: 5px;
}

.darkThemeContent .select_styled select {
	-moz-appearance: none;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	background: rgba(30, 36, 43, 0.6) none repeat scroll 0 0;
	border: 1px solid rgba(97, 119, 147, 0.3);
	color: #f5f5f5;
	font-size: 12px;
	outline: medium none;
	padding: 5px 35px 5px 5px;
	margin-bottom: 3px;

}
	.darkThemeContent .select_styled .highlight{
		border: 1px solid #fff;
	}
	.darkThemeContent .select_styled select::-ms-expand{
		display:none;
	}

.react-medium .select_styled select {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 15px;
	height: 45px;
	padding-left: 5px;
	width: 100%;
}

.react-medium .select_styled option {
	font-size: 12px;
}




.Sub_Nav .select_styled {
}

	.react-medium .Sub_Nav .darkThemeContent .select_styled::after {
		top: 19px;
		right:22px;
	}

	.react-medium .Sub_Nav .select_styled select {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		font-size: 15px;
		height:50px;
		line-height:50px;
		padding-left: 15px;
		width: 100%;
	}

	.react-medium .Sub_Nav .select_styled option {
		font-size: 12px;
	}






/* control bar */
.controlBar {
	-ms-flex-flow: row nowrap;
	-webkit-flex-flow: row nowrap;
	flex-flow: row nowrap;
	padding: 0;
	height: 45px;
}

	.react-large .controlBar {
		height: auto;
	}

	.react-medium .controlBar {
		-ms-flex-direction: column;
		-webkit-flex-direction: column;
		flex-direction: column;
		margin: 3px 0 0;
	}

		.react-medium .controlBar .nonMobile {
			display: none;
		}

	.controlBar .mobileSort {
		display: none;
	}

		.react-medium .controlBar .mobileSort {
			display: block;
		}

	.controlBar .mobileFilter {
		display: none;
	}

		.react-medium .controlBar .mobileFilter {
			display: block;
		}


	.controlBar .controlBarItem {
		margin-left: 24px;
		color: #fff;
		text-align:center;
	}
		.controlBar .select_styled:after {
			top: 0;
			line-height: 27px;
		}
			.react-medium .controlBar .select_styled:after {
				line-height: 45px;
			}

		.controlBar .controlBarItem:first-child {
			margin-left: 0;
		}


	.controlBar .sortBox {
		padding: 15px 25px 15px 17px;
	}

	.react-medium .controlBar .sortBox {
		padding: 15px 15px 15px 15px;
	}





	.controlBar .creationBox {
		align-items: center;
		display: flex;
		justify-content: flex-start;
	}

		.react-medium .controlBar .creationBox {
			-ms-align-content: center;
			-webkit-align-content: center;
			align-content: center;
			align-items: center;
			justify-content: center;
			margin-left: 0;
			order: 1;
		}

	.controlBar .controlBarButton{
		margin:10px;
	}

		.react-medium .controlBar .controlBarButton {
			margin: 0;
			padding: 6px;
			text-align: center;
			width: 50%;
		}


		.react-medium .controlBar .controlBarButton:hover
		{
			background:rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
			color: #000;
		}


















/* pager */
.pager_prevnext {
	align-items: center;
	clear: both;
	display: flex;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	flex-direction: row;
	justify-content: center;
	margin: 20px 0;
	padding: 0;
	width: 100%;
}

	.pager_prevnext a {
		margin: 0 10px;
	}

	.pager_prevnext .btn_arrow {
		font-size: 18px;
	}

	.pager_prevnext a.disabled,
	.pager_prevnext a.on {
		cursor: default;
		color: rgb(95, 106, 119);
	}


/* gray button */


.btn_standard {
   
	display: inline-block;
	padding: 0px 15px 0px 0px;
	font-size: 17px;
   font-weight: 400;
}

	.btn_standard:hover,
	.btn_standard:active {
	   color: #000;
	   cursor: pointer;
	}

.darkThemeContent .btn_standard {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	border: 0 none;
	color: rgb(242, 193, 97);
}

.darkThemeContent .btn_standard:hover {
	color: #fff;
	

}

.btn_standard + .btn_standard {
	margin-left: 10px;
}

.darkThemeContent .btn_cancel {
	color: #797F88;
	

}

.darkThemeContent .btn_cancel:hover {
	color: #fff;
}

.darkThemeContent .container_buttons {
	margin-bottom: 8px;
	margin-top: 25px;

}


/* generic toggle checkbox */
.container_checkboxToggle {
	border: 1px solid #a0a0a0;
	border-radius: 2px;
	display: inline-block;
	overflow: hidden;
}

	.container_checkboxToggle input {
		left: -9999px;
		position: absolute;
	}

	.container_checkboxToggle label {
		font-size: 14px;
		font-weight: 500;
	}

	.container_checkboxToggle span {
		background: #fff none repeat scroll 0 0;
		color: #000;
		float: left;
		line-height: 40px;
		padding: 0 17px;
	}

	.container_checkboxToggle label span.off,
	.container_checkboxToggle input:checked + label span.on {
		background: rgb(242, 193, 97) none repeat scroll 0 0;
		color: #000;
	}

	.container_checkboxToggle input:checked + label span.off {
		background: #fff none repeat scroll 0 0;
		color: #000;
	}


/* checkboxes and radios */
.darkThemeContent .container_checkbox {
	position:relative;
	overflow:hidden;
}

	.darkThemeContent .container_checkbox label {
		color: rgba(255, 255, 255, 0.7);
		display: inline-block;
		font-size: 15px;
		line-height: 42px;
		padding-left: 30px;
		position: relative;
		vertical-align: unset;
	}

		.darkThemeContent .container_checkbox label:before {
			content: "";
			font-family: 'FontAwesome';
			font-size: 18px;
			position: absolute;
			left: 0;
		}

	.darkThemeContent .container_checkbox input {
		position:absolute;
		left:-9999px;
	}

		.darkThemeContent .container_checkbox input:checked + label:before {
			content: "";
			font-family: 'FontAwesome';
		}


.darkThemeContent .container_radios {
}

	.darkThemeContent .container_radios h3 {
		color: rgba(255, 255, 255, 0.8);
		display: block;
		font-size: 18px;
		padding-bottom: 4px;
	}

.darkThemeContent .container_radio {
}

	.darkThemeContent .container_radio input {
		display: none;
	}

	.darkThemeContent .container_radio label {
		color: rgba(255, 255, 255, 0.7);
		display: inline-block;
		font-size: 15px;
		line-height: 42px;
		padding-left: 30px;
		position: relative;
		vertical-align: unset;
	}

		.darkThemeContent .container_radio label:before {
			color: #fff;
			content: "";
			font-family: 'FontAwesome';
			font-size: 21px;
			position: absolute;
			left: 0;
		}

	.darkThemeContent .container_radio input:checked + label:before {
		content: "\f058";
		font-family: 'FontAwesome';
	}


