@charset "UTF-8";
/*------------------------------------------------------------------
[Master Stylesheet for HRMv9 Login Portal]
-------------------------------------------------------------------*/

/****************************/
/** Reset **/
/****************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym, address, big, cite, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

em, cite {
  font-style: italic; }

strong {
  font-weight: bold; }

body {
  color: #5e7d8a;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  line-height: 1.5;
  background: #acb0b1;
  overflow-x: hidden; }



a:hover, a:active {
  outline: 0; }

ul {
  list-style: none; }

a {
  text-decoration: none;
  color: #00acf0;
  -webkit-transition: color 0.2s ease;
  -moz-transition: color 0.2s ease;
  transition: color 0.2s ease; }
  a:hover {
    text-decoration: none;
    color: #00acf0; }
  a:focus {
    text-decoration: none;
    outline: none;
    color: #00acf0; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  color: #324148;
  font-family: inherit;
  font-weight: 500;
  line-height: 1.2; }

.h1, h1 {
  font-size: 2.5rem; }

.h2, h2 {
  font-size: 2rem; }

.h3, h3 {
  font-size: 1.75rem; }

.h4, h4 {
  font-size: 1.5rem; }

.h5, h5 {
  font-size: 1.25rem; }

.h6, h6 {
  font-size: 1rem; }

@media (max-width: 576px) {
  .h1, h1 {
    font-size: 2.2rem; } }







.pa-0 {
	padding:0 !important;}
.pt-100 {
  padding-top: 100px !important; }
.pb-50 {
  padding-bottom: 50px !important; }
.py-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important; }




.mt-15 {
  margin-top: 15px !important; }

.mb-10 {
  margin-bottom: 10px !important; }

.mb-20 {
  margin-bottom: 20px !important; }

.mb-30 {
  margin-bottom: 30px !important; }


.bg-trans-dark-50 {
  background: rgba(26, 34, 37, 0.5); }



.overlay-wrap {
  position: relative; }
  .overlay-wrap .bg-overlay {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 1; }


.text-white {
  color: #fff !important; }


.font-14 {
  font-size: 14px !important; }


@media (min-width: 576px) {
  .w-sm-90 {
    width: 90% !important; }

  }

@media (min-width: 1200px) {
  .w-xl-75 {
    width: 75% !important; }

 }
@media (min-width: 1400px) {
   .w-xxl-55 {
    width: 55% !important; }

  .w-xxl-75 {
    width: 75% !important; }

  }



.display-3 {
  font-size: 3.5rem; }

.display-4 {
  font-size: 2.5rem; }



@media (max-width: 576px) {
 
  .display-3 {
    font-size: 2.75rem; }

  .display-4 {
    font-size: 2.25rem; } }

.btn {
  text-transform: capitalize;
  outline: none;
  border-width: 2px; }
  .btn:focus, .btn:active, .btn:hover {
    box-shadow: none !important; }


.btn-primary{
  color: #fff;
  background-color: #00acf0;
  border-color: #00acf0; }
  .btn-primary:hover, .btn-primary:focus{
    color: #fff;
    background-color: #00a0df;
    border-color: #00a0df; }
 

.hk-wrapper {
  background: #f4f6f7;
  position: relative; }

.hk-pg-wrapper {
  background: #f5f5f6;
  padding: 57px 0 60px;
  position: relative; }
  .hk-pg-wrapper .hk-pg-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 25px; }
   
     



  .form-control::-webkit-input-placeholder, .dd-handle::-webkit-input-placeholder {
    color: #c1c6c8; }
  .form-control:-moz-placeholder, .dd-handle:-moz-placeholder {
    color: #c1c6c8; }
  .form-control::-moz-placeholder, .dd-handle::-moz-placeholder {
    color: #c1c6c8; }
  .form-control:-ms-input-placeholder, .dd-handle:-ms-input-placeholder {
    color: #c1c6c8; }



.form-control-sm,
.custom-select-sm {
  font-size: 0.875rem;
  padding: .25rem .5rem;
  height: calc(1.8125rem + 4px); }



/*Inut group*/


.input-group-append {
  margin-left: -2px; }



.input-group-text {
  border-color: #eaecec;
  background-color: #f5f5f6;
  border-width: 2px; }

label {
    /*margin-bottom: 10px;*/
    color: #324148;
}






/*Images*/
.img-thumbnail {
  border-color: #eaecec;
  border-radius: 0; }

.img-background {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center; }


.owl-carousel .owl-dots .owl-dot span {
  width: 8px;
  height: 8px;
  margin: 0 5px;
  background: rgba(193, 198, 200, 0.5); }
.owl-carousel .owl-dots .owl-dot:focus {
  outline: none; }
.owl-carousel .owl-dots .owl-dot:hover span {
  background: #c1c6c8; }
.owl-carousel .owl-dots .owl-dot.active span {
  background: #c1c6c8; }

.owl-carousel.dots-on-item .owl-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px; }

@media (max-width: 991px) {
  .carousel-control-next-icon, .carousel-control-prev-icon {
    height: 30px;
    width: 30px;
    font-size: 17px; } }





/*Auth pages*/
.hk-pg-wrapper.hk-auth-wrapper {
  padding: 0;
  background: #f4f6f7; }
  .hk-pg-wrapper.hk-auth-wrapper > header {
    position: absolute;
    top: 0;
    z-index: 10;
    width: 100%;
    padding: 20px; }
  .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: 100vh;
    width: 100%; }
    .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img .auth-cover-info {
      position: relative;
      z-index: 2;
      padding: 15px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      height: 100%; }
      .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img .auth-cover-info .auth-cover-content {
        margin: 0 auto; }
        .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img .auth-cover-info .auth-cover-content .play-wrap {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          color: #fff;
          margin-top: 30px; }
          .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img .auth-cover-info .auth-cover-content .play-wrap .play-btn {
            background: rgba(255, 255, 255, 0.3);
            height: 45px;
            width: 45px;
            border-radius: 50%;
            top: auto;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            justify-content: center;
            -webkit-justify-content: center;
            -ms-flex-pack: center;
            color: #fff;
            margin-right: 10px; }
            .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img .auth-cover-info .auth-cover-content .play-wrap .play-btn:before {
              display: inline-block;
              font-family: "Ionicons";
              padding-left: 3px;
              speak: none;
              font-style: normal;
              font-weight: normal;
              font-variant: normal;
              text-transform: none;
              text-rendering: auto;
              line-height: 1;
              -webkit-font-smoothing: antialiased;
              -moz-osx-font-smoothing: grayscale;
              content: "\f488"; }
          .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img .auth-cover-info .auth-cover-content .play-wrap > span {
            font-size: 14px;
            color: #fff; }
  .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap {
    padding: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100vh; }
    .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap .auth-form {
      margin: 0 auto; }
      .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap .auth-form .option-sep {
        position: relative;
        text-align: center;
        overflow: hidden;
        font-size: 14px;
        margin: 30px 0;
        text-transform: uppercase; }
        .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap .auth-form .option-sep:before {
          background: #d6d9da;
          content: "";
          height: 1px;
          right: 50%;
          margin-right: 28px;
          position: absolute;
          top: 50%;
          width: 100%; }
        .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap .auth-form .option-sep:after {
          background: #d6d9da;
          content: "";
          height: 1px;
          left: 50%;
          margin-left: 28px;
          position: absolute;
          top: 50%;
          width: 100%; }
      
      .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap .auth-form .form-group .input-group-append {
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 10;
        pointer-events: none; }
        .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap .auth-form .form-group .input-group-append .input-group-text {
          background: transparent;
          border: none; }
          

@media (max-width: 1199px) {
  .hk-pg-wrapper.hk-auth-wrapper .auth-cover-img {
    height: auto; }
  .hk-pg-wrapper.hk-auth-wrapper .auth-form-wrap {
    height: auto; } }

.countryName {text-align: right !important}
.countryName label {padding: 3px;font-size: 11px;}


/****************************/
/** Login Backgroud Issue **/
/****************************/
.bkImg {
    background: rgb(47,47,47);
    background: linear-gradient(90deg, rgba(47,47,47,1) 0%, rgba(244,246,247,1) 100%);
}