/*--------------------------------------------------------------
    MIXINS
--------------------------------------------------------------*/
/*Font styles - Take the pain out of setting styles for a font. (This assumes you have already included the font), set your fallback font once and you never have to worry again.*/
/*Pseudo - When using ::before and ::after you'll always need these three, so we're saving two lines of code every time you use this.*/
/*Pseudo - When using ::before and ::after to create an icon*/
/*Placeholders - They're a pain as you have to set the style in all the separate formats, this sorts it for you.*/
/*Just in case there are people how aren't used to using @content here is a usage example:
input,  
textarea {  
    @include input-placeholder {
        color: $grey;
    }
}
 */
/*Media queries - A massive time saver! You can just use pixel values but we have some default breakpoints setup that work too, another time saver while keeping your breakpoints consistent.*/
/* The example below showing the padding and font-size increasing once the viewport gets over 1024px.
.site-header {
    padding: 2rem;
    font-size: 1.8rem;
    @include mq('tablet-wide') {
        padding-top: 4rem;
        font-size: 2.4rem;
    }
}
*/
/*Truncate - Adding Truncation to an element isn't as simple as it should be, although it is with this handy time saver, meaning when you include the mixin, you only have to specify your boundry with a max width value, happy days!*/
/* mixin for multiline */
/*--------------------------------------------------------------
    MIXINS
--------------------------------------------------------------*/
html {
  overflow-y: scroll;
  overflow-x: hidden;
  -ms-overflow-style: scrollbar;
  min-height: 100vh; }

body {
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  color: #141633; }

main {
  min-height: calc(100vh - 80px - 160px);
  width: 100%;
  display: flex;
  flex-direction: column; }
  @media only screen and (max-width: 767px) {
    main {
      min-height: calc(100vh - 55px - 100px); } }

h2 {
  font-family: "Roboto", sans-serif;
  font-size: 30px;
  color: #1C1C22;
  font-weight: 200;
  line-height: 33px;
  font-style: normal;
  margin: 0px;
  padding: 0px; }

.btn.btn-black {
  background: #1F1A26;
  color: #FFFFFF;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  font: 600 16px/1.6 "Roboto", sans-serif;
  padding: 20px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  width: fit-content;
  display: inline-block;
  position: relative; }
  .btn.btn-black:visited {
    color: #FFFFFF;
    text-decoration: none; }
  .btn.btn-black:hover {
    color: #e6e6e6;
    text-decoration: none; }
  .btn.btn-black:active {
    color: #e6e6e6;
    text-decoration: none; }
.btn.large {
  padding: 20px 40px; }
  @media only screen and (max-width: 767px) {
    .btn.large {
      width: 100%; } }

/*--------------------------------------------------------------
    Footer
--------------------------------------------------------------*/
.top-header {
  height: 80px;
  position: relative;
  width: 100%;
  z-index: 1000; }
  @media only screen and (max-width: 767px) {
    .top-header {
      height: 55px;
      position: fixed; } }
  .top-header .navbar {
    max-width: 1100px;
    width: 1100px;
    margin: 0 auto;
    padding: 0;
    height: 80px; }
    @media only screen and (max-width: 767px) {
      .top-header .navbar {
        width: 100%;
        min-width: 100%;
        padding: 0;
        align-items: center;
        height: 55px;
        min-height: 55px; } }
    @media only screen and (max-width: 767px) {
      .top-header .navbar .navbar-brand {
        margin-left: 20px; }
        .top-header .navbar .navbar-brand img {
          max-height: 36px; } }
    .top-header .navbar .navbar-toggler {
      color: #FFF;
      border: none;
      outline: none;
      height: 100%;
      padding-right: 20px;
      background-color: rgba(36, 29, 23, 0.6);
      padding-left: 21px; }
      .top-header .navbar .navbar-toggler span {
        display: block;
        width: 25px;
        height: 3px;
        margin-bottom: 4px;
        position: relative;
        background: #FFFFFF;
        border-radius: 3px;
        z-index: 1;
        transform-origin: 4px 0px;
        transition: transform 0.1s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.1s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.1s ease; }
        .top-header .navbar .navbar-toggler span:first-child {
          transform-origin: 0% 0%; }
        .top-header .navbar .navbar-toggler span:nth-last-child(2) {
          transform-origin: 0% 100%; }
      .top-header .navbar .navbar-toggler:not(.collapsed) {
        /*height: 10px; */
        border: 2px solid #fff;
        padding: 1px 1px 0 1px;
        height: 22px;
        border-radius: 50%;
        /* display: flex; */
        width: 22px;
        margin: 17px 20px; }
        .top-header .navbar .navbar-toggler:not(.collapsed) span {
          /*opacity: 1;
          transform: rotate(45deg) translate(1px, -1px);
          background: #1C1C22;*/
          opacity: 1;
          transform: rotate(45deg) translate(6px, -1px);
          background: #fff;
          width: 12px;
          height: 2px;
          /*
          * But let's hide the middle one.
          */ }
          .top-header .navbar .navbar-toggler:not(.collapsed) span:nth-child(2) {
            opacity: 0; }
          .top-header .navbar .navbar-toggler:not(.collapsed) span:nth-child(3) {
            transform: rotate(-45deg) translate(4px, 0px); }
    @media only screen and (max-width: 767px) {
      .top-header .navbar .navbar-collapse {
        padding: 0;
        text-align: right;
        background: rgba(0, 0, 0, 0.9);
        -webkit-box-shadow: inset 0px 5px 7px 0px rgba(0, 0, 0, 0.16);
        -moz-box-shadow: inset 0px 5px 7px 0px rgba(0, 0, 0, 0.16);
        box-shadow: inset 0px 5px 7px 0px rgba(0, 0, 0, 0.16); } }
    @media only screen and (max-width: 767px) {
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item {
        padding: 20px;
        border-bottom: 1px solid rgba(112, 112, 112, 0.1); } }
    .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link,
    .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active {
      font-family: "Roboto", sans-serif;
      font-size: 16px;
      color: #FFFFFF;
      font-weight: 600;
      line-height: 18px;
      font-style: normal;
      color: #FFFFFF;
      text-decoration: none; }
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:visited,
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active:visited {
        color: #FFFFFF;
        text-decoration: none; }
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:hover,
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active:hover {
        color: white;
        text-decoration: none; }
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link:active,
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active:active {
        color: #cccccc;
        text-decoration: none; }
      @media only screen and (max-width: 767px) {
        .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link,
        .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active {
          padding: 0;
          margin: 0;
          font-family: "Roboto", sans-serif;
          font-size: 16px;
          color: #FFFFFF;
          font-weight: 400;
          line-height: 18px;
          font-style: normal;
          background-image: url("../img/arrow.svg");
          background-size: contain;
          background-repeat: no-repeat;
          background-position: left center;
          min-height: 20px; } }
      @media only screen and (min-width: 768px) {
        .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link,
        .top-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link.active {
          padding-right: 50px; } }
    @media only screen and (max-width: 767px) {
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item:last-child {
        border: none; } }
    @media only screen and (min-width: 768px) {
      .top-header .navbar .navbar-collapse .navbar-nav .nav-item:last-child .nav-link {
        padding-right: 0; } }

/*--------------------------------------------------------------
    Footer
--------------------------------------------------------------*/
footer {
  margin-top: auto;
  min-height: 160px;
  /* height: 160px; */
  overflow: hidden; }
  @media only screen and (max-width: 767px) {
    footer {
      min-height: 100px; } }
  footer p {
    font-family: "Roboto", sans-serif;
    font-size: 12px;
    color: #000000;
    font-weight: 400;
    line-height: 16px;
    font-style: normal;
    margin-bottom: 0; }
  footer .footer {
    display: flex;
    max-width: 1100px;
    width: 1100px;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
    margin: 50px auto; }
    @media only screen and (max-width: 767px) {
      footer .footer {
        flex-direction: row;
        margin: 0;
        padding: 0;
        max-width: 100%;
        width: 100%;
        display: block;
        text-align: center; } }
    footer .footer .logo-box {
      margin-top: -37px; }
      @media only screen and (max-width: 767px) {
        footer .footer .logo-box {
          padding: 20px;
          text-align: left; } }
      footer .footer .logo-box img {
        max-height: 40px;
        height: 40px; }
        @media only screen and (max-width: 767px) {
          footer .footer .logo-box img {
            max-height: 51px;
            height: 51px; } }
    footer .footer .footer-menu {
      text-align: right; }
      @media only screen and (max-width: 767px) {
        footer .footer .footer-menu {
          text-align: center; } }
      footer .footer .footer-menu a {
        display: inline-block;
        margin-left: 40px;
        color: #000;
        font-size: 18px;
        text-transform: capitalize; }
        @media only screen and (max-width: 767px) {
          footer .footer .footer-menu a {
            margin: 20px; } }
    footer .footer .disclaimer {
      text-transform: uppercase;
      padding: 20px;
      text-align: right;
      margin-top: 34px; }
      @media only screen and (min-width: 768px) {
        footer .footer .disclaimer {
          padding-right: 0; } }
      footer .footer .disclaimer .copyright {
        margin-top: 34px; }
      @media only screen and (max-width: 767px) {
        footer .footer .disclaimer {
          text-align: center; }
          footer .footer .disclaimer .copyright {
            text-align: center; } }

/*--------------------------------------------------------------
    Forms
--------------------------------------------------------------*/
.form-group {
  margin-bottom: 0;
  position: relative;
  vertical-align: top;
  margin-top: 0px;
  padding-left: 0px; }
  @media only screen and (max-width: 767px) {
    .form-group {
      padding-right: 0; } }
  .form-group .form_label {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    color: #c6c6c6;
    font-weight: 400;
    line-height: 20px;
    font-style: normal;
    -webkit-transition: all;
    -o-transition: all;
    transition: all;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    position: absolute;
    top: 15px;
    pointer-events: none;
    z-index: 0;
    left: 10px;
    white-space: nowrap;
    overflow: hidden;
    width: 100%; }
    .form-group .form_label .red {
      color: #FF0000; }
  .form-group.focused .form_label {
    top: 3px;
    font-size: 14px;
    color: #000;
    text-transform: uppercase; }
    .form-group.focused .form_label .red {
      color: rgba(20, 22, 51, 0.6); }
  .form-group textarea.form-control {
    padding-top: 10px; }
  .form-group .form-control {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    color: #c6c6c6;
    font-weight: 400;
    line-height: 20px;
    font-style: normal;
    width: 100%;
    padding: 10px 10px 5px 10px;
    border: 1px #c6c6c6 solid;
    background: rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 4;
    -moz-border-radius: 4;
    border-radius: 4;
    resize: vertical;
    min-height: 55px; }
  .form-group .form_error {
    height: 30px; }

/*--------------------------------------------------------------
    Pages
--------------------------------------------------------------*/
.homepage {
  margin-top: -80px; }
  @media only screen and (max-width: 767px) {
    .homepage {
      margin-top: 0px; } }
  .homepage .page-title {
    width: 100%;
    background-image: url("../img/shutterstock_662164717.png");
    repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 850px;
    color: #ffffff; }
    .homepage .page-title .title-text {
      margin: 300px auto;
      font-family: 'Montserrat';
      text-align: center;
      margin-bottom: 0px;
      font-size: 48px;
      font-weight: 700; }
      @media only screen and (max-width: 767px) {
        .homepage .page-title .title-text {
          margin: 170px auto;
          margin-bottom: 20px; } }
    .homepage .page-title .sub-text {
      margin: 10px auto;
      max-width: 910px;
      font-family: 'Playfair Display';
      text-align: center;
      margin-bottom: 0px;
      font-size: 24px;
      font-style: italic; }
    .homepage .page-title .homebtn {
      width: 315px;
      height: 65px;
      display: inline-block;
      padding: 25px;
      font-size: 18px;
      font-family: 'Roboto';
      text-align: center;
      color: #FFFFFF;
      text-transform: uppercase;
      margin: 20px; }
    .homepage .page-title .buttons {
      margin: 20px auto;
      max-width: 910px;
      text-align: center;
      text-decoration: none; }
      .homepage .page-title .buttons .btn-darkblue {
        background-color: #3d60ab;
        text-decoration: none; }
      .homepage .page-title .buttons .btn-lightblue {
        background-color: #61a9d0;
        text-decoration: none; }
  .homepage .description .desc-title {
    text-align: center;
    font-family: Montserrat;
    font-size: 24px;
    font-weight: 600; }
  .homepage .description .desc-list {
    display: flex;
    max-width: 1100px;
    margin: 80px auto;
    margin-bottom: 40px; }
    @media only screen and (max-width: 767px) {
      .homepage .description .desc-list {
        display: block; } }
    .homepage .description .desc-list .list-item {
      width: 25%;
      text-align: center;
      font-size: 18px;
      font-weight: bold; }
      .homepage .description .desc-list .list-item img {
        margin-bottom: 40px; }
      @media only screen and (max-width: 767px) {
        .homepage .description .desc-list .list-item {
          width: 100%;
          margin-bottom: 40px; } }
  .homepage .gri {
    background-image: url("../img/rectangle816.png");
    background-repeat: no-repeat;
    background-position: right top;
    min-height: 820px; }
    .homepage .gri .columns {
      display: flex;
      max-width: 1100px;
      margin: 120px auto;
      margin-bottom: 40px; }
      @media only screen and (max-width: 767px) {
        .homepage .gri .columns {
          display: block; } }
      .homepage .gri .columns .column-left {
        text-align: right; }
        @media only screen and (max-width: 767px) {
          .homepage .gri .columns .column-left {
            background-color: #eff2f7; } }
        .homepage .gri .columns .column-left .column-title {
          font-family: Montserrat;
          font-size: 24px;
          font-weight: 600;
          margin-bottom: 40px;
          margin-right: 20px; }
        .homepage .gri .columns .column-left .list-item {
          padding: 0 20px;
          border-right: 3px solid;
          margin: 20px;
          line-height: 28px;
          font-size: 14px;
          font-family: Roboto; }
          .homepage .gri .columns .column-left .list-item.yellow {
            border-color: #ffcb00; }
          .homepage .gri .columns .column-left .list-item.green {
            border-color: #29d426; }
          .homepage .gri .columns .column-left .list-item.blue {
            border-color: #009ecc; }
          .homepage .gri .columns .column-left .list-item.orange {
            border-color: #ff7f2c; }
      @media only screen and (max-width: 767px) {
        .homepage .gri .columns .column-right {
          background-color: #eff2f7;
          margin-top: -20px;
          padding: 20px; }
          .homepage .gri .columns .column-right img {
            width: 100%; } }

.why {
  margin-top: -101px; }
  .why .page-title {
    width: 100%;
    background-image: url("../img/why.png");
    repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 850px;
    color: #ffffff;
    z-index: 5; }
    @media only screen and (max-width: 767px) {
      .why .page-title {
        height: 450px; } }
  .why .title-text {
    margin: 300px auto;
    font-family: 'Montserrat';
    text-align: center;
    margin-bottom: 0px;
    font-size: 48px;
    font-weight: 700; }
    @media only screen and (max-width: 767px) {
      .why .title-text {
        margin: 210px auto;
        margin-bottom: 20px; } }
  .why .text-container {
    width: 1100px;
    height: 650px;
    color: #000;
    z-index: 1;
    display: flex;
    margin: 0px auto;
    margin-top: -85px; }
    @media only screen and (max-width: 767px) {
      .why .text-container {
        height: auto;
        display: block;
        margin: 0px;
        width: 100%; } }
    .why .text-container .left-content {
      width: calc(100% - 531px); }
      @media only screen and (max-width: 767px) {
        .why .text-container .left-content {
          width: 100%;
          padding: 20px;
          margin-top: -74px; } }
      .why .text-container .left-content .title-text {
        margin: 0;
        font-family: 'Montserrat';
        text-align: right;
        margin-bottom: 0px;
        font-size: 24px;
        font-weight: 700;
        padding-top: 60px; }
        @media only screen and (max-width: 767px) {
          .why .text-container .left-content .title-text {
            text-align: center; } }
      .why .text-container .left-content .paragraf {
        line-height: 27px;
        /* padding-top: 57px; */ }
        .why .text-container .left-content .paragraf p {
          margin-top: 42px; }
        .why .text-container .left-content .paragraf .bold {
          font-weight: bold; }
      .why .text-container .left-content .homebtn {
        width: 315px;
        height: 65px;
        display: inline-block;
        padding: 25px;
        font-size: 18px;
        font-family: 'Roboto';
        text-align: center;
        color: #FFFFFF;
        text-transform: uppercase; }
        @media only screen and (max-width: 767px) {
          .why .text-container .left-content .homebtn {
            margin: 20px; } }
      .why .text-container .left-content .btn-darkblue {
        background-color: #3d60ab;
        text-decoration: none; }
    .why .text-container .bright {
      width: 531px;
      position: relative; }
      @media only screen and (max-width: 767px) {
        .why .text-container .bright {
          width: 100%; }
          .why .text-container .bright img {
            width: 100%; } }
      .why .text-container .bright .mask {
        background: #Fff;
        width: 400px;
        height: 9px;
        top: 0px;
        position: absolute;
        transform: rotate(-3deg);
        left: 170px; }
        @media only screen and (max-width: 767px) {
          .why .text-container .bright .mask {
            display: none; } }

.services {
  margin-top: -80px; }
  .services .page-title {
    width: 100%;
    background-image: url("../img/services.png");
    repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 700px;
    color: #ffffff;
    z-index: 5; }
    @media only screen and (max-width: 767px) {
      .services .page-title {
        height: 450px; } }
  .services .title-text {
    margin: 300px auto;
    font-family: 'Montserrat';
    text-align: center;
    margin-bottom: 0px;
    font-size: 48px;
    font-weight: 700; }
    @media only screen and (max-width: 767px) {
      .services .title-text {
        margin: 210px auto;
        margin-bottom: 20px; } }
  .services .text-container {
    width: 1100px;
    margin: 0 auto; }
    @media only screen and (max-width: 767px) {
      .services .text-container {
        width: 100%; } }
    .services .text-container .left-content .title-text {
      margin: 0px auto;
      font-family: 'Montserrat';
      text-align: center;
      margin-bottom: 30px;
      font-size: 24px;
      font-weight: 700; }
  .services .paragraf {
    padding-bottom: 40px; }
    @media only screen and (max-width: 767px) {
      .services .paragraf {
        padding: 20px; } }
  .services .services-line {
    display: flex;
    margin-bottom: 30px; }
    @media only screen and (max-width: 767px) {
      .services .services-line {
        display: block;
        padding: 20px; } }
    .services .services-line img {
      margin: 0 20px 20px 0;
      min-width: 469px;
      max-width: 469px; }
      @media only screen and (max-width: 767px) {
        .services .services-line img {
          margin: 0;
          width: 100%;
          min-width: 100%;
          max-width: 100%; } }
    .services .services-line .line-description {
      font-family: 'Montserrat';
      font-size: 14px; }
      .services .services-line .line-description .line-title {
        font-weight: 700;
        padding-bottom: 30px;
        font-size: 18px; }
        @media only screen and (max-width: 767px) {
          .services .services-line .line-description .line-title {
            padding-bottom: 20px;
            padding-top: 20px; } }
      .services .services-line .line-description .line-body {
        line-height: 27px; }

.contact {
  margin-top: -380px; }
  @media only screen and (max-width: 767px) {
    .contact {
      margin-top: 30px; } }
  .contact .page-title {
    width: 100%;
    background-image: url("../img/contact.png");
    repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    height: 700px;
    color: #ffffff;
    z-index: 5; }
    @media only screen and (max-width: 767px) {
      .contact .page-title {
        margin-top: -80px;
        height: 450px; } }
  .contact .title-text {
    margin: 460px auto;
    font-family: 'Montserrat';
    text-align: center;
    margin-bottom: 0px;
    font-size: 48px;
    font-weight: 700; }
    @media only screen and (max-width: 767px) {
      .contact .title-text {
        margin: 210px auto;
        margin-bottom: 20px; } }
  .contact .text-container {
    width: 1100px;
    margin: 0 auto;
    display: flex; }
    @media only screen and (max-width: 767px) {
      .contact .text-container {
        width: 100%;
        display: block; } }
    .contact .text-container .left-content {
      width: 66%; }
      @media only screen and (max-width: 767px) {
        .contact .text-container .left-content {
          width: 100%; } }
      .contact .text-container .left-content .title-text {
        margin: 0px auto;
        font-family: 'Montserrat';
        text-align: right;
        margin-bottom: 30px;
        font-size: 24px;
        font-weight: 700;
        padding-right: 60px; }
        @media only screen and (max-width: 767px) {
          .contact .text-container .left-content .title-text {
            text-align: center;
            padding: 0; } }
  .contact .paragraf {
    padding-bottom: 40px;
    line-height: 21px; }
    @media only screen and (max-width: 767px) {
      .contact .paragraf {
        padding: 20px; } }
    .contact .paragraf p {
      font-size: 14px; }
    .contact .paragraf .bold {
      font-weight: bold;
      font-size: 18px; }
  .contact .homebtn {
    width: 315px;
    height: 65px;
    display: inline-block;
    padding: 25px;
    font-size: 18px;
    font-family: 'Roboto';
    text-align: center;
    color: #FFFFFF;
    text-transform: uppercase;
    margin: 0px; }
  .contact .btn-darkblue {
    background-color: #3d60ab;
    text-decoration: none;
    border: 0px;
    border-radius: 4px; }

@media only screen and (max-width: 767px) {
  .contact-form {
    padding-top: 30px; } }
.contact-form h3 {
  max-width: 1100px;
  width: 1100px;
  margin: 0 auto;
  text-transform: uppercase;
  position: relative;
  padding-top: 55px;
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  color: #FFE000;
  font-weight: 300;
  line-height: 18px;
  font-style: normal; }
  @media only screen and (max-width: 767px) {
    .contact-form h3 {
      font-family: "Roboto", sans-serif;
      font-size: 16px;
      color: #000;
      font-weight: 300;
      line-height: 18px;
      font-style: normal;
      width: 100%;
      max-width: 100%;
      padding: 0 25px;
      text-align: right; } }
.contact-form h2 {
  max-width: 1100px;
  width: 1100px;
  margin: 0 auto;
  text-transform: uppercase;
  position: relative;
  font-family: "Roboto", sans-serif;
  font-size: 36px;
  color: #FFF;
  font-weight: 300;
  line-height: 38px;
  font-style: normal; }
  @media only screen and (max-width: 767px) {
    .contact-form h2 {
      font-family: "Roboto", sans-serif;
      font-size: 24px;
      color: #000;
      font-weight: 300;
      line-height: 28px;
      font-style: normal;
      width: 100%;
      max-width: 100%;
      padding: 0 25px;
      text-align: right; } }
.contact-form .inner-section {
  max-width: 1100px;
  width: 1100px;
  margin: 0 auto;
  padding-top: 50px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding-right: calc(1100px * 0.3); }
  @media only screen and (max-width: 767px) {
    .contact-form .inner-section {
      width: 100%;
      max-width: 100%;
      padding: 0px 25px 40px 25px; } }
  .contact-form .inner-section .form-group {
    padding-right: 50px; }
    @media only screen and (max-width: 767px) {
      .contact-form .inner-section .form-group {
        padding-right: 0; } }

.solutions .top {
  height: 450px;
  background-image: url("../img/Group 52-min.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  color: #fff; }
  @media only screen and (max-width: 767px) {
    .solutions .top {
      background-image: url("../img/services_mobile_top-min.png");
      height: 514px; } }
  .solutions .top .title-container {
    width: 1100px;
    margin: 0 auto; }
    @media only screen and (max-width: 767px) {
      .solutions .top .title-container {
        width: 100%; } }
    .solutions .top .title-container .inner-sections {
      margin-left: 50%;
      width: 50%; }
      @media only screen and (max-width: 767px) {
        .solutions .top .title-container .inner-sections {
          margin-left: 0;
          width: 100%; } }
      .solutions .top .title-container .inner-sections .container {
        margin: 0 auto;
        /* width: 70%; */
        padding-top: 139px;
        padding-left: 232px; }
        @media only screen and (max-width: 767px) {
          .solutions .top .title-container .inner-sections .container {
            padding-top: 310px;
            padding-left: 0px; } }
  .solutions .top h2.white {
    color: #fff;
    text-transform: uppercase; }
    @media only screen and (max-width: 767px) {
      .solutions .top h2.white {
        padding-left: 20px; } }
  .solutions .top ul {
    list-style-type: square;
    font-size: 16px;
    font-family: "Roboto"; }
    .solutions .top ul li {
      margin-bottom: 14px; }
      @media only screen and (max-width: 767px) {
        .solutions .top ul li {
          margin-bottom: 6px; } }

.potential {
  width: 730px;
  height: 233px;
  margin: 50px auto;
  border: #000000 6px solid;
  position: relative; }
  @media only screen and (max-width: 767px) {
    .potential {
      width: auto;
      height: auto;
      border: 0px;
      margin-top: 20px; } }
  .potential .hide1 {
    width: 610px;
    height: 235px;
    background: #fff;
    position: absolute;
    left: 60px;
    top: -6px;
    z-index: 1; }
    @media only screen and (max-width: 767px) {
      .potential .hide1 {
        display: none; } }
  .potential .hide2 {
    width: 736px;
    height: 116px;
    background: #fff;
    position: absolute;
    left: -7px;
    top: 60px;
    z-index: 2; }
    @media only screen and (max-width: 767px) {
      .potential .hide2 {
        display: none; } }
  .potential .content {
    z-index: 72;
    position: relative;
    padding: 30px 28px; }
    @media only screen and (max-width: 767px) {
      .potential .content {
        padding: 0; } }
    .potential .content h2 {
      margin-bottom: 40px;
      text-transform: uppercase; }
      @media only screen and (max-width: 767px) {
        .potential .content h2 {
          font-weight: 400;
          padding-left: 0px;
          text-align: center;
          font-size: 26px; } }
    .potential .content p {
      margin-top: 0;
      margin-bottom: 1rem;
      display: inline-block;
      padding: 20px; }
      @media only screen and (max-width: 767px) {
        .potential .content p {
          padding-top: 0px;
          padding-bottom: 0px;
          text-align: justify; } }

.bottom {
  height: 450px;
  background-image: url("../img/Group 53-min.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  color: #fff;
  margin-bottom: 3px; }
  @media only screen and (max-width: 767px) {
    .bottom {
      background-image: url("../img/services_mobile_bottom-min.png");
      height: auto; } }
  .bottom .inner-div {
    width: 1100px;
    margin: 0 auto; }
    @media only screen and (max-width: 767px) {
      .bottom .inner-div {
        width: 100%;
        padding: 20px;
        padding-top: 374px; } }
    .bottom .inner-div .left {
      width: 50%;
      padding-right: 30px;
      color: #000;
      padding-top: 38px; }
      @media only screen and (max-width: 767px) {
        .bottom .inner-div .left {
          width: 100%;
          padding: 0; } }
      .bottom .inner-div .left .title {
        font-weight: 700; }

@media only screen and (max-width: 767px) {
  .about {
    background: #000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2); } }
.about .top {
  position: relative;
  height: 450px;
  min-height: 450px;
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: #4E4EAF; }
  @media only screen and (max-width: 767px) {
    .about .top {
      height: auto;
      min-height: auto;
      -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 92%);
      clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 92%);
      outline: 1px solid transparent; } }
  .about .top .about-bg {
    background-image: url("../img/about.png");
    background-repeat: no-repeat;
    background-position: top left;
    background-size: cover;
    position: absolute;
    height: 100%;
    min-height: 100%;
    width: 50%;
    top: 0;
    right: 0; }
    @media only screen and (max-width: 767px) {
      .about .top .about-bg {
        background-image: url("../img/about-mob-big.png");
        height: 275px;
        width: 100%;
        min-height: 275px;
        background-position: bottom right; } }
  @media only screen and (max-width: 767px) {
    .about .top .inner-section {
      margin-top: 275px;
      height: auto;
      padding-bottom: 60px; } }
.about .inner-section {
  max-width: 1100px;
  width: 1100px;
  margin: 0 auto;
  padding-top: 100px;
  padding-bottom: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 100%; }
  @media only screen and (max-width: 767px) {
    .about .inner-section {
      max-width: 100%;
      width: 100%;
      padding: 20px; } }
  .about .inner-section .content {
    display: flex;
    flex-direction: column; }
    .about .inner-section .content h3 {
      font-family: "Roboto", sans-serif;
      font-size: 24px;
      color: #FFE000;
      font-weight: 400;
      line-height: 30px;
      font-style: normal;
      margin: 0;
      text-transform: uppercase; }
    .about .inner-section .content h2 {
      font-family: "Roboto", sans-serif;
      font-size: 30px;
      color: #FFF;
      font-weight: 200;
      line-height: 36px;
      font-style: normal;
      margin: 0; }
.about .description-container {
  position: relative;
  max-width: 730px;
  margin: 0 auto;
  padding: 30px 60px; }
  @media only screen and (max-width: 767px) {
    .about .description-container {
      padding: 20px 0; } }
  @media only screen and (min-width: 768px) {
    .about .description-container:before {
      content: '';
      position: absolute;
      height: 60px;
      width: 60px;
      border-left: 5px solid #000;
      border-top: 5px solid #000;
      top: 0;
      left: 0; }
    .about .description-container:after {
      content: '';
      position: absolute;
      height: 60px;
      width: 60px;
      top: 0;
      right: 0;
      border-right: 5px solid #000;
      border-top: 5px solid #000; } }
  .about .description-container .content {
    position: relative; }
    @media only screen and (min-width: 768px) {
      .about .description-container .content:after {
        content: '';
        position: absolute;
        height: 60px;
        width: 60px;
        bottom: -30px;
        right: -60px;
        border-right: 5px solid #000;
        border-bottom: 5px solid #000; } }
    .about .description-container .content p {
      font-family: "Roboto", sans-serif;
      font-size: 16px;
      color: #000;
      font-weight: 400;
      line-height: 20px;
      font-style: normal;
      margin-bottom: 30px; }
      @media only screen and (max-width: 767px) {
        .about .description-container .content p {
          font-family: "Roboto", sans-serif;
          font-size: 16px;
          color: #fff;
          font-weight: 400;
          line-height: 20px;
          font-style: normal; } }

/* Angled edges for the background */

/*# sourceMappingURL=main.css.map */