/*********************** MENU ******************************************/
body.showm {
	overflow:										hidden;
}
#menu {
	display:										flex;
	width:											100%;
	background:										rgb(71 122 123 / 75%);
	overflow:										hidden;
	height:											0px;
	position:										absolute;
    z-index:										1000;
	transition:										0.4s;
}
#menu.open {
	height:											100%;
	max-height:										100%;
	transition:										0.8s;
}
.sm div  {
	height:											0;
	overflow:										hidden;
	transition:										0.4s;
}
.mp ul div  {
	height:											0;
	overflow:										hidden;
	transition:										0.4s;
}
.mp ul.open div {
	height:											auto;
	transition:										0.4s;
}
#mp1 .opensm div.sm, #mp2 .opensm div.sm, #mp2 .opensm div.sm, #mp3 .opensm div.sm, #mp4 .opensm div.sm, #mp5 .opensm div.sm, #mp9 .opensm div.sm {
	height:											auto;
	transition:										0.4s;
}
#mps .opensm div.sm {
	height:											auto;
	transition:										0.4s;
}
#m1.opensm div ul.sm div.sm {
	height:											auto;
}
#menu .mp {
	height:											100%;
}
.mp ul div.triangle, .trig div.triangle, .trig div.triangles {
	background-color:								darkgreen;
	-webkit-clip-path:								polygon(100% 50%, 0 100%, 0 0);
	clip-path:										polygon(100% 50%, 0 100%, 0 0);
	width:											15px;
	height:											15px;
	display:										inline-block;
	float:											right;
	margin-right:									30px;
	transition:										0.5s;
}
.mp ul.opensm div.triangle, .trig .mb .triangle, .trig div.triangles {
	-webkit-clip-path:								polygon(0 50%, 100% 100%, 100% 0);
	clip-path:										polygon(0 50%, 100% 100%, 100% 0);
	transition:										0.5s;
}
.mb {
	margin-top:										20px;
}
.trig .mb .triangle {
	float:											left;
	margin:											0.2em 10px 2px;
}
.outlet .triangle {
	background-color:								#;
}
.mp ul {
	list-style:										none;
	min-width:										150px;
	font-size:										1.7em;
	padding:										0;
}
#menu.open .mb .mt {
    display:										inline;
	margin:											0;
	padding:										0;
}
#menu #mp1.open, #menu #mp2.open, #menu #mp3.open, #menu #mp4.open, #menu #mp5.open, #menu #mp9.open {
	visibility:										visible;
	transform:										matrix(1, 0, 0, 1, 0, 0);
}
.mp ul li{
	text-align:										left;
	padding:										25px 0 0 20px;
}
.mp ul li.title {
	display:										block;
	color:											darkgreen;
	white-space:									nowrap;
	cursor:											pointer;
	text-align:										left;
	padding-left:									0;
	text-transform:									uppercase;
	letter-spacing:									0.05em;
}
.mp ul li a {
	text-transform:									none;
}
.mp ul li a:hover {
	font-weight:									700;
}
#m1, #m2, #m3 {
	flex-grow:										1;
	text-align:										center;
}
#m1 ul {
	flex-grow:										1;
	text-align:										center;
	margin:											0;
	padding:										0 20px;
}
#menu .mp {
	text-align:										left;
    font-size:										10px;
}
#menu #mps.open {
	transform:										matrix(1, 0, 0, 1, 0, 0);
 }
#menu .mt {
	text-transform:									uppercase;
	margin:											10px;
    font-size:										20px;
	width:											100%;
	display:										inline-block;
	cursor:											pointer;
}
#menu .tt {
    font-weight:									bold;
}
#menu .open .mt {
	margin:											20px 10px 0;
}
#menucontainer {
	overflow-y:										scroll;
	overflow-x:										hidden;
	width:											350px;
	background:										#fff;
	max-height:										calc(100% - 80px);
	position:										relative;
	display:										block;
	margin:											0 0 25px;
	color:											darkgreen;
	align-items:									center;
}
#menucontainer.sub {
	overflow:										hidden;
}
#m1 {
	text-align:										left;
}
#m1.alone {
	padding:										30px 0 0 0;
}
#m1:hover #mp1, #m2:hover #mp2, #m3:hover #mp3 {
    /* Show the mega menu when hovering the trigger item */
    display:										block;
}
.mp ul.brand {
	background-color:								#;
	padding:										0 5px;
}
.outlet {
	color:											#;
}
/*********************** END MENU ******************************************/

div#tmi div#ham {
  display:											inline-block;
  cursor:											pointer;
  margin:											0 auto 0 20px;
}

.bar1, .bar2, .bar3 {
  width:											30px;
  height:											4px;
  background-color:									#000;
  margin:											5px 0;
  transition:										0.4s;
}

/* Rotate first bar */
.change .bar1 {
  -webkit-transform:								rotate(-45deg) translate(-7px, 10px) ;
  transform:										rotate(-45deg) translate(-7px, 10px) ;
}

/* Fade out the second bar */
.change .bar2 {
  opacity:											0;
}

/* Rotate last bar */
.change .bar3 {
  -webkit-transform:								rotate(45deg) translate(-2px, -6px) ;
  transform:										rotate(45deg) translate(-2px, -6px) ;
}
#t7 {
	display:										none;
}
#hprof div.w {
	display:										inline-flex;
	max-width:										calc(2 * 190px);
}

/*****Negate Lower***/
body {
	max-width:										unset;
	font-size:										12px;
}
.pp {
	max-width:										300px;
}
#hsl div img {
    display:										block;
}
#hfn #r {
    margin-top:										0;
}
.nm {
	display:										none;
}
.om {
	display:										block;
}
.c12m {
    grid-column-start:								1;
    grid-column-end:								3;
	margin:											0 auto;
}
/*****End Negate Lower***/

/*****Columns + Widths*******/
#hprof div {
	width:											100%;
}
#hprod  {
	grid-template-columns:							repeat(2, 1fr);
}
#hprod, #hse, #hc, #hsl, #brandprod {
	display:										grid;
	grid-column-gap:								10px;
    grid-row-gap:									10px;
}
#hse h2 {
	text-align:										center;
}
#hse div.thrd {
	height:											180px;
}
#hse div p  {
	margin-left:									15%;
	margin-right:									15%;
}
#hsl {
	grid-template-columns:							calc((100% - 20px) / 2) calc((100% - 20px) / 2);
}
#brandprod  {
	grid-template-columns:							repeat(2,1fr);
}
#hc {
    grid-row-gap:									0;
    grid-template-rows:								1fr auto 1fr auto;
}
#hc div {
	width:											100%;
	height:											100%;
	display:										block;
}
#hc div div {
	height:											100%;
}
#hc h2 {
	color:											#e9e200;
	font-size:										1.3em;
	font-weight:									unset;
    margin-top:										10%;
	text-align:										center;
}
#hc hr {
	font-size:										1.3em;
}
#hc p {
	font-size:										1.3em;
	margin:											0 10%;
}
#hc p.u {
	font-size:										1.3em;
    margin-bottom:									7%;
}
#hc a:hover .hov {
	display:										grid;
}
#hc a:hover img {
	display:										none;
}
#hc img {
	width:											100%;
}
#hc .t1 {
	grid-row:										2 / 2;
	margin-bottom:									5px;
    margin-top:										-3px;
}
#hc .t2 {
	grid-row:										4 / 4;
	margin-bottom:									5px;
    margin-top:										-3px;
}
#hc div.hov  {
	display:										none;
	color:											#e9e200;
	background-color:								#;
}
#hse div {
	color:											#e9e200;
	background-color:								#;
}

/***** End Columns + Widths*******/
.bannerLogo {
	float:											none;
}
#rLogo {
	display:										none;
}
.rightsection {
	float:											none;
	display:										flex;
	align-items:									center;
}
iframe {
	max-width:										350px;
}
#hnewsl h3 {
    font-size:										10px;
}
#hnewsl p.tc {
	font-size:										9px;
}
#content_outer {
	max-width:										100%;
	padding:										0 2%;
}
div.content_inner {
	padding:										20px;
	max-width:										95%;
}
#content_product {
	grid-template-columns:							1fr;
}
hr {
	margin:											1em 4em;
}
#hb1, #hfn {
	display:										flex;
	font-size:										25px;
}
#hb1 {
	height:											auto;
}
#hprod div a  {
	width:											inherit;
	display:										flex;
}
#ht {
	font-size:										11px;
}
#ht ul li.moblast {
	padding-right:									0;
}

#hsl div.s-text {
	text-align:										center;
	color:											#;
	font-weight:									200;
	font-size:										12px;
	margin:											20px 10px 0 10px;
    padding-top:									20px;	
}
#hsl div img {
	margin:											50px auto;
	max-width:										100%;
}
#hsl div.s-text h3 {
	letter-spacing:									3px;
	font-size:										1.5em;
}
#hsl div.s-text p.l2, #hsl div.s-text p.l3 {
	font-size:										1.3em;
	letter-spacing:									0.5px;
}
#hsl div.s-text p.l3 {
	color:											#;
	font-weight:									700;
	letter-spacing:									-2px;
}
#hfn img {
	width:											50px;
	margin:											5px auto;
}
#hfn #b, #hfn #c, #hfn #r {
	float:											left;
	width:											calc(50% - 3px);
	height:											220px;
	margin-right:									5px;
	display:										grid;
}
#hfn #r {
	background:										#e9e200;
	margin-right:									0;
}
#hfn #r:hover {
	background:										#;
}
#hse #sc1,#hse #sh1,#hse #sc2,
	#hse #sh2,#hse #sc3,
	#hse #sh3 {
	height:											350px;
}
#hse #sh1, #hse #sh2, #hse #sh3 {
	display:										grid;
	z-index:										-10;
}
#sh1 p, #sh1 h2, #sh2 p, #sh2 h2, #sh3 p, #sh3 h2, #ch1 p, #ch1 h2, #ch2 p, #ch2 h2 {
	font-weight:									300;
    font-size:										0.75em;
    margin-top:										0;
}
.norm {
	display:										block;
}
.hov {
	display:										none;
}
#hse a:hover div.thrd .norm {
	display:										none;
}
#hse a:hover div.thrd .hov {
	display:										block;
}

#hse a:hover #sb1, #hse a:hover #sb2, #hse a:hover #sb3 {
	background-image:								none;
}
#hse a:hover div.thrd .norm {
	display:										none;
}
#hse a:hover div.thrd .hov {
	display:										block;
}
#hse #sb1 {
	background-position-y:							bottom;
}
#hse #sb2, #hse #sb3 {
	background-position-y:							center;
}
#ri {
	margin:											0 auto;
}
#foot {
	width:											100%;
}
#hfn #b {
	background-image:								URL("/upl478700018001n.jpg");
	background-color:								white;
	background-size:								cover;
	background-repeat-x:							no-repeat;
}
form#subscribe {
	display:										inline-flex;
	margin-top:										15px;
}
form#subscribe input {
	float:											none;
	margin-left:									0;
	margin-right:									0;
    height:											2.5em;
    border:											0;
    padding-top:									0;
    padding-bottom:									0;
}
form#subscribe input[type=submit] {
	background-color:								#d60903;
	text-align:										center;
	border:											0;
	color:											#fff;
	
}
form#subscribe input[type=submit]:hover {
	cursor:											pointer;
}
#demoList div {
	min-width:										45%;
}
/******************* MENU *****************************/
#tmi img {
	max-width:										100%;
}
.bgd a {
	margin:											0 auto;
}
/******************* MENU END *****************************/
/*******************SEARCH*****************************/
#content_search {
	display:										grid;
	grid-template-columns:							1fr;
	margin:											0 5px;
}
#sr, #srf {
	display:										grid;
	grid-template-columns:							repeat(2,1fr);
	grid-gap:										5px;
}
#srf {
	display:										grid;
	grid-template-columns:							repeat(2, 1fr);
	grid-gap:										5px;
}
#filter {
	display:										none;
}
.resFilta {
	display:										none;
}
.resFiltp select {
	padding:										0px 25%;
}
.resFiltp:after {
    right:											30%;
}
.resFiltc select {
	padding:										0px 20%;
}
.resFiltc:after {
    right:											25%;
}

/*******************END SEARCH*****************************/
#enquire {
	display:										grid;
	grid-template-columns:							1fr 1fr;
	grid-gap:										5px;
}
#gmap {
    width:											100%;
    float:											none;
	clear:											both;
    padding-left:									0;
}	
div.staffdet img {
	max-width:										50%;
}
.RIGHTIMAGE {
	max-width: 100%;
    margin: 5px auto;
    display: block;
	float:	none;
}
