/* Starter Stylesheet for our project.
 Please read the comments to understand what
this code does. 

Refer to w3schools.com for help
-----------------------------------------------
*/

/*  This removes the default browser settings */
* {
    margin: 0; 
    padding: 0;
}
body {
    background-color: #98002E;
}


/*  
    This sets the outer container for your site.
    To use it, you will need to create division tag
    to hold the content. Give it an id="wrapper".
    I would look like this...
        <div id="wrapper">
    Put this division right after the body tag
    and close it right before the close of the body tag

/* Makaela Larkin - Welcome to My Site */
#header-text{
position:absolute;
top:40px;
left: 47px;
width: 895px;
height: 236px;

color:#BC9B6A;
font-family: "Inria Serif";
font-size: 70px;
font-style: normal;
font-weight: 700;
line-height: normal;
}


#wrapper {
margin: 0 auto;
width: 1080px;
min-height: 1920px;
position: relative;    
background: #98002E;
}

/*NAV BAR*/
nav {
position: absolute;
width: 1080px;
height: 63px;
top: 228px;
left: 86px;
color: #FFF;
font-family: "Inria Serif";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;
}



nav a {
    text-decoration: none;
    color:white;
    background-color: purple;
    display: inline-block;
    margin-right: 30px;
}

nav a:hover {
    color: red;
}

main {
position: absolute;
width: 1080px;
height: 1000px;
top: 291px;
left: 47px;
color:#BC9B6A;
font-family: "Inria Serif";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;
}

/*About Me Page*/
<main>
    <h1 class="site-title">About Me
</h1>

    <p class="about-text">
        My name is Makaela Larkin and I am a student athlete at Susquehanna University. 
        I am Business Management major with a minor in sports media and I am also a 
        member of the women's lacrosse team. I am passionate about sports and hope to 
        work in the sports industry after graduation.
    </p>

    <a class="about-link" href="index.html">Click here to go back Home</a>

    <p class="about-caption">This is a photo of me.</p>

    <img class="about-image" src="_images/MakaelaLarkin.jpg" 
         alt="Makaela Larkin" width="360" height="470">
</main>

/* Header styling */
header h1 {
    font-family: "Inria Serif", serif;
    font-size: 70px;
    color: #BC9B6A;
    text-align: center;
    margin-bottom: 0;
    position: absolute;
    top: 40px;
    left: 47px;
    width: 895px;
    height: 236px;
}

header h2 {
    font-family: "Inria Serif", serif;
    font-size: 70px;
    color: #BC9B6A;
    text-align: center;
    margin-bottom: 0;
    position: absolute;
    top: 40px;
    left: 47px;
    width: 895px;
    height: 236px;
}

/* Navigation styling */
nav {
    text-align: center;
    margin-bottom: 25px;
    left: 47px; 
}

nav a {
    background-color: purple;
    color: white;
    padding: 6px 12px;
    text-decoration: none;
    border-radius: 4px;
    font-family: "Inria Serif", serif;
    margin: 0 4px;
}



/*Media Page*/
<main>

  <h1>Media</h1>

  <img src="_images/team.jpg" alt="team">

  <p class="highlight">
    Click here to watch some highlights from one of games this season!
  </p>

  <iframe width="560" height="315"
    src="https://www.youtube.com/embed/_ATicPCaEb0"
    title="2021 Womens Lacrosse National Championship Game Highlights"
    frameborder="0"
    allowfullscreen>
  </iframe>

  <img src="_images/game.jpg" alt="game">

  <p>
    Click here to watch our most recent game vs. Messiah
  </p>

</main>





footer {
position: absolute;
width: 100%;
height: 200px;
bottom: 0px; 
color:#BC9B6A;
background-color: #98002E;
font-size: 70px;
}

/* 
    The is the syntax to set a background image.
    Copy the 2 styles below and put them in the tag
    you want to add a background image to. 
    Then, change the image to your image. 
*/


backgroundSample {
    background-image: url(../_images/bkg_main.png);
    background-repeat: no-repeat;
}

#image1 {
    position; absolute;
    top: 508px;
    width;fixed(342px);
    height:fixed(513px);
}

.site-title {
    position; absolute;
    top: 40px;
    font-family: "Inria Serif", serif;
    font-size: 48px;
    color: #BC9B6A;
    text-align: center;
    margin-bottom: 0;
    left; 47px;
}

.welcome-title {
    font-family: "Inria Serif", serif;
    font-size: 36px;
    color:#BC9B6A;
    text-align: center;
    margin-top: 5px;
    margin-bottom: 20px;
    left; 47px;
}

#GameMessiah {
    position: absolute;
    top: 700px;
    left: 105px;
    width: 700px;
    height: 450px;
}

#SeasonHighlight {
    position: absolute;
    top: 100px;
    left: 105px;
    width: 700px;
    height: 450px;
}