* {font-family:inherit;outline:none;text-decoration:none;margin:0;padding:0;box-sizing:border-box;color:inherit;text-transform:inherit;border-width:0}
textarea {resize:none}

.zoom .zoom {zoom:100% !important}

@-moz-document url-prefix() {
 .zoom {width:1400px !important}
}

a, .select {cursor:pointer}
a:hover {
    opacity: 0.85;
}
body {background:#eaeaea;color:#231f20;overflow:hidden;font-family:'open sans'}

#listbar {background:#322f31;height:34px;position:fixed;padding:4px;line-height:22px;color:white;
		z-index:10;width: calc(100% - 670px);top:158px;border-bottom:4px solid #eaeaea;text-align:left;padding-left:10px;
}
#listq {position:absolute;right:4px;top:4px;line-height:22px;padding-left:8px;width:200px;color:#231f20}
#listplus {position:absolute;right:220px;top:3px;height:24px;width:24px;background:url('images/icon_plus.svg')}
#list {text-align:left}
/* #list li {width:100%}*/
#list .user, #list .group, #list .file, #list .product {background-color:#231f20;margin-bottom:8px;height:40px;width:100%;
		background-repeat:no-repeat;background-size:auto 90%;background-position:left 5px center;line-height:40px;color:white;
		text-align:left; padding-left:50px}
#list .user {background-image:url('images/user_wit_tegel.svg');}
#list .group {background-image:url('images/users_wit_tegel.svg');}
#list .product {padding-left:10px}

.noselect, .noselect * {	
	-webkit-touch-callout: none !important;
	-webkit-user-select: none !important;
	-khtml-user-select: none !important;
	-moz-user-select: none !important;
	-ms-user-select: none !important;
	user-select: none !important; }

body > div {margin:auto}
body > div > div {width:calc(100vw - 648px);display:inline-block;vertical-align:top;padding-left:20px}
body > div > div:first-child {width:250px;padding-left:40px;padding-right:0}
body > div > div:last-child {width:380px;padding-left:0;padding-right:0}

div.ssform {position:relative}

.l.dn {display:none !important}
.ql-editor {background:#e0e0e0}
div#top2 > div:last-child {padding-left:10px}

div#top1 {height:100px;background:#FBBC05}
div#top1 > div {height:100%;line-height:100px}
div#logo {background:#231f20;}
div#logo img {display:inline-block;height:36px;position:absolute;bottom:15px;left:15px}
div#logo div {color:white;position:absolute;top:0px;left:15px;line-height:1em;font-size:16px}

div.lng {position:absolute;right:100px;top:-20px}
div.lng div {margin-left:8px;vertical-align:middle;margin-top:-3px;margin-right:0}

form.login {padding-top:80px;text-transform:none}
form.login input {display:block;width:400px;height:50px;line-height:50px;background:#d1d3d3;margin:auto;margin-bottom:8px;border:0;font-size:16px;padding:0px 20px}
form.login input[type="submit"] {background:#969a9a;color:white;text-transform:uppercase;cursor:pointer}

#sitename {font-size:22px;padding-top:16px}
#sitename a.edit {background-image:url('images/icon_setting_row.svg');position:static;display:inline-block;vertical-align:middle}

#sitename button, #AGT {margin-right:15px;height:30px;padding:0px 10px;background-repeat:no-repeat;background-size:24px 24px;background-position:3px 3px;background-color:white}
#AGT {position:absolute; right:100px; top:55px;}

#logout {
	display:inline-block !important;vertical-align:bottom !important;margin-bottom:18px !important;height:32px !important;line-height:40px !important;text-transform:uppercase !important;font-style:italic !important;font-size:20px !important;padding-left:40px !important;
	background:url('images/icon_lock.svg') no-repeat left center !important;background-size:auto 40px !important;color:#231f20;font-family:'open sans' !important
}

div#top2 {height:50px;background:white;text-transform:uppercase;font-size:20px;font-weight:600;line-height:50px;margin-bottom:10px}
div#top3 {height:50px;background:#231f20;color:#969a9a;line-height:50px;margin-bottom:20px}
div#top3 > div.bold {color:white;font-weight:bold;text-transform:uppercase;font-size:18px}

div#top1, div#top2 {
	position:relative;z-index:1;
	-webkit-box-shadow: 0px 4px 5px -1px rgba(0,0,0,0.36);
	-moz-box-shadow: 0px 4px 5px -1px rgba(0,0,0,0.36);
	box-shadow: 0px 4px 5px -1px rgba(0,0,0,0.36);
}
div#top1 {z-index:2}
div#top2 > div {position:relative;height:100%}

ul.tabs {list-style:none;padding:0;margin:0;position:absolute;left:0;bottom:0;overflow:hidden;width:100%}
ul.tabs li {background:#b8b8b8;padding:10px 10px;font-size:14px;font-weight:normal;display:inline-block;color:white;cursor:pointer;line-height:1em;vertical-align:bottom;border-radius:4px 4px 0px 0px;position:relative;
		-webkit-box-shadow: 2px 1px 4px 0px rgba(0,0,0,0.45);
		-moz-box-shadow: 2px 4px 7px 0px rgba(0,0,0,0.45);
		box-shadow: 2px 4px 7px 0px rgba(0,0,0,0.45);
}
ul.tabs li.on {cursor:default;background:#231f20;}

div#pagetitle { color:#969a9a }

div#pages {padding:0;overflow-y: auto; overflow-x:hidden; height: calc(100vh - 150px);padding-top:8px;padding-right:5px;margin-top:-10px;background:#818284}
div#pages ul, div#articles {list-style:none;padding:0}

div#pages li {height:auto;margin-bottom:8px}
div#pages li > div, div#articles li > div {position:relative;background-color:#322f31;padding-left:20px;color:white;height:46px;line-height:46px;font-size:18px;font-weight:normal;white-space:nowrap}
div#pages li.offline > div::before {content:'';display:block;width:7px;height:7px;background:red;border-radius:3px;position:absolute;top:20px;left:7px}

div#articles li.img {width:33%;height:80px;display:inline-block;vertical-align:top;border-left:4px solid #d1d3d3;border-bottom:4px solid #d1d3d3;background:url('images/preview.png');background-repeat:repeat;margin-bottom:0}
div#articles li.img > div {background-color:transparent;height:100%;background-size:cover;background-position:center}

div.nodes ul ul {padding-left:15px !important}
div#pages ul ul a {shmargin-right:15px !important}
/*div#pages ul ul li {width:235px}*/
div.nodes ul ul ul {padding-left:15px !important}
div.nodes ul ul ul li {width:198px !important}
div.nodes ul ul li:first-child, div.nodes ul ul #ph0:first-child {margin-top:8px}

div.nodes li.has > div {background-image:url('images/driehoekje_wit_open.svg');background-repeat:no-repeat;background-size:14px auto;background-position:3px 20px}
div.nodes li.has.shut > div {background-image:url('images/driehoekje_wit_dicht.svg');background-position:2px 16px}
div.nodes li.shut > ul {display:none}

div.nodes .fold {position: absolute;left:0;top:0;width:24px;cursor:default;height:100%;}
div.nodes li.has .fold {cursor:pointer}

.add, .update, .back, .send, .stat {
	cursor:pointer;height:50px;display:block;padding-left:55px;background:#969a9a;color:white;text-transform:uppercase;line-height:50px;
	background-image:url('images/icon_plus.svg');background-position:left 5px top 5px;background-size:40px 40px;background-repeat:no-repeat;
	font-size:16px;
}

.src { width:40px;height:40px;display:inline-block;margin-left:8px;background:#969a9a url('images/icon_settings_#231f20.svg') center no-repeat; background-size:cover}

.update {background-image:url('images/icon_update.svg')}
.back {background-image:url('images/icon_back.svg')}
.send {background-image:url('images/icon_send.svg')}
.stat {background-image:url('images/icon_grafiek_vierkant.svg')}

#items {height:calc(100vh - 200px);padding-left:5px;padding-right:10px;overflow-y:auto;overflow-x:visible;margin-right:0px;padding-bottom:20px;text-align:center}
#edit {height:calc(100vh - 168px);overflow-y:scroll;overflow-x:hidden;padding-top:8px;margin-top:-8px}

/* alert even opruimen nog en met 2 classes werken bich */
#edit .add, #edit .update, #edit .back, #edit .send, #edit .stat {background-position:left 10px top 5px;padding-left:60px}

a.move, a.edit, a.view, e.del, a.custom, a.list, a.copy {z-index:500}
a.del {z-index:11}
a.copy {position:absolute;width:50px;height:50px;background:url('images/icon_copy.svg') center;background-size:contain;right:80px;top:0px;cursor:copy;display:none}
a.move {position:absolute;width:50px;height:50px;background:url('images/icon_move_white.svg') center;background-size:contain;right:40px;top:0px;cursor:move;display:none}
a.edit {position:absolute;width:50px;height:50px;background:url('images/icon_settings_white.svg') center;background-size:contain;right:0px;top:0px;cursor:pointer;display:none}
a.view {position:absolute;width:50px;height:50px;background:url('images/icon_preview.svg') center;background-size:contain;right:40px;top:0px;cursor:pointer}
a.list {position:absolute;width:50px;height:50px;background:url('images/list.svg') center;background-size:contain;right:80px;top:0px;cursor:pointer;display:none}
a.del {position:absolute;width:20px;height:20px;background:url('images/icon_delete.svg');background-size:contain;top:-6px;right:-6px;cursor:pointer;display:none;display:none}
a.custom {position:absolute;width:50px;height:50px;background:url('images/customize.svg') center no-repeat;background-size:65%;right:80px;top:0px;cursor:pointer;display:none}
a.header {position:absolute;width:50px;height:50px;background:url('images/icon_header.svg') center no-repeat;background-size:contain;right:8px;top:0px;cursor:pointer;display:none}
li:hover a.del, *:hover > a.custom, form.dropzone:hover a.del, li.row:hover div.tools, li:hover > div > div.tools, a.header, div.upload:hover a.del {display:inline-block}
div.upload {position:relative;min-height:100px;background:white;margin-bottom:8px}
div.upload input[type="file"] {width:200vw !important;top:0;left:-100vw;height:100% !important;position:absolute}
div#items li:hover a.move {right:0px}
div#items li a.move {/*background-image:url('images/icon_move.svg')*/left:0}
/*div#items li a.edit, div#footer a.edit {background-image:url('images/icon_settings_#231f20.svg')}*/
li:hover a.move, li:hover a.copy, li:hover a.list, div.tools {display:inline-block}
li:hover a.edit, #footer:hover a.edit {display:inline-block}
div.tools {zoom:100% !important;background:url('images/blackfade.png');opacity:0;transition:all 0.1s ease-out;position:absolute;width:100%;height:75px;max-height:100%;right:0;top:0;overflow:visible !important;z-index:1;text-align:right}
li.row:hover div.tools, div.tools:hover {opacity:100;transition:all 0.1s ease-in;}
/* #main.hover div.tools {display:none !important} nee want dan is editen van pagina om ergens te plakken niet mogelijk */
div.tools > a {display:inline-block;position:static !important;margin-top:-2px}
div.tools > a.del {position:absolute !important}
div.tools > a.move {right:auto;left:0px}
div.tools > h2 {position:absolute;left:50%;width:400px;margin-left:-200px;text-align:center;color:white;padding-top:4px;font-size:12px}
div.tools > a.add {background-color:transparent}
div.nodes div.tools, #articles div.tools {width:auto;background:url('images/blackhfade.png?v2') top left;padding-left:40px}
.etit {cursor: pointer;  position: absolute; top: 0; left: 25px; right: 0; overflow:hidden}

.eh:hover {box-shadow:0px 0px 1px 1px red inset;cursor:pointer}

#ph {display:none;border:3px solid #FBBC05;width:100%/*;border-radius:3px*/}
div#pages ul ul #ph {margin-left:15px}
#ph0 {display:none;border:1px dashed red;width:100%;margin-bottom:8px;vertical-align:top;min-height:50px}
/*div#items #ph0 {margin-bottom:0px}*/
#paste {z-index:100;position:absolute;background:#FBBC05;padding:3px 6px;color:white;display:none;width:auto;cursor:pointer;white-space:nowrap}
.putitin > div {background:#FBBC05 !important}

#additem {max-height:50px;background:white;overflow:hidden;transition:all 0.2s ease-out;position:relative}
#additem:hover {max-height:1500px;transition:all 0.2s ease-in}
#additem a {
	cursor:pointer;height:50px;display:block;padding-left:85px !important;text-transform:uppercase;line-height:50px;
	background-image:url('images/icon_plus.svg');background-position:left 35px top 5px;background-size:40px 40px;background-repeat:no-repeat;
	border-top:1px dashed #969a9a
}
#additem a:first-child {background-color:#969a9a;color:white;border:none}
#additem a.text {border:none}
div#items {margin-top:56px}
div#items > ul {list-style:none;padding:0}
div#items > ul > li {position:relative;min-height:50px;margin-bottom:8px;}
div#items > ul > li > ul {list-style:none}
div#items > ul > li > ul > li {background:#fff7;min-height:50px;overflow:hiddennomore}

#edit > div#articles {padding:0}
div#articles ul {list-style:none;padding:0}
div#articles ul li {position:relative;min-height:46px;margin-bottom:8px}
div#articles ul li span {display:block;white-space:nowrap;overflow:hidden;text-overflow: ellipsis;}
div#articles ul li > div {padding:0px 20px;overflow:hidden}

/* li.row {padding-left:40px} */

div.side {position:absolute;height:100%;left:0;top:0;background:#969a9a;width:30px}
div.side a.move {background-image:url('images/icon_move.svg');right:auto;left:0px;width:30px;top:50%;margin-top:-15px;height:30px;display:block}
div.side a.edit {display:none}

#title {width:100%;border:none;background:white;margin-bottom:8px;position:fixed;z-index:55;width: calc(100% - 660px);top:158px;border-bottom:8px solid #eaeaea}
#title input {height:50px;line-height:50px;display:block;border:none;background:white;padding-left:10px;font-size:18px;color:#231f20;font-weight:bold;width:100%}
#title input#q {width:200px;height:40px;position:absolute;right:50px;width:200px;top:4px;background:#d1d3d3;font-size:16px;line-height:40px}
#title a.edit, #additem a.edit {background-image:url('images/icon_setting_row.svg');display:block}

#edit > div {background:#d1d3d3;padding:10px;}
#edit a img {width:32px;height:32px;vertical-align:top;margin-right:4px}
#edit > div input, #edit > div textarea, #pop input {display:block;height:40px;line-height:22px;margin-bottom:8px;border:none;width:100%;padding:3px 6px;font-size:16px;padding-top:15px;}
#edit > div input.num {width:50px;display:inline-block;}
#edit > div input.color {width:80px;display:inline-block;text-transform:uppercase;text-align:center;padding:6px;height:auto}
#edit > div div.select {margin-bottom:8px;width:calc(100% - 48px)}
#edit > div div.select#select_f_view, #edit > div 
			div.select#select_f_page_id, #edit > 
			div div.select#select_f_imgpos,
			div div.select#select_f_theme {width:100%}
#edit > div div.select#select_f_format {width:158px}
#edit > div div.select#select_f_style {width:177px;margin-left:8px}
#edit > div textarea {line-height:24px;padding: 15px 3px 3px 3px}

form.dropzone > label.top {padding-right:0px !important}

#edit > div input:last-child, #edit > div textarea:last-child {margin-bottom:0}
#edit label {padding-right:8px}
label.top {    
	z-index:1;
	position: absolute;
    margin-top: 0px;
    color: gray;
    right: 5px; 
    font-size: 13px;
	padding-left:5px;padding-bottom:2px;
	pointer-events: none;
}
#edit div.split {
    background: none;
    width: calc(100% + 16px);
    margin: 0px -8px;
    margin-bottom: 8px;
    padding: 0px 4px;
}
#edit div.split > div {
    display: inline-block;
    position: relative;
    margin: 0px 4px;
	vertical-align:top
}
#edit div.half {   width: 50%; width: calc(50% - 8px); }
#edit div.third {   width: 33.33%; width: calc(33.33% - 8px); }
#edit div.tab label.top {
	rxight:18px;
}
#edit div.tab div.third label.top {right:0px}
#edit div.split div.select {width:100% !important;vertical-align:top;margin-bottom:0}

#edit > h2 {margin-bottom:10px;font-size:15px;color:#231f20;font-weight:bold}
#edit > h3 {font-weight: normal;color: #666; margin: 0; padding: 0; margin-bottom: 14px;}

form.dropzone {position:relative}

.dz-success-mark, .dz-error-mark, .dz_error-message, .dz-details {display:none;}

.dz-message div {background: white;margin-bottom: 8px;width: 100%;min-height: 103px;padding: 10px;color: #777;display:inline-block;text-align:center;vertical-align:top}
.dz-message em {font-weight:normal;color:#777;position:absolute;right:10px;top:10px;font-style:normal}
.dz-message img {max-width:100%;height:83px;vertical-align:top;background: url('images/preview.png') center}

.dz-message div.banner_id, .dz-message div.logo_id {width:100%;}
.dz-message div.download_id {width:100%;height:40px}

div.checkbox {display:inline-block; height:20px; width:20px; background:white; border:0; cursor:default; vertical-align:middle; overflow:hidden; margin-right:3px; cursor:pointer}
div.checkbox.on {background:white url('images/check.svg') center 60% no-repeat;background-size:75%}

#edit div.checkbox {margin-bottom:8px;margin-right:4px}
#edit #articles div.checkbox {margin-bottom:4px}

div.select {display:inline-block;height:40px;background:url('images/pulldn.png') no-repeat right 10px bottom 10px white;background-size:12px 7px;width:150px;box-sizing:border-box;position:relative}
div.select.open {background-image:url('images/pullup.png')}
div.select * {white-space:nowrap}
div.select > div:first-child {margin-right:30px;line-height:22px;padding-top:16px;height:40px;padding-left:5px;font-size:16px;overflow:hidden;}
div.select > div:last-child {position:absolute;width:auto;min-width:100%;top:40px;left:0px;display:none;z-index:10;max-height:220px !important;overflow-y:auto;}
div.select.open > div:last-child {display:block}
div.select > div div, div#auto div {background:#efefef;box-sizing:border-box;border-bottom:1px solid #e1e1e1;height:40px;line-height:40px;font-size:16px;color:#6a6a6a;padding:0px 20px;display:block;width:100%;white-space:nowrap}
div.select > div div:hover, div#auto div:hover {background:#fafafa;color:#000}
div.select hr {position:absolute;background:#999;width:6px;right:2px;border-radius:3px;border:0;display:none}

/* #edit label {vertical-align:top} */

.editor {background:white;min-height:50px}

input.boxsetup {position:absolute;width:25px !important;font-size:8pt !important;text-align:center !important;color:#231f20}

#footer {min-height:50px;height:auto}
/* transition:all 0.1s ease-out */
#overlay {background:rgba(0,0,0,0.8);display:none;position:fixed;width:100%;height:100%;z-index:100}
#overload {opacity:0;position:fixed;width:100%;height:100%;z-index:100;background:url('images/load.gif') no-repeat center;display:none;background-size:80px 80px;background-color:rgba(0,0,0,0.5);;transition: all 4s linear 4s;}
#overload.on {display:block;opacity:1;transition: all 4s linear 4s;}
#overlib {left:5%;position:fixed;height:90%;top:5%;width:calc(95% - 400px);background:white;display:none;padding:40px;z-index:100}
#overlay iframe {width:600px;height:600px;left:50%;top:50%;margin-left:-300px;margin-top:-300px;position:absolute;border:none;background:white}
#overlay iframe.wide {width:1000px;margin-left:-500px}

.croplink {background:url('images/icon_crop.svg') no-repeat;padding-left:50px;line-height:40px;height:40px;display:block;margin-bottom:8px;color:#231f20;font-size:16px}

#pop {width:600px;height:400px;position:fixed;top:40%;margin-top:-200px;left:50%;margin-left:-300px;background:#d1d3d3;padding:40px}
a.btn {background:#969a9a;display:inline-block;padding:0px 60px;height:50px;line-height:50px;color:white;text-transform:uppercase}

.field {display:inline-block;position:relative;margin-bottom:8px}
#edit div.tab div.field label.top {right:0px}

.mid {position:relative}

/* .zoom {overflow:hidden} */
#top.zoom {overflow:visible}

.contact {background:white;color:#8c8c8c;line-height:50px;padding-left:10px}

body.pasteValid .tools {display:none !important}

#rowlink {width: 1000px; zoom: 30%; display: inline-block; background: white; position:absolute; right:100px;top:100px;max-height:85%;overflow-x:hidden;overflow-y:auto}
.rowlink {cursor:pointer}
.rowlink:hover {opacity:0.9}
.rowlink.selected {border:10px solid white}

div.tabs > div {display:inline-block;margin-right:5px;line-height:32px;cursor:pointer;padding:0px 10px;}
div.tabs > div.on {background:#b3b7b8;color:white;cursor:default}
div.tab {background:#b3b7b8;padding:8px;position:relative}

div.subtabs > div {display:inline-block;line-height:32px;padding:0px 10px;color:white;cursor:pointer}
div.subtabs > div.on {background:#d1d3d3;cursor:default;color:#231f20}
div.subtab {background:#d1d3d3;padding:8px 8px 0px 8px;position:relative;}

div.upload img {max-width:100%}

button#closePicker {width:24px;height:24px;position:absolute;right:40px;top:250px;background:url('images/icon_form.svg') center no-repeat;background-size:contain}

.overcut {position:absolute;background:rgba(0,0,0,0.6)}