.wrapper {
    max-width: 860px;
    min-width: 300px;
    margin: 0 auto;
  }
  
  
  section.cn-login-sec {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: calc(100vh - 80px);
    padding: 0 20px;
    flex-grow: 1;
    padding: 20px;
    display: flex !important;
    width:100%;
  }
  
  .cn-row {
    display: flex;
    align-items: center;
    padding: 0 30px;
    width: 100%;
    height: 360px;
    background-color: #f7f7f7;
    box-shadow: 6px 0 15px rgba(0, 0, 0, 0.4);
  }
  
  .col {
    flex: 1;
  }
  
  #col-1 {
    height: 130%;
    background-color: #e78022;
    box-shadow: 4px 0 10px rgba(0, 0, 0, 0.4);
    z-index: 10;
  }
  .cn-login-form{
    padding: 20px;
    width: 100% !important;
  }
  .cn-login-form form{
    width:100% !important;
  }
  .cn-login-form p{
    margin:0px !important;
  }
  #login .cn-heading {
    font-size: 23px !important;
    color: #333 !important;
    line-height: 37px;
    margin-left: 10px;
}
  .cn-login-form .cn-log {
   
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 30px;
    justify-content: center;
  }
  .cn-login-form h3{
    color:#fff !important;
    font-size:30px !important;
    font-weight:500 !important;
    margin-bottom:20px;
  }
  .cn-login-form .cn-log {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  
  .cn-login-form .cn-log a {
    color: #e4e4e4;
    font-weight: 400 !important;
    font-size: 16px;
    /* float: right; */
    /* text-align: right; */
    margin-left: auto;
  }
  .cn-login-form input {
    font-size: 16px;
    /* box-shadow: 0.3rem 0.3rem 10px #a4a4a3; */
  }
  .cn-login-btn{
    padding:10px;
    font-size:16px;
    color:#e78022 !important;
  }
  .cn-login-form input:focus {
    outline: 1px solid transparent;
    transform: scale(1.005);
  }
  
  
  .cn-login-form input[type="email"],
  .cn-login-form input[type="password"] {
    width: 100%;
  }
  
  .cn-login-form input[type="submit"] {
    background-color: #fff;
    align-self: flex-end;
    cursor: pointer;
    transition-duration: 0.1s;
    border: 2px solid black;
    padding: 1px 21px;
  }
  
  input[type="submit"]:active,
  .cn-button-login:active {
    transform: scale(1.03);
  }
  
  .cn-login-form label {
    position: relative;
  }
  
  label span.cn-login-head {
    transition-duration: 0.2s;
  }
  
  label:focus-within span,
  .focus-span {
    transform: translate(0.25rem, -72%) scale(0.8);
    background-color: #fcb900;
  }
  
  label span.cn-login-head {
    font-weight: bold;
    position: absolute;
    left: 4px;
    top: 8px;
    padding: 4px 8px;
  }
  
  .info {
    padding: 10px 10px;
    display: flex;
    /* flex-direction: column; */
    /*align-items: flex-end; */
  }
  
  #sign-up {
    align-items: flex-start;
  }
  
  button.cn-button-login {
    padding: 8px 42px;
    background-color: #fff;
    margin-top: 15px;
    box-shadow: 0.3rem 0.3rem #111827;
    cursor: pointer;
    font-weight: bold;
    border-radius: 3px;
    border: 2px solid #111827;
    transition-duration: 0.1s;
    font-size: 16px;
  }
  
  .display-none {
    display: none;
  }
  
  .display-flex {
    display: flex;
  }
  
  .order {
    order: 1;
  }
  
  @keyframes bounceLeft {
    0% {
      transform: translateX(-400px);
    }
    90% {
      transform: translateX(10px);
    }
    100% {
      transform: translateX(0);
    }
  }
  
  @keyframes bounceRight {
    0% {
      transform: translateX(400px);
    }
    90% {
      transform: translateX(-10px);
    }
    100% {
      transform: translateX(0);
    }
  }
  
  .bounce-left {
    animation: bounceLeft 1s forwards;
  }
  
  .bounce-right {
    animation: bounceRight 1s forwards;
  }
  
  .main-wrapper {
    display: -webkit-flex;
    display: flex;
    overflow: hidden;
  }
  .main-wrapper .page-wrapper.full-page {
    width: 100%;
    margin-left: 0;
  }
  .main-wrapper .page-wrapper {
    min-height: 100vh;
    background: #fff;
    width: calc(100% - 270px);
    margin-left: 270px;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-transition: margin .1s ease, width .1s ease;
    transition: margin .1s ease, width .1s ease;
  }
  .login-screen {
    background-image: radial-gradient(#f1bb89, #f6d3b3, #fae3d1) !important;
  }
  .main-wrapper .page-wrapper .page-content {
    flex-grow: 1;
    padding: 20px;
    display: flex !important;
  }
  .cn-box {
    margin: 0%;
    /* display: flex; */
    width: 70%;
    box-shadow:none !important;
   
  }
  .justify-content-center, .dataTables_wrapper div.dataTables_paginate ul.pagination {
    justify-content: center !important;
  }
  .align-items-center, .navbar .search-form {
    align-items: center !important;
  }
   @media(max-width:767px) {
    span.cn-contineo{
      display:none !important;
    }
    .cn-box {
    width: 100%;
     
  }
  .cn-row {
    display: block;
    height: auto;
     padding: 10px 10px;
  }
  #login .cn-heading {
    font-size: 20px !important;
  }
  
.info {
    padding: 0px 0px;
}
  }