#cms-helptext[data-textlength="0"] {display: none}
#cms-helptext {opacity: 0;}
#cms-helptext:not(.alert-dismissible) button.close {display: none;}


.hidden, .hidden0 {display: none !important; visibility: hidden;}

.pointer {cursor: pointer;}

.icon-cog-2x 
{
	background-image: url('/images/icons/cog2x.png?width=15'); 
	background-position: 0 0;
	width: 15px; 
	height: 15px;
}


.col-content {min-height: 150px;}

/*make dropnav appear on hover so that top level pages arfe clickable*/
body:not(.touch) ul.topnav .dropdown:not(.child-count-0):hover > .dropdown-menu {
	display: block;
}

body:not(.touch) ul.topnav .dropdown-submenu:not(.child-count-0):hover > .dropdown-menu {
	display: block;
}

/*NAVBAR SUB_MENU CUSTOM STYLING*/
ul.topnav .dropdown-submenu {
	position: relative;
}

ul.topnav .dropdown-submenu > .dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: -6px;
	margin-left: -1px;
	-webkit-border-radius: 0 0px 4px 4px;
	-moz-border-radius: 0 0px 4px 4px;
	border-radius: 0 0px 4px 4px;
}

/*set a reasonable limit on width*/
ul.topnav .dropdown-submenu a {
	max-width: 300px;
  	overflow: hidden;
  	text-overflow: ellipsis;
  	white-space: nowrap;
}

/*carets to indicate children; uses fa-caret-down, fa-caret-right*/
/*ul.topnav a:after {font:normal normal normal 12px/1 FontAwesome;}
ul.topnav .dropdown:not(.child-count-0) > a:after {content:"\f0d7"; padding-left:5px;}
ul.topnav .dropdown-submenu:not(.child-count-0) > a:after {content:"\f0da"; float: right; padding-top:5px;}*/
/*stop caret from wrapping
ul.topnav .dropdown-submenu:not(.child-count-0) {padding-right: 5px;}*/

/*switchCaretsBack-v2.9*/
#od-topnav li a:before {padding-left:5px; font:normal normal normal 12px/1 FontAwesome; float: right; margin-top: 4px;}
#od-topnav li[data-level="0"]:not([data-child-count="0"]) > a:before {content:"\f0d7";}
#od-topnav li:not([data-level="0"]):not([data-child-count="0"]) > a:before {content:"\f0da";}

#od-nav-collapse #od-topnav li:not([data-child-count="0"]) > a:before {content:"\f0da";}
#od-nav-collapse #od-topnav > li > a {width: 100%;}

/*#od-topnav li.starred:before {
	font-family:FontAwesome;
	content: "\f005";
	color: orange;
	position: absolute;
    top: 22%;
    left: 5px;
    font-size: 80%;
}*/


/*show stars in topnav + subnav*/
body[od-topnav-show-starred="1"] #od-topnav li.starred {
    background-image: url('/images/icons/star.png');
    background-repeat: no-repeat;
    background-position: 2px center;
    background-size: 12px;
}

body[od-subnav-show-starred="1"] #od-topnav li.starred[data-level="0"] {background-position: left center;}

body[od-subnav-show-starred="1"] #od-subnav li.starred {
    background-image: url('/images/icons/star.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 12px;
}

body[od-topnav-show-starred="1"] #od-topnav a:hover {background-color: rgba(0,0,0,.05);}
body[od-subnav-show-starred="1"] #od-subnav a:hover {background-color: rgba(0,0,0,.05);}



/*#od-subnav li.starred > a:after {
	font-family:FontAwesome;
	content: "\f005";
	color: orange;
	margin-right: 4px;
	float: right;
}*/


/*cheeky reuse of bootstraps down caret as a right one*/
.caret-right, ul.topnav li li .caret {
	border-bottom: 4px solid transparent;
    border-top: 4px solid transparent; /*from dashed*/
    border-left: 4px solid; /*from solid transparent*/
}

ul.topnav li li .caret {
	float: right;
	margin-top: 7px;
    margin-right: -15px;
}



#od-subnav li[data-noshow="1"] {display: none;}
#od-topnav li[data-noshow="1"] {display: none;}



/*-------------------------------------------------------------*/
/*simpletree\subnav*/
.od-simpletree ul {padding-left: 0px;}
.od-simpletree ul ul {padding-left: 10px;}

.od-simpletree li {
	clear: left;
	padding-left: 10px;
}

.od-simpletree .caret-right {
	position: absolute;
	margin-left: -5px;
	border-width: 6px;
	border-left-width: 10px;
	margin-top: 3px;
	color: #ccc;
	cursor: pointer;
}

.od-simpletree .caret-right:hover {
	color: #999;
}

.od-simpletree li.active > span.caret-right {
	border-top: 10px dashed;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
    margin-top: 5px;
}

.od-simpletree li.active > ul > li {display: block}

/*hide all sub-subnav*/
.od-simpletree li li {display:none;}

/*experiment with stopping subnav wrap*/
.od-simpletree a {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow-x: hidden;
}

.od-simpletree li.selected > a {background-color: #e7e7e7;}
/*div.subnav li.selected > a:before {color: #000;}*/

.od-simpletree li {list-style-type: none;}
.od-simpletree li a {padding: 0px 5px; margin-left: 10px; overflow: hidden;}
/*div.subnav li a:before {content: "\e080"; font-family: 'Glyphicons Halflings'; color: #ebebeb; margin-right: 4px;}*/
.od-simpletree li a:hover {text-decoration: none; color: #000;}

/*make subnav hover more obvious and short names easier to click*/
.od-simpletree li a {display: block;}
.od-simpletree li a:hover {background-color: #eee;}

/*-------------------------------------------------------------*/



/*div.subnav li a:before {display: none;}*/
/*.navbar .nav > li > a:hover {text-decoration: underline;}*/



/*adjust subnav ul padding to suit the width*/
body[od-subnav="wide"] div.subnav ul ul {padding-left: 20px;}
body[od-subnav="narrow"] div.subnav ul ul {padding-left: 0px;}
body[od-subnav="auto"] div.subnav ul ul {padding-left: 5px;}



body[od-subnav-position="right"] #od-col-subnav {float: right;}
body[od-subnav-position="off"] #od-col-subnav {display: none;}


/*dashboard*/
div.subnav.well li a:before {
	color: inherit;
	margin-left: -3px;
}

/*div.subnav > li:first-child > a:first-child {display: none;}
div.subnav span.caret {display: none;}*/


/*#pageid-1219 div.subnav li.depth-level-1 {display:list-item;}*/

div.col-content {min-height:300px;}


.form-horizontal .control-group {margin-bottom: 8px;}
#dialog-pagesettings {overflow:hidden;}

.navbar .navbar-search .search-query {width:80px;}

iframe.od-embed {
	border:solid 1px #ddd; 
	border-radius: 4px;
	box-sizing: border-box;
	width: 100%; 
	min-height: 575px; /*tall enough for gdocs file menu*/
	max-height: 1000px;
	/*background-color: #ccc;*/
	resize: vertical;
}

/*2.9 - disable these for newly responsive videos, in case they cause problems - like videos won't play in help dialog!?*/
iframe.od-embed.embed-responsive-item{
	box-sizing: inherit;
	min-height: inherit;
	border-radius: 0px;
}


/*.od-iframe-container.loading {
	background: url(/images/icons/loading.gif) no-repeat;
}

.od-iframe-container.loading iframe {
	opacity: 0;
}

.od-contenttype-group:not(.iframe-loaded) {background: url(/images/icons/loading.gif) no-repeat;}
.od-contenttype-group:not(.iframe-loaded) iframe {opacity: 0;}*/

.od-iframe-loader:not(.loaded) iframe {opacity: 0;}
iframe.od-iframe-useloader:not([src]) {display: none;}
:not(.od-iframe-loader) > iframe.od-iframe-useloader {opacity: 0;}

.od-iframe-loader:not(.loaded):before {

    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    content: "\f021";
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 40px;
    position: absolute;

}


/*iframe[pre-src]:not([src]) {visibility: hidden;}*/


div.attach-crumbtrail{
	margin-top: 5px;
	margin-right: 5px;
	/*width: 100%;*/
	float: right;
	/*background-color: #ccc;
	border-radius: 5px 5px 0 0;*/
}


div.attach-crumbtrail li {display: list-item;}

/*hide items destined for crumbtrail until they get there*/
*:not(.od-breadcrumb-container) > .attach-crumbtrail {display: none;}


/*body.od-loading {opacity: 0;}*/
/*body.od-loading .cms-contentauto {opacity: 0;}*/
body.od-loading .breadcrumb .btn-group {opacity: 0;}

/*some content types need hiding until rendered*/
body:not(.plugin-ready) .od-contenttype-dashboard {opacity: 0;}


/*switchtoedit*/
.breadcrumb .btn-lg {
	padding: 3px 16px;
	margin-top: -2px;
	height: 34px;
}

/*where glyphicon used, keep same as fa*/
.breadcrumb .attach-crumbtrail button > i.glyphicon {
    font-size: 16px;
    position: relative;
}

.breadcrumb .attach-crumbtrail button > b.caret {
	/*float: right;
    margin-top: 8px;*/
    margin-left: 5px;
}

.breadcrumb > .attach-crumbtrail > a.btn {margin-top: -2px;}


#od-breadcrumb > .badge {
    padding: 8px 12px;
    margin-top: -4px;
    margin-right: -8px;
    font-weight: normal;
}


.od-icon-drive:before {
	content: url('/images/icons/drive_icon_gray_18.png');
	line-height: 1.8;
}


/*where foundation used keep same size as fa*/
.btn i.fi {font-size: 20px;}


/*editors*/
.cms-content:not(:empty) {margin-bottom: 8px; border: dotted 1px transparent;}


/*div.cms-content, div.editable {min-height: 10px;}*/ /*enough height to be hoverable*/
div.editable:hover {
	/*border-radius: 4px; */
	/*min-height: 25px; */
	cursor: pointer; 
	
	/*background-color: #eee; */
	border-color: #ccc;

	/*
	padding: 5px 5px 0 5px; 
	margin: -5px 0 10px -5px;*/

	/*min-height: 25px;
	margin-top: -5px;*/
	margin-left: -5px;
	padding-left: 5px;
}

div.editable:hover:before {

	content: "\f040"; /*pencil*/
	font: normal normal normal 16px/1 FontAwesome;

	float:right; 
	/*position: absolute;
    right: 15px;*/

    /*position: relative;
    top: -5px;*/

    background-color: rgba(230,230,230,.75);
    border-radius: 4px;
    border: solid 1px #ccc;
    padding: 5px;
    margin: 1px 1px 0 0;
}

/*summernote's placeholder are too dark*/
.note-editor .note-placeholder {color: #999;}



/*make subnav indent*/
ul.nav-list ul {margin-left: 5px;}
.subnav > .nav-list li {text-indent: -18px; margin-left: 16px;}

/*-------------------------------------------------
folder lists
-------------------------------------------------*/
/*.googledocsdocumentlist > * > .well {
	margin:0 10px 10px 0; 
    float:left; 
}
	
.googledocsdocumentlist > .folder-extra-large-icons > .well {width:180px; min-height:170px;}
.googledocsdocumentlist > .folder-extra-large-icons > .well img {max-height:110px;}

.googledocsdocumentlist > .folder-large-icons > .well {width:80px; min-height:75px;}
.googledocsdocumentlist > .folder-large-icons > .well img {max-height:80px;}

.googledocsdocumentlist > .folder-medium-icons > .well {width:50px; min-height:50px;}
.googledocsdocumentlist > .folder-medium-icons > .well > img {height:30px;}

.googledocsdocumentlist > .folder-small-icons > .well {width:30px; min-height:30px;}
.googledocsdocumentlist > .folder-small-icons > .well img {height:20px;}

.googledocsdocumentlist > .folder-details .modified {text-align: right;}
.googledocsdocumentlist > .folder-details {cursor: default;}*/

/*.folder-medium-icons > div {background-color: #ccc;}*/

/*we use .thumbnail for pretty boxes, but we don't want its responsive, limited height*/
/*.od-thumbnails .thumbnail img {height: inherit;}*/

/*.folder-blog .well {margin:-bottom:10px; min-height:120px;}*/



/*responsive thumbnails*/
/*@media (min-width: 640px) {.thumbnail img { height:50px; }}
@media (min-width: 800px) {.thumbnail img { height:80px; }}
@media (min-width: 1024px) {.thumbnail img { height:100px; }}*/

/*.od-thumbheightfix {overflow: hidden;}
.od-thumbheightfix img {max-width: 100%;}

.folder-extra-large-icons .od-thumbheightfix {height: 300px;}
.folder-large-icons .od-thumbheightfix {height: 190px;}
.folder-medium-icons .od-thumbheightfix {height: 115px;}
.folder-small-icons .od-thumbheightfix {height: 75px;}*/


/*poss needed for od/examples
.threeup:nth-child(3n+1) {clear:left;}*/


.od-thumbnails img {width: 100%;}

.od-thumbnails .thumbnail {margin-bottom: 15px;}

body:not(.od-theme-slate) .od-thumbnails .thumbnail {background-color: #f5f5f5;}


.od-thumbnails .img-box {overflow-y: hidden;}

.od-thumbnails.folder-extra-large-icons .img-box {height: 400px;}
.od-thumbnails.folder-large-icons .img-box {height: 300px;}
.od-thumbnails.folder-medium-icons .img-box {height: 200px;}
.od-thumbnails.folder-small-icons .img-box {height: 100px;}

/*//OV-247 folder embed : icons : portrait/landscape*/
.od-thumbnails-portrait .od-thumbnails .img-box {height: inherit;}


.od-thumbnails .mime-type-google-apps-folder .thumbnail {padding-top: 0px;}
.od-thumbnails .mime-type-google-apps-folder .img-box {/*height: 30px; float: left; */display: none;}

.od-thumbnails .mime-type-application-zip .thumbnail {padding-top: 0px;}
.od-thumbnails .mime-type-application-zip .img-box {display: none;}


/*.od-thumbnails .mime-type-google-apps-folder img {width: 20px; margin: 5px;}*/
/*.od-thumbnails .mime-type-google-apps-folder .thumbnail .caption {padding: 2px;}*/
/*.mime-type-google-apps-folder + .mime-type-google-apps-document {clear: left;}*/

.od-thumbnails .caption {padding: 2px 0;}
.od-thumbnails .caption img {width: 16px; float: left; margin: 5px 5px 5px 0;}

.od-thumbnails h4 {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-top: 5px;
	margin-bottom: 0;
	color:inherit;
	font-weight: normal;
	font-size: .9em;
}

.od-thumbnails a:hover {text-decoration: none;}




/*experimental - crop blog text using ellipsis/line clamp
.folder-blog .article-intro {
	max-height: 150px;
	text-overflow: ellipsis;
	overflow: hidden;
	display: block;
  	display: -webkit-box;
  	-webkit-line-clamp: 7;
  	-webkit-box-orient: vertical;
}*/


/*.folder-blog .thumblink {float: right; margin-left: 50px;}
.folder-blog .blog-excerpt img {display: none;}*/

.open-in-drive {display: none;}

/*.cms-contentauto .folder-small-icons .caption {display: none;}*/

table.folder-details td.icon {
	width:25px;
	/*vertical-align: middle;*/
	/*padding-top: 7px;*/
}


.od-list-pageindex .media img {width:64px; margin-right: 10px;}
.od-list-pageindex .media {
	/*border: 1px solid #ddd;
	border-radius: 4px;
	margin-bottom: 30px;
	padding: 20px 10px;*/
	min-height: 165px;
}


/*stars*/
table th.star, table td.star {
	width: 25px; 
	cursor: pointer;
	/*vertical-align: middle;*/
	text-align: center;
}

td.star div {
	background: url('/images/icons/star_grey.png') no-repeat center center;
	height: 16px;
	width: 16px;
	opacity: 0.5;
	margin: auto;
	margin-top: 2px;
	background-size: 100% 100%;
}


td.star.starred1 div, td.star > div[data-starred="1"] {
	background-image: url('/images/icons/star.png'); 
	opacity: 1.0;
}


/*scaling icons*/
/*td.star {vertical-align: middle !important;}*/
body[od-theme-body-font-size="large"] td.star div {width: 18px; height: 18px; margin-top: 3px;}
body[od-theme-body-font-size="xlarge"] td.star div {width: 20px; height: 20px; margin-top: 6px;}

body[od-theme-body-font-size="large"] .attach-crumbtrail .btn-default {font-size: 18px;}
body[od-theme-body-font-size="large"] .od-datatable-refresh {font-size: 18px;}
body[od-theme-body-font-size="large"] .dataTables_filter .input-sm {height: 32px; right: 8px;}

body[od-theme-body-font-size="xlarge"] .attach-crumbtrail .btn-default {font-size: 24px;}
body[od-theme-body-font-size="xlarge"] .od-datatable-refresh {font-size: 24px;}
body[od-theme-body-font-size="xlarge"] .dataTables_filter .input-sm {height: 38px; right: 10px;}


body[od-theme-body-font-size="large"] td.iconlink img {min-width: 18px; width: 18px;}
body[od-theme-body-font-size="xlarge"] td.iconlink img {min-width: 20px; width: 20px;}


/*in case we want to switch to FontAwesome on folder view too*/
/*td.star div:before {font-family:FontAwesome; content: "\f006";}
td.star.starred1 div:before, td.star > div[data-starred="1"]:before {color: orange; content: "\f005";}*/



/*breadcrumb & folderv2 stars*/
.od-btn-star.starred i, .od-btn-star[data-starred="1"] {color: orange;}
.od-btn-star i:before {content: "\f006"; /*fa-star-o*/}
.od-btn-star.starred i:before, .od-btn-star[data-starred="1"] i:before {content: "\f005"; /*fa-star*/}


/*file published label*/
div.label.published {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
	padding: 5px 10px;
	display: none;
}

/*hide on home*/
/*body.root-page-home.page-home div.label.published {display: none;}*/

/*only display on gdocview*/
.cms-contentauto.od-contenttype-gdocview div.label.published {
	display:inline-block;
	background-color: #aaa;
}

div.label.published .word2,
div.label.published .author {display: none;}


/*stop blog articles from showing their parent page's content*/
body[od-contenttype="gdocview"] .cms-content {display: none;}


/*where doc html injected, stop published from squashing up first line*/
.gdoccontents {clear: right;}

/*some sites will want to override this*/
a.popped-view {display: none;}


.navbar-search {display:none;}
/*.navbar .nav {margin-right: 0px;}*/


.page-header {
	background-position: right;
	padding-right: 0px;
	padding-bottom: 0;

	/*vain attempt to make header image responsive*/
	background-size: auto 88%;
}

body[od-searchbox-position="banner-right"] .page-header {background-position: right 50px top 0;}

body:not([od-banner-height="off"]) #od-pageheader-alt {display: none;}

#od-pageheader-alt {margin-top: 2px;}


/*not sure what this was for, but messed up http://overdrive.refractiv.net/home/
.CMSgoogledocembed {float: left;}*/

/*make title class roughly bigger than h1, as in gdocs*/
.CMSgoogledocembed .title {
	/*display:none;*/
	font-weight: 500;
  	line-height: 1.1;
  	font-size: 40px;
  }

.CMSgoogledocembed p {font-family:inherit;}


/*-------------------------------------------------
dialogs
-------------------------------------------------*/

.no-close .ui-dialog-titlebar-close {
  display: none;
}


/*frmPageOptions*/
span.cms-checkboxgroup-spn {
	float: left;
	margin-right: 20px;
	margin-bottom: 5px;
}

span.cms-checkboxgroup-spn label {
	margin-left:3px; 
	display: inline-block;
}

#frmPageOptions legend {font-size: 14px; margin-bottom: 5px; line-height: inherit;}


/*settings dialogs - override jquery ui's gray to make set values look different from placeholders*/
.controls input, .controls textarea {color: #000000 !important;}


.btnDialogLeft {float:left; /*display: none;*/}
.ui-dialog-buttonset {width: 100%; text-align: right;}

.ui-dialog .btn {min-width: 60px;}

.form-vertical textarea {
	width:100%;
	box-sizing:border-box;
}

/*where we link a label e.g. Google Analytics make it obvious*/
.ui-widget-content .control-label a {color:#0088cc;}


.alert-neutral, .alert-neutral .alert-heading {
	color: #444;
}
.alert-neutral {
	background-color: #eee;
	border-color: #ddd;
}

.alert a {text-decoration: underline;}

/*site settings > theme - maximise vertical space*/
.alert:empty[data-tag] {display: none;}


textarea#dialog-textarea-value {
	height:90px; 
	width:100%; 
	box-sizing:border-box; 
	font-family:courier;
	resize:none;
}


/*checkbox groups - neater with right not left margin (calendar)*/
label.checkbox-inline.od-fc-checkbox {margin-left: 0; margin-right: 10px;}

.od-fc-checkbox input[type=checkbox] {
	margin-left: -15px;
	/*width:20px !important; 
	height:20px !important; 
	-webkit-box-shadow:none;
	margin-right: 5px;
	font-weight: normal;*/
}

textarea#txaHelpText {
	resize: vertical;
	height: 50px;
	font-family: courier;
	padding: 4px;
}

textarea#txaContent {
	resize:none;
	height: 140px;
	font-family: courier;
}


button.multiselect {white-space: normal;}
ul.multiselect-container .od-tight {font-size: 10px;}
ul.multiselect-container .od-tight label.checkbox {padding-top:0; min-height: inherit;}
ul.multiselect-container .od-tight input {margin:0;}

.od-multiselect-wide {width: 100%;}
.od-multiselect-wide > button {width: 100%; text-align: left; min-height: 34px;}
.od-multiselect-wide > button > b {position: absolute; top: 14px; right: 8px;}
.od-multiselect-wide > button > b.fa {top: 8px;}


.od-multiselect-wide .multiselect-selected-text {
    margin-right: 11px;
}

.od-multiselect-wide ul.multiselect-container {max-width: 300px;}

/*vertical alignment tweak*/
.multiselect-container > li label.checkbox input[type="checkbox"] {float: left; margin-top: 4px;}
.multiselect-container li label i {line-height: 0; font-size: inherit;}


/*pickers are disabled, but we don't want them to look it*/
.pickername {
	cursor: pointer !important;
	background-color: #ffffff !important;
}

input[type="text"].pickerdata {
	width: 700px;
	font-size: 10px;
	font-family: monospace;
}

#calendar-list label {
	margin-left: 20px;
	margin-right: 10px;
	text-indent: 5px;
	font-weight: normal;
	font-size: 90%;
	padding-top: 4px;
}

input[type="color"] {
	border:none; 
	width:50px; 
	height:27px; 
	padding:0; 
	background:none; 
	box-shadow: none;
	float: left; 
	margin-right:10px;
}


.od-formsectionwithlabel {white-space: nowrap; margin-bottom: 10px;}
.od-formsectionwithlabel label {font-weight: normal; width: 33%;}
.od-formsectionwithlabel .form-control {
	width:66%;
	display: inline-block;
}

/*rt#42785 - site settings has cropped options with some themes*/
.od-formsectionwithlabel select.form-control {
	padding-left: 8px!important;
	padding-right: 0px!important;
}


.od-formsection-label-over > label {
  margin-bottom: 0; 
  margin-top: 5px; 
  font-weight: normal;
  white-space: nowrap;
  font-size: 80%;
}



#tab-settings-site-reset div {margin-bottom: 5px;}
#tab-settings-site-reset a {min-width: 125px; margin-right: 5px;}


/*tried in vain to get layout label "Search Button" to not wrap
body:not([od-bs-width="xs"]) #tab-settings-site-layout {margin-left: -15px;}
body:not([od-bs-width="xs"]) #tab-settings-site-theme {margin-left: -15px;}*/


#editUserForm {margin-top: 10px;}
#editUserForm label {font-weight: normal;}

.edituser .user-thumbnail {position:absolute;right:15px;width:120px;}
.edituser .user-thumbnail img {width:100px; margin-bottom: 10px; z-index: 100;}
.edituser .user-g-plus a {width:100px;}

.user-admin-permissions {display: none;}

.od-tree-label {font-weight: normal; margin-top: 10px;}

.od-tree-refresh {
	position: absolute;
	z-index: 1000;
	right: 15px;
	bottom:0;
}

/*.od-drive-tree {clear: both;}*/

.od-drive-tree .fancytree-container {
  height: 200px;
  overflow-y: scroll;
  position: relative;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(0,0,0,.075);
}


#od-modal-file-details .od-drive-tree .fancytree-container {
  height: 360px;
}

/*compensate for using fa rather than glyphicons*/
.treeview .icon {font-size: large; min-width: 17px; top: 2px; position: relative;}

/*remove borders*/
.treeview .list-group {box-shadow: none;}
.treeview .list-group-item {border: none; padding: 5px 15px;}

/*change fa-square to fa-check when tree node selected*/
/*.node-selected .icon:before {content: "\f14a"}*/
/*change fa-square-o to fa-check-o when tree node selected*/
.treeview .node-selected .icon:before {content: "\f046"}


.od-node-dirty {font-weight: bold !important;}

.od-node-read:before {font:normal normal normal 17px/1 FontAwesome; content:"\f06e"; width:24px; display: inline-block;}
.od-node-write:before {font:normal normal normal 17px/1 FontAwesome; content:"\f040"; width:24px; display: inline-block;}


/*i don't like italics*/
#modals .od-drive-tree .fancytree-title {font-style: normal;}


/*#site-settings|social - make addons more visible*/
.modal-dialog .input-group-addon i {
	font-size: 20px;
	min-width: 22px;
	display: inline-block;
}

/*add-on buttons next to each social icon - show active/inactive*/
#form-settings-site-social .input-group:not(.od-valid) i {opacity: .6;}
#form-settings-site-social .od-valid i {cursor: pointer;}



#tab-settings-site-developers.devcontent-expand-js #devcontent-js-container {
	width: 100%;
	position: absolute;
	z-index: 1000;
}

#tab-settings-site-developers.devcontent-expand-js #devcontent-js {
	min-height: 320px;
}


#modals textarea {resize:none;}

#modals textarea#textarea-markup {min-height: 100px;}

.resize-v, #modals textarea.resize-v {resize: vertical;}
.overflow-v {overflow-x: hidden; overflow-y: auto;}


/*#site-settings .modal-dialog {width:800px;}*/

#modals .nav-tabs {margin-bottom: 15px;}


.modal-prompt {
	white-space: pre-line;
	margin-bottom: 10px;
}

#od-modal-dialog-prompt form#dialog-list-form {
	max-height: 300px;
	overflow-y: scroll;
	margin-bottom: 0;
	display: none;
}

.modal-body[data-odmode="list"] form#dialog-list-form {display: block !important;}


.od-settings-imagepreview {height:160px; margin-bottom:20px; padding: 9px; display: inline-block;}
.od-settings-imagepreview img {max-height:100px; max-width:100%;}

/*.od-settings-imagepreview img:before {
	content: "\e020"; font-family: 'Glyphicons Halflings'; color: #f00; margin-right: 4px;
}*/

/*.od-imageremove {display: none;}*/
.od-settings-imagepreview .od-imageremove {
	/*display: block; */
	border-radius: 0 0 4px 4px;
}

.od-picker-mimetype{
	background-color: transparent;  
	background-repeat: no-repeat;
	width: 32px;
}


#od-modal-new-file h4.modal-title {
	background-repeat: no-repeat;
	padding-left: 32px;
	background-position: -5px -5px;
}

.type-new-document{background-image: url(/cdn/images/google/apps/docs-32.png);}
.type-new-spreadsheet{background-image: url(/cdn/images/google/apps/spreadsheets-32.png);}
.type-new-presentation{background-image: url(/cdn/images/google/apps/presentations-32.png);}
.type-new-drawing{background-image: url(/cdn/images/google/apps/drawings-32.png);}
.type-new-folder{background-image: url(/images/icons/folder.png?width=32);}


/*used for new breadcrumb bar create menu*/
[data-imgicon]:before {position: relative; top: 2px; margin-right: 5px;}
[data-imgicon="gapps-folder-16"]:before {content: url('/cdn/images/google/gstatic/docs/doclist/images/icon_11_collection_list.png');}
[data-imgicon="gapps-drawings-16"]:before {content: url('/cdn/images/google/apps/drawings-16.png');}
[data-imgicon="gapps-forms-16"]:before {content: url('/cdn/images/google/apps/forms-16.png');}
[data-imgicon="gapps-sheets-16"]:before {content: url('/cdn/images/google/apps/spreadsheets-16.png');}
[data-imgicon="gapps-docs-16"]:before {content: url('/cdn/images/google/apps/docs-16.png');}
[data-imgicon="gapps-slides-16"]:before {content: url('/cdn/images/google/apps/presentations-16.png');}



/*i'm sure 'ive tweaked a menu icon font somewhere else - relocate this when you find it*/
ul.dropdown-menu:not(.multiselect-container) i {font-size: 1.3em;}



/*--------------------------------------------------------------*/
/*validation - see dialogs.js*/
.has-error:after {
	position: absolute;
	right:20px;
	top: 1px;
	text-align: right;
	/*width: 100%;*/
	font-size: 10px;
	color: #a94442;
	z-index: 2;
	background-color: #fff;
}

.input-group.has-error:after {right:0;}

.has-error-required:after {content: "a value is required";}
.has-error-invalid-url:after {content: "not a valid URL";}
.has-error-invalid-email:after {content: "not a valid email address";}


/*--------------------------------------------------------------*/
/*new od*/


/*disabled cos didn't look right with floating navbar
.navbar>.container .navbar-brand {margin-left: 0px;}*/

/*bs page-header is too roomy for us*/
.page-header {margin-top: -15px; background-repeat: no-repeat;}

/*36,30,24,18,14,12
http://getbootstrap.com/css/#type
*/
/*h1 {font-size: 30px;}
h2 {font-size: 24px;}
h3 {font-size: 18px;}
h4 {font-size: 14px;}
h5 {font-size: 12px;}
h6 {font-size: 10px;}*/


/*make breadcrumb look more like subnav header*/
.od-breadcrumb-container{margin-bottom:20px;}
.breadcrumb {padding: 10px 15px; margin-bottom: 5px;}

/* body:not(.od-theme-slate) .breadcrumb {border: solid 1px #ddd;} */

.attach-crumbtrail button {
	background-color: #f5f5f5; 
	color: #666;
	min-width: 25px;
    box-sizing: content-box;
}

/*prevent individual li overflow with long folder/file names*/

#od-breadcrumb > li > a{
	line-height: 1.2;
	margin-bottom: -2px;
	overflow: hidden;
	display: inline-block; 
/*}
was limiting this to all except rightmost li, but can't because of issue below re dropmenu
#od-breadcrumb > li:not(:last-child) > a {*/
	max-width: 200px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/*this allows the overall breadcrumb to not wrap*/
/*however it stops tools dropmenu from working 
.od-breadcrumb-container {
	overflow: hidden;
 	white-space: nowrap;
}*/





/*#pageid-1 .breadcrumb {display: none;}*/


#footer {
	border-top: solid 1px #ddd;
	margin-top:5px;
	padding-top:5px;

	/*not sure what this was for
	display: flex;
    flex-direction: column;*/
}

/*stop footer collapsing inwards at xs*/
body[od-bs-width="xs"] #footer > .container {margin:0;}


#footer-inner {
	display: flex;
    flex-wrap: nowrap;
}

.credit.poweredby {
	white-space: nowrap;
	/*align-self: flex-end;*/
	margin-left: auto;
}

.credit.copyright {
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-right: 5px;
}


body[od-footer-valign="top"] 	#footer {justify-content: flex-start;}
body[od-footer-valign="middle"] #footer {justify-content: center;}
body[od-footer-valign="bottom"] #footer {justify-content: flex-end;}

#footer p {color: #999;} /*was .text-muted*/


body[od-footer-position="off"] #footer {display: none;}
body[od-footer-position="fixed"] footer {
	position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 999; /*more than most, but less than modals*/
	background: #fff; /*has to be something solid else stuff shows through*/
}



body[od-footer-height="medium"] #footer {height: 75px;}
body[od-footer-height="tall"] #footer {height: 100px;}



.footer-version-button {
	margin-left: 10px;
}


#main > .content{
	margin-top: 20px;
	margin-bottom: 35px;
}



/*social icons*/
.od-socialicons {
	text-align: right; 
	/*stop social icons from causing wasted v space
	margin-top: -18px;*/
}

.od-socialicons a {
	font-size: 25px;
	padding-left: 5px;
	color: #404142; /*#711371;*/
	opacity: 0.7;
}

.od-socialicons a:first-child {padding-left: 0;}



#od-brand {
	/*background: url(/images/logos/overdrive_h100.png) no-repeat left center;
	width: 150px;
	background-size: 110px;*/
	/*margin-right: 15px;*/

	padding: 0;
	margin-left: 0;

	/*quick stop clatter - only effective with small logos?*/
	/*min-width: 60px;*/

	height: inherit;
}

#od-brand img {
	/*height: 35px;*/

	/*better on xs?*/
	height: auto;
	max-height: 35px;

	/*margin-right: 15px;*/

	float: left;  /*for sitebadge in firefox*/
}


#od-brand img:not([src]) {
	display: none;
}


#od-brand #your-logo-here {
	padding: 6px 15px; 
	height: 34px;
	/*margin-left: -15px;*/
	/*margin-right: 10px;*/
	min-width: 100px;
	font-size: 70%;
    vertical-align: middle;
    display: table-cell;
    padding: 0px 10px;
    white-space: nowrap;
}


a#od-brand[data-length="0"] img {display: none;}
a#od-brand:not([data-length="0"]) #your-logo-here {display: none;}

/*.navbar-brand #your-logo-here:after {
	content: 'Click to change...';
	font-size: 60%;
}*/



/*--------------------------------------------------------------*/
/*site badge													*/
/*--------------------------------------------------------------*/

/*vertical align*/
body[od-sitebadge]:not([od-sitebadge=""]) #od-brand {
	display: flex;
	align-items: center;
  	justify-content: center;
}

#od-sitebadge {display: none;}

body[od-sitebadge]:not([od-sitebadge=""]) #od-sitebadge {
	display: flex;
	/*background-color: white;*/
	/*font-size: 1.0em;*/ /*1.8em for stacked?*/
	font-size: 1.8em; /*help http://local.site12003/ */
	/*border-radius: 100px;*/
	/*padding: 6px;*/
	margin-right: 10px;
	/*margin-top: -2px;*/
	/*border: dotted 2px #ccc;*/
	/*float: left;*/
	/*text-align: center;*/
	/*min-width: 40px;*/
}

#od-sitebadge[data-stack]:not([data-stack=""]) {
	font-size: 1.2em !important;
}


/*OV-1021 Help Site Badge on Mobile*/
/*@media(max-width:400px){
	
	body[od-sitebadge]:not([od-sitebadge=""]) #od-brand {
	  max-width: 200px;
	  width: 100%;
	  position:absolute;
	}

	#od-sitebadge {
	  margin-right: 6px;
	  min-width: 34px;
	  font-size: 1.0em;
	}

	body[od-sitebadge]:not([od-sitebadge=""]) #od-brand img {
	  max-width: 70%;
	  min-width: 100px;
	}
}*/



#od-pagebadge {
    margin-right: 10px;
    float: left;
    /*margin-top: -3px;*/
}

#od-pagebadge.stacked{
    /*margin-top: 1px;*/
    font-size: 20px;
}



/*.od-container > .navbar {padding-top: 25px;}
.navbar-header {margin-bottom: 20px;}*/


/*--------------------------------------------------------------*/
/*for showLoading												*/
/*--------------------------------------------------------------*/
#myLoader {
	top: 50%; 
	left: 60%; 
	z-index:9999;
	/*background: url('/images/icons/loading.gif') no-repeat center center;
	min-width: 40px;
	min-height: 40px;*/

	/*line up with datatables processing*/
	/*margin-top: 10px;*/
}

body[od-subnav-visible="0"] #myLoader {left: 50%;}

#myLoader i {font-size: 48px !important;}



/*--------------------------------------------------------------*/
/*general purpose loading spinner for inside initialising divs	*/
/*--------------------------------------------------------------*/
.show-loading > * {display: none;}

.show-loading:before {
	animation: fa-spin 2s infinite linear;
	content: "\f021";
	font:normal normal normal 3em FontAwesome;
	display: inline-block;

	position: absolute;
    left: 50%;
    top: 50%;
}



/*--------------------------------------------------------------*/
/*datatables*/
/*--------------------------------------------------------------*/
.od-dt-currency-gbp {text-align: right;}
*:not(th).od-dt-currency-gbp:before {content: "\00a3";}
.od-dt-nowrap {white-space: nowrap;}

/*.dataTable {table-layout: fixed;}*/

td.od-dt-nowrap {
	 overflow: hidden;
	 /*text-overflow: ellipsis; 
	 white-space: nowrap; */
}


/*hide the pointer when nothing to click*/
.dataTables_empty {cursor: default;}


.dataTables_filter .input-sm {font-size: inherit;}

.dataTables_length .input-sm{
  font-size: inherit;
  /*OV-690 - with body font bungee this select is illegible*/
  height: inherit;
  min-height: 28px;
  padding-top: inherit;
  padding-bottom: inherit;
}


/*length picker is excessively spacious*/
div.dataTables_length select {width: auto !important; padding: 5px 0 5px 5px;}

/*we might stick extra buttons in, but let's stop it from wrapping*/
.dataTables_length {white-space: nowrap;}

.dataTables_length a.btn {height: 30px;}


.dt-buttons > .btn {margin-left: 10px;}

.od-dt-btn-back {margin-right: 10px;}

/*make datatables-to-be look like the finished article, so there's less clatter*/
table.table-filtered:not(.dataTable) {
	margin-top: 60px;
	margin-bottom: 43px
}

/*table.table-filtered:not(.dataTable) thead > tr > th {
  padding-left: 8px;
  padding-right: 8px;
}
table.table-filtered:not(.dataTable) thead > tr > th:after {
  content: "\e150";
  float: right;
  font-family: 'Glyphicons Halflings';
  opacity: 0.2;
}*/

/*reset th's to look like bs original. don't need all the 'can' sort icons*/
table.table-filtered thead > tr > th {padding: 5px;}
table.table-filtered th.sorting:after {display: none;}

/*text right? sort left*/
table.dataTable thead th.textright.sorting_asc:after,
table.dataTable thead th.textright.sorting_desc:after {
	float: left;
	position: initial;
}


/*centre more simply*/
div.dataTables_processing{
  left: initial;
  margin: inherit;
  padding: inherit;

  font-size: 0;
  background: none;
}

/*turn into spinner - removed on OV-986*/
/*div.dataTables_processing:before {
  content: "\f021";
  font: normal normal normal 64px/1 FontAwesome;
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}

div.dataTables_wrapper.processing:before {
	content: "\f021";
	font: normal normal normal 48px/1 FontAwesome;
	-webkit-animation: fa-spin 2s infinite linear;
	animation: fa-spin 2s infinite linear;
	position: fixed;
	top: 50%;
	left: 60%;
	z-index: 100;
}*/

body[od-subnav-visible="0"] div.dataTables_wrapper.processing:before {left: 50%;}


div.dataTables_wrapper.processing table.dataTable {opacity: 0.5;}


.od-datatable-refresh.fa-spin {color: #FFBF00;}


/*put pager at same height as "showing 1 to x"*/
#od-datatable_info {float: left;}


/*for capsule plugin's totals footer*/
.od-dt-total-label {text-align:right;}
.od-datatable-total {text-align: right;}
.od-dt-total-below-info {margin-top: -10px}
button.od-datatable-total {float: right; margin-top: -8px; margin-right: -5px;}


/*match our sort arrows to drive/windows*/
table.dataTable thead .sorting:after {content: "";}
table.dataTable thead .sorting_asc:after {content: "\e093";}
table.dataTable thead .sorting_desc:after {content: "\e094";}


/*don't like dt's select whole-row-background styling so roll our own*/
table.dataTable td.select-checkbox {text-align: center; vertical-align: middle;}
table.dataTable td.select-checkbox:after {content: "\f096"; font: normal normal normal 16px/1 FontAwesome;}
table.dataTable tr.selected td.select-checkbox:after {content:'\f046';}

/*add a select-all checkbox to the thead*/
table.dataTable th.select-checkbox {text-align: center; vertical-align: middle; padding-right: 5px !important;}
table.dataTable th.select-checkbox:after {content: "\f096"; font: normal normal normal 16px/1 FontAwesome;}

table.dataTable td.deleteRow {text-align: center; vertical-align: middle;}
table.dataTable td.deleteRow:after {content: "\f00d"; font: normal normal normal 18px/1 FontAwesome; color: #900;}



table.dataTable tbody td > img{
    max-width: 100%;
    min-width: 16px;
    height: auto;
}


th.hide-title {font-size: 0;}
th.hide-title > i {font-size: initial;}


/*tone down pager when only one page*/
.dataTables_wrapper[od-pagecount="0"] .dataTables_paginate,
.dataTables_wrapper[od-pagecount="1"] .dataTables_paginate {opacity: 0.5;}

.dataTables_wrapper[od-ajax-records-total-gt5="false"] .dataTables_length {opacity: 0.5;}



/*----------------------------------------------------*/
/*don't like dt's bs styling for colvis - roll our own*/
/*----------------------------------------------------*/

/*hide colvis button's label*/
.buttons-colvis > span {display: none;}
/*replace with a table icon*/
.buttons-colvis:before {font:normal normal normal 17px/1 FontAwesome; content: "\f0ce"; /*fa-table*/}
/*line up with page size*/
.buttons-colvis {height: 28px; margin-top: -5px;}
.buttons-colvis > i.caret {margin: -5px -2px 0 3px;}


li.dt-button.buttons-columnVisibility a {
	background: #fff;
	color: #000;
	cursor: pointer;
}

li.dt-button.buttons-columnVisibility a:hover {
	background: #e8e8e8;
	color: #000;
}

li.dt-button.buttons-columnVisibility a:before {
	font:normal normal normal 17px/1 FontAwesome;
	content: "\f096"; /*fa-square-o*/
	margin-right: 7px;
	width: 20px;
    display: inline-block;
}

li.dt-button.buttons-columnVisibility.active a:before {content: "\f046"; /*fa-check-square-o*/}




/*datatables bootstrap doesn't know where we've moved our controls to, 
so we need to adjust alignments for mobile*/
div.dataTables_wrapper div.dataTables_length {text-align: left !important;}
div.dataTables_wrapper div.dataTables_filter {text-align: right; padding-left: 0;}
div.dataTables_wrapper div.dataTables_paginate {text-align: right;}

/*bs set fg's full-width below sm which isn't needed on our dt filters*/
.od-dt-controls .form-group {display: inline-block;}
/*similar with filter's search box*/
.od-dt-controls input[type="search"] {
	width: 100% !important;
	margin-left: inherit !important;
}

/*od-valign-c?*/
.od-dt-controls {display: flex; align-items: center;}


/*DT leaves fat right margins for sorting arrow, but it spoils th's with text-right*/
table.dataTable.table-condensed > thead > tr > th:not(.sorting_desc):not(.sorting_asc) {padding-right: 5px;}


.dataTables_info {float: left;}


/*hide until doControlsLayout/initComplete has fired*/
table.table-datatable:not([initialised="1"]) {display:none;}



/*--------------------------------------------------------------*/



.od-comments > div > iframe {
	margin-top: 10px;
	padding-top: 10px;
	border-top: solid 1px #eee;
}



.od-table-noborders td {border : none !important;}

/*keep h2 v aligned with image to the left 
	http://overdrive.refractiv.net/examples/project-workspaces/
*/
.od-table td h2:first-child {margin-top: 0;}
.panel h2:first-child {margin-top: 0;}


/*soften icons used in panel titles e.g. comments wall*/
.panel-title > i.fa {color: #666;}


/*i'm finding blue bg's on multiselect options a bit strong...*/
#page-settings .multiselect-container.dropdown-menu>.active>a {
	background: transparent; 
	color: black;
}


#selIntroClass {
	width:auto; 
	padding:0; 
	height:auto;
	margin-bottom: 0;
}

/*these don't work - unless add attribute "multiple" - which suggests future support
	$('#selIntroClass').attr('multiple','multiple')
*/
	/*give options more room to breathe
	#selIntroClass option {padding: 4px; margin: 10px; border: solid 2px #f00;}*/
	/*highlight selected option more clearly
	#selIntroClass option[selected="selected"] {color:white;}
	#selIntroClass option:before {content: "->";}*/



select.autogrow:not([size="1"]){
	overflow-y: hidden;
}

select.autogrow:not([size="1"]) option:empty{
	display: none;
}

/*OV-82*/
body[od-theme="paper"] .navbar-nav>li>.dropdown-menu {
margin-top: 0px;
}

.page-header.hasbg {min-height: 50px;}


/*https://github.com/thomaspark/bootswatch/issues/429*/
/*.modal-backdrop {z-index: auto !important;}*/


.modal-debug{
	float: left;
    font-family: monospace;
    width: 600px;
    font-size: 11px;
}


/*todo - move to plugin.css*/

.od-doc-document[data-mimetypeshort="google-apps.document"] {
	/*give docs some breathing space*/
	padding: 4px;
	/*border-radius: 4px;
  	border: solid 1px #ddd;*/
}



/*old sheet - stop grid's background from filling the page*/
.gdoccontents .ritz.grid-container {background-color: transparent;}
th.row-header.freezebar-origin-ltr:first-child {background-color: #eee;}


/*hide row and column headers on new sheets*/
table.waffle.noheadings th:first-child,
table.waffle.noheadings td.row-headers-background {display: none;}
/*head holds widths so has to remain on display*/
table.waffle.noheadings thead {visibility: hidden;}
table.waffle.noheadings thead th {height: 0px; font-size: 0;}
/*repair borders*/
table.waffle.noheadings td:nth-child(2) {border-left-width: 1px;}
table.waffle.noheadings tr:first-child td {border-top-width: 1px;}


/*if not preserving styling, let width be auto*/
.od-doc-document:not(.useembeddeddocstyles) .waffle.noheadings {width: inherit;}
.od-doc-document:not(.useembeddeddocstyles) .waffle.noheadings thead {display: none;}

/*old sheets*/
table.tblGenFixed.noheadings tr:first-child {display: none;}
table.tblGenFixed.noheadings td:first-child {display: none;}



.btn-wide {min-width: 80px;}


.ss-q-help, .ss-secondary-text {font-weight: normal;}
.od-contenttype-form li label {font-weight: normal;}
.od-contenttype-form li {list-style-type: none;}
.ss-form-entry {margin-top:10px; margin-bottom: 20px;}
.ss-password-warning, .required-message {display: none;}
.ss-secondary-text {color: #999;}
ul.ss-choices {margin-top: 5px;}


/*------------------------------------------*/
/*move to /bespoke/plugins/drive/plugin.css */
#od-embed-options-drive:not([data-odmimetypeshort="google-apps.spreadsheet"]) .odp-drv-for-mime-spreadsheet{
	display: none;
}
#od-embed-options-drive:not([data-odmimetypeshort="google-apps.document"]) .odp-drv-for-mime-document{
	display: none;
}


/*picker's LH add-on - show drive icon before anything picked*/
.od-picker-mimetype {
	background-image: url(/cdn/images/google/apps/drive-32.png);
	/*opacity: 0.5;*/
}

*[data-odpickerpicked_mimetypeshort="google-apps.document"] .input-group-addon.od-picker-mimetype {
	background-image: url(/cdn/images/google/apps/docs-32.png);
}

*[data-odpickerpicked_mimetypeshort="google-apps.spreadsheet"] .input-group-addon.od-picker-mimetype {
	background-image: url(/cdn/images/google/apps/spreadsheets-32.png);
}


.gdoccontents table:not(.table-wide) {width: auto;}
/*OV-434 - make sure sheets styling doesn't override with width:0*/
.gdoccontents table.table-wide {width: 100%;}
/*OV-434 - make sure sheets styling doesn't block the bootstrap border*/
.gdoccontents table.table-bordered {border-style: solid;}


/*------------------------------------------*/

body.od-loading #od-sitepickers {visibility: hidden;}

.od-site-pickers {margin: 0px 15px; white-space: nowrap; min-width: 90px;}
.od-site-pickers select {padding: 2px 4px;}


/*multiselect*/
.od-site-pickers .od-multiselect-wide {width: 200px;}

.navbar .od-site-pickers > label {display: none;}
.navbar .od-multiselect-wide {float:left; width: inherit; padding-top: 10px;}

/*remove rounded corners when used in input group*/
.input-group > .btn-group.od-multiselect-wide > button {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}


/*------------------------------------------*/
/*helper classes*/
.line-through {text-decoration:line-through;}

.od-ellipsis {
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.pl0 {padding-left: 0px !important;}
.pt30 {padding-top: 30px !important;}
.ml-15 {margin-left: -15px !important;}

/*------------------------------------------*/

.od-pagehelper {
    margin: 50px 0;
    text-align: center;
}

.od-pagehelper > div {
    padding: 15px 0;
    opacity: .6;
    background-color: #f8f8f8;
    border-radius: 5px;
    border: solid 1px #e7e7e7;
    cursor: pointer;
    white-space: nowrap;
}

.od-pagehelper span {
	border-radius: 5px;
    border: solid 1px #ccc;
    margin: 0 5px;
    padding: 5px 8px;
}


/*hide empty images for firefox/ie*/
img[src=""] {display: none;}


.od-menu-chk {display: none;}

.nav .dropdown-header {text-transform: uppercase;}



.modal#data-view td {text-align: left !important; display: table-cell;}



#tab-page-settings-embed .od-embed-options > fieldset {margin-bottom: 20px;}
#tab-page-settings-embed .od-embed-options > fieldset > legend {font-size: 110%; font-weight: bold;}
/*#tab-page-settings-embed .od-embed-options > fieldset label {font-weight: normal;}*/


#od-plugin-beta-badge {padding: 3px 12px;}
/*body:not([od-plugin-release="beta"]) #od-plugin-beta-badge {display: none;}*/


/*rt#37334,33061 settings dialog - reduce tab wrapping*/
@media (max-width: 767px){

	.modal-lg .nav-tabs>li>a{
		padding: 6px 9px!important;
		margin-right:0px!important;
		font-size: 85%;
	}
	
	
	/*same for main labels*/

	#od-modal-site-settings .form-horizontal > .form-group > .od-label.control-label{
		font-size: 85%;
		padding-right: 0;
	}

}


/*rt#33061 keep modal-lg large on smaller screens (default stops at 992)*/
@media (max-width: 992px){
	.modal-lg {
	    width: auto;
	    margin: 10px;
	}
}


/*body {
    background-image: url("e:\scraps\images\chicago.png");
    background-size: 100%;
    background-repeat: no-repeat;
}*/


/*scale banner down at xs ?*/
@media (max-width: 768px){
	/*.page-header h1 {font-size: 20px!important;}*/
	.page-header {background-size: auto 70%!important;}
}


/*.attach-crumbtrail{
	position: absolute;
}*/






/*utility classes*/
.notbold {font-weight: normal !important;}


/*
body.template-sbadmin nav.navbar {margin-bottom: 0;}
body.template-sbadmin a.navbar-brand {padding: 7px 15px;}



.subnav li:hover > ul,
	.subnav li:hover > ul.collapse{
	  display: block !important;
	  height: auto !important;
	  z-index: 1000;
	  background: #444;
    visibility: visible;
	}*/

/*this prob needs to apply just to floating nav*/
body[od-topnav-position="floating"] .od-banner {margin-top:20px;}


/*.od-banner {margin-bottom: 20px;}*/ /*padding-top: 10px;}
.od-banner h1 {margin:0 15px;}*/
.od-banner .page-header {margin:0; border-bottom: none;}

body[od-banner-height="off"] .od-banner {display: none;}
body[od-banner-position="off"] .od-banner {display: none;}

/*these are min-height to allow long titles to wrap*/
body[od-banner-height="short"] .od-banner {min-height: 60px;}
body[od-banner-height="medium"] .od-banner {min-height: 100px; /*padding-top: 30px;*/}
body[od-banner-height="tall"] .od-banner {min-height: 200px; /*padding-top: 80px;*/}
/*body[theme-bannersize="very-tall"] .od-banner {min-height: 250px; padding-top: 100px;}*/




/*body[od-topnav-halign="off"] #od-topnav {display: none;}*/
body[od-topnav-halign="right"] #od-topnav {float: right; margin-right: 20px;}

/*body[theme-topnav-height="medium"] #od-navbar {padding: 35px 0;}
body[theme-topnav-height="tall"] #od-navbar {padding-top: 120px;}*/



/*body[od-topnav-height="medium"][od-topnav-valign="top"] #od-navbar > * {margin-top: 0px; margin-bottom: 50px;}
body[od-topnav-height="medium"][od-topnav-valign="middle"] #od-navbar > * {margin-top: 25px; margin-bottom: 25px;}
body[od-topnav-height="medium"][od-topnav-valign="bottom"] #od-navbar > * {margin-top: 50px; margin-bottom: 0px;}

body[od-topnav-height="tall"][od-topnav-valign="top"] #od-navbar > * {margin-top: 0px; margin-bottom: 100px;}
body[od-topnav-height="tall"][od-topnav-valign="middle"] #od-navbar > * {margin-top: 50px; margin-bottom: 50px;}
body[od-topnav-height="tall"][od-topnav-valign="bottom"] #od-navbar > * {margin-top: 100px; margin-bottom: 0px;}*/

body[od-topnav-height="short"] .od-nav-flex-v {height: 50px;}
body[od-topnav-height="medium"] .od-nav-flex-v {height: 100px;}
body[od-topnav-height="tall"] .od-nav-flex-v {height: 150px;}

.od-nav-flex-v {
    display: flex;
    flex-direction: column;
    /*z-index: 1;*/ /*this causes od-usermenu to sit behind footer and folder pagination*/
}

body[od-topnav-valign="top"] .od-nav-flex-v {justify-content: flex-start;}
body[od-topnav-valign="middle"] .od-nav-flex-v {justify-content: center;}
body[od-topnav-valign="bottom"] .od-nav-flex-v {justify-content: flex-end;}


/*adjust body top padding to suit topnav position setting*/
body {padding-top: 20px;} /*floating*/
body[od-topnav-position="static"] {padding-top: 0px;}

/*allow banner to just touch static nav*/
body[od-topnav-position="static"] .navbar {margin-bottom: 0;}
/*nav equidistant between page top and banner*/
body[od-topnav-position="floating"] .navbar {margin-bottom: 0;}


body[od-topnav-position="fixed"] 							{padding-top: 50px;}
body[od-topnav-position="fixed"][od-topnav-height="medium"] {padding-top: 100px;}
body[od-topnav-position="fixed"][od-topnav-height="tall"] 	{padding-top: 150px;}

/*body[od-banner-height="off"][od-topnav-position="fixed"] 							{padding-top: 70px;}
body[od-banner-height="off"][od-topnav-position="fixed"][od-topnav-height="medium"] {padding-top: 120px;}
body[od-banner-height="off"][od-topnav-position="fixed"][od-topnav-height="tall"] 	{padding-top: 170px;}*/


/*just for site settings interactivity, hide TOP nav levels according to setting*/
body[od-topnav-depth="0"] #od-topnav li[data-level="0"] > ul {display: none;}
body[od-topnav-depth="0"] #od-topnav li[data-level="0"] a:before {display: none;}
body[od-topnav-depth="1"] #od-topnav li[data-level="1"] > ul {display: none;}
body[od-topnav-depth="1"] #od-topnav li[data-level="1"] a:before {display: none;}
body[od-topnav-depth="2"] #od-topnav li[data-level="2"] > ul {display: none;}
body[od-topnav-depth="2"] #od-topnav li[data-level="2"] a:before {display: none;}
body[od-topnav-depth="3"] #od-topnav li[data-level="3"] > ul {display: none;}
body[od-topnav-depth="3"] #od-topnav li[data-level="3"] a:before {display: none;}


/*just for site settings interactivity, hide SUB nav levels according to setting*/
body[od-subnav-depth="0"] #od-subnav li[data-level="0"] > ul {display: none;}
body[od-subnav-depth="0"] #od-subnav li[data-level="0"] .caret-right {display: none;}
body[od-subnav-depth="1"] #od-subnav li[data-level="1"] > ul {display: none;}
body[od-subnav-depth="1"] #od-subnav li[data-level="1"] .caret-right {display: none;}
body[od-subnav-depth="2"] #od-subnav li[data-level="2"] > ul {display: none;}
body[od-subnav-depth="2"] #od-subnav li[data-level="2"] .caret-right {display: none;}
body[od-subnav-depth="3"] #od-subnav li[data-level="3"] > ul {display: none;}
body[od-subnav-depth="4"] #od-subnav li[data-level="3"] .caret-right {display: none;}



/*OV-970 Site layout : full width*/
body[od-page-width="full"] .container {width: 100%;}


/*OV-1006 - this approach would get too complex so sticking with js (subnavHeight)
body[od-footer-position="fixed"][od-topnav-height="short"] #od-subnav {height: calc(100vh - 240px);}*/

/*don't show home in subnav when on home itself, unless from root*/
body#pageid-1:not([od-subnav-fromroot="1"]) #od-subnav-menu #drop-node-1 {display: none;}


/*not sure why this is needed, now that we've got containers supposedly correct*/
/*body[od-topnav-position="fixed"] #od-nav-container-inner {padding-left: 7px; padding-right: 23px;}*/
/*body.modal-open {overflow: auto !important;}*/


/*vertical align*/
.od-banner {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.page-header h1 {margin:0;}

/*this needed to keep h1 on left, and search on right at xs*/
/*body[od-bs-width="xs"] .od-banner > .container {margin: initial;}*/
@media (max-width: 768px) {.od-banner > .container {margin: initial;}}

/*same as above - stop centering at sm/xs*/
/*body[od-bs-width="xs"] #od-nav-container-inner {margin: initial;}*/
@media (max-width: 768px) {#od-nav-container-inner {margin: initial; width: 100%;}}



/*this seems to stop floating navbar touching sides on mobile*/
/*body[od-navbar="floating"][od-bs-width="xs"] #od-navbar {margin: 0 15px;}*/

/*related to above*/
/*#od-navbar {padding: 0;}*/

/*this stops cog floating off the RH end of navbar*/
/*body[od-navbar="floating"] #od-navbar > div.container {width:auto;}*/


/*counter the removal of class navbar-nav from od-nav-account-body, which was let it expand outside of #od-navbar*/
#od-nav-account-body > ul {right:0; left:auto;}


.sidenav {margin-top: -20px;}


/*site settings > social > hdr/ftr*/
.input-group-addon > input[type="checkbox"] {width:17px; height: 17px;}

/*user settings > edit user*/
.has-odicon input {float: left; margin-right: 7px; position: relative; top: -1px;}

label.radio-inline input[type="checkbox"] {
	width:17px; 
	height: 17px;
    position: relative;
    top: 2px;
}


/*subnav docked left*/
body[od-layout-subnav-position="docked-left"] .col-secondary {
	border-right: 1px solid #e7e7e7;
	min-height: 500px;
	padding-right: 0;
}

body[od-layout-subnav-position="docked-left"] .col-primary {padding-right: 30px;}

body[od-layout-subnav-position="docked-left"] div.sidenav > ul:first-child > li {
	border-bottom: 1px solid #e7e7e7;
	padding: 8px;
}



body[od-page-show-breadcrumb="0"] #od-breadcrumb, body[od-page-show-breadcrumb="0"] .od-breadcrumb-container {display: none;}
body[od-page-show-subnav="0"] #od-col-subnav {display: none;}


#tab-settings-site-developers textarea {font-family: monospace;}


 
/*a#user-menu-button i {font-size: 2em; line-height: 20px !important;}*/
a#user-menu-button {/*margin-top: 4px;*/ display: inline-block;/*padding:2px; */ /*color: #777;*/}
/*a#user-menu-button:hover {background-color: rgba(0,0,0,0.075)!important;}*/




#od-search-button i {font-size: 1.2em;}


/*#od-nav-collapse li {clear: left;}
#od-nav-collapse #od-topnav {float: none; margin-right: 0px;}*/


/*#navbar-collapse.in #od-topnav a {color: #777 !important;}

#navbar-collapse.collapsing #od-topnav {display: none;}
#navbar-collapse {border: none;}*/

/*#navbar-collapse.in #od-topnav {*/




.od-navbar-button {
    border: 1px solid transparent;
    border-radius: 4px;
    height: 34px;
    width: 34px;
    background-color: rgba(0,0,0,.1);
    text-align: center;
    padding: 6px 6px;
    cursor: pointer;
}

.od-navbar-button:hover {background-color: rgba(0,0,0,0.075)!important;}

.od-navbar-button i {
    /*color: #444444;*/
    font-size: 1.4em;
    background-color: transparent;
}


#user-signin-button {width: inherit;}


.od-dt-controls .form-control {z-index: inherit;}

#od-nav-collapse-button {display: none;}

/*@media (max-width: 768px) {
	#od-nav-collapse-body > ul {display: none;}
	#od-nav-collapse-button {display: inline-block; margin-right: 15px;}
}*/

	
body:not([od-nav-collapsed]) #od-nav-container #od-topnav {visibility: hidden;}
body[od-nav-collapsed="1"] #od-nav-container #od-topnav {display: none;}
body[od-nav-collapsed="1"] #od-nav-collapse-button {display: inline-block; margin-right: 15px;}
body[od-bs-width="xs"] #od-nav-collapse-button {margin-right: 7px;}


/*body[od-topnav-position="floating"] #od-nav-collapse {margin-left: 15px;}*/
/*body:not([od-topnav-position="floating"]) #od-nav-collapse-body {margin-left: -15px;}*/

/*#od-nav-collapse-body.od-open a {color: #777 !important;}
#od-nav-collapse-body.od-open {
	position: absolute;
	top: 45px;
    left: 0;
    margin-left: 15px !important;
}

#od-nav-collapse-body.od-open > ul#od-topnav {
	height: inherit;
	display: inline-block !important;
	background-color: #fff !important;
	
    min-width: 160px;
    padding: 5px 0;
    margin: -2px 0 0;

	border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

#od-nav-collapse-body.od-open > ul#od-topnav > li {float: none;}*/


#od-nav-collapse-dropdown > ul#od-topnav {
	display: block !important;
	font-size: inherit !important;
}

/*OV-1008 - Topnav collapsed : vertical overflow*/
/* not working properly yet
#od-nav-collapse-dropdown > ul#od-topnav {
	overflow-y: auto;
	max-height: 85vh;
}*/


#od-nav-collapse-dropdown > ul#od-topnav ul.dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: -6px;
	margin-left: -1px;
}


#od-nav-container #od-nav-collapse-body #od-topnav {
	height: 50px;
}

/*OV-718 Menu in IE11 and Safari switches to mobile even when it should fit screen*/
#od-topnav > li {display: flex;}


/*#od-nav-collapse-body.open ul.dropdown-menu {left: 140px; top:0;}*/


/*a#od-search-collapse-button i {font-size: 1.2em;}
#od-search-collapse-body {
	width: 175px;
	position:fixed; 
	right: 115px;
	z-index: 1500;
}*/


/*moved from login-required.html - hide all nav when logged out*/
body.pg-0:not([od-ss-pa="1"]) #od-searchform,
body.pg-0:not([od-ss-pa="1"]) .od-breadcrumb-container, 
body.pg-0:not([od-ss-pa="1"]) .cms-helptext, 
body.pg-0:not([od-ss-pa="1"]) .cms-content, 
body.pg-0:not([od-ss-pa="1"]) #od-nav-collapse, 
body.pg-0:not([od-ss-pa="1"]) #od-nav-collapse-body, 
body.pg-0:not([od-ss-pa="1"]) .col-subnav,
body.pg-0:not([od-ss-pa="1"]) #od-navbar button.navbar-toggle 
{display: none !important;}

/*body.pg-0 h1 {visibility: hidden;}*/





#od-usermenu {padding-left: 15px;}
body[od-bs-width="xs"] #od-usermenu {padding-left: 7px;}


/*#od-usermenu > ul {margin-right: 0 !important;}*/

	
/*------------------------------------------*/
/*live search form							*/
/*------------------------------------------*/

#od-searchform {display: none; position: relative;}
body[od-searchbox-position="topnav-right"] #od-searchform-navbar #od-searchform {
	display: table; /*this needed to keep inline when opened*/
	float: right;
}

body[od-searchbox-position="banner-right"] #od-pageheader #od-searchform {
	/*display: flex;*/
	display: table; /*this needed to keep inline when opened*/
	float: right;
	margin-top: 5px;
}


#od-searchform input.form-control {width: 115px !important; display: none;}
#od-searchform.open input {display: inline-block; /*margin-left: -114px;*/}


#od-searchform:not(.open) #od-searchform-results, 
#od-searchform-results[data-results="0"] 
	{display: none;}

#od-searchform-results {
	right: 0;
	left: auto;
	padding: 10px 7px;
    line-height: 2;
    min-width: 200px;    
    max-width: 300px;    
}

#od-searchform-results a {
	display: block;
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}



#od-searchform-results-more {
	font-weight: bold;
    border-top: dotted 1px #ccc;
    text-align: right;
    margin-top: 5px;
    padding-top: 5px;
}


#od-nav-container-inner {}
.od-navbar-header {display: flex; }

body[od-topnav-position="floating"] #od-nav-container-inner {width: 100%; padding: 0 7px 0 15px;}
body[od-topnav-position="floating"][od-bs-width="xs"] #od-nav-container-inner {padding-left: 7px;}

#od-navbar-header-group-1, #od-navbar-header-group-2, #od-navbar-header-group-3
{/*display: table-cell; vertical-align:top;*/}

#od-navbar-header-group-1 {/*padding-top: 8px;*/}
#od-navbar-header-group-2 {flex-grow: 1; padding-left: 15px;}
body[od-nav-collapsed="1"] #od-navbar-header-group-2 {padding-left: 0;}

#od-navbar-header-group-3 {display: flex; flex-wrap:nowrap; text-align: right; /*padding-top: 8px;*/}

/*body[od-topnav-position="floating"] #od-navbar-header-group-3 {padding-right: 8px; width: 95px;}*/


/*#od-navbar-header-group-3 > * {float: right;}*/



/*#od-topnav {height: 50px; overflow: hidden; white-space: nowrap;}*/

#od-nav-container-test{
    position: absolute;
    opacity: 0;
    visibility: hidden;
    z-index: 2000;
}

#od-nav-container-test #od-topnav{width: 100%;}


/*when drag dialog to left or right edge of screen, make it slide off rather than squash up...*/
/*2.10 realised not worked for ages since .od-draggable moved down to .modal-dialog, so disabling
.modal.od-draggable {right: inherit;}
*/

/*scrollbar visible on edituser*/
/*2.10 realised not worked for ages since .od-draggable moved down to .modal-dialog, so disabling
.modal.od-draggable {overflow: hidden;}
*/

/*remove default 30px margin*/
.modal-dialog.od-draggable {margin-top: 0; margin-bottom: 0;}


/*xs devices - modals go full screen*/
.fullscreen .modal-content{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100%;
	z-index: 1099;
	border-radius: 0;
}


/*make room for left tabs*/
body[od-bs-width="xs"] #od-modal-site-settings.fullscreen .modal-body{
	padding: 15px 0;
}


body[od-bs-width="xs"] #od-modal-site-settings.fullscreen .modal-body > .od-settings-navtabs-container,
body[od-bs-width="xs"] #od-modal-site-settings.fullscreen .modal-body > .od-settings-tabcontents-container
{
	padding-left: 0;
}



/*------------------------------------------------*/
/*usman changes originally in theme/plugin.css	  */
/*------------------------------------------------*/

/* Transparent background for selcted/focused/hovered menu item  */
/*.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
    color: #555;
    background-color: rgba(0,0,0,0.075)!important;
}*/

/* Transparent background for active table cell to use selected color  */
/*.table>tbody>tr.active>td, .table>tbody>tr.active>th, .table>tbody>tr>td.active, .table>tbody>tr>th.active, .table>tfoot>tr.active>td, .table>tfoot>tr.active>th, .table>tfoot>tr>td.active, .table>tfoot>tr>th.active, .table>thead>tr.active>td, .table>thead>tr.active>th, .table>thead>tr>td.active, .table>thead>tr>th.active
{
	background-color:transparent!important;
}*/



/* Change all inputs placeholder color for all vendor prefixes  */
/*.od-container .form-control::-webkit-input-placeholder {color: #222!important;}*/ /* Chrome */
/*.od-container .form-control:-ms-input-placeholder {color: #222!important;}*/ /* IE 10+ */
/*.od-container .form-control::-moz-placeholder {color: #222!important; opacity: 1;}*/ /* Firefox 19+ */
/*.od-container .form-control:-moz-placeholder {color: #222!important; opacity: 1;}*/ /* Firefox 4 - 18 */
  
/*------------------------------------------------*/

.btn-file {
    position: relative;
    overflow: hidden;
}

.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: pointer;
    display: block;
}



/*bs disabled doesn't look obvious enough imho*/
label.disabled {color: #aaa;}




/*#od-modal-user-settings .modal-footer {
	position: fixed;
	bottom: 0;
	width: 100%;
}*/


#od-modal-user-settings-add,
#od-modal-user-settings-edit,
#od-modal-user-settings-alert {z-index: 1100;}

/*our language string tooltips have line breaks in them*/
.tooltip-inner {white-space: pre-line;}

#od-plugin-options-header {
	font-size: 130%;
	font-weight: bold;
    box-shadow: #666 2px 2px 8px;
    padding: 6px 10px;
    margin-bottom: 15px;
    color: #fff;
    background-color: #666;
}

#od-plugin-options-icon {
	float: right;
    height: 27px;
    width: 50px;
    margin: 4px 8px 0 0;
    
    background-position: center right;
    background-repeat: no-repeat;
    background-size: contain;
}


#od-plugin-options-icon span.od-page-icon{
    font-size: 1.8em;
    margin-top: -2px;
    margin-right: 2px;
    float: right;
    color: white;
}


#input-contenttype {border-radius: 0; margin-bottom: 10px;}


/*while on OV-1072 - Site Setting - more draggable area - decided to lock button to bottom of screen*/
#od-modal-site-settings.fullscreen .modal-footer {
	position: fixed;
    bottom: 0;
    width: 100%;
}
/*Apply default values for theme*/
.od-theme-inherit-borders-border-width, body:not(.od-theme-slate) .breadcrumb {
	border:0px;
}
.od-theme-inherit-borders-radius{
	border-radius:0px;
}
.od-theme-inherit-borders-background-color, .od-theme-inherit-borders-background-color.panel-default>.panel-heading {
	background-color: transparent;
}
/*Remove border top for top nav position fixed*/
body[od-topnav-position="fixed"] .od-container #od-navbar,
body[od-topnav-position="static"] .od-container #od-navbar{
	border-top:0px!important;
}
.od-container .col-subnav .panel > .panel-heading {
    border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}