/* style sheet for the Mazuru.net website - draft 1 */

body{
background-image: url(backgrnd.jpg);
background-repeat: repeat-x;
background-color: rgb(0,110,130);
color: black;
font-family: arial, verdana, helvetica, sans serif;
text-align: center;
margin: 0 0 0 0;
font-size: 1em;
 }
 
 a:link {
color: black;
text-decoration: none;
}

a:visited {
text-decoration: none;
color: black;
}

a:hover {
text-decoration: none;
color: white;
background-color: #5b9cc0;
cursor: pointer;
}

a:active {
text-decoration: none;
color: red;
}
 
#container{
top: 0px; 
margin-left: auto; 
margin-right: auto; 
width: 1000px; 
position: relative;
text-align: center;
}

#main{
text-align: left; 
width: 1000px; 
background-color: rgb(0,110,130); 
top: 0px; 
margin-left: auto; 
margin-right: auto;
}

#maincont {
width: 1000px;
height: 580px;
background-image: url(contbckg.jpg);
background-repeat: repeat-x;
}

#btns{
height: 36px;
background-image: url(buttonbar.jpg); 
background-repeat: repeat-x; 
vertical-align: middle;
}

#navcontainer{
margin-top: 0px;
margin-left: auto;
margin-right: 4px;
position: relative;
float: right;
background-color: transparent;
}

#navlist
{
margin: 0 0 0 0px;
padding-left: 0px;
padding-right: 0px;
}

#navlist li
{
display: inline;
}

#navlist a { 
padding: 8 8 10 8px;
height: 35px;
background-image: url(button1.jpg);
}

#navlist a:link, #navlist a:visited
{
color: yellow;
text-decoration: none;
}

#navlist a:hover
{
height: 35px;
background-image: url(button2.jpg);
text-decoration: none;
position: relative;
}

#datab {
top: 210px; 
left: 20px; 
position: absolute; 
width: 301px; 
height: 460px; 
background-image: url(datab.jpg); 
background-repeat: no-repeat;
}

#datatext {
top: 10px; 
margin-left: 20px; 
width: 270px; 
position: relative; 
color: black;
}

#webdev {
top: 224px; 
left: 350px; 
position: absolute; 
width: 301px; 
height: 460px; 
background-image: url(webdes.jpg); 
background-repeat: no-repeat;
}

#webdevtext {
top: 10px; 
left: 20px; 
width: 270px; 
position: relative; 
color: black;
}

#network {
top: 217px; 
left: 680px; 
position: absolute; 
width: 301px; 
height: 460px; 
background-image: url(network.jpg); 
background-repeat: no-repeat;
}

#networktext {
top: 5px; 
left: 20px; 
width: 270px; 
position: relative; 
color: black;
}

#databCont {
top: 220px; 
left: 20px; 
position: absolute; 
width: 650px; 
height: 470px; 
border: 1px solid rgb(165,210,220);
}

#dataContBcg {
top: 20px; 
margin-left: 20px; 
width: 620px; 
height: 400px;
padding: 5px;
position: absolute; 
background-color: white;
opacity:0.55;
filter:alpha(opacity=55);
color: black;
z-index: 4;
}

#dataContText { 
top: 20px; 
margin-left: 20px; 
width: 620px; 
padding: 5px;
position: relative; 
background-color:transparent;
color: #000000; 
z-index: 5;
}

#databRight {
top: 220px; 
left: 690px; 
position: absolute; 
width: 280px; 

padding: 5px;
border: 1px solid rgb(165,210,220);
color: black;
z-index: 3;
}

#dataRightBcg {
top: 4px;
width: 270px;
height: 200px;
margin: 4px; 
padding: 5px;
position: absolute; 
background-color: white;
opacity:0.5;
filter:alpha(opacity=50);
color: black;
z-index: 4;
}

#dataRightText {
top: 4px;
width: 270px;
margin: 4px; 
padding: 5px;
position: relative; 
background-color: transparent;
color: black;
z-index: 5;
}

#webCont {
top: 250px; 
left: 5px; 
position: absolute; 
width: 678px; 
height: 900px; 
background-image: url(webdes.jpg); 
background-repeat: no-repeat;
z-index: 3;
}

#webContBcg {
top: 20px; 
margin-left: 20px; 
width: 628px; 
height: 400px;
padding: 5px;
position: absolute; 
background-color: white;
opacity:0.5;
filter:alpha(opacity=50);
color: black;
z-index: 4;
}

#webContText {
top: 20px;
margin-left: 20px;
width: 628px;
padding: 5px;
position: relative;
background-color: transparent;
color: black;
z-index: 5;
}

#webRight {
top: 250px; 
left: 708px; 
position: absolute; 
width: 330px; 
height: 460px; 
padding: 5px;
background-image: url(webdes1.jpg); 
background-repeat: no-repeat;
color: black;
z-index: 3;
}

#webRightBcg {
top: 9px;
margin: 4px; 
padding: 5px;
width: 310px;
height: 200px;
position: absolute; 
background-color: white;
opacity:0.5;
filter:alpha(opacity=50);
color: black;
z-index: 4;
}

#webRightText {
margin: 4px; 
padding: 5px;
position: relative;
background-color: transparent;
color: black;
z-index: 5;
}

#netCont {
top: 250px; 
left: 5px; 
position: absolute; 
width: 678px; 
height: 900px; 
background-image: url(network.jpg); 
background-repeat: no-repeat;
z-index: 3;
}

#netContBcg {
top: 20px; 
margin-left: 20px; 
width: 628px; 
height: 400px;
padding: 5px;
position: absolute; 
background-color: white;
opacity:0.5;
filter:alpha(opacity=50);
color: black;
z-index: 4;
}

#netContText {
top: 20px;
margin-left: 20px;
width: 628px;
padding: 5px;
position: relative;
background-color: transparent;
color: black;
z-index: 5;
}

#netRight {
top: 250px; 
left: 708px; 
position: absolute; 
width: 330px; 
height: 460px; 
padding: 5px;
background-image: url(network1.jpg); 
background-repeat: no-repeat;
color: black;
z-index: 3;
}

#netRightBcg {
top: 9px;
margin: 4px; 
padding: 5px;
width: 310px;
height: 200px;
position: absolute; 
background-color: white;
opacity:0.5;
filter:alpha(opacity=50);
color: black;
z-index: 4;
}

#netRightText {
margin: 4px; 
padding: 5px;
position: relative;
background-color: transparent;
color: black;
z-index: 5;
}

#dataCont2 {
top: 250px; 
left: 5px; 
position: absolute; 
width: 678px; 
height: 400px; 
border: 1px solid rbg(165,210,220);
}