
#createwrapper {
	display: none;
	position: fixed;
	height: 100vh;
	width: 100vw;
	top: 0;
	left: 0;
	z-index: 1001;
	/*=*********************/
	/**** CREATE BOTTOM ****/
	/***********************/
}

	#createwrapper #createbg {
		position: absolute;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		background-color: #1E1E1E;
		opacity: 0.6;
	}

	#createwrapper #create {
		display: flex;
		flex-direction: column;
		position: absolute;
		width: 90vw;
		height: 80vh;
		max-width: 1600px;
		max-height: 1000px;
		padding: 50px 50px 40px 50px;
		border-radius: 16px;
		margin-left: 50vw;
		margin-top: 50vh;
		overflow-x: hidden;
		overflow-y: auto;
		background-color: #ffffff;
		transform: translate(-50%, -50%);
		/*=*********************/
		/******* COLUMNS *******/
		/***********************/
		/*=*********************/
		/******** INPUT ********/
		/***********************/
		/*=*********************/
		/**** RIGHT BUTTONS ****/
		/***********************/
	}

		#createwrapper #create #createcontent {
			flex-grow: 1;
		}

		#createwrapper #create .flexrow {
			display: flex;
		}

			#createwrapper #create .flexrow .flexcol {
				flex: 1;
				position: relative;
				flex-flow: column nowrap;
				display: flex;
			}

		#createwrapper #create .form-row {
			display: flex;
		}

			#createwrapper #create .form-row > .form-field {
				flex: 1;
				position: relative;
				flex-flow: column nowrap;
				display: flex;
				padding: 0 5px;
			}

				#createwrapper #create .form-row > .form-field:first-child {
					padding-left: 0px;
				}

				#createwrapper #create .form-row > .form-field:last-child {
					padding-right: 0px;
				}

					#createwrapper #create .form-row > .form-field:last-child > span {
						margin-left: 45px;
					}

		#createwrapper #create .form-field {
			margin: 20px 0;
			position: relative;
			display: inline-block;
		}

			#createwrapper #create .form-field > span {
				/* padding: 10px; */
				line-height: 58px;
				margin-left: 40px;
				pointer-events: none;
				position: absolute;
				left: 0;
				top: 0;
				transition: 0.2s all linear;
				transition-timing-function: ease;
				transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
				color: #BCC5D6;
			}

			#createwrapper #create .form-field > input {
				width: 100%;
				padding: 28px 10px 10px 40px;
				border: 1px solid #BCC5D6;
				border-radius: 16px;
			}

			#createwrapper #create .form-field input:focus + span, #createwrapper #create .form-field input:not(:placeholder-shown) + span, #createwrapper #create .form-field .chosen-container-active + span, #createwrapper #create .form-field .chosen-has-item + span {
				opacity: 1;
				line-height: 30px;
			}

			#createwrapper #create .form-field input[type="number"] {
				-webkit-appearance: textfield;
				-moz-appearance: textfield;
				appearance: textfield;
			}

			#createwrapper #create .form-field input[type=number]::-webkit-inner-spin-button,
			#createwrapper #create .form-field input[type=number]::-webkit-outer-spin-button {
				-webkit-appearance: none;
			}

			#createwrapper #create .form-field .inputupdown {
				opacity: 0;
				background-color: #EFEFEF;
				border-left: 1px solid #BCC5D6;
				position: absolute;
				right: 1px;
				height: 50%;
				width: 25px;
				cursor: pointer;
				user-select: none;
				/* standard syntax */
				-webkit-user-select: none;
				/* webkit (safari, chrome) browsers */
				-moz-user-select: none;
				/* mozilla browsers */
				-khtml-user-select: none;
				/* webkit (konqueror) browsers */
				-ms-user-select: none;
				/* IE10+ */
			}

				#createwrapper #create .form-field .inputupdown > svg {
					height: 100%;
					font-size: 0.75em;
					margin-left: 6px;
					color: #BCC5D6;
				}

				#createwrapper #create .form-field .inputupdown:hover {
					background-color: #E0E0E0;
				}

					#createwrapper #create .form-field .inputupdown:hover svg {
						color: #1E1E1E;
					}

			#createwrapper #create .form-field .inputdown {
				bottom: 1px;
				border-radius: 0 0 16px 0;
			}

			#createwrapper #create .form-field .inputup {
				border-radius: 0 16px 0 0;
				top: 1px;
				border-bottom: 1px solid #BCC5D6;
				z-index: 2;
			}

			#createwrapper #create .form-field > svg {
				position: absolute;
				height: 100%;
				margin-left: 15px;
				color: #BCC5D6;
				z-index: 1;
			}

			#createwrapper #create .form-field:hover .inputupdown {
				opacity: 1;
			}

		#createwrapper #create .check-group {
			display: inline-block;
			margin: 10px 0;
		}

			#createwrapper #create .check-group .form-check {
				margin: 10px 0;
				width: 100%;
			}

				#createwrapper #create .check-group .form-check .kmwsitch label {
					width: 100%;
					padding: 8px 20px 8px 53px;
					border-radius: 20px;
					font-weight: 600;
					background-color: #EEEEEE;
				}

					#createwrapper #create .check-group .form-check .kmwsitch label:before {
						left: 10px;
						background-color: #BCC5D6;
					}

					#createwrapper #create .check-group .form-check .kmwsitch label:after {
						left: 13px;
					}

				#createwrapper #create .check-group .form-check .kmwsitch input:checked + label:before {
					background-color: #377EF6;
				}

				#createwrapper #create .check-group .form-check .kmwsitch input:checked + label:after {
					left: 26px;
				}

		#createwrapper #create .form-field-btns {
			align-items: center;
			display: flex;
			padding-left: 10px;
		}

			#createwrapper #create .form-field-btns .btn-foreign-edit {
				cursor: pointer;
			}

				#createwrapper #create .form-field-btns .btn-foreign-edit svg {
					color: #377EF6;
				}

				#createwrapper #create .form-field-btns .btn-foreign-edit:hover svg {
					color: #203F77;
				}

	#createwrapper #createbottom {
		text-align: right;
	}

		#createwrapper #createbottom .bigbtn svg {
			margin-right: 5px;
		}

		#createwrapper #createbottom .btn-save {
			background-color: #377EF6;
			color: #ffffff;
		}

			#createwrapper #createbottom .btn-save:hover {
				background-color: #203F77;
			}

		#createwrapper #createbottom .btn-close {
			background-color: #EB5757;
			color: #fff;
		}

			#createwrapper #createbottom .btn-close:hover {
				background-color: #FBDCDC;
			}

/* copy section */

.bigbtn {
	position: relative;
	display: inline-block;
	height: 50px;
	line-height: 50px;
	width: 190px;
	text-align: center;
	font-weight: 700;
	border-radius: 25px;
	cursor: pointer;
	overflow: hidden;
	margin-left: 20px;
}

/* copy section */

#createwrapper #create .form-field > svg {
	position: absolute;
	height: 100%;
	margin-left: 15px;
	color: #BCC5D6;
	z-index: 1;
}

/* copy section */

.km-form-volatile {
	display: none;
}

.km-form[form-action=edit] .km-form-edit-only {
	display: block;
}

.km-form[form-action=create] .km-form-create-only {
	display: block;
}
