body{
  font-family: "RobotoLight";
}

.black-bg {
  min-height: 255px;
  background: url("/assets/old/images/img/header/black-bg.png") no-repeat;
  background-size: 100% 100%;
  padding-top: 20px;
}

.gray-bg {
  /*min-height: 550px;*/
  background-color: #e9ecec;
  padding-top: 20px;
}


.white-bg {
  min-height: 320px;
  background-color: #fff;
  padding-top: 20px;
}

.black-menu-bg {
  margin-top: 17px;
  margin-bottom: 24px;
  min-height: 61px;
  border: 1px solid #b8b8b8;
  background-color: #d3d3d3;        
  background-size: 100% 100%;
  border-radius: 5px !important;
}

.black-menu-container{
  padding-left: 4px;
  padding-right: 4px;
  width: 100%;
  margin: 0 auto;
}
.black-menu-button {
  /*width: 32%;*/
  min-height: 52px;
  /*border: 1px solid #efefef;*/
  float: left;
  margin: 4px 0 0 0;
}

.black-menu-button-l{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button.png") repeat-x;
  cursor: pointer;
  color: #c6c6c6;
  border-width: 1px 0px 1px 1px;
  border-style: solid;
  border-color: black;
  border-radius: 8px 0px 0px 8px !important;
}

.black-menu-button-l:hover {
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button-hover.png") repeat-x;
  cursor: pointer;
  color: #383737;
  border-width: 1px 0px 1px 1px;
  border-style: solid;
  border-color: black;
}

.black-menu-button-l-hover { 
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button-hover.png") repeat-x;
  cursor: pointer;
  color: #383737;
  border-width: 1px 0px 1px 1px;
  border-style: solid;
  border-color: black;
  border-radius: 8px 0px 0px 8px !important;
}

.black-menu-button-m{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button.png") repeat-x;
  background-position: center;
  cursor: pointer;
  color: #c6c6c6;
  border-width: 1px 0px 1px 0px;
  border-style: solid;
  border-color: black;
}

.black-menu-button-m:hover{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button-hover.png") repeat-x;
  background-position: center;
  cursor: pointer;
  color: #383737;
  border-width: 1px 0px 1px 0px;
  border-style: solid;
  border-color: black;
}

.black-menu-button-m-hover{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button-hover.png") repeat-x;
  cursor: pointer;
  color: #383737;
  border-width: 1px 0px 1px 0px;
  border-style: solid;
  border-color: black;
}

.black-menu-button-r{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button.png") repeat-x;
  background-position: right top;
  cursor: pointer;
  color: #c6c6c6;
  border-width: 1px 1px 1px 0px;
  border-style: solid;
  border-color: black;
  border-radius: 0px 8px 8px 0px !important;
}

.black-menu-button-r:hover{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button-hover.png") repeat-x;
  cursor: pointer;
  color: #383737;
  border-width: 1px 1px 1px 0px;
  border-style: solid;
  border-color: black;
}

.black-menu-button-r-hover{
  width: 25%;
  height: 50px;
  background: url("/assets/old/images/img/header/black-button-hover.png") repeat-x;
  cursor: pointer;
  color: #383737;
  border-width: 1px 1px 1px 0px;
  border-style: solid;
  border-color: black;
  border-radius: 0px 8px 8px 0px !important;
}

.black-button-text {
  width: 83%;
  margin: 19px auto 2px auto;
  font-family: "RobotoBold";
  text-align: center;
}
.black-button-text-sub {
  width: 20%;
  margin: 18px auto 2px auto;
  font-family: "RobotoBold";
}

.black-button-text > img {
  margin-left: 5px;
}

.black-button-divider {
  float: left;
  margin-top: 2px;
}

.black-button-divider-right {
  float: left;
  margin-top: 2px;
}

.title-container {
  width: 100%;
  margin: 0 auto;
  min-height: 50px;
  padding: 10px 0 0 0;
  text-align: center;
}

.title-container > span {
  color: #FFFFFF;
  font-size: 24px;

}

.title-container > img {

}

.year-container {
  width: 50%;
  margin: 0 auto;
  min-height: 50px;
  padding: 10px 0 0 0;
  text-align: center;
}

.year-container > span {
  color: #FFFFFF;
  font-size: 24px;

}

.year-select {
    color: #666666;
    font-size: 16px;
    margin-top: 6px;
    vertical-align: top;
}

.card-container {
  width: 100%;
  min-height: 50px;
  /*padding: 10px 0 0 0;*/
  text-align: center;
}

.card {
  min-height: 50px;
  /*border: 1px solid #ccc;*/
  float: left;
  margin: 0 0 10px 0;
}

.card-l {
  width: 28%;
}
.card-mh {
  width: 24%;
}

.card-m {
  width: 24%;
}

.card-r {
  width: 23%;
}

.card-slice {
  float: left;
  padding-top: 20px;
  margin: 0px 0px 0px 0px;
}

.card-big-text {
  font-family: "RobotoBold";
  font-size: 48px;
  color: #fff;
  font-weight: bold;
}
.card-big-text-mh {
  font-family: "RobotoLight";
  font-size: 30px;
  color: #fff;
}

.card-small-text {
  font-size: 14px;
  color: #fff;
}

.card-icon {
  font-size: 40px;
  color:#a0a2a2;
  margin: 28px 5px 5px 25px;
}

.card-icon-fa {
  font-size: 40px;
  color:#a0a2a2;
  margin: 40px 5px 5px 25px;
}

.card-arrow-container {
    float: left;
    text-align: center;
    color: #fff;    
}

.card-arrow {
    color: #fff;
    font-size: 32px;
    opacity: 0;
}

.card-arrow-grey {
    color: #666;
    font-size: 32px;
    margin-top: 7px;
    /*display: none;*/
    opacity: 0;
}

.card-highlight {
    text-shadow: 0 0 10px #fff;
}

.main-chart-exrtra-col1 {
  padding: 0px 0px 0px 50px !important;
}

.main-chart-exrtra-col2 {
  padding: 0px;
}

.main-chart-exrtra-big-text {
  font-family: "RobotoBlack";
  font-size: 30px;
  color: #5faee3;
}

.main-chart-exrtra-small-text {
  /*font-family: "RobotoRegular";*/
  font-size: 14px;
  color: #999999;
  font-weight: bold;
}

/****************************************************/

div#dashboard-container-3  {
    min-height: 100px;
    border-left:1px grey solid;
}

div#dashboard-container-4  {
    min-height: 100px;
    /*border-top:1px grey solid;*/
}