@import url("https://fonts.googleapis.com/css?family=Lato:300,400,700");
@import url("https://fonts.googleapis.com/css?family=Roboto:100,200,300,400,500,700");
/* VERBUND THEME */
.diamond {
  transform: rotate(45deg);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer; }
  .diamond:focus {
    outline: 0; }
  .diamond__icon {
    display: flex;
    width: 30px;
    height: 30px;
    justify-content: center;
    align-items: center;
    transform: rotate(-45deg); }
    .diamond__icon svg {
      width: 100%;
      height: 100%; }
      .theme-d3a .diamond__icon svg {
        fill: #fff; }
      .theme-verbund .diamond__icon svg {
        fill: #fff; }
  .diamond__small {
    width: 50px;
    height: 50px;
    margin: 12.5px;
    background-color: #3199c2; }
    .diamond__small .diamond__icon {
      height: 25px;
      width: 25px; }
    .diamond__small:hover, .diamond__small.diamond--active {
      border: solid 3px; }
      .theme-d3a .diamond__small:hover, .theme-d3a .diamond__small.diamond--active {
        background-color: #3a657f;
        border-color: #a666ff; }
      .theme-verbund .diamond__small:hover, .theme-verbund .diamond__small.diamond--active {
        background-color: #3a657f;
        border-color: #a666ff; }
  .diamond__medium {
    width: 66px;
    height: 66px;
    margin: 16.5px; }
    .diamond__medium .diamond__icon {
      width: 33px;
      height: 33px; }
    .diamond__medium:hover, .diamond__medium.diamond--active {
      border: solid 3px; }
      .theme-d3a .diamond__medium:hover, .theme-d3a .diamond__medium.diamond--active {
        background-color: #3a657f;
        border-color: #a666ff; }
      .theme-verbund .diamond__medium:hover, .theme-verbund .diamond__medium.diamond--active {
        background-color: #3a657f;
        border-color: #a666ff; }
  .diamond__large {
    border: solid 3px;
    width: 90px;
    height: 90px;
    margin: 22.5px; }
    .theme-d3a .diamond__large {
      background-color: #3a657f;
      border-color: #a666ff; }
    .theme-verbund .diamond__large {
      background-color: #3a657f;
      border-color: #a666ff; }
    .diamond__large .diamond__icon {
      width: 45px;
      height: 45px; }
  .diamond--house {
    background-color: #135671; }
  .diamond--celltower {
    background-color: #833755; }
  .diamond--generator {
    background-color: #388574; }
  .diamond--run, .diamond--plus {
    border: solid 3px; }
    .theme-d3a .diamond--run, .theme-d3a .diamond--plus {
      background-color: #3a657f;
      border-color: #35d7c6; }
    .theme-verbund .diamond--run, .theme-verbund .diamond--plus {
      background-color: #3a657f;
      border-color: #35d7c6; }
    .theme-d3a .diamond--run .diamond__icon svg, .theme-d3a .diamond--plus .diamond__icon svg {
      fill: #35d7c6; }
    .theme-verbund .diamond--run .diamond__icon svg, .theme-verbund .diamond--plus .diamond__icon svg {
      fill: #35d7c6; }
    .diamond--run:hover, .diamond--run.diamond--active, .diamond--plus:hover, .diamond--plus.diamond--active {
      border: solid 3px; }
      .theme-d3a .diamond--run:hover, .theme-d3a .diamond--run.diamond--active, .theme-d3a .diamond--plus:hover, .theme-d3a .diamond--plus.diamond--active {
        background-color: #3a657f;
        border-color: #a666ff; }
      .theme-verbund .diamond--run:hover, .theme-verbund .diamond--run.diamond--active, .theme-verbund .diamond--plus:hover, .theme-verbund .diamond--plus.diamond--active {
        background-color: #3a657f;
        border-color: #a666ff; }
      .theme-d3a .diamond--run:hover .diamond__icon svg, .theme-d3a .diamond--run.diamond--active .diamond__icon svg, .theme-d3a .diamond--plus:hover .diamond__icon svg, .theme-d3a .diamond--plus.diamond--active .diamond__icon svg {
        fill: #a666ff; }
      .theme-verbund .diamond--run:hover .diamond__icon svg, .theme-verbund .diamond--run.diamond--active .diamond__icon svg, .theme-verbund .diamond--plus:hover .diamond__icon svg, .theme-verbund .diamond--plus.diamond--active .diamond__icon svg {
        fill: #a666ff; }
