:root{
    --contact-color : white;
    --heading-font-family :'Roboto', sans-serif;
    --button-font-family:'Montserrat', sans-serif;
    --background-color:rgba(32, 32, 32, 1);
    --heading-color: rgba(255, 255, 255, 1);
    --icons-color: rgb(255, 249, 249);
    --name-color: #282323;
    --about-color: rgba(246, 82, 130, 1);

}



body{
    text-align: center;
}

img{
    width: 600px;
    border-radius: 60px;
    
}

h2{
    color:var(--about-color);
    font-family: var(--heading-font-family);
    font-size: 24px;
    text-align: center;
    padding: 10px;
   
    letter-spacing: 0.1em;
    font-style: normal;
    font-weight: bold;
}

h1{
    font-family: var(--heading-font-family);
    font-style: normal;
    font-weight: bold;
    font-size: 72px;
    line-height: 84px;
    text-align: center;
    color: var(--heading-color);
}

.text{
    font-family: var(--heading-font-family);
    font-style: normal; 
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    color: var(--heading-color);
    line-height: 30px;
}

.contact{
    background-color:var(--about-color);
    color: var(--heading-color)!important;
    border-radius: 4px;
    padding: 3px 14px;
    text-decoration: none;
    text-transform: capitalize;
   
    text-align: center;
  
  
   
}

.contact:hover{
    background-color: var(--heading-color);
    color: var(--about-color)!important;
    border: 1px solid var(--about-color);
}

.container{
    height: 500px;
}

.navbar-dark{
    background-color: var(--name-color)!important;
    
}