{"id":6508,"date":"2020-12-26T20:57:13","date_gmt":"2020-12-26T20:57:13","guid":{"rendered":"https:\/\/antonvlasenko.com\/solitar\/"},"modified":"2022-07-27T19:47:33","modified_gmt":"2022-07-27T19:47:33","slug":"solitar","status":"publish","type":"page","link":"https:\/\/antonvlasenko.com\/de\/solitar\/","title":{"rendered":"Solit\u00e4r"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8220;1&#8243; _builder_version=&#8220;4.17.4&#8243; _module_preset=&#8220;default&#8220; background_color=&#8220;#dfdfdf&#8220; background_image=&#8220;https:\/\/antonvlasenko.com\/wp-content\/uploads\/2020\/11\/grad1.png&#8220; background_position=&#8220;center_left&#8220; min_height=&#8220;1000px&#8220; height=&#8220;1100px&#8220; max_height=&#8220;1200px&#8220; custom_margin=&#8220;-110px||||false|false&#8220; custom_padding=&#8220;110px||||false|false&#8220; custom_css_main_element=&#8220;.main-footer {display: none !important; visibility: hidden !important;}&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_row disabled_on=&#8220;on|off|off&#8220; _builder_version=&#8220;4.17.4&#8243; _module_preset=&#8220;default&#8220; background_enable_color=&#8220;off&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.16&#8243; _module_preset=&#8220;default&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.17.4&#8243; _module_preset=&#8220;default&#8220; header_text_color=&#8220;#ffffff&#8220; header_font_size=&#8220;5vw&#8220; header_2_text_color=&#8220;#ffffff&#8220; header_2_font_size=&#8220;5vw&#8220; header_4_text_color=&#8220;#ffffff&#8220; header_4_font_size=&#8220;4vw&#8220; background_enable_color=&#8220;off&#8220; global_colors_info=&#8220;{}&#8220;]<\/p>\n<h2>Hast du nicht erwartet, dass du hier Solit\u00e4r spielen kannst?!<\/h2>\n<h4><a href=\"https:\/\/antonvlasenko.com\/de\/#contact\">Kontaktiere mich<\/a>, wenn du die Regeln nicht kennst oder deiner Zeit mit anderen teilen m\u00f6chtest.<\/h4>\n<p>[\/et_pb_text][et_pb_code _builder_version=&#8220;4.17.6&#8243; _module_preset=&#8220;default&#8220; background_color=&#8220;RGBA(255,255,255,0)&#8220; hover_enabled=&#8220;0&#8243; locked=&#8220;off&#8220; global_colors_info=&#8220;{}&#8220; sticky_enabled=&#8220;0&#8243;]<\/p>\n<style><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.heart, .tile {<!-- [et_pb_line_break_holder] -->  fill: red;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.clover, .pike {<!-- [et_pb_line_break_holder] -->  fill: black;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->#app {<!-- [et_pb_line_break_holder] -->  position: absolute;<!-- [et_pb_line_break_holder] -->  width: 100%;<!-- [et_pb_line_break_holder] -->  top: 10px;<!-- [et_pb_line_break_holder] -->  left: 0;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->#container {<!-- [et_pb_line_break_holder] -->  position: relative;<!-- [et_pb_line_break_holder] -->  width: 770px;<!-- [et_pb_line_break_holder] -->  margin: 0 auto;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.congratulation {<!-- [et_pb_line_break_holder] -->  color: white;<!-- [et_pb_line_break_holder] -->  font-size: 2em;<!-- [et_pb_line_break_holder] -->  text-align: center;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.header {<!-- [et_pb_line_break_holder] -->  margin: 10px;<!-- [et_pb_line_break_holder] -->  height: 126px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.stock, .rest, .flop, .foundation {<!-- [et_pb_line_break_holder] -->  vertical-align: top;<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.rest {<!-- [et_pb_line_break_holder] -->  margin-right: 95px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.rest .cardContainer {<!-- [et_pb_line_break_holder] -->  position: relative;<!-- [et_pb_line_break_holder] -->  width: 3px;<!-- [et_pb_line_break_holder] -->  perspective: 500px;<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.rest .cardContainer card {<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.flop .cardContainer {<!-- [et_pb_line_break_holder] -->  position: relative;<!-- [et_pb_line_break_holder] -->  width: 30px;<!-- [et_pb_line_break_holder] -->  perspective: 500px;<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.flop .cardContainer card {<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.foundation {<!-- [et_pb_line_break_holder] -->  position: absolute;<!-- [et_pb_line_break_holder] -->  right: 10px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.foundation .pile {<!-- [et_pb_line_break_holder] -->  box-sizing: border-box;<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->  margin-left: 20px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.foundation .pile .cardContainer {<!-- [et_pb_line_break_holder] -->  position: absolute;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.tableau {<!-- [et_pb_line_break_holder] -->  white-space: nowrap;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.tableau .pile {<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->  margin: 10px;<!-- [et_pb_line_break_holder] -->  vertical-align: top;<!-- [et_pb_line_break_holder] -->  width: 90px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.tableau .pile .cardContainer {<!-- [et_pb_line_break_holder] -->  position: relative;<!-- [et_pb_line_break_holder] -->  height: 40px;<!-- [et_pb_line_break_holder] -->  perspective: 500px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.cardFace, .dropTarget, .foundation > .pile {<!-- [et_pb_line_break_holder] -->  width: 90px;<!-- [et_pb_line_break_holder] -->  height: 126px;<!-- [et_pb_line_break_holder] -->  border-radius: 10px;<!-- [et_pb_line_break_holder] -->  box-shadow: 0px 0px 4px 0px #666;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.cardFace {<!-- [et_pb_line_break_holder] -->  background-color: white;<!-- [et_pb_line_break_holder] -->  padding: 10px;<!-- [et_pb_line_break_holder] -->  box-sizing: border-box;<!-- [et_pb_line_break_holder] -->  -webkit-backface-visibility: hidden;<!-- [et_pb_line_break_holder] -->          backface-visibility: hidden;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace.frontFace[draggable=true] {<!-- [et_pb_line_break_holder] -->  cursor: -webkit-grab;<!-- [et_pb_line_break_holder] -->  cursor: grab;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace.backFace {<!-- [et_pb_line_break_holder] -->  background-color: lightgray;<!-- [et_pb_line_break_holder] -->  position: absolute;<!-- [et_pb_line_break_holder] -->  top: 0;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace.pointer {<!-- [et_pb_line_break_holder] -->  cursor: pointer;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace h1 {<!-- [et_pb_line_break_holder] -->  font-size: 25px;<!-- [et_pb_line_break_holder] -->  display: inline-block;<!-- [et_pb_line_break_holder] -->  -webkit-user-select: none;<!-- [et_pb_line_break_holder] -->     -moz-user-select: none;<!-- [et_pb_line_break_holder] -->      -ms-user-select: none;<!-- [et_pb_line_break_holder] -->          user-select: none;<!-- [et_pb_line_break_holder] -->  margin: 0;<!-- [et_pb_line_break_holder] -->  margin-right: 5px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace h1.HEART, .cardFace h1.TILE {<!-- [et_pb_line_break_holder] -->  color: red;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace h1.CLOVER, .cardFace h1.PIKE {<!-- [et_pb_line_break_holder] -->  color: black;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.cardFace .suitIcon {<!-- [et_pb_line_break_holder] -->  padding-left: 5px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->.dropTarget {<!-- [et_pb_line_break_holder] -->  position: absolute;<!-- [et_pb_line_break_holder] -->  background-color: rgba(25, 25, 25, 0.5);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] -->.dropTarget h1 {<!-- [et_pb_line_break_holder] -->  -webkit-user-select: none;<!-- [et_pb_line_break_holder] -->     -moz-user-select: none;<!-- [et_pb_line_break_holder] -->      -ms-user-select: none;<!-- [et_pb_line_break_holder] -->          user-select: none;<!-- [et_pb_line_break_holder] -->  margin: 0;<!-- [et_pb_line_break_holder] -->  color: #11937C;<!-- [et_pb_line_break_holder] -->  font-size: 25px;<!-- [et_pb_line_break_holder] -->  text-align: center;<!-- [et_pb_line_break_holder] -->  line-height: 126px;<!-- [et_pb_line_break_holder] -->  vertical-align: middle;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><\/style>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <script><!-- [et_pb_line_break_holder] -->  window.console = window.console || function(t) {};<!-- [et_pb_line_break_holder] --><\/script><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <!-- [et_pb_line_break_holder] -->  <!-- [et_pb_line_break_holder] --><script><!-- [et_pb_line_break_holder] -->if (document.location.search.match(\/type=embed\/gi)) {<!-- [et_pb_line_break_holder] -->    window.parent.postMessage(\"resize\", \"*\");<!-- [et_pb_line_break_holder] -->  }<!-- [et_pb_line_break_holder] --><\/script><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <\/p>\n<div id=\"app\"><!-- [et_pb_line_break_holder] -->  <\/p>\n<div data-reactroot=\"\" id=\"container\">\n<div class=\"header\">\n<div class=\"stock\">\n<div class=\"rest\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">6<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">9<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">A<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">10<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">J<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">2<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">K<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">J<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">K<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">7<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">10<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">2<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">Q<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">7<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">9<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">8<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">4<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">3<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">5<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">5<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">3<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">Q<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">4<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">A<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"flop\"><\/div>\n<\/div>\n<div class=\"foundation\">\n<div class=\"pile\">\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"tableau\">\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"CLOVER\">Q<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">5<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"TILE\">7<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">6<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">6<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"CLOVER\">8<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">4<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">8<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">6<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"PIKE\">7<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">A<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">2<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">4<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">10<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"HEART\">J<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">J<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">3<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">10<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">Q<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">K<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"TILE\">5<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<div class=\"pile\">\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">A<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"HEART\">K<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"PIKE\">8<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"pike\" d=\" M 0 12 A 2.5 2.5 0 0 0 10 12 A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\"><\/path><polygon class=\"pike\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">3<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"TILE\">9<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"tile\" d=\" M 10 0 Q 13 5 17 10 Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"false\" style=\"transform: rotateY(-180deg);\">\n<div>\n<h1 class=\"CLOVER\">9<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><circle class=\"clover\" cx=\"10\" cy=\"5\" r=\"4.5\"\/><circle class=\"clover\" cx=\"5\" cy=\"11\" r=\"4.5\"\/><circle class=\"clover\" cx=\"15\" cy=\"11\" r=\"4.5\"\/><polygon class=\"clover\" points=\"10 10, 13 20, 7 20\"\/><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace\" style=\"transform: rotateY(0deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"cardContainer\">\n<div class=\"card\">\n<div class=\"cardFace frontFace\" draggable=\"true\" style=\"transform: rotateY(0deg);\">\n<div>\n<h1 class=\"HEART\">2<\/h1>\n<p><svg class=\"suitIcon\" width=\"20\" height=\"20\" viewbox=\"0 0 20 20\"><path class=\"heart\" d=\" M 0 6 A 2.5 2.5 0 0 1 10 6 A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\"><\/path><\/svg><\/div>\n<\/div>\n<div class=\"cardFace backFace pointer\" style=\"transform: rotateY(180deg);\"><\/div>\n<\/div>\n<\/div>\n<div class=\"dropTarget\" style=\"visibility: hidden;\">\n<h1>+<\/h1>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"congratulation\" style=\"visibility: hidden;\">\n<h1><\/h1>\n<\/div>\n<\/div>\n<\/div>\n<p><!-- [et_pb_line_break_holder] -->  <!-- [et_pb_line_break_holder] -->  <!-- [et_pb_line_break_holder] --><script src=\"https:\/\/cpwebassets.codepen.io\/assets\/common\/stopExecutionOnTimeout-157cd5b220a5c80d4ff8e0e70ac069bffd87a61252088146915e8726e5d9f147.js\"><\/script><!-- [et_pb_line_break_holder] --><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/react\/15.4.2\/react.min.js\"><\/script><!-- [et_pb_line_break_holder] --><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/react\/15.4.2\/react-dom.min.js\"><\/script><!-- [et_pb_line_break_holder] --><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/redux\/3.6.0\/redux.min.js\"><\/script><!-- [et_pb_line_break_holder] --><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/react-redux\/5.0.2\/react-redux.min.js\"><\/script><!-- [et_pb_line_break_holder] --><script id=\"rendered-js\"><!-- [et_pb_line_break_holder] -->\/* Import { createStore, combineReducers } from 'redux' *\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const { createStore, combineReducers } = Redux;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/* Import { connect, Provider } from 'react-redux' *\/<!-- [et_pb_line_break_holder] -->const { connect, Provider } = ReactRedux;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/*********<!-- [et_pb_line_break_holder] -->* Constatants<!-- [et_pb_line_break_holder] -->**********\/<!-- [et_pb_line_break_holder] -->const consts = {<!-- [et_pb_line_break_holder] -->  FOUNDATION: 'FOUNDATION',<!-- [et_pb_line_break_holder] -->  TABLEAU: 'TABLEAU',<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  HEART: 'HEART',<!-- [et_pb_line_break_holder] -->  CLOVER: 'CLOVER',<!-- [et_pb_line_break_holder] -->  TILE: 'TILE',<!-- [et_pb_line_break_holder] -->  PIKE: 'PIKE' };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/*********<!-- [et_pb_line_break_holder] -->* REACT<!-- [et_pb_line_break_holder] -->**********\/<!-- [et_pb_line_break_holder] -->const Game = (() => {<!-- [et_pb_line_break_holder] -->  const UnconnectedGame = ({ congratulation }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { id: \"container\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"header\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(Stock, null), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(Foundation, null)), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  React.createElement(Tableau, null), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"congratulation\",<!-- [et_pb_line_break_holder] -->    style: { visibility: congratulation ? 'visible' : 'hidden' } }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"h2\", null, \"Congratulation, you did it! Tell me about it at iam@antonvlasenko.com\")));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mapStateToProps = (state, ownProps) => {<!-- [et_pb_line_break_holder] -->    return {<!-- [et_pb_line_break_holder] -->      congratulation:<!-- [et_pb_line_break_holder] -->      state.foundation[0].cards.length === 13 &&<!-- [et_pb_line_break_holder] -->      state.foundation[1].cards.length === 13 &&<!-- [et_pb_line_break_holder] -->      state.foundation[2].cards.length === 13 &&<!-- [et_pb_line_break_holder] -->      state.foundation[3].cards.length === 13 };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  return connect(mapStateToProps)(UnconnectedGame);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Stock = (() => {<!-- [et_pb_line_break_holder] -->  const UnconnectedStock = ({ rest, flopped }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"stock\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"rest\" },<!-- [et_pb_line_break_holder] -->  rest.map((card) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"cardContainer\",<!-- [et_pb_line_break_holder] -->    key: JSON.stringify({ suit: card.suit, number: card.number }) }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(Card, { key: JSON.stringify({ suit: card.suit, number: card.number }),<!-- [et_pb_line_break_holder] -->    suit: card.suit, number: card.number,<!-- [et_pb_line_break_holder] -->    stack: true,<!-- [et_pb_line_break_holder] -->    turned: card.turned, locked: card.locked, last: false })))), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"flop\" },<!-- [et_pb_line_break_holder] -->  flopped.map((card) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"cardContainer\",<!-- [et_pb_line_break_holder] -->    key: JSON.stringify({ suit: card.suit, number: card.number }) }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(Card, { key: JSON.stringify({ suit: card.suit, number: card.number }),<!-- [et_pb_line_break_holder] -->    suit: card.suit, number: card.number,<!-- [et_pb_line_break_holder] -->    stack: true,<!-- [et_pb_line_break_holder] -->    turned: card.turned, locked: card.locked, last: card.last })))));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mapStateToProps = (state, ownProps) => {<!-- [et_pb_line_break_holder] -->    return {<!-- [et_pb_line_break_holder] -->      rest: state.stock.rest,<!-- [et_pb_line_break_holder] -->      flopped: state.stock.flopped };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  return connect(mapStateToProps)(UnconnectedStock);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Foundation = (() => {<!-- [et_pb_line_break_holder] -->  const UnconnectedFoundation = ({ piles }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"foundation\" },<!-- [et_pb_line_break_holder] -->  piles.map((pile, pileIndex) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"pile\", key: pileIndex },<!-- [et_pb_line_break_holder] -->  pile.cards.map((card) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"cardContainer\",<!-- [et_pb_line_break_holder] -->    key: JSON.stringify({ suit: card.suit, number: card.number }) }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(Card, { key: JSON.stringify({ suit: card.suit, number: card.number }),<!-- [et_pb_line_break_holder] -->    suit: card.suit, number: card.number,<!-- [et_pb_line_break_holder] -->    turned: card.turned, locked: card.locked, last: card.last }))), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  React.createElement(DropSite, { key: JSON.stringify({ type: consts.FOUNDATION, index: pileIndex }),<!-- [et_pb_line_break_holder] -->    pileType: consts.FOUNDATION, pileIndex: pileIndex, visible: pile.drop }))));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mapStateToProps = (state, ownProps) => {<!-- [et_pb_line_break_holder] -->    return {<!-- [et_pb_line_break_holder] -->      piles: state.foundation };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  return connect(mapStateToProps)(UnconnectedFoundation);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Tableau = (() => {<!-- [et_pb_line_break_holder] -->  const UnconnectedTableau = ({ piles }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"tableau\" },<!-- [et_pb_line_break_holder] -->  piles.map((pile, pileIndex) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"pile\", key: pileIndex },<!-- [et_pb_line_break_holder] -->  pile.cards.map((card, index) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(\"div\", { className: \"cardContainer\",<!-- [et_pb_line_break_holder] -->    key: JSON.stringify({ suit: card.suit, number: card.number }) }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->  React.createElement(Card, { key: JSON.stringify({ suit: card.suit, number: card.number }),<!-- [et_pb_line_break_holder] -->    suit: card.suit, number: card.number,<!-- [et_pb_line_break_holder] -->    stack: false,<!-- [et_pb_line_break_holder] -->    turned: card.turned, locked: card.locked, last: card.last }))), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  React.createElement(DropSite, { key: JSON.stringify({ type: consts.TABLEAU, index: pileIndex }),<!-- [et_pb_line_break_holder] -->    pileType: consts.TABLEAU, pileIndex: pileIndex, visible: pile.drop }))));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mapStateToProps = (state, ownProps) => {<!-- [et_pb_line_break_holder] -->    return {<!-- [et_pb_line_break_holder] -->      piles: state.tableau };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  return connect(mapStateToProps)(UnconnectedTableau);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/*********<!-- [et_pb_line_break_holder] --> * React: Card<!-- [et_pb_line_break_holder] --> *********\/<!-- [et_pb_line_break_holder] -->const Card = (() => {<!-- [et_pb_line_break_holder] -->  class UnconnectedCard extends React.Component {<!-- [et_pb_line_break_holder] -->    constructor({ suit, number, stack, turned, locked, last }) {<!-- [et_pb_line_break_holder] -->      super({ suit, number, stack, turned, locked, last });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      this.state = {<!-- [et_pb_line_break_holder] -->        rotation: turned ? 0 : -180 };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      this.turn = this.turn.bind(this);<!-- [et_pb_line_break_holder] -->      this.dragStart = this.dragStart.bind(this);<!-- [et_pb_line_break_holder] -->      this.dragEnd = this.dragEnd.bind(this);<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    turn() {<!-- [et_pb_line_break_holder] -->      if (this.props.stack === true) {<!-- [et_pb_line_break_holder] -->        this.props.flop();<!-- [et_pb_line_break_holder] -->      } else {<!-- [et_pb_line_break_holder] -->        if (this.props.turned === true || this.props.locked) {<!-- [et_pb_line_break_holder] -->          return;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        let lastTime = null;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        const slideBackAnimation = (time => {<!-- [et_pb_line_break_holder] -->          let rotation = null;<!-- [et_pb_line_break_holder] -->          if (lastTime !== null) {<!-- [et_pb_line_break_holder] -->            const delta = (time - lastTime) * 0.4;<!-- [et_pb_line_break_holder] -->            rotation = Math.min(0, this.state.rotation + delta);<!-- [et_pb_line_break_holder] -->            this.setState({ rotation });<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] -->          lastTime = time;<!-- [et_pb_line_break_holder] -->          if (rotation !== 0) requestAnimationFrame(slideBackAnimation);<!-- [et_pb_line_break_holder] -->        }).bind(this);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        requestAnimationFrame(slideBackAnimation);<!-- [et_pb_line_break_holder] -->      }<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    dragStart(ev) {<!-- [et_pb_line_break_holder] -->      ev.dataTransfer.setData('text\/plain', JSON.stringify({<!-- [et_pb_line_break_holder] -->        suit: this.props.suit,<!-- [et_pb_line_break_holder] -->        number: this.props.number }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      this.props.dragStart();<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    dragEnd(ev) {<!-- [et_pb_line_break_holder] -->      this.props.dragEnd();<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    render() {<!-- [et_pb_line_break_holder] -->      let suit;<!-- [et_pb_line_break_holder] -->      switch (this.props.suit) {<!-- [et_pb_line_break_holder] -->        case consts.HEART:<!-- [et_pb_line_break_holder] -->          suit = \/*#__PURE__*\/React.createElement(Heart, null);<!-- [et_pb_line_break_holder] -->          break;<!-- [et_pb_line_break_holder] -->        case consts.TILE:<!-- [et_pb_line_break_holder] -->          suit = \/*#__PURE__*\/React.createElement(Tile, null);<!-- [et_pb_line_break_holder] -->          break;<!-- [et_pb_line_break_holder] -->        case consts.CLOVER:<!-- [et_pb_line_break_holder] -->          suit = \/*#__PURE__*\/React.createElement(Clover, null);<!-- [et_pb_line_break_holder] -->          break;<!-- [et_pb_line_break_holder] -->        case consts.PIKE:<!-- [et_pb_line_break_holder] -->          suit = \/*#__PURE__*\/React.createElement(Pike, null);<!-- [et_pb_line_break_holder] -->          break;}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      return \/*#__PURE__*\/(<!-- [et_pb_line_break_holder] -->        React.createElement(\"div\", { className: \"card\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->        React.createElement(\"div\", { className: \"cardFace frontFace\",<!-- [et_pb_line_break_holder] -->          style: { transform: `rotateY(${this.state.rotation}deg)` },<!-- [et_pb_line_break_holder] -->          draggable: this.props.locked === false,<!-- [et_pb_line_break_holder] -->          onDragStart: this.dragStart,<!-- [et_pb_line_break_holder] -->          onDragEnd: this.dragEnd }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->        React.createElement(\"div\", null, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->        React.createElement(\"h1\", { className: this.props.suit }, this.props.number),<!-- [et_pb_line_break_holder] -->        suit)), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        React.createElement(\"div\", { className: 'cardFace backFace' + (this.props.locked === false ? ' pointer' : ''),<!-- [et_pb_line_break_holder] -->          style: { transform: `rotateY(${this.state.rotation + 180}deg)` },<!-- [et_pb_line_break_holder] -->          onClick: this.turn })));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    }}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mapDispatchToProps = (dispatch, ownProps) => {<!-- [et_pb_line_break_holder] -->    return {<!-- [et_pb_line_break_holder] -->      dragStart: () => {<!-- [et_pb_line_break_holder] -->        dispatch({<!-- [et_pb_line_break_holder] -->          type: 'DRAG_START',<!-- [et_pb_line_break_holder] -->          suit: ownProps.suit,<!-- [et_pb_line_break_holder] -->          number: ownProps.number,<!-- [et_pb_line_break_holder] -->          last: ownProps.last });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      },<!-- [et_pb_line_break_holder] -->      dragEnd: () => {<!-- [et_pb_line_break_holder] -->        dispatch({ type: 'DRAG_END' });<!-- [et_pb_line_break_holder] -->      },<!-- [et_pb_line_break_holder] -->      flop: () => {<!-- [et_pb_line_break_holder] -->        dispatch({ type: 'FLOP' });<!-- [et_pb_line_break_holder] -->      } };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] -->  return connect(null, mapDispatchToProps)(UnconnectedCard);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Heart = ({ zoom = false }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"svg\", { className: \"suitIcon\",<!-- [et_pb_line_break_holder] -->  width: zoom === true ? 40 : 20, height: zoom === true ? 40 : 20,<!-- [et_pb_line_break_holder] -->  viewBox: \"0 0 20 20\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"path\", { className: \"heart\",<!-- [et_pb_line_break_holder] -->  d: \" M 0 6  A 2.5 2.5 0 0 1 10 6  A 2.5 2.5 0 0 1 20 6 Q 16 14 10 19 Q 4 14 0 6\" }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Tile = ({ zoom = false }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"svg\", { className: \"suitIcon\",<!-- [et_pb_line_break_holder] -->  width: zoom === true ? 40 : 20, height: zoom === true ? 40 : 20,<!-- [et_pb_line_break_holder] -->  viewBox: \"0 0 20 20\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"path\", { className: \"tile\",<!-- [et_pb_line_break_holder] -->  d: \" M 10 0  Q 13 5 17 10  Q 13 15 10 20 Q 7 15 3 10 Q 7 5 10 0\" }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Clover = ({ zoom = false }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"svg\", { className: \"suitIcon\",<!-- [et_pb_line_break_holder] -->  width: zoom === true ? 40 : 20, height: zoom === true ? 40 : 20,<!-- [et_pb_line_break_holder] -->  viewBox: \"0 0 20 20\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"circle\", { className: \"clover\", cx: \"10\", cy: \"5\", r: \"4.5\" }), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"circle\", { className: \"clover\", cx: \"5\", cy: \"11\", r: \"4.5\" }), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"circle\", { className: \"clover\", cx: \"15\", cy: \"11\", r: \"4.5\" }), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"polygon\", { className: \"clover\", points: \"10 10, 13 20, 7 20\" }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const Pike = ({ zoom = false }) => \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"svg\", { className: \"suitIcon\",<!-- [et_pb_line_break_holder] -->  width: zoom === true ? 40 : 20, height: zoom === true ? 40 : 20,<!-- [et_pb_line_break_holder] -->  viewBox: \"0 0 20 20\" }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(\"path\", { className: \"pike\",<!-- [et_pb_line_break_holder] -->  d: \" M 0 12  A 2.5 2.5 0 0 0 10 12  A 2.5 2.5 0 0 0 20 12 Q 16 4 10 0 Q 4 4 0 12\" }), \/*#__PURE__*\/<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->React.createElement(\"polygon\", { className: \"pike\", points: \"10 10, 13 20, 7 20\" }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/*********<!-- [et_pb_line_break_holder] --> * React: Drop Site<!-- [et_pb_line_break_holder] --> *********\/<!-- [et_pb_line_break_holder] -->const DropSite = (() => {<!-- [et_pb_line_break_holder] -->  class UnconnectedDropSite extends React.Component {<!-- [et_pb_line_break_holder] -->    constructor({ pileType, pileIndex, visible, drop }) {<!-- [et_pb_line_break_holder] -->      super({ pileType, pileIndex, visible, drop });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      this.allowDrop = this.allowDrop.bind(this);<!-- [et_pb_line_break_holder] -->      this.drop = this.drop.bind(this);<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    allowDrop(ev) {<!-- [et_pb_line_break_holder] -->      ev.preventDefault();<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    drop(ev) {<!-- [et_pb_line_break_holder] -->      ev.preventDefault();<!-- [et_pb_line_break_holder] -->      let data = JSON.parse(ev.dataTransfer.getData(\"text\"));<!-- [et_pb_line_break_holder] -->      this.props.drop(data.suit, data.number);<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    render() {<!-- [et_pb_line_break_holder] -->      return \/*#__PURE__*\/(<!-- [et_pb_line_break_holder] -->        React.createElement(\"div\", { className: \"dropTarget\",<!-- [et_pb_line_break_holder] -->          style: { visibility: this.props.visible ? 'visible' : 'hidden' },<!-- [et_pb_line_break_holder] -->          onDrop: this.drop, onDragOver: this.allowDrop }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->        React.createElement(\"h1\", null, \"+\")));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    }}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mapDispatchToProps = (dispatch, ownProps) => {<!-- [et_pb_line_break_holder] -->    return {<!-- [et_pb_line_break_holder] -->      drop: (suit, number) => {<!-- [et_pb_line_break_holder] -->        dispatch({<!-- [et_pb_line_break_holder] -->          type: 'DRAG_END' });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        dispatch({<!-- [et_pb_line_break_holder] -->          type: 'DROP',<!-- [et_pb_line_break_holder] -->          targetPileType: ownProps.pileType,<!-- [et_pb_line_break_holder] -->          targetPileIndex: ownProps.pileIndex,<!-- [et_pb_line_break_holder] -->          suit,<!-- [et_pb_line_break_holder] -->          number });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      } };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] -->  return connect(null, mapDispatchToProps)(UnconnectedDropSite);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/*********<!-- [et_pb_line_break_holder] -->* REDUX: Store<!-- [et_pb_line_break_holder] -->**********\/<!-- [et_pb_line_break_holder] -->const store = (() => {<!-- [et_pb_line_break_holder] -->  let cards = (() => {<!-- [et_pb_line_break_holder] -->    function deck() {<!-- [et_pb_line_break_holder] -->      let cards = [];<!-- [et_pb_line_break_holder] -->      for (let i = 2; i <= 14; i++) {WPML_COMMENT_5927_0        let number = i;WPML_COMMENT_5927_0        if (i === 11) number = 'J';WPML_COMMENT_5927_0        if (i === 12) number = 'Q';WPML_COMMENT_5927_0        if (i === 13) number = 'K';WPML_COMMENT_5927_0        if (i === 14) number = 'A';WPML_COMMENT_5927_0        cards.push({ suit: consts.HEART, number });WPML_COMMENT_5927_0        cards.push({ suit: consts.TILE, number });WPML_COMMENT_5927_0        cards.push({ suit: consts.CLOVER, number });WPML_COMMENT_5927_0        cards.push({ suit: consts.PIKE, number });WPML_COMMENT_5927_0      }WPML_COMMENT_5927_0      return cards;WPML_COMMENT_5927_0    }WPML_COMMENT_5927_0WPML_COMMENT_5927_0    function shuffle(a) {WPML_COMMENT_5927_0      for (let i = a.length; i; i--) {WPML_COMMENT_5927_0        let j = Math.floor(Math.random() * i);WPML_COMMENT_5927_0        invalid_tags_codes_570, a[j]] = invalid_tags_codes_571, ainvalid_tags_codes_572];WPML_COMMENT_5927_0      }WPML_COMMENT_5927_0    }WPML_COMMENT_5927_0WPML_COMMENT_5927_0    let cards = deck();WPML_COMMENT_5927_0    shuffle(cards);WPML_COMMENT_5927_0    return cards;WPML_COMMENT_5927_0  })();WPML_COMMENT_5927_0WPML_COMMENT_5927_0  function pop(cards, turned = false) {WPML_COMMENT_5927_0    if (turned) {WPML_COMMENT_5927_0      return { ...cards.shift(), turned: true, locked: false, last: true };WPML_COMMENT_5927_0    } else {WPML_COMMENT_5927_0      return { ...cards.shift(), turned: false, locked: true, last: false };WPML_COMMENT_5927_0    }WPML_COMMENT_5927_0  }WPML_COMMENT_5927_0WPML_COMMENT_5927_0  const initialState = {WPML_COMMENT_5927_0    tableau: [WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_592 },WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_594 },WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_596 },WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_598 },WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_600 },WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_602 },WPML_COMMENT_5927_0    { drop: false, cards: invalid_tags_codes_604 }],WPML_COMMENT_5927_0WPML_COMMENT_5927_0    stock: {WPML_COMMENT_5927_0      rest: [...cards.map(card => ({<!-- [et_pb_line_break_holder] -->        suit: card.suit,<!-- [et_pb_line_break_holder] -->        number: card.number,<!-- [et_pb_line_break_holder] -->        turned: false,<!-- [et_pb_line_break_holder] -->        locked: false,<!-- [et_pb_line_break_holder] -->        last: false }))],<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      flopped: [] },<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    foundation: [<!-- [et_pb_line_break_holder] -->    { drop: false, cards: [] },<!-- [et_pb_line_break_holder] -->    { drop: false, cards: [] },<!-- [et_pb_line_break_holder] -->    { drop: false, cards: [] },<!-- [et_pb_line_break_holder] -->    { drop: false, cards: [] }] };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const stockReducer = (state = initialState.stock, action) => {<!-- [et_pb_line_break_holder] -->    switch (action.type) {<!-- [et_pb_line_break_holder] -->      case 'FLOP':{<!-- [et_pb_line_break_holder] -->          const rest = [<!-- [et_pb_line_break_holder] -->          ...state.flopped.map(<!-- [et_pb_line_break_holder] -->          card => ({<!-- [et_pb_line_break_holder] -->            suit: card.suit,<!-- [et_pb_line_break_holder] -->            number: card.number,<!-- [et_pb_line_break_holder] -->            turned: false,<!-- [et_pb_line_break_holder] -->            locked: false })),<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          ...state.rest];<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          let flopped = [];<!-- [et_pb_line_break_holder] -->          const first = rest.pop();<!-- [et_pb_line_break_holder] -->          const second = rest.pop();<!-- [et_pb_line_break_holder] -->          const third = rest.pop();<!-- [et_pb_line_break_holder] -->          if (third !== undefined) {<!-- [et_pb_line_break_holder] -->            flopped.push(Object.assign({}, third, { turned: true, locked: true, last: false }));<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] -->          if (second !== undefined) {<!-- [et_pb_line_break_holder] -->            flopped.push(Object.assign({}, second, { turned: true, locked: true, last: false }));<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] -->          if (first !== undefined) {<!-- [et_pb_line_break_holder] -->            flopped.push(Object.assign({}, first, { turned: true, locked: false, last: true }));<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          return {<!-- [et_pb_line_break_holder] -->            rest,<!-- [et_pb_line_break_holder] -->            flopped };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      case 'DROP':{<!-- [et_pb_line_break_holder] -->          const topFlop = state.flopped[state.flopped.length - 1];<!-- [et_pb_line_break_holder] -->          if (topFlop !== undefined && topFlop.suit === action.suit && topFlop.number === action.number) {<!-- [et_pb_line_break_holder] -->            \/\/ The top of the flopped cards has been moved<!-- [et_pb_line_break_holder] -->            let flopped = [];<!-- [et_pb_line_break_holder] -->            if (state.flopped.length > 2) {<!-- [et_pb_line_break_holder] -->              flopped = flopped.concat(state.flopped.slice(0, -2));<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            if (state.flopped.length > 1) {<!-- [et_pb_line_break_holder] -->              flopped.push(Object.assign(<!-- [et_pb_line_break_holder] -->              {},<!-- [et_pb_line_break_holder] -->              state.flopped[state.flopped.length - 2],<!-- [et_pb_line_break_holder] -->              {<!-- [et_pb_line_break_holder] -->                locked: false,<!-- [et_pb_line_break_holder] -->                last: true }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            return {<!-- [et_pb_line_break_holder] -->              rest: state.rest,<!-- [et_pb_line_break_holder] -->              flopped };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] -->          return state;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      default:{<!-- [et_pb_line_break_holder] -->          return state;<!-- [et_pb_line_break_holder] -->        }}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const foundationReducer = (state = initialState.foundation, action) => {<!-- [et_pb_line_break_holder] -->    switch (action.type) {<!-- [et_pb_line_break_holder] -->      case 'DRAG_START':{<!-- [et_pb_line_break_holder] -->          if (action.last !== true) {<!-- [et_pb_line_break_holder] -->            return state;<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] -->          function match(targetCard, draggedCard) {<!-- [et_pb_line_break_holder] -->            if (targetCard === undefined && draggedCard.number === 'A') {<!-- [et_pb_line_break_holder] -->              return true;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            if (targetCard === undefined) {<!-- [et_pb_line_break_holder] -->              return false;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            return targetCard.suit === draggedCard.suit && (<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            targetCard.number === 'A' && draggedCard.number === 2 ||<!-- [et_pb_line_break_holder] -->            targetCard.number === 10 && draggedCard.number === 'J' ||<!-- [et_pb_line_break_holder] -->            targetCard.number === 'J' && draggedCard.number === 'Q' ||<!-- [et_pb_line_break_holder] -->            targetCard.number === 'Q' && draggedCard.number === 'K' ||<!-- [et_pb_line_break_holder] -->            targetCard.number + 1 === draggedCard.number);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          let draggedCard = { suit: action.suit, number: action.number };<!-- [et_pb_line_break_holder] -->          return state.map(<!-- [et_pb_line_break_holder] -->          pile => ({<!-- [et_pb_line_break_holder] -->            drop: match(pile.cards[pile.cards.length - 1], draggedCard),<!-- [et_pb_line_break_holder] -->            cards: [...pile.cards] }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      case 'DRAG_END':{<!-- [et_pb_line_break_holder] -->          return state.map(<!-- [et_pb_line_break_holder] -->          pile => ({<!-- [et_pb_line_break_holder] -->            drop: false,<!-- [et_pb_line_break_holder] -->            cards: [...pile.cards] }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      case 'DROP':{<!-- [et_pb_line_break_holder] -->          function match(card, suit, number) {<!-- [et_pb_line_break_holder] -->            return card !== undefined && card.suit === suit && card.number === number;<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          \/\/ Check if the moved card belonged to the foundation piles<!-- [et_pb_line_break_holder] -->          const sourcePileIndex = state.findIndex(<!-- [et_pb_line_break_holder] -->          pile => match(pile.cards[pile.cards.length - 1], action.suit, action.number));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          return state.map(<!-- [et_pb_line_break_holder] -->          (pile, pileIndex) => {<!-- [et_pb_line_break_holder] -->            \/\/ Add the card to the corresponding pile if the target is a foundation pile<!-- [et_pb_line_break_holder] -->            if (action.targetPileType === consts.FOUNDATION && action.targetPileIndex === pileIndex) {<!-- [et_pb_line_break_holder] -->              return {<!-- [et_pb_line_break_holder] -->                drop: false,<!-- [et_pb_line_break_holder] -->                cards: [<!-- [et_pb_line_break_holder] -->                ...pile.cards.map(<!-- [et_pb_line_break_holder] -->                card => ({<!-- [et_pb_line_break_holder] -->                  suit: card.suit,<!-- [et_pb_line_break_holder] -->                  number: card.number,<!-- [et_pb_line_break_holder] -->                  turned: true,<!-- [et_pb_line_break_holder] -->                  locked: true,<!-- [et_pb_line_break_holder] -->                  last: false })),<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                {<!-- [et_pb_line_break_holder] -->                  suit: action.suit,<!-- [et_pb_line_break_holder] -->                  number: action.number,<!-- [et_pb_line_break_holder] -->                  turned: true,<!-- [et_pb_line_break_holder] -->                  locked: false,<!-- [et_pb_line_break_holder] -->                  last: true }] };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            \/\/ Remove the card from if it has been part of a foundation pile<!-- [et_pb_line_break_holder] -->            if (sourcePileIndex !== undefined && sourcePileIndex === pileIndex) {<!-- [et_pb_line_break_holder] -->              let cards = [];<!-- [et_pb_line_break_holder] -->              if (pile.cards.length > 2) {<!-- [et_pb_line_break_holder] -->                cards = cards.concat(pile.cards.slice(0, -2));<!-- [et_pb_line_break_holder] -->              }<!-- [et_pb_line_break_holder] -->              if (pile.cards.length > 1) {<!-- [et_pb_line_break_holder] -->                cards.push(Object.assign({}, pile.cards[pile.cards.length - 2], { locked: false, last: true }));<!-- [et_pb_line_break_holder] -->              }<!-- [et_pb_line_break_holder] -->              return {<!-- [et_pb_line_break_holder] -->                drop: false,<!-- [et_pb_line_break_holder] -->                cards };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            \/\/ Return the pile unchanged if it has not been affected by the drop<!-- [et_pb_line_break_holder] -->            return pile;<!-- [et_pb_line_break_holder] -->          });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      default:{<!-- [et_pb_line_break_holder] -->          return state;<!-- [et_pb_line_break_holder] -->        }}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const tableauReducer = (state = initialState.tableau, action) => {<!-- [et_pb_line_break_holder] -->    switch (action.type) {<!-- [et_pb_line_break_holder] -->      case 'DRAG_START':{<!-- [et_pb_line_break_holder] -->          function match(targetCard, draggedCard) {<!-- [et_pb_line_break_holder] -->            if (targetCard === undefined && draggedCard.number === 'K') {<!-- [et_pb_line_break_holder] -->              return true;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            if (targetCard === undefined) {<!-- [et_pb_line_break_holder] -->              return false;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            return (<!-- [et_pb_line_break_holder] -->              (<!-- [et_pb_line_break_holder] -->              targetCard.number === 'K' && draggedCard.number === 'Q' ||<!-- [et_pb_line_break_holder] -->              targetCard.number === 'Q' && draggedCard.number === 'J' ||<!-- [et_pb_line_break_holder] -->              targetCard.number === 'J' && draggedCard.number === 10 ||<!-- [et_pb_line_break_holder] -->              targetCard.number === draggedCard.number + 1) && (<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->              (targetCard.suit === consts.HEART || targetCard.suit === consts.TILE) && (<!-- [et_pb_line_break_holder] -->              draggedCard.suit === consts.CLOVER || draggedCard.suit === consts.PIKE) ||<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->              (targetCard.suit === consts.CLOVER || targetCard.suit === consts.PIKE) && (<!-- [et_pb_line_break_holder] -->              draggedCard.suit === consts.HEART || draggedCard.suit === consts.TILE)));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          let draggedCard = { suit: action.suit, number: action.number };<!-- [et_pb_line_break_holder] -->          return state.map(<!-- [et_pb_line_break_holder] -->          pile => ({<!-- [et_pb_line_break_holder] -->            drop: match(pile.cards[pile.cards.length - 1], draggedCard),<!-- [et_pb_line_break_holder] -->            cards: [...pile.cards] }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      case 'DRAG_END':{<!-- [et_pb_line_break_holder] -->          return state.map(<!-- [et_pb_line_break_holder] -->          pile => ({<!-- [et_pb_line_break_holder] -->            drop: false,<!-- [et_pb_line_break_holder] -->            cards: [...pile.cards] }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      case 'DROP':{<!-- [et_pb_line_break_holder] -->          function match(card, suit, number) {<!-- [et_pb_line_break_holder] -->            return card !== undefined && card.suit === suit && card.number === number;<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          const [tableauWithoutMovingCards, movingCards] = state.reduce(<!-- [et_pb_line_break_holder] -->          (accumulated, currentPile) => {<!-- [et_pb_line_break_holder] -->            const index = currentPile.cards.findIndex(card => match(card, action.suit, action.number));<!-- [et_pb_line_break_holder] -->            if (index !== -1) {<!-- [et_pb_line_break_holder] -->              let cards = [];<!-- [et_pb_line_break_holder] -->              if (index > 1) {<!-- [et_pb_line_break_holder] -->                cards = cards.concat(currentPile.cards.slice(0, index - 1).map(<!-- [et_pb_line_break_holder] -->                card => ({<!-- [et_pb_line_break_holder] -->                  suit: card.suit,<!-- [et_pb_line_break_holder] -->                  number: card.number,<!-- [et_pb_line_break_holder] -->                  turned: card.turned,<!-- [et_pb_line_break_holder] -->                  locked: card.locked,<!-- [et_pb_line_break_holder] -->                  last: false })));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->              }<!-- [et_pb_line_break_holder] -->              if (index > 0) {<!-- [et_pb_line_break_holder] -->                cards.push(Object.assign({}, currentPile.cards[index - 1], {<!-- [et_pb_line_break_holder] -->                  locked: false,<!-- [et_pb_line_break_holder] -->                  last: true }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->              }<!-- [et_pb_line_break_holder] -->              accumulated[0].push({<!-- [et_pb_line_break_holder] -->                drop: false,<!-- [et_pb_line_break_holder] -->                cards });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->              accumulated[1] = currentPile.cards.slice(index).map(<!-- [et_pb_line_break_holder] -->              card => ({<!-- [et_pb_line_break_holder] -->                suit: card.suit,<!-- [et_pb_line_break_holder] -->                number: card.number,<!-- [et_pb_line_break_holder] -->                turned: true,<!-- [et_pb_line_break_holder] -->                locked: false,<!-- [et_pb_line_break_holder] -->                last: card.last }));<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            } else {<!-- [et_pb_line_break_holder] -->              accumulated[0].push(currentPile);<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            return accumulated;<!-- [et_pb_line_break_holder] -->          },<!-- [et_pb_line_break_holder] -->          [<!-- [et_pb_line_break_holder] -->          [<!-- [et_pb_line_break_holder] -->            \/\/ Tableau without moving cards<!-- [et_pb_line_break_holder] -->          ],<!-- [et_pb_line_break_holder] -->          [<!-- [et_pb_line_break_holder] -->          \/\/ Moving cards default (overwritten if source found in a tableau pile)<!-- [et_pb_line_break_holder] -->          {<!-- [et_pb_line_break_holder] -->            suit: action.suit,<!-- [et_pb_line_break_holder] -->            number: action.number,<!-- [et_pb_line_break_holder] -->            turned: true,<!-- [et_pb_line_break_holder] -->            locked: false,<!-- [et_pb_line_break_holder] -->            last: true }]]);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          if (action.targetPileType === consts.TABLEAU) {<!-- [et_pb_line_break_holder] -->            tableauWithoutMovingCards[action.targetPileIndex] = {<!-- [et_pb_line_break_holder] -->              drop: false,<!-- [et_pb_line_break_holder] -->              cards: tableauWithoutMovingCards[action.targetPileIndex].cards.map(<!-- [et_pb_line_break_holder] -->              card => ({<!-- [et_pb_line_break_holder] -->                suit: card.suit,<!-- [et_pb_line_break_holder] -->                number: card.number,<!-- [et_pb_line_break_holder] -->                turned: card.turned,<!-- [et_pb_line_break_holder] -->                locked: card.locked,<!-- [et_pb_line_break_holder] -->                last: false })).<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->              concat(movingCards) };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            return tableauWithoutMovingCards;<!-- [et_pb_line_break_holder] -->          }<!-- [et_pb_line_break_holder] -->          return tableauWithoutMovingCards;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->      default:{<!-- [et_pb_line_break_holder] -->          return state;<!-- [et_pb_line_break_holder] -->        }}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const mainReducer = combineReducers({<!-- [et_pb_line_break_holder] -->    stock: stockReducer,<!-- [et_pb_line_break_holder] -->    foundation: foundationReducer,<!-- [et_pb_line_break_holder] -->    tableau: tableauReducer });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  return createStore(mainReducer);<!-- [et_pb_line_break_holder] -->})();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->\/*********<!-- [et_pb_line_break_holder] --> * React DOM<!-- [et_pb_line_break_holder] --> *********\/<!-- [et_pb_line_break_holder] -->ReactDOM.render( \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(Provider, { store: store }, \/*#__PURE__*\/<!-- [et_pb_line_break_holder] -->React.createElement(Game, null)),<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->document.getElementById('app'));<!-- [et_pb_line_break_holder] -->\/\/# sourceURL=pen.js<!-- [et_pb_line_break_holder] -->    <\/script><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->[\/et_pb_code][\/et_pb_column][\/et_pb_row][et_pb_row disabled_on=&#8220;off|on|on&#8220; _builder_version=&#8220;4.16&#8243; _module_preset=&#8220;default&#8220; background_enable_color=&#8220;off&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.16&#8243; _module_preset=&#8220;default&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_text _builder_version=&#8220;4.17.4&#8243; _module_preset=&#8220;default&#8220; header_text_color=&#8220;#ffffff&#8220; header_font_size=&#8220;5vw&#8220; header_2_text_color=&#8220;#ffffff&#8220; header_2_font_size=&#8220;5vw&#8220; header_4_text_color=&#8220;#ffffff&#8220; header_4_font_size=&#8220;4vw&#8220; background_enable_color=&#8220;off&#8220; global_colors_info=&#8220;{}&#8220;]<\/p>\n<h4>\ud83d\ude41<br \/>Bitte versuche es auf deinem Computer.<\/h4>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hast du nicht erwartet, dass du hier Solit\u00e4r spielen kannst?! Kontaktiere mich, wenn du die Regeln nicht kennst oder deiner Zeit mit anderen teilen m\u00f6chtest.:(Bitte versuche es auf deinem Computer.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-6508","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Solit\u00e4r - Anton Vlasenko<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/antonvlasenko.com\/de\/solitar\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Solit\u00e4r - Anton Vlasenko\" \/>\n<meta property=\"og:description\" content=\"Hast du nicht erwartet, dass du hier Solit\u00e4r spielen kannst?! Kontaktiere mich, wenn du die Regeln nicht kennst oder deiner Zeit mit anderen teilen m\u00f6chtest.:(Bitte versuche es auf deinem Computer.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/antonvlasenko.com\/de\/solitar\/\" \/>\n<meta property=\"og:site_name\" content=\"Anton Vlasenko\" \/>\n<meta property=\"article:modified_time\" content=\"2022-07-27T19:47:33+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"1\u00a0Minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/antonvlasenko.com\/de\/solitar\/\",\"url\":\"https:\/\/antonvlasenko.com\/de\/solitar\/\",\"name\":\"Solit\u00e4r - Anton Vlasenko\",\"isPartOf\":{\"@id\":\"https:\/\/antonvlasenko.com\/de\/#website\"},\"datePublished\":\"2020-12-26T20:57:13+00:00\",\"dateModified\":\"2022-07-27T19:47:33+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/antonvlasenko.com\/de\/solitar\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/antonvlasenko.com\/de\/solitar\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/antonvlasenko.com\/de\/solitar\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/antonvlasenko.com\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Solit\u00e4r\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/antonvlasenko.com\/de\/#website\",\"url\":\"https:\/\/antonvlasenko.com\/de\/\",\"name\":\"Anton Vlasenko\",\"description\":\"3D visualization and animation\",\"publisher\":{\"@id\":\"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/99be033fec3307126cf633af9bc57d20\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/antonvlasenko.com\/de\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/99be033fec3307126cf633af9bc57d20\",\"name\":\"Anton Vlasenko\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/antonvlasenko.com\/wp-content\/uploads\/2021\/01\/anton-vlasenko-portrait.jpg\",\"contentUrl\":\"https:\/\/antonvlasenko.com\/wp-content\/uploads\/2021\/01\/anton-vlasenko-portrait.jpg\",\"width\":626,\"height\":807,\"caption\":\"Anton Vlasenko\"},\"logo\":{\"@id\":\"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/image\/\"},\"sameAs\":[\"http:\/\/diamant.graphics\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Solit\u00e4r - Anton Vlasenko","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/antonvlasenko.com\/de\/solitar\/","og_locale":"de_DE","og_type":"article","og_title":"Solit\u00e4r - Anton Vlasenko","og_description":"Hast du nicht erwartet, dass du hier Solit\u00e4r spielen kannst?! Kontaktiere mich, wenn du die Regeln nicht kennst oder deiner Zeit mit anderen teilen m\u00f6chtest.:(Bitte versuche es auf deinem Computer.","og_url":"https:\/\/antonvlasenko.com\/de\/solitar\/","og_site_name":"Anton Vlasenko","article_modified_time":"2022-07-27T19:47:33+00:00","twitter_card":"summary_large_image","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"1\u00a0Minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/antonvlasenko.com\/de\/solitar\/","url":"https:\/\/antonvlasenko.com\/de\/solitar\/","name":"Solit\u00e4r - Anton Vlasenko","isPartOf":{"@id":"https:\/\/antonvlasenko.com\/de\/#website"},"datePublished":"2020-12-26T20:57:13+00:00","dateModified":"2022-07-27T19:47:33+00:00","breadcrumb":{"@id":"https:\/\/antonvlasenko.com\/de\/solitar\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/antonvlasenko.com\/de\/solitar\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/antonvlasenko.com\/de\/solitar\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/antonvlasenko.com\/de\/"},{"@type":"ListItem","position":2,"name":"Solit\u00e4r"}]},{"@type":"WebSite","@id":"https:\/\/antonvlasenko.com\/de\/#website","url":"https:\/\/antonvlasenko.com\/de\/","name":"Anton Vlasenko","description":"3D visualization and animation","publisher":{"@id":"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/99be033fec3307126cf633af9bc57d20"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/antonvlasenko.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":["Person","Organization"],"@id":"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/99be033fec3307126cf633af9bc57d20","name":"Anton Vlasenko","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/image\/","url":"https:\/\/antonvlasenko.com\/wp-content\/uploads\/2021\/01\/anton-vlasenko-portrait.jpg","contentUrl":"https:\/\/antonvlasenko.com\/wp-content\/uploads\/2021\/01\/anton-vlasenko-portrait.jpg","width":626,"height":807,"caption":"Anton Vlasenko"},"logo":{"@id":"https:\/\/antonvlasenko.com\/de\/#\/schema\/person\/image\/"},"sameAs":["http:\/\/diamant.graphics"]}]}},"_links":{"self":[{"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/pages\/6508","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/comments?post=6508"}],"version-history":[{"count":0,"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/pages\/6508\/revisions"}],"wp:attachment":[{"href":"https:\/\/antonvlasenko.com\/de\/wp-json\/wp\/v2\/media?parent=6508"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}