/* ---------------------------------------------------------- */
/* PRELOADER */
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* DEFAULT VARIABLES */
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* BASIC SETUP */
/* ---------------------------------------------------------- */
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box; }

*:focus {
  outline: transparent;
  border: transparent; }

html,
body {
  font-size: 18px;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  color: #000000;
  line-height: 150%;
  margin: 0px;
  padding: 0px;
  text-rendering: optimizeLegibility;
  overflow-x: hidden; }
  @media only screen and (max-width: 480px) {
    html,
    body {
      font-size: 100%; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    html,
    body {
      font-size: 100%; } }
  @media only screen and (min-width: 481px) and (max-width: 767px) {
    html,
    body {
      font-size: 100%; } }

      @font-face {
        font-family: .barlow-condensed-regular {
          font-family: "Barlow Condensed", sans-serif;
          font-weight: 400;
          font-style: normal;
        }
        
        .barlow-condensed-medium {
          font-family: "Barlow Condensed", sans-serif;
          font-weight: 500;
          font-style: normal;
        }
        
        .barlow-condensed-semibold {
          font-family: "Barlow Condensed", sans-serif;
          font-weight: 600;
          font-style: normal;
        }
        ;
        src: url();
      }

/* ------------------- HEADINGS ------------------- */
h1,
h2,
h3,
h4 {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 600;
  font-style: normal;
  display: block;
  margin: 0 auto; }
h1 {
  font-size: 550%;
}
h5,
h6 {
  font-size: 110%;
  
  text-align: center; }

h3 {
  text-align: center; }

.navbar {
  font-family: "Barlow Condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
  letter-spacing: 1px;
  background-color: #000000;
  padding: 9px 0px 8px 0px; }
  @media only screen and (max-width: 480px) {
    .navbar {
      margin-top: 0px;
      padding: 5px 0px 8px 0px; } }
  @media only screen and (min-width: 481px) and (max-width: 767px) {
    .navbar {
      margin-top: 0px;
      padding: 5px 0px 8px 0px; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .navbar {
      margin-top: 0px;
      padding: 9px 0px 12px 0px; } }
  .navbar .fa-bars {
    margin-right: 12px;
    font-size: 30px;
    color: #9e9e9e;
    text-align: center; }
  .navbar .navbar-nav {
    margin-top: 0px; }

/* ---------------------------------------------------------- */
/* Preloader */
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* LINKS */
/* ---------------------------------------------------------- */
/* ---------- FOOTER ---------- */
a,
a:link,
a:visited {
  font-weight: 400;
  font-size: 100%;
  color: #000000;
  letter-spacing: 1px;
  padding-left: 0;
  text-decoration: none; }
  @media only screen and (max-width: 767px) and (max-width: 991px) {
    a,
    a:link,
    a:visited {
      font-weight: 400;
      font-size: 100%;
      margin-top: 5px; } }

a:hover {
  font-weight: 400;
  color: #a1a1a1; }

/* ---------- NAVBAR ---------- */
.navbar-nav {
  margin-left: auto; }

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .navbar-collapse {
    margin-top: 20px; } }

.nav-link {
  margin-left: 40px;
  font-size: 100%; }
  @media only screen and (max-width: 480px) {
    .nav-link {
      border-bottom: 0;
      padding-bottom: 0px;
      margin-bottom: 0px; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .nav-link {
      margin-top: -5px;
      margin-left: 20px; } }

nav a:link,
nav a:visited {
  color: #FEFAFA;
  font-size: 100%;
  letter-spacing: 1px; }

.nav-item .active {
  color: #ed1c24;
  border-bottom: 12px solid #ed1c24;
  padding-bottom: 20px;
  margin-bottom: -20px; }
  @media only screen and (max-width: 480px) {
    .nav-item .active {
      border-bottom: 0;
      padding-bottom: 0px;
      margin-bottom: 0px; } }
  @media only screen and (min-width: 481px) and (max-width: 767px) {
    .nav-item .active {
      border-bottom: 0; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .nav-item .active {
      border-bottom: 0; } }

.nav-item a:hover {
  color: #ed1c24;
  border-bottom: 12px solid #ed1c24;
  padding-bottom: 20px;
  margin-bottom: -20px; }
  @media only screen and (max-width: 480px) {
    .nav-item a:hover {
      border-bottom: 0;
      padding-bottom: 0px;
      margin-bottom: 0px; } }
  @media only screen and (min-width: 481px) and (max-width: 767px) {
    .nav-item a:hover {
      border-bottom: 0; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .nav-item a:hover {
      border-bottom: 0; } }

.navbar-brand img {
  width: 200px;
  height: auto;
  margin-left: 15px; }
  @media only screen and (max-width: 480px) {
    .navbar-brand img {
      width: 180px;
      height: auto;
      margin-left: 15px; } }
  @media only screen and (min-width: 481px) and (max-width: 767px) {
    .navbar-brand img {
      width: 180px;
      height: auto;
      margin-left: 15px; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .navbar-brand img {
      width: 210px;
      height: auto;
      margin-left: 15px;
      margin: 0 10px -5px 10px; } }

/* ---------------------------------------------------------- */
/* REUSABLE COMPONENTS */
/* ---------------------------------------------------------- */
section {
  padding: 120px 0; }

.section-head-text {
  letter-spacing: 1px !important;
  padding-bottom: 50px;
  text-align: center; }

.lead {
  font-size: 140%;
  font-weight: 300;
  text-align: center;
  line-height: 144%;
  display: block;
  max-width: 100%;
  width: 65%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 15px; }
  @media only screen and (max-width: 480px) {
    .lead {
      font-size: 120%;
      text-align: left;
      display: block;
      width: 100%;
      text-align: left;
      margin-left: 25px;
      padding-right: 35px; } }

@media only screen and (max-width: 480px) {
  p {
    margin-left: 15px; } }

.lightBG {
  background-color: #f0f0f0 !important; }

.whiteBG {
  background-color: #FEFAFA !important; }

.secondaryBG {
  background-color: #ed1c24;
  color: #000000; }

#sectionPortfolio {
  padding-bottom: 120px;
  padding-top: 10px; }

.heavy {
  font-weight: 500; }

.textFeatured {
  margin: 0 auto 0 auto;
  letter-spacing: 2px; }

.boxText {
  width: 50%;
  display: block;
  margin: auto; }
  @media only screen and (max-width: 480px) {
    .boxText {
      width: 94%; } }

/* Card Image Rollover */
.card-img-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .7s ease;
  background-color: rgba(255, 255, 255, 0.75);
  -webkit-transition: .7s ease;
  -moz-transition: .7s ease;
  -ms-transition: .7s ease;
  -o-transition: .7s ease; }

.card-img-overlay:hover {
  opacity: 1; }

.card-overlay-text {
  background-color: transparent;
  font-size: 125%;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 99;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center; }

/* ---------------------------------------------------------- */
/* HOME */
/* ---------------------------------------------------------- */
#sectionHome {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  text-align: center;
  vertical-align: middle;
  padding: 0;
  background-image: url("../resources/img/about-bg-02.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  z-index: -1; }
  #sectionHome h1 {
    font-size: 220%;
    font-weight: 400;
    color: #FEFAFA;
    letter-spacing: 1px;
    line-height: 150%; }
  @media only screen and (max-width: 480px) {
    #sectionHome {
      background-image: url("../resources/img/about-bg-02-mobile.jpg"); } }

.heroParallax:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(255, 255, 255, 0.65);
  padding: 0;
  z-index: -1; }

#sectionHome .body-container img {
  height: 80vh; }
  @media only screen and (max-width: 480px) {
    #sectionHome .body-container img {
      margin-top: 30px; } }
      #sectionHome .body-container img {
        height: 80vh; }
        @media only screen and (min-width: 480px) {
          #sectionHome .body-container img {
            margin-top: 50px; } }

/* ---------------------------------------------------------- */
/* GALLERY */
/* ---------------------------------------------------------- */
#sectionPortfolio .container {
  padding-top: 100px;
  width: 100%; }

.galleryCard {
  border: none;
  margin: 15px 0px;
  padding: 0px;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0; }

.card-body {
  padding-left: 25px;
  padding-right: 5px;
  letter-spacing: 0px; }

.galleryCard img {
  display: block;
  width: 100%;
  height: auto;
  padding: 0px;
  margin: 0px;
  background-color: #FEFAFA5e8;
  border-radius: 0%;
  -webkit-border-radius: 0%;
  -moz-border-radius: 0%;
  -ms-border-radius: 0%;
  -o-border-radius: 0%; }

.boxImage {
  background-color: #FEFAFA8f8;
  padding: 0px; }

.card-img-overlay img {
  background-color: transparent; }

/* ---------------------------------------------------------- */
/* ABOUT  */
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* SERVICES NEW  */

ul#service-list,#other-list {
  display: block;
  margin-left: 40px;
}
ul#sublist {
  display: block;
  margin-left: 40px;
}
/* ---------------------------------------------------------- */
/* ---------------------------------------------------------- */
/* CLIENTS  */
/* ---------------------------------------------------------- */
@media only screen and (max-width: 480px) {
  #sectionClients h5 {
    margin-top: 15px; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  #sectionClients h5 {
    margin-top: 15px; } }

.rowClient {
  display: flex;
  padding: 0;
  width: 80%;
  margin: 0 auto; }
  @media only screen and (max-width: 480px) {
    .rowClient {
      width: 100%; } }

.boxClient img {
  padding: 0;
  margin: 10px; }

.col-md-5col {
  width: 20%;
  min-height: 1px; }

.col-sm-2col {
  width: 50%;
  min-height: 1px; }

/* ---------------------------------------------------------- */
/* CONTACT  */
/* ---------------------------------------------------------- */
/* FORM  */
#sectionContact h1 {
  padding-bottom: 50px; }

#sectionContact .lead {
  margin-bottom: 30px; }

#sectionContact .formRow {
  padding-left: 100px; }
  @media only screen and (max-width: 480px) {
    #sectionContact .formRow {
      padding-left: 0; } }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    #sectionContact .formRow {
      padding-left: 0; } }

.contactDetailsRow {
  display: flex;
  justify-content: center; }

.centerAlign {
  display: block;
  width: 62%;
  text-align: center;
  margin: 0 auto;
  padding-bottom: 40px; }

@media only screen and (max-width: 480px) {
  text-align: left; }

.formRow {
  display: flex;
  justify-content: center; }

#formContainer {
  padding: 0; }
  #formContainer h3 {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 7px; }
  @media only screen and (max-width: 480px) {
    #formContainer {
      padding: 0 5%; } }

@media only screen and (max-width: 480px) {
  .columnForm {
    width: 80%;
    padding-top: 20px;
    background-color: #f0f0f0; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  .columnForm {
    width: 60%;
    padding-top: 20px;
    background-color: #f0f0f0; } }

@media only screen and (max-width: 480px) {
  .paraTextRow p {
    width: 80%;
    text-align: left; } }

.subHeadRow {
  margin: 0px 0px 20px 0px; }
  .subHeadRow h3 {
    display: block;
    padding: 0 auto; }

.form-control {
  background-color: #FEFAFA;
  width: 100%;
  margin: 2px;
  border: 0;
  border-bottom: 1px solid #e0e0e0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0; }
  @media only screen and (max-width: 480px) {
    .form-control {
      width: 100%;
      margin: 0; } }

.messageArea,
.inputArea {
  width: 100%; }

.form-control:focus {
  outline: none !important;
  box-shadow: none !important;
  border: 1px solid lightgrey; }

::placeholder {
  font-size: 80%;
  font-weight: 300; }

.checkBox input {
  margin-right: 8px; }

input[type='checkbox'] {
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background: lightgrey;
  border-radius: 5px 0 5px 5px;
  box-sizing: border-box;
  position: relative;
  box-sizing: content-box;
  width: 36px;
  height: 36px;
  border-width: 0;
  transition: all 0.3s linear;
  -webkit-border-radius: 5px 0 5px 5px;
  -moz-border-radius: 5px 0 5px 5px;
  -ms-border-radius: 5px 0 5px 5px;
  -o-border-radius: 5px 0 5px 5px; }
  @media only screen and (max-width: 480px) {
    input[type='checkbox'] {
      width: 30px;
      height: 30px;
      padding: 0; } }

/* input[type='checkbox']:checked + label:before {
	display: inline-block;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f007';
	margin-left: -30px;
	padding-bottom: 0px;
	z-index: 9999;
} */
input[type='checkbox']:checked {
  background-color: #ed1c24; }

input[type='checkbox']:focus {
  outline: 0 none;
  box-shadow: none; }

.checkboxColumn {
  text-align: left;
  padding: 0; }
  .checkboxColumn img {
    width: 40px;
    height: auto; }
    @media only screen and (max-width: 480px) {
      .checkboxColumn img {
        width: 30px; } }
    @media only screen and (min-width: 768px) and (max-width: 991px) {
      .checkboxColumn img {
        width: 30px; } }

.submitColumn {
  text-align: right; }
  .submitColumn img {
    width: 40px;
    height: auto; }
    @media only screen and (max-width: 480px) {
      .submitColumn img {
        width: 30px; } }
    @media only screen and (min-width: 768px) and (max-width: 991px) {
      .submitColumn img {
        width: 30px; } }
  .submitColumn .buttRoll {
    display: none; }
  .submitColumn :hover .buttMain {
    display: none; }
  .submitColumn :hover .buttRoll {
    display: block; }
  .submitColumn .btn {
    padding: 0;
    border: none; }

.alert {
  text-align: center; }

.blockImage {
  display: block;
  float: left; }

.blockText {
  display: block;
  float: left; }

.emailNumberAddress {
  display: block;
  font-size: 90%;
  line-height: 140%;
  margin-left: 5px;
  background-color: #FEFAFA; }
  .emailNumberAddress .buttMain {
    display: block;
    width: 40px;
    height: auto;
    float: left;
    margin-right: 15px;
    padding-top: 6px; }
  .emailNumberAddress .buttRoll {
    display: none; }

.linkedDivision :hover img.buttMain {
  display: none; }

.linkedDivision :hover .blockImage .buttRoll {
  display: block;
  width: 40px;
  height: auto;
  float: left;
  margin-right: 15px;
  padding-top: 6px; }

.clearfix {
  margin-bottom: 15px; }

.colAddress {
  margin-left: 45px;
  padding-left: 45px;}
  @media only screen and (max-width: 480px) {
    .colAddress {
      margin: 40px 0 0 40px;
      padding-left: 0;
      border: 0; } }
  @media only screen and (min-width: 481px) and (max-width: 767px) {
    .colAddress {
      margin-left: 25px;
      padding-left: 0;
      border: 0; } }
  .colAddress h6 {
    text-align: left;
    font-weight: 300;
    font-size: 120%;
    margin: 0 0 20px 0; }
    @media only screen and (min-width: 481px) and (max-width: 767px) {
      .colAddress h6 {
        text-align: center;
        margin: 60px 0 30px 0; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  div #afterEmail,
  div #afterAddress {
    display: none; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  div #columnEmail {
    float: left;
    margin-left: 0;
    margin-bottom: 15px; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  div #columnPhone {
    float: left;
    margin-left: 80px;
    margin-bottom: 15px; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  div #columnPhone {
    float: left; } }

@media only screen and (min-width: 481px) and (max-width: 767px) {
  div #columnWorkingHours {
    float: left;
    margin-left: 35px; } }

/* MAP 
.mapContainer {
	height: 400px;
	padding: 0;
	margin: 25px 0;
}

.mapColumn {
	margin-right: 0;
	padding: 0;
	z-index: 9999;
}

#map {
	padding: 0px;
	height: 225px;
	margin: 0;
}

#map .iframe {
	z-index: 0;
	border: 2px solid #d3d3d3;
}
*/
/* ---------------------------------------------------------- */
/* FOOTER  */
/* ---------------------------------------------------------- */
footer a,
footer a:link,
footer a:visited {
  font-size: 100%;
  letter-spacing: 0.5px;
  color: #FEFAFA;
  padding-left: 0;
  text-decoration: none; }

footer a:hover {
  color: #ed1c24; }

footer a:active {
  color: #FEFAFA; }

/* ---------------------ADDRESS--------------------------- */
.blackBg {
  background-color: #000000; }

footer {
  font-size: 80%;
  color: #FEFAFA;
  text-align: center; }
  @media only screen and (max-width: 480px) {
    footer {
      font-size: 100%;
      line-height: 100%; } }
  footer .container {
    padding: 60px 0; }
  footer h6 {
    font-size: 110%;
    font-weight: 500;
    margin: 0px 0 10px 0; }
    @media only screen and (max-width: 480px) {
      footer h6 {
        font-size: 100%; } }

/* ---------------------------------------------------------- */
/* FIX (Clear both) */
/* ---------------------------------------------------------- */
.fix {
  clear: both; }

.group:before,
.group:after {
  content: '';
  display: table; }

.group:after {
  clear: both; }

.group {
  zoom: 1; }

*:focus {
  outline: none; }