import React from "react";
import { Col, Row } from "react-bootstrap";
import "./Text-and-Img.css";
export default function TextImg({ img, title, text, rightimg, textCenter }) {
  return (
    <>
      {rightimg ? (
        <Row className="  mb-5  align-items-center">
          <Col lg={6}>
            <div
              className="pb-2"
              style={{
                fontSize: "25px",
                fontFamily: "semibold",
                color: "#51D9FC",
              }}
            >
              {title}
            </div>
            <div
              className="pt-3"
              style={{
                fontSize: "16px",
                fontFamily: "light",
                color: "white",
              }}
            >
              {text}
            </div>
          </Col>
          <Col lg={6} className="img-align-for-rightImg">
            <img src={img} style={{ maxWidth: "80%" }} />
          </Col>
        </Row>
      ) : (
        <Row className="  mb-5  align-items-center">
          <Col lg={6} className="img-align-for-leftImg">
            <img src={img} style={{ maxWidth: "80%" }} />
          </Col>
          <Col lg={6}>
            <div
              className="pb-2"
              style={{
                fontSize: "25px",
                fontFamily: "semibold",
                color: "#51D9FC",
              }}
            >
              {title}
            </div>
            <div
              className="pt-3"
              style={{
                fontSize: "16px",
                fontFamily: "light",
                color: "white",
              }}
            >
              {text}
            </div>
          </Col>
        </Row>
      )}
    </>
  );
}
