@font-face {
    font-family: 'AvenirNext';
    src: url('../fonts/AvenirNextLTPro-Regular.otf');
}
body {
  font-family: 'Roboto Slab', serif;
  font-weight: 300;
  margin: 0;
  background-color: #FFFFFF;
}
body img {
	border: none;
	outline: none;
}
a,
a:link,
a:focus,
a:hover,
a:active {
    color: #000;
    cursor: pointer;
    text-decoration: none;
}
.iconSmall {
	max-width: 40px;
	max-height: 40px;
	float: left;
	margin: 20px 10px 0px 0px;
}
#backgroundImg {
	position: absolute;
	bottom: 0px;
	height: 100%;
	width: 100%;
	background-image: url('../img/back.png');
	background-size: contain;
	background-position: top center;
	z-index: 1;
	opacity: 0.9;
}
#contactData img {
	height: 300px;
}
#contactData,
#contactForm {
	width: 40%;
}
#contactData {
	float: left;
}
#contactForm {
	float: right;
	text-align: left;
}
#contactForm .form-group {
	margin: 20px;
}
#contactForm input,
#contactForm textarea {
	float: right;
}
#contactForm input {
	width: 70%;
}
#contactForm textarea {
	margin-bottom: 20px;
}
.hb-alert {
	color: #5D1515;
}
#gallery:hover {
	opacity: 0.9;
}
#gallery {
	text-align: center;
}
#photoDesc {
	width: 100%;
	background: #004800;
	margin-top: -4px;
	color: #fff;
	font-size: 36px;
}
.sideGal a:first-of-type:hover {
	opacity: 0.9;
}
.sideL {
	width: 25%;
	float: left;
	background-color: #fff;
	text-align: center;
}

.sideR {
	width: 75%;
	float: left;
}
.subpage.right {
	float: left;
	width: 70%;
}
.subpage.left {
	float: right;
}
.btnDefault:hover {
	color: #fff;
}
.btnDefault {
	padding: 10px 20px 10px 20px;
	background-color: #004800;
	color: #fff;
	font-size: 15px;
}
.news .btnDefault {
	float: right;
}
a.showMore,
a.showMore:visited,
a.showMore:active,
a.showMore:hover,
a.showMore:focus {
	/*padding: 10px 20px 10px 20px;
	font-size: 15px;*/
	background-color: #004800;
	color: #fff;
	clear: both;
	float: right;
}
.sideR .news {
	background-color: #fff;
	padding: 30px;
	/*min-height: 370px;*/
}
.divider {
	width: 100%;
	height: 1px;
	background-color: #85ba3f;
}
.date {
	color: #868686;
}
.infoGal {
	visibility: hidden;
	position: absolute;
	bottom: 10px;
	left: 130px;
	font-size: 22px;
	opacity: 0.8;
}
.sideGal:hover .infoGal {
	visibility: visible;
}
.sideGal {
	position: relative;
	height: 450px;
	width: 310px;
	float: right;
	text-align: center;
}
.sideSubpage:nth-of-type(3) {
	float: left;
	width: 580px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}
.sideSubpage:nth-of-type(2) {
	float: left;
	width: 580px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-bottom: 20px;
}
/*.sideSubpage:nth-of-type(2) .details {
	border-left: 8px solid #85ba3f;
	padding-left: 10px;
}*/
.sideGal a div {
	height: 450px;
	width: 310px;
	background-position: top left;
}
#scrollTo {
	height: 1px;
}
.container {
  width: 980px;
  margin: 0 auto;
}
#header {
	padding: 30px 0 0 0;
}
#fillWhite {
	background-color: #fff;
}
#fillWhite:after {
	content: ' ';
	clear: both;
	display: block;
}
#header img,
#header span {
	float: left;
}
#header span {
	color: #9b9b9b;
}
#header > ul {
	float: right;
	margin: 0;
	padding: 5px 0 0 0;
}
#header span {
	padding: 16px 0 0 20px;
	font-weight: 700;
}
/* menu */
#menu ul {
	padding: 0;
}
#menu > li >  a {
	display: block;
	padding: 10px 20px 10px 20px;
}
#menu > li,
#menu li ul li {
	font-size: 18px;
}
#menu,
#footerMenu {
	list-style-type: none;
}
#menu > li {
	display: inline-block;
}
#menu li a:hover {
	background-color: #004800;
	color: #fff;
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
	-ms-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}

#menu li.active {
	background-color: #85ba3f;
	color: #fff;
	-webkit-transition: background-color, color 0.4s;
	-moz-transition: background-color, color 0.4s;
	-ms-transition: background-color, color 0.4s;
	-o-transition: background-color, color 0.4s;
	transition: background-color, color 0.4s;
}
#menu li.active:hover {
	background-color: #004800;
	color: #fff;
}
/* submenu */
#menu li ul li a {
	display: block;
	color: #fff;
	padding: 8px;
}
#menu li ul {
	min-width: 78px;
	font-size: 15px;
	list-style-type: none;
	display: none;
	position: absolute;
	text-align: center;
	z-index: 5;
	background-color: #85ba3f;
}
#menu li:hover ul {
	display: block;
}
#menu li ul li {
	background-color: #f4f4f4
	display: block;
	border: none;
	text-align: center;
	line-height: auto;
}
#menu li ul li:hover a {
	color: #85ba3f;
}

#footerMenu li.active {
	color: #85ba3f;
}
.currentPage {
	background-color: #85ba3f;
	color: #fff;
}
.activePage {
	padding: 10px 22px 10px 22px;
	float: right;
}
#searchBar {
	clear: both;
	float: right;
	border-left: 8px solid #004800;
	margin: 18px 0 15px 0;
}
#searchForm input {
	border: none;
	outline: none;
	margin: 0;
	padding: 0 0 0 10px;
	height: 30px;
	width: 250px;
	background-color: #f4f4f4;
	float: left;
}
::-webkit-input-placeholder {
	color: #15595d;
}
::-moz-placeholder,
:-moz-placeholder {
	color: #15595d;
}
:-ms-input-placeholder {
	color: #15595d;
}
.showMore,
.btnDefault:not(.btnCenter),
#searchForm button {
	border: none;
	outline: none;
	height: 30px;
	line-height: 30px;
	margin: 0;
	padding: 0 10px 0 10px;
	background-color: #004800;
	color: #fff;
	float: right;
	cursor: pointer;
}
.panel {
	clear: both;
	border-top: 8px solid #eaebed;
	background-image: url('../img/road.jpg');
	background-repeat: no-repeat;
	background-size: 110% 110%;
	height: 230px;
}
#panelBorder {
	height: 8px;
	background-color: #fff;
	position: absolute;
	z-index: -100;
	top: 8px;
}
.container.down {
	position: relative;
	height: 8px;
	background-color: #fff;
	width: 100%;
	margin: 0;
	z-index: 50;
}

#panelContainer {
	position: absolute;
	right: 50%;
	margin-right: -490px;
	top: 190px;
	width: 980px;
}
#wrap {
	position: relative;
	left: 0px;
	top: 30px;
}
#wrap div {
	display: inline-block;
	vertical-align: middle;
	position: relative;
}
#holdLeft {
	opacity: 0;
	height: 150px;
	width: 50px;
	border: 8px solid #fff;
	border-right: none;
	left: 305px;
}
#holdLeft.permanent {
	opacity: 1;
	left: 0;
}
#holdRight {
	opacity: 0;
	height: 150px;
	width: 50px;
	border: 8px solid #fff;
	border-left: none;
}
#holdRight.permanent {
	opacity: 1;
}
#sloganPanel {
	color: #fff;
	max-width: 450px;
	font-size: 38px;
	text-align: left;
	font-family: 'Roboto Slab', serif;
	font-weight: 300;
}
#sloganBar {
	width: 5px;
	height: 30px;
	background-color: #ffffff;
	margin-right: 10px;
	opacity: 0.9;
	top: -22px;
}
#sloganImg {
	width: 134px;
	height: 104px;
	background-image: url(../img/peoples.png);
	margin-left: 80px;
}

#container {
	padding: 20px; 
}
.fill {
	background-color: #f4f4f4;
	padding-bottom: 20px;
}
.fill:after {
	content: ' ';
	clear: both;
	display: block;
	background-color: #f4f4f4;
}
.push {
	background-color: #f4f4f4;
}
#containerContent {
	padding-top: 70px;
	text-align: center;
}
#containerNews {
	padding: 20px;
	text-align: left;
}
#containerNews h3 {
	display: inline;
	margin-right: 10px;
	font-size: 40px;
	color: #004800;
}
#containerNews h3 {
	display: inline;
}
.date {
	float: right;
}
#newsTitle {
	text-align: center;
}
#containerContentSearch {
	padding-top: 20px;
	text-align: center;
}
.submenu {
	width: 310px;
	height: 450px;
	background-color: #fff;
	display: inline-block;
	text-align: center;
	margin-bottom: 20px;
	position: relative;
}
.submenu:hover {
	background-color: #85ba3f;
	cursor: pointer;
}
.submenu:hover .title,
.submenu:hover .content {
	color: #fff;
}
.submenu:hover .dots {
	color: #15595d;
}
.submenu.middle {
	margin: 0 20px 0 20px;
}
.submenu img,
.submenu span {
	display: block;
	margin: 0 auto;
}
.icon {
	height: 125px;
	position: relative;
}
.iconSubmenu,
.iconSubmenuHover {
	height: 50px;
	position: absolute;
	top: 45px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
}
.iconSubmenu {
	z-index: 0;
}
.iconSubmenuHover {
	z-index: -1;
}
.title {
	color: #282828;
	font-size: 20px;
	height: 63px;
	padding: 0 10px 0 10px;
}
.dots {
	font-size: 35px;
	color: #85ba3f;
	padding-bottom: 25px;
	font-family: "Arial Black";
	line-height: 5px;
}
.content {
	color: #282828;
	padding: 0 60px 0 60px;
	height: 220px;
	position: absolute;
	bottom: 0px;
}
.submenu p {
	color: #282828;
	height: 220px;
	overflow: hidden;
}
.subpage {
	background-color: #fff;
	padding: 35px;
}
.content.details {
	position: relative;
}
.subpage p.details {
	font-size: 25px;
}
.details {
	text-align: left;
}
#footer {
	/*position: absolute;*/
	background-color: #004800;
	height: 65px;
	clear: both;
	margin-top: 10px;
	width: 100%;
}
#footerMenu {
	float: right;
	padding-top: 24px;
	margin: 0;
}
#footerMenu a li {
	display: inline-block;
	padding: 0 15px 0 15px;
	color: #fff;
	font-size: 10pt;
}
#footerMenu a:hover li {
	color: #7aaf43;
}
#footer #signature {
	float: left;
	font-size: 7.5pt;
	margin-top: 26px;
	color: #fff;
}
#logo71 {
	width: 70px;
	padding-left: 2px;
}
#signature {
	font-size: 9pt;
	text-align: right;
	vertical-align: middle;
}
#signature div, #signature img {
	display: inline-block;
	vertical-align: middle;
	color: #fff;
}
#panelContainer {
	z-index: 800;
}
.panel {
	z-index: 700;
	position: relative;
}
#fillWhite {
	z-index: 600;
	position: relative;
}
.container,
.sideR,
.sideL,
#footer {
	z-index: 900;
	position: relative;
}

@media only screen and (max-width: 1125px) {
	.fill {
		min-height: 0px;
	}

	.submenu {
		width: 310px;
		height: 375px;
		display: inline-block;
		margin-bottom: 20px;
	}
	.submenu img {
		height: 55px;
	}
	.icon {
		height: 115px;
		position: relative;
	}
	.iconSubmenu,
	.iconSubmenuHover {
		top: 35px;
	}
	.title {
		font-size: 20px;
		height: 55px;
		padding: 0 10px 0 10px;
	}
	p.details {
		margin: 0;
		font-size: 20px;
	}
	.dots {
		font-size: 15px;
		padding-bottom: 15px;
		padding-top: 5px;
	}
	.content {
		padding: 0 20px 0 20px;
		height: 130px;
	}
}

@media only screen and (max-width: 1024px) {

	.container {
		width: 840px;
	}
	#panelContainer {
		right: 50%;
		margin-right: -420px;
		top: 190px;
		width: 840px;
	}	
	#sloganPanel {
		font-size: 20px;
	}
	.submenu {
		margin: 10px;
	}
	.submenu {
		width: 220px;
		height: 340px;
		margin-bottom: 20px;
	}
	.submenu img {
		height: 55px;
	}
	.icon {
		height: 115px;
	}
	.iconSubmenu,
	.iconSubmenuHover {
		top: 35px;
	}
	.title {
		font-size: 16px;
		height: 45px;
		padding: 0 8px 0 8px;
	}
	.dots {
		font-size: 14px;
		line-height: 5px;
		padding-bottom: 2px;
		padding-top: 2px;
	}
	.content {
		padding: 0 10px 0 10px;
		height: 140px;
		font-size: 14px;
	}
	.activePage {
		max-width: 200px;
	}
}

@media only screen and (max-width: 854px) {
	
	.container {
		width: 680px;
	}
	#panelContainer {
		margin-right: -340px;
		top: 190px;
		width: 680px;
	}	
	#wrap {
		right: 0px;
		top: 10px;
	}
	#truck {
		top: -50px;
	}
	#sloganPanel {
		max-width: 160px;
		font-size: 17px;
	}
	#holdLeft,
	#holdRight {
		height: 120px;
		width: 35px;
	}
	#holdLeft {
		left: 210px;
		margin-right: 5px;
	}
	#holdRight {
		margin-left: 5px;
	}
	.submenu,
	.submenu.middle {
		margin: 0 0 15px 0;
	}
	.submenu {
		width: 100%;
		height: 220px;
		display: block;
	}
	.submenu img,
	.submenu span {
		display: block;
		margin: 0 auto;
	}
	.submenu img {
		height: 55px;
	}
	.icon {
		height: 85px;
	}
	.iconSubmenu,
	.iconSubmenuHover {
		top: 18px;
	}
	.title {
		font-size: 16px;
		height: 45px;
		padding: 0 8px 0 8px;
	}
	.dots {
		font-size: 14px;
		line-height: 5px;
		padding-bottom: 2px;
		padding-top: 2px;
	}
	.content {
		padding: 0 10px 0 10px;
		height: 60px;
		font-size: 14px;
	}
	.fill {
		min-height: 200px;
		padding-bottom: 2px;
	}
}
@media only screen and (max-width: 760px) {

	.container {
		width: 580px;
	}
	#panelContainer {
		margin-right: -290px;
		top: 190px;
		width: 580px;
	}	
	#sloganPanel {
		max-width: 150px;
		padding: 12px 30px 12px 30px;
	}
	#truck {
	    width: 320px;
	    top: -25px;
	    left: 0px;
	}
	#wrap {
		right: 0px;
		top: 5px;
	}
	#holdLeft,
	#holdRight {
		margin: 6px;
		width: 20px;
		height: 140px;
	}
	#holdLeft {
		left: 205px;
	}
	.submenu,
	.submenu.middle {
		margin: 0 0 15px 0;
	}
	.submenu {
		height: 220px;
	}
	.submenu img {
		height: 55px;
	}
	.icon {
		height: 85px;
	}
	.iconSubmenu,
	.iconSubmenuHover {
		top: 18px;
	}
	.title {
		font-size: 16px;
		height: 45px;
		padding: 0 8px 0 8px;
	}
	.dots {
		font-size: 14px;
		line-height: 5px;
		padding-bottom: 2px;
		padding-top: 2px;
	}
	.content {
		padding: 0 10px 0 10px;
		height: 60px;
		font-size: 14px;
	}
	.fill {
		min-height: 200px;
		padding-bottom: 2px;
	}
	.activePage {
		font-size: 15px;
		max-width: 160px;
	}
}
@media only screen and (max-width: 640px) {
	
	.container {
		width: 580px;
	}
	#truck {
		display: none;
	}
	#holdLeft {
		left: 320px;
	}
	#holdLeft,
	#holdRight {
		margin: 6px;
		width: 25px;
		height: 160px;
	}
	#wrap {
		top: 40px;
		width: 100%;
		text-align: center;
	}
	#menu a li {
		padding: 25px 30px 25px 30px;
	}
	#searchBar {
		margin: 25px 0 25px 0;
		height: 35px;
	}
	#searchBar input,
	#searchForm button {
		height: 35px;
	}
	#containerContent {
		padding-top: 50px;
	}
	.activePage {
		font-size: 18px;
		max-width: 100%;
	}
	#sloganPanel {
		min-width: 250px;
		font-size: 22px;
		padding: 12px 30px 12px 30px;
	}
}
@media only screen and (max-width: 600px) {
	
	.container {
		width: 420px;
		text-align: center;
	}
	#menu ul {
		width: 200px;
		margin: 0;
	}
	#searchBar {
		height: 40px;
	}
	#searchForm button {
		float: left;
		height: 40px;
	}
	#searchForm input {
		height: 40px;
		width: 300px;
	}
	#wrap {
		top: 80px;
		text-align: center;
	}
	#sloganPanel {
		min-width: 210px;
	}
	#holdLeft {
		left: 260px;
	}
	.activePage {
		clear: both;
		width: 420px;
		padding: 15px 0 15px 0;
		margin-bottom: 15px;
	}
	#header img, #header span {
		float: inherit;
	}
	#header span,
	#header img {
		padding-top: 0px;
		vertical-align: middle;
	}
	.submenu {
		height: 280px;
	}
	.content {
		height: 100px;
	}
	#footerMenu {
		padding: 15px 0 0 0;
		float: inherit;
	}
}

@media only screen and (max-width: 360px) {

	.container {
		width: 340px;
	}
	#searchForm input {
		width: 250px;
	}
	#footer {
		height: 80px;
	}
	#footerMenu a li {
		display: inline;
	}
	#footer #signature {
		margin: 15px 0 10px 0;
	}
	#menu li ul {
		max-width: 130px;
	}
	#sloganPanel {
		min-width: 150px;
		font-size: 20px;
	}
}
@media only screen and (max-width: 320px) {

	.container {
		width: 300px;
	}
	#searchForm input {
		width: 220px;
	}
	#wrap {
		top: 160px;
	}
}