smart_wizard_vertical.css 6.7 KB

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