/********** 1. IMPORTS **********/
/********************************/
@import url('bootstrap.min.css?v=2.5');
@import url('select2.min.css');
@import url('select2.min.css');
@import url('select2-bootstrap.min.css');
@import url('jquery-ui-1.10.3.css?v=2.5');
@import url('font-awesome.min.css');

/********** 2. RESET STYLES **********/
/*************************************/
html {
    min-height: 100%;
    height: 100%;
}

body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    font-size: 13px;
    color: #636E7B;
    background-color: #F7F7F9;
}

a {
    outline: none !important;
}

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

/********** 3. HEADER STYLES **********/
/**************************************/

.headerwrapper {
    /* background-image: radial-gradient(circle 248px at center,#16d9e3 0%,#30c7ec 47%,#46aef7 100%)!important; */
    height: 60px;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

.headerwrapper:after {
    clear: both;
    display: block;
    content: '';
}

/***** 3.1 HEADER LEFT *****/

.headerwrapper .header-left {
    width: 260px;
    height: 100%;
    padding: 14px 15px;
    float: left;
    /* border-right: 1px solid rgba(255, 255, 255, 0.14); */
    /* background-color: rgba(0, 0, 0, 0.03); */
    background-color: #F7F7F9;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.headerwrapper .header-left .menu-collapse {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: rgba(76, 78, 100, 0.87);
    border-color: rgba(76, 78, 100, 0.87);
    padding: 5px 9px;
    border-radius: 50%;
    display: inline-block;
    font-size: 16px;
}

.headerwrapper .header-left .menu-collapse:hover {
    border-color: rgba(76, 78, 100, 0.87);
    color: rgba(76, 78, 100, 0.87);
}

/***** 3.2 HEADER RIGHT *****/

.headerwrapper .header-right {
    height: 100%;
    margin-left: 260px;
    padding: 14px 15px;
    /* box-shadow: 0 0 28px 0 rgba(0,0,0,.14); */
    background-color: #F7F7F9;
}

.headerwrapper .header-right .btn-group {
    margin: 0;
    line-height: 21px;
    float: left;
}

.headerwrapper .header-right .btn-group > .btn {
    border: 0;
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.75);
    border-radius: 50px;
    line-height: normal;
    margin-left: 5px;
    height: 33px;
}

.headerwrapper .header-right .btn-group > .btn:hover {
    background-color: rgba(0, 0, 0, 0.2);
}

.headerwrapper .header-right .btn-group > .btn:focus,
.headerwrapper .header-right .btn-group > .btn:active {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.3);
    box-shadow: none;
}

.headerwrapper .header-right .btn-group .btn .badge {
    box-shadow: none;
    background-color: #fff;
    color: #000;
    margin-left: 2px;
    padding: 2px 6px;
}

.btn-group-notification > .btn {
    padding: 7px 10px;
}

.btn-group-messages > .btn {
    padding: 6px 9px 8px 9px;
}

.btn-group-option > .btn {
    padding: 7px 12px;
}

.headerwrapper .header-right .btn-group .dropdown-menu {
    box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.05);
    margin-top: 13px;
    border-top: 0;
    border-radius: 0 0 3px 3px;
    border-color: #ccc;
}

.headerwrapper .header-right .btn-group .dropdown-menu:after {
    border-bottom: 6px solid #fff;
    border-left: 6px solid rgba(0, 0, 0, 0);
    border-right: 6px solid rgba(0, 0, 0, 0);
    content: '';
    display: inline-block;
    position: absolute;
    top: -6px;
    right: 10px;
}

.headerwrapper .header-right .btn-group .dropdown-menu li {
    position: relative;
}

.headerwrapper .header-right .btn-group .dropdown-menu li a {
    font-size: 12px;
    padding: 8px 15px;
    color: #555;
    transition: all 0.2s ease-out 0s;
}

.headerwrapper .header-right .btn-group .dropdown-menu li a:hover {
    color: #333;
    background-color: #E4E7EA;
}

.headerwrapper .header-right .btn-group .dropdown-menu .divider {
    margin: 5px 0;
}

.headerwrapper .header-right .btn-group-option .dropdown-menu li .glyphicon,
.headerwrapper .header-right .btn-group-option .dropdown-menu li .fa {
    margin-right: 10px;
}

.headerwrapper .header-right .btn-group-option .dropdown-menu {
    min-width: 180px;
    margin-top: 13px;
}

.headerwrapper .header-right .btn-group-list .dropdown-menu {
    padding: 0;
    min-width: 380px;
}

.headerwrapper .header-right .btn-group-list .dropdown-menu:after {
    border-bottom-color: #E4E7EA;
}

.headerwrapper .header-right div.dropdown-menu h5 {
    padding: 13px 0;
    text-align: center;
    background-color: #E4E7EA;
    margin: 0;
    font-size: 13px;
    border-bottom: 1px solid #ccc;
}

.headerwrapper .header-right .dropdown-footer {
    background-color: #f7f7f7;
    border-top: 1px solid #ddd;
    padding: 10px;
    font-size: 12px;
}

.headerwrapper .header-right .link-right {
    color: #636E7B;
    position: absolute;
    top: 10px;
    right: 15px;
}
.pull-right .btn-primary{
    background-image: radial-gradient(circle 248px at center,#16d9e3 0%,#30c7ec 47%,#46aef7 100%)!important;
}
.dropdown-list {
    margin: 0;
}

.dropdown-list li {
    border: 0;
    border-top: 1px solid #eee;
    padding: 10px 20px 10px 10px;
    margin: 0;
    cursor: pointer;
}

.dropdown-list li:hover {
    background-color: #fcfcfc;
}

.dropdown-list li:first-child {
    border-top: 0;
}

.dropdown-list li .noti-thumb {
    width: 40px;
}

.dropdown-list .media-body {
    font-size: 13px;
    line-height: 18px;
}

.dropdown-list .media-body strong {
    font-weight: 500;
    color: #2f363d;
}

.dropdown-list .media-body p {
    margin: 0;
}

.dropdown-list .media-body .date {
    display: block;
    margin-top: 2px;
    line-height: normal;
    color: #999;
}

.dropdown-list .media-body .date i {
    margin-right: 2px;
    margin-top: -3px;
    vertical-align: middle;
}

.dropdown-list .badge {
    float: right;
    border-radius: 2px;
    font-weight: normal;
    font-size: 11px;
    padding: 5px 8px;
}

/********* 4. MAIN WRAPPER STYLES *********/
/******************************************/

.mainwrapper {
    height: 100%;
    padding-top: 60px;
    position: relative;
    
}

.mainwrapper:before {
    content: '';
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    width: 260px;
    background-color: #F7F7F9;
   
}

.mainwrapper:after {
    clear: both;
    display: block;
    content: '';
}

.img-online {
    border: 2px solid #5cb85c;
    padding: 2px;
    background-color: #fff;
}

.img-offline {
    border: 2px solid #ccc;
    padding: 2px;
    background-color: #fff;
}

/***** 4.1 LEFT PANEL STYLES *****/


.leftpanel {
    position: fixed;
    background-color: #F7F7F9;
    top: 60px;
    left: 0;
    width: 260px; /* Adjust this value based on the actual width of your sidebar */
    height: 100vh; /* vh stands for viewport height, which means it will take up 100% of the viewport height */
    overflow-x: hidden; /* This will hide the horizontal scrollbar */
    overflow-y: auto; /* This enables scrolling within the navbar if the content exceeds the height of the viewport */
    z-index: 1; /* This ensures that the navbar is rendered on top of other page content */
}

/* This will change the style of the scrollbar */
.leftpanel::-webkit-scrollbar {
    width: 10px;
}

.leftpanel::-webkit-scrollbar-track {
    background: #F7F7F9; 
}
 
.leftpanel::-webkit-scrollbar-thumb {
    background: #F7F7F9; 
}

.leftpanel::-webkit-scrollbar-thumb:hover {
    background: #F7F7F9; 
}

.leftpanel .leftpanel-title {
    text-transform: uppercase;
    color: #ccc;
    font-size: 11px;
    font-weight: normal;
    margin: 15px 15px;
}

/***** 4.1.1 LEFT PANEL NAVIGATION *****/

.leftpanel .nav {
    position: relative;
    height: 100%;
    /* border-bottom: 1px solid #e7e7e7; */
}

.leftpanel .nav > li {
    /* margin: 0 1px 0 0; */
    font-size: 14px;
    font-weight: 500;
    /* border-top: 1px solid #e7e7e7; */
    position: relative;
    width: 240px;
    margin: auto;
    
}

.leftpanel .nav > li.active {
    border-top: 0;
    margin-right: 0;
    background-color: rgb(120, 126, 255) !important;
    border-radius: 15px;
}
.leftpanel .nav > li > .nav-active {
    background-color: rgb(120, 126, 255);
    color: #fff;
    border-radius: 15px;
}
.leftpanel .nav .nav-active i {
    color: #fff;
}

.leftpanel .nav > li.active + li {
    border-top: 0;
    background-color: rgb(120, 126, 255);
}

.leftpanel .nav > li > a {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 17px;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: rgba(76, 78, 100, 0.87);
}

.leftpanel .nav > li > a:hover,
.leftpanel .nav > li > a:focus,
.leftpanel .nav > li > a:active {
    background-color: rgba(76, 78, 100, 0.05);
    color: rgba(76, 78, 100, 0.87);
    border-radius: 15px;
}


.leftpanel .nav > li.active > a,
.leftpanel .nav > li.active > a:hover {
    color: rgba(76, 78, 100, 0.87);
    background-color: transparent;
}
.leftpanel .nav > li.active > a,
.leftpanel .nav > li.active > a:hover {
    color: rgba(76, 78, 100, 0.87);
    background-color: rgb(120, 126, 255);
}

.leftpanel .nav > li.active > a i {
    color: #fff;
    background-color: rgb(120, 126, 255);
}

.leftpanel .nav > li > a i {
    width: 16px;
    margin-right: 5px;
    color: rgba(76, 78, 100, 0.87);
    font-size: 17px;
    top: 1px;
    position: relative;
    text-align: center;
}
.leftpanel .nav > li > a:hover i {
    color: rgba(76, 78, 100, 0.87);
}

.leftpanel .nav > li.active > a i {
    color: #fff;
    background-color: rgb(120, 126, 255);
}

.leftpanel .nav > li.parent:after {
    font-family: 'FontAwesome', sans-serif;
    content: '\f107';
    display: block;
    position: absolute;
    top: 12px;
    right: 22px;
    color: #ccc;
}

.leftpanel .nav > li.parent-focus > a {
    background-color: rgba(76, 78, 100, 0.05);
}

.leftpanel .nav .badge {
    font-weight: normal;
    line-height: normal;
    font-size: 11px;
    background-color: #ccc;
}

.leftpanel .nav .children {
    list-style: none;
    padding: 0;
    margin: 0;
    display: none;
    color: #ccc;
}

.leftpanel .nav .active .children,
.leftpanel .nav .parent-focus .children {
    display: block;
    /* background-color: rgba(0,0,0,.1); */
}

.leftpanel .nav > li.active:after {
    color: #fff;
    background-color: rgba(0,0,0,.1);
}

.leftpanel .nav .children li:first-child {
    /* border-top: 1px solid #e7e7e7; */
}

.leftpanel .nav .children li.active:first-child {
    border-top: 0;
}

.leftpanel .nav .children li a {
    font-weight: normal;
    font-size: 13px;
    display: block;
    color: #ccc;
    padding: 6px 10px 6px 40px;
    transition: all 0.2s ease-out 0s;
}

.leftpanel .nav .children li a:hover {
    text-decoration: none;
    border-radius: 15px;
    background-color: rgba(234, 234, 255, 0.05);
}

.leftpanel .nav .children li.active a {
    background-color: rgba(0,0,0,.1);
}

.leftpanel .nav .active .children {
    /* border-bottom: 1px solid #e7e7e7; */
}

.leftpanel .nav .active .children {
    margin-right: 1px;
}

/***** 4.2 MAIN PANEL STYLES *****/

#page-cap {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.8);
    display: none;
    z-index: 9999;
}

#page-cap > i {
    position: absolute;
    top: 80px;
    left: 50%;
    margin-left: -60px;
}

#page-cap.showed {
    display: block;
}

#tourStatTable tr th:first-child {
    width: 40%;
}

.mainpanel {
    margin-left: 260px;
    background-color: #F7F7F9;
}

/***** 4.2.1 CONTENT PANEL STYLES *****/

.contentpanel {
    position: relative;
    padding: 20px;
}

.bg-light {
    background-color: #ccc;
}

/******** 5. MESSAGES STYLES *********/
/*************************************/

.msg-left {
    float: left;
    width: 250px;
    position: relative;
    z-index: 50;
}

.nav-msg li a {
    color: #444;
    transition: all 0.2s ease-out 0s;
}

.nav-msg li a i {
    display: inline-block;
    margin-right: 10px;
}

.nav-msg li a .badge {
    font-weight: normal;
    line-height: normal;
    font-size: 11px;
    margin-top: 1px;
}

.nav-msg li.active a {
    background-color: #4e5154;
    color: #fff;
}

.nav-msg li.active a:hover,
.nav-msg li.active a:focus,
.nav-msg li.active a:active {
    background-color: #444649;
}

.nav-msg li.active a .badge {
    color: #666;
}

.sm-title {
    font-size: 11px;
    text-transform: uppercase;
    font-weight: normal;
}

.md-title {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: normal;
}

.lg-title {
    font-weight: 500;
    color: #333;
    margin: 0 0 5px 0;
    text-transform: uppercase;
    font-size: 13px;
}

.xlg-title {
    margin: 0;
    font-weight: 400;
    color: #333;
}

.msg-header {
    margin-bottom: 25px;
    margin-top: 5px;
}

.msg-header:after {
    clear: both;
    display: block;
    content: '';
}

.msg-header .btn-group {
    margin: 0;
}

.msg-header .btn {
    padding: 0;
    border-radius: 50px;
    border-width: 2px;
    width: 35px;
    height: 35px;
    color: #999;
    margin-right: 5px;
}

.msg-header .btn-navi {
    font-size: 14px;
    color: #999;
}

.msg-header .btn:hover,
.msg-header .btn:active,
.msg-header .btn:focus {
    background-color: #fff;
    border-color: #666;
    color: #666;
}

.msg-header .btn-navi {
    margin-right: 0;
}

.msg-header .btn-navi-left i {
    margin-left: -3px;
}

.msg-header .btn-navi-right i {
    margin-left: 2px;
}

.msg-header .dropdown-menu {
    margin-top: 12px;
}

.msg-header .dropdown-menu:after {
    border-bottom: 6px solid #fff;
    border-left: 6px solid rgba(0, 0, 0, 0);
    border-right: 6px solid rgba(0, 0, 0, 0);
    content: '';
    display: inline-block;
    position: absolute;
    top: -6px;
    right: 15px;
}

.msg-header .dropdown-menu:before {
    border-bottom: 7px solid #ddd;
    border-left: 7px solid rgba(0, 0, 0, 0);
    border-right: 7px solid rgba(0, 0, 0, 0);
    content: '';
    display: inline-block;
    position: absolute;
    top: -8px;
    right: 14px;
}

.msg-header .dropdown-menu li {
    font-size: 12px;
}

.msg-header .dropdown-menu li i {
    margin-right: 8px;
}

.panel-group-msg {
    margin-top: 15px;
}

.panel-group-msg .panel {
    box-shadow: none;
}

.panel-group-msg .panel-heading {
    padding: 10px;
}

.panel-group-msg .img {
    width: 30px;
    margin: 0;
}

.panel-group-msg .panel-title {
    font-weight: 500;
    color: #444;
    font-size: 14px;
}

.panel-group-msg .time {
    margin: 5px 20px 0 0;
    font-weight: normal;
    font-size: 12px;
}

.panel-group-msg .time i {
    font-size: 16px;
}

.msg-reply {
    margin-left: 15px;
}

.msg-reply img {
    width: 30px;
}

.btn-create-msg {
    padding: 12px 10px;
}

.alert-metro {
    border-radius: 0;
}

/********* 6. UI ELEMENTS *********/
/**********************************/

/***** 6.1 BUTTONS PAGE STYLES *****/

.btn-dark {
    background-color: #4e5154;
    color: #fff;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
    background-color: #414446;
    color: #fff;
}

.btn-list .btn {
    margin: 0 3px 7px 0;
}

.btn-rounded {
    border-radius: 100px;
    padding-left: 20px;
    padding-right: 20px;
}

.btn.btn-bordered {
    padding: 6px 13px;
}

.btn-sm.btn-bordered {
    padding: 4px 10px;
}

.btn-xs.btn-bordered {
    padding: 2px 8px;
}

.btn.btn-bordered,
.btn.btn-bordered:hover,
.btn.btn-bordered:focus,
.btn.btn-bordered:active {
    background: none !important;
    border-width: 2px;
}

.btn-primary.btn-bordered,
.btn-primary.btn-bordered:hover,
.btn-primary.btn-bordered:active,
.btn-primary.btn-bordered:focus {
    background-image: linear-gradient(to right,#f78ca0 0%,#f9748f 19%,#fd868c 60%,#fe9a8b 100%)!important;
  background-image: linear-gradient(to right,#f78ca0 0%,#f9748f 19%,#fd868c 60%,#fe9a8b 100%)!important;
}

.btn-success.btn-bordered,
.btn-success.btn-bordered:hover,
.btn-success.btn-bordered:active,
.btn-success.btn-bordered:focus {
    color: #5cb85c;
}

.btn-warning.btn-bordered,
.btn-warning.btn-bordered:hover,
.btn-warning.btn-bordered:active,
.btn-warning.btn-bordered:focus {
    color: #eea236;
}

.btn-danger.btn-bordered,
.btn-danger.btn-bordered:focus,
.btn-danger.btn-bordered:active,
.btn-danger.btn-bordered:hover {
    color: #d9534f;
}

.btn-info.btn-bordered,
.btn-info.btn-bordered:focus,
.btn-info.btn-bordered:active,
.btn-info.btn-bordered:hover {
    color: #46b8da;
}

.btn-group .btn.btn-bordered + .btn.btn-bordered,
.btn-group .btn.btn-bordered + .btn-group,
.btn-group .btn-group + .btn.btn-bordered,
.btn-group .btn-group + .btn-group {
    margin-left: -2px;
}

.btn-group .btn.btn-bordered {
    padding-left: 14px;
    padding-right: 15px;
}

/***** 6.2 EXTRAS STYLES *****/

.dropdown-demo-only {
    position: static;
    display: inline-block;
    margin-right: 10px;
    width: 160px;
    float: none;
    margin-bottom: 20px;
}

.dropdown-menu-primary {
    box-shadow: none;
    border-color: #428bca;
}

.dropdown-menu-primary > li > a {
    color: #428bca;
}

.dropdown-menu-primary > li > a:hover {
    background-color: #428bca;
    color: #fff;
}

.dropdown-menu-success {
    box-shadow: none;
    border-color: #5cb85c;
}

.dropdown-menu-success > li > a {
    color: #5cb85c;
}

.dropdown-menu-success > li > a:hover {
    background-color: #5cb85c;
    color: #fff;
}

.dropdown-menu-danger {
    box-shadow: none;
    border-color: #d9534f;
}

.dropdown-menu-danger > li > a {
    color: #d9534f;
}

.dropdown-menu-danger > li > a:hover {
    background-color: #d9534f;
    color: #fff;
}

.dropdown-menu-warning {
    box-shadow: none;
    border-color: #f0ad4e;
}

.dropdown-menu-warning > li > a {
    color: #f0ad4e;
}

.dropdown-menu-warning > li > a:hover {
    background-color: #f0ad4e;
    color: #fff;
}

.dropdown-menu-metro {
    border-radius: 0;
    box-shadow: none;
}

.dropdown-menu-metro > li > a {
    border-radius: 0;
}

.pagination-metro > li:first-child > a,
.pagination-metro > li:first-child > span {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.pagination-metro > li:last-child > a,
.pagination-metro > li:last-child > span {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.pagination-split.pagination-metro > li > a,
.pagination-split.pagination-metro > li > span {
    border-radius: 0;
}

.pagination-primary > li > a,
.pagination-primary > li > a:hover {
    border-color: #428bca;
    color: #428bca;
}

.pagination-primary > .disabled > span,
.pagination-primary > .disabled > span:hover,
.pagination-primary > .disabled > span:focus,
.pagination-primary > .disabled > a,
.pagination-primary > .disabled > a:hover,
.pagination-primary > .disabled > a:focus {
    border-color: #428bca;
    color: #428bca;
    opacity: 0.5;
}

.pagination-success > li > a,
.pagination-success > li > a:hover {
    border-color: #5cb85c;
    color: #5cb85c;
}

.pagination-success > .disabled > span,
.pagination-success > .disabled > span:hover,
.pagination-success > .disabled > span:focus,
.pagination-success > .disabled > a,
.pagination-success > .disabled > a:hover,
.pagination-success > .disabled > a:focus {
    border-color: #5cb85c;
    color: #5cb85c;
    opacity: 0.5;
}

a.zreportdisabled {
    pointer-events: none;
    opacity: 0.2;
  }

.pagination-success > .active > a,
.pagination-success > .active > span,
.pagination-success > .active > a:hover,
.pagination-success > .active > span:hover,
.pagination-success > .active > a:focus,
.pagination-success > .active > span:focus {
    background-color: #5cb85c;
    border-color: #5cb85c;
}

.pagination-circled > li > a {
    border-radius: 50px;
}

.pagination-circled > li:first-child > a,
.pagination-circled > li:first-child > span {
    border-bottom-left-radius: 50px;
    border-top-left-radius: 50px;
}

.pagination-circled > li:last-child > a,
.pagination-circled > li:last-child > span {
    border-bottom-right-radius: 50px;
    border-top-right-radius: 50px;
}

.pagination-circled > li:first-child > a,
.pagination-circled > li:last-child > a {
    padding: 6px 13px;
}

.pagination-active-success > .active > a,
.pagination-active-success > .active > span,
.pagination-active-success > .active > a:hover,
.pagination-active-success > .active > span:hover,
.pagination-active-success > .active > a:focus,
.pagination-active-success > .active > span:focus {
    background-color: #5cb85c;
    border-color: #5cb85c;
}

.pagination-active-success > li > a:hover,
.pagination-active-success > li > span:hover,
.pagination-active-success > li > a:focus,
.pagination-active-success > li > span:focus {
    color: #5cb85c;
}

.pagination-active-warning > .active > a,
.pagination-active-warning > .active > span,
.pagination-active-warning > .active > a:hover,
.pagination-active-warning > .active > span:hover,
.pagination-active-warning > .active > a:focus,
.pagination-active-warning > .active > span:focus {
    background-color: #f0ad4e;
    border-color: #f0ad4e;
}

.pagination-active-warning > li > a:hover,
.pagination-active-warning > li > span:hover,
.pagination-active-warning > li > a:focus,
.pagination-active-warning > li > span:focus {
    color: #f0ad4e;
}

.pagination-active-danger > .active > a,
.pagination-active-danger > .active > span,
.pagination-active-danger > .active > a:hover,
.pagination-active-danger > .active > span:hover,
.pagination-active-danger > .active > a:focus,
.pagination-active-danger > .active > span:focus {
    background-color: #d9534f;
    border-color: #d9534f;
}

.pagination-active-danger > li > a:hover,
.pagination-active-danger > li > span:hover,
.pagination-active-danger > li > a:focus,
.pagination-active-danger > li > span:focus {
    color: #d9534f;
}

.pagination-active-info > .active > a,
.pagination-active-info > .active > span,
.pagination-active-info > .active > a:hover,
.pagination-active-info > .active > span:hover,
.pagination-active-info > .active > a:focus,
.pagination-active-info > .active > span:focus {
    background-color: #5bc0de;
    border-color: #5bc0de;
}

.pagination-active-info > li > a:hover,
.pagination-active-info > li > span:hover,
.pagination-active-info > li > a:focus,
.pagination-active-info > li > span:focus {
    color: #5bc0de;
}

.pagination-active-dark > .active > a,
.pagination-active-dark > .active > span,
.pagination-active-dark > .active > a:hover,
.pagination-active-dark > .active > span:hover,
.pagination-active-dark > .active > a:focus,
.pagination-active-dark > .active > span:focus {
    background-color: #4e5154;
    border-color: #4e5154;
}

.pagination-active-dark > li > a:hover,
.pagination-active-dark > li > span:hover,
.pagination-active-dark > li > a:focus,
.pagination-active-dark > li > span:focus {
    color: #4e5154;
}

.progress-metro {
    border-radius: 0;
}

/***** 6.4 ICON STYLES *******/

.icon-list {
    margin: 20px 0;
    padding: 0;
    list-style: none;
}

.icon-list li {
    margin-bottom: 5px;
}

.icon-list li span {
    width: 20px;
    display: inline-block;
    margin-right: 5px;
    color: #333;
}

/***** 6.5 PANELS & WIDGETS STYLES *****/

.panel-dark {
    border-color: #4e5154;
}

.panel-dark .panel-heading {
    background-color: #4e5154;
    color: #fff;
}

.panel-success-alt {
    border-color: #4cae4c;
}

.panel-success-alt .panel-heading {
    background-color: #5cb85c;
    color: #fff;
}

.panel-info-alt {
    border-color: #46b8da;
}

.panel-info-alt .panel-heading {
    background-color: #5bc0de;
    color: #fff;
}

.panel-warning-alt {
    border-color: #eea236;
}

.panel-warning-alt .panel-heading {
    background-color: #f0ad4e;
    color: #fff;
}

.panel-danger-alt {
    border-color: #d43f3a;
}

.panel-danger-alt .panel-heading {
    background-color: #d9534f;
    color: #fff;
}

.panel-success-alt .panel-heading p a,
.panel-info-alt .panel-heading p a,
.panel-warning-alt .panel-heading p a,
.panel-danger-alt .panel-heading p a,
.panel-dark .panel-heading p a {
    color: #fff;
}

.panel-success-alt .panel-heading .panel-btns a,
.panel-info-alt .panel-heading .panel-btns a,
.panel-warning-alt .panel-heading .panel-btns a,
.panel-danger-alt .panel-heading .panel-btns a,
.panel-dark .panel-heading .panel-btns a {
    border-color: #fff;
    color: #fff;
    opacity: 0.75;
}

.panel-primary-head .panel-heading,
.panel-success-head .panel-heading,
.panel-warning-head .panel-heading,
.panel-danger-head .panel-heading,
.panel-info-head .panel-heading,
.panel-dark-head .panel-heading {
    border-bottom: 0;
    color: #fff;
}

.panel-primary-head .panel-heading p,
.panel-success-head .panel-heading p,
.panel-warning-head .panel-heading p,
.panel-danger-head .panel-heading p,
.panel-info-head .panel-heading p,
.panel-dark-head .panel-heading p {
    opacity: 0.75;
}

.panel-primary-head .panel-body,
.panel-success-head .panel-body,
.panel-warning-head .panel-body,
.panel-danger-head .panel-body,
.panel-info-head .panel-body,
.panel-dark-head .panel-body {
    border: 1px solid #ddd;
    border-top: 0;
}

.panel-primary-head .panel-footer,
.panel-success-head .panel-footer,
.panel-warning-head .panel-footer,
.panel-danger-head .panel-footer,
.panel-info-head .panel-footer,
.panel-dark-head .panel-footer {
    border: 1px solid #ddd;
    border-top: 0;
}

.panel-primary-head .panel-heading {
    background-image: linear-gradient(to right,#f78ca0 0%,#f9748f 19%,#fd868c 60%,#fe9a8b 100%)!important;
  background-image: linear-gradient(to right,#f78ca0 0%,#f9748f 19%,#fd868c 60%,#fe9a8b 100%)!important;
}

.panel-success-head .panel-heading {
    background-color: #5cb85c;
}

.panel-warning-head .panel-heading {
    background-color: #f0ad4e;
}

.panel-danger-head .panel-heading {
    background-color: #d9534f;
}

.panel-info-head .panel-heading {
    background-color: #5bc0de;
}

.panel-dark-head .panel-heading {
    background-color: #4e5154;
}

.panel-primary-head .panel-heading p a,
.panel-success-head .panel-heading p a,
.panel-info-head .panel-heading p a,
.panel-warning-head .panel-heading p a,
.panel-danger-head .panel-heading p a,
.panel-dark-head .panel-heading p a {
    color: #fff;
}

.panel-primary-head .panel-heading .panel-btns a,
.panel-success-head .panel-heading .panel-btns a,
.panel-info-head .panel-heading .panel-btns a,
.panel-warning-head .panel-heading .panel-btns a,
.panel-danger-head .panel-heading .panel-btns a,
.panel-dark-head .panel-heading .panel-btns a {
    border-color: #fff;
    color: #fff;
    opacity: 0.75;
}

.panel-metro,
.panel-metro .panel-heading,
.panel-metro .panel-footer {
    border-radius: 0;
}

.widget-messaging .new-msg {
    color: #fff;
    font-size: 18px;
    margin: 0;
    line-height: normal;
    opacity: 0.5;
}

.widget-messaging .new-msg:hover {
    opacity: 1;
}

.widget-messaging ul li:hover {
    background-color: #f7f7f7;
}

.widget-messaging .sender {
    color: #333;
    font-weight: 500;
    font-size: 14px;
    line-height: normal;
    margin: 0;
}

.widget-messaging ul li p {
    line-height: normal;
    margin: 0;
}

.widget-todo .panel-heading a {
    color: #fff;
}

.widget-todo ul > li input:checked + label {
    text-decoration: line-through;
}

.widget-slider .carousel-control {
    background: none;
    bottom: auto;
    color: #fff;
    line-height: 10px;
    padding: 0;
    text-shadow: none;
    top: -65px;
    width: auto;
    opacity: 0.75;
    border: 1px solid #fff;
    border-radius: 50px;
}

.widget-slider .carousel-control:hover {
    opacity: 1;
}

.widget-slider .carousel-control.left {
    left: auto;
    right: 25px;
    padding: 1px 10px 3px 8px;
}

.widget-slider .carousel-control.right {
    right: -5px;
    padding: 1px 8px 3px 10px;
}

.widget-slider .carousel-control span {
    font-size: 18px;
    line-height: normal;
}

.widget-slider .media {
    padding-bottom: 0;
}

.widget-slider .carousel-indicators {
    bottom: auto;
    left: auto;
    right: 0;
    top: -58px;
    width: auto;
}

/***** 6.6 TABS & ACCORDION STYLES *****/

.nav-primary {
    border-color: #357ebd ;
    background-image: radial-gradient(circle 248px at center,#16d9e3 0%,#30c7ec 47%,#46aef7 100%)!important;
}

.nav-primary > li.active > a,
.nav-primary > li.active > a:hover,
.nav-primary > li.active > a:focus,
.nav-primary > li.active > a:active {
    border-top-color: #357ebd;
    border-left-color: #357ebd;
    border-right-color: #357ebd;
}

.nav-success {
    border-color: #5cb85c;
    background-color: #5cb85c;
}

.nav-info {
    border-color: #46b8da;
    background-color: #5bc0de;
}

.nav-danger {
    border-color: #d43f3a;
    background-color: #d9534f;
}

.nav-warning {
    border-color: #eea236;
    background-color: #f0ad4e;
}

.nav-success > li.active > a,
.nav-success > li.active > a:hover,
.nav-success > li.active > a:focus,
.nav-success > li.active > a:active {
    border-top-color: #5cb85c;
    border-left-color: #5cb85c;
    border-right-color: #5cb85c;
}

.nav-info > li.active > a,
.nav-info > li.active > a:hover,
.nav-info > li.active > a:focus,
.nav-info > li.active > a:active {
    border-top-color: #46b8da;
    border-left-color: #46b8da;
    border-right-color: #46b8da;
}

.nav-danger > li.active > a,
.nav-danger > li.active > a:hover,
.nav-danger > li.active > a:focus,
.nav-danger > li.active > a:active {
    border-top-color: #d43f3a;
    border-left-color: #d43f3a;
    border-right-color: #d43f3a;
}

.nav-warning > li.active > a,
.nav-warning > li.active > a:hover,
.nav-warning > li.active > a:focus,
.nav-warning > li.active > a:active {
    border-top-color: #eea236;
    border-left-color: #eea236;
    border-right-color: #eea236;
}

.nav-primary > li > a,
.nav-success > li > a,
.nav-info > li > a,
.nav-danger > li > a,
.nav-warning > li > a {
    color: #fff;
}

.nav-primary > li > a:hover,
.nav-success > li > a:hover,
.nav-info > li > a:hover,
.nav-danger > li > a:hover,
.nav-warning > li > a:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
}
.tab-content {
    border-color: transparent;
    padding-top: 15px;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.tab-content-primary {
    border-color: #357ebd;
}

.tab-content-success {
    border-color: #5cb85c;
}

.tab-content-info {
    border-color: #46b8da;
}

.tab-content-danger {
    border-color: #d43f3a;
}

.tab-content-warning {
    border-color: #eea236;
}

.nav-metro,
.nav-metro > li > a,
.nav-metro > li.active > a,
.tab-content-metro {
    border-radius: 0;
}

.panel-group .panel-heading {
    padding: 15px;
}

.panel-group .panel-heading .panel-title {
    font-size: 14px;
}
.no-padding{
    padding: 0px;
}
.nav-tabs {
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    background-color:transparent; 
    border: none;
  }
  .nav-tabs>li>{
   
  }
  .nav-tabs>li>a{
    text-align: center;
    margin-right: 10px;
    min-width: 150px;
    background-color: rgb(102, 108, 255);
    color: rgb(255, 255, 255);
    font-weight: 500;
    line-height: 1.715;
    border-radius: 8px;
    box-shadow: rgba(76, 78, 100, 0.42) 0px 4px 8px;
  }
.nav-line {
    background: none;
    border: 0;
    margin-bottom: 20px;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.1);
}

.nav-line > li {
    margin: 0;
}

.nav-line > li > a,
.nav-line > li > a:hover,
.nav-line > li > a:active,
.nav-line > li > a:focus {
    border: 0;
    margin: 0 !important;
}

.nav-line > li.active > a,
.nav-line > li.active > a:hover,
.nav-line > li.active > a:active,
.nav-line > li.active > a:focus {
    border: 0;
}

.nav-line > li.active > a,
.nav-line > li.active > a:hover,
.nav-line > li.active > a:active,
.nav-line > li.active > a:focus {
    box-shadow: 0 3px 0 #428bca;
    margin: 0;
}
.panel-heading{
    background-color: transparent !important;
    border: none;
}

/********** 7. FORM STYLES **********/
/************************************/

.ckbox,
.rdio {
    position: relative;
}

.ckbox input[type="checkbox"],
.rdio input[type="radio"] {
    opacity: 0;
}

.ckbox label,
.rdio label {
    padding-left: 10px;
    cursor: pointer;
    margin-bottom: 7px !important;
}

.ckbox label:before {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 1px;
    left: 0;
    content: '';
    display: inline-block;
    border-radius: 2px;
    border: 1px solid #bbb;
    background: #fff;
}

.ckbox input[type="checkbox"]:disabled + label {
    color: #999;
}

.ckbox input[type="checkbox"]:disabled + label:before {
    background-color: #eee;
}

.ckbox input[type="checkbox"]:checked + label:after {
    font-family: 'FontAwesome', sans-serif;
    content: "\F00C";
    position: absolute;
    top: 3px;
    left: 3px;
    display: inline-block;
    font-size: 11px;
    width: 16px;
    height: 16px;
    color: #fff;
}

.ckbox-default input[type="checkbox"]:checked + label:before {
    border-color: #999;
}

.ckbox-default input[type="checkbox"]:checked + label:after {
    color: #333;
}

.ckbox-primary input[type="checkbox"]:checked + label:before {
    border-color: #357EBD;
    background-color: #428BCA;
}

.ckbox-warning input[type="checkbox"]:checked + label:before {
    border-color: #EEA236;
    background-color: #F0AD4E;
}

.ckbox-success input[type="checkbox"]:checked + label:before {
    border-color: #5cb85c;
    background-color: #5cb85c;
}

.ckbox-danger input[type="checkbox"]:checked + label:before {
    border-color: #D43F3A;
    background-color: #D9534F;
}

.rdio label:before {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 1px;
    left: 0;
    content: '';
    display: inline-block;
    border-radius: 50px;
    border: 1px solid #bbb;
    background: #fff;
}

.rdio input[type="radio"]:disabled + label {
    color: #999;
}

.rdio input[type="radio"]:disabled + label:before {
    background-color: #eee;
}

.rdio input[type="radio"]:checked + label::after {
    content: '';
    position: absolute;
    top: 5px;
    left: 4px;
    display: inline-block;
    font-size: 11px;
    width: 10px;
    height: 10px;
    background-color: #444;
    border-radius: 50px;
}

.rdio-default input[type="radio"]:checked + label:before {
    border-color: #999;
}

.rdio-primary input[type="radio"]:checked + label:before {
    border-color: #428BCA;
}

.rdio-primary input[type="radio"]:checked + label::after {
    background-color: #428BCA;
}

.rdio-warning input[type="radio"]:checked + label:before {
    border-color: #F0AD4E;
}

.rdio-warning input[type="radio"]:checked + label::after {
    background-color: #F0AD4E;
}

.rdio-success input[type="radio"]:checked + label:before {
    border-color: #1CAF9A;
}

.rdio-success input[type="radio"]:checked + label::after {
    background-color: #1CAF9A;
}

.rdio-danger input[type="radio"]:checked + label:before {
    border-color: #D9534F;
}

.rdio-danger input[type="radio"]:checked + label::after {
    background-color: #D9534F;
}

.errorForm label {
    display: block;
    background-color: #f2dede;
    border: 1px solid #ebccd1;
    color: #a94442;
    padding: 5px 10px;
    border-radius: 2px;
}

.form-group.has-error label.error {
    color: #a94442;
}

.errorForm label:last-child {
    margin-bottom: 20px !important;
}

.colorpicker-input {
    display: inline-block;
    width: 100px;
}

/***** 7.1 FORM WIZARD *****/

.nav-wizard {
    background-color: #ddd;
    border-radius: 3px;
    margin-bottom: 5px;
}

.nav-wizard > li {
    position: relative;
    margin-right: -2px;
}

.nav-wizard > li > a {
    color: #666;
}

.nav-wizard > li > a {
    position: relative;
    padding-left: 30px;
    border-radius: 0;
}

.nav-wizard > li > a:after {
    border-left: 19px solid #ddd;
    border-top: 19px solid rgba(0, 0, 0, 0);
    border-bottom: 19px solid rgba(0, 0, 0, 0);
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    right: -19px;
    z-index: 10;
}

.nav-wizard > li > a:before {
    border-left: 20px solid #fff;
    border-top: 20px solid rgba(0, 0, 0, 0);
    border-bottom: 20px solid rgba(0, 0, 0, 0);
    content: '';
    display: inline-block;
    position: absolute;
    top: -1px;
    right: -20px;
    z-index: 5;
}

.nav-wizard > li > a:hover,
.nav-wizard > li > a:active,
.nav-wizard > li > a:focus {
    background-color: #ccc;
}

.nav-wizard > li > a:hover:after,
.nav-wizard > li > a:active:after,
.nav-wizard > li > a:focus:after {
    border-left-color: #ccc;
}

.nav-wizard > li:first-child > a {
    padding-left: 15px;
    border-radius: 3px 0 0 3px;
}

.nav-wizard > li:last-child > a {
    border-radius: 0 3px 3px 0;
}

.nav-wizard > li:last-child > a:after,
.nav-wizard > li:last-child > a:before {
    display: none;
}

.nav-wizard > li.active a,
.nav-wizard > li.active a:hover,
.nav-wizard > li.active a:focus,
.nav-wizard > li.active a:active {
    background-color: #4e5154;
    color: #fff;
}

.nav-wizard > li.active a:after {
    border-left-color: #4e5154;
}

.nav-wizard > li.done a {
    background-color: #428bca;
    color: #fff;
}

.nav-wizard > li.done a:after {
    border-left-color: #428bca;
}

.panel-wizard {
    margin-bottom: 20px;
}

.panel-wizard .tab-content {
    border: 1px solid #ddd;
    border-radius: 3px 3px 0 0;
    border-bottom: 0;
}

.panel-wizard .wizard {
    margin: 0;
    background-color: #fcfcfc;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 0 0 3px 3px;
}

.panel-wizard .wizard:after {
    clear: both;
    display: block;
    content: '';
}

.panel-wizard .progress {
    margin-bottom: 5px;
}

.nav-disabled-click > li > a:hover,
.nav-disabled-click > li > a:active,
.nav-disabled-click > li > a:focus {
    background-color: #ddd;
    cursor: default;
}

.nav-disabled-click > li > a:hover:after,
.nav-disabled-click > li > a:active:after,
.nav-disabled-click > li > a:focus:after {
    border-left-color: #ddd;
}

.nav-disabled-click > li.active > a:hover:after,
.nav-disabled-click > li.active > a:active:after,
.nav-disabled-click > li.active > a:focus:after {
    border-left-color: #4e5154;
}

.nav-disabled-click > li.done > a:hover,
.nav-disabled-click > li.done > a:active,
.nav-disabled-click > li.done > a:focus {
    background-color: #428bca;
}

.nav-disabled-click > li.done > a:hover:after,
.nav-disabled-click > li.done > a:active:after,
.nav-disabled-click > li.done > a:focus:after {
    border-left-color: #428bca;
}

.nav-wizard-success > li.done > a {
    background-color: #5cb85c;
}

.nav-wizard-success > li.done > a:after {
    border-left-color: #5cb85c;
}

.nav-wizard-warning > li.done > a {
    background-color: #f0ad4e;
}

.nav-wizard-warning > li.done > a:after {
    border-left-color: #f0ad4e;
}

.nav-wizard-danger > li.done > a {
    background-color: #d9534f;
}

.nav-wizard-danger > li.done > a:after {
    border-left-color: #d9534f;
}

.nav-wizard-info > li.done > a {
    background-color: #5bc0de;
}

.nav-wizard-info > li.done > a:after {
    border-left-color: #5bc0de;
}

/********** 8. TABLE STYLES **********/
/*************************************/

.table-action a,
.table-action-hide a {
    color: #666;
    display: inline-block;
    margin-left: 2px;
}

.table-action-hide a {
    opacity: 0;
}

.table-primary thead tr th {
    background-color: #428BCA;
}

.table-success thead tr th {
    background-color: #5cb85c;
}

.table-danger thead tr th {
    background-color: #D9534F;
}

.table-warning thead tr th {
    background-color: #F0AD4E;
}

.table-info thead tr th {
    background-color: #5BC0DE;
}

.table-dark thead tr th {
    background-color: #4e5154;
}

.table.table-primary thead tr th,
.table.table-success thead tr th,
.table.table-danger thead tr th,
.table.table-warning thead tr th,
.table.table-info thead tr th,
.table.table-dark thead tr th {
    color: #fff;
    border-bottom: 0;
}

.table-bordered.table-primary thead tr th,
.table-bordered.table-success thead tr th,
.table-bordered.table-warning thead tr th,
.table-bordered.table-danger thead tr th,
.table-bordered.table-info thead tr th,
.table-bordered.table-dark thead tr th {
    border-color: rgba(255, 255, 255, 0.2);
}

.table.table-primary tbody tr:first-child td,
.table.table-success tbody tr:first-child td,
.table.table-danger tbody tr:first-child td,
.table.table-warning tbody tr:first-child td,
.table.table-info tbody tr:first-child td,
.table.table-dark tbody tr:first-child td {
    border-top: 0;
}

.table-loader {
    opacity: 0;
}

.showed-loader {
    opacity: 1;
    transition: all 400ms ease;
}

/********** 9. PAGES STYLES **********/
/*************************************/

/***** 9.1 NOT FOUND PAGE STYLES *****/

.notfoundpanel {
    text-align: center;
    width: 600px;
    margin: 0 auto;
    position: relative;
}

.notfoundpanel h1 {
    font-size: 180px;
    font-weight: 200;
    color: #000;
    margin: 0 0 10px 0;
    line-height: 180px;
    /* text-shadow: 4px 4px rgba(0,0,0,0.2); */
}

.notfoundpanel h3 {
    color: #333;
    margin: 0 0 10px 0;
}

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

.notfoundpanel form {
    width: 350px;
    margin: 20px auto 0 auto;
}

.notfoundpanel .form-control {
    width: 250px;
    float: left;
}

.notfoundpanel .btn {
    padding: 9px 20px 10px 20px;
}

/***** 9.2 INVOICE STYLES *****/

.table-invoice {
    box-shadow: none;
    border-bottom: 1px solid #ddd;
    margin-top: 20px;
}

.table-invoice thead > tr > th {
    font-weight: 500;
    padding: 15px;
}

.table-invoice thead > tr > th:last-child,
.table-invoice thead > tr > th:nth-child(3),
.table-invoice thead > tr > th:nth-child(2) {
    text-align: right;
}

.table-invoice tbody > tr > td {
    padding: 15px;
    border-color: #ddd;
}

.table-invoice tbody > tr > td:last-child,
.table-invoice tbody > tr > td:nth-child(3),
.table-invoice tbody > tr > td:nth-child(2) {
    width: 15%;
    text-align: right;
}

.table-invoice tbody > tr > td h5,
.table-invoice tbody > tr > td p {
    margin: 0;
}

.table-invoice thead > tr > th:nth-child(2) {
    background-color: #3f4144;
}

.table-invoice thead > tr > th:nth-child(3) {
    background-color: #484a4d;
}

.table-invoice thead > tr > th:last-child {
    background-color: #555;
}

.table-invoice tbody > tr > td:nth-child(2) {
    background-color: #eee;
}

.table-invoice tbody > tr > td:nth-child(3) {
    background-color: #f7f7f7;
}

.table-total {
    box-shadow: none;
    float: right;
}

.table-total > tbody > tr > td:first-child {
    border: 0;
    text-transform: uppercase;
    font-weight: normal;
    text-align: right;
}

.table-total > tbody > tr > td:last-child {
    border-bottom: 1px solid #ddd;
    width: 15%;
    text-align: right;
    font-size: 24px;
    font-weight: 500;
    color: #333;
}

table.dataTable.dtr-inline.collapsed tbody td:first-child:before,
table.dataTable.dtr-inline.collapsed tbody th:first-child:before {
    border: 1px solid #ccc !important;
    background-color: #ddd !important;
    border-radius: 2px !important;
    color: #666 !important;
    font-weight: bold !important;
    box-shadow: none !important;
}

/***** 9.3 MEDIA MANAGER STYLES *****/

.media-options {
    margin-bottom: 20px;
}

.media-options:after {
    clear: both;
    display: block;
    content: '';
}

.media-options .btn-group {
    margin-bottom: 0;
}

.media-option-group {
    margin: 0 0 0 5px;
}

.media-option-group label {
    margin-bottom: 0 !important;
}

.media-manager .thmb {
    border: 1px solid #e7e7e7;
    border-radius: 3px;
    padding: 10px;
    margin-bottom: 20px;
    position: relative;
}

.media-manager .thmb.checked {
    border-color: #bbb;
    background-color: #fcfcfc;
}

.media-manager .thmb::after {
    clear: both;
    display: block;
    content: '';
}

.media-manager .ckbox {
    position: absolute;
    top: 15px;
    left: 15px;
    display: none;
}

.media-manager .fm-group {
    position: absolute;
    top: 15px;
    right: 15px;
    display: none;
}

.media-manager .fm-toggle {
    padding: 1px 4px;
    line-height: normal;
    background: #fff;
    border-radius: 2px;
}

.media-manager .fm-menu {
    min-width: 120px;
}

.media-manager .fm-menu a {
    font-size: 12px;
    color: #333;
    padding: 4px 8px;
}

.media-manager .fm-menu i {
    margin-right: 7px;
    color: #999;
    width: 16px;
    font-size: 13px;
}

.media-manager .thmb-prev {
    background: #eee;
    overflow: hidden;
}

.media-manager .thmb-prev a {
    display: block;
}

.media-manager .fm-title {
    margin-bottom: 0;
    font-size: 13px;
}

.media-manager .fm-title a {
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    white-space: nowrap;
}

.media-manager-sidebar {
    padding-left: 10px;
}

.media-manager-sidebar .lg-title a {
    color: #999;
    font-size: 11px;
}

.media-manager-sidebar .lg-title a:hover {
    text-decoration: none;
    color: #333;
}

.folder-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.folder-list li {
    display: block;
    border-bottom: 1px solid #eee;
}

.folder-list li a {
    display: block;
    padding: 7px 0;
    color: #666;
}

.folder-list li a:hover {
    color: #333;
    text-decoration: none;
}

.folder-list li i {
    margin-right: 10px;
    width: 16px;
}

.media-manager-sidebar .tag-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.media-manager-sidebar .tag-list li {
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
}

.media-manager-sidebar .tag-list li a {
    display: block;
    padding: 5px 7px;
    font-size: 11px;
    background: #ddd;
    border-radius: 3px;
    color: #666;
}

.media-manager-sidebar .tag-list li a:hover {
    color: #fff;
    text-decoration: none;
    background: #428BCA;
}

/***** 9.4 PEOPLE DIRECTORY STYLES *****/

.nav-contacts {
    margin-bottom: 20px;
}

.nav-contacts li a {
    color: #666;
    font-weight: 400;
    font-size: 13px;
}

.nav-contacts li .badge {
    background: none;
    font-weight: 500;
    color: #333;
}

.nav-contacts li.active .badge {
    color: #fff;
    background: none;
}

.people-group .media img {
    width: 45px;
}

.people-group .list-group-item {
    transition: all 0.2s ease-out 0s;
    border-radius: 3px;
    margin: 0;
    border-width: 0;
}

.people-group .media-heading {
    margin-top: 5px;
}

.people-group .media-heading,
.people-group .media-body {
    line-height: normal;
}

.pagination-contact {
    margin-top: -3px;
}

.contact-group {
    margin-top: 20px;
}

.contact-group .media img {
    width: 80px;
}

.contact-group .list-group-item {

}

.contact-group .media-heading {
    font-size: 16px;
    font-weight: 500;
}

.contact-group .media-heading small {
    margin-left: 5px;
    font-size: 13px;
    font-weight: 400;
    color: #999;
}

.contact-group .list-group-item {
    border-color: #e7e7e7;
    margin-top: 10px;
    border-radius: 3px;
}

.contact-group .list-group-item:hover {
    background-color: #fcfcfc;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

}

.contact-group .media-content {
    margin-top: 5px;
}

.contact-group .media-content .fa {
    font-size: 16px;
    vertical-align: middle;
    width: 20px;
    color: #333;
}

.contact-group .media-content ul {
    margin-top: 15px;
    margin-bottom: 0;
}

.contact-group .media-content ul > li {
    display: inline-block;
    min-width: 200px;
    margin-bottom: 5px;
}

/***** 9.5 PROFILE STYLES *****/

.img-profile {
    display: inline-block;
    max-width: 200px;
}

.social-list > li {
    padding: 5px 0;
    border-bottom: 1px dashed #eee;
}

.social-list > li > i {
    width: 16px;
    margin-right: 5px;
}

.activity-list > .media {
    border-bottom: 1px dashed #ddd;
    padding-bottom: 15px;
    font-size: 14px;
}

.activity-list > .media:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.activity-list .media-object {
    width: 28px;
    vertical-align: middle;
}

.activity-list .media-body {
    line-height: 18px;
}

.activity-list .media-body p {
    line-height: 21px;
    font-size: 13px;
}

.activity-list .media-title {
    font-size: 15px;
    margin-bottom: 0;
}

.activity-list .blog-media {
    padding-bottom: 0;
}

.activity-list .blog-media .media-object {
    width: 120px;
    margin-right: 10px;
    margin-top: 5px;
}

.activity-list .blog-media .media-title {
    margin: 0;
}

.activity-list .img-single img {
    width: 50%;
}

.uploadphoto-list {
    list-style: none;
    padding: 0;
    margin: 20px 0 0 0;
}

.uploadphoto-list li {
    width: 20%;
    float: left;
}

.uploadphoto-list li a {
    display: block;
    margin-right: 5px;
}

.follower-list {
    padding: 10px 10px 0 10px;
}

.follower-list .media {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.follower-list .media:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.follower-list .fa {
    margin-right: 5px;
    width: 16px;
    text-align: center;
}

.follower-list .media-object {
    margin-right: 10px;
}

.follower-name {
    color: #333;
    margin: 5px 0;
    font-size: 18px;
}

.events .media {
    margin-bottom: 20px;
}

.events .media-object {
    border-radius: 3px;
}

.events-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.events-list .media-body {
    font-size: 13px;
}

.event-body small {
    display: block;
}

.event-body small .fa {
    margin-right: 5px;
    width: 14px;
    text-align: center;
}

.event-body p {
    margin-top: 10px;
}

.event-title {
    margin: 0 0 5px 0;
    font-size: 16px;
    line-height: normal;
}
#densityChart {
    width: 900px !important;
    height: 600px!important;
  }
/***** 9.6 SEARCH RESULTS *****/

.nav-file-type > li > a {
    color: #666;
}

.nav-file-type > li > a > i {
    width: 16px;
    margin-right: 5px;
    color: #333;
}

.nav-file-type > li.active > a,
.nav-file-type > li.active > a:hover {
    background-color: #4e5154;
}

.nav-file-type > li.active > a > i {
    color: #fff;
}

.results-list .media {
    border-bottom: 1px solid #eee;
}

.results-list .media-object {
    width: 125px;
    margin-right: 10px;
}

.results-list .filename {
    margin: 0;
    font-size: 16px;
}

.results-list .media-body {
    line-height: 18px;
}

.pagination-search {
    margin-bottom: 10px;
    margin-top: 0;
}

/***** 9.7 SIGN IN/UP PAGE *****/

.edalem{
    transform: rotate(0.75turn);
}


body.signin {
    padding-top: 120px;
    position: relative;
}
.css-6srsfc {
    flex: 1 1 0%;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}
.login-mask-light{
    z-index: -1;
    bottom: 7%;
    max-width: 100%;
    position: absolute;
}

.login-illustration-light{
    z-index: -1;
    right: 8%;
    bottom: 13%;
    max-width: 58rem;
    position: absolute;
}
.panel-signin {
    width: 450px;
    margin: 0 auto;
    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-image: none;
    overflow: hidden;
    z-index: 1;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 40px;
    padding-bottom: 40px;
    
}

.panel-signin .panel-body {
    padding: 0px;
    border-radius: 15px;
}
.css-17yczta {
    margin: 0px 0px 0px 0.5rem;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    color: rgba(76, 78, 100, 0.87);
    line-height: 1;
    font-weight: 700;
    font-size: 25px !important;
}
.input-filed-singin{
    background: #fff;
    padding: 16.5px 14px;
    border-radius: 3px;
    width: 100%;
    outline: none;
    font-size: 14px;
  }
.input-filed-singin:focus {
    border-color: rgb(102, 108, 255) !important;
    transition-delay: 0.1s
  }
.css-1vmv954 {
    margin-bottom: 2rem;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}
.css-1fobf8d {
    margin-bottom: 1.5rem;
}
.css-15eua8d {
    margin: 0px 0px 0.375rem;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 25px;
    line-height: 1.334;
    color: rgba(76, 78, 100, 0.87);
    font-weight: 600;
    letter-spacing: 0.18px;
}

.css-4v5ttt {
    margin: 0px;
    line-height: 1.429;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 14px;
    color: rgba(76, 78, 100, 0.6);
}
.panel-signin .panel-footer {
    padding-left: 40px;
    padding-right: 40px;
}
.input-border{
    border-radius: 15px;
}
.input-group-addon{
    border-radius: 15px;
}

.btn-wd{
    background: linear-gradient(117.5deg, rgb(89, 233, 162) 20.5%, rgb(29, 209, 185) 100.2%) !important;
}
/********* 10. DASHBOARD STYLES **********/
/*****************************************/

.flotLegend {
    margin-bottom: 10px;
}

.flotLegend table tr td {
    padding-right: 5px;
}

.row-stat .panel .panel-heading {
    border-radius: 3px;
}

.panel-icon {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 3px;
    width: 60px;
    height: 60px;
    float: left;
    margin-right: 15px;
}

.panel-icon .fa {
    color: #000;
    font-size: 36px;
    padding: 12px 0 0 19px;
}

.panel-bluegreen .panel-icon .fa {
    color: #03c3c4;
}

.panel-violet .panel-icon .fa {
    color: #905dd1;
}

.panel-blue .panel-icon .fa {
    color: #30c7ec 47%!important;
}

.row-stat .md-title {
    opacity: 0.6;
    font-size: 12px;
    margin-bottom: 5px;
}

.row-stat h1 {
    margin-bottom: 0;
}

.row-stat hr {
    opacity: 0.3;
    margin: 15px 0 0 0;
    border-width: 2px;
}

.panel-icon .fa-users {
    padding: 12px 0 0 10px;
}

.panel-icon .fa-pencil {
    padding: 12px 0 0 17px;
}

.sublabel {
    font-size: 11px;
    display: block;
    margin-bottom: 3px;
}

.flotChart {
    width: 100%;
    height: 200px;
}

#bar-chart {
    height: 250px;
}

/********** 11. LEFT MENU COLLAPSE **********/
/********************************************/

.headerwrapper.collapsed .header-left {
    position: relative;
    left: -168px;
}

.headerwrapper.collapsed .header-right {
    margin-left: 61px;
}

.mainwrapper.collapsed:before {
    width: 61px;
}

.mainwrapper.collapsed .mainpanel {
    margin-left: 61px;
}

.mainwrapper.collapsed .leftpanel {
    width: 61px;
}

.mainwrapper.collapsed .leftpanel-title {
    display: none;
}

.mainwrapper.collapsed .nav {
    margin-top: 20px;
}

.mainwrapper.collapsed .nav > li > a {
    padding-left: 20px;
}

.mainwrapper.collapsed .nav > li.nav-hover:not(.active) > a {
    background-color: #f7f7f7;
}

.mainwrapper.collapsed .nav > li > a > span:not(.badge) {
    position: absolute;
    width: 190px;
    z-index: 100;
    background-color: #f7f7f7;
    border: 1px solid #e7e7e7;
    border-bottom: 0;
    top: -1px;
    left: 60px;
    padding: 12px 10px 0 10px;
    border-left: 0;
    height: 46px;
    display: none;
    border-radius: 0 3px 3px 0;
}

.mainwrapper.collapsed .nav > li.parent > a > span:not(.badge) {
    border-radius: 0 3px 0 0;
}

.mainwrapper.collapsed .nav > li > a > span.badge {
    position: absolute;
    top: 12px;
    right: -170px;
    z-index: 200;
    display: none;
}

.mainwrapper.collapsed .nav > li.active > a > span:not(.badge) {
    background-color: #428bca;
    border: 0;
    height: 44px;
    top: 0;
}

.mainwrapper.collapsed .nav > li.parent:after {
    display: none;
}

.mainwrapper.collapsed .nav > li.nav-hover > a > span {
    display: block;
}

.mainwrapper.collapsed .nav > li.nav-hover > .children {
    display: block !important;
}

.mainwrapper.collapsed .nav > li.parent .children {
    position: absolute;
    z-index: 100;
    background-color: #fff;
    left: 61px;
    width: 189px;
    border: 1px solid #e7e7e7;
    border-top: 0;
    border-left: 0;
    display: none;
}

.mainwrapper.collapsed .nav > li.parent .children > li > a {
    padding-left: 10px;
}

/********** 12. CUSTOM STYLES **********/
/***************************************/

.mt0 {
    margin-top: 0 !important;
}

.mt5 {
    margin-top: 5px !important;
}

.mt10 {
    margin-top: 10px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mr10 {
    margin-right: 10px !important;
}

.mr20 {
    margin-right: 20px !important;
}

.ml5 {
    margin-left: 5px !important;
}

.ml10 {
    margin-left: 10px !important;
}

.mr5 {
    margin-right: 5px !important;
}

.mr10 {
    margin-right: 10px !important;
}

.mr15 {
    margin-right: 15px !important;
}

.mr20 {
    margin-right: 20px !important;
}

.mr30 {
    margin-right: 30px !important;
}

.mb5 {
    margin-bottom: 5px;
}

.mb8 {
    margin-bottom: 8px;
}

.mb9 {
    margin-bottom: 9px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb15 {
    margin-bottom: 15px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb30 {
    margin-bottom: 30px;
}

.nomargin {
    margin: 0;
}

.nopadding {
    padding: 0;
}

.padding10 {
    padding: 10px;
}

.padding15 {
    padding: 15px;
}

.padding20 {
    padding: 20px;
}

.noborder {
    border: 0;
}

.height200 {
    height: 200px;
}

.height300 {
    height: 300px;
}

.width100p {
    width: 100%;
}

.width300 {
    width: 300px;
}

.text-black {
    color: #000;
}

.inline-block {
    display: inline-block;
}

.show_inside_row {
    padding: 3px;
    color: #444;
    margin-right: 5px;
    cursor: pointer;
}

.inside_show > i:before {
    content: "\f147" !important;
}

.inside_row {
    display: none;
    font-size: 12px;
    background: #f5f5f5;
}

.inside_row > td:first-child {
    padding-left: 30px;
}

.inside_opened {
    display: table-row;
}

.my-input-class {
    width: 100%;
    outline: none;
}

/********** 13. MEDIA QUERIES **********/
/***************************************/

@media screen and (max-width: 1024px) {

    body {
        width: 100%;
        overflow-x: hidden;
    }

    /* indicator that page is 1024 */
    .logo {
        position: relative;
    }

    /* dashboard */
    .row-dashboard .col-md-6 {
        float: none;
        width: auto;
    }

    /* wizard */
    .contentpanel-wizard .row .col-md-6 {
        float: none;
        width: auto;
    }
}

@media screen and (max-width: 768px) {

    body {
        position: relative;
    }

    .logo {
        position: static;
    }

    .headerwrapper .header-left,
    .headerwrapper .header-right {
        position: relative;
    }

    .headerwrapper .header-left {
        z-index: 3000;
        margin-left: -168px;
    }

    .headerwrapper .header-right {
        width: 100%;
        margin-left: 0;
    }

    .leftpanel,
    .mainwrapper:before {
        display: none;
    }

    .mainpanel {
        width: 100%;
        margin-left: 0;
    }

    .show-left .headerwrapper .header-left {
        margin-left: 0;
    }

    .show-left .headerwrapper .header-right {
        margin-left: 230px;
    }

    .show-left .mainwrapper {
        overflow: hidden;
    }

    .show-left .leftpanel,
    .show-left .mainwrapper:before {
        display: block;
    }

    .show-left .leftpanel {
        position: fixed;
        top: 60px;
        bottom: 0;
        height: 100%;
        overflow-y: auto;
    }

    .show-left .mainpanel {
        margin-left: 230px;
    }

}

@media screen and (max-width: 640px) {

    /* media manager */
    .media-options div.pull-left,
    .media-options div.pull-right {
        float: none !important;
        width: auto !important;
    }

    .media-options div.pull-left {
        margin-bottom: 20px !important;
    }

    .contentpanel-mediamanager .col-sm-9,
    .contentpanel-mediamanager .col-sm-3 {
        float: none;
        width: auto;
    }

    .media-manager-sidebar {
        padding-left: 0;
    }

    /* table */
    .dataTables_wrapper .row .col-xs-6 {
        float: none;
        width: auto;
        text-align: center;
    }

    div.dataTables_paginate {
        float: none !important;
        margin-top: 10px !important;
    }

    .panel-signin {
        margin: 20px auto;
    }

    /* wizard */
    .nav-wizard {
        background: none;
    }

    .nav-wizard > li {
        margin: 0 !important;
    }

    .nav-wizard > li > a,
    .nav-wizard > li:first-child > a,
    .nav-wizard > li:last-child > a {
        border-radius: 3px;
    }

    .nav-wizard > li > a:before,
    .nav-wizard > li > a:after {
        display: none;
    }

}

@media screen and (max-width: 480px) {

    .btn-group-notification .dropdown-menu {
        margin-right: -62px;
    }

    .headerwrapper .header-right .btn-group-notification .dropdown-menu:after {
        right: 75px;
    }

    .notfoundpanel {
        width: auto;
    }

    .notfoundpanel h3 {
        font-size: 18px;
    }

    .contentpanel {
        padding: 10px;
    }
}

@media screen and (max-width: 360px) {

    .headerwrapper .header-right .btn-group-notification .dropdown-menu {
        min-width: 340px;
        margin-right: -103px;
    }

    .headerwrapper .header-right .btn-group-messages .dropdown-menu {
        min-width: 340px;
        margin-right: -41px;
    }

    .headerwrapper .header-right .btn-group-notification .dropdown-menu:after {
        right: 115px;
    }

    .headerwrapper .header-right .btn-group-messages .dropdown-menu:after {
        right: 50px;
    }

    /* notfound */
    .notfoundpanel {
        margin: 20px;
    }

    .notfoundpanel h1 {
        font-size: 150px;
        line-height: 150px;
    }

    .notfoundpanel h3 {
        font-size: 16px;
    }

    .notfoundpanel p {
        font-size: 13px !important;
    }

    .notfoundpanel .form-control {
        width: 200px;
        float: none;
        margin: auto;
    }

    .notfoundpanel .btn {
        margin-top: 5px;
        width: 250px;
    }

    .media-options .btn-group {
        margin-bottom: 10px;
    }

    .btn-invoice .btn {
        width: 100%;
        margin-bottom: 10px;
    }

    .fc-header tr td {
        display: table-row;
        width: 100%;
    }

    .fc-header-center {
        text-align: left !important;
    }

    .fc-header-title {
        text-align: left;
        margin-bottom: 10px;
    }

    .panel-signin {
        width: auto;
        margin: 20px;
    }

    .panel-signin .panel-footer {
        padding-left: 20px;
        padding-right: 20px;
    }

    .panel-signin .panel-footer .btn {
        font-size: 13px;
    }
}

@media screen and (max-width: 320px) {

    .headerwrapper .header-right .btn-group-notification .dropdown-menu {
        min-width: 300px;
        margin-right: -103px;
    }

    .headerwrapper .header-right .btn-group-messages .dropdown-menu {
        min-width: 300px;
        margin-right: -41px;
    }

    .headerwrapper .header-right .btn-group-notification .dropdown-menu:after {
        right: 115px;
    }

    .headerwrapper .header-right .btn-group-messages .dropdown-menu:after {
        right: 50px;
    }

    .panel-signin .panel-footer .btn {
        font-size: 11px;
    }

    .panel-signin .panel-body {
        padding: 30px 20px;
    }

}

.creatpanel{
    margin-top: 20px;
}

.log_block {
    width: 100%;
    height: 400px;
    background: #383838;
    padding: 5px;
    color: #bdbdbd;
}

.log_block_content {
    width: 100%;
    padding: 15px;
    height: 100%;
    overflow-y: scroll;
}

.log_block p {
    margin: 0;
    color: #bdbdbd;
    padding: 5px;
    border-bottom: 1px dashed #616161;
    cursor: default;
    user-select: none;
}

.panel-cap {
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(255, 255, 255, 0.5);
    top: 0;
    left: 0;
    z-index: 1;
    display: none;
}

.panel-cap .fa {
    font-size: 35px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.panel-sm {
    margin-bottom: 5px;
}

.panel-sm .panel-heading {
    padding: 10px;
}

.panel-sm .panel-heading .panel-title {
    font-size: 13px;
}

.panel-sm .panel-body, .panel-sm .panel-footer {
    padding: 10px;
}

.order_row {
    font-weight: bold;
}

.flexbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.packs_block {
    padding: 10px;
}

.packs_block p {
    margin: 0 5px;
}

.packs_table, .tags_table {
    position: relative;
}

.table_cap {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.5);
    position: absolute;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 3;
}

.table_cap > span {
    background: rgba(66, 139, 202, 0.9);
    color: #fff;
    padding: 5px 15px;
    border-radius: 6px;
}

.form_in_progress .table_cap {
    display: flex;
}

#tourTagsAddTable {
    display: none;
}

td.actions_td a {
    display: inline-block;
    padding: 0 8px 0 5px;
}

td.actions_td a.disabled {
    cursor: default;
    color: #ccc;
    opacity: 0.5;
}

td.actions_td a.green_action {
    color: #12bb12;
}

td.actions_td a > i.fa {
    font-size: 17px;
}

.actions_wrapper {
    height: 69px;
}

.actions_wrapper > div.fixed_actions {
    width: 100%;
    position: fixed;
    top: 73px;
    left: 0;
    padding-left: 260px;
    padding-top: 13px;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9;
    transition: background 0.5s ease;
}

.actions_wrapper.fixed_actions > .form-group {
    margin: 0;
}
.actions_wrapper_main {
    height: 69px;
}

.actions_wrapper_main > div.fixed_actions {
    width: 100%;
    position: fixed;
    top: 73px;
    left: 0;
    padding-left: 260px;
    padding-top: 13px;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9;
    transition: background 0.5s ease;
}

.actions_wrapper_main.fixed_actions > .form-group {
    margin: 0;
}
.actions_td input {
    width: 20px;
    height: 20px;
    vertical-align: inherit;
    display: inline-block;
    margin: 0 8px 0 5px;
}

.flying_anime {
    animation: flying 2s infinite;
}

@keyframes flying {
    0% {
        transform: scaleY(1);
    }
    50% {
        transform: scale(0.6, 0.4);
    }
    100% {
        transform: scaleY(1);
    }
}

.pickup_time_input {
    width: 65px !important;
}

.pickup-control {
    width: 90px !important;
}

.order_cancel_tip {
    position: absolute;
    right: 1px;
    color: #fff;
    background: red;
    padding: 0 5px;
    border-radius: 10px;
}

.table .order_cancel_tip {
    position: static;
    margin-right: 3px;
}

.table_button {
    width: 18px;
    height: 18px;
    display: inline-block;
    background: #428bca;
    color: #fff !important;
    padding: 1px 4px;
    cursor: pointer;
    font-size: 12px;
    text-decoration: none;
    border-radius: 4px;
}

.table_button.error_button {
    background: #ce2727;
}

.table_button.success_button {
    background: #00c300;
}

.action_column {
    width: 100px;
}

.form_tips {
    display: block;
    text-align: right;
}

.small_th {
    font-size: 11px;
    font-weight: normal;
}

.fc-event.hidden-session-event {
    display: none;
}

.fc-event.tour-event-trigger {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.toggle-events {
    display: block;
    width: 14px;
    text-align: center;
    padding: 0 3px;
    background: #fff;
    color: #000;
    border-radius: 3px;
}

.fc-scroller {
    height: auto !important;
}

.fc-basic-view .fc-body .fc-row {
    min-height: 70px !important;
    height: auto !important;
}

:disabled {
    opacity: 0.5 !important;
}

.transfer-det-wrapper {
    padding: 20px;
    background: #f0fff6;
    margin-bottom: 20px;
}

.transfer-det-wrapper.with-error {
    background: #ffe6e6;
}

.modal-full {
    width: 95%;
}

.search-hotel {
    margin: 10px 10px 10px 0;

}

.gm-style .search-hotel {
    display: inline-block !important;
}


.pac-container {
    z-index: 9999;
}


#trInfoModalTitle {
    font-size: 16px;
    font-weight: bold;
    background: #ececec;
    padding: 10px;
}

.toggled .toggle-agents-places i {
    transform: rotate(90deg);
}

.agents_tag_row {
    display: none;
}

.toggled + .agents_tag_row {
    display: table-row;
}

.agents_tag_table {
    margin: 0 0 0 auto;
    width: auto;
}

.agents_agent_select {
    width: 100%;
}

.agent_select_th {
    width: 200px;
}

.agent_count_th {
    width: 100px;
}

.agent_actions_th {
    width: 105px;
}

.exist_agent_row_template {
    display: none;
}

#tourSessionTable > thead > tr > th:first-of-type {
    width: 170px;
}

.smile-radios {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.smile-radios .smile-radio {
    width: 30px;
    height: 30px;
    overflow: hidden;
    position: relative;
    margin-right: 5px;
}

.smile-radios .smile-radio > input {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    z-index: 2;
    opacity: 0 !important;
    cursor: pointer;
}

.smile-radios .smile-radio .radio-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    background: transparent url('../images/smile-rating.png') no-repeat;
    background-size: 60px 90px;
    z-index: 1;
}

.smile-radios .smile-radio-0 > input:not(checked) + .radio-image {
    background-position: -30px -60px;
}

.smile-radios .smile-radio-0 > input:checked + .radio-image {
    background-position: 0 -60px;
}

.smile-radios .smile-radio-1 > input:not(checked) + .radio-image {
    background-position: -30px -30px;
}

.smile-radios .smile-radio-1 > input:checked + .radio-image {
    background-position: 0 -30px;
}

.smile-radios .smile-radio-2 > input:not(checked) + .radio-image {
    background-position: -30px 0;
}

.smile-radios .smile-radio-2 > input:checked + .radio-image {
    background-position: 0 0;
}

.package-th {
    width: calc(100% - 400px);
}

.therapist-th {
    width: 200px;
}

.therapist-th-sm {
    width: 150px;
}

.total-tr {
    font-size: 16px;
    text-transform: uppercase;
}

.total-tr td:first-of-type, .total-tr th:first-of-type {
    text-align: right;
}

.hotstones-th {
    width: 90px;
}

.rating-th {
    width: 120px;
}

.screen-th {
    width: 200px;
}

.actions-th {
    width: 50px;
}

.package_row td {
    vertical-align: middle !important;
}

.package_row select {
    width: 100%;
}

.package_row {
    position: relative;
}

.modal-content .modal-cap {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}

.in-progress .modal-cap {
    display: flex;
}

.avatar-wrapper {
    width: 40px;
    height: 40px;
    position: relative;
    background: #ccc;
}

.avatar-wrapper > img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.smile-block {
    overflow: hidden;
    width: 30px;
    height: 30px;
    margin: 0;
    position: relative;
}

.smile-block img {
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
}

.smile-block.smile-bad img {
    top: -60px;
}

.smile-block.smile-good img {
    top: -30px;
}

.packs_name, .new_pack {
    max-width: 260px;
}
table.fold-table {
    width: 100%;
    margin-bottom: 2px;
  }
table.fold-table > tbody > tr.view td, table.fold-table > tbody > tr.view th {
    cursor: pointer;
  }
  table.fold-table > tbody > tr.view td:first-child,
  table.fold-table > tbody > tr.view th:first-child {
    position: relative;
    padding-left: 20px;
  }
  table.fold-table > tbody > tr.view td:first-child:before,
  table.fold-table > tbody > tr.view th:first-child:before {
    position: absolute;
    top: 50%;
    left: 5px;
    width: 9px;
    height: 16px;
    margin-top: -8px;
    font: 16px fontawesome;
    color: #eee;
    content: "";
    transition: all 0.3s ease;
  }
  table.fold-table > tbody > tr.view:nth-child(4n-1) {
    background: #eee;
  }
  table.fold-table > tbody > tr.view:hover {
    background: rgb(210, 208, 208);
  }
  table.fold-table > tbody > tr.view.open {
    background: rgb(149, 149, 149);
    color: #333;
  }
  table.fold-table > tbody > tr.view.open td:first-child:before, table.fold-table > tbody > tr.view.open th:first-child:before {
    transform: rotate(-180deg);
    color: #333;
  }
  table.fold-table > tbody > tr.fold {
    display: none;
  }
  table.fold-table > tbody > tr.fold.open {
    display: table-row;
  }
  
  .fold-content {
    
  }
  .fold-content h3 {
    margin-top: 0;
  }
  .fold-content > table {
    border: 2px solid #ccc;
  }
  .fold-content > table > tbody tr:nth-child(even) {
    background: #eee;
  }

  .fc-title {
    white-space: normal;
    font-weight: 700;
}

.danger{
    background: red !important;
}

.filter_order_cancel{
    display: flex;
    justify-content:space-between;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 20px;
}

.galery_container {
    display: flex;
    width: 100%;
    margin-top: 15px;
}
.gallery{
    position: relative;
}
.gallery-box{
    margin-right: 10px;
}
.del_btn{
   position: absolute;  
   right: 15px;
   top: 5px;
   background-color: red;
   color: #fff;
   border-radius: 5px;
   border: none;
}
.hotel_room_details_dropdown {
    width: 100%;
    max-width: 150px;
}
.widthbtn {
    width: 100%;
  }
  .containergreattransfer {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .containergreattransfer table {
    width: 49%; /* adjust this value according to your needs */
  }

  .map-canvas {
    width: 49%; /* adjust this value according to your needs */
    height: 400px; /* or any desired height */
  }
  .containergreattransfer .selected-hotel {
    background-color: #f0ad4e; /* You can customize the color here */
  }
  .program-content {
    display: flex;
    padding-top: 10px;
}

.program-table {
    width: 55%;
    margin-right: 2%;
}

.map-container {
    width: 40%;
}
.pack_info {
    display: flex;
    flex-direction: column;
}

.pack_info div {
    margin-bottom: 5px;
}
.selected-row {
    background-color: #cccccc;
}
.draggable-item {
    width: 100px;
    height: 50px;
    background-color: lightblue;
    margin: 5px;
    padding: 10px;
    cursor: move;
}

.droppable-area {
    width: 300px;
    height: 300px;
    background-color: lightgreen;
    margin: 10px;
    padding: 10px;
}

.custom-table-program {
    border-collapse: collapse;
    width: 100%;
    text-align: center;
}

.custom-table-program th,
.custom-table-program td {
    border: 1px solid #ddd;
    padding: 8px;
}

.custom-table-program th {
    background-color: #f2f2f2;
    font-weight: bold;
}

.custom-table-program tr:nth-child(even) {
    background-color: #f2f2f2;
}

.custom-table-program tr:hover {
    background-color: #ddd;
}

.main-block {
    display: flex;
}

.table-block {
    width: 45%;
    margin-right: 2%;
}
.new-great-table-block {
    width: 55%;
    margin-top: 0px;
    
}
.program-container{
    margin-top: 67px;
    margin-bottom: 70px;
}
.table-wrapper {
    /* overflow-y: auto; */
    max-height: 500px;
}

.select-container {
    width: 150px; /* Set the desired width */
    overflow: hidden; /* Hide the overflowing content */
}

.goback{
    display: block;
    background-color: #3d72e4fb;
    color: #fff;
    margin-top: 10px;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
}
#response-message {
    display: none;
    padding: 12px 20px;
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    max-width: 300px;
    margin: 20px auto;
}

#response-message.success {

    background-color: #3CB371;
    color: #fff;
}

#response-message.error {

    background-color: #F44336;
    color: #fff;
}

#message-div {
    display: none;
    padding: 12px 20px;
    font-family: Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    max-width: 300px;
    margin: 20px auto;
}

#maparravile{
    width: 100%;
    height: 400px;
}
#mapregion{
    width: 100%;
    height: 400px;
}
.button-update-point{
    margin-top: 15px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
  }
  
  .switch input {
    display: none;
  }
  
  .slideronoff {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    border-radius: 34px;
    cursor: pointer;
    transition: all 0.4s;
  }
  
  .slideronoff:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    border-radius: 50%;
    transition: all 0.4s;
  }
  
  input:checked + .slideronoff {
    background-color: #2196F3;
  }
  
  input:checked + .slideronoff:before {
    transform: translateX(26px);
  }
  .hidden-checkbox {
    display: none;
}

#loader {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s opacity;
  }
  
  .spinner {
    border: 16px solid #f3f3f3; 
    border-top: 16px solid #3498db; 
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
  .has-error > .invalid-feedback {
    display: block !important;
    color: #dc3545;
}
.dropdown-menu a[data-value="0"] { color: red; }
.dropdown-menu a[data-value="1"] { color: orange; }
.dropdown-menu a[data-value="2"] { color: green; }

.dropdown .btn{
    width: 80px;
    padding: 2px 2px 2px 2px;
}

.logo h3 a {
    text-decoration: none;
}
.fw-700 {
    margin: 0px 0px 0px 0.5rem;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 24px;
    color: rgba(76, 78, 100, 0.87);
    font-weight: 700;
    line-height: 1.2;
    transition: opacity 0.25s ease-in-out 0s, margin 0.25s ease-in-out 0s;
    opacity: 1;
}
.btn-highlight-add-date a{
    display: inline-flex;
    -webkit-box-align: center;
    justify-content: left;
    align-items: center;
    -webkit-box-pack: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    letter-spacing: 0.4px;
    font-size: 12px;
    text-transform: uppercase;
    min-width: 64px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    background-color:rgb(255, 255, 255);
    color: #41464d;
    width: 100%;
    font-weight: 500;
    border-radius: 8px;
    line-height: 1.715;
    box-shadow: rgba(76, 78, 100, 0.42) 0px 4px 8px -4px;
    padding: 37px 47px;

}
.add-date-static{
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
    margin-top: 20px;
}

.btn-highlight {
        display: inline-flex;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: center;
        justify-content: center;
        position: relative;
        box-sizing: border-box;
        -webkit-tap-highlight-color: transparent;
        outline: 0px;
        border: 0px;
        margin: 0px;
        cursor: pointer;
        user-select: none;
        vertical-align: middle;
        appearance: none;
        text-decoration: none;
        letter-spacing: 0.4px;
        font-size: 12px;
        text-transform: uppercase;
        min-width: 64px;
        transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
        color: rgb(255, 255, 255);
        background-color: rgb(102, 108, 255);
        width: 100%;
        font-weight: 500;
        border-radius: 8px;
        line-height: 1.715;
        box-shadow: rgba(76, 78, 100, 0.42) 0px 4px 8px -4px;
        padding: 12px 22px;
    
}
.btn-highlight:hover,
.btn-highlight:focus,
.btn-highlight:active{
    color: #fff;
}
.agent-container{
    display: flex;
}

.agency-list{
    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-image: none;
    overflow: hidden;
    
}
.agentblock{
    display: flex;
}
.agent-layot{
    width: 50%;
}
.css-1p130pp{
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    padding: 15px;
}
.css-11qjisw{
    flex: 1 1 auto;
}

.css-1d6hsi8 {
    line-height: 1.6;
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 0.15px;
}
.agentCardContent {
    padding: 5px;
}
.agent-cardContentul {
    list-style: none;
    margin: 0px;
    padding: 8px 0px;
    position: relative;
}

.agent-cardItem {
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
}
.agent-cardItem{
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
    margin-bottom: 5px;
    
}
.agent-cardButton {
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px;
    border-radius: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    color: inherit;
    display: flex;
    -webkit-box-flex: 1;
    flex-grow: 1;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    text-decoration: none;
    min-width: 0px;
    box-sizing: border-box;
    text-align: left;
    padding: 8px 16px;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    background-color: rgba(102, 108, 255, 0.08);
}
.MuiListItemAvatar {
    flex-shrink: 0;
    min-width: 0px;
    margin-right: 5px;
    
}
.agent-cardAvatar {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1.25rem;
    line-height: 1;
    border-radius: 50%;
    overflow: hidden;
    user-select: none;
    height: 32px;
    width: 32px;
}
.MuiAvatar-img {
    width: 100%;
    height: 100%;
    text-align: center;
    object-fit: cover;
    color: transparent;
    text-indent: 10000px;
}
.MuiListItemText {
    flex: 1 1 auto;
    min-width: 0px;
    margin-top: 4px;
    margin-bottom: 4px;
}
.agent-cardText {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    color: rgba(76, 78, 100, 0.87);
    display: block;
}
.MuiTouchRipple {
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    z-index: 0;
    inset: 0px;
    border-radius: inherit;
}


    /* choose agent list booking */
    .agent-booking {
        display: none;
    }

.css-1wra7nn {
    position: fixed;
    inset: 0px;
    z-index: 1200;
   
}

.css-t36csh {
    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    box-shadow: rgba(76, 78, 100, 0.2) 0px 8px 10px -5px, rgba(76, 78, 100, 0.14) 0px 16px 24px 2px, rgba(76, 78, 100, 0.12) 0px 6px 30px 5px;
    background-image: none;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    height: 100%;
    flex: 1 0 auto;
    z-index: 1200;
    position: fixed;
    top: 0px;
    outline: 0px;
    right: 0px;
    
}
.css-q9uib0 {
    position: fixed;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    inset: 0px;
    -webkit-tap-highlight-color: transparent;
    background-color: rgba(76, 78, 100, 0.5);
    z-index: -1;
  
}
.css-1wra7nn .MuiDrawer-paper {
    width: 400px;
}
.css-1b128lj {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    background-color: rgb(247, 247, 249);
    padding: 0.75rem 0.81375rem 0.75rem 1.31375rem;
}
.css-16aapvh {
    font-size: 20px;
}
.css-70qvj9 {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}

.css-5yjfi8 {
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    text-align: center;
    flex: 0 0 auto;
    border-radius: 50%;
    overflow: visible;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    padding: 5px;
    font-size: 1.125rem;
    color: rgba(76, 78, 100, 0.87);
}
.css-w0pj6f {
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    z-index: 0;
    inset: 0px;
    border-radius: inherit;
}
.css-1wq2p1x {
    padding: 1.25rem 1.5rem;
    background-color: #fff;
}
.css-x96pmf {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    min-width: 0px;
    padding: 0px;
    margin: 0px 0px 1.5rem;
    border: 0px;
    vertical-align: top;
    width: 100%;
}
.css-i44wyl {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    min-width: 0px;
    padding: 0px;
    margin: 0px;
    border: 0px;
    vertical-align: top;
}
.css-rdnw9o {
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 16px;
    line-height: 15px;
    padding: 0px;
    display: block;
    transform-origin: left top;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 24px);
    position: absolute;
    left: 0px;
    top: 0px;
    transform: translate(14px, 16px) scale(1);
    transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;
    z-index: 1;
    pointer-events: none;
    color: rgba(76, 78, 100, 0.6);
}
.css-na8nbx {
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.4375em;
    color: rgba(76, 78, 100, 0.87);
    box-sizing: border-box;
    cursor: text;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    border-radius: 8px;
}
.css-pv9vr9 {
    font: inherit;
    letter-spacing: inherit;
    color: currentcolor;
    border: 0px;
    box-sizing: content-box;
    background: none;
    height: 1.4375em;
    margin: 0px;
    -webkit-tap-highlight-color: transparent;
    display: block;
    min-width: 0px;
    width: 100%;
    animation-name: mui-auto-fill-cancel;
    animation-duration: 10ms;
    padding: 16.5px 14px;
}
.css-na8nbx .MuiOutlinedInput-notchedOutline {
    border-color: rgba(76, 78, 100, 0.22);
}
.css-igs3ac {
    text-align: left;
    position: absolute;
    inset: -5px 0px 0px;
    margin: 0px;
    padding: 0px 8px;
    pointer-events: none;
    border-radius: inherit;
    border-style: solid;
    border-width: 1px;
    overflow: hidden;
    min-width: 0%;
    border-color: rgba(0, 0, 0, 0.23);
}
.css-yjsfm1 {
    float: unset;
    width: auto;
    overflow: hidden;
    display: block;
    padding: 0px;
    height: 11px;
    font-size: 0.75em;
    visibility: hidden;
    max-width: 0.01px;
    transition: max-width 50ms cubic-bezier(0, 0, 0.2, 1) 0ms;
    white-space: nowrap;
}
.css-yjsfm1 > span {
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    opacity: 0;
    visibility: visible;
}
.css-70qvj9 {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.css-13ukzp9 {
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px 1rem 0px 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    letter-spacing: 0.4px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.9375rem;
    text-transform: uppercase;
    min-width: 64px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: rgb(255, 255, 255);
    background-color: rgb(102, 108, 255);
    font-weight: 500;
    border-radius: 8px;
    box-shadow: rgba(76, 78, 100, 0.42) 0px 4px 8px -4px;
    line-height: 1.734;
    padding: 0.5rem 1.625rem;
}
.css-qysm9w {
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    letter-spacing: 0.4px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.9375rem;
    text-transform: uppercase;
    min-width: 64px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border: 1px solid rgba(109, 120, 141, 0.5);
    color: rgb(109, 120, 141);
    font-weight: 500;
    border-radius: 8px;
    line-height: 1.6;
    padding: 0.5rem 1.5625rem;
}

.css-l7y06g {
    margin: 12px 0px 10px;
    line-height: 1.429;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 12px;
    color: rgba(76, 78, 100, 0.6);
    text-transform: uppercase;
}

 /* checkboxes */

p, .new {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 12px;
    line-height: 1.5;
    color: rgba(76, 78, 100, 0.87);
    cursor: pointer;
  }
  
  .new {
    margin-bottom: 5px;
  }
  
  /* Hide the default checkboxes inside the 'new' div that jQuery adds for us */
  .new input[type="checkbox"] {
    opacity: 0;
  }
  
  .new input[type="radio"] {
    opacity: 0;
  }
  
  /* jQuery adds this span for us which we style to look like a box */
  .check-box {
    width: 15px;
    height: 15px;
    background: #ccc;
    display: inline-block;
    cursor: pointer;
    margin-right: 10px;
    position: relative;
    top: 3px;
  }
  
  /* When someone clicks our new box, add or remove the tick which has been created using some CSS */
  [type=checkbox]:checked + .check-box:before, [type=radio]:checked + .check-box:before {
    content: '';
    display: block;
    width: 5px;
    height: 8px;
    margin-left: 5px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    transition: 0.1s;
  }
  /* And change the background colour */
  [type=checkbox]:checked + .check-box, [type=radio]:checked + .check-box {
    background-color: rgb(102, 108, 255);
    transition: 0.5s;
  }

  .layout-page-content{
    width: 100%;
    padding: 5px;
    transition: padding 0.25s ease-in-out 0s;
    margin-left: auto;
    margin-right: auto;
}
.app-cards-booking{
    height: 450px;
    position: relative;
    padding-top: 10px;
    padding-bottom: 15px;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
}
.tableorders{
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
    padding: 10px;
}

.table thead>tr>th{
    border-color: #dddddd54;
}
.table tbody>tr>td{
    border-color: #dddddd54;
}
.table-striped>tbody>tr:nth-child(2n+1)>td{
    background-color: #fff;
}
.table-option{
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
    padding: 10px;
}
.fa-calendar{
    color: rgb(102, 108, 255);
}
.fa-pencil{
    color: rgb(102, 108, 255);
}
.fa-trash-o{
    color: rgb(102, 108, 255);
}
.fa-paper-plane-o{
    color: rgb(102, 108, 255);
    font-size: 20px;
    margin-right: 15px;
}
.fa-download{
    color: rgb(102, 108, 255);
    font-size: 20x;
    margin-right: 15px;
}
.ft-icon{
    font-size: 20px;
}
.faplusicon{
    color: rgb(102, 108, 255);
    font-size: 25px;
    margin-left: 10px;
}

.success-air-ticket{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(114, 225, 40);
    background-color: rgba(114, 225, 40, 0.12)
}
.warning-air-ticket{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(253, 181, 40);
    background-color: rgba(253, 181, 40, 0.12);
}
.danger-air-ticket{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(255, 77, 73);
    background-color: rgba(255, 77, 73, 0.12);
}
.success-visa{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(114, 225, 40);
    background-color: rgba(114, 225, 40, 0.12)
}
.warning-visa{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(253, 181, 40);
    background-color: rgba(253, 181, 40, 0.12);
}
.danger-visa{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 4px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(255, 77, 73);
    background-color: rgba(255, 77, 73, 0.12);
}
.danger-visa-denied{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 4px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(109, 120, 141);
    background-color: rgba(109, 120, 141, 0.12);
}

.more-detal{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    padding: 10px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    vertical-align: middle;
    box-sizing: border-box;
    background-color: transparent;
    border: 1px solid rgba(102, 108, 255, 0.7);
    color: rgb(102, 108, 255);
}
.more-detal-cancel{
    max-width: 100%;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    padding: 10px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    vertical-align: middle;
    box-sizing: border-box;
    background-color: transparent;
    border: 1px solid rgba(255, 77, 73, 0.7);
    color: rgb(255, 77, 73);
}

.more-detal-program{

    margin-left: 10px;
    max-width: 100%;
    font-size: 16px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    padding: 16px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    vertical-align: middle;
    box-sizing: border-box;
    background-color: transparent;
    border: 1px solid rgba(102, 108, 255, 0.7);
    color: rgb(102, 108, 255);
}

.tourname-colapse{
    display: flex;
    align-items: center;
}
.visa-send{
    width: 80px;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 22px;
    padding: 10px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    vertical-align: middle;
    box-sizing: border-box;
    background-color: transparent;
    border: 1px solid rgba(102, 108, 255, 0.7);
    color: rgb(102, 108, 255);
    
}
.pdf-link{
    margin-bottom: 8px;
}
.dropdown-visa{
    margin-bottom: 8px;
}
.search-tour-block{
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    padding-left: 0px;
    padding-right: 10px;
    border-radius: 8px;
    margin-bottom: 5px;
}
.search-tour-lable{
    background-color: transparent !important;
}
.search-tour-input{
    background-color: #fff !important;
    padding: 12px 10px !important;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
}
.search-tour-block .select-block{
  margin-top: 15px;
  width: 400px;
}
.search-tour-block .dropdown{
    width: 100% !important;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    padding: 8px 8px !important;
}
.search-tour-block .bs-placeholder{
    background-color: #fff !important;
    padding: 8px 8px !important;
}
.main-select-block .dropdown{
    width: 100% !important;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    padding: 8px 8px !important;
}
.main-select-block .bs-placeholder{
    background-color: #fff !important;
    padding: 8px 8px !important;
}

.main-select-block .btn-group>.btn:first-child{
    height: 55px;
}
  .cards-date-item{
    display:flex; 
    justify-content: space-around;
    margin:5px; 
    padding:5px; 
    width: 100%; 
  }
  .btn-success-for-booking{
    background-color: rgb(114, 225, 40);
    color: #fff;
    box-sizing: border-box;
    vertical-align: middle;
  }
  .btn-success-for-booking:hover{
    background-color: rgb(71, 161, 11);
    color: #fff;
  }
  .btn-danger-for-booking{
    background-color: rgb(255, 77, 73);
    color: #fff;
    box-sizing: border-box;
    vertical-align: middle;
  }
  .alldatesbtn{
    position: absolute;
    bottom: 20px;
    right: 20px;
    background-color: rgb(102, 108, 255);
  }
  .alldatesbtn:hover{
    background-color: rgb(90, 95, 224);
  }

  .card-body{
    margin-left: 25px;
    margin-right: 25px;
    
  }
  .card-title{
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 0.15px;
    font-weight: 400;
    font-size: 13px;
    line-height: 1.5;
    border-radius: 4px;
    color: rgb(102, 108, 255);
    
  }
/*booking form style */
  .app-form{
    /* display: flex; */
    position: relative;
    padding-top: 15px;
    padding-bottom: 15px;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
}


.progress-container {
    display: none;
    align-items: center;
    justify-content: center;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.4);
}
  
.circular-progress-bar {
    position: relative;
    margin: auto;
    width: 120px;
    height: 120px;
}
  
.progress-ring__circle {
    transition: 0.35s stroke-dashoffset;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
}
  
.progress-label {
    position: absolute;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 14px;
    color: white;
}

  
.myContainer {
    max-width: 960px;
    margin: 0 auto;
  }
  
  .verticalMargin {
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
  
  .styledCard {
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 1.5rem;
  }
  
  .cardContent {
    padding: 1.5rem;
  }
  
  .cardHeader {
    margin-bottom: 1rem;
  }
  
  .flexRow {
    display: flex;
    flex-wrap: wrap;
  }
  
  .flexColumn {
    flex: 1 0 50%;
    padding: 0.5rem;
  }
  
  .bottomMargin {
    margin-bottom: 1rem;
  }
  
  .inputLabel {
    display: block;
    margin-bottom: 0.5rem;
  }
  
  .inputGroup {
    display: flex;
    align-items: center;
  }
  
  .inputGroupText {
    display: inline-block;
    padding-right: 1rem;
  }
  
  .textInput {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
  }
  
  .formSelect {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
  }
  
  .fullWidthButton {
    display: block;
    width: 100%;
    padding: 1rem;
    color: #fff;
    background-color: #007bff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
  }
  
  .fullWidthButton:disabled {
    background-color: #ccc;
  }
  .flight-info {
    border: 1px solid #ccc;
    padding: 15px;
    margin-bottom: 20px;
}

.flight-info h2 {
    margin: 0;
    font-size: 24px;
    color: #333;
}

.flight-info p {
    margin: 5px 0;
    font-size: 16px;
    color: #666;
}
.modal-content {
    background-color: #f9f9f9;
}

.modal-header {
    border-bottom: 1px solid #dee2e6;
    text-align: center;
}

.modal-footer {
    border-top: 1px solid #dee2e6;
}
/* Modal styles */
#successModal .modal-dialog {
    max-width: 400px;
    margin-top: 3rem;
    margin-left: auto;
    margin-right: auto;
}

#successModal .modal-content {
    background-color: #f8f9fa;
    border: none;
    border-radius: 0.3rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

#successModal .modal-header {
    border-bottom: none;
    padding: 1.5rem;
}

#successModal .modal-title {
    color: #007bff;
    font-weight: bold;
}

#successModal .close {
    color: #6c757d;
    opacity: 1;
}

#successModal .modal-body {
    padding: 1.5rem;
    color: #6c757d;
    text-align: center;
}

#successModal .checkmark-circle {
    width: 100px;
    height: 100px;
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 1rem;
}

#successModal .checkmark-circle .background {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #28a745;
    position: absolute;
}

#successModal .checkmark-circle .checkmark {
    border-radius: 5px;
}

#successModal .checkmark-circle .checkmark.draw:after {
    -webkit-animation-delay: 300ms;
    -moz-animation-delay: 300ms;
    animation-delay: 300ms;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease;
    -webkit-animation-name: checkmark;
    -moz-animation-name: checkmark;
    animation-name: checkmark;
    -webkit-transform: scaleX(-1) rotate(135deg);
    -moz-transform: scaleX(-1) rotate(135deg);
    -ms-transform: scaleX(-1) rotate(135deg);
    -o-transform: scaleX(-1) rotate(135deg);
    transform: scaleX(-1) rotate(135deg);
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

#successModal .checkmark-circle .checkmark:after {
    opacity: 1;
    height: 50px;
    width: 25px;
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
    border-right: 8px solid #fff;
    border-top: 8px solid #fff;
    border-radius: 2.5px !important;
    content: '';
    left: 20px;
    top: 45px;
    position: absolute;
}


@-webkit-keyframes checkmark {
    0% {
        height: 0;
        width: 0;
        opacity: 1;
    }
    20% {
        height: 0;
        width: 25px;
        opacity: 1;
    }
    40% {
        height: 50px;
        width: 25px;
        opacity: 1;
    }
    100% {
        height: 50px;
        width: 25px;
        opacity: 1;
    }
}
@-moz-keyframes checkmark {
    0% {
        height: 0;
        width: 0;
        opacity: 1;
    }
    20% {
        height: 0;
        width: 25px;
        opacity: 1;
    }
    40% {
        height: 50px;
        width: 25px;
        opacity: 1;
    }
    100% {
        height: 50px;
        width: 25px;
        opacity: 1;
    }
}
@keyframes checkmark {
    0% {
        height: 0;
        width: 0;
        opacity: 1;
    }
    20% {
        height: 0;
        width: 25px;
        opacity: 1;
    }
    40% {
        height: 50px;
        width: 25px;
        opacity: 1;
    }
    100% {
        height: 50px;
        width: 25px;
        opacity: 1;
    }
}
/* Modal styles */
#failureModal .modal-dialog {
    max-width: 400px;
    margin-top: 3rem;
    margin-left: auto;
    margin-right: auto;
}

#failureModal .modal-content {
    background-color: #f8f9fa;
    border: none;
    border-radius: 0.3rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

#failureModal .modal-header {
    border-bottom: none;
    padding: 1.5rem;
}

#failureModal .modal-title {
    color: #007bff;
    font-weight: bold;
}

#failureModal .close {
    color: #6c757d;
    opacity: 1;
}

#failureModal .modal-body {
    padding: 1.5rem;
    color: #6c757d;
    text-align: center;
}

#failureModal .checkmark-circle {
    width: 100px;
    height: 100px;
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 1rem;
}

#failureModal .checkmark-circle .background {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: rgb(255, 77, 73);
    position: absolute;
}

#failureModal .checkmark-circle .checkmark {
    border-radius: 5px;
}

#failureModal .checkmark-circle .checkmark::after,
#failureModal .checkmark-circle .checkmark::before {
    content: '';
    position: absolute;
    height: 60px;
    width: 8px;
    background-color: #fff;
    border-radius: 2.5px;
    left: calc(50% - 4px);
    top: calc(50% - 30px);
}

#failureModal .checkmark-circle .checkmark::after {
    transform: rotate(45deg);
}

#failureModal .checkmark-circle .checkmark::before {
    transform: rotate(-45deg);
}


.salons-container{
    margin-left: auto;
    margin-right: auto;
}
.ui-datepicker .weekend .ui-state-default {
    background: #FEA;
  }
  .tour-image-cover, .tour-calendar-cover {
    height: 100%;
}
.tour-image-cover {
    background-size: cover;
    background-position: center;
}

.card {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.tour-card-block {
    flex-grow: 1;
    display: flex;
    justify-content: center;
}
.tour-image-block, .tour-calendar-block { /* Add this to your CSS */
    display: flex;
    flex-direction: column;
}
.tour-image-cap, .tour-calendar-cap {
    flex-grow: 1;
}

.tour-card-container{
  max-width: 400px;

}
.tour-datepicker {
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0;
    width: 100%;
}
/* .tour-calendar-cap{
box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0
} */
.tour-calendar-cap .ui-datepicker{
    width: 100% !important;
}
.ui-datepicker-calendar td {
    width: 53px !important;
    height: 45px !important;
}

/* Change the color of the active date */
.tour-calendar-cap  .ui-state-active {
    color: rgb(102, 108, 255) !important;
}

/* Change the hover background color of the active date */
.tour-calendar-cap .ui-state-active:hover {
    background-color: rgba(102, 108, 255, 0.12) !important;
}
/* Change the color of active dates */
.tour-calendar-cap .ui-datepicker-calendar .date-with-count a {
    font-size: 16px;
    color: rgb(102, 108, 255) !important;
}

/* Change the background color of active dates on hover */
.tour-calendar-cap .ui-datepicker-calendar .date-with-count a:hover {
    background-color: rgba(102, 108, 255, 0.12) !important;
}
.tour-calendar-cap .ui-state-disabled .ui-state-default{
    font-size: 16px !important;
}
.tour-title{
    font-size: 18px;
}
.seat-block{
   display: flex;

   justify-content: center;
   align-items: center;
   width: 100%;
}
.seat-circle {
    width: 7px;
    height: 7px;
    margin-left: 4px;
}
.seat-count{
    font-size: 9px;
    color: #2f363d;
}
.date-info {
    display: block;
    align-items: center;
}
.date-info .fa-users{
  font-size: 9px;
  color: #2f363d;
}

.tablestatic{
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
    padding: 10px;
    margin-top: 20px;
}
.tablestatic th {
    font-size: 14px;
}
.tablestatic td a {
    font-size: 12px;
    text-decoration: none;
    color: #2f363d;
}
.tablestatic td .tour-active{
    display: block;
    width: 100px;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(114, 225, 40);
    background-color: rgba(114, 225, 40, 0.12)
}
.tablestatic td .tour-no-active{
    display: block;
    width: 100px;
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 32px;
    border-radius: 16px;
    white-space: nowrap;
    cursor: pointer;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(255, 77, 73);
    background-color: rgba(255, 77, 73, 0.12);
}
.static-block{
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-color: #fff;
    padding: 10px;
    margin-top: 20px;
}

.flex-colum{
    display: flex;
    flex-direction: column;
    margin-right: 10px;
}

#addSpaDatePicker .ui-datepicker{
    width: 100%;
}
#addPriceDatePicker .ui-datepicker{
    width: 100%;
}
#addIndPriceDatePicker .ui-datepicker{
    width: 100%;
}
.adddatetr{
    display: flex;
    flex-direction: column;
    /* margin-right: 5px; */
}
.add-bottom-date{
    margin-top: 20px;
}

.checkbox-date {
    width: 20px;
    height: 20px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    box-shadow: none; 
    border: 1px solid #aaa;
    border-radius: 4px;
    background: #ccc;
    display: inline-block;
    cursor: pointer;
  }
  
  /* Style the custom checkbox appearance */
  .checkbox-date::before {
    content: '';
    display: none;
  }
  
  /* Style the custom checkbox when checked */
  .checkbox-date:checked {
    background-color: rgb(102, 108, 255);
  }
  
  .checkbox-date:checked::before {
    content: '';
    display: block;
    width: 7px;
    height: 10px;
    margin-left: 5px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    transition: 0.1s;
  }

  .loader {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid rgb(102, 108, 255); /* Blue */
    border-radius: 50%;
    margin-left: auto;
    margin-right: auto;
    width: 100px;
    height: 100px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#waitModalLabel {
    font-size: 24px;
    color: rgb(102, 108, 255);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}
.btn-highlightvisa{
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    letter-spacing: 0.4px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 10px;
    text-transform: uppercase;
    min-width: 64px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: rgb(255, 255, 255);
    background-color: rgb(102, 108, 255);
    font-weight: 500;
    border-radius: 8px;
    box-shadow: rgba(76, 78, 100, 0.42) 0px 4px 8px -4px;
    line-height: 1.693;
    padding: 6px 10px;
    margin-top: 5px;
  }
.block-visa{
    display: flex;
  flex-direction: column-reverse;
  justify-content: space-between;
  height: 100%; /* Optional, adjust as needed */
}
input.highlight-error {
    background-color: #ffcccc;  /* Change to any color you prefer */
}

.btn-icon{
    background-color: transparent;
    border: none;
    text-decoration: none;
}

.bootstrap-select .dropdown-toggle {
    background-color: #f5f5f5;
    color: #333333;
    border-color: #000;
  }
  
  .bootstrap-select .dropdown-menu > li > a {
    color: #333333;
  }
  
  .bootstrap-select .dropdown-menu > li:hover > a {
    background-color: rgba(102, 108, 255, 0.12);
    color: rgb(102, 108, 255);
  }
  .btn.dropdown-toggle.btn-default {
    background-color:transparent; /* Changes the background color */
    /* color: white; Changes the text color */
    border: solid 1px rgba(76, 78, 100, 0.22);
    padding: 10px;
  }
  .dropdown-menu>.active>a{
    background-color: rgba(102, 108, 255, 0.12);
  }
  
  /* .btn.dropdown-toggle.btn-default:hover {
    background-color: #45a049;
  } */
  
  .bootstrap-select.show > .btn.dropdown-toggle.btn-default.bs-placeholder,
  .bootstrap-select.show > .btn.dropdown-toggle.btn-default.bs-placeholder:hover,
  .bootstrap-select.show > .btn.dropdown-toggle.btn-default.bs-placeholder:focus {
    background-color: transparent; /* Changes the background color when opened */
  }
  .logo-heder{
    width: 100%;
  }
  .logo-heder a{
    width: 100%;
    display: flex;
    
  }
  .logo-heder-h{
    font-size: 20px;
  }

  .css-11rb4o0 {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 20px;
    line-height: 1;
    border-radius: 50%;
    overflow: hidden;
    user-select: none;
    width: 40px;
    height: 40px;
}

.hidden {
    display: none;
}

.profile-setting {

    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.2) 0px 5px 5px -3px, rgba(76, 78, 100, 0.14) 0px 8px 10px 1px, rgba(76, 78, 100, 0.12) 0px 3px 14px 2px;
    background-image: none;

    overflow: hidden auto;
    min-width: 16px;
    min-height: 16px;

    outline: 0px;

    /* Style your settings panel here */
    /* For example: */
    position: absolute;
    /* top: 50px; */
    right: 10px;
    width: 200px;
    padding: 10px;
    z-index: 100;
}
.css-1agemx0 {
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px;
    border-radius: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    color: inherit;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    text-decoration: none;
    min-height: 40px;
    box-sizing: border-box;
    white-space: nowrap;
    padding: 0px;
}

.avatar-img {
    cursor: pointer;
}

#myModalAddpaymanetdetalis .modal-dialog{
width: 40%;
}
.currency-block {
    width: 100%;
}
.modaldisplay{
 margin-left: auto;
 margin-right: auto;
}
.paymentblock{
    display: flex;
}


/*BANNER AGENT*/


.profile-row {
    flex-basis: 100%;
    flex-grow: 0;
    max-width: 100%;
    margin-top: 30px;
    margin-bottom: 30px;
}

.profile-card {
    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    overflow: hidden;
}

.profile-banner {
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    object-fit: cover;
}

.profile-content {
    padding: 0rem 10px 10px;
   margin-top: 10px;
    display: flex;
    align-items: flex-end;
}

.profile-picture {
    width: 120px;
    height: 120px;
    border-radius: 10px;
    /* margin-top: 30px; */
    border: 5px solid rgb(255, 255, 255);
}

.profile-info-container {
    width: 100%;
    display: flex;
    align-items: flex-end;
}

.profile-info {
    display: flex;
    flex-direction: column;
}

.profile-name {
    margin: 0px 0px 10px;
    font-weight: 500;
    letter-spacing: 0px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    line-height: 1.334;
    color: rgba(76, 78, 100, 0.87);
    font-size: 18px;
}

.profile-meta {
    display: flex;
    flex-wrap: wrap;
}




.css-15j76c0 {
    flex-basis: 100%;
    -webkit-box-flex: 0;
    flex-grow: 0;
    max-width: 100%;
}

.css-12x00qv {
    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-image: none;
    overflow: hidden;
}
.css-1hta359{
    padding: 20px;
}
.css-1kvusmz {
    margin-bottom: 15px;
}
.agent-info-head{
    display: flex;
    justify-content: space-between;
}
.agent-btn-info-update{
    width: 200px;
}
.css-15ya76n {
    margin: 10px 0px 10px;
    line-height: 1.429;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 16px;
    color: rgba(76, 78, 100, 0.38);
    text-transform: uppercase;
}

.css-q7b74t:not(:last-of-type) {
    margin-bottom: 10px;
}
.css-q7b74t {
    display: flex;
}
.css-ql15kp {
    display: flex;
    margin-right: 5px;
}
.css-j6b6o5 {
    column-gap: 5px;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
}
.css-1kbgbln {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 16px;
    line-height: 1.5;
    color: rgba(76, 78, 100, 0.6);
    font-weight: 600;
}
.css-13u6hmq {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    color: rgba(76, 78, 100, 0.6);
}

.css-q7b74t svg {
    color: rgba(76, 78, 100, 0.6);
}

/* TEAM CARD */
.team-headcontainer{
position: relative;
}
.profile-container{
    position: relative;
}
.agent-price-container{
    position: relative;
}
.team-headcontainer .btncss-uymc1u{
position: absolute;
left: 250px;
top: -130px;
}
.profile-container .btncss-uymc1u{
    position: absolute;
    left: 250px;
    top: -130px;
    }
    .agent-price-container .btnaddtourcss-uymc1u{
        position: absolute;
        left: 250px;
        top: -145px;
        }
.team-headblock{
    display: flex;
}
.css-1twzmnh{
    width: 333px;
    margin-right: 15px;
}
.css-1e3zvnt {
    background-color: rgb(255, 255, 255);
    color: rgba(76, 78, 100, 0.87);
    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 10px;
    box-shadow: rgba(76, 78, 100, 0.22) 0px 2px 10px 0px;
    background-image: none;
    overflow: hidden;
    position: relative;
}
.css-1hta359:last-of-type {
    padding-bottom: 1.25rem;
}
.css-1hta359 {
    padding: 1.25rem;
}
.css-1vr2anf {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    flex-direction: column;
}

.css-1xwvqxw {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 1.25rem;
    line-height: 1;
    border-radius: 50%;
    overflow: hidden;
    user-select: none;
    margin-bottom: 1rem;
    width: 100px;
    height: 100px;
}
.css-1hy9t21 {
    width: 100%;
    height: 100%;
    text-align: center;
    object-fit: cover;
    color: transparent;
    text-indent: 10000px;
}

.css-1ey106c {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 16px;
    line-height: 1.6;
    color: rgba(76, 78, 100, 0.87);
    font-weight: 500;
}
.css-1al51bt {
    margin: 0px 0px 10px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    color: rgba(76, 78, 100, 0.6);
}

.css-1m2olr6 {
    margin-bottom: 15px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.css-10ac0cq:not(:last-of-type) {
    margin-right: 5px;
}
.css-10ac0cq {
    text-decoration: none;
}
.css-1x0m53k {
    max-width: 100%;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size:16px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 24px;
    border-radius: 16px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    cursor: default;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 0px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(109, 120, 141);
    background-color: rgba(109, 120, 141, 0.12);
}
.css-1jok1jo {
    max-width: 100%;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 16px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    height: 24px;
    border-radius: 16px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    cursor: default;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 0px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(253, 181, 40);
    background-color: rgba(253, 181, 40, 0.12);
}
.css-tavflp {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 12px;
    padding-right: 12px;
    white-space: nowrap;
}
.css-twfhef {
    margin-bottom: 2rem;
    gap: 0.5rem;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
    justify-content: space-around;
}
.css-1vr2anf {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    flex-direction: column;
}
.css-1gidozd {
    margin: 0px;
    font-weight: 500;
    letter-spacing: 0px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 12px;
    line-height: 1.334;
    color: rgba(76, 78, 100, 0.87);
}
.css-13u6hmqq {
    margin: 0px;
    letter-spacing: 0.15px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-weight: 400;
    font-size: 12px;
    line-height: 1.5;
    color: rgba(76, 78, 100, 0.6);
}
.css-70qvj9 {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.css-uymc1u {
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    outline: 0px;
    border: 0px;
    margin: 0px 1rem 0px 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    letter-spacing: 0.4px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.875rem;
    text-transform: uppercase;
    min-width: 64px;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    color: rgb(255, 255, 255);
    background-color: rgb(102, 108, 255);
    font-weight: 500;
    border-radius: 8px;
    line-height: 1.715;
    box-shadow: rgba(76, 78, 100, 0.42) 0px 4px 8px -4px;
    padding: 0.4375rem 1.375rem;
}
.css-df05va {
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    letter-spacing: 0.4px;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.875rem;
    text-transform: uppercase;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border: 1px solid rgba(109, 120, 141, 0.5);
    color: rgb(109, 120, 141);
    font-weight: 500;
    border-radius: 8px;
    line-height: 1.572;
    padding: 11px;
    min-width: 38px;
}
.ul-spapack-name{
    padding: 0px;
}

.active-spapack {
    width: auto;
    background-color:rgba(253, 181, 40, 0.12); /* Change to your desired color */
    color: rgb(253, 181, 40);
    padding: 8px;
    border-radius: 20px;
}

.spapack-name{
    cursor: pointer;
    list-style-type: none;
}
.add-setup-btn{
    margin-left: 10px;
}
.add-price-agent{
    margin-bottom: 10px;
}
#invoice_table_main  td {
    text-align: center;        /* Horizontal centering */
    vertical-align: middle;    /* Vertical centering */
}

#invoice_table_main  th {
    text-align: center;
    vertical-align: middle;
}
#invoice_table_main .totalsuminvoice{
    text-align: right;
    vertical-align: middle;
    padding-top: 20px;
    padding-bottom: 20px;
}
.totalsuminvoice span{
    padding: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    font-size: 16px;
    color: rgb(102, 108, 255);
    background-color: rgba(102, 108, 255, 0.12);
}
#invoice_table_main_filter{
    display: flex;
    justify-content: end;
}
#invoice_table_main_filter input{
    margin-left: 10px;
}

.actions_wrapper_main{
    padding-left: 0px;
}
.actions_wrapper_main .block{
padding-left: 0px;
}
.soon{
    max-width: 100%;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 8px;
    display: inline-flex;
    margin-left: 5px;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    /* height: 24px; */
    border-radius: 12px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    cursor: default;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 8px;
    padding-right: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(255, 77, 73);
    background-color: rgba(255, 77, 73, 0.12);
}

.searchordersindate{
    height: 34px;
    width: 250px;
    padding: 5px;
    border: solid 1.5px #dddddd54;
}





#alertchoosedatemyModal .modal-confirm  {		
	color: #434e65;
	width: 525px;
}
#alertchoosedatemyModal .modal-confirm .modal-content {
	padding: 20px;
	font-size: 16px;
	border-radius: 5px;
	border: none;
}
#alertchoosedatemyModal .modal-confirm .modal-header {
	background: #e85e6c;
	border-bottom: none;   
	position: relative;
	text-align: center;
	margin: -20px -20px 0;
	border-radius: 5px 5px 0 0;
	padding: 35px;
}
#alertchoosedatemyModal .modal-confirm h4 {
	text-align: center;
	font-size: 36px;
	margin: 10px 0;
}
#alertchoosedatemyModal .modal-confirm .form-control, .modal-confirm .btn {
	min-height: 40px;
	border-radius: 3px; 
}
#alertchoosedatemyModal .modal-confirm .close {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #fff;
	text-shadow: none;
	opacity: 0.5;
}
#alertchoosedatemyModal .modal-confirm .close:hover {
	opacity: 0.8;
}
#alertchoosedatemyModal .modal-confirm .icon-box {
	color: #fff;		
	width: 95px;
	height: 95px;
	display: inline-block;
	border-radius: 50%;
	z-index: 9;
	border: 5px solid #fff;
	padding: 15px;
	text-align: center;
}
#alertchoosedatemyModal .modal-confirm .icon-box i {
	font-size: 58px;
	margin: -2px 0 0 -2px;
}
#alertchoosedatemyModal .modal-confirm.modal-dialog {
	margin-top: 80px;
}
#alertchoosedatemyModal .modal-confirm .btn, .modal-confirm .btn:active {
	color: #fff;
	border-radius: 4px;
	background: #eeb711 !important;
	text-decoration: none;
	transition: all 0.4s;
	line-height: normal;
	border-radius: 30px;
	margin-top: 10px;
	padding: 6px 20px;
	min-width: 150px;
	border: none;
}
#alertchoosedatemyModal .modal-confirm .btn:hover, .modal-confirm .btn:focus {
	background: #eda645 !important;
	outline: none;
}




#alertchoosepackagemyModal .modal-confirm  {		
	color: #434e65;
	width: 525px;
}
#alertchoosepackagemyModal .modal-confirm .modal-content {
	padding: 20px;
	font-size: 16px;
	border-radius: 5px;
	border: none;
}
#alertchoosepackagemyModal .modal-confirm .modal-header {
	background: #e85e6c;
	border-bottom: none;   
	position: relative;
	text-align: center;
	margin: -20px -20px 0;
	border-radius: 5px 5px 0 0;
	padding: 35px;
}
#alertchoosepackagemyModal .modal-confirm h4 {
	text-align: center;
	font-size: 36px;
	margin: 10px 0;
}
#alertchoosepackagemyModal .modal-confirm .form-control, .modal-confirm .btn {
	min-height: 40px;
	border-radius: 3px; 
}
#alertchoosepackagemyModal .modal-confirm .close {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #fff;
	text-shadow: none;
	opacity: 0.5;
}
#alertchoosepackagemyModal .modal-confirm .close:hover {
	opacity: 0.8;
}
#alertchoosepackagemyModal .modal-confirm .icon-box {
	color: #fff;		
	width: 95px;
	height: 95px;
	display: inline-block;
	border-radius: 50%;
	z-index: 9;
	border: 5px solid #fff;
	padding: 15px;
	text-align: center;
}
#alertchoosepackagemyModal .modal-confirm .icon-box i {
	font-size: 58px;
	margin: -2px 0 0 -2px;
}
#alertchoosepackagemyModal .modal-confirm.modal-dialog {
	margin-top: 80px;
}
#alertchoosepackagemyModal .modal-confirm .btn, .modal-confirm .btn:active {
	color: #fff;
	border-radius: 4px;
	background: #eeb711 !important;
	text-decoration: none;
	transition: all 0.4s;
	line-height: normal;
	border-radius: 30px;
	margin-top: 10px;
	padding: 6px 20px;
	min-width: 150px;
	border: none;
}
#alertchoosepackagemyModal .modal-confirm .btn:hover, .modal-confirm .btn:focus {
	background: #eda645 !important;
	outline: none;
}





#alertnotfountflightmyModal .modal-confirm  {		
	color: #434e65;
	width: 525px;
}
#alertnotfountflightmyModal .modal-confirm .modal-content {
	padding: 20px;
	font-size: 16px;
	border-radius: 5px;
	border: none;
}
#alertnotfountflightmyModal .modal-confirm .modal-header {
	background: #e85e6c;
	border-bottom: none;   
	position: relative;
	text-align: center;
	margin: -20px -20px 0;
	border-radius: 5px 5px 0 0;
	padding: 35px;
}
#alertnotfountflightmyModal .modal-confirm h4 {
	text-align: center;
	font-size: 36px;
	margin: 10px 0;
}
#alertnotfountflightmyModal .modal-confirm .form-control, .modal-confirm .btn {
	min-height: 40px;
	border-radius: 3px; 
}
#alertnotfountflightmyModal .modal-confirm .close {
	position: absolute;
	top: 15px;
	right: 15px;
	color: #fff;
	text-shadow: none;
	opacity: 0.5;
}
#alertnotfountflightmyModal .modal-confirm .close:hover {
	opacity: 0.8;
}
#alertnotfountflightmyModal .modal-confirm .icon-box {
	color: #fff;		
	width: 95px;
	height: 95px;
	display: inline-block;
	border-radius: 50%;
	z-index: 9;
	border: 5px solid #fff;
	padding: 15px;
	text-align: center;
}
#alertnotfountflightmyModal .modal-confirm .icon-box i {
	font-size: 58px;
	margin: -2px 0 0 -2px;
}
#alertnotfountflightmyModal .modal-confirm.modal-dialog {
	margin-top: 80px;
}
#alertnotfountflightmyModal .modal-confirm .btn, .modal-confirm .btn:active {
	color: #fff;
	border-radius: 4px;
	background: #eeb711 !important;
	text-decoration: none;
	transition: all 0.4s;
	line-height: normal;
	border-radius: 30px;
	margin-top: 10px;
	padding: 6px 20px;
	min-width: 150px;
	border: none;
}
#alertnotfountflightmyModal .modal-confirm .btn:hover, .modal-confirm .btn:focus {
	background: #eda645 !important;
	outline: none;
}
.add_meta_box_bank{
    position: relative;
    display:flex;
    flex-wrap: wrap;
    margin-top: 25px;
}

.add_meta_row_bank{
    position: absolute;
    left: 5px;
    top:-30px;
    cursor: pointer;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
   
    border-radius: 16px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 6px 12px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(102, 108, 255);
    background-color: rgba(102, 108, 255, 0.12);
}

.delete-bank-setting .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}
.remove_meta_bank .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}
.add_meta_box_private{
    position: relative;
    display:flex;
    flex-wrap: wrap;
    margin-top: 25px;
}

.add_meta_row_private{
    position: absolute;
    left: 5px;
    top:-30px;
    cursor: pointer;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
   
    border-radius: 16px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 6px 12px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(102, 108, 255);
    background-color: rgba(102, 108, 255, 0.12);
}

.delete-private-setting .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}
.remove_meta_private .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}

.add_meta_box_private_update{
    position: relative;
    display:flex;
    flex-wrap: wrap;
    margin-top: 25px;
}

.add_meta_row_private_update{
    position: absolute;
    left: 5px;
    top:-30px;
    cursor: pointer;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
   
    border-radius: 16px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 6px 12px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(102, 108, 255);
    background-color: rgba(102, 108, 255, 0.12);
}

.delete-private-setting-update .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}
.remove_meta_private_update .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}




.add_meta_box_not_include{
    position: relative;
    display:flex;
    flex-wrap: wrap;
    margin-top: 25px;
}

.add_meta_row_not_include{
    position: absolute;
    left: 5px;
    top:-30px;
    cursor: pointer;
    font-family: Inter, sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 12px;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
   
    border-radius: 16px;
    white-space: nowrap;
    transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    outline: 0px;
    text-decoration: none;
    border: 0px;
    padding: 6px 12px;
    vertical-align: middle;
    box-sizing: border-box;
    color: rgb(102, 108, 255);
    background-color: rgba(102, 108, 255, 0.12);
}

.delete-not-include-setting .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}
.remove_meta_not_include .fa-trash-o{
    font-size: 20px;
    color: rgb(255, 77, 73);
}
.companysettingbtn{
    position: absolute;
    right: 0px;
    top: -20px;
}

.group-header {
    margin-top: 20px; /* Отступ сверху для заголовка */
    font-size: 24px; /* Размер шрифта для заголовка */
    font-weight: bold; /* Жирность шрифта для заголовка */
    padding: 10px 0; /* Внутренний отступ сверху и снизу для заголовка */
}

.table-group {
    margin-bottom: 20px; /* Отступ снизу для таблицы */
}