
.grid-1, .grid-2,
.grid-3, .grid-4,
.grid-5, .grid-6,
.grid-7, .grid-8,
.grid-9, .grid-10,
.grid-11, .grid-12,
.grid-13, .grid-14,
.grid-15, .grid-16 {
  float: left;
  display: inline;
  margin-left: 5px;
  margin-right: 5px;
  position: relative;
}


.list-hex-grid {
  margin-top: 55px;
  margin-bottom: 55px;
  font-size: 0px;
  word-spacing: 1px;
  word-spacing: 0;
}


.list-hex-grid img {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  vertical-align: top;
}

.list-hex-grid div.hex {
  font-size: 16px;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  margin-top: 37px;
  margin-bottom: 37px;
  float: none;
  position: relative;
  z-index: 10;
}
/*HEADER ALIGNMENT*/
.list-hex-grid div.hex .inner {
  top: -55px;
}




.list-hex-grid div.hex > a,
.list-hex-grid div.hex > div {
  font-size: 18px;
  word-spacing: 1px;
  -webkit-transition: none 1s;
  -moz-transition: none 1s;
  -o-transition: none 1s;
  transition: none 1s;
  background-color: whitesmoke;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  -webkit-background-size: auto 220px;
  -moz-background-size: auto 220px;
  -o-background-size: auto 220px;
  background-size: auto 220px;
  text-align: center;
  display: block;
  border: none;
  color: #fff;
  -webkit-backface-visibility: hidden;
}


.list-hex-grid div.hex .inner {
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  zoom: 1;
  *display: inline;
  white-space: normal;
  z-index: 20;
  position: relative;
  max-width: 80%;
  color: #fff !important;
  font-family: "freightsans_regular", sans-serif;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 3px;
  line-height: 22px;
}


/* line 464, ../../../src/scss/screen.scss */
.list-hex-grid div.hex .hex-1,
.list-hex-grid div.hex .hex-2 {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -2;
  overflow: hidden;
  background: inherit;
  -webkit-backface-visibility: hidden;
}





.list-hex-grid div.hex .hex-1 {
  z-index: -1;
  -webkit-transform: rotate(60deg);
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  transform: rotate(60deg);
}

.list-hex-grid div.hex .hex-2 {
  -webkit-transform: rotate(-60deg);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -o-transform: rotate(-60deg);
  transform: rotate(-60deg);
}



.list-hex-grid div.hex .after {
  -webkit-transition: none 1s;
  -moz-transition: none 1s;
  -o-transition: none 1s;
  transition: none 1s;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 15;
  background:  #009B4E;/*green COLOR*/
}

.list-hex-grid div.hex.secondary .after {
  background-color:#095F84;/*dark blue COLOR*/
  border-color: #ee6557;
}


.list-hex-grid div.hex.tertiary .after {
  background-color: #3DA8E2;/*light blue COLOR*/
  border-color: #bfbfbf;
}



/* MARGIN AND ALIGNMENT BETWEEN HEXA */
  .list-hex-grid.large div.hex {
    margin-top: 37px;
    margin-bottom: 37px;
    width: 220px;
    margin-top: 40px;
    margin-bottom: 40px;
  }
 
 /*EDGES*/
  .list-hex-grid.large div.hex > a,
  .list-hex-grid.large div.hex > div {
    height: 127px;
    line-height: 254px;
  }
  

  
  /*FONT AND SIZE OF HEADER*/
  .list-hex-grid.large div.hex > a,
  .list-hex-grid.large div.hex > div {
    font-size: 16px;
	
    -webkit-background-size: auto 260px;
    -moz-background-size: auto 260px;
    -o-background-size: auto 260px;
    background-size: auto 260px;
  }



 
 
 