/* @ Tony Eleninovski */
/* @ www.madchaos.com.au */
/* @ Tony Eleninovski */

/* Style Rule:
	order elements by...
   		width: widest first, shortest last
		Hierarchical Order: top fist, ottom last
		position: left first then to right	
		Dimension: in pixels squared	 */	

/* ************************************** /
/* CSS RESET RULE                         /
/* ***************************************/

/* globalreset.css Reset Rule is associated to this website.  */


/* ************************************** /
/* DEFAULTS                               /
/* ***************************************/

/* default 4.01 Specification Tags such as html, div, h1, p, a
/* no unique class or id tags inserted here */


body{
  background: url(/images/deep-dark-red-paradox.jpg) repeat top center;
  /* color:#000000;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Sans, FreeSans, Jamrul, Garuda, Kalimati; */
  font-family: Verdana,Arial,Helvetica,sans-serif;
  color:#333333;
  line-height: 1.2;
  margin: 0 auto;
  padding: 0px;
}


h1{
  color: #2e4301;
  font-size: 2em;
  margin:15px 0 15px 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Segoe UI", Calibri, "Myriad Pro", Myriad, "Trebuchet MS", Helvetica, Arial, sans-serif;
}

h2{
  color: #ff7a00;
  font-size: 130%;
  font-weight: bold;
}

h3{
  color: #573d00;
  font-size: 128%;
  font-weight: bold;
}

h4{
  color: #333;
  font-size: 100%;
  font-weight: normal;
}

h5, h6{
  color: #334d55;
  font-size: 100%;
}

label{
  color: #334d55;
  font: bold 100% Verdana,Arial,Helvetica,sans-serif;
}

p {
  margin: 10px 0;
  color:#000000;
}

img {
border-style:none;
}

ul{
  list-style: square;
}

ul ul{
  list-style: disc;
}

ul ul ul{
  list-style: none;
}

ul, ol {
  padding-left:40px;
}

a:link, a:hover {
	color: #006699;
	text-decoration: none;
}

a:visited	{
	color:#806f40;
}

a:hover {
	text-decoration: underline;
}


/* ************************************** /
/* SITE ARCHITECTURE                      /
/* ***************************************/

/* include unique id tags here for block-level site architecture */

#wrapper {
  background: #fff;
  background-color:white;
  margin: 0px auto;
  width: 1040px;
  position:relative;
}

#fluidwrapper {
  background: #fff url(/images/border-left.gif) repeat-y;
  background-color:white;
  margin: 0px auto;
  width: 98%;
}

#container	{
font-size: 80%;
width:1010px;
padding:0 0 0 10px;
position:relative;
clear:left;
}

#container_narrow	{
font-size: 80%;
width:960px;
padding:0 0 10px 40px;
position:relative;
clear:left;
}

#popup-window {
  background-color:white;
  margin: 0px auto;
  width: 1040px;
  position:relative;
  font-size: .6em;
  width:98%;
  padding:0 10px;
  position:relative;
  clear:left;
}

#fluidcontainer	{
font-size: 80%;
width:98%;
padding:0 0 0 10px;
position:relative;
clear:left;

}

/* ************************************** /
/* COMPONENT ARCHITECTURE      	          /
/* ***************************************/

/* These styles are additional to the core site architecture  */

#masthead{
	margin: 0 auto;
	padding: 10px 0px;
	border-bottom: 1px solid #ccc;
	width: 1040px;
	background-color:white;
}

#fluidmasthead{
	margin: 0 auto;
	padding: 10px 0px;
	border-bottom: 1px solid #ccc;
	background-color:white;
	width:100%;
    min-width:400px;
}

#content{
	width:750px; /* was 750px reverted to show in Dreamweaver Design view*/
	min-width:30%;
	font-size: 80%;
	margin: 0 0 0 0;
	padding:0 0 0 10px;
	position:inherit;
	clear:left;
	float:left;
	background-color:white;
}

.feature{
	width:430px;
	padding: 0px 10px 10px 10px;
	margin-right:10px;
	min-width:30%;
	float:left;
	clear:left;
	background-repeat:no-repeat;
	background-position:bottom right;
}

/***** SERVICES HIRE US Styles *****/

.services	{
color:#333333;
font-size: 80%;
padding:0 0 30px 65px;
position:relative;
clear:left;
border-bottom:solid 1px #cccccc;
}

.services p	{
color:#888888;
}

.splsh	{
width:680px;
height:260px;
display:block;
}

#serviceBar{
	float:right;
	padding: 0px;
	margin:10px 0 0 0;
	background-color: #a4cf4f;
	width:270px;
	font-size:.8em
}

.barTop	{
background-image:url(images/sidebar_top.jpg);
background-repeat:no-repeat;
background-position:top left;
padding:25px;
}

.barBtm	{
background-image:url(images/sidebar_btm.jpg);
background-repeat:no-repeat;
background-position:bottom left;
width:270px;
height:27px;
display:block;
}

#serviceBar li {
	margin-left:-25px;
	list-style-type:circle;
	list-style-position:inside;
	color:#D84F23;
	line-height:1.4;
	}
#serviceBar li span {color:black;} /* this rule turns text back to original color if span is used */



/* END STYLES */


#navBar, #sidebar{
	float:right;
	padding:0px;
	margin:0px;
	background-color:#FFFFFF;
	border-left: 1px solid  #a4cf4f;
	border-bottom: 1px solid  #a4cf4f;
	color:#9C3E2C;
	clear:both;
}

#navBar {
	width:270px;
}
#sidebar {
	width:252px;
}

#product	{
display:block;
width:270px;
height:300px;
float:left;
background-color:blue;
}

#work_brief	{
display:block;
width:220px;
height:300px;
float:left;
background-color:#0000FF;
margin-left:10px;
}

#catalogue	{
display:block;
width:400px;
height:342px;
background-color:#00CC99;
float:left;
clear:left;
}

#product_thumbs	{
display:block;
width:525px;
height:260px;
background-color:#00CC99;
float:left;
margin-left:10px;
}


#showcase	{
	width:250px;
	padding:10px;
	margin:0 5px;
	float:left;
	position:relative;
	border-left:1px solid #ccc;
}

#author	{
width:590px;
margin-left:30px;
padding:15px 15px 15px 10px;
font-size:80%;
height:160px;
background-color:#CCFF99;
position:relative;
clear:left;
display:none;
}

#author	img {
float:left;
padding:15px;
}


#footer {
	font-family:'Lucida Grande',Verdana,Arial,Helvetica,Sans,FreeSans,Jamrul,Garuda,Kalimati;
	clear: both;
	border-top: 1px solid #a4cf4f;
	padding: 10px 15px;
	font-size:62.5%;
	color:#000000;
	line-height:1.166em;
	background-color:#FFFFFF;
	text-align:left;
  	background: #fff url(/images/border-left.gif) repeat-y;	
	margin-bottom:26px;
}

#footer a {
	color:#548C1C;
	text-decoration:none;
}

#footer a:hover {
	text-decoration:underline;
}




/* ************************************** /
/* COMPONENTS STYLES	                  /
/* ***************************************/

/* include extended style rules for the look and feel of unique elements (i.e image gallery) */

/******** subscription form ********/
.text  {
font-family: Verdana,Geneva,sans-serif; 
font-size: 8pt; 
margin-bottom: 5px; 
width: 150px; 
border: 1px solid rgb(204, 204, 204); 
height: 16px; 
color: rgb(102, 102, 102); 
background-image: url('images/textfield_bg.jpg'); 
margin-top: 4px; 
padding: 3px;
}

.mce-success-response, .mce-error-response, .mce_inline_error, .response {
font-family: Verdana,Geneva,sans-serif; 
font-size: 7pt; 
color: rgb(102, 102, 102); 
}

.textwidget  { 
margin: 0 0 20px 10px; 
background:#fefefe; 
padding:0;  
line-height:20px; 
}


/***** table styles *****/

.oddevenrows { /* these rules are specifically to style odd and even rows in tables */
color:#fff;
font-size:11px;
font-family:calibri;
width:900px;
margin-left:60px;
background-color:#CCCCCC;
clear:both;
}

.oddevenrows a:link, .oddevenrows a	{
color:#fff;
font-size:11px;
font-family:calibri;
margin:0;
}
.oddevenrows caption	{font-size:1.6em;font-weight:bold;font-family:calibri;color:#000000;padding-left:60px;padding-bottom:6px;}
.oddevenrows a:hover	{text-decoration:underline;}
.oddevenrows a:visited	{text-decoration:underline;}
.oddevenrows col  {border:solid #FFFFFF 2px;}
.oddevenrows th, .oddevenrows td {padding:10px 5px;}
.oddevenrows th	{font-family:Lucida Sans Unicode;color:#FFFFFF;background-color:#000000;border-bottom-style:solid;}
.oddevenrows tr:nth-child(even)	{background-color:#e36c0a;}
.oddevenrows tr:nth-child(odd)	{background-color:#f79646;}
.oddevenrows img {vertical-align:text-bottom;}
.oddevenrows legend {}
.boldtable	{background-color:#984806;}


/***** product box styles *****/

#product_thumbs	img {
margin:10px;
background-color:#dcdacc;
border:solid white 4px;
}

#product_thumbs img:hover {
border:solid #dcdacc 4px;
}

#product_thumbs a {
display:block;
float:left;
}


#content li {margin-left:15px;list-style-type:circle;list-style-position:inside;color:#D84F23;line-height:1.4;}
#content li span {color:black;} /* this rule turns text back to original color if span is used */


	/***** .feature page styles *****/

.feature h3{
	padding: 30px 0px 5px 0px;
	text-align: center;
}

.feature img{
	float: left;
	padding-bottom:20px;
	border: none;
}

.runtime	{ /* in articles: a runtime box for script tests to differentiate between normal text and event boxes */
width:1000px;
background-color:#a4cf4f;
margin-bottom:10px;
margin-left:auto;
margin-right:auto;
}


	/***** Tutorials submenu and inner menus *****/

.tutorials_menu{
margin: 5px 0;
padding: 0;
width: 205px; /*width of menu*/
border: 1px solid #9A9A9A;
position:fixed;
}

.tutorials_menu div.greenheader a, div.greenheader {
background: black url(/images/green_gradient.jpg) no-repeat center left;
font: normal 12px Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width:205px;
height:25px;
text-decoration: none;
}

.tutorials_menu div.greenheader a:visited, .tutorials_menu div.greenheader a:active{color: white;}

.tutorials_menu div.selected a, .tutorials_menu div.greenheader a:hover{
background-image: url(/images/green_gradient_state.jpg);
color: #dcf4ba; 
width:205px;
height:25px;
}

.tutorials_menu div.submenu{ /*DIV that contains each sub menu*/
/* background: #a2b389; url(/images/submenu_gradient.jpg); */
height: 300px; /*Height that applies to all sub menu DIVs. A good idea when headers are toggled via "mouseover" instead of "click"*/
background-color:white;
}

/* menu links within submenu */
.tutorials_inner_menus	{
float:left;
clear:left;
margin-top:20px;
position:relative;
width:205px;
font-family:"Futura Lt BT", Verdana, "Copperplate Gothic Light", "Garrison Sans";
font-variant:small-caps;
font-size:1em;
padding: 0px;
}

.tutorials_inner_menus ul	{list-style:none;font-size:1em;clear:left;margin:0px; padding: 0px;}
.tutorials_inner_menus li {display:block;line-height:1.5em;border-bottom: 1px solid #EEE;} /* hack to fix IE/Win's broken rendering of block-level anchors in lists */
.tutorials_inner_menus a	{background-color:#ffeee1;color:#573d00;text-decoration:none;border-top: 1px solid #FF8700;}
.tutorials_inner_menus a:link	{color:#573d00;background-color:#ffeee1;}
.tutorials_inner_menus a:visited {color:#573d00;background-color:#FFDE80;}
.tutorials_inner_menus a:hover {color:#FFBC00;background-color:#806F40;}

/*********** #navBar link styles ***********/
.tutorials_inner_menus ul a:link, .ddmenus ul a:visited {display: block;}
/* fix for browsers that don't need the hack */
html>body .tutorials_inner_menus li {border-bottom: none;}


/*								*/
/*	 TUTORIAL SIDE MENUS
/*								*/

/* menu links within submenu */
#tutorials	{
clear:left;
margin-top:-5px;
width:250px;
font-family:"Futura Lt BT", Verdana, "Copperplate Gothic Light", "Garrison Sans";
font-variant:small-caps;
font-size:1em;
padding: 0px;
}

#tutorials div.submenu ul	{list-style:none;font-size:1em;clear:left;margin:0px; padding: 0px;}
#tutorials div.submenu li {display:block;line-height:1.5em;} /* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#tutorials div.submenu a	{background-color:#ffeee1;color:#573d00;text-decoration:none;border-top: 1px solid #FF8700;}
#tutorials div.submenu a:link	{color:#573d00;background-color:#ffeee1;}
#tutorials div.submenu a:visited {color:#573d00;background-color:#FFDE80;}
#tutorials div.submenu a:hover {color:#FFBC00;background-color:#806F40;}

/*********** #navBar link styles ***********/
#tutorials ul a:link, .ddmenus ul a:visited {display: block;}
/* fix for browsers that don't need the hack */
html>body #tutorials li {border-bottom: none;}

#tutorials div.sbtitle {
background: black url(/images/green_gradient_state_long.jpg) no-repeat top right;
font: normal 12px Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
padding-left:20px;
line-height:1.5;
width:auto;
height:25px;
text-decoration: none;
overflow:hidden;
}

#tutorials div.greenheader, li.greenheader {
background: black url(/images/green_gradient.jpg) repeat-x center left;
font: normal 12px Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
color: white;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
padding-left:20px;
line-height:1.5;
width:auto;
height:25px;
text-decoration: none;
overflow:hidden;
border-top: 1px solid #EEE;
}

#tutorials .tutorials_menu{
margin: 5px 0;
padding: 0;
width: 250px; /*width of menu*/
border: 1px solid #9A9A9A;
position:inherit;
}

#tutorials .tutorials_menu div.submenu{ /*DIV that contains each sub menu*/
/* background: #a2b389; url(/images/submenu_gradient.jpg); */
height: auto; /*Height that applies to all sub menu DIVs. A good idea when headers are toggled via "mouseover" instead of "click"*/
background-color:white;
font-size:80%;
}

.onethird {
width:30.3%;
float:left;
border-right:1px solid #CCC;
padding:10px;
}




	/***** #search styles *****/

#search{
	font-family: Arial,sans-serif;
	padding: 5px 0px 5px 10px;
	border-bottom: 1px solid #ccc;
	font-size: 90%;
}

#search form{
 margin: 0px;
 padding: 0px;
}

#search label{
	display: block;
	margin: 0px;
	padding: 0px;
}

.sphider	{
display:inline;
}

	/***** #navBar link styles *****/

#navBar ul a:link, #navBar ul a:visited {
	display: block;
	color:#474F36;
	
}
#navBar ul {list-style: none; margin: 0; padding: 0;}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#navBar li {border-bottom: 1px solid #ccc;}

/* fix for browsers that don't need the hack */
html>body #navBar li {border-bottom: none;}


	/***** #sectionLinks styles *****/

#sectionLinks{
	position: relative;
	margin-top:-1px; /* lines up google search bottom border with section links top border */
	padding: 0px;
	border-bottom: 1px solid #ccc;
	font-size: 90%;
}

#sectionLinks h3{
	padding: 10px 0px 2px 10px;
}

#sectionLinks a:link{
	border-top: 1px solid #ccc;	
	padding: 2px 0px 2px 10px;
}

#sectionLinks a:visited{
	border-top: 1px solid #ccc;
	padding: 2px 0px 2px 10px;
}

#sectionLinks a:hover{
	border-top: 1px solid #ccc;
	background-color: #C2D792;
	padding: 2px 0px 2px 10px;

}


	/***** .relatedLinks styles *****/

#relatedLinks{
	margin: 0px;
	padding: 0px 0px 10px 10px;
	font-size: 90%;
}

#relatedLinks h3{
	padding: 10px 0px 2px 0px;
}


	/***** #advert styles *****/

#advert{
	padding: 10px 0px 0px 10px;
	font-size: 80%;
	border-top: 1px solid #ccc;		
}

#adblock	{
width:728px;
clear:both;
margin:0 auto;
clear:both;
}
#textadd	{
position:absolute;
right:60px;
top:10px;
}

/***** Twitter Widget Styles *****/

.twitter	{
margin: 15px 0 15px 10px;
}

/***** Banner Ad Styles *****/

#sidebarAd{

  margin:10px 0 0 10px;

}

/***** Notepad ++ Monospaced Code Styles *****/

.message .quoteCode ol li{margin: 0; padding: 0 10px; list-style-type:none !important;}
.message .quoteCode ol {
  background: #e7e7e7;
  border: 0;
  font-size: 12px;
  line-height: 18px;
  list-style: decimal-leading-zero;
  margin: 0;
  padding: 0 0 0 45px;
}
.message .quoteCode ol li.ln-xtra {background: #ffc;}
.message ol li.li1 {background: #e7e7e7;}
.message ol li.li2 {background: #e3e3e3;}
.posthilit{color: #989E00;}
.quoteBody,.quoteCode {
  background: #ebebeb;
  border: 1px solid silver;
  margin: 0 20px 5px 20px;
  overflow: auto;
  padding: 10px;
}
.quoteLegend {
margin-left:15px;
padding:1px;
background-color:#ebebeb;
border:1px solid silver;
}
.quoteCode{min-height: 36px; padding: 0;}
.quoteCode{font-family: monospace;}
.quoteCode .co1{color: #666; font-style: italic;}
.quoteCode .co2{color: #666; font-style: italic;}
.quoteCode .li2{font-weight: normal; vertical-align: top;}
.quoteCode div{font-size: 12px; padding: 10px;}
.quoteCode li,.quoteCode .li1{
  font-weight: normal;
  vertical-align: top;
}


	/***** footer styles *****/
.footlinks	{vertical-align:middle;}



/* ************************************** /
/* LAYOUT STYLES                          /
/* ***************************************/

/* include unique class or id tags here for layout rules
   individual element rules sometimes independent
   of components, but serve as substructures
   and are often page specific		*/
   
   
.beveled {
  font-family: Verdana,Arial,sans-serif;
  font-size: 120%;
  color: #573d00;  
  background: url(/images/beveled_box.gif) 0 10px no-repeat;
  margin: 10px;
  padding: 20px 0 10px 20px;
  text-decoration: none;
}

.baseline {
width:100%;
height:1px;
border-top-style:solid;
border-width:thin;
clear:both;
margin-bottom:30px;
}

	/***** orange dotted line around page sections *****/
.sections	{
border:1px dashed #FF8700;
margin:2em 15px 0 0;
min-height:200px;
width:750px;
float:right;
padding:1em;
color:#4D2800;
line-height:1.8;
}
.sections ul {list-style-type:none;}
.sections a:link	{color:#FFBC00;}
.sections a:visited	{color:#FFBC00;}
.sections a:hover {color:#FFBC00;background-color:#4d3900;}
.hoveroverride {float:right;margin-top:10px;}
.hoveroverride a:hover	{background-color:white;} /* overrides sections hover */
.sections .beveled a, .sections .beveled a:hover {background-color:transparent;color:#573d00;text-decoration:none;}


/************* Interactive JavaScript Tutorials Box **************/

#interactive	{
float:right;
width:350px;
background-color:#99FF00;
padding:10px;
margin:0 0 0 10px;
border:2px #ff7a00 solid;
}

#interactive input {
margin:10px;
}

#interactive table#ui td {
padding:10px;
border-right:solid 1px black;
}

#interactive table#ui	{
border:solid 1px black;
}

#output {
border:1px solid #000000;
width:250px;
min-height:200px;
display:block;
font-size:80%;
font-family:"Courier New", Courier, monospace;
padding:10px;
float:left;
background-color:#99FF00;
margin-right:10px;
border:2px #ff7a00 solid;

}

.text_inputs label {
width:120px;display:block;float:left;
}

.text_inputs input {
width:120px;display:block;
}

.text_inputs #submit {
margin:10px 0 0 0;padding:5px 0;width:150px;
}


.radiogroup {

}

.radiogroup input {

width:40px;

}

.radiogroup label {
font-size:10px;
font-weight:normal;
display:block;


}


/***** AddToAny Widget Styles *****/
#addtoany {
float:right;margin:10px 90px 0 0;
}

/***** DISQUS Remove Link Styles *****/
.logo-disqus, .dsq-brlink  {
display:none;
visibility:hidden;
}

#disqus_thread {
padding-left:20px;
}

#lastUpdated {
float:right;
padding-right:20px;
}
   
   
/* ************************************** /
/* SINGULAR LAYOUT STYLES                 /
/* ***************************************/

/* include unique class or id tags here for layout rules
   that are not text or component rules, and can be
   used as a general hack rule i.e. {float:right;}		*/
   
.right	{float:right;}

.left	{float:left;}

.wraptext {
	float: left;
	width: auto;
	height: auto;
	padding: 1px;
	margin: 1px;
}

.clear	{clear:both;margin-top:25px;}

.dividetext	{ /* the aim here is to place an image inside a text string and cause the text to be divided */
display:block;}

.spaced	{line-height:1.8;}

.center	{margin:0 auto;}

.standardwidth	{	width:180px;}

.headline img	{
vertical-align:top;
float:left;
padding:0 10px 35px 10px ;
}

.divider {
  border: thin;
  border-top-style: solid;
  margin-bottom:30px;
}

.visualemphasis	{ /* highlights text for emphasis, can be upgraded to an image for visual effect */
border-style:dotted;
}

.padtable	{ /* a standard margin and padding to space tables from other elements */
margin:20px 0;
padding:5px;
}

.lists 	{
margin-left:25px;
}

.legal   {
font-size:.7em;
color: #548C1C !important;
}


/* ************************************** /
/* TEXT STYLES                            /
/* ***************************************/

/* include unique class or id tags here for text only */

.normalize	{
color:black;
}

.important	{
color:#cb162d;
}

.coloremphasis	{
	color: #CC9933;
	font-weight: bold;
}
.monospace {
	font-family: "Courier New", Courier, monospace;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #333300;
	white-space: pre-wrap;
}

.headline {
  font-size: 14px;
  font-weight: bolder;
  line-height:1.3;
}

.sec_color	{
padding-top:20px;
line-height:1.4;
color:#a4cf4f;
width:320px;
font-size:0.9em;
}

.smaller {
font-size:.8em;
color:#CCCCCC;
}

	/***** language markup *****/

span.method {

color:#AA99C5;
font-style:italic;
} /* for javascript methods */

span.a_method	{
font-family:"Courier New", "QuickType Mono", "Palatino Linotype", "Century Gothic";
font-size:1em;
}

span.array {
color:#E7573B;
font-style:italic;
} /* for javascript arrays */

span.function{
color:#497FBF;
font-style:italic;
} /* for javascript functions */

span.tag {
font-family:"Courier New", "QuickType Mono", "Palatino Linotype", "Century Gothic";
font-weight:bold;
color:#B7B7B7;
font-size:1.2em;
font-variant:small-caps;
} /* for HTML tags or CSS properties */

span.value {
font-family:"Courier New", "QuickType Mono", "Palatino Linotype", "Century Gothic";
color:#EF8861;
font-size:1.2em;
font-variant:small-caps;
} /* for CSS values or HTML attributes */

span.italics{
font-style:italic;
} 

span.hlight{
font-style:italic;
background-color:#FFFBC6;
} 


	/***** Brand styles in H1 headers *****/
.chaos	{color:#a52b3f;font-size:2em;margin:5px 15px 0 15px;padding-top:10px;padding-bottom:10px;}
.chaos a, .chaos a:link, .chaos a:visited, .mad {  color: #a52b3f;}
.chaos a:hover	{color:#f25433;text-decoration:none;}



/* ************************************** /
/* PAGE SPECIFIC - individualized         /
/* ***************************************/

/* itemize pages separately
   include any non-universal page-specific styles for those pages not covered by components, page or text styles */


	/***** white_site.css *****/

.white_site_builds	{background-color:#FFF8E6;color:#4D3900;width:320px;height:100px;padding:1% 1%; float:left; clear:left; margin: 0 0 10px 20px; border-style:double;}
.textbox	{color:#4D3900;width:270px;height:100px;padding:1% 1%; float:left; margin: 0 0 20px 10px; }
.textboxlast {color:#4D3900;width:270px;height:100px;padding:1% 1%; float:left; margin: 0 0 60px 10px; }
.whitewrap	{clear:left;display:block;}
div.textbox a:link {background-color:transparent;color:#ffbc28;text-decoration:none;}
div.textbox a:visited {background-color:transparent;color:#806f40;text-decoration:none;}
div.textbox a:hover {background-color:#ffbc28;color:#806f40;text-decoration:underline;}
div.textboxlast a:link {background-color:transparent;color:#ffbc28;text-decoration:none;}
div.textboxlast a:visited {background-color:transparent;color:#806f40;text-decoration:none;}
div.textboxlast a:hover {background-color:#ffbc28;color:#806f40;text-decoration:underline;}

	/***** contactform *****/


#contactform	{}

#contactform fieldset{
  margin:0;
}

/* #contactform legend{
  background:#EAF3DA;
  border:solid;
  margin:1.2em 0;
  padding:10px 20px;
} */

#contactform input, #contactform textarea  { 
  font-family:Arial, Helvetica, sans-serif;
  font-size:1em; 
  color:#484848;     
  background:white url("images/input-innershadow.png") repeat-x left -997px; 
  margin:0;
  padding:4px;
  text-align:left; 
  vertical-align:middle;   
  width:320px;  
  border:1px solid #E0DEDE;  
}


#contactform textarea  {
  width:580px;
  min-height:200px;
  margin-top:10px;
  padding:10px;
}


#contactform select {
  margin:0;
  text-align:left;
  color:#333333;
  line-height:normal;
  font-weight:normal;
  font-style:normal;
  font-variant:normal;
  border:1px solid #bbb;
  padding:4px;
  width:330px;
  font-size:1.1em;
}

#contactform label { 
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Jamrul, Garuda, Kalimati, sans-serif;
  text-align:left;
  color:#888;
  margin:0;
  padding:0;
  font-size:.75em;
  font-weight:normal;
}

#contactform .instr {
  font-size:1em;
  color:#8c952d;
  margin-left:45px;
  font-style:italic;
  font-weight:normal;
  font-family:Arial, Helvetica, sans-serif;
  text-shadow:2px 2px 4px #6BBA68;
}

#contactform #checkbox	{
text-align:right;
margin-left:315px;
width:inherit;
}

#contactform #human{
  display:none;
  left:-100px;
  position:absolute;
  top:-100px;
  visibility:hidden;
}

#contactform #contact	{
width:inherit;
border:1px solid #a4cf4f;
background-color:#D3FF7B;
color:#888;
}

#contactform #contact:hover	{
width:inherit;
border:1px solid #a4cf4f;
background-color:#BEE562;
color:#888;
}


#bookmark	{
width:54px;
float:right;
position:relative;
margin:10px;
}

/* END CONTACT FORM */

/******** COMPARE PLANS STYLES *******/

.compare {
    font: 1.5em Tahoma;
    margin: 4px 0 20px 0;
    width: expression(document.body.clientWidth < 1000? "1000px" : document.body.clientWidth > 1000? "1000px" : "auto");
    max-width: 1210px;
	white-space:normal;
	-webkit-box-shadow:5px 5px 7px #D0D0D0;
	-moz-box-shadow:5px 5px 7px #D0D0D0;
	box-shadow:5px 5px 7px #D0D0D0;
}
.compare th {
    background-color: #545454;
    font: 1.4em Tahoma,Verdana,sans-serif;
    padding: 0 0 3px 0;
    color: #fff;
    height: 30px;
    vertical-align: middle;
}
.compare th.plan {
    text-align: center;
    height: 30px;
    padding: 0 10px 2px 10px;	
}

.compare th.inclusion {
    text-align: center;
    height: 30px;
    padding: 0 10px 2px 10px;	
	color:#3cc203;
}

.compare td  {
    border-bottom: 1px solid #dbdbdb;
    padding: 6px 10px;
    color: #333536;
    text-align: center;
}

.compare td.feature {
    text-align: left;
}
.compare td.free {
    font:bold 1.6em "Trebuchet MS", Helvetica, Verdana, sans-serif;
    color: #3c8b89;
}
.compare td.price {
    font:bold 1.6em "Trebuchet MS", Helvetica, Verdana, sans-serif;
    color: #1A5A93;
    padding: 10px 0;
}
.compare td.price span {
    font:normal 0.63em Tahoma, Verdana, sans-serif;
    color: #333536;
}



tr.button td {
    height: 60px;
}
a.signup:link, a.signup:active, a.signup:visited, a.signup:hover {
    background: transparent url(images/btn-signup.png) no-repeat scroll top right;
    display: block;
    height: 34px;
    width: 144px;
    margin: 0 auto;
}
a.signup span {
    display: none;
}
a.subscribe:link, a.subscribe:active, a.subscribe:visited, a.subscribe:hover {
    background: transparent url(images/btn-subscribe.png) no-repeat scroll top right;
    display: block;
    height: 34px;
    width: 145px;
    margin: 0 auto;
}
a.subscribe span {
    display: none;
}
a.contact-us:link, a.contact-us:active, a.contact-us:visited, a.contact-us:hover {
    background: transparent url(images/btn-contact-us.gif) no-repeat scroll top right;
    display: block;
    height: 34px;
    width: 145px;
    margin: 0 auto;
}
a.contact-us span {
    display: none;
}
.compare tr.last td {
    border-bottom: 0;
}
.compare tr.button td {
    padding: 0;
}
.compare tr.button td {
    text-align: center;
}
div.tick {
    margin: 0 auto;
    background: url(images/tick.gif) no-repeat;
    width: 16px;
    height: 17px;
}
div.no {
    margin: 0 auto;
    background: url(images/no.png) no-repeat;
    width: 12px;
    height: 13px;
}
div.option {
    margin: 0 auto;
    background:url(images/question_mark.png) no-repeat;
    width: 16px;
    height: 16px;
}

.compare td.current {
    color: #0094d4;
    font:normal 1.1em Tahoma;
}
.thanx {
    color: #2C8D3A;
    font:bold  2.2em "Trebuchet MS", Helvetica, Verdana, sans-serif;
    width: 855px;
    text-align: center;
    margin-bottom: 30px;
}

/* HIRE US FORM STYLES *****/

#hireform	{margin:0;padding:0;}

#hireform fieldset{
  font-family:Arial,sans-serif;
  margin:5px 0;
}

#hireform fieldset.personal	{
width:48%;
float:left;
moz-border-radius: 8px;
webkit-border-radius: 8px;
padding:10px;
}
#hireform fieldset.client_needs	{
width:48%;
float:left;
clear:left;
moz-border-radius: 8px;
webkit-border-radius: 8px;
padding:10px;
}
#hireform fieldset.validation	{
border:solid 1px;
padding:0 20px;
float:none;
width:42%;
}


#hireform legend	{
text-decoration:underline;
}

#hireform .personal input {
  margin:0;
  text-align:left;
  color:#333333;
  line-height:normal;
  font-weight:normal;
  font-style:normal;
  font-variant:normal;
  border:1px solid #bbb;
  padding:4px;
  width:280px;
  font-size:1.1em;
  vertical-align:middle;
}

#hireform .client_needs input {
  margin:0;
  text-align:left;
  color:#333333;
  line-height:normal;
  font-weight:normal;
  font-style:normal;
  font-variant:normal;
  border:1px solid #bbb;
  width:290px;
  font-size:1.1em;
  vertical-align:middle;
}
#hireform textarea  { /* forces elements to become a form block */
  margin:0;
  text-align:left;
  color:#333333;
  line-height:normal;
  font-weight:normal;
  font-style:normal;
  font-variant:normal;
  border:1px solid #bbb;
  padding:4px;
  width:320px;
  font-size:1.1em;
  vertical-align:middle;
}


#hireform  label { 
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Jamrul, Garuda, Kalimati, sans-serif;
  line-height:normal;
  font-weight:normal;
  font-style:normal;
  font-variant:normal;
  text-align:left;
  color:#888;
  margin:0;
  padding:0;
  font-size:0.75em;
}

#hireform #checkbox	{
text-align:right;
margin-left:315px;
width:inherit;
}

#hireform #human{
  display:none;
  left:-100px;
  position:absolute;
  top:-100px;
  visibility:hidden;
}

#hireform #contact	{
width:inherit;
border:1px solid #a4cf4f;
background-color:#D3FF7B;
color:#888;
}

#hireform #contact:hover	{
width:inherit;
border:1px solid #a4cf4f;
background-color:#BEE562;
color:#888;
}

/* END STYLES */

	/***** SOCIAL MEDIA BOX *****/
#sidebar-slim {
	float:right;
	padding:0px;
	margin:0px;
	background-color:#FFFFFF;
	border-left: 1px solid  #ccc;
	border-bottom: 1px solid  #ccc;
	border-right: 1px solid  #ccc;	
	width:205px;
	padding-left:15px;
	color:#9C3E2C;
}

#social-media .fontcontrol {
font-size:10px;
font-family:Verdana, Arial, Helvetica, sans-serif;
line-height:1.6em;
padding-left:23px;
width:162px;
}	

/* float_clear_divs.css                             */

#one, #two, #three, #four, #five, #six, #seven, #eight, #nine, #ten, #eleven, #twelve, #thirteen, #fourteen, #fifteen, #sixteen, #seventeen, #eighteen, #nineteen, #twenty	{
width:120px;
height:60px;
}


#one	{background-color:red;float:left;}
#two	{background-color:yellow;float:right;}
#three	{background-color:blue;float:none;margin-left:120px;overflow:hidden;}

#four	{background-color:red;float:left;}
#five	{background-color:yellow;float:left;}
#six	{background-color:blue;float:right;clear:left;}

#seven	{background-color:red;float:right;}
#eight	{background-color:yellow;float:right;clear:both;}
#nine	{background-color:blue;float:none;width:400px;}

#ten	{background-color:red;float:left;}
#eleven	{background-color:yellow;float:left;}
#twelve	{background-color:green;float:left;}
#thirteen{background-color:blue;float:right;}

#fourteen{background-color:red;float:left;}
#fifteen{background-color:yellow;float:left;}
#sixteen{background-color:green;float:left;}
#seventeen{background-color:blue;float:right;}

#eighteen	{background-color:red;float:left;}
#nineteen	{background-color:yellow;float:left;clear:both;}
#twenty 	{background-color:blue;float:right;}

/* submitRating.css                             */

#ratingsForm	{width:100%;border:none;clear:both;}
#ratingsForm p	{color:#0077f5;float:right;clear:right;margin-top:-5px;margin-right:40px;}
#ratings	{display:inline;float:right;margin-right:30px;}
#ratings fieldset	{border:none;}
.wrap	{float:left;height:40px;text-align:center;font-size:80%;color:blue;vertical-align:middle;}
.submit	{float:left;font-size:80%;padding-top:13px;}
.wrap input {background-color:#e6e7f7;}
.submit input {color:#0077f5;}



/* mathExplosionsAndIterations.html                         */
#fly_box	{width:98%;border:solid;background-color:#FFFFFF;padding:10px;}
.fly	{display:block;float:left;padding-right:30px;}
.fly2	{display:block;float:right;padding-right:30px;}
.in	{display:inline;}
.codebox	{
	border-top:2px solid #E5DE0B;
	border-bottom:2px solid #E5DE0B;
	background-color:#FFFFFF;
	font-family: "Courier New", Courier, monospace, "Lucida Sans Unicode";
	color: #000000;
	padding: 5px 10px;
	font-size: 100%;
}

/* ************************************** /
/* PAGE SPECIFIC - individualized         /
/* ***************************************/

/* itemize pages separately
// include any non-universal page-specific styles for those pages not covered by components, page or text styles */


/***** Developer App JavaScript Dynamic Scaling *****/
#ledbox	{
position:relative;
overflow:hidden;
width:40px;
height:40px;
display:block;
float:left;
margin-left:40px;
}

#ledbox img	{
position:absolute;
bottom:0;
}
.scriptattr	{background-color:#c4e922;}
.cssattr	{background-color:#9c190b;}
.bodyattr	{background-color:#50c6ca;}


/***** *********************************** *****/

#siteName{
	margin: 0px;
	padding: 0px 0px 10px 10px;
}

#siteName img {
	position: absolute; 
}


/*************** #pageName styles **************/

#pageName{
	padding: 0px 0px 10px 10px;
}

/*************** basic navigation styles **************/

#basicnav	{
text-align:center;clear:left;
}
#basicnav a	{
padding:10px 30px;
}


/************* #globalNav styles **************/

#globalNav{
color: #ccc;
padding: 0px 0px 0px 10px;
white-space: nowrap;
margin-left:153px; 
}
/* 'nowrap' prevents links from line-wrapping if there are too many to fit in one line
   this will force a horizontal scrollbar if there isn't enough room for all links
   remove rule or change value to 'normal' if you want the links to line-wrap */

#globalNav img{
 display: block;
}

#globalNav a {
	font-size: 90%;
	padding: 0px 4px 0px 0px; 
}



/************* #siteInfo styles ***************/

#siteInfo{
	clear: both;
	border: 1px solid #ccc;
	font-size: 75%;
	color: #cccccc;
	padding: 10px 10px 10px 10px;
	margin-top:-1px; /* lines up google search bottom border with section links top border */
}
/* negative top margin pulls siteinfo up so its top border overlaps (and thus lines up with)
   the bottom border of the navBar in cases where they "touch" */

#siteInfo img{
	padding: 4px 4px 4px 0px;
	vertical-align: middle;
}




/************* REDUNDANT STYLES ***************/

#presentation	{
width:60%;
margin-left:30px; 
}