"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const view_container_1 = require("view-container");
const ButtonRightSection = view_container_1.styled.div `
  position: relative;
  flex: 0 0 160px;
  padding: 0 4px;

  @media (max-width: 767px) {
    flex: 0 0 50%;
  }
`;
exports.ButtonRightSection = ButtonRightSection;
const ButtonLeftSection = view_container_1.styled.div `
  position: relative;
  flex: 0 0 220px;
  padding: 0 4px;

  @media (max-width: 767px) {
    flex: 0 0 50%;
  }
`;
exports.ButtonLeftSection = ButtonLeftSection;
const PaymentCardButtonSection = view_container_1.styled.div `
  position: relative;
  flex: 1;
  display: flex;
  justify-content: space-between;
  margin-left: -4px;
  margin-right: -4px;
`;
exports.PaymentCardButtonSection = PaymentCardButtonSection;
const CardFormCheckBoxLabel = view_container_1.styled.div `
  position: relative;
  width: 250px;
  display: flex;
  align-items: center;
`;
exports.CardFormCheckBoxLabel = CardFormCheckBoxLabel;
const CardFormCheckBox = view_container_1.styled.div `
  position: relative;
  display: flex;
  align-items: center;
  width: 25px;
  height: 25px;
  margin-right: 16px;
`;
exports.CardFormCheckBox = CardFormCheckBox;
const PaymentCardMethodCheckSection = view_container_1.styled.div `
  position: relative;
  flex: 1;
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  margin-bottom: 16px;
`;
exports.PaymentCardMethodCheckSection = PaymentCardMethodCheckSection;
const PaymentCardDetailsSection = view_container_1.styled.div `
  position: relative;
  flex: 0 0 50%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: 16px;

  @media (max-width: 1023px) {
    flex: 0 0 100%;
  }
`;
exports.PaymentCardDetailsSection = PaymentCardDetailsSection;
const CardFormInput = view_container_1.styled.div `
  position: relative;
`;
exports.CardFormInput = CardFormInput;
const CardFormLabel = view_container_1.styled.div `
  position: relative;
  margin-bottom: 6px;
`;
exports.CardFormLabel = CardFormLabel;
const PaymentCardFormNameSection = view_container_1.styled.div `
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: 16px;
`;
exports.PaymentCardFormNameSection = PaymentCardFormNameSection;
const SecuritySection = view_container_1.styled.div `
  position: relative;
  width: 30%;

  @media (max-width: 1023px) {
    width: 30%;
  }

  @media (max-width: 767px) {
    width: 50%;
  }
`;
exports.SecuritySection = SecuritySection;
const YearSection = view_container_1.styled.div `
  position: relative;
  width: 15%;

  @media (max-width: 1023px) {
    width: 10%;
  }

  @media (max-width: 767px) {
    width: 25%;
  }
`;
exports.YearSection = YearSection;
const MonthSection = view_container_1.styled.div `
  position: relative;
  width: 15%;

  @media (max-width: 1023px) {
    width: 10%;
  }

  @media (max-width: 767px) {
    width: 25%;
  }
`;
exports.MonthSection = MonthSection;
const CardNumberSection = view_container_1.styled.div `
  position: relative;
  width: 40%;

  @media (max-width: 1023px) {
    width: 100%;
  }
`;
exports.CardNumberSection = CardNumberSection;
const RowItems = view_container_1.styled.div `
  position: relative;
  flex: 0 0 50%;
  padding: 0 4px;

  @media (max-width: 767px) {
    flex: 0 0 100%;
    margin-bottom: 16px;
  }
`;
exports.RowItems = RowItems;
const Row = view_container_1.styled.div `
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-left: -4px;
  margin-right: -4px;
`;
exports.Row = Row;
const PaymentCardFormContainer = view_container_1.styled.div `
  position: relative;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
`;
exports.PaymentCardFormContainer = PaymentCardFormContainer;
const PaymentCardFormWrapper = view_container_1.styled.section `
  position: relative;
`;
exports.PaymentCardFormWrapper = PaymentCardFormWrapper;
//# sourceMappingURL=styled.js.map