body{
  margin:0px;
  padding:0px;
  color:black;
  background-color:#aaaaaa;
  font:sans-serif;
  font-size:16px;
  line-height:25px;
  filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#ffffffff, endcolorstr=#ffaaaaaa, gradienttype=0);

  background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #aaaaaa), color-stop(0.87, #cccccc), color-stop(0.70, #ffffff), color-stop(0.48, #999999), color-stop(0.23, #ffffff), color-stop(0.00, #aaaaaa));
  background: -webkit-linear-gradient(top, #aaaaaa 0%, #ffffff 23%, #999999 48%, #ffffff 70%, #cccccc 87%, #aaaaaa 100%);
  background: -moz-linear-gradient(top, #aaaaaa 0%, #ffffff 23%, #999999 48%, #ffffff 70%, #ccccccc 87%, #aaaaaa 100%);
  background: -o-linear-gradient(top, #aaaaaa 0%, #ffffff 23%, #999999 48%, #ffffff 70%, #cccccc 87%, #aaaaaa 100%);
  background: -ms-linear-gradient(top, #aaaaaa 0%, #ffffff 23%, #999999 48%, #ffffff 70%, #cccccc 87%, #aaaaaa 100%);
  background: linear-gradient(top, #aaaaaa 0%, #ffffff 23%, #999999 48%, #ffffff 70%, #cccccc 87%, #aaaaaa 100%);

}

#top{
  //background-color:transparent;
  margin-left:210px;
  position:relative;
  top:0px;
  left:0px;
  z-index:100;
}

#nav{
  position:fixed;
  _position:absolute;
  left:0px;
  top:25%;
  width:40%;

  height:78%;

  margin-left:0;
  padding:0;
  overflow:auto;
  z-index:1;
  max-width:180px;
}

#contents{
  margin:20px 30px 0 180px;
  padding:0 5px 5px 50px;
  z-index:10;
  background-color:rgb(215,215,215);
  background-color:rgba(255,255,255,0.6);
}



h3{
  font-size:25px;
}

.unit{
  margin:0 50px;
}

.center{
  text-align:center;
}

img{
  border:none;
}

.f20{
  font-size:20px;
  font-weight:bold;
}

a{
  color:rgb(0,0,192);
  text-decoration:none;
}

a:link{
  color:rgb(255,0,0);
}

a:visited{
  color:rgb(255,0,0);
}

a:hover{
  color:rgb(0,128,255);
  text-decoration:underline;
  
}

a:active{
  color:rgb(255,128,0);
}

.blue{
  color:rgb(0,0,255);
  font-weight:bold;
  font-size:150%
}

.menu{
  margin-left:5px;
}

ul{
  margin:0.1em 0 0 1em;
  background-color:transparent;
  padding:0;
}

li ul{
  
}

#navi{
  margin-top:0;
  background-color:transparent;
}

.men{
  padding-left:0;
  margin:2px;
  margin-left:0;
  background-color:transparent;
}

.men a{
  display:block;
  background-color:transparent;
  padding:1px;
}

.men a:link{
  color:rgb(0,128,255);
}

.ddb{
  display:block;
  background-color:rgb(76,76,76);
  cursor:pointer;
  padding:1px;
  text-decoration:none;
  color:rgb(128,255,128);


}

#navi .men{
  list-style-type:none;
}

#navi .men div{
  width:120px;
  background-color:rgb(76,76,76);
  color:rgb(128,0,255);
}

#navi .men div:hover{
  background-color:rgb(122,122,122);
}

.ddb:hover{
  color:rgb(255,255,0);
  text-decoration:underline;
  background-color:rgb(122,122,122);
}

#navi .men a:hover{
  color:rgb(255,255,0);
}

#navi .men a:active{
  color:rgb(255,128,0);
}

.sub{
  font-size:60%;
}

#caption{
  margin-left:190px;
}

.small{
  font-size:70%;
}

#items{
  
}

.item{
  background-color:rgb(76,76,76);
  padding:2px;

  -webkit-border-radius:5px 0 0 5px;
  background-image:-webkit-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0)));

  -ms-border-radius:5px 0 0 5px;
  background-image:-ms-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0)));

  -moz-border-radius:5px 0 0 5px;
  background-image:-moz-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0)));

  -o-border-radius:5px 0 0 5px;
  background-image:-o-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0)));

  border-radius:5px 0 0 5px;
  background-image:gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0)));
}

.item a{
  font-size:120%;
  display:block;
  background-color:transparent;
  color:rgb(0,128,255);
}

.item a:link{
  color:rgb(0,128,255);
}

.item a:hover{
  color:rgb(255,255,0);
}

.item:hover{
  background-color:rgb(122,122,122);
}


.indent{
  margin-left:10px;
  font-size:85%;
}

table.center{
  margin:auto;
  border-left:5px;
  border-right:5px;
}

.ddb_2{
  display:block;
  background-color:rgb(244,244,244);
  cursor:default;
  padding:1px;
  text-decoration:none;
  color:rgb(64,64,64);
}

.p_table{
  border-style:solid;
  border:1px;
  border-color:rgb(0,0,0);
  empty-cells: hide;
}

.p_table td{
  width:25px;
  text-align:center;
  font-size:80%;
  margin:0;
}

.p_table td.other_e{
  color:rgb(0,0,0);
  background-color:rgb(0,255,0);
}

.p_table td.rare_gas{
  color:rgb(0,0,0);
  background-color:rgb(128,255,255);
}

.p_table td.alkali{
  color:rgb(0,0,0);
  background-color:rgb(255,102,102);
}

.p_table td.other_m{
  color:rgb(0,0,0);
  background-color:rgb(204,204,204);
}

.p_table td.alkali_e{
  color:rgb(0,0,0);
  background-color:rgb(255,222,173);
}

.p_table td.halogen{
  color:rgb(0,0,0);
  background-color:rgb(255,255,153);
}

.p_table td.metalloid{
  color:rgb(0,0,0);
  background-color:rgb(204,204,153);
}

.p_table td.t_e{
  color:rgb(0,0,0);
  background-color:rgb(255,192,192);
}

.p_table td.lanthanide{
  color:rgb(0,0,0);
  background-color:rgb(255,204,238);
}

.p_table td.actinides{
  color:rgb(0,0,0);
  background-color:rgb(255,153,204);
}

.p_table td.unknown{
  color:rgb(0,0,0);
  background-color:rgb(204,204,255);
}

.p_table td .sub{
  background-color:transparent;
  color:rgb(0,0,0);
}

.warning{
  border:solid 1px rgb(255,255,0);
  padding:3px;
}

.grad1{
  padding:0 0 0 2px;

  -webkit-border-radius:0 4px 4px 0;
  background-image:-webkit-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  -ms-border-radius:0 4px 4px 0;
  background-image:-ms-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  -moz-border-radius:0 4px 4px 0;
  background-image:-moz-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  -o-border-radius:0 4px 4px 0;
  background-image:-o-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  border-radius:0 4px 4px 0;
  background-image:gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));
}

#copyright{
  height:12px;
  width:936px;
  margin-left:auto;
  margin-right:auto;
  background-image:url("../image/copyright.png");
  background-repeat:no-repeat;
}

.interview{
  margin-left:10px;
}

#class_and_name{
  display:none;
}

.s_answer_c{
  display:block;
}

.p_answer_c{
  display:none;
}

#bg_copper{
  background-color:rgb(255,218,62);
  filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#ffffffff, endcolorstr=#ffd38451, gradienttype=0);

  background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, rgb(211,132,81)), color-stop(0.87, rgb(222,125,90)), color-stop(0.70, rgb(255,240,197)), color-stop(0.48, rgb(189,122,70)), color-stop(0.23, rgb(255,218,162)), color-stop(0.00, rgb(211,132,81)));
  background: -webkit-linear-gradient(top, rgb(211,132,81) 0%, rgb(255,218,162) 23%, rgb(189,122,70) 48%, rgb(255,240,197) 70%, rgb(222,125,90) 87%, rgb(211,132,81) 100%);
  background: -moz-linear-gradient(top, rgb(211,132,81) 0%, rgb(255,218,162) 23%, rgb(189,122,70) 48%, rgb(255,240,197) 70%, rgb(222,125,90) 87%, rgb(211,132,81) 100%);
  background: -o-linear-gradient(top, rgb(211,132,81) 0%, rgb(255,218,162) 23%, rgb(189,122,70) 48%, rgb(255,240,197) 70%, rgb(222,125,90) 87%, rgb(211,132,81) 100%);
  background: -ms-linear-gradient(top, rgb(211,132,81) 0%, rgb(255,218,162) 23%, rgb(189,122,70) 48%, rgb(255,240,197) 70%, rgb(222,125,90) 87%, rgb(211,132,81) 100%);
  background: linear-linear-gradient(top, rgb(211,132,81) 0%, rgb(255,218,162) 23%, rgb(189,122,70) 48%, rgb(255,240,197) 70%, rgb(222,125,90) 87%, rgb(211,132,81) 100%);

}

.serial{
  background-color:rgb(122,122,122);
  border:solid 1px rgb(0,0,0);
  padding:5px;

  -webkit-border-radius:4px;
  background-image:-webkit-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  -ms-border-radius:4px;
  background-image:-ms-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  -moz-border-radius:4px;
  background-image:-moz-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  -o-border-radius:4px;
  background-image:-o-gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));

  border-radius:4px;
  background-image:gradient(linear,left top,
  left bottom,from(rgba(255,255,255,0.2)),
  to(rgba(0,0,0,0.5)));
}

.serial:hover{
  background-color:rgb(244,244,244);
}

.grid_unit{
  clear:both;
  height:250px;
}

.grid{
  float:left;
}

@media print{
body{
  margin:0px;
  padding:0px;
  font:sans-serif;
  font-size:16px;
  line-height:25px;
  color:rgb(0,0,0);
  background-color:rgb(255,255,255);
  filter:none;
}

#nav{
  display:none;
}

#contents{
  margin:3px;
}

.heading{
  color:rgb(0,0,0) !important;
}

.unit{
  margin:0 50px;
}

.center{
  text-align:center;
}

img{
  border:none;
}

.print_hidden{
  display:none;
}

#class_and_name{
  display:inline;
  text-align:right;
  text-decoration:underline;
}

.s_answer_c{
  display:none;
}

.p_answer_c{
  display:block;
  border:solid 1px rgb(0,0,0);
  width:500px;
  height:40px;
}
}