﻿html 
{
	margin: 0px;
	padding: 0px;
}

body  
{
	color: #494949; 
	font-size: 8pt; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
  background: #fff url(../images/background-top.png) no-repeat center 20px;
	margin: 0; 
	padding: 0;
  border: 0;
  overflow: hidden;
  height: 100%; 
  max-height: 100%;  
}

#frame-top, #frame-bottom
{
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 75px; /* height of top frame div */
  overflow: hidden; /* disable scrollbars. Set to "scroll" to enable */
 	background: url(../images/bars.png) repeat-x 0 top; 
}

#frame-bottom
{
  top: auto;
  bottom: 0; 
  height: 80px; /* height of bottom frame div */
  overflow: hidden; /* disable scrollbars. Set to "scroll" to enable */
 	background: #fff url(../images/bars.png) repeat-x 0 top; 
}

#frame-middle
{
  position: fixed; 
  top: 75px; /* set top value to HeightOfTopFrameDiv */
  left: 0;
  right: 0;
  bottom: 80px; /* set bottom value to HeightOfBottomFrameDiv */
  overflow: auto; 
}

.header-container, .footer-container
{
  position: relative;
  width: 900px;
  max-width: 900px;
  min-width: 900px;
  height: 75px;
  max-height: 75px;
  min-height: 75px;
  margin: 0 auto;
  display: block;
  z-index: 101;
}

.footer-legal-copy
{
  float:left;
  font-size: 8pt;
  color: #999;
  font-family: Courier New;
  margin-top: -14px;
  z-index: 1000;
  padding-left:10px;
}

.footer-copyright
{
  float:right;
  font-size: 8pt;
  color: #999;
  font-family: Courier New;
  margin-top: -14px;
  z-index: 1000;
}

.footer-legal-copy a, .footer-copyright a { text-decoration: none; color: #777; }
.footer-legal-copy a:link, .footer-copyright a:link { } /* unvisited link */
.footer-legal-copy a:visited, .footer-copyright a:visited { } /* visited link */
.footer-legal-copy a:hover, .footer-copyright a:hover { color: #000; } /* mouse over link */

.main-container
{
	position: relative; 
	width: 900px; 
	max-width: 900px; 
	margin: 0 auto;
}


.global-message-block 
{
	font-family: Courier New Baltic;
	color: red;
	text-align:center;
	background-color: InfoBackground;
	border: 1pt dotted red;
	width:auto;
	position:relative;
	top:0px;
	left:0px;	
	margin-bottom:5pt;
	padding:2pt;
}

/* BUTTONS */
.buttons a, .buttons button{
    display:block;
    float:right;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;

    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}
.buttons button{
    width:auto;
    overflow:visible;
    padding:4px 10px 3px 7px; /* IE6 */
}
.buttons button[type]{
    padding:5px 10px 5px 7px; /* Firefox */
    line-height:17px; /* Safari */
}
*:first-child+html button[type]{
    padding:4px 10px 3px 7px; /* IE7 */
}
.buttons button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}

.contact-me-form {
  padding: 50px 0;
  text-align: center;
  width: 100%;
}

.contact-me-form .textbox 
{
	background-image:url(../images/form_bg.jpg);
	background-repeat:repeat-x;
	border:1px solid #b1b4b7;
	width: 300px;
	color: #333333;
	padding:3px;
	margin-right:4px;
	margin-bottom:8px;
	font-family:tahoma, arial, sans-serif;
}


.main-menu a { background: url(../images/button.png) no-repeat 0 0; text-decoration: none; }
.main-menu a:link { } /* unvisited link */
.main-menu a:visited { } /* visited link */
.main-menu a:hover { background: url(../images/button.png) no-repeat 0 82px; } /* mouse over link */
.main-menu a:hover .menu-item-top{ font-weight: bold; } /* mouse over link */
.main-menu a:hover .menu-item-bottom { color: #fe9921; } /* mouse over link */


.main-menu a:active { background: url(../images/button.png) no-repeat 0 41px; } /* selected link */

.menu 
{ 
  position: relative;
  display: block;
  text-align: left;
  text-decoration: none;
  font-family: Palatino Linotype, Verdana, Serif;
  background: url(../images/background-bottom.png) no-repeat center 25px;
}

.menu-item-top
{
  color: #494949;
  font-size: 11pt;
  letter-spacing: 2pt;
  display: block;
  padding-top: 10px;
  margin-bottom: -25px;
}

.menu-item-bottom
{
  color: #d8dbdb;
  font-size: 13pt;
  font-style: italic; 
  font-variant: small-caps; 
}

.menu ul 
{ 
  width: 900px; /*If your links text is bigger you will have to adjust this value*/
  height: 40px;
  margin: 0 auto;
  padding: 0;
  line-height: 40px; /*same as height. This will center your text verticaly*/
  text-decoration: none;
}

.menu ul li 
{ 
	width: auto;
	display: inline;
	float: left;
	list-style: none;
	text-align: left;
	text-decoration: none;
}
			
.menu ul li a 
{ 
	display: block;
	text-decoration: none;
	text-transform: inherit;
	padding: 0 15px;
}

.menu ul li a:hover, .menu ul li a.active { background: url(../images/button.png) repeat-x left 21px; }
.menu ul li a:hover .menu-item-top, .menu ul li a:active .menu-item-top { font-weight: bold; } /* mouse over link */
.menu ul li a:hover .menu-item-bottom, .menu ul li a:active .menu-item-bottom { color: #fe9921; } /* mouse over link */

.menu ul li a.selected { background: url(../images/button.png) repeat-x left 21px; }
.menu ul li a.selected .menu-item-top, .menu ul li a:active .menu-item-top { font-weight: bold; } /* mouse over link */
.menu ul li a.selected .menu-item-bottom, .menu ul li a:active .menu-item-bottom { color: #336699; } /* mouse over link */

.content-main-3-columns
{
  display: block;
  width: 100%;
  min-height: 400px;
}

.content-right-3-columns
{
  float: right;
  display: block;
  width: 32%;
  min-height: 100px;
  margin: 5px 1pt 5px 3px;
}

.content-left-3-columns
{
  float: left;
  display: block;
  width: 32%;
  min-height: 100px;
  margin: 5px 3pt 5px 1px;
}

.content-center-3-columns
{
  float: left;
  display: block;
  width: 34%;
  min-height: 100px;
  margin: 5px 4px;
}

.content-main-2-columns
{
  float: left;
  display: block;
  width: 66%;
  min-height: 400px;
  margin: 5px 0px;
}

.content-right-2-columns
{
  float: right;
  display: block;
  width: 32%;
  min-height: 400px;
  margin: 5px 1px 5px 7px;
}

.content-left-2-columns
{
  float: left;
  display: block;
  width: 32%;
  min-height: 400px;
  margin: 5px 7px 5px 1px;
}

.site-logo {
  float: left;
  width: auto;
}

.icons {
  float: right;
  width: 30%;
  margin: 4px 15px 0 0;
  text-align: right;
}

.search-panel {
  float: right;
  display: block;
  width: 250px;
  padding: 1pt;
  border: 1pt solid #b1b4b7;
  margin-top: 11px;
  background-image:url(../images/form_bg.jpg);
	background-repeat:repeat-x;
}

.search-panel .textbox {
  float:left;
  display: inline;
  width: 230px;
  font-size: 8pt;
  color: #aaa;
  font-family: Verdana, Serif;
  border: 0pt solid #fff;
  background-color: Transparent;

}

.search-panel a {
  display: inline;
  text-align: center;
  vertical-align: middle;
  border: 0pt solid #fff;
}

.float-left
{
  float: left;
}
.float-right
{
  float: right;
}

/* liquid box */
#liquid-rounded 
{ 
  width:100%;
  margin:0px auto; 
}

#liquid-rounded .top {
  height:14px; 
  margin: 0px 14px;
  background: url(../images/box-t.png) repeat-x left top; 
}

#liquid-rounded .top-left {
  position: relative;
  height:14px; 
  background: url(../images/box-tl.png) no-repeat top left; 
}

#liquid-rounded .top-right {
  position: relative;
  height:14px; 
  background: url(../images/box-tr.png) no-repeat top right; 
}

#liquid-rounded .bottom {
  height:14px; 
  margin: 0px 14px;
  background: url(../images/box-b.png) repeat-x left top; 
}

#liquid-rounded .bottom-left {
  position: relative;
  height:14px; 
  background: url(../images/box-bl.png) no-repeat top left; 
}

#liquid-rounded .bottom-right {
  position: relative;
  height:14px; 
  background: url(../images/box-br.png) no-repeat top right; 
}

#liquid-rounded .content-left {
  position: relative;
  height:auto; 
  background: url(../images/box-l.png) repeat-y left top; 
}

#liquid-rounded .content-right {
  position: relative;
  height:auto; 
  background: url(../images/box-r.png) repeat-y right top; 
}

#liquid-rounded .heading {
  font-family: Palatino Linotype, Verdana, Serif;
  height:21px; 
  color: #494949;
  font-size: 11pt;
  letter-spacing: 2pt;
}

#liquid-rounded .heading span {
  display: block;
  margin: 0px 14px;
  width: auto;
  border-bottom: 1pt solid #999;
}

.articles-heading {   
  width: auto;   
  background: url(../images/headers/articles.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.links-heading {   
  width: auto; 
  background: url(../images/headers/links.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.statistics-heading {  
  width: auto;
  background: url(../images/headers/statistics.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.projects-heading {   
  width: auto;   
  background: url(../images/headers/projects.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.products-heading {   
  width: auto; 
  background: url(../images/headers/products.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.questions-heading {  
  width: auto;
  background: url(../images/headers/questions.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.snippets-heading {   
  width: auto; 
  background: url(../images/headers/snippets.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}
.tips-heading {  
  width: auto;
  background: url(../images/headers/tips.jpg) no-repeat; 
  line-height: 15px; 
  padding-bottom: 15px;
  z-index: 100;
}


.image-left { text-align:left; margin-left:15px; padding-left: 10px; background-position: top left; }
.image-right { text-align:right; margin-right:15px; padding-right: 10px; background-position: top right;}
.image-center { text-align:center; margin:0 auto; background-position: 50% 0;}


.articles-content, .links-content, .statistics-content, .projects-content, .products-content, .questions-content, .snippets-content, .tips-content { 
  padding: 0 25px 15px 25px;
}

.text-left { margin-left: 10px; text-align: left; }
.text-center { margin: 0px auto; text-align: center; }
.text-right { margin-right: 10px; text-align: right; }

#liquid-rounded hr 
{
  border: 0;
  color: #aaa;
  position: relative;
  background-color: #ddd;
  height: 1px;
  width: 96%;
  margin: -21px auto 10px auto;
  z-index: -1;
}

.page-heading 
{ 
  width: auto;
  line-height: 15px; 
  padding-top: 10px;
  padding-bottom: 15px;
  z-index: 100;
  font-family: Palatino Linotype, Verdana, Serif;
  height: 21px; 
  color: #494949;
  font-size: 16pt;
  letter-spacing: 4pt;
  z-index: 100;
}

.page-heading span
{
  font-weight:bold;
  display: block;
  position: relative;
  color: #d8dbdb;
  z-index: -100;
  margin-left: 1px;
  margin-top: -11px;
  letter-spacing: 3pt;
}

.page-heading hr 
{
  border: 0;
  color: #aaa;
  position: relative;
  background-color: #ddd;
  height: 1px;
  width: 94%;
  margin: 0px auto 0px auto;
  z-index: -1;
}

.readability { letter-spacing: 1pt; }
.indent { text-indent: 3em; }

/* http://line25.com/tutorials/how-to-create-a-pure-css-polaroid-photo-gallery*/
.polaroid
{
  margin: 5px;
	padding: 10px 10px 35px 10px;
	background: #eee;
	border: 1px solid #fff;
	-moz-box-shadow: 0px 2px 15px #333;
	filter: progid:DXImageTransform.Microsoft.dropShadow(Color=c0c0c0,offX=3,offY=3,positive=true);
	-ms-filter: 'filter: progid:DXImageTransform.Microsoft.dropShadow(Color=c0c0c0,offX=3,offY=3,positive=true)';
	position: relative;
}

.polaroid .minus-10-deg 
{
	z-index: 10;
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
}

.polaroid .minus-5-deg 
{
	z-index: 5;
	-webkit-transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
}

.polaroid .minus-3-deg 
{
	z-index: 3;
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
}

.polaroid .minus-1-deg 
{
	z-index: 1;
	-webkit-transform: rotate(-1deg);
	-moz-transform: rotate(-1deg);
}

.polaroid .plus-10-deg 
{
	z-index: 10;
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(-10deg);
}

.polaroid .plus-5-deg 
{
	z-index: 5;
	-webkit-transform: rotate(5deg);
	-moz-transform: rotate(5deg);
}

.polaroid .plus-3-deg 
{
	z-index: 3;
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
}

.polaroid .plus-1-deg 
{
	z-index: 1;
	-webkit-transform: rotate(1deg);
	-moz-transform: rotate(1deg);
}

p {
  text-indent: 3em; 
  line-height: 10pt;
}

.sub-navigation { margin: 5px 0 15px 0;}
.sub-navigation div.AspNet-TreeView ul {text-align: left;}
.sub-navigation div.AspNet-TreeView ul li:before { font-size: larger; content: "\0020 \0020 \0020 \00BB \0020"; color: #494949; }
.sub-navigation div.AspNet-TreeView ul li {  }
.sub-navigation div.AspNet-TreeView ul li img { border: none; vertical-align: middle; margin: 0 2px 0 0; }
.sub-navigation div.AspNet-TreeView ul li a { text-decoration: none; color: #d8dbdb;  }
.sub-navigation div.AspNet-TreeView ul li a:hover,
.sub-navigation div.AspNet-TreeView ul li a:active { color: #fe9921; margin-left: 1pt; }
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-ParentSelected a {  }
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-Selected a { 
  text-transform: lowercase;
  font-variant: small-caps;
  font-size: larger;
  color: #669933 !important;
}
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-ChildSelected a {  }
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-Root {  }
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-Leaf { margin-left: 18px; }
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-ClickableNonlink { cursor: pointer; }
.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-Collapse
{
    /*background: url(../images/icons/bullet_toggle_minus.png) 0 -2px no-repeat;*/
    width: 15px;
    float: left;
    cursor: pointer;
}

.sub-navigation div.AspNet-TreeView ul li.AspNet-TreeView-Expand
{
    /*background: url(../images/icons/bullet_toggle_plus.png) 0 -2px no-repeat;*/
    width: 15px;
    float:left;
    cursor: pointer;
}

