/* ============================ */
/* Constants */
/* ============================ */
/* ============================ */
/* Global Styles */
/* ============================ */
/*$normal-font: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;*/
/*$button-gradient-active: linear-gradient(darken($LEGION_MAHOGANY, 4), darken($LEGION_MAHOGANY_LIGHT, 4)) repeat scroll 0% 0% transparent;*/
/* ============================ */
/* Screen Sizes (for responsive layout) */
/* ============================ */
/* ============================ */
/* Base Styles */
/* ============================ */
.button {
  background: linear-gradient(#9D12FF, #560393) repeat scroll 0% 0% transparent;
  border: 2px solid #560393;
  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-shadow: 0px 0px 1rem white;
  text-transform: uppercase; }

.button:hover {
  background: linear-gradient(#a526ff, #6203a7) repeat scroll 0% 0% transparent;
  border: 2px solid #6904b3;
  box-shadow: 0px 0px 1rem #6904b3, 0px 0px 5rem white;
  text-shadow: none; }

.button:active {
  box-shadow: 0px 0px 5rem #6904b3, 0px 0px 10rem white; }

body {
  background: url(../images/banner-env2-2560.jpg);
  background-repeat: no-repeat;
  background-color: #161210;
  color: #404040;
  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; }

h1, h2, h3, h4, h5, h6 {
  color: #404040;
  font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif; }

h2, h3 {
  color: #fff;
  background-color: #346034;
  padding: 0.5rem 1rem;
  border: 6px solid #BCBCBC;
  outline: 1px solid #ECECEC; }

h4 {
  color: #404040;
  background-color: #D4D4D4;
  font-weight: bold; }

h4::before {
  background-image: url("/static/images/web/crystal.png");
  background-size: 48px auto;
  background-repeat: no-repeat;
  background-position: 0px 9px;
  content: "";
  width: 64px;
  height: 64px;
  display: inline-block;
  vertical-align: middle;
  margin: -20px 0px -10px -15px; }

a {
  color: #ce6700; }

a:hover, a:focus {
  color: #9b4e00; }

/* ============================ */
/* Normalize Foundation */
/* ============================ */
.top-bar, .top-bar-section ul li {
  background: none; }

ul {
  margin-left: 0;
  margin-bottom: 0; }

.clearing-thumbs li, [data-clearing] li {
  margin-right: 0; }

.has-tip {
  font-weight: normal; }

/* ============================ */
/* Utility Classes */
/* ============================ */
.force-gpu {
  -webkit-transform: translateZ(0); }

.add-vertical-margin {
  margin: 1rem 0; }

/* ============================ */
/* Layout Classes */
/* ============================ */
.center-content {
  text-align: center !important; }

.full-height {
  height: 100vh !important; }

.full-width {
  width: 100% !important; }

.layer-bg {
  position: relative;
  z-index: 0; }

.layer-bg-parallax {
  position: fixed;
  z-index: 1; }

.layer-bg-background {
  position: absolute;
  z-index: 2; }

.layer-panel {
  position: relative;
  z-index: 10; }

.layer-content {
  position: relative;
  z-index: 20; }

.layer-fixed {
  position: fixed;
  z-index: 100; }

/* ============================ */
/* Patches */
/* ============================ */
#static-wrap {
  position: static; }

#content-wrap {
  position: relative; }

.visible-img img {
  margin: auto !important;
  /* !important to overwrite negative margin-left and margin-top foundation js gives for images in clearing*/
  left: 0;
  top: 0;
  bottom: 0;
  right: 0; }

/* ============================ */
/* Constants */
/* ============================ */
/* ============================ */
/* Global Styles */
/* ============================ */
/*$normal-font: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;*/
/*$button-gradient-active: linear-gradient(darken($LEGION_MAHOGANY, 4), darken($LEGION_MAHOGANY_LIGHT, 4)) repeat scroll 0% 0% transparent;*/
/* ============================ */
/* Screen Sizes (for responsive layout) */
/* ============================ */
/* ============================ */
/* Covers */
/* ============================ */
.cover-photo-container {
  height: 600px; }

.cover-photo-clipper {
  position: absolute;
  clip: rect(auto, auto, auto, auto);
  height: 600px; }

.cover-photo {
  background-position: top center;
  height: 600px; }

.cover-photo-fx {
  background: url("/static/images/scanlines-pattern.png") center center repeat;
  height: 600px;
  position: absolute; }

/* ============================ */
/* Constants */
/* ============================ */
/* ============================ */
/* Global Styles */
/* ============================ */
/*$normal-font: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;*/
/*$button-gradient-active: linear-gradient(darken($LEGION_MAHOGANY, 4), darken($LEGION_MAHOGANY_LIGHT, 4)) repeat scroll 0% 0% transparent;*/
/* ============================ */
/* Screen Sizes (for responsive layout) */
/* ============================ */
/* ============================ */
/* Units */
/* ============================ */
.race-icon {
  border-radius: 3rem;
  float: left;
  height: 48px; }

.unit-tooltip {
  margin: 1rem 0; }

.guide-row {
  line-height: 68px;
  padding-bottom: 0.5rem; }

img.unit-header-icon {
  border: 1px solid #B4FFBD;
  width: 48px;
  height: 48px;
  margin-right: 6px; }

span.unit-header-cost {
  color: white;
  font-size: 1rem; }

.upgrade-container {
  text-align: center; }

.upgrade-item {
  display: block;
  opacity: 0.66; }

.upgrade-item:hover {
  opacity: 1; }

.upgrade-item.active {
  opacity: 1; }

.upgrade-item-name {
  display: inline;
  padding: 0.5rem; }

.upgrade-tier {
  display: inline-block;
  vertical-align: middle; }

/* ============================ */
/* Constants */
/* ============================ */
/* ============================ */
/* Global Styles */
/* ============================ */
/*$normal-font: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;*/
/*$button-gradient-active: linear-gradient(darken($LEGION_MAHOGANY, 4), darken($LEGION_MAHOGANY_LIGHT, 4)) repeat scroll 0% 0% transparent;*/
/* ============================ */
/* Screen Sizes (for responsive layout) */
/* ============================ */
/* ============================ */
/* Media */
/* ============================ */
.media-entity {
  background-color: #BCBCBC;
  border: 1px solid #ECECEC;
  padding: 6px; }

.icon {
  background-color: #dedede;
  border: 1px solid #BCBCBC;
  padding: 3px; }

.extra-large-icon {
  width: 80px;
  height: 80px; }

.large-icon {
  width: 64px;
  height: 64px; }

.medium-icon {
  width: 48px;
  height: 48px; }

.with-label {
  margin-right: 12px; }

.with-label-small {
  margin-right: 6px; }

.icon-grid {
  display: inline-block;
  height: 108px;
  text-align: center;
  width: 116px; }
  .icon-grid .icon-label {
    display: block;
    font-size: 0.8rem;
    margin-top: 0.15rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }

.clearing-feature li.clearing-featured-img {
  display: inline-block;
  float: none; }

.clearing-justified {
  text-align: justify;
  -moz-text-align-last: justify;
  text-align-last: justify; }

.clearing-assembled .clearing-container .visible-img {
  height: 100%; }

.clearing-container .carousel {
  display: none; }

.media-thumb {
  margin-bottom: 2rem; }

.wallpaper-thumb {
  cursor: pointer; }

select.media-select {
  display: block; }

.text-tag {
  background-color: #ce6700;
  color: #FFF;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  line-height: 1.5rem;
  margin-right: 0.5rem; }

.progress {
  border: 1px solid #BCBCBC;
  background-color: white; }
  .progress .meter {
    background-color: #2BA6CB; }
  .progress .positive {
    background-color: #2FD242; }
  .progress .negative {
    background-color: #2FD242; }

/* ============================ */
/* Constants */
/* ============================ */
/* ============================ */
/* Global Styles */
/* ============================ */
/*$normal-font: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;*/
/*$button-gradient-active: linear-gradient(darken($LEGION_MAHOGANY, 4), darken($LEGION_MAHOGANY_LIGHT, 4)) repeat scroll 0% 0% transparent;*/
/* ============================ */
/* Screen Sizes (for responsive layout) */
/* ============================ */
/* ============================ */
/* Updates */
/* ============================ */
.update-container:not(:first-child) {
  border-top: 1px solid #999;
  padding: 1rem 0; }

.update-container:first-child {
  padding-bottom: 1rem; }

.update-date {
  color: #999; }

.update-image {
  margin-top: -12px; }

.update-title {
  font-weight: bold; }

.update-meta {
  margin-bottom: 1rem; }
  .update-meta .update-date:before {
    content: "|";
    margin: 0 0.25rem; }

/* ============================ */
/* Constants */
/* ============================ */
/* ============================ */
/* Global Styles */
/* ============================ */
/*$normal-font: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;*/
/*$button-gradient-active: linear-gradient(darken($LEGION_MAHOGANY, 4), darken($LEGION_MAHOGANY_LIGHT, 4)) repeat scroll 0% 0% transparent;*/
/* ============================ */
/* Screen Sizes (for responsive layout) */
/* ============================ */
/* ============================ */
/* Footer
/* ============================ */
#footer {
  color: #dfdfdf;
  height: 8rem;
  margin-top: 2rem;
  width: 100%; }

/* ============================ */
/* Home */
/* ============================ */
#top-bar {
  background-image: url("/static/images/top-bar-bg.jpg");
  -webkit-box-shadow: 0px 1px 1px rgba(128, 128, 128, 0.6), 0px 3px 10px rgba(0, 0, 0, 0.9), 0px 3px 40px rgba(0, 0, 0, 0.9);
  -moz-box-shadow: 0px 1px 1px rgba(128, 128, 128, 0.6), 0px 3px 10px rgba(0, 0, 0, 0.9), 0px 3px 40px rgba(0, 0, 0, 0.9);
  box-shadow: 0px 1px 1px rgba(128, 128, 128, 0.6), 0px 3px 10px rgba(0, 0, 0, 0.9), 0px 3px 40px rgba(0, 0, 0, 0.9); }
  #top-bar .name {
    margin-right: 1rem;
    line-height: 48px; }
  #top-bar #top-bar-menu ul.menu-list {
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    flex-direction: row;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    text-align: center;
    /*li a:hover, li.active a:before {
        content: "";
        position: absolute;
        height: 3px;
        background: linear-gradient(to right, lighten($LEGION_MAHOGANY_LIGHT, 50), lighten($LEGION_MAHOGANY_LIGHT, 25) 10%, lighten($LEGION_MAHOGANY, 25)) repeat scroll 0% 0% transparent;
        bottom: -6px;
        left: -2px;
        right: -2px;
        top: auto;
        box-shadow: 0px 0px 1.5rem 2px lighten($LEGION_MAHOGANY_LIGHT, 25);
        opacity: 1;
        transition: opacity 0.25s ease;
    }*/ }
    #top-bar #top-bar-menu ul.menu-list li {
      display: inline-block;
      flex: 1;
      -webkit-flex: 1;
      -moz-flex: 1;
      float: none;
      position: relative; }
    #top-bar #top-bar-menu ul.menu-list li a {
      background: none;
      font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 1rem;
      text-transform: uppercase; }
    #top-bar #top-bar-menu ul.menu-list li a:hover {
      border-bottom: 3px solid #ffcc00; }
    #top-bar #top-bar-menu ul.menu-list li.active a {
      border-bottom: 3px solid #ffcc00; }

/* ============================ */
/* Layout
/* ============================ */
.breadcrumb {
  margin: 2rem 0 2rem 0;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7), -1px -1px 4px rgba(0, 0, 0, 0.5); }
  .breadcrumb a, .breadcrumb h1, .breadcrumb h2, .breadcrumb h3, .breadcrumb h4, .breadcrumb h5, .breadcrumb h6 {
    color: white; }
  .breadcrumb a {
    border-bottom: 1px dotted white; }

.breadcrumb-separator {
  padding: 0 0.5rem; }

/* ============================ */
/* Content - Backgrounds */
/* ============================ */
.content-wrapper-flat {
  background-color: #dfdfdf;
  overflow: auto;
  padding: 2rem; }

.content-wrapper-flat:last-child {
  border-style: solid;
  border-top-color: #ECECEC;
  border-right-color: #ECECEC;
  border-bottom-color: #BCBCBC;
  border-left-color: #ECECEC;
  border-width: 2px 2px 6px 2px; }

/* ============================ */
/* General Elements             */
/* - May use multiple           */
/* ============================ */
.content-normal img.content-image {
  margin-bottom: 2rem; }

.content-header {
  background-color: #98560B;
  color: white;
  border-top: 2px solid #b0630d;
  border-right: 2px solid #804909;
  border-bottom: 2px solid #804909;
  border-left: 2px solid #b0630d;
  padding: 0.5rem 0 0.5rem 1rem; }

.content-inset-label {
  font-size: 0.75rem;
  text-transform: uppercase; }

.content-inset-label:not(:first-child) {
  margin-top: 1rem; }

.content-inset {
  border-color: #BCBCBC;
  border-style: solid;
  border-width: 1px;
  background-color: #ECECEC;
  outline: 1px solid #ECECEC;
  padding: 1rem; }
  .content-inset .text-label {
    color: #404040;
    font-size: 0.75rem;
    text-transform: uppercase; }
  .content-inset .text-value {
    color: #404040;
    font-size: 0.75rem;
    font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase; }

.content-section {
  margin-top: 2rem; }

.text-inset:first-child, .text-inset:last-child {
  margin: 0; }

/* ============================ */
/* General Widgets              */
/* ============================ */
.divider {
  background-image: url("/static/images/divider.png");
  background-position: center;
  background-repeat: no-repeat;
  height: 37px;
  width: 100%; }

.divider-2 {
  background-image: url("/static/images/divider-2.png"); }

.divider-space {
  margin-bottom: 2rem; }

.divider-space-2 {
  margin-top: 2rem; }

.content-submenu {
  font-size: 0;
  margin-bottom: 1rem;
  text-align: center; }
  .content-submenu ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    flex-direction: row;
    -webkit-flex-direction: row;
    -moz-flex-direction: row; }
    .content-submenu ul li {
      /*background-color: $LEGION_DARKRUST;*/
      border-top: 2px solid #ce6700;
      border-right: 2px solid #724700;
      border-bottom: 2px solid #724700;
      border-left: 2px solid #ce6700;
      color: white;
      display: inline-block;
      flex: 1;
      -webkit-flex: 1;
      -moz-flex: 1;
      float: none;
      font-family: "Roboto Slab", "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 1rem;
      list-style: none;
      line-height: 3rem;
      text-transform: uppercase; }
      .content-submenu ul li a {
        background: linear-gradient(#ce6700, #724700) repeat scroll 0% 0% transparent;
        color: #FFEEAA;
        display: block;
        height: 100%;
        overflow: hidden;
        text-align: center;
        text-overflow: ellipsis;
        text-shadow: 0px 1px 10px rgba(0, 0, 0, 0.5), 0px 1px 25px rgba(0, 0, 0, 0.9);
        white-space: nowrap;
        width: 100%; }
      .content-submenu ul li a:hover {
        background: linear-gradient(#e27100, #865400) repeat scroll 0% 0% transparent; }
      .content-submenu ul li a:active {
        color: white; }
    .content-submenu ul li.active {
      border-top: 2px solid #ff8102;
      border-right: 2px solid #a56700;
      border-bottom: 2px solid #a56700;
      border-left: 2px solid #ff8102; }
      .content-submenu ul li.active a {
        background: linear-gradient(#ff8102, #a56700) repeat scroll 0% 0% transparent;
        color: white;
        text-shadow: none; }
    .content-submenu ul li.disabled {
      background-color: #999;
      color: #dedede;
      border-top: 2px solid #a6a6a6;
      border-right: 2px solid #8c8c8c;
      border-bottom: 2px solid #8c8c8c;
      border-left: 2px solid #a6a6a6; }

.child-submenu ul {
  background-color: #161210;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  flex-direction: row;
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  list-style: none; }
  .child-submenu ul li {
    display: inline-block;
    flex: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    float: none;
    position: relative; }
    .child-submenu ul li a {
      color: #BCBCBC;
      height: 3rem; }
  .child-submenu ul li:hover {
    background-color: #1c1714; }
  .child-submenu ul li.active {
    background-color: #2e2521; }
    .child-submenu ul li.active a {
      color: #ffcc00; }
  .child-submenu ul .menu-item {
    display: block;
    position: relative;
    top: 1.33rem;
    left: 1rem;
    height: 6rem;
    width: 10rem; }
    .child-submenu ul .menu-item em.step {
      display: block;
      font-style: normal; }

.sidebar-list {
  list-style: none; }
  .sidebar-list li {
    border-top: 1px solid #999;
    padding: 1rem 0;
    position: relative; }
    .sidebar-list li .thumb-margin {
      margin-left: 6rem; }

.sidebar-image {
  background-size: cover;
  background-position: center;
  display: block;
  height: 2.5rem;
  position: absolute;
  width: 5rem; }

.sidebar-item-name {
  display: block;
  line-height: 1rem; }

.sidebar-date {
  color: #999; }

/*# sourceMappingURL=main.css.map */