.fill-vh-preview {
	height: 78vh;
}

.fill-vh-editor {
	height: 72vh
}

.bg-monokai {
	background-color: #272822;
}

.custom-tab {
	border-bottom: 4px solid transparent !important;
	background-color: transparent !important;
}

.custom-tab.active {
	border-bottom: 4px solid #20fc8f !important;
	background-color: transparent !important;
}

#questionModal .card {
	height: 50vh;
}

#questionModal .card .card-body {
	overflow: auto;
}

#questionModal .card .card-header,
#preview-title {
	background-color: #f6f6f9;
}

#questionModal .card .card-header a span {
	font-size: 18px;
}

#questionModal {
	position: absolute;
	bottom: 70px;
	width: calc(60% - 10px);
	z-index: 4;
}

#questionCollapse {
	font-size: 18px;
	text-decoration: none;
}

.gutter {
	background-color: #eee;

	background-repeat: no-repeat;
	background-position: 50%;
}

.gutter.gutter-vertical {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=');
	cursor: row-resize;
}

.gutter.gutter-horizontal {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
	cursor: col-resize;
}

.ace_mobile-button {
	display: none;
}

.preview-min-width {
	overflow: hidden;
}

.editor-min-width {
	overflow: hidden;
}

.spinner,
.question-success {
	color: #09e176 !important;
}

.question-error {
	color: #ff0057;
}

.question-error,
.question-success {
	font-size: 18px;
}

.modal-dialog-slideout {
	min-height: 100%;
	margin: 0 0 0 auto;
	background: #fff;
}

.modal.fade .modal-dialog.modal-dialog-slideout {
	-webkit-transform: translate(100%, 0)scale(1);
	transform: translate(100%, 0)scale(1);
}

.modal.fade.show .modal-dialog.modal-dialog-slideout {
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
	display: flex;
	align-items: stretch;
	-webkit-box-align: stretch;
	height: 100%;
}

.modal.fade.show .modal-dialog.modal-dialog-slideout .modal-body {
	overflow-y: auto;
	overflow-x: hidden;
}

.modal-dialog-slideout .modal-content {
	border: 0;
}

.modal-dialog-slideout .modal-header,
.modal-dialog-slideout .modal-footer {
	height: 69px;
	display: block;
}

.modal-dialog-slideout .modal-header h5 {
	float: left;
}

/*webkata main, library*/
.overflow {
	overflow: auto;
}

#webkata-page, #webkata-editor-page, #webkata-library-page {
	padding: 0 80px;
}

@media screen and (min-width: 992px) and (max-width: 1200px) {	
	#webkata-page, #webkata-editor-page, #webkata-library-page {
		padding: 0 30px;
	}
}

@media screen and (max-width: 992px) {
	#webkata-page, #webkata-editor-page, #webkata-library-page {
		padding: 0 1rem;
	}
}

#webkata-page .bodyContainer p,
#webkata-library-page .bodyContainer p {
	font-size: 1rem;
}

#webkata-page h1 {
	font-size: 2rem;
	font-weight: bolder;
}

#webkata-library-page .fa.fa-tag {
	transform: rotate(135deg);
	font-size: large;
}

.pagination-wrap a,
thead {
	cursor: pointer;
}

.pagination-wrap {
	font-size: 20px;
	font-weight: 600;
}

.pagination-wrap a#pagination-prev.pagination-disable,
a#pagination-next.pagination-disable {
	cursor: no-drop;
}

.page-number {
	align-self: center;
}

.page-number.active {
	border-radius: 50%;
	background-color: #212529 !important;
	color: white !important;
	padding: 4px 12px;
}

#pagination-next {
	color: #495057;
	align-self: center;
}

#pagination-next::before {
	font-family: Font Awesome\ 5 Free;
	content: "\f054";
}

#pagination-prev::after {
	font-family: Font Awesome\ 5 Free;
	content: "\f053";
}

#pagination-prev {
	color: #495057;
	align-self: center;
}

.pagination-disable {
	color: #95a4c2 !important;
}

.webkata-main-padding {
  padding: 0 80px;
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
  .webkata-main-padding {
    padding: 0 30px;
  }
}

@media screen and (max-width: 992px) {
  .webkata-main-padding {
    padding: 0rem;
  }
}