Hi,
generally this is solved by using the classes ".no-bottom" and ".no-question".
Code:
.no-question{border-top:0;}
.no-question .question-title-container{display:none;}
.no-question .question-valid-container{display:none;}
.no-bottom{border-bottom:0;margin-bottom:0;}
.no-question .answer-container {
padding-top: 0em;
padding-bottom: 0.5em;
}
.no-bottom .answer-container { padding-bottom: 0em}
.no-question thead {display:none !important}
Generally. But you want to randomize the groups. Therefore you have to know which group is the first and the last.
In the first you want to show the header, in the last the footer.
Don't worry about the small gaps. This theme has rounded corners. So it is not really usable for this solution.
You see your requirements are fulfilled (randomization of groups (e1,e2,e3) and randomization of subquestions within groups); but the rest ...?
You can solve this be putting one fixed item at the top and one at the bottom.
And in my opinion this css is a part of the skelvanilla theme.
skelvanilla may be better. You only have to remove the headers.
Joffm