A Pen by Canmert

This awesome code was written by canmertc, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright canmertc ©


  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

  <meta charset="UTF-8">
  <title>A Pen by  Canmert</title>
  <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'>

      <link rel="stylesheet" href="css/style.css">



  <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Condiment" rel="stylesheet">

<div class="container-fluid div-1">

<div class="well">
  <h1 class="text-center" style="font-weight:bold">Mustafa Kemal Ataturk</h1>
  <h3 class="text-center" id="sub-text">" Founder of the Republic of Turkey"</h3>
<img class="border-img first-img-class" src="https://upload.wikimedia.org/wikipedia/en/4/44/Ataturk_attends_a_university_class.jpg" alt="ataturk-at-university-class"></img>
  <div class="content-text well">
    <p>Mustafa Kemal Atatürk (pronounced [mustäˈfä ceˈmäl äˈtäˌtyɾc]; 19 May 1881 (conventional) – 10 November 1938) was a Turkish army officer, revolutionary, and founder of the Republic of Turkey, serving as its first President from 1923 until his death in 1938. His surname, Atatürk (meaning "Father of the Turks"), was granted to him in 1934 and forbidden to any other person by the Turkish parliament.

Atatürk was a military officer during World War I.Following the defeat of the Ottoman Empire in World War I, he led the Turkish National Movement in the Turkish War of Independence. Having established a provisional government in Ankara, he defeated the forces sent by the Allies, eventually leading to victory in the Turkish War of Independence. Atatürk then embarked upon a program of political, economic, and cultural reforms, seeking to transform the former Ottoman Empire into a modern and secular nation-state. Under his leadership, thousands of new schools were built, primary education was made free and compulsory, and women were given equal civil and political rights, while the burden of taxation on peasants was reduced. His government also carried out an extensive policy of Turkification. The principles of Atatürk's reforms, upon which modern Turkey was established, are referred to as Kemalism. His achievements in Turkey are an enduring monument to Atatürk.</p>
  <div class="row">
    <div class="col-xs-3 well">
      <img class="img-class" src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/fe/Mustafa_Kemal_Ataturk_Reforma_Mex_D.F.jpg/1280px-Mustafa_Kemal_Ataturk_Reforma_Mex_D.F.jpg" alt="Monument to Ataturk on Paseo de la Reforma in Mexico City">
      <p>Monument to Ataturk on Paseo de la Reforma in Mexico City</p>
    <div class="col-xs-6 well">
      <h3 class="second-title">Legacy to World</h3>
      <p class="content-text">Mustafa Kemal Atatürk is commemorated by many memorials throughout Turkey, such as the Atatürk International Airport in Istanbul, the Atatürk Bridge over the Golden Horn (Haliç), the Atatürk Dam, and Atatürk Stadium. Atatürk statues have been erected in all Turkish cities by Turkish Government, and most towns have their own memorial to him. His face and name are seen and heard everywhere in Turkey; his portrait can be seen in all public buildings, in all schools and classrooms, on all school books, on all Turkish lira banknotes, and in the homes of many Turkish families. At the exact time of his death, on every 10 November, at 09:05 am, most vehicles and people in the country's streets pause for one minute in remembrance.</p>
      <p class="content-text">In 1981, the centennial of Atatürk's birth, his memory was honoured by the UNO and UNESCO, which declared it The Atatürk Year in the World and adopted the Resolution on the Atatürk Centennial. The Atatürk Memorial in Wellington, New Zealand (which also serves as a memorial to the ANZAC troops who died at Gallipoli); the Atatürk Memorial in the place of honour on Anzac Parade in Canberra, Australia; the Atatürk Forest in Israel; and the Atatürk Square in Rome, Italy, are a few examples. He has roads named after him in several countries, like the Kemal Atatürk Marg in New Delhi, India, Kemal Atatürk Avenue in Dhaka, Bangladesh, the Atatürk Avenue in the heart of Islamabad, Pakistan, the Atatürk Road in the southern city of Larkana in Sindh province of Pakistan, which Atatürk visited in 1923, Mustafa Kemal Atatürk street in the Naco district of Santo Domingo, Dominican Republic, and the street and memorial Atatürk in the Amsterdam-Noord borough of Amsterdam, Netherlands. The entrance to Princess Royal Harbour in Albany, Western Australia is named Atatürk Channel. There are many statues and streets named after Atatürk in Northern Cyprus.</p>
      <a href="https://en.wikipedia.org/wiki/Mustafa_Kemal_Atat%C3%BCrk" type="button" id="read-more-btn" class="btn btn-block readmore-button" src="https://google.com"><span class="glyphicon glyphicon-new-window"></span> Read More...</a>
    <div class="col-xs-3 well">
    <img class="img-class" src="https://upload.wikimedia.org/wikipedia/commons/d/d2/Cumhuriyet_Aniti.JPG" alt="The Republic Monument"></img>
    <p class="text-center">The Republic Monument, Taksim Square in Istanbul</p>

<p class="text-center">Designed by <a href="https://www.freecodecamp.com/canmertc">Canmert</a></p>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js'></script>


    <script  src="js/index.js"></script>



/*Downloaded from https://www.codeseek.co/canmertc/a-pen-by-canmert-qaxxmA */
body {
  background-color: #a3d5d3; 

  margin: 20px 2% 20px 2%;

.img-class {
  width: 100%;

.first-img-class {
    display: block;
    margin: auto;
    width: 40%;

.second-title {
  font-family: Lobster;

.border-img {
  border-style: solid;
  border-width: 5px;
  border-radius: 50%;
  border-color: #01d8d3;
#sub-text {
  font-family: Condiment;
  font-size: 30px;
  color: #01d8d3;
.content-text {
  color: #545454;
  font-size: 16px;

.readmore-button {
  background-color: #01d8d3;
  color: #545454;

/*Downloaded from https://www.codeseek.co/canmertc/a-pen-by-canmert-qaxxmA */
  document.getElementsByTagName("h1")[0].style.fontSize = "50px";
  //document.getElementById("read-more-btn").addClass("animated shake");
  //$("#read-more-btn").addClass("animated bounce");
  //$("#sub-text").addClass("animated bounce");