<div id="menu-content-background-color" class="menu-content-item">

<div class="menu-item-header">

<h1 class="menu-item-header-text">Colour</h1>

</div>

<div class="menu-item-form">

<div class="form-wrap">

<input id="control-background-color-by-theme" class="control-background-color-by-theme" type="radio" name="control-background-color-by" value="theme" tabindex="-1">

<label for="control-background-color-by-theme"><span class="label-icon"></span> Theme colour</label>

</div>

<div class="form-helper">

<p class="control-background-color-by-theme-helper form-helper-item">Use the Background colour defined by the Theme.</p>

</div>

<div class="form-wrap">

<input id="control-background-color-by-custom" class="control-background-color-by-custom" type="radio" name="control-background-color-by" value="custom" tabindex="-1">

<label for="control-background-color-by-custom"><span class="label-icon"></span> Custom colour</label>

</div>

<div class="form-helper">

<p class="control-background-color-by-custom-helper form-helper-item">Use a custom Background colour.</p>

</div>

<div class="form-helper">

<p class="control-background-color-by-custom-helper form-helper-item">Take care as some colours may make the Clock, Date and other text unreadable.</p>

</div>

<div class="form-wrap">

<div class="form-indent">

<div class="form-wrap">

<div class="form-group form-group-block">

<input id="control-background-color-rgb-range" class="form-group-item-half control-background-color-rgb-range" type="color" value="#000000" tabindex="1">

<input id="control-background-color-rgb-text" class="form-group-item-half control-background-color-rgb-text" type="text" placeholder="Hex code" value="#000000" tabindex="1" maxlength="7" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">

</div>

</div>

</div>

</div>

</div>