#homepage-events, #homepage-news, #homepage-products  {margin:0; padding:0px;position: relative;padding-bottom:2em}
#homepage-events h3, #homepage-news h3, #homepage-products h3 {margin-top:0;}
#homepage-events .container, #homepage-news .container {width:100%;margin:1em 0;}
#homepage-products a.container {border:solid 1px #ccc; padding:10px; text-align:center; text-decoration:none; display:block; background-color:#FFFFFF; border-radius:10px;}
#homepage-products a.container:hover {text-decoration:underline;}
#homepage-products a.container .image,#homepage-products a.container .title { display:block;}
#homepage-products a.container img {display:block; /*width:100%; max-width:250px;*/ margin:auto;}
	/*#homepage-products a.container img {max-height:250px;}*/

#homepage-events .container .title, #homepage-news .container .title {font-weight:bold;}	
#homepage-products a.container {
	position: relative;
	padding-bottom: 65%;
	height: 0;
	box-sizing: border-box; -moz-box-sizing: border-box;
}
#homepage-products a.container .image {
	position: relative;
	padding-bottom: 50%;
	height: 0;
}
#homepage-products a.container .image img {
	position: absolute;
	top:0; left:0; right: 0;
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
h3 { color:#FF0000;}
#right { clear:left;float:none; width:100%; *zoom:1;padding:10px 20px; }
#right .moreinfolink > a, #right a.moreinfolink {bottom: 1em;float: none;margin: 1em auto 0;/*position: absolute;  ~ removed to stop overlap of button on text*/}
.contentinner {padding-bottom:1px;max-width:100%}
#hero-wrap {position:relative;height:0;padding-bottom:57%;margin-bottom:2em; overflow:hidden; clear:both;}
#hero>div {position:absolute;max-width:100%;top:0;left:0;display:none;}
#hero img {max-width:100%;}
#hero .hero-label {display:block;font-family:sans-serif;background-color: rgba(0,0,0,0.5);color:#fff;width:100%; padding:5px;}
#hero-wrap a {text-decoration:none;}

@media only screen and (max-width: 25em) { /*400px*/
	.smlhide {display:none !important;}
}
@media only screen and (min-width: 25em) { /*400px*/
#homepage-events .moreinfolink, #homepage-news .moreinfolink, #homepage-products a.moreinfolink {margin-top:0.3em;}	
	#homepage-products a.container {width:48%;float:left; font-size: 0.9em;}
	#homepage-products a.container:nth-of-type(odd) {margin:1em 2% 1em 0}
	#homepage-products a.container:nth-of-type(even) {margin:1em 0 1em 2%}
	#homepage-products a.container {padding-bottom: 60%; overflow:hidden;}
	#homepage-products a.container .image {	padding-bottom: 100%;	}
	#hero-wrap {padding-bottom:53%;}
}
@media only screen and (min-width: 25em) and (max-width: 46em) { /*400px - 738px*/
	#homepage-products a.container:nth-of-type(2n+1) {margin-bottom:1em !important}
}
@media only screen and (min-width: 32em) { /*512px*/
	#homepage-events .container, #homepage-news .container {width:100%;float:left;}
	#homepage-events div.container:nth-of-type(odd), #homepage-news div.container:nth-of-type(odd) {margin:1em 2% 1em 0}
	#homepage-events div.container:nth-of-type(even), #homepage-news div.container:nth-of-type(even) {margin:1em 0 1em 2%}
	#homepage-events .container, #homepage-news .container, #homepage-products a.container {font-size: 1em;}
	#homepage-events .container, #homepage-news .container, #homepage-products a.container {width:48%;float:left;padding-bottom:4em}
	#homepage-events div.container:nth-of-type(odd), #homepage-news div.container:nth-of-type(odd), #homepage-products a.container:nth-of-type(odd) {margin:1em 2% 1em 0}
	#homepage-events div.container:nth-of-type(even), #homepage-news div.container:nth-of-type(even), #homepage-products a.container:nth-of-type(even) {margin:1em 0 1em 2%}
	
	#homepage-products a.container {padding-bottom: 40%; overflow:hidden;}
	#homepage-products a.container .image {	padding-bottom: 70%;	}
}
@media only screen and (min-width: 32em) and (max-width: 60em) { /* between  512px & 960px */
	#right .container {position:relative;}
	#right .moreinfolink > a, #right a.moreinfolink {position:absolute; bottom: 0;}
	#hero-wrap {padding-bottom:48%;}
}
@media only screen and (max-width: 46em) { /* under  738px */
	#homepage-events div.container:nth-of-type(2n+1), #homepage-news div.container:nth-of-type(2n+1), #homepage-products a.container:nth-of-type(2n+1){margin-bottom: 3em}
}
@media only screen and (min-width: 46em) and (max-width: 60em) { /*738px - 960px*/
	/*#right {padding-left:220px}
	#right.no-left-menu {padding-left:20px} */
}
@media only screen and (min-width: 46em) { /*738px*/
	.contentinner.no-left-menu #homepage-events, .contentinner.no-left-menu #homepage-news, .contentinner.no-left-menu #homepage-products {margin:0;border:none;clear:none;}
	.contentinner.no-left-menu #homepage-events div.container, .contentinner.no-left-menu #homepage-news div.container, .contentinner.no-left-menu #homepage-events div.container:nth-of-type(even), .contentinner.no-left-menu #homepage-news div.container:nth-of-type(even) {margin:0 0 1em 0}
	.contentinner.no-left-menu #homepage-events .container, .contentinner.no-left-menu #homepage-news .container  {width:100%;float:none;}
	.contentinner.no-left-menu #right .moreinfolink > a, .contentinner.no-left-menu #right a.moreinfolink {bottom:auto ;float: right;margin:0;position:inherit;}
	.contentinner.no-left-menu #right .moreinfolink {text-align:right;}
	#hero .hero-label {position:absolute;bottom:0.6em;left:0;font-size:1.4em;padding:0.1em 0.6em;}
	#hero-wrap {padding-bottom:40%;}

}
@media only screen and (min-width: 46em) { /*738px*/
}

@media only screen and (min-width: 60em) { /*960px*/
	#right {padding:30px 10px 10px }

	#homepage-events, #homepage-news {margin:0;border:none;clear:both;}
	#homepage-events div.container, #homepage-news div.container {margin:1em 0 1em 0;width:100%;}
	
	#homepage-events div.container:nth-of-type(odd), #homepage-news div.container:nth-of-type(odd),
	#homepage-events div.container:nth-of-type(even), #homepage-news div.container:nth-of-type(even) {margin:0}
	
	.contentinner h1:first-of-type {margin-top:0;}
	.contentinner {margin-right:0}
/*	.contentinner.noright {margin-right:0;}
	.contentinner.noright.no-left-menu {}*/
	.contentinner article {margin-top:0;}
	/*#right { float:right; width:250px; clear:none;}*/
	#right .moreinfolink > a, #right a.moreinfolink {float:none;}
	#homepage-events h3, #homepage-news h3 {margin-bottom:0;}
	#homepage-events .date, #homepage-news .date {margin: 0.2em 0;color:#555}
	#homepage-news .container, #homepage-events .container {padding:0.25em 0.5em}
	
	#homepage-products a.container:nth-of-type(odd) {margin:1em 0 1em 2%;}
	#homepage-products a.container:nth-of-type(even) {margin:1em 0 1em 2%;}
	#homepage-products a.container {width:31%;}
	#homepage-products a.container {padding-bottom: 35%; overflow:hidden;}
	#homepage-products a.container .image {padding-bottom: 100%;}
	
}
@media only screen and (min-width: 60em) and (max-width: 80em) { /*960px - 1280px*/
	#homepage-products a.container:nth-of-type(4n) {display:none;}
}
@media only screen and (min-width: 80em) { /*1280px*/
	/*.contentinner {margin-right:340px}
	.contentinner.noright {max-width:1060px}
	.contentinner.noright.noleft {max-width:1230px}
	#right { width:340px;}
	#homepage-products a.container {width:23%; padding-bottom:28%;}*/
	.contentinner.no-left-menu, .footer-text, footer, #content, header .outer, header #header, footer > div{max-width:1280px;}
	#hero .hero-label { font-size:1.8em;}
	#hero {max-width:100%;}
}

/* PRE LOADER */
.spinner {
  width: 50px;
  height: 50px;
  margin: 50px auto;
  background-color: #E9F0F6;
  border-radius: 100%;  
  top: 50%;
  position: absolute;
  left: 50%;
  margin-left: -25px;
  margin-top: -25px;
  -webkit-animation:scaleout 1.75s infinite ease-in-out;
  -moz-animation:scaleout 1.75s infinite ease-in-out;
  -ms-animation:scaleout 1.75s infinite ease-in-out;
  -o-animation:scaleout 1.75s infinite ease-in-out;
  animation:scaleout 1.75s infinite ease-in-out;
}
.spinner.one{margin-left: -150px;}
.spinner.two{-webkit-animation-delay:1s;-moz-animation-delay:0.25s;-ms-animation-delay:0.25s;-o-animation-delay:0.25s;animation-delay:0.25s;}
.spinner.three{margin-left: 50px;-webkit-animation-delay:0.5s;-moz-animation-delay:0.5s;-ms-animation-delay:0.5s;-o-animation-delay:0.5s;animation-delay:0.5s;}
@-webkit-keyframes scaleout {0% {-webkit-transform: scale(0.0);}100% {opacity: 0;-webkit-transform: scale(1.0);}}
@-moz-keyframes scaleout {0% {-moz-transform: scale(0.0);}100% {opacity: 0;-moz-transform: scale(1.0);}}
@-ms-keyframes scaleout {0% {-ms-transform: scale(0.0);}100% {opacity: 0;-ms-transform: scale(1.0);}}
@-o-keyframes scaleout {0% {-o-transform: scale(0.0);}100% {opacity: 0;-o-transform: scale(1.0);}}
@keyframes scaleout {0% {transform: scale(0.0);}100% {opacity: 0;transform: scale(1.0);}}