.row.block-service {
  color: #fff;
  font-size: 14px;margin-top: -30px;
}
 .col-lg-3.service{margin-bottom: 20px;}
  address.tel-mobile {
    display:block!important;
    padding: 20px 0;
    color:#fff;
    font-style: normal;
    font-size:16px; font-family: 'Montserrat-Bold';
  }
  .col-lg-3.service {
  z-index: 2;
}

  .col-lg-3.service p{
    /* color: #8288a3; */
    /* padding-top: 10px; */
    /* padding-bottom: 20px; */
    font-style: italic;
    font-weight: normal;
    font-size: 17px;
    /* padding-top: 80%; */
    color: #fff!important;

}

.list-box.d-flex.align-items-center img{float: left;
  margin-right: 30px;}

.row.block-service {
  color: #fff;
  font-size: 14px;margin-top: -30px;
}

.list-box.d-flex.align-items-center {
display: block;
    border: 1px solid #0047ba;
    background-color: #0047ba;
    border-radius: 12px;
    min-height: 92px;
}

.list-box.d-flex.align-items-center:hover{background: #76b515;}


#categories{
  overflow:hidden;
  width:100%;
  margin:0 auto;
  margin-bottom: 80px;
}
#categories a{
 text-decoration: none;
    display: contents;
}
.clr:after{
  content:"";
  display:block;
  clear:both;
}


#categories li{
  position:relative;
  list-style-type:none;
  float:left;

  transform: rotate(-60deg) skewY(30deg);
}
#categories li *{
  position:absolute;
  visibility:visible;
}
#categories li > div{
  width:100%;
  height:100%;
  text-align:center;
  color:#fff;
  overflow:hidden;
  transform: skewY(-30deg) rotate(60deg);  

  
}

/* HEX CONTENT */
#categories li img{
  left:-100%; right:-100%;
  width: auto; height:100%;
  margin:0 auto;   
  position: fixed;
}

#categories div h6, #categories div p{
width: 100%;
    padding: -9px 5%;

    font-family: 'Raleway', sans-serif;
    transition: top .2s ease-out, bottom .2s ease-out, .2s padding .2s ease-out;

    margin-top: -19%;
}
#categories li h6{
    font-style: italic;
    font-weight: normal;
    font-size: 24px;
    padding-top: 80%;

    color: #fff!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
}
#categories li h6:after{
content: '';
    display: block;
    position: absolute;
    bottom: 8px;
    left: 44%;
    width: 10%;
    text-align: center;
    z-index: 1;

}
#categories li p{
	top: 47%;

	    font-style: italic;
    font-weight: normal;
    font-size: 35px;
  

    color: #76b515!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
	
}
#categories li sub{
    position: relative;
	
}


/* HOVER EFFECT  */

#categories li div:hover h6 {


}

#categories li div:hover p{
  top:50%;
  padding-top:10%;
}
@media (min-width:1201px) {
  #categories li{
    width:17.364%; /* = (100-4.5) / 5.5 */
    padding-bottom: 20.05%; /* =  width /0.866 */
  }
  #categories li:nth-child(10n+6), #categories li:nth-child(10n+7), #categories li:nth-child(10n+8), #categories li:nth-child(10n+9), #categories li:nth-child(10n+10) {
    margin-top: -4.2%;
    margin-bottom: -4.2%;
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
  }
  #categories li:nth-child(10n+6):last-child, #categories li:nth-child(10n+7):last-child, #categories li:nth-child(10n+8):last-child, #categories li:nth-child(10n+9):last-child, #categories li:nth-child(10n+10):last-child{
    margin-bottom:0;
  }
  #categories li:nth-child(10n+6){
    margin-left:0.5%;
  }
  #categories li:nth-child(5n+2) {
    margin-left:1%;
    margin-right:1%;
  }
  #categories li:nth-child(5n+3),#categories li:nth-child(5n+4){
    margin-right:1%;
  }
}


@media (max-width: 1200px) and (min-width:901px) {
  #categories li{
    width:21.444%; /* = (100-3.5) / 4.5 */
    padding-bottom: 24.763%; /* =  width /0.866 */
  }
  #categories li:nth-child(8n+5), #categories li:nth-child(8n+6), #categories li:nth-child(8n+7), #categories li:nth-child(8n+8) {
    margin-top: -5.298%;
    margin-bottom: -5.298%;
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
  }
  #categories li:nth-child(8n+5):last-child, #categories li:nth-child(8n+6):last-child, #categories li:nth-child(8n+7):last-child, #categories li:nth-child(8n+8):last-child{
    margin-bottom:0;
  }
  #categories li:nth-child(8n+5){
    margin-left:0.5%;
  }
  #categories li:nth-child(4n+2) {
    margin-left:1%;
    margin-right:1%;
  }
  #categories li:nth-child(4n+3){
    margin-right:1%;
  }
  
  #categories li h6{
    font-style: italic;
    font-weight: normal;
    font-size: 21px;
    padding-top: 80%;

    color: #fff!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
}
#categories li h6:after{
content: '';
    display: block;
    position: absolute;
    bottom: 8px;
    left: 44%;
    width: 10%;
    text-align: center;
    z-index: 1;

}
#categories li p{
	top: 43%;

	    font-style: italic;
    font-weight: normal;
    font-size: 31px;
  

    color: #76b515!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
	
}
}

@media (max-width: 900px) and (min-width:601px) {
  #categories li{
    width:27.857%; /* = (100-2.5) / 3.5 */
    padding-bottom: 32.168%; /* =  width /0.866 */
  }
  #categories li:nth-child(6n+4), #categories li:nth-child(6n+5), #categories li:nth-child(6n+6) {
    margin-top: -7.322%;
    margin-bottom: -7.322%;
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
  }
  #categories li:nth-child(6n+4):last-child, #categories li:nth-child(6n+5):last-child, #categories li:nth-child(6n+6):last-child{
    margin-bottom:0;
  }
  #categories li:nth-child(6n+4){
    margin-left:0.5%;
  }
  #categories li:nth-child(3n+2) {
    margin-left:1%;
    margin-right:1%;
  }
  #categories li h6{
    font-style: italic;
    font-weight: normal;
    font-size: 15px;
    padding-top: 80%;

    color: #fff!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
}
#categories li h6:after{
content: '';
    display: block;
    position: absolute;
    bottom: 8px;
    left: 44%;
    width: 10%;
    text-align: center;
    z-index: 1;

}
#categories li p{
	top: 43%;

	    font-style: italic;
    font-weight: normal;
    font-size: 20px;
  

    color: #76b515!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
	
}
}
@media (max-width: 600px) {
  #categories li{
    width:39.4%; /* = (100-1.5) / 2.5 */
    padding-bottom: 45.496%; /* =  width /0.866 */
  }
  #categories li:nth-child(4n+3), #categories li:nth-child(4n+4){
    margin-top: -10.392%;
    margin-bottom: -10.392%;
    transform: translateX(50%) rotate(-60deg) skewY(30deg);
  }
  #categories li:nth-child(4n+3):last-child, #categories li:nth-child(4n+4):last-child{
    margin-bottom:0;
  }
  #categories li:nth-child(4n+3){
    margin-left:0.5%;
  }
  #categories li:nth-child(2n+2) {
    margin-left:1%;
	
  }
  
  #categories li h6{
    font-style: italic;
    font-weight: normal;
    font-size: 19px;
    padding-top: 70%;

    color: #fff!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
}
#categories li h6:after{
content: '';
    display: block;
    position: absolute;
    bottom: 8px;
    left: 44%;
    width: 10%;
    text-align: center;
    z-index: 1;

}
#categories li p{
	top: 33%;

	    font-style: italic;
    font-weight: normal;
    font-size: 19px;
  

    color: #76b515!important;
    text-shadow: 1px 0 1px #0047ba, 0 1px 1px #0047ba, -1px 0 1px #0047ba, 0 -1px 1px #0047ba;
    font-family: Impact, Charcoal, sans-serif;
	
}
  
}
#fork{
  position:fixed;
  bottom:0;
  right:0;
  color:#000;
  text-decoration:none;
  border:1px solid #000;
  padding:.5em .7em;
  margin:1%;
  transition: color .5s;
  overflow:hidden;
}
#fork:before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 130%; height: 100%;
  background: #000;
  z-index: -1;
  transform-origin:0 0 ;
  transform:translateX(-100%) skewX(-45deg);
  transition: transform .5s;
}
#fork:hover {
  color: #fff;
}
#fork:hover:before {
  transform: translateX(0) skewX(-45deg);
}