html, body {height: 100%; overflow-x: hidden; }
body { margin: 0px; padding: 0px; background-color: white;font-family: 'Segoe UI', SegoeUI, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size: 15px;}
h1, h2, h3, h4, h5 {font-family:  'Segoe UI',SegoeUI,'Helvetica Neue',Helvetica,Arial,sans-serif;}
h4.padded-top {padding-top:1.5%;}

.justified {text-align: justify; text-justify: inter-word;}
.calculated-height { min-height: -moz-calc(100% - 472px); min-height: -webkit-calc(100% - 472px); min-height: calc(100% - 472px); }
@media only screen and (max-width: 992px) {
.calculated-height { min-height: -moz-calc(100% - 400px); min-height: -webkit-calc(100% - 400px); min-height: calc(100% - 400px); }
}
h2.main-category {text-align: center; font-weight: normal; color: #666}
/* Link behavior */
a {color: #9E5900;}
a:hover, a:focus, a:active {color: #683b01; text-decoration: none;} /*color: #F28900;*/
a#highlight {color: #DDD;}
.blue, .blue a {color: #064776;}

/* contact form styling */
input#contact_name, input#contact_phone, input#contact_email {width: 100%; margin-bottom: 15px;}
textarea#message {height:184px; width: 100%;}
.btn-send-message {width: 100%;}

/* Make the background image cover the area of the <div>, and clip the excess */
.resize-less {background-image: url('media/images/saver.png'); background-position: center; background-size: cover; height: 220px;}
.crop-and-resize {background-image: url('media/images/saver.png'); background-position: center; background-size: cover; height: 200px;}
.crop-and-resize#group-img {height: 270px;}
.crop-and-resize#subgroup-img {max-height: 150px; max-width: 150px; }
.practice-img { position: relative; width: 100%;margin-bottom: 20px;margin-top: 0px;}
.practice-img span {color: white; letter-spacing: -1px; background: rgb(7, 82, 135); background: rgba(7, 82, 135, 0.7); padding: 10px; z-index: 99;}
.practice-img span.spacer {padding:0 5px;}
.practice-img h4 { position: absolute;bottom: 4px; left: 0; line-height: 2px;}
.lowlight .crop-and-resize{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;}
.lowlight:hover .crop-and-resize{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;}
.black {background-color: black;}

.unbulleted {list-style: none; padding-left: 0px;}
.skill-icon ul > li {padding-bottom:5px;}
.boxed, .boxed-nc {background-color: #dfdfdf; border: 1px solid #dfdfdf; padding: 3px;}
.boxed {color: white; background-color: #075E9B; border-color: #075E9B;}
.mid-buffer {padding: 5px 0;}
.notop {padding-top:0; margin-top:0;}

/* EL-Pagination */
ul.pagination {margin-right: 20px;}
ul.pagination .paginate-prev {border-left: none;}
ul.pagination li.paginate_button.previous a {border-right: 1px solid rgb(170,170,170); border-left: 1px solid white;}

a.endless_page_link {color: rgba(70,70,70,0.6);}

.card-header {background-color: #075E9B; color: #FFF; padding: 5px; text-shadow: 4px 4px 3px rgba(0,0,0,0.1); margin: 0;}
.card-outline {border: 1px solid #075E9B; padding: 0; margin: 20px 0 0 0; text-align: center;}
.card-body {padding: 5px; }
.card-body.limit {height: 55px;}
.card-body.limit2 {height: 180px;}
a.card-full-link {color:#333;}
a.card-full-link:hover {color:#683b01;}
a.card-full-link img:hover {filter: brightness(115%);}
.box-shadow-hover:hover {
  box-shadow: 0 4px 8px 0 rgba(6,71,118,0.32), 0 2px 10px 0 rgba(6,71,118,0.24);
}
.pointer {
  cursor: pointer;
}

.card-border{border: 1px solid #075E9B;}

/* Breadcrumbs */
ol.breadcrumb {margin-bottom: 10px; background: none; padding-left: 0px;}
ol.breadcrumb a {color: #CCC;}
ol.breadcrumb a:hover {color: rgb(122,122,122);}

.btn-primary {background-color: #075E9B; border: none; height: 35px;} /*background: rgb(70,70,70);*/
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {background: #1e7abb; border: #075E9B; height: 35px; color: white;}

ul.list-resume {margin-left: 1.5em; padding-left: 1em;}
ul.list-resume li {padding-bottom:10px;}

/* make images square */
.image{
  position:relative;
  overflow:hidden;
  padding-bottom:100%;
}
.image img{
  position:absolute;
}

/* more images */
.holiday-img img {border-radius: 6px;}
.logo {max-width: 100%; padding-bottom: 6px;}
.blog-photo {float:right;margin-left: 3%;max-width:35%;min-width:150px;}
.tagged {color: rgb(122,122,122);}
.below-side {padding: 12px 0 0 12px;}
.img-circle {border: 1px solid #999;}
.worker {border: 1px solid #000; margin: 12px;}
.thumbnail img.worker {max-width: 90%;max-height: auto;border: none;}
.thumbnail { margin: 15px; background-color:#f8f8f9;}
.thumbnail .caption { padding-left: 17px;}
.thumbnail h4 {padding: 15px 0 5px 0;margin: 0;}
.thumbnail ul {list-style-type: none;padding: 0;margin: 0;}
.thumbnail {position:relative;margin:0;padding:0;}
.crop-and-resize.worker {background-image:  url('https://s3-us-west-1.amazonaws.com/mbk-online/static/images/workerpic.jpg');background-position: 15% 10%;height: 200px;border: none;min-width: 200px;min-height: 200px;}

.lg-icon {font-size: 84px;}

.column-wide {width: 100%;}
.row.display-flex {display: flex; flex-wrap: wrap;}
.iconic {color: #075E9B;}
.box {text-align: center;}
.box:hover {color: #0775C2;}

/* pagination button format */
.dataTables_wrapper .floatleft, .dataTables_wrapper .floatright {float: left;white-space: nowrap;padding-left: 0px;padding-bottom: 10px;}
.dataTables_wrapper .floatright {float: right;}
.dataTables_wrapper ul.pagination {padding: 0;margin: 0;}
.dataTables_paginate ul.pagination li.paginate_button a {color: rgb(70,70,70); border: 1px solid white; border-left: 1px solid rgb(170,170,170);}
.dataTables_paginate ul.pagination li.paginate_button.previous a {border-right: 1px solid rgb(170,170,170); border-left: 1px solid white;}
.dataTables_paginate ul.pagination li.paginate_button.previous a:before {font-family: FontAwesome; content: "\f060";}
.dataTables_paginate ul.pagination li.paginate_button.next a:after {font-family: FontAwesome; content: " \f061";}
.dataTables_paginate ul.pagination li.paginate_button.active a {background: rgb(70,70,70);border: 1px solid rgb(70,70,70);color: #f9f9f9;}

/* search and length menu formatting */
.dataTables_wrapper .col-xs-6 label, .dataTables_wrapper input.form-control.input-sm {width: 100%;}
.dataTables_wrapper div .col-xs-6 {padding: 0px;}
.dataTables_wrapper .dataTables_length select.form-control {width: 25%;min-width: 60px;display: inline-table;}
.dataTables_length label select, .dataTables_filter label input {border-radius: 5px;height: 35px;margin-bottom: 0px;font-weight: normal;}

/* hover/active/focus color for pagination buttons */
.dataTables_paginate ul.pagination li.paginate_button a:active,
.dataTables_paginate ul.pagination li.paginate_button a:hover,
.dataTables_paginate ul.pagination li.paginate_button a:focus,
.dataTables_paginate ul.pagination li.paginate_button.active a:active,
.dataTables_paginate ul.pagination li.paginate_button.active a:hover,
.dataTables_paginate ul.pagination li.paginate_button.active a:focus {background: #075E9B; border: 1px solid #075E9B; color: #f9f9f9;}

/* basic table formatting */
#careers-table {margin-bottom:10px; padding: 5px; border-radius: 6px; background: #f0f0f0;}
#careers-table th {background: #075E9B; color: #f9f9f9; border-bottom: none;}
#careers-table th:first-child {border-radius: 6px 0px 0px 0px;}
#careers-table th:last-child {border-radius: 0px 6px 0px 0px;}

/* lowlighting for hover/active/focus on table rows */
#careers-table tr:active, #careers-table tr:focus, #careers-table tr:hover {background-color: #a9c2e2;}
#careers-table tr:last-child:active td:first-child,
#careers-table tr:last-child:focus td:first-child,
#careers-table tr:last-child:hover td:first-child {border-radius: 0px 0px 0px 6px;}
#careers-table tr:last-child:active td:last-child,
#careers-table tr:last-child:focus td:last-child,
#careers-table tr:last-child:hover td:last-child {border-radius: 0px 0px 6px 0px;}

/* Center pagination below careers table for tiny screens */
@media only screen and (max-width: 768px) {
  #careers-table {font-size: 14px;}
  .dataTables_length label {font-size: 12px;}
  .floatleft, .floatright {width: 100%;float: auto;text-align: center;}
}

#fade-container {
  position:relative;
  padding:0px;
  margin:0px;
  /*background: blue;*/
  border-radius: 6px;
  /*height: 320px;*/
  /*height:400px;*/
}
#fade-contents {
  background:rgba(121,121,121,1);
  width: 100%;
  margin:0;
  padding: 0;
  border-radius: 6px;
  /*height: 100%;*/
}
#fade-gradient {
  margin:0;
  padding:0;
  position:absolute;
  border-radius: 6px;
  width: 100%;
  z-index:2;
  right:0px; bottom:0px; left:0px;
  height: 150px;
  background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 70%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(70%,rgba(255,255,255,1)));
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
  background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
  background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 70%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
}
.grayscale {-webkit-filter: grayscale(100%); filter: grayscale(100%);}
.blur {-webkit-filter: blur(3px); filter: blur(3px);}
.invert {-webkit-filter: invert(100%); filter: invert(100%);}
.sepia {-webkit-filter: sepia(100%); filter: sepia(100%);}