/* AuthLite IDocs */

/*
	Color Scheme
	blue  - #7c8c9c 124, 140, 156
	green - #00c955 0, 201, 85
*/

/*#region Defaults & Layout */

*{ margin:0; padding:0; outline:none; }
html,body,#main { position:relative; max-width: 100%; width:100%; height:100%; min-height:100%; background-color: #f6f6f6; font-family:'Nunito Sans', sans-serif; }
html,body,#main, #ui-top { min-width:650px; }
body { margin: 0;	padding: 0; }
#main { min-height:100%; height:100%; width:100%; }
#ui-top { height:8%; width:100%; position:fixed; min-height:55px; max-height:70px;  z-index:20; background-color: #fff; border-bottom:1px solid #ddd; }
#pages,.search-modal, #toc { position:relative; top:12%; width:100%; height:88%; }
.note { display:block; padding: 20px; border-left: 5px solid #7c8c9c; background-color: #fff; box-shadow: rgba(0,0,0,.15) -3px 3px 4px; }
.branding {  margin: 0 auto;  width: 250px;  height: 80px;  background: url('images/authlite-brand-full.png') center center no-repeat;  background-size: contain; }
h1 { color: #3b6b9c; }
.section-content {  background-color: rgba(255, 255, 255, 0.5);  border-radius: 6px;  padding: 25px;  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px; }
.page-header { border:none; }

/* UI */
.ui {  width: 100%;  text-align: center; }
.ui-brand { height:100%; position:absolute; }
.btn {  transition: all 0.15s linear;  -webkit-transition: all 0.15s linear; }
.btn { text-transform:none; color:#333; padding: 15px 25px; }
.btn span { margin-right:3px; font-size:1em; vertical-align:middle; }
.btn-default:hover {  color: #00c955;  background-color: #f6f6f6;  border-color: #ccc;  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px inset; }
.btn-default,
.btn-default:focus,
.btn-default:active {  cursor: pointer;  background-color: #fbfbfb;  box-shadow: rgba(0, 0, 0, 0.075) 0px 0px 10px inset;  border: 1px solid #ddd;  /*border-bottom-width:0px;*/ }
.btn-default:hover {  background-color: rgba(124, 140, 156, 0.1);  box-shadow: none;  /*box-shadow: rgba(64, 70, 156,.1) 0px 0px 10px inset;*/ }
.ui-buttons { margin:0 0 0 auto; height:100%; display:table; vertical-align:middle; }
.ui-buttons .btn,
.ui-buttons a.btn {color:#333; margin-top:13px; padding-left:20px; padding-right:20px; display:table-cell; border:none; background-color:#fff; box-shadow:none; border-radius:0; }
.ui-buttons .btn:hover,
.ui-buttons a.btn:hover { background-color:#e7eef5; color:#333; }
.ui-buttons .btn:last-child,
.ui-buttons a.btn:last-child {  border-bottom-width: 1px; }
input[type=text] { border-radius:1000px; border:1px solid #ccc; min-width:400px; box-shadow: inset 0px 3px 6px rgba(0,0,0,.08); padding:8px 20px; }
#btn-all .show-current,
#btn-all.all .show-all { display:none; }

#btn-all.all .show-current,
#btn-all .show-all { display:block; }

.page-nav { margin:50px 0; box-shadow:rgba(0,0,0,.2) 0px 0px 2px; padding:0; }
.nav-text { border-radius: 3px 3px 0 0; }
.nav-text,
.nav-link { padding:15px; background-color:#7c8c9c; color:#fff; font-weight:700; font-size:1.1em; }
.nav-link {  color: #00b844; font-weight:bold; font-size:1em; background-color:#fff; border-top:1px solid #ddd; cursor: pointer; }
.nav-link:hover { /*background-color:#e7f0fa;*/ background-color:#00b844; color:#fff; }

figure,
figure.img-thumbnail { margin: 0 0 20px 0; padding-top:0px; border-color:#e2e9f0; border-left: 5px solid #e2e9f0; border-radius:0px; border-top-width:0px; border-right-width:0px; border-bottom-width:0px; background-color:transparent; padding-left: 10px; }
figure.border-right,
figure.img-thumbnail.border-right { border-left-width:0px; border-right-width:5px; padding-left:0px; padding-right:10px; }
.img-thumbnail { padding:6px; border-color:#e2e9f0; border-radius:0px; }
figcaption.figure-caption { padding:10px 10px 10px 1px; }


/* jquery ui search dialog */
.dialog-search.ui-dialog  { width:100% !important; height:92% !important; top:8% !important; position:fixed; padding:0; }
.dialog-search.ui-dialog  .ui-dialog-titlebar { padding:0; margin:0; position:relative; width:100%; height:4%; }
.dialog-search.ui-dialog  .ui-dialog-content { padding:0; height:96% !important; }

.s6-modal { padding:15px 15px 0 15px; }

.s6-modal .btn-modal-close { float:right; padding:7px 14px; margin:0 45px; cursor:pointer; border-radius:1000px;
							 /*box-shadow: inset 0px -3px 5px rgba(0,0,0,0.1); background-color:#fff; border:1px solid #e0e0e0; */ }
.s6-modal .btn-modal-close:hover { background-color:#fff; }
.s6-modal .btn-modal-close .icon { font-size:1.9em; }
.s6-modal .btn-modal-close .btn-label { font-weight:bold; }
.s6-modal .btn.btn-green { background-color:#00b844; color:#fff; }

/* custom s6 modal search */

.search-modal { display:none; background-color:#f6f6f6; width:100% !important; height:88% !important; top:12% !important; position:fixed; z-index:10; }
.search-modal .btn-modal-close { margin-right:0; }
.search-modal .toolbar { text-align:center; /*background-color:#b4c1ce;*/ padding:15px 0 30px 0; border:1px solid #e2e2e2; border-top:none; border-left:none; border-right:none; }
.search-modal .search-results { overflow-y: scroll; height: 60%; background-color:#eee; }
.search-modal .search-result { position:relative; border-bottom:1px solid #f0f0f0; padding:15px;  }
.search-modal .search-result { background: #fff; /* Old browsers */
background: -moz-linear-gradient(top, #fff 0%, #fcfcfc 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #fff 0%, #fcfcfc 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #fff 0%, #fcfcfc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fcfcfc',GradientType=0 ); /* IE6-9 */}

/* If just the result item header is interactive */
.search-modal .search-result .header { cursor:pointer; color:#00c955; font-weight:bold; font-size:1.15em; }
.search-modal .search-result .header:hover { text-decoration:underline; }

/* If the entire result item is interactive */
.search-modal .search-result.interactive { cursor:pointer; }
.search-modal .search-result.interactive:hover { color:#fff; background:#a3b4c4; /*background-color:rgba(124, 140, 156, 0.1);*/ }
.search-modal .search-result.interactive:hover .header,
.search-modal .search-result.interactive:hover .lede { color:#fff; text-decoration:none; }
.search-modal .search-result.interactive .header { }
.search-modal .search-result.interactive .header:hover { }
.search-modal .search-result.interactive .lede { margin-top:2.5em; /* Allow for two lines of header text (absolute positioned) */}

/*#region Forms (Shared) */
.form-group label {  color: #7c8c9c; }

/* Present validation error messages below fields */
.help-block.field-validation-error {  color: #dd0000;  position: relative;  display: block;  padding-left: 14px;  margin-left: 50%;  margin-top: 0; }
/*#endregion Forms (Shared) */

/*#endregion Defaults & Layout */

/*#region Search Screen */

.search-screen { /*Mobile scrollable --> */ max-height: 100% !important; width:100%; position: absolute; overflow-y:scroll; }
.search-screen { opacity:0; filter:alpha(opacity=0); background-color:#fff; top: 0;  right: 0;  left: 0; height:100%; /* <-- explicit height required for mobile menu stint */  min-height: 100%;  z-index:1080;  margin:0;  border:none; }
.search-screen { transition:opacity 0.1s linear; -webkit-transition:opacity 0.1s linear; }
.search-screen.collapsing[aria-expanded="true"],
.search-screen.collapse.in  {  opacity:1; filter:alpha(opacity=100); }
 
.search-screen-mobile-stint { height:10%; width:100%; }
.search-screen .display-table { height:90%; /* <-- Reduce height on mobile to match stint and avoid header overlap and uncessary vertical scrollbar */ }

/*#endregion Search Screen */

/*#region Table of Contents */

#toc { display:none; overflow-y:auto; /*padding:50px 15% 0 15%;*/ }
#toc-topics { padding-bottom:8%; }
#toc-topics .topic { padding-left:20px; }
#toc-topics > .topic { padding-left:0px; }
#toc-topics .topic.active > .topic-label, 
#toc-topics .topic.active > .topic-label:hover { color:#fff; background-color:#7c8c9c; }
#toc-topics .topic .topic-label { display:block; font-weight:bold; color:#333; padding:8px; cursor:pointer; }
#toc-topics .topic .topic-label:hover { background-color:#fff; }
#toc-topics > .topic > .topic-label { font-size:1.2em; color:#3b6b9c; }
#toc-topics .topic .topic .topic .topic-label { font-weight:normal; }
#toc .btn-modal-close { margin:0 0 15px 0; }
/*#endregion Table of Contents */

/*#region Breadcrumbs */

#breadcrumbs-wrapper { position:relative; /*top:8%; padding:10px;*/ }
#breadcrumbs-wrapper #breadcrumbs { text-align:left; padding:0 25px; }
#breadcrumbs .breadcrumb,
#breadcrumbs .breadcrumb .breadcrumb-link { display:inline-block; background-color:transparent; margin-bottom:0; padding:5px 0; }
#breadcrumbs .breadcrumb .breadcrumb-delimiter { font-size:.75em; line-height:2em; padding:0 10px; }

/* Faux interactive styles for "clickable" (nav-link) links */
#breadcrumbs .breadcrumb .breadcrumb-link.nav-link { cursor:pointer; }
#breadcrumbs .breadcrumb .breadcrumb-link.nav-link:hover { text-decoration:underline; }

#breadcrumbs .breadcrumb .breadcrumb-link,
#breadcrumbs .breadcrumb .breadcrumb-delimiter { vertical-align:middle; }

#breadcrumbs-wrapper.lite { background-color:#e2e9f0; color:#2b3e53; box-shadow:rgba(255,255,255,.9) 0px 1px 10px;}
#breadcrumbs-wrapper.lite .breadcrumb-link { color:#2b3e53; font-weight: normal; border: none; }

/*#endregion Breadcrumbs*/

/*#region Utilities */

.no-list {  list-style: none;  /*margin: 15px 0 30px 0;*/ }
ul.no-list {  padding: 0; }
ul.no-list li {  list-style-type: none;  list-style-position: inside; }
.display-table {  display: table;  width: 100%;  height: 100%;  table-layout: fixed; }
.display-table-content {  display: table-cell;  vertical-align: middle;  width: 100%;  /* width required if table-layout:fixed otherwise sibling elements take up equivalent width and break h-centering */ }
.text-center {  text-align: center; }
.transition {  transition: all 0.1s linear;  -webkit-transition: all 0.1s linear; }
img.responsive { display:block; width:100%; height:auto; max-width:100%; }
img.responsive-w { width:auto; height:100%; max-height:100%; }
img.img-preload { position:absolute; left:-100000px; top:-100000px; width:1px; height:1px; }
.clearfix:before,
.clearfix:after {  content: "."; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; } 
.clearfix {zoom: 1;}  /* IE 8 */

/* Hides from IE-mac \*/
* html .clearfix-2 { height: 1%; }
.clearfix-2 { display: block; }
/* End hide from IE-mac */


/*#region Tables */
.table-tokens {  width: 100%; }
.table-tokens th {  border-bottom: 1px solid #ccc; }
.table-tokens th,
.table-tokens td {  text-align: left; }
#table-tokens td {  vertical-align: middle;  border: none; }
.table-tokens th.token-enabled,
.table-tokens td.token-enabled,
.table-tokens th.token-date,
.table-tokens td.token-date {   text-align: center; }
.table-tokens tr {  /*border-bottom:1px solid #e0e0e0;*/ }
.table-striped > tbody > tr:nth-of-type(odd) {   background-color: #f0f0f0; }
/*#endregion Tables*/

/*#region Notifications */

/*#toast-container { margin-top:10px; }
#toast-container>div { box-shadow: 0 0 12px #000; }*/

/*#endregion Notifications */

html.noscroll,
body.noscroll,
#wrap.noscroll { position: fixed; overflow-y: hidden; -webkit-overflow-scrolling: touch; }

/*#endregion Utilities */

/*#region Pages */

.page {
  display: none;  
  padding:25px; /* Padding-top also fixes initial h1 margin overflow from BS3 default */
  border-bottom:1px solid #e0e0e0;
}

/*#endregion Pages */

.vbox-title,
.vbox-num {
    height:auto;
    line-height: 1.1em;
    font-size: 16px;    
	padding-top:16px;
	padding-bottom:16px;
}
.vbox-container { overflow-y: auto; /*position: fixed;*/ }
body.vbox-open,
body.vbox-open #ui-top { padding-right:16px; }

@media only screen and (min-width:480px ) {

}

@media only screen and (min-width:768px ) {
	.s6-modal { padding:15px 10% 0 10%; }
	.search-modal .search-results { height: 80%; }
}

@media only screen and (min-width:992px ){
	html.noscroll,
	body.noscroll,
	#wrap.noscroll{ overflow-y:scroll; /* overflow scroll instead of hidden to retain scrollbar on desktop browsers so content doesn't jump around */ }
		.ui-buttons {  margin:0 auto; /* Horiz center main menu */ }
	.s6-modal { padding:15px 15% 0 15%; }
	.ui-buttons .btn { padding-left:25px; padding-right:25px; }
}

@media only screen and (min-width:1200px ) {

}