html{font-family:sans-serif;font-size:12pt;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
.content {width:100%; margin: auto;}
h2 img{vertical-align:middle; margin:10px;}
.hex .content-field p {margin-top:-0.8em}
.hex {width:220px;}
.hex .grid-field img {width:100%; }
.hexLink {text-decoration:none;color:#333333}
.grid-field {
clip-path: polygon(75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%, 25% 0);}
.hex .content-field{overflow:wrap;font-size:0.9em;
  width:68%;
  position: relative;
   left:50%;
  transition: .5s ease;
  opacity:0;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;}
.hex:hover img {
  opacity: 0.3;
}
.hex:hover .content-field {
  opacity: 1;
}
@media screen and (min-width: 1401px) {
.rowHex {display: flex; align-items: top; justify-content: center;}
.hex {margin-left:-50px}
.hex .content-field{position:relative;top:-110px;}
.rowHex .hex:nth-of-type(2),.rowHex .hex:nth-of-type(4){position:relative;top:100px;}
}
@media screen and (min-width: 1201px) and (max-width:1400px) {
.rowHex {display: flex; align-items: top; justify-content: center;}
.hex {margin-left:-50px}
.hex .content-field{position:relative;top:-110px;}
.rowHex .hex:nth-of-type(2),.rowHex .hex:nth-of-type(4){position:relative;top:100px;}

}

@media screen and (min-width: 960px) and (max-width:1200px) {
.rowHex {display: flex; align-items: top; justify-content: center;}
.hex {margin-left:-50px}
.hex .content-field{position:relative;top:-110px}
.rowHex .hex:nth-of-type(2),.rowHex .hex:nth-of-type(4){position:relative;top:95px;}
}

@media screen and (max-width: 959px) {
a{
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 -webkit-tap-highlight-color: transparent;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
  user-select: none;
	}
}

@media screen and (min-width: 569px)and (max-width: 959px) {
.cicleGestio{position:relative;top:-460px!important}
.content{}
.rowHex {display: block; align-items: top;margin-left:10%}
.hex {width:15%;height:175px;}
.hex:nth-of-type(2){position:relative;top:-90px}
.hex:nth-of-type(3){position:relative;top:-180px}
.hex:nth-of-type(4){position:relative;top:-270px}
.hex:nth-of-type(5){position:relative;top:-360px}
.hex .content-field {
  width:500%;height:100%;
  position: relative;
   left:380%;
   top:0px;
  opacity:1;
}
	.hex .content-field h2 {font-size:2.5vw}

}
@media screen and (min-width: 376px)and (max-width: 568px) {
.cicleGestio{position:relative;top:-460px!important}
.content{font-size:3vw;}
.rowHex {display: block; align-items: top;margin-left:10%}
.hex {width:25%;height:175px;}
.hex:nth-of-type(2){position:relative;top:-90px}
.hex:nth-of-type(3){position:relative;top:-180px}
.hex:nth-of-type(4){position:relative;top:-270px}
.hex:nth-of-type(5){position:relative;top:-360px}
.hex .content-field {
  width:200%;height:100%;
  position: relative;
   left:200%;
   top:-20px;
  opacity:1;}
.hex h2 {font-size:2.5vw;}


}

@media screen and (max-width: 375px) {
.cicleGestio{position:relative;top:-480px!important}
.content{font-size:3vw;}
.rowHex {display: block; align-items: top;margin-left:2%}
.hex {font-size:3.8vw; width:23%;height:175px;}
.hex:nth-of-type(2){position:relative;top:-100px}
.hex:nth-of-type(3){position:relative;top:-200px}
.hex:nth-of-type(4){position:relative;top:-300px}
.hex:nth-of-type(5){position:relative;top:-400px}
.hex .content-field {
  width:320%;height:100%;
  position: relative;
   left:270%;
  opacity:1;}
.hex h2{font-size:3.3vw;  margin-top:8%;}
.hex:nth-of-type(2) h2{margin-top:10%;}

}

