HTML, BODY {
    font-family: Verdana, Tahoma, Helvetica;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    font-size: 12px;
    color: #000000;
}

TABLE, TD 
{ 
       font-family: Verdana, Tahoma, Helvetica; 
       font-size: 12px; 
       color: #000000;
}

IMG 
{
       border: 0;
       padding: 0;
       margin: 0;
}

P 
{ 
       text-align: justify; 
       margin:0; 
       padding: 0 0 5px 0; 
}

H3 
{ 
       color: #3F4E57; 
       font-size: 14px; 
       font-family: Arial, Helvetica; 
       font-weight: bold; 
       padding: 0; 
       letter-spacing: 0px; 
}

A:link, A:active, A:visited
{
	FONT-WEIGHT: normal;
	FONT-SIZE: 12px;
	FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
	TEXT-DECORATION: underline;
	COLOR: #000000;
}

A:hover
{
	COLOR: #A61A1D;
	TEXT-DECORATION: underline;
}

UL 
{ 
       padding: 0;
       margin: 0px 0px 10px 25px; 
       list-style-type: none; 
       list-style-image: url('https://image.eralen.cc/image/gameplay/logs/dot.gif');  
}

LI { margin: 0 0 10px 0; }

.png 
{ 
       //background-image: none ! important;
       behavior: url('./css/pngfix.htc'); 
}

.dynam { position: absolute; z-index: 3; left: 26%; right: 26%; top: 144px; width: 48%; height: 90px; }
.hpfull { BACKGROUND: url('https://image.eralen.cc/image/gameplay/fight/hpbg1.gif') repeat-x; }
.hplos { BACKGROUND: url('https://image.eralen.cc/image/gameplay/fight/hpbg2.gif') repeat-x; }
.mpfull { BACKGROUND: url('https://image.eralen.cc/image/gameplay/fight/mpbg1.gif') repeat-x; }
.mplos { BACKGROUND: url('https://image.eralen.cc/image/gameplay/fight/mpbg2.gif') repeat-x; }

#lines_container { position: relative; }
#leftC { position: absolute; left: 0px; top: 0; }
#rightC { position: absolute; right: 0px; top: 0; }
#lines { padding: 7px 15px 0 18px; }
#text { position: absolute; z-index: 2; left: 25px; top: 6px; font-size: 11px; }

.clear { clear: both; }
.img-left { float: left; }
.img-right { float: right; }
.mainTable { padding-top: 95px; }
.ftime { font-size: 12px; color: #6b6b6b; }
.rh { font-weight: bold; color: #a61a1d; }
.fpla { font-size: 11px; color: #888888; }
.lBg { background: url('https://image.eralen.cc/image/gameplay/logs/lbg.gif') repeat-y left; }
.rBg { background: url('https://image.eralen.cc/image/gameplay/logs/rbg.gif') repeat-y right; }
.copir { font-weight: normal; font-size: 11px; margin: 0px; color: #999999; font-style: normal; font-family: Verdana, Tahoma, Helvetica; }

#container { height: 100%; position: relative; width: expression(document.body.clientWidth > 980 ? "100%" : "980px"); min-width: 980px; }
#headerPlace { position: absolute; top: 0; z-index: 2; width: 966px; left: 50%; margin-left: -484px; height: 200px; }
#content { position: relative; width: 92%; text-align: left; margin-bottom: 40px; }
#bottomLinks { width: 100%; text-align: center; position: relative; bottom: 0px; }
#rightCol { position: absolute; right: 0; top: 0; z-index: 1; }
#rightCounter { position: absolute; right: 3px; bottom: 3px; }
#leftCol { position: absolute; left: 0; top: 0; z-index: 1; }
#leftCounter { position: absolute; left: 3px; bottom: 3px; }
#rBot { position: absolute; right: 0; bottom: 35px;  }
#lBot { position: absolute; left: 0; bottom: 35px;  }

#tooltip{background:#fff;border:1px solid #999;color:#333;font: 12px Tahoma;margin:0px;padding:3px 5px;position:absolute;visibility:hidden;z-index:10;}


.er-modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 2000;
}

.er-modal-window {
    position: fixed;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #ffffff;
    border: 1px solid #777777;
    width: 300px;
    box-shadow: 0px 5px 20px rgba(0,0,0,0.3);
    z-index: 2001;
    font-family: Tahoma, Verdana, sans-serif;
    border-radius: 10px;
    overflow: hidden;
}

.er-modal-header {
    background: #e0e0e0;
    padding: 8px 10px;
    border-bottom: 1px solid #999999;
    font-weight: bold;
    font-size: 11px;
    color: #333333;
    text-shadow: 1px 1px 0px #ffffff;
}

.er-modal-body {
    padding: 25px 15px;
    font-size: 12px;
    color: #000000;
    text-align: center;
    background: #ffffff;
}

.er-modal-footer {
    padding: 10px;
    text-align: center;
    background: #f0f0f0;
    border-top: 1px solid #cccccc;
}

.er-modal-btn {
    background: #eeeeee;
    border: 1px solid #888888;
    padding: 5px 25px;
    font-size: 11px;
    cursor: pointer;
    font-family: Tahoma;
    border-radius: 4px;
    color: #333333;
}

.er-modal-btn:hover {
    background: #ffffff;
    border-color: #000000;
}


.turn-toggle-box {
    position: fixed;
    top: 15px;
    right: 45px;
    border: 1px solid #dddddd;
    background-color: #fcfcfc;
    padding: 8px 12px;
    font-family: Tahoma, sans-serif;
    font-size: 11px;
    color: #666666;
    z-index: 50;
    border-radius: 6px;
    text-align: center;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.1);
    min-width: 150px;
}

.turn-toggle-box input[type="checkbox"] {
    vertical-align: middle;
    margin: 0 4px 0 0;
    cursor: pointer;
}

.turn-toggle-desc {
    display: block;
    font-size: 9px;
    color: #999999;
    margin-top: 4px;
    line-height: 1.2;
}

.turn-divider{display:block;text-align:right;font-family:Tahoma,sans-serif;font-size:10px;font-weight:bold;text-transform:uppercase;clear:both;max-height:0;opacity:0;margin:0;padding:0;border-bottom:1px dashed transparent;color:transparent;transition:max-height 0.4s ease-in-out,opacity 0.4s ease-in-out,margin 0.4s ease-in-out,padding 0.4s ease-in-out,color 0.4s ease-in-out,border-color 0.4s ease-in-out;overflow:hidden;}
#content .turn-row{margin:0;padding:0;overflow:hidden;max-height:0;transition:max-height 0.4s ease-in-out,padding 0.4s ease-in-out,margin 0.4s ease-in-out;}
#content.show-turns .turn-row{max-height:45px;margin:0 0 5px 0;padding:0;}

.turn-highlight {
    background-color: #fff0b3 !important;
    padding: 2px 5px;
    border-radius: 4px;
    transition: background-color 2s ease-in-out;
}

#content.show-turns .turn-divider {
    max-height: 30px;
    opacity: 1;
    margin: 15px 0 10px 0;
    padding-bottom: 5px;
    border-bottom: 1px dashed #bbbbbb;
    color: #888888;
}