@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
*{
    margin:0;
    padding:0;
    font-family: "Poppins", sans-serif;
    outline:none !important;
}
:root{
  --primary-color:#000;
  --primary-color-hover:#111;
}
  html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    font-family: "Poppins", sans-serif;
  }
  html{
    width: 100%;
  }
  body, html {
    line-height: 130%;
    color: #333;
    font-size: 14px;
  }
  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, center {
    display: block;
  }
  nav ul, ul {
    list-style-type: none;
    list-style: none;
  }
  blockquote, q {
    quotes: none;
  }
  blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
  }
  a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
  }
  ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none;
  }
  mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold;
  }
  hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
  }
  button {
    vertical-align: middle;
  }
  .w-200{width:200px;}#save, .upload-sec h3.cover-text, .up-options, .hidden{display:none;}.bg-lgiht2{background:#CCC;}.autoscroll{height:calc(100vh - 156px);}.border-light{border-color:#999 !important;}.line-height-130{line-height: 130%;}.line-height-150{line-height: 150%;}.transition{transition: all 0.5s !important;}.bg-none{background:none !important;}.opacity-90{opacity:0.9;}.bg-light{background:#f4f4f4 !important;}
  .btn-primary-custom{
    background-color:var(--primary-color);
    color:#FFF;
  }
  .btn-primary-custom:hover, .btn-primary-custom:active, .btn-primary-custom:focus{
    background-color:var(--primary-color-hover);
    color:#FFF;
  }
  .bg-primary-custom{
    background:var(--primary-color);
  }
  .text-primary-custom{
    color:var(--primary-color);
  }
  .edit-btn{
    width:45px;
    height:45px;
    padding-top: 5px;
  }
  
  .edit-btn.sm{
    width:38px;
    height:38px;
    padding-top: 5px;
  }
  
  /***************************** Default CSS Ends Here *****************************/

  .profile-pic{
    margin-top:-75px;
    width:150px;
  }
  #nav-tab .active{
    border-color:#0e81fe !important;
  }
  .detail-icon{
    margin-top:-30px;
  }
  .drag{
    opacity: 0;
  }
  .menus li i{
    width:22px;
  }
  .menu{
    width:35px;
    height: 35px;
    line-height: 38px;
    margin: 10px;
  }
  .settings label{
    font-size:11px;
    background:#ececec;
    border:1px solid #ececec;
    color:#333;
    padding:5px 8px;
    width: 100%;
  }
  .settings label:hover, .settings label:focus, .settings .btn-check:checked+.btn, .settings .btn-check+.btn:hover{
    background:#27bf6b;
    border:1px solid #27bf6b;
    color:#FFF;
  }
  .contact-list h3{
    width:60px;
    height:60px;
    line-height: 60px;
  }
  .contact-list small{
    font-size:11px;
  }
  header.z-1{
    z-index: 10 !important;
  }
  .image-resize img{
    max-width: 100%;
  }
  .new-menu ul{
    bottom:-85px;
  }
  .tabs .nav-fill .nav-item .nav-link{
    color:#333;
  }
  .tabs .nav-pills .nav-link.active, .tabs .nav-pills .show>.nav-link{
    color:#333;
    background: none;
    border:1px solid #0e81fe;
  }
  .same-field{
    flex: 1 0 auto;
    max-width: calc(15% - 5px); 
    height: 0; 
    min-height: 0;
    padding-bottom: calc(7.5% - 3px); 
    padding-top: calc(7.5% - 3px); 
    text-align: center;
    line-height:100%;
  }
  .same-field2{
    flex: 1 0 auto;
    max-width: calc(12% - 5px); 
    height: 0; 
    min-height: 0;
    padding-bottom: calc(6% - 4px); 
    padding-top: calc(6% - 4px); 
    text-align: center;
    line-height:100%;
  }
  .placeholder{
    animation: effect 2s ease infinite;
  }
  @keyframes effect {
    0% {
      background:#CCC;
    }
    50% {
      background:#999;
    }
    100% {
      background:#CCC;
    }
  }
  .scan-overlay{
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
    visibility: hidden;
  }
  .camera{
    height:300px;
  }