:root {
    /*--- Colors ---*/ 
    --primaryColor: #2c963f;
    --sandboxPrimaryColor: #f18114;
    --primaryLight: #fff;
    --secondaryColor: #c8c7cc;
    --secondaryColor1: #a3a2a7;
    --successColor: #2c963f;
    --successColor1: #257c35;
    --noticeColor: #0074b0;
    --alertColor: #e7202a;
    --alertColor1: #bd1f27;
    --warningColor: #f18114;
    --bodyFontColorLight: #fff;
    --bodyFontColorDark: #222;
    --headerFontColorDark: var(--bodyFontColorDark);
    --headerFontWeight: 300;
    --bodyFontWeightRegular: 400;
    --bodyFontWeightMedium: 600;
    --sideNavWidth: 15rem;
    /*--- Side Nav Colors ---*/
    --sideNavBackgroundColor: #f4f5f7;
    --sideNavBackgroundColorB1: var(--primaryColor);
    --sideNavBackgroundColorB1D: #258637;
    --sideNavBackgroundColorB2: #22723b;
            /* Account */
    --sideNavAccountBackgroundColor: #353a43;
    --sideNavAccountBackgroundColorB1: #2f2f31;
    --sideNavAccountBackgroundColorB2: #1d1e1f;
    /*--- Font Size ---*/
    --baseFontSize: 1rem;
    /*--- Globals ---*/
    --globalRadius: .2rem;
    --notificationBannerpadding: 2.9375rem;
}


::-webkit-scrollbar {height: 3px;width: 6px}
::-webkit-scrollbar-track {background-color: #1B84C7;border-radius: 0px;}
::-webkit-scrollbar-thumb {background-color: #f6f8f9;border-radius: 0px;  }
::-webkit-scrollbar-thumb:hover {background: #f6f8f9;}

h1,
h2,
h3,
h4,
h5,
h6, 
table thead td,
table thead th {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-weight: var(--headerFontWeight);
    color: #222;
    color: var(--headerFontColorDark);
}

table thead td,
table thead th {
    font-weight: 600;
    font-weight: var(--bodyFontWeightMedium);
}

p,
span,
button,
a,
ul li,
ol li,
table tbody th,
table tbody td,
label,
legend,
[type='text'],
[type='password'],
[type='email'],
textarea {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400;
    font-weight: var(--bodyFontWeightRegular);
    color: #222;
    color: var(--bodyFontColorDark);
}

strong, b {
    font-weight: 600;
    font-weight: var(--bodyFontWeightMedium);
}

table thead th,
table tbody td{
  font-size: .92rem;
}

.intro_section{
  /*background-color: #1B84C7;*/
  background-color: #192F59;
  height: 100vh;
}

.intro_section img{
  width:40%;
}

.intro_section .icon{
  width:260px;
  height:260px;
  background:rgba(0,0,0,.3);
  border-radius: 100%;
  padding:4px;
}

.input-wrapper {
    position: relative;
}

.form-control {
    padding-left: 2.2rem !important;
}

.form-control__icon {
    position: absolute;
    bottom: 1.7rem;
    left: 1.55rem;
    pointer-events: none;
    color: #c8c7cc;
    color: var(--secondaryColor);
}

ul{
  margin-left: 0 !important;
    margin-block-start: 0 !important;
    padding-inline-start: .4rem !important;
}

.intro_section .steps li{
  color: #ffffff;
  list-style-type: none;
  margin: .6rem 1rem;
}

.intro_section .steps li:before{
  content: "\f14a";
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    margin-left: -1.3em;
    width: 1.3em;

}

.svg{
  width:10%;
  background-image: url('../img/line.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1002;
  /*position: fixed;*/
}


@media (min-width: 768px){
  /*.col-md-1 {*/
  /*    -ms-flex: 0 0 2% !important;*/
  /*    flex: 0 0 2% !important;*/
  /*}*/
  .col-md-7 {
      -ms-flex: 0 0 60% !important;
      flex: 0 0 60% !important;
      max-width: 60% !important;
  }
  .col-md-4 {
      -ms-flex: 0 0 40% !important;
      flex: 0 0 40% !important;
      max-width: 40% !important;
  }
 /* .intro_section{
    position: fixed;

  }
  .svg{
    width:2%;
    position: fixed;
    left:33.3%;
        top: 0;
    bottom: 0;
  }
  .detail_section{
    position: absolute;
    left:37%;
    bottom: 0;
    top: 0;
    right: 0;
  }*/
  .backbtn {
    position: fixed !important;background-color: #fff;padding:.5rem .3rem !important;z-index: 1001;width:100% !important;top:0 !important;
  }
  .detail_section .back-wrap {
    margin-top:10% !important;
  }
  .profiledetails{
    position: fixed;top:7%;box-shadow: 0 0 16px 1px rgba(0,0,0,.05);z-index:1001;width:100%;background-color: #fff
  }
  .onmedium{
    margin-top:17%
  }
  
}

.backbtn {
   box-shadow: 0 0 16px 1px rgba(0,0,0,.05);
}


.detail_section{
  background-color: #fff;
  height: 100vh;
  overflow-y: auto;
  /*overflow-x: hidden;*/
  margin: auto;
}

table.dataTable th,
table.dataTable td {
  white-space: normal;
}

table.table-bordered.dataTable {
    border-collapse: separate !important;
}

table{
  width:100%;
}

/*input design*/


/*@media (min-width: 767px){*/
    
/*    .form-wrapper, .form-wrapper1{*/
/*      width: 80% !important;*/
/*    }*/
    
/*}*/

.form-wrapper, .form-wrapper1{
      width: 80%;
    }
    
@media (min-width: 1920px){
  .form-wrapper{
    width: 70% !important;
  }
  .form-wrapper2, .form-wrapper1{
    width: 70% !important;
  }
  .back-wrap{
      width:80% !important;
  }
}

@media (max-width: 1920px){=
  .form-wrapper2{
    width: 97% !important;
  }
}

/*@media (min-width: 1200px) and (max-width : 1400px){*/
/*     .form-wrapper, .form-wrapper1{*/
/*      width: 80% !important;*/
/*    }*/
/*    .form-wrapper2{*/
/*      width: 100% !important;*/
/*    }*/
/*}*/

@media (min-width: 992px) and (max-width : 1200px){
    .form-wrapper, .form-wrapper1{
      width: 80% !important;
    }
    .form-wrapper2{
      width: 100% !important;
    }
}


@media (max-width: 767px){
    .form-wrapper, .form-wrapper1, .form-wrapper2{
      width: 100% !important;
    }
  .d-on-md {
      display: none !important;
  }
  .intro_section h3 {
    font-size: 1.15rem !important;
    margin-top: 1.2rem !important;
  }
  .intro_section li{
    margin: .3rem 1rem !important;
  }
  .px-5 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  .intro_section{
    height: auto !important;
  }

  .pdt{
    padding-top:3rem !important;
  }
  legend {
    padding-left: .5rem !important;
   }
   .profile{
    width:100% !important;
   }
   .detail_section .h-100{
    height: 50% !important;
   }
   .profiledetails{
      position: relative;
    }
}



legend {
  max-width: 100%;
  margin-bottom: 0.7rem;
  font-size: 1.5rem;
  padding-bottom: 1rem;
 }


[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'],
textarea, select {
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  height: 2.4375rem;
  margin: 0 0 1rem;
  padding: 0.5rem;
  border: 1px solid #cacaca;
  border-radius: 3px;
  background-color: #fefefe;
  -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
          box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
  font-family: inherit;
  font-size: 1rem;
  font-weight: normal;
  color: #0a0a0a;
  -webkit-transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
  transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
  -o-transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }

.dataTables_filter input, .dataTables_length select, .getdpt select{
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 80% !important;
  height: 1.7375rem;
  margin: 0 0 .5rem;
  padding: 0.5rem;
  border: 1px solid #cacaca;
  border-radius: 3px;
  background-color: #fefefe;
  -webkit-box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
          box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
  font-family: inherit;
  font-size: 1rem;
  font-weight: normal;
  color: #0a0a0a;
  -webkit-transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
  transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
  -o-transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
  transition: box-shadow 0.5s, border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }

  .dataTables_length select{
    width: 20% !important;
  }

  .getdpt select{
    width: 100% !important;
    height: 1.8rem !important;
  }

  .getdpt {
    position: absolute;
    left: 45% !important;
    transform: translate(-50%,-50%);
    margin-top: 1.5% !important;
}

.close:hover{
  background-color: transparent !important;
  border:none !important;
}

.dataTables_length label, .dataTables_filter label {
  display: flex !important;
  /*justify-content:space-around;*/
}
.dataTables_wrapper{
  width:100% !important;
}
.dataTables_paginate.paging_full_numbers .first, .dataTables_paginate.paging_full_numbers .last {
  display: none !important;
}
[type='text']:focus, [type='password']:focus, [type='date']:focus, [type='datetime']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='week']:focus, [type='email']:focus, [type='number']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='url']:focus, [type='color']:focus,
  textarea:focus, select:focus {
    outline: none;
    border: 1px solid #1B84C7;
    background-color: #fefefe;
    -webkit-box-shadow: 0 0 5px #cacaca;
            box-shadow: 0 0 5px #cacaca;
    -webkit-transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    transition: border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s;
    -o-transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out, -webkit-box-shadow 0.5s; }
textarea {
  max-width: 100%; }
textarea[rows] {
    height: auto; }
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #cacaca; }
input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #cacaca; }
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #cacaca; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #cacaca; }
input::-moz-placeholder, textarea::-moz-placeholder {
  color: #cacaca; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #cacaca; }
input::-ms-input-placeholder, textarea::-ms-input-placeholder {
  color: #cacaca; }
input::placeholder,
textarea::placeholder {
  color: #cacaca; }
input:disabled, input[readonly],
textarea:disabled,
textarea[readonly] {
  background-color: #e6e6e6;
  cursor: not-allowed; }
[type='submit'],
[type='button'] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 3px;
  background-color: #3DB166;
  border:1px solid #3DB166;
   }

   [type='submit']:hover,
[type='button']:hover { 
   background-color: #192F59;
   border:1px solid #192F59;
   }
input[type='search'] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
[type='file'],
[type='checkbox'],
[type='radio'] {
  margin: 0 0 1rem; }
[type='checkbox'] + label,
[type='radio'] + label {
  display: inline-block;
  vertical-align: baseline;
  margin-left: 0.5rem;
  margin-right: 1rem;
  margin-bottom: 0; }
[type='checkbox'] + label[for],
  [type='radio'] + label[for] {
    cursor: pointer; }
label > [type='checkbox'],
label > [type='radio'] {
  margin-right: 0.5rem; }
[type='file'] {
  width: 100%; }
label {
  display: block;
  margin: 0;
  font-size: 0.875rem;
  font-weight: normal;
  line-height: 1.8;
  color: #0a0a0a; }

/*modals*/
.modal-header{
  padding:.5rem 1rem !important;
  background-color: #192F59 !important;
}
.summary .col-md-12 span:first-child{
  font-weight: 600;
  margin-right: .5rem;
}

.detail_section a{
  text-decoration: none;
  color: #1B84C7;
}
.form-group{
  margin-bottom: .15rem !important;
}