import React from "react";

import PropTypes from "prop-types";

import "./features_about1.css";

const Features17 = (props) => {
  return (
    <div className="features17-layout349 thq-section-padding">
      <div className="features17-max-width thq-section-max-width">
        <div className="features17-image-container">
          <img
            alt={props.feature1ImageAlt}
            src="/external/HFT-logo-klein-Aplustext.jpg"
            className="thq-img-ratio-16-9"
          />
        </div>
        <div className="features17-content">
          <div className="features17-section-title">
            <span className="thq-body-small">{props.feature1Slogan}</span>
            <div className="features17-content1">
              <h2 className="thq-heading-2">{props.feature1Title}</h2>
              <p className="thq-body-large">{props.feature1Description}</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
};

Features17.defaultProps = {
  feature1Title: "About Us...",
  feature1ImageSrc: "/external/HFT-logo-klein-Aplustext.jpg",
  feature1ImageAlt: "Accurate Weather Forecast Image",
  feature1Description:
    "We are a group of students from the Bachelor's program 'Digitalisierung und Informationsmanagement' at the University of Applied Sciences Stuttgart. Our common goal is to provide accurate and comprehensive weather data, both historical and current information. These data should be easily accessible to everyone and available for further analysis and applications.",
};

Features17.propTypes = {
  feature1Title: PropTypes.string,
  feature1ImageSrc: PropTypes.string,
  feature1ImageAlt: PropTypes.string,
  feature1Description: PropTypes.string,
};

export default Features17;