/* Not to confuse different browsers, we let them start from zero */ 
html, body {
   margin : 0;
   padding : 0;
}
 
body {
   font-family : "Trebuchet MS", Arial, Helvetica, Tahoma, sans-serif;
   font-size : 76%; /* font sizing in ems. if you want to change anything,                                          just change this.*/
   color : #000000;
   width : 100%;
   background-image : url(../Stylesheets/cssimages/mattpgebckgr.jpg);
   background-repeat : repeat-x;
   text-align : center; /*center wrapper in IE5*/
   voice-family : "\"}\"";/*keeping the zoomcontainer not centered*/
   voice-family : inherit;
   text-align : left;
}

a:link {
   color : #821654;
   background : transparent;
   text-decoration : none;
}

a:visited {
   color : #666666;
   text-decoration : none;
}

a:hover {
   color : #a52a2a;
   text-decoration : underline;
}

a:active {
   color : #484500;
}

p {
   margin : 1.2em 0.5em 1.2em 0.5em;
   text-align : left;
}
 
h1 {
   margin : 1.7em 0.5em 0 0.5em;
   text-align : left;
   font-size : 120%;
   
}
 
h2 {
   margin : 0.3em 0.5em 0 0.5em;
   text-align : left;
   font-size : 170%;
   
}
 
IMG {
   float : right;
   margin : 0 0 10px 10px;
   border : 1px solid #000;
   display : block;
}

#leftheader {
   position : absolute;
   top : 0;
   left : 0;
   height : 122px;
   width : 540px;
   background : url(../Stylesheets/cssimages/mattbckgr.jpg) no-repeat;
}

#wrapper {
   width : 778px;
   margin-left : auto;
   margin-right : auto;
   margin-top : 1em;
   margin-bottom : 1em;
   border : 1px solid #ccc;
}

#navcontainer {
   margin-top : 123px;
   text-align : left; /*placing the nav flush to the left in moz*//*placing the nav flush to the left in moz*/
}

#navcontainer ul {
   margin : 0;
   padding : 0;
   white-space : nowrap; /*  not wrap the list to a new line when the window is reduced in width *//*  not wrap the list to a new line when the window is reduced in width */
}

#navcontainer ul li {
   display : inline;
   width : 95px;
   margin-right : -4px;
}

#navcontainer ul li a {
   padding : 1px 30px 1px 30px;
   color : #BEBEBE;
   text-decoration : none;
   border-bottom : 1px solid #565656;
   border-right : 1px solid #565656;
   background : #821654 url(../Stylesheets/cssimages/mattnav.jpg) no-repeat .5em .4em;
}

#navcontainer li a:visited {
   color : #EEEEEE;
   background : #821654 url(../Stylesheets/cssimages/mattnav.jpg) no-repeat .5em .4em;
}

#navcontainer ul li a:hover {
   color : #007101;
   background : #BEBEBE url(../Stylesheets/cssimages/mattnav.jpg) no-repeat .5em .4em;
}

ul li#dummy a  {
   display : none;
}

.container {
   width : 500px;
   padding : 15px;
   margin : 3px 0 20px 5px;
   border : 1px solid #ccc;
}

/* zoom image */

#zoom a {
   float : right;
   margin : 0 0 10px 10px;
   border : 1px solid #000;
   text-indent : -1000em; /* hide the link text */
   overflow : hidden;
   display : block;
   width : 125px; /* show only thumbnail */
   height : 94px;
   background : url(../Stylesheets/cssimages/mattzoom.jpg) no-repeat top left;
}

#zoom a:hover {
   width : 300px; /* adjust size to zoomed photo */
   height : 225px;
   background-position : 0 -104px; /* move the image so only the big one shows */
   text-decoration : none; /* preventing  moz showing underline *//* preventing  moz showing underline */
}

#sub {
   margin-left : auto;
   margin-right : auto;
   width : 30em;
   height : 15em;
   overflow : auto;
   border : 1px solid #c49cc7;
}

#examplelist {
   position : absolute;
   font : bold 1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
   color : #000033;
   margin-left : 49em;
   margin-top : 12em;
   width : 150px;
   border : 1px solid #007B42;
   background : url(../Stylesheets/cssimages/mattsidenavbkgr.jpg);
}

#examplelist ul {
   padding-left : 2px;
   margin : 0px;
}

#examplelist li {
   position : relative;
   padding-top : 16px;
   padding-bottom : 5px;
   margin-bottom : -7px;
   text-align : center;
   list-style-type : none;
   background : url(../Stylesheets/cssimages/mattsidenav.jpg) no-repeat .2em .7em;
   padding-left : 3px;
   padding-right : 3px;
}


#examplelist li a:link {
   text-decoration : none;
}
 
 #examplelist li a:hover {
   text-decoration : none;
   position : relative;
}


#examplelist p {
   font-family : "Trebuchet MS", Arial, Helvetica, Tahoma, sans-serif;
   font-size : .9em;
   font-weight : normal;
   text-align : justify;
   padding-top : 5px;
   padding-bottom : -1px;
   padding-right : 5px;
   padding-left : 5px;
}

#footer {
   padding : 30px;
   background : url(../Stylesheets/cssimages/mattfooter.jpg) repeat-x;
   font-size : .7em;
}

#counter {
   display : none;
}