<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<style type="text/css">body {background-color: #ffffff;}
.form-group {
background: #ffffff ;
overflow: hidden;
padding: 0px;
}
.col-md-4 {
float: left;
width: 40%;
padding: 10px;
}
.control-label {
font-weight: bold;
text-align: right;
}
.form-control {width: 100%; }
</style>
<form class="form-horizontal">
<fieldset>
<script type="text/javascript">
function yesnoReserve() {
if (document.getElementById('noReserve').checked) {
document.getElementById('Reserve').style.display = 'block';}
else document.getElementById('Reserve').style.display = 'none';}
</script>
<div class="form-group">
<div class="form-group"><label class="col-md-4 control-label" for="Reserve">Has the venue been reserved?</label> <div class="col-md-4">
<label class="radio-inline" for="reserve-0" id="Reserve-question">Yes <input type="radio" onclick="javascript:yesnoReserve();" name="yesnoReserve1" id="yesReserve">
</label>
<label class="radio-inline" for="reserve-1"> No <input type="radio" onclick="javascript:yesnoReserve();" name="yesnoReserve1" id="noReserve">
