PageRenderTime 972ms CodeModel.GetById 15ms RepoModel.GetById 0ms app.codeStats 0ms

/lib/jquery-validate/demo/login/screen.css

#
CSS | 457 lines | 313 code | 112 blank | 32 comment | 0 complexity | ff8fbccb3d2fd64a2248255fe3acb450 MD5 | raw file
Possible License(s): LGPL-2.1, Apache-2.0, BSD-3-Clause
  1. /*******************************************************************************
  2. ********************************************************************************
  3. **
  4. * - GENERAL
  5. *
  6. * - PAGE CONTAINERS
  7. *
  8. * - HEADER
  9. *
  10. * - CONTENT
  11. **
  12. ********************************************************************************
  13. ******************************************************************************/
  14. /* GENERAL ------------------------------------------------------------------ */
  15. html
  16. {
  17. height: 100%;
  18. }
  19. /* Zero default margin & padding around common elements */
  20. body, dd, dl, dt, form, h1, h2, h3, h4, h5, h6, ul, ol, li, p
  21. {
  22. margin: 0;
  23. border: none;
  24. padding: 0;
  25. }
  26. body
  27. {
  28. height: 100%;
  29. background-color: #333333;
  30. background-image: url(images/bg.gif);
  31. background-position: 0% 0;
  32. color: #000000;
  33. line-height: 1.5;
  34. font-family: Arial, Helvetica, sans-serif;
  35. font-size: 62.5%;
  36. text-align: center;
  37. overflow:auto;
  38. }
  39. a:link
  40. {
  41. color: #003399;
  42. }
  43. a:visited
  44. {
  45. color: #B266B2;
  46. }
  47. a:hover
  48. {
  49. text-decoration: none;
  50. }
  51. /* PAGE CONTAINERS ---------------------------------------------------------- */
  52. #page
  53. {
  54. width: 636px;
  55. w\idth: 600px;
  56. min-height: 100%;
  57. margin: 17px auto;
  58. padding: 0 18px;
  59. background-image: url(images/page.gif);
  60. background-repeat: repeat-y;
  61. text-align: left;
  62. }
  63. * html #page
  64. {
  65. height: 100%;
  66. }
  67. /* HEADER ------------------------------------------------------------------- */
  68. #header
  69. {
  70. height: 90px;
  71. background-color: #B2DD32;
  72. background-image: url(images/header1.jpg);
  73. background-repeat: repeat-x;
  74. }
  75. h1
  76. {
  77. padding: 0 35px;
  78. font-size: 2.2em;
  79. font-weight: normal;
  80. line-height: 82px;
  81. }
  82. /* CONTENT ------------------------------------------------------------------ */
  83. #content
  84. {
  85. padding: 0 25px;
  86. }
  87. p
  88. {
  89. font-size:1.1em;
  90. margin-top: 1.5em;
  91. }
  92. form
  93. {
  94. margin-top: 1.5em;
  95. }
  96. /*** MASTER FORM WIDTHS - CUSTOMIZE THIS TO CHANGE THE FORM LAYOUT ***/
  97. /*
  98. form width: 550px
  99. left column: 190px / 180px + 10px padding
  100. mid column: 200px
  101. right column: 160px
  102. */
  103. form{
  104. width:550px !important;
  105. }
  106. fieldset.submit
  107. {
  108. padding-left: 190px !important;
  109. }
  110. form label{
  111. padding:0px 10px;
  112. width: 160px;
  113. }
  114. form label.error,
  115. form input.submit
  116. {
  117. margin-left:180px !important;
  118. }
  119. form fieldset fieldset label.error
  120. {
  121. margin-left:0px !important;
  122. width:200px !important;
  123. }
  124. form .centered{
  125. margin-left:180px !important;
  126. width:200px !important;
  127. }
  128. form .text,
  129. form .button,
  130. form .group,
  131. form .control,
  132. form .submit,
  133. form textarea,
  134. form select
  135. {
  136. width: 200px !important;
  137. }
  138. /*** FIELDSETS AND LEGENDS ***/
  139. form{
  140. width:550px;
  141. margin-bottom:25px;
  142. clear:both;
  143. }
  144. form fieldset
  145. {
  146. margin: 0 0 1.5em 0;
  147. padding: 0 0 10px 0px;
  148. border: 1px solid #BFBAB0;
  149. background-color: #F2EFE9;
  150. background-image: url(images/fieldset_gradient.jpg);
  151. background-repeat: repeat-x;
  152. background-color: #fff;
  153. background-image: url(images/fieldset-gradient-02.jpg);
  154. background-position:bottom;
  155. float: left;
  156. clear: both;
  157. width: 100%;
  158. }
  159. form fieldset.submit
  160. {
  161. padding: 0px 10px 10px 190px;
  162. border-style: none;
  163. background-color: transparent;
  164. background-image: none;
  165. float: none;
  166. width: auto;
  167. }
  168. form legend
  169. {
  170. color: #000000;
  171. font-size:1.3em;
  172. font-weight: bold;
  173. font-variant:small-caps;
  174. margin-left: 1em;
  175. padding:0px 5px;
  176. }
  177. form fieldset p{
  178. margin:10px 0px 0px 10px;
  179. }
  180. /*** FORM BLOCKS ***/
  181. form ul
  182. {
  183. padding:5px 10px;
  184. list-style: none;
  185. }
  186. form li
  187. {
  188. width: 100%;
  189. padding:5px 0px 10px 0;
  190. border-top:1px dotted #ccc;
  191. display:block;
  192. float: left;
  193. clear: left;
  194. }
  195. form li:first-child
  196. {
  197. border:none;
  198. }
  199. /*** FORM BLOCK ELEMENTS ***/
  200. form label
  201. {
  202. padding:0px 10px;
  203. width: 160px;
  204. float: left;
  205. }
  206. form .error{
  207. color: #c00;
  208. }
  209. form label.error
  210. {
  211. color: #c00;
  212. font-size: 100%;
  213. font-weight: bold;
  214. font-variant:small-caps;
  215. width:308px;
  216. display: none;
  217. margin:8px 0px 0px 180px;
  218. padding:3px 0px 0px 5px;
  219. border-top:1px dotted #ccc;
  220. clear:both;
  221. }
  222. form label.info{
  223. font-size: 100%;
  224. font-weight: bold;
  225. font-variant:small-caps;
  226. margin:8px 0px 0px 180px;
  227. padding:3px 0px 0px 5px;
  228. }
  229. form fieldset fieldset,
  230. form .group
  231. {
  232. width:200px;
  233. margin: 0;
  234. border:none;
  235. background:none;
  236. float:left;
  237. clear: none;
  238. }
  239. form fieldset fieldset label
  240. {
  241. width:auto !important;
  242. white-space:nowrap;
  243. padding:0px;
  244. margin:0px;
  245. display:block;
  246. clear:both;
  247. }
  248. form label label.error{
  249. margin-left:0px;
  250. }
  251. form label.centered{
  252. padding:0px 0px;
  253. width:200px !important;
  254. }
  255. /* see also the error class at the foot of the page */
  256. form fieldset fieldset label.spaced
  257. {
  258. margin-bottom:3px;
  259. }
  260. /*** FORM ELEMENT COLUMNS ***/
  261. .col-1,
  262. fieldset fieldset.col-1 label
  263. {
  264. width:100%;
  265. }
  266. .col-2,
  267. fieldset fieldset.col-2 label
  268. {
  269. width:50%;
  270. }
  271. .col-3,
  272. fieldset fieldset.col-3 label
  273. {
  274. width:33%;
  275. }
  276. .col-4,
  277. fieldset fieldset.col-4 label
  278. {
  279. width:25%;
  280. }
  281. /*** FORM ELEMENTS ***/
  282. form input.submit{
  283. margin:10px 0px 10px 180px;
  284. padding:0px 2px;
  285. }
  286. form input, textarea, select,
  287. form label
  288. {
  289. font-size:1.1em;
  290. line-height:1.6em;
  291. }
  292. form input, textarea, select
  293. {
  294. font-family: Verdana, Arial, Helvetica, sans-serif;
  295. }
  296. form .input[type="text"],
  297. form textarea
  298. {
  299. padding:1px;
  300. }
  301. form .input[type="radio"],
  302. form .input[type="checkbox"]
  303. {
  304. margin:0px;
  305. padding:0px;
  306. position:relative;
  307. top:3px;
  308. }
  309. /*** SUPPORTING CLASSES ***/
  310. form label.required{
  311. background-image:url(images/required_star.gif);
  312. background-position:right;
  313. background-repeat:no-repeat;
  314. }
  315. form span.required{
  316. padding-right:15px;
  317. }
  318. form .clean
  319. {
  320. border:none;
  321. }
  322. form .info{
  323. padding-top:0.5em;
  324. font-size:80%;
  325. line-height:100%;
  326. color:#aaa;
  327. }
  328. form .indent{
  329. padding:2px 20px;
  330. width:auto !important;
  331. white-space:nowrap;
  332. padding-left: 25px !important;
  333. }
  334. form label.disabled{
  335. color:#aaa;
  336. }
  337. form .highlight{
  338. background-color:#e2e2e2;
  339. }
  340. .off{
  341. display:none !important;
  342. }
  343. .clear{
  344. clear:both;
  345. }