﻿@font-face
{
    font-family: Montserrat;
    src: url("../fonts/Montserrat-Light.ttf");
    src: local("Montserrat"), url(../fonts/Montserrat-Light.ttf) format("truetype");
}

.page-padding {
    padding-left: 120px; 
    padding-right: 120px;
}

.Page-Header {
    background-color: #36467a;
    height: 575px;
}

.Header-1-Text {
    width: 597px;
    font-family: Montserrat;
    font-size: 54px;
    font-weight: 300;
    letter-spacing: 0px;
    color: #ffffff;
}

.Header-Break {
    /*width: 1px;*/
    height: 53px;
    background-color: #6a7481;
    display:inline-block;
}

.Header-2-Text {
    width: 624px;
    /*height: 112px;*/
    font-family: Montserrat;
    font-size: 20px;
    font-weight: 300;
    line-height: 1.4;
    letter-spacing: 0px;
    color: #d4dbe1;
}

.report-type-description {
    /*width: 624px;*/
      /*height: 88px;*/
      font-family: Montserrat;
      font-size: 16px;
      font-weight: 300;
      line-height: 1.38;
      letter-spacing: 0px;
      color: #2c3540;
}

.Bitmap {
    width: 668px;
    /*height: 847px;*/
}

.Continue-to-Portal {
    width: 148px;
    height: 19px;
    font-family: Montserrat;
    font-size: 16px;
    letter-spacing: 0px;
    text-align: center;
    color: #ffffff;
}

.Rectangle {
    width: 212px;
    height: 52px;
    border-radius: 2px;
    background-color: #ff621f;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
    border: solid 1px #e65400;
}

.Logo {
    width: 199px;
    height: 54px;
    object-fit: contain;
    vertical-align:top;
    padding-right: 15px; 
    width: 199px; 
    height: 54px
}

.hse-reporting-title {
    width: 207px;
    height: 20px;
    font-family: Montserrat;
    font-size: 16px;
    line-height: 1.25;
    letter-spacing: 0px;
    color: #ffffff;
    display:inline-block;
    vertical-align:middle;
    padding-bottom: 60px;
    font-weight: bold;
    /*padding-left: 15px;*/
}

.what-to-report {
    /*width: 463px;*/
    height: 44px;
    font-family: Montserrat;
    font-size: 42px;
    font-weight: 500;
    letter-spacing: 0px;
    text-align: center;
    color: #2c3540;
    margin-bottom: 0px; 
    align-content: center
}

.what-to-report-row {
    padding-bottom: 90px; 
    text-align: center
}

.what-to-report-container {
    padding-top: 40px; 
    padding-bottom: 50px
}

.what-to-report-content {
    text-align: left;
}

.line-break {
    height: 1px; 
    background-color: #d4dbe1; 
    margin-top: 100px; 
    margin-bottom: 112px;
}

.accident-type-header {
  /*width: 158.6px;*/
  height: 28px;
  font-family: Montserrat;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0px;
  color: #2c3540;
  font-weight: bold;
  margin-bottom: 40px;
  margin-top: 20px;
}

.why-report-container {
    padding-left: 120px; 
    padding-bottom: 180px;
}

.why-report-title {
  width: 476px;
  /*height: 88px;*/
  font-family: Montserrat;
  font-size: 36px;
  /*font-weight: 300;*/
  font-weight: bold;
  letter-spacing: 0px;
  color: #2c3540;
  margin-bottom: 30px;
}

.why-report-sub-title {
  width: 660px;
  /*height: 130px;*/
  font-family: Montserrat;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.3;
  letter-spacing: 0px;
  color: #2c3540;
  margin-bottom: 20px;
}

.why-report-content {
  width: 660px;
  /*height: 308px;*/
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.38;
  letter-spacing: 0px;
  color: #2c3540;
}

.accident-type-icon {
    width: 126px;
    height: 103px;
}

.report-difference-container {
    /*padding-top: 90px;*/ 
    padding-bottom: 100px;
    background-color: #e6eaf6;
}

.report-difference {
  /*width: 976px;*/
  /*height: 88px;*/
  font-family: Montserrat;
  font-size: 36px;
  font-weight: 300;
  letter-spacing: 0px;
  text-align: center;
  color: #2c3540;
  align-content: center;
  margin-bottom: 50px;
}

.base {
  width: 427px;
  height: 10px;
  background-color: #fd6e39;
}

.report-difference-box {
  width: 427px;
  height: 730px;
  border-radius: 4px;
  background-color: #ffffff;
  box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.08);
}

.report-difference-box-text {
  /*width: 144px;*/
  height: 30px;
  font-family: Montserrat;
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: 0px;
  color: #2c3540;
  font-weight: bold;
}

.report-difference-box-Icon {
    padding-right: 10px;
}

.report-difference-header {
    margin-left: 30px; 
    margin-right: 30px; 
    padding-top: 45px;
}

.report-difference-sub-header {
    margin-top: 30px; 
    margin-left: 30px; 
    margin-right: 30px; 
    width: 367.1px;
    height: 72px;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.33;
    letter-spacing: 0px;
    color: #2c3540;
}

.Mask-List {
    /*width: 348.1px;*/
    margin-left: 30px; 
    margin-right: 30px; 
    margin-top: 30px;
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.63;
    letter-spacing: 0px;
    color: #2c3540;
}

.Mask-List-Bullet {
    color: #fd6e39;
}


.Mask-List-Bullet div {
    color: #2c3540;
}

.report-flow-header {
  font-family: Montserrat;
  font-size: 42px;
  font-weight: 300;
  letter-spacing: 0px;
  text-align: center;
  color: #2c3540;
  margin-top: 100px;
  margin-bottom: 20px;
  align-content: center;
}

.report-flow-sub-header {
  /*width: 892px;
  height: 56px;*/
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0px;
  text-align: center;
  color: #2c3540;
  align-content: center;
}

/*.Mask {
  width: 1600px;
  height: 839px;
  background-color: #2c3540;
}*/

.mobile-window {
    background-color: #2c3540;
}

.mobile-app-header {
  width: 670px;
  height: 52px;
  font-family: Montserrat;
  font-size: 42px;
  font-weight: 300;
  letter-spacing: 0px;
  color: #ffffff;
  margin-top: 100px;
}

.headerLogo {
    margin-top: -255px;
    height: 51%;
}

.continue-to-portal {
    z-index: 1000;
}

.landing-header-image {
    background-image: url('../img/landing/image.png');
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: -160px;
    height: 575px;
    width: 350px;
}

.globe-background {
    background-image: url('../img/landing/image.png');
    background-size: cover;
    width: 400px;
    height: 400px;
    text-align: right;
    float: right;
    margin-right: 600px;
}

.report-stage {
  /*width: 180px;*/
  /*height: 200px;*/
  font-family: Montserrat;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0px;
  text-align: center;
  padding-right: 25px;
  color: #2c3540;
  padding-top: 30px;
}

.mobile-app-sub-header {
  /*width: 660px;
  height: 112px;*/
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0px;
  color: #d4dbe1;
  margin-top: 30px;
}

.mobile-app-features {
  /*width: 660px;*/
  margin-top: 45px;
  height: 28px;
  font-family: Montserrat;
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: 0px;
  color: #d4dbe1;
}

.mobile-app-feature-list {
  width: 499px;
  margin-top: 10px;
  height: 234px;
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.63;
  letter-spacing: 0px;
  color: #ffffff;
  margin-bottom: 100px;
}

.mobile-app-feature-list ul {
    color: #fd6e39;
}

.mobile-app-feature-list ul div {
    color: #ffffff;
}

.hse-contacts-title {
  width: 670px;
  height: 52px;
  font-family: Montserrat;
  font-size: 42px;
  font-weight: 300;
  letter-spacing: 0px;
  color: #2c3540;
}

.hse-contacts-container {
    padding: 110px 120px 100px 120px;
    background-color: #eef1f8;
    /*background-color: yellow;*/
}

.hse-contacts-row {
    padding-bottom: 100px;
}

.hse-contact-image {
    width: 200px; 
    height: 200px; 
    border-radius: 200px
}

.hse-contact-column {
     text-align: center;
}

.hse-contacts a {
  /*width: 154px;*/
  /*height: 28px;*/
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0px;
  color: #2c3540;
  float: right;
  padding-left: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #d4dbe1;
}

.hse-contacts-selected a {
  /*width: 154px;*/
  /*height: 28px;*/
  font-family: Montserrat;
  font-size: 20px;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0px;
  color: #2c3540;
  float: right;
  padding-left: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #fd6e39;
}

.footer-row {
    background-color: #36467a;
}

.footer-content {
    text-align: center;
    align-content: center;
    border: 1px solid #000;
    padding-top: 60px;
    padding-bottom: 60px;
    border-right: 1px solid #6a7481;
}

.footer-img-container {
    text-align: center;
    align-content: center;
    height: 65px;
}

.footer-header {
    /*padding-left: 300px;*/
    font-family: Montserrat;
    font-size: 26px;
    font-weight: bold;
    letter-spacing: 0px;
    color: #ffffff;
    text-align: center;
}

.footer-text {
    /*width: 467.9px;*/
    height: 48px;
    font-family: Montserrat;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.33;
    letter-spacing: 0px;
    text-align: center;
    color: #d2dbe2;
    padding-top: 10px;
}

.footer-link{
    padding-top: 30px;
}

.footer-link img {
    padding-left: 5px;
}

.footer-link a {
    height: 18px;
    font-family: Montserrat;
    font-size: 14px;
    letter-spacing: 0px;
    color: #ff621f;
}

.footer-navigation {
    border-top: solid 1px #6a7481;
}

.footer-navigation-text-row {
    padding-left: 120px; 
    padding-right: 120px;
    margin-top: 32px;
    padding-bottom: 40px;
}

.footer-navigation-text {
    height: 18px;
    font-family: Montserrat;
    font-size: 14px;
    letter-spacing: 0px;
    color: #ffffff;
}

.footer-navigation-links a {
    height: 18px;
    font-family: Montserrat;
    font-size: 14px;
    letter-spacing: 0px;
    color: #ffffff;
    float: right;
    padding-left: 40px;
}

.hse-contact-name {
    /*width: 150px;*/
    /*height: 30px;*/
    font-family: Montserrat;
    font-size: 26px;
    line-height: 1.15;
    letter-spacing: 0px;
    text-align: center;
    color: #2c3540;
    padding-top: 50px;
    font-weight: bold;
    margin-bottom: 5px;
}

.hse-contact-email a {
    /*width: 150px;*/
    /*height: 30px;*/
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 300;

    line-height: 1.38;
    letter-spacing: 0px;
    text-align: center;
    color: #2c3540;
    margin-bottom: 60px;
}

.hse-contact-title {
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 300;

    line-height: 1.38;
    letter-spacing: 0px;
    text-align: center;
    color: #2c3540;
    margin-bottom: 5px;
}


.divider {
    border-right: solid 1.1px #6a7481;
}

.report-flow {
    padding-left: 120px; 
    padding-right: 120px; 
    padding-top: 50px; 
    padding-bottom: 50px; 
}

.oval-cotainer {
    padding-right: 120px;
}

.oval {
    width: 470px;
    height: 470px;
    border-radius: 470px;
    background-color: #fd6e39;
    border: double 1px #eef1f8;
    padding-top: 20px;
}

.oval-text {
    height: 204px;
    font-family: Montserrat;
    font-size: 26px;
    font-weight: 300;
    line-height: 1.31;
    letter-spacing: 0px;
    text-align: center;
    color: #ffffff;
    padding-top: 50px;
    /*padding-left: 10px;*/
}

.oval-text img {
    width: 70px;
    padding-bottom: 20px;
}

.hse-head-container {
    padding-top: 50px; 
    padding-left: 70px;
}

.hse-head-Img {
    /*background-image: url('images/mysteryman.png');*/
    width: 72px;
    height: 72px;
    border-radius: 72px;
}

.hse-head-Img-Container {
    float:left; 
    padding-right: 10px;
}

.hse-head-Title {
    /*width: 209px;*/
    height: 30px;
    font-family: Montserrat;
    font-size: 26px;
    line-height: 1.15;
    letter-spacing: 0px;
    color: #2c3540;
    font-weight: bold;
}

.hse-head-Job {
    /*width: 154px;*/
    height: 22px;
    font-family: Montserrat;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.38;
    letter-spacing: 0px;
    color: #6c7480;
}

.page-header-row {
    padding-top: 40px;
    padding-left: 120px;
}

.page-header-column {
    display:inline-block;
    vertical-align:top;
}

.page-header-column-right {
    float: right;
}

.report-status-row {
    display: table;
    /*width: 100%; /*Optional*/*/
    table-layout: fixed; /*Optional*/
}

.report-status-column
{
    display: table-cell;
}

.report-status-width {
    width: 180px;
}

.report-status-arrow-width {
    width: 40px;
}

.report-status-arrow {
    background: url('../img/landing/icon-arror-grey-orange.png') no-repeat center center; 
    margin-right: 0px;
}

.report-status-border {
    height: 180px; 
    /*border: solid 2px #d4dbe1;*/
    /*border-radius: 180px;*/
    margin-right: 0px;
}

.report-status-1 {
    background: url('../img/landing/submit-report.png') no-repeat center center; 
    background-size: 180px;
}

.report-status-2 {
    background: url('../img/landing/In-Validation.png') no-repeat center center; 
    background-size: 180px 180px;
}

.report-status-3 {
    background: url('../img/landing/In-Analysis.png') no-repeat center center; 
    background-size: 180px 180px;
}

.report-status-4 {
    background: url('../img/landing/Review-Closed.png') no-repeat center center; 
    background-size: 180px 180px;
}

.report-status-5 {
    background: url('../img/landing/Submit-Report.png') no-repeat center center; 
    background-size: 180px 180px;
}

.report-status-6 {
    background: url('../img/landing/Close-Report.png') no-repeat center center;
    background-size: 180px 180px;
}

.mobile-app-row {
    background-color: #36467a;
    /*margin-top: 900px;
    padding-right: 120px; */
    padding-left: 120px;
    /*padding-bottom: 80px;*/
}

