@charset "utf-8";

#mk-app {
	display: inline-block;
	width: 100%;
	position: relative;
	text-align: center;
	outline: none;
	box-sizing: border-box;
	background-color: #71bceb;
	border-radius: 10px;
}

#mk-container {
	float: left;
	width: 100%;
	height: 100%;
	padding: 10px;
	position: relative;
}

#mk-container.mk-blurred {
	-webkit-filter: blur(6px);
	-moz-filter: blur(6px);
	-o-filter: blur(6px);
	-ms-filter: blur(6px);
	filter: blur(6px);
	opacity: .5;
}

#mk-center-panel {
	position: relative;
	width: 100%;
	height: 570px;
	margin-top: 10px;
	border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
}

#mk-exit-zoom-mode-button {
	position: absolute;
	bottom: -4px;
	left: 0;
	right: 0;
	width: 200px;
	margin: 0 auto;
	border: 1px #1b76d8 solid;
	outline: none;
	cursor: pointer;
	font-size: 14px;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, .25);
	padding: 6px 10px;
	border-radius: 6px;
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
	background: linear-gradient(to bottom, rgba(99, 182, 255, 1) 0%, rgba(51, 138, 232, 1) 100%);
	color: #FFFFFF;
	user-select: none;
	display: none;
	z-index: 1000;
}

#mk-exit-zoom-mode-button:active {
	background: linear-gradient(to bottom, rgba(51, 138, 232, 1) 0%, rgba(99, 182, 255, 1) 100%);
}

#mk-context-panel {
	float: left;
	width: 100%;
	height: 50px;
	perspective: 1000px;
	user-select: none;
}

#mk-context-panel .flip-box-inner {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	transition: transform 0.35s;
	transform-style: preserve-3d;
}

#mk-context-panel.show-back-face .flip-box-inner {
	transform: rotateX(180deg);
}

#mk-context-panel .flip-box-front,
#mk-context-panel .flip-box-back {
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-perspective: 0;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translate3d(0, 0, 0);
	visibility: visible;
	backface-visibility: hidden;
	border-radius: 8px;
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.35);
	overflow: hidden;
	background: #ffffff;
}

#mk-context-panel .flip-box-back {
	overflow: visible;
}

#mk-context-panel.show-back-face .flip-box-front {
	pointer-events: none;
}

#mk-context-panel .flip-box-back {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(240, 240, 240, 1) 100%);
	transform: rotateX(180deg);
}

#mk-close-panel-button {
	position: absolute;
	top: -7px;
	right: -7px;
	z-index: 2;
	width: 26px;
	height: 26px;
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('close-panel-icon.png');
	-webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, .25));
	cursor: pointer;
}

ul.mk-buttons {
	float: left;
	list-style: none;
	height: 100%;
	user-select: none;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
}

.mk-buttons li {
	flex: 1 0 auto;
	text-align: center;
	cursor: pointer;
	height: 100%;
	overflow: hidden;
	position: relative;
	border-right: 1px #dddddd solid;
	box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 1);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 20%, rgba(240, 240, 240, 1) 100%);
}

.mk-buttons li:first-child {
	box-shadow: none;
}

.mk-buttons li:last-child {
	border-right: none;
}

.mk-buttons li:active {
	background: linear-gradient(to bottom, rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.mk-buttons li.selected {
	box-shadow: none;
	background: linear-gradient(to bottom, rgba(210, 210, 210, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.mk-buttons li.disabled {
	pointer-events: none;
}

.mk-buttons li div {
	float: left;
	width: 100%;
	height: 100%;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: center 5px;
	background-size: 26px;
	position: relative;
}

.mk-buttons li.disabled div {
	opacity: .35;
}

.mk-buttons li div span {
	position: absolute;
	left: 0;
	bottom: 2px;
	padding: 0 7px;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 12px;
}

li#mk-clone-panel-button div {
	background-image: url('clone-panel-icon.png');
}

li#mk-remove-panel-button div {
	background-image: url('remove-panel-icon.png');
}

li#mk-forward-panel-button div {
	background-image: url('forward-panel-icon.png');
}

li#mk-flip-panel-button div {
	background-image: url('flip-panel-icon.png');
}

li#mk-backward-panel-button div {
	background-image: url('backward-panel-icon.png');
}

li#mk-options-panel-button div {
	background-image: url('options-panel-icon.png');
}

li#mk-hsl-panel-button div {
	background-image: url('hsl-panel-icon.png');
}

li#mk-text-panel-button div {
	background-image: url('text-panel-icon.png');
}

li#mk-shapes-panel-button div {
	background-image: url('shapes-panel-icon.png');
}

li#mk-drawing-panel-button div {
	background-image: url('drawing-panel-icon.png');
}

li#mk-text-tool-button div {
	background-image: url('text-tool-icon.png');
}

li#mk-fill-tool-button div {
	background-image: url('fill-tool-icon.png');
}

li#mk-eraser-tool-button div {
	background-image: url('eraser-tool-icon.png');
}

li#mk-drawing-tool-button div {
	background-image: url('drawing-tool-icon.png');
}

li#mk-import-tool-button div {
	background-image: url('import-tool-icon.png');
}

li#mk-background-button div {
	background-image: url('background-icon.png');
}

li#mk-save-button div {
	background-image: url('save-icon.png');
}

#mk-background-button input {
	cursor: pointer;
	position: absolute;
	top: 0px;
	right: 0px;
	opacity: 0.001;
	-moz-opacity: 0.001;
	filter: alpha(opacity=0.001);
	font-size: 100px;
	outline: none;
}

li#mk-import-tool-button {
	position: relative;
	overflow: hidden;
}

#mk-import-tool-button input {
	cursor: pointer;
	position: absolute;
	top: 0px;
	right: 0px;
	opacity: 0.001;
	-moz-opacity: 0.001;
	filter: alpha(opacity=0.001);
	font-size: 100px;
	outline: none;
}

#mk-options-buttons-section {
	width: 380px;
	padding-left: 0 !important;
}

@media screen and (max-width: 600px) {
	#mk-font-select {
		width: 280px;
	}
}

#mk-drawing-buttons-section {
	width: 270px;
	padding: 0 !important;
}

#mk-canvas-container {
	float: left;
	width: 100%;
	text-align: center;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 6px;
	overflow: hidden;
	background: rgba(255, 255, 255, .15);
}

#mk-canvas-loading {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	pointer-events: none;
	display: none;
}

.mk-loader {
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	margin: auto;
	background: none;
	border: 8px solid #f3f3f3;
	border-top: 8px solid #0090ff;
	border-radius: 50%;
	width: 80px;
	height: 80px;
	animation: mk-loader-spin .5s linear infinite;
}

@keyframes mk-loader-spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

#mk-zoom-box {
	position: absolute;
	bottom: 4px;
	right: 4px;
	user-select: none;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	/*background:rgba(255,255,255,.50);
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	padding:6px;*/
}

#mk-zoom-box.disabled {
	pointer-events: none;
	opacity: .5;
}

#mk-zoom-box ul {
	list-style: none;
	user-select: none;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 20%, rgba(240, 240, 240, 1) 100%);
	height: 34px;
}

#mk-zoom-box li {
	text-align: center;
	cursor: pointer;
	border-left: 1px #dddddd solid;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	padding: 0 10px;
	box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 1);
}

#mk-zoom-box li:first-child {
	border-left: none;
	box-shadow: none;
}

#mk-zoom-box li div {
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	width: 18px;
	height: 18px;
}

#mk-zoom-box #mk-zoom-in-button div {
	background-image: url('zoom-in-icon.png');
}

#mk-zoom-box #mk-zoom-out-button div {
	background-image: url('zoom-out-icon.png');
}

#mk-zoom-box #mk-zoom-reset-button div {
	background-image: url('zoom-reset-icon.png');
}

#mk-zoom-box #mk-move-mode-button div {
	background-image: url('move-mode-icon.png');
}

#mk-zoom-box li:active {
	background: linear-gradient(to bottom, rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

#mk-zoom-box li#mk-zoom-slider-container:active {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 20%, rgba(240, 240, 240, 1) 100%);
}

#mk-zoom-box li.disabled {
	pointer-events: none;
	opacity: .3;
}

#mk-zoom-box li.selected {
	box-shadow: none;
	background: linear-gradient(to bottom, rgba(99, 182, 255, 1) 0%, rgba(51, 138, 232, 1) 100%);
}

#mk-zoom-box li#mk-move-mode-button.selected div {
	background-image: url('move-mode-white-icon.png');
}

#mk-zoom-box #mk-zoom-percent {
	position: absolute;
	bottom: 0px;
	display: none;
}

#mk-app .color-picker-panel {
	width: 16px;
	height: 16px;
}

#mk-app .color-picker-panel-big {
	width: 26px;
	height: 26px;
}

#mk-app .color-picker-panel-big .sp-preview-inner {
	background-size: 14px !important;
}

#mk-app .color-picker-panel input {
	display: none;
}

#mk-app .color-picker-panel .sp-replacer {
	width: 100%;
	height: 100%;
	border: none;
	background: none;
	padding: 0;
	border-radius: 100%;
	margin-right: 0;
}

#mk-app .color-picker-panel .sp-preview {
	width: 100%;
	height: 100%;
	border: none;
	margin-right: 0;
	background: none;
}

#mk-app .color-picker-panel .sp-dd {
	display: none;
}

#mk-app .color-picker-panel .sp-preview-inner {
	overflow: hidden;
	border-radius: 100%;
	border: 1px #000000 solid;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 10px;
	background-image: url('pipette-picker-panel-icon.png');
}

#mk-help-status {
	clear: both;
	width: 100%;
	color: #000000;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding-top: 10px;
}

#mk-help-status div {
	display: inline-block;
	background-repeat: no-repeat;
	background-position: 8px center;
	background-size: 20px;
	background-image: url('info-icon.png');
	vertical-align: middle;
	background-color: #ffffff;
	padding: 7px 20px 7px 36px;
	/*box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.20);*/
	border-radius: 10px;
	font-size: 13px;
	display: none;
}

.upper-canvas.fill-mode {
	cursor: url('fill-cursor.png') 0 16, auto !important;
}

.upper-canvas.zoom-in {
	cursor: zoom-in !important;
}

.upper-canvas.zoom-out {
	cursor: zoom-out !important;
}

.upper-canvas.grab {
	cursor: grab !important;
}

.upper-canvas.grabbing {
	cursor: grabbing !important;
}

#mk-preload {
	position: absolute;
	top: 0px;
	left: 0px;
	pointer-events: none;
	z-index: -100;
	overflow: hidden;
}

#mk-context-panel .context-panel {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 8px;
	overflow: hidden;
}

#mk-context-panel .context-panel.disabled {
	opacity: .25;
	pointer-events: none;
}

#mk-context-panel .context-panel section.disabled {
	opacity: .25;
	pointer-events: none;
}

#mk-context-panel .context-sections {
	width: 100%;
	height: 100%;
}

#mk-context-panel .context-panel section {
	float: left;
	height: 100%;
	border-left: 1px #dddddd solid;
	box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 1);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 10px;
}

#mk-context-panel .context-panel section:first-child {
	border-left: none;
	box-shadow: none;
}

#mk-context-panel .context-panel .lines {}

#mk-context-panel .context-panel .line {
	float: left;
	clear: both;
	width: 100%;
	text-align: left;
	margin: 2px 0px 2px 0px;
	position: relative;
}

#mk-context-panel .context-panel .line .right {
	position: absolute;
	right: 0px;
}

#mk-context-panel .context-panel .line label {
	font-size: 12px;
	font-weight: bold;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: block;
	overflow: hidden;
}

@media screen and (max-width: 500px) {
	#mk-context-panel .context-panel .line label {
		max-width: 50px;
	}
}

#mk-context-panel .context-panel .line button {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(240, 240, 240, 1) 100%);
	border: 1px #dddddd solid;
	border-radius: 3px;
	font-weight: 500;
	font-size: 13px;
	cursor: pointer;
	outline: none;
	padding: 5px 5px;
}

#mk-context-panel .context-panel .line button.color {
	color: #FFFFFF !important;
	border-color: #1b76d8 !important;
	background: linear-gradient(to bottom, rgba(99, 182, 255, 1) 0%, rgba(51, 138, 232, 1) 100%) !important;
}

#mk-context-panel .context-panel .line button:active {
	background: linear-gradient(to bottom, rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

#mk-context-panel .context-panel .line button.color:active {
	background: linear-gradient(to top, rgba(99, 182, 255, 1) 0%, rgba(51, 138, 232, 1) 100%) !important;
}

#mk-effects-panel {
	font-size: 0;
}

#mk-effects-panel img {
	max-width: 36px;
	max-height: 36px;
	border-radius: 100%;
	overflow: hidden;
	cursor: pointer;
	/*border: 3px transparent solid;*/
	margin: 4px;
	box-sizing: content-box;
}

#mk-effects-panel img.selected {
	/*border-color: #60baff;*/
	border: 4px #60baff solid;
	margin: 0;
}

#mk-effects-panel img.disabled {
	opacity: .5;
	pointer-events: none;
	cursor: default;
}

#mk-context-panel .context-panel .undo-button {
	width: 30px;
	height: 30px;
	background: url('undo-icon.png') center no-repeat;
	background-size: 16px;
	cursor: pointer;
}

#mk-context-panel .context-panel .undo-button.disabled {
	opacity: .25;
}

#mk-context-panel .context-panel .reset-hsl-button {
	width: 30px;
	height: 30px;
	background: url('reset-hsl-icon.png') center no-repeat;
	background-size: 16px;
	cursor: pointer;
}

#mk-context-panel .context-panel .reset-hsl-button.disabled {
	opacity: .25;
}

#mk-shapes-panel {}

#mk-context-panel .context-panel .shapes {
	height: 100%;
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: toucher;
}

#mk-context-panel .context-panel .shapes::-webkit-scrollbar {
	height: 6px;
}

#mk-context-panel .context-panel .shapes::-webkit-scrollbar-track {
	background: #fff;
}

#mk-context-panel .context-panel .shapes::-webkit-scrollbar-thumb {
	background: #bbb;
}

#mk-context-panel .context-panel .shapes::-webkit-scrollbar-thumb:hover {
	background: #aaa;
}

#mk-context-panel .context-panel .shapes section {
	padding: 0 8px;
	flex: 0 0 auto;
}

#mk-context-panel .context-panel .shapes section:last-child {}

#mk-context-panel .context-panel .shapes .shape,
#mk-more-shapes-panel .shapes .shape {
	width: 26px;
	height: 26px;
	overflow: hidden;
	cursor: pointer;
	padding: 6px;
	background: #000000;
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
}

#mk-context-panel .context-panel .shapes .shape.selected,
#mk-more-shapes-panel .shapes .shape.selected {
	background: #60baff;
}

#mk-context-panel .context-panel .shapes section:last-child {}

#mk-more-shapes-button {
	width: 50px;
	height: 50px;
	border-left: 1px #dddddd solid;
	box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 1);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

#mk-more-shapes-button::after {
	content: '';
	width: 40px;
	height: 40px;
	background: url('more-shapes-icon.png') center no-repeat;
	background-size: auto 26px;
	animation-name: mk-more-shapes-button-out;
	animation-duration: .2s;
}

#mk-more-shapes-button.selected::after {
	animation-name: mk-more-shapes-button-in;
	animation-fill-mode: forwards;
}

@keyframes mk-more-shapes-button-in {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(45deg);
	}
}

@keyframes mk-more-shapes-button-out {
	0% {
		transform: rotate(45deg);
	}
	100% {
		transform: rotate(0deg);
	}
}

#mk-more-shapes-button:active {
	/*opacity:.5;*/
}

#mk-more-shapes-panel {
	position: absolute;
	width: 280px;
	background: #FFFFFF;
	display: none;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.40);
	border-radius: 8px;
	margin: 4px 0 0 0;
}

#mk-more-shapes-panel .shapes {
	width: 100%;
	padding: 6px;
	display: grid;
	grid-gap: 6px;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-auto-rows: auto;
}

#mk-more-shapes-panel section {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3px 0;
}

#slider-brush-size-preview {
	border: #1px #000000 solid;
	background: rgba(255, 255, 255, .5);
}

#mk-font-select {
	font-size: 16px;
	width: 150px;
	height: 30px;
}

@media screen and (max-width: 500px) {
	#mk-font-select {
		width: 50px;
	}
}

#mk-font-select {
	border-color: inherit;
	-webkit-box-shadow: none;
	box-shadow: none;
	padding: 0 0 0 6px;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #aaa;
	box-shadow: 0 1px 0 1px rgba(0, 0, 0, .04);
	border-radius: 2px;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: transparent;
	background-image: url(open-select-icon.png);
	background-repeat: no-repeat;
	background-position: right .7em top 50%;
	background-size: .65em auto;
}

#mk-font-select:focus {
	outline: none;
}

#mk-font-select::-ms-expand {
	display: none;
}

#mk-font-select:hover {
	border-color: #888;
}

#mk-font-select:focus {
	color: #222;
	outline: none;
}

#mk-font-select option {
	font-weight: normal;
}

#mk-message {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	user-select: none;
}

#mk-message .container {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	display: flex;
    align-items: center;
    flex-direction: column;
	margin: auto;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(244, 244, 244, 1) 100%);
	border-radius: 8px;
	padding: 10px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.30);
	width: 320px;
	height: fit-content;
}

#mk-message-close-button {
	position: absolute;
	top: -12px;
	right: -12px;
	z-index: 2;
	width: 34px;
	height: 34px;
	background-size: 26px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('close-panel-icon.png');
	-webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, .25));
	cursor: pointer;
}

#mk-message .message {
	flex: 1;
	font-size: 16px;
	min-height:100px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
}
#mk-message #merge-all-shapes-label {
	padding-top:10px;
	display:none;
}

.mk-message-button,
.mk-message-button-color {
	border: 1px #dddddd solid;
	cursor: pointer;
	outline: none;
	padding: 6px 16px;
	font-weight: bold;
	border-radius: 6px;
}

.mk-message-button-color {
	color: #FFFFFF !important;
	border-color: #1b76d8 !important;
	background: linear-gradient(to bottom, rgba(99, 182, 255, 1) 0%, rgba(51, 138, 232, 1) 100%);
}

.mk-message-button-color:active {
	background: linear-gradient(to bottom, rgba(51, 138, 232, 1) 0%, rgba(99, 182, 255, 1) 100%);
}

.mk-message-button {
	background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(240, 240, 240, 1) 100%);
}

.mk-message-button:active {
	background: linear-gradient(to bottom, rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

#mk-create-status {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
}

#mk-create-status .container {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	margin: auto;
	width: 320px;
	height: 140px;
}

#mk-create-status .mk-loader {
	top: 10px;
	margin: 0 auto;
	border: 6px solid #f3f3f3;
	border-top: 6px solid #0090ff;
	border-radius: 50%;
	width: 60px;
	height: 60px;
}

#mk-create-status .message {
	position: absolute;
	top: 86px;
	left: 0;
	right: 0;
	margin: 0 auto;
}

#mk-create-status .message div {
	display: inline-block;
	font-size: 16px;
	padding: 10px 20px;
	background: #FFFFFF;
	border-radius: 6px;
	box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.20);
}
.mk-slider-value-preview {
	position: absolute;
	width: 36px;
	height: 44px;
	line-height: 36px;
	margin: -54px 0 0 -18px;
	text-align: center;
	background: url('slider-value-preview-icon.png') center no-repeat;
	background-size: 100%;
	z-index: 20;
	overflow: hidden;
	font-size: 13px;
	user-select: none;
	-webkit-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, .25));
}


/*

http://danielstern.ca/range.css/?ref=css-tricks#/

*/

input[type=range].mk-slider {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	width: 100px;
	background: transparent;
}

@media screen and (max-width: 500px) {
	input[type=range].mk-slider {
		width: 50px;
	}
}

input[type=range].mk-slider:focus {
	outline: none;
}

input[type=range].mk-slider::-webkit-slider-thumb {
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.25);
	height: 18px;
	width: 18px;
	border: none;
	border-radius: 100%;
	background: #ffffff;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	margin-top: -9px;
}

input[type=range].mk-slider::-webkit-slider-runnable-track {
	width: 100%;
	height: 4px;
	box-shadow: inset 0px -1px 0px 0px rgba(255, 255, 255, .25);
	background: #c5c4c9;
	border-radius: 25px;
	border: 0px solid #010101;
}

input[type=range].mk-slider:focus::-webkit-slider-runnable-track {
	background: #c5c4c9;
}

#mk-zoom-slider-input {
	width: 100px;
}

#mk-zoom-slider-input::-webkit-slider-thumb {
	height: 28px;
	width: 28px;
	margin-top: -12px;
	background: url('zoom-slider-thumb-icon.png') center no-repeat #ffffff;
	background-size: 50%;
}

#mk-zoom-slider-input::-webkit-slider-runnable-track {
	height: 6px;
}


/*@import url('https://fonts.googleapis.com/css?family=Bangers|Zhi+Mang+Xing');*/


/*@import url('https://fonts.googleapis.com/css?family=Pacifico|VT323|Quicksand|Inconsolata');*/


/*
@font-face {
  font-family: 'Pacifico';
  font-style: normal;
  font-weight: 400;
  src: local('Pacifico Regular'), local('Pacifico-Regular'), url(https://fonts.gstatic.com/s/pacifico/v16/FwZY7-Qmy14u9lezJ-6J6MmTpA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}*/