/* Bay 67 CSS by run2 - December 2015 */
/* main stylesheet - dark blue #283960; light blue: #82ceee */

html, body {
  height: 100%;
}

body {
font-family: Tahoma, Trebuchet, Verdana, Arial, sans-serif;
color: #000; 
margin: 0;
padding-top: 50px;
text-align: center; 
background: #82ceee url(/assets/bodybg.gif) repeat-x;
}

/* Specialist Fonts */
@font-face {
    font-family: 'Signpainter';
    src: url('/assets/fonts/signpainter.eot');
    src: url('/assets/fonts/signpainter.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/signpainter.woff') format('woff'),
         url('/assets/fonts/signpainter.ttf') format('truetype'),
         url('/assets/fonts/signpainter.svg#Signpainter') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Rockwell';
    src: url('/assets/fonts/rockwell.eot');
    src: url('/assets/fonts/rockwell.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/rockwell.woff') format('woff'),
         url('/assets/fonts/rockwell.ttf') format('truetype'),
         url('/assets/fonts/rockwell.svg#Rockwell') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Rockwell_bold';
    src: url('/assets/fonts/rockwell-bold.eot');
    src: url('/assets/fonts/rockwell-bold.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/rockwell-bold.woff') format('woff'),
         url('/assets/fonts/rockwell-bold.ttf') format('truetype'),
         url('/assets/fonts/rockwell-bold.svg#Rockwell_bold') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* General Typography */
h1 { margin: 30px 0 15px 0; padding: 0; font-size: 3em; font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #283960; }
	h1 small { margin-left: 15px; font-family: 'Rockwell', Tahoma, Trebuchet, Verdana, Arial, sans-serif; }
h2 { margin: 30px 0 15px 0; padding: 0; font-size: 2.5em; font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; color: #82ceee; }
	h2 small { margin-left: 15px; font-family: 'Rockwell', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #fff; }
h3 { margin: 30px 0 0 0; padding: 0; font-size: 1.1em; font-family: 'Rockwell', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #82ceee; }
h4 { margin: 0; padding: 0; font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; color: #fff; } 
p { margin: 0 0 10px 0; }
ul { margin: 0 0 10px 0; }
	ul.disc { list-style: disc; margin-left: 17px; }
	ul.lead { margin-top: -20px !important; }
table { margin: 0; padding: 0; }
a { 
color: #82ceee; 
text-decoration: underline; 
-webkit-transition: all 0.2s ease-in;  /* Saf3.2+, Chrome */
-moz-transition: all 0.2s ease-in;  /* FF4+ */
-ms-transition: all 0.2s ease-in;  /* IE10? */
-o-transition: all 0.2s ease-in;  /* Opera 10.5+ */
transition: all 0.2s ease-in;
margin: 0; 
padding: 3px 0;
}
a:hover { background: #283960; color: #fff; text-decoration: none; }


/* Span Classes */
.Rockwell_bold { font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; }
.Rockwell { font-family: 'Rockwell', Tahoma, Trebuchet, Verdana, Arial, sans-serif; }
.Signpainter { font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; } 
.dkblue { color: #283960; }
.ltblue { color: #82ceee; }

.right { float: right; }
.clear { clear: both; }
.offleft { position: absolute; left: -999px; width: 990px; visibility: hidden; }
.noborder { border: none; margin: 0; }
.rule { clear: both; margin-bottom: 30px; border-bottom: 1px solid #09c; }
.clear { clear: both; }
iframe { margin-bottom: 15px; }
form { margin-top: 15px; }
.fa { width: 1.5em; }
.abbr { display: inline-block; width: 1em; margin-right: 10px; }
hr { border-top: 1px solid #09c; }
hr.project { border-top: 1px solid #09c; margin-top: 0; }
.spaced { display: block; margin: 30px 0 15px 0; }
.lead { font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; font-size: 1.2em; margin-top: 30px; }
.top-5 { margin-top: 5px; }
.top-20 { margin-top: 20px; }
.top-30 { margin-top: 30px; }
.top-60 { margin-top: 60px; }
.prev_link { margin-right: 15px; }
.next_link { margin-left: 15px; }

.btn { 
background: #fff; 
color: #09c; 
border: 1px solid #09c; 
-webkit-transition: all 0.2s ease-in;  /* Saf3.2+, Chrome */
-moz-transition: all 0.2s ease-in;  /* FF4+ */
-ms-transition: all 0.2s ease-in;  /* IE10? */
-o-transition: all 0.2s ease-in;  /* Opera 10.5+ */
transition: all 0.2s ease-in;
}
	.btn:hover { background: #09c; color: #fff; border: 1px solid #09c; }


/* Header */
/* not used */


/* Main Nav */ 
nav {
font-family: 'Rockwell', Tahoma, Trebuchet, Verdana, Arial, sans-serif;
background: #82ceee !important;
color: #fff;
}
	nav a { color: #fff !important; text-decoration: none; padding: 5px 15px !important;  }
	nav a:hover { background: #283960 !important; color: #fff !important; }
	nav a.current { color: #fff !important; }
	nav a.navbar-brand { color: #fff !important; }
	nav a.navbar-brand:hover { background: none !important; }
	.navbar-default, .navbar-toggle { background-color: #82ceee !important; }
	.navbar { min-height: 1px !important; border-bottom: none; }
	.navbar-brand { height: auto !important; }
	a.nav_vvwe { color: #753169 !important; }
	a:hover.nav_vvwe { background: #753169 !important; color: #fff; }

/* main stylesheet - blue #09c; grey #3e3e3e */

.dropdown-menu {
	margin-top: 0;
	background-color: #283960;
	color: #fff;
	border: none;
	min-width: 154px !important;
}
.dropdown-menu li a {
	background-color: #283960;
	color: #fff !important;
	margin: 0; 
	padding: 5px !important;
	height: auto !important;
}
.dropdown-menu li a:hover {
	background-color: #82ceee !important;
	color: #fff !important;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
  color: #fff !important;
  background-color: #283960 !important;
}

/* Page Sections */
.section, .section-colored { padding: 30px 0; }
.section-colored { background-color: #09c; /* change this to change the background color of a colored section */ color: #fff; }
.section-colored h2 { color: #000; }
.sidebar ul {
  border-radius: 5px;
  padding: 5px;
  border: 1px solid #cccccc;
}

.logo { display: block; height: auto; margin-top: -20px; margin-left: -30px; padding: 5px 0; position: relative; z-index: 2; background: url(/assets/logo_bg_150.png) repeat-x; }
.logo2 { display: block; height: auto; margin-top: -20px; margin-left: -30px; padding: 5px 0; position: relative; z-index: 2; }
.logo img, .logo2 img { max-width: 33.3%; }

.container_white { 
	background: #fff; 
	-webkit-box-shadow: 0px 0px 25px rgba(0,0,0,.9);
	-moz-box-shadow: 0px 0px 25px rgba(0,0,0,.9);
	box-shadow: 0px 0px 25px rgba(0,0,0,.9);
	padding-bottom: 15px;
}

.img-home-portfolio,
.img-customer,
.portfolio-item {
  margin-bottom: 30px;
}

.tab-pane {
  margin-top: 15px;
}

/* Hovercaption styles */
.hovercaption { position: relative; } /* important (so we can absolutely position the description div) */  
.hovercaption .description {  
    position: absolute; /* absolute position (so we can position it where we want) */  
    bottom: 0px; /* position will be on bottom */  
    left: 0px;  
	margin: 0 15px 30px 15px;
    display: none; /* hide it */  
    /* styling below */  
    background-color: #09c;  
    color: #fff;  
	z-index: 999;
	text-align: left;
}  
	.hovercaption .description a, .hovercaption .description a:hover { text-decoration: none; }  
.hovercaption .description_content { padding: 10px 10px 0px 10px; }


/* Half Page Height Carousel Customization */
.carousel { height: 80%; margin-top: -142px; }
.item, .active, .carousel-inner { height: 100%; }
.fill {
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.carousel-strap {
background : #09c;
opacity: 0.8;
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 9;
}
.carousel-caption1 {
background : #fff;
opacity: 0.8;
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 10;
  padding: 0;
  color: #283960;
  text-align: left;
}
.carousel-indicators { display: none; }
.carousel h1 { color: #283960; margin: 10px 0; font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; font-size: 4em; opacity: 1.0; }
.carousel small { font-size: 0.5em; font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #82ceee; }

/* Home page styles */
h1.home { margin-top: 30px; }
.quote_panel2 { border-top: 2px dotted #283960; border-bottom: 2px dotted #283960; margin: 40px 0; padding: 20px 0 10px 0; }
.quote_panel { border-top: 2px dotted #283960; margin: 40px 0 0 0; padding: 20px 0 0 0; }
.quote { font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; font-size: 2.2em; color: #82ceee; padding-left: 5px; line-height: 1; }
.quotee { font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #283960; }

/* Standard page styles */
.cw_std { margin-bottom: 30px; }
.top-pic { margin-top: 15px; }
.top-pic-caption {
background : #fff;
opacity: 0.8;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 10;
  padding: 0;
  color: #283960;
  text-align: left;
}
.top-pic-caption h1 { color: #283960; margin: 10px 30px; font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; font-size: 4em; opacity: 1.0; }
.top-pic-caption small { font-size: 0.5em; font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #82ceee; }
.popup-gallery { margin-top: 70px; }
.sidebar-pic { margin-top: -40px; }
.popup-caption { font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif;  font-size: 1.5em; line-height: 1.5em; }

.address { display: inline-block; width: 100px; color: #283960; font-weight: bold; font-size: 1em; }
	
.map { 
display: block; 
width: 100%; 
height: 500px; 
}
.map img { border: none; } 

/* VVWE sidebar */
.vvwe { margin: 30px 0px; }
	.vvwe img { margin: 0; padding: 0; }
	.vvwe a { 
	background: #753169;
	color: #fff;
	display: block; 
	text-decoration: none; 
	padding: 0;
	}
		.vvwe a:hover { background: #753169; text-decoration: none; }
		.vvwe_header { 
		font-family: 'Signpainter', Georgia, Times New Roman, Times, serif; 
		font-size: 3em; 
		}
		.vvwe p { float: left; margin: 10px; }
		.vvwe ul { margin-bottom: 0; }
		.vvwe li { margin: 0 10px 5px 10px; }
		.vvwel { 
		color: #fff;
		font-weight: bold; 
		-webkit-transition: all 0.3s ease-in;  /* Saf3.2+, Chrome */
		-moz-transition: all 0.3s ease-in;  /* FF4+ */
		-ms-transition: all 0.3s ease-in;  /* IE10? */
		-o-transition: all 0.3s ease-in;  /* Opera 10.5+ */
		transition: all 0.3s ease-in; 
		}
			a:hover .vvwel { background: #46193e; }
		.vvwe3 .van { margin: 0; }
		.vvwe4 .van { position: relative; right: -15px; float: right; top: -10px; }

/* Social Icons Styles */
.list-social-icons { margin-top: 15px; margin-bottom: 45px; }
.tooltip-social { margin-right: -20px; }
.tooltip-social a { text-decoration: none; color: inherit; }
.tooltip-social a:hover { background: transparent !important; }
a:hover .nobg { background: transparent !important; }
.facebook-link a:hover { color: #3b5998; }
.linkedin-link a:hover { color: #007fb1; }
.twitter-link a:hover { color: #39a9e0; }
.google-plus-link a:hover { color: #d14836; }


/* Footer */
footer { 
clear: both; 
margin: 0 auto 15px auto;
padding: 0 0 30px 0;
text-align: left; 
font-family: 'Rockwell', Tahoma, Trebuchet, Verdana, Arial, sans-serif;
font-size: 0.95em;
color: #fff;
}
footer .row { margin: 0; }
footer a { color: #fff; text-decoration: none; }
footer-inner { margin: 0; padding: 0; }
footer ul { padding-left: 0 !important; padding-right: 30px !important; }
footer .lh { font-family: 'Rockwell_bold', Tahoma, Trebuchet, Verdana, Arial, sans-serif; color: #283960; }
footer .container { padding: 0; }
footer.rule { padding-top: 1px; }
footer .last { text-align: right; padding-right: 0 !important; }


/* Dropdown menu slide/fade */
.open > .dropdown-menu {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);  
  
}
.open > .dropdown-menu li a {
  color: #000;  
}
.dropdown-menu li a{
  color: #fff;
}
.dropdown-menu {
  -webkit-transform-origin: top;
  transform-origin: top;
  -webkit-animation-fill-mode: forwards;  
  animation-fill-mode: forwards; 
  -webkit-transform: scale(1, 0);
  transform: scale(1, 0);
  display: block;
  
  transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
}
.dropup .dropdown-menu {
  -webkit-transform-origin: bottom;
  transform-origin: bottom;  
}
 
.navbar .nav > li > .dropdown-menu:after { }
.dropup > .dropdown-menu:after {
  border-bottom: 0;
  border-top: 6px solid rgba(39, 45, 51, 0.9);
  top: auto;
  display: inline-block;
  bottom: -6px;
  content: '';
  position: absolute;
  left: 50%;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
}


/* Responsive Styles */
@media (max-width: 400px) {
}

@media (max-width: 767px) and (orientation:portrait) {
	.logo { display: block; height: auto; margin-top: 0px; margin-left: 0; z-index: 1; background: url(/assets/box_bg.gif) repeat-x; }
	.logo2 { display: block; height: auto; margin-top: 0px; margin-left: 0; z-index: 1; }
	.logo img, .logo2 img { max-width: 75%; padding: 5px 0; margin: 0 auto; }
	.carousel { height: 65%; /* shrink the carousel height so it looks good on phones */ margin-top: 0; }
	.carousel h1 { font-size: 2em; }
	.container_white { margin-top: -30px; }
	h1 { font-size: 2em; }
	h2 { font-size: 2em; }
	.cw_std { margin-top: 0px; margin-bottom: 30px; }
	.top-pic { margin-top: 15px; }
	.top-pic-caption h1 { font-size: 2.5em; opacity: 1.0; margin: 5px 30px; }
	footer ul { padding-left: 15px !important; padding-right: 15px !important; }
	footer .last { text-align: right; padding-right: 15px !important; }
/*
	header { display: block; position: fixed; width: 100%; height: 27px; z-index: 9999; border-bottom: 6px solid #09c !important; margin-bottom: 2000px; }
	.navbar-bottom { display: block; height: 95px; background: #fff; z-index: 99; top: 77px; }
	.navbar-collapse { background-color: #fff; margin-top: 77px; }
	.navbar-nav li a { margin: 0 !important; padding: 7px !important; height: auto !important; }
*/
}

@media (max-width: 767px) and (orientation:landscape) {
	.logo { margin-top: 0px; margin-left: 0; padding: 5px 0; position: relative; z-index: 9999; background: url(/assets/logo_bg_150.png) repeat-x; }
	.logo2 { margin-top: 0px; margin-left: 0; padding: 5px 0; position: relative; z-index: 9999; }
	.logo img, .logo2 img { max-width: 33.3%; padding: 5px 0; }
	.carousel { height: 65%; /* shrink the carousel height so it looks good on phones */ margin-top: -65px; }
	.carousel h1 { font-size: 2em; }
	.container_white { margin-top: 0px; }
	h1 { font-size: 2em; }
	h2 { font-size: 2em; }
	.cw_std { margin-bottom: 30px; }
	.top-pic { margin-top: 15px; }
	.top-pic-caption h1 { font-size: 2.5em; opacity: 1.0; margin: 5px 30px; }
	footer ul { padding-left: 15px !important; padding-right: 15px !important; }
	footer .last { text-align: right; padding-right: 15px !important; }
}

@media (max-width: 991px) {
	.no-mbl { display: none; /* remove spacer text above rh column pics and add space in below */ }
}