base.css 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170
  1. a:hover {
  2. text-decoration:none;
  3. }
  4. h1 {
  5. font-weight:bold;
  6. font-size:220%;
  7. float:left;
  8. margin-top:5px;
  9. }
  10. h2 {
  11. font-size:200%;
  12. margin-bottom:10px;
  13. letter-spacing:-1px;
  14. }
  15. h2.ribbon {
  16. padding:15px 30px;
  17. position:relative;
  18. left:-55px;
  19. float:left;
  20. margin-bottom:20px;
  21. border-radius:3px 3px 3px 0px;
  22. -moz-border-radius:3px 3px 3px 0px;
  23. -webkit-border-radius:3px 3px 3px 0px;
  24. }
  25. .triangle-ribbon {
  26. border-style:solid;
  27. border-width:13px;
  28. height:0;
  29. position:relative;
  30. width:0;
  31. float:left;
  32. clear:left;
  33. left:-67px;
  34. top:-33px;
  35. z-index:-1;
  36. }
  37. h2.full {
  38. width:890px;
  39. }
  40. h2 span {
  41. position:absolute;
  42. right:25px;
  43. font-size:80%;
  44. margin:3px 0 0;
  45. }
  46. h3 {
  47. font-size:180%;
  48. font-weight: bold;
  49. margin-bottom:15px;
  50. }
  51. aside h3 {
  52. font-size:138.5%;
  53. font-weight:bold;
  54. margin-bottom:15px;
  55. color:#333333;
  56. padding-bottom:10px;
  57. border-bottom:1px solid #D9D9D9;
  58. }
  59. h4 {
  60. font-size:128%;
  61. font-weight: bold;
  62. margin-bottom:20px;
  63. color:#333333;
  64. }
  65. h5 {
  66. font-size:100%;
  67. }
  68. h5.inline {
  69. float:left;
  70. margin-right:10px;
  71. }
  72. h6 {
  73. font-size:93%;
  74. }
  75. h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {
  76. margin-right:5px;
  77. vertical-align:-2px;
  78. }
  79. /*//// - Misc - ////*/
  80. .fl {
  81. float:left;
  82. }
  83. img.fl {
  84. margin:0 25px 25px 0;
  85. }
  86. .fr {
  87. float:right;
  88. }
  89. img.fr {
  90. margin:0 0 25px 25px;
  91. }
  92. .fn {
  93. float:none!important;
  94. }
  95. .cl {
  96. background: none;
  97. border: 0;
  98. clear: both;
  99. display: block;
  100. float: none;
  101. font-size: 0;
  102. list-style: none;
  103. margin: 0;
  104. padding: 0;
  105. overflow: hidden;
  106. visibility: hidden;
  107. width: 0;
  108. height: 0;
  109. }
  110. .tl {
  111. text-align:left;
  112. }
  113. .tr {
  114. text-align:right;
  115. }
  116. .tc {
  117. text-align:center;
  118. }
  119. .hd {
  120. display: none;
  121. }
  122. .strong {
  123. font-weight: 700!important;
  124. }
  125. .no-margin {
  126. margin:0!important;
  127. }
  128. .no-padding {
  129. padding:0!important;
  130. }
  131. .margin-left {
  132. margin-left:20px;
  133. }
  134. .margin-right {
  135. margin-right:20px;
  136. }
  137. .margin-top {
  138. margin-top:20px;
  139. }
  140. .margin-bottom {
  141. margin-bottom:20px;
  142. }
  143. .border-top {
  144. border-top:1px solid #D9D9D9;
  145. padding-top:10px;
  146. margin-top:20px;
  147. }
  148. .border-left {
  149. border-left:1px solid #D9D9D9;
  150. padding-left:10px;
  151. margin-left:20px;
  152. }
  153. .border-bottom {
  154. border-bottom:1px solid #D9D9D9;
  155. padding-bottom:10px;
  156. margin-bottom:20px;
  157. }
  158. .border-right {
  159. border-top:1px solid #D9D9D9;
  160. padding-top:10px;
  161. margin-top:20px;
  162. }
  163. .txt-smaller {
  164. font-size:85%
  165. }
  166. .txt-small {
  167. font-size:93%
  168. }
  169. .txt-light {
  170. color:#4d4d4d;
  171. }
  172. .txt-lighter {
  173. color:#666;
  174. }
  175. nav {
  176. float: left;
  177. }
  178. #nav {
  179. line-height: 100%;
  180. margin: 0 auto;
  181. padding: 10px;
  182. width: 100%;
  183. }
  184. #nav li {
  185. display: inline-block;
  186. list-style: none;
  187. z-index: 100;
  188. margin-left: 15px;
  189. }
  190. /* main level link */
  191. #nav a {
  192. font-weight: bold;
  193. text-decoration: none;
  194. display: block;
  195. padding: 8px 12px;
  196. font-size:113%;
  197. -webkit-border-radius: 3px;
  198. -moz-border-radius: 3px;
  199. }
  200. #nav a:hover {
  201. background: #000;
  202. color: #000;
  203. }
  204. /* main level link hover */
  205. #nav .current a, #nav li:hover > a {
  206. background: #e5e5e5;
  207. color: #444;
  208. border-top: solid 1px #cccccc;
  209. border-left: solid 1px #cccccc;
  210. border-right:1px solid #e0e0e0;
  211. border-bottom:1px solid #e0e0e0;
  212. padding:7px 11px 8px;
  213. text-shadow:0 1px 0 #FFFFFF;
  214. }
  215. /* rounded corners of first and last link */
  216. #nav ul li:first-child > a {
  217. -webkit-border-top-left-radius: 3px;
  218. -moz-border-radius-topleft: 3px;
  219. -webkit-border-top-right-radius: 3px;
  220. -moz-border-radius-topright: 3px;
  221. }
  222. #nav ul li:last-child > a {
  223. -webkit-border-bottom-left-radius: 3px;
  224. -moz-border-radius-bottomleft: 3px;
  225. -webkit-border-bottom-right-radius: 3px;
  226. -moz-border-radius-bottomright: 3px;
  227. }
  228. header {
  229. width: 980px;
  230. margin: 25px auto 20px;
  231. }
  232. footer {
  233. padding: 10px 0;
  234. width: 980px;
  235. margin: 25px auto 20px;
  236. }
  237. #page {
  238. background: #fff;
  239. color: #191919;
  240. border: 1px solid #d9d9d9;
  241. padding: 40px;
  242. position: relative;
  243. width: 898px;
  244. margin: 0 auto;
  245. z-index: 1;
  246. border-radius: 3px;
  247. -moz-border-radius: 3px;
  248. -webkit-border-radius: 3px;
  249. }
  250. #page-content.two-col {
  251. float:left;
  252. padding-right:35px;
  253. width:600px;
  254. display:inline;
  255. }
  256. .breadcrumbs {
  257. margin:0 0 20px;
  258. list-style:none;
  259. padding:10px 15px;
  260. background:#f2f2f2;
  261. border:1px solid #D9D9D9;
  262. font-size:93%;
  263. color:#333333;
  264. border-radius:3px;
  265. -moz-border-radius:3px;
  266. -webkit-border-radius:3px;
  267. }
  268. .breadcrumbs li {
  269. display:inline;
  270. }
  271. aside {
  272. float:left;
  273. width:260px;
  274. color:#333333;
  275. display:inline;
  276. }
  277. section {
  278. margin-bottom:20px;
  279. padding-bottom:20px;
  280. border-bottom:1px solid #d9d9d9;
  281. }
  282. .inlinepic {
  283. background:#fafafa;
  284. border:1px solid #ccc;
  285. padding:5px;
  286. box-shadow:0 0 5px #D9D9D9;
  287. -moz-box-shadow:0 0 5px #D9D9D9;
  288. -webkit-box-shadow:0 0 5px #D9D9D9;
  289. }
  290. blockquote {
  291. background:url("../img/quote.gif") no-repeat 0 5px;
  292. color:#444444;
  293. line-height:1.6;
  294. padding:5px 20px 10px 45px;
  295. margin-bottom:20px;
  296. }
  297. blockquote cite {
  298. color:#666666;
  299. font-size:12px;
  300. font-style:italic;
  301. }
  302. /*// About Page //*/
  303. #teamlist {
  304. margin:0;
  305. list-style:none;
  306. }
  307. #teamlist li {
  308. margin-bottom:20px;
  309. padding-bottom:10px;
  310. border-bottom:1px solid #D9D9D9;
  311. }
  312. #teamlist li.last {
  313. border-bottom:0;
  314. margin-bottom:0;
  315. padding-bottom:0;
  316. }
  317. /*// Services Page //*/
  318. .services-list {
  319. margin:0;
  320. list-style:none;
  321. }
  322. .services-list li {
  323. float:left;
  324. width:270px;
  325. margin-right:30px;
  326. margin-bottom:20px;
  327. font-size:93%;
  328. }
  329. .services-list li p {
  330. margin-bottom:5px;
  331. }
  332. .services-list li a {
  333. float:right;
  334. }
  335. .services-list li img {
  336. float:left;
  337. margin:5px 20px 30px 0;
  338. }
  339. .services-list li.last {
  340. margin-right:0;
  341. }
  342. .process {
  343. height:31px;
  344. width:31px;
  345. background: url(../img/process.gif);
  346. color:#fff;
  347. display:block;
  348. font-size:138%;
  349. font-weight:bold;
  350. line-height:28px;
  351. text-align:center;
  352. margin:5px 20px 30px 0;
  353. float:left;
  354. }
  355. /*// Portfolio Page //*/
  356. .portfolio-small {
  357. list-style:none outside none;
  358. margin:0 -35px 0;
  359. }
  360. .portfolio-small li a {
  361. display:block;
  362. }
  363. .portfolio-small li {
  364. float:left;
  365. margin-bottom:20px;
  366. margin-left:35px;
  367. width:275px;
  368. }
  369. .portfolio-small li img {
  370. margin-bottom:10px;
  371. }
  372. .portfolio-small li h4 {
  373. margin-bottom:10px;
  374. }
  375. .portfolio-small li p {
  376. margin-bottom:10px;
  377. }
  378. .portfolio-list {
  379. list-style:none outside none;
  380. margin:0;
  381. }
  382. .portfolio-list li {
  383. margin-bottom:20px;
  384. padding-bottom:20px;
  385. }
  386. .portfolio-list li img {
  387. float:left;
  388. }
  389. .portfolio-list li.last {
  390. padding-bottom:0;
  391. }
  392. .portfolio-list li div {
  393. margin-left: 390px;
  394. }
  395. .portfolio-list li p {
  396. margin-bottom:15px;
  397. }
  398. p {
  399. line-height:1.6;
  400. margin-bottom:20px;
  401. }
  402. .list {
  403. margin-bottom:15px;
  404. }
  405. .list li {
  406. margin-bottom:5px;
  407. padding:0;
  408. }
  409. .list ul {
  410. margin-bottom:15px;
  411. }
  412. dl.definition {
  413. margin-bottom:20px;
  414. }
  415. dl.definition dt {
  416. font-weight:bold;
  417. margin-bottom:5px;
  418. padding-left:20px;
  419. }
  420. dl.definition dd {
  421. color:#666666;
  422. margin-bottom:15px;
  423. padding-left:20px;
  424. }
  425. .tags {
  426. margin:0 0 15px;
  427. list-style:none;
  428. }
  429. .tags li {
  430. display:inline;
  431. background:#D9D9D9;
  432. margin-right:10px;
  433. font-size:85%;
  434. padding:3px 6px;
  435. border-radius:20px;
  436. -moz-border-radius:20px;
  437. -webkit-border-radius:20px;
  438. }
  439. .social {
  440. margin:0 0 15px;
  441. list-style:none;
  442. }
  443. .social li {
  444. display:inline;
  445. margin-right:10px;
  446. }
  447. #feature {
  448. margin-bottom:20px;
  449. }
  450. .feature-img {
  451. float:left;
  452. margin-top:10px;
  453. }
  454. .feature-text {
  455. margin-left:545px;
  456. }
  457. h2#tagline {
  458. font-size:240%;
  459. }
  460. h3#tagline-mini {
  461. font-weight:normal;
  462. font-size:100%;
  463. color:#4d4d4d;
  464. line-height:1.6;
  465. margin-bottom:25px;
  466. }
  467. .feature-screenshots {
  468. margin:0;
  469. list-style:none;
  470. }
  471. .feature-screenshots li {
  472. float:left;
  473. margin: 0 20px 10px 0;
  474. }
  475. /* Homepage */
  476. .feature img {
  477. float:left;
  478. }
  479. .feature p {
  480. margin-left:70px;
  481. }
  482. .scrollable {
  483. height:110px;
  484. overflow:hidden;
  485. position:relative;
  486. width:100%;
  487. }
  488. .scrollable .items {
  489. clear:both;
  490. position:absolute;
  491. width:20000em;
  492. }
  493. .items div {
  494. float:left;
  495. width:740pxpx;
  496. }
  497. .scrollable img {
  498. -moz-border-radius:4px 4px 4px 4px;
  499. background-color:#FFFFFF;
  500. border:1px solid #CCCCCC;
  501. float:left;
  502. height:100px;
  503. margin:0 4px 0 35px;
  504. padding:2px;
  505. width:100px;
  506. }
  507. .scrollable .active {
  508. border:2px solid #000000;
  509. cursor:default;
  510. position:relative;
  511. }
  512. /* this makes it possible to add next button beside scrollable */
  513. .scrollable {
  514. float:left;
  515. }
  516. /* prev, next, prevPage and nextPage buttons */
  517. a.browse {
  518. background:url(../img/scrollable.png) no-repeat;
  519. display:block;
  520. width:30px;
  521. height:30px;
  522. margin:40px 10px;
  523. cursor:pointer;
  524. font-size:1px;
  525. position:absolute;
  526. }
  527. /* right */
  528. a.right {
  529. background-position: 0 -30px;
  530. clear:right;
  531. margin-right: 0px;
  532. right:25px;
  533. }
  534. a.right:hover {
  535. background-position:-30px -30px;
  536. }
  537. a.right:active {
  538. background-position:-60px -30px;
  539. }
  540. /* left */
  541. a.left {
  542. margin-left: 0px;
  543. left:25px;
  544. }
  545. a.left:hover {
  546. background-position:-30px 0;
  547. }
  548. a.left:active {
  549. background-position:-60px 0;
  550. }
  551. /* up and down */
  552. a.up, a.down {
  553. background:url(../img/scrollable/arrow/vert_large.png) no-repeat;
  554. float: none;
  555. margin: 10px 50px;
  556. }
  557. /* up */
  558. a.up:hover {
  559. background-position:-30px 0;
  560. }
  561. a.up:active {
  562. background-position:-60px 0;
  563. }
  564. /* down */
  565. a.down {
  566. background-position: 0 -30px;
  567. }
  568. a.down:hover {
  569. background-position:-30px -30px;
  570. }
  571. a.down:active {
  572. background-position:-60px -30px;
  573. }
  574. /* disabled navigational button */
  575. a.disabled {
  576. visibility:hidden !important;
  577. }
  578. .search {
  579. float: right;
  580. margin-top: 5px;
  581. }
  582. button.search {
  583. background:#fff url(../img/grad-grey.gif) repeat-x top;
  584. border:1px solid #d9d9d9;
  585. color:#404040;
  586. height:38px;
  587. line-height:12px;
  588. font-size:108%;
  589. font-weight:bold;
  590. padding:8px 8px 10px;
  591. margin: 0 0 0 5px;
  592. text-shadow:0 1px 0 #FFFFFF;
  593. border-radius:5px;
  594. -moz-border-radius:5px;
  595. -webkit-border-radius:5px;
  596. }
  597. .pricing-table h4 {
  598. color:#FFFFFF;
  599. font-size:240%;
  600. margin-bottom:5px;
  601. }
  602. .pricing-table h5 {
  603. color:#FFFFFF;
  604. font-size:140%;
  605. margin-bottom:5px;
  606. }
  607. .pricing-table .header {
  608. background:url(../img/grad-blue.gif) repeat-x scroll center top #166890;
  609. border:1px solid #11506F;
  610. color:#FFFFFF;
  611. text-align:center;
  612. width:28%;
  613. padding:5px;
  614. }
  615. .pricing-table .blank {
  616. background:#fff;
  617. border:none;
  618. }
  619. .pricing-table .feature {
  620. border-left:1px solid #58bbec;
  621. }
  622. .pricing-table .feature.first {
  623. border-top:1px solid #58bbec;
  624. }
  625. .pricing-table {
  626. border-right:1px solid #58bbec;
  627. border-bottom:1px solid #58bbec;
  628. width:100%;
  629. margin-bottom:20px;
  630. }
  631. .pricing-table thead th, .pricing-table thead td {
  632. padding:6px 10px;
  633. font-weight: 700;
  634. color: #333;
  635. background: #EAEBFA;
  636. border-bottom: 1px solid #D9D9D9;
  637. border-right:1px solid #D9D9D9;
  638. }
  639. .pricing-table thead th.last, .pricing-table thead td.last {
  640. border-right:0;
  641. }
  642. .pricing-table tbody th, .pricing-table tbody td {
  643. background:#EAEBFA;
  644. border-right:1px dotted #D9D9D9;
  645. vertical-align:middle;
  646. padding:12px;
  647. font-size:93%;
  648. text-align:center;
  649. }
  650. .pricing-table tbody tr.alt td {
  651. background:#e4e6fa;
  652. }
  653. .pricing-table tbody th.last, .pricing-table tbody td.last {
  654. border-right:0 none;
  655. }
  656. .pricing-table tbody tr.last td {
  657. border-bottom:0 none;
  658. }
  659. /*//// - Forms - ////*/
  660. body.ie7 form, body.ie8 {
  661. margin-bottom:40px;
  662. }
  663. form p {
  664. margin-bottom:15px;
  665. }
  666. form label {
  667. float:left;
  668. width:140px;
  669. margin-top:5px;
  670. }
  671. form input, form textarea {
  672. padding:10px 5px;
  673. background:#fff url(../img/bg-input.gif) repeat-x top;
  674. border:1px solid #D9D9D9;
  675. width:448px;
  676. border-radius:3px;
  677. -moz-border-radius:3px;
  678. -webkit-border-radius:3px;
  679. }
  680. form input.small {
  681. width:35px;
  682. }
  683. #message {
  684. margin-bottom:20px;
  685. }
  686. .error-message {
  687. background:url("../img/error.png") no-repeat 10px center #FECDC6;
  688. padding:10px 35px;
  689. border-radius:3px;
  690. -moz-border-radius:3px;
  691. -webkit-border-radius:3px;
  692. }
  693. .success-message {
  694. background:url(../img/success.png) no-repeat 10px center #F1FFBF;
  695. padding:10px 35px;
  696. border-radius:3px;
  697. -moz-border-radius:3px;
  698. -webkit-border-radius:3px;
  699. }
  700. /* Buttons */
  701. button, .button {
  702. cursor:pointer;
  703. display:inline-block;
  704. font-size:108%;
  705. font-weight:700;
  706. margin:0 5px 15px 0;
  707. outline:none;
  708. padding:10px 15px;
  709. width:auto;
  710. text-align:center;
  711. text-decoration:none !important;
  712. vertical-align:middle;
  713. background:url('../img/grad-grey.gif') repeat-x center top #c3c3c3;
  714. color:#444444;
  715. border:1px solid #c3c3c3;
  716. text-shadow:0 -1px 0 #FFFFFF;
  717. border-radius:3px;
  718. -moz-border-radius:3px;
  719. -webkit-border-radius:3px;
  720. }
  721. body.ie7 button, body.ie8 button, body.ie7 .button, body.ie8 .button {
  722. zoom:1;
  723. display:inline;
  724. }
  725. button:hover, .button:hover {
  726. background:url('../img/grad-grey-hover.gif') repeat-x center top #c3c3c3;
  727. text-decoration:none;
  728. outline:none;
  729. }
  730. button:active, .button:active {
  731. position:relative;
  732. top:1px;
  733. outline:none;
  734. background:url('../img/grad-grey-rev.gif') repeat-x center top #c3c3c3;
  735. }
  736. /* Blue Button */
  737. button.blue, .button.blue {
  738. background:url("../img/grad-blue.gif") repeat-x center top #166890;
  739. border:1px solid #11506F;
  740. color:#FFFFFF;
  741. text-shadow:0 -1px 0 #11506F;
  742. }
  743. button.blue:hover, .button.blue:hover {
  744. background:url("../img/grad-blue-hover.gif") repeat-x center top #166890;
  745. }
  746. button.blue:active, .button.blue:active {
  747. background:url("../img/grad-blue-rev.gif") repeat-x center top #166890;
  748. }
  749. /* Green Button */
  750. button.green, .button.green {
  751. background:url("../img/grad-green.gif") repeat-x center top #518f14;
  752. border:1px solid #406f11;
  753. color:#FFFFFF;
  754. text-shadow:0 -1px 0 #406f11;
  755. }
  756. button.green:hover, .button.green:hover {
  757. background:url("../img/grad-green-hover.gif") repeat-x center top #166890;
  758. }
  759. button.green:active, .button.green:active {
  760. background:url("../img/grad-green-rev.gif") repeat-x center top #166890;
  761. }
  762. /* Red Button */
  763. button.red, .button.red {
  764. background:url("../img/grad-red.gif") repeat-x center top #8f1e14;
  765. border:1px solid #6f1811;
  766. color:#FFFFFF;
  767. text-shadow:0 -1px 0 #6f1811;
  768. }
  769. button.red:hover, .button.red:hover {
  770. background:url("../img/grad-red-hover.gif") repeat-x center top #166890;
  771. }
  772. button.red:active, .button.red:active {
  773. background:url("../img/grad-red-rev.gif") repeat-x center top #166890;
  774. }
  775. /* Purple Button */
  776. button.purple, .button.purple {
  777. background:url("../img/grad-purple.gif") repeat-x center top #8f146e;
  778. border:1px solid #6f1156;
  779. color:#FFFFFF;
  780. text-shadow:0 -1px 0 #6f1156;
  781. }
  782. button.purple:hover, .button.purple:hover {
  783. background:url("../img/grad-purple-hover.gif") repeat-x center top #166890;
  784. }
  785. button.purple:active, .button.blue:active {
  786. background:url("../img/grad-purple-rev.gif") repeat-x center top #166890;
  787. }
  788. /* Black Button */
  789. button.black, .button.black {
  790. background:url("../img/grad-black.gif") repeat-x center top #3b3b3b;
  791. border:1px solid #3b3b3b;
  792. color:#FFFFFF;
  793. text-shadow:0 -1px 0 #3b3b3b;
  794. }
  795. button.black:hover, .button.black:hover {
  796. background:url("../img/grad-black-hover.gif") repeat-x center top #3b3b3b;
  797. }
  798. button.black:active, .button.black:active {
  799. background:url("../img/grad-black-rev.gif") repeat-x center top #3b3b3b;
  800. }
  801. button.large, .button.large {
  802. font-size:138.5%;
  803. padding:10px 30px;
  804. }
  805. button.small, .button.small {
  806. font-size:93%;
  807. padding:4px 10px 5px;
  808. }
  809. button.disabled, button.disabled:hover, .button.disabled, .button.disabled:hover {
  810. background-color:#ccc !important;
  811. color:#666 !important;
  812. text-shadow:0 1px 0 #CCCCCC;
  813. cursor:default;
  814. }
  815. body.ie7 button.disabled, body.ie8 button.disabled {
  816. border-color:#a3a3a3;
  817. }
  818. button.disabled:active, .button.disabled:active {
  819. position:relative;
  820. top:0;
  821. background-image: url('../img/grad.png');
  822. }
  823. fieldset button, .button {
  824. margin:0 5px 10px 0;
  825. }
  826. button img, .button img {
  827. display:inline;
  828. height:16px;
  829. margin-right:10px;
  830. vertical-align:-3px;
  831. width:16px;
  832. }
  833. /* notifications */
  834. .notification.success {
  835. background:#f1ffbf url('../img/icons/success.png') no-repeat 10px 10px;
  836. border-color:#a6d50f;
  837. }
  838. .notification.success span.strong {
  839. color:#283304;
  840. }
  841. .notification.error {
  842. background:#fecdc6 url('../img/icons/error.png') no-repeat 10px 10px;
  843. border-color:#f45d43;
  844. }
  845. .notification.error span.strong {
  846. color:#33130e;
  847. }
  848. .notification.warning {
  849. background:#ffecb0 url('../img/icons/warning.png') no-repeat 10px 10px;
  850. border-color:#ffbc2a;
  851. }
  852. .notification.warning span.strong {
  853. color:#332508;
  854. }
  855. .notification.info {
  856. background:#d4e7f5 url('../img/icons/information.png') no-repeat 10px 10px;
  857. border-color:#589ad7;
  858. }
  859. .notification.info span.strong {
  860. color:#152433;
  861. }
  862. .notification.tip {
  863. background:#ffeccd url('../img/icons/tip.png') no-repeat 10px 10px;
  864. border-color:#dd9854;
  865. }
  866. .notification.tip span.strong {
  867. color:#332313;
  868. }
  869. .notification {
  870. padding:10px 10px 10px 35px;
  871. border:1px solid #fff;
  872. margin-bottom:10px;
  873. position:relative;
  874. font-size:100%;
  875. border-radius:3px;
  876. -moz-border-radius:3px;
  877. -webkit-border-radius:3px;
  878. }
  879. .notification p {
  880. margin-bottom:0;
  881. }
  882. .notification .close {
  883. background:url("../img/icons/close.png") no-repeat scroll 0 0 transparent;
  884. cursor:pointer;
  885. display:block;
  886. height:16px;
  887. position:absolute;
  888. right:10px;
  889. top:10px;
  890. width:16px;
  891. }
  892. .notification .close:hover {
  893. opacity:1;
  894. }
  895. .notification.nopic {
  896. background-image:none;
  897. padding:10px;
  898. }
  899. .notification span.strong {
  900. margin-right:10px;
  901. }
  902. /* Bullet List */
  903. .bullet-list {
  904. list-style:none;
  905. margin-bottom:15px;
  906. margin-left:0;
  907. }
  908. .bullet-list li {
  909. background:url("../img/bullet_arrow_right.png") no-repeat left center transparent;
  910. margin-bottom:5px;
  911. padding:6px 6px 6px 20px;
  912. }
  913. .bullet-list li a {
  914. -webkit-border-radius:3px;
  915. -moz-border-radius:3px;
  916. border-radius:3px;
  917. color:#181818;
  918. display:block;
  919. margin:-6px;
  920. padding:6px;
  921. text-decoration:none;
  922. }
  923. .bullet-list li a:hover {
  924. background-color:#E2E2E2;
  925. margin:-6px -6px -6px -20px;
  926. padding:6px 6px 6px 20px;
  927. }
  928. .bullet-list.grey li {
  929. -webkit-border-radius:3px;
  930. -moz-border-radius:3px;
  931. border-radius:3px;
  932. background-color:#f2f2f2;
  933. width:50%;
  934. }
  935. /* Definition List */
  936. dl.definition {
  937. margin-bottom:20px;
  938. }
  939. dl.definition dt {
  940. background:url("../img/icons/16/bullet_arrow_right.png") no-repeat left center;
  941. font-weight: 700;
  942. margin-bottom:5px;
  943. padding-left:20px;
  944. }
  945. dl.definition dd {
  946. color:#666666;
  947. margin-bottom:15px;
  948. padding-left:20px;
  949. }
  950. /* Pagination */
  951. .pagination {
  952. display: inline-block;
  953. font-size: 77%;
  954. text-decoration: none;
  955. }
  956. .pagination a, .pagination .dots {
  957. background:url("../img/grad-grey.gif") repeat-x scroll center top #C3C3C3;
  958. border:1px solid #C3C3C3;
  959. display: inline-block;
  960. color:#444444 !important;
  961. margin-right: 2px;
  962. padding: 6px 8px;
  963. text-decoration:none;
  964. -moz-border-radius: 3px;
  965. -webkit-border-radius: 3px;
  966. border-radius: 3px;
  967. }
  968. .pagination a:hover {
  969. background: url("../img/grad-grey-hover.gif") repeat-x scroll center top #C3C3C3;
  970. color: #444444;
  971. }
  972. .pagination a.current {
  973. background: url("../img/grad-grey-rev.gif") repeat-x scroll center top #C3C3C3;
  974. color: #444444;
  975. }
  976. .pagination a.number.current {
  977. color: #444;
  978. }
  979. /* Small Pagination */
  980. .pagination.small a, .pagination.small .dots {
  981. margin-right: 1px;
  982. padding: 1px 4px;
  983. -moz-border-radius: 6px;
  984. -webkit-border-radius: 6px;
  985. border-radius: 6px;
  986. }
  987. /* Table Styles */
  988. .table {
  989. border:1px solid #CCCCCC;
  990. width:100%;
  991. margin-bottom:20px;
  992. }
  993. .table.no-border {
  994. border:none
  995. }
  996. .table thead th, .table thead td {
  997. padding:6px 10px;
  998. font-weight: 700;
  999. color: #333;
  1000. background: #E2E2E2;
  1001. border-bottom: 1px solid #cccccc;
  1002. border-right:1px solid #CCCCCC;
  1003. }
  1004. .table thead th.last, .table thead td.last {
  1005. border-right:0;
  1006. }
  1007. .table thead th.checkbox, .table thead td.checkbox {
  1008. width:25px;
  1009. }
  1010. .table tbody th, .table tbody td {
  1011. background:#fff;
  1012. border-right:1px dotted #CCCCCC;
  1013. vertical-align:middle;
  1014. padding:10px;
  1015. font-size:93%;
  1016. }
  1017. .table tbody tr.alt td {
  1018. background:#F2F2F2;
  1019. }
  1020. .table tbody th.last, .table tbody td.last {
  1021. border-right:0 none;
  1022. }
  1023. .table tbody tr.last td {
  1024. border-bottom:0 none;
  1025. }
  1026. .table tbody tr:hover th, .table tbody tr:hover td {
  1027. background:#d3ecf9;
  1028. }
  1029. /* Tispy Tooltips */
  1030. .tipsy {
  1031. padding: 5px;
  1032. font-size: 93%;
  1033. opacity: 0.8;
  1034. filter: alpha(opacity=80);
  1035. background-repeat: no-repeat;
  1036. background-image: url(../img/tipsy.gif);
  1037. }
  1038. .tipsy-inner {
  1039. padding: 5px 8px 4px 8px;
  1040. background-color: black;
  1041. color: white;
  1042. max-width: 200px;
  1043. text-align: center;
  1044. }
  1045. .tipsy-inner {
  1046. border-radius:3px;
  1047. -moz-border-radius:3px;
  1048. -webkit-border-radius:3px;
  1049. }
  1050. .tipsy-north {
  1051. background-position: top center;
  1052. }
  1053. .tipsy-south {
  1054. background-position: bottom center;
  1055. }
  1056. .tipsy-east {
  1057. background-position: right center;
  1058. }
  1059. .tipsy-west {
  1060. background-position: left center;
  1061. }
  1062. /*//// - jQuery Lightbox - ////*/
  1063. #jquery-overlay {
  1064. position: absolute;
  1065. top: 0;
  1066. left: 0;
  1067. z-index: 1000;
  1068. width: 100%;
  1069. height: 500px;
  1070. }
  1071. #jquery-lightbox {
  1072. position: absolute;
  1073. top: 0;
  1074. left: 0;
  1075. width: 100%;
  1076. z-index: 9999;
  1077. text-align: center;
  1078. line-height: 0;
  1079. }
  1080. #jquery-lightbox a img {
  1081. border: none;
  1082. }
  1083. #lightbox-container-image-box {
  1084. position: relative;
  1085. background-color: #fff;
  1086. width: 250px;
  1087. height: 250px;
  1088. margin: 0 auto;
  1089. }
  1090. #lightbox-container-image {
  1091. padding: 10px;
  1092. }
  1093. #lightbox-loading {
  1094. position: absolute;
  1095. top: 40%;
  1096. left: 0%;
  1097. height: 25%;
  1098. width: 100%;
  1099. text-align: center;
  1100. line-height: 0;
  1101. }
  1102. #lightbox-nav {
  1103. position: absolute;
  1104. top: 0;
  1105. left: 0;
  1106. height: 100%;
  1107. width: 100%;
  1108. z-index: 10;
  1109. }
  1110. #lightbox-container-image-box > #lightbox-nav {
  1111. left: 0;
  1112. }
  1113. #lightbox-nav a {
  1114. outline: none;
  1115. }
  1116. #lightbox-nav-btnPrev, #lightbox-nav-btnNext {
  1117. width: 49%;
  1118. height: 100%;
  1119. zoom: 1;
  1120. display: block;
  1121. }
  1122. #lightbox-nav-btnPrev {
  1123. left: 0;
  1124. float: left;
  1125. }
  1126. #lightbox-nav-btnNext {
  1127. right: 0;
  1128. float: right;
  1129. }
  1130. #lightbox-container-image-data-box {
  1131. font: 10px Verdana, Helvetica, sans-serif;
  1132. background-color: #fff;
  1133. margin: 0 auto;
  1134. line-height: 1.4em;
  1135. overflow: auto;
  1136. width: 100%;
  1137. padding: 0 10px 0;
  1138. }
  1139. #lightbox-container-image-data {
  1140. padding: 0 10px;
  1141. color: #666;
  1142. }
  1143. #lightbox-container-image-data #lightbox-image-details {
  1144. width: 70%;
  1145. float: left;
  1146. text-align: left;
  1147. }
  1148. #lightbox-image-details-caption {
  1149. font-weight: bold;
  1150. }
  1151. #lightbox-image-details-currentNumber {
  1152. display: block;
  1153. clear: left;
  1154. padding-bottom: 1.0em;
  1155. }
  1156. #lightbox-secNav-btnClose {
  1157. width: 66px;
  1158. float: right;
  1159. padding-bottom: 0.7em;
  1160. }