import React from "react";
import rightside from "./Img/rightside.svg";
import leftside from "./Img/leftside.svg";
import { Col, Row } from "react-bootstrap";
export default function NapTokenDiv({ title, text, titleSize, lg }) {
  return (
    <div>
      <Row
        className="align-items-center borderStyle"
        style={{
          borderTop: "1px solid #51D9FC",
          borderBottom: "1px solid #51D9FC",
          height: lg ? "140px" : "100%",
          backgroundColor: "#240F61",
        }}
      >
        <Col xs="auto" className=" p-0">
          <img src={leftside} style={{ maxHeight: lg ? "140px" : "110px" }} />
        </Col>
        <Col className="text-center ">
          <div
            style={{
              color: "#51D9FC",
              fontSize: titleSize,
              fontFamily: "semibold",
            }}
          >
            {title}
          </div>
          <p
            className="pt-2 m-0"
            style={{ color: "white", fontSize: "16px", fontFamily: "light" }}
          >
            {text}
          </p>
        </Col>
        <Col xs="auto" className="text-end p-0">
          <img src={rightside} style={{ maxHeight: lg ? "140px" : "110px" }} />
        </Col>
      </Row>
    </div>
  );
}
