@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700;800;900&display=swap');
.form-group{margin-bottom: 20px;}

body {padding: 0;margin: 0;font-family: 'Rubik', sans-serif;font-size: 17px;line-height: 29px;color: #808396;position: relative;text-rendering: optimizeLegibility !important;-webkit-font-smoothing: antialiased !important;-moz-osx-font-smoothing: grayscale;min-height: 100%;}
html{padding: 0;margin: 0;height: 100%;}
h1, h2, h3, h4, h5, h6, p, ul { padding: 0; margin: 0; }
h1, h2, h3, h4{font-family: 'Rubik', sans-serif;}
li {list-style: none;}
img {border: 0;max-width: 100%;object-fit: cover;object-position: center center;}

:hover, :focus, *:active {
    -webkit-transition: all ease-out 0.3s;
    -moz-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
}

*:focus {
    box-shadow: none !important;
}

a {
    outline: none !important;
    text-decoration: none;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    color: #0f0e3d;
}

a:hover, a:focus, a:active { text-decoration: none;}
a, input, button, textarea, a:focus, select:focus { outline: none; }
a:hover, a:focus, select:focus, button:focus { outline: none; text-decoration: none; }

button, input, textarea {outline: none;-webkit-appearance: none;-moz-appearance: none;-moz-box-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;}
::-webkit-input-placeholder{color:#808396;}
::-moz-placeholder {color:#808396;}
::-ms-placeholder {color:#808396;}
::placeholder {color:#808396;}

  

input,.form-control{border: 1px solid;background: transparent;color: #fff;padding: 12px 15px;line-height: 1.3;}
input:focus,.form-control:focus{background: transparent;color: #fff;}
.auth-pages{display: flex;min-height: 100vh;}
.auth-pages h1{color: #fff;font-size: 32px;font-weight: bold;margin-bottom: 15px;}
.auth-pages p{margin-bottom: 35px;}
.auth-right{padding: 65px 95px;min-height: 100vh;display: flex;flex-direction: column;justify-content: center;}
.auth-left{min-width: 30%;background: #14253D;padding: 85px 50px;position: relative;display: flex;flex-direction: column;}
.auth-left::after{content: "";background: url(../images/auth-shape.svg) no-repeat;position: absolute;left: 0;bottom: 0;width: 100%;height: 200px;}
.auth-pages .form{max-width: 670px;}
.auth-left .logo{text-align: center;display: block;}
a{transition: 0.3s ease-in-out;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;}
.auth-left-content{text-align: center;flex: 1;align-items: center;justify-content: center;display: flex;flex-direction: column;}
.auth-left-content h3{color: #fff;font-size: 44px;font-weight: 500;}
.auth-left-content p{max-width: 300px;margin: 0 auto;font-size: 16px;font-weight: 400;}

/* custom checkbox */
.custom-checkbox input {padding: 0;height: initial;width: initial;margin-bottom: 0;display: none;cursor: pointer;}
.custom-checkbox label{position: relative;padding-left: 25px;font-size: 12px;font-weight: 500;line-height: 1.6;margin-bottom:0}
.custom-checkbox label:before {content:'';-webkit-appearance: none;margin-top: 4px;left: 0;background-color: transparent;border: 1px solid;padding: 7px;display: inline-block;position: absolute;vertical-align: middle;cursor: pointer;border-radius: 2px;margin-right: 10px;}
.custom-checkbox input:checked + label:after {content: '';position: absolute;top: 5px;left: 6px;width: 5px;height: 10px;border: solid #fff;border-width: 0 2px 2px 0;transform: rotate(45deg);}

/* custom radio */
.custom-radio{display: inline-block;}
.custom-radio:not(:last-child){margin-right: 30px;}
.custom-radio [type="radio"]:checked,
.custom-radio [type="radio"]:not(:checked) {position: absolute;left: -9999px;}
.custom-radio [type="radio"]:checked + label,
.custom-radio [type="radio"]:not(:checked) + label{position: relative;padding-left: 20px;cursor: pointer;line-height: 20px;display: inline-block;color: #666;}
.custom-radio [type="radio"]:checked + label:before,
.custom-radio [type="radio"]:not(:checked) + label:before {content: '';position: absolute;left: 0;top: 4px;width: 13px;height: 13px;border: 1px solid;border-radius: 100%;}
.custom-radio [type="radio"]:checked + label:after,
.custom-radio [type="radio"]:not(:checked) + label:after {content: '';width: 5px;height: 5px;position: absolute;top: 8px;left: 4px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}

.gender-label{margin-right: 30px;}

.form .custom-checkbox{max-width: 470px;}

.custom-btn{padding: 14px 35px;border-radius: 6px;border: none;color: #fff;font-size: 16px;font-weight: bold;cursor: pointer;min-width: 143px;transition: 0.3s ease-in-out;-webkit-transition: 0.3s ease-in-out;-moz-transition: 0.3s ease-in-out;}
.auth-link{border-top: 1px solid #424242;padding-top: 27px;margin-top: 6px;color: #fff;}
.check-auth a{font-style: italic;}
.auth-pages h1 .logo-right{width: 140px;}

a, a:hover{
    text-decoration: none;
}

li {
    list-style: none;
}



/* Login form css */

.login-form{max-width: 690px; margin: 0 auto; background: #fff;box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2); border-radius: 6px; padding:35px 60px; text-align: center;}
.login-form h2{color: #1C2745; font-size: 26px; font-weight: 500;}
.login-form form input{ border: 1px solid #D0D0DA; min-width: 100%; display: block; line-height: normal; border-radius: 6px; color: #14253D; font-size: 14px;background: #F8F8FB}
.login-form form{margin-top: 50px;}
.login-page .input-block {margin: 0 auto 20px;}
.common-btn, table.customers tfoot .common-btn{font-size: 16px;background: #6c5dd3;border-radius: 6px;border: none;color: #F1FAEE;padding:10px 12px;text-align: center;cursor: pointer;min-width: 170px;font-weight: 500;border: 2px solid #6c5dd3;}
.common-btn:hover, table.customers tfoot .common-btn:hover{background: transparent;border-color: #6c5dd3;color: #6c5dd3;}
.view-event.text-center{padding-top: 30px;}
.black-bg{background: #f3f6fe;min-height: 100vh;display: flex;justify-content: center;align-items: center;}
.user-detail-dd img{margin: 0 auto 50px;display: table;max-width: 200px;}

header {background: #6c5dd3;position: absolute;width: 100%;top: 0;left: 0;}
.nav-sec{background: #6c5dd3;padding: 25px 0px;justify-content: space-between;align-items: center;display: flex;}
.nav-sec img{max-width: 170px;}
.nav-sec a.logout{color: #fff;font-size: 14px;font-weight: 600;}
.nav-sec a.logout img{margin-left: 12px;}
section.onboard {padding-top: 90px;}
.detail-side-bar{padding: 0 25px 30px;}
.customers {border-collapse: collapse;width: 100%;border: 1px solid #D0D0DA;padding: 30px 0;min-width: 1000px;}
.customers td, .customers th {border: none;border-bottom: 1px solid #D0D0DA;padding: 15px 10px;text-align: center;}
.customers th span {width: 100%;display: block;font-size: 12px;}
.client-table {overflow-x: auto;}
.customers th {font-size: 14px;font-weight: 500;padding-top: 12px;padding-bottom: 12px;text-align: center;background: rgba(0, 0, 0, 0.1);color: #14253D;}
.cl-sel-sec{display: flex;align-items: center;justify-content: space-between;}
select.form-control {
height: auto!important;
border: 1px solid #D0D0DA;
border-radius: 6px;
font-weight: 400;
font-size: 14px;
line-height: 24px;
color: #808396!important;
padding: 8px 16px;
max-width: 200px;margin-right: 15px;
}
button.common-border-btn {cursor: pointer;
font-weight: 500;
font-size: 14px;
line-height: 24px;
color: #6c5dd3;
background: transparent;
border: 2px solid #6c5dd3;
border-radius: 6px;
padding: 8px 12px;
text-align: center;
min-width: 140px;
}
button.common-border-btn:hover{background: #6c5dd3;color: #fff;}
button.common-border-btn:hover .icon-download:before{color: #fff;}
.cl-head {
padding: 30px 0;
}

table.customers .common-btn {border: none;
min-width: inherit;padding: 0;margin: 0 5px;
font-size: 16px;background: transparent;color: #14253D;
}

.customers tfoot td{text-align: right;}
.cl-sel-sec label {font-size: 14px;font-weight: 500;}
.cl-sel-sec.search-sec{flex-wrap: wrap;}
.cl-sel-sec.search-sec .form-group{flex: 0 0 22%;max-width: 22%;}
.cl-sel-sec.search-sec .form-group.w-100 {
flex: 0 0 100%;
max-width: 100%;
text-align: center;
margin-top: 20px;
}

.combo-select {
position: relative;
border:1px solid #D0D0DA;
max-width: 400px;border-radius: 6px;line-height: 24px;
font-size: 14px;color: #14253D;
}
.combo-select .combo-input {
margin-bottom: 0;color: #14253D;
}
/**
* Input field
*/
.combo-input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0;
text-overflow: ellipsis;
white-space: nowrap;
border: none;
width: 100%;
box-sizing: border-box;
padding: 0;
height: 40px;
line-height: 40px;
padding-right: 34px;
border-radius: 0px;padding-left: 10px;
}
.combo-input:focus {
outline: none;
}
/**
* Arrow
*/
.combo-arrow {
position: absolute;
right: 0;
top: 0;
height: 100%;
cursor: pointer;
text-align: center;
font-size: 22px;
width: 40px;
color: #14253D;
}
.combo-arrow:before {
content: "\f107";
font-family: 'FontAwesome';
font-size: 18px;
top: -25px;
display: block;
width: 0;
height: 0;
right: 25px;
bottom: 0;
position: absolute;
margin: auto 0;
}
/**
* When opened
*/
.combo-open .combo-arrow {
border-color: #14253D;
}
.combo-open .combo-arrow:before {
content: "\f106";
}
/**
* When focused
*/
.combo-focus {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
border-color: #14253D; 
}
.combo-focus input {
border-color: #14253D;
}
/**
* Hide native select
*/
.combo-select select {
position: absolute;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-appearance: none;
opacity: 0;
}

@media only screen and (min-width: 960px) {
.combo-select select {
left: -1px;
top: -1px;
width: 0;
height: 0;
margin: 0;
}
}
/**
* Selected option
*/
.option-selected {
background-color: #eee;
}
/**
* Hovered option
*/
.option-hover {
background-color: #dfdfdf;
color: #454545;
}
/**
* Option item
*/
.option-item {
cursor: pointer;
/*border-bottom: 1px #e3e3e3 solid;*/ }
.option-item:hover {
background-color: #efefef;
color: #454545;
}
.option-item:last-child {
border-bottom: none;
}

.option-disabled {
opacity: 0.5;
}
/**
* Dropdown
*/
.combo-dropdown {
position: absolute;
z-index: 999;
top: 100%;
left: 0;
min-width: 100%;
max-width: 300px;
max-height: 270px;
margin: 0;
padding: 0;
opacity: 0;
visibility: hidden;
/*display: none;*/
overflow-y: auto;
background: #fff;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 6px rgba(0, 0, 0, 0.12);
-webkit-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
border-radius: 0;
box-sizing: border-box;
-webkit-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
}
.combo-dropdown li {
list-style: none;
padding: 10px 15px;
margin: 0 !important;
}
/**
* On Active
*/
.combo-open .combo-dropdown {
/*display: block; */
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
visibility: visible;
}
/**
* Search marker
*/
.combo-marker {
text-decoration: underline;
}

.modal .form-control {
  border: 1px solid #D0D0DA;
}
.modal .form-group{margin-bottom: 15px;}
.modal .form-group label {
  font-size: 14px;
  margin-bottom: 5px;
  line-height: normal;
  font-weight: 500;
}
.modal .form-control {
  border: 1px solid #D0D0DA;
  font-size: 14px;
  padding: 12px 12px;color: #14253D;
}
.modal-body {
  padding: 30px 25px 0;
}
.modal .modal-footer{padding-bottom: 30px;}
.modal .modal-header {
  padding: 0;
}

.modal .modal-header button.close {
  position: absolute;
  background: #6c5dd3;
  opacity: 1;
  color: #fff;
  font-weight: normal;
  border-radius: 100%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 0;
}

nav.pagination {
  justify-content: flex-end;
  padding-top: 25px;
}
.page-link,.page-link:hover{color: #14253D;}
.form-control, .form-control:focus {
  border: 1px solid #D0D0DA;
  font-size: 14px;
  padding: 12px 12px;
  color: #1c2745;
}
.form-group label {
  font-size: 14px;
  margin-bottom: 5px;
  line-height: normal;
  font-weight: 500;
}
.login-form form input {
  border: 1px solid #D0D0DA;
  min-width: 100%;
  display: block;
  line-height: normal;
  border-radius: 6px;
  color: #14253D;
  font-size: 14px;
  background: #F8F8FB;
}
.customers {
  border-collapse: collapse;
  width: 100%;
  border: 1px solid #e9f0ff;
  padding: 30px 0;
  min-width: 1000px;
  color: #808396;
}
.customers td, .customers th {
  border: none;
  border: 1px solid #e9f0ff;
  padding: 15px 10px;
}
.customers th {
  font-size: 12px;
  font-weight: 500;
  padding-top: 12px;
  padding-bottom: 12px;
  background: #e9f0ff;
  color: #1d2943;
}
table.customers .common-btn{color: #808396;}
.dashboard-table .customers td, .dashboard-table .customers th {
  font-size: 14px;
  border: 1px solid #e9f0ff;
}

button.btn.btn-info {
  background: #6c5dd3;
  border-color: #6c5dd3;
  padding: 9px 13px;
  border-radius: 0 0.25rem 0.25rem 0;
}
nav.pagination {
  justify-content: flex-end;
  padding-top: 25px;
}
.page-link{border: 1px solid #e9f0ff;font-size: 12px;
  font-weight: 500;
  padding: 10px 15px;
  color: #1d2943;}
.page-link:hover {
  color: #fff;background-color: #6c5dd3;border-color: #6c5dd3;
}
.page-item.active .page-link{background-color: #6c5dd3;
  border-color: #6c5dd3;}

  .pagination-dynamic {
    margin-left: auto;
    display: flex;
    justify-content: flex-end;
    padding-top: 25px;
}
.pagination-dynamic svg{width: 22px;position: relative;}
.pagination-dynamic nav {
  display: flex;
  align-items: center;
}
.pagination-dynamic div.hidden {
  display: flex;
  align-items: center;
}
.pagination-dynamic div p {
  font-family: 'Rubik', sans-serif;
  font-size: 17px;
  line-height: 29px;
  color: #808396;
  white-space: nowrap;
  display: flex;
  padding: 0 20px;
}
.pagination-dynamic div p span.font-medium {
  padding: 0 5px;
}
.flex {
  display: flex;
  justify-content: space-between;
}
.relative.inline-flex.items-center.px-4.py-2 {
  display: inline-flex;
  align-items: center;
  border: 1px solid #e9f0ff!important;
  font-size: 12px;
  font-weight: 500;
  padding: 12px 15px!important;
  color: #1d2943;
  line-height: 1.25;
  border-radius: 4px;
  min-width: 40px;
}
a.relative.inline-flex.items-center.px-4.py-2:hover{color: #fff;background-color: #6c5dd3!important;border-color: #6c5dd3!important;}
.relative.inline-flex.items-center.px-2.py-2.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.rounded-l-md.leading-5, a.relative.inline-flex.items-center.px-2.py-2.-ml-px.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.rounded-r-md.leading-5.hover\:text-gray-400.focus\:z-10.focus\:outline-none.focus\:ring.ring-gray-300.focus\:border-blue-300.active\:bg-gray-100.active\:text-gray-500.transition.ease-in-out.duration-150 ,span.relative.inline-flex.items-center.px-2.py-2.-ml-px.text-sm.font-medium.text-gray-500.bg-white.border.border-gray-300.cursor-default.rounded-r-md.leading-5{
  display: inline-flex;
  align-items: center;
  border: 1px solid #e9f0ff!important;
  font-size: 12px;
  font-weight: 500;
  color: #1d2943;
  line-height: 1.25;
  border-radius: 4px;
  padding: 8px!important;
  min-height: 41px;
}
span.relative.z-0.inline-flex.shadow-sm.rounded-md {
  display: flex;
}
span.relative.z-0.inline-flex.shadow-sm.rounded-md > span, span.relative.z-0.inline-flex.shadow-sm.rounded-md > a {
  margin: 0 5px;
}
.form-group{position: relative;}
.modal .form-group label.error, .form-group label.error {
  font-size: 12px;
  margin-bottom: 0!important;
  color: #ef0000;
  font-weight: normal;
  position: absolute;
  margin-top: 3px;
}
.login-form ul.text-sm.text-red-600 li{font-size: 12px;
  margin-bottom: 0!important;
  color: #ef0000;
  font-weight: normal;
  position: relative;text-align: left;
  margin-top: 0px;}
  .login-form ul.text-sm.text-red-600 {    position: relative;
    margin-top: -20px!important;}
  .login-page .input-block ,.login-page input.input-pswd{margin-bottom: 20px;}
  .login-page  .view-event.text-center{padding-top: 0;}
  .pagination-dynamic nav .flex.justify-between.flex-1.sm\:hidden{display: none;}