function Riddle(title, body, tag, imageUrl){
  this.title = title;
  this.body = body;
  this.tag = tag;
  this.imageUrl = imageUrl;
}

var riddle = new Riddle('Any Five Cards', '\n<p>\n  You meet a magician and his assistant, who decide to show you a trick.\n</p>\n<p>\n  The assistant leaves the room, and the magician hands you an ordinary deck of 52 cards.\n  He has you choose any 5 cards from the deck and give them to him.\n</p>\n<p>\n  He looks over the 5 cards you chose, takes one of them, and hands it back to you.\n</p>\n<p>\n  "That going to be your card," he says.  He asks you to put it in your pocket out of sight.\n</p>\n<p>\n  He then takes the four remaining cards and arranges them in a stack in a special order.\n  All four cards in the stack are face-down.\n</p>\n<p>\n  He hands you the stack of four cards and asks you to place them on the table however you like (as long as you\n  don\'t change the order).\n  He then calls the assistant back in.  The assistant picks up the four cards, looks them over, \n  and promptly tells you what your card is.\n</p>\n<p>\n  Note that the magician did not do anything extra to communicate information to the assistant.  The only information\n  the assistant has in figuring out your card is the order of the four cards on the table.\n</p>\n<p>\n  How was the assistant able to figure out your card?\n</p>\n', 'any-five-cards', '');

function showRiddle(curRiddle){
  var elem = document.getElementById('riddle_body');
  elem.innerHTML = curRiddle.body;
  var elem = document.getElementById('riddle_title');
  elem.innerHTML = curRiddle.title;
  var elem = document.getElementById('riddle_image');
  if ((curRiddle.imageUrl == null) || (curRiddle.imageUrl == '')){
    elem.innerHTML = '';
  }else{
    elem.innerHTML = '<img style="width:50px;" src="http://www.bigriddles.com/images/riddles/' + curRiddle.imageUrl + '"/>';  
  }
  
  var elem = document.getElementById('riddle_solution');
  elem.innerHTML = '<a href="http://www.bigriddles.com/riddle/' + curRiddle.tag + '">Click here to see the solution.</a>';
}

document.write('&lt;style&gt;\r\n.bigriddles_widget{\r\n  position: relative;\r\n  width:325px;\r\n  padding: 3px 0px 5px 0px;\r\n  border:2px solid #003399;\r\n  color:black;\r\n  background-color:white;\r\n  text-align:right;\r\n}\r\n.bigriddles_widget #riddle_title{\r\n  font-size:130%;\r\n  font-weight:bold;\r\n  padding:1px 5px 1px 5px;\r\n  text-align: left;\r\n}\r\n.bigriddles_widget #riddle_section{\r\n  padding:5px;\r\n  height: 175px;\r\n  overflow: auto;\r\n  text-align: left;\r\n}\r\n.bigriddles_widget #riddle_solution{\r\n  font-weight:bold;\r\n  margin-top:10px;\r\n}\r\n.bigriddles_widget #riddle_nav{\r\n  padding:3px 5px 3px 5px;\r\n  text-align:center;\r\n}\r\n.bigriddles_widget .riddles_signoff{\r\n  font-size:80%;\r\n}\r\n.bigriddles_widget .horiz_sep{\r\n  width:100%;\r\n  height:1px;\r\n  padding:0px;\r\n  margin:0px;\r\n  border-top:1px solid #003399;\r\n}\r\n.bigriddles_widget .smaller{\r\n  font-size:80%;\r\n}\r\n.bigriddles_widget a{\r\n  color: #003399;\r\n  text-decoration: none;\r\n}\r\n.bigriddles_widget a:visited{\r\n  color: #003399;\r\n  text-decoration: none;\r\n}\r\n.bigriddles_widget td{\r\n  color: black;\r\n}\r\n.bigriddles_widget li{\r\n  color: black;\r\n}\r\n&lt;/style&gt;\r\n\r\n&lt;div class=&#34;smaller&#34; style=&#34;float:left;padding:0px 0px 1px 3px;&#34;&gt;\r\n  &lt;a href=&#34;http://www.bigriddles.com&#34;&gt;\r\n    &lt;img src=&#34;http://www.bigriddles.com/images/icon1.png&#34; style=&#34;border:none;&#34; /&gt;\r\n  &lt;/a&gt;\r\n&lt;/div&gt;\r\n&lt;div class=&#34;smaller&#34; style=&#34;float:left;padding-left:3px;&#34;&gt;\r\n  &lt;a href=&#34;http://www.bigriddles.com&#34;&gt;BigRiddles.com&lt;/a&gt;\r\n&lt;/div&gt;\r\n&lt;div class=&#34;smaller&#34; style=&#34;float:right;padding-right:3px;font-weight:bold;&#34;&gt;\r\n  Riddle of the Day\r\n&lt;/div&gt;\r\n&lt;div style=&#34;clear:both;&#34;&gt;&lt;/div&gt;\r\n\r\n&lt;div class=&#34;horiz_sep&#34;&gt;&lt;/div&gt;\r\n&lt;div id=&#34;riddle_title&#34;&gt;&lt;/div&gt;\r\n\r\n&lt;div id=&#34;riddle_section&#34;&gt;\r\n  &lt;div id=&#34;riddle_image&#34; style=&#34;float:right;&#34;&gt;&lt;/div&gt;\r\n  &lt;div id=&#34;riddle_body&#34;&gt;&lt;/div&gt;\r\n  &lt;div id=&#34;riddle_solution&#34;&gt;&lt;/div&gt;\r\n  &lt;div style=&#34;clear:both;&#34;&gt;&lt;/div&gt;\r\n&lt;/div&gt;\r\n     \r\n&lt;div class=&#34;horiz_sep&#34;&gt;&lt;/div&gt;\r\n\r\n&lt;span class=&#34;smaller&#34;&gt;\r\n  &amp;nbsp;&lt;a href=&#34;http://www.bigriddles.com/widgets&#34;&gt;Get this widget&lt;/a&gt; |\r\n&lt;/span&gt;\r\n  \r\n');
showRiddle(riddle);