/* define custom color variables, the leading -- is required */
/* custom variables do not work in Internet Explorer         */
:root {
	--bcm-blue:#56A1D5;
	--bcm-green:#9FA615;
	--bcm-light-green:#CFD28A;
	--bcm-dark-brown:#352D1B;
	--bcm-medium-brown:#564A31;
	--bcm-light-brown:#5C5038;
	--bcm-dark-gray:#696969;
	--bcm-medium-gray:#DCDCDC;
	--bcm-light-gray:#F1F1F1;	
	--bcm-white:#FFFFFF;
}

/* ASTROID **************************************************************** */

.nav-submenu {
	width: 400px;
}	
/* BANNER (begin) ---------- */
#bcm-banner {
	background-color: var(--bcm-blue); 
	color: var(--bcm-blue);
	margin: 0px;
	padding: 0px; 
}

#bcm-banner-text {
	background-color: var(--bcm-light-gray);
	padding: 25px; 
	padding-bottom: 15px; 
}

#bcm-banner-text h1 {
	color: var(--bcm-blue);
}

/* BANNER (end) ---------- */

/* FEATURED (begin) ---------- */
.bcm-featured {
	background-color: var(--bcm-dark-brown);
	color: var(--bcm-white);
	padding: 20px; 
}

.bcm-featured h3 {
	background-color: var(--bcm-dark-brown);
	color: var(--bcm-green);
	padding: 20px; 
}

.bcm-featured a {
	color: var(--bcm-blue);
}

.bcm-featured a:hover {
	color: var(--bcm-green);
}
/* FEATURED (end) ---------- */

/* CONTENT (begin) (about, contact, etc) ---------- */
.bcm-content {
	background-color: var(--bcm-dark-brown);
	color: var(--bcm-white);
	padding: 0px; 
}

#bcm-content-row {
	margin: 0px;
	padding: 0px;
}
.bcm-content h1 {
	background-color: var(--bcm-blue);
	color: var(--bcm-green);
	padding: 20px; 
}

.bcm-content a {
	color: var(--bcm-blue);
}

.bcm-content a:hover {
	color: var(--bcm-green);
}

.bcm-content h2 {
	color: var(--bcm-green);
}

.bcm-sidebar-left {
	background-color: var(--bcm-white);
	color: var(--bcm-dark-gray);
	margin-top: 0px; 
	padding: 20px;
}

.bcm-sidebar-right {
	background-color: var(--bcm-light-green);
	color: var(--bcm-dark-gray);
	padding: 20px;
}
/* CONTENT (end) ---------- */


/* about us sub menu (begin) ---------- */
.btn-menu-about-sub .button {
	background-color: var(--bcm-medium-gray);
	border: none;
	color: var(--bcm-blue);
	padding: 10px 16px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 15px;
	custor: pointer;
	float: left;
}

.btn-menu-about-sub .button:hover {
	background-color: var(--bcm-dark-gray);
	color: var(--bcm-green);
}
/* about us sub menu (end) ---------- */


.job-application {
	background-color: var(--bcm-dark-brown);
}

/* FOOTER (begin) ---------- */
#bcm-footer {
	background-color: var(--bcm-light-gray); 
	margin: 0px;
	padding: 0px; 
}

#bcm-footer1, #bcm-footer2, #bcm-footer3, #bcm-footer4 {
	background-color: var(--bcm-light-gray);
	color: var(--bcm-blue);
	margin-top: 0px; 
	margin-bottom: -16px;
	margin-right: -24px;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}

#bcm-footer4 {
	color: var(--bcm-green); 
}
#bcm-footer1 a, #bcm-footer2 a, #bcm-footer3 a, #bcm-footer4 a {
	color: var(--bcm-green);
}	
#bcm-footer1 a:hover, #bcm-footer2 a:hover, #bcm-footer3 a:hover, #bcm-footer4 a {
	color: var(--bcm-blue);
}
/* FOOTER (end) ---------- */

/* states menu -------------------------------------------------- BEGIN */

div#menu-states {
	margin-right: 200px;
	float: right;
}

div#menu-states a {
    text-decoration: none;
    color: #9FA615;
    display:inline-block;
}
div#menu-states ul {
  display: inline;
  margin: 0px;
}
div#menu-states ul li {display: inline-block;}

div#menu-states ul li:hover ul {
	display: block;
}
div#menu-states ul li ul {
  position: absolute;
  display: none;
  border-bottom:5px solid #ffffff;
}
div#menu-states ul li ul li { 
  width: 360px;
  background: #5C5038; 
  display: block; 
  opacity: 0.95;
  padding: 3px 10px;
  border-left:5px solid #ffffff;
  border-right:5px solid #ffffff;
  margin-left: -32px;
}
div#menu-states ul li ul li a {display:block !important;} 


@media screen and (max-width: 767px) {
div#menu-states a {
    text-decoration: none;
    color: #9FA615;
    display:inline-block;
}
div#menu-states ul {
  display: inline;
  margin: 0px;
}
div#menu-states ul li {display: inline-block;}
div#menu-states ul li:hover ul {
	display: block;
}
div#menu-states ul li ul {
  position: absolute;
  display: none;
  border-bottom:5px solid #ffffff;
}
div#menu-states ul li ul li { 
  width: 382px;
  background: #5C5038; 
  display: block; 
  opacity: 0.95;
  padding: 1px 10px;
  border-left:5px solid #ffffff;
  border-right:5px solid #ffffff;
}
div#menu-states ul li ul li a {display:block !important;} 
}

/* states menu -------------------------------------------------- END */