You are here

admin.css in The Better Mega Menu 7

/* -------------------------------------------------*/
/* TB ADMIN STYLE
----------------------------------------------------*/
.tb-megamenu .dropdown-menu li > a:hover,
.tb-megamenu .dropdown-menu li > a:focus,
.tb-megamenu .dropdown-submenu:hover > a {
  background: #4f4f4f;
}

.tb-megamenu .dropdown-menu a:visited {
  color: #666;
}

.tb-megamenu hr {
  margin: 0;
}

.tb-megamenu-admin-form .disabled {
  pointer-events: none;
  cursor: default;
  opacity: .3;
}

/* -------------------------------------------------*/
/* TB MEGAMENU ADMIN UI
---------------------------------------------------*/

#tb-megamenu-admin {
  min-height: 800px;
  background: url(../images/grid-bg.jpg) top left;
  margin: 0 -20px;
}

.tb-megamenu .admin-inline-toolbox h3 {
  font-size: 18px;
  line-height: 20px;
}

.tb-megamenu .admin-inline-toolbox h3 a.back-megamenu-toolbox {
  font-size: 13px;
  font-weight: normal;
}


/* Intro
---------------------*/
#tb-megamenu-admin-mm-intro {
  float: left;
  padding: 20px 145px 20px 20px;
  text-shadow: 0 1px 1px white;
}

#tb-megamenu-admin-mm-intro h3 {
  margin-top: 0;
}

#tb-megamenu-admin-mm-intro p,
#tb-megamenu-admin-mm-toolitem p,
#tb-megamenu-admin-mm-toolcol p,
#tb-megamenu-admin-mm-toolsub p {
  display: block;
  color: #999999;
  font-size: 95%;
  overflow: hidden;
}



/* Toolbox
---------------------*/
#tb-megamenu-admin-mm-tb {
  float: left;
  text-shadow: 0 1px 1px #fff;
}

#tb-megamenu-admin .admin-inline-toolbox {
  position: relative;
}

#tb-megamenu-admin-mm-tb .admin-toolbox {
  padding: 20px;
  display: none;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
}

#tb-megamenu-admin-mm-tb .admin-toolbox h3 {
  margin-top: 0;
}

#tb-megamenu-admin-mm-tb .admin-toolbox ul {
  margin-left: 0;
  margin-right: 20px;
  float: left;
}

#tb-megamenu-admin-mm-intro > ul > li {
  float: left;
}

#tb-megamenu-admin-mm-intro li {
  margin-right: 20px;
}

#tb-megamenu-admin-mm-tb .admin-toolbox li > label,
#tb-megamenu-admin-mm-tb .admin-toolbox li > label a,
#tb-megamenu-admin-mm-intro li > label,
#tb-megamenu-admin-mm-intro li > label a {
  font-size: 11px;
  color: #999999;
}

#tb-megamenu-admin-mm-tb .admin-toolbox li > label a:focus,
#tb-megamenu-admin-mm-tb .admin-toolbox li > label a:hover,
#tb-megamenu-admin-mm-intro li > label a:hover,
#tb-megamenu-admin-mm-intro li > label a:focus {
  color: #0077bb;
}



/* Toolbox Actions ---- */
.tb-megamenu-admin-mm-row .toolbox-actions-group {
  bottom: 29px;
  position: absolute;
  right: 20px;
}

.tb-megamenu-admin-mm-row .toolbox-links-groups {
  top: 20px;
  position: absolute;
  right: 20px;
}

.tb-megamenu-admin-mm-row .toolbox-links-groups a {
  color: #0074bd;
  margin-left: 8px;
}

.tb-megamenu-admin-mm-row .toolbox-links-groups a:hover,
.tb-megamenu-admin-mm-row .toolbox-links-groups a:focus {
  text-decoration: underline;
}

/* Fullscreen Toggle */
.tb-megamenu #navigation_params .tb-megamenu-admin-tog-fullscreen {
  position: absolute;
  right: 0;
  top: -50px;
}

/* ADMIN LAYOUT
---------------------------------------------------*/
.tb-megamenu #tb-megamenu-block-wrapper .chosen-container,
.tb-megamenu #tb-megamenu-block-wrapper .chosen-drop{
  width: 230px !important;
}

.tb-megamenu .chosen-container,
.tb-megamenu .chosen-drop {
  max-width: 100% !important;
  min-width: 100px;
  width: 100% !important;
}



/* Toolbar ---*/
#tb-megamenu-admin fieldset {
	padding: 0;
	margin: 0;
	border: 0;
}

#tb-megamenu-admin-toolbar .btn-group {
  margin-left: 5px;
}

#tb-megamenu-admin-toolbar #tb-megamenu-admin-tb-save {
  margin-right: 15px;
  margin-left: 15px;
}

#tb-megamenu-admin-toolbar #tb-megamenu-admin-tb-close {
  margin-left: 20px;
}

#tb-megamenu-admin-toolbar button {
  box-shadow: 1px 2px 2px rgba(0,0,0,.1);
}

/* Loading */
#tb-megamenu-admin-tb-recompile .icon-loading,
#tb-megamenu-admin-tb-recompile.loading .icon-check {
  display: none;
}

#tb-megamenu-admin-tb-recompile.loading .icon-loading {
  display: inline-block;
  background: url(../images/loading.gif) no-repeat !important;
  width: 14px;
  height: 14px;
  margin-bottom: -2px;
}


/* ADMIN TOOLBOX
---------------------------------------------------*/
.tb-megamenu .admin-inline-toolbox {
  margin: 15px 0 20px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  background: #eee;
  border-bottom: 1px solid #e6e6e6;
  border-top: 1px solid #e6e6e6;
}

.tb-megamenu .admin-inline-toolbox ul {
  margin: 0;
  padding: 0;
}

.tb-megamenu .admin-inline-toolbox li {
  margin: 0;
  padding: 0;
  display: inline-block;
  list-style: none;
}

/* Fullscreen Toggle */
.tb-megamenu-admin-tog-fullscreen {
  border: 1px solid #ccc;
  background: #e6e6e6;
  padding: 5px 10px;
}


/* ADMIN FORMS
---------------------------------------------------*/
/* Reset --- */
.tb-megamenu form label, form span.faux-label,
.tb-megamenu input#jform_title, input#jform_leveltitle, input#jform_grouptitle {
  font-size: 100%;
}

.tb-megamenu fieldset input,
.tb-megamenu fieldset textarea,
.tb-megamenu fieldset select,
.tb-megamenu fieldset img,
.tb-megamenu fieldset button {
  margin: 0;
  float: none;
}

.tb-megamenu fieldset p {
  font-size: 100%;
  margin-bottom: 10px;
}

/* Button --- */
.tb-megamenu select, textarea,
.tb-megamenu input[type="text"], input[type="password"], input[type="datetime"],
.tb-megamenu input[type="datetime-local"], input[type="date"], input[type="month"],
.tb-megamenu input[type="time"], input[type="week"], input[type="number"],
.tb-megamenu input[type="email"], input[type="url"], input[type="search"],
.tb-megamenu input[type="tel"], input[type="color"], .uneditable-input,
.tb-megamenu .input-append .add-on, .input-prepend .add-on, .input-append .btn, .input-prepend .btn {
  height: 22px;
  line-height: 22px;
}

.tb-megamenu select, input[type="file"] {
  height: 32px;
  line-height: 32px;
}

/* Radio
--------*/
/* Radio Button Groups ---*/
.tb-megamenu .radio.btn-group input[type=radio] {
  display: none;
}

.tb-megamenu .radio.btn-group > label:first-of-type {
  margin-left: 0;
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
}

.tb-megamenu fieldset.radio.btn-group {
  padding-left: 0;
  padding-top: 0 !important;
}

.tb-megamenu fieldset select {
  width: 180px;
}


/* Buttons
---------- */
.tb-megamenu .btn {
  line-height: 22px;
}

.tb-megamenu .btn-success:hover {
  border-color: #479047;
}


/* PLUGINS STYLES
--------------------------------------------------*/
/* Choosen
----------*/
/* @group Base */
.tb-megamenu .chosen-container {
  font-size: 14px;
}

.tb-megamenu .chosen-container .chosen-drop {
  background: #fff;
  border: 1px solid #aaa;
  border-top: 0;
  top: 29px;
  left: 0;
  box-shadow: 0 4px 5px rgba(0,0,0,.15);
}
/* @end */


/* @group Single Chosen */
.tb-megamenu .chosen-container-single .chosen-single {
  border-radius: 3px;
  border: 1px solid #ccc;
  box-shadow: 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
  font-size: 13px;
  height: 30px;
  line-height: 21px;
  padding: 4px 0 4px 8px;
  color: #555;
}

.tb-megamenu .chosen-container-single .chosen-default {
  color: #999;
}

.tb-megamenu .chosen-container-single .chosen-single span {
  margin-right: 26px;
}

.tb-megamenu .chosen-container-single .chosen-single abbr {
  right: 26px;
  top: 10px;
}

.tb-megamenu .chosen-container-single .chosen-single div {
  width: 20px;
}

.tb-megamenu .chosen-container-single .chosen-single div b {
  background-position: 0 4px;
}

.tb-megamenu .chosen-container-single .chosen-search {
  padding: 5px 4px;
  overflow: hidden;
}

.tb-megamenu .chosen-container-single .chosen-search input:focus {
  border: 1px solid rgba(82, 168, 236, .6);
}

.tb-megamenu .chosen-container .chosen-results li {
  display: block;
  font-size: 13px;
  margin-right: 0 !important;
  padding: 8px;
}

.tb-megamenu .chosen-container-single .chosen-drop {
  border-radius: 0 0 3px 3px;
  display: none;
  width: 99%;
}

.tb-megamenu .chosen-with-drop .chosen-drop {
  display: block;
}

/* @end */


/* @group Results */
.tb-megamenu .chosen-container .chosen-results {
  clear: both;
  width: 100%;
}

.tb-megamenu .chosen-container .chosen-results .highlighted {
  background-color: #07b;
  background-image: -moz-linear-gradient(top, #0097ee, #0077bb);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0097ee), to(#0077bb));
  background-image: -webkit-linear-gradient(top, #0097ee, #0077bb);
  background-image: -o-linear-gradient(top, #0097ee, #0077bb);
  background-image: linear-gradient(to bottom, #0097ee, #0077bb);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0097ee', endColorstr='#ff0077bb', GradientType=0);
  color: #fff;
  text-shadow: none;
}

.tb-megamenu .chosen-container .chosen-results li em {
  background: #feffde;
  font-style: normal;
}

.tb-megamenu .chosen-container .chosen-results .highlighted em {
  background: transparent;
}

.tb-megamenu .chosen-container .chosen-results .no-results {
  background: #f4f4f4;
  display: list-item;
}

.tb-megamenu .chosen-container .chosen-results .group-result {
  cursor: default;
  color: #999;
  font-weight: bold;
}

.tb-megamenu .chosen-container .chosen-results-scroll {
  background: white;
  margin: 0 4px;
  position: absolute;
  text-align: center;
  width: 321px; /* This should by dynamic with js */
  z-index: 1;
}

.tb-megamenu .chosen-container .chosen-results-scroll span {
  display: inline-block;
  height: 17px;
  text-indent: -5000px;
  width: 9px;
}

.tb-megamenu .chosen-container .chosen-results-scroll-down {
  bottom: 0;
}

.tb-megamenu .chosen-container .chosen-results-scroll-down span {
  background-position: -4px -3px;
}

.tb-megamenu .chosen-container .chosen-results-scroll-up span {
  background-position: -22px -3px;
}
/* @end */


/* @group Active  */
.tb-megamenu .chosen-container-active .chosen-single {
  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
  -moz-box-shadow   : 0 0 5px rgba(0,0,0,.3);
  box-shadow        : 0 0 5px rgba(0,0,0,.3);
  border: 1px solid #07b;
}

.tb-megamenu .chosen-with-drop a.chosen-single {
  border: 1px solid #aaa;
  background-color: #eee;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0 );
  background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff));
  background-image: -webkit-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
  background-image: -moz-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
  background-image: -o-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
  background-image: linear-gradient(#eeeeee 20%, #ffffff 80%);
  border-bottom-left-radius : 0;
  border-bottom-right-radius: 0;
}

.tb-megamenu .chosen-with-drop a.chosen-single div b {
  background-position: -18px 5px;
}

.tb-megamenu .chosen-container-active .chosen-choices {
  box-shadow: 0 0 5px rgba(0,0,0,.3);
  border: 1px solid #07b;
}

.tb-megamenu .chosen-container-active .chosen-choices .search-field input {
  color: #333 !important;
}
/* @end */

File

css/admin.css
View source
  1. /* -------------------------------------------------*/
  2. /* TB ADMIN STYLE
  3. ----------------------------------------------------*/
  4. .tb-megamenu .dropdown-menu li > a:hover,
  5. .tb-megamenu .dropdown-menu li > a:focus,
  6. .tb-megamenu .dropdown-submenu:hover > a {
  7. background: #4f4f4f;
  8. }
  9. .tb-megamenu .dropdown-menu a:visited {
  10. color: #666;
  11. }
  12. .tb-megamenu hr {
  13. margin: 0;
  14. }
  15. .tb-megamenu-admin-form .disabled {
  16. pointer-events: none;
  17. cursor: default;
  18. opacity: .3;
  19. }
  20. /* -------------------------------------------------*/
  21. /* TB MEGAMENU ADMIN UI
  22. ---------------------------------------------------*/
  23. #tb-megamenu-admin {
  24. min-height: 800px;
  25. background: url(../images/grid-bg.jpg) top left;
  26. margin: 0 -20px;
  27. }
  28. .tb-megamenu .admin-inline-toolbox h3 {
  29. font-size: 18px;
  30. line-height: 20px;
  31. }
  32. .tb-megamenu .admin-inline-toolbox h3 a.back-megamenu-toolbox {
  33. font-size: 13px;
  34. font-weight: normal;
  35. }
  36. /* Intro
  37. ---------------------*/
  38. #tb-megamenu-admin-mm-intro {
  39. float: left;
  40. padding: 20px 145px 20px 20px;
  41. text-shadow: 0 1px 1px white;
  42. }
  43. #tb-megamenu-admin-mm-intro h3 {
  44. margin-top: 0;
  45. }
  46. #tb-megamenu-admin-mm-intro p,
  47. #tb-megamenu-admin-mm-toolitem p,
  48. #tb-megamenu-admin-mm-toolcol p,
  49. #tb-megamenu-admin-mm-toolsub p {
  50. display: block;
  51. color: #999999;
  52. font-size: 95%;
  53. overflow: hidden;
  54. }
  55. /* Toolbox
  56. ---------------------*/
  57. #tb-megamenu-admin-mm-tb {
  58. float: left;
  59. text-shadow: 0 1px 1px #fff;
  60. }
  61. #tb-megamenu-admin .admin-inline-toolbox {
  62. position: relative;
  63. }
  64. #tb-megamenu-admin-mm-tb .admin-toolbox {
  65. padding: 20px;
  66. display: none;
  67. box-sizing: border-box;
  68. -moz-box-sizing: border-box;
  69. -webkit-box-sizing: border-box;
  70. -o-box-sizing: border-box;
  71. }
  72. #tb-megamenu-admin-mm-tb .admin-toolbox h3 {
  73. margin-top: 0;
  74. }
  75. #tb-megamenu-admin-mm-tb .admin-toolbox ul {
  76. margin-left: 0;
  77. margin-right: 20px;
  78. float: left;
  79. }
  80. #tb-megamenu-admin-mm-intro > ul > li {
  81. float: left;
  82. }
  83. #tb-megamenu-admin-mm-intro li {
  84. margin-right: 20px;
  85. }
  86. #tb-megamenu-admin-mm-tb .admin-toolbox li > label,
  87. #tb-megamenu-admin-mm-tb .admin-toolbox li > label a,
  88. #tb-megamenu-admin-mm-intro li > label,
  89. #tb-megamenu-admin-mm-intro li > label a {
  90. font-size: 11px;
  91. color: #999999;
  92. }
  93. #tb-megamenu-admin-mm-tb .admin-toolbox li > label a:focus,
  94. #tb-megamenu-admin-mm-tb .admin-toolbox li > label a:hover,
  95. #tb-megamenu-admin-mm-intro li > label a:hover,
  96. #tb-megamenu-admin-mm-intro li > label a:focus {
  97. color: #0077bb;
  98. }
  99. /* Toolbox Actions ---- */
  100. .tb-megamenu-admin-mm-row .toolbox-actions-group {
  101. bottom: 29px;
  102. position: absolute;
  103. right: 20px;
  104. }
  105. .tb-megamenu-admin-mm-row .toolbox-links-groups {
  106. top: 20px;
  107. position: absolute;
  108. right: 20px;
  109. }
  110. .tb-megamenu-admin-mm-row .toolbox-links-groups a {
  111. color: #0074bd;
  112. margin-left: 8px;
  113. }
  114. .tb-megamenu-admin-mm-row .toolbox-links-groups a:hover,
  115. .tb-megamenu-admin-mm-row .toolbox-links-groups a:focus {
  116. text-decoration: underline;
  117. }
  118. /* Fullscreen Toggle */
  119. .tb-megamenu #navigation_params .tb-megamenu-admin-tog-fullscreen {
  120. position: absolute;
  121. right: 0;
  122. top: -50px;
  123. }
  124. /* ADMIN LAYOUT
  125. ---------------------------------------------------*/
  126. .tb-megamenu #tb-megamenu-block-wrapper .chosen-container,
  127. .tb-megamenu #tb-megamenu-block-wrapper .chosen-drop{
  128. width: 230px !important;
  129. }
  130. .tb-megamenu .chosen-container,
  131. .tb-megamenu .chosen-drop {
  132. max-width: 100% !important;
  133. min-width: 100px;
  134. width: 100% !important;
  135. }
  136. /* Toolbar ---*/
  137. #tb-megamenu-admin fieldset {
  138. padding: 0;
  139. margin: 0;
  140. border: 0;
  141. }
  142. #tb-megamenu-admin-toolbar .btn-group {
  143. margin-left: 5px;
  144. }
  145. #tb-megamenu-admin-toolbar #tb-megamenu-admin-tb-save {
  146. margin-right: 15px;
  147. margin-left: 15px;
  148. }
  149. #tb-megamenu-admin-toolbar #tb-megamenu-admin-tb-close {
  150. margin-left: 20px;
  151. }
  152. #tb-megamenu-admin-toolbar button {
  153. box-shadow: 1px 2px 2px rgba(0,0,0,.1);
  154. }
  155. /* Loading */
  156. #tb-megamenu-admin-tb-recompile .icon-loading,
  157. #tb-megamenu-admin-tb-recompile.loading .icon-check {
  158. display: none;
  159. }
  160. #tb-megamenu-admin-tb-recompile.loading .icon-loading {
  161. display: inline-block;
  162. background: url(../images/loading.gif) no-repeat !important;
  163. width: 14px;
  164. height: 14px;
  165. margin-bottom: -2px;
  166. }
  167. /* ADMIN TOOLBOX
  168. ---------------------------------------------------*/
  169. .tb-megamenu .admin-inline-toolbox {
  170. margin: 15px 0 20px;
  171. box-sizing: border-box;
  172. -moz-box-sizing: border-box;
  173. -webkit-box-sizing: border-box;
  174. -o-box-sizing: border-box;
  175. background: #eee;
  176. border-bottom: 1px solid #e6e6e6;
  177. border-top: 1px solid #e6e6e6;
  178. }
  179. .tb-megamenu .admin-inline-toolbox ul {
  180. margin: 0;
  181. padding: 0;
  182. }
  183. .tb-megamenu .admin-inline-toolbox li {
  184. margin: 0;
  185. padding: 0;
  186. display: inline-block;
  187. list-style: none;
  188. }
  189. /* Fullscreen Toggle */
  190. .tb-megamenu-admin-tog-fullscreen {
  191. border: 1px solid #ccc;
  192. background: #e6e6e6;
  193. padding: 5px 10px;
  194. }
  195. /* ADMIN FORMS
  196. ---------------------------------------------------*/
  197. /* Reset --- */
  198. .tb-megamenu form label, form span.faux-label,
  199. .tb-megamenu input#jform_title, input#jform_leveltitle, input#jform_grouptitle {
  200. font-size: 100%;
  201. }
  202. .tb-megamenu fieldset input,
  203. .tb-megamenu fieldset textarea,
  204. .tb-megamenu fieldset select,
  205. .tb-megamenu fieldset img,
  206. .tb-megamenu fieldset button {
  207. margin: 0;
  208. float: none;
  209. }
  210. .tb-megamenu fieldset p {
  211. font-size: 100%;
  212. margin-bottom: 10px;
  213. }
  214. /* Button --- */
  215. .tb-megamenu select, textarea,
  216. .tb-megamenu input[type="text"], input[type="password"], input[type="datetime"],
  217. .tb-megamenu input[type="datetime-local"], input[type="date"], input[type="month"],
  218. .tb-megamenu input[type="time"], input[type="week"], input[type="number"],
  219. .tb-megamenu input[type="email"], input[type="url"], input[type="search"],
  220. .tb-megamenu input[type="tel"], input[type="color"], .uneditable-input,
  221. .tb-megamenu .input-append .add-on, .input-prepend .add-on, .input-append .btn, .input-prepend .btn {
  222. height: 22px;
  223. line-height: 22px;
  224. }
  225. .tb-megamenu select, input[type="file"] {
  226. height: 32px;
  227. line-height: 32px;
  228. }
  229. /* Radio
  230. --------*/
  231. /* Radio Button Groups ---*/
  232. .tb-megamenu .radio.btn-group input[type=radio] {
  233. display: none;
  234. }
  235. .tb-megamenu .radio.btn-group > label:first-of-type {
  236. margin-left: 0;
  237. border-bottom-left-radius: 4px;
  238. border-top-left-radius: 4px;
  239. }
  240. .tb-megamenu fieldset.radio.btn-group {
  241. padding-left: 0;
  242. padding-top: 0 !important;
  243. }
  244. .tb-megamenu fieldset select {
  245. width: 180px;
  246. }
  247. /* Buttons
  248. ---------- */
  249. .tb-megamenu .btn {
  250. line-height: 22px;
  251. }
  252. .tb-megamenu .btn-success:hover {
  253. border-color: #479047;
  254. }
  255. /* PLUGINS STYLES
  256. --------------------------------------------------*/
  257. /* Choosen
  258. ----------*/
  259. /* @group Base */
  260. .tb-megamenu .chosen-container {
  261. font-size: 14px;
  262. }
  263. .tb-megamenu .chosen-container .chosen-drop {
  264. background: #fff;
  265. border: 1px solid #aaa;
  266. border-top: 0;
  267. top: 29px;
  268. left: 0;
  269. box-shadow: 0 4px 5px rgba(0,0,0,.15);
  270. }
  271. /* @end */
  272. /* @group Single Chosen */
  273. .tb-megamenu .chosen-container-single .chosen-single {
  274. border-radius: 3px;
  275. border: 1px solid #ccc;
  276. box-shadow: 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
  277. font-size: 13px;
  278. height: 30px;
  279. line-height: 21px;
  280. padding: 4px 0 4px 8px;
  281. color: #555;
  282. }
  283. .tb-megamenu .chosen-container-single .chosen-default {
  284. color: #999;
  285. }
  286. .tb-megamenu .chosen-container-single .chosen-single span {
  287. margin-right: 26px;
  288. }
  289. .tb-megamenu .chosen-container-single .chosen-single abbr {
  290. right: 26px;
  291. top: 10px;
  292. }
  293. .tb-megamenu .chosen-container-single .chosen-single div {
  294. width: 20px;
  295. }
  296. .tb-megamenu .chosen-container-single .chosen-single div b {
  297. background-position: 0 4px;
  298. }
  299. .tb-megamenu .chosen-container-single .chosen-search {
  300. padding: 5px 4px;
  301. overflow: hidden;
  302. }
  303. .tb-megamenu .chosen-container-single .chosen-search input:focus {
  304. border: 1px solid rgba(82, 168, 236, .6);
  305. }
  306. .tb-megamenu .chosen-container .chosen-results li {
  307. display: block;
  308. font-size: 13px;
  309. margin-right: 0 !important;
  310. padding: 8px;
  311. }
  312. .tb-megamenu .chosen-container-single .chosen-drop {
  313. border-radius: 0 0 3px 3px;
  314. display: none;
  315. width: 99%;
  316. }
  317. .tb-megamenu .chosen-with-drop .chosen-drop {
  318. display: block;
  319. }
  320. /* @end */
  321. /* @group Results */
  322. .tb-megamenu .chosen-container .chosen-results {
  323. clear: both;
  324. width: 100%;
  325. }
  326. .tb-megamenu .chosen-container .chosen-results .highlighted {
  327. background-color: #07b;
  328. background-image: -moz-linear-gradient(top, #0097ee, #0077bb);
  329. background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0097ee), to(#0077bb));
  330. background-image: -webkit-linear-gradient(top, #0097ee, #0077bb);
  331. background-image: -o-linear-gradient(top, #0097ee, #0077bb);
  332. background-image: linear-gradient(to bottom, #0097ee, #0077bb);
  333. background-repeat: repeat-x;
  334. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0097ee', endColorstr='#ff0077bb', GradientType=0);
  335. color: #fff;
  336. text-shadow: none;
  337. }
  338. .tb-megamenu .chosen-container .chosen-results li em {
  339. background: #feffde;
  340. font-style: normal;
  341. }
  342. .tb-megamenu .chosen-container .chosen-results .highlighted em {
  343. background: transparent;
  344. }
  345. .tb-megamenu .chosen-container .chosen-results .no-results {
  346. background: #f4f4f4;
  347. display: list-item;
  348. }
  349. .tb-megamenu .chosen-container .chosen-results .group-result {
  350. cursor: default;
  351. color: #999;
  352. font-weight: bold;
  353. }
  354. .tb-megamenu .chosen-container .chosen-results-scroll {
  355. background: white;
  356. margin: 0 4px;
  357. position: absolute;
  358. text-align: center;
  359. width: 321px; /* This should by dynamic with js */
  360. z-index: 1;
  361. }
  362. .tb-megamenu .chosen-container .chosen-results-scroll span {
  363. display: inline-block;
  364. height: 17px;
  365. text-indent: -5000px;
  366. width: 9px;
  367. }
  368. .tb-megamenu .chosen-container .chosen-results-scroll-down {
  369. bottom: 0;
  370. }
  371. .tb-megamenu .chosen-container .chosen-results-scroll-down span {
  372. background-position: -4px -3px;
  373. }
  374. .tb-megamenu .chosen-container .chosen-results-scroll-up span {
  375. background-position: -22px -3px;
  376. }
  377. /* @end */
  378. /* @group Active */
  379. .tb-megamenu .chosen-container-active .chosen-single {
  380. -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
  381. -moz-box-shadow : 0 0 5px rgba(0,0,0,.3);
  382. box-shadow : 0 0 5px rgba(0,0,0,.3);
  383. border: 1px solid #07b;
  384. }
  385. .tb-megamenu .chosen-with-drop a.chosen-single {
  386. border: 1px solid #aaa;
  387. background-color: #eee;
  388. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0 );
  389. background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff));
  390. background-image: -webkit-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
  391. background-image: -moz-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
  392. background-image: -o-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
  393. background-image: linear-gradient(#eeeeee 20%, #ffffff 80%);
  394. border-bottom-left-radius : 0;
  395. border-bottom-right-radius: 0;
  396. }
  397. .tb-megamenu .chosen-with-drop a.chosen-single div b {
  398. background-position: -18px 5px;
  399. }
  400. .tb-megamenu .chosen-container-active .chosen-choices {
  401. box-shadow: 0 0 5px rgba(0,0,0,.3);
  402. border: 1px solid #07b;
  403. }
  404. .tb-megamenu .chosen-container-active .chosen-choices .search-field input {
  405. color: #333 !important;
  406. }
  407. /* @end */