/* common */
html 
{
    /*font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","MS PGothic","sans-serif";*/
    font-family: arial,sans-serif;
    background:#fff url("../images/background.jpg") repeat-y 50% 0%;
}

body {
	text-align: center;
}

/* contents container */
div#contents_container	{
	width: 950px;
	margin: 0 auto;
	text-align: left;
}

/* header */
div#header 
{
    width:100%;
	background:#118F34 url(../images/bg_header.gif) repeat-x;
    margin-bottom:5px;
    border-bottom:solid 1px #B5C7DE;

}

div#header #title
{
	color:#FFF;
    font-size:140%;
    letter-spacing: 0.3em;
    font-weight:bold;
    padding:10px;
}

div#navigator
{
    width:100%;
    height:20px;
    font-size:80%;
    padding-bottom:5px;
    margin-bottom:5px;
    border-bottom:solid 1px #B5C7DE;
}

div#navigator #page
{

}

div#navigator #back
{

    float:right;
}

/* footer */
div#footer
{
    width:100%;
    height:20px;
    margin-top:5px;
    border-top:solid 1px #B5C7DE;
    clear:both;
    background-color:#118F34;
}

/* clear float */
div#clear
{
    width:100%;
    clear:both;
}

div#heading
{
    width:100%;
    border:solid 1px #B5C7DE;
    background-color:#EFF3FB;
    padding:0.2em 0;
    margin-bottom:5px;
    text-align:center;
    letter-spacing: 0.2em;

}


div.Error
{
	width:100%;
	text-align:center;
	color:#FF0000;
    padding:0.5em 0;
    margin-bottom:5px;
    text-align:center;
    letter-spacing: 0.2em;
    border:solid 1px #B5C7DE;
    background-color:#EFF3FB;
}


/************ each page ****************/


/* Map.aspx */
div#map
{
    width:740px;
    position:relative;
}

div#map_description
{
    float:right;
    width:195px;
    margin-left:5px;
    font-size:80%;
}

div#map_description table
{
    font-size:100%;
}

span.icon_set
{
	margin-right:5px;
}


/* Rainfall.aspx・Tide.aspx */

div#table
{
    width:285px;
}

div#graph
{
    float:right;
    width:650px;
}
div#history_container
{

    height:366px;
    overflow:auto;
}
div#current_data
{
    width:100%;
    font-size:250%;
    padding:10px 0px 10px 0px;
    margin-bottom:5px;
    text-align:center;
    font-weight:bold;
    color:#ff9900;
    border:solid 1px #666;
}

table.history
{
    width:100%;
    text-align:center;
}

table.history td
{
	padding:0.2em 0;
	width:50%;
}

table.rainfall
{
    width:100%;
    text-align:center;
	border-collapse: collapse;
}

table.rainfall th
{
	width:25%;
	border:solid 1px #CCC;
	background-color:#507CD1;
	color:#FFFFFF;
	padding:0.2em 0;
}

table.rainfall td
{
	width:25%;
	border:solid 1px #CCC;
	padding:0.2em 0;
}

table.rainfall td.no-boder
{
	border:none;
}

div#login
{

    margin: 0 auto;  
    text-align: center;
}

div#camera_image
{
	width:100%;
	background-color:#EFF3FB;
	text-align:center;
	padding:5px 0px;
}

div#camera_image img
{
	width:427px;
	height:320px;
}

div#center
{
	text-align:center;
}

div.error_image
{
	text-align:center;
	color:#FF0000;
    text-align:center;
    letter-spacing: 0.2em;
	height:320px;
	margin: 0 auto;
	line-height : 320px
}

div#failur 
{

}

#button-center 
{
	width:100%;
	position: relative;
	overflow: hidden;
	top: 0px;
	left: 0px;
}

#button-right
{
	width:100%;
	text-align:right;
}

#button-right ul
{
	 list-style-type: none;
	 margin: 0;
	 padding: 0;
}

#button-center ul
{
	 position:relative;
	 left:54%;
	 float:left;
	top: 0px;
	height: 24px;
	width: 446px;
}
#button-right li
{
	list-style:none;
	 float: right;
	 width: 100px;
	 margin-left:2.0em;
	 padding: 0;
}

#button-center li
{
	list-style:none;	
   position:relative;
   width:100px;
   left:-50%;
   float:left;
   margin-right:2.0em;
}

#button-right a,#button-center a{
  text-align:center;
  display:block;
  padding:0.2em 0;
  width:100%;
  background-color:#507CD1;
  color:#FFF;
}

#button-right a:hover,#button-center a:hover{
	background-color:#99CCFF;
}

table.threshold
{
	width:100%;
	font-size:80%;
	text-align:center;
}

.line 
{
	border:none;
	width:100%;
	height:2px;
}


/* Point.aspx */
div#googlemap
{
	float:right;
    width:720px;
}

div#googlemap_description
{
    float:left;
    width:215px;
    margin-right:5px;
    font-size:100%;
}

div#googlemap_description table
{
    font-size:80%;
}

table.paging
{
	width:100%;
	text-align:center;
}

table.paging td
{
	width:33%;
}

a.place_map img 
{
	vertical-align:middle;
}