<?php

require "header.php";

require "htmlheader.php";

?>
<div class='cardcount' id='cardcount'></div>
<div class='diceroll hidden clickable' id='diceroll'></div>
<div class='diceroll hidden clickable' id='diceroll_2'><img src='img/dice_2.gif' /></div>
<div class='diceroll hidden clickable' id='diceroll_3'><img src='img/dice_3.gif' /></div>
<div class='diceroll hidden clickable' id='diceroll_4'><img src='img/dice_4.gif' /></div>
<div class='diceroll hidden clickable' id='diceroll_5'><img src='img/dice_5.gif' /></div>
<center>
<div id="header" class="header">
  <button id="btn_showfirst" class="padright">Show First Card</button>
  <button id="btn_showsecond" class="hidden">Show Second Card</button>
</div>
<div id="graphics" class="graphics">
  <div id="manaleft" class="mana">
    <img src="img/mana_sun.png" class="manaimg clickable" id="mana_sun_img" /><br clear=all />
    <img src="img/mana_water.png" class="manaimg clickable" id="mana_water_img" /><br clear=all />
    <img src="img/mana_fire.png" class="manaimg clickable" id="mana_fire_img" />
  </div>
  <div id="image1" class="cards">
    <img id="firstimg" class="card-image cardimg_single" data-id="0" src="" />
    <img id="secondimg" class="card-image cardimg_double data-id="0" hidden" src="" />
  </div>
  <div id="manaright" class="mana">
    <img src="img/mana_tree.png" class="manaimg" id="mana_tree_img" /><br clear=all />
    <img src="img/mana_skull.png" class="manaimg" id="mana_skull_img" /><br clear=all />
    <img src="img/mana_diamond.png" class="manaimg" id="mana_diamond_img" />
  </div>
</div>
</center>
<?php

includeHTMLFooter("main.js");
