.gridline, .no-select, .printable-area-toolbar span, .ygridline, div.printable-area-exclusion, div.productColor, div.texture-overlay, div.xgridline, img.ghost-image, img.ghost-image2, svg.svg-surface {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none
}
div.new-editor-container {
	position: relative;
	width: 530px;
	height: 630px;
	margin: 0 auto;
	-webkit-perspective: 750pt;
	perspective: 750pt;
	-webkit-transform: translateY(0px);
	transform: translateY(0px);
	-webkit-transition: -webkit-transform .4s ease;
	transition: -webkit-transform .4s ease;
	transition: transform .4s ease;
	transition: transform .4s ease, -webkit-transform .4s ease
}
.new-editor-container * {
	-webkit-font-smoothing: subpixel-antialiased
}
.new-editor-container :focus {
	outline-style: none;
	outline-width: 0
}
div.new-editor {
	text-align: left;
	width: 530px;
	height: 630px;
	background: #fff;
	-webkit-transition: -webkit-transform .4s ease;
	transition: -webkit-transform .4s ease;
	transition: transform .4s ease;
	transition: transform .4s ease, -webkit-transform .4s ease;
	box-sizing: content-box;
	position: absolute;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden
}
div.printable-area-box, div.printable-area-box2 {
	margin-top: -2px;
	background: transparent;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	border-right: 2px solid #fff;
	border-bottom: 0;
	color: #fff
}
div.printable-area-box, div.printable-area-toolbar, div.printable-area-box2 {
	position: absolute;
	box-sizing: content-box;
	margin-left: -2px;
	-webkit-transition: all .4s ease;
	transition: all .4s ease
}
div.printable-area-toolbar {
	font-size: .7em;
	width: calc(100% + 4px);
	bottom: -2em;
	background-color: #fff;
	height: 2em;
	line-height: 2em
}
.printable-area-toolbar span {
	margin-left: .25em
}
div.printable-area-zoom {
	width: 1.25em;
	height: 1.25em;
	float: right;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	position: relative;
	margin-right: .25em;
	cursor: pointer
}
img.printable-area-zoom-image {
	position: absolute;
	-webkit-transition: opacity .4s ease;
	transition: opacity .4s ease
}
.zoom-in {
	cursor: -webkit-zoom-in;
	cursor: zoom-in
}
.zoom-out {
	cursor: -webkit-zoom-out;
	cursor: zoom-out
}
.zero-opacity {
	opacity: 0
}
div.printable-area-exclusion {
	position: absolute;
	-webkit-transition: all .4s ease;
	transition: all .4s ease
}
img.ghost-image,  img.ghost-image2 {
	background-size: 530px 630px!important
}
div.productColor, img.ghost-image,  img.ghost-image2 {
	position: absolute;
	width: 530px;
	height: 630px
}
div.productColor {
	-webkit-transition: background-color .4s ease;
	transition: background-color .4s ease
}
div.texture-overlay {
	position: absolute;
	width: 530px;
	height: 630px;
	background-size: 530px 630px!important
}
.x-flipped {
	-webkit-transform: scale(-1, 1);
	transform: scale(-1, 1)
}
svg.svg-surface {
	width: 530px;
	height: 630px
}
div.additionalSvgContainer, div.html-surface, svg.svg-surface {
	position: absolute
}
div.html-surface {
	width: 530px;
	height: 630px
}
@-webkit-keyframes marching-ants-1 {
0% {
background-position:0 0, 0 100%, 0 0, 100% 0
}
to {
	background-position: 1pc 0, -1pc 100%, 0 -1pc, 100% 1pc
}
}
@keyframes marching-ants-1 {
0% {
background-position:0 0, 0 100%, 0 0, 100% 0
}
to {
	background-position: 1pc 0, -1pc 100%, 0 -1pc, 100% 1pc
}
}
.marching-ants {
	padding: 1px;
	background-size: 8px 1px, 8px 1px, 1px 8px, 1px 8px;
	background-position: 0 0, 0 100%, 0 0, 100% 0;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	-webkit-animation: marching-ants-1 .7s;
	animation: marching-ants-1 .7s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-play-state: paused;
	animation-play-state: paused
}
div.xgridline {
	height: 100%;
	width: 1px;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%)
}
.ygridline {
	height: 1px;
	width: 100%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%)
}
div.flip-container {
	position: absolute;
	width: 530px;
	height: 630px;
	-webkit-transition: -webkit-transform .6s;
	transition: -webkit-transform .6s;
	transition: transform .6s;
	transition: transform .6s, -webkit-transform .6s;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d
}
.flipped {
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg)
}
.back, .front {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	position: absolute;
	top: 0;
	left: 0
}
.front {
	z-index: 2
}
.back {
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg)
}
.flip-buttons {
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute;
font-size:.8rem;
	font-weight: 600
}
.flip-button {
padding:.5rem 1.4rem;
	line-height: 1.4rem;
	border: 1px solid #6c7478;
	background: #fff;
	color: #6c7478;
	display: inline-block;
	text-align: center;
	box-sizing: border-box;
	cursor: pointer
}
.flip-button-active {
	background: #6c7478;
	color: #fff
}
.flip-button-front {
	border-radius: 5px 0 0 5px
}
.flip-button-back {
	border-radius: 0 5px 5px 0;
	margin-left: -4px
}
.toggle-edit {
	bottom: -2rem;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	position: absolute
}