/************* Keyframes **************/

body.library.edit.brand .body_layout .keyframes {
	max-width: 100%;
	width: 1600px;
	margin-left: auto;
	margin-right: auto;
	background-color: rgb(255, 255, 255);
}

body.library.edit.brand  .selectKeyframe > div {
	position: relative;
	padding-left: 10px;
}

body.library.edit.brand .selectKeyframe > div > div > div {
	display: inline-block;
}

body.library.edit.brand div.controls:not(.domEditable) {
	height: 40px;
	width: 100%;
	background: rgb(220, 220, 220);
	display: block;
	position: relative;
}

body.library.edit.brand .imageEditorWrapper {
	position: relative;
	margin: 200px auto;
	width: 50%;
	padding-top: 20%;
}

body.library.edit.brand .imageEditorWrapper:before{
	content: '';
	position: absolute;
	top: -200px;
	left: -50%;
	right: calc(-50% + 10px);
	bottom: -200px;
	opacity: .2;
}

body.library.edit.brand .imageEditorWrapper div.screen {
	background-color: rgb(246, 246, 246);
	padding: 0;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;

	position: absolute;
}

body.library.edit.brand .controls:not(.domEditable) p {
	margin: 0;
	width: auto;
	vertical-align: top;
	position: relative;
	right: 0;
	float: right;
	padding: 2px 10px 0px 10px;
}

body.library.edit.brand .controls:not(.domEditable) p i {
	font-size: 30px;
	display: inline-block;
	vertical-align: middle;
	padding-right: 10px;
}

body.library.edit.brand .imageEditorWrapper div.screen div.croppedImage,
.handleImage {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
}

body.library.edit.brand .imageEditorWrapper div.screen div.logo,
body.library.edit.brand .dragimage {
	position: absolute;
	width: 100%;
	height: 100%;
}

body.library.edit.brand .handleImage {
	overflow: visible;
}

body.library.edit.brand .content,
body.library.edit.brand div.content div.imageEditorWrapper {
	overflow: visible;
}
/**************** Logos Animations ****************/

body.library.edit.brand .dragimage {
	cursor: move;
	z-index: 9;
}
body.library.edit.brand .dragimage svg {
	overflow: visible;
	opacity: 0.3;
}
body.library.edit.brand .handleImage div.scaling,
body.library.edit.brand .handleImage div.rotate {
	height: auto;
	width: 6%;
	max-width: 30px;
	background-color: rgb(255, 255, 255);
	background-size: 60%;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url("../img/expand-alt-solid.svg");
	position: absolute;
	top: -3%;
	right: -3%;
	cursor: nesw-resize;
	z-index: 1;
	outline: 2px solid black;
	border:none !important;
	transform:scale(1) translate3d( 0, 0, 0);
}

body.library.edit.brand .handleImage div.rotate {
	border-radius: 50%;
	top: calc(50% - 3%);
	cursor: grab;
	transform: rotate(-30deg);
	background-image: url("../img/undo-solid.svg");
}

body.library.edit.brand .handleImage div.scaling:after,
body.library.edit.brand .handleImage div.rotate:after {
	padding-top: 100%;
	content: '';
	display: block;
}
body.library.edit.brand body.library.edit.brand .dragimage:before,
body.library.edit.brand .dragimage:after {
	content: '';
	position: absolute;
	border: 1px solid #fff;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 43px;
	cursor: move;
}
body.library.edit.brand .dragimage:after {
	border: 1px dashed black;
}
/**************** Keyframe Settings ****************/

body.library.edit.brand input.borderPlus {
	float: left;
}
body.library.edit.brand .border,
body.library.edit.brand input.borderPlus {
	width: calc(100% - 47px);
	padding: 10px;
	border: 2px solid rgb(0, 0, 0);
	font-size: inherit;
	height: 45px;
}
body.library.edit.brand .farben div {
	width: calc(100% - 30px);
	margin-bottom: 10px;
	margin-left: 10px;
}
body.library.edit.brand .orte > div > div, .tags > div > div {
	width: 100%;
	margin-bottom: 10px;
}
body.library.edit.brand .orte > div > p, .tags > div > p {
	display: inline-block;
	margin: 2px 0 0px 10px;
	padding: 0;
	vertical-align: top;
}
body.library.edit.brand .orte div input, .tags div input {
	margin: 0px 0 0 0;
}
body.library.edit.brand .farben div div {
	margin-bottom: 10px;
	width: 100%;
}
body.library.edit.brand .farben div div {
	height: 25px;
	width: 150px;
	display: inline-block;
	margin: 0px;
}
body.library.edit.brand .farben form {
}
body.library.edit.brand .farben h1 span {
	margin-right: 309px;
}
body.library.edit.brand .farben h1 i,
.farben h1 b {
	background: rgb(220, 220, 220);
	color: black;
	text-align: center;
	display: inline-block;
	width: 30px;
	margin-left: 44px;
	position: static;
}
body.library.edit.brand .farben div p {
	display: inline-block;
	margin: 4px 10px 0 10px;
	vertical-align: top;
}
body.library.edit.brand .farben div input {
	float: right;
	margin: 0 0px 0 50px;
	cursor: pointer;
}
body.library.edit.brand .farben div form {
	display: inline-block;
	float: right;
}
body.library.edit.brand .brandCollection {
	margin: 0;
	overflow: hidden;
}
body.library.edit.brand .brand {
	margin-bottom: 10px;
	overflow: hidden;
}