/*                                                                      */
/* 		                   SEARCH                       		        */
/*                                                                      */
/* v001 02 Aug 2019 -   Initial version created from WOL tablet.css     */
/* v002 06 Aug 2019 -   Modified to new content element names           */
/* v003 07 Aug 2019 -   Inherit .wrapper.search-bar-container from GS   */
/* v004 20 Sep 2019 -   Move search bar on results page below nav       */
/*                                                                      */
/*                                                                      */


/* **************************************** */
/* 				SEARCH BAR	 				*/
/* **************************************** */

  header #search-icon {
	position: absolute;
	top: 0;
	right: 0;
	height: 40px;
	width: 40px;
	cursor: pointer;
	background-color: #0072ce /* CSG Blue (Pantone 285C) */;
	background-position: -156px -395px;
  }
  header #search-icon.isDown {
	background-color: #f18a00 /* CSG Orange (Pantone 144c) */;
  }
  div.wrapper.search-bar-container {
	display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 200;		/* Has to be on top of features which are 101. */
  }
  div.wrapper.search-bar-container div.search-bar {
	display: block;
    /*width: 80%;
	max-width: 800px;*/
    top: 50px;
    right: 0px;
    padding: 0;
    margin: 0 auto;		/* To centre it */
    overflow: auto;		/* Because the form within it will be floated right */
  }

  div.wrapper.header div.search-bar {
	display: none;
  }

  .search-bar form {
    border: 1px solid #78c048 /* CSG Green (Pantone 368c) */;
    border: none;
  }
  .search-bar input.term {
    color: #636469 /* CSG Dark Grey */ !important; /* This designed to override the audience color on tablet and above but leave it working on mobile */
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 20px;
    height: 40px;
    width: 400px;
  }
  .search-bar input.submit {
	/*font-family: Oswald, Arial, Helvetica, sans-serif;*/
	font-weight: 700;
    height: 40px;
    width: 50px;
    padding: 0px 0px 0px 0px;
    margin-top: 0px;
    margin-right: 0px;
	background-color: #f18a00 /* CSG Orange (Pantone 144c) */;
  }

  div.wrapper.header div.search-bar {				/* Do not display this on most pages ... */
	display: none;
  }
  
  /* Positioning of search term box on the search results page */
  body.search div.wrapper.header div.search-bar {	/* but do display it on the search results page */
	display: block;
	margin-top: 45px;								/* ... and move it under the nav ... */
  }
  body.search div.wrapper.main {
    border-top: 35px solid white;					/* ... and adjust the space below it accordingly. */
  }

  /*div.wrapper.sitemap*/ div.search-bar {
    position: relative;
    width: 100%;
    margin: 0 auto;
    overflow: auto;	/* Because the form within it will be floated right */
  }

  div.wrapper.sitemap div.search-bar form {
    width: auto;
    margin-left: 50px;
    margin-right: 50px;
    background-color: white;
  }
  .search-bar input.submit {
    width: 40px;
    height: 41px;
    margin-right: 0;
  }


  /* Positioning of search term box on the search results page */
  /* Keep these changes together at bottom of file until I'm sure they work */
  
  /* This block above can be removed, as we're using search-bar-container instead */
  body.search div.wrapper.header div.search-bar {
    display: none !important;       /* important because javascript is interfering */
    margin-top: 45px;  /* Keep this as it gives space for search bar to appear on */
  }
  body.search div.wrapper.search-bar-container {
    display: block;
    top: 123px;
  }  
  body.search header #search-icon {
    display: none;
  }
  body.search div.wrapper.search-bar-container div.search-bar {
    top: 0;
    max-width: none;
  }