body.guillotine-dragging, body.guillotine-dragging * {
  cursor: move !important;
  cursor: -webkit-grabbing !important;
  cursor:    -moz-grabbing !important;
  cursor:         grabbing !important;
  cursor: grabbing, move;  /* IE hack */
}

.guillotine-window {
  display: block;
  position: relative;
  overflow: hidden;
  cursor: move;
  cursor: -webkit-grab;
  cursor:    -moz-grab;
  cursor:         grab;
  cursor: grab, move;  /* IE hack */
}

.guillotine-canvas {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.guillotine-canvas > * {
  position: absolute;
  top: 0;
  left: 0;
  max-width: none;
  max-height: none;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.guillotine-sample {
  position: absolute !important;
  top: -100000px     !important;
  left: -100000px    !important;
  width: auto        !important;
  height: auto       !important;
}
#content .frame {
  margin-bottom: 20px;
  margin-left: -40px;
  margin-right: -40px;
}

#content .frame > img { width: 100%; }

#controls {/* margin-bottom: 40px; */}

#data {
  list-style: none;
  display: inline-block;
  padding: 0;
  margin: 0;
}

#data .column {
  display: inline-block;
  margin: 0 15px;
}

#data li {
  margin-bottom: 10px;
  font-weight: bold;
  text-align: left;
}

#data span {
  display: inline-block;
  font-weight: normal;
}


/*SWITCH*/
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 24px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:after{
  content: attr(data-off-text);
  position: absolute;
  left: 25px;
  top: 2px;
}
input:checked + .slider:after {
  content: attr(data-on-text);
  position: absolute;
  left: 10px;
  top: 2px;
  color: #fff;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(36px);
  -ms-transform: translateX(36px);
  transform: translateX(36px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
/*END SWITCH*/

.search-field.active{
  background: #fff;
  border-left: 1px solid #e2e2e2;
  border-right: 1px solid #e2e2e2;
  box-shadow: 6px 6px 16px 0 rgb(0 0 0 / 12%);
  height: 61px;
  padding: 0 10px;
}
.search-field.active input{
  margin-top: 12px;
}
.search-field.active span{
  left: 22px;
}
.search-field.active ul{
  display: block;
  position: absolute;
  top: 61px;
  right: 0;
  background: #fff;
  box-shadow: 6px 6px 16px 0 rgb(0 0 0 / 12%);
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  width: 100%;
  box-sizing: border-box;
  padding: 2px 16px 20px;
}
.search-field.active ul li {
  margin-top: 18px;
  display: block;
}
.search-field.active ul li a{
  display: inline-block;
  width: 100%;
}
.search-field.active ul li a:hover{
  color: #1d9bf0;
}


.chat-room.mini {
  height: auto;
}
.chat-room.mini .chat_input, .chat-room.mini .chat_box__box, .chat-room.mini .chat-btn{
  display: none;
}

.comment-input {
  position: relative;
}
.comment-input textarea {
  width: 100%;
  padding: 0.5em 2.5em 0.5em 0.5em;
  resize: none;
  border-radius: 5px;
  border: solid 1px #efefef;
}
.comment-input textarea:focus {
  border: solid 1px #1d9bf0;
}
.comment-input span {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 1em;
  color: #1d9bf0;
  cursor: pointer;
}

.btn-primary.reverse{
  width: 100%;
  margin: 2em 0;
  background: #E3F2FC;
  color: #1D9BF0;
}
.btn-primary.reverse:hover{
  background: #1d9bf0;
  color: #fff;
  opacity: .4;
}
/*
span[data-btn-action="cancel-edit"]{
  padding-right: 1em;
  margin-left: -2em;
  cursor: pointer;
}
.edit-photo .footer{
  position: relative;
}
.edit-photo .footer:before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border-top: solid 4px #1d9bf0;
  width: var(--widthpercents);
}

#image-edit-modal #content{
  display: none;
}
#image-edit-modal #content.active{
  display: block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: auto;
  margin: 0;
  border-radius: 8px;
}
#image-edit-modal #content h3{
  text-align: left;
  margin-bottom: 1em;
  margin-left: 1em;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: bold;
}
#image-edit-modal #content #controls{
  position: absolute;
  bottom: 0;
  margin-bottom: 1em;
}
#image-edit-modal #content #controls button{
  border-radius: 8px;
  margin-right: 1em;
}
.edit-images{
  justify-content: space-between;
  align-items: flex-start;
  margin: 0 20px;
  padding-bottom: 25px;
}

/*edit image*/
.edit-images .list-photo-edit .holder4x3{
  position: relative;
  padding-top: 75%;
  overflow: hidden;
  width: 100%;
  min-width: 250px;
}
.edit-images .list-photo-edit .holder4x3 .bg-blur{
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.edit-images .list-photo-edit .holder4x3 .bg-blur img {
  position: absolute;
  transform: scale(1.5);
  filter: blur(30px);
  object-fit: cover;
 }
.edit-images .list-photo-edit .holder4x3 .photo {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
}
.edit-images .list-photo-edit .holder4x3  .btn-actions{
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  padding: 8px;
}
.edit-images .list-photo-edit .holder4x3  .btn-actions a {
  margin: 3px;
}
*/
/*end edit image*/

ul.slider-images{
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  max-width: 800px;
  margin: 2em 0;
  margin-left: -6px;
  margin-right: -6px;
}
ul.slider-images li{
  list-style: none;
  flex: 0 0 calc(33.333333% - 12px);
  position: relative;
  margin: 0 6px 12px 6px;
}
button p {
  padding-left: 0.5em;
}
.bid-detail{
  position: relative;
}
.bid-detail .time-line {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  border-radius: 4px;
  height: 4px;
  background: #1d9bf0;
  margin: 0 !important;
  transition: width 0.2s linear;
}
#sample_picture {
  max-height: calc(100vh - 150px);
}
.post-create .price-step, .post-create .auction-time{
  display: flex;
  justify-content: space-between;
}
.post-create .price-step .form-group, .post-create .auction-time .form-group {
    width: calc((100% - 16px)/2) !important;
}

.choice_box label{
  cursor: pointer;
}

.editor-controls {
  margin-top: 10px;
}

.popup.change_info.account-setup .form_setting {
  justify-content: space-between;
  align-items: flex-start;
  margin: 0 20px;
  padding-bottom: 40px;
}
.account-post .table_row p:nth-child(6) {
  width: 125px;
}
.account-post .table_row p:nth-child(6) div.select {
  text-align: left;
}
.select-styled.city:empty:before {
  content: "Tỉnh / Thành Phố";
}
.select-styled.district:empty:before {
  content: "Quận / Huyện";
}
.select-styled.ward:empty:before {
  content: "Phường / Xã";
}
.select-styled.district {
  border-left: 1px solid #efefef;
}

.slider-view {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.slider-view .slider-content{
  background: #fff;
  position: relative;
  margin-bottom: 2em;
  margin-left: 80px;
}
.slider-view .slider-content>img, .slider-view .slider-content>video{
  max-width: 720px;
  max-height: 576px;
  margin: 1em;
}
.slider-view .icon-close{
  position: absolute;
  bottom: 4em;
  left: 2.5em;
  color: #fff;
  padding: 1em;
  border: solid 1px #9e9e9e;
  border-radius: 50%;
  background: rgba(0,0,0,0.4);
  cursor: pointer;
}
.slider-view .slider-control{
  position: absolute;
  bottom: 4em;
  color: #fff;
  display: flex;
  line-height: 13px;
}
.slider-view .slider-control>div{
  padding: 0.5em 1em;
  border: solid 1px #9e9e9e;
  background: rgba(0, 0, 0, 0.4);
  font-weight: 600;
}
.slider-view .slider-control>div:first-child{
  border-right: none;
  border-top-left-radius: 15px 15px;
  border-bottom-left-radius: 15px 15px;
  cursor: pointer;
}
.slider-view .slider-control>div:last-child{
  border-left: none;
  border-top-right-radius: 15px 15px;
  border-bottom-right-radius: 15px 15px;
  cursor: pointer;
}
.slider-view .slider-thumb{
  position: absolute;
  left: 2em;
  width: 60px;
  margin-right: 5px;
}
.slider-view .slider-thumb .item{
  width: 100%;
  height: 60px;
  overflow: hidden;
  background: #000;
  border: solid 1px #fff;
}
.slider-view .slider-thumb .item:not(:last-child){
  margin-bottom: 5px;
}
.slider-view .slider-thumb .item img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.6;
}
.slider-view .slider-thumb .item.active img{
  opacity: 1;
}

.change_pass .form_setting{
	margin: 40px;
}
.input-error-text{
	color: rgba(177, 0, 0, 0.9);
}
.input-error:empty, .input-error-text:empty{
  display: none !important;
}
.menu-account {
  display: none;
}
.menu-account.active {
  display: block;
}
.mainRegister .icon-eye-see {
    position: absolute;
    right: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: #b2b2b2;
    cursor: pointer;
}

.spinning-loader {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid rgba(115,198,249,0.2);
    border-left-color: #1d9bf0;
    animation: rotate-s-loader 1s linear infinite;
    margin: 0 !important;
    position: absolute;
    right: auto;
    display: none !important;
}

button .spinning-loader, [class*="btn-"] .spinning-loader {
  border: 3px solid rgba(115,198,249,0.4);
  border-left-color: #ffffff;
}
#account-content .spinning-loader {
  margin: 50px !important;
  right: calc(50% - 150px);
}
.spinning-loader.spin-center {
  margin: 50px !important;
  right: calc(50% - 60px);
}
.btn-primary .spinning-loader{
  width: 25px;
  height: 25px;
}
body.loading .btn-primary {
  position: relative;
}
.loading .spinning-loader{
    display: block !important;
}

.hide{
  display: none !important;
}
#report .spinning-loader{
  display: none !important;
}
#report.loading .spinning-loader{
  display: block !important;
}
.account-noti .spinning-loader{
  margin: 4em 0 0 0 !important;
  border-left-color: #1d9bf0;
  right: calc(50% - 120px);
}

@keyframes rotate-s-loader {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
