Website for the AME project.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1463 lines
26 KiB

4 years ago
  1. html{
  2. overflow-y:scroll;
  3. overflow-x:auto;
  4. }
  5. body {
  6. # background-image: url('img/ame_wallpaper_1440_web_blur_2.jpg');
  7. # background-repeat: no-repeat;
  8. # background-position: center center;
  9. # background-attachment: fixed;"
  10. # background-color: black;
  11. }
  12. div.body {
  13. margin:30px auto;
  14. max-width:900px;
  15. line-height:1.5;
  16. # line-height:2;
  17. font-size:18px;
  18. color:white;
  19. font-family: Helvetica, Arial, Sans-Serif;
  20. # font-family: "Times New Roman", Times, serif;
  21. padding:0 20px;
  22. }
  23. h1,h2,h3 {
  24. line-height:1.2;
  25. }
  26. #post:link {
  27. color:white;
  28. text-decoration: none;
  29. font-family: Arial, Helvetica, sans-serif;
  30. }
  31. #post:visited {
  32. color:white;
  33. text-decoration: none;
  34. font-family: Arial, Helvetica, sans-serif;
  35. }
  36. #post:hover {
  37. color:#A6A6A6;
  38. text-decoration: none;
  39. font-family: Arial, Helvetica, sans-serif;
  40. }
  41. #post:active {
  42. color:white;
  43. text-decoration: none;
  44. font-family: Arial, Helvetica, sans-serif;
  45. }
  46. /*
  47. a::after {
  48. display: block;
  49. content: attr(title);
  50. font-weight: bold;
  51. height: 0;
  52. overflow: hidden;
  53. visibility: hidden;
  54. }
  55. */
  56. a:hover {
  57. opacity: 0.7;
  58. # color:#D1D1D1;
  59. text-decoration: underlined;
  60. font-family: Arial, Helvetica, sans-serif;
  61. }
  62. a:link {
  63. color:white;
  64. text-decoration: underlined;
  65. font-family: Arial, Helvetica, sans-serif;
  66. }
  67. a:visited {
  68. color:white;
  69. text-decoration: underlined;
  70. font-family: Arial, Helvetica, sans-serif;
  71. }
  72. a:active {
  73. color:white;
  74. text-decoration: underlined;
  75. font-family: Arial, Helvetica, sans-serif;
  76. }
  77. /*
  78. #############################
  79. # topnav Natigation Section #
  80. #############################
  81. */
  82. #top-logo-mobile {
  83. width: 50px;
  84. position: relative;
  85. margin-top:-3px;
  86. margin-bottom:-5px;
  87. margin-right: 15px;
  88. display: none;
  89. visibility: hidden;
  90. }
  91. #mobile-menu-icon {
  92. visibility: hidden;
  93. display: hidden;
  94. width: 25px;
  95. height: 25px;
  96. }
  97. #darken-screen {
  98. position: fixed;
  99. top: 0;
  100. left: 0;
  101. background: rgba(0,0,0,0.6);
  102. z-index: 2;
  103. width: 100%;
  104. height: 100%;
  105. display: none;
  106. visibility: hidden;
  107. }
  108. div.topnav-wrapper {
  109. #z-index: 10;
  110. #position: fixed;
  111. #display: block;
  112. #top: 0;
  113. #margin-left: auto;
  114. #margin-right: auto;
  115. #width: 100%;
  116. #height: 55px;
  117. #background-color: #262626;
  118. #box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  119. }
  120. div.topnav-reverse {
  121. float: right;
  122. }
  123. img.topnav {
  124. margin-right: 20px;
  125. float: left;
  126. width: 100px;
  127. opacity: 1.0;
  128. # top: 0px;
  129. # left: 0px;
  130. # position: relative;
  131. }
  132. img.topnav:hover {
  133. opacity: 0.7;
  134. cursor: pointer;
  135. }
  136. div.nav-wrapper {
  137. text-align: center;
  138. display: table;
  139. margin: 0;
  140. overflow: hidden;
  141. font-family: Arial, Helvetica, sans-serif;
  142. top: 0;
  143. width: 100%;
  144. background-color: #333;
  145. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  146. overflow: hidden;
  147. position: relative;
  148. }
  149. ul.topnav {
  150. display: block;
  151. list-style-type: none;
  152. margin-left:auto;
  153. margin-right:auto;
  154. margin-top:30px;
  155. margin-bottom:0;
  156. padding: 0;
  157. overflow: hidden;
  158. font-family: Arial, Helvetica, sans-serif;
  159. font-weight: 700;
  160. # background-color: #333;
  161. # background-color: #262626;
  162. # background: rgba(38, 38, 38, 0.8);
  163. top: 0;
  164. width: 900px;
  165. # box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  166. # opacity: 0.5;
  167. }
  168. ul.topnav li {
  169. float: left; /* Align topnav elements */
  170. font-weight: ;
  171. margin-top: 2px; /* Offset to align with img.topnav */
  172. }
  173. ul.topnav li a {
  174. # display: block;
  175. display: inline-block;
  176. text-align: center;
  177. color: white;
  178. # text-align: center;
  179. padding: 7px 5px;
  180. text-decoration: none;
  181. margin-left: 30px;
  182. }
  183. ul.topnav li a:hover {
  184. # background-color: #1C1C1C;
  185. # background-color: #111111;
  186. # border-bottom: 2px solid;
  187. # box-shadow: inset 0 -1px 0 0 #ffffff;
  188. # font-weight: bold;
  189. opacity: 1.0;
  190. color: #4CAF50; /* Green */
  191. }
  192. ul.topnav li a.active {
  193. # background-color: #484848;
  194. # background-color: rgba(72, 72, 72, 0.6);
  195. border-bottom: 3px solid white;
  196. # box-shadow:0px -3px 0px 0px white inset;
  197. # box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  198. overflow: hidden;
  199. color: white;
  200. }
  201. ul.topnav li.right {
  202. float: right;
  203. opacity: 1.0;
  204. }
  205. ul.topnav li.right_active {
  206. float: right;
  207. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  208. background-color: #484848;
  209. }
  210. .show-menu {
  211. font-family: Arial, Helvetica, sans-serif;
  212. text-decoration: none;
  213. color: #fff;
  214. background: #484848;
  215. text-align: center;
  216. padding: 10px 0;
  217. display: none;
  218. visibility: none;
  219. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  220. z-index: 10;
  221. }
  222. #mobile-home {
  223. display: none;
  224. }
  225. .badge {
  226. background-color: #4CAF50;
  227. color: white;
  228. display:inline-block;
  229. padding-left:8px;
  230. padding-right:8px;
  231. text-align:center;
  232. font-size: 8pt;
  233. padding: 2px;
  234. font-family: Arial, Helvetica, sans-serif;
  235. width: 28px;
  236. position: relative;
  237. text-align: center;
  238. }
  239. .badge {
  240. border-radius: 3px;
  241. }
  242. /*
  243. #######################
  244. #Documentation Section#
  245. #######################
  246. */
  247. span.unselectable {
  248. -webkit-touch-callout: none;
  249. -webkit-user-select: none;
  250. -khtml-user-select: none;
  251. -moz-user-select: none;
  252. -ms-user-select: none;
  253. user-select: none;
  254. }
  255. ul.docu {
  256. list-style-type: square;
  257. list-style-position: outside;
  258. }
  259. div.comment-vertical {
  260. border-left: 4px solid #4CAF50;
  261. padding-left: 20px;
  262. color: lightgray;
  263. }
  264. div.comment-code {
  265. border-radius: 8px;
  266. background-color:rgba(0, 0, 0, 0.5);
  267. font-family: courier, "courier new", monospace;
  268. color: lightgray;
  269. padding: 15px;
  270. }
  271. span.code {
  272. border-radius: 6px;
  273. background-color:rgba(0, 0, 0, 0.5);
  274. font-family: courier, "courier new", monospace;
  275. color: lightgray;
  276. padding-top: 2px;
  277. padding-bottom: 2px;
  278. padding-left: 10px;
  279. padding-right: 10px;
  280. font-size: 15px;
  281. width: 100%;
  282. text-align: center;
  283. }
  284. /*
  285. ######################
  286. # Thread/Post Secion #
  287. ######################
  288. */
  289. div.thread-head {
  290. # margin: 30px auto;
  291. # background-color: #484848;
  292. # background-color: #262626;
  293. text-align: left;
  294. # padding: 5px 5px;
  295. # font-size:30px;
  296. # box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  297. # box-shadow: inset 0 0 0 1px #ffffff;
  298. }
  299. div.thread-header {
  300. margin: auto;
  301. # background-color: #333;
  302. text-align: left;
  303. padding: 0px 10px;
  304. font-size:25px;
  305. }
  306. div.thread-body {
  307. margin: auto;
  308. # background-color: #333;
  309. text-align: left;
  310. padding: 0px 10px;
  311. padding-bottom: 5px;
  312. padding-top: 5px;
  313. font-size:18px;
  314. # box-shadow: inset 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  315. }
  316. div.thread-info {
  317. margin: auto;
  318. # background-color: #2B2B2B;
  319. text-align: left;
  320. padding: 2px 10px;
  321. font-size:15px;
  322. font-family: courier, "courier new", monospace;
  323. }
  324. div.code-wrapper {
  325. width: 100%;
  326. margin: 0px auto;
  327. bottom: 30px;
  328. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  329. }
  330. div.code-thread-header {
  331. margin: auto;
  332. background-color: #333;
  333. text-align: left;
  334. padding: 1px 10px;
  335. font-size:16px;
  336. }
  337. div.code-thread-body {
  338. margin: auto;
  339. background-color: #333;
  340. text-align: left;
  341. padding: 0px 0px;
  342. padding-bottom: 0px;
  343. font-size:16px;
  344. }
  345. div.code-thread-info {
  346. margin: auto;
  347. margin-bottom: 5px;
  348. margin-top: 5px;
  349. background-color: #2B2B2B;
  350. text-align: left;
  351. padding: 2px 10px;
  352. font-size:15px;
  353. font-family: courier, "courier new", monospace;
  354. # font-family: monospace;
  355. }
  356. div.code-thread-info-header {
  357. margin: auto;
  358. margin-bottom: 5px;
  359. margin-top: 5px;
  360. background-color: #333;
  361. text-align: left;
  362. padding: 2px 10px;
  363. font-size:15px;
  364. font-family: courier, "courier new", monospace;
  365. # font-family: monospace;
  366. }
  367. div.polaroid {
  368. width: 100%;
  369. background-color: #333;
  370. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  371. display:block;
  372. }
  373. div.polaroid2 {
  374. width: 10%;
  375. background-color: #2B2B2B;
  376. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  377. }
  378. img.polaroid {
  379. width: 100%;
  380. display:block;
  381. }
  382. img.polaroid2 {
  383. width: 10%;
  384. }
  385. div.image-caption {
  386. width: 100%;
  387. margin: 30px auto;
  388. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  389. }
  390. div.image-caption-info {
  391. margin: auto;
  392. background-color: #2B2B2B;
  393. text-align: left;
  394. padding: 2px 10px;
  395. font-size: 14px;
  396. font-family: courier, courier new, monospace;
  397. }
  398. div.image-caption-header {
  399. margin: auto;
  400. background-color: #333;
  401. text-align: left;
  402. padding: 0px 10px;
  403. font-size: 15px;
  404. }
  405. div.image-caption-body {
  406. margin: auto;
  407. background-color: #333;
  408. text-align: left;
  409. padding: 0px 10px;
  410. padding-bottom: 10px;
  411. font-size: 15px;
  412. }
  413. video.autoplay {
  414. width: 100%;
  415. background-color: #333;
  416. margin-bottom: 0px;
  417. margin-top: 0px;
  418. padding-botton: 0px;
  419. padding-top: 0px;
  420. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  421. }
  422. div.footer {
  423. #position: fixed;
  424. overflow: hidden;
  425. display: block;
  426. font-family: Arial, Helvetica, sans-serif;
  427. #background-color: #333;
  428. background: rgba(38, 38, 38, 0.8);
  429. bottom: 0;
  430. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  431. }
  432. img.footer-logo {
  433. width: 120px;
  434. display: block;
  435. margin-left: auto;
  436. margin-right: auto;
  437. margin-top: 30px;
  438. margin-bottom: 10px;
  439. }
  440. p.footer-text {
  441. margin-bottom: 10px;
  442. margin-left: auto;
  443. margin-right: auto;
  444. max-width:410px;
  445. text-align: center;
  446. font-size: 15px;
  447. color:white;
  448. font-family: Georgia;
  449. }
  450. div.profile-wrapper {
  451. margin-left: auto;
  452. margin-right: auto;
  453. width: 230px;
  454. height: 230px;
  455. background-image: url('/img/profile_1.jpg');
  456. background-repeat: no-repeat;
  457. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  458. }
  459. div.profile-prompt-wrapper {
  460. padding-top: 30px;
  461. margin-left: auto;
  462. margin-right: auto;
  463. margin-bottom: 80px;
  464. width: 500px;
  465. height: 50px;
  466. }
  467. div.floating-box {
  468. display: inline-block;
  469. margin-left: 10px;
  470. margin-right: 30px;
  471. margin-bottom: 30px;
  472. margin-top: 10px;
  473. }
  474. div.floating-box-text {
  475. display: inline-block;
  476. margin-left: 10px;
  477. margin-right: 30px;
  478. margin-top: 10px;
  479. width: 300px;
  480. }
  481. div.floating-box-text-telegram {
  482. display: inline-block;
  483. position: relative;
  484. margin-left: 10px;
  485. margin-right: 30px;
  486. margin-top: 10px;
  487. width: 500px;
  488. left: 0px;
  489. top: 20px;
  490. }
  491. div.textbox {
  492. background-color: #333;
  493. padding-left: 5px;
  494. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  495. }
  496. input[type=checkbox]{
  497. display: none;
  498. visibility: hidden;
  499. }
  500. input[type=checkbox]:checked ~ #menu {
  501. visibility: visible;
  502. opacity: 1;
  503. right: 0px;
  504. /*-webkit-transition-duration: 0.4s; /* Safari */
  505. /*transition-duration: 0.4s; */
  506. }
  507. #md5_disabled {
  508. cursor: not-allowed;
  509. }
  510. div.download_subtext_index_div {
  511. position: relative;
  512. right: 40px;
  513. }
  514. p.download_subtext {
  515. padding: 2px;
  516. position: relative;
  517. bottom: 0px;
  518. left: 290px;
  519. font-size:11px;
  520. font-family: Arial, Helvetica, sans-serif;
  521. }
  522. p.download_subtext_index {
  523. padding: 2px;
  524. position: relative;
  525. bottom: -25px;
  526. left: 290px;
  527. font-size:11px;
  528. font-family: Arial, Helvetica, sans-serif;
  529. }
  530. p.download_subtext-right {
  531. padding: 30px;
  532. position: relative;
  533. bottom: -20px;
  534. left: 290px;
  535. font-size:11px;
  536. font-family: Arial, Helvetica, sans-serif;
  537. width: 200px;
  538. }
  539. a.download_button {
  540. text-decoration: none;
  541. position: relative;
  542. bottom: -10px;
  543. left: 290px;
  544. }
  545. div.download_button {
  546. text-decoration: none;
  547. position: relative;
  548. bottom: -20px;
  549. left: 290px;
  550. margin-right: -10px;
  551. }
  552. p.code {
  553. font-size:15px;
  554. font-family: courier, "courier new", monospace;
  555. position: relative;
  556. # bottom: 15px;
  557. margin-left: 10px;
  558. margin-top: -15px;
  559. }
  560. p.code:hover {
  561. font-weight: bold;
  562. }
  563. #download_button_index {
  564. left: 212px;
  565. }
  566. #download_subtext_index {
  567. left: 217px;
  568. }
  569. #code {
  570. font-size:15px;
  571. font-family: courier, "courier new", monospace;
  572. position: relative;
  573. # bottom: 15px;
  574. margin-left: 10px;
  575. margin-top: -15px;
  576. }
  577. #code:hover {
  578. font-weight: bold;
  579. }
  580. .button {
  581. background-color: #4CAF50; /* Green */
  582. border: none;
  583. color: white;
  584. padding: 12px 32px;
  585. text-align: center;
  586. text-decoration: none;
  587. display: block;
  588. font-size: 16px;
  589. margin: 4px 2px;
  590. margin-left: auto;
  591. margin-right: auto;
  592. cursor: pointer;
  593. -webkit-transition-duration: 0.4s; /* Safari */
  594. transition-duration: 0.4s;
  595. }
  596. .button3 {
  597. background-color: #4CAF50; /* Green */
  598. #background-color: #013463; /* Blue */
  599. border: none;
  600. color: white;
  601. padding: 12px 32px;
  602. text-align: center;
  603. text-decoration: none;
  604. display: inline-block;
  605. font-size: 16px;
  606. margin: 4px 2px;
  607. margin-left: auto;
  608. margin-right: auto;
  609. cursor: pointer;
  610. -webkit-transition-duration: 0.4s; /* Safari */
  611. transition-duration: 0.4s;
  612. }
  613. .button4 {
  614. background-color: transparent;
  615. border: 2px solid #4CAF50; /* Green */
  616. color: white;
  617. padding: 10px 32px;
  618. text-align: center;
  619. text-decoration: none;
  620. display: inline-block;
  621. font-size: 16px;
  622. margin: 4px 2px;
  623. #margin-left: auto;
  624. #margin-right: auto;
  625. cursor: pointer;
  626. -webkit-transition-duration: 0.4s; /* Safari */
  627. transition-duration: 0.4s;
  628. border-radius: 12px; /* Rounded Edges */
  629. }
  630. .tooltip {
  631. position: relative;
  632. display: inline-block;
  633. }
  634. .tooltip .tooltiptext {
  635. visibility: hidden;
  636. width: 120px;
  637. background-color: #555;
  638. color: #fff;
  639. text-align: center;
  640. border-radius: 6px;
  641. padding: 5px 2px;
  642. position: absolute;
  643. z-index: 1;
  644. bottom: 125%;
  645. left: 50%;
  646. margin-left: -60px;
  647. opacity: 0;
  648. transition: opacity 0.3s;
  649. }
  650. .tooltip .tooltiptext::after {
  651. content: "";
  652. position: absolute;
  653. top: 100%;
  654. left: 50%;
  655. margin-left: -5px;
  656. border-width: 5px;
  657. border-style: solid;
  658. border-color: #555 transparent transparent transparent;
  659. }
  660. .tooltip:hover .tooltiptext {
  661. visibility: visible;
  662. opacity: 1;
  663. }
  664. img.button {
  665. #margin-right: 20px;
  666. #float: left;
  667. width: 16px;
  668. # opacity: 1.0;
  669. # top: 0px;
  670. # left: 0px;
  671. # position: relative;
  672. # bottom: -4px
  673. }
  674. .tile_div a {
  675. position: relative;
  676. #float: left;
  677. margin-right: -9px;
  678. bottom: -10px;
  679. left: 290px;
  680. }
  681. .title_div a.last {
  682. margin-right: 0;
  683. }
  684. .clear {
  685. clear: both;
  686. }
  687. #index_box {
  688. position: relative;
  689. display: inline-block;
  690. right: 60px;
  691. }
  692. .button_left {
  693. background-color: transparent;
  694. border: 2px solid #4CAF50; /* Green */
  695. color: white;
  696. padding: 10px 20px;
  697. text-align: center;
  698. text-decoration: none;
  699. font-size: 16px;
  700. margin: 4px 2px;
  701. #margin-left: auto;
  702. #margin-right: auto;
  703. cursor: pointer;
  704. -webkit-transition-duration: 0.4s; /* Safari */
  705. transition-duration: 0.4s;
  706. border-radius: 12px 0 0 12px; /* Rounded Edges */
  707. }
  708. .button_right {
  709. background-color: transparent;
  710. border: 2px solid #4CAF50; /* Green */
  711. color: white;
  712. padding: 10px 12px;
  713. text-align: center;
  714. text-decoration: none;
  715. font-size: 16px;
  716. margin: 4px 2px;
  717. #margin-left: auto;
  718. #margin-right: auto;
  719. cursor: pointer;
  720. -webkit-transition-duration: 0.4s; /* Safari */
  721. transition-duration: 0.4s;
  722. border-radius: 0 12px 12px 0; /* Rounded Edges */
  723. position: relative;
  724. left: -11px;
  725. }
  726. a.button_left:hover {
  727. opacity: 0.7;
  728. # color:#D1D1D1;
  729. text-decoration: underlined;
  730. font-family: Arial, Helvetica, sans-serif;
  731. }
  732. a.button_right:hover {
  733. opacity: 0.7;
  734. # color:#D1D1D1;
  735. text-decoration: underlined;
  736. font-family: Arial, Helvetica, sans-serif;
  737. }
  738. .button1 {
  739. box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
  740. }
  741. .button2:hover {
  742. # box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
  743. #background-color: #3C3C3C;
  744. }
  745. .clearFloat { clear: both; }
  746. .disabled {
  747. opacity: 0.6;
  748. cursor: not-allowed;
  749. }
  750. p.serif {
  751. font-family: "Times New Roman", Times, serif;
  752. }
  753. .button.thread {
  754. background-color: #4CAF50; /* Green */
  755. #background-color: #013463; /* Blue */
  756. border: none;
  757. color: white;
  758. padding: 12px 32px;
  759. text-align: center;
  760. text-decoration: none;
  761. display: inline-block;
  762. font-size: 16px;
  763. margin: 4px 2px;
  764. margin-left: auto;
  765. margin-right: auto;
  766. cursor: pointer;
  767. -webkit-transition-duration: 0.4s; /* Safari */
  768. transition-duration: 0.4s;
  769. }
  770. div.download-prompt-wrapper {
  771. margin-left: -20px;
  772. margin-right: auto;
  773. #margin-bottom: 10px;
  774. width: 420px;
  775. height: 80px;
  776. }
  777. div.download-prompt-wrapper-2 {
  778. padding-top: 30px;
  779. margin-left: auto;
  780. margin-right: auto;
  781. margin-bottom: 80px;
  782. width: 170px;
  783. height: 50px;
  784. float: right;
  785. }
  786. div.floating-box-text-2 {
  787. display: block;
  788. margin-left: 10px;
  789. margin-right: 30px;
  790. margin-top: 10px;
  791. margin-bottom: 10px;
  792. width: 300px;
  793. }
  794. div.floating-box-2 {
  795. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  796. background-color: #484848;
  797. margin-top: 30px;
  798. }
  799. a.h1 {
  800. text-decoration: none;
  801. }
  802. #h1-1:link {
  803. color:white;
  804. text-decoration: none;
  805. font-family: Arial, Helvetica, sans-serif;
  806. }
  807. #h1-1:visited {
  808. color:white;
  809. text-decoration: none;
  810. font-family: Arial, Helvetica, sans-serif;
  811. }
  812. #h1-1:hover {
  813. color:#A6A6A6;
  814. text-decoration: none;
  815. font-family: Arial, Helvetica, sans-serif;
  816. }
  817. #h1-1:active {
  818. color:white;
  819. text-decoration: none;
  820. font-family: Arial, Helvetica, sans-serif;
  821. }
  822. p.info-subtitle {
  823. font-size:11px;
  824. font-family: Arial, Helvetica, sans-serif;
  825. #font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
  826. }
  827. #resource_div {
  828. opacity: 0.7;
  829. }
  830. #resource_div:hover {
  831. opacity: 1.0;
  832. box-shadow:0px 0px 0px 1px white inset;
  833. }
  834. #resource_div_2 {
  835. }
  836. #resource_div_2:hover {
  837. box-shadow:0px 0px 0px 1px white inset;
  838. }
  839. #download_div {
  840. opacity: 0.7;
  841. background-color: #4CAF50; /* Green */
  842. }
  843. #download_div:hover {
  844. opacity: 1.0;
  845. box-shadow:0px 0px 0px 1px white inset;
  846. }
  847. span.source_white {
  848. # font-size: 12px;
  849. background-color:rgba(255, 255, 255, 0.8);
  850. float: center;
  851. }
  852. div.source_white {
  853. top: -10px;
  854. # float: center;
  855. color: rgba(255, 255, 255, 0.8);
  856. font-size: 12px;
  857. text-decoration:none;
  858. display: inline-block;
  859. position: relative;
  860. margin-bottom:0;
  861. padding: 0;
  862. overflow: hidden;
  863. font-family: Arial, Helvetica, sans-serif;
  864. }
  865. div.source_white:hover {
  866. background-color:rgba(0, 0, 0, 0.7);
  867. text-decoration:none;
  868. }
  869. a.source_white {
  870. padding-left: 5px;
  871. padding-right: 5px;
  872. font-size: 12px;
  873. text-decoration:none;
  874. # background-color:rgba(255, 255, 255, 0.8);
  875. # background-color: white;
  876. color: black;
  877. # border-color: rgba(255, 255, 255, 0.8);
  878. # border-color: white;
  879. # border-style: solid;
  880. # border-width: 2px;
  881. # display: block;
  882. display: inline-block;
  883. text-align: center;
  884. color: white;
  885. # text-align: center;
  886. # padding: 14px 16px;
  887. text-decoration: none;
  888. }
  889. a.source_white:hover {
  890. # color: #4CAF50;
  891. # color: white;
  892. }
  893. span.source_black {
  894. font-size: 12px;
  895. background-color:rgba(0, 0, 0, 0.8);
  896. }
  897. a.source_black {
  898. text-decoration:none;
  899. color: white;
  900. }
  901. span.source_black:hover {
  902. font-size: 12px;
  903. background-color:rgba(255, 255, 255, 0.8);
  904. }
  905. a.source_black:hover {
  906. text-decoration:none;
  907. color: black;
  908. }
  909. header {
  910. #background: #383838;
  911. width: 100%;
  912. height: 76px;
  913. position: relative;
  914. top: 0;
  915. left: 0;
  916. #border-bottom: 4px solid #4C9CF1;
  917. #z-index: 2;
  918. max-width:600px;
  919. margin-left: auto;
  920. margin-right: auto;
  921. }
  922. .copy a {
  923. text-decoration: none;
  924. display: inline-block;
  925. padding: 5px 10px;
  926. border-radius: 5px;
  927. background-color: #111111;
  928. }
  929. .modal-content {
  930. #background: #383838;
  931. background: #282828;
  932. position: relative;
  933. z-index: 20;
  934. border-radius: 10px;
  935. padding: 10px;
  936. max-width:750px;
  937. top: 0;
  938. left: 0;
  939. margin-left: auto;
  940. margin-right: auto;;
  941. }
  942. /* modal_me */
  943. #modal_buildinfo {
  944. left: 50%;
  945. margin: -250px 0 0 -32%;
  946. opacity: 0;
  947. position: absolute;
  948. top: -50%;
  949. visibility: hidden;
  950. width: 65%;
  951. box-shadow: 0 3px 7px rgba(0,0,0,.25);
  952. box-sizing: border-box;
  953. transition: all .4s ease-in-out;
  954. -moz-transition: all .4s ease-in-out;
  955. -webkit-transition: all .4s ease-in-out
  956. }
  957. #modal_buildinfo:target {
  958. opacity: 1;
  959. top: 450px;
  960. visibility: visible;
  961. }
  962. #modal_buildinfo .header, #modal_buildinfo .footer {
  963. #border-bottom: 1px solid lightgrey;
  964. border-radius: 5px 5px 0 0;
  965. }
  966. #modal_buildinfo .footer {
  967. border: none;
  968. border-top: 1px solid lightgrey;
  969. border-radius: 0 0 5px 5px
  970. }
  971. #modal_buildinfo h1 {
  972. #color: black;
  973. color: white;
  974. margin-top: 0;
  975. }
  976. #modal_buildinfo p {
  977. #color: black;
  978. color: white;
  979. font-size: 14px;
  980. }
  981. #modal_buildinfo ul {
  982. #color: black;
  983. color: white;
  984. font-size: 14px;
  985. }
  986. #modal_buildinfo a {
  987. color: white;
  988. font-size: 14px;
  989. }
  990. #modal_buildinfo a:hover {
  991. #color: #4CAF50; /* Green */
  992. }
  993. #modal_buildinfo .copy a:hover {
  994. color: #4CAF50; /* Green */
  995. }
  996. #modal_buildinfo .copy a {
  997. color: white;
  998. font-size: 15px;
  999. }
  1000. #modal_buildinfo .btn { float: right }
  1001. #modal_buildinfo .copy, #modal_buildinfo .header, #modal_buildinfo .footer {
  1002. padding: 20px;
  1003. }
  1004. #modal_buildinfo .copy { background: #282828 }
  1005. #modal_buildinfo .overlay {
  1006. background-color: #000;
  1007. background: rgba(0,0,0,.8);
  1008. height: 100%;
  1009. left: 0;
  1010. position: fixed;
  1011. top: 0;
  1012. width: 100%;
  1013. z-index: 10;
  1014. }
  1015. @media screen and (max-width: 1000px){
  1016. div.body {
  1017. max-width: 650px;
  1018. }
  1019. ul.topnav {
  1020. max-width: 650px;
  1021. }
  1022. p.download_subtext {
  1023. left: 0px;
  1024. }
  1025. p.download_subtext_index {
  1026. left: 0px;
  1027. }
  1028. a.download_button {
  1029. left: 0px;
  1030. }
  1031. div.download_button {
  1032. left: 0px;
  1033. }
  1034. div.download-prompt-wrapper {
  1035. width: 350px
  1036. }
  1037. div.download-prompt-wrapper-2 {
  1038. left: 110px;
  1039. position: relative;
  1040. }
  1041. #whatis{
  1042. margin-top: 60px;
  1043. }
  1044. #download_button_index {
  1045. left: -22px;
  1046. }
  1047. #download_subtext_index {
  1048. left: -17px;
  1049. }
  1050. }
  1051. @media screen and (max-width: 700px){
  1052. div.body {
  1053. margin-top: 100px;
  1054. }
  1055. #top-logo-mobile {
  1056. top: -35px;
  1057. left: 18px;
  1058. display: block;
  1059. visibility: visible;
  1060. }
  1061. #top-logo-li {
  1062. visibility: : hidden;
  1063. display: none;
  1064. }
  1065. #mobile-menu-icon {
  1066. display:inline-block;
  1067. visibility: visible;
  1068. position: absolute;
  1069. right: 5px;
  1070. top: 50%;
  1071. -webkit-transform: translate(-50%, -50%);
  1072. transform: translate(-50%, -50%);
  1073. margin-top: 0px;
  1074. margin-left: 0px;
  1075. }
  1076. div.badge {
  1077. display: none;
  1078. }
  1079. img.topnav {
  1080. display: none;
  1081. }
  1082. ul.topnav li.right,
  1083. ul.topnav li {float: none;
  1084. }
  1085. ul.topnav {
  1086. margin-top: 0;
  1087. position: relative;
  1088. display: block;
  1089. visibility: hidden;
  1090. opacity: 0;
  1091. transition: visibility 0s, right 0.3s;
  1092. right: -100%;
  1093. width: 30%;
  1094. min-width: 135px;
  1095. #overflow: hidden;
  1096. overflow: visible;
  1097. z-index: 10;
  1098. background-color: #1c1c1c;
  1099. top: -14px;
  1100. #padding-top: 45px;
  1101. float: right;
  1102. #border-bottom: 1px solid white;
  1103. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  1104. }
  1105. div.topnav-wrapper {
  1106. position: fixed;
  1107. display: block;
  1108. height: 55px;
  1109. max-height: 200px;
  1110. max-width: 680px;
  1111. margin: 0;
  1112. padding: 0;
  1113. z-index: 10;
  1114. #position: fixed;
  1115. #display: block;
  1116. top: 0;
  1117. #margin-left: auto;
  1118. #margin-right: auto;
  1119. width: 100%;
  1120. height: 55px;
  1121. left: 0px;
  1122. #background-color: #262626;
  1123. #box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  1124. }
  1125. .show-menu {
  1126. display:block;
  1127. visibility: visible;
  1128. background: none;
  1129. box-shadow: none;
  1130. #padding: 50px;
  1131. margin-bottom: 40px;
  1132. #margin-top: -10px;
  1133. text-align: center;
  1134. width: auto;
  1135. }
  1136. ul.topnav li a {
  1137. padding: 14px 14px;
  1138. }
  1139. ul.topnav li.right {
  1140. float: none;
  1141. }
  1142. div.topnav-reverse {
  1143. float: none;
  1144. }
  1145. ul.topnav li a.active {
  1146. float: none;
  1147. #box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  1148. #background-color: #484848;
  1149. }
  1150. #mobile-home {
  1151. display: block;
  1152. }
  1153. #mobile_purge {
  1154. display: none;
  1155. }
  1156. div.footer {
  1157. width: 100%;
  1158. margin: auto;
  1159. }
  1160. div.profile-wrapper {
  1161. float: none;
  1162. margin-top: 0px;
  1163. margin-bottom: 0px;
  1164. margin-left: auto;
  1165. margin-right: auto;
  1166. }
  1167. div.floating-box {
  1168. display: block;
  1169. float: none;
  1170. margin: 0;
  1171. }
  1172. div.floating-box-text {
  1173. display: block;
  1174. float: none;
  1175. margin-left: auto;
  1176. margin-right: auto;
  1177. margin: 0px;
  1178. width: auto;
  1179. }
  1180. ul.topnav li.right {
  1181. float: none;
  1182. }
  1183. ul.topnav li.right_active {
  1184. float: none;
  1185. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  1186. background-color: #484848;
  1187. }
  1188. p.download_subtext {
  1189. left: 0px;
  1190. }
  1191. p.download_subtext_index {
  1192. left: 0px;
  1193. }
  1194. a.download_button {
  1195. left: 0px;
  1196. }
  1197. div.download_button {
  1198. left: 0px;
  1199. }
  1200. div.download-prompt-wrapper {
  1201. display: block;
  1202. margin-bottom: 100px;
  1203. float: none;
  1204. width: auto;
  1205. margin: 0 auto;
  1206. }
  1207. div.download-prompt-wrapper-2 {
  1208. display: inline-block;
  1209. float: none;
  1210. display: flex;
  1211. align-items: center;
  1212. justify-content: center;
  1213. left: 0px;
  1214. }
  1215. #whatis{
  1216. margin-top: 100px;
  1217. }
  1218. #minimal_button {
  1219. margin-top: 120px;
  1220. }
  1221. #full_button {
  1222. margin-top: 65px;
  1223. }
  1224. #minimal_title {
  1225. margin-top: 90px;
  1226. }
  1227. span.tooltiptext {
  1228. display: none;
  1229. visibility: hidden;
  1230. }
  1231. #download_button_index {
  1232. left: 0px;
  1233. }
  1234. #download_subtext_index {
  1235. left: 5px;
  1236. }
  1237. }