I managed to get this working! Ended up using modern moodle with Default Boost Layout /header image in course titlebox and the following scss:
footer#page-footer {display: none;}
.page-context-header .page-header-headings {
margin-top: 50px;
background-color: rgba(0,0,0,.5) !important;
border-radius: 0px !important;
}
.mr-auto {
margin-left: auto;
}
#page-navbar{
display:none;
}
#page {
margin-top: 85px;
}
div#learningcontent {
border-top: 0.4rem solid #447198 !important;
-webkit-box-shadow:0 0px 1.1px rgba(0, 0, 0, 0.25),
0 0px 9px rgba(0, 0, 0, 0.5);
}
#region-main {
background-color: white;
}
.card{
border: 0px solid rgba(0,0,0,.125);
}
#nav-drawer{
-webkit-box-shadow:0 0px 1.1px rgba(0, 0, 0, 0.25),
0 0px 9px rgba(0, 0, 0, 0.5);
}
.navbar{
-webkit-box-shadow:0 0px 1.1px rgba(0, 0, 0, 0.25),
0 0px 9px rgba(0, 0, 0, 0.5);
}
footer#page-footer {display: none;}
.page-context-header .page-header-headings {
margin-top: 50px;
background-color: rgba(0,0,0,.5) !important;
border-radius: 0px !important;
}
.mr-auto {
margin-left: auto;
}
#page-navbar{
display:none;
}
#page {
margin-top: 85px;
}
div#learningcontent {
border-top: 0.4rem solid #447198 !important;
-webkit-box-shadow:0 0px 1.1px rgba(0, 0, 0, 0.25),
0 0px 9px rgba(0, 0, 0, 0.5);
}
#region-main {
background-color: white;
}
.card{
border: 0px solid rgba(0,0,0,.125);
}
#nav-drawer{
-webkit-box-shadow:0 0px 1.1px rgba(0, 0, 0, 0.25),
0 0px 9px rgba(0, 0, 0, 0.5);
}
.navbar{
-webkit-box-shadow:0 0px 1.1px rgba(0, 0, 0, 0.25),
0 0px 9px rgba(0, 0, 0, 0.5);
}