@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500i,700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
/***** BEGIN RESET *****/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;	
}

ol, ul {list-style: none;}
img{max-width: 100%; height: auto;}

/*
font-family: 'Open Sans', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Roboto', sans-serif;
 */

body{
	font-family:  'Montserrat', sans-serif !important;
	font-weight: 400;
	font-size: 16px;
	line-height: 26px;
	overflow-x: hidden;
	width: 100%;
	color: #232323
}

.clear{clear: both}

a{text-decoration: none}


.wrapper-inner{width: 80%; margin: 0 auto}
.wrapper-center{width: 80%; margin: 0 auto; text-align: center}

.pad{padding: 20px 0;} .l-pad{padding: 50px 0;} .xl-pad{padding: 80px 0}

.green-bg{background: #2f7f05; color: #fff;}

#green-btn{background: #2f7f05; color: #fff !important; padding: 12px 25px; text-decoration: none; display: inline-block; margin: 2px; font-weight: 700; letter-spacing: .75px; font-size: 15px;}
#green-btn:hover{background: #ffba00; color: #fff !important;}


/*-- new content 10/26/21 --*/
.header{display: flex; align-items: center; background: #2f7f05; box-shadow: 0px 6px 14px -7px rgba(0,0,0,.1); position: relative; z-index: 111}
.header .left{justify-content: flex-start; width: 20%; background: #075807; padding: 20px 0}
.header .right{justify-content: flex-start; width: 80%;}

.header-btns{display: inline-block; float: right; margin-right: 20px;}
.header-btns a{background: #fff; color: #2f7f05 !important; padding: 12px 18px; text-decoration: none; display: inline-block; margin: 2px; font-weight: 700; letter-spacing: 0px; font-size: 15px;}
.header-btns a:hover{background: #075807; color: #fff !important;}

/*-- home page --*/

.cycle-slideshow{width: 100%; display: block; position: relative;}
.cycle-slideshow img{width: 100%; display: block;}

.welcome{margin: 0 auto; position: relative; left: 0; right: 0; text-align: center;}
.welcome .left{text-align: left; display: inline-block; vertical-align: middle; margin-right: 40px;}
.welcome .left h1{color: #2f7f05; font-size: 35px; line-height: 45px; font-weight:400} .welcome .left h1 span{font-size: 45px; font-weight: 700;}
.welcome .right{display: inline-block; vertical-align: middle; text-align: left}

.categories{display: flex;}
.cat-box{justify-content: flex-start; width: 25%; background: #2f7f05; color: #fff; padding: 30px 0; text-align: center; text-decoration: none; text-transform: uppercase; margin:0 5px}
.cat-box img{width: 100%; max-width: 250px;}
.cat-box h2{font-size: 18px; margin-top: 10px; letter-spacing: 1px}

.cat-box:hover{background: #ffba00}

/*-- about page --*/
.about{display: flex;}
.about .left{width: 50%; justify-content: flex-start; text-align: left; margin-right: 50px}
.about .left h1{color: #2f7f05; font-size: 35px; line-height: 45px;} .about .left h1 span{font-size: 45px; font-weight: 700;}
.about .right{width: 50%; justify-content: flex-start}
.about .right h6 {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #000000;
}

.about .left h2 span {font-size: 45px;font-weight: 700;}

.celebrating h2 {color: #2f7f05;
    font-size: 35px;
    line-height: 45px;}

.contact-wrapper .left h2 {font-size: 2em;}

/*-- inventory --*/
.inv-buttons{display: flex;}
.inv-btn{flex: 1; background: #2f7f05 ; color: #fff; padding: 15px 25px; text-align: center; margin: 5px; text-decoration: none !important; font-weight: 700; letter-spacing: .75px}
.inv-btn:hover{background: #ffba00; color: #075807}

/*-- contact page --*/
.contact-wrapper{display: flex;}
.contact-wrapper .left{justify-content: flex-start; width: 50%;}
.contact-wrapper .left form{width: 90%;}
.contact-wrapper .right{justify-content: flex-start; width: 50%;}

/*-- all page --*/
.masthead{background: #f5f5f5; padding: 30px 0}
.masthead h1{font-weight: 700; color: #2f7f05}


/* --scrolling inventory----*/
.scrolling-wrap {
    width:100%;
    height:90px;
    overflow:hidden;
}
 
.scrolling{
    width:100%;
    height:92px;
}

/*-- FOOTER ------------------------------------*/
.footer{color: #fff; display: flex;}
.footer ul li{font-weight: 300; line-height: 30px; font-size: 15px;} .footer a{color: #fff} .footer li a:hover{text-decoration: underline} .footer p{font-size: 15px;} .footer p a{color: #fff} .footer h4{margin-bottom: 10px; font-weight: 700; letter-spacing: .25px}

.footer .foot-col{justify-content: flex-start; width: 20%; margin: 0 10px}
.footer .foot-col-2{justify-content: flex-start; width: 60%; margin: 0 10px}
.footer .foot-col-2 .col-2{display: inline-block; width: 40%; vertical-align: top}


.footer img{width: 100%; max-width: 150px; display: block; margin:0 auto;}



/*---FORMS -----------------------------------*/
.form-row{display: flex;}
.formfield{flex: 1; font-family: 'Montserrat', sans-serif; position: relative; padding: 5px 0; margin:3px 5px; font-size:15px;}


.formfield input, .formfield select  {
	width: 100%;
	padding: 15px 0;
	border: 1px solid #ddd;
	background:#f5f5f5;	
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	-webkit-appearance:none;
	border-radius: 0 !important;
	-webkit-border-radius: 0px !important;
}

input.radio {
    padding:0; 
    border:0;
    margin:0 5px 0 0;
    width:15px;
    height:15px;
    display:inline;
	
 }
.formfield textarea {
	width: 100%;
	padding: 10px 0;
	border:none;
	font-weight: 400;
	color:#000;
	background:#f5f5f5;
	font-family: 'Montserrat', sans-serif;
    height:85px;	
	-webkit-appearance:none;
	border-radius: 0 !important;
	-webkit-border-radius: 0px !important;
} 

form input.button,
form input.button:focus {
	float: none;
    width:160px;
	font-family: 'Montserrat', sans-serif;
    margin:0 auto;
    background: #404040; /* For browsers that do not support gradients */
    line-height:18px;
    color:#fff;
	font-size:15px;
	padding: 10px 20px;
	font-weight: 700;
	letter-spacing:2px;
	text-align: center;
	display: block;
	border: none;
	-webkit-appearance:none;
	border-radius: 0 !important;
	-webkit-border-radius: 0px !important;
}
form input.button:hover {
    padding:10px 0px;
    background: #000; /* For browsers that do not support gradients */
	margin: 0 auto;
	text-align: center;
	display: block;
	transition: all .8s ease; 
}

/*control the Captcha */

.CaptchaPanel {margin: 0 auto !important;padding:0 0 0 0 !important;line-height:normal !important;color:#000 !important;width: 100%;  text-align:left;}
.CaptchaPanel input{width: 100% !important; max-width: 300px;}
.CaptchaImagePanel {
	
margin-top: 10px;
padding:0 0 0 0;
}

.CaptchaMessagePanel {
padding:0 0 0 0 !important;
margin:0 0 0 0 !important;
font-weight:normal !important;
font-size:12px;
line-height:14px;
text-align: center;
	color: #000 !important
}

.CaptchaAnswerPanel {
margin:0 0 0 0;
padding:2px 0px 2px 0px !important;
}

.CaptchaWhatsThisPanel {
	line-height:0;
	margin:0 auto;
	padding:10px 0 10px 0 !important;
	width: 100%;
	float: right;
	display: block;
}
.CaptchaWhatsThisPanel a {color:#000;}
.CaptchaWhatsThisPanel a:hover {text-decoration:none;} 




/*==========================================
			Responsive CSS
==========================================*/
@media only screen and (max-width: 1460px) {

.header-btns{; margin-right: 10px;}
.header-btns a{padding: 12px 12px;  font-size: 13px;}

}

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

@media only screen and (max-width: 992px) {
	.xl-pad{padding: 65px 0}	
	
	.wrapper-inner, .wrapper-center{width: 90%;}	
	
.welcome{display: block; width: 90%; margin: 0 auto;}
.welcome .left, .welcome .right{width: 100%; display: block; margin-right: 0; text-align: center}
.welcome .left h1{color: #2f7f05; font-size: 30px; line-height: 45px; margin-bottom: 30px} .welcome .left h1 span{font-size: 40px;}
	
.cat-box h2{font-size: 15px; width: 90%; margin: 0 auto}	
	
/*--about*/
.about{display: block;}
.about .left, .about .right{width: 100%; justify-content: flex-end; text-align: left; margin-right: 0}
.about .left h1{color: #2f7f05; font-size: 30px; line-height: 45px;} .about .left h1 span{font-size: 40px;}
	
/*-- contact page --*/
.contact-wrapper{display: block;}
.contact-wrapper .left, .contact-wrapper .right{justify-content: flex-end; width: 100%;}
.contact-wrapper .left .cform{width: 95%; margin-bottom: 50px}

	
/*-- FOOTER ------------------------------------*/
.footer{ display: block; text-align: center}

.footer .foot-col{justify-content: flex-end; width: 100%; margin: 10px auto}
.footer .foot-col-2{justify-content: flex-end; width: 100%; margin: 20px auto}
.footer .foot-col-2 .col-2{display: block; width: 100%; vertical-align: top}
	

}

@media only screen and (max-width:700px) {
.categories{display: block} .categories.pad{padding: 0}
.cat-box {justify-content: flex-end; width: 100%; margin: 5px auto; display: block;}
	
.inv-buttons{display: block;}
.inv-btn{display: block; padding: 15px 0; width: 100%; margin: 5px auto;}
	
	
/*-- header --*/
.header{display: block;}
.header .left,.header .right{justify-content: flex-end; width: 100%; padding: 15px 0}

.header-btns{display: block; float: none; margin: 0 auto 10px auto; text-align: center}
.header-btns a{background: #fff; color: #2f7f05 !important; padding: 12px 18px; text-decoration: none; display: inline-block; margin: 2px; font-weight: 700; letter-spacing: 0px; font-size: 15px;}
.header-btns a:hover{background: #075807; color: #fff !important;}
		
}

@media only screen and (max-width:450px) {
	.header-btns a{padding: 12px 0; display: block; margin: 2px auto; width: 90%}

}