.hero {
	background-color:#ecb700; /* yellow */
	position:relative;
}

	.hero > img {
		float:right;
		width:79%;
	}

	.fade,
	.defaultfade{
		position:absolute;
		z-index:11;
		left:20.9%;
		top:0;
		height:100%;
		width:42%;
	}
	
	.defaultfade {
		background-image: -moz-linear-gradient( 0deg, rgb(236,183,0) 0%, rgba(236,183,0,0) 100%);
		background-image: -webkit-linear-gradient( 0deg, rgb(236,183,0) 0%, rgba(236,183,0,0) 100%);
		background-image: -ms-linear-gradient( 0deg, rgb(236,183,0) 0%, rgba(236,183,0,0) 100%);
	}
	
	.hero .text {
		position:absolute;
		z-index:12;
		top:50%;
		transform:translateY(-50%);
		left:5%;
		width:50%;
	}
	
		.crumb {
			float:left;
			clear:none;
			color:#fff;
			font-size:1.2em;
			margin-right:1em;
		}
	
		.text h1 {
			clear:left;
			font-size:6.8em;
			font-size:4.5vw;
			font-weight:700;
			color:#fff;
			text-transform: uppercase;
			line-height: 1.1;
		}
		
		.text h2 {
			font-size:1.8em;
			font-size:1.4vw;
			font-weight:700;
			color:#004920; /* green */
			text-transform: uppercase;
			letter-spacing: 0.05em;
			line-height: 1.4;
		}
	
	.news-title .text {
		width:80%;
	}

/* `s */

.products {
	padding:0 5%;
	margin-top:-2%;
	margin-bottom:2em;
	display:grid;
	grid-template-columns: repeat(4,1fr);
	grid-gap:1.5em;
}

	.product,
	.shadow {
		transition: margin 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
		border:1px solid #fff;
		position:relative;
		z-index:12;
	}

	.products a {
		float:left;
		width:100%;
		transition: margin 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
		margin-bottom:0;
		padding-bottom:70%;
	}
	
	.shadow {
		margin-bottom:1em;
		width:100%;
		margin-top:-1.5em;
	}
		
		.products a:hover {
			margin-top:-1em;
			margin-bottom:1em;
			-moz-box-shadow:    inset 0 0 50px rgba(0,0,0,0.4);
			-webkit-box-shadow: inset 0 0 50px rgba(0,0,0,0.4);
			box-shadow:         inset 0 0 50px rgba(0,0,0,0.4);
		}
		
		.cat-thumb {
			display:block;
			position:absolute;
			bottom:5%;
			left:10%;
			height:190px;
			width:auto;
			z-index:9;
		}
		
		.ribbon {
			position:relative;
			float:right;
			margin:6% 0;
			background-color:#004920; /* green */
			color:#fff;
			width:90%;
		}
		
			.ribbon h3 {
				text-align:right;
				font-weight:300;
				font-size:2.2em;
				padding:0.35em 0.75em;
			}
			
			.ribbon .slant {
				position:absolute;
				left:-8px;
				top:0;
				width:8px;
				height:100%;
				margin:0;
				display:block;
			}
			
			.explore {
				background-color:#fff;
				padding:1em 2em;
				position:absolute;
				bottom:5%;
				right:0;
				z-index:10;
			}
			
				.explore p {
					float:left;
					text-align: right;
					color:#004920; /* green */
					font-weight:700 !important;
					text-transform: uppercase;
					letter-spacing: 0.1em;
				}
			
				.products a .explore img {
					width:10px;
					float:left;
					margin:5px 0 0 1em;
				}
			
			.products a:hover .explore p,
			.products a:hover .ribbon h3{
				text-decoration: underline;
			}
				
		
		.desc {
			float:right;
			clear:right;
			color:#fff;
			padding:0 5%;
		}
		
			.desc p {
				text-align: right;
				font-size:1.35em;
				line-height: 1.5;
				font-weight:400;
			}

.main {
	padding:3% 5% 3% 0;
	width:70%;
	float:right;
}

	.main h2,
	.main h3,
	.main h4,
	.main h5,
	.main h6 {
		font-weight:300;
		font-size:3.5em;
		margin-bottom:1em;
		margin-top:1em;
	}
	
		.main h2:first-of-type{
			margin-top:0;
		}
	
	.main h3 {
		font-size:3em;
	}
	
	.main h4 {
		font-size:2.5em;
	}
	
	.main h5 {
		font-size:2em;
	}
	
	.main h6 {
		font-size:1.5em;
	}
	
	.main p {
		font-size:1.4em;
	}
	
	.main table {
		border-collapse: collapse;
		width:100%;
		margin:5% 0;
	}
	
		.main td {
			font-size:1.4em;
			padding:1em;
			border:1px solid #eee;
		}
		
			.main td p {
				font-size:1em;
				margin-bottom:0;
			}
		
		.main th {
			background-color:#666;
			color:#fff;
			padding:1em;
			text-align: left;
		}
	
	.main ul,
	.main ol {
		margin:2em;
	}
	
		.main li {
			font-size:1.4em;
			line-height: 1.4;
		}
	
	.product-sub {
		padding:2% 0;
		border:1px solid #e7e7e7;
		margin-bottom:1em;
		text-decoration: none;
	}
	
		.product-sub .text {
			float:left;
			width:75%;
		}
	
		.product-sub .text h4 {
			float:left;
			padding:1em;
			font-weight:700;
			color:#fff;
			text-transform: uppercase;
			letter-spacing: 0.1em;
			font-size:2em;
			width:100%;
			margin-top:0;
		}
		
		.product-sub:hover {
			opacity: 0.8;
		}
		
		.product-sub:hover h4 {
			text-decoration: underline;
		}
		
		.product-sub p {
			float:left;
			clear:left;
			font-size:1.8em;
			padding-left:0.5em;
			font-weight:300;
			width:100%;
		}
		
		.sub-thumb {
			float:right;
			width:20%;
		}
	
aside {
	padding:3% 5%;
	float:left;
	width:30%;
}

	.sibs,
	.psibs {
		margin-bottom:5%;
	}

	aside .sibs a,
	aside .psibs a{
		background-color:#e7e7e7;
		padding:1em;
		margin-bottom:5px;
		color:#363636;
		text-decoration: none;
		font-weight:700;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		font-size:1em;
		transition: width 0.5s ease-in-out;
	}
	
	aside .sibs a {
		color:#fff;
	}
	
		.psibs a:hover{
			width:105%;
			color:#777;
		}
		
		.sibs a:hover{
			width:105%;
			color:#fff;
		}
	
	aside h3 {
		font-weight:300;
		font-size:3em;
		margin-bottom:1em;
	}
	
	aside > img {
		width:100%;
		margin-bottom:2em;
	}

/* news */

section.full {
	width:100%;
	padding:0 5%;
}

	.news-items {
		margin-top:-5%;
		position:relative;
		z-index:15;
	}
	
		.news-items a {
			border:1px solid #e7e7e7;
			background-color:#fff;
			text-decoration: none;
			margin-bottom:2em;
		}
		
			.news-items a > img {
				float:left;
				width:15%;
				display:block;
			}
			
			.news-items .text {
				float:right;
				width:85%;
				padding:0 5% 1% 0;
			}
			
			.news-items a .text h2 {
				clear:left;
				text-transform: none;
				letter-spacing: 0;
				padding-left:1em;
				margin-bottom:0.5em;
				line-height: 1.1;
			}
			
			.news-items a p {
				padding-left:2.5em;
			}
			
			.news-items a .date {
				color:#fff;
				padding:1em 3.5em;
				margin:1.5em 0;
				float:left;
				font-weight:700;
				font-size:1.1em;
				text-transform: uppercase;
				letter-spacing: 0.1em;
			}
			
			.news-items a:hover img {
				opacity:0.7;
			}
			
			.news-items a:hover .text h2 {
				text-decoration: underline;
			}

			.nonews {
				padding:2em 0;
			}
			
section.search {
	padding:3% 5%;
}

	.search th {
		background-color:#ecb700; /* yellow */
		color:#fff;
		font-size:1.6em;
	}
	
	.search td {
		vertical-align: top;
	}

	.search td a {
		font-size:1.4em;
		color:#ecb700; /* yellow */
	}
	
	/*.search td img {
		padding:0.5em;
		border:1px solid #eee;
		border-radius: 0.25em;
	}*/

.backto {
	float:left;
	clear:left;
	color:#fff;
	font-weight:700;
	text-transform: uppercase;
	letter-spacing: .1em;
	padding:1em 2.5em;
	margin-bottom:2em;
}

/* contact */

.contact {
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-gap:2rem;
}

.main form {
	float:left;
	clear:left;
	width:100%;
	background-color:#eee;
	padding:4%;
	margin-bottom:5em;
	border:1px solid #ddd;
}

	.main form h2 {
		font-size:2.4em;
		font-weight:bold;
		margin-bottom:0.25em;
		float:left;
		width:85%;
	}
	
	.main form img {
		float:right;
		width:12%;
	}

	#form-news form {
		background-color:#004920; /* green */
	}
	
	#form-data form {
		background-color:#fde1bf; /* pale orange */
	}
	
		#form-news h2,
		#form-news label {
			color:#fff;
		}
		
		#form-data h2 {
			color:#ad7105;
		}

input,
label,
textarea{
	float:left;
	clear:left;
	width:100%;
	margin-bottom:1em;
	font-size:1.4em;
}

label {
	font-weight: 300;
	margin-bottom:0.5em;
}

input,
textarea {
	padding:0.5em;
	outline:none;
	font-family: 'Open Sans', sans-serif;
	border:none;
	border:1px solid #ddd;
}

.main p.errortext {
	font-size:1em;
	color:red;
	float:left;
	clear:left;
	width:100%;
}

.inputerror {
	border:2px solid red;
}

input.email {
	display:none;
}

.submit-btn {
	background-color:#ecb700; /* yellow */
	color:#fff;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: 700;
	cursor: pointer;
	outline:none;
	border:none;
	margin-bottom:0;
	margin-top:1em;
}

	.submit-btn:hover {
		background-color:#004920; /* green */
	}
	
	#form-news .submit-btn:hover {
		background-color:#fff;
		color:#004920; /* green */
	}
	
form .half {
	float:left;
	width:48%;
}

	form .half:nth-of-type(2n){
		float:right;
	}

.contact-text p {
	font-size:1.4em;
	margin-bottom: 1em;
}

.contact-text .ribbon {
	float:left;
	margin-bottom: 1em;
	background-color:#ecb700; /* yellow */
	width:auto;
	clear:left;
}

	.contact-text .ribbon p {
		float:left;
		clear:left;
		margin-bottom: 0;
		padding:0.5em 1em;
		font-size:1.2em;
		font-weight: 700;
		text-transform: uppercase;
		left: 0.1em;
	}
	
	.contact-text > p {
		clear:left;
	}
	
		.contact-text > p a {
			font-size:1.8em;
		}

	.body {
		clear:left;
	}
	.body a {
		font-size:inherit;
	}

.search-results a {
	font-size:2em;
}

.search-results p {
	font-size:1.1em;
	color:#555;
}

	.search td img {
			width:15%;
			float:left;
		}
		
		.search td .text {
			width:80%;
			float:right;
			font-size:1em;
		}
		
		.main .snip h2,
		.main .snip h3 {
			font-size:1em;
		}

@media screen and (max-width:1099px){
	.main > .left,
	.main > .right {
		float:left;
		width:100%;
	}
	
	.products {
		grid-template-columns: repeat(2,1fr);
	}

	form .half {
		width:100%;
	}
}

@media screen and (max-width:999px){
	.explore{
		bottom:5%;
	}
	
	.ribbon h3 {
		font-size:2em;
	}
}

@media screen and (max-width:799px){		
		.main,
		aside{
			float:left;
			width:100%;
			padding:5%;
		}
		
		aside {
			border-top:1px solid #ccc;
		}
		
		.product-sub h4 {
			width:auto;
		}

		.contact {
			grid-template-columns: 1fr;
		}
}

@media screen and (max-width:599px){
	
	.products a {
		padding-bottom:80%;
	}
	
	.main td,
	.main th {
		word-break: break-all;
		padding:2%;
		line-height: 1;
		font-size:1.2em;
	}
	
		.main th p {
			font-size:1em;
		}
	
	.crumb,
	.hero .text h2{
		display:none;
	}
	
	.search h2:first-of-type {
		margin-bottom:0;
	}
	
	.search th {
		display: none;
	}
	
	.search tr {
		border-bottom:1px solid #eee;
		padding-bottom:1em;
		margin-bottom:1em;
		float:left;
		display:block;
		width:100%;
	}
	
		.search td {
			display:block;
			width:100%;
			border:none;
		}
	
	.main table {
		display:block;
		overflow-x:auto;
		white-space: nowrap;
	}
	
	.main td,
	.main th{
		padding:0.5em;
		font-size:1em;
	}
	
	form .half {
		width:100%;
	}
}

@media screen and (max-width:499px){
	
	.news-items a {
		padding:5%;
	}
	
	.news-items .text {
		clear:left;
		width:100%;
	}
	
	.news-items a img {
		width:40%;
	}
	
		.news-items a .date {
			margin-top:0;
			padding:0.5em 1em;
		}
	
	.main h2:first-of-type {
		font-size:2.4em;
		margin-bottom:0.5em;
		line-height: 1.2;
	}
	
	.news-items a .text h2,
	.news-items a p {
		padding-left:0;
	}
	
	.products {
		grid-template-columns: repeat(1,1fr);
	}
}