/* #region head */
html, body {
  height: 100%;
}

body {
  font-family: 'Source Sans Pro', sans-serif;
  color: #28292A;
  background: #F0F1F3;
}

.border div {
  border: 1px solid silver ;
}

.white,
.white a,
.white a:link,
.white a:visited,
.white a:hover,
.white a:active
{
  color: #fff;
}
a,
a:link,
a:visited,
a:hover,
a:active
{
  text-decoration: none;
}

a:hover {
  border-bottom: 2px solid #FF4405;
}

.container {
  max-width: 1152px;
}
.container.less-pad {
  padding-right: 5px;
  padding-left: 5px;
}
.less-pad .col-lg-1, .less-pad .col-lg-10, .less-pad .col-lg-11, .less-pad .col-lg-12, .less-pad .col-lg-2, .less-pad .col-lg-3, .less-pad .col-lg-4, .less-pad .col-lg-5, .less-pad .col-lg-6, .less-pad .col-lg-7, .less-pad .col-lg-8, .less-pad .col-lg-9, .less-pad .col-md-1, .less-pad .col-md-10, .less-pad .col-md-11, .less-pad .col-md-12, .less-pad .col-md-2, .less-pad .col-md-3, .less-pad .col-md-4, .less-pad .col-md-5, .less-pad .col-md-6, .less-pad .col-md-7, .less-pad .col-md-8, .less-pad .col-md-9, .less-pad .col-sm-1, .less-pad .col-sm-10, .less-pad .col-sm-11, .less-pad .col-sm-12, .less-pad .col-sm-2, .less-pad .col-sm-3, .less-pad .col-sm-4, .less-pad .col-sm-5, .less-pad .col-sm-6, .less-pad .col-sm-7, .less-pad .col-sm-8, .less-pad .col-sm-9, .less-pad .col-xs-1, .less-pad .col-xs-10, .less-pad .col-xs-11, .less-pad .col-xs-12, .less-pad .col-xs-2, .less-pad .col-xs-3, .less-pad .col-xs-4, .less-pad .col-xs-5, .less-pad .col-xs-6, .less-pad .col-xs-7, .less-pad .col-xs-8, .less-pad .col-xs-9 {
  padding-right: 5px;
  padding-left: 5px;
}
.less-pad .row {
  margin-right: -5px;
  margin-left: -5px;
}

/* #endregion head */

/* #region hero image */
.hero-image {
  background-image: url("../images/Commercial_Software.jpg");
  height: 800px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.hero-text-container {
  width: 100%;
  height: 700px;
  max-width: 1152px;
  margin: 0 auto;
  position: relative;
}
/* Place text in the middle of the image */
.hero-text {
  position: absolute;
  top: 50%;
  left: 0%;
  transform: translate(0, -50%);
  color: white;
  font-size: 70px;
  font-weight: bold;
  line-height: 80px;
}
.hero-underline {
  background: #FF4405;
  width: 160px;
  height: 8px;
  margin-top: 36px;
}
/* #endregion hero image */

/* #region nav */
#logo-small {
  display: none;
}
.nav-buttons {
  padding-top: 28px;
}
.nav-buttons .btn {
  font-weight: bold;
  font-size: 18px;
  line-height: 23px;
  margin-left: 25px;
  border-radius: 0;
}
.nav-buttons .row {
  margin-left: 0px;
}
.nav-buttons .shim {
  margin-top: 3px;
}
.nav-buttons .hamburger {
  border: 1px solid #fff;
  margin-right: 10px;
  border-radius: 4px;
  display: none;
}
.hamburger:hover {
  background-color:rgba(206, 206, 206, 0.4);
}
.icon-bar {
  background-color: #fff;
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
  margin: 4px 0;
}
/* #endregion nav */

/* #region pages */
#about {
  padding-top: 60px;
}
.light-grey {
  background-color: #F0F1F3;
}
.light-grey a {
  color: #FF4405;
  padding-bottom: 2px;
  border-bottom: 1px solid #FF4405;
}
.light-grey a:hover {
  border-bottom: 2px solid #FF4405;
}

.section {
  padding-top: 60px;
  padding-bottom: 60px;
}
.section h1 {
  text-align: center;
  font-weight: bolder;
  font-size: 52px;
  line-height: 52px;
  letter-spacing: -2px;
}
.section .title-underline {
  background: #FF4405;
  width: 80px;
  height: 8px;
  margin: 50px auto 60px auto;
}
.section h2 {
  font-size: 28px;
  font-weight: bold;
  line-height: 38px;
  margin: 0 0 15px 0;
}
.section p {
  font-size: 18px;
  font-weight: normal;
  line-height: 32px;
  margin: 15px 0 15px 0;
}

.product-row {
  margin-bottom: 80px;
}
.product-row > div {
  height: 480px;
  position: relative;
  background-color: #F0F1F3;
}
.product-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60%;
}
.product-text a {
  color: #FF4405;
  padding-bottom: 3px;
  border-bottom: 1px solid #FF4405;
}
.product-text a:hover {
  border-bottom: 2px solid #FF4405;
}
.product-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.tallypro {
  background-image: url("../images/TallyPro.jpg");
}
.expattracker {
  background-image: url("../images/ExpatTracker.jpg");
}
.projectstaffmanager {
  background-image: url("../images/Project_Staff_Manager.jpg");
}
.emir {
  background-image: url("../images/EMiR_ModulesWheel.svg");
  background-size: 85%;
}
.csp11d {
  background-image: url("../images/CSP11D.jpg");
}


.dark-grey {
  background: #28292A;
  color: #ffffff;
}
.dark-grey a {
  color: #ffffff;
  border-bottom: 1px solid #fff;
}
.dark-grey a:hover {
  color: #ffffff;
  border-bottom: 2px solid #fff;
}
.pad-right {
  padding-right: 5%;
}
.pad-left {
  padding-left: 5%;
}


.client-badge {
  height: 200px;
  background-position: center;
  background-repeat: no-repeat;
  background-color: #F0F1F3;
  border: 5px solid #fff;
}
.client-badge:first-child {
  border-left: none;
}
.client-badge:last-child {
  border-right: none;
}
.acal {
  background-image: url("../images/Acal.png");
}
.aggreko {
  background-image: url("../images/aggreko.png");
}
.amex {
  background-image: url("../images/Amex.png");
}
.bnp {
  background-image: url("../images/BNPParibas_logo.jfif");
  background-size: 50%;
}
.bp {
  background-image: url("../images/BP.png");
}
.bpdts {
  background-image: url("../images/BPDTS_logo.png");
  background-size: 50%;
}
.continental {
  background-image: url("../images/Continental_bw.png");
}
.crystaltech {
  background-image: url("../images/Crystaltech_logo.jfif");
  background-size: 50%;
}
.embraer {
  background-image: url("../images/Embraer.png");
}
.ge {
  background-image: url("../images/GE.png");
}
.hr {
  background-image: url("../images/H+R.png");
}
.ipsen {
  background-image: url("../images/Ipsen.png");
}
.isio {
  background-image: url("../images/isio_logo.png");
  background-size: 50%;
}
.kpmg {
  background-image: url("../images/KPMG.png");
}
.mazars {
  background-image: url("../images/Mazars.png");
  background-size: 60%;
}
.metlife {
  background-image: url("../images/Metlife.png");
}
.msamlin {
  background-image: url("../images/MS_Amlin.png");
}
.nhs {
  background-image: url("../images/NHS.png");
}
.ralph {
  background-image: url("../images/Ralph.png");
}
.sab {
  background-image: url("../images/SAB.png");
}
.sap {
  background-image: url("../images/S&P_logo.png");
  background-size: 50%;
}
.tat {
  background-image: url("../images/T&T_logo.png");
  background-size: 80%;
}
.siit {
  background-image: url("../images/SIT_Logo.jpg");
  background-size: 80%;
}
.knfr {
  background-image: url("../images/knightfrank_logo.svg");
  background-size: 80%;
}


.section h3 {
  font-size: 18px;
  font-weight: bold;
}
.section h3.shim {
  padding-top: 10px;
}
.section h2.shim {
  padding-top: 30px;
}


.form-group {
  margin-top: 30px;
}
.form-group label, .form-group input {
  font-size: 18px;
  font-weight: normal;

}
.form-group input {
  height: 48px;
}
.form-group textarea {
  height: 192px;
}
.form-control {
  border: 1px solid #DDDEE0;
  border-radius: 0;
}
.btn.orange {
  height: 52px;
  background: #FF4405;
  border-radius: 30px;
  font-weight: bold;
  color: #fff;
  padding: 2px 40px;
  font-size: 18px;
}

/* #endregion pages */

/* #region footer */
.foot-notes {
  margin-top: 48px;
  line-height: 25px;
  font-size: 14px;
  color: #C4C5C7;
}
.foot-notes a, .foot-notes a:hover {
  padding-bottom: 2px;
  color: #C4C5C7;
}
.foot-img-cyberessen {
  height: 150px;
  margin: 50px auto 60px auto;
}
/* #endregion footer */

@media (max-width: 1200px) {
  .hero-text-container {
      max-width: 970px;
  }
}
@media (max-width: 992px) {
  .hero-text-container {
      max-width: 750px;
  }
  .client-badge:first-child, .client-badge:last-child {
    border: 5px solid #fff;
  }
}
@media (max-width: 800px) {
  .hero-text-container {
    height: 525px;
  }
  /* .nav-buttons .hamburger {
    display: block;
  } */
  .nav-buttons section {
    /* display: none; */
    clear: both;
    padding-top: 15px;
  }
  .nav-buttons section .btn {
    display: block;
    float: none !important;
    border-radius: 0;
    padding: 10px;
    margin: 0 8px 0 0;
    border-bottom: 2px solid transparent;
  }
  .nav-buttons section .btn:hover {
    border-bottom: 2px solid #FF4405;
  }
  .nav-buttons section > * {
    border-top: 1px solid;
  }
  .final-bar {
    display: block;
    float: none !important;
    padding: 10px;
    margin: 0 8px 0 0;
    border-bottom: 2px solid transparent;
  }
  .hero-text {
    font-size: 9vw;
    line-height: 12vw;
    padding-left: 5px;
  }
}
@media (max-width: 385px) {
  #expat-text {
    height: 600px;
  }
  .section h1 {
    font-size: 14vw;
  }
}
@media (max-width: 360px) {
  .nav-buttons .btn {
    font-size: 5.5vw;
    line-height: 7vw;
  }
  .section h2 {
    font-size: 10vw;
    line-height: 13vw;
  }
  .section p {
    font-size: 5.5vw;
    line-height: 10vw;
  }

  .section h3 {
    font-size: 5.5vw;
  }
  .form-group label, .form-group input {
    font-size: 5.5vw;

  }
  .btn.orange {
    font-size: 5.5vw;
  }
}
@media (max-width: 320px) {
  #logo-big {
    display: none;
  }
  #logo-small {
    display: block;
    height: 28px;
  }
  #expat-text {
    height: 700px;
  }
  #psm-text, #p11d-text {
    height: 600px;
  }
}
