Search Widget for Your Site

Add a Toronto Public Library search widget to your own website or blog. Just copy and paste the following code:

<div id="tplSearchWidget" style="background-image: -moz-linear-gradient( center top, #FBFDFF 55%, #D7E5FD 75% ); background-image: -webkit-gradient( linear, left top, left bottom,	color-stop(0.59, #FBFDFF),  color-stop(0.75, #D7E5FD)); border-radius: 0px 0px 7px 7px;	-moz-border-radius: 0px 0px 7px 7px; -webkit-border-bottom-right-radius: 7px; -webkit-border-bottom-left-radius: 7px; border-top: solid 4px #3B9DB0; border-left: solid 1px #3B9DB0;	border-right: solid 1px #3B9DB0; border-bottom: solid 1px #3B9DB0; background-color: #e9f1fe; width:90%; padding-left:10px; margin: 12px 6px 12px 6px; overflow:hidden; line-height: 19px;">
     <img src='https://www.torontopubliclibrary.ca/images/tpl-logo.png' alt="Toronto Public Library Logo" style="margin-left:-10px">
  		<form name="searchForm" id="searchForm-searchBar" method="get" action="https://www.torontopubliclibrary.ca/search.jsp" style="margin-bottom:10px;">
  				<div style="margin-bottom:6px; margin-top:-5px;"><label style="font-family: Arial; font-weight:bold; font-size:13px; color:#293869;" for="search-terms" >Toronto Public Library</label></div>
  				<input name="Ntt" id="search-terms" type="text" onfocus="" value="" style="font-family: Arial;  margin-right: 5px; padding: 6px; vertical-align: middle; width: 60%; border: 1px solid #AAAAAA; background-color: #f2f2f2; font-size: 15px;"/>
 				<input id="submit-button" value="Search" type="submit" style="font-family: Arial; padding: 6px; background-color: #329aa5; background-position: center center;	background-repeat: repeat-x; border-color: #A3DEE1 #2B7076 #2B7076 #A3DEE1;	border-style: solid; border-width: 2px; /*1px*/; color: #FFFFFF; width: 25%; min-Width:55px ;max-Width:150px; height: 31px; vertical-align: middle; font-size: 12px;"/>
  		</form>
     </div>

Example: