.imgHighQ{
    image-rendering: -webkit-optimize-contrast;
    transform: translateZ(0);
    backface-visibility: hidden;
}

html,
body,
.container-fluid,
form {
    height: 100%;
    background-color: #fff;
}

.rptext {
  margin-left: 5px;
  padding: 2px;
  background-color: rgba(255, 255, 0, 0.5);
}
@media all and (min-width: 960px) {
  table td,
  table th {
      font-size: 15px !important;
  }
  
  .scale_label {
      word-break: keep-all;
  }

  #start, #next, #prev, #r_kiwi_btn{
      border-radius:3px !important;
  }

}

.col-xl-9 {
    max-width: 1000px !important;
}

#qmain-box {
    overflow-y: auto;
    background-color: #F7F7F7;
}

#qmain-box::-webkit-scrollbar {
    width: 6px
}

#qmain-box::-webkit-scrollbar-thumb {
    background-color: rgb(179, 179, 179);
    border-radius: 15px;
    background-clip: padding-box;
    border: 1px solid transparent;
}
#logo-box{
    box-shadow: 0 4px 6px rgba(0,0,0,.15);
}

#logo-box > img{
  height:35px;
}

#project-name h4{
    color:#1cae81;
    font-size:18px !important;
}
#kiwi_progress{
    height: 7px;
}
#prj-title{
    word-break:keep-all;
    font-size:15px !important;
    color:#444;
    padding-top:12px !important;
    padding-bottom:12px !important;
    border-radius: 3px;
}
.progDiv{
    background-color:#E8E8E8;
    border-radius:4px;
    height: 4px;
}
.progDiv.progAct{
    background-color:#1cae81;
}
.progDiv:not(first-child){
    margin-left:2px;
}
#qtitle{
    color:#99D4CE;
    border-color:#99D4CE !important;
    font-size:14px !important;
    border-radius: 20px;
}
#btn-box{
    bottom:0;
    z-index: 100;
}
#start, #next, #prev, #r_kiwi_btn{
    font-size:14px;
    color:#e8e8e8;
    background-color:#1cae81;
    border-radius: initial;
    height: 56px;
}

i{
    font-family: "fontawesome" !important;
}

.question-title{
    font-size:16px;
    color:#1c1c1c;
}

.lds-dual-ring.hidden {
  display: none;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.1);
  z-index: 999;
  opacity: 1;
  transition: all 0.5s;
}

/*Spinner Styles*/
.lds-dual-ring {
  /* display: inline-block;
  width: 80px;
  height: 80px; */
}
.lds-dual-ring:after {
  position: absolute;
  top: 50%;
  left: 50%;

  content: " ";
  display: block;
  
  width: 50px;
  height: 50px;

  margin: -25px 0 0 -25px;

  /* margin: 50% auto;
  border-radius: 50%;
  border: 6px solid #fff;
  border-color: #fff transparent #fff transparent;  */

  background-color: transparent;
  background-image:url('/img/kiwi_loading.png');
  background-size: 50px;
  background-repeat:no-repeat;
  background-position:center;
  object-fit: fill;
  opacity: 1;
  filter: alpha(opacity=100);

  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
      transform: rotate(0deg);
  }
  100% {
      transform: rotate(360deg);
  }
}


.list-group-item{
    margin-bottom: 8px;
    padding: 6px 15px;
    border-radius: 3px !important;
    border: none;
}
.list-group-item-action{
    border-radius: 3px !important;
}

.custom-control {
    display: inline-block;
    padding-left: 26px;
    position: relative;
    min-height: 20px;
    margin: 9px 33px 9px 0;
}

.custom-control input {
    opacity: 0;
    position: absolute;
    left: -99999px;
    font-size: 0;
}

.custom-control b, .custom-control span {
    color: #444;
    font-size: 15px;
    vertical-align: text-top;
}

.custom-control i {
    display: block;
    width: 14px;
    height: 14px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    border: 1px solid #7d7d7d;
    border-radius: 50%;
}
.custom-control i.centerIcon{
    position: absolute;
    display: inline-block;
    left: auto;
}
.custom-control i.centerIcon+span{
    margin-left:18px;
}
.custom-control-radio input:checked ~ i::before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1cae81;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -4px 0 0 -4px;
}

.custom-control input:checked ~ i {
    background-color: #fff;
    border-color: #1cae81;
}

.custom-control-checkbox-square input:checked ~ i {
    background: #1cae81 url(/img/icon-ckck-light.svg) no-repeat center;
    
}
.custom-control-checkbox-square i {
    border-radius: 0;
}
.cusInput-active{
    border:1px solid #1cae81;
}
.list-group-item+.list-group-item.cusInput-active{
    border-top-width: 1px;
}

.form-control:focus{
    border-color: #1cae81;
    box-shadow:none;
}

input:-webkit-autofill, input:focus:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 100px #fff inset;
}

.custom-control input:disabled:not(:checked) ~ i{
    background-color: #f0f0f0;
    border-color: #ccc;
}
.custom-control-checkbox-square input:disabled:checked ~ i{
    background-color: #9bdbc8;
    border-color: #9bdbc8;
}
.custom-control-radio input:disabled:checked ~ i{
    border-color: #ccc;
}
.custom-control-radio input:disabled:checked ~ i::before{
    background-color: #9bdbc8;
}


.sEndStr{
    font-size:20px;
    color:#1c1c1c;
    font-weight: 600;
}
.sEndSubStr{
    font-size:16px;
    color:#7d7d7d;
}
.scaleTb {
    border: none;
    border-collapse: separate;
    border-spacing: 5px;
}
.scaleTb td{
    border: none;
    margin: 5px;
    height: 24px;
    border-radius: 3px;
}

.scaleBtn {
    cursor:pointer;
    display:table-cell;
    position:relative;
}

.scaleBtn.cusInput-active{
    border:1px solid #1cae81;
    color:#1cae81;
}

.scaleBtn i.centerIcon{
    margin-right: auto;
    margin-bottom: -7px;
    left:calc(50% - 7px);
}

.singleTb {
    border: none;
    border-collapse: separate;
    border-spacing: 0 8px;
}
.singleTb td, .singleTb th{
    border: none;
    margin: 5px;
    min-width: 30px;
    font-size: 15px;
}
.singleTb tr[id^=row_]{
    cursor:pointer;
}
.singleTb tr > td:first-child, .singleTb tr > th:first-child{
    border-radius: 3px 0 0 3px;
}
.singleTb tr > td:last-child, .singleTb tr > th:last-child{
    border-radius: 0 3px 3px 0;
}

.singleBtn {
    cursor:pointer;
    display:table-cell;
    position:relative;
}
.singleBtn i.centerIcon{
    margin-right: auto;
    right:7px;
    margin-bottom: -7px;
}

tr.cusInput-active > td:first-child{
    border-left:1px solid #1cae81;
}
tr.cusInput-active > td:last-child{
    border-right:1px solid #1cae81;
}
tr.cusInput-active > td{
    border-top:1px solid #1cae81;
    border-bottom:1px solid #1cae81;
}

div[id^=attr_label_]{
    background-color: #e8e8e8;
    color: #7d7d7d;
    font-weight: 400;
    font-size: 14px;
    min-height: 26px;
    padding: 8px;
    margin-bottom: 12px;
    border-radius: 3px;
	text-align: center !important;
}

a[id^=attr_][aria-expanded=true] > div[id^=attr_label_]{
    background-color: #ffffff;
    color: #444;
    font-weight: 800;
    border: #aaaaaa 1px solid;
    text-align: center !important;
}

div[id^=attr_label_]:before {
    border: solid #7d7d7d;
    border-width: 0 1px 1px 0;
    display: block;
    padding: 4px;
    content: '';
    float:right;
    -webkit-transform: rotate(45deg);
     -moz-transform: rotate(45deg);
     transform: rotate(45deg);
    transition: all 0.5s;
    margin-top: 4px;
    margin-right: 3px;
 }
 a[id^=attr_][aria-expanded=true] > div[id^=attr_label_]:before {
     -webkit-transform: rotate(225deg);
     -moz-transform: rotate(225deg);
     transform: rotate(225deg);
     margin-top: 8px;
 } 

a[id^=attr_]:hover{
    text-decoration:none;
}

div[id^=qus_] .custom-control span {
    font-size:14px;
    vertical-align: baseline;
}

div[id^=qus_] .list-group-item {
    margin-bottom: 5px;
    padding: 3px 15px;
}


@media all and (min-width: 960px) {
    div[id^=qus_] td{
        font-size:14px !important;
    }
}

div:not(.container-fluid)[id$='_BOX'] > .container-fluid[id$=_box]:hover{
    border:1px solid #1cae81 !important;
}

.delete-btn{
    cursor:pointer;
}

.custom-control-checkbox-square input.rankCheckbox[data-rank]:checked ~ i{
    background: none;
    background-color: #1cae81;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank]:checked ~ i::before{
    font-size: 12px;
    font-weight: 400;
    font-family: "Spoqa Han Sans Neo", "sans-serif" !important;
    color: #fff;
    font-style: normal;
    position: absolute;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='1']:checked ~ i::before{
    content: '1';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='2']:checked ~ i::before{
    content: '2';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='3']:checked ~ i::before{
    content: '3';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='4']:checked ~ i::before{
    content: '4';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='5']:checked ~ i::before{
    content: '5';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='6']:checked ~ i::before{
    content: '6';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='7']:checked ~ i::before{
    content: '7';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='8']:checked ~ i::before{
    content: '8';
    top: -2px;
    left: 2px;
}
.custom-control-checkbox-square input.rankCheckbox[data-rank='9']:checked ~ i::before{
    content: '9';
    top: -2px;
    left: 2px;
}
.cusInput-disabled{
    background-color: #e8e8e8 !important;
    color: #a7a7a7;   
}