smart_wizard.css 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305
  1. /*
  2. SmartWizard 2.0 plugin
  3. jQuery Wizard control Plugin
  4. by Dipu
  5. http://www.techlaboratory.net
  6. http://tech-laboratory.blogspot.com
  7. */
  8. .swMain {
  9. position:relative;
  10. display:block;
  11. margin:0;
  12. padding:0;
  13. border: 0px solid #CCC;
  14. overflow:visible;
  15. float:left;
  16. width:980px;
  17. }
  18. .swMain .stepContainer {
  19. display:block;
  20. position: relative;
  21. margin: 0;
  22. padding:0;
  23. border: 0px solid #CCC;
  24. overflow:hidden;
  25. clear:both;
  26. height:300px;
  27. }
  28. .swMain .stepContainer div.content {
  29. display:block;
  30. position: absolute;
  31. float:left;
  32. margin: 0;
  33. padding:5px;
  34. border: 1px solid #CCC;
  35. font: normal 12px Verdana, Arial, Helvetica, sans-serif;
  36. color:#5A5655;
  37. background-color:#F8F8F8;
  38. height:300px;
  39. text-align:left;
  40. overflow:visible;
  41. z-index:88;
  42. -webkit-border-radius: 5px;
  43. -moz-border-radius : 5px;
  44. width:968px;
  45. clear:both;
  46. }
  47. .swMain div.actionBar {
  48. display:block;
  49. position: relative;
  50. clear:both;
  51. margin: 3px 0 0 0;
  52. border: 1px solid #CCC;
  53. padding: 0;
  54. color: #5A5655;
  55. background-color: #F8F8F8;
  56. height:40px;
  57. text-align:left;
  58. overflow:auto;
  59. z-index:88;
  60. -webkit-border-radius: 5px;
  61. -moz-border-radius : 5px;
  62. left:0;
  63. }
  64. .swMain .stepContainer .StepTitle {
  65. display:block;
  66. position: relative;
  67. margin:0;
  68. border:1px solid #E0E0E0;
  69. padding:5px;
  70. font: bold 16px Verdana, Arial, Helvetica, sans-serif;
  71. color:#5A5655;
  72. background-color:#E0E0E0;
  73. clear:both;
  74. text-align:left;
  75. z-index:88;
  76. -webkit-border-radius: 5px;
  77. -moz-border-radius : 5px;
  78. }
  79. .swMain ul.anchor {
  80. position: relative;
  81. display:block;
  82. float:left;
  83. list-style: none;
  84. padding: 0px;
  85. margin: 10px 0;
  86. clear: both;
  87. border: 0px solid #CCCCCC;
  88. background: transparent; /*#EEEEEE */
  89. }
  90. .swMain ul.anchor li{
  91. position: relative;
  92. display:block;
  93. margin: 0;
  94. padding: 0;
  95. padding-left:3px;
  96. padding-right: 3px;
  97. border: 0px solid #E0E0E0;
  98. float: left;
  99. }
  100. /* Anchor Element Style */
  101. .swMain ul.anchor li a {
  102. display:block;
  103. position:relative;
  104. float:left;
  105. margin:0;
  106. padding:3px;
  107. height:60px;
  108. width:230px;
  109. text-decoration: none;
  110. outline-style:none;
  111. -moz-border-radius : 5px;
  112. -webkit-border-radius: 5px;
  113. z-index:99;
  114. }
  115. .swMain ul.anchor li a .stepNumber{
  116. position:relative;
  117. float:left;
  118. width:30px;
  119. text-align: center;
  120. padding:5px;
  121. padding-top:0;
  122. font: bold 45px Verdana, Arial, Helvetica, sans-serif;
  123. }
  124. .swMain ul.anchor li a .stepDesc{
  125. position:relative;
  126. display:block;
  127. float:left;
  128. text-align: left;
  129. padding:5px;
  130. font: bold 20px Verdana, Arial, Helvetica, sans-serif;
  131. }
  132. .swMain ul.anchor li a .stepDesc small{
  133. font: normal 12px Verdana, Arial, Helvetica, sans-serif;
  134. }
  135. .swMain ul.anchor li a.selected{
  136. color:#F8F8F8;
  137. background: #EA8511; /* EA8511 */
  138. border: 1px solid #EA8511;
  139. cursor:text;
  140. -moz-box-shadow: 5px 5px 8px #888;
  141. -webkit-box-shadow: 5px 5px 8px #888;
  142. box-shadow: 5px 5px 8px #888;
  143. }
  144. .swMain ul.anchor li a.selected:hover {
  145. color:#F8F8F8;
  146. background: #EA8511;
  147. }
  148. .swMain ul.anchor li a.done {
  149. position:relative;
  150. color:#FFF;
  151. background: #8CC63F;
  152. border: 1px solid #8CC63F;
  153. z-index:99;
  154. }
  155. .swMain ul.anchor li a.done:hover {
  156. color:#5A5655;
  157. background: #8CC63F;
  158. border: 1px solid #5A5655;
  159. }
  160. .swMain ul.anchor li a.disabled {
  161. color:#CCCCCC;
  162. background: #F8F8F8;
  163. border: 1px solid #CCC;
  164. cursor:text;
  165. }
  166. .swMain ul.anchor li a.disabled:hover {
  167. color:#CCCCCC;
  168. background: #F8F8F8;
  169. }
  170. .swMain ul.anchor li a.error {
  171. color:#6c6c6c !important;
  172. background: #f08f75 !important;
  173. border: 1px solid #fb3500 !important;
  174. }
  175. .swMain ul.anchor li a.error:hover {
  176. color:#000 !important;
  177. }
  178. .swMain .buttonNext {
  179. display:block;
  180. float:right;
  181. margin:5px 3px 0 3px;
  182. padding:5px;
  183. text-decoration: none;
  184. text-align: center;
  185. font: bold 13px Verdana, Arial, Helvetica, sans-serif;
  186. width:100px;
  187. color:#FFF;
  188. outline-style:none;
  189. background-color: #5A5655;
  190. border: 1px solid #5A5655;
  191. -moz-border-radius : 5px;
  192. -webkit-border-radius: 5px;
  193. }
  194. .swMain .buttonDisabled {
  195. color:#F8F8F8 !important;
  196. background-color: #CCCCCC !important;
  197. border: 1px solid #CCCCCC !important;
  198. cursor:text;
  199. }
  200. .swMain .buttonPrevious {
  201. display:block;
  202. float:right;
  203. margin:5px 3px 0 3px;
  204. padding:5px;
  205. text-decoration: none;
  206. text-align: center;
  207. font: bold 13px Verdana, Arial, Helvetica, sans-serif;
  208. width:100px;
  209. color:#FFF;
  210. outline-style:none;
  211. background-color: #5A5655;
  212. border: 1px solid #5A5655;
  213. -moz-border-radius : 5px;
  214. -webkit-border-radius: 5px;
  215. }
  216. .swMain .buttonFinish {
  217. display:block;
  218. float:right;
  219. margin:5px 10px 0 3px;
  220. padding:5px;
  221. text-decoration: none;
  222. text-align: center;
  223. font: bold 13px Verdana, Arial, Helvetica, sans-serif;
  224. width:100px;
  225. color:#FFF;
  226. outline-style:none;
  227. background-color: #5A5655;
  228. border: 1px solid #5A5655;
  229. -moz-border-radius : 5px;
  230. -webkit-border-radius: 5px;
  231. }
  232. /* Form Styles */
  233. .txtBox {
  234. border:1px solid #CCCCCC;
  235. color:#5A5655;
  236. font:13px Verdana,Arial,Helvetica,sans-serif;
  237. padding:2px;
  238. width:430px;
  239. }
  240. .txtBox:focus {
  241. border:1px solid #EA8511;
  242. }
  243. .swMain .loader {
  244. position:relative;
  245. display:none;
  246. float:left;
  247. margin: 2px 0 0 2px;
  248. padding:8px 10px 8px 40px;
  249. border: 1px solid #FFD700;
  250. font: bold 13px Verdana, Arial, Helvetica, sans-serif;
  251. color:#5A5655;
  252. background: #FFF url(../images/loader.gif) no-repeat 5px;
  253. -moz-border-radius : 5px;
  254. -webkit-border-radius: 5px;
  255. z-index:998;
  256. }
  257. .swMain .msgBox {
  258. position:relative;
  259. display:none;
  260. float:left;
  261. margin: 4px 0 0 5px;
  262. padding:5px;
  263. border: 1px solid #FFD700;
  264. background-color: #FFFFDD;
  265. font: normal 12px Verdana, Arial, Helvetica, sans-serif;
  266. color:#5A5655;
  267. -moz-border-radius : 5px;
  268. -webkit-border-radius: 5px;
  269. z-index:999;
  270. min-width:200px;
  271. }
  272. .swMain .msgBox .content {
  273. font: normal 12px Verdana,Arial,Helvetica,sans-serif;
  274. padding: 0px;
  275. float:left;
  276. }
  277. .swMain .msgBox .close {
  278. border: 1px solid #CCC;
  279. border-radius: 3px;
  280. color: #CCC;
  281. display: block;
  282. float: right;
  283. margin: 0 0 0 5px;
  284. outline-style: none;
  285. padding: 0 2px 0 2px;
  286. position: relative;
  287. text-align: center;
  288. text-decoration: none;
  289. }
  290. .swMain .msgBox .close:hover{
  291. color: #EA8511;
  292. border: 1px solid #EA8511;
  293. }