html, body , form {
    height: 100%;
}

/************************************************/
/*												*/
/* Bootstrap styles overridden for UFL			*/
/*												*/
/************************************************/
.navbar-header.ufl-header-logo-text {
    margin-left: 10px;
    margin-top: 9px;
}
.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
    margin-left: 10px;		/* standard is -15px */
}
.navbar-brand.uflbrandpad {	padding: 0;}
#uflReaderNav, #uflSearchNav, #uflCategoryNav, #uflBookReaderNav  { border-color: #003B69; background-color: #003B69; }
#uflReaderNav, #uflCategoryNav { height: 59px; padding: 7px 0; }
#uflBookReaderNav { height: 59px; padding: 7px 0 7px 10px; }
#uflCategoryNav, #uflSearchNav { border-top:1px solid #888;}
#uflSearchNav { padding: 15px 10px 4px; }		/* auto height - bottom pad shorter since paragraphs already have bottom pad */
#uflSearchNav p { color:#FFF; }
#uflCreateNav { border-color: #ED8B00; background-color: #ED8B00; }

.navbar-default.uflFooter.smallFooter { height: 44px; min-height:44px; border:none; } /* small footer for book */

.list-group-item.active { font-weight: bold; }
.list-group-item.disabled, .list-group-item.disabled:hover, .list-group-item.disabled:focus { cursor: default; }
.list-group-item.uflClose { padding: 0; min-height: 34px; }

.list-group-item.ufl-dlg {
    background-color:transparent;
    border-color:transparent;
}
.list-group-item.ufl-dlg.active {
    font-weight: bold;
}
.list-group-item.ufl-dlg:hover {
    color: #003B69;
    font-weight: bold;
    cursor: pointer;
    background-color:#CCC;
    border-color:#CCC;
}
.list-group-item.ufl-dlg.active:hover {
    color:#00AED8;
}


#uiLangList, #nLangList, #wLangList  {
    margin-bottom:0;    /* override standard list-group's standard 20 */
}
.modal-body.lang-dlg-section-ui {
    border-top:1px solid #e5e5e5;
    text-align:center;
}

.btn { font-weight: bold; text-decoration: none; }
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active,
.btn-primary:active:hover, .btn-primary.active:hover, .btn-primary:active:focus, .btn-primary.active:focus, .btn-primary.focus:active, .btn-primary.focus.active  { background-color: #00AED8; border-color: #00AED8; color:#FFF; }

.btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active,
.btn-info:active:hover, .btn-info.active:hover, .btn-info:active:focus, .btn-info.active:focus,
.btn-info.focus:active, .btn-info.focus.active { background-color: #003B69; border-color: #003B69; color:#00AED8; }

.open > .dropdown-toggle.btn-info,
.open > .dropdown-toggle.btn-info:hover,
.open > .dropdown-toggle.btn-info:focus,
.open > .dropdown-toggle.btn-info.focus,
.open > .dropdown-toggle.btn-info:active,
.open > .dropdown-toggle.btn-info.active,
.open > .dropdown-toggle.btn-info:active:hover,
.open > .dropdown-toggle.btn-info.active:hover,
.open > .dropdown-toggle.btn-info:active:focus,
.open > .dropdown-toggle.btn-info.active:focus,
.open > .dropdown-toggle.btn-info.focus:active,
.open > .dropdown-toggle.btn-info.focus.active {
    background-color: #003B69;
	border-color: #003B69;
	color:#00AED8;
}

a { text-decoration: underline; }	/* base style adjusted. Specific needs have to override */
.dropdown-menu > li > a, a.list-group-item { text-decoration: none; }

h1, h2, h3, h4, h5, h6 { font-weight:bold;}	/* all headers are bold by default for us */
h5 { margin-top: 20px; margin-bottom:2px; }	/* default is 11/11 */

.col-xs-12.fingerOffset { padding-left:44px; padding-right:44px; }      /* provide extra padding for finger scrolling the lang dialog */


/************************************************/
/*												*/
/* Bootstrap items changed by reader.css that   */
/* we need classes to fix. Once reader.css is   */
/* deprecated we should be able to remove these	*/
/*												*/
/************************************************/
a.btn-primary { color: #003B69; }	/* needed since 'a' is defined differently in reader.css - once that is gone this can be removed */
a.btn { color: #000; }	/* needed since 'a' is defined differently in reader.css - once that is gone this can be removed */

/************************************************/
/*												*/
/* Bootstrap styles overridden for UFL			*/
/* in specific circumstances                    */
/*												*/
/************************************************/
.container-fluid.container-fluid-ufl-no-right-pad { padding-right: 0; }			/* override for the category holder */

.ufl-share-btn.btn {	/* make the share icon larger in the button */
	padding: 0 12px;	/* normally 6 12 */
	font-size: 24px;	/* normally 16 */
}

/* 	allow dropdown menu on 1st navbar to show up in front of 2nd navbar.
	https://github.com/twbs/bootstrap/issues/10229
*/
#uflReaderNav.navbar-static-top, #uflSearchNav.navbar-static-top, #uflCategoryNav.navbar-static-top, #uflBookReaderNav.navbar-static-top { z-index:auto; }


/************************************************/
/*												*/
/* UFL styles to extend what bootstrap provides */
/*												*/
/************************************************/

/************************************************/
/*  Categories in book and lib                  */
/************************************************/
.uflMenuStdIcons {
  position: relative;
  height: 44px;
  float: left;
  padding: 0 10px 0 54px;
}

.nav-right-border { border-right: 2px solid white; }

.uflMenuStdIcons:hover .uflNarrationIcon {
  background-position: -88px -88px;
}

.uflLabelMenu, .uflLabelColName {
	position: relative;
	top: 12px;
	line-height: 20px;
	font-size: 16px;
	font-weight:bold;
}
.uflLabelColName {
    color: #FFF;
    left: 10px;
}

.uflNarrationIcon {
	position: absolute;
	top: 0;
	left: 0;
	width: 44px;
    background: url("/images/uflsprite.png?v=51397234t3") -88px -44px;
}

.uflNavCarouselWrapper {
	height: 100%;
	overflow:hidden;
	right: 0;
	position: relative;
	padding: 0 25px;
}

.urlReturnArrow {
	position: relative;
	height: 36px;
	left: 10px;
	float: left;
	color: #FFF;
	padding: 11px 0 0 46px;
	background: url('/images/uflsprite.png?v=51397234t3') no-repeat -205px -86px;
}
.urlReturnArrow:hover {
	background-position: -205px -158px;
	cursor: pointer;
}
.urlReturnArrow:hover  a, a.urlReturnArrow:hover, a.urlReturnArrow:focus {
	color: #00AED8;
}
a.urlReturnArrow {
	position: relative;
	font-weight:bold;
	text-decoration: none;
}


.uflNarrIconMenu {
	position: relative;
	height: 44px;
	width: 44px;
	left: 10px;
	float: left;
	color: #FFF;
	padding: 11px 0 0 46px;
        background: url("/images/uflsprite.png?v=51397234t3") -88px -44px;
}
.uflNarrIconMenu:hover {
        background-position: -88px -88px;
	cursor: pointer;
}

.uflNarrIconMenu:hover  a, a.urlReturnArrow:hover, a.urlReturnArrow:focus {
	color: #00AED8;
}

a.uflNarrIconMenu {
	position: relative;
	font-weight:bold;
	text-decoration: none;
}


/************************************************/
/*  Home page                                  */
/************************************************/
.collection-item { margin-bottom:18px; }
@media ( min-width: 480px )  {
    .collection-item { margin-bottom:20px; }
}

a.collectionLink, a.collectionLink:hover {color: #000; text-decoration: none;}
a.collectionLink:hover { cursor: pointer; }

/************************************************/
/*  Collection popup from home page             */
/************************************************/
.modal-dialog.ufl-lib-modal { width: 90%; margin-left:auto; margin-right:auto; } /* marging make it center on all sizes. bootstrap doesn't normally center on small screens */
.modal-content.ufl-lib-modal { background: #FFF url("/images/wood.jpg?v=51397234t3") repeat; }

.modal-backdrop.in.darker {
    opacity: .8;
    filter: alpha(opacity=80);
}

#uflLibraryModal .close { font-size: 36px; opacity: .5; }
#uflLibraryModal .close:hover, #uflLibraryModal .close:focus { font-size: 36px; opacity: .8; }
#uflLibraryModal .modal-header { border-bottom: none; }


/************************************************/
/* Header										*/
/************************************************/
.uflHeaderIcon { height: 44px; }
.uflHeaderIcon:hover { cursor: pointer; }

.uflshortlogo {	width: 45px; background: url("/images/uflsprite.png?v=51397234t3") -176px -44px; }
.ufllonglogo { width: 240px; background: url("/images/uflsprite.png?v=51397234t3") 0 0; }


/************************************************/
/* Footer										*/
/************************************************/
.uflFooter, .uflFooter a, .uflFooter a:hover, .uflFooter, .uflFooter a { color: #fff; }
.uflFooter, .uflFooter a, .uflFooter, .uflFooter a { text-decoration:none; }
.uflFooter a.underline, .uflFooter a:hover { text-decoration:underline; }
.uflFooter ul {list-style:none;margin:0;padding:0;}
.uflFooter .fa {font-size: 24px;}
.fa-facebook-official {color:#3b589c;}
.fa-pinterest {color:#cc3b2b;}
.fa-rss-square {color:#444;}
.fa-envelope {color:#003B69;}
.fa-instagram {
  color: transparent;
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  background-clip: text;
  -webkit-background-clip: text;
}
#uflLinkSocialTW .fa-twitter {color:#1DA1F2;}
.uflFooter.h5 { font-size: 16px; }  /* override the h5 font size just for the footer. we want their margins though */


.uflWholePage, .uflWholePageReader {
	width: 100%;
	height: auto !important;
}

.uflWholePage, .uflWholePageReader {
	min-height: 100%;
	height: auto !important;
	height: 100%;
}

.uflEmbed.uflWholePageReader {
        width: 1px;
        min-width: 100%;
	min-height: 100%;
	height: auto !important;
	height: 100%;
}

/************************************************/
/* Margins, footer size and matching push sizes */
/************************************************/
/* http://ryanfait.com/resources/footer-stick-to-bottom-of-page/ */
/* push is used as part of the sticky footer, matches footer height */
.uflWholePage { margin: 0 auto -251px; }		/* match footer & push height */
.uflWholePageReader { margin: 0 auto -251px; }
.uflPush, .uflFooter { height: 251px; } /* Set the fixed height of the footer and it's push here */

/* small footer versions */
.uflWholePageReader.smallFooter { margin: 0 auto -44px;}	/* match footer & push height - small footer in reader only */
.uflPush.smallFooter, .uflFooter.smallFooter { height: 44px; }

/* scrolling areas to work with when the menu is open */
.uflMenuNoScroll { position:relative; height: 100%; }	/* used to help menu scrolling, height may be overriden in js */


/************************************************/
/* Miscellaneous								*/
/************************************************/
.uflGrayBackground { background-color: #DDD; }


/************************************************/
/* ESRI definitions								*/
/************************************************/
.uflIframeCenter { width: 100%; position: relative; margin: 0 auto; height: 800px;} /* match header height. footer will be below the fold */
.uflEsri { width: 100%; height: 100%; margin:0; border: 0; overflow:hidden; }


/************************************************/
/* Text definitions								*/
/************************************************/
.ufl-header-text, .ufl-bold-text { font-weight: bold; }
.ufl-white-text, .ufl-white-text-lb-hover, .ufl-white-text-lb-hover:focus { color: #FFF; }
.ufl-white-text-lb-hover:hover { color: #00AED8; cursor: pointer; }

a.ufl-header-logo-text, a.ufl-header-logo-text:hover { color: #FFF; cursor: pointer; }


/************************************************/
/* Margins & padding						    */
/************************************************/
.ufl-no-margin { margin:0; }
.ufl-mrg-top-2 { margin-top: 2px; }
.ufl-mrg-top-10 { margin-top: 10px; }
.ufl-mrg-top-15 { margin-top: 15px; }
.ufl-mrg-top-20 { margin-top: 20px; }
.ufl-mrg-top-50 { margin-top: 50px; }

.ufl-mrg-bot-10 { margin-bottom: 10px; }
.ufl-mrg-bot-15 { margin-bottom: 15px; }
.ufl-mrg-bot-20 { margin-bottom: 20px; }
.ufl-mrg-bot-32 { margin-bottom: 32px; }

.ufl-mrg-left-20 { margin-left: 20px; }

/************************************************/
/* Create server pages   					    */
/************************************************/
#homeCollections, #accessWhiteList, #accessLicenses,
#accessLicenseOrgAvail, #bkAvailable, #bkIncluded {min-height: 200px; }

.textareaFillNoResize { resize: none; width:100%;}

#myBookList > tbody > tr > td, #myCollectionList > tbody > tr > td {
     vertical-align: middle;
}

.bookTitle, .colTitle { font-size: 14px; }
.bookTitle.ttlSmall, .colTitle.ttlSmall { font-size: 12px; }
/*.mgrTableScroll { max-height:500px; overflow:auto; }*/

.form-inline .form-control.cmyk {width: 55px; }
#previewRect {
    width: 480px;
    height: 360px;
    margin: 0 auto;
    background: #FFF url("/images/wood.jpg?v=51397234t3") repeat;
}
#evtLocations {min-width: 250px;}

/* book printer book layout */
.outerRect {
    position: relative;
    float: left;
    width: 534px;
    height: 534px;
    margin-bottom: 15px;
    border: 5px solid transparent;
}
.outerRect.small { width:366px; height:366px; }

.outerRectSelected { border: 5px solid red; }

.bookRect {
    position: absolute;
    top: 0px;
    left: 13px;
    width: 508px;
    height: 508px;
}
.bookRect.standard { background-color:#00AED8; }
.bookRect.small { width:340px; height:340px; }

.accentRect {
    position: absolute;
    top: 0;
    left: 84px;
    right:0;
    bottom: 0;
}
.accentRect.small { left:56px; }

.imageBorderRect {
    position: absolute;
    top: 72px;
    left: 12px;
    width: 484px;
    height: 364px;
}
.imageBorderRect.small { top:48px; left:8px; width:324px; height:244px; }

.imageRect {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 480px;
    height: 360px;
}
.imageRect.small { width:320px; height:240px; }

.coverImage {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.colorDescription {
    line-height: normal;
    overflow:hidden;
    color: #000;
    position: absolute;
    bottom: 0;
    text-align: center;
    left: 0;
    width: 100%;
}
.acNone { background-color: #00AED8; }
.acRed { background-color: #EB1212; }
.acGreen { background-color: #69FF03; }
.acBlue { background-color: #002085; }
.acOrange { background-color: #F56F00; }
.acYellow { background-color: #FFF017; }
.acPurple { background-color: #4C1D6B; }
.bcWhite { background-color: white; }
.bcBlack { background-color: black; }


.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  white-space: normal;
  filter: alpha(opacity=0);
  opacity: 0;

  line-break: auto;
}
.tooltip.in {
  filter: alpha(opacity=90);
  opacity: .9;
}
.tooltip.top {
  padding: 5px 0;
  margin-top: -3px;
}
.tooltip.right {
  padding: 0 5px;
  margin-left: 3px;
}
.tooltip.bottom {
  padding: 5px 0;
  margin-top: 3px;
}
.tooltip.left {
  padding: 0 5px;
  margin-left: -3px;
}
.tooltip-inner {
  max-width: 300px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  background-color: #000;
  border-radius: 4px;
}
.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}
.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.top-left .tooltip-arrow {
  right: 5px;
  bottom: 0;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}
.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000;
}
.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000;
}
.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}
.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}