* {
    font-family: sans-serif;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
/* sets 1rem equal to 10px */
html {
    font-size: 62.5%;
}


/* General headings & paragraph formatting */
h3 {
    font-size: 3rem;
}

p {
    font-size: 1.7rem;
    /* width: 25%; */
}
.container-background {
    background-color: #B0CDB6;
    padding: 7% 15%;
}


/* Navbar  */
.navbar {
    background-color: #B0CDB6;
   
}

/* styling-font color for ul li a*/

.navbar-light .navbar-nav .nav-link {
    color:#2F3131 ;
    font-size: 2rem;
    margin-right:2rem; 
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #fff;
}

ul li a {
    text-decoration: none;
}


/* Intro section */
#quote {
    border: #B0CDB6 8px dotted;
    width: 55%;
    height: 35%;
    font-size: 4vw;
    display: inline-block;
    text-align: center;
    line-height: 1.2;
    padding: 3%;
    color: #2F3131;    
   
}
/* About Me Section */
.aboutme {
    color:#2F3131;
    font-size: 4.5rem;
    display: block;
    text-align: center;
}

.fact-boxes{
    margin-bottom: 10%;
}

#about {
    position: relative;
  }
  
  .fact-title {
    font-size: 2.0rem;
  }
  
  .fact-box {
    padding: 2.5%;
    text-align: center;
  }
  
  
  /* font awesome images for facts */
  
  .icon-img {
    color: #2f5d62;
    margin-bottom: 1rem;
  }
  
  .icon-img:hover {
    color: #B0CDB6;
  }


  /* work section */
  
.border-box-image {
    background-color: #fff;
}
/* refractor with aboutme if time allows*/
#my-work {
    color:#2F3131;
    font-size: 4.5rem;
    display: block;
    text-align: center; 
}

  .work-text {
    font-size: 3rem;
    line-height: 1.2;
    color: #2F3131;
    display: inline-block;
    text-align: center;
  }
.work-para {
    text-align: center;
    color: #2F3131;
    padding: 3%;
}
.btn {
    /* width: 25%; */
    font-size: 1.5rem;
    border: #2f5d62 2px solid;
}
.btn:hover {
    background-color: #2f5d62;
    color: #fff;
}
  
  /* images */
 .card-img-top {
     width: 100%;
     height: 60%;
 }
 .me-img {
     height: 25%;
     width: 25%;
     border-radius: 100%;
     margin: 5%;
 }
 .project-image {
     height: 95%;
     width: 45%;
 }

/* footer social icons */
.social-icon {
    margin: 20px 10px;
    font-size: 25px;
    color: #2f5d62;
  }