
#box {
    margin: 0px;
    padding: 0px;
}

#top {
    margin: 0px;
    padding: 0px;
    background-image: url(../img/top.png);
    background-repeat: no-repeat;
}

#bottom {
    margin: 0px;
    padding: 0px;
    background-image: url(../img/bottom.png);
    background-repeat: no-repeat;
}


/**
 * Content Menu Link Styling
 */

#menu {
    margin-top: -10px;
    padding: 0px;
    z-index: 2;
    word-spacing: 30px;
    background-image: url(../img/content.png);
    background-repeat: repeat-y;
    text-align: center;
}

#menu a,
#menu a:hover,
#menu a:visited {
    font-family:Georgia,Times,"Times New Roman",serif;          /* CHANGE? */
    color: #473215;
    font-size: 18px;
    letter-spacing: 2px;
    text-decoration: none;
    /* font-weight: bold;  -- current links */
}

#menu a.active,
#menu a:hover.active, 
#menu a:visited.active {
    font-weight: bold;
}

/**
 * Content styling.
 */

#content {
    height: auto;
    z-index: 1;
    margin: 0px;
    padding: 0px;
    background-image: url(../img/content.png);
    background-repeat: repeat-y;
}


#content ul.icon {
    list-style-type: none;
    font-size: 14px;
    margin: 0px 0px 0px 20px;
    padding: 0px;
}

#content ul.icon li {
    min-height: 32px;
    display: block;
    margin: 10px 0px 0px 0px;    
    background-repeat: no-repeat;
    padding: 0px 0px 0px 36px;
    overflow: hidden;
    font-weight: bold;
}

#content ul.icon li p.sub {
    padding: 0px 0px 10px 10px;
    margin: 0px 0px 0px 0px;
    width: 250px;
    text-indent: 0px;
    font-weight: normal;
    color: #000000;
}

/**
 * Icon Styling -- Hardware
 */

#content ul.icon li.memory {
    background-image: url(../img/icons/memory.png); 
}

#content ul.icon li.hardware {
    background-image: url(../img/icons/hardware.png);
}

#content ul.icon li.network {
    background-image: url(../img/icons/network.png);
}

#content ul.icon li.upgrade {
    background-image: url(../img/icons/upgrade.png);
}

#content ul.icon li.trouble {
    background-image: url(../img/icons/trouble.png);
}

#content ul.icon li.maintain {
    background-image: url(../img/icons/maintain.png);
}

#content ul.icon li.custom {
    background-image: url(../img/icons/custom.png);
}

/**
 * Icon Styling -- General
 */

#content ul.icon li.virus {
    background-image: url(../img/icons/virus.png);
}

#content ul.icon li.remote {
    background-image: url(../img/icons/remote.png);
}

#content ul.icon li.backup {
    background-image: url(../img/icons/backup.png);
}

#content ul.icon li.optimize {
    background-image: url(../img/icons/optimize.png);
}

#content ul.icon li.new {
    background-image: url(../img/icons/new.png);
}

#content ul.icon li.windows {
    background-image: url(../img/icons/windows.png);
}

#content ul.icon li.software {
    background-image: url(../img/icons/software.png);
}

#content ul.icon li.spyware {
    background-image: url(../img/icons/spyware.png);
}

/**
 * Icon Styling -- Network
 */

#content ul.icon li.server {
    background-image: url(../img/icons/server.png);
}

#content ul.icon li.wireless {
    background-image: url(../img/icons/wireless.png);
}

#content ul.icon li.dhcp {
    background-image: url(../img/icons/dhcp.png);
}

#content ul.icon li.router {
    background-image: url(../img/icons/router.png);
}

#content ul.icon li.printer {
    background-image: url(../img/icons/printer.png);
}

#content ul.icon li.bridge {
    background-image: url(../img/icons/bridge.png);
}

#content ul.icon li.file {
    background-image: url(../img/icons/file.png);
}

#content ul.icon li.cable {
    background-image: url(../img/icons/cable.png);
}

#content ul.icon li.nas {
    background-image: url(../img/icons/nas.png);
}

/**
 * Fieldset styling.
 */ 

#content fieldset {
    border: 2px solid #473215;
    background-color: #EEEED1;
    position: relative;
}

#content fieldset.small {
    margin: 0px 40px 30px 40px;
    padding: 0px 10px 10px 10px;
    width: 340px;
    background-color: #EEEED1;
}

#content fieldset.message {
    width: 650px;
    padding: 15px;
    margin: 0px 40px 20px 40px;
    background-color: #EEEED1;
}

#content fieldset legend {
    border: 1px solid #000000;
    background-color: #FFFCCF;
    font-weight: bold;
    padding: 3px 20px 3px 20px;
    margin: 0px;
    letter-spacing: 1px;
    position: absolute;
    top: -15px;
    left: 20px;
}

#content fieldset p.left {
    text-align: left;
    padding: 0px;
    margin: 0px;
    font-size: 14px;
    letter-spacing: 1px;
}

#content fieldset input,
#content fieldset textarea {
    border: 1px solid #000000;
    padding: 0px;
    margin: 0px;
}

#content fieldset input:hover,
#content fieldset textarea:hover {
    border: 1px solid #006400;
    background-color: #E0EEE0;
}

#content hr {
    border: 1px solid #000000;
    width: 350px;
    text-align: center;
}

#content fieldset.small div.left {
    margin: 0px;
    padding: 0px;
    float: left;
    width: 165px;
    text-align: center;
    border: 0px solid #000;
}

#content fieldset.small div.right {
    padding: 0px;
    margin: 0px;
    width: 165px;
    float: right;
    text-align: left;
    border: 0px solid #006400;
}

#content input.submit {
    border: 2px solid green;
    letter-spacing: 1px;
    background-color: #E0EEE0;
}

#content input.submit:hover {
    border: 2px solid green;
    background-color: #ffffff;
}

#content input.clear {
    border: 2px solid red;
    background-color: #EED5D2;	
}

#content input.clear:hover {
    border: 2px solid red;
    background-color: #fff;
}

#content ul.right {
    float: left;
    border: 0px solid #000;
    padding: 0px;
    margin: 20px 0px 0px 20px;
}

/**
 * Additional div styling
 */

#content div.spacer {
    padding: 0px;
    margin: 15px 0px 35px 0px;    
}

#content div.center {
    text-align: center;
    font-size: 14px;
    line-height: 20px;    
}

#content div.main {
    font-family: arial, verdana;
    font-size: 15px;
    line-height: 19px;
    margin: 10px 20px 5px 0px;
    padding: 0px 0px 0px 20px;    
}

#content div.main p {
    text-indent: 25px;
}

#content div.main ul.sub {
    text-indent: 25px;
}

/**
 * Paragraph Styling
 */

#content p.clear {
    font-size: 14px;
    line-height: 20px;
    text-indent: 25px;
    margin: 10px 20px 5px 20px;
    padding: 0px;   
    clear: both;
}

#content fieldset.small p {
    padding: 0px;
    margin: 15px 0px 0px 5px;
}

/**
 * Web Design Styling
 */

#content ul.web {
    font-size: 18px;
    line-height: 22px;
    list-style-type: circle;
}

#content ul.web ul.sub {
    margin-bottom: 15px;
    font-size: 15px;
    list-style-type: square;
}

#content div.left {
    margin: 0px 0px 0px 40px;
    padding: 0px;
    float: left;
    width: 325px;
    border: 0px solid #000;
}

#content div.right {
    margin: 0px 40px 0px 0px;
    padding: 0px;
    float: right;
    width: 325px;
    border: 0px solid #000;
}

/**
 * Education Styling
 */

#content ul.education li {
    padding: 0px;
    margin: 0px 0px 0px -20px;
    font-size: 12px;
}

/**
 * Tools styling
 */

#content div.tools {
    float: left;
    padding: 0px;
    margin: 0px 0px 0px 15px;
    width: 400px;
    border: 0px solid #000;
}

#content div.tools h2 {
    padding: 0px;
    margin: 10px 0px 0px 10px;
}

#content ul.tools {
    list-style-type: circle;
    line-height: 20px;
    font-size: 16px;
}

#content ul.tools ul.sub {
    margin-bottom: 15px;
    font-size: 14px;
    list-style-type: square;
}

#content ul.tools a,
#content ul.tools a:visited {
    color: #CD3700;
    text-decoration: none;
}

#content ul.tools a:hover {
    color: #FF6103;
}

/**
 * Sitemap adjustments.
 */

#content ul.sitemap {
    font-size: 14px;
}

#content ul.sitemap li {
    padding: 0px;
    margin: 0px 0px 5px 0px;
}

/**
 * Content,Footer,Portfolio link styling
 */

#content div.main a, 
#content div.main a:visited,
#content ul.sitemap a,
#content ul.sitemap a:visited,
#footer a,
#footer a:visited,
#content div.portfolio a,
#content div.portfolio a:visited {
    color: #3299CC;
    font-weight: bold;
    text-decoration: none;
}

#content div.main a:hover,
#content ul.sitemap a:hover,
#footer a:hover,
#content div.portfolio a:hover {
    color: #26466D;
}

/**
 * Portfolio styling
 */

#content div.portfolio {
    margin: 30px auto 0px auto;
    padding: 5px 5px 5px 5px;
    border: 1px dashed #000000;
    width: 600px;
    color: #000000;
    background-color: #EEEED1;
    font-size: 14px;
    line-height: 18px;
}

#content div.portfolio p.title {
    text-align: center;
    padding: 0px;
    margin: 0px;
    font-size: 16px;
}

#content div.portfolio ul {
    list-style-type: none;
    text-indent: -20px;
}

#content div.portfolio div.rightfolio {
    float: right;
    margin: 10px 5px 10px 0px;
    padding: 2px;
    width: 340px;
}

#content div.portfolio div.leftfolio {
    float: left;
    margin: 10px 0px 10px 5px;
    padding: 2px;
    width: 340px;
}

/**
 * Image Styling
 */

#content div.portfolio img.rightfolio {
    float: right;
    margin: 10px 10px 10px 10px;
}

#content div.portfolio img.leftfolio {
    float: left;
    margin: 10px 10px 10px 10px;
}

#content img.no {
    border: 0px;
    padding: 0px;
}

#content img {
    background-color: #ffffff;
    border: 1px solid #a9a9a9;
    padding: 4px;
}

#content img.left {
    float: left;
    margin: 10px 10px 10px 20px;
}

#content img.right {
    float: right;
    margin: 20px 40px 10px 10px;
}


/* http://www.bioneural.net/2006/04/01/create-a-valid-css-alert-message/ */

.alert {
    background: #fff6bf url(../img/alert.png) center no-repeat;
    background-position: 15px 50%; /* x-pos y-pos */
    text-align: left;
    padding: 5px 20px 5px 45px;
    border-top: 2px solid #ffd324;
    border-bottom: 2px solid #ffd324;
}

/**
 * Schedule-Table Styling
 */
div.table {
    margin: 0px;
    padding: 0px;
    width: 600px;
    text-align: center;
}

div.table div.col {
    float: left;
    width: 95px;
}

div.table ul {
    list-style-type: none;
}

div.table ul li {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    width: 90px;
    height: 22px;
}

div.table ul li.yellow {
    background-color: #CDE472;
}

div.table ul li.red {
    background-color: #FA8072;
}

div.table ul li.orange {
    background-color: #E3A869;
}

div.table ul li.blue {
    background-color: #B0E0E6;
}

div.table ul li.purple {
    background-color: #AB82FF;
}

div.table ul li.green {
    background-color: #93DB70;
}

div.table ul li.teal {
    background-color: #48D1CC;
}

/**
 * Completed Courses List
 */

ul.sub {
    margin: 0px 0px 10px 0px;
}

/* don't get credit for below -- credit author etc */
/* http://www.456bereastreet.com/lab/inverted_tabs/ */

	html,body {
		margin:0;
		padding:0;
		color:#000;
		background:#fff;
	}
	body {
		font:76%/135% "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
		padding:0 0 10px 0;
		min-width:760px;
	}
	code {
		font-family:Monaco, Courier, "Courier New", monospace;
	}
	h1 {
		font-size:1.5em;
	}
	#footer {
		text-align:center;
		clear:both;
	}
	#wrap {
		width:760px;
		margin:0 auto;
	}
	#main {
		clear:both;
                padding:0px;
		margin-top:20px;
	}
	.adwrap,
	.adwrap iframe {
		width:300px;
		height:250px;
	}
	.adwrap {
		float:left;
		margin:0 1em 0 0;
	}
	.adwrap-wide,
	.adwrap-wide iframe {
		width:468px;
		height:60px;
	}
	.adwrap-wide {
		margin:0 auto;
	}
	/* CSS for the tabs starts here */
	#header {
		height:140px;
		background:url(../img/header.png) 0 0 no-repeat;
	}
	#nav {
		float:left;
		width:760px;
		margin-top:-19px;
		font-size:0.94em;
		line-height:1em;
	}
	#nav ul {
		margin:0;
		padding:0 0 0 28px;
		list-style:none;
	}
	#nav li {
		float:left;
		margin:0 0 0 -1px;
		padding:0 0 0 6px;
		background:url(../img/nav1.gif) 0 100% no-repeat;
	}
	#nav li:hover {
		background-position:-6px 100%;
	}
	#nav a {
		float:left;
		display:block;
		color:#473215;
		font-weight:bold;
		font-family:Georgia,Times,"Times New Roman",serif;
		background:url(../img/nav2.gif) 100% 100% no-repeat;
		padding:5px 14px 12px 8px;
		text-decoration:none;
	}
	#nav li:hover a {
		background-image:url(../img/nav1.gif);
	}
	/* Hide from IE5-Mac \*/
	#nav a {float:none;}
	/* End IE5-Mac hack */
	#nav a:hover {
		color:#000;
		text-decoration:underline;
	}
	#home #nav #t1,
	#repair #nav #t2,
        #hardware #nav #t2,
        #network #nav #t2, 
	#web #nav #t3,
	#portfolio #nav #t4,
        #portfolio2 #nav #t4,
        #portfolio3 #nav #t4,
	#contact #nav #t5,
        #thanks #nav #t5,
        #education #nav #t6,
        #schedule #nav #t6,
        #completed #nav #t6,
	#tools #nav #t7,
        #remote #nav #t7 {
		background-position:-12px 100%;
		padding-left:26px;
		margin:0 2px 0 1px;
	}
	#home #nav #t1 a,
	#repair #nav #t2 a,
        #hardware #nav #t2 a,
        #network #nav #t2 a,
	#web #nav #t3 a,
	#portfolio #nav #t4 a,
        #portfolio2 #nav #t4 a,
        #portfolio3 #nav #t4 a,
	#contact #nav #t5 a,
        #thanks #nav #t5 a,
        #education #nav #t6 a,
        #schedule #nav #t6 a,
        #completed #nav #t6 a,
	#tools #nav #t7 a,
        #remote #nav #t7 a {
		background-image:url(../img/nav2s.gif);
		padding-left:0;
		padding-right:19px;
	}
	#nav #t1,
	#home #nav #t1 {
		margin-left:0;
	}
	#nav #t6,
	#tools #nav #t7 {
		margin-right:0;
	}
