No notes defined.
<div class="box introbox widebox">
<form class="grid evidence-search">
<fieldset class="col-7/9@s5">
<h5 class="margin-bottom-md">Search healthcare evidence summaries</h5>
<div class="form__item">
<input type="text" />
<input class="button-icon-search" id="search" type="submit" value="">
</div>
</fieldset>
<div class="col-7/9@s5">
<h6 class="margin-bottom-md">Common topics</h6>
<ul class="list--inline list--inline-spaced">
<li><a href="#">Asthma</a> </li>
<li><a href="#">Backpain</a> </li>
<li><a href="#">Cough</a> </li>
<li><a href="#">Dandruff</a> </li>
<li><a href="#">Eczema</a> </li>
<li><a href="#">View all topics</a> </li>
</ul>
</div>
</form>
</div>
<div class="box introbox widebox">
<form class="grid evidence-search">
<fieldset class="col-7/9@s5">
<h5 class="margin-bottom-md">Search healthcare evidence summaries</h5>
<div class="form__item">
<input type="text" />
<input class="button-icon-search" id="search" type="submit" value="">
</div>
</fieldset>
<div class="col-7/9@s5">
<h6 class="margin-bottom-md">Common topics</h6>
<ul class="list--inline list--inline-spaced">
<li><a href="#">Asthma</a> </li>
<li><a href="#">Backpain</a> </li>
<li><a href="#">Cough</a> </li>
<li><a href="#">Dandruff</a> </li>
<li><a href="#">Eczema</a> </li>
<li><a href="#">View all topics</a> </li>
</ul>
</div>
</form>
</div>
.evidence-search {
input {
max-width: unset;
font-size: 1.5em;
}
.button-icon-search {
position: absolute;
top: 0.5em;
right: 0.5em;
display: block;
width: 1em;
height: 1em;
cursor: pointer;
border: 0;
border-radius: 0;
background: #fff;
background: url("../img/icon-search.png") 50% 50% no-repeat;
background-size: auto;
background-size: contain;
padding: 0;
}
.list--inline {
margin: -0.5em 0 0;
a, a:visited {
color: $primary;
}
}
+ hr {
margin-top: 2em;
}
}