*{
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
table {
    background-color: transparent;
    border-collapse: collapse;
    border-spacing: 0;
    max-width: 100%;
}

body{
    font-family: "open sans regular", arial, tahoma;
}

@font-face{font-family: "open sans";src: url(fonts/OpenSans-CondLight.ttf);}@font-face{font-family: "open sans regular";src: url(fonts/OpenSans-Regular_0.ttf);}@font-face{font-family: "open sans light";src: url(fonts/OpenSans-Light_0.ttf);}@font-face{font-family: "open sans bold";src: url(fonts/OpenSans-Bold.ttf);}@font-face{font-family: "open sans semibold";src: url(fonts/OpenSans-Semibold.ttf);}@font-face{font-family: "open sans extrabold";src: url(fonts/OpenSans-Extrabold.ttf);}

.wraper-page {
    background: #0091ea;
    color: white;
    /* float: left; */
    width: 100%;
    padding: 18px 10px;
    position: fixed;
    height: 100%;
}

.full-page {
    width: 100%;
    float: left;
    border: 5px solid white;
    border-radius: 15px;
    overflow: hidden;
    height: 100%;
    position: relative;
}

:after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.header-page {
    width: 100%;
    float: left;
    background: rgb(187 48 42) !important;
    color: rgb(247 210 71) !important;
    padding: 15px 20px;
    position: absolute;
    top: 0;
    left: 0;
}

p.number-rows {
    position: absolute;
    height: 100%;
    width: 42px;
    left: 0;
    border: 1px solid rgba(0, 49, 158, 0.68);
    top: 0;
    border-radius: 50%;
    background: white;
    text-align: center;
    flex-wrap: wrap;
    display: flex;
}

label.name-rows {
    width: 100%;
    background: rgba(0, 49, 158, 0.68);
    float: left;
    padding: 10px 43px;
    height: 100%;
    color: white;
    flex-wrap: wrap;
    display: flex;
    text-transform: uppercase;
    /* border-radius: 0px 30px 30px 0px; */
    border-radius: 10px;
}

.full-name {
    width: 100%;
    /* padding-left: 30px; */
    float: left;
    /* padding-right: 15px; */
    /* border-radius: 20px; */
    position: relative;
    /* padding: 10px; */
    height: 100%;
    flex-wrap: wrap;
    display: flex;
    cursor: pointer;
}

.full-name p, .full-name label{
    cursor: pointer;
    font-size: 20px;
    font-weight: bold;
}

.rows-page {
    width: 50%;
    float: left;
    padding-bottom: 10px;
}

.data-content-page {
    width: 100%;
    float: left;
    margin: auto;
    height: 100%;
}

.data-page h3 {
    text-transform: uppercase;
    padding: 15px;
    font-size: 20px;
    text-align: center;
    color: red;
}

h3.header-number {
    width: 100%;
    position: absolute;
    top: 63px;
    left: 0;
}

.data-page {
    width: 100%;
    float: left;
    height: 100%;
}

.data-page-kiosk {
    overflow: auto;
    flex-wrap: wrap;
    display: flex;
}

.content-page {
    width: 100%;
    float: left;
    background: white;
    color: black;
    height: 100%;
    padding-top: 112px;
    background-position: bottom !important;
    background-size: cover !important;
}

.page-kiosk-wraper {
    padding-top: 118px;
}

.header-page h2 {
    font-size: 28px;
    text-transform: uppercase;
    text-align: center;
}

.header-page h3 {
    width: 100%;
    float: left;
    text-transform: uppercase;
    text-align: center;
    font-size: 36px;
    padding-bottom: 5px;
    font-weight: bold;
}

label.num-data {
    margin: auto;
}

.slip--rows {
    /* padding-right: 0 !important; */
}

.name-flex{
    margin: auto 0px;
    width: 100%;
}

.delay-time {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.66);
    flex-wrap: wrap;
    display: flex;
}

label#timer-data {
    color: white;
    margin: auto;
    font-size: 262px;
    font-weight: bold;
}

.count-timer{
    display: none;
}

.content-popup-print{
    display: none;
}

@media print {
  body * {
    visibility: hidden;
  }
  #section-to-print, #section-to-print * {
    visibility: visible;
  }
  #section-to-print {
    position: absolute;
    left: 0;
    top: 0;
  }
}

.row-info-member {
    width: 100%;
    float: left;
    padding: 10px;
    border-bottom: 1px solid rgba(5, 5, 228, 0.55);
}

.info-item {
    float: left;
    border-left: 1px solid;
    padding-left: 10px;
}

.tool-action {
    float: right;
}

label.title-info-member {
    float: left;
    font-size: 16px;
    padding: 3px;
}

.info-item h3 {
    font-weight: bold;
    text-transform: uppercase;
    color: black;
    font-size: 16px;
    float: left;
    padding: 3px 10px;
}

.info-item:last-child {
    border: 0;
}

.row-info-member .info-item:first-child {
    border: 0;
    padding: 0;
}

button.btn-change-pass {
    float: left;
    padding: 6px;
    border: 0;
    background: #0d47a1;
    border-radius: 5px;
    color: white;
    margin-right: 10px;
    font-size: 14px;
}

a.logout {
    background: red;
    color: white;
    padding: 5px;
    border-radius: 5px;
    font-size: 14px;
    text-decoration: none;
    float: left;
    height: 28px;
    margin-right: 10px;
}

label.date-today {
    font-size: 14px;
    font-weight: bold;
    padding: 5px 9px;
    float: left;
    border-left: 2px solid #0d47a1;
    border-right: 2px solid #0d47a1;
}

.row-action-call {
    width: 100%;
    float: left;
}

.cols-50 {
    width: 50%;
    float: left;
    height: 100%;
}

.cols-100 {
    width: 100%;
    float: left;
    height: 100%;
}

.number-action {
    /* margin-top: 5px; */
    width: 100%;
    float: left;
    padding: 10px;
    height: 60%;
    cursor: pointer;
}

.recall-queue {
    width: 100%;
    float: left;
    padding: 10px;
    height: 40%;
    cursor: pointer;
}

.data-list-row {
    width: 100%;
    border-radius: 3px;
    float: left;
    height: 100%;
    overflow: hidden;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.43);
}

h3.header-title-call {
    font-size: 16px;
    font-weight: bold;
    color: white;
    padding: 10px;
    border-bottom: 1px solid #0d47a1;
    background: #0091ea;
}

.recall-queue .data-list-row {
    box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.43);
}

button.btn-tool-call {
    width: 100%;
    padding: 20px 10px;
    /* margin-bottom: 10px; */
    border: 0;
    outline: none;
    background: #0d47a1;
    color: white;
    border-radius: 5px;
    font-size: 22px;
    cursor: pointer;
}

button.btn-tool-missed {
    width: 50%;
    padding: 15px 10px;
    margin-bottom: 10px;
    border: 0;
    outline: none;
    background: #0091ea;
    color: white;
    border-radius: 5px;
    font-size: 22px;
    cursor: pointer;
}

button.btn-tool-call:hover {
    background: #0505e4;
}

.content-tool-action ul li {
    width: 33.33333%;
    float: left;
    text-align: center;
    padding: 8px 15px;
}

.content-tool-action ul {
    list-style: none;
    width: 100%;
    float: left;
    margin: auto;
}

.content-tool-action {
    width: 100%;
    float: left;
    border-left: 1px solid #ccc;
    height: calc(100% - 151px);
    flex-wrap: wrap;
    display: flex;
}

.wraper-tool {
    width: 100%;
    float: left;
    padding: 10px;
    height: 100%;
}

.list-number-recall ul li label {
    width: 85%;
    float: left;
    text-align: center;
    padding: 5px;
    font-size: 26px;
    font-weight: bold;
}

.list-number-recall ul li {
    width: 100%;
    float: left;
    text-align: center;
    border-bottom: 1px solid #ededed;
}

.list-number-recall ul {
    list-style: none;
    width: 100%;
    height: 100%;
    float: left;
    overflow: auto;
}

.list-number-recall {
    width: 100%;
    float: left;
}

.list-number-call ul {
    list-style: none;
    float: left;
    width: 100%;
    height: calc(100% - 40px);
    overflow: auto;
}

.list-number-call {
    width: 100%;
    float: left;
}

.list-number-call ul li {
    width: 100%;
    float: left;
    text-align: center;
    border-bottom: 1px solid #ededed;
}

.list-number-call ul li label {
    width: 100%;
    float: left;
    text-align: center;
    padding: 5px;
    font-size: 26px;
    font-weight: bold;
}

.no-access {
    position: relative;
}

.no-access:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.47);
}

.list-number-call ul li.selected {
    background: #0d47a1;
    color: white;
}

.list-number-recall ul li.selected {
    background: #ffd778;
}

.cols-40{
    width: 40%;
    float: left;
    height: 100%;
}

.cols-60{
    width: 60%;
    float: left;
    height: 100%;
}

.cols-30{
    width: 30%;
    float: left;
}

.cols-70{
    width: 70%;
    float: left;
}

.wraper-page-viewlist {
    width: 100%;
    float: left;
    height: 100%;
    position: fixed;
    background: #0091ea;
    color: white;
}

.full-page-viewlist {
    width: 100%;
    float: left;
    height: 100%;
}

.content-left-viewlist {
    width: 100%;
    float: left;
    height: 100%;
}

.show-info-state {
    width: 100%;
    float: left;
    height: 100%;
    float: left;
    background: white;
}

.show-number-missed {
    width: 100%;
    float: left;
    height: 40%;
    float: left;
    background: white;
}

.header-title-listview-messed {
    width: 100%;
    float: left;
    background: #0d47a1;
    padding: 10px;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
}

ul.list-call-missed {
    width: 100%;
    float: left;
    overflow: auto;
    list-style: none;
}

ul.list-call-missed li {
    width: 20%;
    float: left;
    color: #00009e;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    position: relative;
    padding: 5px;
}

ul.list-call-missed li:before {
    content: "";
    width: 1px;
    height: 100%;
    background: #0091ea;
    position: absolute;
    left: -1px;
    top: 0;
}

.content-right-viewlist {
    width: 100%;
    float: left;
    height: 100%;
}

.viewlist-header {
    width: 100%;
    float: left;
}

.content-header-viewlist {
    width: 100%;
    float: left;
    background: rgb(187 48 42);
    padding: 10px;
    text-align: center;
    text-transform: uppercase;
}

.content-header-viewlist
 h3 {
    padding-bottom: 5px;
    width: 100%;
    float: left;
}

.content-header-viewlist
 h2 {
    width: 100%;
    float: left;
    font-size: 37px;
    color: white;
}

.list-number-pendding {
    width: 100%;
    float: left;
}

.row-listview-number {
    width: 100%;
    float: left;
}

.header-listview-pendding {
    background: #00009e;
    border-top: 1px solid white;
    border-bottom: 1px solid white;
}

.cols-number-pendding {
    width: 50%;
    float: left;
    text-align: center;
    position: relative;
}

.header-listview-pendding label.title-number-viewlist {
    width: 100%;
    float: left;
    font-size: 16px;
    font-weight: bold;
    padding: 5px;
}

.cols-number-ser {
    width: 50%;
    float: left;
    text-align: center;
}

.cols-number-pendding:before {
    content: "";
    position: absolute;
    width: 1px;
    background: rgba(255, 255, 255, 0.91);
    height: 100%;
    top: 0;
    /*right: -1px;*/
    left: -1px;
}

.row-listview-number ul {
    width: 100%;
    float: left;
    list-style: none;
    overflow: auto;
}

.row-listview-number ul li.number-item {
    width: 100%;
    float: left;
}

.row-listview-number ul li.number-item div {
    padding: 4px;
    font-size: 38px;
    font-weight: bold;
    border-bottom: 1px solid rgba(255, 255, 255, 0.28);
}

.slide-data {
    width: 100%;
    float: left;
    height: 100%;
    overflow: hidden;
}

.slide-item {
    width: 100%;
    float: left;
    height: 100%;
}

.slide-item img {
    max-width: 100%;
    max-height: 100%;
    height:  100%;
    text-align: center;
    margin: auto;
}

.size-maxxx {
    font-size: 11px;
}

.size-mid {
    font-size: 13px;
}

.wraper-data-home {
    width: 100%;
    float: left;
    height: 100%;
    flex-wrap: wrap;
    display: flex;
}

.split-btn-home {
    width: 50%;
    float: left;
    margin: auto;
    text-align: center;
    height: 200px;
    flex-wrap: wrap;
    display: flex;
}

.split-btn-home a {
    font-size: 36px;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
    height: 100%;
    float: left;
    width: 75%;
    margin: auto;
    background: #5273bd;
    color: white;
    flex-wrap: wrap;
    border-radius: 25px;
    display: flex;
}

.split-btn-home a label {
    width: 100%;
    text-align: center;
    margin: auto;
    float: left;
    cursor: pointer;
}

.data-search-page {
    width: 100%;
    height: 100%;
    float: left;
}

.data-search-page iframe {
    width: 100%;
    height: 100%;
    float: left;
}

a.reback-page {
    position: absolute;
    top: 0;
    left: 0;
    background: #0091ea;
    z-index: 999;
    width: 100px;
    border-right: 5px solid white;
    border-bottom: 5px solid white;
    border-radius: 0px 0px 10px;
    text-align: center;
    padding: 5px;
    text-decoration: none;
    color: white;
}

a.reback-page:hover {
    background: white;
    color: #0d47a1;
}

/*nhapnhay*/
@-webkit-keyframes glowing {
  0% { background-color: red; -webkit-box-shadow: 0 0 3px red; }
  50% { background-color: #0d47a1; -webkit-box-shadow: 0 0 10px #0d47a1; }
  100% { background-color: red; -webkit-box-shadow: 0 0 3px red; }
}
 
@-moz-keyframes glowing {
  0% { background-color: red; -moz-box-shadow: 0 0 3px red; }
  50% { background-color: #0d47a1; -moz-box-shadow: 0 0 10px #0d47a1; }
  100% { background-color: red; -moz-box-shadow: 0 0 3px red; }
}
 
@-o-keyframes glowing {
  0% { background-color: red; box-shadow: 0 0 3px red; }
  50% { background-color: #0d47a1; box-shadow: 0 0 10px #0d47a1; }
  100% { background-color: red; box-shadow: 0 0 3px red; }
}
 
@keyframes glowing {
  0% { background-color: red; box-shadow: 0 0 3px red; }
  50% { background-color: #0d47a1; box-shadow: 0 0 10px #0d47a1; }
  100% { background-color: red; box-shadow: 0 0 3px red; }
}
 
.pause-services {
  -webkit-animation: glowing 1500ms infinite;
  -moz-animation: glowing 1500ms infinite;
  -o-animation: glowing 1500ms infinite;
  animation: glowing 1500ms infinite;
}

label.name-flex.listing-ser {
    position: relative;
        z-index: 999;
}

.pause-services {
    position: absolute;
    top: 0;
    right: 10px;
    background: red;
    border-radius: 15px;
    padding: 5px 15px;
    font-size: 14px;
}

p.title-pause {
    font-size: 14px !important;
    margin: 0;
    /* width: 100%; */
    /* float: left; */
}

span.date-pause {
    font-size: 12px;
    text-align: center;
    width: 100%;
    float: left;
}

.item-pause-data p.number-rows {
    border: 1px solid #ccc;
}

.item-pause-data .name-rows {
    background: #ccc;
}

.item-pause-data label.num-data {
    color: gray;
}

button.btn-tool-call.load-call {
    background: #0091ea;
    cursor: not-allowed;
}

button.btn-closing {
    position: absolute;
    top: 0;
    right: 0;
    width: 37px;
    height: 37px;
    background: red;
    border: 0;
    cursor: pointer;
    border-radius: 0px 0px 0px 10px;
    border-left: 5px solid white;
    border-bottom: 5px solid white;
}

button.btn-closing:before {
    content: "";
    width: 15px;
    height: 2px;
    background: white;
    position: absolute;
    transform: rotate(45deg);
    top: 14px;
    right: 9px;
}

button.btn-closing:after {
    content: "";
    width: 15px;
    height: 2px;
    background: white;
    position: absolute;
    transform: rotate(-45deg);
    top: 14px;
    right: 9px;
}

.wraper-page-viewlist.is-marquee {
    height: calc(100% - 41px);
}

marquee.marquee-scroll {
    position: fixed;
    bottom: 0;
    left: 0;
    min-width: 100%;
    background: #0066ff;
    /* width: max-content; */
}

p.item-marquee {
    /* float: left; */
    margin: 0px 40px;
    padding: 6px 15px;
    font-size: 21px;
    display: inline-block;
}

span.wraper-languages {
    position: absolute;
    top: 10px;
    right: 10px;
    background: transparent;
    z-index: 999;
    text-align: center;
    text-decoration: none;
    color: white;
    overflow: hidden;
}

select.cbox-languages {
    padding: 5px;
    background: none;
    border: 0;
    color: #0d47a1;
    font-size: 16px;
    outline: none;
}

.title-survey {
    width: 100%;
    text-align: center;
    position: relative;
    padding: 10px;
    font-size: 24px;
}

a.flag-languages {
    float: left;
    margin: 0px 5px;
}

.input_box_container {
    width: 100%;
    float: left;
    text-align: center;
}

.input_box {
    font-size: 32px;
    padding: 10px;
    outline: none;
    font-weight: bold;
    color: red;
    text-align: center;
    border: 1px solid #ccc;
}

.wraper-content-survey {
    width: 100%;
    float: left;
    flex-wrap: wrap;
    display: flex;
    height: calc(100% - 13%);
}

.content-survey {
    width: calc(100% - 10%);
    float: left;
    margin: auto;
}

label.item-result-survey {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    cursor: pointer;
}

label.item-result-survey input {
    display: none;
}

label.item-result-survey label {
    width: 100%;
    float: left;
    padding: 10px;
    border: 1px solid #0d47a1;
    border-radius: 8px;
    cursor: pointer;
}

label.item-result-survey label img {
    float: left;
    max-width: 40px;
    max-height: 40px;
}

label.item-result-survey label p {
    width: calc(100% - 40px);
    float: left;
    font-size: 22px;
    padding: 5px;
    padding-left: 10px;
}

label.item-result-survey label:hover {
    background: #0d47a1;
    color: white;
}

label.item-result-survey input:checked + label {
    background: #0d47a1;
    color: white;
}

span.wraper-btn-survey {
    width: 100%;
    float: left;
    text-align: center;
    padding: 5px;
    padding-top: 30px;
}

a.btn-survey {
    background: #0d47a1;
    padding: 15px 50px;
    text-decoration: none;
    color: white;
    border-radius: 30px;
    position: relative;
    display: -webkit-inline-box;
}

a.btn-survey:before {content: "";width: calc(100% - 10px);height: calc(100% - 10px);background: transparent;position: absolute;top: 5px;left: 5px;border-radius: 30px;border: 1px solid white;}

span.txt-box-other {
    width: 100%;
    float: left;
    margin-top: 10px;
    margin-bottom: 10px;
}

textarea.orther-put {
    width: 100%;
    float: left;
    resize: none;
    height: 80px;
    outline: none;
    padding: 10px;
    font-size: 18px;
}

a.btn-back-survey {
    background: #ff6767;
    padding: 15px 50px;
    text-decoration: none;
    color: white;
    border-radius: 30px;
    position: relative;
    display: -webkit-inline-box;
    margin-left: 25px;
}

.colds-12 {
    width: 100% !important;
    padding: 0px 20% 10px 20%;
}

.colds-6 {
    width: 50% !important;
    padding-left: 10px;
    padding-right: 10%;
}

.colds-4 {
    width: 33.3333333333333333% !important;
    padding: 5px;
}

.data-page::-webkit-scrollbar {
    width: 0px;
}

.data-page::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.data-page::-webkit-scrollbar-thumb {
    background: #888;
}

.data-page::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.colds-6:nth-child(odd) {
    padding-right: 0px;
    padding-left: 10%;
}

ul.list-name-data {
    list-style: none;
    text-align: center;
}

.default-height {
    height: 100px;
}

label.name-flex i {
    position: absolute;
    font-size: 26px;
    left: -25px;
    top: 1px;
}

.group-rows:before {content: "";width: 100%;height: 100%;position: absolute;background: rgba(0, 0, 0, 0.21176470588235294);top: 0;left: 0;z-index: 6;border-radius: 10px;}

/********************MODAL********************/
.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}

.fade {
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    -o-transition: opacity .15s linear;
    transition: opacity .15s linear;
}

.fade.in {
    opacity: 1;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000;
}

.modal-backdrop.fade {
    filter: alpha(opacity=0);
    opacity: 0;
}

.modal-backdrop.in {
    filter: alpha(opacity=50);
    opacity: .5;
}

.modal.fade .modal-dialog {
    -webkit-transform: translate(0,-25%);
    -ms-transform: translate(0,-25%);
    -o-transform: translate(0,-25%);
    transform: translate(0,-25%);
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    transition: -webkit-transform .3s ease-out;
    transition: transform .3s ease-out;
    transition: transform .3s ease-out,-webkit-transform .3s ease-out,-o-transform .3s ease-out;
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
}

.modal-content {
    position: relative;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
    outline: 0;
}

.modal-header {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    background: #0091ea;
    color: white;
}

.modal-body {
    position: relative;
    padding: 15px;
}

.modal-header .close {
    margin-top: -2px;
}

button.close {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
}

.modal-title {
    margin: 0;
    line-height: 1.42857143;
}

@media (min-width: 992px)
{
    .modal-lg {
        width: 900px;
    }
}

@media (min-width: 768px)
{
    .modal-dialog {
        width: 600px;
        margin: 30px auto;
    }
    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
        box-shadow: 0 5px 15px rgba(0,0,0,.5);
    }
}

/*------------END MODAL--------------*/

a.flag-languages img {
    width: 40px;
    border-radius: 50%;
}

.split-btn-home a label i {
    margin-bottom: 12px;
    font-size: 44px;
}

span.wraper-languages.kiosk-home {
    top: 32px;
}

.slide-item img {
    max-width: 100%;
    max-height: 100%;
}

.process-call-loading {
    position: relative;
}

.process-call-loading:before {content: "";width: 100%;height: 100%;position: absolute;z-index: 9999;background: #ffffff00;}

.number-action.no-access li.selected {
    background: white;
    color: black;
}

.wraper-slider-content {
    width: 100%;
    height: 100%;
    text-align: center;
}

.html5gallery {
    width: 100% !important;
    height: 100% !important;
}

.header-tool-call {
    width: 100%;
    float: left;
    border-left: 1px solid #ccc;
    padding: 10px 0px;
}

.call-selected {
    width: 200px;
    float: left;
    padding-left: 15px;
}

.service-call-selected {
    width: calc(100% - 200px);
    float: left;
    padding-left: 40px;
}

label.lb-call-selected {
    width: 100%;
    float: left;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    color: #0d47a1;
    text-align: center;
}

p.number-call-selected {
    width: 100%;
    float: left;
    text-align: center;
    font-weight: bold;
    color: #0d47a1;
    font-size: 64px;
    padding: 10px 0px;
}

label.lb-service-selected {
    width: 100%;
    float: left;
    font-size: 18px;
    font-weight: 600;
    color: #0d47a1;
    text-transform: uppercase;
    padding-bottom: 20px;
}

span.list-service-selected {
    width: 100%;
    float: left;
}

span.list-service-selected p {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-weight: bold;
    color: #0d47a1;
    font-size: 14px;
    position: relative;
    padding-left: 16px;
}

span.list-service-selected p:before {content: "";width: 10px;height: 10px;background: #0d47a1;position: absolute;border-radius: 50%;top: 5px;left: 0;}

.pling-text {
    animation: blinkingText 1.2s infinite;
}

.pling-text-list {
    animation: blinkingListText 1.4s infinite;
}

@keyframes blinkingText{
  0%{   color: #0d47a1;  }
  49%{  color: #ffffff; }
  50%{  color: #0d47a1; }
  99%{  color:#ffffff;  }
  100%{ color: #0d47a1;  }
}

@keyframes blinkingListText{
  0%{   color: #0091ea;  }
  49%{  color: #ffffff; }
  50%{  color: #0091ea; }
  99%{  color:#ffffff;  }
  100%{ color: #0091ea;  }
}

.no-access h3.header-title-call {
    background: white;
    color: black;
}


.wraper-move-service {
    width: 100%;
    float: left;
    display: contents;
}

span.number-move {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 58px;
    color: red;
}

span.services-move {
    width: 100%;
    float: left;
    margin-top: 25px;
    position: relative;
    padding: 10px;
    border: 1px solid #0d47a1;
    border-radius: 5px;
    padding-top: 15px;
}

label.lb-move {
    position: absolute;
    background: #0d47a1;
    color: white;
    border-radius: 5px;
    padding: 3px 10px;
    font-size: 13px;
    top: -18px;
    left: 11px;
}

select.cbox-fields-move {
    width: 100%;
    outline: none;
    padding: 10px;
    font-size: 14px;
    border-radius: 5px;
    cursor: pointer;
}

span.btn-move-services {
    width: 100%;
    float: left;
    margin-top: 15px;
    text-align: center;
}

button.btn-move {
    padding: 10px 20px;
    font-size: 14px;
    outline: none;
    border: 0;
    border-radius: 5px;
    background: #0d47a1;
    color: white;
    cursor: pointer;
}

button.btn-move:hover {
    background: #0091ea;
}

select.cbox-fields-move:hover {
    background: #f5f5f5;
}

.profile-wraper {
    width: 100%;
    float: left;
    flex-wrap: wrap;
    display: flex;
    /* margin-top: 25px; */
    position: fixed;
    bottom: 23px;
}

.content-profile {
    width: 600px;
    float: left;
    margin: auto;
    background: rgba(255, 255, 255, 0.78);
    border-radius: 10px 10px 0px 0px;
}

.avatar-profile {
    width: 120px;
    float: left;
    text-align: center;
    padding: 20px 10px;
}

.info-profile {
    width: calc(100% - 120px);
    float: left;
    padding: 20px 20px 20px 0px;
}

.avatar-profile img {
    max-width: 100%;
}

span.rows-profile {
    width: 100%;
    float: left;
    padding-bottom: 5px;
}

label.lb-profile {
    float: left;
}

span.rows-profile.name-profile {
    font-weight: bold;
    font-size: 18px;
    color: #0d47a1;
}

span.rows-profile.service-profile {
    font-size: 16px;
}

span.rows-profile.fields-profile {
    font-size: 18px;
    color: #0091ea;
}

span.rows-profile p {
    float: left;
    margin-left: 10px;
}

span.rows-profile.fields-profile p {
    font-weight: bold;
}

.survey-new-option label.item-result-survey {
    width: 20% !important;
}

.survey-new-option label.item-result-survey label {
    border: 0;
    text-align: center;
}

.survey-new-option label.item-result-survey label img {
    max-width: 100%;
    max-height: inherit;
    float: none;
}

.survey-new-option label.item-result-survey label p {
    width: 100%;
    padding: 10px 0px;
    text-align: center;
}

.content-page-new-option form#frm-submit {
    margin-top: -10%;
}

.title-survey {
    font-size: 36px;
    margin-top: 10px;
}

.wraper-content-thank {
    width: 100%;
    text-align: center;
    padding: 50px 0px;
}

.wraper-content-thank img {
    max-width: 195px;
}

.wraper-content-thank p {
    font-size: 28px;
}

.wraper-start-call {
    width: 100%;
    height: 100%;
    float: left;
    background: #fdfdfd;
    text-align: center;
    display: flex;
}

span.content-btn-start-call {
    width: 150px;
    height: 150px;
    float: left;
    margin: 60px auto;
    border-radius: 50%;
    background: #0d47a1;
}

a.btn-start-call {
    background: white;
    float: left;
    line-height: 120px;
    color: #0d47a1;
    text-decoration: none;
    font-size: 26px;
    font-weight: bold;
    position: relative;
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    border-radius: 50%;
    top: 15px;
    left: 15px;
    box-shadow: 0px 0px 16px 2px #ffffffbf;
}

.data-page.container-form {
    display: flex;
    flex-wrap: wrap;
}

.form-login-access {
    float: left;
    margin: auto;
    box-shadow: 0px 0px 6px -1px black;
    border-radius: 3px;
    padding: 59px;
    background: #f9f9f9;
}

.rows-input {
    width: 100%;
    float: left;
    padding: 10px;
}

.rows-input label {
    width: 100%;
    float: left;
    font-size: 18px;
    text-align: center;
    font-weight: bold;
}

input.input-signature {
    width: 100%;
    float: left;
    margin-top: 10px;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 3px;
    outline: none;
    text-align: center;
}

.rows-button {
    width: 100%;
    float: left;
    margin-top: 10px;
    text-align: center;
}

a.btn-login-access {
    display: inline-block;
    padding: 10px 70px;
    background: #0d47a1;
    text-decoration: none;
    border-radius: 5px;
    color: white;
    font-weight: bold;
}

.header-numer-org {
    text-align: center;
}

.header-numer-org h1 {
    text-transform: uppercase;
    font-size: 62px;
    color: #ffdd00;
}

.content-page.page-view-org {
    background: #fcfcfc;
    padding-top: 92px;
}

.data-page.container-number-ser {
    /* display: flex; */
    /* flex-wrap: wrap; */
    border-top: 5px solid white;
    width: calc(100% - 320px) !important;
}

span.num---ser-current {
    margin: auto;
    font-size: 188px;
    color: #0d47a1;
    font-weight: bold;
}

.bottom-number-call {
    width: 100%;
    height: 40px;
    float: left;
    background: #0091ea;
}

.bottom-number-call h4 {
    width: calc(100% - 120px);
    float: left;
    font-size: 16px;
    padding: 9px;
    color: white;
    font-weight: normal;
}

a.btn-lock-lock {
    float: left;
    width: 120px;
    height: 40px;
    text-align: center;
    padding: 10px 0px;
    background: #00004a85;
    color: white;
    font-size: 14px;
    text-decoration: none;
}

.bottom-number-call h4 label {
    font-weight: 600;
}

/*update 12-02-22*/
.rows-page {
    position: relative;
}

.locked-number {
    position: absolute;
    width: calc(100% - 20%);
    top: -5px;
    right: 0;
    height: 100%;
    background: #ffffff4d;
    z-index: 999999;
    display: flex;
}

.locked-number p {
    margin: auto 0px;
    font-size: 36px;
    margin-left: 14px;
    color: #ff4f4f;
}

.item-cols-list:first-child {
    padding-right: 10px;
}

.item-cols-list:last-child {
    padding-left: 10px;
}

.item-cols-list:first-child .list-number-pendding {
    border-right: 1px solid rgba(255, 255, 255, 0.28);
}

.item-cols-list:last-child .list-number-pendding {
    border-left: 1px solid rgba(255, 255, 255, 0.28);
}

.view-list-callnumber {
    width: 100%;
    float: left;
    height: calc(100% - 155px);
}

.item-cols-list .header-listview-pendding label {
    font-size: 24px;
}

.item-cols-list .list-number-pendding .row-listview-number:last-child {
    height: 100%;
}

.item-cols-list .list-number-pendding {
    height: 100%;
}

.item-cols-list .row-listview-number ul {
    height: 100%;
}

.item-cols-list .row-listview-number ul li.number-item div {
    font-size: 62px;
    height: 100%;
    display: flex;
}

.item-cols-list .row-listview-number ul li.number-item div label {
    margin: auto;
}

.rows-page:nth-child(2n) .locked-number {
    left: 0;
}

.logo-hcc {
    width: 400px;
    float: left;
    display: flex;
    flex-wrap: wrap;
    height: 100%;
}

.logo-hcc img {
    max-width: 100%;
    margin: auto;
}

.content-logo-hcc {
    width: 100%;
    float: left;
    margin: auto;
}

.content-logo-hcc img {
    float: left;
}

.content-logo-hcc h3 {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 42px;
    color: #bb302a;
}

.block-polhandle {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000b3;
    display: flex;
    flex-wrap: wrap;
    z-index: 9999;
}

.content-block-kiosk {
    float: left;
    padding: 60px;
    background: white;
    margin: auto;
    font-size: 28px;
    text-align: center;
    border-radius: 15px;
}

.content-block-kiosk a {
    display: inline-block;
    padding: 10px 30px;
    margin-top: 10px;
    background: #000088;
    border-radius: 10px;
    text-decoration: none;
    color: white;
}

.list-number-call ul li label {
    width: 85%;
}

.none-item .cols-number-ser, .none-item .cols-number-pendding {
    border: 0 !important;
}

.none-item .cols-number-pendding:after {
    display: none;
}

.wraper-page.wrapper-view-org {
    /* padding: 0; */
    /* background: white; */
}

.avt-client {
    width: 320px;
    float: left;
}

.load-number-ser {
    width: 100%;
    float: left;
    display: flex;
    flex-wrap: wrap;
    height: calc(100% - 73px);
}

span#name-client {
    width: 100%;
    float: left;
    font-size: 36px;
    text-align: center;
    font-weight: bold;
    color: #bb302a;
	padding: 10px 0px;
}

span.label-welcome {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 32px;
    color: #bb302a;
    font-weight: bold;
    padding-top: 30px;
}

.iframe-survey {
    width: 100%;
    height: 60%;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    background: #ededed;
}

.iframe-survey iframe {
    width: 100%;
    height: 100%;
}

.iframe-survey > .survey-state {
    width: 100%;
    height: 100%;
    margin: 0;
    overflow-y: auto;
}

.survey-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 100%;
    padding: 20px;
}

.survey-empty-state .empty-state-icon {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: #eceff1;
    color: #90a4ae;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 52px;
    margin-bottom: 24px;
}

.survey-empty-state.is-surveyed .empty-state-icon {
    background: #e3f6e8;
    color: #2e7d32;
}

.survey-empty-state .empty-state-text {
    font-size: 28px;
    color: #546e7a;
    font-weight: 600;
    max-width: 85%;
    line-height: 1.4;
}

.survey-empty-state.is-surveyed .empty-state-text {
    color: #2e7d32;
}

.iframe-survey .wraper-content-thank {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0;
}

.box-number-org {
	width: 100%;
	height: 40%;
	float: left;
	display: flex;
}

.section-nghi {
    position: absolute;
    z-index: 999999999;
    background: white;
    width: 100%;
    height: calc(100% - 64px);
    top: 68px;
    display: flex;
}

.box-nghi {
    margin: auto;
    color: #bb302a;
    font-size: 22px;
    font-weight: 600;
}

.box-nghi h2 {
    font-size: 62px;
    width: 100%;
    display: block;
    text-align: center;
    margin-bottom: 20px;
}

.box-nghi p {
    width: 100%;
    display: block;
    line-height: 36px;
}

ul.list-name-data li font {
    width: 100%;
    display: block;
    margin-bottom: 10px;
}