Pen Settings



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


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


Add Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import or require. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.


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.

Editor Settings

Code Indentation

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

Visit your global Editor Settings.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

              <div class="container text-center">
  <h1>A Tribute to Joe Sutter (1921-2016)</h1>
  <h3><i>"Father of the Boeing 747"</i></h3>
		<img src="">
			Joe Sutter (left), with Lufthansa representatives at a Boeing ceremony.<br>&copy;<a href="" target="_blank">
			Addison Schonland</a>
			under <a href="" target="_blank">Creative Commons</a> Attribution - Non-Commercial 2.0 Generic License
    If you are an aviation enthusiast like me, or even if you have remotely come across an aviation article here and there in your life, chances are pretty good
    that you already know whom this page is about. For those of you who do not, just a mention of the iconic "Jumbo Jet" - the Boeing 747 - will probably relate to
		you quite well. It is after all, the most-recognized airliner in service, even today. That airplane is the reason I got fascinated by, and introduced to the
		world of aviation. It also helped me transition from a nervous-nelly of a passenger as a kid, to a bonafide aviation nut, as it were. Joseph Frederick "Joe" Sutter is of course,
		most famous for spearheading the engineering and design team (collectively known as "The Incredibles") that conceived the Boeing 747.
		As synonymous as Joe Sutter is with Boeing, it is quite interesting to think about the "what if" scenario when Mr. Sutter was offered a job at Douglas Aircraft Corporation, soon after returning from his service in the Navy in WW II. He declined the opportunity when his wife, Nancy gave birth to their first child, in their hometown of Seattle, Washington. He remained in Seattle and accepted a temporary position with Boeing. He had the great opportunity of working on Boeing's early jetliners, and assisting the company's senior engineers made a lasting impression on him. Not surprisingly, Mr. Sutter became a mainstay at Boeing. He worked intensively on the Boeing 707, 727 and 737, attaining the position of Chief of Technology on the 727. On the 737, his idea of attaching turbofan engines closely underneath the wings received a U.S. patent.
		But it was his leadership and his engineering team's work on the Boeing 747 that put him in the top echelon of the company's engineers. In a span of 29 months, "The Incredibles", a team of 4,500 engineers crafted the first, true widebody passenger plane, with a 20-foot-wide fuselage and a length more than 1.5 times that of its predecessor, the 707. Mr. Sutter was also a champion for his engineering team, showing an all-out support for each and every one of them in a meeting with Boeing executives. They were contemplating cutting the team by 1,000 personnel to reduce development costs. Mr. Sutter insisted that reducing the team would "ruin the program." After the meeting ended, he thought for sure he would be fired. All engineers, including Mr. Sutter, retained their jobs. His efforts would be vindicated when in a span of little more than two years, the first 747 with the registration of "N7470" was rolled out of the hangar at Boeing's main facility at Paine Field in Everett, Washington. It took to the skies effortlessly and made history. It was a record-setting feat, and for the first time, made travel more affordable and accessible to the masses.
		<img src="">
			A Lufthansa Boeing 747-400 at a gate at the Frankfurt am Main International Airport, Lufthansa's main hub.
			&copy;<a href="" target="_blank"> CoderAJ7470</a>
		I remember my first time flying in the 747 (well, at least the first vivid memory I have of flying in it - I had been a passenger in this plane a few times prior according to my mom but was too young to retain those experiences, and at that time, probably too young to have any interest in aviation whatsoever). It was an Air India 747-200, one of the early "Classic" variants. To an 8-yr-old, experiencing it for the first time, everything about it seemed humongous. It almost seemed other-worldly with its tall, almost-flat cabin walls and high ceiling, even in economy class with its 10-across configuration. And those huge wings... meticulously designed to sweep through the air yet flexible enough to flap like those of a bird's. And how about those four large turbofans, with enough thrust to pin you to your seat once commanded to by the pilot flying, yet careful not to let you know in the slightest the 500+ mph with which you were covering ground. "How does this huge thing manage to even get airborne?", I thought to myself. That question was answered when the plane, with its more than 400 passengers and gargantuan wings lifted off effortlessly from Mumbai International Airport bound for London Heathrow, where I marvelled at a plethora of other 747s from several dozen other countries. With subsequent flights in the 747, my nervousness turned into excitement whenever an opportunity came around to go flying. I began reading with intense interest books and articles on anything related to aviation, but more particularly, the commercial side of it. I had officially caught the aviation bug.
		I have been quite blessed in the thirty-plus years of my life so far to experience flying in not just one, but three variants of the 747: the -100, -200 and -400. The 100 Short Range (-100SR), -300, Special Performance (SP), -400 Domestic (400D), as well as Air Force One, the NASA Space Shuttle carrier, not to mention the Freighter version, other purpose-built 747s and last but not least, the variant -8 round up the wide versatality of the Jumbo. It is a testament to the work done by "The Incredibles."
		It would be an understatement to say that even today, I get excited when the opportunity comes along to step onboard a 747, and I look forward to the day when I get the opportunity to fly in the 747-8 Intercontinental, the longest passenger plane in the world. Everything about it is a delight for the senses of any aviation enthusiast, especially for me since it is my favourite aircraft.
		It is that enthusiasm for the 747 that began my fascination with aviation and made me appreciate the enormous effort that went into its production. The thousands of man-hours that were poured into the first production 747, the variant -100, bore the fruits of hard work and engineering prowess that has resulted in more than 1,500 747s being built.
		Long after the first 747 took to the skies, Joe Sutter continued working at Boeing and became an ambassador for the Boeing Company and the 747 program. However, his expertise was far-reaching. Such was his reputation that President Ronald Reagan appointed him to the Rogers Commission in 1986, a committee created to investigate the Space Shuttle Challenger accident.
		Joe Sutter passed away at age 95 in 2016. He worked on behalf of Boeing till almost the very end, actively promoting the 747 program. He regularly hosted "Boeing Parties" for executives of various airlines at his summer compound on Hood Canal, the most recent of which was in August 2016, about a month before his passing. This particular party was hosted for executives of Cathay Pacific, who had just taken delivery of none other than a brand-new Boeing 747. He left quite a legacy, not only at Boeing but in aviation circles worldwide. No doubt, he will forever be remembered as "The Father of the 747".
	<p id="quote">
		<span>Boeing President and CEO, Ray Conner:</span>
		"Joe was like one of those legendary generals we read about who lead with authority, intelligence and compassion. A leader who inspires so much respect, his troops always fight a little harder, take on the toughest missions, stand straighter and walk with more confidence in his presence."
	<p id="moreInfo">
		If you would like to read more about Joe Sutter, please visit his <a href="" target="_blank">Wikipedia entry</a>.	
	<div id="credits">
		<a href="" target="_blank">New York Times</a>
		<a href="" target="_blank">
			Seattle Times</a>
		<a href="" target="_blank">
			Puget Sound Business Journal</a>
              body { padding-left: 15px;
			 padding-right: 15px; }

.container { margin-top: 30px;
						 margin-bottom: 40px; }

h1 { font-size: 48px; }

h3 { margin-bottom: 50px;
		 font-size: 32px; }

img { width: 100%;
			height: auto; }

figcaption { margin-top: 15px;
						 margin-bottom: 30px;
						 font-style: italic; }

p { font-size: 20px;
		line-height: 30px;
		text-align: left;
		margin-bottom: 25px; }

#quote { font-weight: bold;
				 font-size: 24px;
				 font-style: italic;
				 font-family: Times New Roman;
				 background-color: #DDD;
				 padding: 25px;
				 border-radius: 20px; }

#moreInfo { font-style: italic; }

hr { color: #000;
		 height: 10px; }

#credits a { display: block;
						 margin-top: 5px; }

@media screen and (max-width: 500px){
	h1 { font-size: 40px; }
	h3 { font-size: 24px; }
	figcaption { font-size: 12px; }
	p { font-size: 16px; }
	#quote { font-size: 20px; }