div.hallotoolbar {
    border: 1px solid #babdb6;
    padding: 2px;
    background-color: #eeeeec;
    border-radius: 6px;
    font-size: 12pt;
    line-height: 1.1em;
    width: 260px;
    z-index: 500;
    z-index: -500;
    display: none !important;
}

div.hallotoolbar .dropdown-menu {
    width: "200px";
    background-color: #eeeeec;
    margin-top: -1px;
    border-left: 1px solid #babdb6;
    border-bottom: 1px solid #babdb6;
    border-right: 1px solid #babdb6;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

div.hallotoolbar .dropdown-menu .selected {
    background-color: #729fcf;
}


html {
	height: 100%;
}

body {  
	overflow-y: scroll;  /* Force a scrollbar even if content is short */
	height: 100%;
	margin: 0px auto;
	width: 100%;
	font-family: 'ProximaNovaRegular';
	font-size: 15px;
	line-height: 1.4;
	background: white;
	-webkit-transition: all .1s ease-in-out;
	-moz-transition: all .1s ease-in-out;
	-ms-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	transition: all .1s ease-in-out;
}

p {
    padding-bottom: 0px;
    line-height: normal; /* Otherwise it's like 1 em or something, and takes up more height when the font size is small */
}

em {
	font-family: ProximaNovaSemiBold;
}

button {
	font-size: 0.8em;
}

#mainSectionWrapper {
	/* For sticky footer */ 
	height: auto;
	min-height: 100%;
	/* End sticky footer */
}

#mainSectionPadding {
	/* For sticky footer. 75px plus a little bit of white space. */
	padding-bottom: 90px;
}

#fullScreenSection {
	display: none;
}

/* Give basic LIs a default margin */
ul.basicList {
	list-style: disc;
	list-style-position: inside;
	margin-left: 20px;
}
ul.basicList li {
	
}

.pre-wrap {
	white-space: pre-wrap;
}

.nowrap {
	white-space: nowrap;
}

.clear {
	clear: both;
}

.limitedWidthHeader {
	width:980px;
	margin: 0 auto;
}

small {
	font-size: 0.75em;
	display: inline-block; /* This is needed for correct spacing for multiple lines. Without it, it picks up the line-height of the parent block element. */
}

h3 {
	font-weight: bold;
	color: red;
	padding-bottom: 0px;
}
h3 strong {
	color: green;
}

.largeFont {
	font-size: 1.6em;
}
  

.qsArticle {
	display: block;
	width: 960px;
	margin: 0 auto;
	padding: 0;
	padding-bottom: 0px;
	padding-left: 10px; /* iPad */
	padding-right: 50px;
}

#fullScreenSection .qsArticle{
	margin: 10px 0px 0px 150px;
}

.qsArticle header {
	background: white;
}

footer {
	background: #97B836;
}

/* GENERAL */

/* Use this to center a div of unknown width. Put a surrounding div with class (".centeringBoxOuter"),
   and your content div should include the class (".centeringBoxInner"). 
 */
.centeringBoxOuter {
	display: inline-block;
	position: relative;
	left: 50%;
}
.centeringBoxInner {
	display: inline-block;
	position: relative;
	left: -50%;
}

.center {
	width: 100px;
	margin: 0 auto;
}

.centerText {
	text-align: center;
}

.centerImage {
	display: block;
	margin: 0 auto;
}

.fullwidth {
	width: 100%;
	clear: both; /* This helps Firefox to push data table below search widget's advance search area */
}

.inline {
	display: inline-block;
}

/* General purpose*/

.unselectable {
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

/* Use this to create a div that grabs space even though it has no content */
.spacerDiv {
	height: 1px;
}

a {
	text-decoration: underline;
	color: #096D67;
	cursor: pointer;
}

/* Invisible a version, when you don't want the standard colors */
a.unstyled-a {
	text-decoration: inherit;
	color: inherit;
}

a:hover {
	color: red;
}

/* Use this on spans that will be activated in javascript */
.link {
	text-decoration: underline;
	color: blue;
	cursor: pointer;
}

.link:hover {
	color: red;
}

/** JQUERY UI OVERRIDE **/
.ui-widget {
	font-size: inherit;
	font-family: inherit;
}

.ui-widget-content a {
	color: #096D67;
}

/* used by Zeus Report Cards for example */
.dash_highlight {
	border-bottom: 1px dashed red;
}

/* Put this on a plain div to make a line */
.line {
	width: 100%;
	border-bottom: 1px solid grey;
}

/* I know there's <em> but this is useful for programmatically adding and removing the emphasis */
.emphasized {
	font-weight: bold;
}

.outline_offset_animation {
    outline: red dashed 3px;
    display: block;
    padding: 3px;
    -webkit-animation: outlineoffset 5s infinite; /* Chrome, Safari, Opera */
    animation: outlineoffset 5s infinite;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes outlineoffset {
    50% {outline-offset: 5px;}
}

/* Standard syntax */
@keyframes outlineoffset {
    50% {outline-offset: 5px;}
}

/* report */
.checkitout {
	background: #f0e68c;
	height: 60px;
	display: flex;
	align-items: center;
	border-radius: 5px;
	padding-left: 20px;
}