/*
 Created on : August 20, 2018
 Author     : Dejo
 */

/*** global styles ***/
:root {
 --button-color: #0EA9E9;
 --font-family: Arial, sans-serif;
 --header: #E3E8F0;
 --border: #B9BED1;
 --label: #70769C;
 --text: #454545;
 --input: #F0F2F7;
 --red: #FF0022;
 --green: #27C229;
 --dark_green: #16AA18;
 --orange: #FF8526;
 --yellow: #FFC926;
 --purple: #8056D8;
 --table-text: #707070;
}
body {
    font-family: var(--font-family);
}

/* if img is broken */
img {
    position: relative;
}
img::before {
    content: '';
    height: 198px;
    margin-bottom: 0;
    background-color: var(--input);
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
img::after {
    content: "\f127  There is no image of " attr(alt) " please upload it.";
    display: block;
    font-size: 14px;
    font-style: normal;
    font-family: FontAwesome;
    color: var(--text);
    position: absolute;
    top: 5px;
    left: 0;
    width: 100%;
    text-align: center;
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100% !important;
}
tbody {
    /*Added by Emilio*/
    background-color: rgb(249, 249, 249);
}
td {
    /*Added by Emilio*/
    border-color: rgb(150, 150, 150);
}
.template-add-more-div {
    text-align: right;
    margin-top: 6px;
}

.template-del-div-btn {
    text-align: right;
    margin: 45px 0px 12px;
}
.select {
  position: relative;
}

.select:before {
    content: '\f0d7';
    font-family: 'FontAwesome';
    color: var(--text);
    display: inline-block;
    position: absolute;
    right: 3px;
    top: 7px;
    pointer-events: none;
    z-index: 5;
}
.row {
    margin: 0;
}
.pagination {
    margin-bottom: 0;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    justify-content: center;
}
.pagination li.active span {
    background-color: var(--button-color) !important;
    color: #fff !important;
}
.pagination li a {
    color: var(--button-color) !important;
    border-color: var(--border) !important;
}
.alert-success, .alert-danger {
    opacity: 1 !important;
    position: fixed;
    z-index: 1000;
    right: 40%;
}
.alert-login {
    top: -20% !important;
}
.requ {
    color: var(--button-color);
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.success_msg_home {
    width: 30%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 75px;
}
.loggedInAs {
    position: relative;
}
.loggedInAs .alert {
    margin: 0 auto;
    margin-bottom: 0;
    text-align: center;
}
.loggedInAs a {
    text-transform: uppercase;
    text-decoration: underline;
    font-weight: 600;
}
.error {
    display: none;
    margin-bottom: 0;
    color: var(--red);
}
.notif {
    display: none;
    margin-bottom: 0;
    color: var(--green);
    opacity: .6;
}
.back_error {
    margin-bottom: 0;
    color: var(--red);
}
nav {
    background-color: var(--input);
    padding: 0 !important;
    border-bottom: 1px solid var(--border);
}
nav .brand {
    background-color: var(--header);
    padding: 15px 30px;
    border-right: 1px solid var(--border);
}
.navbar-brand {
    color: var(--text);
    font-weight: 600;
    font-size: 26px;
}
.nav-item a {
    color: var(--border);
    text-transform: uppercase;
}
.nav-item {
    margin: 0 20px;
}
.nav-item.active {
    border-bottom: 3px solid var(--button-color);
    padding: 17px 15px;
}
.nav-item.active a {
    color: var(--button-color);
    font-weight: 600;
}
.nav-item a:hover {
    color: var(--text);
}
.nav-item .dropdown-toggle::after {
    border: 0;
}
.dropdown-cont {
    background-color: var(--header);
    border-left: 1px solid var(--border);
}
.dropdown-cont .nav-link, .dropdown-cont-notif .nav-link {
    padding: 22px 0px;
}
.dropdown-cont i, .dropdown-cont-notif i {
    font-size: 30px;
    color: var(--label);
}
.twilio {
    width: 30px;
    height: 30px;
}
.dropdown-cont .dropdown-menu {
    position: absolute;
    left: -110px;
    border-radius: 0;
    border-color: var(--border);
}
.dropdown-cont-notif .dropdown-menu {
    position: absolute;
    right: 0px;
    border-radius: 0;
    border-color: var(--border);
    max-height: 400px;
    overflow-y: auto;
}
.dropdown-cont .dropdown-menu a, .dropdown-cont-notif .dropdown-menu a {
    text-align: center;
}
.dropdown-cont-notif img {
    width: 30px;
    height: 30px;
}
button.close {
    color: #fff;
    background-color: var(--red);
    opacity: 1;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 18px;
    font-weight: 300;
}
button.close:focus, button.close:active, button.close:focus:active, button.close:hover {
    outline: none;
    color: #fff;
}
/*** login styles ***/
.modal-backdrop {
    background-color: #fff;
}
#sys_login .modal-dialog, #sys_reset .modal-dialog, #sys_change .modal-dialog {
    margin-top: calc((100vh - 376px) / 2);
    -webkit-box-shadow: 0 11px 13px -4px var(--border);
    -moz-box-shadow: 0 11px 13px -4px var(--border);
    box-shadow: 0 11px 13px -4px var(--border);
    border-radius: 7px;
}
#register_manager .modal-dialog {
    margin-top: calc((100vh - 712px) / 2);
    -webkit-box-shadow: 0 11px 13px -4px var(--border);
    -moz-box-shadow: 0 11px 13px -4px var(--border);
    box-shadow: 0 11px 13px -4px var(--border);
}
.auth .modal-content {
    border-radius: 7px;
    border-color: var(--border);
}
.auth .modal-footer {
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}
.auth .modal-header {
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    background-color: var(--header);
    border-bottom-color: var(--border);
}
.auth .modal-header, .auth .modal-body {
    padding: 15px 20px;
}
.auth .modal-title {
    color: var(--text);
}
.auth .modal-title, .auth .modal-body a {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    text-decoration: none;
}
.auth .modal-title i,  .auth .modal-body a i {
    margin-right: 15px;
    color: var(--button-color);
}
.auth .modal-body a {
    color: var(--label);
}
.auth .modal-footer {
    border-top: 0;
}
.btn-login {
    background-color: var(--button-color);
    color: #fff;
    font-size: 12px;
    padding: 15px 80px;
    text-transform: uppercase;
    margin: 0 auto;
    cursor: pointer;
    font-weight: 600;
}
.btn-confirm {
    background-color: var(--button-color);
    color: #fff;
    font-size: 12px;
    padding: 10px 20px;
    text-transform: uppercase;
    cursor: pointer;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    font-weight: 600;
}
.btn-confirm i {
    margin-right: 10px;
}
.btn-outline-blue {
    background-color: #fff;
    color: var(--button-color) !important;
    border: 2px solid var(--button-color) !important;
    font-size: 12px;
    padding: 12px 20px;
    text-transform: uppercase;
    cursor: pointer;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    font-weight: 600;
    border-radius: .25rem;
}
.btn-outline-blue label {
    margin-bottom: 0;
    margin-right: 5px;
    color: #fff;
    background-color: var(--button-color);
    padding: 2px 5px;
    font-size: 8px;
    border-radius: 3px;
}
.btn-outline-blue i {
    margin-right: 5px;
}
.right_actions button, .right_actions a {
    margin-left: 10px;
}
.btn-cancel {
    background-color: var(--border);
    color: #fff;
    font-size: 12px;
    padding: 12px 20px;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
}
.modal_btn {
     height: 41px;
    width: 180px;
    text-align: center;
    padding: 0;
    justify-content: center;
}
.btn-outline-gray {
    background-color: #fff;
    color: var(--table-text);
    border: 2px solid var(--table-text);
    font-size: 10px;
    padding: 12px 20px;
    text-transform: uppercase;
    cursor: pointer;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    font-weight: 600;
}
.btn-lighter {
    background-color: var(--header);
    color: var(--text);
    font-size: 10px;
    padding: 12px 20px;
    text-transform: uppercase;
    cursor: pointer;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    font-weight: 600;
}
.btn-lighter:hover {
    color: var(--text);
}
.btn-delete {
    background-color: rgba(255, 0, 34, .1);
    color: var(--red);
    font-size: 10px;
    padding: 12px 20px;
    text-transform: uppercase;
    cursor: pointer;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    font-weight: 600;
}
.btn-lighter img {
    width: 24px;
    margin-right: 10px;
}
.btn-lighter i {
    color: var(--text);
    margin-right: 10px;
}
.btn-delete i, .btn-green i {
    margin-right: 10px;
}
.modal_btn:focus, .btn-outline-blue:focus, .btn-outline-gray:focus, .btn-lighter:focus {
    outline: none;
    box-shadow: none;
}
.btn-green {
    background-color: var(--green);
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 600;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
}
.btn-single-call {
    background-color: var(--header);
    color: var(--border);
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 600;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    border-radius: 30px;
    padding: .3rem .5rem;
}
.btn-single-call.active{
    background-color: var(--green);
	color: #fff;
}
.btn-single-call i {
    border-radius: 50%;
    background-color: var(--green);
    color: #fff;
    padding: 5px;
    font-size: 16px;
    margin-right: 5px;
}
a.btn-action-blue {
    background-color: var(--button-color);
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 600;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    width: 143px;
    margin: 0 auto;
}
.btn-red {
    background-color: var(--red);
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 600;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    width: 143px;
    margin: 0 auto;
}
.btn-call-green {
    background-color: var(--green);
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 600;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    width: 143px;
    margin: 0 auto;
}
a.btn-action-blue:hover {
    color: #fff;
}
a.btn-action-gray {
    background-color: var(--input);
    color: var(--table-text) !important;
    font-size: 12px;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 600;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    width: 143px;
    margin: 0 auto;
}
a.btn-action-gray:hover {
    color: var(--table-text);
}
.btn-action-blue i, .btn-action-gray i {
    margin-right: 10px;
}
.btn-login:focus, .btn-confirm:focus, .actions a:focus, .btn-cancel:focus, .btn-action-blue:focus, .btn-action-gray:focus {
    outline: none;
    box-shadow: none;
}
.auth .modal-body input, .auth .modal-body textarea, .auth .modal-body input:not(.toggle) {
    background-color: var(--input);
    border-color: var(--border);
    padding: 12px;
    height: inherit !important;
}
.em-margin-53-bot-right {
    margin-bottom: 53px;
    margin-right: 53px;
}
.auth .modal-body select {
    background-color: #fff;
    border-color: var(--border);
    padding: 12px;
    height: inherit !important;
}
#fromDate, #toDate {
    background-color: #fff;
}
.auth .modal-body label {
    color: var(--label);
    font-weight: 600;
}
.position-relative {
    position: relative;
}
.position-relative i {
    position: absolute;
    top: 10px;
    right: 10px;
    color: var(--border)
}
.other_modals input {
    padding-right: 40px;
}
.other_modals label {
    color: var(--text) !important;
}

  /* ON/OFF Switch */
  .toggle {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 62px;
    height: 32px !important;
    display: inline-block;
    position: relative;
    border-radius: 50px;
    padding-bottom: 20px !important;
    overflow: visible;
    outline: none;
    border: none;
    cursor: pointer;
    transition: background-color ease 0.3s;
  }
    .fix_toggle {
        width: 62px;
        height: 32px !important;
        display: inline-block;
        border-radius: 50px;
        overflow: hidden;
    }
  .toggle:before {
    content: "on off";
    display: block;
    position: absolute;
    z-index: 2;
    width: 28px;
    height: 28px;
    background: #fff;
    left: 2px;
    top: 2px;
    border-radius: 50%;
    font: 10px/28px Helvetica;
    text-transform: uppercase;
    font-weight: bold;
    text-indent: -22px;
    word-spacing: 37px;
    color: #fff;
    text-shadow: -1px -1px rgba(0,0,0,0.15);
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    transition: all cubic-bezier(0.3, 1.5, 0.7, 1) 0.3s;
  }

  .toggle:checked:before {
    left: 32px;
  }
  /* ==== Accessibility ===== */
  .aural {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
  }
  .aural:focus {
    clip: rect(0, 0, 0, 0);
    font-size: 1em;
    height: auto;
    outline: thin dotted;
    position: static !important;
    width: auto;
    overflow: visible;
  }
#editProfile .modal-dialog {
    max-width: 670px;
}
.navigate {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
}
.btn-call {
    width: 100%;
    height: 65px;
    background-color: var(--green);
    color: #fff;
    font-weight: 600;
    font-size: 24px;
    cursor: pointer;
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #ffffff;
}

#dialpad .modal-footer {
    padding: 0;
}
.phone-container {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    flex-direction: column;
}
.numbers {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    justify-content: center;
}
.num label  {
    border: 1px solid;
    border-radius: 50%;
    width: 75px;
    height: 75px;
    text-align: center;
    font-size: 50px;
    margin: 10px;
    cursor: pointer;
}
.num-digit label  {
    border: 1px solid;
    width: 45px;
    height: 45px;
    text-align: center;
    font-size: 30px;
    margin: 10px;
    cursor: pointer;
}
.del , .del-number{
    display: none;
    z-index: 1000;
    cursor: pointer;
}
.dropdown-cont-notif li:nth-child(1) .notifAlert, .dropdown-cont-notif li:nth-child(3) .notifAlert {
    width: 10px;
    height: 10px;
    background-color: var(--button-color);
    border-radius: 50%;
    position: absolute;
    right: 9px;
    display: none;
}
.dropdown-cont-notif li:nth-child(2) .notifAlert, .dropdown-cont-notif li:nth-child(4) .notifAlert {
    width: 10px;
    height: 10px;
    background-color: var(--button-color);
    border-radius: 50%;
    position: absolute;
    right: 17px;
    display: none;
}
.bordered_bottom {
    border-bottom: 1px solid var(--border);
}
.cont_nav {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    padding: 20px 40px;
    justify-content: space-between;
	padding-top: 40px;
}
.cont_nav h1 {
    font-weight: 300 !important;
    color: var(--table-text);
    margin-bottom: 0;
}
.notifs {
    width: 300px;
    left: -230px;
    background-color: var(--input);
}
.notifs a {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: var(--text);
    font-size: 12px;
}
.each_notif a {
    padding: 10px;
    text-align: left;
}
.each_notif:not(:last-child) {
    margin-bottom: 10px;
    border-bottom: 1px solid var(--border);
}
.notifs a small {
    font-style: italic;
}
#custom-search-input{
    border: solid 1px var(--border);
    border-radius: 6px;
    background-color: #fff;
    width: 100%;
    float: right;
}

#custom-search-input input{
    border: 0;
    box-shadow: none;
    height: 42px;
    border-radius: 6px;
    padding: 23px;
}

#custom-search-input button{
    background-color: var(--button-color);
    box-shadow: none;
    border: 0;
    color: #fff;
    padding: 0 12px 0;
    cursor: pointer;
    z-index: 10;
}

#custom-search-input button:hover{
    border: 0;
    box-shadow: none;
    border-left: solid 1px #ccc;
}

#custom-search-input .glyphicon-search{
    font-size: 23px;
}
.search, #manager_list, .a2z, #group_list, #numbers_list, #leads_list, #campaigns_list, #events_list, #reports {
    padding: 5px 5px;
}

#leads_list {
    overflow-x: scroll;
}
#manager_list table tr th, #group_list table tr th, #numbers_list table tr th, #leads_list table tr th,
#campaigns_list table tr th, #events_list table tr th, #report_list tr th, #activity_list tr th {
    border-top: 0;
    text-transform: uppercase;
    color: var(--border);
    font-weight: normal;
    border-bottom-width: 1px;
    border-bottom-color: var(--border);
}
#manager_list table tr td, #group_list table tr td, #numbers_list table tr td, #leads_list table tr td,
#campaigns_list table tr td, #events_list table tr td, #report_list tr td, #activity_list tr td {
    border-top: 0;
    color: var(--table-text);
    vertical-align: middle;
}
#manager_list table tr, #group_list table tr, #numbers_list table tr, #leads_list table tr, #campaigns_list table tr,
#events_list table tr, #report_list tr, #activity_list tr {
    border-bottom: 1px solid var(--border);
}
#numbers_list .btn-confirm {
    padding: 7px 10px;
}
.assign {
    background-color: var(--green);
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 10px;
    color: #fff;
    text-decoration: none;
    padding: 0px 5px 0 10px;
    border-radius: 20px;
    margin: 0 10px 10px 10px;
    font-weight: 600;
    text-align: center;
    -webkit-box-shadow: 0 11px 13px -4px var(--border);
    -moz-box-shadow: 0 11px 13px -4px var(--border);
    box-shadow: 0 11px 13px -4px var(--border);
}
.assign i {
    color: #fff;
    margin-left: 8px;
    font-size: 20px;
}
.flex_w {
    flex: 0 0 35%;
}
.flex_w input {
    padding-right: .5rem !important;
}
.flex_w select {
    border-color: var(--border);
    background-color: var(--header);
    color: var(--table-text);
}
.inactive {
    color: var(--yellow);
    box-shadow: 0px 0px 2px 4px rgba(255, 201, 38, .2);
    border-radius: 50%;
}
.activated {
    color: var(--green);
    box-shadow: 0px 0px 2px 4px rgba(39, 194, 41, .2);
    border-radius: 50%;
}
.actions div {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.actions a:first-child {
    color: var(--table-text);
    text-decoration: none;
}
.actions a:last-child {
    /*color: var(--red);*/
    text-decoration: none;
}
.actions a.delete-action {
    color: var(--red);
    text-decoration: none;
}
.block {
 color: var(--yellow);
 text-decoration: none;
 margin: 0 10px;
}
.redo {
    color: var(--green);
    text-decoration: none;
    margin: 0 10px;
}
.userList {
    margin-bottom: 0;
    margin-left: 15px;
}
.userList label {
    color: var(--border);
    margin-bottom: 0;
}
.userList select {
    border-width: 2px;
    border-color: var(--border);
}
.userList select:focus {
    border-color: var(--border);
    outline: none;
}
.a2z .input-group {
    border: 2px solid var(--border);
    border-radius: 5px;
    color: var(--table-text);
    font-size: 12px;
}
.a2z i {
    background-color: var(--header);
    color: var(--border);
    font-size: 21px;
    padding: 2px;
    margin-right: 5px;
}
.a2z select, .a2z button {
    border: 0;
    height: 100% !important;
    padding-left: 5px;
    color: var(--table-text);
    background-color: #fff !important;
    padding-right: 15px;
}
.a2z select {
    font-size: 14px;
}
.a2z select:focus, .a2z select:active, .a2z select:focus:active {
    color: var(--table-text);
}
.a2z button:focus, .a2z button:active, .a2z button:focus:active, .a2z button:hover {
    background-color: #fff !important;
    outline: none;
    box-shadow: none;
}
.a2z button.active, .a2z button:active, .show>.a2z button.dropdown-toggle {
    background-color: #fff !important;
    outline: none;
    box-shadow: none;
}
.disabled-link {
    cursor: not-allowed;
}
.usr_num {
    color: var(--table-text);
    font-weight: 800;
}
/* radio button */
[type="radio"]:checked,
[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: var(--button-color);
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
/* end of style for radio */
/* custom checkbox */
/* The container */
.check-container {
    display: inline-block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: inherit;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-align: left;
}

/* Hide the browser's default checkbox */
.check-container input {
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 23px;
    width: 23px;
    border-radius: 3px;
    background-color: var(--input);
    border: 1px solid var(--border);
}

/* On mouse-over, add a grey background color */
.check-container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.check-container input:checked ~ .checkmark {
    background-color: var(--button-color);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.check-container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.check-container .checkmark:after {
    left: 8px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/* end of style for checkbox*/
#loader {
    display: none;
    text-align: center;
}
#loader img {
    width: 100px;
}
#phone_list {
    max-height: 400px;
    overflow-y: auto;
    clear: both;
}
#first_action {
    float: right;
    margin-bottom: 20px;
}
#second_action {
    display: none;
}
.red_border {
    border: 1px solid var(--red);
    padding: 20px;
}
.left-part {
    padding: 20px 40px;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: flex-end;
}
.left-part label {
    color: var(--border);
    margin-bottom: 0;
}
.left-part h1 {
    font-weight: 600 !important;
    color: var(--table-text);
    margin-bottom: 0;
}
.left-part a {
    background-color: var(--button-color);
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 12px;
    color: #fff;
    text-decoration: none;
    padding: 6px;
    border-radius: 20px;
    margin-left: 30px;
}
.left-part a i {
    background-color: #fff;
    color: var(--button-color);
    border-radius: 50%;
    margin-right: 8px;
}
.left-part .back_to_list {
    background-color: var(--header);
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 12px;
    color: var(--table-text);
    text-decoration: none;
    padding: 6px;
    border-radius: 20px;
    margin-left: 30px;
    font-weight: 600;
    padding-right: 15px;
    border: 1px solid var(--border);
}
.left-part .back_to_list i {
    color: var(--button-color);
    margin-right: 8px;
    background-color: transparent;
    border-radius: 0;
}
.right-part {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 20px 20px;
}
.right-part #custom-search-input {
    width: 100%;
}
.right-part .a2z, .right-part .search {
    padding-bottom: 0;
}
.assign_phone {
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    text-align: center;
    padding: 30px;
}
.assign_phone .collapse {
    text-align: left;
}
.assign_phone .collapsing, .assign_phone .collapse.show{
    margin-top: 20px;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    flex-direction: column;
    align-items: baseline;
}
.assign_btn {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 12px;
    border: 1px solid var(--border);
    display: inline-block;
    color: var(--button-color);
    border-radius: 5px;
    -webkit-box-shadow: 0 11px 13px -4px var(--border);
    -moz-box-shadow: 0 11px 13px -4px var(--border);
    box-shadow: 0 11px 13px -4px var(--border);
    padding: 7px 10px;
}
.assign_btn i {
    vertical-align: middle;
}
.assign_btn:hover, .assign_btn:focus, .assign_btn:focus:active {
    text-decoration: none;
    color: var(--button-color);
}
.view_phones {
    text-decoration: none;
    background-color: var(--input);
    color: var(--button-color);
    border-radius: 20px;
    padding: 10px;
    margin-left: 5px;
    font-size: 14px;
}
.view_phones:hover, .view_phones:focus, .view_phones:active, .view_phones:focus:active {
    text-decoration: none;
}
.view_phones i {
    color: #fff;
    background-color: var(--button-color);
    border-radius: 50%;
    font-size: 14px;
    padding: 4px;
    vertical-align: middle;
    margin-right: 5px;
}
.btn-reset {
    background-color: var(--input);
    color: var(--button-color);
    margin-top: 20px;
    cursor: pointer;
    display: none;
}
.btn-reset:focus, .btn-reset:active, .btn-reset:focus:active {
    outline: none;
    box-shadow: none;
}
.reset-fix {
    margin: 0 !important;
}
.phones h3 {
    color: var(--table-text);
    font-weight: 600;
    margin: 20px 0;
}
.fileContainer [type=file] {
    opacity: 0;
}
.fileContainer {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    flex-direction: row;
    justify-content: center;
    position: relative;
    margin-right: 20px;
    cursor: pointer;
    align-items: center;
    margin-top: 20px;
}

.fileContainer [type=file] {
    cursor: pointer;
    position: absolute;
    width: 100%;
    z-index: -1;
}
.fileContainer img {
    width: 50px;
}

/* campaigns */

.campaign_list {
    border-left: 1px solid var(--table-text);
    padding: 10px 20px;
}
.cont_nav_fix {
    padding: 10px 40px !important;
}
.campaign_list select {
    border-color: var(--table-text);
    color: var(--table-text);
    margin-right: 20px;
}
.campaign_list select:focus, .campaign_list select:active, .campaign_list select:focus:active {
    outline: none;
    box-shadow: none;
    border-color: currentColor;
}
.campaign_list ul {
    border-bottom: 0;
}
.activeCampaign a {
    color: var(--button-color);
    font-weight: 600;
}
.campaign_list ul li {
    position: relative;
}
.campaign_list ul li hr {
    margin: 0;
    border: 0;
    background-color: var(--button-color);
    height: 3px;
    width: 100%;
    position: absolute;
    bottom: -20px;
    display: none;
}
.activeCampaign hr {
    display: block !important;
}
#campaign_name {
    font-weight: 600;
    margin-bottom: 5px;
    margin-left: 20px;
    color: var(--table-text);
}
.week_days label {
    font-weight: 300 !important;
    color: var(--label) !important;
    font-size: 14px;
}
.week_days .check-container {
    padding-left: 25px !important;
    margin-right: 8px;
}
.timeframe span {
    color: var(--label);
    font-weight: 600;
}
.toggle.e_mail {
    background-color: var(--button-color) !important;
}
.toggle.sms {
    background-color: var(--orange) !important;
}
.toggle.mms {
    background-color: var(--red) !important;
}
.toggle.call {
    background-color: var(--yellow) !important;
}
.toggle.voice {
    background-color: var(--purple) !important;
}
.toggle:checked {
    background-color: var(--dark_green) !important;
  }
.timeframe .clock {
    margin: 0 5px;
}
.timeframe .clock.e_mail, .cale.e_mail {
    color: var(--button-color);
}
.timeframe .clock.sms, .cale.sms {
    color: var(--orange);
}
.timeframe .clock.mms, .cale.mms {
    color: var(--red);
}
.timeframe .clock.call, .cale.call {
    color: var(--yellow);
}
.timeframe .clock.voice, .cale.voice {
    color: var(--purple);
}
.timeframe select {
    width: 90px;
    margin-right: 5px;
}
#fromDate, #toDate {
    width: 178px;
}
#autoresponder_campaign {
    display: none;
}
.fix-m {
    margin: 0 -15px;
}
.fix_inp {
    padding: 12px !important;
}
.campaign-list li:nth-child(2).activeCampaign a {
    color: var(--orange);
}
.campaign-list li:nth-child(2).activeCampaign hr {
    background-color: var(--orange);
}
.campaign-list li:nth-child(3).activeCampaign a {
    color: var(--red);
}
.campaign-list li:nth-child(3).activeCampaign hr {
    background-color: var(--red);
}
.campaign-list li:nth-child(4).activeCampaign a {
    color: var(--yellow);
}
.campaign-list li:nth-child(4).activeCampaign hr {
    background-color: var(--yellow);
}
.campaign-list li:nth-child(5).activeCampaign a {
    color: var(--purple);
}
.campaign-list li:nth-child(5).activeCampaign hr {
    background-color: var(--purple);
}
.broad {
    color: #fff;
    padding: 3px 12px;
    background-color: var(--border);
    border-radius: 3px;
    margin-bottom: 0;
}
.auto {
    color: #fff;
    padding: 3px 12px;
    background-color: var(--green);
    border-radius: 3px;
    margin-bottom: 0;
}
.campaign_detail label, .events label {
    color: var(--text);
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
}
.campaign_detail p {
    color: var(--table-text);
    font-size: 16px;
    text-overflow: ellipsis;
    overflow: hidden;
}
.first i, .second i {
    color: var(--orange);
    margin-right: 10px !important;
    margin-left: 20px !important;
}
.second {
    -webkit-padding-start: 21px;
    -moz-padding-start: 21px;
    -o-padding-start: 21px;
}
.first span, .second span {
    color: var(--table-text);
    font-weight: normal;
}
.first span:first-child, .second span:first-child {
    font-size: 16px;
}
/* custom radio button */
[type="radio"]:checked,
[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: var(--table-text) !important;
    margin-bottom: 0;
    font-weight: normal !important;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 2px solid var(--table-text);
    border-radius: 100%;
    background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 10px;
    height: 10px;
    background: var(--button-color);
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
/* end of custom radio button */
/* custom file input */
.btn-fileContainer [type=file] {
    opacity: 0;
}
.btn-fileContainer {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    cursor: pointer;
    color: #fff;
    background-color: #70769C;
    text-transform: uppercase;
    margin-left: 15px;
}

.btn-fileContainer [type=file] {
    cursor: pointer;
    position: absolute;
    width: 100%;
    z-index: 0;
    left: 0;
    height: 100% !important;
}
.btn-fileContainer i {
    color: #fff;
    margin-right: 5px;
}
/* end of custom file input */
.vd_camp {
    display: none;
}
.disclaimer {
    display: flex !important;
}
.disclaimer a {
    color: var(--button-color) !important;
    margin: 0 0 0 5px;
}
#schedule {
    display: none;
    width: 100%;
}
.audio_cont, .type_mess, .type_mess_img, .type_e {
    display: none;
}
.audio_cont .position-relative i {
    display: none;
    cursor: pointer;
}
#audio {
    padding-right: 40px;
}
#audioFile {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100% !important;
    opacity: 0;
    cursor: pointer;
}
#events-div .left-part, #events-div .right-part {
    padding: 0 !important;
}
#events-div .cont_nav_fix {
    align-items: flex-end !important;
}
.change_w {
    max-width: 47%;
}
.mms_img {
    max-width: 50%;
    height: 200px;
    border: 1px solid;
    margin-bottom: 5px;
    background-color: var(--input);
    border-color: var(--border);
    width: 100%;
    object-fit: contain;
}
/* end of campaigns */
.incoming > div {
    background-color: var(--header);
    border: 2px solid var(--border);
    border-radius: 50%;
    width: 100px;
    height: 100px;
    margin: 0 auto 10px auto;
}
.incoming h2 {
    color: var(--text);
}
.incoming p {
    margin-bottom: 0;
    color: var(--table-text);
}
.ongoing label {
    margin-bottom: 0;
    color: var(--border) !important;
    text-transform: uppercase;
    font-size: 14px;
}
.ongoing p {
    color: var(--table-text);
    font-weight: 600;
    font-size: 18px;
}
.call_fix label {
    color: var(--text) !important;
    text-transform: initial;
}
.wait {
    background-color: var(--orange);
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    font-weight: 600;
    padding: .5rem 1.5rem;
    line-height: 1.25;
    margin: 0 auto;
    border-radius: 2px;
    text-align: center;
}
.act {
    background-color: var(--green);
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    font-weight: 600;
    padding: .5rem 1.5rem;
    line-height: 1.25;
    margin: 0 auto;
    border-radius: 2px;
    text-align: center;
}
.inact {
    background-color: var(--border);
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    font-weight: 600;
    padding: .5rem 1.5rem;
    line-height: 1.25;
    margin: 0 auto;
    border-radius: 2px;
    text-align: center;
}
.forward {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    color: #fff;
    background-color: var(--green);
    border-radius: 20px;
    padding: 5px 8px 5px 13px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
}
.forward i {
    margin-left: 5px;
    font-size: 20px;
}
.forward:focus, .forward:active, .forward:focus:active {
    outline: none;
    box-shadow: none;
}
.redirect_ico {
    background-color: var(--green);
    color: #fff;
    border-radius: 50%;
    padding: 9px;
}
.enlarge {
    max-width: 640px;
}
.info {
    background-color: var(--header);
    color: var(--text) !important;
    font-size: 10px;
    padding: 5px 10px;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    font-weight: 600;
    margin: 0 5px;
    text-decoration: none;
}
.info:hover {
    text-decoration: none;
    color: var(--text);
}
.info i {
    margin-right: 5px;
}

.range-height {
    max-height: 400px;
    overflow-y: auto;
}
.modal-body.range-height{
	 max-height: 450px;
}
.signed {
    position: relative;
    left: 0 !important;
}
.activity a {
    background-color: var(--button-color) !important;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: -webkit-flex !important;
    display: flex !important;
    align-items: center !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    color: #fff !important;
    text-decoration: none !important;
    padding: 6px !important;
    border-radius: 20px !important;
    margin-left: 30px !important;
}
.activity a i {
    background-color: #fff !important;
    color: var(--button-color) !important;
    border-radius: 50% !important;
    margin-right: 8px !important;
}
#call_number, #call_number_info {
    padding-right: 43px;
}
.call-fix {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.callLoader {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.each-stat {
    border: 1px solid var(--border);
    border-radius: 5px;
}
.padded {
    padding: 20px 40px;
}
.each-stat .stats-header {
    border-bottom: 1px solid var(--border);
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.each-stat .stats-info {
    border-right: 2px solid var(--border);
    padding: 15px;
}
.each-stat .stats-info label {
    color: var(--table-text);
    font-size: 14px;
    margin-bottom: 0;
}
.each-stat .stats-info p {
    color: var(--text);
    font-size: 26px;
    font-weight: 600;
}
.each-stat .stats-info .stat:last-child p {
    margin-bottom: 0;
}
.each-stat .stats-body {
    padding: 15px;
}
.each-stat .stats-header h4 {
    font-weight: 600;
    margin-bottom: 5px;
    color: var(--text);
    display: flex;
    align-items: center;
}
.each-stat .stats-header h4 i {
    color: var(--button-color);
    margin-right: 5px;
}
.each-stat .stats-body canvas {
    margin: 0 auto;
}
.custom-col {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 49%;
    -ms-flex: 0 0 49%;
    flex: 0 0 49%;
    max-width: 49%;
    padding: 0 15px;
}
.success {
    display: none;
}
.success .msg {
    color: var(--green);
}
.img-mms {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.img-mms img {
    width: 50%;
}
/* responsive */
@media screen and (max-width: 1950px) {
    #custom-search-input {
        width: 100%;
    }
}
@media screen and (max-width: 1550px) {
    .resp_fix {
        padding: 20px 10px;
    }
    .resp_fix .input-group, .resp_fix select {
        font-size: 12px;
    }
    .reset-fix i {
        font-size: 20px;
    }
    #campaign_name {
        font-size: 1.5rem;
    }
    .userList.resp_fix {
        padding-bottom: 0;
    }
    .resp_fix_title {
        padding-bottom: 20px;
    }
    .resp_fix_title select {
        font-size: 12px;
    }
    .search {
        padding-left: 10px;
    }
    .resp_fix i {
        font-size: 20px;
    }
    .custom-col {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
}
@media screen and (max-width: 1450px) {
    .dropdown-cont i, .dropdown-cont-notif i {
        font-size: 25px;
    }
    .nav-item.active a {
        font-size: 14px;
    }
    .nav-item.active {
        padding: 20px 15px;
    }
    .dropdown-cont-notif img {
        width: 25px;
        height: 25px;
    }
    .nav-item {
        margin: 0 6px;
    }
    .dropdown-cont .nav-link, .dropdown-cont-notif .nav-link {
        padding: 24px 0px;
    }
}
#edit-manager-modal{
	max-height: 500px;
	overflow-y: auto;
}


.incoming_msg_img {
  display: inline-block;
  width: 6%;
}
.received_msg {
  display: inline-block;
  padding: 0 0 0 10px;
  vertical-align: top;
  width: 92%;
 }
 .received_withd_msg p {
  border-radius: 3px;
  color: #000;
  font-size: 14px;

}
.time_date {
  color: #fff;
  display: block;
  font-size: 12px;
  margin: 8px 0 0;
}
.received_withd_msg .time_date {
	color: #000;
}

.received_withd_msg { width: 57%;
	margin-left: 50px;
}
.mesgs {
  float: left;
  padding: 30px 15px 0 25px;
  width: 100%;
}

 .sent_msg p {
  color: #fff;
}
.outgoing_msg{ overflow:hidden; margin:26px 0 26px;}
/*
.sent_msg {
  float: right;
  width: 46%;
}
*/
.bubble {
	margin-bottom: 10px;
}
.input_msg_write input {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  color: #4c4c4c;
  font-size: 15px;
  min-height: 48px;
  width: 100%;
}

.type_msg {border-top: 1px solid #c4c4c4;position: relative;}
.msg_send_btn {
  background: #05728f none repeat scroll 0 0;
  border: medium none;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  font-size: 17px;
  height: 33px;
  position: absolute;
  right: 0;
  top: 11px;
  width: 33px;
}
.messaging { padding: 0 0 50px 0;}
.msg_history {
  /*height: 516px;
  overflow-y: auto;
	*/
}
[data-letters]:before {
  content:attr(data-letters);
  display:inline-block;
  font-size:1em;
  width:2.5em;
  height:2.5em;
  line-height:2.5em;
  text-align:center;
  border-radius:50%;
  background:plum;
  vertical-align:middle;
  margin-right:1em;
  color:white;
  float: left;
  position: relative;
  top: 10px;
}
input.date-range{
	width: 200px !important;
	border: 0px;
}
a.btn-action-gray.long {
    width: 155px;
}

.search-lead{
	width: 350px;
}
.twitter-typeahead .tt-menu,
.twitter-typeahead .tt-dropdown-menu {
  cursor: pointer;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
	/*
  padding: 5px 0;
  margin: 2px 0 0;
  	*/
  list-style: none;
  font-size: 14px;
  text-align: left;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box;
}
.twitter-typeahead .tt-suggestion {
  display: block;
  padding: 10px 10px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
  border: 1px solid #dedede;
}

.twitter-typeahead .tt-suggestion.tt-cursor,
.twitter-typeahead .tt-suggestion:hover,
.twitter-typeahead .tt-suggestion:focus {
/* color: #ffffff; */
  text-decoration: none;
  outline: 0;
  background-color: var(--button-color);
}

.input-group.input-group-lg .twitter-typeahead .form-control {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px;
}
.input-group.input-group-sm .twitter-typeahead .form-control {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.twitter-typeahead {
  width: 88%;
}
.input-group .twitter-typeahead {
  display: block !important;
  height: 34px;
}
.input-group .twitter-typeahead .tt-menu,
.input-group .twitter-typeahead .tt-dropdown-menu {
  top: 32px !important;
}
.input-group .twitter-typeahead:not(:first-child):not(:last-child) .form-control {
  border-radius: 0;
}
.input-group .twitter-typeahead:first-child .form-control {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.input-group .twitter-typeahead:last-child .form-control {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.input-group.input-group-sm .twitter-typeahead {
  height: 30px;
}
.input-group.input-group-sm .twitter-typeahead .tt-menu,
.input-group.input-group-sm .twitter-typeahead .tt-dropdown-menu {
  top: 30px !important;
}
.input-group.input-group-lg .twitter-typeahead {
  height: 46px;
}
.input-group.input-group-lg .twitter-typeahead .tt-menu,
.input-group.input-group-lg .twitter-typeahead .tt-dropdown-menu {
  top: 46px !important;
}
.tt-suggestion__title .search-results-image{
	width: 50px;
	height: 60px;
}

.tt-dataset h4{
	padding: 0px 10px;
}

.twitter-typeahead .tt-menu, .twitter-typeahead .tt-dropdown-menu {
    max-width: 390px;
	width: 100%;
}
.scrollable-dropdown-menu .tt-dropdown-menu {
  max-height: 150px;
  overflow-y: auto;
}
.tt-dataset{
	max-height: 350px;
	overflow-y: auto;
}
.tt-empty{
	padding: 5px 10px;
	color: red;
}
.lead-search-info {
	display: inline;
	font-size: 12px;
}
.lead-search-info .name, .lead-search-info .email, .lead-search-info .phone, .lead-search-info .group {
	/*width: 50%;*/
	white-space: nowrap;
  	overflow: hidden;
  	text-overflow: ellipsis;
	padding: 2px;
}
.lead-search-info .address {
	width: 100%;
	white-space: nowrap;
  	overflow: hidden;
  	text-overflow: ellipsis;
	padding: 2px;
}
.lead-search-info table{
	width: 100%;
}
.lead-search-info table td{
	max-width: 100px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.lead-search-info .name, .lead-search-info .phone {
	float: left;
	width: 160px;
}
.header-lead-form {
	margin-top: 10px;
	margin-bottom: 5px;
}
.header-lead-form .search-div {
	display: inline-flex;
}
.header-lead-form .search-icon{
	position: relative;
	right: 25px;
	top: 10px;
}
.typeahead-spinner {
    position: absolute;
    top: 5px;
    right: 45px;
    display: none;
    width: 28px;
    height: 28px;
}
.modal-header .close {
    padding: 0;
    margin: 0;
}
body {
	background-color: #fff;
}
.btn-group-lg > .btn, .btn-lg {
   font-size: 2rem;
}
.form-control{
	height: auto;
}
.modal-content {
	border: 1px solid;
    min-width: 620px !important;
}
.modal-content .card {
    margin-bottom: 1px;
}
.modal-content .card-body {
    padding: 0;
}
.material-icons.dialer-icon{
	font-size: 14px;
}
.notification-list .notify-item .notify-details {
    margin-left: 0px;
}
.notification-list .notify-item .user-msg {
    margin-left: 0px;
}
.dropdown-item.notify-item{
	background-color: #fff;
}
#typeahead-target{
	position: relative;
	width: 95%;
	top: -35px !important;
	padding: 0px;
}
#typeahead-target.tt-open{
	display: block;
}
#topnav {
   padding: 0px;
}
#navigation {
    padding: 0px 10px;
}
.wrapper {
    padding: 210px 12px 0 12px;
}
.navbar-custom{
	background-color: #fff;
}
#topnav .topbar-menu {
	background-color: var(--button-color) ;
}
#topnav .has-submenu > a, #topnav .has-submenu.active > a{
    color: #fff;
}
/*
#topnav .has-submenu.active > a{
	color: #007aff;
}
*/
.navbar-custom .topnav-menu .nav-link {
   color: #393939;
}
.navbar-custom .app-search .form-control {
	background-color: #393939 !important;
}
.navbar-custom .app-search {
    max-width: 100%;
}
.app-search-box .add-new-lead{
	background-color: var(--button-color);
	position: relative;
	left: 5px;
}
.app-search-box .add-new-lead a{
	color: #fff;
}
.navigation-menu > li > a {
	padding: 14px;
}
table.import-table th{
	min-width: 150px;
}
.print-error-msg {
	color: var(--red)
}
.notification-list .noti-scroll {
    max-height: 430px;
    overflow-y: auto;
}
.notification-list .unread {
	background-color: #F0F0F0;
}


/*----------------------------------------------------------------------------------- */
/*  Chat widget */
/*----------------------------------------------------------------------------------- */

.chat {
    padding-bottom: 52px;
}
.chat .widget-content {
    padding-right: 20px;
    background-color: white;
}
.chat .widget-content .scrollbar-path-vertical {
    bottom: 56px !important;
}
.chat .widget-content ul {
    list-style: none;
    padding: 0;
}
.chat .widget-content ul li {
    margin-bottom: 14px;
    padding-left: 40px;
    padding-right: 80px;
    position: relative;
}

.chat .widget-content ul li:last-child {
    margin-bottom: 0;
}
.chat .widget-content ul li img {
    position: absolute;
    bottom: -2px;
    left: 0;
    border-radius: 50%;
}
.chat .widget-content ul li .bubble {
    padding: 12px 15px;
    background: #e5e5ea;
    border-radius: 15px;
    position: relative;
}
.chat .widget-content ul li .bubble:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -5px;
    background: url("../images/chat-left.png") left top no-repeat;
    width: 13px;
    height: 13px;
    display: block;
}
@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    .chat .widget-content ul li .bubble:after {
        background-image: url("../images/chat-left@2x.png");
        background-size: 13px 13px;
    }
}
.chat .widget-content ul li .bubble .user-name {
    font-size: 1.1em;
    margin-bottom: 8px;
    display: inline-block;
}
.chat .widget-content ul li .bubble p.message {
    font-size: 0.95em;
    margin-bottom: 12px;
    color: #333333;
}
.chat .widget-content ul li .bubble p.message a{ border-radius: 50px; width: 16px; height: 16px; padding: 0; background:#ccc; margin: -18px 0 0; border:0; opacity: 0}
.chat .widget-content ul li .bubble p.message a i.fa{ margin:3px 0 0 3px; float: left; font-size: 10px;}
.chat .widget-content ul li .bubble p.message a:hover i{ }

.chat .widget-content ul li .bubble:hover p.message a{ opacity: 1 }
.chat .widget-content ul li .bubble .time {
    font-size: 0.8em;
    color: #888888;
    margin-bottom: 0;
}
.chat .widget-content ul li.current-user {
    padding-right: 40px;
    padding-left: 80px;
}
.chat .widget-content ul li.current-user img {
    right: 0;
    left: auto;
}
.chat .widget-content ul li.current-user .bubble {
    background: #178efe;
}
.chat .widget-content ul li.current-user .bubble:after {
    background: url("../images/chat-right.png") left top no-repeat;
    left: auto;
    right: -6px;
}
@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    .chat .widget-content ul li.current-user .bubble:after {
        background-image: url("../images/chat-right@2x.png");
        background-size: 13px 13px;
    }
}
.chat .widget-content ul li.current-user p,
.chat .widget-content ul li.current-user a {
    color: white !important;
}
.chat .widget-content ul li.current-user .time {
    opacity: 0.75;
}

.chat .bubble {
    padding: 12px 15px;
    background: #e5e5ea;
    border-radius: 15px;
    position: relative;
}

.incoming_msg.bubble {
    margin-right: 80px;
}
.outgoing_msg.bubble{
	background: #178efe;
	margin-left: 80px;
}
.message-status {
	float: right;
    color: #fff;
}

@font-face{font-family:'Glyphicons Halflings';src:url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.eot');src:url('//netdna.bootstrapcdn.com/bootstrap/3.0.0//fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.woff') format('woff'),url('//netdna.bootstrapcdn.com/bootstrap/3.0.0//fonts/glyphicons-halflings-regular.ttf') format('truetype'),url('//netdna.bootstrapcdn.com/bootstrap/3.0.0//fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');}.glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;}
.glyphicon-asterisk:before{content:"\2a";}
.glyphicon-plus:before{content:"\2b";}
.glyphicon-euro:before{content:"\20ac";}
.glyphicon-minus:before{content:"\2212";}
.glyphicon-cloud:before{content:"\2601";}
.glyphicon-envelope:before{content:"\2709";}
.glyphicon-pencil:before{content:"\270f";}
.glyphicon-glass:before{content:"\e001";}
.glyphicon-music:before{content:"\e002";}
.glyphicon-search:before{content:"\e003";}
.glyphicon-heart:before{content:"\e005";}
.glyphicon-star:before{content:"\e006";}
.glyphicon-star-empty:before{content:"\e007";}
.glyphicon-user:before{content:"\e008";}
.glyphicon-film:before{content:"\e009";}
.glyphicon-th-large:before{content:"\e010";}
.glyphicon-th:before{content:"\e011";}
.glyphicon-th-list:before{content:"\e012";}
.glyphicon-ok:before{content:"\e013";}
.glyphicon-remove:before{content:"\e014";}
.glyphicon-zoom-in:before{content:"\e015";}
.glyphicon-zoom-out:before{content:"\e016";}
.glyphicon-off:before{content:"\e017";}
.glyphicon-signal:before{content:"\e018";}
.glyphicon-cog:before{content:"\e019";}
.glyphicon-trash:before{content:"\e020";}
.glyphicon-home:before{content:"\e021";}
.glyphicon-file:before{content:"\e022";}
.glyphicon-time:before{content:"\e023";}
.glyphicon-road:before{content:"\e024";}
.glyphicon-download-alt:before{content:"\e025";}
.glyphicon-download:before{content:"\e026";}
.glyphicon-upload:before{content:"\e027";}
.glyphicon-inbox:before{content:"\e028";}
.glyphicon-play-circle:before{content:"\e029";}
.glyphicon-repeat:before{content:"\e030";}
.glyphicon-refresh:before{content:"\e031";}
.glyphicon-list-alt:before{content:"\e032";}
.glyphicon-flag:before{content:"\e034";}
.glyphicon-headphones:before{content:"\e035";}
.glyphicon-volume-off:before{content:"\e036";}
.glyphicon-volume-down:before{content:"\e037";}
.glyphicon-volume-up:before{content:"\e038";}
.glyphicon-qrcode:before{content:"\e039";}
.glyphicon-barcode:before{content:"\e040";}
.glyphicon-tag:before{content:"\e041";}
.glyphicon-tags:before{content:"\e042";}
.glyphicon-book:before{content:"\e043";}
.glyphicon-print:before{content:"\e045";}
.glyphicon-font:before{content:"\e047";}
.glyphicon-bold:before{content:"\e048";}
.glyphicon-italic:before{content:"\e049";}
.glyphicon-text-height:before{content:"\e050";}
.glyphicon-text-width:before{content:"\e051";}
.glyphicon-align-left:before{content:"\e052";}
.glyphicon-align-center:before{content:"\e053";}
.glyphicon-align-right:before{content:"\e054";}
.glyphicon-align-justify:before{content:"\e055";}
.glyphicon-list:before{content:"\e056";}
.glyphicon-indent-left:before{content:"\e057";}
.glyphicon-indent-right:before{content:"\e058";}
.glyphicon-facetime-video:before{content:"\e059";}
.glyphicon-picture:before{content:"\e060";}
.glyphicon-map-marker:before{content:"\e062";}
.glyphicon-adjust:before{content:"\e063";}
.glyphicon-tint:before{content:"\e064";}
.glyphicon-edit:before{content:"\e065";}
.glyphicon-share:before{content:"\e066";}
.glyphicon-check:before{content:"\e067";}
.glyphicon-move:before{content:"\e068";}
.glyphicon-step-backward:before{content:"\e069";}
.glyphicon-fast-backward:before{content:"\e070";}
.glyphicon-backward:before{content:"\e071";}
.glyphicon-play:before{content:"\e072";}
.glyphicon-pause:before{content:"\e073";}
.glyphicon-stop:before{content:"\e074";}
.glyphicon-forward:before{content:"\e075";}
.glyphicon-fast-forward:before{content:"\e076";}
.glyphicon-step-forward:before{content:"\e077";}
.glyphicon-eject:before{content:"\e078";}
.glyphicon-chevron-left:before{content:"\e079";}
.glyphicon-chevron-right:before{content:"\e080";}
.glyphicon-plus-sign:before{content:"\e081";}
.glyphicon-minus-sign:before{content:"\e082";}
.glyphicon-remove-sign:before{content:"\e083";}
.glyphicon-ok-sign:before{content:"\e084";}
.glyphicon-question-sign:before{content:"\e085";}
.glyphicon-info-sign:before{content:"\e086";}
.glyphicon-screenshot:before{content:"\e087";}
.glyphicon-remove-circle:before{content:"\e088";}
.glyphicon-ok-circle:before{content:"\e089";}
.glyphicon-ban-circle:before{content:"\e090";}
.glyphicon-arrow-left:before{content:"\e091";}
.glyphicon-arrow-right:before{content:"\e092";}
.glyphicon-arrow-up:before{content:"\e093";}
.glyphicon-arrow-down:before{content:"\e094";}
.glyphicon-share-alt:before{content:"\e095";}
.glyphicon-resize-full:before{content:"\e096";}
.glyphicon-resize-small:before{content:"\e097";}
.glyphicon-exclamation-sign:before{content:"\e101";}
.glyphicon-gift:before{content:"\e102";}
.glyphicon-leaf:before{content:"\e103";}
.glyphicon-eye-open:before{content:"\e105";}
.glyphicon-eye-close:before{content:"\e106";}
.glyphicon-warning-sign:before{content:"\e107";}
.glyphicon-plane:before{content:"\e108";}
.glyphicon-random:before{content:"\e110";}
.glyphicon-comment:before{content:"\e111";}
.glyphicon-magnet:before{content:"\e112";}
.glyphicon-chevron-up:before{content:"\e113";}
.glyphicon-chevron-down:before{content:"\e114";}
.glyphicon-retweet:before{content:"\e115";}
.glyphicon-shopping-cart:before{content:"\e116";}
.glyphicon-folder-close:before{content:"\e117";}
.glyphicon-folder-open:before{content:"\e118";}
.glyphicon-resize-vertical:before{content:"\e119";}
.glyphicon-resize-horizontal:before{content:"\e120";}
.glyphicon-hdd:before{content:"\e121";}
.glyphicon-bullhorn:before{content:"\e122";}
.glyphicon-certificate:before{content:"\e124";}
.glyphicon-thumbs-up:before{content:"\e125";}
.glyphicon-thumbs-down:before{content:"\e126";}
.glyphicon-hand-right:before{content:"\e127";}
.glyphicon-hand-left:before{content:"\e128";}
.glyphicon-hand-up:before{content:"\e129";}
.glyphicon-hand-down:before{content:"\e130";}
.glyphicon-circle-arrow-right:before{content:"\e131";}
.glyphicon-circle-arrow-left:before{content:"\e132";}
.glyphicon-circle-arrow-up:before{content:"\e133";}
.glyphicon-circle-arrow-down:before{content:"\e134";}
.glyphicon-globe:before{content:"\e135";}
.glyphicon-tasks:before{content:"\e137";}
.glyphicon-filter:before{content:"\e138";}
.glyphicon-fullscreen:before{content:"\e140";}
.glyphicon-dashboard:before{content:"\e141";}
.glyphicon-heart-empty:before{content:"\e143";}
.glyphicon-link:before{content:"\e144";}
.glyphicon-phone:before{content:"\e145";}
.glyphicon-usd:before{content:"\e148";}
.glyphicon-gbp:before{content:"\e149";}
.glyphicon-sort:before{content:"\e150";}
.glyphicon-sort-by-alphabet:before{content:"\e151";}
.glyphicon-sort-by-alphabet-alt:before{content:"\e152";}
.glyphicon-sort-by-order:before{content:"\e153";}
.glyphicon-sort-by-order-alt:before{content:"\e154";}
.glyphicon-sort-by-attributes:before{content:"\e155";}
.glyphicon-sort-by-attributes-alt:before{content:"\e156";}
.glyphicon-unchecked:before{content:"\e157";}
.glyphicon-expand:before{content:"\e158";}
.glyphicon-collapse-down:before{content:"\e159";}
.glyphicon-collapse-up:before{content:"\e160";}
.glyphicon-log-in:before{content:"\e161";}
.glyphicon-flash:before{content:"\e162";}
.glyphicon-log-out:before{content:"\e163";}
.glyphicon-new-window:before{content:"\e164";}
.glyphicon-record:before{content:"\e165";}
.glyphicon-save:before{content:"\e166";}
.glyphicon-open:before{content:"\e167";}
.glyphicon-saved:before{content:"\e168";}
.glyphicon-import:before{content:"\e169";}
.glyphicon-export:before{content:"\e170";}
.glyphicon-send:before{content:"\e171";}
.glyphicon-floppy-disk:before{content:"\e172";}
.glyphicon-floppy-saved:before{content:"\e173";}
.glyphicon-floppy-remove:before{content:"\e174";}
.glyphicon-floppy-save:before{content:"\e175";}
.glyphicon-floppy-open:before{content:"\e176";}
.glyphicon-credit-card:before{content:"\e177";}
.glyphicon-transfer:before{content:"\e178";}
.glyphicon-cutlery:before{content:"\e179";}
.glyphicon-header:before{content:"\e180";}
.glyphicon-compressed:before{content:"\e181";}
.glyphicon-earphone:before{content:"\e182";}
.glyphicon-phone-alt:before{content:"\e183";}
.glyphicon-tower:before{content:"\e184";}
.glyphicon-stats:before{content:"\e185";}
.glyphicon-sd-video:before{content:"\e186";}
.glyphicon-hd-video:before{content:"\e187";}
.glyphicon-subtitles:before{content:"\e188";}
.glyphicon-sound-stereo:before{content:"\e189";}
.glyphicon-sound-dolby:before{content:"\e190";}
.glyphicon-sound-5-1:before{content:"\e191";}
.glyphicon-sound-6-1:before{content:"\e192";}
.glyphicon-sound-7-1:before{content:"\e193";}
.glyphicon-copyright-mark:before{content:"\e194";}
.glyphicon-registration-mark:before{content:"\e195";}
.glyphicon-cloud-download:before{content:"\e197";}
.glyphicon-cloud-upload:before{content:"\e198";}
.glyphicon-tree-conifer:before{content:"\e199";}
.glyphicon-tree-deciduous:before{content:"\e200";}
.glyphicon-briefcase:before{content:"\1f4bc";}
.glyphicon-calendar:before{content:"\1f4c5";}
.glyphicon-pushpin:before{content:"\1f4cc";}
.glyphicon-paperclip:before{content:"\1f4ce";}
.glyphicon-camera:before{content:"\1f4f7";}
.glyphicon-lock:before{content:"\1f512";}
.glyphicon-bell:before{content:"\1f514";}
.glyphicon-bookmark:before{content:"\1f516";}
.glyphicon-fire:before{content:"\1f525";}
.glyphicon-wrench:before{content:"\1f527";}

.btn.disabled, .btn:disabled {
    opacity: .45;
}
.navbar-custom {
    height: 100px;
}

#topnav .topbar-menu {
    margin-top: 100px;
}

td.note-section{
	max-width: 200px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.activity-section.range-height, .activity-qc-section.range-height{
	max-height: 400px;
	height: 400px;
}
textarea.messaging{
	height: 200px;
	padding: 10px;
}
.multiple-template {
	height: 80px !important;
}
.multiple-content .template {
	margin-bottom: 10px;
}
.btn-delete-template {
	margin: 10px;
}

table tr.task.upcoming td{
	background-color: #ffffd8;
}
table tr.task.past-due td{
	background-color: #ffc4c4;
}
#em_talk_time {
    line-height: 70px;
    max-height: 70px;
    padding: 0 15px;
}
.logo-box {
    margin-top: 10px !important;
}
