@font-face {
	font-family: 'nantongfontblack';
	src: url('../fonts/Roboto-Black.eot');
	src: url('../fonts/Roboto-Black.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Roboto-Black.woff') format('woff'),
		url('../fonts/Roboto-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}
@font-face {
	font-family: 'nantongfontregular';
	src: url('../fonts/Roboto-Regular.eot');
	src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Roboto-Regular.woff') format('woff'),
		url('../fonts/Roboto-Regular.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}
html{
	min-height:100%;
}
body{
	min-height: 100%;
	min-height:100%;
	font-family: nantongfontregular;
	color: #404040;
}
#wpdiv{
	background-image: url("../img/background2.jpg");
	background-image: url("../img/clouds.jpg");
	background-size: cover;
	min-height:100vh;
	width:100%;
	position:fixed;
}
#fadediv{
/*
	background: #d0d0d0d0;
*/
/*    background: linear-gradient(rgba(32, 32, 32, 0.35),rgba(0, 0, 0, 0));*/
	min-height: 100%;
	width: 100%;
	position:absolute;
}
.breadcrumbtrail{
	margin-bottom:1em;
}
h1{
    font-family: nantongfontblack;
	font-size: 2.5em;
	color: #00b57b;
	margin-bottom: 0.5em;
}
h2{
	font-family: nantongfontblack;
	font-size: 2.1em;
	color: #00b57b;
	margin-bottom: 0.5em;
}
h3{
	font-size: 1.5em;
	color: #00b57b;
	margin-top: 1em;
	margin-bottom: 0.5em;
}
#maindiv{
	background: #808080;
	margin: auto;
	margin-top: 16px;
	margin-bottom: 32px;
	border-radius: 32px 192px 32px 128px;
	width: 1024px;
	overflow: hidden;
	box-shadow: 0px 16px 25px -20px #404040;
}

#maindiv p{
	margin-bottom: 0.5em;
}
#logodiv{
	box-sizing: border-box;
	height:128px;
	padding:16px;
	background: white;
}
#toplogo{
	width:auto;
	height:100%;
	padding:16px;
	box-sizing: border-box;
	animation-name: fadein;
	animation-duration: 2.5s;
	animation-delay:0.5s;
	animation-fill-mode: backwards;
}
@keyframes fadein{
	0%{opacity: 0}
	100%{opacity: 1}
}
#logodiv a:hover{
	background:none;
}
#menusdiv li{
	display:inline-block;
	color:white;
	line-height:32px;
	transition: 0.3s;
	cursor:pointer;
}
#menusdiv a{
	color:inherit;
	padding-left:8px;
	padding-right:8px;
}
#mainmenudiv{
	padding-left: 48px;
	box-sizing: border-box;
	height:32px;
	background:#808080;
	font-family: nantongfontblack;
	font-size: 1.2em;
	background-image: url("../img/bgfadegrey.png");
	background-size: 1024px 128px;
}
#submenudiv{
	padding-left: 48px;
	box-sizing: border-box;
	height:32px;
	background:#00b57b;
	font-family: nantongfontregular;
	font-size: 1em;
	background-image: url("../img/bgfadegreen.png");
	background-size: 1024px 128px;
	background-position: 0 -32px;
}
#productsmenumg{
	padding-left: 48px;
	box-sizing: border-box;
	height:32px;
	background:#15855e;
	font-family: nantongfontregular;
	font-size: 1em;
	background-image: url("../img/bgfadegreen.png");
	background-size: 1024px 128px;
	background-position: 0 -64px;
}
#productsmenupgp{
	padding-left: 48px;
	box-sizing: border-box;
	height:32px;
	background:#15855e;
	font-family: nantongfontregular;
	font-size: 1em;
	background-image: url("../img/bgfadegreen.png");
	background-size: 1024px 128px;
	background-position: 0 -64px;
}
#menusdiv li:hover{
	box-shadow: 0px 0px 5px #808080;
}
#menusdiv ul li a:hover{
	background: none;
	color:inherit;
}
#mainmenudiv li:hover{
	background: white;
	color:#00b57b;
}
#submenudiv li:hover{
	background:white;
	color:#00b57b;
}
#submenudiv li{
	cursor: pointer;
}
#productsmenumg li:hover{
	background: white;
	color:#00b57b;
}
#productsmenupgp li:hover{
	background: white;
	color:#00b57b;
}
.submenuitem {
	display: inline-block;
	padding-left:8px;
	padding-right:8px;
	
}
#mainmenudiv ul li a{
	display:inline-block;
	animation-name: menufadein;
	animation-duration: 0.5s;
	animation-fill-mode: backwards;
}
#submenudiv ul li a{
	display:inline-block;
	animation-name: menufadein;
	animation-duration: 0.5s;
	animation-fill-mode: backwards;
}
@keyframes menufadein{
	0% {opacity: 0; transform:translateY(-16px);}
	100% {opacity: 1; transform:translateY(0);}
}
.menu1a{animation-delay:0.1s;}
.menu1b{animation-delay:0.2s;}
.menu1c{animation-delay:0.3s;}
.menu2a{animation-delay:0.4s;}
.menu2b{animation-delay:0.5s;}
.menu2c{animation-delay:0.6s;}

#greycontainer{
	box-sizing: border-box;
	width:100%;
	border-left: 16px;
	border-top: 0px;
	border-bottom: 0px;
	border-right: 0px;
	border-style: solid;
	border-color: #808080;
}
#contentdiv{
	box-sizing: border-box;
	width: 100%;
	border-left: 16px;
	border-top: 0px;
	border-bottom: 16px;
	border-right: 0px;
	border-style: solid;
	border-color: #00b57b;
	border-bottom-left-radius:32px;
	background: white;
	padding: 48px;
	overflow:hidden;
}
#pagefooterdiv{
	background: #808080;
	background-image: url("../img/bgfadegrey.png");
	background-size: 1024px 128px;
	color:white;
	height: 128px;
	text-align:center;
	display:flex;justify-content:center;align-items:center;
}
#contentdivfrontpage{
	box-sizing: border-box;
	width: 100%;
	border-left: 16px;
	border-top: 0px;
	border-bottom: 16px;
	border-right: 0px;
	border-style: solid;
	border-color: #00b57b;
	height:100%;
	border-bottom-left-radius:32px;
	background: white;
	overflow:hidden;
}
#frontpagemaincontent{
	width:100%;
	height:50vmin;
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr;
	grid-template-areas: "mgc pgp";
	grid-gap:0.5vw;
	background:white;
	border: solid white 0.5vw;
	box-sizing: border-box;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}
.frontpageclicker{
	height:100%;
	background-size: cover;
	background-position: center;
	text-align:center;
	vertical-align: middle;
	display:flex;
	justify-content:center;
	align-items:center;
}
.frontpageclicker:hover{
	background-size: cover;
	background-position: center;
	background-blend-mode: luminosity;
}
#clicker-molded-grating{
	grid-area: mgc;
	background-image:url("../img/molded-grating.jpg");
}
#clicker-pultruded-grating-and-profiles{
	grid-area: pgp;
	background-image:url("../img/pultruded2.jpg");
}
#description-molded-grating{grid-area: mgd}
#description-pultruded-grating{grid-area: pgd}
#description-pultruded-profiles{grid-area: ppd}
h4{
    font-family: nantongfontregular;
	font-size: 2.5em;
	color:white;
	text-shadow: 0 0.1em 0.3em black;
}
h6{
    font-family: nantongfontregular;
	font-size:0.85em;
	color:#005236;
	margin-bottom: 0.5em;
}
.certificategallery{
	grid-template-columns: 1fr 1fr 1fr 1fr;
	background:#96d4c0;
	display:grid;
	grid-row-gap: 1em;
	grid-column-gap: 2%;
	padding: 2%;
	box-sizing: border-box;
	border: solid 2px #808080;
}
.certificategalleryitem{
	min-height:200px;
}
.certificategalleryitemthumb{
	max-width:100%;
	max-height:100%;
	box-sizing: border-box;
	border: solid 2px #808080;
}
a,a:hover,a:visited,a:link,a:active{
	color:#00b57b;
	text-decoration: none;
}
a:hover{
	background:#00b57b;
	color:white;
}
.whatnextbox{
	margin-top:2em;
	background:#EEEEEE;
	padding:1em;
	border-radius: 1em;
}
h5{
	font-family: nantongfontblack;
	margin-bottom: 0.5em;
}
.button{
	display:inline-block;
	line-height:1.75em;
	/* height:1.75em; */
	text-align:center;
	background:#00b57b;
	color:white;
	border-top-left-radius: 0.5em;
	border-bottom-left-radius: 1em;
	border-bottom-right-radius: 0.5em;
	border-top-right-radius: 1em;
	padding-left:1em;
	padding-right:1em;
	margin-right:1em;
	margin-bottom:0.25em;

}
.button,.button:hover,.button:visited,.button:link,.button:active{
	color:white;
}
.button:hover{
	background:#005236;
}
.bulletpointlist{
	/* padding-left: 17em; */
}
.bulletpointlist li::before{
	content: "● ";
}
.leftimagecol,.rightimagecol{
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 1em;
	background: #EEEEEE;
	width:400px;
	border-radius: 1.5em;
	box-sizing: border-box;
	padding:1em;
}
.leftimagecol{
	float:left;
	margin-right:2em;
}
.rightimagecol{
	float:right;
	margin-left:2em;
}
.leftimagecol img{
	border-radius: 0.5em;
	border: none;
	width:100%;
}
.rightimagecol img{
	border-radius: 0.5em;
	border: none;
	width:100%;
}
.contentimage{
	border: solid 2px #808080;
	max-width:100%;
	display:block;
    box-sizing: border-box;
}
.photofloatright{
	float:right;
	margin-left:1em;
	margin-bottom:0.3em;
}
.photofloatleft{
	float:left;
	margin-right:1em;
	margin-bottom:0.3em;
}
.photow5{width:5%;}
.photow10{width:10%;}
.photow15{width:15%;}
.photow20{width:20%;}
.photow25{width:25%;}
.photow30{width:30%;}
.photow35{width:35%;}
.photow40{width:40%;}
.photow45{width:45%;}
.photow50{width:50%;}
.photow55{width:55%;}
.photow60{width:60%;}
.photow65{width:65%;}
.photow70{width:70%;}
.photow75{width:75%;}
.photow80{width:80%;}
.photow85{width:85%;}
.photow90{width:90%;}
.photow95{width:95%;}
.photow100{width:100%;}
#pdcredit{
	display:block;
	background:#CCCCCC;
	padding:0.5em;
	margin:1em;
	border-radius: 0.75em;
	/* box-shadow: 0px 8px 25px -10px #404040; */
}
#pdcredit h6{
	margin:0;
	padding:0;
}
.centeriser,.centraliser{
	display:flex;
	justify-content:center;
	align-items:center;
}
.sidebox{
	float:right;
	background:#CCCCCC;
	padding:1em;
	border-radius: 1.5em;
	width:120px;
	margin-left:1em;
}
.sidebox nav{
	display:grid;
	grid-template-columns: 1fr;
	grid-gap: 1em;

}
.sideboxitem{
	width:100%;
}
.sidebox .sideboxitem .sideboxitemimage{
	border-radius: 0.5em;
	width:100%;
}
.sidebox a{
	border-radius:0.5em;
}
.sideboxitemtext{
	text-align: center;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
.photoanddescriptiongrid{
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-gap: 1em;
}
.photoanddescriptiongrid img{
	width:100%;
}
.photoanddescriptiongrid h3{
	margin-top:0;
}
.photoonlygrid{
	display:grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 1em;
}
.photoonlygrid img{
	width:100%;
}
td{
	padding:0.45em;
}
td h5{
	margin:0;
	padding:0;
}
.contactdetailstable{
	background:#EEEEEE;
	border-radius: 1em;
	margin-top: 1em;
	margin-bottom: 1em;
	padding: 1em;
}
#contactformarea{
	background:#15855e;
	color:white;
	margin-bottom:1em;
	border-radius: 1em;
	padding:1em;
}
.inputbox{
	width:300px;
}
.contactform{
	display: grid;
	grid-template-columns: auto 1fr;
	grid-gap:0.5em;
}
.contactform input,.contactform textarea{
	color:black;
	font-family: nantongfontregular;
	font-size: 0.9em;
}
.specstable{
  text-align: center;
}
.specstable .sth{
  color:white;
}
.specstable .sth1{
  background: #15855e;
}
.specstable .sth2{
  background: #399877;
}
.specstable .sth3{
  background: #4bad8b;
}
.specstable tbody tr:nth-child(even){
  background:#e1fff5;
}
.specstable tbody tr:nth-child(odd){
  background:#cbeae0;
}
.specstableoutergrid{
  display:grid;
  background:#15855e;
  grid-template-columns: 1fr auto;
  grid-gap: 2px;
  padding:2px;
  margin-bottom: 2.5em;
} 
.profiles-pic-area{
  background:#e1fff5;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0.5em;
}
.profiles-pic{
  max-width:100%;
  margin-bottom: 0.5em;
  box-sizing: border-box;
}
.profiles-pic-area h5{
  text-align: center;
  font-size: 2em;
  padding-top:1em;
  padding-bottom: 1em;
}
.standalonespecstable{
  border: 2px solid #15855e;
}
.specstable td{
  padding:0.15em;
}
article{
  margin-bottom: 2em;
}
#frontpageshorttext{
  text-align: center;
  font-style: italic;
  font-size: 1.5em;
  font-family: nantongfontregular;
  font-weight: normal;
  padding-top:0.5em;
  padding-bottom: 0.5em;
}