:root{

    --primay-color: #6EE7B7;
    --off-white: #F3F4F6;
    --dark-gray: #6B7280;
}
body{
    text-decoration: none;
    font-family:  cursive;
    margin: 0px;
    font-size: 18px;
   
  
    
   
}
hr{
    color: rgb(255, 255, 255);
    padding: 1rem ;
}
/* spaces */
.margin-md{
    margin: 2rem;
}

.container{
    padding: 0rem 1rem;
}

.container-center {
    max-width: 600px;
    margin: auto;
}

/* links */
.link {
    box-sizing: border-box;
    text-decoration: none;
    padding-bottom: 1rem;
    border-radius: 1rem;
    color: rgb(248, 248, 248);
    
}

.link-primary{
    background-color: var(--primay-color);
    border-radius: 0.5rem;
    border-color: black;
    color: rgb(0, 0, 0);
    display: block;
    max-width: 140px;
    margin: 1rem 1rem 1rem 0rem;
    padding: 0.5rem;
    text-align: center;
   

}
.link-secondary{
    background-color: var(--primay-color);
    border-radius: 0.5rem;
    color:rgb(0, 0, 0);
    display: block;
    max-width: 140px;
    margin: 1rem 1rem 1rem 0rem;
    padding: 0.5rem;
    text-align: center;
   
}


/* lists */
.list-non-bullet {
    list-style: none;
    padding-inline-start: 0px;
}
.list-item-inline {
    display: inline;
    padding: 0rem 0.5rem;
    text-align: right;
}


/* navigation */
.navigation {
color: aqua;
background-color: var(--primay-color); 
padding: 1rem;
border-bottom-left-radius: 1rem;

}

.navigation .nav-brand{
    font-weight: bolder;
  
}
.nav-brand a{
    text-decoration: none;
    font-weight: bold;
    color:black;
}
.nav-brand a:hover{
    text-decoration: underline;
}
.navigation .nav-pills{
    color: var(--off-white);
    text-align: right;
}

.navigation .link{
    color: white;

}
.navigation .link-active{
    font-weight: bold;
    color: rgb(0, 0, 0);
}

/* header */
.hero{
        padding: 2rem;
        padding-top: 5rem;
}

.hero .hero-img{
    max-width:80% ;
    width: 350px;
    display: block;
    margin: auto;
}

.hero .hero-heading {
    text-align: center;
    padding-top: 1rem;
    color: var(--primay-color);
}
.invert-heading{
    color: rgb(34, 13, 153);
}

/*sections  */

.section{
   padding: 2rem;

}
.section h1 {
    text-align: center;
   
     padding: 0.5rem; 
}

.ow {
background-color: var(--off-white);
}


/* footer */

.footer{
    background-color: var(--primay-color);
    border-top-right-radius: 1rem;
    padding: 4rem 1rem;
    color:white;    
}
.footer .link{
    color: rgb(0, 0, 0);
    
}
/* trying hover */
/* .footer .link :hover{
    text-decoration: underline;
} */
.footer .footer-header{
    /* font-weight: bold;  */
     font-size: large;
     text-align: center;
}
.footer ul{
    padding-inline-start: 0px;
}

.footer h1{
    color:rgb(0, 0, 0)
}

.footer ul :hover{
   text-decoration: underline;
   
}
section a:hover{
    text-decoration: underline;
    background-color: rgb(255, 255, 255);
}

/* project styling */
.showcase-list {
    padding: 2rem;
}
.showcase-list a:hover{
    text-decoration: underline;
    background-color:white;
}
    
.showcase-list h1 a{
    text-decoration: underline;
    color: black;
}