@import "/assets/icons/line-icons/simple-line-icons.css";

.text-bubble {
    height: 30px;
    width: 30px;
    text-align: center;
    padding-top: 7px;
}
.bignumbers {
    color: white;
    font-size: 50px;
    font-family: sans-serif;
    font-weight: 700;
    position: relative;
    top: -25px;
}
.bignumbers.morethan9{
    left: -5px;
    font-size: 38px;
    top: -18px;
}
.bd-full {
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    border-radius: 50% !important;
}
.bg-dark {
    background-color: rgb(119, 119, 119) !important;
}
.bg-dark-light {
    background-color: rgb(208, 208, 208) !important;
}
.bg-green {
    background-color: #0aa699 !important;
}
.bg-green-light {
    background-color: #9fceca !important;
}

.responsive-width{
    margin-left: 60px;
    margin-right: 15px;
}
.responsive-height{
    margin-top: -30px;
}

.inline-toggle-slider{
    margin-left: 20px;
    display: inline;
}


.switch {
    background-color: #fff;
    box-shadow: inset 0 -1px #ffffff, inset 0 1px 1px rgba(0, 0, 0, 0.05);
    cursor: pointer;
    display: inline-block;
    height: 20px;
    margin-top: 5px;
    padding: 3px;
    position: relative;
    vertical-align: top;
    width: 56px;
    -webkit-border-radius: 18px;
    -moz-border-radius: 18px;
    border-radius: 18px;
}
.switch-input {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
}
.switch-input:checked ~ .switch-label {
    background: #319DB5;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}
.switch-input:checked ~ .switch-handle {
    box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.4);
    left: 40px;
}
.switch-label {
    background: #eceeef;
    border-radius: inherit;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
    display: block;
    font-size: 10px;
    height: inherit;
    position: relative;
    text-transform: uppercase;
    -webkit-transition: all 0.15s ease-out;
    -moz-transition: all 0.15s ease-out;
    -o-transition: all 0.15s ease-out;
    -ms-transition: all 0.15s ease-out;
    transition: all 0.15s ease-out;
}
.switch-label:before {
    -moz-transition: inherit;
    -o-transition: inherit;
    -webkit-transition: inherit;
    color: #aaaaaa;
    content: attr(data-off);
    line-height: 1;
    margin-top: -0.5em;
    position: absolute;
    right: 7px;
    text-shadow: 0 1px rgba(255, 255, 255, 0.5);
    top: 50%;
    transition: inherit;
}
.switch-label::after {
    -moz-transition: inherit;
    -o-transition: inherit;
    -webkit-transition: inherit;
    line-height: 1;
    margin-top: -0.5em;
    position: absolute;
    top: 50%;
    transition: inherit;
}
.switch-label:after {
    color: #fff;
    content: attr(data-on);
    left: 11px;
    opacity: 0;
    text-shadow: 0 1px rgba(0, 0, 0, 0.2);
}
.switch-input:checked ~ .switch-label::before {
    opacity: 0;
}
.switch-input:checked ~ .switch-label::after {
    opacity: 1;
}
.switch-handle {
    background: #fff;
    background-image: -moz-linear-gradient(top, #ffffff 40%, #f0f0f0);
    background-image: -o-linear-gradient(top, #ffffff 40%, #f0f0f0);
    background-image: -webkit-linear-gradient(top, #ffffff 40%, #f0f0f0);
    background-image: linear-gradient(to bottom, #ffffff 40%, #f0f0f0);
    border-radius: 10px;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
    height: 18px;
    left: 4px;
    position: absolute;
    top: 4px;
    width: 18px;
    -webkit-transition: left 0.15s ease-out;
    -moz-transition: left 0.15s ease-out;
    -o-transition: left 0.15s ease-out;
    -ms-transition: left 0.15s ease-out;
    transition: left 0.15s ease-out;
}
.switch-handle:before {
    background: #f9f9f9;
    background-image: -moz-linear-gradient(top, #eeeeee, #ffffff);
    background-image: -o-linear-gradient(top, #eeeeee, #ffffff);
    background-image: -webkit-linear-gradient(top, #eeeeee, #ffffff);
    background-image: linear-gradient(to bottom, #eeeeee, #ffffff);
    border-radius: 6px;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
    content: '';
    height: 12px;
    left: 50%;
    margin: -6px 0 0 -6px;
    position: absolute;
    top: 50%;
    width: 12px;
}
.switch-green > .switch-input:checked ~ .switch-label {
    background: #4fb845;
}
.datatable{
    position: relative;
}
.datatable.filter-center .dataTables_wrapper .dataTables_filter {
    float: none;
    text-align: center !important;
    margin-bottom: 25px;
    display: inline;
}
.datatable input[type="search"] {
    border: solid 4px #efefef !important;
    width: 30% !important;
    min-width: 200px !important;
    height: 38px !important;
    margin-left: 5px !important;
}
.datatable div.dataTables_wrapper div.dataTables_filter label{
    text-align: center !important;
    display: inline;
    font-weight: 600;
    color: #505458;
}
.datatable input[type="search"]:focus,
.datatable input[type="search"]:active
{
    border: solid 4px #cbcbcb !important;
}
.datatable thead{
    background-color: #ffffff;
    color: #777777;
}
.datatable th{
    #border: 1px solid #18304a;
}
.datatable th.sorting{
    padding-bottom: 15px !important;
}
.datatable th.sorting_desc{
    padding-bottom: 15px !important;
}
.datatable th.sorting_asc{
    padding-bottom: 15px !important;
}
.datatable th .check-option.checkbox.check-primary {
    margin-left: 5px;
}
.datatable table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after {
    bottom: 15px !important;
}
.datatable .dataTables_info{
    float: left;
}
.datatable .top{
    text-align: center;
    margin-bottom: 30px;
}
.datatable .filter{
    display: inline;
}
.datatable .filter .checkbox{
    display: block !important;
}
.datatable .filter .checkbox label{
    padding-left: 20px;
}
.datatable .popover,
.datatable .popover-title{
    background-color: #f3f3f3;
    font-size: 16px;
}
.datatable .popover{
    width: 355px;
    box-shadow: 0px 0px 7px rgba(45, 45, 45, 0.32) !important;
}
.datatable .popover.bottom>.arrow:after {
    border-bottom-color: #f9f9f9;
}
.button-with-options{
    /*padding-right: 37px;*/
    position: relative;
}
.button-with-options .btn{
    margin-bottom: 8px;
    position: relative;
}
.button-with-options .options{
    position: absolute;
    /*right: 0;*/
    top: 0;
}
.button-with-options .options .dropdown-menu{
    left: -125px !important;
}
.button-with-options-v2{
    padding-right: 37px;
    position: relative;
}
.button-with-options-v2 .btn{
    margin-bottom: 8px;
    position: relative;
}
.button-with-options-v2 .options{
    position: absolute;
    right: 0;
    top: 0;
}
.button-with-options-v2 .options .dropdown-menu{
    left: -125px !important;
}
.dropdown-menu.menu-green > li > a:hover, .dropdown-menu.menu-green > li > a:focus {
    background-color: #0aa699 !important;
}
.dropdown-menu.menu-red > li > a:hover, .dropdown-menu.menu-red > li > a:focus {
    background-color: #f35958 !important;
}
.btn-transparent, .btn-transparent:hover{
    background: none;
}
.btn-sm{
    font-size: 12px;
}
.make-link{
    color: #3eabf0;
    padding: 0px !important;
}
.make-link:hover{
    color: #3693d0;
    text-decoration: underline;
}
.row.no-lateral-margin{
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.popover-content .filter-col{
    height: 170px;
    margin-top: 5px;
}
.popover-content .filter-col:not(:first-of-type){
    border-left: 1px solid #ebebeb;
}
.datarange-to-label{
    position: absolute;
    width: auto;
    height: auto;
    padding: 8.75px 12px;
    background-color: #8e8e8e;
    color: white;
    top: 0px;
    left: 131px;
}
.datarange-input-from{
    width: 130px;
}
.datarange-input-to{
    position: absolute;
    top: 0;
    left: 163px;
}
.flatpickr.form-control[readonly]{
    background-color: #fff;
}
.flatpickr.form-control{
    background-color: #fff;
}
.flatpickr.form-controlflatpickr-input.active{
    background-color: #fff;
}
.flatpickr-date .input-focus{
    background-color: #fff !important;
}
.soft-division-top{
    border-top: 1px solid #ebebeb;
    padding-top: 10px;
}
.search-with-filter-block{
    position: relative;
    text-align: center;
    margin-bottom: 30px;
}
.search-with-filter-block .filter{
    display: inline;
}
.search-with-filter-block .filter .checkbox{
    display: block !important;
}
.search-with-filter-block.filter .checkbox label{
    padding-left: 20px;
}
.search-with-filter-block.popover,
.search-with-filter-block.popover-title{
    background-color: #f9f9f9;
    font-size: 16px;
}
.search-with-filter-block .popover{
    width: 355px;
}
.search-with-filter-block.popover.bottom>.arrow:after {
    border-bottom-color: #f9f9f9;
}

.search-with-filter-block input {
    margin-left: 0.5em;
    display: inline-block;
    width: auto;
}
.search-with-filter-block input[type="search"] {
    border: solid 4px #efefef;
    width: 30% !important;
    min-width: 200px !important;
    height: 38px !important;
    margin-left: 5px !important;
}

.search-with-filter-block input[type="search"]:active,
.search-with-filter-block input[type="search"]:focus,
.search-with-filter-block select:active ,
.search-with-filter-block select:focus {
    border: solid 4px #cbcbcb !important;
}
.search-with-filter-block label {
    text-align: center !important;
    display: inline;
}
.search-with-filter-block select {
    width: auto;
    display: inline;
    border: solid 4px #efefef;
    border-radius: 2px;
    padding-top: 3px;
}
.search-with-filter-block .form-group{
    display: inline;
}
.form-number-holder {
    padding-top: 4px;
}
.table td.check-row{
    min-width: 20px;
    padding-top: 10px !important;
}
.table td.campname-row{
    /*width: 40%;*/
    padding-top: 7px !important;
}
.chosen-container{
    /*min-width: 360px !important;*/
}
.full-width{
    width: 100% !important;
}
.append-icon{
    position: relative;
}
.append-icon i.icon{
    position: absolute;
    right: 15px;
    top: 10px;
}

@media (min-width: 992px) and (max-width: 1199px) {
    .form-number-holder{
        margin-right: 10px !important;
    }
    .responsive-width{
        margin-left: 60px;
        margin-right: 40px;
    }
}
@media (max-width: 991px) {
    .responsive-width{
        margin-left: 70px;
    }
}
@media (max-width: 767px) {
    .datatable .popover{
        width: auto;
    }
    .popover-content .filter-col{
        height: auto;
        border-left: none !important;
    }
}
@media (min-width: 433px) and (max-width: 767px) {
    .form-number-holder{
        width: 0px;
        display: table;
    }
    .responsive-width{
        margin-left: 79px;
        margin-right: 51px;
    }
    .responsive-height{
        margin-top: -15px;
    }
}
@media (max-width: 432px) {
    .form-number-holder{
        width: 50px;
    }
    .responsive-width{
        margin-left: 64px;
        margin-right: 26px;
    }
    .responsive-height{
        margin-top: 0px;
    }
}