/* ****** RESET ****** */
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; }
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0; }
[hidden], template { display: none; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
dfn { font-style: italic; }
h1 { font-size: 2em; margin: 0.67em 0; }
mark { background: #ff0; color: #000; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img { border: 0; }
svg:not(:root) { overflow: hidden; }
figure { margin: 1em 40px; }
hr { box-sizing: content-box; height: 0; }
pre { overflow: auto; }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0; padding: 0; }
textarea { overflow: auto; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }
 
/*--------------------------------------------------------------
# BEGIN SITE STYLES HERE
--------------------------------------------------------------*/

* {margin: 0; padding: 0; outline: 0; }

body { font-family: Lato, Helvetica, Arial, Verdana, sans-serif; color: #e5e5e5; font-size: 12px; background:#bfbfbf; color: #585858; }

h1, h2 { font-family: 'Open Sans', sans-serif; font-weight: 300; margin:0 0 15px 0; text-align: center; }

h1 { font-size: 60px; line-height: 100%; margin-bottom: 35px; line-height: 72px; }

h2 { font-size: 54px; }

p { margin: 0 0 15px 0; }

a { color: #3e3e3e; }

.clear { clear: both; }

.wrap { width: 100%; max-width: 100%; min-width: 1024px; z-index: 10; position: relative; margin: 0 auto; padding: 0; }

.section { width: 100%; max-width: 100%; min-width: 1024px; z-index: 10; /*position: relative; */ margin: 0 auto; padding: 50px 0; /* height: 500px; */ box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); }

.inner { width: 1024px; margin: 0 auto; position: relative; min-height: 50px; padding:30px 0; font-size: 18px; font-family: 'Open Sans', sans-serif; font-weight: 300; }
.inner.top { width: 100%; }

.inner:after { content: ""; display: table; clear: both; }

.clear {clear: both; }

h1, h2, h3 {font-family: 'Lora', serif;}
body, p {font-family: 'Lato', sans-serif;}

/*--------------------------------------------------------------
# MENU
--------------------------------------------------------------*/
.nav { }

#navbar { height: auto; z-index: 9999; width: 100%; background: #212937; /* gradient bottom #181e2b; */ 
	background: #343d4d; /* Old browsers */
	background: -moz-linear-gradient(top,  #343d4d 0%, #181e2b 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #343d4d 0%,#181e2b 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #343d4d 0%,#181e2b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#343d4d', endColorstr='#181e2b',GradientType=0 ); /* IE6-9 */
 }

#navbar .inner { padding:0; font-weight: 400; margin: 0 auto; }

#navbar ul { text-decoration: none; font-size: 16px; color: #fff; text-transform: uppercase; width: 1024px; margin: 0 auto;}

#navbar a { color: #fff; text-decoration: none; display: block; }

#navbar li {list-style: none; display: inline-block; margin: 0; float: left;  }

#navbar:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }


#navbar.stick li.homelink { padding-left: 180px !important;}

#navbar a:hover { background: #2b5c88; }


/*--------------------------------------------------------------
# SECTIONS
--------------------------------------------------------------*/

.onethird {float: left; width: 30%; margin: 0 1.2% 40px; }
.twothirds {float: left; width: 65%; margin: 0 1.2% 40px; }

/* ****** SECTION 1 - HOME ****** */

.sTop { min-height: 130px; background:#fff url(../images/whitediamond.png) repeat; /* Background pattern from subtlepatterns.com */ color:#585858; padding: 0 0 50px;}
.sTop .inner {width: 100%; padding-top: 0; }

.banner {height: 440px; width: 100%; background: url(../images/diamondbco-banner.jpg) no-repeat center center; background-size: cover; }

.homeContent {margin: 30px auto; padding: 30px; width: 964px; font-size: 22px; line-height: 36px; }
.homeContent p { margin: 22px 0; }



/* ****** SECTION 2 - Businesses ****** */

.s1 { background:#f3f3f3; color:#585858; position: relative; }

.accordion { margin: 0; }

#businesses h3  { text-align: center; margin-top: 50px; position: relative; border-bottom: 1px solid #d2d2d2; padding: 10px; background: #316895; color: #e5e5e5; font-size: 20px; text-transform: uppercase; font-weight: normal; z-index: 9990;}

#businesses h3::before { display:block;  position:absolute;  content:'';  z-index: -100;  width: 80px;  padding-top: 15px; height: 65px;  border-radius: 50%;  background: #316895;  /*-webkit-transform: translateX(-50%);  transform: translateX(-50%);*/  top: -40px; right: 0; left: 0; margin: 0 auto; font-family: FontAwesome; }

#businesses h3.realestate::before {  content: " \f1ad";  }
#businesses h3.tech::before { content: " \f011";   }
#businesses h3.oil::before { content: " \f043";   }
#businesses h3.ag::before { content: " \f18c";   }
#businesses h3.manu::before { content: " \f0ad";   }
#businesses h3.retail::before { content: " \f118";   }



.accordion h4 { position: relative; background: none; color:#696969; cursor:pointer; margin:0 0 1px 0; padding:4px 10px; border-top: 1px solid #fff; border-bottom: 1px solid #d2d2d2; font-size: 20px; font-weight: normal; }
.accordion h4:hover { color: #3a7cab; }
.accordion h4::after { font-size: 28px; position: absolute; right: 10px; content: " \02C5"; }

.accordion h4.current { background:#e0edf3; color: #3a7cab; }
.accordion h4.current::after { font-size: 28px; position: absolute; right: 10px; content: " \02C4"; }


.accordion div.pane { background: #fff; padding: 10px; font-size: 16px; line-height: 24px; color: #696969; }
.accordion div.pane ul { margin: 15px 0 15px 20px; list-style-type: disc; max-width: 100%; font-size: 16px; }
.accordion div.pane img { text-align: center; display: block; margin: 10px auto; max-width: 90%; height: auto; }


.sitelink { color: #3a7baa; font-size: 14px; text-transform: uppercase; text-decoration: none; line-height: 30px; position: relative; font-weight: bold; }
.sitelink:hover { text-decoration: underline; }
.sitelink::after  {font-family: FontAwesome; content: "\f08e"; }

.pane {display: none;}

#businesses::before  { position: absolute; bottom: 100%; content: ""; display: block; margin: 0 auto; left: 0; right: 0; width: 0; height: 0; z-index: 1; border-style: solid; border-width: 0 72px 59px 72px; border-color: transparent transparent #f3f3f3 transparent; }

#businesses::after  { position: absolute; top: 100%; content: ""; display: block; margin: 0 auto; left: 0; right: 0; width: 0; height: 0; z-index: 1000; border-style: solid; border-width: 59px 72px 0 72px; border-color: #f3f3f3 transparent transparent transparent; width: 0; }


/* ****** SECTION 3 - Personnel ****** */

.s2 { background: #e0edf3; }

.s2 a { color: #fff; }


.accordion2 { margin:1em 0 40px; position: relative;padding-bottom: 50px; }
.accordion2 h3 { color: #485469; font-size: 24px; font-weight: 700; }
.accordion2 .title { margin: 15px 0 0; font-style: italic; min-height: 60px; }


.accordion2 .panetitle:hover { color: #3a7cab; }

.accordion2 .panetitle { font-size: 28px; position: absolute; top: 100%; height: auto; width: 50px; width: 100%; /* background: #c5dce8; */ left: 0; right: 0; text-align: center; margin: 0 auto;z-index: 1000; cursor: pointer; }

.accordion2 .panetitle::before { content: " \2295"; }
.accordion2 .panetitle.current::before { content: none; }

.accordion2 .panetitle.current::after { content: " \2212"; }

#triangle { position: absolute; top: 100%; width: 0; height: 0; border-style: solid; border-width: 45px 52.5px 0 52.5px; border-color: #c5dce8 transparent transparent transparent; text-align: center; margin-left: auto; margin-right: auto; left: 0; right: 0; }

.triangle { position: absolute; top: 100%; width: 0; height: 0; border-style: solid; border-width: 45px 52.5px 0 52.5px; border-color: #c5dce8 transparent transparent transparent; text-align: center; margin-left: auto; margin-right: auto; left: 0; right: 0; }

.person { background: #c5dce8; padding: 20px; min-height: 160px;}

.teamlist { list-style-type: none; margin-left: 0; padding: 20px; }


/*
.accordion2 .panetitle::after { font-size: 28px; position: absolute; content: " \2295"; top: 100%; height: auto; width: 50px; /* background: #c5dce8; text-align: center; margin-left: auto; margin-right: auto; left: 0; right: 0; }

.accordion2 h3.current { color: #fff; }
.accordion2 .panetitle.current::after { content: " \2212"; }

#triangle { width: 0; height: 0; border-style: solid; border-width: 45px 52.5px 0 52.5px; border-color: #c5dce8 transparent transparent transparent; }
*/



/* ****** SECTION 4 - Contact ****** */

.s3 { background: #485469; color: #fff; }
.s3 h2 { color: #e0edf3; }
.s3 a { color: #c5dce8; }
.s3 a:hover, .s3 a:focus, .s3 a:active { color: #fff; }

#contact h3 { margin-bottom: 15px; border-bottom: 1px solid #fff;}
#contact .onethird { margin-bottom: 20px; }

.social {margin-bottom: 15px; }

.social a {color: #555c67; padding: 5px; border: 1px solid #555c67; border-radius: 50%; text-align: center; width: 28px; height: 28px; display: inline-block; }
.social a:hover, 
.social a:active, 
.social a:focus {color: #275881; border: 1px solid #275881; }

.fa { vertical-align: middle; }

#bigHalfCircle path { fill: darken($color1, 7%); stroke: darken($color1, 7%); $color1:#485469; }

iframe { margin: 10px 0; }


/*--------------------------------------------------------------
# FOOTER
--------------------------------------------------------------*/
.footer {background: #1b2028; color: #cdcdcd; font-size: 14px; text-align: center; }
.footer a {color: #cdcdcd; text-decoration: none; }

.footer p.attribute {font-size: 12px; }
.footer a:hover, 
.footer a:focus, 
.footer a:active {color: #fff; }

.section.footer {box-shadow: none; font-size: 14px;}



/* =The stylezzzz
-------------------------------------------------------------- */

body { position: relative; height:100%; }

/* navigation */

nav { width: auto; padding:0; }

nav.stick { position: fixed; top: 0; z-index: 10000; margin-top:0;  }

#navbar.stick .whitelogo, #navbar.stick .bfistickylogo { display: block; }

nav ul { list-style-type:none; margin:0; padding:0; position: relative;}

nav li a { color: #fff; font-weight: normal; padding: 20px; }

a.nav-active { color:#fff; background: #3b7ead; }


hr { border:none; background-color:rgb(220,220,220); height:12px; margin-bottom:18px; }


.main-logo img {float: left; margin: 10px; }
.bfi-logo { float: right; /* margin: 30px; */ }

#navbar .toggle-nav { display:none; }

#navbar ul {position: relative;}

.whitelogo {position: absolute; top: -40px; display: none;}
.bfistickylogo {position: absolute; top: 0; right: 5px; display: none; }
.bfistickylogo img {background: #fff none repeat scroll 0 0; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.4); display: block;  height: 90px; padding: 5px;      width: auto;}


nav#navbar.stick li.homelink { padding-left: 180px !important;}


/*                                                     
 _____     _   _ _        _____ _       _         
|     |___| |_|_| |___   |   __| |_ _ _| |___ ___ 
| | | | . | . | | | -_|  |__   |  _| | | | -_|_ -|
|_|_|_|___|___|_|_|___|  |_____|_| |_  |_|___|___|
                                   |___|              */




	
	
@media screen and (max-width: 1023px) { 
	#navbar ul { width: 100%;}

	.section, .wrap {min-width: 80%; max-width: 100% !important; }
	.homeContent, .inner {width: 90%; }
	iframe {width: 90% !important; margin: 10px auto; }
}

@media screen and (max-width: 940px) { 
	nav li a {padding: 20px 15px;}
}

@media screen and (max-width: 840px) { 
	#navbar ul { font-size: 14px; }
	nav li a {padding: 20px 10px;}
}



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

	#nav.js { display: none; }
	ul { width:100%; list-style:none; }
	li { width:100%; border-right:none; }
	
	#navbar ul { display: none; max-width: 100%;}
	
	#navbar ul.toggle { display: block; }
	
	#navbar .toggle-nav { display: block; background: #212937; text-shadow:0px 1px 0px rgba(0,0,0,0.5); color:#3b7ead; height: 50px; font-size:28px; transition: color linear 0.15s; width: 100%; border: none;  }
	
	.toggle-nav:hover, .toggle-nav.active { text-decoration:none; color:#66a992; }
	.banner { height: 300px;}
	.main-logo img {width: 120px; }
	.bfi-logo img { width: 100px; }
	
	.whitelogo, .bfistickylogo {display: none !important;}
	nav#navbar.stick li.homelink {padding-left: 0 !important;}
	
	#businesses h3, .accordion h4 { font-size: 18px; }	
	}
	

@media screen and (max-width: 670px) { 
		
	#businesses h3 {font-size: 18px;}
	.accordion2 h3 { font-size: 21px;}
	.accordion2 p.title { font-size: 16px;}
	.accordion h4 {font-size: 16px;}

}	

@media screen and (max-width: 600px) { 
	h1 { font-size: 48px; line-height: 54px; }
	h2 { font-size: 36px; line-height: 42px; }
	.homeContent { font-size: 19px; width: 80%; }
	.onethird, .twothirds {width: 90%; display: block; float: none; margin-left: auto; margin-right: auto; margin-bottom: 80px;}
	.inner {font-size: 16px; width: 90%;}

}

@media screen and (max-width: 480px) { 
	h1 { font-size: 36px; line-height: 42px;}
	h2 { font-size: 30px; line-height: 36px;}
	.banner { height: 200px; }
	.onethird, .twothirds { margin-bottom: 40px; }
	iframe { height: 300px; text-align: center;}
}