.dashboard .icon-setting {
  color:#fff;
  font-size:x-large
  }
  .dashboard .icon-div {
  position:absolute;
  right:10px;
  top:15px;
  color:#fff;
  justify-content:center;
  align-items:center;
  flex-direction:row;
  display:flex;
  margin:auto
  }
  .dashboard #particles-js {
  height:calc(100vh - 10px);
  position:absolute;
  width:100vw
  }
  .dashboard .footer-content {
  background:#12880c;
  color:#fcfcfc;
  font-weight:700;
  height:50px;
  line-height:50px;
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  padding-left:15px;
  padding-right:15px
  }
  .dashboard .home {
  overflow:auto;
  height:calc(100vh - 50px);
  background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(/static/web/images/bg_login.png) no-repeat center bottom;
  background-size:cover;
  }
  .dashboard .home #hexGrid {
  overflow:hidden;
  width:85%;
  margin:0 auto;
  padding:3rem 0 6%
  }
  .dashboard .home #hexGrid:after {
  content:"";
  display:block;
  clear:both
  }
  .dashboard .home .hex {
  position:relative;
  list-style-type:none;
  float:left;
  overflow:hidden;
  visibility:hidden;
  transform:rotate(-60deg) skewY(30deg)
  }
  .dashboard .home .hex * {
  position:absolute;
  visibility:visible
  }
  .dashboard .home .hexIn {
  display:block;
  width:100%;
  height:100%;
  text-align:center;
  color:#fcfcfc;
  overflow:hidden;
  transform:skewY(-30deg) rotate(60deg);
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden
  }
  .dashboard .home .hexIn.disable {
    cursor: not-allowed;
  pointer-events: none;
  opacity: 0.7;
  background: #bbb;
  }
  .dashboard .home img.brand-image {
  width:70px;
  float:left;
  margin-left:35%
  }
  .dashboard .home .title-header {
  text-align:center;
  background-color:#12880c;
  padding:16px;
  font-size:17px;
  font-weight:500;
  color:#fcfcfc
  }
  .dashboard .home .hex img {
  left:-100%;
  right:-100%;
  width: 50%;
  height: 43%;
  top:25%;
  margin:0 auto;
  border:1px solid #12880c;
  border-radius:138px;
  background-color:#fff
  }
  .dashboard .home .hex a {
  background:#149d39
  }
  .dashboard .home .hex h4 {
  top:70%;
  width:100%;
  color:#fff;
  font-weight:400;
  font-size: 16px;
  padding: 0 10px;
  line-height: 20px;
  }
  .dashboard .home .hex h4 .hex p {
  top:70%;
  width:100%;
  color:#fff;
  display:none
  }
  .dashboard .home .hex h1,
  .dashboard .home .hex p {
  width:90%;
  padding:0 5%;
  width:100%;
  color: #fff;
  background-color:#0a7928;
  font-family:Raleway,sans-serif;
  transition:top .2s ease-out,bottom .2s ease-out,padding .2s ease-out .2s
  }
  .dashboard .home .hex h1 {
  bottom:110%;
  font-style:italic;
  font-weight:400;
  font-size:1.5em;
  padding-top:100%;
  padding-bottom:100%
  }
  .dashboard .home .hex h1:after {
  content:"";
  display:block;
  position:absolute;
  bottom:-1px;
  left:45%;
  width:10%;
  text-align:center;
  z-index:1;
  border-bottom:2px solid #fff
  }
  .dashboard .home .hex p {
  padding-top:50%;
  top:110%;
  padding-bottom:50%
  }
  /* .dashboard .home .hexIn:hover img{
    scale: 1.2;
  } */
  .dashboard .home .hexIn:hover h1 {
  padding-bottom:10%;
  margin-bottom:-70%
  }
  .dashboard .home .hexIn:hover p {
  top:50%;
  padding-top:10%
  }
  .dashboard .home a.hexIn:hover > h4 {
  display:none
  }
  @media (min-width:1201px) {
  .dashboard .home .hex-5 .hex {
  width:19.2%;
  padding-bottom:22.17%
  }
  .dashboard .home .hex-5 .hex:nth-child(9n+6),
  .dashboard .home .hex-5 .hex:nth-child(9n+7),
  .dashboard .home .hex-5 .hex:nth-child(9n+8),
  .dashboard .home .hex-5 .hex:nth-child(9n+9) {
  margin-top:-4.676%;
  margin-bottom:-4.676%;
  transform:translateX(50%) rotate(-60deg) skewY(30deg)
  }
  .dashboard .home .hex-5 .hex:nth-child(9n+6):last-child,
  .dashboard .home .hex-5 .hex:nth-child(9n+7):last-child,
  .dashboard .home .hex-5 .hex:nth-child(9n+8):last-child,
  .dashboard .home .hex-5 .hex:nth-child(9n+9):last-child {
  margin-bottom:0
  }
  .dashboard .home .hex-5 .hex:nth-child(9n+6) {
  margin-left:.5%;
  clear:left
  }
  .dashboard .home .hex-5 .hex:nth-child(9n+10) {
  clear:left
  }
  .dashboard .home .hex-5 .hex:nth-child(9n+2),
  .dashboard .home .hex-5 .hex:nth-child(9n+7) {
  margin-left:1%;
  margin-right:1%
  }
  .dashboard .home .hex-5 .hex:nth-child(9n+3),
  .dashboard .home .hex-5 .hex:nth-child(9n+4),
  .dashboard .home .hex-5 .hex:nth-child(9n+8) {
  margin-right:1%
  }
  .dashboard .home .hex-6 .hex {
  width:15.833%;
  padding-bottom:18.282%
  }
  .dashboard .home .hex-6 .hex:nth-child(11n+7),
  .dashboard .home .hex-6 .hex:nth-child(11n+8),
  .dashboard .home .hex-6 .hex:nth-child(11n+9),
  .dashboard .home .hex-6 .hex:nth-child(11n+10),
  .dashboard .home .hex-6 .hex:nth-child(11n+11) {
  margin-top:-3.666%;
  margin-bottom:-3.666%;
  transform:translateX(50%) rotate(-60deg) skewY(30deg)
  }
  .dashboard .home .hex-6 .hex:nth-child(11n+7):last-child,
  .dashboard .home .hex-6 .hex:nth-child(11n+8):last-child,
  .dashboard .home .hex-6 .hex:nth-child(11n+9):last-child,
  .dashboard .home .hex-6 .hex:nth-child(11n+10):last-child,
  .dashboard .home .hex-6 .hex:nth-child(11n+11):last-child {
  margin-bottom:0
  }
  .dashboard .home .hex-6 .hex:nth-child(11n+7) {
  margin-left:.5%;
  clear:left
  }
  .dashboard .home .hex-6 .hex:nth-child(11n+12) {
  clear:left
  }
  .dashboard .home .hex-6 .hex:nth-child(11n+2),
  .dashboard .home .hex-6 .hex:nth-child(11n+8),
  .dashboard .home .hex-6 .hex:nth-child(11n+10) {
  margin-left:1%;
  margin-right:1%
  }
  .dashboard .home .hex-6 .hex:nth-child(11n+3),
  .dashboard .home .hex-6 .hex:nth-child(11n+4),
  .dashboard .home .hex-6 .hex:nth-child(11n+5) {
  margin-right:1%
  }
  }
  @media (max-width:1200px) and (min-width:901px) {
  .dashboard .home .hex {
  width:24.25%;
  padding-bottom:28.001%
  }
  .dashboard .home .hex:nth-child(7n+5),
  .dashboard .home .hex:nth-child(7n+6),
  .dashboard .home .hex:nth-child(7n+7) {
  margin-top:-6.134%;
  margin-bottom:-6.134%;
  transform:translateX(50%) rotate(-60deg) skewY(30deg)
  }
  .dashboard .home .hex:nth-child(7n+5):last-child,
  .dashboard .home .hex:nth-child(7n+6):last-child,
  .dashboard .home .hex:nth-child(7n+7):last-child {
  margin-bottom:0
  }
  .dashboard .home .hex:nth-child(7n+2),
  .dashboard .home .hex:nth-child(7n+6) {
  margin-left:1%;
  margin-right:1%
  }
  .dashboard .home .hex:nth-child(7n+3) {
  margin-right:1%
  }
  .dashboard .home .hex:nth-child(7n+8) {
  clear:left
  }
  .dashboard .home .hex:nth-child(7n+5) {
  clear:left;
  margin-left:.5%
  }
  }
  @media (max-width:900px) and (min-width:601px) {
  .dashboard .home .hex {
  width:32.666%;
  padding-bottom:37.72%
  }
  .dashboard .home .hex:nth-child(5n+4),
  .dashboard .home .hex:nth-child(5n+5) {
  margin-top:-8.564%;
  margin-bottom:-8.564%;
  transform:translateX(50%) rotate(-60deg) skewY(30deg)
  }
  .dashboard .home .hex:nth-child(5n+4):last-child,
  .dashboard .home .hex:nth-child(5n+5):last-child {
  margin-bottom:0
  }
  .dashboard .home .hex:nth-child(5n+4) {
  margin-right:1%;
  margin-left:.5%
  }
  .dashboard .home .hex:nth-child(5n+2) {
  margin-left:1%;
  margin-right:1%
  }
  .dashboard .home .hex:nth-child(5n+6) {
  clear:left
  }
  }
  @media (max-width:600px) {
  .dashboard .home .hex {
  width:49.5%;
  padding-bottom:57.158%
  }
  .dashboard .home .hex:nth-child(3n+3) {
  margin-top:-13.423%;
  margin-bottom:-13.423%;
  transform:translateX(50%) rotate(-60deg) skewY(30deg)
  }
  .dashboard .home .hex:nth-child(3n+3):last-child {
  margin-bottom:0
  }
  .dashboard .home .hex:nth-child(3n+3) {
  margin-left:.5%
  }
  .dashboard .home .hex:nth-child(3n+2) {
  margin-left:1%
  }
  .dashboard .home .hex:nth-child(3n+4) {
  clear:left
  }
  .dashboard .home .title-header {
  padding:16px 20px
  }
  }
  .dashboard #gif-map {
  position:absolute;
  cursor:pointer;
  top:5px;
  right:35px;
  width:100px
  }
  @-webkit-keyframes animate-map {
  0% {
  right:calc(50vw - 1px);
  top:calc(50vh - 1px);
  width:2px;
  height:2px
  }
  25% {
  right:calc(50vw - 200px);
  top:calc(50vh - 200px);
  width:400px;
  height:400px
  }
  50% {
  right:calc(50vw - 200px);
  top:calc(50vh - 200px);
  width:400px;
  height:400px;
  transform:rotate(1turn)
  }
  75% {
  right:calc(50vw - 200px);
  top:calc(50vh - 200px);
  width:400px;
  height:400px;
  transform:rotate(1turn)
  }
  to {
  right:20px;
  top:5px;
  width:100px;
  height:100px
  }
  }
  @keyframes animate-map {
  0% {
  right:calc(50vw - 1px);
  top:calc(50vh - 1px);
  width:2px;
  height:2px
  }
  25% {
  right:calc(50vw - 200px);
  top:calc(50vh - 200px);
  width:400px;
  height:400px
  }
  50% {
  right:calc(50vw - 200px);
  top:calc(50vh - 200px);
  width:400px;
  height:400px;
  transform:rotate(1turn)
  }
  75% {
  right:calc(50vw - 200px);
  top:calc(50vh - 200px);
  width:400px;
  height:400px;
  transform:rotate(1turn)
  }
  to {
  right:20px;
  top:5px;
  width:100px;
  height:100px
  }
  }
  