@import "/lib/bootstrap/dist/css/bootstrap.min.css";
@import "/lib/checkbox/awesome-bootstrap-checkbox.min.css";
@import "/lib/animate/animate.min.css";
@import "/lib/lightgallery/css/lightgallery.min.css";
@import "/lib/fontawesome-pro-6.7.2/css/all.css";
@import "/lib/daterangepicker/daterangepicker.min.css";
@import "/lib/cookiebar/jquery.cookiebar.min.css";

/* =============================================================================
   HTML Elements
   ========================================================================== */
#content-page {line-height:1.6rem;}
#content-page h1 {font-size:2.2rem;}
#content-page h2 {font-size:1.8rem;}
strong {font-weight: bold}

#content-page h1,#content-page h2,#content-page h3,#content-page h4,#content-page h5,#content-page h6 {margin-bottom:0.5rem;}
#content-page p {margin-bottom:1rem;}

/* =============================================================================
   Parsley validation plugin custom
   ========================================================================== */
#content-page .parsley-error {border:2px solid #ff0000;}
#content-page .form-check.parsley-error {border:2px solid transparent;}
#content-page .parsley-errors-list {list-style: none;padding: 0;margin: 0}
#content-page .parsley-required, #content-page .parsley-type {font-size: 0.75rem;color: #ff0000;line-height: 0.75rem;padding: 0.25rem 0 0 0 }
#content-page .form-check {border:2px solid transparent;}

/* =============================================================================
   Custom classes for page elements
   ========================================================================== */
#content-page .divider {height:1px;margin:0;border-top:solid 2px #eee;}

#content-page>section {overflow:hidden;}
#content-page section.sc-pd-none {padding:0;}
#content-page section.sc-pd-narrow {padding:24px 0;}
#content-page section.sc-pd-normal {padding:48px 0;}
#content-page section.sc-pd-wide {padding:64px 0;}
#content-page section.sc-pd-xl {padding:96px 0;}
#content-page section.sc-pd-narrow-start {padding:48px 0 12px 0;}

#content-page section.sc-pd-none-top {padding-top:0;}
#content-page section.sc-pd-narrow-top {padding-top:24px;}
#content-page section.sc-pd-normal-top {padding-top:48px;}
#content-page section.sc-pd-wide-top {padding-top:64px;}
#content-page section.sc-pd-xl-top {padding-top:96px;}

#content-page section.sc-pd-none-bottom {padding-bottom:0;}
#content-page section.sc-pd-narrow-bottom {padding-bottom:24px;}
#content-page section.sc-pd-normal-bottom {padding-bottom:48px;}
#content-page section.sc-pd-wide-bottom {padding-bottom:64px;}
#content-page section.sc-pd-xl-bottom {padding-bottom:96px;}

#content-page section.sc-mg-none {margin:0;}
#content-page section.sc-mg-narrow {margin:24px 0;}
#content-page section.sc-mg-normal {margin:32px 0;}
#content-page section.sc-mg-wide {margin:48px 0;}
#content-page section.sc-mg-xl {margin:64px 0;}

#content-page section.sc-bd-bottom {border-bottom:2px solid #eee;}
#content-page section.sc-bd-top {border-top:2px solid #eee;}
#content-page section.sc-bd-all {border:1px solid #eee;}

#content-page section .mx-1 {padding-left:1rem !important;padding-right:1rem !important;margin:0 !important;}
#content-page section .mx-2 {padding-left:2rem !important;padding-right:2rem !important;margin:0 !important;}
#content-page section .mx-3 {padding-left:3rem !important;padding-right:3rem !important;margin:0 !important;}
#content-page section .mx-4 {padding-left:4rem !important;padding-right:4rem !important;margin:0 !important;}
#content-page section .mx-5 {padding-left:5rem !important;padding-right:5rem !important;margin:0 !important;}

#content-page section .my-1 {padding-top:1rem !important;padding-bottom:1rem !important;margin:0 !important;}
#content-page section .my-2 {padding-top:2rem !important;padding-bottom:2rem !important;margin:0 !important;}
#content-page section .my-3 {padding-top:3rem !important;padding-bottom:3rem !important;margin:0 !important;}
#content-page section .my-4 {padding-top:4rem !important;padding-bottom:4rem !important;margin:0 !important;}
#content-page section .my-5 {padding-top:5rem !important;padding-bottom:5rem !important;margin:0 !important;}

#content-page section.parallax {transition: background-position ease 0.1s;background-repeat:no-repeat;padding:3rem !important;}

#content-page .side-padding {padding-left:12px;padding-right:12px}

#content-page .dynamic-inner-panel {height:100%;}
#content-page .d-flex {height:100%;}

#content-page .fam {vertical-align: middle;font-size:1.5rem;font-weight:400;}
#content-page #blog-tag-list {font-size: 0.8rem}
#content-page #blog-tag-list li {padding: 0.25rem 0 0.25rem 0.25rem}

#content-page .panel-background {background-repeat: no-repeat;background-size: cover !important;background-position: top center;}

#content-page .client-wrap {
  border-top: 1px solid #eeeeee;
  border-left: 1px solid #eeeeee;
  margin-bottom: 30px;
}

#content-page .client-logo {
  padding: 64px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-right: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;
  overflow: hidden;
  background: #fff;
  height: 160px;
}

#content-page .client-logo:hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}

#content-page img {
  transition: all 0.4s ease-in-out;
}

#content-page .h100 {height:100%;}
#content-page .ft14 {font-size:0.9rem;}

#content-page ul,#content-page ol  {margin-left:2.5rem;padding:1rem 0;}
#content-page li  {padding-left:0.5rem;}

.modal-xl {max-width: 1140px}

#content-page b {font-weight:700;}

.text-faded {color: #e5e5e5}

#gallery-carousel {margin:16px 0 24px 0;}
#gallery-carousel .carousel-inner {margin:0 15px}
#gallery-carousel .carousel-control {width:10%;opacity:0.2;}
#gallery-carousel .carousel-control:hover {opacity:0.5;}
#gallery-carousel .carousel-control-next, #gallery-carousel .carousel-control-prev {
    opacity:1 !important;
    visibility:visible !important;
    width:36px;
    height:36px;
    top:50%;
    position: absolute;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);    
}

#gallery-carousel .carousel-control-next i, #gallery-carousel .carousel-control-prev i {}


/* =============================================================================
   Custom classes for breadcrumbs
   ========================================================================== */
div.crumbs {min-height:32px;}

/* =============================================================================
   Search relevance bar
   ========================================================================== */
#content-page .search-score {float:right;text-align:right;width:102px;font-size: 0.65rem}
#content-page .search-relevance {border:solid 1px #ccc;height:16px}
#content-page .search-gauge {height:14px;background-color:#e5e5e5}
#content-page .search-image {max-width: 102px;float: right}

/* =============================================================================
   Custom classes for file / document element
   ========================================================================== */

#content-page .file-icon-pdf::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f1c1";
  margin-right:8px;
}
#content-page .file-icon-doc::before, #content-page .file-icon-docx::before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f1c2";  
  margin-right:8px;
}

/* =============================================================================
   Client bespoke / bullshit elements
   ========================================================================== */

#content-page .stone { position: relative; text-align: center;}
#content-page .stone a, #content-page .stone span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color:#fff;
  display:block;
  font-size:1.5rem;
}
#content-page .stone a i, #content-page .stone a:hover {color:#f7a604}

/* =============================================================================
   Custom classes for gallery element
   ========================================================================== */
.gallery-container .flex-column {flex: 25%;max-width: 25%;}
.gallery-container .flex-column {padding:0.5px;}
.gallery-container .flex-column img.landscape {height:100%;}
.gallery-container .flex-column img.portrait {width:100%;}
.gallery-container .flex-column .delete-image {top:5px;left:5px;}

.gallery-container .zoom-effect-container {
    position: relative;
    width:100%;
    height:100%;
    display: flex;
    align-items: center; /* vertical */
    justify-content: center; /* horizontal */    
    overflow:hidden;
}

.gallery-container .zoom-effect-container:hover img {
  -webkit-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
  -webkit-transform: scale(1.07);
  transform: scale(1.07);
}

.gallery-container .zoom-effect-container img.landscape {
    min-height:100%;
}

.gallery-container .zoom-effect-container img.portrait {
    min-width:100%;
}


/* =============================================================================
   Custom classes for slide element
   ========================================================================== */
#content-page .html-container {background-size: cover;background-position: center;text-align: center}
#content-page .html-overlay {padding:96px 32px;width:100%;height:100%;}
#content-page .html-overlay .container {max-width:960px;}
#content-page .html-overlay h1 {font-weight:700;font-size:3rem !important;text-shadow:0 1px 10px rgba(29, 29, 29, 0.8);line-height:3.5rem;}
#content-page .html-overlay .slide-heading {font-weight:700;font-size:3rem;text-shadow:0 1px 10px rgba(29, 29, 29, 0.8);line-height:3.5rem;color:#fff;}
#content-page .html-overlay .slide-heading h1 {color: #fff !important}
#content-page .html-overlay .slide-sub-heading {font-weight:700;font-size:1.5rem;text-shadow:0 1px 10px rgba(29, 29, 29, 0.8);line-height:3.5rem;color:#fff;}
#content-page .html-overlay span {display:block;}

#content-page .column-container {background-size: cover;background-position: center;text-align: center;height:240px;margin-bottom:24px;border-radius:6px;overflow:hidden;}
#content-page .column-container .slide-small-heading {font-weight:700;font-size:1.4rem !important;line-height:1.4rem;color:#fff;text-shadow:0 1px 10px rgba(29, 29, 29, 0.8);color:#fff;}
#content-page .column-container p {text-shadow:0 1px 10px rgba(29, 29, 29, 0.8);color:#fff;}

/* =============================================================================
   Custom classes for slideshow
   ========================================================================== */
/* #content-page .carousel .carousel-control-prev, #content-page .carousel .carousel-control-next { visibility: hidden;}
#content-page .carousel:hover .carousel-control-prev, #content-page .carousel:hover .carousel-control-next { visibility: visible; } */
.carousel-control-prev, .carousel-control-prev:focus {
  visibility:hidden;
}

.carousel-control-next, .carousel-control-next focus {
  visibility:hidden;
}



.image-card, .image-card-large, .image-card-larger {
  top: 0;
  left: 0;
  overflow:hidden;
  display:block;  
}

.image-card img, .image-card-large img, .image-card-larger img {
  /* margin-top: 50%;transform: translateY(-50%); */
}

/* =============================================================================
   Custom classes for new blog layout
   ========================================================================== */
#blog-layout {}

#blog-layout .blog-image-card {
  height:200px;
  background-size:cover;
  background-repeat: no-repeat;
  background-position: center center; 
  display:block; 
}

#blog-layout .blog-heading-card {
  padding:1rem;
}

#blog-layout .blog-image-card i {font-size: 8rem;color: #e5e5e5}

#content-page .smaller {font-size:0.8rem;margin-bottom:0.5rem;text-transform: uppercase;}
#blog-layout h2 {font-size:1.4rem !important;}
#blog-layout h3 {font-size:1.4rem !important;margin-top:0.5rem}

#blog-layout article {
  border:1px solid #eee;
  background: rgb(255,255,255);
  background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(244,244,244,1) 100%);
  box-shadow: 0 8px 6px -6px #ccc;
  height:100%;
}

/* =============================================================================
   eCommerce 
   ========================================================================== */
#content-page .box-square {position:relative;width:100%;padding-top:100% !important;background-color:#FFF;}
#content-page .box-square img {
position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  top:0;
  bottom:0;
  text-align: center;
  z-index: 1;
  max-height:100%;
}

#promoMessage {
    text-align:center;
    padding:0.75rem 0;
    display:none;
}
#promoMessage .close {font-size:1.25rem;margin-right:1rem}
#promoMessage p {margin:0}

/* =============================================================================
   Boostrap overides
   ========================================================================== */
footer {text-align:center;}

.custom-select.is-valid, .form-control.is-valid, .was-validated .custom-select:valid, .was-validated .form-control:valid {
    border-color: #ced4da;
}

.custom-select.is-invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .was-validated .form-control:invalid {
  background:#f8d7da;
  border-color:#f5c6cb;
}

.form-control::placeholder {
  color:#aab7c4
}

  #content-page .form-group {margin-bottom: 0.75rem}
  #content-page .form-control {margin-bottom: 0.75rem}

/* =============================================================================
   Media Queries
   ========================================================================== */
/* Smaller devices (tablets, 480px and up) */
@media (min-width: 480px) {
  #content-page .side-padding {padding-left:48px;padding-right:48px}
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  
  #content-page {text-align: left}
  

  .text-right-desktop {text-align:right;}
  footer {text-align:left;}

  .carousel-control-prev, .carousel-control-prev:focus {
    margin-left: -20px;
    color:#000;
    visibility:visible;
  }

  .carousel-control-next, .carousel-control-next focus {
    margin-right: -20px;
    color:#000;
    visibility:visible;
  }

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 


}

@media print { 
 /* All your print styles go here */
 header, footer, #nav, .mobile-nav-toggle, .btn-sm { display: none !important; } 
}