diff options
Diffstat (limited to 'play.css')
-rw-r--r-- | play.css | 1013 |
1 files changed, 352 insertions, 661 deletions
@@ -1,46 +1,14 @@ -main { background-color: dimgray; } -header { background-color: silver; } -header.your_turn { background-color: orange; } -#role_Democrat { background-color: hsl(200, 80%, 80%); } -#role_Communist { background-color: hsl(0, 80%, 80%); } -#turn_info { background-color: white; } -/*.aside_events { - font-family: "Source Sans"; - font-style: normal; - font-size: 16px; - line-height: 1.5; -}*/ -#deck_data { - font-family: "Source Sans"; - font-style: normal; - font-size: 16px; - line-height: 1.5; -} -#deck_stat {padding-left: 5px; padding-bottom: 5px;} - +main { background-color: slategray; } -#log { background-color: whitesmoke; } -#log .h1 { font-weight: bold; padding-top:2px; padding-bottom:2px; text-align: center; } -#log .h2 { padding-top:2px; padding-bottom:2px; text-align: center; } -#log .h3 { text-align: center; } -#log .h4 { text-decoration: underline; } -#log .h5 { text-decoration: underline; } +body.Democrat header.your_turn { background-color: hsl(206, 85%, 75%); } +body.Communist header.your_turn { background-color: hsl(355, 70%, 75%); } -#log .h2 { background-color: hsl(0,0%,80%);} -#log .h1 { background-color: hsl(0,0%,80%); } -#log .h2.dem { background-color: hsl(200, 80%, 80%); } -#log .h2.com { background-color: hsl(0, 80%, 80%); } -#log .h3.democrat { background-color: hsl(210,30%,90%); } -#log .h3.h2.communist { background-color: hsl(35,40%,90%); } +#role_Democrat { background-color: hsl(206, 80%, 80%); } +#role_Communist { background-color: hsl(355, 70%, 80%); } -#log div { padding-left: 20px; text-indent: -12px; } -#log div.i { padding-left: 32px; text-indent: -12px; } -#log div.ii { padding-left: 44px; text-indent: -12px; } +/* LOG */ - -#log .card_name { font-style: italic; } -#log .card_name:hover { text-decoration: underline; } -#log .space_tip:hover { cursor: pointer; text-decoration: underline; } +#log { font-variant-numeric: tabular-nums; } #log .die { display: inline-block; @@ -62,555 +30,214 @@ header.your_turn { background-color: orange; } #log .d5 { background-position: 80% 0; } #log .d6 { background-position: 100% 0; } -.selected { - cursor: pointer; -} +#log .h1 { font-weight: bold; padding-top:2px; padding-bottom:2px; text-align: center; } +#log .h2 { padding-top:2px; padding-bottom:2px; text-align: center; } +#log .h3 { text-align: center; } +#log .h4 { text-decoration: underline; } +#log .h5 { text-decoration: underline; } -#log { - font-variant-numeric: tabular-nums; -} +#log { background-color: floralwhite } +#log .h1 { background-color: tan } +#log .h2 { background-color: wheat } +#log .h2.dem { background-color: hsl(206, 85%, 80%); } +#log .h2.com { background-color: hsl(355, 70%, 80%); } -/* TOOLBAR */ +#log div { padding-left: 20px; text-indent: -12px; } +#log div.i { padding-left: 32px; text-indent: -12px; } +#log div.ii { padding-left: 44px; text-indent: -12px; } -#toolbar { - justify-content: space-evenly; -} +#log .card_name { font-style: italic; } +#log .card_name:hover { text-decoration: underline; } +#log .space_tip:hover { cursor: pointer; text-decoration: underline; } -#prompt { - display: flex; - margin-left: auto; -} +/* MAP */ -#button { - display: flex; - margin-left: auto; +#mapwrap { + width: 1650px; + height: 2550px; } -/* MAP */ #map { - margin: 0 auto ; - position: relative; - background-repeat: no-repeat; - background-size: cover; - width: 1275px; /* was 1275*/ - height: 2000px; - /*border: solid black;*/ - overflow: clip; + width: 1650px; + height: 2550px; + background-size: 1650px 2550px; box-shadow: 0px 1px 10px #0008; - /*z-index: 3;*/ -} - -#map { background-image: url(1989_map.jpg) } - -/* Containers to appear on hover*/ - #overlay { - position: relative; - top: 0; - left: 0; - width: 100%; - height: 100%; - /* background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent overlay */ - /* display: none;*/ - justify-content: center; - align-items: center; - text-align: left; - } - -/* SPACES */ - -.space-area { - position: absolute; - box-sizing: border-box; - border: transparent red 2px; -} - -/* PANELS AND HANDS */ - -.panel { - background-color: #555; - display: inline-block; -} - -.panel_header { - background-color: #444; - color: hsl(40, 60%, 90%); - font-weight: bold; - text-align: center; - padding: 3px 1em; -} - -.hide { - display: none; -} - -#hand_panel, #events_panel, #played_card_panel, #table_panel, #samizdat_panel, #opp_hand_panel, #power_panel, #ceausescu_panel { - min-width: 200px; - width: auto; - /*display: inline-block;*/ - margin: 10px; - border-radius: 5px; -} - -#events { - display: flex; -} - -#discard_panel, #removed_panel { - min-width: 200px; - width: auto; - display: inline-block; - margin: 10px; - border-radius: 5px; -} - -#discard_panel.hide, #removed_panel.hide { - display: none; -} - -#hand_panel { - margin: 10px; - border-radius: 5px; -} - -/* INFLUENCE MARKERS */ - -.demInfl { - position: absolute; - box-sizing: border-box; - bottom: 1px; - left: 6px; - height: 35px; - width: 35px; - border-radius: 5px; -} - -.demInfl.controlled { - background-image: url(images/US_blank.gif); - background-size: contain; -} - - -.demInfl.uncontrolled { - background-image: url(images/USd_blank.gif); - background-size: contain; -} -/* -.demInfl:hover { - cursor: pointer; -}*/ - -.comInfl { - position: absolute; - box-sizing: border-box; - bottom: 1px; - right: 6px; - height: 35px; - width: 35px; -} -/* -.comInfl:hover { - cursor: pointer; -}*/ - -.comInfl.controlled { - background-image: url(images/SV_blank.gif); - background-size: contain; -} - - -.comInfl.uncontrolled { - background-image: url(images/SVd_blank.gif); - background-size: contain; -} - -.demInflValue { - position: absolute; - box-sizing: border-box; - font-family: 'Open Sans'; - font-size: 20px; - font-weight: bold; - top: 10px; - left: 16px; } -.demInflValue_10 { - position: absolute; - box-sizing: border-box; - font-family: 'Open Sans'; - font-size: 20px; - font-weight: bold; - top: 10px; - left: 10px; +#map { background-image: url("map75.jpg") } +@media (min-resolution: 97dpi) { + #map { background-image: url("map150.jpg") } } -.comInflValue { - position: absolute; - box-sizing: border-box; - font-family: 'Open Sans'; - font-size: 20px; - font-weight: bold; - top: 12px; - left: 74px; -} +/* SPACES */ -.comInflValue_10 { +.space { position: absolute; box-sizing: border-box; - font-family: 'Open Sans'; - font-size: 20px; - font-weight: bold; - top: 12px; - left: 68px; + border: 4px solid transparent; } -.comInflValue.controlled, .held { - color: whitesmoke; - text-shadow: - 1px 1px 0 #c2272d, /* Right bottom */ - -1px 1px 0 #c2272d, /* Left bottom */ - 1px -1px 0 #c2272d, /* Right top */ - -1px -1px 0 #c2272d; /* Left top */ +.space.action { + border-color: white; + box-shadow: 0 0 0 1px black, inset 0 0 0 1px black; } -.comInflValue.uncontrolled { - color: #c2272d; - text-shadow: - 1px 1px 0 #ffffff, /* Right bottom */ - -1px 1px 0 #ffffff, /* Left bottom */ - 1px -1px 0 #ffffff, /* Right top */ - -1px -1px 0 #ffffff; /* Left top */ -} +.space.East_Germany.action { border-color: white; } +.space.Poland.action { border-color: yellow; } +.space.Czechoslovakia.action { border-color: lightgreen; } +.space.Hungary.action { border-color: gold; } +.space.Romania.action { border-color: peachpuff; } +.space.Bulgaria.action { border-color: palegreen; } -.comInflValue_10.controlled, .held { - color: whitesmoke; - text-shadow: - 1px 1px 0 #c2272d, /* Right bottom */ - -1px 1px 0 #c2272d, /* Left bottom */ - 1px -1px 0 #c2272d, /* Right top */ - -1px -1px 0 #c2272d; /* Left top */ +.space.tip { + border-color: lime; + box-shadow: 0 0 0 1px black, inset 0 0 0 1px black; } -.comInflValue_10.uncontrolled { - color: #c2272d; - text-shadow: - 1px 1px 0 #ffffff, /* Right bottom */ - -1px 1px 0 #ffffff, /* Left bottom */ - 1px -1px 0 #ffffff, /* Right top */ - -1px -1px 0 #ffffff; /* Left top */ -} - - -/* GAME MARKERS */ - -.t0 {left: 511px} -.t1 {left: 511px} -.t2 {left: 553px} -.t3 {left: 595px} -.t4 {left: 637px} -.t5 {left: 679px} -.t6 {left: 721px} -.t7 {left: 763px} -.t8 {left: 805px} -.t9 {left: 847px} -.t10 {left: 889px} - -#turn-tracker { - position:absolute; - top: 65px; - height: 35px; - width: 36px; - /*display: block;*/ -} - -.r0 {left: 554px} -.r1 {left: 554px} -.r2 {left: 596px} -.r3 {left: 638px} -.r4 {left: 680px} -.r5 {left: 722px} -.r6 {left: 764px} -.r7 {left: 806px} -.r8 {left: 848px} +/* MARKERS */ -.dem-action-round-tracker { background-image: url(images/US_Action_Round.gif);} -.com-action-round-tracker { background-image: url(images/SV_Action_Round.gif);} +/* node tools/gencolors.js */ +.marker { background-color: #ffffff; border-color: #eeeeee #8a8a8a #8a8a8a #eeeeee; box-shadow: 0 0 0 1px #323232, 1px 2px 4px #0008; } +.demInfl.ctl { background-color: #c4e2f6; border-color: #e6ffff #8ca8bb #8ca8bb #e6ffff; box-shadow: 0 0 0 1px #274050, 1px 2px 4px #0008; } +.comInfl.ctl { background-color: #c1272d; border-color: #e74e4c #9c0009 #9c0009 #e74e4c; box-shadow: 0 0 0 1px #520000, 1px 2px 4px #0008; } +#marker_action_round.dem { background-color: #147fc0; border-color: #44a3e6 #005c9b #005c9b #44a3e6; box-shadow: 0 0 0 1px #001a54, 1px 2px 4px #0008; } +#marker_action_round.com { background-color: #c1272d; border-color: #e74e4c #9c0009 #9c0009 #e74e4c; box-shadow: 0 0 0 1px #520000, 1px 2px 4px #0008; } +#marker_vp, #marker_turn { background-color: #fadb04; border-color: #ffff51 #c0a100 #c0a100 #ffff51; box-shadow: 0 0 0 1px #563600, 1px 2px 4px #0008; } +#marker_com_tst { background-color: #f26649; border-color: #ff9273 #c2391c #c2391c #ff9273; box-shadow: 0 0 0 1px #640000, 1px 2px 4px #0008; } +#marker_dem_tst { background-color: #c4e2f4; border-color: #e6ffff #8ca8ba #8ca8ba #e6ffff; box-shadow: 0 0 0 1px #27404f, 1px 2px 4px #0008; } -#action-round-tracker { +#event_reminder_list { position: absolute; - top: 114px; - height: 30px; - width: 35px; - background-size: cover; -} - - - -#stability-track { - position:absolute; - left: 1085px; - height: 35px; - width: 35px; -} - -.s0 {top: 853px} -.s1 {top: 896px} -.s2 {top: 939px} -.s3 {top: 982px} -.s4 {top: 1025px} - - -.tst0 {left: 0} -.tst1 {left: 38px} -.tst2 {left: 93px} -.tst3 {left: 148px} -.tst4 {left: 203px} -.tst5 {left: 258px} -.tst6 {left: 313px} -.tst7 {left: 368px} -.tst8 {left: 436px} - -#dem-TST { - position: absolute; - top: 1680px; - height: 35px; - width: 35px; -} - -#com-TST { - position: absolute; - top: 1782px; - height: 35px; - width: 35px; -} - -.vp0 {top: 1913px; -left: 660px} - -.vp-20, .vp-18, .vp-16, .vp-14, .vp-12, .vp-10, .vp-8, .vp-6, .vp-4, .vp-2, .vp1, .vp3, .vp5, .vp7, .vp9, .vp11, .vp13, .vp15, .vp17, .vp19 {top: 1889px} -.vp-19, .vp-17, .vp-15, .vp-13, .vp-11, .vp-9, .vp-7, .vp-5, .vp-3, .vp-1, .vp2, .vp4, .vp6, .vp8, .vp10, .vp12, .vp14, .vp16, .vp18, .vp20 {top: 1938px} - -.vp-21 {top: 1912px; left: 117px} -.vp21 {top: 1912px; left: 1182px} - -.vp-20 {left: 165px} -.vp-19 {left: 189px} -.vp-18 {left: 214px} -.vp-17 {left: 238px} -.vp-16 {left: 263px} -.vp-15 {left: 287px} -.vp-14 {left: 312px} -.vp-13 {left: 336px} -.vp-12 {left: 361px} -.vp-11 {left: 385px} -.vp-10 {left: 410px} -.vp-9 {left: 434px} -.vp-8 {left: 459px} -.vp-7 {left: 483px} -.vp-6 {left: 508px} -.vp-5 {left: 532px} -.vp-4 {left: 557px} -.vp-3 {left: 581px} -.vp-2 {left: 606px} -.vp-1 {left: 630px} -.vp1 {left: 692px} -.vp2 {left: 717px} -.vp3 {left: 741px} -.vp4 {left: 766px} -.vp5 {left: 790px} -.vp6 {left: 815px} -.vp7 {left: 839px} -.vp8 {left: 864px} -.vp9 {left: 888px} -.vp10 {left: 913px} -.vp11 {left: 937px} -.vp12 {left: 962px} -.vp13 {left: 986px} -.vp14 {left: 1011px} -.vp15 {left: 1035px} -.vp16 {left: 1060px} -.vp17 {left: 1084px} -.vp18 {left: 1109px} -.vp19 {left: 1133px} -.vp20 {left: 1158px} - -#vp { - position: absolute; - height: 40px; - width: 40px; + display: flex; + flex-wrap: wrap; + gap: 5px; + top: 1650px; + left: 600px; + width: 200px; } .marker { position: absolute; - height: 30px; - width: 30px; -} - -.revolution {background-image: url(images/US_blank.gif); background-size: contain} -.held {background-image: url(images/SV_blank.gif); background-size: contain} - -.germany {top: 127px; left: 439px} -.poland { top: 232px; left: 934px} -.czech {top: 494px; left: 362px} -.hungary {top: 1041px; left: 813px} -.romania {top: 1063px; left: 1012px} -.bulgaria {top: 1578px; left: 720px} - -.times_held { - position: absolute; - font-family: 'Open Sans'; - font-size: 20px; - font-weight: bold; - top: -18px; - left: 8px -} - -.outlined_text { - text-shadow: - 1px 1px 0 #ffffff, /* Right bottom */ - -1px 1px 0 #ffffff, /* Left bottom */ - 1px -1px 0 #ffffff, /* Right top */ - -1px -1px 0 #ffffff; /* Left top */ -} - -/* ============= EVENT MARKERS ========== */ - -.event-marker { - display: none; - position: absolute; - height: 30px; - width: 30px; - transition: transform 0.3s ease; -} - -.event-marker:hover { - cursor: pointer; - transform: scale(2); - z-index: 1; -} - -.event-marker.aside { - border: solid black 1.5px; - margin: 3px; - position: relative; -} - -#turn_info { - display: flex; - flex-direction: column; - align-items: flex-start; -} - -#turn_info > div { - display: flex; - margin-bottom: 8px; - gap: 4px; -} - -#turn_info > img { - display: block; - -} - -/*Solidarity legalised*/ -#event_2 { - top: 216px; - left: 612px; -} - -/*Systematisation*/ -#event_69 { - height: 65px; - width: 65px; -} + pointer-events: none; + width: 45px; + height: 45px; + border: 2px solid; + border-color: #eee #bbb #bbb #eee; + box-shadow: 0 0 0 1px #444; + transition-property: top, left; + transition-duration: 700ms; + transition-timing-function: ease; +} + +.demInfl { background-color: #fff; } +.comInfl { background-color: #fff; } +.demInfl.ctl { background-color: #147fc0; } +.comInfl.ctl { background-color: #c1272d; } + +.demInfl.v1 { background-image: url(markers75/di1.png) } +.demInfl.v2 { background-image: url(markers75/di2.png) } +.demInfl.v3 { background-image: url(markers75/di3.png) } +.demInfl.v4 { background-image: url(markers75/di4.png) } +.demInfl.v5 { background-image: url(markers75/di5.png) } +.demInfl.v6 { background-image: url(markers75/di6.png) } +.demInfl.v7 { background-image: url(markers75/di7.png) } +.demInfl.v8 { background-image: url(markers75/di8.png) } +.demInfl.ctl.v1 { background-image: url(markers75/dc1.png) } +.demInfl.ctl.v2 { background-image: url(markers75/dc2.png) } +.demInfl.ctl.v3 { background-image: url(markers75/dc3.png) } +.demInfl.ctl.v4 { background-image: url(markers75/dc4.png) } +.demInfl.ctl.v5 { background-image: url(markers75/dc5.png) } +.demInfl.ctl.v6 { background-image: url(markers75/dc6.png) } +.demInfl.ctl.v7 { background-image: url(markers75/dc7.png) } +.demInfl.ctl.v8 { background-image: url(markers75/dc8.png) } + +.comInfl.v1 { background-image: url(markers75/ci1.png) } +.comInfl.v2 { background-image: url(markers75/ci2.png) } +.comInfl.v3 { background-image: url(markers75/ci3.png) } +.comInfl.v4 { background-image: url(markers75/ci4.png) } +.comInfl.v5 { background-image: url(markers75/ci5.png) } +.comInfl.v6 { background-image: url(markers75/ci6.png) } +.comInfl.v7 { background-image: url(markers75/ci7.png) } +.comInfl.v8 { background-image: url(markers75/ci8.png) } +.comInfl.ctl.v1 { background-image: url(markers75/cc1.png) } +.comInfl.ctl.v2 { background-image: url(markers75/cc2.png) } +.comInfl.ctl.v3 { background-image: url(markers75/cc3.png) } +.comInfl.ctl.v4 { background-image: url(markers75/cc4.png) } +.comInfl.ctl.v5 { background-image: url(markers75/cc5.png) } +.comInfl.ctl.v6 { background-image: url(markers75/cc6.png) } +.comInfl.ctl.v7 { background-image: url(markers75/cc7.png) } +.comInfl.ctl.v8 { background-image: url(markers75/cc8.png) } + +#marker_turn { background-image: url(markers75/turn.png) } +#marker_action_round.dem { background-image: url(markers75/action_round_blue.png) } +#marker_action_round.com { background-image: url(markers75/action_round_red.png) } +#marker_stability_track { background-image: url(markers75/ussr_stability_track.png) } +#marker_dem_tst { background-image: url(markers75/ts_blue.png) } +#marker_com_tst { background-image: url(markers75/ts_red.png) } +#marker_vp { background-image: url(markers75/vp.png) } + +/* EVENT MARKERS */ + +.marker.aside { + position: static; +} + +#event_2 { background-image: url(markers75/event_solidarity_legalized.png) } +#event_9 { background-image: url(markers75/event_the_wall.png) } +#event_15 { background-image: url(markers75/event_honecker.png) } +#event_24 { background-image: url(markers75/event_st_nicholas.png) } +#event_26 { background-image: url(markers75/event_helsinki.png) } +#event_39 { background-image: url(markers75/event_eco_glasnost.png) } +#event_48 { background-image: url(markers75/event_we_are_the_people.png) } +#event_49 { background-image: url(markers75/event_foreign_currency.png) } +#event_53 { background-image: url(markers75/event_li_peng.png) } +#event_58 { background-image: url(markers75/event_austria_hungary.png) } +#event_59 { background-image: url(markers75/event_grenz_truppen.png) } +#event_65 { background-image: url(markers75/event_pres_visit.png) } +#event_69 { background-image: url(markers75/event_systematization.png) } +#event_70 { background-image: url(markers75/event_securitate.png) } +#event_73 { background-image: url(markers75/event_laszlo_tokes.png) } +#event_97 { background-image: url(markers75/event_tyrant.png) } +#event_100 { background-image: url(markers75/event_stand_fast.png) } +#event_101 { background-image: url(markers75/event_elena.png) } +#event_104 { background-image: url(markers75/event_nye_party.png) } + +/* Solidarity legalized */ +#event_2 { top: 265px; left: 778px; } + +/* The Wall */ +#event_9 { top: 175px; left: 216px; } + +/* CARD PANELS */ -/*The Tyrant is Gone*/ -#event_97 { - height: 40px; - width: 40px; +.panel { + background-color: #607080; + max-width: 1650px; + margin: 24px auto; } -/*The Wall*/ -#event_9 { - top: 143px; - left: 170px; +.panel_header { + background-color: #506070; + color: white; + font-weight: bold; + padding: 3px; + text-align: center; } - -/* =========== CARDS ================= */ -/* -.playedCard { +.panel_body { + margin-top: 3px; display: flex; - margin: auto; - height: 300px; -}*/ - -.hand_card { - background-size: contain; - height: 250px; - margin: 10px; - border-radius: 5px; - transition: transform .3s ease 0.5s; -} -/* -.hand_card:hover { - cursor: pointer; -}*/ - -.zoom { - transform: scale(1.75) -} - -.power_card { - background-size: contain; - height: 250px; - margin: 10px; - border-radius: 5px; -} - -.discard_card, .event_card { - background-size: contain; - height: 150px; - margin: 5px; - border-radius: 5px; - transition: transform .3s ease; -} - -.discard_card:hover, .event_card:hover { - /*cursor: pointer;*/ - transform: scale(2); + flex-wrap: wrap; + padding: 16px; + gap: 16px; + min-height: 350px; } -.selected.space-area { - background-color: #0002; - outline: solid white 2px; - /*box-shadow: 0 0 4px white; */ - border-radius: 10px 10px 0 0; -} - -.space-area.tip { - background-color: #ff08; - outline: solid white 2px; - box-shadow: 0 0 8px #ff08; - border-radius: 10px 10px 0 0; -} - -.selected.hand_card { - outline: solid silver 3px; - /*box-shadow: 0 0 4px white; */ - border-radius: 18px; -} - - -.selected.power_card { - outline: solid silver 3px; - /*box-shadow: 0 0 4px white; */ - border-radius: 18px; +.panel:has(.panel_body:empty) { + display: none; } -/* =============== OTHER ===============*/ -#space-characteristics {display: none} - -/* =============== CARD IMAGES =========*/ +/* CARD IMAGES */ #tooltip { position: fixed; @@ -623,119 +250,183 @@ left: 660px} .card { background-size: cover; background-repeat: no-repeat; + background-color: #fffde9; width: 250px; height: 350px; border-radius: 16px; - box-shadow: 1px 2px 4px #0004; -} - -.card_1 {background-image: url(cards/e1.gif)} -.card_2 {background-image: url(cards/e2.gif)} -.card_3 {background-image: url(cards/e3.gif)} -.card_4 {background-image: url(cards/e4.gif)} -.card_5 {background-image: url(cards/e5.gif)} -.card_6 {background-image: url(cards/e6.gif)} -.card_7 {background-image: url(cards/e7.gif)} -.card_8 {background-image: url(cards/e8.gif)} -.card_9 {background-image: url(cards/e9.gif)} -.card_10 {background-image: url(cards/e10.gif)} -.card_11 {background-image: url(cards/e11.gif)} -.card_12 {background-image: url(cards/e12.gif)} -.card_13 {background-image: url(cards/e13.gif)} -.card_14 {background-image: url(cards/e14.gif)} -.card_15 {background-image: url(cards/e15.gif)} -.card_16 {background-image: url(cards/e16.gif)} -.card_17 {background-image: url(cards/e17.gif)} -.card_18 {background-image: url(cards/e18.gif)} -.card_19 {background-image: url(cards/e19.gif)} -.card_20 {background-image: url(cards/e20.gif)} -.card_21 {background-image: url(cards/e21.gif)} -.card_22 {background-image: url(cards/e22.gif)} -.card_23 {background-image: url(cards/e23.gif)} -.card_24 {background-image: url(cards/e24.gif)} -.card_25 {background-image: url(cards/e25.gif)} -.card_26 {background-image: url(cards/e26.gif)} -.card_27 {background-image: url(cards/e27.gif)} -.card_28 {background-image: url(cards/e28.gif)} -.card_29 {background-image: url(cards/e29.gif)} -.card_30 {background-image: url(cards/e30.gif)} -.card_31 {background-image: url(cards/e31.gif)} -.card_32 {background-image: url(cards/e32.gif)} -.card_33 {background-image: url(cards/e33.gif)} -.card_34 {background-image: url(cards/e34.gif)} -.card_35 {background-image: url(cards/e35.gif)} -.card_36 {background-image: url(cards/e36.gif)} -.card_37 {background-image: url(cards/e37.gif)} -.card_38 {background-image: url(cards/e38.gif)} -.card_39 {background-image: url(cards/e39.gif)} -.card_40 {background-image: url(cards/e40.gif)} -.card_41 {background-image: url(cards/e41.gif)} -.card_42 {background-image: url(cards/e42.gif)} -.card_43 {background-image: url(cards/e43.gif)} -.card_44 {background-image: url(cards/e44.gif)} -.card_45 {background-image: url(cards/e45.gif)} -.card_46 {background-image: url(cards/e46.gif)} -.card_47 {background-image: url(cards/e47.gif)} -.card_48 {background-image: url(cards/e48.gif)} -.card_49 {background-image: url(cards/e49.gif)} -.card_50 {background-image: url(cards/e50.gif)} -.card_51 {background-image: url(cards/e51.gif)} -.card_52 {background-image: url(cards/e52.gif)} -.card_53 {background-image: url(cards/e53.gif)} -.card_54 {background-image: url(cards/e54.gif)} -.card_55 {background-image: url(cards/e55.gif)} -.card_56 {background-image: url(cards/e56.gif)} -.card_57 {background-image: url(cards/e57.gif)} -.card_58 {background-image: url(cards/e58.gif)} -.card_59 {background-image: url(cards/e59.gif)} -.card_60 {background-image: url(cards/e60.gif)} -.card_61 {background-image: url(cards/e61.gif)} -.card_62 {background-image: url(cards/e62.gif)} -.card_63 {background-image: url(cards/e63.gif)} -.card_64 {background-image: url(cards/e64.gif)} -.card_65 {background-image: url(cards/e65.gif)} -.card_66 {background-image: url(cards/e66.gif)} -.card_67 {background-image: url(cards/e67.gif)} -.card_68 {background-image: url(cards/e68.gif)} -.card_69 {background-image: url(cards/e69.gif)} -.card_70 {background-image: url(cards/e70.gif)} -.card_71 {background-image: url(cards/e71.gif)} -.card_72 {background-image: url(cards/e72.gif)} -.card_73 {background-image: url(cards/e73.gif)} -.card_74 {background-image: url(cards/e74.gif)} -.card_75 {background-image: url(cards/e75.gif)} -.card_76 {background-image: url(cards/e76.gif)} -.card_77 {background-image: url(cards/e77.gif)} -.card_78 {background-image: url(cards/e78.gif)} -.card_79 {background-image: url(cards/e79.gif)} -.card_80 {background-image: url(cards/e80.gif)} -.card_81 {background-image: url(cards/e81.gif)} -.card_82 {background-image: url(cards/e82.gif)} -.card_83 {background-image: url(cards/e83.gif)} -.card_84 {background-image: url(cards/e84.gif)} -.card_85 {background-image: url(cards/e85.gif)} -.card_86 {background-image: url(cards/e86.gif)} -.card_87 {background-image: url(cards/e87.gif)} -.card_88 {background-image: url(cards/e88.gif)} -.card_89 {background-image: url(cards/e89.gif)} -.card_90 {background-image: url(cards/e90.gif)} -.card_91 {background-image: url(cards/e91.gif)} -.card_92 {background-image: url(cards/e92.gif)} -.card_93 {background-image: url(cards/e93.gif)} -.card_94 {background-image: url(cards/e94.gif)} -.card_95 {background-image: url(cards/e95.gif)} -.card_96 {background-image: url(cards/e96.gif)} -.card_97 {background-image: url(cards/e97.gif)} -.card_98 {background-image: url(cards/e98.gif)} -.card_99 {background-image: url(cards/e99.gif)} -.card_100 {background-image: url(cards/e100.gif)} -.card_101 {background-image: url(cards/e101.gif)} -.card_102 {background-image: url(cards/e102.gif)} -.card_103 {background-image: url(cards/e103.gif)} -.card_104 {background-image: url(cards/e104.gif)} -.card_105 {background-image: url(cards/e105.gif)} -.card_106 {background-image: url(cards/e106.gif)} -.card_107 {background-image: url(cards/e107.gif)} -.card_108 {background-image: url(cards/e108.gif)} -.card_109 {background-image: url(cards/e109.gif)} -.card_110 {background-image: url(cards/e110.gif)} + box-shadow: 0 0 0 1px #444, 1px 2px 4px #0004; +} + +.card.action { + box-shadow: 0 0 0 1px #444, 0 0 0 4px white; +} + +.card.selected { + box-shadow: 0 0 0 1px #444, 0 0 0 4px yellow; +} + +.card.event_0 { background-image: url(cards100/event_back.webp) } +.card.event_1 { background-image: url(cards100/event_1.webp) } +.card.event_2 { background-image: url(cards100/event_2.webp) } +.card.event_3 { background-image: url(cards100/event_3.webp) } +.card.event_4 { background-image: url(cards100/event_4.webp) } +.card.event_5 { background-image: url(cards100/event_5.webp) } +.card.event_6 { background-image: url(cards100/event_6.webp) } +.card.event_7 { background-image: url(cards100/event_7.webp) } +.card.event_8 { background-image: url(cards100/event_8.webp) } +.card.event_9 { background-image: url(cards100/event_9.webp) } +.card.event_10 { background-image: url(cards100/event_10.webp) } +.card.event_11 { background-image: url(cards100/event_11.webp) } +.card.event_12 { background-image: url(cards100/event_12.webp) } +.card.event_13 { background-image: url(cards100/event_13.webp) } +.card.event_14 { background-image: url(cards100/event_14.webp) } +.card.event_15 { background-image: url(cards100/event_15.webp) } +.card.event_16 { background-image: url(cards100/event_16.webp) } +.card.event_17 { background-image: url(cards100/event_17.webp) } +.card.event_18 { background-image: url(cards100/event_18.webp) } +.card.event_19 { background-image: url(cards100/event_19.webp) } +.card.event_20 { background-image: url(cards100/event_20.webp) } +.card.event_21 { background-image: url(cards100/event_21.webp) } +.card.event_22 { background-image: url(cards100/event_22.webp) } +.card.event_23 { background-image: url(cards100/event_23.webp) } +.card.event_24 { background-image: url(cards100/event_24.webp) } +.card.event_25 { background-image: url(cards100/event_25.webp) } +.card.event_26 { background-image: url(cards100/event_26.webp) } +.card.event_27 { background-image: url(cards100/event_27.webp) } +.card.event_28 { background-image: url(cards100/event_28.webp) } +.card.event_29 { background-image: url(cards100/event_29.webp) } +.card.event_30 { background-image: url(cards100/event_30.webp) } +.card.event_31 { background-image: url(cards100/event_31.webp) } +.card.event_32 { background-image: url(cards100/event_32.webp) } +.card.event_33 { background-image: url(cards100/event_33.webp) } +.card.event_34 { background-image: url(cards100/event_34.webp) } +.card.event_35 { background-image: url(cards100/event_35.webp) } +.card.event_36 { background-image: url(cards100/event_36.webp) } +.card.event_37 { background-image: url(cards100/event_37.webp) } +.card.event_38 { background-image: url(cards100/event_38.webp) } +.card.event_39 { background-image: url(cards100/event_39.webp) } +.card.event_40 { background-image: url(cards100/event_40.webp) } +.card.event_41 { background-image: url(cards100/event_41.webp) } +.card.event_42 { background-image: url(cards100/event_42.webp) } +.card.event_43 { background-image: url(cards100/event_43.webp) } +.card.event_44 { background-image: url(cards100/event_44.webp) } +.card.event_45 { background-image: url(cards100/event_45.webp) } +.card.event_46 { background-image: url(cards100/event_46.webp) } +.card.event_47 { background-image: url(cards100/event_47.webp) } +.card.event_48 { background-image: url(cards100/event_48.webp) } +.card.event_49 { background-image: url(cards100/event_49.webp) } +.card.event_50 { background-image: url(cards100/event_50.webp) } +.card.event_51 { background-image: url(cards100/event_51.webp) } +.card.event_52 { background-image: url(cards100/event_52.webp) } +.card.event_53 { background-image: url(cards100/event_53.webp) } +.card.event_54 { background-image: url(cards100/event_54.webp) } +.card.event_55 { background-image: url(cards100/event_55.webp) } +.card.event_56 { background-image: url(cards100/event_56.webp) } +.card.event_57 { background-image: url(cards100/event_57.webp) } +.card.event_58 { background-image: url(cards100/event_58.webp) } +.card.event_59 { background-image: url(cards100/event_59.webp) } +.card.event_60 { background-image: url(cards100/event_60.webp) } +.card.event_61 { background-image: url(cards100/event_61.webp) } +.card.event_62 { background-image: url(cards100/event_62.webp) } +.card.event_63 { background-image: url(cards100/event_63.webp) } +.card.event_64 { background-image: url(cards100/event_64.webp) } +.card.event_65 { background-image: url(cards100/event_65.webp) } +.card.event_66 { background-image: url(cards100/event_66.webp) } +.card.event_67 { background-image: url(cards100/event_67.webp) } +.card.event_68 { background-image: url(cards100/event_68.webp) } +.card.event_69 { background-image: url(cards100/event_69.webp) } +.card.event_70 { background-image: url(cards100/event_70.webp) } +.card.event_71 { background-image: url(cards100/event_71.webp) } +.card.event_72 { background-image: url(cards100/event_72.webp) } +.card.event_73 { background-image: url(cards100/event_73.webp) } +.card.event_74 { background-image: url(cards100/event_74.webp) } +.card.event_75 { background-image: url(cards100/event_75.webp) } +.card.event_76 { background-image: url(cards100/event_76.webp) } +.card.event_77 { background-image: url(cards100/event_77.webp) } +.card.event_78 { background-image: url(cards100/event_78.webp) } +.card.event_79 { background-image: url(cards100/event_79.webp) } +.card.event_80 { background-image: url(cards100/event_80.webp) } +.card.event_81 { background-image: url(cards100/event_81.webp) } +.card.event_82 { background-image: url(cards100/event_82.webp) } +.card.event_83 { background-image: url(cards100/event_83.webp) } +.card.event_84 { background-image: url(cards100/event_84.webp) } +.card.event_85 { background-image: url(cards100/event_85.webp) } +.card.event_86 { background-image: url(cards100/event_86.webp) } +.card.event_87 { background-image: url(cards100/event_87.webp) } +.card.event_88 { background-image: url(cards100/event_88.webp) } +.card.event_89 { background-image: url(cards100/event_89.webp) } +.card.event_90 { background-image: url(cards100/event_90.webp) } +.card.event_91 { background-image: url(cards100/event_91.webp) } +.card.event_92 { background-image: url(cards100/event_92.webp) } +.card.event_93 { background-image: url(cards100/event_93.webp) } +.card.event_94 { background-image: url(cards100/event_94.webp) } +.card.event_95 { background-image: url(cards100/event_95.webp) } +.card.event_96 { background-image: url(cards100/event_96.webp) } +.card.event_97 { background-image: url(cards100/event_97.webp) } +.card.event_98 { background-image: url(cards100/event_98.webp) } +.card.event_99 { background-image: url(cards100/event_99.webp) } +.card.event_100 { background-image: url(cards100/event_100.webp) } +.card.event_101 { background-image: url(cards100/event_101.webp) } +.card.event_102 { background-image: url(cards100/event_102.webp) } +.card.event_103 { background-image: url(cards100/event_103.webp) } +.card.event_104 { background-image: url(cards100/event_104.webp) } +.card.event_105 { background-image: url(cards100/event_105.webp) } +.card.event_106 { background-image: url(cards100/event_106.webp) } +.card.event_107 { background-image: url(cards100/event_107.webp) } +.card.event_108 { background-image: url(cards100/event_108.webp) } +.card.event_109 { background-image: url(cards100/event_109.webp) } +.card.event_110 { background-image: url(cards100/event_110.webp) } + +.card.power_0 { background-image: url(cards100/power_back.webp) } +.card.power_1 { background-image: url(cards100/power_1.webp) } +.card.power_2 { background-image: url(cards100/power_2.webp) } +.card.power_3 { background-image: url(cards100/power_3.webp) } +.card.power_4 { background-image: url(cards100/power_4.webp) } +.card.power_5 { background-image: url(cards100/power_5.webp) } +.card.power_6 { background-image: url(cards100/power_6.webp) } +.card.power_7 { background-image: url(cards100/power_7.webp) } +.card.power_8 { background-image: url(cards100/power_8.webp) } +.card.power_9 { background-image: url(cards100/power_9.webp) } +.card.power_10 { background-image: url(cards100/power_10.webp) } +.card.power_11 { background-image: url(cards100/power_11.webp) } +.card.power_12 { background-image: url(cards100/power_12.webp) } +.card.power_13 { background-image: url(cards100/power_13.webp) } +.card.power_14 { background-image: url(cards100/power_14.webp) } +.card.power_15 { background-image: url(cards100/power_15.webp) } +.card.power_16 { background-image: url(cards100/power_16.webp) } +.card.power_17 { background-image: url(cards100/power_17.webp) } +.card.power_18 { background-image: url(cards100/power_18.webp) } +.card.power_19 { background-image: url(cards100/power_19.webp) } +.card.power_20 { background-image: url(cards100/power_20.webp) } +.card.power_21 { background-image: url(cards100/power_21.webp) } +.card.power_22 { background-image: url(cards100/power_22.webp) } +.card.power_23 { background-image: url(cards100/power_23.webp) } +.card.power_24 { background-image: url(cards100/power_24.webp) } +.card.power_25 { background-image: url(cards100/power_25.webp) } +.card.power_26 { background-image: url(cards100/power_26.webp) } +.card.power_27 { background-image: url(cards100/power_27.webp) } +.card.power_28 { background-image: url(cards100/power_28.webp) } +.card.power_29 { background-image: url(cards100/power_29.webp) } +.card.power_30 { background-image: url(cards100/power_30.webp) } +.card.power_31 { background-image: url(cards100/power_31.webp) } +.card.power_32 { background-image: url(cards100/power_32.webp) } +.card.power_33 { background-image: url(cards100/power_33.webp) } +.card.power_34 { background-image: url(cards100/power_34.webp) } +.card.power_35 { background-image: url(cards100/power_35.webp) } +.card.power_36 { background-image: url(cards100/power_36.webp) } +.card.power_37 { background-image: url(cards100/power_37.webp) } +.card.power_38 { background-image: url(cards100/power_38.webp) } +.card.power_39 { background-image: url(cards100/power_39.webp) } +.card.power_40 { background-image: url(cards100/power_40.webp) } +.card.power_41 { background-image: url(cards100/power_41.webp) } +.card.power_42 { background-image: url(cards100/power_42.webp) } +.card.power_43 { background-image: url(cards100/power_43.webp) } +.card.power_44 { background-image: url(cards100/power_44.webp) } +.card.power_45 { background-image: url(cards100/power_45.webp) } +.card.power_46 { background-image: url(cards100/power_46.webp) } +.card.power_47 { background-image: url(cards100/power_47.webp) } +.card.power_48 { background-image: url(cards100/power_48.webp) } +.card.power_49 { background-image: url(cards100/power_49.webp) } +.card.power_50 { background-image: url(cards100/power_50.webp) } +.card.power_51 { background-image: url(cards100/power_51.webp) } +.card.power_52 { background-image: url(cards100/power_52.webp) } |