/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
html{-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{-webkit-text-decoration:underline dotted;border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}		

/*.....beg:digitalindy-styles.....*/
body.white { 
	background-color: #fff;
	font-family: 'Kameron', 'Georgia',serif;
	margin: 0; 
	padding: 0;
}
body.beige { 
	background-color: #dbd5c6;
	font-family: 'Kameron', 'Georgia',serif;
	margin: 0; 
	padding: 0;
}
body.beige-white { 
	background: linear-gradient(180deg,#dbd5c6,#fff);
	background: -webkit-gradient(180deg,#dbd5c6,#fff);
	font-family: 'Kameron', 'Georgia',serif;
	margin: 0; 
	padding: 0;
}
/*==== set some color variables ====*/
:root {
	--font-size: 16px;
	--themecolor: #022055;/* 256ee4 */
	--hcolors: #333;
}
/*
.bx {
	background: var(--themecolor, black);
	color: #fff;
}
.tmblue { --themecolor: #256ee4; }
.red { --themecolor: red; }
.breige { --themecolor: #bfa778; }
.brown { --themecolor: #518ceb; }
.green { --themecolor: green; }
.orange { --themecolor: orange; }
.purple { --themecolor: #609; }
.teal { --themecolor: teal; }	
*/
.wrapper {max-width: 960px; margin:0 auto; min-width: 320px;}
header,main,footer {clear:both; display:block;}
main {margin-bottom: 2em; padding: 2em 0;}
/* .headerbg {
	background: #eeeee2 url('header-bg.png?v=c000012') top left no-repeat;
	height: auto;
	min-height: 120px;
	min-width: 320px;
	max-width: 1200px;
	width: 100%;
} */
header div.logo-h1 {
    align-items: center;
    display: grid;
    grid-template-areas: "img h1";
    grid-template-columns: 1fr 5fr;
    grid-gap: 1rem;
	padding:0 10px;
    vertical-align: middle;
    width: 100%;
}
@media (min-width: 601px) {
    header .logo {
        height: auto;
        max-width: 223px;
        min-width: 170px;
        width: 100%;
    }
}
img, picture {
    max-width: 100%;
    display: block;
}
header .logo-h1 h1 {
	color: #022055;
	/* display:block; */
	font-family: Poppins, arial, sans-serif;
	font-size: min(max(1.7em, 4vw), 3em);
	font-weight: 700;
	line-height: 1;
	text-align:center;
}

.p-banner-full {
	padding-left: 0px;
	padding-right: 0px;
}
h1,h2,h3 {
	color: var(--themecolor,#518ceb);
	line-height: 1.1;
}
h1 { font-size: 2.2em; margin: .7rem auto;}

h2 { font-size: 1.9em; }
h3 { font-size: 1.6em; }

#digitalindy-search strong.searches {
	font-size: 1.25em;
	padding: 10px 0;
}
.form-header h1 {
	color: var(--themecolor,#518ceb);
	line-height: 1.3;
}
.form-header p { line-height: .8; margin: 3px auto; }
.yyear { 
	margin-left: 5px;
	font-family: "Yesteryear","Brush Script MT", cursive;
	font-size: 2.225em /*75px*/;
}
/* %%%%% tmstyle= trendyminds form skin %%%%% */

#digitalindy-search.tmstyle {


}
.mobile-pull-100 {
	position: relative;
}
/* ### submit button ### */
/* Buttons */
.tmstyle button {
	background-color: var(--themecolor,#518ceb);
	border: 3px solid #fff;
	border-radius: 2em;
	color: #fff !important;
	display: inline-block;
	font-size: var(--font-size);
	font-weight: 700 !important;
	/* min-height: 60px; */
	padding: 5px;
	outline: none;
	text-decoration: none;
	transition: background-color .3s,box-shadow .3s;
}

.tmstyle button:hover,
.tmstyle button:focus  {
	background-color: #fff; /* Old browsers */
	border: 3px solid var(--themecolor,#518ceb);
	border-radius: 2em;		
	color: var(--themecolor,#518ceb) !important;
	cursor: finger;
	cursor: pointer;	
	display: inline-block;
	font-size: var(--font-size);
	font-weight: 700 !important;
	/* min-height: 60px; */
	padding: 5px;			
	outline: none;
}		

/* text,textarea inputs */
.tmstyle input[type="text"]:read-only,
.tmstyle input[type="text"]:read-only:focus,
.tmstyle input[type="text"]:read-only:hover {
	background: #eee; /* Old browsers */
	border: 3px solid #999/* var(--themecolor,#518ceb) */;
	border-radius: 1em;
	caret-color: blue;
	color: #666 /* var(--themecolor,#518ceb) */ !important;
	cursor: not-allowed;
	cursor: no-drop;
	display: inline-block;
	/* newly added 102418 */
	flex-grow: 1;
	font-size: var(--font-size);
	font-weight: 700;
	margin-right: 5px !important;
	/* min-height: 30px !important; */
	padding: 5px;
}
.tmstyle input[type="password"],
.tmstyle input[type="text"] {
	background: #fff; /* Old browsers */
	border: 3px solid var(--themecolor,#518ceb);
	border-radius: 1em;
	caret-color: blue;
	color: var(--themecolor,#518ceb) !important;
	display: inline-block;
	/* newly added 102418 */
	flex-grow: 1;
	font-size: var(--font-size);
	font-weight: 700;
	margin-right: 5px !important;
	/* min-height: 30px !important; */
	padding: 5px;
}
/* hover states */
.tmstyle input[type="password"]:hover,
.tmstyle input[type="text"]:hover	{
	background: #fff; /* Old browsers */
	border: 3px solid var(--themecolor,#518ceb);
	border-radius: 1em;		
	caret-color: blue;
	color: #666 !important;
	display: inline-block;
	font-size: var(--font-size);
	font-weight: 700;
	padding: 5px ;
}	

/* active states ? */
.tmstyle input[type="password"]:active,
.tmstyle input[type="text"]:active {
	background: var(--themecolor,#518ceb); /* Old browsers */
	border: 3px solid #fff;
	border-radius: 1em;
	caret-color: red;
	color: #fff !important;
	display: inline-block;
	font-size: var(--font-size);
	padding: 5px;
}	

/* focus states ? */
.tmstyle input[type="password"]:focus,
.tmstyle input[type="text"]:focus {
	background: #fff; /* Old browsers */
	border: 3px solid var(--themecolor,#518ceb);
	border-radius: 1em;	
	caret-color: red;
	caret-width: 2px;
	color: #3333ff !important;
	display: inline-block;
	font-size: var(--font-size);
	padding: 5px;
}		
/*wrap the 'select' */
.tmstyle .mac-faux {
	background-color: #ffffff; /* Old browsers */
	border: 3px solid var(--themecolor,#518ceb);
	border-radius: 1em;
	bottom: 0;
	color: var(--themecolor,#518ceb) !important;
	display: flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content: space-between;
	font-size: 16px;
	font-weight: 700;
	margin-right: 5px !important;
	max-width: 667px;
	min-width: 10px;
	min-height: 35px !important;
	padding: 0;
	vertical-align: bottom;
	width: 100%;
}
.tmstyle .mac-faux:hover {
	background-color: #ffffff; /* Old browsers */
	border: 3px solid var(--themecolor,#518ceb);
	border-radius: 1em;
	bottom: 0;
	color: var(--themecolor,#518ceb) !important;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:space-between;
	font-size: 16px;
	font-weight: 700;
	margin-right: 5px !important;
	min-height: 35px !important;
	padding: 0;
	vertical-align: bottom;
}
.tmstyle select,
.tmstyle select#mac-faux,
.tmstyle select:hover,
.tmstyle select#mac-faux:hover,
/* faux mac select styling w/div wrapper */
.tmstyle .mac-faux select:hover,
.tmstyle .mac-faux select:active,
.tmstyle .mac-faux select:focus,		
.tmstyle .mac-faux select {
	align-items: left !important;
	background-image: -webkit-linear-gradient(top, #ffffff, #ffffff);
	/*background-color: -apple-system-control-background;*/
	-apple-system-control-background: #ffffff;
	border: 0 none;
	--fakeMacUserAgentStuff: var(--below);
	box-sizing: border-box;
	-moz-appearance: scrollbarbutton-dropdown;
	-webkit-appearance: scrollbarbutton-dropdown;
	-webkit-appearance: toolbarbutton-dropdown;
	-webkit-rtl-ordering: logical;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #fff;
	border-right-color: #fff;
	border-bottom-color: #fff;
	border-left-color: #fff;
	border-image-source: none;
	border-image-slice: 0;
	border-image-width: 0;
	border-image-outset: 0;
	border-image-repeat: stretch;
	color: var(--themecolor,#518ceb);
	cursor: default;
	margin: 0 5px 0 10px;
	text-align: left
	white-space: pre;		
}		
.tmstyle .mac-faux select{
	/*display: inline-block;*/
}
.tmstyle .mac-faux .fa-caret-down {
	color: #666;
}

.tmstyle .submit {
	display: block;
	float: right;
	font-size: var(--font-size);
	padding: 10px;
	margin: 0 auto;
	max-width: 300px;
	min-height: 60px;
	min-width: 10px;
	width: 100%;
}

/* custom submit input/button */
.tmstyle .submit input[type=submit] {
	background-color: #630;
	border-bottom: 3px solid #666;
	border-radius: 5px;
	color: #fff !important;
	display: inline-block;
	font-weight: 700 !important;
	float: left;
	margin: 10px 5px 5px 0;
	padding: 11px 24px 10px;
	max-width: 100px;
	min-width: 10px;
	width: 100%;
}
.tmstyle .submit input:hover[type=submit] {
	background-color: #ff5800;
	border-bottom: 3px solid #000;
	border-radius: 5px;
	color: #fff !important;
	cursor: finger;
	cursor: pointer;
	display: inline-block;
	font-size: var(--font-size);
	font-weight: 700 !important;
	float: left; margin: 10px 5px 5px 0;
	padding: 11px 24px 10px;
	max-width: 100px;
	min-width: 10px;
	width: 100%;
}				

/* %%%%% tmstyle= trendyminds form skin %%%%% */

#features h3.reps {color: #630; }
.hevents h3 .dates { font-weight: 300;}

article p,
article blockquote {font-size: 110%; }
article p {
	padding: 0 10px;
	margin-bottom: 14px;
}
article li{
	list-style: square;	
}	
article li:nth-of-type(odd) { 
	background-color: #f9f9f9;
}

blockquote {
	display: inline-block;
	-webkit-margin-before: 1.4em;
	-webkit-margin-after: 1.4em;
	-webkit-margin-start: 40px;
	-webkit-margin-end: 40px;
}
.pr-login .main-navs {margin-top: 1em;}
figure { margin: 0; }
header.grid-container.bw { color: #fff; }
/* header h1 { color: #fff; } */
header h2.title { color: #630; font-size: 2em; text-transform: uppercase;}
.title { color: #fff; font-size: 2em; text-transform: uppercase;}
.title-red { color: #630; font-family: 'Kameron',serif; font-size: 2em; text-transform: uppercase;}
.title-sons,
.photofest {display: block; font-size: 125%;}
.title-break {display: block;}
.subtitle {font-family: 'Kameron',serif;}
.title-caps { color: #fff; text-transform: uppercase;}


/* login form */
.pr-login {
	overflow: hidden;
	background-color: #fff;
	color: #022055
}
:where(.pr-login) :is(a) {
	color: #518ceb;
	text-decoration: none;
}	
:where(.pr-login) :is(a:link,a:visited) {
	text-decoration: underline 1px;
}	
:where(.pr-login) :is(a:hover,a:active) {
	text-decoration: underline dotted 2px;
}
.pr-login h1 { color: #fff; }
.pr-login-error {
	background: linear-gradient(180deg,#f8f8f8,#f63 25%);
	color: #fff;
	overflow: hidden;
}
.pr-login-error h2 { color: #fff; }

main form:has(input#inputPIN) {
    padding: 4rem 0 6rem 0;
}
@media (max-width:600px) {
	main form:has(input#inputPIN) {
		padding: 10px 0;
	}
}
/* navigation bar */
/* .topnav {
  overflow: hidden;
  background-color: #fff;
  color: #022055;
}

.topnav a {
	color: #fff;
	display: inline-block;
	font-family: 'Ubuntu',Arial,sans-serif;
	font-size: 17px;
	font-weight: 700;
	padding: 14px 30px;
	text-decoration: none;
	text-align: center;
}

.topnav a:hover,
.topnav a:active {
	background-color: rgba(0,0,0,.35);
	color: #fff;
} */


#mainbody-digindy .topnav .main.active span,
#artist .topnav .artist.active span,
#statement .topnav .statement.active span,
#exhibit .topnav .exhibit.active span,
#art .topnav .art.active span,
#nominees .topnav .nominees.active span {
	background: #fff; 
	color: #000;
	/* avoids bottom-border while current page status */
	border: none 0; 
	border-radius: 5px;
	padding: 3px 6px;
}

.topnav .menu {display: none;}
.topnav .icon {
  display: none;
}

/*begin:ie11 fallbacks*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	/* login form */
	.pr-login {
	  overflow: hidden;
	  background-color: #fff;
	  color: #022055;
	}
	.pr-login h1 { color: #fff; }
	.pr-login-error {
		background-color: #fff;
		color: #333;
		overflow: hidden;
	}
	.pr-login-error h2 { color: #fff; }
	
	nav#myTopnav,
	nav.topnav,
	nav#myTopnav.topnav,
	.wrapper nav#myTopnav,
	.wrapper nav.topnav,
	.wrapper nav#myTopnav.topnav { 
		background: #518ceb;
		background-color: #518ceb;
	}
	.topnav a:hover,
	.topnav a:active {
	  background-color: #6ba34d;
	  color: #000;
	}			
	h1,h2,h3,
	.form-header h1,
	.tmstyle .mac-faux,
	.tmstyle .mac-faux:hover,
	.tmstyle select,
	.tmstyle select#mac-faux,
	.tmstyle select:hover,
	.tmstyle select#mac-faux:hover,
	/* faux mac select styling w/div wrapper */
	.tmstyle .mac-faux select:hover,
	.tmstyle .mac-faux select:active,
	.tmstyle .mac-faux select:focus,		
	.tmstyle .mac-faux select,
	.contentbg.white,
	.contentbg.beige,
	.contentbg.beigewhite,
	aside.col3 p,
	aside.col3 ol,
	aside.col3 ul,
	#features h1,
	.to-top a:link,
	.to-top a:visited {
		color: #518ceb;
	}
	.tmstyle button,
	figcaption .caption-banner,
	figcaption .caption-banner:hover,
	#features figure figcaption img,
	#features figure figcaption img:hover,
	#features figure figcaption.category-caption,
	#features figure figcaption.category-caption:hover{
		background: #518ceb;
		background-color: #518ceb; 
	}

	.tmstyle input[type="password"],
	.tmstyle input[type="password"]:hover,
	.tmstyle input[type="password"]:active,
	.tmstyle input[type="password"]:focus,
	.tmstyle input[type="text"],
	.tmstyle input[type="text"]:hover,
	.tmstyle input[type="text"]:active,
	.tmstyle input[type="text"]:focus,
	.tmstyle button:hover,
	.tmstyle button:focus,
	.tmstyle .mac-faux,
	.tmstyle .mac-faux:hover {
		border: 3px solid #518ceb;
		color: #518ceb !important;
	}
}		

@media screen and (max-width: 740px) {
.title-red,.subtitle {font-size: 90%; }
.topnav a {
	color: #fff;
	display: inline-block;
	float: left;
	font-size: 17px;
	padding: 14px 30px;
	text-decoration: none;
	text-align: center;
}

  .topnav a:not(:first-child) {display: none;}
  .topnav .menu {
		color: #fff;
		display: inline-block;
		padding: 14px 16px;		
}
  .topnav a.icon {
	float: right;
	display: block;
  }
}
/*end:ie11 fallbacks*/

@media screen and (max-width: 740px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
	position: absolute;
	right: 0;
	top: 0;
  }
  .topnav.responsive a {
	float: none;
	display: block;
	text-align: left;
  }
}
/*Lato,Voltaire,Roboto,Cabin Sketch,Cabin Condensed*/

/*SEARCHING*/
#digitalindy-search {
	/*background-color: #fff;*/
	color: #630;
	margin: 40px auto 5px auto;
}
/* == search box(es) == */
.ilibsearch {
	display: block;
	margin:0;
	max-width: 100%;
	padding: 4px;
	text-align: left;
	width: 100%;
}		
.ilibsearch input,
.ilibsearch select { 
 
	font-size: 16px;
	margin: 0;
	min-width: 10px;
	padding: 0;
	width: 100%;
}

.chButton {
	cursor: hand;
	cursor: pointer;
}

.submit {
	display: block;
	float: left;
	padding: 10px;
	margin: 0 auto;
	max-width: 170px;
	min-width: 10px;
	width: 100%;
}	

p,ul li { line-height: 1.75; }

p {
	font-size: var(--font-size);
}

.red-banner { background-color: #630 !important; text-align:center !important; }
.red-banner h1{ color:#fff !important; }

.form-link { color: #fff; text-decoration: none; }
.form-link:link,.form-link:visited { border-bottom: dotted 1px #fff; }
.form-link:hover,.form-link:active { border-bottom: solid 1px #fff; }

.contentbg.white { 
	background-color: #fff;
	color: var(--themecolor,#518ceb);
	display: block;
	padding: 20px 10px;
}
.contentbg.beige { 
	background-color: #dbd5c6;
	color: var(--themecolor,#518ceb);
	display: block;
	padding: 20px 10px;
}
.contentbg.beigewhite { 
	background-color: #fff;
	/*background: linear-gradient(90deg,#dbd5c6,#fff 50%,#dbd5c6 100%);
	background: linear-gradient(90deg,#fff,#dbd5c6 50%,#fff 100%);
	background: linear-gradient(90deg,#f8f8f8,#ede8db 33%,#dbd5c6 50%,#ede8db 66%,#f8f8f8 100%);*/
	background: linear-gradient(90deg,#dbd5c6,#f8f8f8 33%,#fff 50%,#f8f8f8 66%,#dbd5c6 100%);
	color: var(--themecolor,#518ceb);
	display: block;
	padding: 20px 10px;
}
.contentbg:after { clear: both; display: block; height: 70px; width: 100%;}

.contentbg p,
.contentbg li { padding: 2px; }

:where(.contentbg a,.special) { color: #256ee4; font-weight: 600; padding: 2px; text-decoration: none; }

:where(.contentbg,.special) :is(a:link,a:visited) {
    text-decoration: underline 2px !important;
}
:where(.contentbg,.special) :is(a:hover,a:active) {
	text-decoration: underline dotted 3px !important;
}


/* a.special {
	 color: #c00;
	 font-weight: bold;
	 padding: 2px;
	 text-decoration: none;
}
a.special:link,
a.special:visited { border-bottom: dotted 2px #003; color: #c00; }
a.special:hover,
a.special:active { background-color: rgba(0,0,0,.15); border-bottom: solid 2px #003; color: #c00;} */

.contentbg h2  { color: #630; }
.contentbg .form-link { color: #630; text-decoration: none; }
.contentbg .form-link:link,.contentbg .form-link:visited { border-bottom: dotted 1px #630; }
.contentbg .form-link:hover,.contentbg .form-link:active { border-bottom: solid 1px #630; }
.black-banner { background-color: #181818; }
.center { margin: 0 auto; text-align: center !important; }
.goback { color: #630; cursor: pointer; cursor: finger; display: inline-block; font-size: 150%; font-weight: 900; text-decoration: none; margin: 20px auto; }
.goback:link,
.goback:visited { border-bottom: dotted 2px #630;  }
.goback:hover,
.goback:active { border-bottom: solid 2px #333;  }

/* pop-up bio detailed info */
.detail span p { font-size: 150%; }

/*utilities*/
.hide {display: none; height: 0; visibility: hidden; width: 0; }

/*features*/
#features { margin: 0 auto; padding:0; }
#features header { margin-bottom: 20px; text-align: center; }

#features h1 {
	color: var(--themecolor,#518ceb);
}
#features figure {
	display: block;
	height: 95%;
	margin: 0; 
	/* change this padding to create more/less space between columns */
	padding: 1px 3px 2px 3px;
	vertical-align: top;
	-webkit-margin-before: 0;
	-webkit-margin-after: 0;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
}

figcaption .caption-banner {
	background-color: var(--themecolor,#518ceb);
	/*background: linear-gradient(180deg,#83d7d5,#256ee4 50%);*/
	display: block;
	float: left;
	height: auto;
	max-width: 99.9999%;
	min-height: 25px;
	min-width: 10px;
	opacity: 1;
	padding: 7px;
	top: 0;
	width: calc(100% - 14px);
	z-index: 80;
	position: relative;
}
figcaption .caption-banner:hover {
	background-color: var(--themecolor,#518ceb);
	/*background: linear-gradient(180deg,#83d7d5,#256ee4 30%);*/
	opacity: 1;
}
#features figure figcaption img {
	background-color: var(--themecolor,#518ceb);
	color: #fff;
	display: inline-block;
	font-size: 14px;
	font-style: italic; 
	height: auto;
	margin: 0 auto;
	min-height: 25px;
	opacity: 1;
	padding: 0;	
}
#features figure figcaption img:hover {
	background-color: var(--themecolor,#518ceb);
	color: #fff;
	display: inline-block;
	font-size: 14px;
	font-style: italic; 
	height: auto;
	margin: 0 auto;
	min-height: 25px;
	opacity: .75;
	padding: 0;	
}

#features figure figcaption.category-caption {
	background-color: var(--themecolor,#518ceb);
	color: #fff;
	display: inline-block;
	font-size: 14px;
	font-style: italic; 
	height: auto;
	margin: 0 auto;
	min-height: 25px;
	opacity: 1;
	padding: 0;	
}
#features figure figcaption.category-caption:hover {
	background-color: var(--themecolor,#518ceb);
	color: #fff;
	display: inline-block;
	font-size: 14px;
	font-style: italic; 
	height: auto;
	margin: 0 auto;
	min-height: 25px;
	opacity: .75;
	padding: 0;	
}

#features a,
a figcaption { 
	border-bottom: none 0;
	padding-left: 0px;
	padding-right: 0px;
	text-decoration: none;
}
#features a figure:link,
#features a figure:visited,
a figure:link,
a figure:visited,
a figcaption:link,
a figcaption:visited {
	/*background-color: rgba(102,51,0,1);*/
	color: #fff;
	opacity: .7;
}
#features a figure:hover,
#features a figure:active,
a figure:hover,
a figure:active,
a figcaption:hover,
a figcaption:active {
	background-color: #fff;
	color: #000;
	opacity: 1;
}

#features figure:after,
#features figcaption:after {
	content:"";
	margin:0;
	padding:0;
	line-height:0;
}
/*#features img { 
	background-color: #fff;
	display:inline-block;
	margin:0;
	height: 100%;
	padding: 0;
	vertical-align: bottom;
}*/
#features img {
	background-color: #fff;
	display: inline-block;
	float: left;
	margin: -38px 0 0 0;
	height: 100%;
	padding: 0;
	position: relative;
	vertical-align: bottom;
	z-index: 5;
}		
#features img:hover {
	opacity: .7;
}

/* @media (max-width: 767px) {
	.mobile-grid-50 {
		float: left;
		width: 50%;
	}
} */
/* .grid-55.name em {
	text-align: center !important;
	width: 100%;
}
.mobile-grid-100.name em,
.grid-55.mobile-grid-100.name em {
	font-size: 80%;
	text-align: center !important;
	width: 100%;
}
@media (max-width: 849px) {
	.mobile-grid-100.name em,
	.grid-55.mobile-grid-100.name em {
		font-size: 75%;
		text-align: center !important;
		width: 100%;
	}
} */
@media (max-width: 767px) {

	.mobile-grid-50 .name em {
		font-size: 75%;
		text-align: center !important;
		width: 100%;
	}
}

@media (max-width: 767px) {
	.mobile-grid-50 a {
		min-height: 205px;
	}
	.mobile-grid-50 .teaser {
		min-height: 2.2em;
	}

}

.testpops { display:block; background-color: rgba(125,125,125,.50); }

/*flexyform*/
form.flexyform {
	display: flex;
	grid-template-columns: 1.25fr 1.25fr .5fr;
	grid-gap: 1.05rem;
}
.flexyform input[type=text],
.flexyform button[type=submit]	{
	align-items: center;
	border: 3px solid brown;
	flex-grow: 3;
	margin: 5px;
	padding: 0.5em 0.75em;
}
.flexyform select	{
	align-items: center;
	border: 3px solid brown;
	flex-grow: 3;
	margin: 5px;
	padding: 0.4em 0.75em;
}
/*.flexyform input[type=text],
.flexyform select {
	max-width: 95%;
}*/
.flexyform button {
	background: #fff; 
	color: var(--themecolor);
	border-color: var(--themecolor);
	border-width: 3px;
}

/*form*/
.hero-white { background-color: #fff; color: #333; display: block; padding: 10px;}
.hero-white:after { clear: both; display: block; height: 10px; width: 100%;}

.tmstyle label {display: block; line-height: 1.4; }
.tmstyle fieldset label span,
.tmstyle label span { color: var(--themecolor); margin-left: 9px; }
.tmstyle fieldset label { 
	display: inline-block;
	margin-bottom: 10px;
}
.tmstyle fieldset input {width: 100%; }
.tmstyle fieldset {border: none 0; } 
legend { font-weight: 900; }
.note-ast {color:red;background-color:yellow;font-size:large;}

a img { border: 0}

/* ====== .nav links-- media queries ====== */
/@media screen and (max-width: 715px),(max-width: 768px),(max-width: 930px),(max-width: 936px) {

		
}
/* end:@715px & 768 */

@media screen and (max-width: 667px) {


}
/* end:@667px */


@media screen and (max-width: 598px),@media screen and (max-width: 600px) {
	

}
/* end:@598 & @600px */

@media screen and (max-width: 568px) {
	
		
}
/* end:@568px */
		
@media only screen and (max-width: 480px) {
	/* rules here... */


}
/* end: @480px */		
@media only screen and (max-width: 384px),@media only screen and (max-width: 375px),@media only screen and (max-width: 360px) {
	/* rules here... */

}
/* end:@384,375,360px */

/* ====== END .nav links-- media queries ====== */
.footer {
	background-color: #022055;
	color: #fff;
	display: block;
	font-family: Geneva, Arial, sans-serif;
	font-size: 15px;
	margin: 4em 10px 1em 10px;
	max-width: 100%; 
	padding: 1em;	
	width: 100%;
}
.footer-logo-links {
	align-items: center;
	display: grid;
    grid-template-areas: "img p";
    grid-template-columns: 1fr 4fr;
    gap: 0 .5rem;
    vertical-align: middle;
    width: 100%;
}
@media screen and (max-width: 750px) {
	.footer-logo-links {
		align-items: center;
		display: grid;
		grid-template-areas: "img p";
		grid-template-columns: 1fr 3fr;
		gap: .5rem;
		vertical-align: middle;
		width: 100%;
	}
	.footer p.copyright-etc {
		font-size: 14px;
		margin: 0 auto;
		padding: 0 1em;
		text-align: left;
	}	
}
/* .footer-logo-links {
	clear: both;
	display: block;
	vertical-align: top;
} */
.footer-logo-links:after {clear: both; content:""; display: block; height: 5px; width: 100%;}
@media screen and (min-width: 750px) {
	.footer p.copyright-etc { font-size: 16px; margin: 0 auto; padding: 0 1em; text-align: center;}
}

.footer-logo {color: #fff;height:auto; min-width: 80px; margin:0 auto; max-width: 115px; text-align: center; width: 100%;}
.footer-logo svg {color: #fff;height:auto; min-width: 80px; max-width: 115px; width: 100%;}
.copyright-etc a {color: #fff; display:inline-block; margin: 0 10px 10px 10px; }
.copyright-etc a:link,
.copyright-etc a:visited {
	text-decoration: underline;
}
.copyright-etc a:hover,
.copyright-etc a:active {
	text-decoration: underline dotted;
}
#year {font-weight: 600;}
/* .footer { 
	background-color: #f7f7f7/* 630 */;
	color: #fff;
	clear: both;
	display: block;
	float: left;
	margin: 0 0 30px 0;
	padding: 30px 10px;
	max-width: 100%;
	min-width: 294px;
	width: 100%;
} */
#dba {color: #630; }
.footer ul {color: #fff; float:left; list-style:none; margin: 0 10px 10px 10px; max-width: 300px; min-width: 10px; width: 100%; }
.footer ul li {}
.sponsors { margin:0 auto; text-align: center; max-width: 100%; min-width: 320px; width:100%; }
/* .sponsors img {border: none 0; height: auto; margin: 10px 5px; max-height: 115px; text-decoration:none; width: auto;} */
.sponsors img {border: 0 none; }
/* .sponsors img {border-bottom: solid 5px #630; }
.sponsors img:hover {border-bottom: solid 5px rgba(255,255,255,.85); } */

.sponsors_label { 
	clear:both;
	color: #630;
	display: block;
	font: oblique 700 .75em/.85em Arial,san-serif;
	margin: 15px auto;
	text-transform: uppercase;
	vertical-align:top !important;
}
.to-top:after { 
	clear: both;
	display: block;
	height: 60px;
	margin: 0;
	padding: 0;
	max-width: 100%;
	min-width: 294px;
	width: 100%;
}
.to-top a {clear:both; display: block !important; float:left; line-height: 1.3 !important; padding:2px; text-align: center; text-decoration:none; }
.to-top a:link,
.to-top a:visited {border-bottom: dotted 1px #fff; color: var(--themecolor,#518ceb) !important; }
.to-top a:hover,
.to-top a:active {background-color: rgba(0,0,0,.88;) !important; border-bottom: solid 1px #fff; color: #666 !important; text-shadow: #333 1px 1px 1px;}

.to-top span a#uptop {
	border-bottom: none 0;
	text-decoration: none!important;
}
.to-top {
	clear: both;
	display: block;
	margin: -58px auto 0 auto;
	padding-bottom: 15px;
	text-align: center;
	max-width: 100%;
	min-width: 10px;
	width: 100%;
}
.to-top span {
	background-color: #f7f7f7/* 630 */;
	border-radius: 6px;
	display: inline-block;
	font-size: 1.85rem;
	height: 1.95rem;
	line-height: 2.5rem;
	padding: 0 12px;
	vertical-align: top;
}
.aligncenter {display: block; text-align: center; }
.alignleft { float:left; margin: 0 20px 20px 0; }
.alignright {float:right; margin: 0 0 20px 20px;}
.floatright {float:right; margin: 0;}

.clearboth {clear:both; display:block; }
.clear20 {clear:both; display:block; padding:5px !important; }
.note { background-color:#f7f7f7; border: solid 1px #999; border-radius: 3px; line-height: 1.3; margin: 15px 0 !important;}

/*.....end:digitalindy-styles.....*/



/* ########################################### */
/* #old styles old styles old styles old styles old styles old styles old old styles#  */
/* ########################################### */

/*
#itemComments }
	height: 80px;
}

* {
	margin: 0; padding: 0;
}

a {
	text-decoration:underline;
	color:#00F;
	cursor:pointer;
}

body {
	font-family: Verdana, Arial;
	font-size: 12px;
	line-height: 18px;
}

h3 {
	margin-bottom: 20px;
	font-size: 15px;
	text-shadow: 2px 2px 2px #ccc;
}

h4 {
	margin-bottom: 3px;
	font-size: 17px;
	text-shadow: 2px 2px 2px #ccc;
	clear: both;
}

img {
	border: 0px;
}
*/

input.parsley-error, textarea.parsley-error {
	color: #B94A48 !important;
	background-color: #F2DEDE !important;
	border: 1px solid #EED3D7 !important;
}

input.parsley-success, textarea.parsley-success {
	color: #468847 !important;
	background-color: #DFF0D8 !important;
	border: 1px solid #D6E9C6 !important;
}

input.radiocheck.parsley-error, textarea.parsley-error {
	color: #B94A48 !important;
	background-color: #F2DEDE !important;
	border: 1px solid #EED3D7 !important;
}

input.radiocheck.parsley-success, textarea.parsley-success {
	color: #468847 !important;
	background-color: #DFF0D8 !important;
	border: 1px solid #D6E9C6 !important;
}

/* label {
	font-family: Arial, Verdana; 
	text-shadow: 2px 2px 2px #ccc;
	display: block; 
	float: left; 
	font-weight: bold; 
	margin-right:10px; 
	text-align: right; 
	width: 270px; 
	line-height: 25px; 
	font-size: 15px; 
} */

label.csLabel {
	font-family: Arial, Verdana; 
	text-shadow: 2px 2px 2px #ccc;
	float: left;
	font-weight: bold; 
	margin-right:10px; 
	width:80px;
	text-align: right; 
	line-height: 25px; 
	font-size: 15px; 
}

label.radiocheck {
	font-family: Arial, Verdana; 
	text-shadow: 2px 2px 2px #ccc;
	font-weight: normal; 
	line-height: 25px; 
	font-size: 13px; 
	display: block;
	padding-left: 4px;
	margin-top: 4px;
	width: 65px;
}

/* li a {
	text-decoration: none;
	font-weight: bold;
	color: #444;
	margin-right: 10px;
} */

ol {
	margin: 0px 0px 20px 20px;
}

p {
	margin: 0px 0px 20px 0px;
}

table {
	margin-top: 15px;
	border: none 0;
}

td {
	padding: 3px 6px;
	font-size: 11px;
}

th {
	border-bottom: 2px solid #000; 
}

ul {
	margin: 0px 0px 20px 10px;
}

ul.parsley-error-list {
	font-size: 11px;
	margin: 2px;
	list-style-type:none;
}

ul.parsley-error-list li {
	line-height: 11px;
}


#bottomNav {
	margin-top: 7px;
}

#bottomNav a {
	padding: 5px 5px 5px 12px;
	float: right;
	color: #555;
	text-decoration: none;
	font-weight: bold;
	font-size: 12px;
	text-shadow: 2px 2px 2px #ccc;
}

#cartStatusChange {
	border: 1px solid #000;
/*	height: 23px;*/
	padding: 2px;
	background: #888;
	color: #fff;
	margin-bottom: 6px;
	font-size: 12px;
	width: 230px;
	float: left;
}

#cartStatusChange a {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}

#child1 {
	padding: 15px 5px 5px 0px;
	margin-top: 15px;
}

#container {
	margin: 20px auto;
	display:block;
	width: 700px;
	background: #fff;
}

#containerDC {
	margin: 20px auto;
	display:block;
	width: 970px;
	background: #fff;
}

#containerPop {
	margin: 20px auto;
	display:block;
	width: 650px;
	background: #fff;
}

#containerPopS {
	margin: 20px auto;
	display:block;
	width: 500px;
	background: #fff;
}

#containerPopVS {
	margin: 20px auto;
	display:block;
	width: 300px;
	background: #fff;
}

#executeLink {
	clear:both;
	margin-top:20px;
}

#formHeader {
	float: left;
	width: 100%;
}

#login {
	clear: both;
	float: right;
	margin: 0px 30px 20px 10px;
	line-height: 100%; 
	width: 130px;
}

#nestlist {
	color:#333;
	margin-left: 40px;
}

#nestlist ol {
	font-size:18px;
}

#nestlist ol li {
	margin-top: 10px;
}

#nestlist ol li ol {
	list-style-image: url("images/47.png");
	padding:0px 0 5px 18px;
	font-size:15px;
}

#nestlist ol li ol li {
	color:#bfe1f1;
	height:21px;
	margin-left:10px;
}

#nestlist ol li ol li a {
	text-decoration: none;
	color: #555;
}

#parent1 {

}

/* #pReqForm {
	width: 650px;
	padding: 20px;
	background: #f0f0f0;
	border: 1px solid #cccccc;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
	-moz-box-shadow: 2px 2px 2px #cccccc;
	-webkit-box-shadow: 2px 2px 2px #cccccc;
	box-shadow: 2px 2px 2px #cccccc;
} */

#pReqFormDC {
	width: 950px;
	padding: 20px;
	background: #f0f0f0;
	border: 1px solid #cccccc;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
	-moz-box-shadow: 2px 2px 2px #cccccc;
	-webkit-box-shadow: 2px 2px 2px #cccccc;
	box-shadow: 2px 2px 2px #cccccc;
}

#pReqFormPop {
	width: 600px;
	padding: 20px;
	background: #f0f0f0;
	overflow:auto;
	border: 1px solid #cccccc;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
	-moz-box-shadow: 2px 2px 2px #cccccc;
	-webkit-box-shadow: 2px 2px 2px #cccccc;
	box-shadow: 2px 2px 2px #cccccc;
}

#pReqFormPop2 {
	width: 675px;
	padding: 20px;
	background: #f0f0f0;
	overflow:auto;
	border: 1px solid #cccccc;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
	-moz-box-shadow: 2px 2px 2px #cccccc;
	-webkit-box-shadow: 2px 2px 2px #cccccc;
	box-shadow: 2px 2px 2px #cccccc;
}

#pReqFormPopS {
	width: 420px;
	padding: 20px;
	background: #f0f0f0;
	overflow:auto;
	border: 1px solid #cccccc;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
	-moz-box-shadow: 2px 2px 2px #cccccc;
	-webkit-box-shadow: 2px 2px 2px #cccccc;
	box-shadow: 2px 2px 2px #cccccc;
}

#pReqFormPopVS {
	width: 320px;
	padding: 10px;
	background: #f0f0f0;
	overflow:auto;
	border: 1px solid #cccccc;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
	-moz-box-shadow: 2px 2px 2px #cccccc;
	-webkit-box-shadow: 2px 2px 2px #cccccc;
	box-shadow: 2px 2px 2px #cccccc;
}
table { font-size: 12px; padding:0 2px;}
table th {min-height: 30px; vertical-align: bottom; }
table tr:nth-child(odd) {background-color: #fff; color: #000; }
table tr:nth-child(even) {background-color: #eee; color: #000; }

/* .active0 {
	color:#000;
	background-color: #FFF;
}

.active1 {
	color:#000;
	background-color: #EEE;
} */
.active2 {
	color:#000;
	background-color: #D6D6FF;
}

.active3 {
	color:#000;
	background-color: #C2C2FF;
}

.oldbadge {
	background: radial-gradient( center -9px, circle closest-side, white 0, red 26px );
	background: -moz-radial-gradient( center -9px, circle closest-side, white 0, red 26px );
	background: -ms-radial-gradient( center -9px, circle closest-side, white 0, red 26px );
	background: -o-radial-gradient( center -9px, circle closest-side, white 0, red 26px );
	background: -webkit-radial-gradient( center -9px, circle closest-side, white 0, red 26px );
	background-color: red;
	border: 2px solid white;
	border-radius: 12px; /* must be 1/2 of ( border-width*2 + width ) */
	box-shadow: 1px 1px 1px black;
	color: white;
	font: bold 17px/15px Helvetica, Verdana, Tahoma;
	height: 18px; /* height + padding-top must equal width */
	padding-top: 2px; /* height + padding-top must equal width */
	text-align: center;
	width: 20px;
}

.bibItemDetail {
	width: 220px;
	font-size: 9px;
	float: right;
	padding: 3px;
	border: solid 1px #336342;
	margin-right: 5px;
	line-height: 105%;
	background-color: #A5D9B5;
}

.bookOrNot {
	border: 1px solid #ccc;
	color: #000;
	background-color: #fff;
	text-decoration: none;
	padding: 3px;
	margin-left: 220px;
}

.bookOrNot2 {
	border: 1px solid #ccc;
	color: #000;
	background-color: #fff;
	text-decoration: none;
	padding: 3px;
	margin-left: 150px;
}

.borrowerBarcode {
	text-decoration: none;
	color: #990000;
}

.boxSimple {
	background-color: #fff;
	border: 1px solid #555;
	padding: 10px;
	margin: 0px 0px 20px 0px;
}

.boxmein {
	border: 5px double #000;
	padding: 10px;
}

.button {
	float: right;
	margin:10px 55px 10px 0;
	font-weight: bold;
	line-height: 1;
	padding: 6px 10px;
	cursor:pointer;   
	color: #fff;
	text-align: center;
	text-shadow: 0 -1px 1px #64799e;
	background: #a5b8da;
	background: -moz-linear-gradient(top, #a5b8da 0%, #7089b3 100%);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#a5b8da), to(#7089b3));
	/* Border style */
	border: 1px solid #5c6f91;  
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	/* Box shadow */
	-moz-box-shadow: inset 0 1px 0 0 #aec3e5;
	-webkit-box-shadow: inset 0 1px 0 0 #aec3e5;
	box-shadow: inset 0 1px 0 0 #aec3e5;
}

.button:hover {
	background: #848FB2;
	cursor: finger;
	cursor: pointer;
}

.buttonIcon {
	vertical-align: bottom;
/*	float: left;*/
	margin: -2px 0px 0px 8px;
}

.buttonIcon a {
}

.cellcontent {

}

.celltag {
	text-align: right;
}

.childCtrl {
	clear: both;
	float:left;
	margin-bottom: 10px;
}

.childinc {
	font-family: Arial, Verdana; 
	text-shadow: 2px 2px 2px #ccc;
	display: block; 
	float: left; 
	font-weight: bold; 
	margin-right:10px; 
	text-align: right; 
	width: 70px; 
	line-height: 25px; 
	font-size: 15px; 
}

.clipboard {
	font-size: 7.5px;
}

.colheader {
	color: #FFF;
	background-color: #555;
	font-weight: bold;
}

.controls div, .controls div input {
	float:left;
	margin-right: 10px;
}

.dcheader {
	font-weight: bold; 
	line-height: 25px; 
	font-size: 18px; 
}

.dcinput{
	width: 130px;
	margin-right: 15px;
}

.dcsub {
	font-weight: bold; 
	font-size: 11px; 
}

.detail {
	width: 640px;
	background-color: #fff;
}

.dob {
	margin-left: 45px;
}

.dobE {
	margin-left: 45px;
	color: #AB1648;
}

.duplicate {
	padding: 3px;
	border: solid 1px #f00;
	color: #5C0000;
	background-color: #F0E6E6;
	width: 300px;
	clear: both;
	float: right;
}

.editSubmit {
	float: left;
	margin-left: 20px;
	font-size: 14px;
}

.emailContent {
	margin-bottom: 25px;
	background-color: #fff;
	border: 1px solid #555;
	padding: 6px;
}

.field{
	margin-bottom:7px;
	clear: both;
}

.field:hover .hint {  
	position: absolute;
	display: block;  
	margin: -30px 0 0 455px;
	color: #FFFFFF;
	padding: 7px 10px;
	background: rgba(0, 0, 0, 0.6);
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;	
}

.fl {
	float: left;
}

.frlm {
	
	float: right;
	margin-left: 7px;
}

.groupHeader {
	background-color: #aaa;
	font-weight: bold;
	font-size: 14px;
}

.highline li{
	line-height: 250%;
}

.hint{
	display:none;
}

.history{
	margin-bottom: 10px;
	font-size: 18px;
	text-shadow: 2px 2px 2px #ccc;
}

.icon {
	margin: 0px 0px 0px 3px;
	padding: 1px;
	border: none;
	float:left;
}

.inactive0 {
	color:#777;
	background-color: #FAF5F5;
}

.inactive1 {
	color:#777;
	background-color: #F2E6E6;
}

.input{
	font-family: Arial, Verdana; 
	font-size: 15px; 
	margin-top:4px;
	padding: 5px; 
	border: 1px solid #b9bdc1; 
	width: 300px; 
	color: #797979;	
}

.input:focus{
	background-color:#E7E8E7;	
}

.input.radiocheck {
	padding: 0px;
	margin: 0px 0px 0px 2px;
	vertical-align: bottom;
}
.legend {
	border: solid 1px #555;
	background-color: #efefef;
	font-size: 9px;
	padding: 3px;
	width: 380px;
	height: 20px;
	clear: both;
	float: left;
}

.legfl {
	float:left;
}

.licon {
	margin: 0px 3px 0px 9px;
	text-align: center;
	float:left;
	border: none;
}

.lm {
	margin-left: 40px;
}

.logoutButton {
	float: right;
	margin-left: 10px;
}

.menuReturn {
	clear: both;
	float: right;
	border: solid 1px #444;
	padding: 2px;
}

.menuReturn a{
	color: #444;
	font-weight: bold;
	text-decoration: none;
}

.mergeCart {
	float: left;
	margin-left: 35px;
}

.narrowLabel {
	width: 150px;
}

.newdc {
	background-color: #DDD;
	color: #555;
	padding: 3px 3px 3px 3px;
	border: solid 1px #555;
	margin: 10px 10px 10px 0px;
	text-decoration: none;
	clear: both;
	float: right;
}

.notactive0 {
	color:#AAA;
	background-color: #FFF;
}

.notactive1 {
	color:#AAA;
	background-color: #EEE;
}

.optionalBlock {
	display: none;
}

.reload {
	float: right;
	width: 30px;
	cursor:pointer;
}

 strong.reqd { font-size: 140%; }
.reqd {
	padding: 5px 5px 5px 12px;
	color: #555;
	text-decoration: none;
	font-weight: bold;
	font-size: inherit;
	text-shadow: 2px 2px 2px #ccc;
}

.reqResp {
	color: #f00;
	line-height: 90%;
}

.searchInst {
	margin: 10px 20px 10px 10px;
	width: 200px;
	font-size: 12px;
	float: right;
}

.searchInputs {
	margin: 20px 30px 10px 10px;
	width: 380px;
	float: right;
}

.secondaryRow {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #555;
}

.sheepit {
	text-decoration: none;
	border: solid 1px #555;
	padding: 5px;
	background-color: #ddd;
	color: #000;
	display: block;
	width: 110px;
	margin-bottom: 10px;
}

.smallerText {
	font-size: 9px;
}

.sortButtons {
	float: left;
	margin-left:7px;
}

.sortheader {
	float: left;
}

.submit {
	float: right;
}

.textarea {
	height: auto;
	min-height: 100px;
	overflow: auto;
	padding: 4px !important; 
}

.textystuff {
	width: 250px;
}

/*Badge credit: http://blog.thinkingstiff.com/2012/01/21/iphone-notification-badge-in-css/ */

.iconMenuBadge {
	position: relative;
	top: 1px;
	left: 1px;
}
.buttonBadge {
	position: absolute;
	top: -9px;
	left: -15px;
}
.badge {
	background: radial-gradient( 5px -9px, circle, white 8%, red 26px );
	background: -moz-radial-gradient( 5px -9px, circle, white 8%, red 26px );
	background: -ms-radial-gradient( 5px -9px, circle, white 8%, red 26px );
	background: -o-radial-gradient( 5px -9px, circle, white 8%, red 26px );
	background: -webkit-radial-gradient( 5px -9px, circle, white 8%, red 26px );
	background-color: red;
	border: 2px solid white;
	border-radius: 12px; /* one half of ( (border * 2) + height + padding ) */
	box-shadow: 1px 1px 1px black;
	color: white;
	font: bold 15px/13px Helvetica, Verdana, Tahoma;
	height: 16px; 
	padding: 3px 4px 1px 3px;
	text-align: center;
	min-width: 14px;
}