/* Taglib Component CSS *******************************************************/

/* MessageIcon, InputTranslation */

input.input-error, textarea.input-error, select.input-error {
	background-color:#ffcccc;
}

/* OutputDiff */

.outputdiff-container {
	display:block;
	text-indent:-20px;
	margin-left:20px;
}
.outputdiff-isinsyncicon {
	border:0;
	margin:0 4px 0 0;
}

/* InputTranslation */

input.input-okay, textarea.input-okay {}
input.input-todo, textarea.input-todo {}

table.input-translation-grid {
	margin:2px 0 0 0;
	border:0;
	padding:0;
	border-collapse:collapse;
}
table.input-translation-grid tr {
	vertical-align:top;
}
td.input-translation-grid-label {
	white-space:nowrap;
}
td.input-translation-grid-label img {
	vertical-align:bottom;
}
td.input-translation-grid-content {}
td.input-translation-grid-content div.input-translation-source {
	padding:3px 4px 3px 2px;
	border:1px solid #cccccc;
	background-color:#eeeeee;
}
td.input-translation-grid-content div.input-translation-toolbar {
	display:none;
	background-color:#fafafa;
	margin:3px 0 0 0;
	border:1px solid #cccccc;
	border-bottom:0;
	padding:2px 4px 1px 2px;
	text-align:right;
}
td.input-translation-grid-content div.input-translation-toolbar img {
	border:0;
	margin-right:2px;
}
td.input-translation-grid-content div.input-translation-toolbar img:hover {
	cursor:pointer;
	cursor:hand;
}
td.input-translation-grid-content textarea.input-translation-target,
td.input-translation-grid-content input.input-translation-target {
	margin-top:0;
	padding:1px 4px 2px 2px;
}
td.input-translation-grid-state {}
td.input-translation-grid-state img {
	border:0;
	margin:1px 0 0 2px;
}
.input-translation-no-content {
	font-size:0.82em;
	font-style:italic;
	font-weight:bold;
	text-align:center;
	color:#888a85;
}

/* ImageThumb */

div.image-thumb {
	position:relative;
}
div.image-thumb .image-thumb-box {
	/* http://mrclay.org/web_design/centered_image/ */
	display:table-cell;
	text-align:center;
	vertical-align:middle;
}
div.image-thumb .image-thumb-box img.image-thumb-thumb {
	vertical-align:middle;
}
div.image-thumb .image-thumb-box .image-thumb-zoomicon {
	position:absolute ! important;
	bottom:0;
	right:0;
}
div.image-thumb .image-thumb-box .image-thumb-zoomicon img {
	border:0;
}
div.image-thumb-preview {
	border:1px solid #CCCCCC;
	background-color:#FFFFFF;
	padding:5px;
	position:absolute;
	display:none;
	z-index:99;
}

/* GoogleLatLonGeocoder */

div.googlelatlongeocoder {
    border:1px solid #cccccc;
    margin-top:3px;
}
div.googlelatlongeocoder-toolbar {
    background-color:#eeeeee;
    padding:2px;
    text-align:right;
}
div.googlelatlongeocoder-toolbar img {
    border:0;
    margin-right:2px;
}
div.googlelatlongeocoder-toolbar img:hover {
    cursor:pointer;
    cursor:hand;
}
div.googlelatlongeocoder-map {}

/* GoogleMultiPolygonEditor */

div.googlepolygoneditor {}
div.googlepolygoneditor_toolbar {
	width:100%;
	border:1px solid #cccccc;
	box-sizing:border-box;
	border-bottom:0;
	background-color:#eeeeee;
	padding:2px;
	padding-bottom:0;
}
div.googlepolygoneditor_toolbar img.googlepolygoneditor_btn-address_on,
div.googlepolygoneditor_toolbar img.googlepolygoneditor_btn-outline_on {
	cursor:pointer;
}
div.googlepolygoneditor_map {
	height:300px;
	width:100%;
	background-color:#eeeeee;
	border:1px solid #cccccc;
	box-sizing:border-box;
}
div.googlepolygoneditor-editor {
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
	border:1px solid #cccccc;
	box-sizing:border-box;
	box-shadow:#0000004d 0px 1px 4px -1px;
}
div.googlepolygoneditor-editor .gm-custom-attribution {
	background-color:rgb(245, 245, 245, 0.7);
	box-sizing:border-box;
	color:rgb(0, 0, 0);
	direction:ltr;
	display:inline-block;
	font-family:Roboto, Arial, sans-serif;
	font-size:10px;
	height:14px;
	line-height:14px;
	padding:0 6px;
	position:relative;
	text-align:right;
	user-select:none;
	vertical-align:middle;
	white-space:nowrap;
}
div.googlepolygoneditor-editor .gm-style-mtc select {
	user-select:none;
	box-shadow:rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
	border-radius:2px;
	padding:10px;
	background-color:#fff;
	border:none;
	color:#000;
	font-family:Roboto, Arial, sans-serif;
	font-size:18px;
	font-weight:500;
}
div.googlepolygoneditor-editor .gm-style-mtc select option {
	padding:10px;
	color:#565656;
	font-size:18px;
	font-weight:400;
}
div.googlepolygoneditor-editor .custom-toolbar {
	margin:10px;
}
div.googlepolygoneditor-editor .custom-toolbar button,
div.googlepolygoneditor-editor .poly-info .action button {
	border:0px none;
	border-radius:2px;
	box-shadow:#0000004d 0px 1px 4px -1px;
	color:#565656;
	font-family:Roboto, Arial, sans-serif;
	font-size:16px;
	font-weight:400;
	padding:12px 16px;
}
div.googlepolygoneditor-editor .custom-toolbar button.icon-only,
div.googlepolygoneditor-editor .poly-info .action button.icon-only {
	padding:12px;
}
div.googlepolygoneditor-editor .custom-toolbar button.icon-only .icon-sprite,
div.googlepolygoneditor-editor .poly-info .action button.icon-only .icon-sprite {
	margin:0;
}
div.googlepolygoneditor-editor .custom-toolbar button {
	background-color:#ffffff;
}
div.googlepolygoneditor-editor .poly-info .action button {
	background-color:#f0f0f0;
}
div.googlepolygoneditor-editor .custom-toolbar button.active {
	color:#000000;
	font-weight:500;
}
div.googlepolygoneditor-editor .custom-toolbar button:hover,
div.googlepolygoneditor-editor .poly-info .action button:hover {
	color:#000000;
	background-color:#ebebeb;
}
div.googlepolygoneditor-editor .custom-toolbar button:focus-visible::-moz-focus-inner,
div.googlepolygoneditor-editor .poly-info .action button:focus-visible::-moz-focus-inner {
	border:0px none;
}

div.googlepolygoneditor-editor .icon-sprite {
	width:16px;
	height:15px;
	overflow:hidden;
	position:relative;
	float:left;
	margin-right:1ex;
}
div.googlepolygoneditor-editor .icon-sprite img {
	position:absolute;
	left:0px;
	user-select:none;
	border:0px none;
	padding:0px;
	margin:0px;
	max-width:none;
	width:16px;
	height:128px;
}
div.googlepolygoneditor-editor .icon-sprite img.edit {
	top:0px;
}
div.googlepolygoneditor-editor button.active .icon-sprite img.edit {
	top:-16px;
}
div.googlepolygoneditor-editor .icon-sprite img.create {
	top:-32px;
}
div.googlepolygoneditor-editor button.active .icon-sprite img.create {
	top:-48px;
}
div.googlepolygoneditor-editor .icon-sprite img.delete {
	top:-64px;
}
div.googlepolygoneditor-editor button:hover .icon-sprite img.delete {
	top:-80px;
}
div.googlepolygoneditor-editor .icon-sprite img.save {
	top:-112px;
}
div.googlepolygoneditor-editor button.active .icon-sprite img.save {
	top:-96px;
}
