body { 
       margin: 0;
       padding: 0;
       background-color: #83bb24;
       background-image: url("http://www.pixel-bg.com/img/bg.jpg");
       background-position: top left;
       background-repeat: repeat-x;
       font-family: "Verdana", "Ariel", "Tahoma", "Hebar" , sans-serif;
       font-size: 10px;
       letter-spacing: -1px;
       }
.no { display: none; }
#container { 
             display: block;
             width: 860px;
             height: 612px;
             position: relative;
             margin: 0 auto;
             padding: 0;
             background-image: url("http://www.pixel-bg.com/img/header.jpg");
             background-position: top left;
             background-repeat: no-repeat;
             }
#home {
			display: block;
			width: 210px;
			height: 85px;
			position: absolute;
			top: 10px;
			left: 20px;
		}
#nav { 
       display: block;
       position: absolute;
       top: 117px;
       left: 0;
       font-size: 14px;
       }
ul.menu { 
          display: block;
          height: 22px;
          list-style: none;
          list-style-type: none;
          margin: 0 0 0 35px;
          padding: 0;
          }
ul.menu li {
             position:relative;
             display: block;
             float: left;
             margin: 0;
             padding: 0;
             text-align: right;
             }
ul.menu li a {
               display: block;
               margin: 0 7px 0 0;
               padding: 0 7px 0 0;
               text-decoration: none;
               font-weight: bold;
               font-size: 12px;
               color: #5d5d5d;
               background-image: url("http://www.pixel-bg.com/img/spot.gif");
               background-position: -3000px -3000px;
               background-repeat: no-repeat;
               }
.FL:first-letter {
                   color: #83bb24;
                   }
ul.menu li a:hover { 
                     background-image: url("http://www.pixel-bg.com/img/spot.gif");
                     background-position: bottom right;
                     background-repeat: no-repeat;
                     }
ul.menu li b {
               display: block;
               margin: 0;
               padding: 0 15px 0 0;
               text-decoration: none;
               font-weight: bold;
               font-size: 12px;
               color: #83bb24;
               }
#main { 
        display: block;
        width: 860px;
        height: 393px;
        position: relative;
        top: 217px;
        left: 0;
        margin: 0 auto;
        padding: 0;
        letter-spacing: 0;
        background-image: url("http://www.pixel-bg.com/img/main-bg.jpg");
        background-position: top left;
        background-repeat: no-repeat;
        }
#preview { 
           display: block;
           position: absolute;
           top: -60px;
           left: 31px;
           width: 556px;
           height: 396px;
           margin: 0;
           padding: 0;
           border: 1px solid #8db61c;
           float: left;
           }
#pics { 
        display: block;
        width: 320px;
        margin: 0;
        padding: 0;
        float: left;
        }
#pics img { 
            margin: 7px;
            }
#pics p { 
			width: 101%;
          margin: 3px 0 0 15px;
          text-align: justify;
          text-indent: 15px;
          }
#pics a { 
			color: #5d5d5d;
			border-bottom: 1px solid #7cc455;
			text-decoration: none;
    }
#pics a:hover { 
					color: #7cc455;
                }
#anotation { 
             display: block;
             position: relative;
             width: 207px;
             height: 396px;
             margin: 0;
             padding: 0;
             float: right;
             background-image: url("http://www.pixel-bg.com/img/nanot.jpg");
             background-position: bottom right;
             background-repeat: no-repeat;
             }
#anotation ul { 
                list-style-type: none;
                margin: 15px 0 0 10px;
                padding: 0;
                }
#anotation b { 
               color: #78ff03;
               margin: 0 7px 0 0;
               font-weight: normal;
               }
#anotation dl { 
                list-style-type: none;
                margin: 15px 0 0 10px;
                padding: 0;
                }
#anotation dt { 
                color: #7cc455;
                margin: 0;
                font-weight: bold;
                letter-spacing: 0;
               }
#anotation dd { 
                margin: 2px 0 0 10px;
                }
#anotation dd a { 
					color: #10b010;
					border-left: 2px solid #24bb83;
					background-color: #f4f8ea; /* #b7f197; */
					text-decoration: none;
					padding: 0 7px 0 3px;
					margin: 0;
                  }
#anotation dd a:hover { 
						color: #72dbb0;
						border-left: 2px solid  #3dff3d;
                        padding: 0 7px 0 3px;
                        margin: 0;
                        background-image: url("http://www.pixel-bg.com/img/spot.gif");
                        background-position: bottom right;
                        background-repeat: no-repeat;
                        }
#icons { 
         display: block;
         width: 220px;
         height: 320px;
         position: absolute;
         top: -10px;
         right: 22px;
         margin: 0;
         padding: 0;
         float: right;
         }
#icons span,
#icons h4 { 
              display: block;
              width: 200px;
              height: 72px;
              margin: 17px 0 0 5px;
              padding: 0;
			font-size: 14px;
            text-align: center;
			color: #7cc455;
			line-height: 60px;
              }
/*
#icons h4 { 
            line-height: 60px;
            font-size: 14px;
            text-align: center;
            margin: 0;
            padding: 0;
            color: #7cc455;
            }
*/
#icons a,
#icons b {
           display: block;
           width: 60px;
           height: 60px;
           float: left;
           margin: 0 0 0 2px;
           padding: 1px;
           background-color: transparent;
           border: 1px solid #7cc455;
           overflow: hidden;
           position: relative;
           }
#icons a img {
               border: none;
               display: block;
               }
#icons a:hover  {
                  background-color: #ffffff;
                  }
#icons a:hover img  {
                      position: absolute;
                      left: -60px;
                      }
#footer { 
          display: block;
          width: 99%;
          height: 25px;
          color: #ffffff;
          font-size: 10px;
          position: absolute;
          bottom: 0;
          left: 0;
          margin: 0;
          padding: 0;
          text-align: right;
          }
p#styles {
			display: block;
			width: 69px;
			position: absolute;
			bottom: 33px;
			left: 33px;
			margin: 0;
			padding: 0;
		}
#red, #green, #blue {
								display: block;
								float: left;
								margin: 0 7px 0 0;
								width: 6px;
								height: 6px;
								border: 1px solid #5d5d5d;
							}
#red { background-color: #d92d2d; }
#green { background-color: #7cc455; }
#blue { background-color: #2e7ad8; }
/* forms style */
fieldset.f {
             margin: 3px auto;
             overflow: scroll;
             }
fieldset.f dl { 
              display: block;
              margin: 2px auto;
              padding: 3px;
              width: 98%;
              height: 100px;
              background-color: #eef8df;
              border-bottom: 1px solid #669966;
              }
fieldset.f p {
               position: relative;
               display: block;
               margin: 2px auto;
               padding: 3px;
               width: 98%;
               height: 80px;
               background-color: #eef8df;
               border-bottom: 1px solid #669966;
               }
fieldset.f p label {
                     display: block;
                     margin: 0;
                     padding: 0;
                     width: 35%;
                     }
fieldset.f p input {
                     display: block;
                     float: left;
                     margin: 0;
                     padding: 0;
                     width: 35%;
                     text-align: left;
                     }
fieldset.f p em {
                  display: block;
                  position: absolute;
                  text-align: right;
                  top: 1px;
                  right: 1px;
                  width: 60%;
                  font-family: Verdana, sans-serif;
                  font-size: 11px;
                  }
input.required { background-color: #ff9696; }
.error {
         color: red;
         font-size: 20px;
         font-weight: bold;
         }
/* preious next */
div.pn {
         display: block;
         position: absolute;
         left: 10px;
         bottom: 7px;
         width: 90%;
         }
div.pn a {
           display: block;
           float: left;
           border: none;
           font-size: 9px;
           font-variant: small-caps;
           text-decoration: none;
           padding: 0 7px;
           color: #5d5d5d;
           }
div.pn a.n {
             float: right;
             }
div.pn a.p:hover {
                   background-image: url("http://www.pixel-bg.com/img/spot.gif");
                   background-position: bottom left;
                   background-repeat: no-repeat;
                 }
div.pn a.n:hover {
                   background-image: url("http://www.pixel-bg.com/img/spot.gif");
                   background-position: bottom right;
                   background-repeat: no-repeat;
                 }
