/* layoutstyles.css */

 

/* Universal style rule */

* {

    /* Block all browser default margins and padding */

    margin: 0;

    padding: 0;

}


body {

background: #0000ff url(Images/pix/cool1.jpg) no-repeat 50% 0;


    font-family: Verdana, Geneva, Arial, Sans-Serif;
    
    font-size: 12pt;

    color:#000000; 

}



 /* You'll need these two style rules in your style sheet */
#background{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:1; 
}

#wrapper{
position:relative;
z-index:2;
}

#wrapper {

    width: 50em;

    background-color: #0000FF; 

    /* Put 20px margin above the wrapper */ /* Set right and left to auto for centering */

    margin: 20px auto 0 auto;

}

 
/************* Branding division styles ****************/

#branding {

    position: relative;

    height: 5em;

    background-color: #0000FF;

    color: #00ff00;

    text-align: center;

}

 

/* Fixes the mysterious image gap */

#branding img {

    display: block;

}

 

#branding h1 {

    font-family: 'Arial Black' , Charcoal, Impact, Sans-serif;

    font-size: 2em;

    padding-top: 0.25em;

}

 

/* Absolutely position links in the branding division */

#branding a {

    position: absolute;

    text-decoration: none;

    color: #000;

    font-size: 0.8em;
    

}

IMG.displayed {

    display: block;

    margin-left: auto;

    margin-right: auto }

 

/* Unvisited and visited links in branding bar */

#branding a:link, 

#branding a:visited {

    color: #000;

}

 

/* Hover links in branding bar */

#branding a:hover {

    color: #0f0;

}

 

/* Active link in branding bar */

#branding a:active {

    color: #1bb498;

}

 
/************* Navbar division styles ****************/
 

/* Navbar division */

#navbar {

    background-color: #ffff00; 

    /* Left margin must match leftcolumn width */

    background: #0000FF url(Images/pix/GBG.jpg) repeat-x center;

    height: 1.6em;

}

/* Drop-down menu styles */

/* Applies to drop-down menus in navbar */

#navbar li ul{

  position:absolute;

  z-index:100;

  visibility:hidden;

}
 

/* Make drop-down visible on navbar hover */

#navbar li:hover ul,

#navbar li a:hover ul{ /* IE6 hack */
 
  visibility:visible;

  top:1.6em;

  left:0;

}

/* Applies to links on the drop-down menu */

#navbar li:hover ul li a,

#navbar li a:hover ul li a{ /* IE6 hack */

  background:#00ff00; /* Removes background image */

  color:#0000ff;

  text-align:left;

  display:block;

  width:7em;

  padding:0 0 0 1em;

  height:auto;
}

/* Hover on drop-down menu links */

#navbar li:hover ul li a:hover,

#navbar li a:hover ul li a:hover{ /* IE6 hack */

  background: #0000ff; 

  color:#ffff00;
}


/* Navbar hover and active links */

#navbar a:hover, #navbar a:active {

    background: #0000FF url(Images/pix/BGG.jpg) repeat-x center;

    color: #000;

}

 

/* For centered navbar only */

#navbar #centeringdiv {

    width: 40em; 

    /*Must be equal to, or slightly greater than, actual navbar width */

    margin: 0 auto;

}

 

/* For centered navbar only. Put class="firstitem" in first li tag */

.firstitem {

    border-left: solid 1px #ccc;

}

 

/* Remove bullets from ul in the navbar */

#navbar ul {

    list-style-type: none;

}


/* List items in the navbar */

#navbar li {

    float: left;

/* Required for drop-down menus */

position:relative;


}
 

/* Applies to navbar links, unvisited and visited */

#navbar a, 

#navbar a:link, 

#navbar a:visited {

    text-decoration: none;

}

 

/* Applies to navbar links, unvisited and visited */

#navbar a, 

#navbar a:link, 

#navbar a:visited {

    text-decoration: none;

    font-family: Verdana, Geneva, Arial, Sans-Serif;

    font-size: 80%;

    color: #0000FF;

    background: #00ff00 url(Images/pix/GYG.jpg) repeat-x center;

    display: block;

    height: 2em;

    width: 8em;

    border-right: solid 4px #0000ff;

    text-align: center;

    line-height: 2em;

    outline-style: none;

}

 

/* Navbar hover and active links */

#navbar a:hover, 

#navbar a:active, 

#navbar li.selected a:link, 

#navbar li.selected a:visited {

    background: #00FF00 url(Images/pix/YGG.jpg) repeat-x center;

    color: #FFFFFF;

}

 

/* IE6 hack applies to its table drop-down */

#navbar table {

  margin:-1px; 

  border-collapse:collapse; 

  position:absolute;

  top:0.5em;

  left:0;

  z-index:100;

}


/************* Leftcolumn division styles ****************/

#leftcolumn{

  /* Remember, content and navbar left margins must match this width */

  width:10em;

  float:left;

  /* Center images and text inside this div */

  text-align:center;

  
} 

/* Applies to paragraphs in the leftcolumn division */

#leftcolumn p{

  border:solid 2px #117b6f;
 
  padding:0.5em;

  width:80%;
  
  font-size:0.8em;
  
  margin:1em auto;
} 


<style type="text/css">

<!--
.divtest

{ 

background-color:#0000ff; 

	   width:100%; 

	   height:2em;}
 -->




/* Applies to leftcolumn links, unvisited and visited */

#leftcolumn  a, 

#leftcolumn  a:link, 

#leftcolumn  a:visited {

    text-decoration: none;

    font-family: Verdana, Geneva, Arial, Sans-Serif;

    font-size: 90%;

    color: #0000FF;

    font-weight: bold;

    background: #00ff00 url(Images/pix/YGG.jpg) repeat-x center;

    display: block;

    height: 1.7em;

    width: 9em;

    border-left: solid 4px #0000ff;
 
    border-right: solid 4px #0000ff;

    border-top: solid 4px #0000ff;

    border-bottom: solid 4px #0000ff;

    text-align: center;

    line-height: 2em;

    margin-left:5px;

    margin-right:5px;

    padding:5px;
 
    outline-style: none;



}

 

/* leftcolumn  hover and active links */

#leftcolumn  a:hover, 

#leftcolumn  a:active, 

#leftcolumn  li.selected a:link, 

#leftcolumn li.selected a:visited {

    background: #00ff00 url(Images/pix/GYG.jpg) repeat-x center;

    color: #FFFFFF;

}

</style>

/************* Content division styles ****************/

#content {

/* Left margin must match leftcolumn width */

    margin-left: 10em;

}

 

#content {

    /* Left margin must match leftcolumn width */

    margin-left: 10em;

    background-color: #ffffff;

    color: #000;

    padding: 10px 20px;

}

 
/* Unvisited links (no underline) */

a:link{

   color: #0000ff; /* blue */

   text-decoration: none;
}

/* Visited links (no underline) */ 

a:visited{

   color: #0000ff; /* blue */
 
   text-decoration: none;

}



/* Applies to h1 elements in the content division */

#content h1 {

    font-family: "Lucida Handwriting", Arial, Serif; 

    color: #806659;

    font-weight: normal;

    font-style: italic;

    font-variant: small-caps;

    letter-spacing: 0.08em;

    text-align:center 

}

 

/* Applies to unordered lists in the content division */

#content ul {

    padding-left: 40px;

}

 

#content p {

    line-height: 1.5em;

}

 

/* Styles h1, h2, and h3 style rules in the content division */

#content h1, 

#content h2, 

#content h3 {

    font-family: "Lucida Handwriting", Arial, Serif; 

    color: #000;

    font-weight: bold;

    font-style: italics;

    font-variant: small-caps;

    letter-spacing: 0.01em;

    text-align:center 

}

 

/* Size h1 headings in the content division */

#content h1 {

    font-size: 2em;

}

 

/* Size h2 headings in the content division */

#content h2 {

    font-size: 1.5em;

}

/* Size h3 headings in the content division */

#content h3 {

    font-size: 1em;

    font-style: normal;

}

/* Size h4 headings in the content division */

#content h4 {

    font-size: 0.8em;

    font-style: normal;

    font-weight: normal;

} 

/* Size h5 headings in the content division */

#content h5 {

    font-size: 0.6em;

    font-style: normal;

    font-weight: normal;

} 

/* Applies to all lists in the content division */

#content ul, 

#content ol {

    padding: 10px 0 10px 40px;

}

 
/* Captioned images */ 
div.captionpic{
   width:9em;
   padding:0.25em;
   margin:0.25em 0.25em 0 0;
   float:left;
   border:solid 1px #000;
   font-family: Arial, Helvetica, Sans-Serif;
   font-size:0.8em;
   color:#555;
   text-align:center; 
}
 
/* Applies to the image inside a captionpic div */
div.captionpic img{
   width:80%;
   border:none;
} 

 
img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto 
}

p { text-align: center }

/* Paragraphs styled as buttons1 */
p.buttons1{background-color:#5252E0;
  margin-left:50px;
  margin-right:50px;
  padding:5px;
  border:solid 1px #0000ff;

}


/* Paragraphs styled as buttons2 */
p.buttons2{background: #00FF00 url(Images/pix/YGG.jpg) repeat-x center;
  font-family: Verdana, Geneva, Arial, Sans-Serif;
  font-size: 90%;
  color: #0000FF;
  font-weight: bold;
  margin-left:50px;
  margin-right:50px;
  padding:5px;
  border:solid 1px #0000ff;
  text-decoration: none;

} 

/* Style for tables of thumbnail images */
table.thumbs{
   text-align: center;
   border-collapse: collapse;
   margin: auto;

}
/* Style for table cells that contain thumbnails */
td.thumbs{ 
   border: solid 1px #00bfff;
   padding: 10px;

}

/* Style for thumbnail images */
img.thumbs{
   width: 100px;
   height: 80px;
}


/* Style for tables of thumbnail images */
table.thumbs1{
   text-align: center;
   border-collapse: collapse;
   margin: auto;

}
/* Style for table cells that contain thumbnails */
td.thumbs1{ 
   border: solid 1px #00bfff;
   padding: 10px;

}

/* Style for thumbnail images */
img.thumbs1{
   width: 70px;
   height: 100px;

}


/* Style for tables of thumbnail images */
table.thumbs2{
   text-align: center;
   border-collapse: collapse;
   margin: auto;

}


/* Style for table cells that contain thumbnails */
td.thumbs2{ 
   border: solid 1px #00bfff;
   padding: 10px;
   bgcolor="#FCF64C"

}

/* Style for thumbnail images */
img.thumbs2{
   width: 80px;
   height: 40px;

}


/* Style for tables of thumbnail images */
table.thumbs3{
   text-align: center;
   border-collapse: collapse;
   margin: auto;

}


/* Style for table cells that contain thumbnails */
td.thumbs3{ 
   border: solid 1px #00bfff;
   padding: 10px;
   bgcolor="#FCF64C"

}

/* Style for thumbnail images */
img.thumbs3{
   width:150px;
   height: 200px;
}

/* Style for tables of thumbnail images */
table.thumbs4{
   text-align: center;
   border-collapse: collapse;
   margin: auto;

}


/* Style for table cells that contain thumbnails */
td.thumbs4{ 
   border: solid 1px #00bfff;
   padding: 10px;
   bgcolor="#FCF64C"

}

/* Style for thumbnail images */
img.thumbs4{
   width: 80px;
   height: 80px;

}

/* Style for scroll bar */
.scrollbar{
  width:10em;
  height:5em;
  margin:auto;
  padding:0.25em;
  border:solid thin #000;
  background-color:#ddd;
  overflow:auto;
}