Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

JavaScript

Babel is required to process package imports. If you need a different preprocessor remove all packages first.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <head>
  <link href="https://fonts.googleapis.com/css?family=Lobster&subset=all" rel="stylesheet" type="text/css">
  <link href="https://fonts.googleapis.com/css?family=Indie+Flower" rel="stylesheet"> 
  <link href="https://fonts.googleapis.com/css?family=Gloria+Hallelujah" rel="stylesheet">
</head>
<div class="container-fluid">
  <h1 class="text-primary text-center"> Robert James Fisher </h1>
  <div class="row">
    <div class="col-xs-4 text-center">
      <img id="pic1" src="http://www.chess-game-strategies.com/images/kqa_chessboard_large-picture_2d.gif" alt="Chess board">
    </div>
    <div class="col-xs-7" id="quote">
  <blockquote> <p>I grew up with the concept of freedom of speech. So I'm too old, it's too late for me to adjust to the new world, the new world order.<br></p>
    <p>"Interview en-route to Iceland, March 24, 2005" </p> </blockquote>
    </div>
  </div>
  <hr>
<div class="row">
  <div class="col-xs-6" id="left-column">
    <div class="well">
       <div class="row">
    <div class="col-xs-12">
    <button type="button" class="btn btn-default btn-block" id="hideShow1"> Shortly about </button>
    </div>
    <div class="col-xs-12">
    <button type="button" class="btn btn-default btn-block" id="hideShow2"> Biography </button>
    </div>
         <div class="col-xs-12">
    <button type="button" class="btn btn-default btn-block" id="hideShow3">Interesting facts</button><hr>
    </div>
         
         <div class="more text-center">
           <p>Read more about this genious chess player:</p>
           <a href= "https://en.wikipedia.org/wiki/Bobby_Fischer" target="_blank"> <p> Wikipedia entry </p></a>
         </div>
  </div>
    </div>
  </div>
  <div class="col-xs-6">
    <div class="well text-center" id="right-column">
    </div>
  </div>
  </div>
  <div id="info" class="well">
    <div id="info1" hidden> 
      <ul>
        <li>Full name: Robert James Fisher</li>
        <li>Country: United States, Iceland (2005 - 2008)</li>
        <li>Born: March 9, 1943. Chicago, Illinois, US</li>
        <li>Died: January 17, 2008 (aged 64). Reykjavík, Iceland</li>
        <li>Title: Grandmaster (1958)</li>
        <li>World champion: 1972–1975</li>
        <li>Peak rating: 2782 (July, 1972)</li>
      </ul>
    </div>
    <div id="info2" hidden> 
      <div class="textbox">
        <br> <b>Synopsis</b>
        <br>
Bobby Fischer was born on March 9, 1943, in Chicago, Illinois. Fischer first learned the game of chess at age 6 and eventually became the youngest international grand master at the age of 15. In 1972, he became the first American-born world chess champion after defeating Boris Spassky. An eccentric genius, who was believed to have an I.Q. of 181, Fischer became known for his controversial public remarks in his later years. He was granted Icelandic citizenship in 2005, following legal trouble with the United States. He died on January 17, 2008.
<br><br>
        <b>Early Life</b>
<br>
Robert James Fischer was born in Chicago, Illinois, on March 9, 1943. Fischer's parents divorced when he was a toddler, and he began learning chess at the age of 6 after his older sister Joan bought him a chess set. He continued to hone his skills as a youngster at the Brooklyn Chess Club and Manhattan Chess Club. Fischer had a strained relationship with his mother, who supported his chess endeavors, but preferred that he pursue other areas of interest.
<br>
A brilliant, highly competitive player who lost himself in the game, Fischer earned a place in the record books at age 14 when he became the youngest player to win the U.S. Chess Championship. Then in 1958, at 15, he became the youngest international grand master in history by winning the related tournament in Portoroz, Yugoslavia (now Slovenia). 
<br><br>
        <b>Match of the Century</b>
<br>
During the early 1960s, Fischer continued to be involved in U.S. and world championship matches, but was also making a name for himself with his erratic, paranoid commentary. After having a 20-game winning streak in the early 1970s, Fischer once again made chess history in 1972 with his defeat of the Soviet Union's Boris Spassky at the Reykjavik, Iceland world championships, thus marking the first time an American chess player had won the title. Fischer's defeat of a Soviet opponent, which became known as the "Match of the Century," took on iconic proportions in the midst of the Cold War and was seen as a symbolic victory of democracy over Communism. Fischer's historic win also made chess a popular game in the United States. 
<br><br>
        <b>Controversial Figure</b>
<br>
Despite his global popularity, Fischer's controversial behavior continued to make headlines. In the mid-1970s he refused to play Anatoly Karpov, the challenger to his title, and was thus stripped of his championship by the International Chess Federation. Fischer was reportedly homeless for a time in the Los Angeles area, becoming involved with a fringe church. He also became known for making anti-Semitic remarks despite the fact that his mother was Jewish.  
<br>
On the 20th anniversary of the famed Fischer/Spassky game, the two met again in 1992 to play a $5 million rematch in Yugoslavia, although travel to the country by American citizens was illegal at the time. Fischer continued to live abroad for several years to avoid facing criminal charges in the U.S., during which time he continued his anti-Semitic diatribes, and on a radio broadcast he celebrated the 9/11 attacks on the World Trade Center. 
<br>
In July 2004, Fischer was detained at a Japanese airport for trying to leave the country with an invalid passport and he was jailed for several months. He was eventually granted citizenship by Iceland and moved there in 2005. 
<br>
Bobby Fischer died of kidney failure on January 17, 2008, in Reykjavík, Iceland. Miyoko Watai, a Japanese women's chess champion and general secretary of the Japanese Chess Federation, claimed that she had married Fischer in 2004, although the validity of their marriage was questioned. Another woman claimed that she had a daughter with Fischer. His body was exhumed to be DNA tested, and the claim of paternity was found to be false. In 2011, an Icelandic court ruled that Watai was Fischer's widow and the sole heir to his estate. 
<br><br>
        <b>Books and Films on Fischer's Life</b>
<br>
Several books and films have been made about Fischer's life and career. Fischer himself published works like Bobby Fischer Teaches Chess (1966) and My 60 Memorable Games (1969), while biographies on the icon include Endgame: Bobby Fischer's Remarkable Rise and Fall... by Frank Brady (2011), Fischer's childhood friend. The documentary Bobby Fischer Against the World, directed by Liz Garbus, was released in 2011. 
<br>
Pawn Sacrifice, a film that focuses on Fischer's chess matches and the psychology of his troubled genius, premiered at the Toronto International Film Festival in September 2014 and was released in U.S. theaters a year later. Directed by Edward Zwick, actor Tobey Maguire played the role of Fischer, with Liev Schreiber portraying Spassky.
<br><br>
        <a href="  http://www.biography.com/people/bobby-fischer-9295608" target="_blank"><b>Primary source</b> </a>
      </div>
    </div>
    <div id="info3" hidden>
      <ol>
        <li>Bobby Fischer had an IQ of 187 as well as a photographic memory</li>
        <li>At an age of only 13 years old, Bobby played the so-called duel of the century against Donald Byrne and became youngest Junior Champions of all time</li>
        <li>At 14 years old (1958) he became US Champion for the first time – as the youngest player ever</li>
        <li>At 15 Bobby Fischer was announced youngest Chess Grandmaster and World Championship candidate</li>
        <li>Fischer left school as early as possible (at 16 years), as he considered school lessons a waste of time. Instead, he taught himself several foreign languages in order to be able to read foreign publications</li>
        <li>Fischer became the first official player with No. 1 Ranking (FIDE) in 1971 and held this position for 54 months</li>
        <li>With the worldwide biggest interest, the public followed the match of Bobby Fischer and Boris Spassky (so-called “Third World Confrontation”) in 1972 in which Fischer gained the World Championship title in Reykjavik</li>
        <li>In 1975, Fischer was supposed to defend his World Championship title from challenger Anatoli Karpov. This duel was never carried out, as the FIDE was not able to meet Fischer’s 179 (!!) requirements that differed from the usual set of rules for tournaments. Fischer’s title was therefore denied by the FIDE</li>
        <li>After the World Championship tournament in 1972, Bobby Fischer did not play chess in public for about 20 years.</li>
        <li>Fischer held Icelandic citizenship and spent the last few years prior to his death (17.01.2008) withdrawn in Reykjavik</li>
      </ol>
    </div>
 
  </div>
              
            
!

CSS

              
                body {
  margin: 20px;
  border: 1px solid black;
  box-shadow: black 2px 2px 6px;
  font-family: "Times New Roman", Arial;
}

.container-fluid {
    background-color: #FDF5E6;
}

blockquote {
  font-size: 18px;
  font-family: 'Indie Flower';
  box-shadow: 1px 1px 5px black;
  background-color: #ffe6e6;
}

p {
  text-indent: 20px;
}

#pic1 {
  width: 200px;
  height: 200px;
  border-radius: 10px;
  box-shadow: black 10px 10px 12px;
} 

#right-column {
  height: 250px;
  background: url("https://i.telegraph.co.uk/multimedia/archive/01868/chess1_1868066b.jpg");
  background-size: 100%;
  
}

hr {
  border-style: inset;
}

h1 {
  font-family: Lobster, "Times New Roman", Arial;
  text-shadow: 1.2px 0.2px 0.4px black;
}

.more {
  font-size: 16px;
  font-family: 'Gloria Hallelujah', cursive;
}

#quote {
  margin: 25px 10px;
}

b {
  font-size: 2em;
}

a {
  color: green;
  text-align: right;
}

#info1 {
  font-size: 1.4em;
  font-family: Lobster, "Times New Roman";
}

#info3 {
  font-size: 1.2em;
}
ul li {
  list-style-type: none;
}
              
            
!

JS

              
                var sources = [
  {
    source : "https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSpy7VyrN_aw-m5wV8ddJUzIjIExLvry0hT5fslspcwMtyT5C34FA"
  }, 
  {
    source: "http://chess-news.ru/sites/default/files/u5/Foto-raznoe/Sosonko/Fisher-3/Fischer-57.jpg"
  },
{
  source: "http://www.chesshistory.com/winter/extra/pics/fischer32.jpg"
},
{
  source: "http://www.worldchesshof.org/uploads/2011/09/02/bobbyfischer-qdr.jpg"
}];
$(document).ready(function() {
  time = setInterval(function(){
    var img_index = Math.floor((Math.random()*sources.length) + 1);
    $("#right-column").css('background-image', 'url('+ sources[img_index].source +')');
  }, 7000);
  $("#hideShow1").click(function(){
    $("#info2").hide();
    $("#info3").hide();
    $("#info1").slideToggle(250);
  });
  $("#hideShow2").click(function(){
    $("#info1").hide();
    $("#info3").hide();
    $("#info2").slideToggle(250);
  });
  $("#hideShow3").click(function(){
    $("#info1").hide();
    $("#info2").hide();
    $("#info3").slideToggle(250);
  });
});
              
            
!
999px

Console