.M_divtop{
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    vertical-align: middle;
}
.M_divbody{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 50px;
    column-gap: 10px ;
    width: 100%;
    height:100%;
}
.M_divbodyl, .M_divbodym,.M_divbodyr{
    flex: 1;
    background-color: #8174A0;
    width: 100%;
    border-radius: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
}

.M_divbodyl{
    display: flex;
    flex-direction: column;
    margin-left: 10px;
}
.M_divbodym{
    flex: 2;
    display: flex;
    flex-direction: row;
    vertical-align: top;
    border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAAAcaxDBAAAB/klEQVR4Xu2bwXECQQwEITYH4FwciHNxAI7N/hr5MaVS6ziumu/BSGqNdreAvd98oQTuqJpiN4HCJhCoQGECsJwOFShMAJbToc8G+v72+fM3h6/vj0s1ZVpfG8Y0IGwIXG5an0BLSwQKexQHWgWn+dY1ltZP+W3Hr/r/Rp4ueLsggZZTQgIyfb7dUB0KNzQCrY7oLgGvdi6l64vHJjrgdITpz9P1CbS5BKQJFOg20DQC3V0zdZQe4aS3XV/7HCrQx5bFXX67g8lB28+369OhpYPTCYyb0rZjrqYvULijAhUoTACWazt0+gUsnD8uN61PoP4EgpvyQVCHwnwFKlCYACynQwUKE4DldKhAYQKwnA4VKEwAltOhAoUJwHI6VKAwAVhOhwoUJgDL6VCBwgRgOR0qUJgALKdDBQoTgOV0qEBhArCcDhUoTACWO9yhcP6Xk2v/t+lyBOCCBCpQmAAs13bodNGG88flpvUJtLREoLBHBXp2oOmmWTf/7kWqrn56/3b88dXEVEB9vl1Qymc7vkCb17m7DWvf9UwBdGgg1F1Tz3Y/PhmAri+eQ+mAqcCjn9P1CbS5pqYJFOg20DQC3WNI6ujZRnxaX3uXnwY8GmCNt20YgRbiU8MIdBvos0fy1ePHXf7VCzw6f4HCxAUqUJgALKdDBQoTgOV0KAz0FyjdQHMwKxu2AAAAAElFTkSuQmCC") 28 /  28px / 0 round;
    border-width:  28px;
    border-style:  solid;
    
}
.M_divfavsong{
    border-style: solid;
    border-color: rgb(79, 67, 142);
    background-color: rgba(92, 79, 155, 0.459);
    display: flex;
    flex-direction: row;
    margin-bottom: 0px;
    padding-left: 5px;
    padding-top: 5px;
    border-width: 3px;
    padding-bottom: 5px;
}
.M_divsongdescription{
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-left: 4px;
    padding-left: 4px;
    margin: 0px;
}
.M_divseries{
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}
.M_divbuttons{
    display: flex;
    flex-direction: column;
}
.M_rdivl{
    flex: 3;
}
.M_divr{
    flex: 1;
    display: flex;
    flex-direction: column;
    background-color: #8174A0;
    border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAAAcaxDBAAABb0lEQVR4Xu3dsXHCQABFQas2F0AvFOJeXAC1mRkyToHm5l5giXUsHvLyEZDAdvv++fvylwlsQDPLVwho6wk09tyD/j7uW30nV+6Nl8zdUx7o3MMPdM7r8Gigh0RzB0yDelv1DjxeEoHODXB3NNBFwPHmQP876Ke9rRqvkflCgb5/8Fl+UQIKdOkq6im/xLe/MVCgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs1CgsUCcs9Czgcbne7pc/t13pxOITxgo0Fggzi0vND6fy+Wmv+7ycgLxPwQUaCwQ5w4XGt/fx+X8/E/8kAMFGgvEuScDHuKuMS8TwwAAAABJRU5ErkJggg==") 28 /  28px / 0 round;
    border-width:  28px;
    border-style:  solid;
    margin-right: 10px;
}
.M_divbodyhmo{
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.M_divhmo{
    background-color: #8174A0;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 70%;
    border-radius: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAAAcaxDBAAACbUlEQVR4Xu2c223EMAwE49pSQHpJIeklBaS2BMjfyYAHC5InAzf5XVKixquHH5fj4/3r982/NgKHQNtY/jck0F6eAm3meQb6/fN5dHayLind7VOt0/2v7Z+mfPeApwck0OYZINBXB5oeq9YlI80nx1X1an2Uj2toCoQ6rAKp5lfro3yBhneKAl0sTUBoBlB+7FBqMNVpAFWdjm3dukCXKZ8aIj7Yd1/B7hsHcvB0/QJdzsHdwOMpT46gKUP503q1PsoXqMemmofJYdQ65evQZzuUrhjptOhTflWf7j/e5e8+IKpPoEQo1AUaAqPw7UCpQPVrAr5GbnaIQAXaTKC5ufhgT3cKqd48nlNztCl16wL1eWjm6W4H0gzUoTpUhz580OsrkOYpIVCBXs6w+PHd9C6ZrYh59HT9Ar3bW086h6V67rksQ4dmvDBaoIgoCxBoxgujBYqIsgCBZrwwWqCIKAsQaMYLowWKiLIAgWa8MFqgiCgLEGjGC6MFioiyAIFmvDBaoIgoCxBoxgujBYqIsgCBZrwwejtQrNCASwJ+zthsEIEKtJlAc3P4sVi1P9oUqu1T/nT/8Xt5Kpj06QHt7l+gzf/mSKC7ga5XgKYYfTlC+dN6tT7Kx01JoI+XWKCL5QkIzRDK16HP/r08HXuqOjmiqlfrS/Njh5LlU70KjPJTIGn98bFpuiACUtWn6xfo3b5gJsfQlKH8ab1aH+XHaygNmDqk/Gm9Wh/lC3T3sYkcRFeQ8qf1an2Ujw6tDpB22Wr7lD/df7zLU8GkTw9od/8C3f34jhxA+ss7lACpXxPwNXKzQwQq0GYCzc39AQTPYtv44sWwAAAAAElFTkSuQmCC") 28 /  28px / 0 round;
    border-width:  28px;
    border-style:  solid;
}
.M_divhmogrid{
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr;
    justify-content: center;
}
.M_hmo{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAAAcaxDBAAACYklEQVR4Xu2d21EDMRAE7dgIgFwIhFwIgNjw94kqd03tyBhf8ytp99Q7u3rclble/KsSuFataewi0LIIBLob6Pvb5889H1/fH4cgpP3p+Vd7q791/LT/am86v18KTQGl/QW6EJhGUKACjUpgnPKkMKpJ7RpINZb8pfOh+Ql0SHQNqEAFetzWmfKLIqb7SIEKdFZkSEEqNOR7eqDTfRsBJPs0PlU0xZ+OzrTvXNvxtqntUKBw+5RGUKACPWiAShKm/FRRVMOm9nfXVAIY19DphAUKBNqKmAas/TxTe6b88OQ2Tvk0hc/WP1bo2QCl8xVoSgz6C1SgZQJlcypUoGUCZXMqdDfQ6UlhOr48PzTXvp7E18jp5YBAy0cvgQr07rdL6QU6LkrtGoNFbXOHaQbReIEuHxBTPAX64JKmQh+tUEoB248EUKECywgINOOFvQWKiLIOHj3LH3IIVKBZClLv9klQhe5W6BrRdgRJMbvb6ehI/mk8rvICPSIWqGd5SrpZOymMrNN4THlyYLtn+a0aUKFlvAIVaJlA2ZwKFWiZQNmcCt0NlI6a7V/FoY0y3S1MPxVa7U/nh7dNbYdTQGkAyF97fgJdiKrQ4Xv1P1doWsOnNY7GpyWA1ojp/OKUnzqk8VNAaQDoeaj96X63iRaNFFDan4BRu0DDd0gChUXKGhoCMuWXnHJRgiJDinn5RYkmmBZp6k/+KCCposkfPS89D942pUWcHNIDp4DS/gItL0oCfTWgFNH/luLtkrPawxoq0OM/QqCACHS4D1ahILHpriFWKEn+7O0CLStAoAItEyibuwGt14CCV0F8uAAAAABJRU5ErkJggg==") 28 /  28px / 0 round;
    border-width:  28px;
    border-style:  solid;
}

.M_divgoals{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.M_divbodygoals{
    display: flex;
    flex-direction: column;
    background-color: #8174A0;
    width: 70%;
    padding-left: 20px;
    border-image:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFQAAABUCAYAAAAcaxDBAAACbUlEQVR4Xu2c223EMAwE49pSQHpJIeklBaS2BMjfyYAHC5InAzf5XVKixquHH5fj4/3r982/NgKHQNtY/jck0F6eAm3meQb6/fN5dHayLind7VOt0/2v7Z+mfPeApwck0OYZINBXB5oeq9YlI80nx1X1an2Uj2toCoQ6rAKp5lfro3yBhneKAl0sTUBoBlB+7FBqMNVpAFWdjm3dukCXKZ8aIj7Yd1/B7hsHcvB0/QJdzsHdwOMpT46gKUP503q1PsoXqMemmofJYdQ65evQZzuUrhjptOhTflWf7j/e5e8+IKpPoEQo1AUaAqPw7UCpQPVrAr5GbnaIQAXaTKC5ufhgT3cKqd48nlNztCl16wL1eWjm6W4H0gzUoTpUhz580OsrkOYpIVCBXs6w+PHd9C6ZrYh59HT9Ar3bW086h6V67rksQ4dmvDBaoIgoCxBoxgujBYqIsgCBZrwwWqCIKAsQaMYLowWKiLIAgWa8MFqgiCgLEGjGC6MFioiyAIFmvDBaoIgoCxBoxgujBYqIsgCBZrwwejtQrNCASwJ+zthsEIEKtJlAc3P4sVi1P9oUqu1T/nT/8Xt5Kpj06QHt7l+gzf/mSKC7ga5XgKYYfTlC+dN6tT7Kx01JoI+XWKCL5QkIzRDK16HP/r08HXuqOjmiqlfrS/Njh5LlU70KjPJTIGn98bFpuiACUtWn6xfo3b5gJsfQlKH8ab1aH+XHaygNmDqk/Gm9Wh/lC3T3sYkcRFeQ8qf1an2Ujw6tDpB22Wr7lD/df7zLU8GkTw9od/8C3f34jhxA+ss7lACpXxPwNXKzQwQq0GYCzc39AQTPYtv44sWwAAAAAElFTkSuQmCC") 28 /  28px / 0 round;
    border-width:  28px;
    border-style:  solid;
    padding-bottom: 20px;
}
.M_divgoal{
    border-style: solid;
    border-color: #3c3368;
    padding-left: 10px;
    margin-right: 20px;
    background-color: #6f618f;
    margin-top: 10px;
}