content: import React from 'react';
  
  import Section from './Section';
  
  import '../css/Components/Event.scss';
  import '../css/Components/ScheduleTable.scss';
  
  const ConferenceSchedule = () => (
    <div className="ConferenceSchedule">
      <Section>
        <div className="ScheduleTable">
          <h2 className="ScheduleTable-header">12</h2>
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">09:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <h3 className="ScheduleTable-columnHeader">
                Theatro Circo<br />Main Room
              </h3>
              <div className="ScheduleTable-cell duration45">
                <p className="Event-text">Check-in</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration15">
                <p className="Event-time">09:45</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration15">
                <p className="Event-text">Opening</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">10:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-heading">{"How to Tell When You're Tired"}</p>
                <p className="Event-text">Frank Chimero</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-time">11:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-text">Coffee Break</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">11:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">
                  The {'<'}svg{'>'} of .svg
                </p>
                <p className="Event-text">Sara Soueidan</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">12:15</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">User Research for Everyone</p>
                <p className="Event-text">Aras Bilgen</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration120">
                <p className="Event-time">13:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration120">
                <p className="Event-text">Lunch</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">15:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">Design for Emotion</p>
                <p className="Event-text">Henry Daubrez</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">15:45</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">Solving Layout Problems with CSS Grid and Friends</p>
                <p className="Event-text">Rachel Andrew</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-time">16:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-text">Coffee Break</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">17:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-heading">A Little Story About A Big Bang Redesign</p>
                <p className="Event-text">Vitaly Friedman</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">18:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-heading">Mirror Quiz</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">19:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <h3 className="ScheduleTable-columnHeader">Barhaus</h3>
  
              <div className="ScheduleTable-cell duration60">
                <p className="Event-heading">MirrorConf Party</p>
              </div>
            </div>
          </div>
        </div>
  
        <div className="ScheduleTable">
          <h2 className="ScheduleTable-header">13</h2>
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column">
              <h3 className="ScheduleTable-columnHeader">
                Theatro Circo<br />Main Room
              </h3>
              <div className="ScheduleTable-cell duration60 filler" />
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">10:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-heading">Designing Beyond the Screen</p>
                <p className="Event-text">Gabriel Valdivia</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-time">11:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-text">Coffee Break</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">11:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">Evaluating Technology</p>
                <p className="Event-text">Jeremy Keith</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">12:15</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">What’s Your Roadmap?</p>
                <p className="Event-text">C. Todd Lombardo</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration120">
                <p className="Event-time">13:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration120">
                <p className="Event-text">Lunch</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">15:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">Web Performance Kinetosis</p>
                <p className="Event-text">Eduardo Bouças</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-time">15:45</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration45">
                <p className="Event-heading">Home</p>
                <p className="Event-text">Claudio Guglieri</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-time">16:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration30">
                <p className="Event-text">Coffee Break</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">17:00</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-heading">{"Let's Work Together!"}</p>
                <p className="Event-text">Brad Frost</p>
              </div>
            </div>
          </div>
  
          <div className="ScheduleTable-rowGutter" />
  
          <div className="ScheduleTable-row">
            <div className="ScheduleTable-column pushLeft">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-time">18:30</p>
              </div>
            </div>
  
            <div className="ScheduleTable-column">
              <div className="ScheduleTable-cell duration60">
                <p className="Event-text">Closing</p>
              </div>
            </div>
          </div>
        </div>
      </Section>
    </div>
  );
  
  export default ConferenceSchedule;
  