screen.css 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444
  1. /* line 5, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  2. html, body, div, span, applet, object, 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. article, aside, canvas, details, embed,
  12. figure, figcaption, footer, header, hgroup,
  13. menu, nav, output, ruby, section, summary,
  14. time, mark, audio, video {
  15. margin: 0;
  16. padding: 0;
  17. border: 0;
  18. font: inherit;
  19. font-size: 100%;
  20. vertical-align: baseline;
  21. }
  22. /* line 22, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  23. html {
  24. line-height: 1;
  25. }
  26. /* line 24, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  27. ol, ul {
  28. list-style: none;
  29. }
  30. /* line 26, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  31. table {
  32. border-collapse: collapse;
  33. border-spacing: 0;
  34. }
  35. /* line 28, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  36. caption, th, td {
  37. text-align: left;
  38. font-weight: normal;
  39. vertical-align: middle;
  40. }
  41. /* line 30, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  42. q, blockquote {
  43. quotes: none;
  44. }
  45. /* line 103, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  46. q:before, q:after, blockquote:before, blockquote:after {
  47. content: "";
  48. content: none;
  49. }
  50. /* line 32, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  51. a img {
  52. border: none;
  53. }
  54. /* line 116, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
  55. article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  56. display: block;
  57. }
  58. /* line 106, ../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/typography/_vertical_rhythm.scss */
  59. html {
  60. font-size: 100%;
  61. line-height: 1.75em;
  62. }
  63. /* line 14, sass/screen.scss */
  64. body {
  65. background: black;
  66. -webkit-text-size-adjust: none;
  67. -moz-text-size-adjust: none;
  68. -ms-text-size-adjust: none;
  69. font-family: "Roboto", sans-serif;
  70. }
  71. /* line 21, sass/screen.scss */
  72. a {
  73. text-decoration: none;
  74. color: #3971a8;
  75. }
  76. /* line 1, sass/cookie.scss */
  77. #cookie_monster {
  78. position: fixed;
  79. left: 0;
  80. width: 100%;
  81. background: rgba(255, 255, 255, 0.8);
  82. font-family: 'Open Sans', sans-serif;
  83. z-index: 255;
  84. }
  85. @media (min-width: 48em) {
  86. /* line 1, sass/cookie.scss */
  87. #cookie_monster {
  88. top: 0;
  89. }
  90. }
  91. @media (max-width: 48em) {
  92. /* line 1, sass/cookie.scss */
  93. #cookie_monster {
  94. bottom: 0;
  95. background: rgba(239, 239, 143, 0.8);
  96. }
  97. }
  98. /* line 18, sass/cookie.scss */
  99. #cookie_monster .content {
  100. max-width: 48em;
  101. margin-left: auto;
  102. margin-right: auto;
  103. margin: 0 auto;
  104. color: black;
  105. padding: 0.375em 1.5em 0.1875em 1.5em;
  106. }
  107. /* line 12, ../../../../../Library/Ruby/Gems/2.0.0/gems/susy-2.2.2/sass/susy/output/support/_clearfix.scss */
  108. #cookie_monster .content:after {
  109. content: " ";
  110. display: block;
  111. clear: both;
  112. }
  113. /* line 24, sass/cookie.scss */
  114. #cookie_monster .content strong {
  115. font-weight: bold;
  116. }
  117. /* line 28, sass/cookie.scss */
  118. #cookie_monster .content .button {
  119. display: block;
  120. background: black;
  121. color: white;
  122. padding: 0.375em 0.5625em;
  123. margin-top: 0.375em;
  124. margin-left: 0.1875em;
  125. float: right;
  126. -moz-border-radius: 4px;
  127. -webkit-border-radius: 4px;
  128. border-radius: 4px;
  129. border: 0;
  130. font-size: 16px;
  131. }
  132. /* line 40, sass/cookie.scss */
  133. #cookie_monster .content .button.no {
  134. background: #34b273;
  135. }
  136. /* line 44, sass/cookie.scss */
  137. #cookie_monster .content .button.yes {
  138. font-weight: bold;
  139. background: #c0598c;
  140. }
  141. /* line 28, sass/screen.scss */
  142. #top_banner {
  143. background-repeat: no-repeat;
  144. background-position: bottom center;
  145. -moz-background-size: cover;
  146. -o-background-size: cover;
  147. -webkit-background-size: cover;
  148. background-size: cover;
  149. height: 120px;
  150. background: black;
  151. }
  152. @media (max-width: 48em) {
  153. /* line 28, sass/screen.scss */
  154. #top_banner {
  155. height: 120px;
  156. }
  157. }
  158. @media (max-width: 24em) {
  159. /* line 28, sass/screen.scss */
  160. #top_banner {
  161. height: 80px;
  162. }
  163. }
  164. /* line 44, sass/screen.scss */
  165. #bold_title {
  166. color: white;
  167. max-width: 48em;
  168. margin-left: auto;
  169. margin-right: auto;
  170. position: relative;
  171. font-family: 'Oswald', sans-serif;
  172. font-weight: normal;
  173. }
  174. /* line 12, ../../../../../Library/Ruby/Gems/2.0.0/gems/susy-2.2.2/sass/susy/output/support/_clearfix.scss */
  175. #bold_title:after {
  176. content: " ";
  177. display: block;
  178. clear: both;
  179. }
  180. /* line 51, sass/screen.scss */
  181. #bold_title h1 {
  182. position: absolute;
  183. }
  184. /* line 55, sass/screen.scss */
  185. #bold_title .tagline {
  186. position: absolute;
  187. }
  188. /* line 62, sass/screen.scss */
  189. .home.page #bold_title h1 {
  190. position: relative;
  191. }
  192. /* line 64, sass/screen.scss */
  193. .home.page #bold_title h1 .hi {
  194. position: absolute;
  195. top: 25px;
  196. left: 4.2em;
  197. font-size: 2em;
  198. }
  199. @media (max-width: 24em) {
  200. /* line 64, sass/screen.scss */
  201. .home.page #bold_title h1 .hi {
  202. top: 10px;
  203. left: 2em;
  204. font-size: 1.875em;
  205. }
  206. }
  207. /* line 77, sass/screen.scss */
  208. .home.page #bold_title h1 .name {
  209. position: absolute;
  210. top: 60px;
  211. left: 2em;
  212. font-size: 3.375em;
  213. }
  214. @media (max-width: 24em) {
  215. /* line 77, sass/screen.scss */
  216. .home.page #bold_title h1 .name {
  217. top: 37px;
  218. left: 1em;
  219. font-size: 2.25em;
  220. }
  221. }
  222. /* line 92, sass/screen.scss */
  223. #content_box {
  224. background: white;
  225. position: relative;
  226. }
  227. /* line 96, sass/screen.scss */
  228. #content_box #main_menu {
  229. background: black;
  230. font-size: 0.875em;
  231. max-width: 48em;
  232. margin-left: auto;
  233. margin-right: auto;
  234. }
  235. /* line 12, ../../../../../Library/Ruby/Gems/2.0.0/gems/susy-2.2.2/sass/susy/output/support/_clearfix.scss */
  236. #content_box #main_menu:after {
  237. content: " ";
  238. display: block;
  239. clear: both;
  240. }
  241. @media (min-width: 24em) {
  242. /* line 96, sass/screen.scss */
  243. #content_box #main_menu {
  244. font-size: 1em;
  245. }
  246. }
  247. /* line 105, sass/screen.scss */
  248. #content_box #main_menu ul {
  249. position: absolute;
  250. bottom: -40px;
  251. margin-left: 4.34783%;
  252. }
  253. @media (min-width: 24em) {
  254. /* line 105, sass/screen.scss */
  255. #content_box #main_menu ul {
  256. bottom: -50px;
  257. margin-left: 0%;
  258. }
  259. }
  260. /* line 115, sass/screen.scss */
  261. #content_box #main_menu ul li {
  262. padding: 10px 15px 5px 0px;
  263. float: left;
  264. }
  265. @media (min-width: 24em) {
  266. /* line 115, sass/screen.scss */
  267. #content_box #main_menu ul li {
  268. padding: 10px 30px 10px 0px;
  269. }
  270. }
  271. /* line 124, sass/screen.scss */
  272. #content_box #main_menu ul a {
  273. color: white;
  274. font-family: "Oswald", sans-serif;
  275. font-weight: normal;
  276. }
  277. /* line 133, sass/screen.scss */
  278. #inner_box {
  279. max-width: 48em;
  280. margin-left: auto;
  281. margin-right: auto;
  282. padding-bottom: 50px;
  283. }
  284. /* line 12, ../../../../../Library/Ruby/Gems/2.0.0/gems/susy-2.2.2/sass/susy/output/support/_clearfix.scss */
  285. #inner_box:after {
  286. content: " ";
  287. display: block;
  288. clear: both;
  289. }
  290. /* line 139, sass/screen.scss */
  291. .home.page h2 {
  292. line-height: 80px;
  293. text-align: center;
  294. font-size: 1.875em;
  295. font-family: 'Oswald', sans-serif;
  296. }
  297. @media (min-width: 24em) {
  298. /* line 139, sass/screen.scss */
  299. .home.page h2 {
  300. font-size: 2.25em;
  301. line-height: 100px;
  302. }
  303. }
  304. /* line 151, sass/screen.scss */
  305. .home.page .work.column {
  306. width: 25%;
  307. height: 240px;
  308. float: left;
  309. display: block;
  310. padding: 0;
  311. margin: 0;
  312. position: relative;
  313. vertical-align: bottom;
  314. background: gray;
  315. }
  316. /* line 162, sass/screen.scss */
  317. .home.page .work.column span {
  318. position: absolute;
  319. color: white;
  320. font-family: 'Oswald', sans-serif;
  321. font-size: 30px;
  322. white-space: nowrap;
  323. -moz-transform-origin: bottom left;
  324. -ms-transform-origin: bottom left;
  325. -webkit-transform-origin: bottom left;
  326. transform-origin: bottom left;
  327. -moz-transform: rotate(-90deg);
  328. -ms-transform: rotate(-90deg);
  329. -webkit-transform: rotate(-90deg);
  330. transform: rotate(-90deg);
  331. display: block;
  332. bottom: 0.33em;
  333. left: 1.33em;
  334. overflow: visible;
  335. }
  336. @media (min-width: 24em) {
  337. /* line 151, sass/screen.scss */
  338. .home.page .work.column {
  339. height: 300px;
  340. }
  341. /* line 179, sass/screen.scss */
  342. .home.page .work.column span {
  343. font-size: 36px;
  344. }
  345. }
  346. /* line 184, sass/screen.scss */
  347. .home.page .work.column.research {
  348. background-image: url("../images/home-research-2x.png");
  349. background-position: right bottom;
  350. background-size: cover;
  351. }
  352. /* line 189, sass/screen.scss */
  353. .home.page .work.column.development {
  354. background-image: url("../images/home-development-2x.png");
  355. background-position: right bottom;
  356. background-size: cover;
  357. }
  358. /* line 194, sass/screen.scss */
  359. .home.page .work.column.writing {
  360. background-image: url("../images/home-writing-2x.png");
  361. background-position: right bottom;
  362. background-size: cover;
  363. }
  364. /* line 199, sass/screen.scss */
  365. .home.page .work.column.other {
  366. background-image: url("../images/home-contact-2x.png");
  367. background-position: right bottom;
  368. background-size: cover;
  369. }
  370. /* line 207, sass/screen.scss */
  371. #site_footer {
  372. max-width: 48em;
  373. margin-left: auto;
  374. margin-right: auto;
  375. color: #c3d7ea;
  376. line-height: 22.4px;
  377. }
  378. /* line 12, ../../../../../Library/Ruby/Gems/2.0.0/gems/susy-2.2.2/sass/susy/output/support/_clearfix.scss */
  379. #site_footer:after {
  380. content: " ";
  381. display: block;
  382. clear: both;
  383. }
  384. /* line 212, sass/screen.scss */
  385. #site_footer .footer_body {
  386. padding-top: 40px;
  387. border-bottom: 1px solid #607f9f;
  388. }
  389. @media (min-width: 24em) {
  390. /* line 212, sass/screen.scss */
  391. #site_footer .footer_body {
  392. margin-top: 10px;
  393. }
  394. }
  395. /* line 220, sass/screen.scss */
  396. #site_footer .footer_body a {
  397. color: #76a4d1;
  398. }
  399. /* line 224, sass/screen.scss */
  400. #site_footer .footer_body .column {
  401. padding-top: 14px;
  402. margin-left: 4.34783%;
  403. font-size: 0.75em;
  404. width: 82.6087%;
  405. float: left;
  406. margin-right: 4.34783%;
  407. }
  408. @media (min-width: 24em) {
  409. /* line 224, sass/screen.scss */
  410. #site_footer .footer_body .column {
  411. margin-left: 0%;
  412. }
  413. /* line 232, sass/screen.scss */
  414. #site_footer .footer_body .column.first {
  415. padding-left: 0;
  416. width: 30.43478%;
  417. float: left;
  418. margin-right: 4.34783%;
  419. }
  420. /* line 237, sass/screen.scss */
  421. #site_footer .footer_body .column.second {
  422. width: 65.21739%;
  423. float: right;
  424. margin-right: 0;
  425. }
  426. }