diff --git a/src/main/webapp/WEB-INF/view/header.jsp b/src/main/webapp/WEB-INF/view/header.jsp
index 51af310cf..9af8aaa52 100755
--- a/src/main/webapp/WEB-INF/view/header.jsp
+++ b/src/main/webapp/WEB-INF/view/header.jsp
@@ -29,141 +29,128 @@ ${fe:facetForm()}${fe:geoForm()}
 			<div class="input-group">
 				<la:text property="query" maxlength="1000" styleId="query"
 					styleClass="form-control" autocomplete="off" />
-				<div class="input-group-btn">
+				<span class="input-group-btn">
 					<button type="submit" name="search" id="searchButton"
 						class="btn btn-primary">
-						<i class="fa fa-search"></i> <span class="hidden-sm-down"><la:message
-								key="labels.search" /></span>
+						<i class="fa fa-search"></i>
 					</button>
-					<button type="button" class="btn btn-primary dropdown-toggle"
-						id="searchOptionsButton" data-toggle="dropdown"
-						aria-haspopup="true" aria-expanded="false">
-						<span class="sr-only"><la:message
+					<button type="button" class="btn btn-default"
+						data-toggle="control-options" data-target="#searchOptions"
+						id="searchOptionsButton">
+						<i class="fa fa-cog"></i> <span class="sr-only"><la:message
 								key="labels.header_form_option_btn" /></span>
 					</button>
-					<div class="dropdown-menu dropdown-menu-right">
-						<a href="#searchOptions" class="dropdown-item" data-toggle="modal"><la:message
-								key="labels.header_form_option_btn" /></a>
-					</div>
-				</div>
+				</span>
 			</div>
 		</div>
 	</nav>
-	<div class="modal fade" id="searchOptions" tabindex="-1" role="dialog"
-		aria-labelledby="searchOptionsLabel" aria-hidden="true">
-		<div class="modal-dialog" role="document">
-			<div class="modal-content">
-				<div class="modal-header">
-					<button type="button" class="close" data-dismiss="modal"
-						aria-label="Close">
-						<span aria-hidden="true">&times;</span> <span class="sr-only">Close</span>
-					</button>
-					<h4 class="modal-title" id="searchOptionsLabel">
-						<la:message key="labels.search_options" />
-					</h4>
-				</div>
-				<div class="modal-body">
-					<fieldset class="form-group">
-						<label for="contentNum"><la:message key="labels.index_num" /></label>
-						<la:select property="num" styleId="numSearchOption"
-							styleClass="form-control">
-							<option value="">
-								<la:message key="labels.search_result_select_num" />
-							</option>
-							<la:option value="10">10</la:option>
-							<la:option value="20">20</la:option>
-							<la:option value="30">30</la:option>
-							<la:option value="40">40</la:option>
-							<la:option value="50">50</la:option>
-							<la:option value="100">100</la:option>
-						</la:select>
-					</fieldset>
-					<fieldset class="form-group">
-						<label for="contentSort"><la:message
-								key="labels.index_sort" /></label>
-						<la:select property="sort" styleId="sortSearchOption"
-							styleClass="form-control">
-							<option value="">
-								<la:message key="labels.search_result_select_sort" />
-							</option>
-							<la:option value="created.asc">
-								<la:message key="labels.search_result_sort_created_asc" />
+	<div id="searchOptions" class="control-options">
+		<div class="container">
+			<h4 id="searchOptionsLabel">
+				<la:message key="labels.search_options" />
+			</h4>
+			<div>
+				<fieldset class="form-group">
+					<label for="contentNum"><la:message key="labels.index_num" /></label>
+					<la:select property="num" styleId="numSearchOption"
+						styleClass="form-control">
+						<option value="">
+							<la:message key="labels.search_result_select_num" />
+						</option>
+						<la:option value="10">10</la:option>
+						<la:option value="20">20</la:option>
+						<la:option value="30">30</la:option>
+						<la:option value="40">40</la:option>
+						<la:option value="50">50</la:option>
+						<la:option value="100">100</la:option>
+					</la:select>
+				</fieldset>
+				<fieldset class="form-group">
+					<label for="contentSort"><la:message
+							key="labels.index_sort" /></label>
+					<la:select property="sort" styleId="sortSearchOption"
+						styleClass="form-control">
+						<option value="">
+							<la:message key="labels.search_result_select_sort" />
+						</option>
+						<la:option value="created.asc">
+							<la:message key="labels.search_result_sort_created_asc" />
+						</la:option>
+						<la:option value="created.desc">
+							<la:message key="labels.search_result_sort_created_desc" />
+						</la:option>
+						<la:option value="contentLength.asc">
+							<la:message key="labels.search_result_sort_contentLength_asc" />
+						</la:option>
+						<la:option value="contentLength.desc">
+							<la:message key="labels.search_result_sort_contentLength_desc" />
+						</la:option>
+						<la:option value="lastModified.asc">
+							<la:message key="labels.search_result_sort_lastModified_asc" />
+						</la:option>
+						<la:option value="lastModified.desc">
+							<la:message key="labels.search_result_sort_lastModified_desc" />
+						</la:option>
+						<c:if test="${searchLogSupport}">
+							<la:option value="clickCount_l_x_dv.asc">
+								<la:message key="labels.search_result_sort_clickCount_asc" />
 							</la:option>
-							<la:option value="created.desc">
-								<la:message key="labels.search_result_sort_created_desc" />
+							<la:option value="clickCount_l_x_dv.desc">
+								<la:message key="labels.search_result_sort_clickCount_desc" />
 							</la:option>
-							<la:option value="contentLength.asc">
-								<la:message key="labels.search_result_sort_contentLength_asc" />
+						</c:if>
+						<c:if test="${favoriteSupport}">
+							<la:option value="favoriteCount_l_x_dv.asc">
+								<la:message key="labels.search_result_sort_favoriteCount_asc" />
 							</la:option>
-							<la:option value="contentLength.desc">
-								<la:message key="labels.search_result_sort_contentLength_desc" />
+							<la:option value="favoriteCount_l_x_dv.desc">
+								<la:message key="labels.search_result_sort_favoriteCount_desc" />
 							</la:option>
-							<la:option value="lastModified.asc">
-								<la:message key="labels.search_result_sort_lastModified_asc" />
-							</la:option>
-							<la:option value="lastModified.desc">
-								<la:message key="labels.search_result_sort_lastModified_desc" />
-							</la:option>
-							<c:if test="${searchLogSupport}">
-								<la:option value="clickCount_l_x_dv.asc">
-									<la:message key="labels.search_result_sort_clickCount_asc" />
-								</la:option>
-								<la:option value="clickCount_l_x_dv.desc">
-									<la:message key="labels.search_result_sort_clickCount_desc" />
-								</la:option>
-							</c:if>
-							<c:if test="${favoriteSupport}">
-								<la:option value="favoriteCount_l_x_dv.asc">
-									<la:message key="labels.search_result_sort_favoriteCount_asc" />
-								</la:option>
-								<la:option value="favoriteCount_l_x_dv.desc">
-									<la:message key="labels.search_result_sort_favoriteCount_desc" />
-								</la:option>
-							</c:if>
-						</la:select>
-					</fieldset>
-					<fieldset class="form-group">
-						<label for="contentLang"><la:message
-								key="labels.index_lang" /></label>
-						<la:select property="lang" styleId="langSearchOption"
-							multiple="true" styleClass="form-control">
-							<c:forEach var="item" items="${langItems}">
-								<la:option value="${f:u(item.value)}">
+						</c:if>
+					</la:select>
+				</fieldset>
+				<fieldset class="form-group">
+					<label for="contentLang"><la:message
+							key="labels.index_lang" /></label>
+					<la:select property="lang" styleId="langSearchOption"
+						multiple="true" styleClass="form-control">
+						<c:forEach var="item" items="${langItems}">
+							<la:option value="${f:u(item.value)}">
 													${f:h(item.label)}
 												</la:option>
+						</c:forEach>
+					</la:select>
+				</fieldset>
+				<c:if test="${displayLabelTypeItems}">
+					<fieldset class="form-group">
+						<label for="contentLabelType"><la:message
+								key="labels.index_label" /></label>
+						<la:select property="fields.label" styleId="labelTypeSearchOption"
+							multiple="true" styleClass="form-control">
+							<c:forEach var="item" items="${labelTypeItems}">
+								<la:option value="${f:u(item.value)}">
+														${f:h(item.label)}
+													</la:option>
 							</c:forEach>
 						</la:select>
 					</fieldset>
-					<c:if test="${displayLabelTypeItems}">
-						<fieldset class="form-group">
-							<label for="contentLabelType"><la:message
-									key="labels.index_label" /></label>
-							<la:select property="fields.label"
-								styleId="labelTypeSearchOption" multiple="true"
-								styleClass="form-control">
-								<c:forEach var="item" items="${labelTypeItems}">
-									<la:option value="${f:u(item.value)}">
-														${f:h(item.label)}
-													</la:option>
-								</c:forEach>
-							</la:select>
-						</fieldset>
-					</c:if>
-				</div>
-				<div class="modal-footer">
-					<button class="btn btn-secondary" id="searchOptionsClearButton">
-						<la:message key="labels.search_options_clear" />
-					</button>
-					<button class="btn btn-secondary" data-dismiss="modal"
-						aria-hidden="true">
-						<la:message key="labels.search_options_close" />
-					</button>
-					<button class="btn btn-primary" type="submit">
-						<la:message key="labels.search" />
-					</button>
-				</div>
+				</c:if>
+			</div>
+			<div>
+				<button class="btn btn-secondary" id="searchOptionsClearButton">
+					<la:message key="labels.search_options_clear" />
+				</button>
+				<button class="btn btn-primary" type="submit">
+					<i class="fa fa-search"></i>
+					<la:message key="labels.search" />
+				</button>
+				<button class="btn btn-secondary pull-right"
+					id="searchOptionsCloseButton">
+					<i class="fa fa-angle-double-right"></i>
+					<la:message key="labels.search_options_close" />
+				</button>
 			</div>
 		</div>
 	</div>
-	<!--  /.modal -->
+	<!--  /#searchOptions -->
 </la:form>
diff --git a/src/main/webapp/WEB-INF/view/search.jsp b/src/main/webapp/WEB-INF/view/search.jsp
index 9827d35e5..afb486945 100644
--- a/src/main/webapp/WEB-INF/view/search.jsp
+++ b/src/main/webapp/WEB-INF/view/search.jsp
@@ -18,7 +18,7 @@
 <link href="${f:url('/css/admin/font-awesome.min.css')}"
 	rel="stylesheet" type="text/css" />
 </head>
-<body>
+<body class="search">
 	<jsp:include page="header.jsp" />
 	<div class="container">
 		<div class="row">
@@ -26,7 +26,7 @@
 				<ul class="searchOptionLabels">
 					<li><la:message key="labels.searchoptions_menu_sort" /> <a
 						href="#searchOptions" class="label label-primary"
-						data-toggle="modal"> <c:if test="${empty sort}">
+						data-toggle="control-options"> <c:if test="${empty sort}">
 								<la:message key="labels.searchoptions_score" />
 							</c:if> <c:if test="${sort=='created.asc'}">
 								<la:message key="labels.search_result_sort_created_asc" />
@@ -52,12 +52,12 @@
 					</a></li>
 					<li><la:message key="labels.searchoptions_menu_num" /> <a
 						href="#searchOptions" class="label label-primary"
-						data-toggle="modal"> <la:message
+						data-toggle="control-options"> <la:message
 								key="labels.searchoptions_num" arg0="${f:h(num)}" />
 					</a></li>
 					<li><la:message key="labels.searchoptions_menu_lang" /> <a
 						href="#searchOptions" class="label label-primary"
-						data-toggle="modal"> <c:if test="${empty lang}">
+						data-toggle="control-options"> <c:if test="${empty lang}">
 								<la:message key="labels.searchoptions_all" />
 							</c:if> <c:if test="${!empty lang}">
 								<c:forEach var="sLang" items="${lang}">
@@ -70,7 +70,8 @@
 					<c:if test="${displayLabelTypeItems}">
 						<li><la:message key="labels.searchoptions_menu_labels" /> <a
 							href="#searchOptions" class="label label-primary"
-							data-toggle="modal"> <c:if test="${empty fields.label}">
+							data-toggle="control-options"> <c:if
+									test="${empty fields.label}">
 									<la:message key="labels.searchoptions_all" />
 								</c:if> <c:if test="${!empty fields.label}">
 									<c:forEach var="sLabel" items="${fields.label}">
diff --git a/src/main/webapp/WEB-INF/view/searchResults.jsp b/src/main/webapp/WEB-INF/view/searchResults.jsp
index 506b840b4..a478c3a68 100644
--- a/src/main/webapp/WEB-INF/view/searchResults.jsp
+++ b/src/main/webapp/WEB-INF/view/searchResults.jsp
@@ -40,7 +40,7 @@
 										key="labels.search_result_cache" /></la:link>
 							</c:if>
 						</div>
-						<div class="more visible-phone">
+						<div class="more hidden-md-up">
 							<a href="#result${s.index}"><la:message key="labels.search_result_more" /></a>
 						</div>
 						<div class="info">
@@ -79,7 +79,7 @@
 			</c:forEach>
 		</ol>
 	</div>
-	<div class="col-md-4 visible-desktop visible-tablet">
+	<aside class="col-md-4 hidden-sm-down">
 		<%-- Side Content --%>
 		<c:if test="${screenShotSupport}">
 			<div id="screenshot"></div>
@@ -125,7 +125,7 @@
 				</div>
 			</c:if>
 		</c:if>
-	</div>
+	</aside>
 </div>
 <div class="row center">
 	<nav id="subfooter">
diff --git a/src/main/webapp/css/style.css b/src/main/webapp/css/style.css
index a36bfee5e..71ff67fd4 100644
--- a/src/main/webapp/css/style.css
+++ b/src/main/webapp/css/style.css
@@ -140,7 +140,8 @@ nav.navbar .form-inline {
 }
 
 #searchOptionsButton {
-	border-left:1px solid #2e6da4;
+	padding-left: 1.0rem;
+	padding-right: 0.8rem;
 }
 
 ul.searchOptionLabels {
@@ -154,6 +155,20 @@ ul.searchOptionLabels li {
 	vertical-align: middle;
 }
 
+body.search #searchOptions {
+	position: fixed;
+	top: 0;
+	padding-top: 72px;
+	padding-bottom: 20px;
+	z-index: 1000;
+	right: -500px;
+	background: #eceeef;
+	width: 500px;
+	transition: all .4s ease 0s;
+}
+body.search #searchOptions.active {
+	right: 0;
+}
 
 /* Large desktop */
 @media ( min-width : 74.9em) {
@@ -208,6 +223,12 @@ ul.searchOptionLabels li {
 	#result .info {
 		display: none;
 	}
+	body.search #searchOptions {
+		width: 100%;
+	}
+	body.search #searchOptions active {
+		left: 0;
+	}
 }
 
 /* Extra small devices (portrait phones, less than 34em) */
@@ -241,7 +262,7 @@ ul.searchOptionLabels li {
 		padding-right: 0.8rem;
 	}
 	#searchOptionsButton {
-		padding-left: 0.6rem;
+		padding-left: 0.7rem;
 		padding-right: 0.6rem;
 	}
 	#footer {
diff --git a/src/main/webapp/js/search.js b/src/main/webapp/js/search.js
index d5185d1f3..2e028ce9b 100644
--- a/src/main/webapp/js/search.js
+++ b/src/main/webapp/js/search.js
@@ -1,4 +1,4 @@
-$(function(){
+$(function() {
 	var $result = $('#result')
 	var $queryId = $('#queryId');
 	var $favorites = $('.favorite', $result);
@@ -14,6 +14,14 @@ $(function(){
 		return true;
 	});
 
+	$("[data-toggle='control-options']").click(function(e) {
+		e.preventDefault();
+		var target = $(this).attr('data-target') || $(this).attr('href');
+		if (target) {
+			$(target).toggleClass("active");
+		}
+	});
+
 	$('#searchOptionsClearButton').on('click', function(e) {
 		$('#labelTypeSearchOption').prop('selectedIndex', -1);
 		$('#langSearchOption').prop('selectedIndex', 0);
@@ -22,13 +30,10 @@ $(function(){
 		return false;
 	});
 
-	$result.on('mousedown', 'a.link', function(e){
-		var docId = $(this).attr('data-id'),
-			rt = $('#rt').val(),
-			queryId = $('#queryId').val(),
-			order = $(this).attr('data-order'),
-			url = $(this).attr('href'),
-			buf = [];
+	$result.on('mousedown', 'a.link', function(e) {
+		var docId = $(this).attr('data-id'), rt = $('#rt').val(), queryId = $(
+				'#queryId').val(), order = $(this).attr('data-order'), url = $(
+				this).attr('href'), buf = [];
 		buf.push(contextPath);
 		buf.push('/go/?rt=');
 		buf.push(rt);
@@ -50,14 +55,11 @@ $(function(){
 		$(this).attr('href', buf.join(''));
 	});
 
-	$result.on('mouseover', 'a.link', function(e){
-		if($screenshot.size() > 0) {
-			var docId = $(this).attr('data-id'),
-				rt = $('#rt').val(),
-				url = $(this).attr('href'),
-				queryId = $queryId.val(),
-				buf = [];
-		    buf.push(contextPath);
+	$result.on('mouseover', 'a.link', function(e) {
+		if ($screenshot.size() > 0) {
+			var docId = $(this).attr('data-id'), rt = $('#rt').val(), url = $(
+					this).attr('href'), queryId = $queryId.val(), buf = [];
+			buf.push(contextPath);
 			buf.push('/go/?rt=');
 			buf.push(rt);
 			buf.push('&docId=');
@@ -73,8 +75,9 @@ $(function(){
 
 			$screenshot.children().remove();
 
-			var content = '<a href="' + buf.join('') + '"><img src="screenshot?queryId='
-				+ queryId + '&docId=' + docId + '"></a>'
+			var content = '<a href="' + buf.join('')
+					+ '"><img src="screenshot?queryId=' + queryId + '&docId='
+					+ docId + '"></a>'
 			$screenshot.append(content);
 			$('img', $screenshot).error(function() {
 				$screenshot.children().remove();
@@ -82,94 +85,102 @@ $(function(){
 		}
 	});
 
-	$result.on('mouseout', 'a.link', function(e){
-		if($screenshot.size() > 0) {
+	$result.on('mouseout', 'a.link', function(e) {
+		if ($screenshot.size() > 0) {
 			$screenshot.children().remove();
 		}
 	});
 
-	$result.on('click', 'a.favorite', function(e){
+	$result.on('click', 'a.favorite', function(e) {
 		var $favorite = $(this);
 		var values = $favorite.attr('href').split('#');
-		if(values.length === 2 && $queryId.size() > 0){
+		if (values.length === 2 && $queryId.size() > 0) {
 			var actionUrl = contextPath + '/json';
 			var docId = values[1];
 			$.ajax({
-				dataType: 'json',
-				cache: false,
-				type: 'post',
-				timeoutNumber: 10000,
-				url: actionUrl,
-				data: {
-					type: 'favorite',
-					docId: docId,
-					queryId: $queryId.val()
-					}
-			}).done(function ( data ) {
-				if(data.response.status === 0
-					&& typeof data.response.result !== 'undefined'
-					&& data.response.result === 'ok'){
-					var $favorited = $favorite.siblings('.favorited');
-					var $favoritedCount = $('.favorited-count', $favorited);
-					$favoritedCount.css('display', 'none');
-					$favorite.fadeOut(1000, function(){$favorited.fadeIn(1000)});
+				dataType : 'json',
+				cache : false,
+				type : 'post',
+				timeoutNumber : 10000,
+				url : actionUrl,
+				data : {
+					type : 'favorite',
+					docId : docId,
+					queryId : $queryId.val()
 				}
-			}).fail(function ( data ) {
+			}).done(
+					function(data) {
+						if (data.response.status === 0
+								&& typeof data.response.result !== 'undefined'
+								&& data.response.result === 'ok') {
+							var $favorited = $favorite.siblings('.favorited');
+							var $favoritedCount = $('.favorited-count',
+									$favorited);
+							$favoritedCount.css('display', 'none');
+							$favorite.fadeOut(1000, function() {
+								$favorited.fadeIn(1000)
+							});
+						}
+					}).fail(function(data) {
 				$favorite.attr('href', '#' + docId);
-//alert(JSON.stringify(data));
+				// alert(JSON.stringify(data));
 			});
 		}
 		$(this).attr('href', '#');
 		return false;
 	});
 
-	if($favorites.size() > 0) {
+	if ($favorites.size() > 0) {
 		$.ajax({
-			dataType: 'json',
-			cache: false,
-			type: 'post',
-			timeoutNumber: 10000,
-			url: contextPath + '/json',
-			data: {
-				type: 'favorites',
-				queryId: $queryId.val()
+			dataType : 'json',
+			cache : false,
+			type : 'post',
+			timeoutNumber : 10000,
+			url : contextPath + '/json',
+			data : {
+				type : 'favorites',
+				queryId : $queryId.val()
 			}
-		}).done(function ( data ) {
-			if(data.response.status === 0
-				&& typeof data.response.num !== 'undefined'
-				&& data.response.num > 0){
-				var docIds = data.response.docIds;
-				for(var i = 0; i < docIds.length; i++) {
-					docIds[i] = '#' + docIds[i];
-				}
-				$favorites.each(function(index) {
-					var $favorite = $(this);
-					var url = $favorite.attr('href');
-					var found = false;
-					for(var i = 0; i< docIds.length; i++) {
-						if(url == docIds[i]) {
-							found = true;
-							break;
+		}).done(
+				function(data) {
+					if (data.response.status === 0
+							&& typeof data.response.num !== 'undefined'
+							&& data.response.num > 0) {
+						var docIds = data.response.docIds;
+						for (var i = 0; i < docIds.length; i++) {
+							docIds[i] = '#' + docIds[i];
 						}
+						$favorites.each(function(index) {
+							var $favorite = $(this);
+							var url = $favorite.attr('href');
+							var found = false;
+							for (var i = 0; i < docIds.length; i++) {
+								if (url == docIds[i]) {
+									found = true;
+									break;
+								}
+							}
+							if (found) {
+								var $favorited = $favorite
+										.siblings('.favorited');
+								$favorite.fadeOut(1000, function() {
+									$favorited.fadeIn(1000)
+								});
+							}
+						});
 					}
-					if(found){
-						var $favorited = $favorite.siblings('.favorited');
-						$favorite.fadeOut(1000, function(){$favorited.fadeIn(1000)});
-					}
-				});
-			}
-		}).fail(function ( data ) {
-//alert(JSON.stringify(data));
+				}).fail(function(data) {
+			// alert(JSON.stringify(data));
 		});
 	}
 
 	$result.on('click', '.more a', function(e) {
 		var $moreLink = $(this);
 		var value = $moreLink.attr('href');
-		if(value != '') {
+		if (value != '') {
 			var $info = $(value + ' .info');
-			if($info.size() > 0) {
-				$moreLink.fadeOut(500, function(){
+			if ($info.size() > 0) {
+				$moreLink.fadeOut(500, function() {
 					$info.slideDown("slow");
 				});
 			}
@@ -177,29 +188,31 @@ $(function(){
 		return false;
 	});
 
-    $('#query').suggestor( {
-        ajaxinfo: {
-            url: contextPath + '/suggest',
-            fn: '_default,content,title',
-            num: 10
-        },
-        boxCssInfo: {
-            border: '1px solid rgba(82, 168, 236, 0.5)',
-            '-webkit-box-shadow': '0 1px 1px 0px rgba(0, 0, 0, 0.1), 0 3px 2px 0px rgba(82, 168, 236, 0.2)',
-            '-moz-box-shadow': '0 1px 1px 0px rgba(0, 0, 0, 0.1), 0 3px 2px 0px rgba(82, 168, 236, 0.2)',
-            'box-shadow': '0 1px 1px 0px rgba(0, 0, 0, 0.1), 0 3px 2px 0px rgba(82, 168, 236, 0.2)',
-            'background-color': '#fff',
-            'z-index': '10000'
-        },
-        listSelectedCssInfo: {
-            'background-color': 'rgba(82, 168, 236, 0.1)'
-        },
-        listDeselectedCssInfo: {
-            'background-color': '#ffffff'
-        },
-        minturm: 1,
-        adjustWidthVal: 11,
-        searchForm: $('#searchForm')
-    });
+	$('#query')
+			.suggestor(
+					{
+						ajaxinfo : {
+							url : contextPath + '/suggest',
+							fn : '_default,content,title',
+							num : 10
+						},
+						boxCssInfo : {
+							border : '1px solid rgba(82, 168, 236, 0.5)',
+							'-webkit-box-shadow' : '0 1px 1px 0px rgba(0, 0, 0, 0.1), 0 3px 2px 0px rgba(82, 168, 236, 0.2)',
+							'-moz-box-shadow' : '0 1px 1px 0px rgba(0, 0, 0, 0.1), 0 3px 2px 0px rgba(82, 168, 236, 0.2)',
+							'box-shadow' : '0 1px 1px 0px rgba(0, 0, 0, 0.1), 0 3px 2px 0px rgba(82, 168, 236, 0.2)',
+							'background-color' : '#fff',
+							'z-index' : '10000'
+						},
+						listSelectedCssInfo : {
+							'background-color' : 'rgba(82, 168, 236, 0.1)'
+						},
+						listDeselectedCssInfo : {
+							'background-color' : '#ffffff'
+						},
+						minturm : 1,
+						adjustWidthVal : 11,
+						searchForm : $('#searchForm')
+					});
 
 });