/** ------------------------------------------------------------------------------------------------------------------- *
	atb.css: Layout of the main atb site.  It is divided into the following sections:	
		* Page Layout: the global element element blocks that compose all page structures (logged/public)
		* mainContent: Global styles for all content pages, including the toolbar and the pagecontent
		* Icons: CSS-controlled images used as icons

		Copyright (c) 2012-Present - agileKaizen, Ltd., all rights reserved. http://agileKaizen.com

 ** ------------------------------------------------------------------------------------------------------------------- */
html {height:100%;}
body {height:100%; width:100%; color:#474747;}
body.unauthenticated {padding-top:4rem;}

.footer 	 	{font-size:0.9rem;}
.navbar-footer {font-size:12px;}
	.poweredBy {font-size:11px}

.dock {position:absolute; top:0; bottom:0; left:0; right:0;}
.btn-close {float:right;}


/* ============================== navbar ============================== */
.navbar-default {}
	.navbar-default .nav-link {display:flex; align-items:center; text-decoration:none; font-weight:bolder; height:50px;}
	.navbar-default .nav-link > i {font-size:24px;}
	.navbar-default .nav-link:hover, .navbar-default .nav-link:focus {transition:all 0.2s ease-in;}
	.navbar-default .nav-avatar {padding:0;}
	.navbar-default .nav-item > a.btn {margin-top:5px;}
	.navbar-default .navbar-brand {display:flex; align-self:center;}
	.navbar-default .navbar-nav {align-items:center}

.navbar-footer {flex-shrink:0; min-height:26px; font-size:12px; padding:0 10px;}
	.poweredBy {position:relative; right:10px; font-size:11px}

.idCard {margin:0px; padding:0px; border-radius:10px; box-shadow:0px 4px 8px #CCC; border:1px solid #e5e5e5;}
	#idCard {width:345px;}
	.img-empty {font-size:34px}
	.img-empty72 {font-size:72px}
	.img-empty64 {font-size:64px}
	.img-empty46 {font-size:46px}
	.img-empty38 {font-size:38px}
	.idCard .card-footer {border-radius:0 0 10px 10px;}


/* ============================== Drawer ============================== */
.drawer {position:fixed; left:-240px; width:240px; top:0px; bottom:0px; z-index:3;}
	.drawer {-webkit-transition:all 0.25s ease; -moz-transition:all 0.25s ease; -o-transition:all 0.25s ease; transition:all 0.25s ease;}
	.dock.open .drawer {transform:translate3d(100%, 0px, 0px);}
	.drawer-header {height:0px;}
	.drawer-header .context-title {position:absolute; display:flex; flex-direction:column; align-items:center; justify-content:center; left:58px; width:124px; height:55px; text-align:center; vertical-align:middle; cursor:pointer;}
	
	.drawer-body {position:absolute; top:60px; bottom:0px; padding-bottom:0; overflow-y:auto; overflow-x:hidden; width:100%;}
		.drawer-subHeader + .drawer-body, .drawer-subHeader + div .drawer-body {top:100px;}

.drawer-logo {height:60px; margin-left:1.15rem;}

.drawer-toggle {position:fixed; top:2px; left:5px; padding:1rem 0.5rem; z-index:1021;}
	.drawer-toggle i {font-size:24px; font-weight:bolder; color:rgba(35,55,82,1);}
	.dock.open .drawer-toggle {left:190px;}
	.dock.open .drawer-toggle i {color:rgba(255,255,255,0.5);}

.context-menu {width:100%; padding:0; position:fixed; right:0; bottom:0; left:0; align-self:center;}
	.context-menu .nav-item {display:flex}
	.context-menu .item-row {display:flex; align-items:center; min-height:42px; margin:0 1rem; cursor:pointer;}

	.context-menu > .menu-item .item-name {width:100%; padding:6px 0px; padding-left:1rem; font-size:14px;}
	
	.context-menu > .menu-item .item-icon {width:60px; padding-left:1.25rem; font-size:19px; opacity:.5;}
	.context-menu > .menu-item .item-icon + .item-name {padding-left:.25rem;}
	
	.context-menu > .menu-item .item-action {position:absolute; display:none; top:2px; right:10px; height:44px; width:44px; border-radius:50%;}
	.context-menu > .menu-item .item-action i {font-size:22px;}
	.context-menu > .menu-item:hover .item-action {display:flex; align-items:center; justify-content:center;}

	.context-menu ul.item-options {list-style:none; margin:0; padding:0 0 .5rem 30px;}
	.context-menu ul.item-options li {min-height:24px; padding-left:26px; background:url(../../images/tree/node.png) no-repeat 0 -2px; cursor:pointer; font-weight:100;}
	.context-menu ul.item-options li:last-child {background:url(../../images/tree/lastnode.png) no-repeat 0 -116px;}

	.context-menu .item-row-separator {position:relative; display:inline-flex; width:238px; height:1em;}	


/* ============================== Main Panel ============================== */
.subNav, .centerPanel, .rightPanel, .alert {-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.mainContent {display:flex; display:-ms-flexbox; flex-direction:column; -ms-flex-direction:column; flex-grow:1; -ms-flex-positive:1; top:55px;}

.breadcrumb {padding:0; margin-bottom:1rem; background-color:transparent;}
	.breadcrumb-item + .breadcrumb-item::before {content:">"; font-weight:600;}
	.breadcrumb-item {font-weight:600;}
	.breadcrumb-item.active {font-weight:400;}

.subNav	{position:fixed; top:0px; height:60px; padding-top:10px; z-index:3; left:230px; right:300px; margin-left:3em; white-space:nowrap;
	margin-left:.5rem; margin-right:0; padding-left:.25rem; padding-right:0; z-index:1030;}
	.dock.open .subNav {margin-left:0px}
	body.welcome .subNav {left:0px;}
	.subNav .nav-link {margin:0 .25rem; padding:.5rem .75rem;}
	.subNav .nav-separator {margin-left:auto !important;}
	.subNav a.btn {height:42px; padding:.5rem .75rem;}
	.subNav .input-group {height:42px;}
	
	.subNav .nav > li.nav-toggle {display:table; height:42px;}
		.subNav .nav > li.nav-toggle span, .subNav .nav > li.nav-toggle i {display:table-cell;  vertical-align:middle;}
		.subNav .nav > li.nav-toggle .nav-toggle-on, .subNav .nav > li.nav-toggle .nav-toggle-off {font-size:14px;}
		.subNav .nav > li.nav-toggle .nav-toggle-on {padding-left:4px; }

	.subNav .entity-menu {}
		.subNav .nav-link.nav-icon {padding:.5rem}
		.subNav .nav-link.nav-icon > i {font-size:25px;}

.subNav, .mainPanel, .subNav {min-width:320px}
.dock.open .mainPanel, .dock.open .subNav {margin-left:240px;}

.nav-tabs-subNav {position:-webkit-sticky; position:sticky; top:50px; z-index:950; margin-top:.5rem; margin-left:-.5rem; margin-right:-.5rem; padding-left:.5rem; padding-right:.5rem; background-color:rgb(var(--background-color)); border-bottom:none;}
	.nav-tabs-subNav .nav-link.nav-icon {font-size:1.5rem; padding:.3rem .5rem;}
	.nav-tabs-subNav .nav-link.nav-icon:hover,
	.nav-tabs-subNav .nav-link.nav-icon.active {font-size:1.75rem; padding:.2rem .325rem;} /* font-size:1.5rem; padding:.585rem; */


.centerPanel {flex:1 0 auto; margin-top:65px;}
	body.feedback .centerPanel {padding-right:15px;}
	
.contentPanel {	border:1px solid #e5e5e5; margin-bottom:1.5rem;
				border-radius:.25rem; -webkit-border-radius:.25rem; -moz-border-radius:.25rem; -ms-border-radius:.25rem; -o-border-radius:.25rem;}

.entity-toolbar {padding:1rem 0; position:relative; min-height:48px;}
	.entity-toolbar .nav-pills li.nav-item {margin-right:.5rem;}

	.entity-toolbar .nav-link {padding:.5rem .75rem; text-decoration:none;}
	.entity-toolbar .nav-link.btn {border:1px solid;}
	.entity-toolbar .nav-link.btn-link {border:none;}
	.entity-toolbar .nav-link.active, .viewPad .card-header-tabs .nav-link.active {font-weight:bolder;}

	.entity-toolbar.px-0 .nav-tabs li.nav-item:first-child {margin-left:1em;}
	.entity-toolbar .nav-tabs li.nav-item:first-child .nav-link,
	.entity-toolbar .nav-pills li.nav-item:first-child a {margin-left:0px;}

	.entity-toolbar .nav-link.nav-icon {font-size:1.5rem; padding:.325rem .5rem;}
	.entity-toolbar .nav-link.nav-icon:hover,
	.entity-toolbar .nav-link.nav-icon.active {font-size:1.75rem; padding:.2rem .325rem;} /* font-size:1.5rem; padding:.585rem; */
	
	/* Special cases */
	.entity-toolbar .input-group-text {padding-top:.375rem;}
	.contentPanel .entity-toolbar {padding-top:.5rem;}
	.rightPanel .entity-toolbar {padding:1rem;}

.entity-menu {}
	.entity-menu .nav-link.nav-icon {font-size:1.5rem; padding:.6rem 1.2rem;}
	.entity-menu .nav-link.nav-icon:hover,
	.entity-menu .nav-link.nav-icon.active {font-size:1.75rem; padding:.5rem 1rem;}

.entity-actions-footer {position:fixed; top:7.25rem; right:1rem; z-index:2;}
	.entity-actions-footer .nav-link {}
	.entity-actions-footer .nav-link.nav-icon {font-size:1.5rem; padding:.55rem .75rem;}
	.entity-actions-footer .nav-link.nav-icon:hover,
	.entity-actions-footer .nav-link.nav-icon.active {font-size:1.75rem; padding:.45rem .6rem;} /* font-size:1.5rem; padding:.585rem; */
	
.nav-pills-right {position:absolute; right:.5rem; vertical-align:middle;}
	.nav-pills-right {top:.45rem;}
	.card-header .nav-pills-right {top:.3rem;}

.card-header {}
	.card-header .nav-pills-right .nav-link.nav-icon {font-size:1.25rem; padding:.75rem;}
	.card-header .nav-pills-right .nav-link.nav-icon:hover,
	.card-header .nav-pills-right .nav-link.nav-icon.active {font-size:1.75rem; padding:.5rem .4rem;} /* font-size:1.5rem; padding:.585rem; */


/* Responsive tabs */
	.tabs-responsive {flex-wrap:nowrap !important; -ms-flex-wrap:nowrap !important; overflow:auto !important; -ms-overflow-style:none; margin-bottom:-0.81rem;}
	.tabs-responsive::-webkit-scrollbar {display:none;}
	.tabs-responsive a.nav-link {white-space:nowrap;}
	.tabs-responsive .nav-item {margin-bottom:0px;}
	
	.nav.nav-pills.nav-pills-right + .tabs-responsive {margin-right:2.5rem;}
	
.entity-toolbar.tabs-responsive {display:flex; overflow-x:auto !important; justify-content:space-between; align-items:flex-end; padding-bottom:0; margin-bottom:1rem; border-bottom:1px solid #dee2e6;}
	.entity-toolbar.tabs-responsive .nav {flex-wrap:nowrap;}
	.entity-toolbar.tabs-responsive .nav-tabs-line {padding-top:.5rem; border-bottom:none;}
	.entity-toolbar.tabs-responsive .nav-pills-right {position:unset; margin-left:1rem;}	


.nav-tabs .nav-link {text-decoration:none;}

/*  */
.entity-block {padding-left:1rem; padding-right:1rem; margin-left:0rem; margin-bottom:1rem;}


/* ============================ Resource Viewer =========================== */
.resource-viewer {display:-ms-flexbox; display:flex; -ms-flex-direction:column !important; flex-direction:column !important;
				position:absolute; z-index:1031; top:0; bottom:0; left:0; right:0; background:#FFFFFF;}


/* ============================== appPanel ============================== */
.appPanel {height:calc(100vh - 150px); overflow:auto; margin-left:0; margin-right:0;}

.sidebar {padding:1rem 0 1rem 1rem; border-right:1px solid #e4e9f0;}
	.sidebar::-webkit-scrollbar {width:0px;}
	.sidebar .sidebar-item:hover {cursor:pointer;}

.viewPad {padding-left:0; padding-right:0;}


/* ============================== rightPanel ============================== */
.rightPanel {position:fixed; top:0px; bottom:0px; z-index:1031; width:100%; right:0; transform:translateX(100%); background:#fff; border-left:1px solid #dddddd;}
	.rightPanel-body {position:fixed; top:4.25rem; bottom:66px; overflow-y:auto; overflow-x:hidden; width:100%; padding:0 1rem;}

	.rightPanel-footer {position:absolute; display:flex; justify-content:space-between; flex-direction:row-reverse; align-items:center; bottom:0px; height:66px; width:100%; white-space:nowrap;}
		.rightPanel-footer .entity-toolbar {align-self:flex-end; padding:.5rem 1rem;}
		.rightPanel-footer .entity-toolbar ul.nav {flex-direction:row-reverse;} 
		.rightPanel-footer .form-actions {padding:0px}
		
	.mainPanel.open .rightPanel, .rightPanel.open {transform:translateX(0%);}


/* ============================== form-landscape ============================== */
/* 	form vertical (for double column layouts)  */
.form-landscape {}
	.form-landscape .form-panel {position:relative; float:left; width:50%; min-height:1px; padding-left:10px; margin-bottom:50px;}
	.form-landscape .form-panel:first-child {padding-left:0px;}
	.form-landscape .form-panel:after {clear:both;}
	
	.form-landscape .form-panel .col-sm-1,  .form-landscape .form-panel .col-md-1,
	.form-landscape .form-panel .col-sm-2,  .form-landscape .form-panel .col-md-2,
	.form-landscape .form-panel .col-sm-3,  .form-landscape .form-panel .col-md-3,
	.form-landscape .form-panel .col-sm-4,  .form-landscape .form-panel .col-md-4,
	.form-landscape .form-panel .col-sm-5,  .form-landscape .form-panel .col-md-5,
	.form-landscape .form-panel .col-sm-6,  .form-landscape .form-panel .col-md-6,
	.form-landscape .form-panel .col-sm-7,  .form-landscape .form-panel .col-md-7,
	.form-landscape .form-panel .col-sm-8,  .form-landscape .form-panel .col-md-8,
	.form-landscape .form-panel .col-sm-9,  .form-landscape .form-panel .col-md-9,
	.form-landscape .form-panel .col-sm-10, .form-landscape .form-panel .col-md-10,
	.form-landscape .form-panel .col-sm-11, .form-landscape .form-panel .col-md-11,
	.form-landscape .form-panel .col-sm-12, .form-landscape .form-panel .col-md-12	{width:100%;}

	.form-elegant.form-landscape .col-form-label {color:#474747; font-size:85%; font-weight:normal; text-align:left; left:5px;}

	.form-panel-legend {font-size:12px; color:#999999; font-weight:bolder; text-align:right;}
	.form-elegant .form-panel .form-panel-legend {padding-right:20px; margin-bottom:10px;}
	.form-elegant.form-landscape .form-panel .form-panel-legend {padding-right:10px; margin-bottom:-15px;}
	
	.form-panel .form-control[disabled], .form-panel .form-control[readonly], .form-panel fieldset[disabled] .form-control {background-color:transparent;}

	/*	when form-landscape is visible: formBody expands 100% and formSettings disappears */
	.form-landscape .panelBody {-ms-flex:0 0 100% !important; flex:0 0 100% !important; max-width:100% !important; padding-right:0.75rem !important;}
	.form-landscape .panelSettings {display:none !important;}


/* ============================== modal ============================== */
.modal-header {padding:10px 1.25rem;}
	.modal-header .close {margin-left:0px;}

.modal-navigation {border-top:3px solid #ffffff; margin-top:-2px;}
	.modal-navigation .nav {padding:0 1rem;}

	
/* ============================== General classes ============================== */
.section-heading {font-size:0.85rem; font-weight:bolder; color:#777777; text-transform:uppercase; text-shadow:0px 0px 1px #e5e5e5; border-bottom:1px solid #e5e5e5; width:100%; 
				margin-bottom:.25rem; margin-top:5rem; padding-left:.25rem;}
	.section-heading:first-child {margin-top:2rem;}
	.section-heading-description {margin-top:-.15rem; margin-bottom:.5rem; padding-left:.25rem; font-size:0.8rem; color:#999999;}



/* ----- Javascript Classes ----- */
/* Loading Message */
.dwrLoadingDisableDiv {position:fixed; z-index:1000001; left:0; top:0; width:100%; height:100%;}

/* ----- Other Classes ----- */
.profileImg {width:42px; height:48px; padding:5px; margin-top:5px; background-color:#EEE; border-color:#e5e5e5; box-shadow:0 0 4px #DDD;}
.archivedEntity {opacity:0.5; background-color:#F2DEDE !important;}
.sectionTitle p {font-size:1.2em; font-weight:bolder;}
.logEntry {display:block; line-height:1.25em; margin-bottom:5px;}

/* CKEditor editableRT field (javascript html-layout editing box) */
.editableRT, span.cke_skin_kama {min-height:40px; background:#FFF; margin:2px 0px; padding:4px 6px; line-height:20px; color:#555; font-size:14px;
								 _height:25px; border: 1px solid #e5e5e5; border-radius: 3px 3px 3px 3px !important;}


/* ============================== Media Queries ============================== */
/* Extra small devices (phones, less than 576px) */
@media (min-width:0px) and (max-width:576px) {
	.navbar-default .context-menu {height:78px; border-top:1px solid #cccccc;}
}

/* Small devices in horizontal */
@media (min-width:0px) and (max-width:768px) {
	.navbar-default {min-height:62px;}
	.navbar-default .navbar-nav {margin:0; min-height:62px;}
	.navbar-default .navbar-nav a {padding:13px 4px;}
	.navbar-default .navbar-nav a.navbar-btn {padding:6px 12px; margin-right:15px;}
	.navbar-default .navbar-nav a.nav-avatar {padding:8px 7px;}
	.navbar-default .navbar-nav a.nav-avatar img {margin-top:-1px; margin-bottom:0px;}
	.navbar-default .navbar-nav .item-icon i {display:inline-block; margin-right:0; padding:.5rem 1rem; font-size:2rem;}
	.navbar-default .context-menu .item-row {margin:0;}
	.navbar-footer {padding-left:10px;}
}

/* Small devices (old phones - 576 and up) */
@media (min-width:576px) {
	.dock.open .mainPanel.open .form-elegant .col-form-label {text-align:left;}
}

/* Medium devices (iPhone and iPad in vertical, 768px and up) */
@media (min-width:768px) {
	.context-menu {position:relative; right:auto; bottom:auto; left:auto;}
	.drawer {-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease;}
	.dock.open .mainPanel.open .form-elegant .col-form-label {text-align:right;}
	.navbar-default .navbar-nav .item-icon i {font-size:1.75rem;}
	.rightPanel {width:720px;}
	.sidebar {position:sticky; position:-webkit-sticky; top:0; overflow-y:scroll; height:100%;}
	.entity-block {border-left:5px solid #CCC; margin-left:1rem;}
}

/* Large devices (iPhone and iPad in Landscape, 992px and up) */
@media (min-width:992px) {
	.navbar-default .navbar-nav .item-icon i {font-size:1.5rem;}
	.rightPanel {width:992px;}
	.nav-pills-right {right:1rem;}
	.nav.nav-pills.nav-pills-right + .tabs-responsive {margin-right:3rem;}
	.entity-block {margin-left:2rem;}
	.entity-menu .nav-link.nav-icon {font-size:2rem; padding:.85rem 1.55rem;}
	.entity-menu .nav-link.nav-icon:hover,
	.entity-menu .nav-link.nav-icon.active {font-size:2.5rem; padding:.6rem 1.2rem;}
}

/* Extra-Large devices (Desktops, 1200px and up) */
@media (min-width:1200px) {
	.cover-background {min-height:535px;}
}