/*
* CSS for ValianceOnline template
* Created By: Jonathan Williams
* On: 23 - 10 - 2015
*/
.CornerTicks::before {
  content: "";
  display: block;
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background-position: left top, right top, left bottom, right bottom;
  background-size: 15px 15px, 15px 15px, 15px 15px, 15px 15px;
  background-image: url("../Images/CornerTL.png"), url("../Images/CornerTR.png"), url("../Images/CornerBL.png"), url("../Images/CornerBR.png");
  background-repeat: no-repeat;
}

@font-face {
  font-family: OpenSans;
  src: url("../fonts/OpenSans-Regular.ttf");
}
@font-face {
  font-family: OpenSansBold;
  src: url("../fonts/OpenSans-Bold.ttf");
}
@font-face {
  font-family: GothamBlack;
  src: url("../fonts/Gotham-Black.otf");
}
@font-face {
  font-family: GothamBook;
  src: url("../fonts/Gotham-Book.otf");
}
@font-face {
  font-family: GothamBold;
  src: url("../fonts/Gotham-Bold.otf");
}
@font-face {
  font-family: OpenSansLight;
  src: url("../fonts/OpenSans-Light.ttf");
}
@font-face {
  font-family: "Icons";
  font-style: normal;
  font-weight: normal;
  src: url("/media/jui/fonts/IcoMoon.eot?#iefix") format("embedded-opentype"), url("/media/jui/fonts/IcoMoon.woff") format("woff"), url("/media/jui/fonts/IcoMoon.ttf") format("truetype"), url("/media/jui/fonts/IcoMoon.svg#IcoMoon") format("svg");
}

body {
  background-color: black;
  font-family: OpenSans;
  color: white;
  margin: 0;
  font-size: 15px;
}
h1 {
  font-family: GothamBlack;
}
h2 {
  font-family: GothamBook;
}
input[type="text"], input[type="password"], input[type="email"] {
  font-family: OpenSansLight;
  color: white;
  background: black;
  border: 1px solid white;
  border-radius: 20px;
  padding: 10px 20px;
  font-size: 12px;
  width: 80%;
  margin: 5px 0;
}
button, .LoginInfo input[type="submit"] {
  cursor:pointer;
  font-family: GothamBlack;
  border: 1px solid white;
  border-radius: 50px;
  color: #CCC;
  padding: 5px 20px;
  font-size: 20px;
  margin-bottom: 20px;
  background-origin: content-box;
  background: #105d88;
  background: -webkit-linear-gradient(#4896c2 , #105d88);
  background: -o-linear-gradient(#4896c2, #105d88);
  background: -moz-linear-gradient(#4896c2, #105d88);
  background: linear-gradient(#4896c2, #105d88);
}
button:hover, .LoginInfo input:hover[type="submit"] {
  color: white;
  background: #2d86ab;
  background: -webkit-linear-gradient(#71b5d6 , #2d86ab);
  background: -o-linear-gradient(#71b5d6, #2d86ab);
  background: -moz-linear-gradient(#71b5d6, #2d86ab);
  background: linear-gradient(#71b5d6, #2d86ab);
}

.Header {
  background: black;
  border-bottom: 2px #D40000 solid;
  height: 34px;
  width: 100%;
  padding-top: 10px;
  position: relative;
  z-index: 1000;
}

.Hidden {
  visibility: hidden;
}

.ModalOverlayBG {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.8);
  z-index: 900;
  -webkit-transiton: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  -ms-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  -transition: opacity 0.5s;
}

#login-form {
  margin: 0;
}
.LoginBox, #sbox-window.shadow {
  font-size: 12px;
  font-family: OpenSansLight;
  color: #38B;
  background: transparent url("../Images/SignIn/Background.jpg") no-repeat 0 0 / 100% 100%;
  border: 2px #555 solid;
  border-bottom-color: #333;
  border-right-color: #333;
  text-align: center;
  -webkit-box-shadow: 5px 5px 5px black;
  -moz-box-shadow: 5px 5px 5px black;
  box-shadow: 5px 5px 5px black;
  border-radius: 0;
  padding-top: 30px;
}
.LoginBox {
  position: fixed;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 20px 20px;
  min-width: 200px;
  max-width: 400px;
  height: 300px;
  z-index: 1000;
}
.LoginBox a {
  text-decoration: none;
  font-family: OpenSansLight !important;
  color: #38B !important;
}
.LoginBox a:hover {
  color: #49C;
}
.LoginBox h1 {
  color: white;
  margin: 20px 0px !important;
  border-bottom: 2px #555 solid;
}
.LoginBox button {
  font-size: 20px;
  margin-bottom: 20px;
  padding: 5px 50px;
}
.LoginBox input[type="checkbox"] {
  display: none;
}
.LoginBox input[type="checkbox"] + label {
  text-align: left;
  cursor: pointer;
  font-size: 15px;
  color: #CCC;
}
.LoginBox input[type="checkbox"] + label:hover, .LoginBox input[type="checkbox"]:checked + label {
  color: #FFF;
}
.LoginBox input[type="checkbox"] + label:before {
  cursor: pointer;
  content: "";
  display: inline-block;
  font-size: 15px;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 15px;
  margin: 10px;
  position: relative;
  background-color: black;
  border: 2px #888 solid;
  border-bottom-color: white;
  border-right-color: white;
  vertical-align: middle;
}
.LoginBox input[type="checkbox"]:checked + label:before {
  content: "\2713";
  color: white;
}
#form-login-remember {
  text-align: left;
  padding-left: 20px;
}

.LoginClose, #sbox-btn-close {
  cursor:pointer;
  position: relative;
  background: transparent url("../Images/SignIn/Button_Close_X.png") no-repeat 0 0 / 100% 100%;
  float: right;
  right: -15px;
  top: -35px;
  width: 26px;
  height: 26px;
  border: none;
}
#sbox-btn-close {
  position: absolute;
  top: 3px;
  right:3px;
}
.LoginClose:hover, #sbox-btn-close:hover {
  background-image: url("../Images/SignIn/Button_Close_Over_X.png");
}

.LoginText {
  position: relative;
  float: right;
  right: 0;
  font-family: OpenSansLight;
  font-size: 12px;
  color: #CCC;
  text-decoration: none;
}
.LoginText a {
  cursor:pointer;
  font-family: OpenSansLight;
  font-size: 12px;
  color: #CCC;
  text-decoration: none;
}
.LoginText a:hover {
  color: white;
}
.LoginText button, .LoginText input[type="button"], .LoginText input[type="submit"] {
  font-family: GothamBook;
  font-size: 13px;
  background: none;
  border: 1px white solid;
  border-radius: 20px;
  padding: 0 5px;
  text-decoration: none;
  color: white;
  margin: 0 20px;
  display: inline-block;
}
.LoginText button:hover, .LoginText input[type="button"]:hover, .LoginText input[type="submit"]:hover {
  background: rgba(255,255,255,0.25);
  color: white;
}

.LoginInfo {
  position: relative;
  float: right;
  right: 0;
  font-family: OpenSansLight;
  font-size: 12px;
  color: #CCC;
  text-decoration: none;
  height: 30px;
}
.LoginInfo input[type="submit"] {
  cursor: pointer;
  font-family: GothamBlack;
  padding: 5px 8px;
  font-size: 12px;
  margin-bottom: 20px;
}
.LoginInfo input[type="submit"]:hover {
  color: white;
}

.content .reset, .content .remind {
  font-family: OpenSans;
  font-size: 15px;
  margin: auto;
  max-width: 500px;
  background: black;
  padding-bottom: 45px;
}
.content .reset button, .content .remind  button {
  position: absolute;
  left: 0;
  right: 0;
  margin:auto;
}
.content fieldset {	
  border: none;
  padding: 0;
}
.content {
  position: relative;
  top: 0;
  left: 0;
  min-height: 800px;
}
.content a {
  text-decoration: none;
  font-family: OpenSansLight;
  color: #38B;
}
.content a:hover {
  color: #49C;
}
.contentheading {
  width: 1340px;
  margin: auto;
  background: black;
  text-align: center;
  font-size: 25px;
  height: 500px;
  padding-top: 200px;
}

.tooltip {
  background: black !important;
  color: white !important;
}

.MenuContainer {
  position:relative;
  height: 84px;
  background: rgba(0,0,0,0.85);
  color: white;
  width: 100%;
  margin: auto;
  float: right;
  z-index: 10;
}
.MenuContainer .custom p {
  margin: 0;
}

.Logo {
    cursor: pointer;
    background: transparent url("../Images/valiance_logo_small.png") no-repeat scroll 0px 0px / contain;
    position: absolute;
    left: 0px;
    top: 17px;
    width: 330px;
    height: 90px;
}

.Menu ul {
  text-align: left;
  display: inline;
  margin: 0;
  padding: 8px 4px 7px;
  list-style: none;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  text-transform: uppercase;
}
.Menu ul li a {
  font-family: GothamBook;
  text-decoration: none;
  color: inherit;
  display: block;
}
.Menu ul li {
  font-family: GothamBook;
  color: #888;
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 5px 20px 5px 12px;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
.Menu ul li > .nav-header {
  font-family: GothamBook;
  color: #888;
  padding: 0 8px, 0, 0;
  font-size: 20px;
  font-weight: normal;
  line-height: 1;
  text-shadow: none;
  padding: 0;
  display: initial;
}
.Menu ul li:hover > span {
  color: #fff;
}
.Menu ul li:hover, .Menu ul li.current {
  color: #fff;
}
.Menu ul li ul {
  padding: 0;
  position: absolute;
  top: 30px;
  left: 5px;
  z-index: 100;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  -ms-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  -transition: opacity 0.5s;
  text-transform: none;
}
.Menu ul li ul li {
  background: transparent;
  display: block; 
  color: #CCC;
  text-shadow: 0 -1px 0 #000;
  white-space: nowrap;
  font-size: 14px;
  padding: 5px;
}
.Menu ul li ul li:hover {
  color: white;
  background-origin: content-box;
  background: #888;
  background: -webkit-linear-gradient(left, rgba(255,255,255,0.53), rgba(255,255,255,0.53), rgba(255,255,255,0));
  background: -o-linear-gradient(right, rgba(255,255,255,0.53), rgba(255,255,255,0.53), rgba(255,255,255,0));
  background: -moz-linear-gradient(right, rgba(255,255,255,0.53), rgba(255,255,255,0.53), rgba(255,255,255,0));
  background: linear-gradient(to right, rgba(255,255,255,0.53), rgba(255,255,255,0.53), rgba(255,255,255,0));
}
.Menu ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

.MenuBackground {
  float: left;
}
.MainMenu .MenuBackground {
  position: absolute;
  top: 32px;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.85);
}
.MainMenu ul li ul {
  padding: 0 0 5px;
}

.Menu ul > .SubMenuContainer {
  border-left: 2px solid #888;
  position:relative;
  margin: 0 10px 0;
  padding-top: 31px;
  z-index: 1000;
}
.NetworkMenu ul > .SubMenuContainer {
  top: -5px;
  padding-top: 15px;
}

.nav > li > a:hover {
  background-color: transparent;
}

.MainMenu {
  position:relative;
  font-size: 20px;
  right: 0;
  top: 22px;
  float: right;
}

.NetworkMenu {
  display: inline-block;
  position: relative;
  left: 0;
}
.NetworkMenu > ul:before {
  content: "";
  background: transparent url("../Images/NetworkMenuLogo.png") no-repeat 0 0 / 100% 100%;
  width: 116px;
  height: 26px;
  float: left;
}
.NetworkMenu > ul li.parent{
  background: transparent url("../Images/NetworkMenu-DownArrow.png") no-repeat 100% 50%;
  padding: 0 20px 0 5px;
  top: 2px;
}
.NetworkMenu > ul li.parent:hover {
  background: transparent url("../Images/NetworkMenu-DownArrow.png") no-repeat 100% 90%;
  padding-bottom: 5px;
}
.NetworkMenu > ul li.parent > span {
  padding-left: 5px;
}
.NetworkMenu > ul li.parent:hover > span {
  padding-bottom: 15px;
}
.NetworkMenu ul li ul {
  background: black;
  border: 2px #D40000 solid;
  border-top: none;
  left: -2px;
  top: 31px;
}
.NetworkMenu ul li > .nav-header {
  font-size: 12px;
}

.MainMenu .item-101 {
  display: none !important;
}
.MainMenu li.item-139 {
  color: transparent;
  width: 180px;
  height: 52px;
  background: url("../Images/Donate/Button_DonateNow_Small.png") no-repeat center / contain;
  padding: 0;
  margin: 0;
  position: relative;
  top: -13px;
}
.MainMenu li.item-139 > span, .MainMenu li.item-139 > a {
  color: transparent;
  width: 180px;
  height: 52px;
  display: block;
}
.MainMenu li.item-139:hover {
  color: transparent;
  background-image: url("../Images/Donate/Button_DonateNow_Small_Rollover.png");
}
.MainMenu li.item-139:hover > span, .MainMenu li.item-139:hover > a {
  color: transparent;
}

.BreadcrumbBG {
  background: rgba(0,0,0,0.5);
  position: absolute;
  top: 375px;
  width: 100%;
}
.Breadcrumb {
  width: 1340px;
  margin: auto;
  position: relative;
  top: 0;
  text-transform: capitalize;
}
.breadcrumb a {
  color: #CCC;
  text-decoration: none;
  font-family: OpenSans;
}
.breadcrumb a:hover, .breadcrumb .active {
  color: white;
}
.breadcrumb {
  position: absolute;
  top: -150px;
  font-family: OpenSans;
  font-size: 14px;
  color: #CCC;
  text-shadow: 2px 2px 3px black;
  text-align: left;
  height: 25px;
  width: 1340px;
  margin: 0;
  padding: 0;
}
.breadcrumbBG {
  display: inline-block;
  background: rgba(0,0,0,0.3);
  padding: 3px 8px 3px 4px;
  position: relative;
  z-index: 15;
}
.breadcrumb li {
  display: inline-block;
}

.StaticBG {
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: top left;
}
.Banner {
  position: relative;
  font-family: GothamBlack;
  font-size: 3.5em;
  text-align: left;
  text-shadow: -2px -2px 3px rgba(0, 0, 0, 0.6), 2px 2px 3px rgba(0, 0, 0, 0.6);
  color: white;
  text-transform: uppercase;
}
.Banner p {
  margin: 0;
  padding: 0;
}
.HomeHeaderSpace {
  background: transparent url("../Images/Header/Main.jpg") no-repeat scroll center -44px / auto 903px;
  height: 884px;
  margin-bottom: -25px;
}

.DonateBanner, .ForumBanner {
  height: 400px;
  background: linear-gradient(to right, #000 calc(50% - 670px), transparent calc(50% - 300px), transparent calc(50% + 300px), #000 calc(50% + 670px)), url("../Images/Header/Forum.jpg");
  background-size: auto 400px;
  background-repeat: no-repeat;
  background-position: center;
}
.ForumBanner p {
  width: 1340px;
  margin: auto;
  text-align: left;
  position: relative;
  top: 70px;
}
.NewsBanner {
  background: transparent url("../Images/Header/News.jpg") no-repeat center / auto 400px;
  padding: 100px 0px;
  height: 400px;
}

.HomeMenuBar {
  background: rgba(0, 81, 110, 0.5);
  position: absolute;
  width: 100%;
  left: 0;
  top: -67px;
  height: 67px;
  text-align: center;
  display: inline-block;
  font-family: OpenSans;
  z-index: 1;
}
.HomeMenuBar a {
  font-family: GothamBook;
  font-size: 23px;
  position: relative;
  top: 18px;
  background: none;
  border: 2px white solid;
  border-radius: 20px;
  padding: 4px 10px;
  text-decoration: none;
  color: white;
  margin: 0 20px;
}
.HomeMenuBar a:hover {
  background: rgba(255,255,255,0.25);
  color: white;
}

.HomePanel {
  width: 1340px;
  margin: auto;
  font-size: 14px;
  position: relative;
  font-family: OpenSans;
}
.HomePanel h1 {
  margin: 0;
  font-family: GothamBlack;
  font-size: 4.1em;
  line-height: 0.9;
}
.HomePanel h2 {
  margin: 0;
  font-size: 2.8em;
  line-height: 0.9;
}
.HomePanel h3 {
  padding: 0 10px;
  font-family: GothamBlack;
  font-size: 1.69em;
  line-height: 0.9;
  display: inline-block;
}
.HomePanel a {
  color: #CCC;
  text-decoration: none;
}
.HomePanel a:hover {
  color: white;
}

.TitleBar {
  padding: 8px 0;
  height: 77px;
  font-size: 25px;
  color: rgba(255,255,255,0.6);
}
.TitleBar .HomePanel {
  font-size: 20px;
}
.TitleBar h1 {
  font-size: 50px;
  line-height: 1.0;
}
.TitleBar  .ChevronUp {
  font-size: 0;
  background: transparent url("../Images/Header/Button_arrow_up.png") no-repeat scroll center / contain;
  position: relative;
  float: right;
  top: 12px;
  right: 0;
  width: 40px;
  height: 49px;
  display: block;
}

.HomePanel1 {
  position: relative;
  padding: 75px 0 5px;
  background: black url("../Images/Header/TheGame.jpg") no-repeat center / auto 100%;
  overflow: hidden;
  height: 496px;
}
.HomePanel1Text {
  width: 50%;
  max-width: 500px;
  padding-top: 50px;
  clear: left;
}
.HomePanel1 .BodyText {
  background: rgba(0,0,0,0.5);
  padding: 5px;
  margin: 30px 0;
  width: 512px;
}
.HomePanel1 .BodyText p:first-of-type {
  margin-top: 0;
}
.HomePanel1 .HomePanel1Buttons  {
  text-align: center;
  position: relative;
  top: 15px;
  right: 0;
  float: right;
}
.HomePanel1 .HomeImageButton  {
  color: #CCC;
  text-decoration: none;
  padding-top: 180px;
  width: 300px;
  display: block;
  margin-bottom: 15px;
  text-shadow: 0 0 3px black;
}
.HomePanel1 .HomeImageButton:hover{
  color: white;
}
.HomePanel1 .HomeStoryButton {
  background: transparent url("../Images/Home/Video_TheStory.jpg") no-repeat scroll top left / contain;
}
.HomePanel1 .HomeFeaturesButton {
  background: transparent url("../Images/Home/Video_Features.jpg") no-repeat scroll top left / contain;
}

.HomePanel2 {
  background: black url("../Images/Header/Archetypes.jpg") no-repeat center / auto 100%;
  height: 684px;
  overflow: auto;
}
.HomePanel2 .TitleBar {
  background: rgba(104, 23, 96, 0.75);
}

.ArchetypeIconGroup {
  float: left;
  width: 512px;
  text-align: center;
  margin-top: 40px;
}
.ArchetypeIcon {
  width: 124px;
  padding-top: 129px;
  font-size: 15px;
  color: #888;
  display: inline-block;
  text-transform: uppercase;
  margin: 10px 0;
}
.ArchetypeIcon.active, .ArchetypeIcon:hover {
  color: white;
}
#Titan_Button {
  background: url("../Images/Home/Icon_Titan_grey.png") no-repeat scroll 0 0 / contain;
}
#Titan_Button.active, #Titan_Button:hover {
  background-image: url("../Images/Home/Icon_Titan.png");
}
#Projector_Button {
  background: url("../Images/Home/Icon_Projector_grey.png") no-repeat scroll 0 0 / contain;
}
#Projector_Button.active, #Projector_Button:hover {
  background-image: url("../Images/Home/Icon_Projector.png");
}
#Debilitator_Button {
  background: url("../Images/Home/Icon_Debilitator_grey.png") no-repeat scroll 0 0 / contain;
}
#Debilitator_Button.active, #Debilitator_Button:hover {
  background-image: url("../Images/Home/Icon_Debilitator.png");
}
#Brawler_Button {
  background: url("../Images/Home/Icon_Brawler_grey.png") no-repeat scroll 0 0 / contain;
}
#Brawler_Button.active, #Brawler_Button:hover {
  background-image: url("../Images/Home/Icon_Brawler.png");
}
#Sentinel_Button {
  background: url("../Images/Home/Icon_Sentinel_grey.png") no-repeat scroll 0 0 / contain;
}
#Sentinel_Button.active, #Sentinel_Button:hover {
  background-image: url("../Images/Home/Icon_Sentinel.png");
}
#Enforcer_Button {
  background: url("../Images/Home/Icon_Enforcer2_grey.png") no-repeat scroll 0 0 / contain;
}
#Enforcer_Button.active, #Enforcer_Button:hover {
  background-image: url("../Images/Home/Icon_Enforcer2.png");
}
#Coordinator_Button {
  background: url("../Images/Home/Icon_Coordinator_grey.png") no-repeat scroll 0 0 / contain;
}
#Coordinator_Button.active, #Coordinator_Button:hover {
  background-image: url("../Images/Home/Icon_Coordinator.png");
}
#Manipulator_Button {
  background: url("../Images/Home/Icon_Manipulator_grey.png") no-repeat scroll 0 0 / contain;
}
#Manipulator_Button.active, #Manipulator_Button:hover {
  background-image: url("../Images/Home/Icon_Manipulator.png");
}
#Leader_Button {
  background: url("../Images/Home/Icon_Leader_grey.png") no-repeat scroll 0 0 / contain;
}
#Leader_Button.active, #Leader_Button:hover {
  background-image: url("../Images/Home/Icon_Leader.png");
}
#Commander_Button {
  background: url("../Images/Home/Icon_Commander_grey.png") no-repeat scroll 0 0 / contain;
}
#Commander_Button.active, #Commander_Button:hover {
  background-image: url("../Images/Home/Icon_Commander.png");
}
#Director_Button {
  background: url("../Images/Home/Icon_Director_grey.png") no-repeat scroll 0 0 / contain;
}
#Director_Button.active, #Director_Button:hover {
  background-image: url("../Images/Home/Icon_Director.png");
}
.ArchetypeDescriptionGroup {
  clear: right;
  width: 300px;
  display: inline-block;
  margin: 50px 0 0 20px;
}
.ArchetypeDescription {
  display: none;
  width: 300px;
}
.ArchetypeDescription.active {
  display: inline-block;
}
.ArchetypeDescription h1 {
  font-size: 35px;
  text-transform: uppercase;
  margin: 0;
}
.ArchetypeDescription h2 {
  font-size: 14px;
  text-transform: uppercase;
  margin: 10px 0 0 0;
}
.ArchetypeDescription p {
  margin: 0 0 20px 0;
}
.ArchetypeDescription .BodyText {
  background: rgba(0,0,0,0.5);
  padding: 10px;
}

.HomePanel3 {
  background: black url("../Images/Header/Powers.jpg") no-repeat center / auto 100%;
  /* height: 842px; */
}
.HomePanel3 .HeaderText {
  padding: 50px 0 20px 0;
  margin-right: 50px;
  margin-left: auto;
  width: 550px;
  text-align: center;
}
.HomePanel3 .BodyText {
  padding: 20px 0 40px 0;
  margin-right: 50px;
  margin-left: auto;
  width: 550px;
}
.HomePanel3 p {
  font-size: 14px;
}
.HomePanel3 .TitleBar {
  background: rgba(0,128,0, 0.75);
}
.HomePanel3 .PowerIcons {
  font-size: 0;
  background: transparent url("../Images/Home/abilities.png") no-repeat scroll center / contain;
  width: 369px;
  height: 123px;
  margin: 20px auto;
}
.HomePanel3 .BodyText h1 {
  font-size: 5em;
}
.HomePanel3 .BodyText h2 {
  font-size: 3.5em;
}

.HomePanel4 {
  background: black url("../Images/Header/PvE.jpg") no-repeat center / auto 100%;
  /* height: 784px; */
}
.HomePanel4 .HeaderText {
  padding-top: 50px;
  text-align: center;
}
.HomePanel4 .BodyText {
  padding: 20px 0;
  width: 600px;
  margin: auto;
  text-align: center;
}
.HomePanel4 .TitleBar {
  background: rgba(255,128,0, 0.75);
}
.HomePanel4 .BodyText h1 {
  font-size: 5em;
}
.HomePanel4 .BodyText h2 {
  font-size: 3.5em;
}

.HomePanel5 {
  background: black url("../Images/Header/PvP.jpg") no-repeat center / auto 100%;
  /* height: 801px;*/
}
.HomePanel5 .TitleBar {
  background: rgba(255,0,0, 0.75);
}
.HomePanel5 > .HomePanel {
  padding: 50px 0;
}
.HomePanel5 > .HomePanel h1 {
  font-size: 5em;
}
.HomePanel5 > .HomePanel h2 {
  font-size: 3.5em;
}
.HomePanel5 .BodyText {
  width: 512px;
}

.content {
  background: rgba(255,255,255,0.08);
}

.ArticleContainer {
  width: 1340px;
  margin: auto;
  min-height: 465px;
}
.item-page .ArticleContainer {
    min-height: 685px;
}
.ArticleBody {
  margin: 10px 0 0;
  width: 927px;
  padding: 14px 0 0;
  margin: 0;
  display: inline-block;
  position: relative;
}
.ArticleBody div {
  padding: 0;
  margin: 0;
  display: inline-block;
}
.ArticleBody > div {
  background: black;
  padding: 35px;
}
.ArticleBody > div > p:first-child, .tos > p:first-child{
  margin-top: 0;
}
.ArticleBody > div > p:last-child, .tos > p:last-child {
  margin-bottom: 0;
}
.content .blog-featured > .page-header, .content .blog-category > .page-header, .content .item-page > .page-header {
  background: black url("../Images/Header/Forum.jpg") no-repeat center / 1340px auto;
  height: 400px;
  position: relative;
}
.blog-featured > .page-header h1, .blog-category > .page-header h1, .item-page > .page-header h1 {
  padding: 155px 0 0;
  font-family: GothamBlack;
  font-size: 3.5em;
  text-align: left;
  text-shadow: -2px -2px 3px rgba(0,0,0,0.5), 2px 2px 3px rgba(0,0,0,0.5);
  color: white;
  margin: auto;
  width: 1340px;
  position: relative;
}
.content .item-page .page-header {
  position: relative;
  background: black url("../Images/Header/Forum.jpg") no-repeat center / 1340px auto;
  height: 400px;
}
.content .item-page .page-header h2 {
  font-family: GothamBlack;
  font-size: 3.5em;
  text-align: left;
  vertical-align: middle;
  text-shadow: -2px -2px 3px rgba(0, 0, 0, 0.6), 2px 2px 3px rgba(0, 0, 0, 0.6);
  text-transform: uppercase;
  margin: auto;
  width: 1340px;
  height: 200px;
  line-height: 0.9;
  padding-top: 165px;
  position: relative;
}
.item-title {
  margin: 0;
  clear: right;
}
.ArticleInfoShadowBox {
  height: 60px;
  background: rgba(0,0,0,0.5);
  position:absolute;
  float: left;
  top: 340px;
  width: 100%;
}
.item-page .article-info {
  position:relative;
  font-size: 1.5em;
  height: 30px;
  width: 1340px;
  margin: auto;
  padding-top: 12px;
}
.blog-featured .article-info, .blog-category .article-info {
  position: relative;
  color: #666;
  font-size: 12px;
  margin: 10px 0;
  clear: right;
}
.article-info dt {
  display: none;
}
.article-info dd {
  margin: 0;
  display: inline-block;
  font-family: GothamBold;
}
.article-info .createdby span {
  color: #38B;
}
.pull-left {
  float: left;
  margin: 0 20px 0 0;
}
.pull-right {
  float: right;
  margin: 0 0 0 20px;
}

.items-leading div p:first-of-type {
  max-height: 45px;
  overflow: hidden;
}
.items-row div p:first-of-type {
  max-height: 65px;
  overflow: hidden;
}
.readmore {
  font-size: 13px;
}
.items-leading .pull-right, .items-leading .pull-left {
  float: none;
  margin: 0;
}
.items-leading {
  width: 1340px;
  margin: auto;
}
.items-leading > div {
  position: relative;
  width: 420px;
  padding: 0 10px;
  display: inline-block;
  vertical-align: top;
}
.items-row {
  padding: 20px 0 57px;
  height: 200px;
  background: black;
  overflow: hidden;
}
.items-row:last-of-type {
  padding-bottom: 134px;
}
.items-row .item {
  width: 800px;
  margin: auto;
  position: relative;
}
.items-leading-bg {
  padding: 50px 0 20px 0;
  min-height: 356px;
}
.items-leading .item-image img {
  object-fit: cover;
  width: 385px;
  height: 212px;
}
.items-leading .item-image {
  outline: 1px solid #a6a8a7;
}
.items-leading .item-image, .items-leading .ImagePlaceholder {
  width: 385px;
  height: 212px;
  overflow: hidden;
}
.items-row .item-image img {
  object-fit: cover;
  width: 295px;
  height: 204px;
}
.items-row  .item-image, .items-row .ImagePlaceholder {
  width: 295px;
  height: 204px;
  overflow: hidden;
  outline: 1px solid #a6a8a7;
}
.system-unpublished, tr.system-unpublished {
  background: #392020;
  border: none;
}
.ArticleBody .item-image {
  width: auto;
  max-width: 907px;
  height: auto;
}
.ArticleBody .item-image img {
  max-width: 907px;
  height: auto;
}
.article_info_header {
  font-family: OpenSansBold;
  text-transform: uppercase;
}

.content .form-vertical {
  width: 1340px;
  margin:auto;
  background: black;
}
.content .form-vertical .btn-group {
  display: inline-block;
}
.content .form-vertical fieldset > ul {
  display: inline-block;
  padding: 0;
  margin: 0;
}
.content .form-vertical fieldset > ul li {
  background: black;
  border: 1px solid white;
  border-radius: 10px 10px 0 0;
  padding: 0 5px;

  font-family: OpenSans;
  font-size: 15px;
  display: inline-block;
  position: relative;
  cursor: pointer;
}
.content .form-vertical fieldset > ul li a {
  color: #888;
}
.content .form-vertical fieldset > ul li a:hover,.content .form-vertical fieldset > ul li.active a {
  color: #FFF;
}
.content .form-vertical fieldset > ul li.active {
  border-bottom-color: black;
  z-index: 5;
}
.content .form-vertical .tab-content > div {
  display: none;
}
.content .form-vertical .tab-content > div.active {
  display: block;
  background: black;
  border: 1px solid white;
  position: relative;
  top: -1px;
  padding: 5px;
}
.content .form-vertical .btn {
  cursor: pointer;
  border: 1px solid white;
  border-radius: 20px;
  padding: 0 5px;
  margin: 5px 5px;
  background:black;
  color: #888;
  font-family: GothamBlack;
  font-size: 18px;
}
.content .form-vertical .btn:hover {
  color: #FFF;
}
.content .form-vertical .editor .btn-toolbar {
  position:relative;
  top: 10px;
}

.NewsChevron {
  background: black url("../Images/NewsChevronBG.png") no-repeat scroll center / contain;
  height: 92px;
  margin: auto;
}
.NewsBreadcrumbBG {
  position: absolute;
  top: 375px;
  width: 100%;
  float: left;
}
.NewsBreadcrumb {
  width: 1340px;
  margin: auto;
  padding: 0;
}

.item-page .icons + .article-info {
  width: 707px;
}
.ArticleBody > .icons, .icons {
  position: absolute;
  top: 0;
  right: 10px;
  padding: 0;
  text-align: right;
  z-index: 10;
}
.icons .icon-cog {
  background: black url("../Images/Forums/Button_settings_banner.png");
  width: 27px;
  height: 27px;
  display: inline-block;
}
.icons .dropdown-menu {
  visibility: hidden;
  padding: 0;
  margin: 0;
}
.icons .open .dropdown-menu {
  visibility: visible;
  background: black;
  border: 1px solid white;
  border-radius: 10px;
}
.icons a.dropdown-toggle {
    display: block;
    height: 27px;
}
.dropdown-menu li {
  display: block;
  padding: 5px;
  margin: 0;
  text-align: left;
}
.dropdown-menu li a{
  color: #CCC;
}
.dropdown-menu li a:hover {
  color: #FFF;
}

.TwitterFloat {
  position: absolute;
  top: 415px;
  left: 0;
  width: 95%;
  width: 97vw;
  height: 0;
}
.blog-featured ~ .TwitterFloat, .blog-category ~ .TwitterFloat, .edit ~ .TwitterFloat {
  display: none;
}
.TwitterContainer {
  position: relative;
  width: 1340px;
  margin: auto;
}
.VOTwitterContainer {
  float: right;
}
#wds {
  width: 323px;
}
#wds-header {
  border: none;
  border-radius: 50px;
  background: #5CF;
  padding: 5px;
  font-size: 2em;
  margin: 0 0 10px;
  border-bottom: 1px solid #555;
  font-family: GothamBlack;
}
#wds-tweets {
  margin: 0;
  font-size: 13px;
}
#wds-tweets a:hover {
  text-decoration: none;
  color: #0BF;
}
#wds-container {
  position:relative;
  height: 600px;
  border-color: #555;
  background: #111;
  border-radius: 25px;
}
#wds-sub-container {
  position: absolute;
  top: 22px;
  left: 22px;
  right: 22px;
  bottom: 22px;
  overflow: hidden;
}
#wds-twitter-icon {
  display: inline;
  width: 30px;
  height: 40px;
  background: url("../Images/twitter-icon.png") no-repeat scroll center / contain;
  float: left;
  margin: 0 20px;
}
.wds-tweet-container {
  border-color: #555;
}
.wds-tweet-data {
  padding-top: 15px;
  font-size: 12px;
}
.wds-avatar {
  margin: 0 5px 0 0;
  float: left;
  width: 45px;
}

.pagination {
  width: 1340px;
  margin: 20px auto;
  text-align: center;
}
.pagenav {
  text-align: center;
  padding: 0;
  margin-bottom: 0;
}
.pagination ul, .pagenav ul {
  margin: auto;
  width: -moz-fit-content;
  padding: 0;
}
.pagination li, .pagenav li {
  margin: 0 10px;
  display: inline;
}

.Footer {
  height: 151px;
  background-color: #313131;
  padding: 50px 0;
}
.Footer .copyright {
  font-size: 10px;
  float: left;
  position: relative;
  left: 0;
  padding: 20px 0;
}

.Logos {
  position: relative;
  top: 0;
  right: 0;
  float: right;
}
.Logos :hover {
  background-color: #444;
  outline: 2px white solid;
}

.UnityLogo {
  background: transparent url("../Images/Footer/Unity_Logo.png") no-repeat 0 0 / 100% 100%;
  background-origin: content-box;
  position: relative;
  width: 110px;
  height: 39px;
  display: inline-block;
  margin: 0 5px;
  padding: 10px;
  margin-bottom: 13px;
}
.GorgonServerLogo {
  background: transparent url("../Images/Footer/GorgonServer_Logo.png") no-repeat 0 0 / 100% 100%;
  background-origin: content-box;
  position: relative;
  width: 111px;
  height: 44px;
  display: inline-block;
  margin: 0 5px;
  padding: 10px;
  margin-bottom: 8px;
}
.SHSLogo {
  background: transparent url("../Images/Footer/SHS_Logo.png") no-repeat 0 0 / 100% 100%;
  background-origin: content-box;
  position: relative;
  top: 0;
  width: 146px;
  height: 52px;
  display: inline-block;
  margin: 0 5px;
  padding: 10px;
}

#donation-form {
  width: 1000px;
  margin: auto;
  min-height: 465px;
  background: black;
  padding: 20px;
}
#donation-form .control-group {
  display: inline-block;
  width: 500px;
  margin: 5px 0 0;
}
#donation-form input[type="text"], #donation-form input[type="password"] {
  padding-top: 0;
  padding-bottom: 0;
}
#donation-form #field_comment {
  width: 1000px;
}
#field_comment #comment {
  width: 780px;
}
#donation-form .form-actions {
  background-color: black;
  border: none;
}
#donation-form #country {
  width: 300px;
}
.input-prepend .add-on {
  background: transparent;
  border: none;
  padding: 4px 0;
}

#sbox-content.sbox-content-ajax {
  background: transparent;
  color: white;
  text-align: left;
  font-family: OpenSans;
  font-size: 15px;
}
#sbox-content.sbox-content-ajax h1 {
}
#sbox-content.sbox-content-ajax .ArticleInfoShadowBox {
  display: none;
}
#sbox-content.sbox-content-ajax .ArticleBody, #sbox-content .ArticleContainer {
  width: 100%;
}
#sbox-content.sbox-content-ajax .ArticleBody > div {
  margin: 0;
  padding: 0;
  background: transparent;
}
#sbox-content.sbox-content-ajax h2 {
  padding: 0;
  height: auto;
  margin: 0;
  width: auto;
}
#modules-form {
  margin: 84px auto 0;
  width: 1340px;
}
#modules-form .btn-group {
  display: inline-block;
}
button .icon-calendar::before {
  content: "C";
  font-family: "Icons";
  font-style: normal;
}
.edit .chzn-container {
  width: 500px !important;
}
.edit .control-group {
  display: table-row;
}
.control-group .controls {
  display: table-cell;
  width: 500px;
}
.control-group .chzn-container .chzn-single, .control-group .chzn-container .chzn-choices {
  background: transparent -moz-linear-gradient(center top , rgb(51, 51, 51) 20%, rgb(0, 0, 0) 50%, rgb(0, 0, 0) 52%, rgb(51, 51, 51) 100%) repeat scroll 0% 0% padding-box;
  box-shadow: 0px 0px 3px rgb(0,0,0) inset, 0px 1px 1px rgba(0, 0, 0, 0.1);
  color: rgb(255, 255, 255);
}
.control-group .chzn-container-active.chzn-with-drop .chzn-single, .control-group .chzn-container-active.chzn-with-drop .chzn-choices {
  background-image: linear-gradient(#333 20%, #000 80%);
}
.control-group .chzn-container .chzn-drop {
  background: transparent -moz-linear-gradient(center top , rgb(0, 0, 0) 90%, rgb(51, 51, 51) 100%) repeat scroll 0% 0% padding-box;
}
.control-group > .control-label {
  display: table-cell;
  text-align: right !important;
  vertical-align: middle;
  padding: 0 10px 0 0;
}
.control-group .controls input, .control-group .controls button {
  display: inline-block;
}
.chzn-container-active .chzn-choices li.search-field input[type="text"] {
  color: white !important;
}
.MessageArea {
  position: absolute;
  top: 250px;
  z-index: 100;
  font-family: OpenSans;
  font-size: 15px;
  width: 100%;
  text-transform: none;
}
.MessageArea .MessageContainer {
  width: 1340px;
  margin: auto;
  max-height: 150px;
  overflow-y: auto;
  position: relative;
  -webkit-transiton: max-height 0.5s;
  -moz-transition: max-height 0.5s;
  -ms-transition: max-height 0.5s;
  -o-transition: max-height 0.5s;
  -transition: max-height 0.5s;
}
.MessageArea .MessageContainer p {
  margin: 0 10px;
}
.MessageArea .MessageContainer .alert {
  background: rgba(0, 93, 255, 0.8);
}
.MessageArea .MessageContainer .alert-error {
  background: rgba(255, 0, 0, 0.8);
}
.MessageArea .MessageContainer .alert-warning {
  background: rgba(255, 153, 0, 0.8)
}
.MessageArea .MessageContainer .MessageCloseButton {
  font-family: GothamBook;
  font-size: 18px;
  position: absolute;
  top: 0px;
  color: #888;
  text-decoration: none;
  right: 5px;
  text-shadow: 0px 0px 4px black;
}
.MessageArea .MessageContainer .MessageCloseButton:hover {
  color: white;
  text-shadow: 0px 0px 4px white;
}

.registration, .profile {
  font-family: OpenSansLight;
  font-size: 14px;
  position: relative;
  top: -84px;
}
.registration fieldset:first-of-type .control-group:first-of-type {
  padding-top: 20px;
}
.registration fieldset legend {
  display: none;
}
.registration fieldset:first-of-type legend, #users-profile-core legend, .profile-edit fieldset legend {
  display: block;
  width: 100%;
  padding: 100px 0 0;
  height: 300px;
  background: black url("../Images/Header/Forum.jpg") no-repeat center / auto 100%;
}
.registration fieldset:first-of-type legend p, #users-profile-core legend p, .profile-edit fieldset:first-of-type legend {
  padding: 55px 0px 0px;
  font-family: GothamBlack;
  font-size: 52px;
  text-align: left;
  text-shadow: -2px -2px 3px rgba(0, 0, 0, 0.5), 2px 2px 3px rgba(0, 0, 0, 0.5);
  color: #FFF;
  margin: auto;
  width: 1340px;
  text-transform: uppercase;
}
.registration .FormContainer {
  width: 1000px;
  margin: auto;
  background: black none repeat scroll 0% 0%;
  display: block;
  text-align: center;
}
.registration .control-group {
  width: auto;
  display: inline-block;
  vertical-align: middle;
}
.registration .control-group .control-label {
  width: 180px;
  display: inline-block;
}
.registration .control-group .controls {
  display: inline-block;
  width: 304px;
}
.registration fieldset:first-of-type .control-group .controls {
  width: 250px;
}
.registration .control-spacer {
  width: 196px;
  display:inline-block;
}
#jform_profile_dob {
  width: 204px;
}
.registration .input-append button {
  margin: 5px;
  padding: 5px 10px;
}
.registration .optional {
  display: none;
}
.registration .btn-group {
  padding-top: 30px;
  text-align: center;
  width: 1000px;
}
.registration .btn-group a {
  background: none;
  border: 1px white solid;
  border-radius: 20px;
  text-decoration: none;
  margin: 0 0 20px 20px;
  display: inline-block;
  cursor:pointer;
  font-family: GothamBlack;
  color: #CCC;
  padding: 5px 20px;
  font-size: 20px;
}
.registration .btn-group a:hover {
  background: rgba(255,255,255,0.25);
  color: white;
}
#jform_captcha-lbl {
  position: relative;
  top: -35px;
}
#sbox-content {
  background: transparent;
}
.registration input.required {
  background: url("../Images/check_red.png") no-repeat 98% 50% / 25px 25px;
}
.registration input.required[aria-invalid="false"] {
  background: url("../Images/check_green.png") no-repeat 98% 50% / 25px 25px;
}
.content .login {
  padding-top: 370px;
}
.content .login, .content .login + div {
  width: 600px;
  margin: auto;
}
.content .login .controls button {
  position: relative;
  left: 200px;
}
#jform_profile_tos-lbl {
  position: relative;
  top: -6px;
}
#jform_profile_tos {
  text-align: left;
}
#donation-form input[type="checkbox"] {
  margin-left: 170px;
}
.registration-filler {
  background: black;
  height: 84px;
  width: 1000px;
  position: absolute;
  left: calc(50% - 500px);
  bottom: 0px;
}
.tooltip {
  display: none !important;
}

.profile .btn-toolbar {
  position: absolute;
  right: 50px;
  top: 490px;
}
.ArticleBody p.short_descript {
  display: inline;
}

.content .blog-featured > .page-header::before, .content .blog-category > .page-header::before, .content .item-page > .page-header::before {
  content: " ";
  position: absolute;
  display: block;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  background: transparent linear-gradient(to right, rgb(0, 0, 0) calc(50% - 670px), transparent calc(50% - 300px), transparent calc(50% + 300px), rgb(0, 0, 0) calc(50% + 670px)) no-repeat scroll 0px 0px / 100% 100%;
}
#system-message a.close {
    display: none;
}
#system-message .alert-heading {
    margin-top: 0;
}
#Kunena ul.kpost-profile li.kpost-avatar {
    width: 85px;
    height: 85px;
    margin: 15px auto;
    position: relative;
}
#Kunena div.kavatar-lg {
    position: relative;
    width: 180px;
    height: 180px;
    margin: 20px auto;
    display: block;
}
#Kunena div.kavatar-lg img.kavatar {
    width: 180px;
    height: 180px !important;
    object-fit: cover;
}
.AvatarFrame {
    position: absolute;
    left: -8px;
    right: -10px;
    bottom: -9px;
    top: -8px;
    background: transparent no-repeat scroll center center / 100% 100%;
}
.AvatarFrame.Large {
    left: -17px;
    right: -17px;
    bottom: -17px;
    top: -17px;
}
.AvatarFrame.Founder {
    background-image: url("../Images/Forums/Frames/Founder.png");
}
.AvatarFrame.Diamond {
    background-image: url("../Images/Forums/Frames/Diamond.png");
}
.AvatarFrame.Diamond.Founder {
    background-image: url("../Images/Forums/Frames/Diamond_Founder.png");
}
.AvatarFrame.Gold {
    background-image: url("../Images/Forums/Frames/Gold.png");
}
.AvatarFrame.Gold.Founder {
    background-image: url("../Images/Forums/Frames/Gold_Founder.png");
}
.AvatarFrame.Silver {
    background-image: url("../Images/Forums/Frames/Silver.png");
}
.AvatarFrame.Silver.Founder {
    background-image: url("../Images/Forums/Frames/Silver_Founder.png");
}
.AvatarFrame.Platinum {
    background-image: url("../Images/Forums/Frames/Platinum.png");
}
.AvatarFrame.Platinum.Founder {
    background-image: url("../Images/Forums/Frames/Platinum_Founder.png");
}
.NoArticles {
    font-family: GothamBold;
    font-size: 25px;
    text-align: center;
}
.NoPlaceholderImages .ImagePlaceholder {
    display: none;
}

.Reactivation h1 {
    padding: 155px 0 80px;
    font-family: GothamBlack;
    font-size: 3.5em;
    text-align: left;
    text-shadow: -2px -2px 3px rgba(0,0,0,0.5), 2px 2px 3px rgba(0,0,0,0.5);
    color: white;
    margin: auto;
    width: 1340px;
    position: relative;
}
.Reactivation table {
    max-width: 1340px;
    margin: auto;
}
.Reactivation th {
    background: white;
    color: black;
}
.Reactivation tr:hover {
    background: rgba(255,255,255,0.2);
}
.Reactivation button {
    font-size: 15px;
    margin: 0;
}