body
{
    font-family : arial;
    white-space : nowrap;
    display : block;
}

body div
{
    white-space : normal;
}

a
{
    font-style : normal;
    color : #555;
    text-decoration : none;
}

::-webkit-input-placeholder {
    color : #ABC;
    text-align : left;
}

.backgroundoverlay
{
    position : fixed;
    top : 0px;
    left : 0px;
    width : 100%;
    height : 100%;

    z-index : -1;
    background : url("stripe20.png") repeat;
}

input
{
    border : solid 1px #ABC;
    background : #DEF;
    display : inline;
}

input:focus
{
    background : #EDD0FF;
    width : auto;
}

button.red
{
    background : -webkit-gradient(linear, left top, left bottom, from(#FBC), to(#C88));
    background: -moz-linear-gradient (top left, #fbc, #c88);
    background-image: linear-gradient( 0deg, #cc8888, #ffbbcc );
}

button.red:active
{
    background : -webkit-gradient(linear, left top, left bottom, from(#C88), to(#FBC));
    background: -moz-linear-gradient (top left, #c88, #fbc);
    background-image: linear-gradient( 180deg, #cc8888, #ffbbcc );
}

button.green
{
    background : -webkit-gradient(linear, left top, left bottom, from(#CEA), to(#6B5));
    background: -moz-linear-gradient (top left, #cea, #6b5);
    background-image: linear-gradient( 0deg, #66bb55, #cceeaa );
}

button.green:active
{
    background : -webkit-gradient(linear, left top, left bottom, from(#6B5), to(#CEA));
    background: -moz-linear-gradient (top left, #6b5, #cea);
    background-image: linear-gradient( 0deg, #cceeaa, #66bb55 );
}

button.violet
{
    background : -webkit-gradient(linear, left top, left bottom, from(#CBF), to(#88C));
    background: -moz-linear-gradient (top left, #cbf, #88c);
    background-image: linear-gradient( 0deg, #8888cc, #ccbbff );
}

button.violet:active
{
    background : -webkit-gradient(linear, left top, left bottom, from(#88C), to(#CBF));
    background: -moz-linear-gradient (top left, #88c, #cbf);
    background-image: linear-gradient( 0deg, #ccbbff, #8888cc );
}

button
{
    border : 1px solid #999;
    /*box-shadow : 0px 0px 2px 2px #DDD;*/
    border-radius : 3px;
    background: #def;

    background: -webkit-gradient(linear, left top, left bottom, from(#def), to(#bce));
    background: -moz-linear-gradient (top left, #def, #bce);
    background-image: linear-gradient( 0deg, #bbccee, #ddeeff );
}

button:active
{
    position : relative;
    top : 1px;
    box-shadow: inset 0px 0px 6px 0px #AAA;

    background: -webkit-gradient(linear, left top, left bottom, from(#bce), to(#def));
    background: -moz-linear-gradient (top left, #bce, #def);
    background-image: linear-gradient( 180deg, #bbccee, #ddeeff );
}

.pressed
{
    /*background : #444;*/
    box-shadow : inset 0px 0px 12px 3px #99C;
    /*-webkit-transform : scale(1.05,1.05);*/
    font-weight : bold;
    -webkit-transition : 0.3s;
}

.buttonBar
{
    display : table-row;
}

.buttonWrap
{
    display : table-cell;
    padding : 0px 1px;
}

.buttonBar button
{
    width : 100%;
}

.entry.blue:nth-child(even)
{
    background-color: #BCF;
}

.entry.blue:nth-child(even):hover
{
    background-color: #ABE;
}

.entry.blue:nth-child(odd)
{
    background-color: #DDF;
}

.entry.blue:nth-child(odd):hover
{
    background-color: #CCE;
}

.entry.green:nth-child(even)
{
    background-color : #6D4;
}

.entry.green:nth-child(even):hover
{
    background-color : #5C3;
}

.entry.green:nth-child(odd)
{
    background-color : #8F6;
}

.entry.green:nth-child(odd):hover
{
    background-color : #7E5;
}

.entry:nth-child(even)
{
    background-color : #C1C1C1;
    -webkit-transition : 0.2s;
}

.entry:nth-child(even):hover
{
    background-color : #B1B1B1;
    -webkit-transition : 0.2s;
}

.entry:nth-child(odd)
{
    background-color : #F5F5F5;
    -webkit-transition : 0.2s;
}
.entry:nth-child(odd):hover
{
    background-color : #E5E5E5;
    -webkit-transition : 0.2s;
}

.field 
{
	width : 100px;
	margin-left: 10pt;
	border-radius : 3px;
	display : inline-block;
	vertical-align: middle;
    font-size : 13pt;
    height : 15pt;
    font-family: arial;
}

.compactfield
{
	width : 88px;
	margin-left: 10pt;
	border-radius : 3px;
	display : inline-block;
	vertical-align: middle;
    font-size : 13pt;
    font-family: arial;

    white-space : nowrap;
    overflow : visible;
    vertical-align : middle;
}

.field:hover
{
    /*text-shadow : 1px 1px 0.7em gold;*/
}

.button
{
	width : 20px;
	height : 20px;
	text-align : center;
	border-radius : 5px;
	border : solid;
	border-width : 1px;
	background-color : #CCCCCC;
	display : inline-block;
}

.overlay
{

    position : fixed;
    left: 50%;
    top : 50%;
    opacity : 1;
    background : white;
    vertical-align : middle;
    text-align : center;
    padding : 10px;
    border-radius : 8px;
    box-shadow : 0px 0px 20px 0px #000;
    font-size : 1em;
    line-height : 200%;
}

.overlay input, textarea, button
{
    font-size : 1em;
}

.overlay button
{
    padding : 5px 10px;
}

/* Wordplay on cell */
.chell
{
    display : table-cell;
    padding : 0px 5px;
}

.fbfield
{
    font-size : 13pt;
    white-space : normal;
    height : auto;
}

#picker
{
    text-align : center
}

#picker img
{
    /*float: left;*/
    /*width : 150px;*/
    display : inline;
    height : 200px;
}

.onerow
{
    white-space : nowrap;
    overflow : hidden;
}

.region
{
    background-color : #FFFFFF;
    border-radius : 20px;
    -webkit-transition: background-color .3s linear;
    /*box-shadow : 0px 0px 10px 0px #AAA;*/
}

.region:hover
{
    background-color : #BBF;
    -webkit-transition: background-color .3s linear;
}

.selected
{
    background : #444 !important;
    color : #CCC !important;
}

#Stages
{

}

#Stages div
{
	background-color : #CCC;
	border-radius : 3px;
	margin : 2px 0px;
	font-size : 11pt;
	display : list-item;
	list-style-type : lower-greek;
	list-style-position:inside;	
}

#Stages div.fulfilled
{
	background-color : #999;
	border-radius : 3px;
	margin : 2px 0px;
}