.previewer {
	position: absolute;
    width: 100%;
    height: 100%;
    background: #202124;
    z-index: 100;
    color: #fff;
    display: none;
    flex-flow: column;
	top: 0;
}

.previewer_visible {
	display: flex;
}

.previewer__systembar {
    display: flex;
    flex-flow: row nowrap;
	justify-content: space-between;
    width: 100%;
	padding-top: 10px;
    position: absolute;
    width: 100%;
    background: #202124;
    z-index: 102;

}

.previewer__systembar-left {
    display: flex;
    flex-flow: row nowrap;
    margin-left: 10px;
	
}

.previewer__systembar-right {
    display: flex;
    flex-flow: row nowrap;
    margin-right: 10px;
}

.previewer__systembar-title {
	
}

.previewer__systembar-doctype {
	margin-left: 10px;
}

.previewer__systembar-filename {
	margin-left: 10px;
}

.previewer__systembar-files {
    display: flex;
    margin-left: 30px;
	align-items: center;
}

.previewer__systembar-close {
	margin-left: 30px;
}

.previewer__systembar-close a:link, .previewer__systembar-close a:visited, .previewer__systembar-close a:hover {
	color: #fff;
	text-decoration: none;
}

.previewer__arrow-left {
	background-image: url(/protected/assets/themes/modern/images/icons/left.svg);
	width: 16px;
	height: 16px;
	background-size: contain;
	filter: invert(1);
	cursor: pointer;
	
	margin-right: 5px;
}

.previewer__arrow-right {
	background-image: url(/protected/assets/themes/modern/images/icons/right.svg);
	width: 16px;
	height: 16px;
	background-size: contain;
	filter: invert(1);
	cursor: pointer;
	margin-left: 5px;
}

.previewer__current {
	
}

.previewer__input {
    width: 35px;
    border-radius: 4px;
    outline: none;
    border: none;
    margin-left: 3px;
    margin-right: 3px;
}

.previewer__divider {
	
}

.previewer__total {
	
}

.previewer__arrow-right {
	
}

.previewer__workspace {
	flex-grow: 1;
	display: flex;
    flex-flow: row nowrap;
	
	margin-top: 34px;
}

.previewer__column {
	display: flex;
    flex-flow: column nowrap;
	width: 100%;
}

.previewer__filebar {
	display: flex;
	flex-flow: row nowrap;
	padding: 5px;
	padding-left: 10px;
	
    position: absolute;
    background: #202124;
    width: 100%;
    z-index: 102;
	height: 24px;
}

.previewer__filebar-controls {
	display: flex;
	flex-flow: row nowrap;
    align-items: center;
	
	margin-left: 10px;
}

.previewer__filedata {
    height: 100%;
    flex-grow: 1;
    width: 100%;
	display: flex;
    background: #191919;
    z-index: 101;
}

.previewer__comments {
	width: 10%;
    color: #fff;
    background: #202124;
    padding: 5px;
    position: absolute;
    height: 100%;
    z-index: 102;
    margin-top: 34px;
}

.previewer__layout {
	flex-grow: 1;
	border-top: solid 1px #c0c0c0;
	cursor: pointer;
	overflow: hidden;
	width: 100%;
	position: absolute;
}

.previewer__content {
	width: 210mm;
	height: 297mm;
	background: #fff;
	background-size: contain;
	background-repeat: no-repeat;
}

.previewer__controls {
	width: 16px;
	height: 16px;
	filter: invert(1);
	cursor: pointer;
}

.previewer__controls_magnify {
	
}

.previewer__controls_minify {
	
}

.previewer__controls-input {
	width: 35px;
    border-radius: 4px;
    outline: none;
    border: none;
	margin-left: 3px;
	margin-right: 3px;
}

.previewer__comment_selected {
	border: solid 1px red;
}

.previewer__content-comment_selected {
	border: solid 1px red;
}

.previewer__controls_comment-delete {
	margin-left: 5px;
	margin-right: 7px;
	
	display: none;
}

.previewer__controls_comment-delete_active {
	display: block;
}

.previewer__controls_move {
	margin-left: 15px;
	margin-right: 5px;
}

.previewer__controls_select {
	margin-right: 15px;
}

.previewer__controls_move_active > img, .previewer__controls_select_active > img, .previewer__controls_approve_active > img, .previewer__controls_reject_active > img {
	border: solid 1px blue;
}

.previewer__controls_reject {
	margin-left: 5px;
}