


/************************************************
 *						*
 *						*
 *	 Element styles				*
 *						*
 *						*
 ************************************************/



body
{
background: #ffffff;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding: 0px;
font-family: verdana, helvetica, monospace;
font-size: small;

}

img
{
text-align: right;
border: 0px;
padding-right: 10px;
}





h1
{
/* color: #535353; */
color: #ff3300;
font-family: Verdana, Helvetica, "Times New Roman", Monospace;
}



h2
{
color: #ff0000;
/* color: #C0CDF2; */
margin-top:5px;
margin-bottom: 0px;
font-size: xx-large;
font-family: "Times New Roman", Helvetica,  Verdana,   Monospace;

letter-spacing: -1px;
}



h3
{
color: #ff3300;
margin-bottom: 5px;
display: inline;
}



p
{
font-family: verdana, helvetica, arial;
color: #000000;
font-size: small;
margin-top: 3px;
}




hr
{

background-color: #ffffff;
height: 0px;
width: 100%;
margin-top: 5px;
border: 1px solid #ffffff; 
}


/************************************************
 *						*
 *						*
 *	 Overall Structure			*
 *						*
 *						*
 ************************************************/




#main
{
width: 600px;
margin-left: auto;
margin-right: auto;
border-left: 0px solid #000000;
border-right: 0px solid #000000;
border-bottom: 0px solid #000000;
border-top: 0px solid #000000; 
height: auto;
background: #ffffff;
padding: 0px;
margin-top: 0px;
display: block;
}


#main2
{
width: 600px;
margin-left: auto;
margin-right: auto;
/* background: url('../img_test/shadow1.jpg') repeat; */
padding: 0px;
height: auto;
margin-top: 0px;
display: block;
}


#left
{

opacity: .8;
filter: alpha(opacity=80);
float: left;
border-left: 0px solid #000000;
border-top: 0px;
display: block;
height: 200px;
width: 196px;
margin-left: 0px;
margin-top: 0px;
background: #ffffff url("../img_test/cell1dark1.png");
color: #000000;
font-weight: normal;
}

#left p
{
color: #000000;
}


#middle
{
opacity: .9;
filter: alpha(opacity=90);
float: left;
border-left: 0px dotted #000000;
border-top: 0px;
display: block;
height: 200px;
width: 196px;
margin-left: 5px;
margin-top: 0px;
background: #ffffff;
color: #000000;
font-weight: normal;
}

#middle p
{
padding-left: 3px;
padding-right: 3px;
color: #000000;
/* text-align: justify; */
}

#right
{
opacity: .6;
filter: alpha(opacity=60);
float: left;

border-right: 0px solid #000000;
border-top: 0px;
display: block;
height: 200px;
width: 196px;
margin-left: 5px;
margin-top: 0px;
margin-right: 0px;
background: #ffffff;
color: #000000;
font-weight: normal;
}


#stock
{
background: #ffffff; 
margin: 0px;
}


#bottom
{
background: #dddddd; 
/* display: block; */
height: auto;
min-height: 15px;
width: 600px;
margin-left: 0px;
margin-right: auto;
float: left;
border: 1px solid #000000;
margin-top: 5px;
color: #000000;
position: relative;
}


#bottom p
{
padding: 5px;
}

#underbottom
{

height: auto;
width: 598px;
padding-top: 5px;
padding-bottom: 5px;
float: left;
color: #000000;
position: relative;
border: 0px solid red;
text-align: center;
background-color: #ffffff;
background: #ffffff;
}

#underbottom p
{
text-indent: 0px;
margin-left: 0px;
text-align: left;
}


#underbottom ul
{
text-align: left;
}


#main h1
{
font-size: small;
margin: 0px;
/* color: #ff3300; */
color: #000000;
font-family: verdana, "Times New Roman", monospace;
font-weight: bold;
text-align: left;
padding-left: 3px;
}




div.clear {

  clear: both;
  }

#floor
{

width: 100%;
border: 0px;
margin: 0px;
background: #000000;
height: auto;
min-height: 200px;
}



#copyarea
{
margin-top: 30px;
z-index: 200000;
background: transparent;
position: relative;
}


/************************************************
 *						*
 *						*
 *	 Image Map				*
 *						*
 *						*
 ************************************************/



#imap 
{
display:block; 
width:600px; 
height:340px; 
background:url("../img/item7.png") no-repeat; 
position:relative;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-top: 0px solid #000000;
margin-top: 0px;
}





/* set up the definition list <dt><a> to hold the background image for the hover state */

#imap a#title 
{
display:block; 
width:600px; 
height:0px; 
padding-top:340px;
overflow:hidden; 
position:absolute; 
left:0; 
top:0; 
background:transparent url(../img_test/index_on2.jpg) no-repeat 600px 340px; cursor:default;
margin-top: 0px;
}


/*
#imap dl dt
{
width: 0px;
height: 0px;
margin: 0px;
}
*/

/* the hack for IE pre IE6 */

* html #imap a#title {height:366px; he\ight:0;}

/* the <dt><a> hover style to move the background image to position 0 0*/


#imap a#title:hover 
{
background-position: 0 0; 
z-index:10;
margin-top: 0px;
}



/* place the <dd>s in the correct absolute position */

#imap dd {position:absolute; padding:0; margin:0;}
#imap #picd {left:304px; top:10px; z-index:20;}
#imap #pica {left:110px; top:41px; z-index:20;}
#imap #pich {left:168px; top:67px; z-index:20;}
#imap #picm {left:385px; top:59px; z-index:20;}
#imap #pico {left:219px; top:110px; z-index:20;}



/* style the <dd><a> links physical size and the background image for the hover */

#imap a#design, #imap a#atabase, #imap a#hosting, #imap a#mains, #imap a#other 
{
display:block; 
width:65px; 
height:85px; 
background:transparent url(../img_test/hover4.gif) -100px -100px no-repeat; 
text-decoration:none; 
z-index:20;
margin-top: 0px;
}



/* style the span text so that it is not initially displayed */
#imap a span, #imap a:visited span {display:none;}

/* move the link background image to position 0 0 when hovered */
#imap a#design:hover, #imap a#atabase:hover, #imap a#hosting:hover, #imap a#mains:hover, #imap a#other:hover {background-position:0 0; margin-top: 0px;}




/************************************************
 *						*
 *						*
 *	 Rounded Corners			*
 *						*
 *						*
 ************************************************/




.formulab
{
margin: 0 1%; background:#C0CDF2; 
margin-left: 1px;
width: 98%;
margin-top: 3px;
text-decoration: none;
font-weight: normal;
text-align: left;



}

.formulab p {padding-bottom: 3px; padding-left: 10px;}
b.rtop, b.rbottom {display:block; background: #FFFFFF;}
b.rtop b, b.rbottom b{display: block; height: 1px; overflow: hidden; background: #C0CDF2}
b.r1 {margin: 0 5px;}
b.r2 {margin: 0 3px;}
b.r3 {margin: 0 2px;}
b.rtop b.r4, b.rbottom b.r4 {margin: 0 1px; height: 2px;}





/************************************************
 *						*
 *						*
 *	 Individual page styles			*
 *						*
 *						*
 ************************************************/


#contact
{
background: #ffffff url("../img/contactbw.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}

#contact p
{
color: #ffffff;
margin-bottom: 11px;
}



#monster
{
float: left;
margin-left: 77px;
margin-top: 30px;
color: #ffffff;
width: 260px;
height: auto;
position: relative;
}

#monster2
{
float: left;
padding-bottom: 50px;
margin-left: 50px;
margin-top: 15px;
width: 510px;
height: auto;
position: relative;
}


#designmonster
{
float: left;
margin-left: 30px;
margin-top: 60px;
color: #ffffff;
width: 300px;
height: auto;
position: relative;
border: 2px solid #cccccc;
z-index: 10;
}



#designmonstersub
{
opacity: .85;
filter: alpha(opacity=85);
background: #000000;
width: 290px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;

float: left;
position: relative;
height: 210px;
z-index: 100;

}


.inline
{
display: inline;
}




#designmonstersub ul
{
display: inline;
list-style-type: none;
margin: 0px;
padding: 0px;
}




#designmonstersub ul li
{
display: inline;
list-style-type: none;
margin: 0px;
padding: 0px;
} 


#domains
{
background: #ffffff url("../img/domains.jpg") no-repeat;
/* background: #ffffff url("../img_test/server1.png") no-repeat;*/
width: 598px;
height: 347px;
float: left;
display: block;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}



#domains p
{
color: #ffffff;
}



#interim
{
/* background: #ffffff url("../img/surfer.jpg") no-repeat;*/
background: #ffffff url("../img/other.jpg") no-repeat;
/* background: #ffffff url("../img_test/server1.png") no-repeat;*/
width: 598px;
height: 347px;
float: left;
display: block;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;

}



#interim p
{
color: #ffffff;
}



#hosting
{
background: #ffffff url("../img/hosting.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

#hosting p
{
color: #ffffff;
font-weight: normal;
}



#design
{
background: url("../img/design.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
color: #ffffff;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}


#design p
{
color: #ffffff;
}




#database
{
background: #ffffff url("../img/database.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
border-bottom: 1px solid #000000;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
}

#database p
{
color: #ffffff;
}



#systems
{
background: #ffffff url("../img/systems.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
border-bottom: 1px solid #000000;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
}

#systems p
{
color: #ffffff;
}





#generic
{
background: #ffffff url("../img/generic2.jpg") no-repeat;
width: 598px;
height: auto;
min-height: 270px;
float: left;
display: block;

}

#generictext
{
float: left;
margin-left: 40px;
margin-top: 40px;

width: 300px;
height: auto;
position: relative;
}

#generictextmore
{
float: left;
margin-left: 40px;


width: 520px;
height: auto;
position: relative;


}


#blog
{
background: #ffffff url("../img/steel.png") no-repeat;
width: 600px;
height: auto;
float: left;
display: block;

}






#index
{
width: 600px;
height: 347px;
float: left;
display: block;
color: #ffffff;
border: 0px solid red;
}

#indexinside
{
background: url("../img/index.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
color: #ffffff;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;

}

#indexinside p
{
color: #ffffff;
}







#portfolio
{
background: url("../img/portfolio5.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
color: #ffffff;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;

}

#portfolio p
{
color: #ffffff;
}



#mahatma{
border:0px solid #a7a7a7;  
margin-bottom: 1em; 
padding: 0px;
}

#mahatma h1
{
font-size: small;
margin: 0px;
/* color: #ff3300; */
color: #333333;
font-family: verdana, "Times New Roman", monospace;
font-weight: bold;
text-align: left;
padding-left: 3px;
/* margin-bottom: -20px;*/

}


#mahatma a:visited {text-decoration: none; color: #7f7f7f;}
#mahatma a:active  {text-decoration: none; color: #000000;}
#mahatma a:link  {text-decoration: none; color: #000000;}
#mahatma a:hover {font-weight: bold; text-decoration: underline;}


#mahatma h2
{
display: none;
}


#graphics
{
background: url("../img/graphics.jpg") no-repeat;
width: 598px;
height: 347px;
float: left;
display: block;
color: #ffffff;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;

}

#graphics p
{
color: #ffffff;
}




/************************************************
 *						*
 *						*
 *	         Form Design			*
 *						*
 *						*
 ************************************************/


#econtact 
{
width: 90%;
margin-left: auto;
margin-right: auto;
border: 1px dotted #000000;
padding: 10px;
/* background: #ffffff url("../img_test/cells_light.jpg") repeat-x; */
background: #ffffff;
margin-top: 10px;
margin-bottom: 10px !important;
visibility: hidden;
}



#econtact legend
{
border: 0px solid #000000;
padding-bottom: 5px;
padding-left: 5px;

width: 150px;
cursor: help;
font-weight: normal;

background: url("../img/label.gif") no-repeat;

color: #ffffff;
font-size: small;
}

#econtact fieldset
{
padding: 10px;
border: 1px solid #000000;
margin-bottom: 5px;
background: #ffffff;
}

#econtact label
{
display: block;
float: left;
width: 120px;
text-align: right;
color: #000000;
padding-right: 4px;
}

#econtact select
{
color: #8690ab;

}

#econtact br
{
clear: left;
}

#econtact input
{
width: 200px;
border: 1px solid #C0C0C0;
}

#econtact .submit
{
border: 1px outset #333;
cursor: pointer;
margin-top: 5px;
width: auto;
}

#econtact .textarealabel
{
font-style: italic;
text-align:left;
width: 100%;
}

#econtact textarea
{
border: 1px solid #C0C0C0;
margin-bottom: 3px;
padding: 3px;
font-family: verdana, helvetica, monospace;
width: 90%;
}




/************************************************
 *						*
 *						*
 *	 Various style elements			*
 *						*
 *						*
 ************************************************/

.note
{
background: #cccccc;
padding: 5px;
}

.noteintro
{
font-weight: bold;
color: #ff3300;
}


.notespace
{
background: #cccccc;
padding: 5px;
font-weight: bold;
color: #ff3300;
border-left: 6px solid #dfdfdf;
}


#articles
{
margin-top: 30px;
float: left;
margin-left: -20px;


width: 440px;
height: auto;
position: relative;
}

.boxed
{
border: 1px dotted #8690ab; 
color: #000000; 
text-align: left; 
padding: 8px; 
width: 90%

}



.formdisplay
{

overflow: auto; border: 1px outset; 
font-family: arial, verdana, helvetica, monospace; 
font-size: small;
}


.highlightbox
{
border: 1px solid #000000;
background-color: #dddddd;
padding: 5px;
width: 100%;
text-align: left;
}

.pastrybox
{
width: 100%;
margin-bottom: 40px;
}

.pastrybox img
{
float: left;
border: 0px;
}

.pastryboxh
{
color: #333333;
font-weight: bold;
}



/************************************************
 *						*
 *						*
 *	 Typographic styles			*
 *						*
 *						*
 ************************************************/



.dropcap
{
float:left;
/* color:#D4D4C7;*/
color: #b6bccc;
font-size:80px;
line-height:60px;
padding-top:2px;
padding-right:5px;
font-family: "Times New Roman" ,Georgia,Verdana;
font-weight: normal;
}


.dropcap2
{
float:left;
color:#D4D4C7;
font-size:80px;
line-height:60px;
padding-top:2px;
padding-right:5px;
font-family: "Times New Roman" ,Georgia,Verdana;
font-weight: normal;
}



#quote p
{
float: right;
height: 6em;
width: auto;
padding-right: 6px;
margin: 0px; 
font-family: arial, helvetica, Georgia, monospace;
width: 95%;
font-size: 18px;
line-height: 18px;
color: #000000;
text-align: right;
}

#quote span
{
color: #8690ab; 
}

#who
{
font-size: 15px;
color: #000000;
margin-top: 20px;
font-style: italic;
}


.highlight
{
color:#ff0000;
font-weight: bold;
}

.highlight2
{
font-weight: bold;
}

.marty
{
margin-left: 40px; 
margin-top: -4px;
}

.marty2
{
margin-left: 39px; 
margin-top: -4px;
}
.marty3
{
margin-left: 40px; 
margin-top: -4px;
}



