body {
    background-color: #c1c2c7;
    background-image: url(wall.png);
    overflow: hidden;
    color: #404449;
    font-family: Times New Roman, Times, serif;
}

.error {
    background: pink;
}

#errorView { 
    background: rgba(0,0,0,0.5);
    color: white; white-space: pre;
    padding: 20px;
}
#ajaxResult { text-align: center; }
#ajaxResult .label { font-size: 200%; }
#ajaxResult .detail { font-size: 100%; }

form section {
    border-radius: 6px;
    padding: 8px;
}

.anchor {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -10px;
    margin-top: -10px;
}
.anchor.shadow { margin-left: -4px; margin-top: -2px; opacity: 0.25; }
.anchor img {
    position: relative;
}

#payPalVC h1 { margin-left: 16px; }

infobutton {
    display: block;
    width: 32px;
    height: 32px;
    float: right;
    border-radius: 16px;
    line-height: 32px;
    font-size: 24px;
    text-align: center;
    background: #404449;
    color: white;
    cursor: pointer;
    font-style: italic;
    margin-right: 16px;
}
infobutton:hover {
    background: red;
}

#langBar {
    text-align: center;
    font-size: 90%;
    text-decoration: none;
}

#labelBottomBox0 {
    position: relative;
    left: -214px;
    top: 56px;
    width: 450px;
    height: 180px;
    text-align: center;
    font-size: 24px;
}

#labelTopBox,
#labelBottomBox {
    position: relative;
    font-size: 24px;
    width: 360px;
    left: -170px;
    text-align: center;
}

#labelTopBox { padding-left: 13px;  top: -140px; height: 100px; font-family: Times New Roman, Times, serif; }
#labelBottomBox { top: 56px; height: 160px; }

#labelBottom {
    position: absolute;
    bottom: 0;
    left: 0; right: 0;
}
.textAlignCenter, .centering { text-align: center; }
.textAlignLeft { text-align: left; }
.textAlignRight { text-align: right; }

.roundbutton {
    width: 96px;
    height: 96px;
    border-radius: 48px;
    line-height: 96px;
    font-size: 88px;
    text-align: center;
    background: #404449;
    color: white;
    position: absolute;
    cursor: pointer;
}
.roundbutton:hover { background: black; }

#infoButton {
    font-style: italic;
}
.hidden { display: none; }
.debug { border: 1px solid red; }
.maximized { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; }
.screen {
    position: absolute;
    top: 0; left: 0;
    right: 0; bottom: 0;
    margin: 24px;
    cursor: pointer;
/*
  display: table-cell;
  vertical-align: center;
  text-align: center;
  */
}
.dialog {
    background: rgba(255,255,255,0.8);
    border: 1px solid black; box-shadow: 10px 10px 20px rgba(0,0,0,0.5); padding: 10px;
    min-width: 260px;
    max-width: 480px;
    -x-min-height: 480px;
    margin: auto;

    z-index: 100;

    //        display: inline-block;
}
.dialog section { margin: 10px; }
.dialog h2 { text-align: center; }
.dialog label { cursor: pointer; }
.FlexHorizontal,.dialog textarea { width: 96%; }

.listCell {
    border: 0px solid gray;
    //        background: rgba(255,255,255,0.5);
    display: block;
    font-size: 16px;
    line-height: 16px;
    padding: 4px;
}
.listCell input[type="text"] {
    font-size: 16px;
    line-height: 16px;
    font-family: monospace;
}
.listButton {
    text-align: center;
    font-weight: bold;
    cursor: pointer;
    background: white;
    padding: 8px;
    border: 1px solid gray;
    border-radius: 6px;
    color: white;
    background: #404449;
}
.listButton:hover {
    background: red;
}
.listComment {
    margin-top: 2px;
    font-size: 80%;
}
.cost {
    float: right;
    font-weight: bold;
}
input[type='text'] {
    text-align: center;
}
section.legalese { padding: 0 10px 0 10px; font-size: 74%; }
section.info { padding: 0 10px 0 10px; }
section.info h1 { text-align: center; margin-top: 2px; }
section.info h2 { text-align: center; margin-bottom: 2px; }
.spinner {
    height:60px;
    width:60px;
    margin:0 auto;
    position:absolute;
    left: 50%; top: 50%;
    margin-left: -36px;
    margin-top: -36px;
    -webkit-animation: rotation .6s infinite linear;
    -moz-animation: rotation .6s infinite linear;
    -o-animation: rotation .6s infinite linear;
    animation: rotation .6s infinite linear;
    border:6px solid gray;
    border-radius:100%;
}

.spinner:before {
    content:"";
    display:block;
    position:absolute;
    left:-6px;
    top:-6px;
    height:100%;
    width:100%;
    border-top:6px solid black;
    border-left:6px solid transparent;
    border-bottom:6px solid transparent;
    border-right:6px solid transparent;
    border-radius:100%;
}

@-webkit-keyframes rotation {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes rotation {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(359deg);}
}
@-o-keyframes rotation {
    from {-o-transform: rotate(0deg);}
    to {-o-transform: rotate(359deg);}
}
@keyframes rotation {
    from {transform: rotate(0deg);}
    to {transform: rotate(359deg);}

