/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 *
 * ==|== normalize ==========================================================
 */

#footer {
	margin: 0px auto;
}


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/* =============================================================================
   Base
   ========================================================================== */


html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: sans-serif; color: #222; }

body { margin: 0; font-size: 1em; line-height: 1.4; background-color: #036; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { 
	background: #fe57a1; color: #fff; 
	/*color: #fe57a1;
	background-color: #FFFF88;*/
	text-shadow: none; 
}

a:focus { outline: thin dotted; }

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 1em 0; padding: 0 0 0 2em; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

svg:not(:root) { overflow: hidden; }

/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }

/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

button, input { line-height: normal; }

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

button[disabled], input[disabled] { cursor: default; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/* ==|== primary styles =====================================================
   Author:
   ========================================================================== */



body {
	margin: 0; padding: 0; 
	font-family: 'Proxima Nova', 'Trebuchet MS', Arial, sans-serif; 
	font-size: 18px;
	/*min-width: 534px;*/
	}
header
,footer { 
	width: 100%; 
	background-color: #000; 
	background-image: url('graphics/header_footer_bg.gif');
	background-repeat: repeat-x;
	color: #eee;
	border-top: solid 1px black;
	}
header {
	border-bottom: solid 1px black;
	padding-bottom: 1.5em;
}
body > #main > #mainInside {
	padding-top: 1em;
}
header > div
,body > #main > #mainInside
,footer > div {
	
	width: 90%; 
	min-width: 100px;
	max-width: 56em;
	margin: 0 auto;
	}


header > div
,footer > div {	
	padding: 10px 0;
	overflow: hidden;
	
}
header > div {
	background-image: url('graphics/bw_nys_seal_op25.png');
	background-position: center 70%;
	background-repeat: no-repeat;
}
footer > div {
	padding-top: 50px;
	min-height: 150px;
}
	
a 		{ color: #3399ff; text-decoration: none; }
a:hover	{ color: #55bbff; text-decoration: underline; }
	
h1,h2,h3,h4,h5 {
	font-family: Courier New, monospace;
	font-weight: normal;
	clear: both;
	}
	
.machineLevel {
	width: 30%; height: 33px;
	margin: 0 0; 
	padding: 10px 5%;  
	text-align: left; 
	letter-spacing: 0.3em; background-size: auto 100%;
	position: absolute; background: transparent;
}

.internalBanner {
	background-color: #222;
	color: #ccc;
}
.internalBanner > div {
	padding: 0.25em 0;
	width: 90%;
	margin: 0 auto;
}
.internalBanner img {
	width: 40px; height: 25px;
}

/* ======HHHHHHHHHHHHHHHHHHHHHHH HEADER HHHHHHHHHHH==== */
	
body > header #nybanner {
	height: 28px;
	background-color: #003366;
	width: 92%;
	max-width: 92%;
	padding: 10px 4%;
	margin: 0 auto;
	border-bottom: solid 1px black;
	background-image: none;
	}

body > header h1 {
	font-size: 300%;
	float: left; width: 30%;
	margin: 0; padding: 0;
	color: white;
	text-shadow: 1px 1px 1px black;	
}
body > header h1 .media {
	font-family: "Courier New", monospace;
	font-weight: lighter;
	letter-spacing: -0.05em;
	margin: 0 0.1em 0 0.05em;
	}
body > header h1 .contact {
	display: inline-block;
	font-family: 'Proxima Nova', 'Arial', sans-serif;
	font-weight: bold; 
	color: #ffff88;
	letter-spacing: 0.03em;
	}
body > header h1 .nys {
	color: #555;
	text-shadow: 0 0 0 #555;
	-webkit-transform: rotate(-90deg);
	display: none;
	}
	
/* Graphical header - replaces text header above */

body > header h1 {
	width: 100%;
	max-width: 420px;
	/*min-width: 310px;*/
	height: 1.6em;
	margin: 0;
	padding: 0 0 0 1.1em;
	background-image: url('graphics/mediaContact_icon_60x93.png');
	background-position: left 0;
	background-repeat: no-repeat;
	background-size: 1em 1.55em;
}
body > header a.partitionHome {
	display: block;
}
body > header h1.partition1 {
	/* background-image: url('graphics/mediaContact_logo_420x93.png'); */
}
body > header h1.partition2 {
	/* background-image: url('graphics/dcjsContact_logo_420x93.png'); */
}
	body > header h1.partition2 .media {
		text-transform: uppercase;
		font-size: 90%;
	}

body > header h1.partitionNews {
	/* background-image: url('graphics/nysNews_logo_420x93.png'); */
	background-image: url('graphics/nysNews_logo_93x93.png');
	background-size: 93px 93px;
}
body > header h1 * {
	/* display: none; */
	}

	
/* Page Sub-header = Partition Name */
body > header h2 {
	display: none;
	position: absolute;
	top: 130px; left: 20%;
	margin: 0; padding: 0;
	color: #666;
}
	
.mainNavMenu {
	min-width: 330px;
	margin: 0.5em 0 0 0;
	float: right;
	text-align: right;
}
	.mainNavMenu .username {
		width: 160px;
		min-height: 1em;
		font-size: 80%;
		clear: both;
		float: right;
		opacity: 0.0;
		text-align: center;
	}
	.mainNavMenu a {
		display: block;
		padding: 0 0.6em;
		float: right;
		border-right: solid 1px black;
		color: #39f;
		text-shadow: 1px 1px 3px rgba(30,30,30,0.9);
	}
	.mainNavMenu a:visited {
		color: #39f;
	}
		
	.mainNavMenu a:nth-child(2) {	
		border-right: 0; margin-right: 0; padding-right: 0; 
	}
	.mainNavMenu a:hover {
		/*background-color: #111;*/
		text-shadow: 1px 1px 3px black;
	}
	.mainNavMenu a.account:hover ~ .username  {
		display: block;
		opacity: 1.0;
	}
	.mainNavMenu a.searchNavLink {
		display: none;
	}


body > header div.search {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	clear: right;
	float: right;
	}
body > header div.search label {
	color: #bbb;
}
body > header div.search input[type="text"] {
	background-color: #444;
	background-color: rgba(68,68,68,0.5);
	border: solid 1px #666;
	color: white;
	font-family: Courier New, monospace;
	}
body > header div.search input[type="image"] {
	vertical-align: bottom;
}

.toggleNav {
	display: none;		/* not shown until smaller */
	padding: 0.4em;
	background-color: #333;
	border: solid 1px #111;
	border-radius: 0.4em;
	color: #ff8;
	outline: none;
	opacity: 0.75;
}

.toggleMainNavMenu {	
	position: absolute;
	top: 0.5em; right: 0.5em;	
	font-size: 100%;
	transition: all 0.1s;
}
.hasUNav .toggleMainNavMenu {
	top: 3.75em;
	background-color: #1B2A5E;
	opacity: 1.0;
}
	.toggleNav:hover {
		opacity: 1.0;
	}
	.toggleMainNavMenu:active {
		background-color: #ffff88;
		border-color: #333;
		color: #333;
	}
	.toggleMainNavMenu:active div {
		border-color: #333;
	}
	.toggleMainNavMenu div {
		display: block;
		border-bottom: solid 3px #fff;
		width: 3em;
		margin: 0.4em 0;
		transition: all 0.6s;
	}
	.toggleMainNavMenu div:first-child {
		margin-top: 0;
	}
	
	.mainNavMenu.is-open .toggleMainNavMenu {
		
	}
	.mainNavMenu.is-open .toggleMainNavMenu:after {
		content: " ";
		width: 0; height: 0;
		margin: 0 auto;
		display: block;
		position: absolute;
		border: solid 1.5em transparent;
		border-top: solid 1.5em #111;
		bottom: -3em;
	}
	
	.mainNavMenu.is-open .toggleMainNavMenu div {
		width: 2em;
		margin: 0.4em 0.5em;
	}
	.mainNavMenu.is-open .toggleMainNavMenu div:nth-child(1) {
		border-color: #39f;
		transform:  		translate(0em, 0.5em) rotate(135deg);
		-webkit-transform:  translate(0em, 0.5em) rotate(135deg);
		-moz-transform:  	translate(0em, 0.5em) rotate(135deg);
	}
	.mainNavMenu.is-open .toggleMainNavMenu div:nth-child(2) {
		border-color: #39f;
		transform:  		translate(0, 2.1em) rotate(180deg) rotateX(90deg);
		-webkit-transform:  translate(0, 2.1em) rotate(180deg) rotateX(90deg);
		-moz-transform:  	translate(0, 2.1em) rotate(180deg) rotateX(90deg);
	}
	.mainNavMenu.is-open .toggleMainNavMenu div:nth-child(3) {
		border-color: #39f;
		transform: 			translate(0em, -0.7em) rotate(-135deg);
		-webkit-transform: 	translate(0em, -0.7em) rotate(-135deg);
		-moz-transform:  	translate(0em, -0.7em) rotate(-135deg);
	}


/* =====FFFFFFF FOOTER FFFFFFFF======= */

footer > div {
	padding-bottom: 50px;
}

footer .siteName {
	display: block;
	margin-bottom: 1em;
	letter-spacing: 0.2em;
}

footer .siteName a {
	color: white;
}

footer .socialList {
	list-style: none;
	width: 210px;
	margin: 1em auto;
	padding: 0;
	/* overflow: auto;*/
	text-align: center;
}
footer .socialList > li {
	display: inline-block;
	position: relative;
}
footer .socialList > li a {
	display: block;
	margin: 0 0.3em;
	opacity: 0.75;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	line-height: 32px;
}
footer .socialList > li a:hover {
	opacity: 1.0;
}
footer .socialList > li img {
	width: 32px;
	height: 32px;
}
footer .socialList > li span {
	display: none;
	position: absolute;
	top: -1em;
	left: -2em;
	width: 10em;
}
/*
footer .socialList > li a:hover span {
	display: block;
}
*/


/* ================= BODY / Section / Article =============== */

body > #main {
	min-height: 20em;
	/*margin: -20px auto 0px auto;*/
	background-color: white;
	}

section {
	padding: 0px 0 3em 0;
	margin: 0px auto 0px auto;
}


section h1 {	
	font-size: 130%; 
	font-family: 'Proxima Nova', 'Trebuchet MS', Arial, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: #333;
}

section h2 
,.ab h2 {	
	font-size: 125%; 
	font-family: "Courier New", monospace;
	color: #666;
}
section hgroup h1 {
	margin-bottom: 0;
}
section hgroup h2 {
	margin-top: 0; 
	font-style: italic;
	font-size: 120%;
}
section hgroup h3.subtitle {
	margin-top: -1em !important; 
	font-style: italic;
	font-size: 105%;
	color: #999;
}
section h3 {	font-size: 115%; }
section h4 {	font-size: 110%; }
section h5 {	font-size: 105%; }

/* Dashboard variation */

/*
#dashboard {
	margin-top: -20px;
}
#dashboard section {
	padding-top: 0px;
}
*/


/* ============== Chest of Drawers ============== */

div.chest		/* If there's a chest */
/*,section > h1*/ 	/* If there's no chest, make the header look the same */
{
	background-color: #ededed;
	border-radius: 15px;
	border: solid 8px #e1e1e1;
	background-image: url('graphics/bg_light_fff_op50_800.png');
	background-repeat: no-repeat;
	background-position: center 10%;
	/*margin-top: -20px;*/
	position: relative;
	top: -40px;
	max-width: 520px;
	margin-bottom: -30px;
	z-index: 30;
	-webkit-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	
}
div.chest, nav.knobs {
	max-width: 520px;
}

div.chest:hover {
	border-color: #e1e1e1;
	box-shadow: 0em 0.1em 0.3em rgba(0,0,0,0.65);
}

div.chest h1
/*,section > h1 */
{
	margin: 0; padding: 0.5em 1em;
	text-shadow: 0 0 5px rgba(0,0,0,0.1);
	text-align: center;
	border-radius: 20px;
	cursor: pointer;
}

div.chest h2 {
	margin: 0.2em -1em;
	padding: 0.2em 1em;
	border-top: solid 6px #e1e1e1;
}
	


div.drawer { 
	display: none; 
	padding: 10px 20px;
	}
div.drawer a.closeAllDrawers {
	display: block;
	width: 6em;
	margin: 0 auto;
	text-align: center;
	border-top: solid 1px #999;
	color: #999;
	font-family: Courier New, monospace;
	}
div.drawer a.closeAllDrawers:hover {
	color: #777;
}

ul.listActions {
	display: block;
	margin: 0.5em 0 0 0; 
	padding: 0 0 6px 0;
	list-style: none;
	overflow: auto;	
	text-align: center;
	}
ul.listActions > li {
	display: inline-block;
	/* display: block; 
	float: left; */
	margin: 0.5em 0; padding: 0; 
	}

/* --- now using mcButton
ul.listActions > li > a {
	display: block; 
	padding: 0.4em 0.6em; 
	margin: 0 0.25em 0 0.25em;
	background-color: #ffff88;
	border: solid 1px #333;	
	border-radius: 10px;
	font-weight: bold;
	font-size: 100%;
	box-shadow: 0 2px 4px rgba(0,0,0,0.5);
	}
*/





nav.knobs {
	display: block;
	float: right;
	text-align: right;
	/*margin-top: -9px;
	margin-right: 10px;
	*/
	position: absolute;
	/*
	bottom: -24px;
	right: 10px;
	*/
	top: 10px; right: 10px;
	max-width: 130px;
}
div.chest h1 {
	margin-right: 130px;
	word-wrap: break-word;
	}

nav.knobs > a {
	display: inline-block;
	width: 22px; height: 22px;
	margin: 1px;
	line-height: 1.4em;
	border: solid 2px transparent; /*#e1e1e1;*/
	border-width: 2px 2px 4px 2px;
	background-color: inherit;
	color: white;
	border-radius: 4px;
	text-align: center;
	/*opacity: 0.8;*/
	background-color: #ededed;
	/*background-color: rgba(237,237,237,0.5);*/
	}
nav.knobs > a > img {
	width: 100%;
	height: 100%;
	display: block;
	opacity: 0.8;
}
nav.knobs > a:hover {
	border: solid 2px #999;
	padding: 1px 0;
	background-color: #FF8; /*rgba(255,255,255,0.2);*/
	opacity: 1.0;
}
nav.knobs > a:hover > img {
	opacity: 1.0;
}
div.drawer form.search {
	margin: 1em 0;
}
div.searchLinks {
	margin-top: 0.6em;
}

/* =====================((((( SIMPLE LIST STYLE )))))===== */

ol.simpleList {
	max-height: 400px;
	overflow: auto;
	padding: 0 0 0 4em;
}


/* =====================((((( BASIC LIST STYLE )))))===== */

ol.basicList {
	display: block;
	margin: 0; padding: 0;
	list-style: none;
	border: solid 1px #ccc;
}

ol.basicList > li {
	display: block;
	margin: 0; 
	width: 94%; /* 100% */
	min-width: 200px;
	padding: 1.5% 3%;
	border-top: solid 1px #ccc;
	/*overflow: auto;*/
	clear:both;
	background-color: white;
}

	ol.basicList > li.noRecords {
		font-style: italic;
		color: #999;
		opacity: 0.5;
	}

	ol.basicList > li.newRecord {
		background-color: #DFF2BF;
	}
	ol.basicList > li.newRecord:before {
		content: "NEW! ";
	}
	ol.basicList > li.deletedRecord {
		background-color: #ddd;
	}
	ol.basicList > li.deletedRecord:before {
		content: "DELETED ";
		color: red;
	}


ol.basicList > li:first-child { border-top: 0; }

/* Hack for replacing overflow:auto. See 'container' class below */
ol.basicList > li:before,
ol.basicList > li:after {
    content:"";
    display:table;
}
ol.basicList > li:after {
    clear:both;
}


ol.basicList > li > div {
	float: left;
}

ol.basicList > li > div.recordSelector
,.recordSelector {
	padding: 0.5em;
	width: 1.5em; /* was 3em */
	margin-right: 1em;
	border: solid 1px #ccc;
	float: left;
	/*background-color: #39F;*/
	background-color: #ddd;
	background-image: url('graphics/stripe_e1e1e1_ededed_12.png');
	color: #999;
	text-align: center;
	opacity: 0.75;
	-webkit-transition: all 0.3s ease-in-out;
	/*border-radius: 30px;*/
}
ol.basicList > li:hover div.recordSelector,
.recordSelector:hover	{	
	opacity: 1.0; 
}
ol.basicList > li > div.recordSelector.selectedRecord,
.recordSelector.selectedRecord	{	
	opacity: 1.0; 
	background-color: #39F; 
	background-image: none;
	color: white;
}

ol.basicList span.recordId {
	font-size: 80%;
}

ol.basicList > li > div.recordName,
.basicList .recordName {
	margin: 0.3em 0;
	width: 60%;
	float: left;
}
ol.basicList > li > div.recordName > a,
.basicList a.openItem,
.basicList .recordName > a {
	color: #222;
	padding-right: 29px !important;
	background-image: url('graphics/icons/mc_open_icon.png');
	background-position: 98% center;
	background-repeat: no-repeat;
	background-size: 18px 18px;
	-webkit-transition: background-size 0.2s ease-in-out;
}
ol.basicList > li > div.recordName > a:hover,
.basicList a.openItem,
.basicList .recordName > a:hover {
	color: #55bbff;
	background-image: url('graphics/icons/mc_open_icon_blue.png');
	background-size: 24px 24px;
}

ol.basicList > li > div.lastUpdated,
.basicList .lastUpdated {
	float: right;
	font-size: 80%;
	color: #999;
	text-align: center;
	margin: 0.1em 0.1em 0.1em 1em;
}

.basicList .primaryInfo.clickable {
	color: inherit;
	text-transform: none;
}
.basicList .primaryInfo.clickable:hover {
	text-transform: none;
}

.basicList .secondaryInfo {
	display: none;
}
.basicList > li.is-expanded {
	padding: 0 0 1em 0;
}
.basicList li.is-expanded .secondaryInfo {
	display: block;
}

	.basicList .primaryInfo {
		display: block;
		box-sizing: border-box;
		padding: 1.5% 3%;
		width: 100%;
		border-bottom: solid 1px #ccc;
		background: #fff;
	}
		ol.basicList > li.optedOut .primaryInfo {
			opacity: 0.8;
			color: #999;
		}
	.basicList > li .fullName {
		padding-left: 1.5em;
	}
	/*
	ol.basicList > li > div.fullName {
		display: inline-block;
		width: auto;
		min-width: 130px;
		position: relative;
	}
	ol.basicList > li > div.fullName > a {
		display: block;
		padding: 0.5em 1em 0.5em 1em;
		overflow: hidden;
	}
	*/
		.basicList > li .primaryInfo.clickable .fullName:before {
			content: "";
			display: inline-block;
			width: 0; height: 0;
			margin-left: -1.5em;
			border: solid 0.5em transparent;
			border-left: solid 0.55em #aaa;
			transition: transform 0.5s, border 0.5s;
		}
		.basicList > li.is-expanded .primaryInfo.clickable .fullName:before {
			transform: rotate(90deg) translateX(0.5em);
			
		}
		.basicList .primaryInfo.clickable:hover {
			text-decoration: none;
		}
		.basicList .primaryInfo.clickable:hover .fullName:before {
			border-left-color: #39f;
		}

	.basicList .secondaryInfo
	{
		min-width: 10em;
		padding-top: 1em;
		margin-top: 1em;
	}
		.basicList .secondaryInfo li {
			margin: 0.5em 0;
		}



/* =====================((((( CONTACTS LIST )))))===== */

ol.contactList {

}
ol.contactList > li,
ol.trackList > li 
{
	width: 100%;
	background: #eee;
	/* background: linear-gradient( to bottom, #ddd 0%, #eee 50%); */
	padding: 0 0 0.25em 0;
}

	.contactList .contactId {
		font-size: 50%;
		color: #ccc;
	}

	ol.contactList > li:first-child { }

	ol.contactList > li > div {
		float: left;
	}
	ol.contactList > li > div.submitResponse {
		float: none;
		display: block;
		background: #fff;
	}

	ol.contactList > li  ul {
		margin: 0; padding: 0;
		list-style: none;
	}
	
	.contactList .email {
		color: #aaa;
	}
	

	
	.contactList .contactInfo {
		width: 30%;
		margin-left: 4.5em;
	}
	.contactList .contactActions {
		clear: left;
		width: 30%;
		margin-left: 4.5em;
		border-top: solid 1px #ccc;
	}
	.contactList .tagInfo {
		float: right;
		box-sizing: border-box;
		width: 50%;
		padding-left: 2em;
		margin-left: 1%;
		margin-right: 4%;
		border-left: solid 1px #ccc;
	}
	.contactList .sectionTitle {
		color: #aaa;
		font-weight: bold;
		text-transform: uppercase;
		font-size: 80%;
	}

	.contactList .alerts {
		/* no style - it's hidden when empty */
		display: inline-block;
		font-style: italic;
		color: #666;
	}

	.contactList .alerts .optOut {
		padding: 0.2em 0.5em;
		
	}

	ol.contactList > li > div.socialLinks {
		float: right;
		font-size: 80%;
		width: 8em;
		min-height: 1em;
	}

	ol.contactList > li > div.socialLinks > ul {
		list-style: none; 
		display: block;

	}

	ol.contactList > li .contactTagList {
		font-size: 80%;
	}
	

span.dupEmail { background-color: #ff8; }
span.emailNotice { color: red; font-size: 80%; font-style: italic; }

.contactListSection div.ab.floatingAB {
	background: #fff;
}

.contactListSection div.ab {
	float: none;
	clear: both;
	margin-top: 0.5em;
	border: solid 1px #ccc;
	padding: 1em 1.5em;
	background-color: #ededed;
}
.contactListSection div.ab:after {
	content: "";
	display: table;
	clear: both;
}



/* =====================((((( COMM LIST )))))===== */

ol.commList > li {
	padding-bottom: 3%;
}

ol.commList > li > div.recordName {
	width: 40%;
}	
	
ol.commList > li > div.commDashboard {
	position: relative;
	float: right;
	width: 60%;
	min-width: 238px;
	/* margin-bottom: 2em; */
}
ol.commList > li > div.commDashboard > ol {
	margin: 0; padding: 0;
	width: 100%;
	min-width: 238px;
	height: 28px; /* 30 */
	font-size: 80%;
	list-style: none;
	border: solid 1px #ccc;
	background-color: #EDEDED;	
}
ol.commList > li > div.commDashboard > ol > li {
	float: left;
	display: block;
	width: 30%; /* 33% */
	height: 28px;
	min-width: 5em;
	line-height: 26px;
	padding: 0 1% 0 2%;
	text-shadow: 0 0 4px #ffff88;
	text-align: center;
	background-color: #ffff88;
	background-image: linear-gradient(170deg, rgba(225,225,225,1.0) 0%, rgba(225,225,225,0.1) 40%, rgba(225,225,225,0.0) 50%);
	background-image: -webkit-linear-gradient(170deg, rgba(225,225,225,1.0) 0%, rgba(225,225,225,0.1) 40%, rgba(225,225,225,0.0) 50%);
	/*background-image: -moz-linear-gradient(right, rgb(165,239,68) 3%, rgb(198,255,96) 52%, rgb(238,255,125) 81%);
	background-image: -webkit-linear-gradient(right, rgb(165,239,68) 3%, rgb(198,255,96) 52%, rgb(238,255,125) 81%);	*/
	position: relative;
	z-index: 5;
}
ol.commList > li > div.commDashboard > ol > li:last-child {
	padding-left: 2%;
}
ol.commList > li > div.commDashboard > ol > li:before  
{   
	content: ' ';  
    position: absolute;
    width: 0;
    height: 0;
    left: 0px;
    top: 0px;
    border: 13px solid;
    border-color: transparent transparent transparent rgba(225,225,225, 1.0);
	z-index: 10;
}

ol.commList > li > div.commDashboard > ol > li a {
	display: block;
}
ol.commList > li > div.commDashboard > ol > li.done {
	text-shadow: 0 0 4px white;
	background-color: #EDEDED;
	color: #999;
}
ol.commList > li > div.commDashboard > ol > li.done a {
	color: inherit;
}

ol.commList > li > div.commDashboard .commStatus  {
	position: absolute;
	top: 40px; 
	left: 0px;
	padding: 0.4em;
	width: 5em;
	min-height: 2em;
	margin-right: 1em;
	border: solid 2px white;
	text-align: center;
	font-size: 80%;
	line-height: 1.1em;
	background-color: #39F;
	border-radius: 10px;
	
	color: white;
	-webkit-transition: all 0.3s ease-in-out;
	opacity: 0.5;
	z-index: 10;
}
ol.commList > li > div.commDashboard .commStatusPublishing
,ol.commList > li > div.commDashboard .commStatusFinished {
	line-height: 2em;
}
ol.commList > li > div.commDashboard .commStatusPaused {
	background-color: black;
}


ol.commList > li > div.commDashboard .commStatus > a  {
	display: block;
	color: inherit;
	/*height: 60%;
	width: 100%;*/
}
ol.commList > li:hover > div.commDashboard .commStatus  {	opacity: 1.0; box-shadow: rgba(50, 50, 50, 0.498039) 1px 1px 10px; }	
ol.commList > li > div.commDashboard .commStatus0 {		left: 0%; }
ol.commList > li > div.commDashboard .commStatus1 {		left: 20%; }
ol.commList > li > div.commDashboard .commStatus2 {		left: 30%; }
ol.commList > li > div.commDashboard .commStatus3 {		left: 42%; }
ol.commList > li > div.commDashboard .commStatus4 {		left: 52%; }
ol.commList > li > div.commDashboard .commStatus5 {		left: 68%; }
ol.commList > li > div.commDashboard .commStatus6 {		left: 90%; }


/* http://www.sitepoint.com/pure-css3-speech-bubbles/ */
ol.commList > li > div.commDashboard .commStatus:before  
{  
    content: ' ';  
    position: absolute;  
    width: 0;  
    height: 0;  
    left: 7px;  
    top: -46px;  
    border: 23px solid;  
    border-color: transparent transparent white transparent;  
}
ol.commList > li > div.commDashboard .commStatus:after  
{  
    content: ' ';  
    position: absolute;  
    width: 0;  
    height: 0;  
    left: 10px;  
    top: -40px;  
    border: 20px solid;  
    border-color: transparent transparent #39F transparent;  
}
ol.commList > li > div.commDashboard .commStatusPaused:after {
	border-color: transparent transparent black transparent; 
}

ol.commList > li > div.lastUpdated {
	clear: right;
}

ol.commList > li > div.previewTest {
	font-size: 80%;
	clear: left;
}

ol.commList > li > div.lotteryWinners {
	clear: both;
	padding: 1em 0;
	border-top: solid 1px #ccc;
	width: auto;
}
ol.commList > li > div.lotteryWinners ol {
	font-size: 80%;
}
ol.commList > li > div.lotteryWinners ol.basicList > li {
	width: auto;
}



a.miniButton > span { display: none; }
a.miniButton {
	display: inline-block;
	margin: 2px auto;
	width: 18px; height: 18px;
	border: solid 1px rgba(50,50,50,0.4);
	background-color: rgba(50,50,50,0.3);
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 6px;
} 
a.miniButton:hover {
	background-color: rgba(50,50,50,0.6);
}
a.playButton {
	background-image: url('graphics/icons/mc_play_icon_small.png');
}
a.pauseButton {
	background-image: url('graphics/icons/mc_pause_icon_small.png');
	background-color: red;
	padding: 0.2em;
}

ol.commList > li > div.commDashboard .commStatus > a.miniButton { /* previous a.miniButton style gets overwritten by commStatus>a, so we need this */
	display: inline-block;
}

a.stopButton {
	background-image: url('graphics/icons/mc_rewind_icon_small.png');
}




/* ==== Tracking Data ==== */

div.trackingData {
	margin-top: 0.4em;
	margin-bottom: 0.4em;
	border: dotted 3px #ededed;
	overflow: auto;
	clear: both;
	background: /* rgba(100,100,100,0.15) */ url('graphics/bg_light_fff_op50_800.png') center center no-repeat;
}
div.trackingData > div {
	width: 46%;
	padding: 0.5em 1%;
	float: left;
}
div.trackingData > div > ul {
	/*font-size: 80%;*/
	margin: 0;
	padding: 0 0 0 2em;
	list-style: none;
}
div.trackingData > div > ul > li {
	
}
div.trackingData a.details {
	font-size: 80%;
}
div.trackingData > div > ul > li.details {
	display: none;
}
div.trackingData label {
	display: block;
	font-size: 80%;
	cursor: default;
}
div.trackingData > div > ul > li > span {
	display: inline-block;
	border: solid 1px #ddd;
	margin-bottom: 0.5em;
	padding: 0.2em 1em;
	border-radius: 4px;
	box-shadow: inset 0 0.2em 0.2em rgba(50,50,50,0.2), 0 0.25em 0.25em white;
	text-shadow: 0 -1px 1px white;
	/*
	text-shadow: 1px 1px 0.2em rgba(50,50,50,0.5);
	background-color: #666;
	color: white;
	*/
}
div.trackingData > div > ul > li > span.dot {
	/*
	background-color: #eee;
	color: #333;
	text-shadow: none;
	*/
}

/* ===== Email/iFrame Preview ======= */

div.emailPreview {
	clear: left;
	width: 60%;
	/*height: 0.5em;*/
	border: solid 1px #CCC;
	/*font-size: 80%;*/
	padding: 1em;
	margin: 1em 0;
	/*opacity: 0.75;*/
	overflow: hidden;
	-webkit-transition: height 0.5s ease;
	z-index: 40;
}
/*
div.emailPreview:hover
,div.emailPreview:active {
	opacity: 1.0;
	height: 6em;
	overflow: auto;
}
*/
div.emailPreview ul {
	list-style: none;
	margin: 0; padding: 0;
}
div.emailPreview li {
	border-top: dashed 1px #CCC;
	padding: 0.5em 0;
}
div.emailPreview li:first-child {
	border-top: 0;
}
div.emailPreview label {
	display: inline-block;
	width: 5em;
	color: #666;
	font-weight: bold;
	cursor: default;
}
div.emailPreview > a {
	float: right;
}

.previewSection {
	text-align: center; height: 50%;
}
.previewSection iframe {
	width: 90%; height: 80%; min-height: 300px;
	margin-top: 1em;
	border: solid 1px black;
	box-shadow: 1px 1px 20px rgba(50,50,50,0.7);
}


/* =====================((((( CONTACT LIST LIST )))))===== */
	

ol.listList > li > div.tagList {
	clear: left;
}

ol.listList > li > div.countBox {
	opacity: 0.5;
	float: right;
}
ol.listList > li:hover > div.countBox {	opacity: 1.0; }

ol.listList > li > div.dynamism {
	min-width: 5em;
}
	
ol.listList > li > div.dynamism > span {
	color: #999;
	font-style: italic;
	font-size: 80%;
	cursor: help;
}


/* ==== multi-use countBox ==== */

div.countBox {
	float: right;
	padding: 0.3em;
	background: #3399ff;
	color: white;
	text-align: center;
	-webkit-transition: all 0.3s ease-in-out;
	min-width: 3em;
	}
/*
div.countBox:before {
	content: 'view';
	font-size: 80%;
}
*/
div.countBox:hover {	
	opacity: 1.0; 
	color: white;
}
div.countBox > a {
	color: white;
	display: block;
	width: 100%;
	height: 100%;
}
div.countBox > a:hover {
	color: white;
}
div.countBox .count {
	display: block;
}
div.countBox .noun { 
	display: block;
	font-size: 80%;
}	
	
/* =====================((((( other )))))===== */	

	
	
.tagList {
	font-size: 80%;
	}
a.itemTitle {
	color: #333;
	}
	
a.moreFromList {	
	display: block;
	width: 10em;
	padding: 0.2em 0.5em;
	margin: 0 auto 0.2em auto;
	position: relative;
	top: -1px;
	border: solid 1px #ccc; 
	border-top: solid 2px #eee;
	border-radius: 0 0 10px 10px;
	text-align: center;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
a.moreFromList:hover {
	background-color: #ffff88;
	box-shadow: 0 3px 3px #999;
	padding: 0.4em 0.5em;
	margin-bottom: 0;
}

ul.toolList {
}
ul.toolList ul {
	margin: 0 0 0 10%;
}

.toolsContainer .colHalf {
	min-width: 16em;
}


/* ======================== LOTTERY ==== */

.lotteryProceed {
	display: inline-block;
	padding: 1em 2em;
	float: right;
}


/* ====================== Tag Cloud ======== */


span.tagCloud {

}

span.tagCloud span.tag {
	display: inline;
	display: inline-block;
	border: solid 1px transparent;
	padding: 0.2em 0.1em 0.2em 0.6em;
	margin: 0.05em 0.1em;
	-webkit-transition: all 0.3s ease;
	border-radius: 0 10px 10px 0;
	background: #fff;
	border: solid 1px #e1e1e1;
	box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.3);
}

span.tagCloud span.tag > span:first-child {
	font-style: italic;
}

span.tagCloud span.tag a.tagX {
	/*display: none;*/
	/*width: 1em; height: 1em;*/
	background: #ddd;
	color: white;
	padding: 0.1em 0.5em;
	border-radius: 10px;
	/*border: solid 1px #e1e1e1;*/
	font-size: 80%;
	font-weight: bold;
	text-align: center;
	-webkit-transition: width 0.3s ease;
	-webkit-transition: height 0.3s ease;
}




span.tagCloud span.tag:hover
,span.tagCloud span.tag.selectedTag {
	/*
	background: #ededed;
	border: solid 1px #e1e1e1;
	*/
}
span.tagCloud span.tag span.comma,
span.tagCloud span.tag:hover span.comma
,span.tagCloud span.tag.selectedTag span.comma {
	display: none;
}

span.tagCloud span.tag:hover a.tagX
,span.tagCloud span.tag.selectedTag a.tagX {
	display: inline-block;
	background: #39f;
}
span.tagCloud span.tag a.tagX:hover {
	background-color: red;
	text-decoration: none;
}

a.addTagButton {
	display: inline-block;
	background: #ccc;
	color: white;
	padding: 0.1em 0.3em;
	margin: 0 1em;
	border-radius: 10px;
	font-weight: bold;
	text-align: center;
	line-height: 1em;
}
a.addTagButton:hover {
	background: #39f;
	text-decoration: none;
}


/* ================== Modal ==== */

#pageModals {
	display: none;
	position: fixed;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	background-color: black;
	background-color: rgba(0,0,0,0.7);
	z-index: 100;
}
#pageModals > div {
	display: none;
	position: relative;
	width: 50%;
	min-width: 300px;
	max-height: 70%;
	padding: 1em;
	margin: 6% auto;
	background-color: white;
	box-shadow: 2px 2px 120px black;
	border: solid 8px #e1e1e1;
	overflow: auto;
}
#pageModals > div hgroup > h1 {
	display: block;
	margin: 0 0 0.3em 0;
	font-weight: bold;
	font-size: 22px;
	color: #999;
}
#pageModals > div hgroup > h2 {
	display: block;
	font-size: 18px;
	font-style: italic;
	color: #999;
	margin: 0 0 0.5em 0;
}
#pageModals > div div.bottomBar {
	margin: 1em -1em -1em -1em;
	padding: 0.5em 10%;
	background-color: #ddd;
	border: solid 1px #bbb;
	border-top: solid 1px transparent;
}
#pageModals a.x {
	display: block;
	position: absolute;
	top: 1em; right: 1em;
	padding: 0.25em 0.5em;
	border: solid 1px #ccc;
	color: #ccc;
	font-size: 80%;
	text-decoration: none;
}
#pageModals a.x:hover {
	color: black;
}

#pageModals > div#quickStart {
	margin-top: 16%;
}

/* =======FFFFFFFFFFFFFFFFF FOOTER FFFFFFFFF===== */

footer {
	text-align: center;
	font-size: 80%;
}
footer #copyright {
	opacity: 0.9;
}
footer #serverName {
	color: black;
	margin: 0 auto;
	opacity: 0.5;
	z-index: 0;
}
/*
footer #serverName:hover {
	margin: 0 auto;
	opacity: 1.0;
	color: white;
}
*/

	

/* ========================@@@@@@@@@@  GENERIC STYLES  @@@@@@@@@@@======= */
	
.none {
	font-style: italic;
	color: #999;
	opacity: 0.75;
}
	
.instructions {
	color: #666;
	font-size: 90%;
}
	
.colHalfContainer { 	/* optional */
	clear: both;
	/* overflow: auto; */
}
/* Clearfix For modern browsers */
.colHalfContainer:before,
.colHalfContainer:after {    content:"";    display:table; }
.colHalfContainer:after {     clear:both; }
/* Clearfix For IE 6/7 (trigger hasLayout) */
.colHalfContainer {    zoom:1; }

.colHalf {
	float: left;
	width: 46%;	
	margin: 0 2% 0 2%;
	overflow: auto;
}
#dashboard .colHalf { min-width: 300px; /* 424 */ }

.colHalf1 {				/* optional */
	margin: 0 4% 0 0%;
}
.colHalf2 {				/* optional */
	margin: 0 0% 0 4%;
}
.colHalf h1
,.colHalf h2
,.colHalf h3 {
	margin-top: 0;
}

/* Generic button */	

a.mcButton
,button.mcButton
,input.mcButton {
	display: block; 
	display: inline-block; 
	padding: 0.4em 0.8em; 
	margin: 0.1em 0.25em;
	border: solid 3px #39F;	
	background-color: #ffff88;
	color: #39F;
	border-radius: 10px;
	font-weight: bold;
	font-size: 100%;
	box-shadow: 0 2px 4px rgba(0,0,0,0.5), inset 0 1em 1em rgba(255,255,200,0.5);
	cursor: pointer;
}
a.mcButton:hover
,button.mcButton:hover
,input.mcButton:hover {
	color: #55bbff; text-decoration: underline;
	/*padding: 0.5em 0.9em; 
	margin: 0 0.15em;	
	box-shadow: 0 4px 5px rgba(0,0,0,0.5);*/
	border-color: #55bbff;
	text-shadow: 0 0 4px white;
	
}

button.mcButton:disabled
,input.mcButton:disabled {
	opacity: 0.5;
	box-shadow: 0 0 0 #000;
}
button.mcButton:disabled:hover
,input.mcButton:disabled:hover {
	color: #39F;
	text-decoration: none;
}

a.mcButtonPlus
,button.mcButtonPlus
,input.mcButtonPlus {
	display: inline-block;
	font-size: 110%;
	padding: 0.1em 0.7em 0.1em 0.7em;
}

a.mcButtonPlus:hover
,button.mcButtonPlus:hover
,input.mcButtonPlus:hover {
	text-decoration: none;
}

a.mcButtonAction
,button.mcButtonAction
,input.mcButtonAction {
	padding: 0.8em 1em; 
	margin: 0.5em;
}
/*
a.mcButtonAction:hover
,button.mcButtonAction:hover
,input.mcButtonAction:hover {
	padding: 0.9em 1.1em; 
	margin: 0.4em;
}
*/

.mcButton.mcButtonInvisible {
	border-color: transparent;
	background-color: transparent;
	box-shadow: none;
}
.mcButton.mcButtonInvisible:hover {
	border-color: transparent;
	background-color: transparent;	
}

/* ==== Other buttons ==== */

.downloadButton, a.downloadButton {
	float: right;
	background-image: url('graphics/icons/iconmonstr-download-2-icon-64-3399ff.png');
	background-position:	0.5em 50%;
	background-repeat:	no-repeat;
	background-size: 1.5em 1.5em;
	padding-left: 2.25em;
}


/* Line breaks */

.breakBefore:before {
	content: '\a';
	white-space: pre;
}



/* Closing "X" */

a.x {
	display: block;
	position: absolute;
	top: 1em;
	right: 1em;
	padding: 0.25em 0.5em;
	border: solid 1px #CCC;
	color: #CCC;
	font-size: 80%;
	text-decoration: none;
	text-transform: uppercase;
}

/* Tool tips */

.toolTip {
	display: none;
	position: absolute;
	max-width: 20em;
	padding: 1em;
	border: solid 1px #333;
	border: solid 1px rgba(50,50,50,0.8);
	box-shadow: 5px 5px 20px rgba(50,50,50,0.5);
	text-shadow: 0 0 5px white;
	background-color: #ffC;
	background-color: rgba(255,255,204,0.9); 
	font-size: 80%;
	text-align: left;
	border-radius: 4px;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	z-index: 50;
}

.openToolTip:hover + .toolTip
,.showToolTip:hover + .toolTip {	display: block; }
.openToolTip:hover .toolTip
,.showToolTip:hover .toolTip {		display: block; }	
	
/* Wait, Loading */

.waitLoading {
	min-width: 32px;
	min-height: 32px;
	background: center center url('graphics/ajaxLoad.gif') no-repeat;
}
.fullPageLoader {
	position: fixed;	z-index: 1000;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background-color: white;
	background-color: rgba(0,0,0,0.7);
}
.fullPageLoader > div {
	position: fixed;	z-index: 1000;
	top: 0; left: 0;
	width: 60%; 
	height: 60%;
	margin: 20%;
	line-height: 180px;
	border: dotted 20px white;
	/*border: solid 8px #ededed;*/
	background-color: white;
	background-color: rgba(255,255,255,0.8);
	box-shadow: 0 0 200px rgba(255,255,255,0.8);
	background-position: center center;
	background-image: url('graphics/ajaxLoad.gif');
	background-size: 60px 60px;
	background-repeat:	no-repeat;
	text-align: center;
	font-size: 40px;
	color: black;
	text-shadow: 0 0 200px white, 0 0 40px white, 0 0 10px white;	
	border-radius: 100px;
}

.miniHelp {
	display: inline-block;
	padding: 0.1em 0.5em;
	border: solid 1px rgba(255,255,255,0.8);
	content: '?';
	font-size: 70%;
	text-align: center;
	background-color: rgba(255,255,255,0.3);
	border-radius: 15px;
	color: #39F;
	cursor: help;
	font-weight: bold;
	font-family: Arial;
}
.miniHelp:hover {
	color: #999;
	border-color: #999;
}
.miniHelp:hover + .toolTip {	display: block; }
.miniHelp:hover .toolTip {		display: block; }

.requiredTip {
	color: #004F9D;
	/*position: absolute;
	margin-left: -20px;
	*/
	display: inline-block;
	font-weight: normal;
	font-size: 28px;
	height: 20px;
	margin-left: 10px;
}
.requiredTip:hover + .toolTip {		display: block; font-size: 16px; color: black; }
.requiredTip:hover .toolTip {		display: block; font-size: 16px; color: black; }


.helpfulTip {
	margin: 1em 0 1em 0;
	padding: 1em 1em;
	font-size: 80%;
	border: dotted 2px #ededed;
	text-align: center;
	border-radius: 20px;
}

.externalLink {
	display: inline-block;
	background: url('graphics/icons/Icon_External_Link.png') center right no-repeat;
	padding-right: 16px;
}
.emptyExternalLink {
	display: inline-block;
	width: 20px;
	height: 1em;
	background: url('graphics/icons/Icon_External_Link.png') center center no-repeat;
	padding-right: 0;
}

/* ======================== AJAH BLOCKS =================== */

div.ab {
	position: relative;
	/*border: solid 1px #ccc;
	padding: 1em 1.5em;
	background-color: #ededed;
	*/
}
a.abX,
.closeX
{
	display: block;
	position: absolute;
	top: 0.5em; right: 0.5em;
	padding: 0.25em 0.5em;
	border: solid 1px #666;
	color: #666;
	font-size: 80%;
	text-decoration: none;
	background-color: rgba(255,255,255,0.4);
}
a.abX:hover,
.closeX:hover 
{
	color: black;
	box-shadow: 0 0 10px white;
	background-color: rgba(255,255,255,0.6);
}
.feedback a.abX {
	border: solid 1px transparent;
}
	div.ab.floatingAB {
		position: absolute;
		z-index: 100;
		box-shadow: 0 1em 2em rgba(50,50,50,0.5), 0 0 0.25em rgba(0,0,0,0.5);
	}



/* ======================== MULTI SELECT ========= */

.multiSelectActions {
	border: solid 1px #ccc;
	background-color: #39f;
	padding: 1em;
}

/* ================ TABLESEARCH ====== */

.tableSearch {
	margin: 1em 0;
	padding: 0.25em;
}
.circle {
	width: 3em; height: 3em;
	line-height: 3em;
	text-align: center;
	float: right;
	border-radius: 10em;
	background-color: #ff8;
	color: #39f;
	border: solid 2px #39f;
}
.circle:hover {
	background-color: #39f;
	color: white;
}


/* ======================== ACCOUNT ========= */

.accountView form {
	background-color: #ededed;
	border: solid 8px #e1e1e1;
	margin-bottom: 1em;
	padding: 0.5em;
	border-radius: 15px;
	position: relative;
}

.accountView form input[type="submit"] {
	position: absolute;
	right: 1em;
	bottom: 1em;
}
.accountView form ul ul {
	margin: 0; padding-left: 1em;
}

.accountAccessList {
	margin-bottom: 2em;
}
.accountAccessList > li {
	margin-bottom: 1em;
}

.accountDevNotes {

}
.accountDevNotes h2 {
	border-top: solid 1px #ccc;
	margin-top: 1em;
	padding-top: 1em;
}
.accountDevNotes h2 > span {
	color: #ccc;
	font-size: 80%;
}
.accountDevNotes table {
	border: solid 1px #666;
}
.accountInfoLists label {
	display: inline-block;
	min-width: 7em;
	color: #bbb;
	font-style: italic;
	cursor: normal;
}
.roleSelectionList {
	list-style: none;
}

/* ============================== TAG MANAGEMENT ===================== */


button.addTagButton {
	margin: 1em 0;
	/*float: right;*/
}

.clickable:hover {
	cursor: pointer;
	color: #55bbff; text-decoration: underline;
}

ol.catList {
	display: block;
	margin: 0; padding: 0;
	list-style: none;
	border: solid 1px #ccc;
}

ol.catList > li {
	display: block;
	margin: 0; padding: 0;
	border-top: solid 1px #ccc;
	height: 58px;
	clear:both;
	background-color: rgba(255,255,255,0.5);
	-webkit-transition: all 0.3s ease-in-out;
}
	ol.catList > li:after {
		display: table;
		content: "";
		clear: both;
	}
	ol.catList > li:first-child { border-top: 0; }

	ol.catList > li:hover { background: #ff9;opacity: 1.0;cursor: pointer; }


	ol.catList > li > span {
		float: left;
		display: block;
		margin: 0.3em 0 0.3em 1em;
		/*width: 70%;*/
	}


	ol.catList > li div.catCount {
		/*position: absolute; right: 0; top: 0;
		height: 2em;*/
		float: right;
		width: 85px;
		height: 58px;
		background: #3399ff;
		color: white;
		text-align: center;
		opacity: 0.5;
		-webkit-transition: all 0.3s ease-in-out;
		}
	ol.catList > li:hover div.catCount {	opacity: 1.0; }

	ol.catList > li div.catCount .count {
		display: block;
		}
	ol.catList > li div.catCount .contacts { 
		display: block;
		font-size: 80%;
	}

	ol.catList > li.selectedTag {
		position: relative;
		background-color: #ededed;
	}
	ol.catList > li.selectedTag:before {
		position: absolute;
		right: -2em; top: 0.5em;
		display: block;
		content: "";
		height: 0; width: 0;
		border: solid 1em transparent;
		border-left-color: #39f;
		
	}
	ol.catList > li.selectedTag div.catCount {	opacity: 1.0; }

.alphaList {
	border: 1px solid #ccc;
}

#tags ul {
	list-style: none;
}
#tags li {
	list-style-type: none;
}

input.tagCheck[type="checkbox"] {
	float: left;
	clear: left;
	margin: 6px 1em 6px 1px;
}

#tagActions {
	padding: 1.5em;
	float: right;
}



/* ============== HACKS ====== */

/* http://stackoverflow.com/questions/211383/which-method-of-clearfix-is-best */
/* For modern browsers */
.container:before,
.container:after {
    content:"";
    display:table;
}
.container:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.container {
    zoom:1;
}


/* ========== jQuery UI Overrides ============================== */

body .ui-widget-header {
	background: none;
	background-color: #333;
	background-image: url('graphics/header_footer_bg.gif');
	background-repeat: repeat-x;
	background-position: top center;	
	border: solid 1px #333;
}
body .ui-tabs-nav {
	padding: 0.5em 0.5em 0;
}
body .ui-dialog-title {
	text-shadow: 1px 1px 10px black;
}
body .ui-dialog {
	box-shadow: 2px 2px 500px rgba(50,50,50,0.5), 2px 2px 100px black;
}
	


/* ======================== DEBUG ========= */

div.debugDetails {
	display: inline-block;
	background-color: yellow;
	border: dashed 1px #bbbb00;
	padding: 0.2em;
	font-family: monospace, sans-serif;
	font-size: 12px;
}
div.debugDetails > div {
	display: none;
}
div.debugDetails:hover > div {
	position: absolute;
	display: block;
	padding: 0.2em;
	background-color: inherit;
	border: inherit;
}

div.debugView {
	border: solid 1px red;
}
div.debugView div.debugViewName {
	position: absolute;
	background-color: red;
	border: solid 1px red;
	border-color: inherit;
}
/*
div.debugView.debugViewOdd {
	border-color: green;
}
*/







/* ==|== media queries ======================================================
   EXAMPLE Media Query for Responsive Design.
   This example overrides the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}



/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* ==============================================
 * Jays additional CSS stuff
 ============================================== */


a.alphaAnchor {
	color: #ccc;
	cursor: default;
	font-size: 9pt;
}

#tagListTable {
	width: 526px;
}



ul.newListOptions { 
	padding: 0; margin: 0;
	list-style: none;
	display: block;
	overflow: auto;
	font-size: 80%;
}
ul.newListOptions > li {
	display: block;
	margin: 0; padding: 0 2% 0 2%;
	width: 26%;
	float: left;
}

#tags {
	height: 321px;
	overflow: auto;
	background-color: #ffffff;
	border: 1px solid #cccccc;
}

.alphaSeparatorLine {
	margin-top: 4px;
	margin-right: 10px;
	border-bottom: 1px solid black;
	font-weight: bold;
	font-size: larger;
	color: black;
}

.liTag {
	cursor: pointer;
}

fieldset {
	border: 1px solid #000000;
	padding: 8px;
	margin: 8px 0;
}

.nyCountyCB {
	
}

.tinyLabel {
	font-size: 9pt;
}







fieldset {
	border: 1px solid #000000;
	padding: 8px;
	margin: 8px 0;
}

table th, table td {
	//text-align: left;
}

#tagTable {
	float: left;
	margin-left: 25px;
	width: 550px;
}

#categorySelection {
	width: 330px;
	float: left;
}
	#categorySelection :after {
		display: table;
		content: "";
		clear: both;
	}

#tagSelection { 
	width: 350px;
	float: left;
	overflow: auto;
}

.alphaSeparatorLine {
	margin-top: 4px;
	margin-right: 10px;
	border-bottom: 1px solid black;
	font-weight: bold;
	font-size: larger;
	color: black;
}

/*#filters {
	height: 600px;
	width: 960px;
}*/
/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}


/* ============================= RESPONSIVE ========================== */

@media (max-width: 1050px) {

	/* Make the logo smaller */
	body > header h1,
	body > header h1.partitionNews	{	/* 90% */
		display: block;
		max-width: 378px;
		font-size: 270%;
	}
	body > header h1.partitionNews {
		background-size: 83px 83px;	
	}
	
	/* Remove search box and replace with search link */
	body > header div.search {
		display: none;
	}
	.mainNavMenu {
		margin-top: 0;
	}
	.mainNavMenu a.searchNavLink {
		display: inline;
	}
	

	div.chest h1 {
		letter-spacing: 0.05em;
		padding-left: 0.5em; padding-right: 0.5em;
	}
}


@media (max-width: 742px) {
	#dashboard .colHalf {
		width: 100%;
		margin-bottom: 2em;
	}
	#dashboard .colHalf2 {
		margin: 0;
	}
	div.chest h1 {
		letter-spacing: 0;
		padding-left: 0.25em; padding-right: 0.25em;
	}

	body > header h1,
	body > header h1.partitionNews {	/* 80% */
		font-size: 240%;
	}	
	body > header h1.partitionNews {
		background-size: 74px 74px;	
	}
	
	.internalBanner {
		font-size: 80%;
	}
	.internalBanner img {
		width: 30px;
		height: auto;
	}
}


@media (max-width: 700px) {

	/* Make the logo smaller */
	body > header h1,
	body > header h1.partitionNews {	/* 75% */

		font-size: 225%;
	}
	body > header h1.partitionNews {
		background-size: 69px 69px;	
	}

	header > div,
	body > #main > #mainInside,
	footer > div
	{
		width: 92%;
	}
	section h1 {
		letter-spacing: 0.1em;
	}
	.mainNavMenu a	{
		padding: 0.25em 0.5em;
	}
	

	.contactList .secondaryInfo
	{
		min-width: 10em;
		padding-top: 1em;
		border-top: solid 1px #ccc;
	}
		.contactList .contactInfo {
			border-top: none;
		}
	
		.contactList .contactInfo,
		.contactList .contactActions,
		.contactList .tagInfo	
		{
			clear: both;
			width: auto;
			margin-left: 2em;
			padding-left: 0;
			border-left: none;
			float: none;
		}

	
}

@media (max-width: 600px) {		/* "MOBILE" view */

	body > header #nybanner {
		height: 21px;
	}
	body > header #nybanner a {
		display: none;
	}
	body > header #nybanner a:first-child {
		display: inline;
	}
	body > header #nybanner a:first-child img {
		width: 147.75px;
		height: 21px;
	}
	
	
	
	header > div,
	body > #main > #mainInside,
	footer > div
	{
		width: 95%;
	}
	body > header h1,
	body > header h1.partitionNews {	/* 60% */
		height: 55.8px;
		background-size: 36px 55.8px;
		background-position: left center;
		/* background-position: center center; */
		line-height: 55px;
	}
	body > header h1.partitionNews {
		background-size: 55px 55px;
		
	}
	
	/* Responsive Main Nav Menu */
	.mainNavMenu {	
		display: block;
		clear: both;
		float: none;
		text-align: center;
	}
	.toggleNav {
		display: block;	
	}
	.mainNavMenu a 
	,.mainNavMenu a.searchNavLink {
		/* display: none; */
		transform:  		rotateY(90deg) rotateZ(6deg);
		-webkit-transform: 	rotateY(90deg) rotateZ(6deg);
		-moz-transform:  	rotateY(90deg) rotateZ(6deg);
		
		height: 0; overflow: hidden;
		box-sizing: border-box;
		width: 50%;
		border: 0;
		padding: 0;
		background-color: #333;
		background-color: rgba(0,0,0,0.1);
		box-shadow: inset 0 0.5em 0.5em rgba(255,255,255,0.1);
		transition: all 0.5s;
	}
	.mainNavMenu a.homeNavLink {
		width: 100%;
	}
	.mainNavMenu a:hover  {
		background-color: rgba(255,255,255,0.1);
	}
	.mainNavMenu.is-open a {
		display: block;
		transform:  		rotateX(0) rotateY(0) rotateZ(0);
		-webkit-transform:  rotateX(0) rotateY(0) rotateZ(0);
		-moz-transform:  	rotateX(0) rotateY(0) rotateZ(0);
		height: 3em;
		border: solid 1px rgba(0,0,0,0.2);
		line-height: 3em;
		margin: 0.1em 0;
	}
		.mainNavMenu .username,
		.mainNavMenu a.account:hover ~ .username  {
			display: none;
		}
	
	body > header > div {
		padding: 0.5em;
		background-size: auto 60%;
	}
	
	
	div.chest ul.listActions > li {
		display: block;
	}
	div.chest .mcButton, 
	div.chest a.mcButton {
		display: block;
		width: 80%;
		text-align: center;
	}
	

	.colHalf {
		width: 100%;
		margin-bottom: 2em;
	}
	.colHalf2 {
		margin: 0;
	}

	
	
	div.trackingData > div > ul {
		padding: 0 0 0 0;
	}
	
	.ui-tabs .ui-tabs-panel {
		padding: 0.5em;
	}

	
}

@media (max-width: 400px) {

	body > header h1.partitionNews {
		height: 83px;
	}
	section h1 {
		letter-spacing: 0.0em;
	}	
	div.chest h1 {
		letter-spacing: 0.0em;
	}

}

@media (max-width: 340px) {
	body > header {
		font-size: 90%;
	}
	.mainNavMenu {
		min-width: 100%;
	}
}

@media (max-width: 300px) {
	body > header h1 {	/* 40% */
		height: 37.2px;
		background-size: 168px 37.2px;
	}
	body > header h1.partitionNews {
		height: 83px;
	}	
}

/* ==|== Site Closed Styles ========================================*/
.homeBox {
	overflow: auto;
	}
	
.homeBox {
	margin: 1em auto 2em auto; width: 745px; padding: 30px;
	border: 4px solid #057BD5;
	background: white;
	}
.homeBox p {
	clear: both;
	}