<!/* DEVELOPER Caitlin D'Souza, IS117-003, Fall 2021 */!>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Fitness with Caitlin</title>
    <link rel="icon" href="progress pics\gymicon.ico">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
          rel="stylesheet"
          integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
          crossorigin="anonymous">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <link href="css/styles.css" rel="stylesheet" type="text/css"/>

</head>

<div class="header">
    <img src="progress pics\train hard.png" class="logo" alt="gym logo" />
    <h1>Fitness with Caitlin</h1>
</div>

<body>

<ul id="nav">
    <li><a href="index.html">Home</a></li>
    <li><a href="blog.html">Blog</a></li>
    <li><a href="myjourney.html">My Journey</a></li>
    <li><a href="nutrition.html">Nutrition</a>
    <li><a href="workouts.html">Workouts</a>
        <ul>
            <li><a href="legs.html">Legs</a></li>
            <li><a href="arms.html">Arms</a></li>
            <li><a href="back.html">Back</a></li>
            <li><a href="chest.html">Chest</a></li>
            <li><a href="cardio.html">Cardio</a></li></li>
        </ul>
    </li>
    <li><a href="contact.html">Contact</a></li>
</ul>


<h1>Nutrition</h1>

<main>
    <section>
        <br>
        <h2>Macros</h2>
            <br>
            <p class="tab"> There are three categories of nutrients that provide your body with energy: protein, carbohydrates, and fats. For maintaining weight, there is an approximately equal split among the three categories. If you are looking to put on more muscle, then increase carbohydrates. If you are looking to lose fat, increase protein. This will keep you fuller for longer, and in turn, you will maintain a caloric deficit. See below for more details about bulking and cutting. </p>
        <br>
        <h2>Caloric Intake</h2>
        <br>
            <p class="tab"> The body is always burning calories. The amount of calories that you need to consume daily will depend on a variety of factors including your age, body type, health, gender and activity level.
                <br>
                Use a calorie calculator online to determine the right amount of calories for you.</p>
        <br>
        <h2>Bulking vs. Cutting</h2>
        <br>
            <p class="tab"> Bulking is intended for muscle gain to increase overall mass. One will eat in a caloric surplus, focusing on increasing protein and complex carbs while doing minimal cardio. Typically, people bulk in the winter and cut in the spring so that they are lean for the summer. During a bulk, focus on consuming foods that are high in nutrients and dense in calories to promote muscle growth.
                <br>
                Cutting is intended for muscle maintenance and fat loss. For cutting, one has to be in a caloric deficit where they are eating slightly fewer calories than their maintenance amount. Cutting can be done through diet and is facilitated by increased cardio. While cutting, focus on foods that are high in nutrients and lower in calories to support gradual weight loss.
                <br>
                For the best results for both diets, it is best to avoid processed, sugary foods and drinks.
            </p>
    </section>
</main>

<h1>Meals I Make</h1>

<div class="container">
    <h2>Carousel Example</h2>
    <div id="myCarousel" class="carousel slide" data-ride="carousel">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
        </ol>

        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active">
                <img src="meals\IMG_7309.jpg" alt="Bulking Meal" style=" height:70%; width:100%;">
            </div>

            <div class="item">
                <img src="meals\IMG_1210.jpg" alt="Cutting Meal" style="height:70%;width:100%;">
            </div>

            <div class="item">
                <img src="meals\IMG_7270.jpg" alt="Maintenance" style="height:70%;width:100%;">
            </div>
        </div>


        <a class="left carousel-control" href="#myCarousel" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
            <span class="sr-only">Previous</span>
        </a>
        <a class="right carousel-control" href="#myCarousel" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
            <span class="sr-only">Next</span>
        </a>
    </div>
</div>



<div style="text-align:center">
    <span class="dots" onclick="currentSlide(1)"></span>
    <span class="dots" onclick="currentSlide(2)"></span>
    <span class="dots" onclick="currentSlide(3)"></span>
</div>

</body>


<div class="clearing"></div>
<div class="copyright-wrap">
    <div class="wrap">
        <div class="content">
            <p> &copy; Caitlin D'Souza, 2021 | Terms of Use | Privacy Statement </p>
        </div>
    </div>
</div>

</html>