* {
    margin:0;
    padding:0;
    box-sizing: border-box;
    transition: background-color 200ms linear 0s;
}
HTML, body{
    font-family: 'Montserrat', sans-serif;
    scroll-behavior: smooth;
}

.templateWhite {
    background-color: #ffffff;
    /* color: #4a5568; */
    color: #3F3844;
}
.templateBlack {
    background-color: #2f2e2e;
    color: rgb(206, 208, 212);
}
main{
    margin-left:190px;
    padding:80px 64px 0px;
}

/* body scroll bar  */
body::-webkit-scrollbar {
    width: 5px;  
  }
  body::-webkit-scrollbar-track {
    background: rgb(219, 218, 218);        /* color of the tracking area */
  }
  body::-webkit-scrollbar-thumb {
    background-color: #0f050552;    /* color of the scroll thumb */
    border-radius: 20px;       /* roundness of the scroll thumb */
    border: 3px solid #0f050552;  /* creates padding around scroll thumb */
  }
/* medias  */
@media screen and (max-width:1024px){
    main{
        margin-left:0px;
    }
}