import React from "react";
import styled from "styled-components";
import { Layout } from "antd";

// background-color: rgba(242, 246, 250, 0.1);
// box-shadow: rgba(138, 138, 138, 0.1) 0px 30px 30px;
// border-radius: 15px;

const StyledLayout = styled(Layout)`
  background: transparent;
  margin: 0 auto;
  padding: 36px 32px 32px;
  width: calc(100% - 16vw);

  @media (max-width: 1200px) {
    width: calc(100% - 12vw);
  }

  @media (max-width: 992px) {
    width: calc(100% - 8vw);
  }

  @media (max-width: 768px) {
    width: calc(100% - 4vw);
  }

  @media (max-width: 576px) {
    width: 100%;
    padding: 14px 8px;
  }
`;

const Container = (props) => {
  const { children, ...rest } = props;
  return <StyledLayout {...rest}>{children}</StyledLayout>;
};

export default Container;