@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');
body{
    font-family:'Montserrat',sans-serif;
    margin:0px;
    
}
:root{
    --primary-color:#6C63FF;
    --off-white:#F3F4F6;
    --dark-gray:#6B7280;
}
hr{
    margin:2rem 0rem;
}
/*container*/
.container{
    padding:0rem 1rem;
}
.container-center{
    max-width:600px;
    margin:auto;/*auto means text is center-aligned*/
    margin-bottom:3rem;
}
.container p{
    margin-bottom:2rem;
}

  
  
/*link*/
.link{
    box-sizing: border-box;
    text-decoration: none;
    padding:0.5rem;
    margin:auto;
}

.link-primary{
    background-color:var(--primary-color);
    border-radius:0.5rem;
    color:white;
   /* display:block;*/
    display:inline;
    max-width:140px;
    margin: 1rem 1rem 1rem 0rem;
    text-align:center;
    margin-top:2rem;
    
}
.link-secondary{
    color:var(--primary-color);
    border-radius:0.5rem;
    border:1px solid var(--primary-color);
   /* display:block;*/
    display:inline;
    max-width: 140px;
    margin:1rem 1rem 1rem 0rem;
    text-align:center;
    margin-top:2rem;
    
    
    
}
.link-secondary:hover{
    background-color:var(--primary-color);
    color:white;
}
/*lists*/
.list-non-bullet{
    list-style: none;
}
.list-item-inline{
    display:inline;
    padding:0rem 0.5rem;
}
/*navigation*/
.navigation{
    background-color:var(--primary-color);
    color:white;
    padding:1rem;
    border-bottom-left-radius: 1rem;
}
.navigation .nav-brand{
    font-weight: bold;
    
}
.navigation .nav-pills{
    text-align:center;
    
}
.navigation .link{
    color:white;
}
.navigation .link-active{
    font-weight:bold;
}
/*header*/
.hero{
    padding:2rem;
    align-content: center;

}
.hero p{
    font: size 24px;
    text-align: center;
    margin-top:2px;
    font-weight: bold;
    color:var(--dark-gray);
}
.hero p span{
    color:var(--primary-color);
    font-weight: bold;
}
.hero .hero-img{
    max-width:300px;
    display:block;
    margin:auto;
    border-radius: 50%;;
}
.hero .hero-heading{
    color:var(--dark-gray);
    padding-top:1rem;
    text-align: center;
}
.hero .hero-heading span{
    text-align:center;
    margin-top:2px;
    font-weight:35px;
    color:var(--primary-color);
}
.hero .hero-heading .heading-inverted{
    color:var(--primary-color);
}
/*sections*/
.section{
    padding:2rem;
}
.section h1{
    text-align:center;
    
}
.ow{
    background-color: var(--off-white);
}
/*footers*/
.footer{
    background-color:var(--primary-color);
    padding:1.3rem;
    text-align:center;
    border-top-right-radius: 1rem;
    color:white;
    
}
.footer i{
    font-size:30px;
    padding:1rem;
    
}

.footer-header{
    color:white;
    font-weight:bold;
    font-size: large;
}


.footer-list li {
    display: inline;
    margin: 0 0.5rem;
}

.list-unordered {
    list-style-type: none;
}
.links {
    text-decoration: none;
    color:white;
    font-size: large;
}

.list-inline li {
    display: inline;
    margin: 1rem;
}