A Pen by Tanmay

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

Technologies

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

<head>
  <meta charset="UTF-8">
  <title>A Pen by  Tanmay</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <html lang="en-us">

<head>
  <meta charset="UTF-8">
  <title>Traveltoindia by SugandhaAgrawal</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
  <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen">
  <link rel="stylesheet" type="text/css" href="stylesheets/github-light.css" media="screen">
</head>

<body>
  <section class="page-header">
    <h1 class="project-name">Welcome to India.</h1>
    <p id="message" class="project-tagline">Happy to host you guys !</p>
  </section>
  <section class="main-content">
    <h3 class="mainHeading"> WEDDING CEREMONY AND RECEPTION </h3>
    <p class="mainCity">Indore (Madhya Pradesh)</p>
    <p class="mainDate">DATES - 21st and 22nd January, 2017</p>
    <h3 class="mainHeading">DINNER RECEPTION </h3>
    <p class="mainCity">Kolkata (West Bengal)</p>
    <p class="mainDate">DATE - 25th January, 2017</p>
    <h3 class="mainHeading">ANOTHER DINNER RECEPTION</h3>
    <p class="mainCity">Mumbai (Maharashtra)</p>
    <p class="mainDate">DATE - 29th January, 2017</p>

    <h2> Traveling:</h2>
    <ul>
      <li>International Flights : <a href=http://flug.idealo.de target="_blank">flug.idealo</a></li>
      Return flights from the major cities are cheaper and convenient. Destination Airports in India, in order of preference:
      <ol>
        <li>Mumbai (BOM) - Chatrapati Shivaji International Airport.</li>
        <li>Delhi (DEL) – Indira Gandhi International Airport.</li>
      </ol>

      <li>
        Domestic Flights :
        <ol>
          <li><a href="http://flug.idealo.de" target="_blank"> flug.idealo </a> - Generally cheaper and payment can be made in €.</li>
          <li><a href="https://www.makemytrip.com" target="_blank"> makemytrip </a> - Local Indian webiste</li>
        </ol>
        <p><strong> NOTE : </strong> Please note that the luggage allowance on domestic flights are <strong>only 15 Kg</strong> (for more you will have to pay) and you must reach the airport <strong>at least 2.5 hours</strong> before your flights as there
          are multiple security control.</p>
      </li>

      <li> Domestic Trains: India has the largest rail network in the world and is a good and cheap means of transport for long distances if you book tickets ahead and follow the points below:
        <ul>
          <li> Trains generally have a Sleeper class, 3 tier AC class, 2 tier AC class and 1 tier AC class. </li>
          <li><strong>DO NOT BOOK</strong> in sleeper class.</li>
          <li>The AC classes (3 tier, 2 tier, 1 tier) have comfortable sleeping berths which are good to travel between cities at long distances (Equivalent to German DB city night line CNL). Bed Rolls consisting of Bedsheets, Blanket& Towel are provided
            in Overnight Trains in AC Coaches which are given around 8-9PM and collected back by 6AM.</li>
          <li> A small <a href="https://www.tripadvisor.com/Travel-g293860-c63603/India:Travelling.By.Trains.Booking.Tickets.html" target="_blank"> guide </a> on train traveling</li>
          <li> For guide to booking tickets <a href="http://www.indiamike.com/india-articles/setting-up-your-irctc-and-cleartrip-accounts-for-buying-indian-railways-tickets-from-abroad" target="_blank"> online </a> </li>
          <li> You can look up the connections and consult with us before booking. We would be glad to help you out. </li>
        </ul>
      </li>
    </ul>

    <h2> Hotel Bookings: </h2>
    <ul>
      <p>For the nights of wedding and dinner reception you would be accommodated by us. Websites to book from:</p>
      <li><a href="http://www.booking.com/" target="_blank">Booking.com</a></li>
      <li><a href="https://www.goibibo.com/hotels/" target="_blank">Goibibo</a></li>
      <li><a href="https://www.makemytrip.com/hotels/" target="_blank">MakeMyTrip</a></li>
      <li><a href="http://www.trivago.in/" target="_blank">Trivago</a></li>
      <li><a href="https://www.oyorooms.com/" target="_blank">Oyo Rooms</a></li>
    </ul>

    <h2>Visa for India:</h2>
    <ul>
      <p>Kindly do recheck yourself from <a href="https://www.indianembassy.de/" target="_blank">Indian Embassy Berlin</a>, Generally you require only an e-Visa.
        <ul>
          <li>Advisory : Services of e-Tourist Visa involves completely online application for which no facilitation is required by any intermediary / agents etc. It is advised not to believe or fall in trap of any such unscrupulous elements. For any clarification
            or doubt may contact to <a href="mailto:indiatvoa@gov.in" target="_top">indiatvoa@gov.in</a></li>
          <li> <a href="https://indianvisaonline.gov.in/visa/tvoa.html" target="_blank">Link</a> to apply for the visa</li>
        </ul>
    </ul>

    <h2>Places of Interest:</h2>
    <ul>
      <p> Me and JJ tried to list down famous and personal favourite cities for you. This is simply our recommendation but do feel free to explore more options. If you have questions, feel free to ask</p>
      <p>As per Directions : </p>
      <li> North: Agra, Jaisalmer, Varanasi, Amritsar, Jaipur, Jodhpur, Udaipur, Delhi, Jim Corbett National Park, Ajmer, Bandhavgarh National Park, Indore</li>
      <li> South: Allepy, Munnar, Athirapally, Kottayam </li>
      <li> East: Kolkata </li>
      <li> West: Mumbai, Goa </li>


      <p>Cities :</p>
      <table>
        <tr class="cityImages">
          <th> Cities </th>
          <th> Relevant Details </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>AGRA</p>
            <img src="Images/Agra.jpg" class="cityImages">
          </th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Agra,+Uttar+Pradesh,+India/@24.1295558,77.5624076,5z/data=!4m5!3m4!1s0x39740d857c2f41d9:0x784aef38a9523b42!8m2!3d27.1766701!4d78.0080745" target="_blank">Map</a></li>
              <li><a href="http://uptourism.gov.in/pages/top/explore/top-explore-agra---fatehpur-sikri" target="_blank">Tourism Overview</a></li>
              <li><a href="http://www.tajmahal.gov.in/home.html " target="_blank">Official Taj Mahal website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>JAISALMER</p>
            <img src="Images/Jaisalmer.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Jaisalmer,+Rajasthan+345001,+India/@26.9035776,61.9298867,5z/data=!4m5!3m4!1s0x3947bc28aa1b396b:0xf5ef9bd660d66ee3!8m2!3d26.9157487!4d70.9083443" target="_blank">Map</a></li>
              <li><a href="http://tourism.rajasthan.gov.in/jaisalmer" target="_blank">Tourism Overview website</a></li>
          </th>
          </ul>
        </tr>
        <tr class="cityImages">
          <th>
            <p>JAIPUR</p>
            <img src="Images/Jaipur.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Jaipur,+Rajasthan,+India/@23.6903003,79.8755809,5.25z/data=!4m5!3m4!1s0x396c4adf4c57e281:0xce1c63a0cf22e09!8m2!3d26.9124336!4d75.7872709" target="_blank">Map</a></li>
              <li><a href="http://tourism.rajasthan.gov.in/jaipur" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>JODHPUR</p>
            <img src="Images/Jodhpur.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Jodhpur,+Rajasthan+342008,+India/@23.1069441,76.5430655,5.5z/data=!4m5!3m4!1s0x39418c4eaa06ccb9:0x8114ea5b0ae1abb8!8m2!3d26.2389469!4d73.0243094" target="_blank">Map</a></li>
              <li><a href="http://tourism.rajasthan.gov.in/jodhpur " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>UDAIPUR</p>
            <img src="Images/Udaipur.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Udaipur,+Rajasthan+313001,+India/@23.0465379,79.3692158,5.46z/data=!4m5!3m4!1s0x3967e56550a14411:0xdbd8c28455b868b0!8m2!3d24.585445!4d73.712479" target="_blank">Map</a></li>
              <li><a href="http://tourism.rajasthan.gov.in/udaipur " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>AMRITSAR</p>
            <img src="Images/Amritsar.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Amritsar,+Punjab+143001,+India/@23.7035351,78.0345794,5.25z/data=!4m5!3m4!1s0x391964aa569e7355:0xeea2605bee84ef7d!8m2!3d31.6339793!4d74.8722642" target="_blank">Map</a></li>
              <li><a href="https://www.lonelyplanet.com/a/india/amritsar/pois/sights/places/356445 " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>VARANASI</p>
            <img src="Images/Varanasi.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Varanasi,+Uttar+Pradesh,+India/@23.8892946,73.1369725,5.5z/data=!4m5!3m4!1s0x398e2db76febcf4d:0x68131710853ff0b5!8m2!3d25.3176452!4d82.9739144" target="_blank">Map</a></li>
              <li><a href="http://uptourism.gov.in/pages/top/explore/top-explore-varanasi---sarnath" target="_blank">Tourism Overview website</a></li>
              <li><a href="http://www.roobaroowalks.com" target="_blank">Recommended</a> Cultural tour (we personally know them)</li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>AJMER</p>
            <img src="Images/Ajmer.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Ajmer,+Rajasthan+305001,+India/@22.931488,76.9173697,5.5z/data=!4m5!3m4!1s0x396be6d8fcb7cd01:0xcbaf8f12eb8100ee!8m2!3d26.4498954!4d74.6399163" target="_blank">Map</a></li>
              <li><a href="http://tourism.rajasthan.gov.in/ajmer" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>DELHI</p>
            <img src="Images/Delhi.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/New+Delhi,+Delhi+110001,+India/@22.1865266,76.5035423,5.5z/data=!4m5!3m4!1s0x390cfd5b347eb62d:0x52c2b7494e204dce!8m2!3d28.6139391!4d77.2090212" target="_blank">Map</a></li>
              <li><a href="http://www.delhitourism.gov.in/delhitourism/index.jsp " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>Jim Corbett National Park</p>
            <img src="Images/Jim.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Jim+Corbett+National+Park/@24.125875,75.0591071,5.25z/data=!4m5!3m4!1s0x390a24ffffffffff:0x3017b72d3d253fd7!8m2!3d29.5300138!4d78.7746603" target="_blank">Map</a></li>
              <li><a href="http://www.corbettnationalpark.in/" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>Bandhavgarh National Park</p>
            <img src="Images/Bandhavgarh.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Bandhavgarh+National+Park/@22.9827428,78.465297,5.46z/data=!4m5!3m4!1s0x3986a51baaa621f7:0x2fb463e727f1edee!8m2!3d23.722454!4d81.024219" target="_blank">Map</a></li>
              <li><a href="http://www.mptourism.com/tourist-destinations/bandhavgarh.html" target="_blank">Tourism Overview website</a></li>
              <li><a href="http://www.treehousehideaway.com/ " target="_blank">Recommended Stay</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>KOLKATA</p>
            <img src="Images/Kolkata.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Kolkata,+West+Bengal+700001,+India/@23.2613276,78.1508484,5.5z/data=!4m5!3m4!1s0x39f882db4908f667:0x43e330e68f6c2cbc!8m2!3d22.572646!4d88.363895" target="_blank">Map</a></li>
              <li><a href="http://www.wbtourism.gov.in/guest/home.php" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>INDORE</p>
            <img src="Images/Indore.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Indore,+Madhya+Pradesh+452001,+India/@21.703832,80.7675652,5.5z/data=!4m5!3m4!1s0x3962fcad1b410ddb:0x96ec4da356240f4!8m2!3d22.7195687!4d75.8577258" target="_blank">Map</a></li>
              <li><a href="http://www.mptourism.com/tourist-destinations/places-to-visit-in-indore.html" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>MUMBAI</p>
            <img src="Images/Mumbai.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Mumbai,+Maharashtra,+India/@22.9316504,75.9866152,5.46z/data=!4m5!3m4!1s0x3be7c6306644edc1:0x5da4ed8f8d648c69!8m2!3d19.0759837!4d72.8776559" target="_blank">Map</a></li>
              <li><a href="http://goindia.about.com/od/whattosee/tp/mumbai-top-attractions.htm" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>GOA</p>
            <img src="Images/Goa.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Goa,+India/@22.8518077,75.7848492,5.5z/data=!4m5!3m4!1s0x3bbfba106336b741:0xeaf887ff62f34092!8m2!3d15.2993265!4d74.123996" target="_blank">Map</a></li>
              <li><a href="https://www.theguardian.com/travel/2015/jan/31/holiday-guide-goa-best-restaurants-hotels-beaches " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>ALLEPY</p>
            <img src="Images/Allepy.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Alappuzha,+Kerala+688011,+India/@23.8239468,78.4067946,5.25z/data=!4m5!3m4!1s0x3b0884f1aa296b61:0xb84764552c41f85a!8m2!3d9.4980667!4d76.3388484" target="_blank">Map</a></li>
              <li><a href="https://www.keralatourism.org/destination/alappuzha-beach/60/" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>MUNNAR</p>
            <img src="Images/Munnar.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Munnar,+Kerala+685612,+India/@22.881348,78.4630053,5.5z/data=!4m5!3m4!1s0x3b0799794d099a6d:0x63250e5553c7e0c!8m2!3d10.0889333!4d77.0595248" target="_blank">Map</a></li>
              <li><a href="https://www.keralatourism.org/destination/munnar/202" target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>ATHIRAPALLY</p>
            <img src="Images/Athirapally.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Athirappilly,+Vettilappara,+Pariyaram,+Kerala+680724,+India/@22.4791497,78.5073441,5.5z/data=!4m5!3m4!1s0x3b07ff02bf6d87a5:0x5cffa858845b2c6e!8m2!3d10.2907988!4d76.5155834" target="_blank">Map</a></li>
              <li><a href="http://www.athirappally.com/ " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
        <tr class="cityImages">
          <th>
            <p>KOTTAYAM</p>
            <img src="Images/Kottayam.jpg" class="cityImages"></th>
          <th>
            <ul>
              <li><a href="https://www.google.de/maps/place/Kottayam,+Kerala+686001,+India/@22.4760229,77.0868174,5.5z/data=!4m5!3m4!1s0x3b062ba16c6b435f:0xbe2b02f68f8dd06e!8m2!3d9.5915668!4d76.5221531" target="_blank">Map</a></li>
              <li><a href="https://www.tripadvisor.de/ShowUserReviews-g297634-d1071431-r117216237-Athreya_Ayurvedic_Resort-Kottayam_Kerala.html " target="_blank">Tourism Overview website</a></li>
            </ul>
          </th>
        </tr>
      </table>
    </ul>
  </section>
</body>
<footer class="site-footer">
  <span class="site-footer-owner"><a href="https://github.com/SugandhaAgrawal/TravelToIndia">Traveltoindia</a> is maintained by <a href="https://github.com/SugandhaAgrawal">SugandhaAgrawal</a>.</span>
</footer>

</html>
  
  

</body>

</html>

/*Downloaded from https://www.codeseek.co/tanmay7270/a-pen-by-tanmay-bgVKrN */
@import url(https://fonts.googleapis.com/css?family=Dancing+Script|Ubuntu|Roboto+Mono|Gochi+Hand|Roboto:400,700);
* {
  box-sizing: border-box;
}

body {
  padding: 0;
  margin: 0;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #000000;
}

a {
  color: #1e6bb8;
  font-weight: bold;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

.btn {
  display: inline-block;
  margin-bottom: 1rem;
  color: rgba(255, 255, 255, 0.7);
  background-color: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  border-style: solid;
  border-width: 1px;
  border-radius: 0.3rem;
  transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}

.btn + .btn {
  margin-left: 1rem;
}

.btn:hover {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  background-color: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.3);
}

@media screen and (min-width: 64em) {
  .btn {
    padding: 0.75rem 1rem;
  }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
  .btn {
    padding: 0.6rem 0.9rem;
    font-size: 0.9rem;
  }
}

@media screen and (max-width: 42em) {
  .btn {
    display: block;
    width: 100%;
    padding: 0.75rem;
    font-size: 0.9rem;
  }
  .btn + .btn {
    margin-top: 1rem;
    margin-left: 0;
  }
}

.page-header {
  color: #fff;
  text-align: center;
  background-color: #159957;
  background-image: linear-gradient(120deg, #155799, #159957);
}

@media screen and (min-width: 64em) {
  .page-header {
    padding: 5rem 6rem;
  }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
  .page-header {
    padding: 3rem 4rem;
  }
}

@media screen and (max-width: 42em) {
  .page-header {
    padding: 2rem 1rem;
  }
}

.project-name {
  margin-top: 70px;
  margin-bottom: 0.1rem;
  color: #000000;
}

@media screen and (min-width: 64em) {
  .project-name {
    font-size: 3.25rem;
  }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
  .project-name {
    font-size: 2.25rem;
  }
}

@media screen and (max-width: 42em) {
  .project-name {
    font-size: 1.75rem;
  }
}

.project-tagline {
  margin-bottom: 2rem;
  font-weight: normal;
  opacity: 0.7;
  margin-top: 10px;
  color: #000000;
}

@media screen and (min-width: 64em) {
  .project-tagline {
    font-size: 1.25rem;
  }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
  .project-tagline {
    font-size: 1.15rem;
  }
}

@media screen and (max-width: 42em) {
  .project-tagline {
    font-size: 1rem;
  }
}

.main-content:first-child {
  margin-top: 0;
}

.main-content img {
  max-width: 100%;
}

.main-content h1,
.main-content h2,
.main-content h3,
.main-content h4,
.main-content h5,
.main-content h6 {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-weight: normal;
  color: #159957;
}

.main-content p {
  margin-bottom: 1em;
}

.main-content code {
  padding: 2px 4px;
  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
  font-size: 0.9rem;
  color: #383e41;
  background-color: #f3f6fa;
  border-radius: 0.3rem;
}

.main-content pre {
  padding: 0.8rem;
  margin-top: 0;
  margin-bottom: 1rem;
  font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
  color: #567482;
  word-wrap: normal;
  background-color: #f3f6fa;
  border: solid 1px #dce6f0;
  border-radius: 0.3rem;
}

.main-content pre > code {
  padding: 0;
  margin: 0;
  font-size: 0.9rem;
  color: #567482;
  word-break: normal;
  white-space: pre;
  background: transparent;
  border: 0;
}

.main-content .highlight {
  margin-bottom: 1rem;
}

.main-content .highlight pre {
  margin-bottom: 0;
  word-break: normal;
}

.main-content .highlight pre,
.main-content pre {
  padding: 0.8rem;
  overflow: auto;
  font-size: 0.9rem;
  line-height: 1.45;
  border-radius: 0.3rem;
}

.main-content pre code,
.main-content pre tt {
  display: inline;
  max-width: initial;
  padding: 0;
  margin: 0;
  overflow: initial;
  line-height: inherit;
  word-wrap: normal;
  background-color: transparent;
  border: 0;
}

.main-content pre code:before,
.main-content pre code:after,
.main-content pre tt:before,
.main-content pre tt:after {
  content: normal;
}

.main-content ul,
.main-content ol {
  margin-top: 0;
}

.main-content blockquote {
  padding: 0 1rem;
  margin-left: 0;
  color: #819198;
  border-left: 0.3rem solid #dce6f0;
}

.main-content blockquote >:first-child {
  margin-top: 0;
}

.main-content blockquote >:last-child {
  margin-bottom: 0;
}

.main-content table {
  /*display: block;*/
  width: 100%;
  overflow: auto;
  word-break: normal;
  word-break: keep-all;
}

.main-content table th {
  font-weight: bold;
}

.main-content table th,
.main-content table td {
  padding: 0.5rem 1rem;
  border: 1px solid #e9ebec;
}

.main-content dl {
  padding: 0;
}

.main-content dl dt {
  padding: 0;
  margin-top: 1rem;
  font-size: 1rem;
  font-weight: bold;
}

.main-content dl dd {
  padding: 0;
  margin-bottom: 1rem;
}

.main-content hr {
  height: 2px;
  padding: 0;
  margin: 1rem 0;
  background-color: #eff0f1;
  border: 0;
}

@media screen and (min-width: 64em) {
  .main-content {
    max-width: 64rem;
    padding: 2rem 6rem;
    margin: 0 auto;
    font-size: 1.1rem;
  }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
  .main-content {
    padding: 2rem 4rem;
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 42em) {
  .main-content {
    padding: 2rem 1rem;
    font-size: 1rem;
  }
}

.site-footer {
  padding-top: 2rem;
  margin-top: 2rem;
  border-top: solid 1px #eff0f1;
}

.site-footer-owner {
  display: block;
  font-weight: bold;
}

.site-footer-credits {
  color: #819198;
}

@media screen and (min-width: 64em) {
  .site-footer {
    font-size: 1rem;
  }
}

@media screen and (min-width: 42em) and (max-width: 64em) {
  .site-footer {
    font-size: 1rem;
  }
}

@media screen and (max-width: 42em) {
  .site-footer {
    font-size: 0.9rem;
  }
}


/*By Me*/

.cityImages {
  border: black solid 2px;
  max-width: 100%;
  max-height: 100%;
}

h3.mainHeading,
.mainDate,
.mainCity {
  text-align: center;
  font-weight: bold;
}

.mainDate,
.mainCity {
  color: red;
}

.page-header {
  background-image: url("http://www.newhdwallpapers.in/wp-content/uploads/2014/02/Holi-India-Colorful-Wallpaper.jpg");
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  height: 100%;
}

body {
  background-color: #FFB56D;
}

h1 {
  font-family: 'Roboto Mono', monospace;
}

#message {
  font-family: 'Dancing Script', cursive;
  font-size: 210%;
  font-weight: 700;
}

h2 {
  font-family: 'Gochi Hand', cursive;
  font-size: 170%;
}

h3 {
  font-family: "Ubuntu", sans-serif;
  font-size: 150%;
}

Comments