import * as React from "react"
import styled from "styled-components"
import breakpoint from "styled-components-breakpoint"
import { SocialMediaItem } from "../../SocialIcon"

const SocialMediaContainer = styled.div`
  height: 50px;
  display: flex;
  justify-content: center;
   margin-top: 20px;
  ${breakpoint("mobile")`
    margin-bottom: 80px;
  `}
`

const SocialMedia = ({children}) => {
  return (
    <SocialMediaContainer>
      {children}
    </SocialMediaContainer>
  )
}

export {
  SocialMedia,
  SocialMediaItem
}