﻿/*  =00 Basic Setting
-----------------------------------------------------*/
 
h1{
    font-size: 56px;
    line-height: 22px;
    margin-bottom: 22px;
}
 
.logo-bg {
    position: absolute;
    z-index: -1;
    top: -.4em;
    left: 0px;
    color: #8ABAD4;
    font-size: 500%;
    font-weight: bold;
    white-space: nowrap;
}
 
 
/*  =01 Container
-----------------------------------------------------*/
#container {
    margin-top: 10px;
    border: 1px solid #fff;
    padding: 10px 10px;
    background: #f0f0f0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.75);
}
 
.relative   {  
	width: 640px;
	height: 550px;
    position: relative;  
}   
/*  =02 Regist Form
-----------------------------------------------------*/
fieldset {
    padding: 10px;
    background: #222222;
    border-radius: 10px;
    display: table;
    margin-bottom: 20px;
    width: 100%;
}
    fieldset p {
        display: table-cell;
        padding-left: 10px;
        vertical-align: bottom;
    }
        fieldset p label {
            color: #E3E3E3;
            font-size: 120%;
            display: block;
        }
 
    fieldset input[type="text"],
    fieldset input[type="nen"],
    fieldset input[type="tuki"],
    fieldset input[type="hi"] {
        display: table-cell;
        width: 100px;
        height: 20px;
        border: 1px solid #D7D7D7;
    } 
 
fieldset.absolute-00    {  
    position: absolute;  
    top: 0;  
    left: 0;  
}  

/*  =03 table
-----------------------------------------------------*/
table {
    border-collapse: collapse;
    text-align: left;
    margin-bottom: 10px;
    width: 100%;
	cursor: pointer;

}
 
table caption {
    margin-bottom: 10px;
    font-size: 28px;
    font-weight: bold;
    text-align: left;
}
 
table thead {
    border-bottom: 3px solid #09c;
}
 
table thead th {
    padding: 0 5px;
    text-align: left;
}
 
table tbody tr td {
    padding: 2px;
}
    table tbody tr:nth-child(even) {
        background: #DDD;
    }
 
    table tbody tr:nth-child(odd) {
        background: #fff;
    }
 
    table tbody tr:hover {
        background: #09c;
        border-radius: 4px;
    }
        table tbody tr:hover td {
            color: #fff;
        }
 
    table tbody tr .delete {
        visibility: hidden;
    }
        table tbody tr:hover .delete {
            visibility: visible;
        }
     table .today { color:red; }
     table .tommorow { color:blue; }

table.absolute-10    {  
    position: absolute;  
    top: 90px;  
    left: 0;  
}  
 
/*  =01 Button
-----------------------------------------------------*/
button {
    color: #6E6E6E;
    font: bold 12px Helvetica, Arial, sans-serif;
    text-decoration: none;
    padding: 4px 18px;
    position: relative;
    display: inline-block;
    text-shadow: 0 1px 0 white;
    -webkit-transition: border-color .218s;
    -moz-transition: border .218s;
    -o-transition: border-color .218s;
    transition: border-color .218s;
    background: #F3F3F3;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(whiteSmoke),to(#F1F1F1));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(whiteSmoke),to(#F1F1F1));
    border: solid 1px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    margin-right: 10px;
    border-image: initial;
}
    button:hover {
        color: #333;
        border-color: #999;
        -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    }
 
    button:active {
        color: #000;
        border-color: #444;
    }
 
button.delete {
    color: #fff;
    text-shadow: 0 -1px 0 #333;
    padding: 4px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    background: #E75D59;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(#E75D59),to(#990000));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#E75D59),to(#E6584C));
 
}

button.absolute-20    {  
    position: absolute;  
    top: 100px;  
    left: 10px;  
}  
button.absolute-30    {  
    position: absolute;  
    top: 100px;  
    left: 120px;  
}  

