/*
BEIDEL PRINTING - STYLES
Author:	Jim Robinson
Modified:	7/26/2017
*/
header, footer {
	position: relative;
}

body {
	font-family: 'Open Sans', Arial, sans-serif;
	margin: 0;
	padding: 0;
	background: #073d14;
	background: -moz-linear-gradient(0deg, rgba(0,102,51,0.35) 0%, #073d14 100%), url('../images/bg_body.gif');
	background: -webkit-linear-gradient(0deg, rgba(0,102,51,0.35) 0%, #073d14 100%), url('../images/bg_body.gif');
	background: -o-linear-gradient(0deg, rgba(0,102,51,0.35) 0%, #073d14 100%), url('../images/bg_body.gif');
	background: linear-gradient(0deg, rgba(0,102,51,0.35) 0%, #073d14 100%), url('../images/bg_body.gif');
	background-attachment: fixed;
	background-repeat: repeat;
	-webkit-text-size-adjust: 100%;
}

a {
	color: #006633;
	text-decoration: none;
	-o-transition: color .5s ease;
	-ms-transition: color .5s ease;
	-moz-transition: color .5s ease;
	-webkit-transition: color .5s ease;
	transition: color .5s ease;
}

a:hover {
	color: #cc9933;
	text-decoration: none;
}

a:focus, a:hover {
	color: #006633;
}

p.extra-margin {
	margin-bottom: 20px;
}

:focus {
	outline: 2;
}

/*------------------------------------------------------------------------------
Header/Title styles
------------------------------------------------------------------------------*/
h1 {
	font-family: Oxygen, Arial, sans-serif;
	color: #006633;
}

h2 {
	font-family: Oxygen, Arial, sans-serif;
	color: #9c632b;
}

h3 {
	font-family: 'Open Sans', Arial, sans-serif;
	color: #6a4e1e;
}

h4 {
	font-family: 'Open Sans', Arial, sans-serif;
	color: #006633;
}

@media (min-width:768px) {
	.container {
		width: auto;
	}
}
@media (min-width:992px) {
	.container {
		width: 970px;
	}
}

@media (min-width:1200px) {
	.container {
		width: 1170px;
	}
}

@media (max-width: 767px) {
	.container {
		padding: 0;
	}
}

.header-printing {
	background-image: url("../images/printing.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 500px;
}

.header-graphic {
	background-image: url("../images/graphic-design.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 300px;
}

.header-logistics {
	background-image: url("../images/logistics.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 300px;
}

.header-commercial {
	background-image: url("../images/commercial.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 300px;
}

.header-location {
	background-image: url("../images/location.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 300px;
}

.header .header-bg {
	background-color: rgba(7,61,20,1);
	background: -webkit-linear-gradient(left, rgba(7,61,20,0.9) 30%, rgba(0,102,51,0) 100%);
	background: -moz-linear-gradient(left, rgba(7,61,20,0.9) 30%, rgba(0,102,51,0) 100%);
	background: -o-linear-gradient(left, rgba(7,61,20,0.9) 30%, rgba(0,102,51,0) 100%);
	background: linear-gradient(left, rgba(7,61,20,0.9) 30%, rgba(0,102,51,0) 100%);
	padding: 1em;
}

.header .header-bg-solid {
	background-color: rgba(7,61,20,1);
	padding: 1em;
}

.header .header-bg h1,
.header .header-bg-solid h1 {
	color: #fff;
	text-shadow: 3px 3px 3px #073d14;
	margin: 0;
}

header h1,
header h2,
header h3 {
	margin-top: 0;
}

/*------------------------------------------------------------------------------
Layout containers
------------------------------------------------------------------------------*/
.bg-white {
	background-color: #ffffff;
	padding: 1em;
}

.bg-cardboard {
	background-color: #efe4d2;
	padding: 1em;
	color: #073d14;
}

.bg-tan {
	background-color: #f7f3eb;
	padding: 1em;
}

.border-accent {
	border-left: 10px solid #cc9933;
}

#header {
	position: relative;
	background-color: #D2BB94;
	text-align: left;
}

#footer {
	text-align: left;
	background-color: #D2BB94;
	color: #006633;
	padding: 3em 1em;
}

#footer-boxes .fa {
	margin: 10px auto;
	text-align: center;
	font-size: 40pt;
}

#beidel-logo {
	display: block;
	vertical-align: middle;
	width: 175px;
	height: 75px;
}

#address-contact {
	text-align: center;
	padding: 1em;
	display: none;
}

#header-message {
	position: relative;
	display: block;
	background-color: #9c632b;
	color: #ffffff;
	padding: 0.25em 1em;
	z-index: 100;
	text-align: center;
}

#header-message * {
	display: inline-block;
	line-height: 1.5;
}

#header-message a {
	margin: 0 10px;
	color: #ffffff;
}

#header-message a:hover {
	color: #cc9933;
}

#header-message .fa {
	margin-right: 3px;
	color: #cc9933;
}

#header-moved {
	position: relative;
	display: block;
	background-color: #e4d656;
	padding: 0.25em 1em;
	z-index: 100;
	text-align: center;
	font-size: 150%;
}

/*------------------------------------------------------------------------------
Top Menu
------------------------------------------------------------------------------*/
#phone-menu,
#mobile-menu {
	display: block;
	height: 75px;
	font-size: 36px;
	line-height: 36px;
	vertical-align: middle;
	position: absolute;
	top: 18px;
	right: 18px;
	color: #006633;
	cursor: pointer;
}

#phone-menu {
	right: 75px;
}

#menu {
	max-width: 1170px;
	position: relative;
	margin: 0;
	text-align: left;
	display: none;
	vertical-align: middle;
	padding: 0;
	z-index: 1000;
}

#menu > ul {
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: left;
}

#menu > ul > li {
	display: block;
	margin: 0;
	position: relative;
}

#menu > ul > li > a {
	display: block;
	font: 12pt 'Open Sans', Arial, sans-serif;
	padding: 0.5em;
	text-decoration: none;
}

#menu a .fa {
	margin: 5px;
	color: #9c632b;
	font-size: 16pt;
}

#menu li:hover .fa,
#menu a:hover .fa {
	color: #cc9933;
}

#menu > ul > li:hover {
	background-color: #073d14;
}

#menu > ul > li:hover a {
	color: #ffffff;
}

#menu > ul li > ul {
	list-style: none;
	margin: 0;
	display: none;
	min-width: 230px;
	width: auto;
	background-color: #073d14;
	padding: 0 1em 1em 1em;
}

#menu > ul > li:hover > ul,
#menu > ul > li > ul.toggled {
	display: block;
}

#menu > ul > li:hover > ul li,
#menu > ul > li > ul.toggled li {
	margin: 0;
}

#menu > ul > li > ul a {
	display: block;
	color: #ffffff;
	padding: 0.5em;
	text-align: left;
}

#menu > ul > li > ul a:hover {
	background-color: #006633;
	color: #ffffff;
}

#menu > ul > li > ul a .subtext {
	display: block;
	font-size: 0.8em;
	color: #cc9933;
}

.thumbnail {
	border-color: #D2BB94;
}

.list-group-item {
	border-color: #D2BB94;
}

.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
	color: #073d14;
	background-color: #efe4d2;
	border-color: #D2BB94;
}

.btn.btn-primary {
	background: -webkit-linear-gradient(top, #00a33d 0%, #006633 100%);
	background: -moz-linear-gradient(top, #00a33d 0%, #006633 100%);
	background: -o-linear-gradient(top, #00a33d 0%, #006633 100%);
	background: linear-gradient(to bottom, #00a33d 0%, #006633 100%);
	border: 1px solid #006633;
}

.btn.btn-default {
	border: 1px solid #D2BB94;
	background-color: #f7f3eb;
	color: #006633;
}

.btn.btn-default:hover {
	background-color: #efe4d2;
}

.form-control,
.input-group-addon {
	border-color: #D2BB94;
}

.form-control:focus {
	border-color: #006633;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1),0 0 8px rgba(0,102,51,0.6);
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.1),0 0 8px rgba(0,102,51,0.6);
}

.help-block > ul {
	list-style: none;
	padding-left: 0px;
	font-size: 12px;
}

.help-block > ul li:before {
	content: '\f071';
	font-family: FontAwesome;
	margin-right: 7px;
}

.input-group-addon {
	color: #006633;
	background-color: #f7f3eb;
}

.input-group-btn img {
	border-radius: 4px 0 0 4px;
}

.table > thead > tr > th {
	border-bottom: 2px solid #6a4e1e;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
	border-top: 1px solid #D2BB94;
	vertical-align: middle;
}

.table-striped > tbody > tr:nth-of-type(2n+1) {
	background-color: #f7f3eb;
}

.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:nth-of-type(2n+1):hover {
	background-color: #efe4d2;
}

/* Row Buffer */
.row-buffer {
	display: block;
	border-top: 1px solid #D2BB94;
	padding-top: 20px;
	padding-bottom: 20px;
}
.row-buffer:first-child {
	border-top: 0;
}
.row-buffer:hover {
	background-color: #efe4d2;
}
.row-selected {
	background-color: #ffffc6 !important;
}

/*------------------------------------------------------------------------------
Image thumbnails
------------------------------------------------------------------------------*/
.fancybox,
.fancybox_video {
	position: relative;
	overflow: hidden;
	display: inline-block;
	border: 1px solid transparent;
	max-height: 300px;
	text-align: center;
	line-height: 0;
	-o-transition: border-color .5s ease;
	-ms-transition: border-color .5s ease;
	-moz-transition: border-color .5s ease;
	-webkit-transition: border-color .5s ease;
	transition: border-color .5s ease;
}

.fancybox_video {
	max-width: 534px;
	max-height: 300px;
}

.fancybox:hover,
.fancybox_video:hover {
	border: 1px solid #D2BB94;
	box-shadow: 0 0 5px #D2BB94;
}

.fancybox .zoom {
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	line-height: 50px;
	top: 0;
	right: 0;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	font-size: 25px;
	color: #cc9933;
}

.fancybox:hover .zoom {
	top: 50%;
	right: 50%;
	width: 100px;
	height: 100px;
	line-height: 100px;
	margin-right: -50px;
	margin-top: -50px;
	-webkit-transform: translate(0,0);
	-moz-transform: translate(0,0);
	-o-transform: translate(0,0);
	-ms-transform: translate(0,0);
	transform: translate(0,0);
	font-size: 50px;
	color: #cc9933;
	text-shadow: 2px 2px 5px #222;
}

.fancybox_video .play {
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	line-height: 100px;
	top: 50%;
	left: 50%;
	margin-left: -50px;
	margin-top: -50px;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	font-size: 100px;
	color: #444444;
	text-shadow: 2px 2px 5px #000000;
}

.fancybox_video:hover .play {
	color: #663300;
}

.n, .d {
	font-size: 75%;
}

.n {
	vertical-align: 0.8ex;
	margin-left: 2px;
}

.d {
	vertical-align: -0.3ex;
}


#back-to-top {
	position: fixed;
	bottom: 1em;
	right: 1em;
	text-decoration: none;
	color: #073d14;
	font-size: 22px;
	margin: 0;
	display: none;
	width: 40px;
	height: 40px;
	text-align: center;
	border-radius: 100%;
	border: 3px solid #073d14;
	background-color: #ffffff;
	transition: transform 0.3s;
}

@media (min-width:768px) {
	#back-to-top {
		bottom: 2em;
		right: 2em;
	}

	#back-to-top:hover {
		transform: scale(1.2);
	}
}

.captcha-image,
.captcha-input {
	vertical-align: middle;
}

.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; background-color: #f7f3eb; border: 1px solid #9c632b; border-radius: 4px; z-index: 10000 !important; }
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; background-color: #006633; color: #ffffff; }
.ui-datepicker .ui-datepicker-header a { color: #ffffff; }
.ui-datepicker .ui-datepicker-header a.ui-state-disabled { color: #00a33d; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 3px; width: auto; height: 1.8em; cursor: pointer; }
.ui-datepicker .ui-datepicker-prev { left: 10px; }
.ui-datepicker .ui-datepicker-next { right: 10px; }
.ui-datepicker .ui-datepicker-prev:before { font-family:'FontAwesome'; font-size:16pt; content:"\f0a8"; }
.ui-datepicker .ui-datepicker-next:before { font-family:'FontAwesome'; font-size:16pt; content:"\f0a9"; }
.ui-datepicker .ui-datepicker-prev-hover { left: 10px; color: #cc9933; }
.ui-datepicker .ui-datepicker-next-hover { right: 10px; color: #cc9933; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: none; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px;  }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 2.2; text-align: center; }
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%; }
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 49%;}
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: initial; border-spacing: 1px; margin:0 0 .4em; }
.ui-datepicker table thead tr { border-bottom: 0; }
.ui-datepicker th { padding: .3em; text-align: center; font-weight: bold; border: 0;  }
.ui-datepicker td { border: 0; padding: 0; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .3em; text-align: right; text-decoration: none; }
.ui-datepicker td a.ui-state-hover { background-color: #D2BB94; color: #663300; outline: 1px solid #D2BB94; }
.ui-datepicker-current-day { background-color: #006633; outline: 1px solid #006633; }
.ui-datepicker-current-day a { color: #ffffff; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
.ui-datepicker .ui-datepicker-unselectable, .ui-datepicker .ui-state-disabled { color: #bbb; }
.ui-datepicker .ui-datepicker-today { outline: 1px solid #D2BB94; }

.subsection {
	color: #663300;
	padding: 1em;
	margin-bottom: 20px;
	border-radius: 8px;
	display: block;
}

.subsection .fa {
	color: #073d14;
}

.subsection.alternate .fa {
	float: none;
	display: block;
	text-align: center;
}

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

	.border-body {
		border-left: 5px solid #073d14;
		border-right: 5px solid #073d14;
	}

	.border-accent {
		border-left-width: 30px;
	}

	#beidel-logo {
		display: inline-block;
		width: 263px;
		height: 113px;
	}
	
	#phone-menu,
	#mobile-menu {
		display: none;
	}

	#menu {
		display: inline-block;
		vertical-align: middle;
	}

	#menu > ul {
		text-align: center;
	}

	#menu > ul > li {
		display: inline-block;
	}

	#menu > ul > li > a {
		font-size: 12pt;
	}

	#menu a .fa {
		display: block;
		font-size: 22pt;
	}

	#menu > ul li > ul {
		position: absolute;
		left: 0;
		z-index: 1;
		width: 200px;
		padding: 1em;
	}

	#header-message:after {
		position: absolute;
		content: '';
		top: -24px;
		border-top: 24px solid transparent;
		border-left: 24px solid #9c632b;
		left: 150px;
	}

	#footer-message {
		margin: 0 auto;
		text-align: center;
		width: 80%;
	}

	#footer-boxes {
		display: inline-block;
		vertical-align: middle;
		width: 20%;
	}

	#footer-copyright {
		display: inline-block;
		vertical-align: middle;
		width: 70%;
	}

	.subsection {
		vertical-align: top;
		cursor: pointer;
		border: 2px solid transparent;
		-webkit-transition: border-color 1s;
		-moz-transition: border-color 1s;
		-o-transition: border-color 1s;
		transition: border-color 1s;
	}

	.subsection:hover {
		border-color: #006633;
	}

	.subsection p.slide {
		position: relative;
		overflow-y: hidden;
		max-height: 150px;
		-webkit-transition: max-height 1s;
		-moz-transition: max-height 1s;
		-o-transition: max-height 1s;
		transition: max-height 1s;
	}

	.subsection p.slide:before {
		content: '';
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 70px;
		background-image: -webkit-linear-gradient(top, rgba(239, 228, 210, 0), rgba(239, 228, 210, 100));
		background-image: -moz-linear-gradient(top, rgba(239, 228, 210, 0), rgba(239, 228, 210, 100));
		background-image: -o-linear-gradient(top, rgba(239, 228, 210, 0), rgba(239, 228, 210, 100));
		background-image: linear-gradient(top, rgba(239, 228, 210, 0), rgba(239, 228, 210, 100));
		z-index: 1;
	}

	.subsection p.slide:after {
		content: '';
		position: absolute;
		left: 50%;
		bottom: 0px;
		border-right: 10px solid transparent;
		border-left: 10px solid transparent;
		border-top: 10px solid #9c632b;
		margin-left: -10px;
		z-index: 2;
	}

	.subsection:hover p.slide {
		position: relative;
		max-height: 525px;
		overflow-y: hidden;
		padding-bottom: 25px;
	}

	.subsection:hover p.slide:before {
		background-image: none;
	}

	.subsection:hover p.slide:after {
		border-top: 0;
		border-bottom: 10px solid #006633;
	}

}

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

	#address-contact {
		display: block;
		position: absolute;
		right: 2em;
		top: 50%;
		text-align: right;
		margin-top: -36px;
		padding: 0;
		color: #006633;
	}

	#phone-social {
		font-size: 22px;
	}

}

@media screen and (min-width: 1200px) {

	#beidel-logo {
		display: inline-block;
		width: 350px;
		height: 150px;
	}

	#menu > ul > li > a {
		font-size: 16pt;
	}

	#menu a .fa {
		font-size: 30pt;
	}

	#header-message:after {
		top: -30px;
		border-top: 30px solid transparent;
		border-left: 30px solid #9c632b;
		left: 200px;
	}

}

/*@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
	#beidel-logo {
		background-image: url("../images/beidel_logo@2x.png");
	}
}*/