import streamlit as st

st.markdown(
    """
    <style>
    @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&family=Roboto:wght@300&display=swap');
    
    h1 {
        font-family: 'Open Sans', sans-serif;
        text-align: center;
        font-size: 40px;
        background: linear-gradient(45deg, #FF6F61, #4A90E2);
        color: black;
        -webkit-background-clip: text;
        padding: 10px;
    }
    </style>
    <h1>INTRODUCTION TO DATA SCIENCE</h1>
    """,
    unsafe_allow_html=True)
st.caption("***Transform raw data into groundbreaking insights***")
st.markdown(
    """
    <div style="text-align: center;">
        <img src="https://cdn-uploads.huggingface.co/production/uploads/66bde9bf3c885d04498227a0/lOnsaXtr_xCfn_bfRjbr3.png" 
        width="300" 
        style="border-radius: 15px; border: 5px solid #FF6F61; box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.15); transition: transform 0.3s;">
    </div>
    """,
    unsafe_allow_html=True)