*
{
margin: 0;
padding: 0;
}
body
{
margin: 0;
padding: 0;
text-align: justify;
font-family: arial, tahoma, helvetica, sans-serif;
font-size: 1em;
color: #000;
background: #fff;
text-align: left;
}
a
{
color: #000;
text-decoration: underline;
}
a:hover
{
text-decoration: none;
}
#wrap
{
width: 100%;
margin: 0;
padding: 0;
background: #fff;
}
#header
{
width: 1025px;
height: 130px;
margin: 0 auto;
padding: 0;
}
#header h1
{
position: absolute;
top: 10px;
left: 10px;
width: 800px;
margin: 0;
padding: 0;
color: #002844;
font-size: 35px;
}
#header h1 a
{
text-decoration: none;
color: #002844;
}
#header h2
{
position: absolute;
top: 60px;
left: 100px;
width: 800px;
margin: 0;
padding: 0;
color: #002844;
font-size: 24px;
}
#header ul
{
position: absolute;
top: 100px;
left: 100px;
width: 800px;
margin: 0;
padding: 0;
list-style: none;
line-height: normal;
}
#header ul li
{
display: inline;
}
#header ul li a
{
float: left;
margin: 0 3px 0 0;
padding: 5px 10px 5px 10px;
background: #002844;
border: 1px #d4d4d4 solid;
text-decoration: none;
font-weight: bold;
font-size: 15px;
color: #FFF;
}
#header ul li a:hover
{
color: #002844;
text-decoration: none;
background: #fff;
border: 1px #002844 solid;
}



#topads
{
width: 1025px;
margin: 0;
padding: 0;
}
#topads .topad
{
margin: 0;
padding: 0 0 0 50px;
}



#contentwrap
{
width: 1025px;
height: 100%;
margin: 0;
padding: 0 0 0 5px;
}
#leftcolumn
{
margin: 5px 0 15px 0;
padding: 0;
width: 210px;
float: left;
color: #000;
}
#leftcolumn .leftcolumnbox
{
margin: 5px 0 10px 0;
padding: 0;
background-color: #f5f5f5;
border: 1px dotted #d4d4d4;
}
#leftcolumn .leftcolumnbox h1
{
margin: 0;
padding: 0;
color: #002844;
font-size: 1em;
font-family: arial, helvetica, sans-serif;
font-weight: bold;
display: block;
text-align: center;
}
#lefcolumn .leftcolumnbox p
{
margin: 5px 2px;
padding: 0;
font-size: .9em;
font-family: arial, helvetica, sans-serif;
color: #000;
}
#leftcolumn .leftcolumnbox ul
{
margin: 0;
padding: 5px;
list-style-type: none;
}
#leftcolumn .leftcolumnbox ul li
{
margin: 0;
padding: 0;
display: block;
line-height: 1em;
}
#leftcolumn .leftcolumnbox ul li a
{
margin: 0;
padding: 0 5px 0 25px;
font-size: .9em;
line-height: 1em;
color: #002844;
text-decoration: none;
display: block;
border-top: 1px solid #f5f5f5;
border-bottom: 1px dashed #002844;
font-weight: normal;
background: url("webdevelopmenttutorials-siteimage1.jpg") left center no-repeat;
}
#leftcolumn .leftcolumnbox ul li a:hover
{
color: #fff;
background: #002844 url("webdevelopmenttutorials-siteimage2.jpg") left center no-repeat;
border-top: 1px solid #002844;
border-bottom: 1px solid #002844;
}
#leftcolumn .leftcolumnimages
{
margin: 5px 0;
padding: 0;
}
#leftcolumn .leftcolumnimages .leftimages a
{
text-decoration: none;
background-color: #e6e0d2;
}
#leftcolumn .leftcolumnimages .leftimages
{
margin: 10px 0 10px 0;
padding: 0;
background-color: #f5f5f5;
}
#leftcolumn .leftcolumnimages .leftimages img
{
margin: 5px 2px;
padding: 0;
width: 200px;
height: 100px;
background-color: #e6e0d2;
border: 1px solid #002844;
float: left;
}
#leftcolumn .leftcolumnimages .leftimages a:visited, active
{
text-decoration: none;
}
#leftcolumn .leftcolumnimages .leftimages a:hover img
{
text-decoration: none;
background-color: #e6e0d2;
border: 1px solid #e6e0d2;
}










#centercolumn
{
margin: 5px 0 15px 0;
padding: 0 0 0 5px;
width: 200px;
float: left;
color: #000;
}
#centercolumn .centercolumnbox
{
margin: 5px 0 10px 0;
padding: 0;
background-color: #f5f5f5;
border: 1px dotted #d4d4d4;
}
#centercolumn .centercolumnbox h1
{
margin: 0;
padding: 0;
color: #002844;
font-size: 1em;
font-family: arial, helvetica, sans-serif;
font-weight: bold;
display: block;
text-align: center;
}
#centercolumn .centercolumnbox ul
{
margin: 0;
padding: 5px;
list-style-type: none;
}
#centercolumn .centercolumnbox ul li
{
margin: 0;
padding: 0;
line-height: 1.1em;
display: block;
}
#centercolumn .centercolumnbox ul li a
{
margin: 0;
padding: 0 5px 0 25px;
font-size: .9em;
color: #002844;
text-decoration: none;
display: block;
border-top: 1px solid #f5f5f5;
border-bottom: 1px dashed #002844;
font-weight: normal;
background: url("webdevelopmenttutorials-siteimage1.jpg") left center no-repeat;
}
#centercolumn .centercolumnbox ul li a:hover
{
color: #fff;
background: #002844 url("webdevelopmenttutorials-siteimage2.jpg") left center no-repeat;
border-top: 1px solid #002844;
border-bottom: 1px solid #002844;
}










#rightcolumn
{
float: right;
width: 600px;
min-height: 500px;
margin: 5px 0 15px 5px;
padding: 5px 0 5px 0;
background: #fff;
border: 1px solid #002844;
font-size: .9em;
}
#rightcolumn h1
{
margin: 0;
padding: 5px 10px;
color: #002844;
font-size: 1.6em;
font-family: arial, helvetica, sans-serif;
}
#rightcolumn h2
{
margin: 0;
padding: 5px 10px;
color: #000;
font-size: 1.3em;
font-family: arial, helvetica, sans-serif;
}
#rightcolumn p
{
margin: 10px 3px;
padding: 5px;
font-size: 1em;
}
#rightcolumn p.tutorialbox
{
margin: 10px 5px;
padding: 10px 5px;
font-size: 1em;
border: 1px dotted #000;
}
#rightcolumn a
{
text-decoration: underline;
}
#rightcolumn a:hover
{
text-decoration: none;
}
#rightcolumn ul
{
margin: 10px;
padding: 0;
}
#rightcolumn ul li
{
list-style-type: none;
margin: 0;
padding: 0;
}
#rightcolumn ul li a
{
margin: 0;
padding: 0;
text-decoration: underline;
}
#rightcolumn ul li a:hover
{
text-decoration: none;
}
#rightcolumn ol
{
margin: 5px;
padding: 0 0 0 30px;
}
#rightcolumn ol li
{
margin: 0;
padding: 0;
}
#rightcolumn ol li a
{
margin: 0;
padding: 0;
text-decoration: underline;
}
#rightcolumn ol li a:hover
{
text-decoration: none;
}
#rightcolumn dl
{
margin: 5px;
padding: 0;
}
#rightcolumn dl dt
{
margin: 0;
padding: 0 0 0 15px;
}
#rightcolumn dl dd
{
margin: 0;
padding: 0 0 0 30px;
}




/* start of the styles for the free css and xhtml website templates section */
#rightcolumn .templateimage
{
float: left;
width: 220px;
height: 200px;
margin: 5px;
padding: 0 15px 0 15px;
border: 0 dotted #fff;
}
#rightcolumn .templateimage img
{
float: left;
width: 200px;
height: 130px;
margin: 0;
padding: 0;
}
#rightcolumn .templateimage a img
{
margin: 0;
padding: 4px;
background: #dbdbdb;
border: 0px solid #fff;
}
#rightcolumn .templateimage a:hover img
{
margin: 0;
padding: 4px;
background: #bfbfbf;
}

#rightcolumn .templateimage ul
{
margin: 3px 5px;
padding: 0;
}
#rightcolumn .templateimage ul li
{
display: block;
list-style-type: none;
margin: 0;
padding: 1px 0 1px 15px;
line-height: 1.3em;
}
#rightcolumn .templateimage ul li a
{
margin: 0;
padding: 0;
text-decoration: none;
}
#rightcolumn .templateimage ul li a:hover
{
margin: 0;
padding: 0;
text-decoration: underline;
}
/* end of the styles for the free css and xhtml website templates section */
#rightcolumn .tutorialvideo
{
float: left;
width: 600px;
height: 395px;
margin: 0;
padding: 0 0 0 50px;
border: 0px solid #fff;
}
#rightcolumn form
{
margin: 5px;
padding: 0;
}






#bottom
{
width: 100%;
margin: 0;
padding: 0;
background-color: #f5f5f5;
border-top: 1px dashed #002844;
font: normal 1em 'trebuchet ms', tahoma, arial, sans-serif;
text-align: left;
font-size: 1em;
}
#bottomcontent
{
width: 1000px;
margin: 0;
padding: 0 0 0 5px;
}
#bottom h1
{
margin: 0;
padding: 0 0 0 5px;
font: normal 1.2em 'trebuchet ms', tahoma, sans-serif;
color: #002844;
}
#bottomcontent a
{
text-decoration: none;
color: #002844;
font-size: 1em;
}
#bottomcontent a:hover
{
text-decoration: underline;
color: #333;
}
#bottomcontent ul
{
list-style-type: none;
margin: 0;
padding: 0;
}
#bottomcontent ul li
{
margin: 0;
padding: 0 0 0 5px;
display: block;
}
#bottomcontent ul li a
{
margin: 0;
padding: 0 0 0 20px;
font-size: .8em;
text-decoration: none;
background: url("aaimage1.jpg") left center no-repeat;
}
#bottomcontent ul li a:hover
{
text-decoration: underline;
}
#bottomcontent .leftbottomcolumn
{
float: left;
width: 300px;
margin: 0;
padding: 0 5px 30px 0;
}
#bottomcontent .centerbottomcolumn
{
float: left;
width: 300px;
margin: 0;
padding: 0 5px 30px 0;
}
#bottomcontent .rightbottomcolumn
{
float: right;
width: 300px;
margin: 0;
padding: 0 0 30px 0;
}








#footerwrap
{
width: 100%;
margin: 0;
padding: 0;
background: #002844;
}
#footer
{
width: 1000px;
margin: 0;
padding: 20px 0 10px 0;
text-align: center;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
background: #002844;
}
#footer p
{
margin: 10px 0 0 0;
padding: 0;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
color: #fff;
}
#footer a
{
color: #fff;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
text-decoration: underline;
}
#footer a:hover
{
text-decoration: none;
}
.clear
{
clear: both;
}