@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700');

#upload_image {
	width     : 440px;
	max-width : 100%;
	padding   : 0;
}

#upload_image div.content {
	padding : 10px 20px 0;
}

#upload_image img {
	max-width : 100%; /* This rule is very important, please do not ignore this! */
}

#upload_image #canvas {
	height : 350px;
	width  : 400px;
	cursor : default;
}

.btnContainer {
	padding : 10px 0;
	position : relative;
}

button.close, #btnCrop, #change {
	display            : block;
	width              : 48%;
	max-width          : 48%;
	height             : auto;
	padding            : 10px 0;
	float              : left;
	border-radius      : 5px;
	text-align         : center;
	font-size          : 24px;
	line-height        : 1;
	margin             : 0;
	border             : none;
	outline            : none;
	text-shadow        : none;
	-webkit-box-sizing : border-box;
	-moz-box-sizing    : border-box;
	box-sizing         : border-box;
	text-transform     : uppercase;
}

#rotate{
	position: absolute;
	top: -50px;
	left: 50%;
	margin-left: -14px;
	cursor: pointer;
}
#rotate svg{
	background: #fff;
	width: 30px;
	height: 30px;
	border-radius: 4px;
	text-align: center;
	padding: 4px;
	box-sizing: border-box;
}

#rotate svg path{
	fill: #000;
}

#change , body.it #btnCrop, body.ru #btnCrop{
	font-size: 16px;
	padding: 14px 0;
}

body.nl #change {
	font-size: 12px;
	padding: 16px 0;
}

body.de #btnCrop, body.el #btnCrop {
	font-size: 20px;
	padding: 12px 0;
}

button.close {
	background-color : #fff !important;
	border           : 2px solid #8c9696;
	margin-right     : 4%;
	color            : #4b4545;
}

#btnCrop, .Popup #change {
	background-color : #ff6000 !important;
	border           : 2px solid #ff6000;
	color            : #fff;
	font-weight      : 700;
}

.canvasContainer {
	position : relative;
}

.tooSmallImage {
	display               : none;
	color                 : #e91f19;
	text-align            : center;
	position              : absolute;
	bottom                : 5px;
	background            : #fff;
	width                 : calc(100% - 10px);
	left                  : 5px;
	padding               : 15px 10px 10px;
	-webkit-box-sizing    : border-box;
	-moz-box-sizing       : border-box;
	box-sizing            : border-box;
	-webkit-border-radius : 5px;
	-moz-border-radius    : 5px;
	border-radius         : 5px;
	font-size             : 16px;
	margin-bottom         : 0;
}

.exclamation {
	position     : absolute;
	top          : -13px;
	right        : 50%;
	margin-right : -13px;
	font-size    : 20px;
	cursor       : pointer;
}

.exclamation svg {
	width                 : 26px;
	height                : 26px;
	background            : #fff;
	-webkit-border-radius : 14px;
	-moz-border-radius    : 14px;
	border-radius         : 14px;
	border                : 2px solid #fff;
}

.exclamation svg path.st0 {
	fill : #e91f19;
}

#change {
	display : none;
}

.topText {
	padding : 15px 0;
}

.topText h2 {
	text-align  : center;
	font-size   : 23px;
	color       : #ff6000;
	margin      : 0 0 10px 0;
	font-weight : 700;
}

.topText p {
	color         : #000;
	font-size     : 18px;
	text-align    : center;
	margin-bottom : 0;
}

.cropper-view-box {
	outline-color : #fff !important;
	outline       : 3px solid #fff !important;
}

.cropper-line {
	background-color : #fff !important;
}

/* Outline Center Dots */

.cropper-point.point-n,
.cropper-point.point-e,
.cropper-point.point-s,
.cropper-point.point-w {
	visibility : hidden;
}

/*Corners*/
.cropper-point.point-ne {
	width        : 40px;
	height       : 40px;
	right        : -9px !important;
	top          : -9px !important;
	border-top   : 15px solid #fff;
	border-right : 15px solid #fff;
	background   : none;
	opacity      : 1;
}

.cropper-point.point-se {
	width         : 40px !important;
	height        : 40px !important;
	right         : -9px !important;
	bottom        : -9px !important;
	border-bottom : 15px solid #fff;
	border-right  : 15px solid #fff;
	background    : none;
	opacity       : 1;
}

.cropper-point.point-sw {
	width         : 40px;
	height        : 40px;
	left          : -9px !important;
	bottom        : -9px !important;
	border-bottom : 15px solid #fff;
	border-left   : 15px solid #fff;
	background    : none;
	opacity       : 1;
}

.cropper-point.point-nw {
	width       : 40px;
	height      : 40px;
	left        : -9px !important;
	top         : -9px !important;
	border-top  : 15px solid #fff;
	border-left : 15px solid #fff;
	background  : none;
	opacity     : 1;
}

.cropper-point.point-ne .cropper-point.point-se, .cropper-point.point-sw, .cropper-point.point-nw {
	cursor : hand;
}

/* Center Cross */

.cropper-center {
	visibility : hidden;
}

.clearfix {
	clear : both;
}

@media all and (max-width : 40em) {
	#upload_image {
		min-height : auto;
	}

	.topText h2{
		font-size: 18px;
		margin: 0;
	}
	.topText {
		padding: 0 0 20px;
	}

	.topText p{
		font-size: 13px;
	}
}
/*478562.1.501.2.fc81bce*/