@charset "utf-8";
/* CSS Document */

/*
Experience
	index : "ID = Experience-index"  : col-B
	section : "ID = Experience-section" : col-B 
	pages : "ID = portfolios" : col-A, col-B, col-c 
Ideas pages:  "ID = ideas" : col-B
*/

/* @import "default-layout.css";	skeletal structure */

@import "default-panels.css";	/* branded panels, fullwidth and sidebar */

@import "default-icons.css";	/* inline images: software brand icons, link indicators, bullets */

@import "default-styleswitcher.css";	/* consistent styleswitcher tools */

@import "default-sections.css";	/* exceptions for individual sections */

/* @import "documentation.css";	the DOCS window */

body,footer,.gototop,#container-page-content, #page-nocolumns, #page-columns, #col-A,#col-B,#col-C,#intro,#description,#topbar,#topbar-logo,.logo-image,#topbar-comment,#topbar-menubar,#topbar-title,.menubar,.tabfolder,.tabfolder-size,.tabfolder-menu-position,.tabfolder-framing-position,.tabfolder-position,.tabfolder-menu,.tabfolder-default,#col-A-sidemenu,.col-A-sidebar,.sm-toptitle,.sm-title,.page-title-big,.page-title-experience,.index-img,.pix-bg,.gallery-bg,.focal-1,.focal-2,.focal-sml,.panel-fast-track,.panel-fast-track-hi,.fp,.panel-imho,.panel-skills,.panel-deliverables,.panel-usage,.quote-body,.quote-author,.sb-panel,.toppage-panel .myportrait,.toppage-panel .welcome,.toppage-panel, .titlebar,.megamenu-panel,.megamenu-title-panel,.megamenu-body, #panel-cloud,.panel-stylin,.stylin-table,.col,.col-1,.col-2,.col-3,.col-4,.col-5,col-table-2,col-table-3,col-table-4,.table-header,.email,.showInfoCloud
{
	display: block;
	box-sizing: border-box; /*   adjustment for browser differences: IE, Opera   */
	-moz-box-sizing: border-box; /*   adjustment for browser differences: Mozilla, Gecko, Firefox   */
	-webkit-box-sizing: border-box; /*   adjustment for browser differences: Safari   */
}

#theme-minimalist, #theme-textyprint, #theme-purply,#theme-technobold
{
	display: block;
	box-sizing: border-box; /*   adjustment for browser differences: IE, Opera   */
	-moz-box-sizing: border-box; /*   adjustment for browser differences: Mozilla, Gecko, Firefox   */
	-webkit-box-sizing: border-box; /*   adjustment for browser differences: Safari   */
	height: 100%;}

/* These are generally FIXED as CONSTANTS 
Text settings

Layout

Background

TOPBAR & MENUBAR
col-A-sidemenu & REF-MODULES

Tables




*/


/***** TEXT   *****/


h1,h2,h3,h4,h5 {
	padding: 10px;
	margin: 0px;
	margin-top: 20px;
	margin-bottom: 10px;
	text-align:center;
}
h1 {
	font-size: 1.7em;
}
#description h1 {
	height:auto; 
}
h2 {
	font-size:  1.5em;
}
h3 {
	font-size:  1.3em;
}
h4 {
	font-size:  1.1em;
	text-align: left;
	padding-left:0px;
}
h5 {
	font-size:  1.0em;
	text-align: left;
	padding-left:0px;
}
.text-huge {font-size: 1.2em;}
.text-lrg { font-size: 1.1em}
.text-med { font-size: 0.95 em;}
.text-sml {font-size: 0.875em;}
.text-vsml {font-size: 0.7em; }

.txt-med-hi {color: #666;}
.txt-hi {color: #000;}
.txt-highlight {
	color: #000;
	background-color: #DFF;
} 
.lotsatext {
	font-family: "Times New Roman", Times, serif;
	font-size: 12pt;
}

.lotsatext {
	font-family: "Times New Roman", Times, serif;
	font-size: 12pt;
}

.more {
	margin-top: -10px;
	padding-bottom: 10px;
	float: right;
	width:60px;
	display:block;
	text-align:right;
	font-size:0.875em;
}
.more a {color:#F00;}


/***** LAYOUT  *****/


body { /* SETS PAGE LAYOUT & DISPLAY DEFAULTS */
	margin:0;
	padding: 0;
	margin-right: auto; margin-left: auto;/*  this centers the container  */
	font-family:"Times New Roman", Times, serif;
	text-align: left;
	width: 1000px;
	padding-bottom: 20px;
	background-image: url(../graphics/bgd/body/body-gry-wht-gry.png);
	background-position: center top;
	background-repeat: repeat-y;
	background-color:#EEE;
}
body a {
	text-decoration: none;
	color: #009;
}


p {
	margin-top: 0;
	padding: 0;
	margin-bottom: 10px;
} 
#container-page-content { /* Sets the framing for the page */
	float: left;
	width: 100%;
	height: 100%;
	border-top: 1px solid #DDDDDD;
}

#page-columns { /* defines the Content area */
padding-bottom:50px;
height:100%;}

#col-A {  /* column 1 (narrow/sidecolumn) */
	float:left;
	width: 20%;
}
#col-B {  /* column 2 (wide/main) */
	float:left;
	background-color:transparent;
	width: 80%;
	padding:50px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#col-B a { 
	color: #000099;}
#col-B a:hover{
	color: #000000;
	text-decoration: underline; }

#col-C {   /* column 3 (narrow/sidecolumn) */
	float:right;
	width: 0%; /* not displayed by default */
}


#intro { /* @ top of content area */
	float: none;
	font-size: 1.0em;
	padding-right: 40px;
	padding-left: 40px;
	padding-top: 10px;
	padding-bottom: 10px;
}
#intro em {	background-color: transparent;
}
#description { /* @ body of content area */
	font-size: 0.9em;
	padding-top: 10px;
	padding-bottom: 20px;
	padding-right: 40px;
	padding-left: 40px;
	width: 100%;
	margin-bottom:20px;
}
#description ul{
	list-style-type: circle;
	padding-left: 10px;
	margin-left: 10px;
}
#copyright {
	color: #666;
	float: left;
	font-size: 0.7em;
	text-align: left;
	margin-top: 10px;
	margin-left:20px;
}
.gototop {
	background-image: url(../graphics/icons/backtotop.png);
	background-repeat: no-repeat;
	cursor: pointer;
	float: right;
	height: 14px;
	width: 75px;
	margin-top:10px;
	margin-right:0px;
}
#description .gototop {
	margin-right:0px;
}
.gototop-hi a:hover {
	background-image: url(../graphics/icons/backtotop-ovr.png);
}
.float-left{
	float:left;
	margin-right: 30px;
}
.float-right{
	float:right;
	margin-left: 30px;
}
.clearfloats {clear:both;}


.scrollarea{ /* not really used right now */
	border-top-width: 2px;
	border-bottom-width: 2px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-color: #DDDDDD;
	width: 100%;
	overflow: scroll;
	visibility: visible;
	z-index: 1;
	height: auto;
	position: relative;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-right: 10px;
	padding-left: 10px;
	display: block;
}


/* TOPBAR  */

#topbar {
	height: 100%;
}
#topbar .logo-image {
	float:left;
	background-image: url(../graphics/global/sitelogo.png);
	background-repeat: no-repeat;
	background-position: center center;
	width: 150px;
	height: 60px; 
	margin-top:-10px;
}
#topbar .logo-image-hi a:hover {
	background-image: url(../graphics/global/sitelogo-ovr.png);
}
#topbar-logo {
	float: left;
}
#topbar-title {
	font-size: 1.5em;
	font-weight: bold;
}
#topbar-comment {
	float:right;
	width: 150px;
	text-align:center;
	font-size:9pt;
}
#topbar-comment a {}
#topbar-comment a:hover {
	color: #FFF;}
#topbar-comment .showInfoCloud-hi {
	padding-bottom:10px;
}

.showInfoCloud {
	background-image: url(../graphics/global/infocloud-sml.png);
	background-repeat: no-repeat;
	background-position: center top;
	height: 30px;
	width: 120px;
	margin:0px;
	margin-bottom:-5px;
	margin-top:-5px;
	padding-bottom:0px;
	display: inline-block;
}
.showInfoCloud-hi a:hover{	
	background-image: url(../graphics/global/infocloud-sml-ovr.png);
	padding-top:-5px;
}



/* MENUBAR  */


#topbar-menubar {
	font-size:0.8em;
	height: 100%;
}
#topbar-menubar a:link, #topbar-menubar a:visited{}
#topbar-menubar a:hover  {
	color: #000000;
}
#topbar-menubar .document-hi a{  /* for non-tab menubar item (resume) */
	margin-left:10px;
	margin-top:2px;
	text-decoration: none;
}
#topbar-menubar .document-hi a:hover{  /* for non-tab menubar item (resume) */
	font-weight: bold;
	text-decoration: none;
	background-image: url(../graphics/icons/doc-blu.png);
	background-color:transparent;
}
.menubar {  /* tabbed menubar item */
	float: left;
	height: 100%;
	background-color:transparent;
	text-align: center;
	font-weight: bold;
	border: 1px none #CCC;
	padding: 10px;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-right: 3px; 
}
.menubar a{
	text-decoration: none;
}
.menubar-sel {
	color: #FFF;
	background-color: #999;
}
.menubar-sel a{
}


/* col-A-sidemenu  */

#col-A-sidebar{ /* container for sidebar elements below the sidemenu  */
	background-repeat: repeat-y;
	padding-left:10px;
	padding-top: 10px;
}
#col-A-sidemenu{
	background-repeat: repeat-y;
	margin-bottom:10px;
	
}
#col-A-sidemenu a:link, #col-A-sidemenu a:visited { }
#col-A-sidemenu a:hover {
	text-decoration:underline;		}

#col-A-sidemenu h3 {
	font-size: 1.1em;
	text-align: center;
	background-repeat: repeat-y;
	font-weight: bold;
}
#col-A-sidemenu h3 a:link, #col-A-sidemenu h3 a:visited {	} 
#col-A-sidemenu h3 a:hover{	}

.sm-selected{
	/* to hilite the selected subsection */
	background-color:#FFF;
	background-repeat: repeat-y;
	background-position: left top;
	padding-bottom: 5px;}

#col-A-sidemenu h4 {
	font-size: 0.875em;
	text-align: center;
	font-weight: bold;
	background-repeat: no-repeat;
	background-position: left top;
	background-color: transparent;
	margin-top: 10px;
	margin-bottom: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
}
#col-A-sidemenu h4 a{
	border-color: #000099; /* no year icon, but aligned left */
	background-color: transparent;
	display:block;
	padding-top: 10px;
	padding-bottom: 10px;
}

.sm-title { /* skills * art sections */
	margin-top:20px;
	margin-bottom:0px;
	font-weight:bold;
}
.sm-title a:link, .sm-title a:visited{ /* skills * art sections */
	background-image: url(../graphics/bullets/arrow-gry.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 20px;
}
.sm-title a:hover {	background-image: url(../graphics/bullets/arrow-blu.png);}
	
.sm-item-hi {}
.sm-item-hi a:hover {}
.sm-item {  /*sidemenu item container */
	font-size:0.75em;
	background-image: none;
	padding-bottom: 10px;
	padding-left: 20px;
	margin-left: 20px;
	margin-bottom:10px;
}
	
.sm-item a{	}
.sm-item a:hover  {  }


/*  Decade branding for title (Experience Portfolio) */

#sm-portfolio-page h4 { /* year icon for Experience */	
	text-align: left;
	padding-left:10px;
}
.sm-section-10,.sm-section-00,.sm-section-90,.sm-section-80,.sm-section-70 {
	padding:5px;
	padding-left: 35px;
	background-repeat:no-repeat;
	background-position: left 3px;
}

.sm-section-10 {
	background-image: url(../graphics/sections/experience/10-small.png);
}
.sm-section-00 {
	background-image: url(../graphics/sections/experience/00-small.png);
}
.sm-section-90 {	
	background-image: url(../graphics/sections/experience/90-small.png);
}
.sm-section-80 {	
	background-image: url(../graphics/sections/experience/80-small.png);
}
.sm-section-70 {	
	background-image: url(../graphics/sections/experience/70-small.png);
}
.sm-item-year {
	float:left;
	color: #999;
	text-align: center;
	width: 25px;
	margin-left: -20px;
}




/***** TABFOLDERS  *****/

.tabfolder-size {  /* entire tabfolder container */
	margin-left:-20px;
	margin-right:-20px;
	width: 100%;
	height:360px;
}
.tabfolder-menu-position {  /* positioning for tabfolder menu */
	float: left;
	width: 22%;
	height:360px;
	padding: 5px;
}
.tabfolder-menu  {
	background-image: url(../graphics/sections/understanding/tabarrow-ew-cya.png);
	background-repeat: no-repeat;
	font-weight: bold;
	text-align: center;
	height: 90px;
	width: 100%;
	padding-top: 30px;
	cursor: default;
	background-position: -15px center;
}

.tabfolder-menu  a:link, .tabfolder-menu  a:visited {
	text-decoration: none;}
.tabfolder-menu-hi a:hover {
	background-image: url(../graphics/sections/understanding/tabarrow-ew-yel.png);
	text-decoration: none;
}
.tabfolder-framing-position { /* tabfolder content position */
	float: left;
	width: 78%;
}
.tabfolder-position {  /* positioning for overlays */
	position:relative;
	top: 0px;
	left: 0px;
}
.tabfolder-default { /* default "landing" */
	background-color: transparent;
	position:absolute;
	visibility: visible;
	font-size: 1.2em;
	height: 360px;
	text-align: left;
	padding: 0px;
	padding-top: 60px;
	border: 2px solid #CCC;
	width: 100%;
}
.tabfolder {  /* layout for tabfolder content */
	background-color: #FFF;
	position:absolute;
	visibility: hidden;
	width: 100%;
	height: 360px;
	padding:20px;
	border: 2px solid #CCC;

}
.tabfolder-title {
	font-size: 1.2em;
	text-align: center;
	padding:10px;
}



/***** TABLES   *****/


.table-grid {
	font-size: 0.9em;
	padding: 5px;
	border-top: 2px solid #999;
	border-bottom: 2px solid #999;
}
.table-grid td{
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 1px solid #CCC;
	vertical-align: top;
}

td {
	text-align: left;
}

th {
	font-size: 1.1em;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}

.col-table-2, .col-table-3, .col-table-4 {  /* layout indentation for all column-div tables */
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 20px;
}

.col-1,.col-2,.col-3 {
	width: 33%;
	float:left;
	height: 100%;
	padding:20px;
}
.col-1 {
	clear: both;
	float: left;
}
.col-table-2 .col-2 {
	width: 66%;
}

.col-table-50-50 .col-1 {
	width: 50%;
}
.col-table-50-50  .col-2 {
	width: 50%;
}
.col-1 h3,.col-2 h3, .col-3 h3 {
	margin-top:0px;
}
.col-1 h4 {
	margin-top:0px;
}