/* Custom Classes */
.form-control{
	border-radius: 2px;
	border: none;
}

.form-control:focus{
	-webkit-box-shadow: none;
	box-shadow: none;
}

/* Reset for 7 columns on Home page */
.col-7 .col-sm-2 {
    width: 14.285%;
}

h1,h2,h3,h4{
	font-family: 'Roboto', sans-serif;
}

.slab{
	font-family: 'Roboto Slab', serif;
}

.robo{
	font-family: 'Roboto', sans-serif;
}

/*  Important for getting rid of the li display: iline-block space in Main Nav */
.navbar ul{
	font-size: 0;
}

.search input{
	background-color: #f2f2f2;
	border: 1px solid #ccc;
}

a{
	color: #556b2f !important;
}

a:hover{
	color: #556b2f;
	text-decoration: underline;
}

a:visited {
  color: #556b2f;
  text-decoration: none !important;
}

.green{
	color:#556b2f;
}

.ctaBtn{
	background-color: #556b2f;
	color: #fff !important;
	text-shadow: none;
	font-weight: 300;
	font-family: 'Roboto', serif;
	text-transform: uppercase;
	border:none;
	border-radius: 4px;
	padding: 12px 25px;
}

.ctaBtn:hover{
	background-color: #77ab59 !important;
}

.ctaBtnWhite{
	background-color: transparent;
	color: #fff !important;
	text-shadow: none;
	font-weight: 400;
	font-family: 'Roboto', serif;
	text-transform: uppercase;
	border-radius: 0px;
	border:2px solid #fff;
	display: inline-block;
    margin: 0px;
    padding: 12px 25px;
	transition: all 0.3s ease;
}

.ctaBtnWhite:hover{
	background-color: #fff;
	color:#556b2f !important;
}
/* End Custom Classes */


/* Header */
.logoHeader{
	display: inline-block;
}

.logoHeader:hover, .logoHeader:visited, .logoHeader:active{
	text-decoration: none !important;
}

.logoHeader h1{
	color: #222;
	font-size: 36px;
	padding:0px;
	margin: 0px;
	padding-bottom: 5px;
	font-weight: 900;
	text-transform: uppercase;
}

.logoHeader h3{
	padding:0px;
	margin: 0px;
	padding-bottom: 10px;
	color: #999;
	font-size: 24px;
	padding-left: 3px;
	font-weight: 500;
}

.topRightInfo{
	text-align: right;
	padding-top:3px;
}

.greenHeaderSmall{
	color: #556b2f;
	padding: 0px;
	margin: 0px;
	text-transform: uppercase;
	font-weight: 600;
}

.phone{
	font-size: 14px;
	padding: 0px;
	margin: 0px;
}

.navbar-brand{
	float: right;
	height: auto !important;
	color: #fff !important;
	padding: 0px !important;
	margin: 8px 15px 0px 0px;
	font-weight: 300;
}

.navbar-brand h4{
	padding:0px;
	margin:0px;
	font-weight: 300;
	font-size: 20px;
}

.navbar{
	margin: 0px;
	min-height: auto;
}

.navbar a{
	font-size:15px;
	background-color: transparent;
	text-decoration: none;
	color: #fff !important;
	padding: 14px 42px !important;
	margin: 0px;
	transition: all 0.3s ease;
	text-transform:uppercase;
	font-weight: 400;
	letter-spacing:1px;
	font-family: 'Roboto', serif;
}
	
.navbar a:hover{
	background-color:#77ab59 !important;
	color:#fff !important;	
}

.navbar .sublink{
	background-color: #444;
	padding: 7px 15px !important;
	text-transform: none;
	font-size: 14.5px;
	font-weight: 300;
	font-family: 'Roboto', serif;
}

.navbar-toggle {
    background-color: #ffdd00;
	border: none;
	margin-right:15px;
	margin-top: 2px
}
	
.navbar-inverse {
    background-color: transparent;
    border: none;
	border-radius:0px;
}

.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: #ffdd00;
	text-decoration: none !important;
	border: none !important;
}
	
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border-color: transparent;
	text-decoration: none !important;
	border: none !important;
}

.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {
    background-color: #77ab59 !important;
	text-decoration: none !important;
	border: none !important;
}

.navbar-nav{
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}

.dropdown-menu {
	min-width: 100%;
	border-radius: 0px !important;
	border: none !important;
}

.burgerMenuIcon{
	font-size: 24px !important;
	color: #fff !important;
	padding: 6px 10px !important;
	background-color: #556b2f;
	border-radius: 4px;
	transition: all 0.3s ease;
}

.burgerMenuIcon:hover{
	background-color: #77ab59;
}

.menu{
	background-color: #231f20;
}

.nav {
	/* Center the main menu links */
	width: 100%;
	text-align: center;
}

.nav > li {
	float: none;
	display: inline-block;
}

.current{
	background-color: #556b2f !important;
}

.icon-home{
	display: none;
}

/* End Header */


/* Content */
.overlay{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.15;
    z-index: 1;
}

.sliderTitle{
	font-weight: 500;
	text-shadow: 0px 1px 6px #333;
}

.mainIconBox{
	padding: 0px;
	margin: 0px;
	border-top: 1px solid #77ab59;
	border-right: 1px solid #77ab59;
	border-bottom: 1px solid #77ab59;
	background-color: #556b2f;
}

.mainIconBox:first-child{
	border-left: 1px solid #77ab59;
}

.mainIconLink{
	height:100%;
	width:100%;
	display:block;
	padding-top:30px;
	padding-bottom:30px;
	text-decoration: none !important;
	transition: all 0.3s ease;
}

.mainIconLink:hover{
	text-decoration: none !important;
	background-color: #77ab59;
}

.mainIconLink img{
	width: 135px;
	margin: 0 auto;
	display: inline-block;
}

.mainIcon{
	font-size: 46px !important;
	padding-top:5px !important;
	transition: all 0.3s ease;
	color: #fff;
}

.mainIconHeader{
	margin:0px;
	padding:0px;
	font-size: 20px;
	transition: all 0.3s ease;
	line-height: 1.3em;
	margin-top:10px;
	color: #fff;
	font-weight: 400;
	text-transform: uppercase;
}

.mainIconLink:hover .mainIcon, .mainIconLink:hover .mainIconHeader{
	color: #fff !important;
}

.banner{
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: #ebebeb;
	color: #333;
}

.bannerImg{
	padding:10px;
	border: 1px solid #ddd;
	margin-bottom: 50px;
}

.bannerImgFull{
	padding-top: 225px;
    padding-bottom: 225px;
    background-color: #ebebeb;
    color: #333;
    background-size: cover;
}

.title{
	text-align: center;
	text-transform: uppercase;
	margin: 0px;
	padding: 0px;
}

.greenHeader{
	color:#556b2f;
	font-weight: 500;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	margin:0px;
}

.greenCircle{
	background-color:#556b2f;
	color: #fff;
	border-radius: 50%;
	border: 3px solid #fff;
	box-shadow: 0px 2px 1px #888;
	display: inline-block;
	width:50px;
	height:50px;
}

.contact img{
	width: 250px;
	/*box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);*/
	border: 10px solid #eee;
	display: inline-block;
	margin: 0 auto;
}

.contact .name{ 
	padding:0px;
	margin:0px;
	padding-top:10px;
	font-size: 20px;
}

.contact .position{
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	font-weight: 300;
}

.suppliers a{
	border: 10px solid #eee;
	display: inline-block;
	transition: all 0.3s ease;
}

.suppliers a:hover{
	border: 10px solid #77ab59;
}


/* End Content */


/* Footers */
.subFooter{
	padding: 20px 0px 10px 0px;
	color: #555;
	margin: 0px;
	background-color: #ebebeb;
	border-top: 1px solid #eee;
}

.subFooterInfo{
	display:inline-block;
	line-height: 1.4em;
	margin:0px;
	font-size: 15px;
}

.footer {
    background-color: #231f20;
    color: #fff;
	padding: 10px 0px 0px 0px;
}

.copyright{
	font-size: 14px;
	padding-top: 10px;
}

.usAgNetLink, .usAgNetLink:hover{
	color: #77ab59 !important;
}
/* End of Footer*/


/* Media Query for large screen (lg) */
@media (max-width: 1200px) {
	/* Header */
	.topRightInfo{
		padding-top: 5px !important;
	}
	
	.navbar a {
		padding: 14px 28px !important;
		font-size: 14px;
	}
	/* End Header */
	
	
	/* Content */
	
	/* End Content */
	
	
	/* Footer */
	
	/* End Footer */
}


/* Media Query for medium screen (md) */
@media (max-width: 992px) {
	/* Header */
	.logoHeader h1{
		font-size: 36px;
	}

	.logoHeader h3{
		font-size: 18px;
		padding-top: 5px;
	}

	.topRightInfo{
		float:right;
	}
	
	.location{
		font-size: 16px;
	}
	
	.navbar-header{
		padding: 8px 0px;
	}
	
	.navbar-right{
		text-align: center !important;
	}
	
	.navbar a {
		padding: 14px 15px !important;
		font-size: 13px;
	}
	
	.icon-home{
		display: inline;
	}
	
	.text-home{
		display: none;
	}
	/* End Header */
	
	
	/* Content */
	.bannerImgFull{
		padding-top: 150px;
		padding-bottom: 150px;
	}
	
	.sliderCta{
		padding:0px;
		margin:0px;
	}
	
	.btnTitle{
		font-size:14px !important;
	}
	
	.mainIconLink{
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	.mainIconHeader{
		font-size: 15px;
	}
	
	.contact .name{ 
		font-size: 18px;
	}

	.contact .title{
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		font-weight: 300;
	}
	/* End Content */
	
	
	/* Footer */	
	.footerLogoImgs{
		float:left;
		margin: 10px 0px;
	}
	/* End Footer */
}

/* Media Query for extra small screen (xs) */
@media (max-width: 767px) {
	/* Header */
	.col-7 .col-sm-2 {
		width: 50%;
	}
	
	.seventhIconBox{
		width: 100% !important;
	}
	
	.logoHeader h1{
		font-size: 26px;
	}

	.logoHeader h3{
		color: #808080;
		padding: 0px;
		padding-bottom: 8px;
	}
	
	.logo{
		text-align: center;	
	}
	
	.topRightInfo{
		display: none;
	}
	
	/* Remove the center links for mobile*/
	.nav {
		width: auto !important;
		padding:0px;
		margin:10px 0px;
	}
	.nav > li {
		position: relative;
		display: block !important;
		border: none !important;
	}
	
	.nav > li a {
		display: block !important;
		text-align: left;
		padding-left:15px !important;
		padding-top: 10px !important;
		padding-bottom: 10px !important;
	}
	/* End of removing the center links */
	
	.menu{
		background-color: #231f20 !important;
		border: none;
	}
	
	.navbar a{
		border-bottom: 1px solid #444;
	}
	
	.navbar .sublink{
		padding-left: 30px !important;
		border: none;
		font-size: 14px !important;
	}
	
	.dropdown-menu{
		margin-top: 0px !important;
		margin-bottom: 0px !important;
	}
	
	.navbar-collapse{
		padding-left: 0px;
		padding-right: 0px;
		border: none !important;
	}
	
	.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
		background-color: #231f20 !important;
		border: none !important;
	}

	.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {
		background-color: #231f20 !important;
		color: #fff !important;
		border: none !important;
	}
	
	.icon-home{
		display: none;
	}
	
	.text-home{
		display: inline;
	}
	/* End Header */
	
	
	/* Content */
	.bannerImgFull{
		padding-top: 100px;
		padding-bottom: 100px;
	}
	
	.carousel-caption{
		padding-bottom: 10px !important;
	}
	
	.firstIconBox, .secondIconBox, .thirdIconBox, .fourthIconBox, .fifthIconBox, .sixthIconBox{
		border-bottom: none;
	}
	
	.thirdIconBox, .fifthIconBox{
		border-left: 1px solid #77ab59 !important;
	}
	/* End Content */
	
	
	/* Footers (xs) */
	.subFooterInfo{
		font-size: 14px;
	}
	
	.subFooterInfo strong{
		font-size: 15px;
	}
	
	.copyright{
		text-align: center;
	}
	/* End Footer (xs) */
}





/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 
*/

.slideshow{
	margin: 0 auto;
}

.carousel-fade{
	/*box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);*/
	border: 10px solid #eee;
}

.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}
