body {
    
    margin: 2%;
    padding: 0%;
    background-color:#f2e4bb;

}

.logodiv {

    display: flexbox;
    background-color:#F2B66D;    
    text-align: center;
    width: 100%;

}

.navdiv{

    display: flex;
    background-color:#6387A6;    
    text-align: center;
    justify-content: center;
    justify-items: center;
    width: 100%;

}

.workoutdiv {
    
    display: flexbox;
    background-color:white ;    
    text-align: center;
    justify-content: center;
    justify-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6%;
    margin-bottom: auto;   
    width: 80%;
    border-style: solid;
    border-color:  #416b8f;
    border-width: 5%;
    border-radius: 3%;
    
}

.inworkoutdiv {

    display: flexbox;
    background-color:#f2e4bb;    
    text-align: center;
    justify-content: center;
    justify-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6%;
    margin-bottom: auto;   
    width: 80%;
    border-style: solid;
    border-color: #416b8f;
    border-width: 5%;
    border-radius: 3%;


}

.recipediv {

    display: flexbox;
    background-color:#F2B66D;    
    text-align: center;
    justify-content: center;
    justify-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6%;
    margin-bottom: auto;   
    width: 80%;
    border-style: solid;
    border-color: #eba754;
    border-width: 5%;
    border-radius: 3%;

}

.inrecipediv {

    display: flexbox;
    background-color:#f2e4bb;    
    text-align: center;
    justify-content: center;
    justify-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6%;
    margin-bottom: auto;   
    width: 80%;
    border-style: solid;
    border-color: #eba754;
    border-width: 5%;
    border-radius: 3%;


}


p {

    text-align: center; 
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: large;
    color: #F2E4BB;

}




h1 {

    text-align: center;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 20px;
    color:#6387A6;

}



h2 {

    text-align: center;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 20px;
    color:#6387A6;

}



h3 {

    text-align: center;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 25px;
    color:#F2B66D;

}

h4 {

    text-align: center;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 25px;
    color:#6387A6;

}


a {

    text-align: center; 
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: large;
    color: #F2E4BB;

 }

 a:hover {

    text-align: center; 
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: large;
    color: #6387A6;

 }
 
 a:hover  {

    text-align: center; 
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: large;
    color: #6387A6;

 }

ul {
    list-style-type: circle;
    text-align: left;
    color: #F2B66D;
}

ul.b {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #6387A6;
}

ul.b li {
  float: left;
}

ul.b li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

ul.b li a:hover {
  background-color: #F2B66D;
}

li:hover {
    color: #6387A6;
}


body::-webkit-scrollbar {
  width: 15px;
  margin: 0%;
}

body::-webkit-scrollbar-track {
  background: rgb(240, 240, 240);
}

body::-webkit-scrollbar-thumb {
  background-image: url('cuteblueheart.png') ;
  background-repeat: no-repeat, no-repeat;
  background-size: 20px;
  border-radius: 8px;
 background-position: 40%;
}

body::-webkit-scrollbar-thumb:hover {
  background-image: url('cuteorangeheart.png') ;
  background-repeat: no-repeat, no-repeat;
  background-size: 25px;
  border-radius: 8px;
}