/* style for migrating from atk4 to semantic */
*[class*=atk-effect].atk-effect-danger, *[class*=atk-effect][class*=atk-button].atk-effect-danger {
  color: #ff2d1a;
}

/* Colors: */
/*************************
    Paddings ; Margins ;
*************************/
.p-10 {
  padding: 10px;
}

.p-20 {
  padding: 20px;
}

.pt-30 {
  padding: 30px;
}

.ptb-80 {
  padding: 80px 0;
}

.ptb-95 {
  padding: 95px 0;
}

.ptb-70 {
  padding: 70px 0;
}

.ptb-120 {
  padding: 120px 0;
}

.ptb-140 {
  padding: 140px 0;
}

.pt-40 {
  padding-top: 40px;
}

.pt-50 {
  padding-top: 50px;
}

.pt-80 {
  padding-top: 80px;
}

.pt-160 {
  padding-top: 160px;
}

.pt-120 {
  padding-top: 120px;
}

.pb-115 {
  padding-bottom: 115px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pb-80 {
  padding-bottom: 80px;
}

.pb-160 {
  padding-bottom: 160px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-20i {
  margin-bottom: 20px !important;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-80 {
  margin-bottom: 80px;
}

.mt-8 {
  margin-top: 8px;
}

.mt-8i {
  margin-top: 8px !important;
}

.mt-20 {
  margin-top: 20px;
}

.mt-20i {
  margin-top: 20px !important;
}

.mt-30 {
  margin-top: 30px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-50 {
  margin-top: 50px;
}

.mt-80 {
  margin-top: 80px;
}

.scrollable-x {
  overflow-x: auto;
  width: 100%;
}

.noscroll {
  overflow: hidden;
}

.vertically-middle-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.clear.float:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

.under-note {
  font-size: 0.9rem;
  margin-top: 1px;
  color: #78797A;
}

.center.aligned {
  text-align: center;
}

.ui.vertical.menu .item > i.icon.left.floated,
.ui.vertical.menu .item > i.icons.left.floated {
  float: left;
  margin-left: 0;
  margin-right: 0.5em;
}

ul.nolist,
ol.nolist {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.relative {
  position: relative;
}

.full-height {
  height: 100vh;
}

.spaced-row {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
.spaced-row.more {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

/****** default atk4 login form  ******/
.atk4-basic-login-form {
  width: 350px;
  margin: auto;
}

/****** main loading dimmer *******/
#main-loading-dimmer > .ui.active.dimmer {
  position: fixed;
  z-index: 999999;
}

/********* lightbox *********/
.lightbox {
  cursor: pointer;
}

#lightbox-modal,
.lightbox-modal {
  width: auto !important;
}
#lightbox-modal .content,
.lightbox-modal .content {
  text-align: center;
  width: min-content !important;
  margin: auto;
}
#lightbox-modal img,
.lightbox-modal img {
  max-height: 80vh;
  max-width: 90vw;
}

/********* modals ***********/
.ui.modal > .scrolling.content.longer {
  max-height: calc(100vh - 10rem);
}

/********* editors **********/
.ace-editor, .ace_editor {
  width: 100%;
  min-height: 500px;
  border: 1px solid #E8E8E8;
  border-radius: 5px;
  touch-action: none;
}

#preview-frame {
  width: 100%;
  min-height: 850px;
}

.semantic-grid.ui.basic.segment {
  padding-left: 0;
  padding-right: 0;
}
.semantic-grid .grid-under-info .small {
  font-size: 0.9rem;
  color: #a5a5a5;
}
.semantic-grid .paginator .ui.segment.basic {
  padding: 0;
}
.semantic-grid > .ui.basic.segment {
  padding-left: 0;
  padding-right: 0;
}
.semantic-grid .panel {
  margin-bottom: 10px;
}
.semantic-grid .panel .quicksearch {
  margin-bottom: 10px;
}
.semantic-grid .crud-actions-col {
  min-width: 100px;
}
.semantic-grid .grid-image {
  max-width: 35px;
  max-height: 35px;
}

/******** delete record confirmation modal ******/
.ui.modal.modal-confirm-delete > .actions,
.ui.modal.modal-confirm-delete > .content {
  text-align: center;
}
.ui.modal.modal-confirm-delete > .actions p,
.ui.modal.modal-confirm-delete > .content p {
  color: #fff;
}

.semantic-crud.ui.basic.segment {
  padding-left: 0;
  padding-right: 0;
}

.ui.form .form-bottom-buttons {
  margin: 25px 0;
}
.ui.form .form-bottom-buttons:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}
.ui.form .tiny-mce-field {
  margin-bottom: 10px;
}

.ui.action.input input[type=file] {
  display: none;
}

.ui.form .fields.image-upload,
.ui.form .field.image-upload {
  margin-top: 20px;
}

.image-upload .image-preview-field img.center.aligned {
  text-align: center;
  margin: auto;
}

form .ui.field .tiny-mce-field {
  margin: 0 0 1em;
}

.file-upload .file-data-block {
  display: none;
  padding: 12px;
}
.file-upload .file-data-block .icon-block,
.file-upload .file-data-block .label-block,
.file-upload .file-data-block .actions-block {
  display: inline-block;
}
.file-upload .file-data-block .actions-block {
  margin-left: 15px;
}
.file-upload .file-data-block .label-block {
  max-width: calc(100% - 125px);
}
.file-upload.is-set .file-data-block {
  display: block;
}

/*
.uploader-dimmer {
    position:fixed !important;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 1990;
    display: flex !important;
    justify-content: flex-start;
    -webkit-box-pack: start;
    background: rgba(0,0,0,.85);
    opacity: 0.8;
    width: 100%;
    height: 100%;
} */
.uploader-dimmer {
  z-index: 1990;
  background-color: red;
  opacity: 0.5;
  /*
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  opacity: 0.8;
   */
}
.uploader-dimmer .uploading-modal {
  position: fixed;
  margin: auto;
  color: #fff;
  user-select: text;
  display: block !important;
  width: 45.4%;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  top: 50%;
  transform: translateY(-50%);
}
.uploader-dimmer .uploading-modal .header {
  color: #fff;
  border-bottom: none;
}
.uploader-dimmer .uploading-modal .content {
  display: block;
  width: 100%;
  font-size: 1em;
  line-height: 1.4;
  padding: 1.5rem;
  background-color: transparent;
}
@media only screen and (max-width: 1200px) {
  .uploader-dimmer .uploading-modal {
    width: 720px;
  }
}
@media only screen and (max-width: 992px) {
  .uploader-dimmer .uploading-modal {
    width: 680px;
  }
}
@media only screen and (max-width: 768px) {
  .uploader-dimmer .uploading-modal {
    width: 85%;
  }
}

.ui.modal.uploading-modal {
  z-index: 2000;
}

/*# sourceMappingURL=theme.css.map */
