H1 {font-family: Arial,Helvetica,sans-serif;
	font-size: 12pt;
	font-weight: bold;
	text-align: center;
	padding-top: 2pt;
	padding-bottom: 0pt;
	margin: 0;
	}
H2 {font-family: Arial,Helvetica,sans-serif;
	font-size: 10pt;
	font-weight: bold;
	text-align: left;
	padding-top: 10pt;
	padding-bottom: 0pt;
	margin: 0;
	}
H3 {font-family: Arial,Helvetica,sans-serif;
	font-size: 9pt;
	font-weight: bold;
	text-align: left;
	padding-top: 5pt;
	padding-bottom: 0pt;
	margin: 0;
	}
TD, TH {font-family: Arial,Helvetica,sans-serif;
	font-size: 8pt;}
TH {text-align: right;}
TD {text-align: left;}
INPUT[TYPE=TEXT], input[type=password], input[type=number] {
	background-color: none; 
	font-family: "ProFontWindows","Bitstream Vera Sans Mono","Lucida Console"; 
	font-size: 8pt;
}
.subcaption {font-family: Arial,Helvetica,sans-serif; font-size: 7pt; font-weight: bold;text-align: center;}
TABLE {border-collapse: collapse;}
button  { font-family:  "Arial","ProFontWindows","Bitstream Vera Sans Mono","Lucida Console";
	font-weight: bold;
	font-size: 9pt;
	background-color: #ffffdd; 
	border-width: 1px;}
INPUT[TYPE=SELECT] { font-family:  "Arial Narrow";}
INPUT[TYPE=OPTION] { font-family:  "Arial Narrow";}
INPUT[TYPE=SUBMIT] { font-family:  "Arial","ProFontWindows","Bitstream Vera Sans Mono","Lucida Console";
	font-weight: bold;
	font-size: 9pt;
	background-color: #FFFFFF; 
	border-width: 2pt;}
INPUT[TYPE=CHECKBOX] { font-family:  "Arial","ProFontWindows","Bitstream Vera Sans Mono","Lucida Console";
	padding: 0pt;
	margin-left: 0pt;
	margin-right: 3pt;
	margin-top: 0pt;
	margin-bottom: 0pt;}

div#nav0 {position: absolute; top: 4px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav1 {position: absolute; top: 60px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav2 {position: absolute; top: 116px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav3 {position: absolute; top: 172px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav4 {position: absolute; top: 228px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav5 {position: absolute; top: 284px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav6 {position: absolute; top: 340px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#nav7 {position: absolute; top: 396px; left: 4px; width: 99px; height: 50px; background: 
#FFFFFF; }
div#navmolly {position: absolute; top: 9px; left: 108px; width: 300px; height: 12px; 
background: none; }
div#main {position: absolute; top: 4px; left: 103px; width: 700px; height: 500px; 
background: #8DF380; }
div#overlay {position: absolute; top: 4px; left: 103px; width: 700px; height: 500px; 
background: none; }
div#bottomframe {position: absolute; top: 512px; left: 20px; width=480px;}

div#orgyframe,
div#indyframe, 
iframe#reportsframe 
	{position:	absolute;
	top:	35px;
	width:	95%;
	height:	100%;
	overflow: auto;
	border: 1pt;
}

#indyframe {
	margin-top:40px;
}

div#individualmain {
	position: absolute;
	width: 100%;
	height: 100%;
	height: calc(~"100vh - 120px");
	width: calc(~"100vw - 61px");
	background-color: #ddddff;
}

div#individualmainmenu {
	display: flex;
	width: 95vw;
	height: 45px;
	background-color: #ccccff;
//	border: 1pt solid black;
}

div#mainMenuTab,
div#historyMenuTab,
div#preferencesMenuTab {
	flex: 1;
	border: 1px solid #8888ff;
	text-align: center;
	font-size: 2.5vw;
	vertical-align: center;
	font-family: Trebuchet MS, sans-serif;
	font-style: italic;
    		border-radius: 3vw 3vw 0px 0px;
}

@tabsHeight: 36px;
@tabColor: #22ff22;
@tabSelectedColor: #ccccff;

.folder-tab {
	height: @tabsHeight;
// 	width: 150px;
  	position: relative;
//  	top: 10px;
  	background-color: @tabColor;
//  	left: 28px;
  	display: inline-block;
	z-index: 2;
 // 	margin-right:50px;
	color: #666666;
  	cursor: pointer;
  	&.selected, &:hover	{
    		z-index: 3;
    		color: #000033;
    		background-color: @tabSelectedColor;
    		background-color: #ddddff;
	    	&:before, &:after	{
			background-color: @tabSelectedColor;
			background-color: #ffeeee;
 		}
 	}
  
	&:before 	{
//		opacity:1;
    		height: @tabsHeight;
    		width: 30px;
    		border-radius: 10px 10px 0px 0px;
    		background-color: @tabColor;
    		background-color: #000000;
    		content: "";
    		position: absolute;
  //		left: -20px;
   		top: 0px;
    		-webkit-transform: skewX(-20deg);
    		transform: skewX(-20deg);
    		z-index: -1;
 	}
 	&:after		{
 		height: @tabsHeight;
		width: 30px;
		border-radius: 10px 10px 0px 0px;
		background-color: @tabColor;
		background-color: @000000;
		content: "";
		position: absolute;
// 		right: -20px;
    		top: 0px;
    		-webkit-transform: skewX(20deg);
    		transform: skewX(20deg);
    		z-index: -1;
  	}
	span	{
//		display: inline-block;
//  		margin-left: 8px;
//  		margin-right: 8px;
    		height: @tabsHeight;
    		line-height: @tabsHeight + 4;
    		z-index: 3;
    
  	}
}


div#individualmaincontent {
	display: block;
	width: 100%;
	background-color: #aaffaa;
}

div#orgyframe {
	background: #ADB1FF;
}

div#indyframe {
	background:	#8dcff4;
}

iframe#reportsframe {
	background:	#efadff;
	height: 50%;
}

span#individualName.mainPageData, #individualName,
span#organizationName.mainPageData, #organizationName,
.mainPageData {
	font-size: 18pt !important;
	background-color: #aaf;
	font-family: Gill-Sans;
	padding: 0px;
	margin: 4px;
//	clear: both;
	width: 100%;
	border: 1pt black;
	display: block;
	text-decoration: underline;
	span:hover {
//		border: 1px solid red;
//		box-sizing: border-box;
//		-moz-box-sizing: border-box;
//		-webkit-box-sizing: border-box;
	-webkit-box-shadow:inset 1px 1px 1px 1px #f00;
  -moz-box-shadow:inset 1px 1px 1px 1px #f00;
  box-shadow:inset 1px 1px 1px 1px #f00;
	}
}

#oboCheckbox {
	display: block;
	text-align:right;
}

#fundraiserCheckbox {
	display: block;
	text-align: right;
}

#formalSalutation, #informalSalutation {
	margin: 4px;
	margin-left: 24px;
}

#formalSalutation {
	display: block;
}

#informalSalutation {
	display: inline;
}

#salutationsBlock {
	display: inline-block;
	vertical-align: middle;
	border: 1px black;
}

#organizationAttributes {
	display: block;
	vertical-align: middle;
	align: right;
//	display: flex;
//	justify-content: space-between;
}

#organizationHeader,
#individualHeader {
//	background-color: #fff;
//	display: flex;
//	justify-content: space-between;
	display: block;
}

#organizationErrata,
#individualErrata {
	width=100%;
	background-color: #fff;
	display: flex;
	clear: both;
	justify-content: space-between;
}

#individualTitle span, #individualFname span, #individualMiddleName span, 
#individualLname span, 
#individualSuffix span {
//	border-bottom: 2px solid black;
	min-height:20px;
	min-width:20px;
	padding-left: 6px;
	padding-right: 6px;
}

#individualTitle:empty {
//	border-bottom: 2px solid black;
	padding-left: 6px;
	padding-right: 6px;
	background-color:#000;
}


.addressarea, .emailaddressarea {
	background-color: #eef;
	padding: 4px;
	font-size: 10pt;
	border-radius: 2px;
}

.blueNumberOne {
	background-color: #eef;
}
.blueNumberTwo {
	backgrou\nd-color: #ddf;
}
.blueNumberThree {
	background-color: #ccf;
}
.blueNumberFour {
	background-color: #bbf;
}

.inactiveKoField {
	text-decoration: underline;
}

.inactiveKoField:hover {
// top right bottom left
//		border: 1px solid red;
        -webkit-box-shadow:inset 0px 0px 3px 1px #f00;
  	-moz-box-shadow:inset 0px 0px 3px 1px #f00;
  	box-shadow:inset 0px 0px 3px 1px #f00;
}

.inactiveKoField:empty {
	text-decoration: underline;
	padding-left: 6px;
	padding-right: 6px;
	display: display-inline;
	min-height: 14px;
	min-width: 50px;
}

span:empty  {
	border-bottom: 1px solid black;
	padding-left: 6px;
	padding-right: 6px;
}

.indyorgyfield {
	background: none;
	border: none;
}

.round_shadow_button_old {
//	font: 14px/2.3em trebuchet,arial;
	color: #000;
	text-shadow: 0 1px 0 #fff;
	text-align: center;
	text-decoration: none;
	display: block;
	padding: 0 5px;
	margin: 3px auto 5px;
	background: #fff url(/images/btn.png) repeat-x bottom;
	border: 1px solid #666;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-o-border-radius: 6px;
	-ms-border-radius: 6px;
	border-radius: 6px;
	-moz-box-shadow: 0 3px 5px #333;
	-webkit-box-shadow: 0 3px 5px #333;
	-o-box-shadow: 0 3px 5px #333;
	-ms-box-shadow: 0 3px 5px #ccc;
	box-shadow: 0 3px 5px #333;
}

.round_shadow_button_old:hover {
	margin: 3px auto 5px;
	-moz-box-shadow: 0 0 1px #eee;
	-webkit-box-shadow: 0 0 1px #eee;
	-o-box-shadow: 0 0 1px #eee;
	-ms-box-shadow: 0 0 1px #eee;
	box-shadow: 0 0 1px #eee;
}

.round_shadow_button {
    display: inline-block;
    padding: 0.5em 1em;
    text-decoration: none;
    font-weight: bold;
    border-radius: 4px;
    color: rgba(0, 69, 212, 0.9);
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.5);
//    background-image: -webkit-linear-gradient(#6795fd 0%, #67ceff 100%);
    background-image: -webkit-linear-gradient(#67ceff 0%, #6795fd 100%);
    background-image: linear-gradient(#67ceff 0%, #6795fd 100%);
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    border-bottom: solid 3px #5e7fca;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-o-border-radius: 6px;
	-ms-border-radius: 6px;
	border-radius: 6px;
    
}

.round_shadow_button:active {
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    border-bottom: none;
}

.individualnameblock {
	display: inline-block;
//	border: 1pt solid red;
	text-align: center;
}

.individualnamepart {
	border-bottom: 1pt solid blue;
	padding-left: 4px;
	padding-right:4px;
	position: relative;
	display: block;
	text-align: center;
//	margin-left: 4px;
//	margin-right:4px;
}

.individualnamecaption {
	position: relative;
	display: block;
//	border: 1pt solid green;
	font-size: 7pt;
	font-style: italic;
	text-align: center;
}

#editNameButton {
	position: relative;
	display: block;
}

#mainpartsblock {
	position: relative;
	display: block;
}

#namepartsblock {
	position: relative;
	display: block;
	vertical-align: top;
}

.datatable {
	text-align: center;
	background: white;
}
.datatable tr {}
.datatable th { 
	background: #ddf; 
	text-align: center;
}
.datatable td {
	padding: 2pt;
}
.datatable INPUT[TYPE=SELECT] { font-family:  "Arial Narrow"; font-size: 8pt;}
.datatable select { font-family:  "Arial Narrow"; font-size: 9pt; background:#eef;}

}

.tile {
	border: 1px solid black;
	background-color: #dddddd;
//	display: inline-block;
	display: flex;
	float: left;
}

.warning {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #ff0000;
	background-color: #ffdddd;
}