/* License: GPLv2 */ @import url(./battle-log.css?v6.6); .battle { position: absolute; text-align: left; top: 9px; left: -1px; border: 1px solid #AAAAAA; background: #CFD5DA; color: black; width: 640px; height: 360px; overflow: hidden; font-family: Verdana, sans-serif; font-size: 10pt; } .backdrop { width: 700px; height: 500px; position: absolute; top: -90px; left: -50px; background: transparent url(../fx/bg-beach.png) no-repeat scroll left top; opacity: 0.8; } .battle a { color: #2277FF; } .battle a:hover { color: #1155AA; } .innerbattle { position: relative; width: 640px; height: 360px; } .battle-log-add { position: absolute; text-align: left; border: 1px solid #AAAAAA; background: #EEF2F5; color: black; top: 369px; left: 640px; right: -1px; font-family: Verdana, sans-serif; font-size: 10pt; } .battle-log { position: absolute; text-align: left; border: 1px solid #AAAAAA; background: #EEF2F5; color: black; top: 9px; left: 640px; right: -1px; height: 360px; font-family: Verdana, sans-serif; font-size: 10pt; overflow: auto; overflow-y: scroll; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; word-wrap: break-word; } .dark .battle, .dark .battle-log, .dark .battle-log-add { border-color: #5A5A5A; } .battle-log-inline { position: static; top: auto; right: auto; bottom: auto; left: auto; height: auto; width: auto; overflow-y: auto; } .battle-log .inner { padding: 4px 8px 0px 8px; } .battle-log .inner-preempt { padding: 0 8px 4px 8px; } .battle-log .inner-after { margin-top: 0.5em; } .playbutton { position: absolute; display: block; top: 160px; left: 120px; right: 120px; text-align: center; } .playbutton1, .playbutton2 { position: absolute; display: block; top: 190px; left: 100px; z-index: 100; } .playbutton2 { top: 130px; left: 300px; } .playbutton button, .playbutton1 button, .playbutton2 button { font-size: 16pt; } .background { position: absolute; display: none; top: 0; left: 0; bottom: 0; right: 0; } .statbar { position: absolute; display: none; width: 154px; min-height: 40px; padding: 2px 4px; } .statbar strong { margin: 0 -15px; display: block; text-align: center; color: #222222; text-shadow: #FFFFFF 1px 1px 0, #FFFFFF 1px -1px 0, #FFFFFF -1px 1px 0, #FFFFFF -1px -1px 0; } .statbar strong small { font-weight: normal; } .statbar .hpbar { position: relative; border: 1px solid #777777; background: #FCFEFF; padding: 1px; height: 8px; margin: 0 0 0 0; width: 151px; border-radius: 4px; } /* The declaration order of these hp* classes is significant. */ .statbar .hpbar .hp { height: 4px; border-top: 2px solid #00dd60; background: #00bb51; border-bottom: 2px solid #007734; border-right: 1px solid #007734; border-radius: 3px; } .statbar .hpbar .hp-yellow { border-top-color: #f8e379; background-color: #f5d538; border-bottom-color: #be9f0a; border-right-color: #be9f0a; } .statbar .hpbar .hp-red { border-top-color: #f37f67; background-color: #ee4928; border-bottom-color: #a3260d; border-right-color: #a3260d; } /* The declaration order of these prevhp* classes is significant. */ .statbar .hpbar .prevhp { background: #BBEECC; height: 8px; border-radius: 3px; } .statbar .hpbar .prevhp-yellow { background-color: #fcf4ca; } .statbar .hpbar .prevhp-red { background-color: #facec5; } /****************/ .statbar .hpbar .hptext { position: absolute; background: #777777; color: #EEEEEE; text-shadow: #000000 0 1px 0; text-stroke: 1px #000000; font-size: 9px; width: 32px; height: 12px; top: -1px; text-align: center; } .statbar .hpbar .hptextborder { position: absolute; background: transparent; border-top: 1px solid #777777; border-bottom: 1px solid #777777; width: 4px; top: -1px; height: 10px; } .rstatbar .hpbar .hptext { right: -32px; border-radius: 0 4px 4px 0; } .lstatbar .hpbar .hptext { left: -32px; border-radius: 4px 0 0 4px; } .rstatbar .hpbar .hptextborder { right: -3px; } .lstatbar .hpbar .hptextborder { left: -3px; } .statbar .status { min-height: 10px; font-size: 7pt; } .statbar .status img { vertical-align: top; top: -2px; position: relative; } .statbar span { padding: 0px 1px; border: 1px solid #FF4400; border-radius: 3px; } .statbar span.brn, .statbar span.psn, .statbar span.slp, .statbar span.par, .statbar span.frz { padding: 1px 2px; border: 0; border-radius: 3px; } .statbar span.brn { background: #EE5533; color: #FFFFFF; } .statbar span.psn { background: #A4009A; color: #FFFFFF; } .statbar span.par { background: #9AA400; color: #FFFFFF; } .statbar span.slp { background: #AA77AA; color: #FFFFFF; } .statbar span.frz { background: #009AA4; color: #FFFFFF; } .statbar span.bad { background: #FFE5E0; color: #FF4400; border-color: #FF4400; } .statbar span.good { background: #E5FFE0; color: #33AA00; border-color: #33AA00; } .statbar span.neutral { background: #F0F0F0; color: #555555; border-color: #555555; } .leftbar { position: absolute; top: 0; left: 0; height: 450px; width: 100px; background-color: #CCCCCC; background-color: rgba(255,255,255,0.5); border-right: 1px solid rgba(215,215,215,0.5); color: #777777; } .rightbar { position: absolute; top: 0; right: 0; height: 450px; width: 100px; background-color: #CCCCCC; background-color: rgba(255,255,255,0.5); border-left: 1px solid rgba(215,215,215,0.5); color: #777777; } .trainer { text-align: center; position: absolute; left: 0; right: 0; bottom: 75px; } .trainer-near { bottom: 75px; } .trainer-far { bottom: 232px; } .trainer-near2 { bottom: 232px; } .trainer-far2 { bottom: 75px; } .trainer strong { display: block; font-size: 8pt; margin-bottom: 2px; word-wrap: break-word; } .trainer div { width: 86px; height: 90px; opacity: .8; margin: 0 auto; background: transparent none no-repeat scroll center top; } .trainer div.teamicons { width: 100px; height: 30px; margin: 0 0 0 2px; } .teamicons span { float: left; } .leftbar .trainer div.trainersprite, .leftbar .teamicons span { -moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -o-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1); } .trainersprite { max-width: 80px; max-height: 80px; } .turn { position: absolute; display: block; top: 10px; left: 110px; font-size: 13pt; font-weight: bold; margin: 0; padding: 2px 8px; border: 2px solid #332200; border-radius: 6px; color: #332200; background: #FCFAF2; } .messagebar { position: absolute; display: none; bottom: 10px; left: 110px; right: 110px; color: #CCCCCC; background: #222222; background: rgba(0,0,0,0.75); border-radius: 6px; padding: 4px 6px 0 6px; overflow: hidden; } .messagebar strong { color: #ffffff; font-size: 12pt; } .messagebar small { font-size: 8pt; } .messagebar p { display: none; margin: 0; padding: 0; } .weather { position: absolute; display: block; top: 0; left: 0; right: 0; bottom: 0; text-shadow: #FFFFFF 1px 1px 0, #FFFFFF 1px -1px 0, #FFFFFF -1px 1px 0, #FFFFFF -1px -1px 0; color: black; } .weather em { display: block; margin: 24px 0 0 115px; font-size: 12pt; } .weather em small { font-style: normal; } .sunweather, .sunnydayweather, .desolatelandweather { background: #FFEEBB url(../fx/weather-sunnyday.jpg) no-repeat scroll left top; color: #664411; } .rainweather, .raindanceweather, .primordialseaweather { background: #99BBFF url(../fx/weather-raindance.jpg) no-repeat scroll left top; color: #0044BB; } .sandstormweather { background: #E6E0AC url(../fx/weather-sandstorm.png) no-repeat scroll left top; color: #554433; } .snowweather, .hailweather { background: #AADDEE url(../fx/weather-hail.png) no-repeat scroll left top; color: #114455; } .deltastreamweather { background: #AAAAAA url(../fx/weather-strongwind.png) no-repeat scroll left top; color: #666666; } .mistyterrainweather { background: #EEAACC url(../fx/weather-mistyterrain.png) no-repeat scroll left top; color: #551144; } .electricterrainweather { background: #EEEEAA url(../fx/weather-electricterrain.png) no-repeat scroll left top; color: #444411; } .grassyterrainweather { background: #CCEEAA url(../fx/weather-grassyterrain.png) no-repeat scroll left top; color: #335511; } .psychicterrainweather { background: #CCAAEE url(../fx/weather-psychicterrain.png) no-repeat scroll left top; color: #441155; } .gravityweather { background: #DDAAEE url(../fx/weather-gravity.png) no-repeat scroll left top; color: #661155; } .magicroomweather { background: #DDAAEE url(../fx/weather-magicroom.png) no-repeat scroll left top; color: #661155; } .trickroomweather { background: #DDAAEE url(../fx/weather-trickroom.png) no-repeat scroll left top; color: #661155; } .wonderroomweather { background: #DDAAEE url(../fx/weather-wonderroom.png) no-repeat scroll left top; color: #661155; } .battle .result { display: none; position: absolute; width: 150px; text-align: center; } .battle .result strong { font-weight: bold; padding: 1px 3px; border-radius: 3px; } .battle .badresult strong { color: #FFFFFF; background: #CC0000; } .battle .goodresult strong { color: #FFFFFF; background: #00CC00; } .battle .neutralresult strong { color: #FFFFFF; background: #999999; } .battle .brnresult strong { color: #FFFFFF; background: #EE5533; } .battle .psnresult strong { color: #FFFFFF; background: #A4009A; } .battle .slpresult strong { color: #FFFFFF; background: #AA77AA; } .battle .parresult strong { color: #FFFFFF; background: #9AA400; } .battle .frzresult strong { color: #FFFFFF; background: #009AA4; } .battle .abilityresult strong { color: #FFFFFF; background: #0088AA; border-radius: 0; padding: 2px 6px; } .sidecondition-auroraveil { background: #88EEFF; border: 1px solid #55BBCC; display: none; position: absolute; } .sidecondition-reflect { background: #EEEEEE; border: 1px solid #888888; display: none; position: absolute; } .sidecondition-lightscreen { background: #CCCC00; border: 1px solid #AAAA00; display: none; position: absolute; } .sidecondition-safeguard { background: #DD88DD; border: 1px solid #AA66AA; display: none; position: absolute; } .sidecondition-mist { background: #AACCFF; border: 1px solid #5577CC; display: none; position: absolute; } .turnstatus-protect { background: #DD88DD; border: 1px solid #AA66AA; display: none; position: absolute; } .seeking { display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: #CCCCCC; color: #000000; font-size: 14px; } .seeking strong { display: block; text-align: center; padding-top: 180px; } #sm2-container { position: relative; } .swf_timedout#sm2-container embed, .swf_timedout#sm2-container object, .swf_timedout#sm2-container audio, .movieContainer#sm2-container embed, .movieContainer#sm2-container object, .movieContainer#sm2-container audio { position: absolute; height: 27px; width: 66px; top: -1px; left: -1px; } .swf_timedout#sm2-container .inner, .movieContainer#sm2-container .inner { visibility: hidden; } #sm2-container embed, #sm2-container object, #sm2-container audio, .swf_loaded#sm2-container embed, .swf_loaded#sm2-container object, .swf_loaded#sm2-container audio { position: absolute; height: 27px; width: 27px; top: -1px; left: -87px; } #sm2-container .inner, .swf_loaded#sm2-container .inner { visibility: visible; } .chooser { float: right; border: 1px solid #AAAAAA; background: #EEF2F5; padding: 0 0 0 0; height: 25px; font-size: 9pt; margin: 0 5px 0 0; } .leftchooser { float: left; } .chooser em { float: left; padding: 5px 6px 0 6px; height: 20px; border-right: 1px solid #CCCCCC; background: #EEEEEE; font-weight: normal; } .chooser div { float: left; padding: 3px 2px 0 2px; } .chooser button { border: 0; background: transparent; padding: 2px 4px; font-size: 9pt; font-family: Verdana, sans-serif; border-radius: 3px; cursor: pointer; } .chooser button:hover { border: 1px solid #BBBBBB; padding: 1px 3px; background: #EEEEEE; } .chooser button.sel, .chooser button.sel:hover { border: 1px solid #999999; padding: 1px 3px; background: #DDDDDD; } /* .dark .battle { background: #222222; color: #CCCCCC; } .dark .statbar strong { color: #AAAAAA; } .dark .statbar .hpbar { background: #222222; } .dark .statbar .hpbar .prevhp { background: #446755; } .dark .leftbar, .dark .rightbar { background: rgba(0,0,0,0.5); color: #CCCCCC; } .dark .messagebar { background: #444444; background: rgba(60,60,60,0.80); color: #CCCCCC; } */ .dark .battle-log { background: #333333; color: #CCCCCC; } .dark .chooser { background: #666666; color: #CCCCCC; } .dark .chooser em { background: #777777; color: #CCCCCC; } .dark .chooser button { color: #CCCCCC; } .dark .chooser button:hover { border: 1px solid #BBBBBB; padding: 1px 3px; background: #777777; color: #EEEEEE; } .dark .chooser button.sel, .dark .chooser button.sel:hover { border: 1px solid #CCCCCC; padding: 1px 3px; background: #999999; color: #F3F3F3; } .itemicon { display: inline-block; width: 24px; height: 24px; } .picon { display: inline-block; width: 40px; height: 30px; } .trainer .picon { margin: 0 -4px; } .pixelated, .itemicon, .picon, .trainersprite { image-rendering: -moz-crisp-edges; image-rendering: pixelated; -ms-interpolation-mode: nearest-neighbor; } @media (-webkit-min-device-pixel-ratio: 1.05), (min-resolution: 1.05dppx) { .pixelated, .itemicon, .picon, .trainersprite { image-rendering: auto; } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { .pixelated, .itemicon, .picon, .trainersprite { image-rendering: pixelated; } } /********************************************************* * Tooltips *********************************************************/ #tooltipwrapper { position: absolute; top: 400px; left: 100px; text-align: left; color: black; pointer-events: none; } #tooltipwrapper .tooltipinner { position: relative; } #tooltipwrapper .tooltip { position: absolute; bottom: 0; left: 0; width: 300px; border: 1px solid #888888; background: #EEEEEE; background: rgba(240,240,240,.9); border-radius: 5px; z-index: 50; } #tooltipwrapper .tooltip h2 { padding: 2px 4px; margin: 0; border-bottom: 1px solid #888888; font-size: 10pt; color: black; } #tooltipwrapper .tooltip h2 small { font-weight: normal; } #tooltipwrapper .tooltip p { padding: 2px 4px; margin: 0; font-size: 9pt; } #tooltipwrapper .tooltip p small { font-size: 8pt; } #tooltipwrapper .tooltip p.tooltip-section { border-top: 1px solid #888888; } #tooltipwrapper .tooltip .textaligned-typeicons img { vertical-align: text-bottom; } #tooltipwrapper.tooltip-locked { pointer-events: auto; } #tooltipwrapper.tooltip-locked .tooltip { border: 2px solid #444444; background: #DEDEDE; }