Guest User

site.css

a guest
Feb 15th, 2012
115
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 10.64 KB | None | 0 0
  1. /* reset */
  2. html, body, div, span, iframe,
  3. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  4. a, abbr, acronym, address, big, cite, code,
  5. del, dfn, em, img, ins, kbd, q, s, samp,
  6. small, strike, strong, sub, sup, tt, var,
  7. b, u, i, center,
  8. dl, dt, dd, ol, ul, li,
  9. fieldset, form, label, legend,
  10. table, caption, tbody, tfoot, thead, tr, th, td {
  11.     margin: 0;
  12.     padding: 0;
  13.     border: 0;
  14.     font-size: 100%;
  15.     font: inherit;
  16.     vertical-align: baseline;
  17. }
  18. html , body{
  19.     line-height: 1;
  20.     background-color: #334873;
  21.     background-image: url(../_images/bg-page2.png);
  22. }
  23.  
  24. ol, ul {
  25.     list-style: none;
  26. }
  27. blockquote, q {
  28.     quotes: none;
  29. }
  30. blockquote:before, blockquote:after,
  31. q:before, q:after {
  32.     content: '';
  33.     content: none;
  34. }
  35. table {
  36.     border-collapse: collapse;
  37.     border-spacing: 0;
  38. }
  39. /* end reset*/
  40.  
  41. /* @font-face @/
  42. /* Generated by Font Squirrel (http://www.fontsquirrel.com) on May 2, 2011 04:30:37 PM America/New_York */
  43.  
  44.  
  45.  
  46. @font-face {
  47.     font-family: 'ColaborateThinRegular';
  48.     src: url('ColabThi-webfont.eot');
  49.     src: url('ColabThi-webfont.eot?#iefix') format('embedded-opentype'),
  50.          url('ColabThi-webfont.woff') format('woff'),
  51.          url('ColabThi-webfont.ttf') format('truetype'),
  52.          url('ColabThi-webfont.svg#ColaborateThinRegular') format('svg');
  53.     font-weight: normal;
  54.     font-style: normal;
  55.  
  56. }
  57.  
  58. @font-face {
  59.     font-family: 'ColaborateLightRegular';
  60.     src: url('ColabLig-webfont.eot');
  61.     src: url('ColabLig-webfont.eot?#iefix') format('embedded-opentype'),
  62.          url('ColabLig-webfont.woff') format('woff'),
  63.          url('ColabLig-webfont.ttf') format('truetype'),
  64.          url('ColabLig-webfont.svg#ColaborateLightRegular') format('svg');
  65.     font-weight: normal;
  66.     font-style: normal;
  67.  
  68. }
  69.  
  70. @font-face {
  71.     font-family: 'ColaborateRegular';
  72.     src: url('ColabReg-webfont.eot');
  73.     src: url('ColabReg-webfont.eot?#iefix') format('embedded-opentype'),
  74.          url('ColabReg-webfont.woff') format('woff'),
  75.          url('ColabReg-webfont.ttf') format('truetype'),
  76.          url('ColabReg-webfont.svg#ColaborateRegular') format('svg');
  77.     font-weight: normal;
  78.     font-style: normal;
  79.  
  80. }
  81.  
  82. @font-face {
  83.     font-family: 'ColaborateMediumRegular';
  84.     src: url('ColabMed-webfont.eot');
  85.     src: url('ColabMed-webfont.eot?#iefix') format('embedded-opentype'),
  86.          url('ColabMed-webfont.woff') format('woff'),
  87.          url('ColabMed-webfont.ttf') format('truetype'),
  88.          url('ColabMed-webfont.svg#ColaborateMediumRegular') format('svg');
  89.     font-weight: normal;
  90.     font-style: normal;
  91.  
  92. }
  93.  
  94. @font-face {
  95.     font-family: 'ColaborateBoldRegular';
  96.     src: url('ColabBol-webfont.eot');
  97.     src: url('ColabBol-webfont.eot?#iefix') format('embedded-opentype'),
  98.          url('ColabBol-webfont.woff') format('woff'),
  99.          url('ColabBol-webfont.ttf') format('truetype'),
  100.          url('ColabBol-webfont.svg#ColaborateBoldRegular') format('svg');
  101.     font-weight: normal;
  102.     font-style: normal;
  103.  
  104. }
  105.  
  106. @font-face {
  107.     font-family: 'Inconsolata';
  108.     src: url('Inconsolata-webfont.eot');
  109.     src: url('Inconsolata-webfont.eot?#iefix') format('embedded-opentype'),
  110.          url('Inconsolata-webfont.woff') format('woff'),
  111.          url('Inconsolata-webfont.ttf') format('truetype'),
  112.          url('Inconsolata-webfont.svg#InconsolataMedium') format('svg');
  113.     font-weight: normal;
  114.     font-style: normal;
  115.  
  116. }
  117.  
  118. h1, h2, h3 {
  119.     font-family: 'ColaborateRegular', Arial, sans-serif;   
  120. }
  121.  
  122.  
  123. strong {
  124.     font-family: 'ColaborateMediumRegular', Arial, sans-serif; 
  125. }
  126.  
  127. em {
  128.     font-family: 'ColaborateThinRegular', Arial, sans-serif;   
  129. }
  130.  
  131. .content {
  132.     max-width: 760px;
  133.     margin: 20px 0 0 100px;
  134. }
  135.  
  136. .footer {
  137.     position: fixed;
  138.     bottom: 0;
  139.     left: 100px;
  140.     width: 100%;
  141.     padding-top: 18px;
  142.     background: url(../_images/bg-footer.png) repeat-x left top;
  143. }
  144.  
  145. .logo {
  146.     letter-spacing: -1px;
  147.     color: rgb(195,151,51);
  148.     text-shadow: 2px 2px 1px rgba(0,0,0,.25);
  149.     font: normal 54px 'ColaborateThinRegular', Arial, sans-serif;
  150. }
  151.  
  152. .logo i {
  153.     font-size: 24px;
  154.     font-family: 'ColaborateRegular', Arial, sans-serif;
  155.     color: rgb(119,104,71);
  156.     position: relative;
  157.     top:-0.18em;
  158.     display: inline-block;
  159.     text-shadow: none;
  160. }
  161.  
  162. .logo i.mm {
  163.     font-size: 16px;
  164.     color: white;
  165.     text-shadow: 1px 1px 1px rgba(0,0,0,.75);
  166.     top: 0.1em;
  167.     left: 0.5em;
  168.     line-height: 90%;
  169.     text-align: right;
  170.     background-color: rgb(110,138,195);
  171.     padding: .25em .5em .25em 1em;
  172.     -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.75);
  173.     -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.75);
  174.     box-shadow: 1px 1px 2px rgba(0,0,0,.75);
  175. }
  176.  
  177.  
  178. .clear:after {
  179. content: "."; display: block; height: 0; clear: both; visibility: hidden;
  180. }
  181.  
  182. .clear {
  183.     min-height: 1px;
  184. }
  185.  
  186. * html .clear {
  187.  height: 1px;
  188. }
  189.  
  190. .header {
  191.     position: relative;
  192.     border-top: solid 6px white;
  193.     padding: 10px 0 10px 0;
  194.     margin-bottom: 20px;
  195. }
  196.  
  197.  
  198. .main {
  199.     xxposition: relative;
  200.     padding-bottom: 1em;
  201.     border-bottom: solid 1px rgba(255,255,255,.5);
  202.     xxoverflow:hidden;
  203.     xxmin-height: 300px;
  204. }
  205.  
  206. .main h1 {
  207.     font-size: 32px;
  208.     color: white;
  209.     text-shadow: 1px 1px 1px rgba(0,0,0,.75);
  210.     border-bottom: solid 1px rgba(255,255,255,.5);
  211.     margin-bottom: 0.75em;
  212. }
  213.  
  214.  
  215. p , li, legend , form{
  216.     font-size: 18px;
  217.     color: white;
  218.     font-family: 'ColaborateLightRegular', Arial, sans-serif;
  219.     line-height: 125%;
  220.     margin-bottom: 10px;
  221. }
  222.  
  223. fieldset {
  224.     padding: 10px;
  225.     border: 1px solid white;
  226.     margin: 25px 0;
  227. }
  228.  
  229. .nav {
  230.     margin: 10px 0 0 100px;
  231. }
  232.  
  233. .nav li {
  234.     display: inline-block; 
  235. }
  236.  
  237. .nav a, .example {
  238.     display: inline-block;
  239.     font-family: 'ColaborateLightRegular', Arial, sans-serif;
  240.     font-size: 12px;
  241.     color: rgb(255,255,255);
  242.     text-decoration: none;
  243.     -moz-border-radius: 0.25em;
  244.     border-radius: 0.25em;
  245.     padding: .25em .5em;
  246.     background-color: rgba(107,124,159, .75);
  247.     -webkit-transition: all .25s ease-in;
  248.     -moz-transition: all .25s ease-in;
  249.     -o-transition: all .25s ease-in;
  250.     transition: all .25s ease-in;
  251.     cursor: pointer;
  252. }
  253.  
  254. .nav a:hover, .example:hover{
  255.     background-color: rgba(255,255,255,.85);
  256.     color: rgb(0,0,0);
  257. }
  258.  
  259. .footer p {
  260.     font-size: 14px;
  261.     font-family: 'ColaborateLightRegular', Arial, sans-serif;
  262.     padding: .5em .25em .5em 1em;
  263.     color:rgb(55,76,119);
  264.     background: rgb(110,138,195);
  265.     -moz-border-radius: 2px 0 0 0;
  266.     border-radius: 2px 0 0 0;
  267.     margin: 0;
  268. }
  269.  
  270. #resources {
  271.     background-color: rgba(255,255,255,0.95);
  272.     padding: 0em 1em 1em .75em;
  273.     position: absolute;
  274.     top: 10em;
  275.     left: -51em;
  276.     width: 50em;
  277.     -moz-border-radius: 0 0 .5em 0;
  278.     border-radius: 0 0 .5em 0;
  279.     display: none;
  280. }
  281.  
  282. #resources .open {
  283.     position: absolute;
  284.     width: 20px;
  285.     height: 20px;
  286.     right: -20px;
  287.     top: -20px;
  288.     background-color: rgba(255,255,255,0.8);
  289.     -moz-border-radius: 0.5em;
  290.     border-radius: .5em 0;
  291.     text-align: center;
  292.     font-family: 'ColaborateBoldRegular', Arial, sans-serif;
  293.     cursor: pointer;
  294.     color: rgb(119,104,71);
  295.     line-height: 100%;
  296. }
  297.  
  298. #resources h2 {
  299.     font-family: 'ColaborateBoldRegular', Arial, sans-serif;
  300.     font-size:18px;
  301.     text-transform:uppercase;
  302.     /*color: rgb(59,82,128);*/
  303.     color: rgb(119,104,71);
  304.     margin-top: 1em;
  305.     text-shadow: none;
  306. }
  307.  
  308. #resources h3 {
  309.     font-family: 'ColaborateMediumRegular', Arial, sans-serif;
  310.     font-size: 14px;
  311.     color: rgba(0,0,0,.8);
  312.     margin-top: 8px;
  313. }
  314.  
  315. .resourceList > li {
  316.     display: inline-block;
  317.     padding: .5em 1em;
  318.     -moz-border-radius: 0.25em;
  319.     border-radius: 0.25em;
  320.     background-color: rgba(119,104,74, .5);
  321.     font-family: 'ColaborateRegular', Arial, sans-serif;
  322.     font-size: 12px;
  323.     color: rgb(255,255,255);
  324.     margin-bottom: 5px;
  325. }
  326.  
  327. #resources ul {
  328.     margin: 5px 0 0 0;
  329. }
  330. a {
  331.     color: rgba(255,255,255,.75);
  332. }
  333. h2 {
  334.     color: rgb(143,180,255);
  335.     margin-bottom: 5px;
  336.     font-size: 22px;
  337.     text-shadow: 1px 1px 1px rgba(0,0,0,.75);
  338. }
  339. h3 {
  340.     font-size: 18px;
  341.     color: rgb(227,198,133);;
  342. }
  343.  
  344. .example, code {
  345.     font-family: 'Inconsolata', Courier, monospaced;
  346.     font-size: 16px;
  347.     color: rgb(255,255,255);
  348. }
  349.  
  350. .results {
  351.     -moz-border-radius: 10px;
  352.     border-radius: 10px;
  353.     background-color: rgba(255,255,255,.4);
  354.     padding: 1em;
  355.     margin-bottom: 1em;
  356.     overflow: hidden;
  357. }
  358.  
  359. .results strong {
  360.     font-family: 'ColaborateRegular', Arial, sans-serif;
  361.     color: rgb(227,198,133);
  362. }
  363. .results .found {
  364.     color: rgb(255,0,0);
  365. }
  366.  
  367. .unit {
  368.     display: inline-block;
  369.     width: 45%;
  370. }
  371. .results h2 {
  372.     color: rgba(255,255,255,1);
  373. }
  374. .results div {
  375.     padding-bottom: 10px;
  376. }
  377. .results div code {
  378.     float: right;
  379.     width: 60%;
  380. }
  381.  
  382. input {
  383.     font-size: 20px;
  384. }
  385. .found {
  386.     color: rgba(255,0,0,1);
  387. }
  388. form .wide {
  389.     font-size: 18px;
  390.     width: 100%;
  391. }
  392. .resultSection {
  393.     float: right;
  394.     width: 45%;
  395.     margin-left: 20px;
  396. }
  397. #regexTester {
  398.     margin-right: 55%;
  399. }
  400. .sideBySide li {
  401.     float: left;
  402.     overflow: hidden;
  403.     width: 220px;
  404. }
  405. .clickable {
  406.     cursor:pointer;
  407.     margin-bottom: 5px;
  408. }
  409.  
  410. .clickable:hover {
  411. background-color:#FFC;
  412. }
  413.  
  414. .highlighted {
  415.     position: absolute;
  416.     background-color: transparent;
  417.     opacity: 0.5;
  418.     filter: alpha(opacity=50);
  419.     border:1px solid white;
  420.     z-index: 100;
  421. }
  422. .badge {
  423.     position: absolute;
  424.     margin-top: -10px;
  425.     z-index:50;
  426.     font-family: 'Inconsolata', Courier, monospaced;
  427.     font-size:14px;
  428.     font-weight:bold;
  429.     padding: 5px;
  430.     color: black !important;
  431.     background-color: #3FF;
  432.     border: 1px black solid;
  433.     opacity: 0.6;
  434.     filter: alpha(opacity=60);
  435. }
  436.  
  437. .col1 {
  438.     float: left;
  439.     width: 75%;
  440. }
  441. .col2 {
  442.     float: right;
  443.     width: 20%;
  444. }
  445.  
  446. .col2 ul {
  447.     margin-left: 20px;
  448.     list-style: square;
  449. }
  450. .col2 li {
  451.     font-size: 90%;
  452. }
  453.  
  454.  
  455. #selectorList {
  456.     overflow: hidden;  
  457. }
  458. #selector {
  459.     width: 275px;
  460. }
  461. #bib {
  462.     padding: 15px;
  463.     border: 1px dotted #FFF;
  464.     font-size: 80%;
  465.     margin-bottom: 25px;
  466. }
  467.  
  468. #gallery img {
  469.     display: inline-block;
  470.     margin: 0 0 10px 0;
  471.     border: 1px solid rgb(0,0,0);
  472. }
  473.  
  474. form#order div, form#signup div{
  475.     padding-bottom: 10px;  
  476. }
  477.  
  478. form#order .label, form#signup .label {
  479.     display: block;
  480.     clear: left;
  481.     float: left;
  482.     width: 175px;
  483.     text-align: right;
  484.     padding: 7px 15px 0 0;
  485.     text-transform: uppercase; 
  486.     font-weight: bold;
  487. }
  488.  
  489. form#signup .label {
  490.     width: 200px;  
  491. }
  492.  
  493. .labelBlock {
  494.     text-transform: uppercase;
  495.     font-weight: bold; 
  496.     display: block;
  497.     padding-bottom: 0 !important;
  498.     clear: both;
  499.     margin-top: 10px;
  500. }
  501.  
  502. form#order select, form#signup select {
  503.     display: inline-block;
  504.     margin-top: 8px;   
  505. }
  506.  
  507. form#order input[type="radio"], form#signup input[type="radio"], form#signup input[type="checkbox"] {
  508.    display: inline-block;
  509.    margin-top: 10px;   
  510. }
  511.  
  512. form .indent, #submit {
  513.     margin-left: 215px;
  514. }
  515. #console label {
  516.     float: left;
  517.     width: 100px;
  518. }
  519. .clearLeft {
  520.     clear: left;
  521. }
  522. .imgRight {
  523.     float: right;
  524.     margin-bottom: 5px;
  525.     margin-left: 5px;
  526. }
  527. .imgLeft {
  528.     float: left;
  529.     margin-bottom: 5px;
  530.     margin-right: 5px;
  531. }
Add Comment
Please, Sign In to add comment