/* Zinnebeeld font definition */
/* Edited by Remco, to the end of file
Added createdmodified, no-break and compact
Added styling for tree levels
*/

body{
	padding-top: 40px;
	padding-bottom: 40px;
}
.fl{
	float: left;
}
.fr{
	float: right;
}
.fc{
	clear: both;
}
.hide{
	display: none;
}

.btn{
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	background-image: -webkit-linear-gradient(top, #f5f5f5, #f1f1f1);
	background-image: -ms-linear-gradient(top, #f5f5f5, #f1f1f1);
	background-image: -moz-linear-gradient(top, #f5f5f5, #f1f1f1);
	background-image: -o-linear-gradient(top, #f5f5f5, #f1f1f1);
	background-image: linear-gradient(top, #f5f5f5, #f1f1f1);
	border: 1px solid #dcdcdc;
	color: #444;
	text-shadow: none;
}
.btn:hover{
	background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
	border: 1px solid #c6c6c6;
	color: #333;
	background-position: 0 0;
	text-shadow: none;
}
.btn.active, .btn:active{
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	border-color: #888;
	background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
	background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
}
.btn-group .btn:first-child{
	-webkit-border-top-left-radius: 2px;
	-moz-border-radius-topleft: 2px;
	border-top-left-radius: 2px;
	-webkit-border-bottom-left-radius: 2px;
	-moz-border-radius-bottomleft: 2px;
	border-bottom-left-radius: 2px;
}
.btn-group .btn:last-child, .btn-group .dropdown-toggle{
	-webkit-border-top-right-radius: 2px;
	-moz-border-radius-topright: 2px;
	border-top-right-radius: 2px;
	-webkit-border-bottom-right-radius: 2px;
	-moz-border-radius-bottomright: 2px;
	border-bottom-right-radius: 2px;
}
div.field-delete {
	text-align: center;
}
div.field-delete .btn {
	padding: 0 12px 4px 8px;
	border-width: 0;
	background-color: transparent;
}
div.field-delete .btn:hover {
	background-color: transparent;
}
/* search, will probably rebuild this */
.typeahead{
	z-index: 1031;
}
.sidebar-nav{
	margin-left: -15px;
}
.brand{
	font-family: 'Arial';
	font-weight: strong;	
}
.navbar .brand{
	margin-bottom: -2px;
	margin-top: 2px;
}
/* navigation */
.navbar-inner{
	background-color: #D71920;
	background-image:none;
}
.navbar .nav > li > a,
.navbar .navbar-text,
.navbar .navbar-text a{
	color:#fff;
	font-family: 'Arial';
}
body.bigbrands .navbar-inner{
	background-color: #e0f1f1;
	background-image:none;
}
body.bigbrands .navbar .brand {
	color:#000;
/*	background-image: url('/cms4/local/gfx/bb-logo.svg');*/
}
body.bigbrands .navbar .dropdown a, body.bigbrands .navbar .dropdown a:hover {
	color:#000;
}
body.bigbrands .navbar .dropdown a:after, body.bigbrands .navbar .dropdown a.dropdown-toggle:hover:after {
	content: '>';
}
.nav > li > a:hover{
	background-color: #f5f5f5;
}
.nav-list .active > a,
.nav-list .active > a:hover{
	background-color: #eee;
	color: #D71920;
	text-shadow: none;
	font-family: 'Arial';
	font-weight: strong;
}
.nav > li > a{
	color: #333333;
	font-family: 'Arial';
}
.navbar-search{
	margin: 5px 0 0 20px;
}

.navbar-form, 
.navbar-search{
	border-bottom: none !important;
	border-top: none !important;	
}

.nav .icon-home{
	padding-right: 10px;
}

.navbar .btn{
	margin:-5px -5px -2px 10px;
	margin-left: 10px;
}
.navbar .btn:hover{
	background-color: #000;
}

.dropdown.open{
	background: #333;
}
.dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover{
	color: #D71920;
	background: #eee;
}
.page-header{
	margin-top: 0;
	padding: 0px 0px 15px 25px;
	margin-left: -25px;
}
.page-header h2{
	line-height: 100%;
}

/* --------------- FORMS -------------------- */

/* aligning save buttons */
.page-details button{
	margin-right: 10px;
}

.unlocked .icon-lock{
	background-position: -264px -24px;
}


/* login screen */

.body-login {
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: #f5f5f5;
}
.body-login .brand{
	text-align: center;
	color: #D71920;
	margin-bottom: 30px;
	font-size: 24px;
}

.form-signin {
	max-width: 300px;
	min-width: 230px;
	padding: 19px 29px 29px;
	margin: 0 auto 20px;
	background-color: #fff;
	border: 1px solid #e5e5e5;
	-webkit-border-radius: 5px;
	   -moz-border-radius: 5px;
	        border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	   -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	        box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.form-signin .form-signin-heading {
	margin-bottom: 10px;
}
.form-signin input[type="text"],
.form-signin input[type="password"] {
	font-size: 16px;
	height: auto;
	margin-bottom: 15px;
	padding: 7px 9px;
	width: 100%;
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.form-signin label.checkbox{
	margin: 5px 0 0 15px;
	color: #999;
}
.form-signin label.error{
	font-size: inherit;
	margin-top: -10px;
	margin-bottom: 10px;
}
a.toggle-signin{
	margin-top: 20px;
	margin-bottom: -10px;
	display: block;
}
.form-signin button.close{
	margin-right: -15px;
	margin-top: -10px;
}

/* -------------- table ------------------- */
/* table nav */
.table-nav{
	margin-bottom: 15px;
}
.table-nav select{
	margin-bottom: 0;
}
.actions{
	display: inline;
	margin: 0;
}
.actions.hide{
	display: none;
}
.actions > li{
	display: inline-block;
	list-style: none;
	margin-right: 10px;
	float: left;
}
.actions li.items-selected-dependent{
	display: none;
}
.actions.items-selected li.items-selected-dependent{
	display: inline-block;
}

/* table general */
.table-parent{
	margin:0 0 30px;
	overflow: hidden;
}
.table th, .table td{
	background: #fff;	
	padding: 7px;
}
.table td p{
	margin: 0;
}
.table td a, .table td a:hover{
	color: #000;
	text-decoration: none;
}
.table{
	border-bottom: 1px solid #ddd;
}
.table tbody tr.item:hover td, .table tbody tr.item:hover th{
	background: #fff;
}
.table tbody tr.clickable td, .table tbody tr.clickable th{
	background: #fafafa;
}
.table tbody tr.clickable:hover td, .table tbody tr.clickable:hover th{
	background: #f5f5f5;
	cursor: pointer;
}
.table tbody tr.selected td{
	background: #E7F5FC;
}
.table tbody tr.selected:hover td{
	background: #DCF3FF;
}

/* table pagetree */
.zortable .table{
	border-collapse: separate;
}
.zortable-active tr td{
	border-top: none;
}
.parent-indent{
	display: block;
	content: "";
	width: 21px;
	height: 0;
	background: #fff;
	margin-top: 8px;
	margin-bottom: -8px;
	margin-left: -8px;
}
.inbetween td, .table tbody tr.inbetween:hover td{
	background: #ddd;
	padding-top: 0;
	padding-bottom: 0;
}
.inbetween td span, .inbetween.inbelow:last-child td span{
	height: 1px;
	display: block;
}
.inbetween.inbelow td{
	background: none;
}
.inbetween td.hover, .table tbody tr.hover td, .inbetween td.revert-to-me{
	background: #E9FFC2;
}
.table .cloned{
	display: none;
}
.zortable .table table.ui-draggable-dragging{
	border-collapse: separate;
}
.ui-droppable-disabled{
	opacity: 0.3;
}

/* table 10 levels deep */

tr td:first-child{
	border-left: 0 solid #fff;
}
tr.level-1 td:first-child{
	border-left-width: 56px
}
tr.level-2 td:first-child{
	border-left-width: 100px
}
tr.level-3 td:first-child{
	border-left-width: 150px
}
tr.level-4 td:first-child{
	border-left-width: 80px
}
tr.level-5 td:first-child{
	border-left-width: 100px
}
tr.level-6 td:first-child{
	border-left-width: 120px
}
tr.level-7 td:first-child{
	border-left-width: 140px
}
tr.level-8 td:first-child{
	border-left-width: 160px
}
tr.level-9 td:first-child{
	border-left-width: 180px
}
tr.level-10 td:first-child{
	border-left-width: 200px
}

/* quick edit in table */



/*-------------- controls ---------------------*/

.controls-front .item-select-label{
	display: block;
	float: left;
	padding-right: 10px;
	padding-left: 3px;
	margin: 0;
}
.controls-front .handle{
	width: 4px;
	display: block;
	margin: -3px 0 -7px -7px;
	cursor: move;
	cursor: url(/global4/gfx/openhand.cur) 7 5, default;
	padding: 2px 2px 0;
	float: left;
	opacity: 0.4;
}
.sortable:hover .controls-front .handle{
	opacity: 1;
}
.controls-front .handle span{
	border-top: 1px solid #aaa;
	margin-bottom: 2px;
	display: block;
}

/* table reload */

.table-parent.loading table tbody{
	opacity: 0.3;
}
.table-parent.loading table thead th:last-child{
	background-image: url(/global4/gfx/table-preloader.gif);
	background-repeat: no-repeat;
	background-position: right 8px;
}

/* table sort */
.sort{
	cursor: pointer;
}
.sort:hover{
	background-color: #fafafa;
}
.sort .icon-flexible{
	margin: 1px 0 0 5px;
	background-position: 0 -142px;
}
.sort.asc .icon-flexible{
	background-position: -288px -120px;
}
.sort.desc .icon-flexible{
	background-position: -313px -119px;
}
.sort:hover a{
	text-decoration: none;
	color: #005580;
}

/* basic layout */

.content-menu{
	width: 175px;
	float: left;
	padding-top: 20px;
}
.content-form{
	margin-left: 175px;
	padding-left: 25px;
	padding-top: 20px;
	position: relative;
	border-left: 1px solid rgba(0, 0, 0, 0.05);
}
.content-form.with-form-right{
	padding-right:300px;
}
.form-right{
	width: 275px;
	position: absolute;
	top: 20px;
	right: 0;
}
.affix-container.affix{
	position: fixed;
	top: 60px;
	width: 275px;
}
/* form styling */

.text-max{
	max-width: 600px;
}
.input-append input, .input-append .uneditable-input{
	border-radius: 3px;
}
.input-append .add-on{
	margin-left: -28px;
	z-index: 3;
	position: relative;
}
.control-group.error > label, .control-group.error .help-block, .control-group.error .help-inline, label.error{
	color: #FE5A55;
}
.control-group.error input, .control-group.error select, .control-group.error textarea{
	border-color: #FE5A55;
	color: #FE5A55;
}
textarea.tinymce{
	height: 350px;
}
label.error{
	margin-top: 2px;
	font-size: 10px;
}
.overlay{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: #fff url(/global4/gfx/save-preloader.gif) center center no-repeat;
}
/* bootstrap aanpassingen */

.nav-tabs > li > a{
	background: #f5f5f5;
	border-bottom: 1px solid #ddd;
}



/* filter */
.trigger{
	display: block;
}
.filters{
	display: none;
	padding: 10px 0 0 10px;
}
.filters.active{
	display: block;
}
.filters input{
	margin-right: 10px;
}
/*
.filters .chzn-choices{
	height:80px !important;
	overflow-y: scroll;
}
*/

.filter .chzn-results{
	width:218px;

}

.filters .chzn-container {
    font-size: 13px;
    margin-bottom: 10px;
}

/* responsiveness */

/* max width */
.container-fluid{
	max-width: 1440px;
	margin: 0 auto;
	padding-left: 15px;
	padding-right: 15px;
}


.nav > li > a {
    display: block;
    font-size: 13px;
    line-height: 23px;
}

@media (max-width: 24em) {
	.new-page{
		 margin-top: 10px;
	}
}

/* 480px */
@media (max-width: 36.923em) {
	.table tbody tr {
	    vertical-align: top;
	}
	.filters{
		display: none;
		padding: 0;
	}
	.filters #filter_project_id {
		width:218px;
	}
	.actions li{
		display:block;
		margin-bottom: 10px;
	}

}
/* breakpoint 767px */
@media (max-width: 59em) {


}

/*breakpoint 768px / 979px*/
@media (min-width: 59.077em) and (max-width: 75.308em) {
	.content-form.with-form-right{
		padding-right: 0;
	}
	.form-right, .affix-container.affix{
		position: relative;
		width: 100%;
	}
	
	
/*
	.content-form p{
		overflow:hidden;
		text-overflow: ellipsis;
		border:solid 1px;
		height:20px;
	}
*/

}
.menu-link{
	display: none;
}

/*breakpoint 800px*/
@media (max-width: 61.538em) {    

	.menu-link{
		display: block;
	}
	.nav .nav-header {
	    clear: left;
	    float: left;
	    margin-right: 0;
	    padding-bottom: 1px;
	    width: 100%;
    }
    .btn-navbar {
	    margin-top: 5px !important;
    }
    .navbar .nav > li > a,
    .navbar .dropdown-menu a{
	    color:#fff !important;
    }
	/* everything under each other */
	.content-menu, .content-form, .content-form.with-form-right, .form-right{
		width: 100%;
		margin:0;
		padding:0;
		position: relative;
		float: none;
	}
	 .affix-container.affix{
		 width: 100%;
		 position: relative;
		 top: auto;
	 }
	/* navigation for mobile */
	.nav .nav-header{
		float: left;
		clear: left;
		margin-right: 0;
		padding-bottom: 1px;
	}
	.nav li + .nav-header{
		margin-top: 0;
	}
	.nav > li > a{
		display: inline-block;
	}
	.nav-list > li{
		width: 100%;
	}
	.nav-list > li > a{
		margin-right: 5px;
		margin-left: 0;
		padding: 2px 0;
	}
	.nav-list .active > a, .nav-list .active > a:hover, .nav > li > a:hover{
		color: #000;
		background: none;
		text-shadow: none;
	}
	.nav:before, .nav:after{
		content: "";
		display: table;
	}
	.nav:after{
		clear: both;
	}
	.table-parent {
/*
    border: 1px solid;
    display: block;
    overflow-x: auto;
    position: relative;
    white-space: nowrap;
    max-width: 760px;
    width: 100%;
*/
    }
    .content-menu{
	    position: relative;
	    z-index: 1000;
    }
    .content-menu,
    .content-form{
	    width:50%;
	    float: left;
    }
    
    
}
@media (min-width: 980px) {
}
@media (min-width: 1200px) {
}
/* experimental by remco */
tr.summary td {
	background-color: #ffffc0;
}
.form_overlay{
	position: fixed;
	top: 10%;
	left: 10%;
	width: 80%;
	height: 80%;
	z-index: 9999;
	background-color: #f0f0f0;
	border: 4px solid gray;
	overflow: auto;
}

/* Edited by Remco
Added indents for table headers
Added createdmodified, no-break and compact
Added styling for tree levels
Added indicators for hidden and deleted
*/
th.controls-front.indent-checkbox{
	padding-left: 34px;
}
th.controls-front.indent-sortable{
	padding-left: 28px;
}
th.controls-front.indent-checkbox.indent-sortable{
	padding-left: 50px;
}
tr.summary td.controls-front.indent-checkbox{
	padding-left: 8px;
}
.control-group.no-break{
	width: auto;
	float: left;
}
.control-group.no-break div.controls{
}
.control-group div.controls p{
	padding-top: 5px;
	margin-left: 0;
}
.control-group div.controls label[class=checkbox]{
	padding-top: 5px;
}
.control-group.createdmodified, .control-group.createdmodified label{
	color: grey;
	margin-top:0;
	margin-bottom:0;
}
.control-group.createdmodified .span2 {
	width: 110px;
}
.control-group.compact * {
	width: auto;
	margin-right: 0;
}
.control-group.compact .controls *{
	margin-left: 6px;
}
.hidden-indicator, .deleted-indicator, .invisible-indicator{
	color: #aaa;
}
.control-group.progress{
	background-color: default;
	height: auto;
	box-shadow: 0;
	overflow: auto;
}
.form-title{
	font-size: 12px;
}
#button_newitem{
	margin-top: 4px;
}
hr{
	border-color:#aaaaaa;
	border-style:solid;
}
pre{
	white-space: pre-wrap;
	word-break: normal;
}
tr td div.field-visible {
	text-align: center;
}
tr.level-1 th {
	font-weight: normal;
	font-style: italic;
}
span.decimal {
	width: 60px;
	display: inline-block;
	margin-right: 0;
	margin-left: auto;
	padding-right: 0;
	text-align: right;
}
ul.nav-list li.level-2 {
	margin-left: 20px;
	list-style-type: none;
    list-style-position: outside;
    list-style-image: none;
}
body.bigbrands b.caret {
	display: none;
}
div.control-group.no-break-before {
	display: inline;
}
div.control-group.no-break-before div.controls {
	display: inline;
	margin-left: 6px;
}
div.control-group.no-break-before label {
	display: none;
}
div.bb_address__type_id select {
	width: 148px;
}
span.span1 {
	width: 40px;
}
input[type="text"], input[type="password"], textarea {
	color: #000;
}