content: import React from 'react'
  import css from 'next/css'
  
  import {
    color,
    mediaQuery
  } from '../shared/constants'
  
  import {
    btn,
    link
  } from '../shared/styles'
  
  export default () => (
    <section {...section}>
      <div className='container'>
        <div className='row'>
          <div className='col-sm-6 text-center'>
            <div {...eventDate}>
              <i className='fa fa-calendar-o' aria-hidden='true' {...calendar} />
              <span {...month}>December</span>
              <span {...day}>15</span>
            </div>
          </div>
          <div className='col-sm-6 center-block' {...details}>
            {/* <h3 {...location}>Hill City Assembly of God</h3>
            <h2 {...title}>TRUNK OR TREAT</h2>
            <p {...description}>A GREAT FAMILY EVENT GIVING YOUNG KIDS A PLACE TO TRICK OR TREAT SAFELY. INTENDED FOR KIDS UP TO GRADE 6. COME TO LAKE STREET IN FRONT OF HILL CITY ASSEMBLY OF GOD AND ENJOY GETTING CANDY, CONNECTING WITH YOUR COMMUNITY AND HAVING FUN. IF YOU WOULD LIKE TO INCLUDE YOUR TRUNK IN THE EVENT YOU MUST REGISTER WITH HILL CITY ASSEMBLY OF GOD. PLEASE CONTACT BY EMAIL @ HILLCITYAGCHURCH@GMAIL.COM OR LEAVE A MESSAGE AT 218.697.2662.</p> */}
            <h3 {...location}>Hill City Assembly of God</h3>
            <h2 {...title}>Vern Bishop Gospel, Unplugged</h2>
            <p {...description}>Come enjoy Vern Bishop, Unplugged, as he performs classic Gospel Hymns the only way he can. Concert is free but a freewill offering will be taken. Open to all! Doors will open at 6:00 pm.</p>
            <a className='btn btn-default btn-lg' href='#' {...btn}>Learn more</a>
            <a href='#' {...link} {...allEvents}>All events ›</a>
          </div>
        </div>
      </div>
    </section>
  )
  
  const section = css({
    margin: '100px 0',
    textAlign: 'center',
    [mediaQuery.sm]: {
      margin: '150px 0',
      textAlign: 'left'
    }
  })
  
  const eventDate = css({
    maxHeight: 255
  })
  
  const calendar = css({
    fontSize: 235,
    [mediaQuery.sm]: { fontSize: 305 }
  })
  
  const month = css({
    display: 'block',
    position: 'relative',
    color: color.mediumGreen,
    fontSize: 20,
    fontWeight: 400,
    letterSpacing: -1,
    top: -140,
    [mediaQuery.sm]: {
      fontSize: 25,
      fontWeight: 300,
      top: -180
    }
  })
  
  const day = css({
    display: 'block',
    position: 'relative',
    color: color.charcoal,
    fontFamily: 'proxima-nova-condensed, sans-serif',
    fontSize: 100,
    fontWeight: 900,
    top: -170,
    [mediaQuery.sm]: {
      fontSize: 125,
      top: -215
    }
  })
  
  const details = css({
    maxWidth: 450,
    [mediaQuery.sm]: { maxWidth: 'none' }
  })
  
  const location = css({
    margin: 0,
    color: color.lightGreen,
    fontFamily: 'proxima-nova-condensed, sans-serif', // fallback fonts?
    fontSize: 22,
    fontWeight: '900',
    textTransform: 'uppercase'
  })
  
  const title = css({
    marginTop: 0,
    fontFamily: 'reklame-script, sans-serif', // fallback fonts?
    fontSize: 48,
    fontWeight: 500
  })
  
  const description = css({
    marginBottom: 20,
    fontSize: 18,
    fontWeight: 300,
    lineHeight: 1.25
  })
  
  // const btnIcon = css({
  //   marginRight: 7
  // })
  
  const allEvents = css({
    position: 'relative',
    display: 'inline-block',
    margin: '0 16px',
    fontSize: 16,
    top: 3
  })
  
  // [
  //   {
  //     "description": "A GREAT FAMILY EVENT GIVING YOUNG KIDS A PLACE TO TRICK OR TREAT SAFELY. INTENDED FOR KIDS UP TO GRADE 6. COME TO LAKE STREET IN FRONT OF HILL CITY ASSEMBLY OF GOD AND ENJOY GETTING CANDY, CONNECTING WITH YOUR COMMUNITY AND HAVING FUN. IF YOU WOULD LIKE TO INCLUDE YOUR TRUNK IN THE EVENT YOU MUST REGISTER WITH HILL CITY ASSEMBLY OF GOD. PLEASE CONTACT BY EMAIL @ HILLCITYAGCHURCH@GMAIL.COM OR LEAVE A MESSAGE AT 218.697.2662.",
  //     "end_time": "2016-10-31T18:30:00-0500",
  //     "name": "TRUNK OR TREAT",
  //     "place": {
  //       "name": "Hill City Assembly of God",
  //       "location": {
  //         "city": "Hill City",
  //         "country": "United States",
  //         "latitude": 46.99181,
  //         "longitude": -93.59693,
  //         "state": "MN",
  //         "street": "PO Box 219 102 Lake Ave",
  //         "zip": "55748"
  //       },
  //       "id": "115583631855218"
  //     },
  //     "start_time": "2016-10-31T17:30:00-0500",
  //     "id": "640688696106428"
  //   },
  //   {
  //     "description": "Come enjoy Vern Bishop, Unplugged, as he performs classic Gospel Hymns the only way he can. Concert is free but a freewill offering will be taken. Open to all! Doors will open at 6:00 pm.",
  //     "end_time": "2016-10-15T07:30:00-0500",
  //     "name": "Vern Bishop Gospel, Unplugged",
  //     "place": {
  //       "name": "Hill City Assembly of God",
  //       "location": {
  //         "city": "Hill City",
  //         "country": "United States",
  //         "latitude": 46.99181,
  //         "longitude": -93.59693,
  //         "state": "MN",
  //         "street": "PO Box 219 102 Lake Ave",
  //         "zip": "55748"
  //       },
  //       "id": "115583631855218"
  //     },
  //     "start_time": "2016-10-15T06:30:00-0500",
  //     "id": "1586659878304724"
  //   }
  // ]
  