html,body {
    width: 100%;
    overflow-x:hidden;
    padding: 0;
    margin:0;
}
.hero{height: 100vh;
display: flex;
justify-content: center;
align-items:center;

}

/*for the navigation*/
.navbar{padding: 10px 3%;
background-color: rgb(31, 0, 123)!important;
}
.navbar-brand img {
  height: 45px;
}
.nav-item{
    font-weight:bolder;
     filter: drop-shadow(2px 2px rgba(0,0,0,0.3));
     

}
.navbar-toggler{
    background-color :rgba(0,0,0,0.2);
    border: 2 px solid darkorchid;
}
.logo{
    width: 45px;
    border-radius: 50%;
    filter: drop-shadow(2px 2px rgba(0,0,0,0.3));

}
#tittle{
     filter: drop-shadow(2px 2px rgba(0,0,0,0.3));
    /* color:rgba(65, 67, 233, 0.9);*/

}


/*footer*/

footer {
  background: #002850;
  color: #fff;
}
footer a {
  color: #cfe6ff;
  text-decoration: none;
}
footer a:hover {
  text-decoration: underline;
}