index.html 51 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625
  1. <!doctype html>
  2. <html ⚡ lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta name="viewport" content="width=device-width">
  6. <link rel="canonical" href="/article.html">
  7. <link rel="shortcut icon" href="amp_favicon.png">
  8. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css"
  9. integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">
  10. <title>News Article</title>
  11. <style amp-custom>
  12. body {
  13. width: auto;
  14. margin: 0;
  15. padding: 0;
  16. }
  17. header {
  18. background: Tomato;
  19. color: white;
  20. font-size: 2em;
  21. text-align: center;
  22. }
  23. h1 {
  24. margin: 0;
  25. padding: 0.5em;
  26. background: white;
  27. box-shadow: 0px 3px 5px grey;
  28. }
  29. p {
  30. padding: 0.5em;
  31. margin: 0.5em;
  32. }
  33. :root {
  34. --color-scheme: dark;
  35. --blue: #0084b4;
  36. --indigo: #6610f2;
  37. --purple: #6f42c1;
  38. --pink: #e83e8c;
  39. --red: #dc3545;
  40. --orange: #fd7e14;
  41. --yellow: beige;
  42. --green: #28a745;
  43. --teal: #20c997;
  44. --cyan: #17a2b8;
  45. --white: #fff;
  46. --gray: #6c757d;
  47. --gray-dark: #212529;
  48. --primary: #0084b4;
  49. --secondary: #6c757d;
  50. --success: #28a745;
  51. --info: #17a2b8;
  52. --warning: beige;
  53. --danger: #dc3545;
  54. --light: #dee2e6;
  55. --dark: #212529;
  56. --breakpoint-xs: 0;
  57. --breakpoint-sm: 576px;
  58. --breakpoint-md: 768px;
  59. --breakpoint-lg: 992px;
  60. --breakpoint-xl: 1200px;
  61. --font-family-sans-serif: "Roboto Condensed", sans-serif;
  62. --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace
  63. ;
  64. }
  65. @media all {
  66. .bg-warning {
  67. color: #212529;
  68. }
  69. }
  70. @media all {
  71. #sidebar {
  72. background: #212529;
  73. }
  74. }
  75. .sidebar-close {
  76. background: transparent;
  77. }
  78. @media all {
  79. .sidebar-close {
  80. color: #f8f9fa;
  81. }
  82. }
  83. *,
  84. *::before,
  85. *::after {
  86. -webkit-box-sizing: border-box;
  87. box-sizing: border-box;
  88. }
  89. html {
  90. font-family: sans-serif;
  91. line-height: 1.15;
  92. -webkit-text-size-adjust: 100%;
  93. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  94. }
  95. article,
  96. aside,
  97. figcaption,
  98. figure,
  99. footer,
  100. header,
  101. hgroup,
  102. main,
  103. nav,
  104. section {
  105. display: block;
  106. }
  107. body {
  108. margin: 0;
  109. font-family: 'Noto Sans TC', sans-serif;
  110. font-weight: 400;
  111. line-height: 1.5;
  112. text-align: left;
  113. font-size: 1rem;
  114. letter-spacing: 2px;
  115. }
  116. @media all {
  117. body {
  118. color: #f8f9fa;
  119. background-color: #212529;
  120. }
  121. }
  122. [tabindex="-1"]:focus:not(:focus-visible) {
  123. outline: 0;
  124. }
  125. hr {
  126. -webkit-box-sizing: content-box;
  127. box-sizing: content-box;
  128. height: 0;
  129. overflow: visible;
  130. }
  131. p {
  132. margin-top: 0;
  133. margin-bottom: 1rem;
  134. }
  135. abbr[title],
  136. abbr[data-original-title] {
  137. text-decoration: underline;
  138. -webkit-text-decoration: underline dotted;
  139. text-decoration: underline dotted;
  140. border-bottom: 0;
  141. text-decoration-skip-ink: none;
  142. cursor: help;
  143. }
  144. address {
  145. margin-bottom: 1rem;
  146. font-style: normal;
  147. line-height: inherit;
  148. }
  149. ol,
  150. ul,
  151. dl {
  152. margin-top: 0;
  153. margin-bottom: 1rem;
  154. }
  155. ol ol,
  156. ul ul,
  157. ol ul,
  158. ul ol {
  159. margin-bottom: 0;
  160. }
  161. dt {
  162. font-weight: 700;
  163. }
  164. dd {
  165. margin-bottom: .5rem;
  166. margin-left: 0;
  167. }
  168. blockquote {
  169. margin: 0 0 1rem;
  170. }
  171. b,
  172. strong {
  173. font-weight: 700;
  174. }
  175. small {
  176. font-size: 80%;
  177. }
  178. sub,
  179. sup {
  180. position: relative;
  181. line-height: 0;
  182. vertical-align: baseline;
  183. font-size: 75%;
  184. }
  185. sub {
  186. bottom: -.25em;
  187. }
  188. sup {
  189. top: -.5em;
  190. }
  191. a {
  192. text-decoration: none;
  193. background: transparent;
  194. }
  195. @media all {
  196. a {
  197. /* color: #f8f9fa; */
  198. color: #2980B8;
  199. }
  200. }
  201. a:hover {
  202. text-decoration: underline;
  203. }
  204. @media all {
  205. a:hover {
  206. color: #cbd3da;
  207. }
  208. }
  209. a:not([href]) {
  210. color: inherit;
  211. text-decoration: none;
  212. }
  213. a:not([href]):hover {
  214. color: inherit;
  215. text-decoration: none;
  216. }
  217. pre,
  218. code,
  219. kbd,
  220. samp {
  221. font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  222. font-size: 1em;
  223. }
  224. pre {
  225. margin-top: 0;
  226. margin-bottom: 1rem;
  227. overflow: auto;
  228. }
  229. figure {
  230. margin: 0 0 1rem;
  231. }
  232. img {
  233. vertical-align: middle;
  234. border-style: none;
  235. }
  236. svg {
  237. overflow: hidden;
  238. vertical-align: middle;
  239. }
  240. table {
  241. border-collapse: collapse;
  242. }
  243. caption {
  244. padding-top: .75rem;
  245. padding-bottom: .75rem;
  246. text-align: left;
  247. caption-side: bottom;
  248. }
  249. @media all {
  250. caption {
  251. color: #6c757d;
  252. }
  253. }
  254. th {
  255. text-align: inherit;
  256. }
  257. label {
  258. display: inline-block;
  259. margin-bottom: .5rem;
  260. }
  261. button {
  262. border-radius: 0;
  263. }
  264. button:focus {
  265. outline: 1px dotted;
  266. outline: 5px auto -webkit-focus-ring-color;
  267. }
  268. input,
  269. button,
  270. select,
  271. optgroup,
  272. textarea {
  273. margin: 0;
  274. font-family: inherit;
  275. line-height: inherit;
  276. font-size: inherit;
  277. }
  278. button,
  279. input {
  280. overflow: visible;
  281. }
  282. button,
  283. select {
  284. text-transform: none;
  285. }
  286. select {
  287. word-wrap: normal;
  288. }
  289. button,
  290. [type="button"],
  291. [type="reset"],
  292. [type="submit"] {
  293. -webkit-appearance: button;
  294. }
  295. button:not(:disabled),
  296. [type="button"]:not(:disabled),
  297. [type="reset"]:not(:disabled),
  298. [type="submit"]:not(:disabled) {
  299. cursor: pointer;
  300. }
  301. button::-moz-focus-inner,
  302. [type="button"]::-moz-focus-inner,
  303. [type="reset"]::-moz-focus-inner,
  304. [type="submit"]::-moz-focus-inner {
  305. padding: 0;
  306. border-style: none;
  307. }
  308. input[type="radio"],
  309. input[type="checkbox"] {
  310. -webkit-box-sizing: border-box;
  311. box-sizing: border-box;
  312. padding: 0;
  313. }
  314. input[type="date"],
  315. input[type="time"],
  316. input[type="datetime-local"],
  317. input[type="month"] {
  318. -webkit-appearance: listbox;
  319. }
  320. textarea {
  321. overflow: auto;
  322. resize: vertical;
  323. }
  324. [type="number"]::-webkit-inner-spin-button,
  325. [type="number"]::-webkit-outer-spin-button {
  326. height: auto;
  327. }
  328. [type="search"] {
  329. outline-offset: -2px;
  330. -webkit-appearance: none;
  331. }
  332. [type="search"]::-webkit-search-decoration {
  333. -webkit-appearance: none;
  334. }
  335. ::-webkit-file-upload-button {
  336. font: inherit;
  337. -webkit-appearance: button;
  338. }
  339. output {
  340. display: inline-block;
  341. }
  342. summary {
  343. display: list-item;
  344. cursor: pointer;
  345. }
  346. template {
  347. display: none;
  348. }
  349. [hidden] {
  350. display: none;
  351. }
  352. h1,
  353. h2,
  354. h3,
  355. h4,
  356. h5,
  357. h6 {
  358. margin-bottom: .5rem;
  359. font-weight: 400;
  360. line-height: 1.2;
  361. }
  362. h1 {
  363. font-size: 2.5rem;
  364. }
  365. @media (max-width: 1200px) {
  366. h1 {
  367. font-size: calc(1.375rem + 1.5vw);
  368. }
  369. }
  370. h2 {
  371. font-size: 2rem;
  372. }
  373. @media (max-width: 1200px) {
  374. h2 {
  375. font-size: calc(1.325rem + .9vw);
  376. }
  377. }
  378. h3 {
  379. font-size: 1.25rem;
  380. }
  381. h4 {
  382. font-size: 1.15rem;
  383. }
  384. h5 {
  385. font-size: 1rem;
  386. }
  387. h6 {
  388. font-size: 1rem;
  389. }
  390. .lead {
  391. font-weight: 400;
  392. font-size: 1.25rem;
  393. }
  394. hr {
  395. margin-top: 2.5rem;
  396. margin-bottom: 2.5rem;
  397. border-top: 1px solid silver;
  398. }
  399. img,
  400. amp-img {
  401. border: 0;
  402. }
  403. amp-img[class^=i-amp],
  404. amp-img[class^=-amp] {
  405. height: auto;
  406. max-width: 100%;
  407. }
  408. .container,
  409. .container-fluid,
  410. .container-xxl,
  411. .container-xl,
  412. .container-lg,
  413. .container-md,
  414. .container-sm {
  415. width: 100%;
  416. padding-right: var(--bs-gutter-x, 0.75rem);
  417. padding-left: var(--bs-gutter-x, 0.75rem);
  418. margin-right: auto;
  419. margin-left: auto;
  420. }
  421. @media (min-width: 576px) {
  422. .container-sm, .container {
  423. max-width: 540px;
  424. }
  425. }
  426. @media (min-width: 768px) {
  427. .container-md, .container-sm, .container {
  428. max-width: 720px;
  429. }
  430. }
  431. @media (min-width: 992px) {
  432. .container-lg, .container-md, .container-sm, .container {
  433. max-width: 960px;
  434. }
  435. }
  436. @media (min-width: 1200px) {
  437. .container-xl, .container-lg, .container-md, .container-sm, .container {
  438. max-width: 1140px;
  439. }
  440. }
  441. @media (min-width: 1400px) {
  442. .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
  443. max-width: 1320px;
  444. }
  445. }
  446. .row {
  447. --bs-gutter-x: 1.5rem;
  448. --bs-gutter-y: 0;
  449. display: -webkit-box;
  450. display: -ms-flexbox;
  451. display: flex;
  452. -ms-flex-wrap: wrap;
  453. flex-wrap: wrap;
  454. margin-top: calc(var(--bs-gutter-y) * -1);
  455. margin-right: calc(var(--bs-gutter-x) / -2);
  456. margin-left: calc(var(--bs-gutter-x) / -2);
  457. }
  458. .row > * {
  459. -ms-flex-negative: 0;
  460. flex-shrink: 0;
  461. width: 100%;
  462. max-width: 100%;
  463. padding-right: calc(var(--bs-gutter-x) / 2);
  464. padding-left: calc(var(--bs-gutter-x) / 2);
  465. margin-top: var(--bs-gutter-y);
  466. }
  467. .col-1,
  468. .col-2,
  469. .col-3,
  470. .col-4,
  471. .col-5,
  472. .col-6,
  473. .col-7,
  474. .col-8,
  475. .col-9,
  476. .col-10,
  477. .col-11,
  478. .col-12,
  479. .col,
  480. .col-auto,
  481. .col-sm-1,
  482. .col-sm-2,
  483. .col-sm-3,
  484. .col-sm-4,
  485. .col-sm-5,
  486. .col-sm-6,
  487. .col-sm-7,
  488. .col-sm-8,
  489. .col-sm-9,
  490. .col-sm-10,
  491. .col-sm-11,
  492. .col-sm-12,
  493. .col-sm,
  494. .col-sm-auto,
  495. .col-md-1,
  496. .col-md-2,
  497. .col-md-3,
  498. .col-md-4,
  499. .col-md-5,
  500. .col-md-6,
  501. .col-md-7,
  502. .col-md-8,
  503. .col-md-9,
  504. .col-md-10,
  505. .col-md-11,
  506. .col-md-12,
  507. .col-md,
  508. .col-md-auto,
  509. .col-lg-1,
  510. .col-lg-2,
  511. .col-lg-3,
  512. .col-lg-4,
  513. .col-lg-5,
  514. .col-lg-6,
  515. .col-lg-7,
  516. .col-lg-8,
  517. .col-lg-9,
  518. .col-lg-10,
  519. .col-lg-11,
  520. .col-lg-12,
  521. .col-lg,
  522. .col-lg-auto,
  523. .col-xl-1,
  524. .col-xl-2,
  525. .col-xl-3,
  526. .col-xl-4,
  527. .col-xl-5,
  528. .col-xl-6,
  529. .col-xl-7,
  530. .col-xl-8,
  531. .col-xl-9,
  532. .col-xl-10,
  533. .col-xl-11,
  534. .col-xl-12,
  535. .col-xl,
  536. .col-xl-auto {
  537. position: relative;
  538. width: 100%;
  539. padding-right: 15px;
  540. padding-left: 15px;
  541. }
  542. .col {
  543. -ms-flex-preferred-size: 0;
  544. flex-basis: 0;
  545. -webkit-box-flex: 1;
  546. -ms-flex-positive: 1;
  547. flex-grow: 1;
  548. max-width: 100%;
  549. }
  550. .col-1 {
  551. -webkit-box-flex: 0;
  552. -ms-flex: 0 0 8.33333%;
  553. flex: 0 0 8.33333%;
  554. max-width: 8.33333%;
  555. }
  556. .col-2 {
  557. -webkit-box-flex: 0;
  558. -ms-flex: 0 0 16.66667%;
  559. flex: 0 0 16.66667%;
  560. max-width: 16.66667%;
  561. }
  562. .col-3 {
  563. -webkit-box-flex: 0;
  564. -ms-flex: 0 0 25%;
  565. flex: 0 0 25%;
  566. max-width: 25%;
  567. }
  568. .col-4 {
  569. -webkit-box-flex: 0;
  570. -ms-flex: 0 0 33.33333%;
  571. flex: 0 0 33.33333%;
  572. max-width: 33.33333%;
  573. }
  574. .col-5 {
  575. -webkit-box-flex: 0;
  576. -ms-flex: 0 0 41.66667%;
  577. flex: 0 0 41.66667%;
  578. max-width: 41.66667%;
  579. }
  580. .col-6 {
  581. -webkit-box-flex: 0;
  582. -ms-flex: 0 0 50%;
  583. flex: 0 0 50%;
  584. max-width: 50%;
  585. }
  586. .col-7 {
  587. -webkit-box-flex: 0;
  588. -ms-flex: 0 0 58.33333%;
  589. flex: 0 0 58.33333%;
  590. max-width: 58.33333%;
  591. }
  592. .col-8 {
  593. -webkit-box-flex: 0;
  594. -ms-flex: 0 0 66.66667%;
  595. flex: 0 0 66.66667%;
  596. max-width: 66.66667%;
  597. }
  598. .col-9 {
  599. -webkit-box-flex: 0;
  600. -ms-flex: 0 0 75%;
  601. flex: 0 0 75%;
  602. max-width: 75%;
  603. }
  604. .col-10 {
  605. -webkit-box-flex: 0;
  606. -ms-flex: 0 0 83.33333%;
  607. flex: 0 0 83.33333%;
  608. max-width: 83.33333%;
  609. }
  610. .col-11 {
  611. -webkit-box-flex: 0;
  612. -ms-flex: 0 0 91.66667%;
  613. flex: 0 0 91.66667%;
  614. max-width: 91.66667%;
  615. }
  616. .col-12 {
  617. -webkit-box-flex: 0;
  618. -ms-flex: 0 0 100%;
  619. flex: 0 0 100%;
  620. max-width: 100%;
  621. }
  622. @media (min-width: 576px) {
  623. .col-sm {
  624. -ms-flex-preferred-size: 0;
  625. flex-basis: 0;
  626. -webkit-box-flex: 1;
  627. -ms-flex-positive: 1;
  628. flex-grow: 1;
  629. max-width: 100%;
  630. }
  631. .col-sm-1 {
  632. -webkit-box-flex: 0;
  633. -ms-flex: 0 0 8.33333%;
  634. flex: 0 0 8.33333%;
  635. max-width: 8.33333%;
  636. }
  637. .col-sm-2 {
  638. -webkit-box-flex: 0;
  639. -ms-flex: 0 0 16.66667%;
  640. flex: 0 0 16.66667%;
  641. max-width: 16.66667%;
  642. }
  643. .col-sm-3 {
  644. -webkit-box-flex: 0;
  645. -ms-flex: 0 0 25%;
  646. flex: 0 0 25%;
  647. max-width: 25%;
  648. }
  649. .col-sm-4 {
  650. -webkit-box-flex: 0;
  651. -ms-flex: 0 0 33.33333%;
  652. flex: 0 0 33.33333%;
  653. max-width: 33.33333%;
  654. }
  655. .col-sm-5 {
  656. -webkit-box-flex: 0;
  657. -ms-flex: 0 0 41.66667%;
  658. flex: 0 0 41.66667%;
  659. max-width: 41.66667%;
  660. }
  661. .col-sm-6 {
  662. -webkit-box-flex: 0;
  663. -ms-flex: 0 0 50%;
  664. flex: 0 0 50%;
  665. max-width: 50%;
  666. }
  667. .col-sm-7 {
  668. -webkit-box-flex: 0;
  669. -ms-flex: 0 0 58.33333%;
  670. flex: 0 0 58.33333%;
  671. max-width: 58.33333%;
  672. }
  673. .col-sm-8 {
  674. -webkit-box-flex: 0;
  675. -ms-flex: 0 0 66.66667%;
  676. flex: 0 0 66.66667%;
  677. max-width: 66.66667%;
  678. }
  679. .col-sm-9 {
  680. -webkit-box-flex: 0;
  681. -ms-flex: 0 0 75%;
  682. flex: 0 0 75%;
  683. max-width: 75%;
  684. }
  685. .col-sm-10 {
  686. -webkit-box-flex: 0;
  687. -ms-flex: 0 0 83.33333%;
  688. flex: 0 0 83.33333%;
  689. max-width: 83.33333%;
  690. }
  691. .col-sm-11 {
  692. -webkit-box-flex: 0;
  693. -ms-flex: 0 0 91.66667%;
  694. flex: 0 0 91.66667%;
  695. max-width: 91.66667%;
  696. }
  697. .col-sm-12 {
  698. -webkit-box-flex: 0;
  699. -ms-flex: 0 0 100%;
  700. flex: 0 0 100%;
  701. max-width: 100%;
  702. }
  703. }
  704. @media (min-width: 768px) {
  705. .col-md {
  706. -ms-flex-preferred-size: 0;
  707. flex-basis: 0;
  708. -webkit-box-flex: 1;
  709. -ms-flex-positive: 1;
  710. flex-grow: 1;
  711. max-width: 100%;
  712. }
  713. .col-md-1 {
  714. -webkit-box-flex: 0;
  715. -ms-flex: 0 0 8.33333%;
  716. flex: 0 0 8.33333%;
  717. max-width: 8.33333%;
  718. }
  719. .col-md-2 {
  720. -webkit-box-flex: 0;
  721. -ms-flex: 0 0 16.66667%;
  722. flex: 0 0 16.66667%;
  723. max-width: 16.66667%;
  724. }
  725. .col-md-3 {
  726. -webkit-box-flex: 0;
  727. -ms-flex: 0 0 25%;
  728. flex: 0 0 25%;
  729. max-width: 25%;
  730. }
  731. .col-md-4 {
  732. -webkit-box-flex: 0;
  733. -ms-flex: 0 0 33.33333%;
  734. flex: 0 0 33.33333%;
  735. max-width: 33.33333%;
  736. }
  737. .col-md-5 {
  738. -webkit-box-flex: 0;
  739. -ms-flex: 0 0 41.66667%;
  740. flex: 0 0 41.66667%;
  741. max-width: 41.66667%;
  742. }
  743. .col-md-6 {
  744. -webkit-box-flex: 0;
  745. -ms-flex: 0 0 50%;
  746. flex: 0 0 50%;
  747. max-width: 50%;
  748. }
  749. .col-md-7 {
  750. -webkit-box-flex: 0;
  751. -ms-flex: 0 0 58.33333%;
  752. flex: 0 0 58.33333%;
  753. max-width: 58.33333%;
  754. }
  755. .col-md-8 {
  756. -webkit-box-flex: 0;
  757. -ms-flex: 0 0 66.66667%;
  758. flex: 0 0 66.66667%;
  759. max-width: 66.66667%;
  760. }
  761. .col-md-9 {
  762. -webkit-box-flex: 0;
  763. -ms-flex: 0 0 75%;
  764. flex: 0 0 75%;
  765. max-width: 75%;
  766. }
  767. .col-md-10 {
  768. -webkit-box-flex: 0;
  769. -ms-flex: 0 0 83.33333%;
  770. flex: 0 0 83.33333%;
  771. max-width: 83.33333%;
  772. }
  773. .col-md-11 {
  774. -webkit-box-flex: 0;
  775. -ms-flex: 0 0 91.66667%;
  776. flex: 0 0 91.66667%;
  777. max-width: 91.66667%;
  778. }
  779. .col-md-12 {
  780. -webkit-box-flex: 0;
  781. -ms-flex: 0 0 100%;
  782. flex: 0 0 100%;
  783. max-width: 100%;
  784. }
  785. .ms-md-1 {
  786. margin-left: 0.25rem !important;
  787. }
  788. .ms-md-2 {
  789. margin-left: 0.5rem !important;
  790. }
  791. .ms-md-3 {
  792. margin-left: 1rem !important;
  793. }
  794. .ms-md-4 {
  795. margin-left: 1.5rem !important;
  796. }
  797. .ms-md-5 {
  798. margin-left: 3rem !important;
  799. }
  800. .justify-content-md-center {
  801. -webkit-box-pack: center !important;
  802. -ms-flex-pack: center !important;
  803. justify-content: center !important;
  804. }
  805. }
  806. @media (min-width: 992px) {
  807. .col-lg {
  808. -ms-flex-preferred-size: 0;
  809. flex-basis: 0;
  810. -webkit-box-flex: 1;
  811. -ms-flex-positive: 1;
  812. flex-grow: 1;
  813. max-width: 100%;
  814. }
  815. .col-lg-1 {
  816. -webkit-box-flex: 0;
  817. -ms-flex: 0 0 8.33333%;
  818. flex: 0 0 8.33333%;
  819. max-width: 8.33333%;
  820. }
  821. .col-lg-2 {
  822. -webkit-box-flex: 0;
  823. -ms-flex: 0 0 16.66667%;
  824. flex: 0 0 16.66667%;
  825. max-width: 16.66667%;
  826. }
  827. .col-lg-3 {
  828. -webkit-box-flex: 0;
  829. -ms-flex: 0 0 25%;
  830. flex: 0 0 25%;
  831. max-width: 25%;
  832. }
  833. .col-lg-4 {
  834. -webkit-box-flex: 0;
  835. -ms-flex: 0 0 33.33333%;
  836. flex: 0 0 33.33333%;
  837. max-width: 33.33333%;
  838. }
  839. .col-lg-5 {
  840. -webkit-box-flex: 0;
  841. -ms-flex: 0 0 41.66667%;
  842. flex: 0 0 41.66667%;
  843. max-width: 41.66667%;
  844. }
  845. .col-lg-6 {
  846. -webkit-box-flex: 0;
  847. -ms-flex: 0 0 50%;
  848. flex: 0 0 50%;
  849. max-width: 50%;
  850. }
  851. .col-lg-7 {
  852. -webkit-box-flex: 0;
  853. -ms-flex: 0 0 58.33333%;
  854. flex: 0 0 58.33333%;
  855. max-width: 58.33333%;
  856. }
  857. .col-lg-8 {
  858. -webkit-box-flex: 0;
  859. -ms-flex: 0 0 66.66667%;
  860. flex: 0 0 66.66667%;
  861. max-width: 66.66667%;
  862. }
  863. .col-lg-9 {
  864. -webkit-box-flex: 0;
  865. -ms-flex: 0 0 75%;
  866. flex: 0 0 75%;
  867. max-width: 75%;
  868. }
  869. .col-lg-10 {
  870. -webkit-box-flex: 0;
  871. -ms-flex: 0 0 83.33333%;
  872. flex: 0 0 83.33333%;
  873. max-width: 83.33333%;
  874. }
  875. .col-lg-11 {
  876. -webkit-box-flex: 0;
  877. -ms-flex: 0 0 91.66667%;
  878. flex: 0 0 91.66667%;
  879. max-width: 91.66667%;
  880. }
  881. .col-lg-12 {
  882. -webkit-box-flex: 0;
  883. -ms-flex: 0 0 100%;
  884. flex: 0 0 100%;
  885. max-width: 100%;
  886. }
  887. }
  888. @media (min-width: 1200px) {
  889. .col-xl {
  890. -ms-flex-preferred-size: 0;
  891. flex-basis: 0;
  892. -webkit-box-flex: 1;
  893. -ms-flex-positive: 1;
  894. flex-grow: 1;
  895. max-width: 100%;
  896. }
  897. .col-xl-1 {
  898. -webkit-box-flex: 0;
  899. -ms-flex: 0 0 8.33333%;
  900. flex: 0 0 8.33333%;
  901. max-width: 8.33333%;
  902. }
  903. .col-xl-2 {
  904. -webkit-box-flex: 0;
  905. -ms-flex: 0 0 16.66667%;
  906. flex: 0 0 16.66667%;
  907. max-width: 16.66667%;
  908. }
  909. .col-xl-3 {
  910. -webkit-box-flex: 0;
  911. -ms-flex: 0 0 25%;
  912. flex: 0 0 25%;
  913. max-width: 25%;
  914. }
  915. .col-xl-4 {
  916. -webkit-box-flex: 0;
  917. -ms-flex: 0 0 33.33333%;
  918. flex: 0 0 33.33333%;
  919. max-width: 33.33333%;
  920. }
  921. .col-xl-5 {
  922. -webkit-box-flex: 0;
  923. -ms-flex: 0 0 41.66667%;
  924. flex: 0 0 41.66667%;
  925. max-width: 41.66667%;
  926. }
  927. .col-xl-6 {
  928. -webkit-box-flex: 0;
  929. -ms-flex: 0 0 50%;
  930. flex: 0 0 50%;
  931. max-width: 50%;
  932. }
  933. .col-xl-7 {
  934. -webkit-box-flex: 0;
  935. -ms-flex: 0 0 58.33333%;
  936. flex: 0 0 58.33333%;
  937. max-width: 58.33333%;
  938. }
  939. .col-xl-8 {
  940. -webkit-box-flex: 0;
  941. -ms-flex: 0 0 66.66667%;
  942. flex: 0 0 66.66667%;
  943. max-width: 66.66667%;
  944. }
  945. .col-xl-9 {
  946. -webkit-box-flex: 0;
  947. -ms-flex: 0 0 75%;
  948. flex: 0 0 75%;
  949. max-width: 75%;
  950. }
  951. .col-xl-10 {
  952. -webkit-box-flex: 0;
  953. -ms-flex: 0 0 83.33333%;
  954. flex: 0 0 83.33333%;
  955. max-width: 83.33333%;
  956. }
  957. .col-xl-11 {
  958. -webkit-box-flex: 0;
  959. -ms-flex: 0 0 91.66667%;
  960. flex: 0 0 91.66667%;
  961. max-width: 91.66667%;
  962. }
  963. .col-xl-12 {
  964. -webkit-box-flex: 0;
  965. -ms-flex: 0 0 100%;
  966. flex: 0 0 100%;
  967. max-width: 100%;
  968. }
  969. }
  970. table {
  971. width: 100%;
  972. margin-bottom: 1rem;
  973. }
  974. table th,
  975. table td {
  976. padding: .3rem;
  977. vertical-align: top;
  978. }
  979. .form-row {
  980. display: -webkit-box;
  981. display: -ms-flexbox;
  982. display: flex;
  983. -ms-flex-wrap: wrap;
  984. flex-wrap: wrap;
  985. margin-right: -5px;
  986. margin-left: -5px;
  987. }
  988. @media all {
  989. table th,
  990. table td {
  991. border: 1px solid #343a40;
  992. }
  993. }
  994. table thead th {
  995. vertical-align: bottom;
  996. }
  997. .card {
  998. position: relative;
  999. display: -webkit-box;
  1000. display: -ms-flexbox;
  1001. display: flex;
  1002. -webkit-box-orient: vertical;
  1003. -webkit-box-direction: normal;
  1004. -ms-flex-direction: column;
  1005. flex-direction: column;
  1006. min-width: 0;
  1007. word-wrap: break-word;
  1008. background-color: #fff;
  1009. background-clip: border-box;
  1010. border: 1px solid rgba(0, 0, 0, 0.125);
  1011. }
  1012. @media all {
  1013. table thead th {
  1014. border-bottom: 2px solid #343a40;
  1015. }
  1016. }
  1017. .card-body {
  1018. -webkit-box-flex: 1;
  1019. -ms-flex: 1 1 auto;
  1020. flex: 1 1 auto;
  1021. padding: 1rem 1rem;
  1022. }
  1023. @media all {
  1024. table tbody + tbody {
  1025. border-top: 2px solid #343a40;
  1026. }
  1027. }
  1028. .form-row {
  1029. display: -webkit-box;
  1030. display: -ms-flexbox;
  1031. display: flex;
  1032. -ms-flex-wrap: wrap;
  1033. flex-wrap: wrap;
  1034. margin-right: -5px;
  1035. margin-left: -5px;
  1036. }
  1037. .form-row > .col,
  1038. .form-row > [class*="col-"] {
  1039. padding-right: 5px;
  1040. padding-left: 5px;
  1041. }
  1042. .btn {
  1043. display: inline-block;
  1044. font-weight: 400;
  1045. color: #212529;
  1046. text-align: center;
  1047. vertical-align: middle;
  1048. cursor: pointer;
  1049. -webkit-user-select: none;
  1050. -moz-user-select: none;
  1051. -ms-user-select: none;
  1052. user-select: none;
  1053. background: transparent;
  1054. border: 1px solid transparent;
  1055. padding: .375rem .75rem;
  1056. font-size: 1rem;
  1057. line-height: 1.5;
  1058. border-radius: .25rem;
  1059. }
  1060. .btn:hover {
  1061. color: #212529;
  1062. text-decoration: none;
  1063. }
  1064. .btn:focus,
  1065. .btn.focus {
  1066. outline: 0;
  1067. -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 132, 180, 0.25);
  1068. box-shadow: 0 0 0 0.2rem rgba(0, 132, 180, 0.25);
  1069. }
  1070. .btn.disabled,
  1071. .btn:disabled {
  1072. opacity: .65;
  1073. }
  1074. a.btn.disabled,
  1075. fieldset:disabled a.btn {
  1076. pointer-events: none;
  1077. }
  1078. .btn-light {
  1079. color: #212529;
  1080. border-color: #dee2e6;
  1081. background: #dee2e6;
  1082. }
  1083. .btn-light:hover {
  1084. color: #212529;
  1085. border-color: #c1c9d0;
  1086. background: #c8cfd6;
  1087. }
  1088. .btn-light:focus,
  1089. .btn-light.focus {
  1090. color: #212529;
  1091. border-color: #c1c9d0;
  1092. background: #c8cfd6;
  1093. -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 198, 202, 0.5);
  1094. box-shadow: 0 0 0 0.2rem rgba(194, 198, 202, 0.5);
  1095. }
  1096. .btn-light.disabled,
  1097. .btn-light:disabled {
  1098. color: #212529;
  1099. background: #dee2e6;
  1100. border-color: #dee2e6;
  1101. }
  1102. .btn-light:not(:disabled):not(.disabled):active,
  1103. .btn-light:not(:disabled):not(.disabled).active,
  1104. .show > .btn-light.dropdown-toggle {
  1105. color: #212529;
  1106. background: #c1c9d0;
  1107. border-color: #bac2cb;
  1108. }
  1109. .btn-light:not(:disabled):not(.disabled):active:focus,
  1110. .btn-light:not(:disabled):not(.disabled).active:focus,
  1111. .show > .btn-light.dropdown-toggle:focus {
  1112. -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 198, 202, 0.5);
  1113. box-shadow: 0 0 0 0.2rem rgba(194, 198, 202, 0.5);
  1114. }
  1115. .nav {
  1116. display: -webkit-box;
  1117. display: -ms-flexbox;
  1118. display: flex;
  1119. -ms-flex-wrap: wrap;
  1120. flex-wrap: wrap;
  1121. padding-left: 0;
  1122. margin-bottom: 0;
  1123. list-style: none;
  1124. }
  1125. .card {
  1126. position: relative;
  1127. display: -webkit-box;
  1128. display: -ms-flexbox;
  1129. display: flex;
  1130. -webkit-box-orient: vertical;
  1131. -webkit-box-direction: normal;
  1132. -ms-flex-direction: column;
  1133. flex-direction: column;
  1134. min-width: 0;
  1135. word-wrap: break-word;
  1136. background-color: #fff;
  1137. background-clip: border-box;
  1138. border: 1px solid rgba(0, 0, 0, 0.125);
  1139. }
  1140. .card > .list-group {
  1141. border-top: inherit;
  1142. border-bottom: inherit;
  1143. }
  1144. .card > .list-group:first-child {
  1145. border-top-width: 0;
  1146. border-top-left-radius: calc(0.25rem - 1px);
  1147. border-top-right-radius: calc(0.25rem - 1px);
  1148. }
  1149. .card > .list-group:last-child {
  1150. border-bottom-width: 0;
  1151. border-bottom-right-radius: calc(0.25rem - 1px);
  1152. border-bottom-left-radius: calc(0.25rem - 1px);
  1153. }
  1154. .card > .card-header + .list-group,
  1155. .card > .list-group + .card-footer {
  1156. border-top: 0;
  1157. }
  1158. .card-body {
  1159. -webkit-box-flex: 1;
  1160. -ms-flex: 1 1 auto;
  1161. flex: 1 1 auto;
  1162. padding: 1rem 1rem;
  1163. }
  1164. .card-title {
  1165. margin-top: 0.5rem;
  1166. margin-bottom: 0.5rem;
  1167. font-size: 1.3rem;
  1168. font-weight: 600;
  1169. }
  1170. .card-subtitle {
  1171. margin-top: -0.25rem;
  1172. margin-bottom: 0;
  1173. }
  1174. .card-text {
  1175. color: grey;
  1176. }
  1177. .card-text:last-child {
  1178. margin-bottom: 0;
  1179. }
  1180. .card-link:hover {
  1181. text-decoration: none;
  1182. }
  1183. .card-link + .card-link {
  1184. margin-left: 1rem;
  1185. }
  1186. .card-header {
  1187. padding: 0.5rem 1rem;
  1188. margin-bottom: 0;
  1189. background-color: rgba(0, 0, 0, 0.03);
  1190. border-bottom: 1px solid rgba(0, 0, 0, 0.125);
  1191. }
  1192. .card-footer {
  1193. padding: 0.5rem 1rem;
  1194. background-color: rgba(0, 0, 0, 0.03);
  1195. border-top: 1px solid rgba(0, 0, 0, 0.125);
  1196. }
  1197. .card-header-tabs {
  1198. margin-right: -0.5rem;
  1199. margin-bottom: -0.5rem;
  1200. margin-left: -0.5rem;
  1201. border-bottom: 0;
  1202. }
  1203. .card-header-pills {
  1204. margin-right: -0.5rem;
  1205. margin-left: -0.5rem;
  1206. }
  1207. .card-img-overlay {
  1208. position: absolute;
  1209. top: 0;
  1210. right: 0;
  1211. bottom: 0;
  1212. left: 0;
  1213. padding: 1rem;
  1214. }
  1215. .card-img,
  1216. .card-img-top,
  1217. .card-img-bottom {
  1218. width: 100%;
  1219. }
  1220. .pagination {
  1221. display: -webkit-box;
  1222. display: -ms-flexbox;
  1223. display: flex;
  1224. padding-left: 0;
  1225. list-style: none;
  1226. border-radius: .25rem;
  1227. }
  1228. .page-link {
  1229. position: relative;
  1230. display: block;
  1231. padding: .5rem .75rem;
  1232. margin-left: -1px;
  1233. line-height: 1.25;
  1234. }
  1235. @media all {
  1236. .page-link {
  1237. color: #f8f9fa;
  1238. background: #212529;
  1239. border: 1px solid #495057;
  1240. }
  1241. }
  1242. .page-link:hover {
  1243. z-index: 2;
  1244. text-decoration: none;
  1245. }
  1246. @media all {
  1247. .page-link:hover {
  1248. color: #cbd3da;
  1249. background: #343a40;
  1250. border-color: #495057;
  1251. }
  1252. }
  1253. .page-link:focus {
  1254. z-index: 3;
  1255. outline: 0;
  1256. -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 132, 180, 0.25);
  1257. box-shadow: 0 0 0 0.2rem rgba(0, 132, 180, 0.25);
  1258. }
  1259. .page-item:first-child .page-link {
  1260. margin-left: 0;
  1261. border-top-left-radius: .25rem;
  1262. border-bottom-left-radius: .25rem;
  1263. }
  1264. .page-item:last-child .page-link {
  1265. border-top-right-radius: .25rem;
  1266. border-bottom-right-radius: .25rem;
  1267. }
  1268. .page-item.active .page-link {
  1269. z-index: 3;
  1270. }
  1271. @media all {
  1272. .page-item.active .page-link {
  1273. color: #212529;
  1274. background: #0084b4;
  1275. border-color: #0084b4;
  1276. }
  1277. }
  1278. .page-item.disabled .page-link {
  1279. pointer-events: none;
  1280. cursor: auto;
  1281. }
  1282. @media all {
  1283. .page-item.disabled .page-link {
  1284. color: #ced4da;
  1285. background: #212529;
  1286. border-color: #495057;
  1287. }
  1288. }
  1289. header {
  1290. width: 100%;
  1291. z-index: 99999;
  1292. top: 0px;
  1293. }
  1294. @media all {
  1295. header.full-width {
  1296. background: #212529;
  1297. }
  1298. }
  1299. header.fixed {
  1300. position: fixed;
  1301. }
  1302. .mega-menu .header {
  1303. -webkit-box-flex: 0;
  1304. -ms-flex: 0 0 100%;
  1305. flex: 0 0 100%;
  1306. max-width: 100%;
  1307. -webkit-box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
  1308. box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
  1309. }
  1310. .clearfix::after {
  1311. display: block;
  1312. clear: both;
  1313. content: "";
  1314. }
  1315. .blog-content {
  1316. color: #808080;
  1317. }
  1318. .d-flex {
  1319. display: -webkit-box !important;
  1320. display: -ms-flexbox !important;
  1321. display: flex !important;
  1322. }
  1323. .d-inline-flex {
  1324. display: -webkit-inline-box !important;
  1325. display: -ms-inline-flexbox !important;
  1326. display: inline-flex !important;
  1327. }
  1328. .text-start {
  1329. text-align: left !important;
  1330. }
  1331. .text-end {
  1332. text-align: right !important;
  1333. }
  1334. .text-center {
  1335. text-align: center !important;
  1336. }
  1337. .post-title {
  1338. text-align: center;
  1339. }
  1340. .mt-1 {
  1341. margin-top: 0.25rem !important;
  1342. }
  1343. .mt-2 {
  1344. margin-top: 0.5rem !important;
  1345. }
  1346. .mt-3 {
  1347. margin-top: 1rem !important;
  1348. }
  1349. .mt-4 {
  1350. margin-top: 1.5rem !important;
  1351. }
  1352. .mt-5 {
  1353. margin-top: 3rem !important;
  1354. }
  1355. .mb-1 {
  1356. margin-bottom: 0.25rem !important;
  1357. }
  1358. .mb-2 {
  1359. margin-bottom: 0.5rem !important;
  1360. }
  1361. .mb-3 {
  1362. margin-bottom: 1rem !important;
  1363. }
  1364. .mb-4 {
  1365. margin-bottom: 1.5rem !important;
  1366. }
  1367. .mb-5 {
  1368. margin-bottom: 3rem !important;
  1369. }
  1370. .ms-auto {
  1371. margin-left: auto !important;
  1372. }
  1373. .ms-1 {
  1374. margin-left: 0.25rem !important;
  1375. }
  1376. .ms-2 {
  1377. margin-left: 0.5rem !important;
  1378. }
  1379. .ms-3 {
  1380. margin-left: 1rem !important;
  1381. }
  1382. .ms-4 {
  1383. margin-left: 1.5rem !important;
  1384. }
  1385. .ms-5 {
  1386. margin-left: 3rem !important;
  1387. }
  1388. .me-auto {
  1389. margin-right: auto !important;
  1390. }
  1391. .me-1 {
  1392. margin-right: 0.25rem !important;
  1393. }
  1394. .me-2 {
  1395. margin-right: 0.5rem !important;
  1396. }
  1397. .me-3 {
  1398. margin-right: 1rem !important;
  1399. }
  1400. .me-4 {
  1401. margin-right: 1.5rem !important;
  1402. }
  1403. .me-5 {
  1404. margin-right: 3rem !important;
  1405. }
  1406. .mx-2 {
  1407. margin-right: 0.5rem !important;
  1408. margin-left: 0.5rem !important;
  1409. }
  1410. .p-1 {
  1411. padding: 0.25rem !important;
  1412. }
  1413. .p-2 {
  1414. padding: 0.5rem !important;
  1415. }
  1416. .p-3 {
  1417. padding: 1rem !important;
  1418. }
  1419. .p-4 {
  1420. padding: 1.5rem !important;
  1421. }
  1422. .p-5 {
  1423. padding: 3rem !important;
  1424. }
  1425. .mx-auto {
  1426. margin-right: auto !important;
  1427. margin-left: auto !important;
  1428. }
  1429. .row {
  1430. --bs-gutter-x: 1.5rem;
  1431. --bs-gutter-y: 1rem;
  1432. display: -webkit-box;
  1433. display: -ms-flexbox;
  1434. display: flex;
  1435. -ms-flex-wrap: wrap;
  1436. flex-wrap: wrap;
  1437. margin-top: calc(var(--bs-gutter-y) * -1);
  1438. margin-right: calc(var(--bs-gutter-x) / -2);
  1439. margin-left: calc(var(--bs-gutter-x) / -2);
  1440. }
  1441. .row > * {
  1442. -ms-flex-negative: 0;
  1443. flex-shrink: 0;
  1444. width: 100%;
  1445. max-width: 100%;
  1446. padding-right: calc(var(--bs-gutter-x) / 2);
  1447. padding-left: calc(var(--bs-gutter-x) / 2);
  1448. margin-top: var(--bs-gutter-y);
  1449. }
  1450. .col {
  1451. -webkit-box-flex: 100%;
  1452. -ms-flex: 100%;
  1453. flex: 100%;
  1454. }
  1455. .w-50 {
  1456. width: 50% !important;
  1457. }
  1458. .h-100 {
  1459. height: 100% !important;
  1460. }
  1461. .row-cols-auto > * {
  1462. -webkit-box-flex: 0;
  1463. -ms-flex: 0 0 auto;
  1464. flex: 0 0 auto;
  1465. width: auto;
  1466. }
  1467. .row-cols-1 > * {
  1468. -webkit-box-flex: 0;
  1469. -ms-flex: 0 0 auto;
  1470. flex: 0 0 auto;
  1471. width: 100%;
  1472. }
  1473. .row-cols-2 > * {
  1474. -webkit-box-flex: 0;
  1475. -ms-flex: 0 0 auto;
  1476. flex: 0 0 auto;
  1477. width: 50%;
  1478. }
  1479. .row-cols-3 > * {
  1480. -webkit-box-flex: 0;
  1481. -ms-flex: 0 0 auto;
  1482. flex: 0 0 auto;
  1483. width: 33.3333333333%;
  1484. }
  1485. .row-cols-4 > * {
  1486. -webkit-box-flex: 0;
  1487. -ms-flex: 0 0 auto;
  1488. flex: 0 0 auto;
  1489. width: 25%;
  1490. }
  1491. .row-cols-5 > * {
  1492. -webkit-box-flex: 0;
  1493. -ms-flex: 0 0 auto;
  1494. flex: 0 0 auto;
  1495. width: 20%;
  1496. }
  1497. .row-cols-6 > * {
  1498. -webkit-box-flex: 0;
  1499. -ms-flex: 0 0 auto;
  1500. flex: 0 0 auto;
  1501. width: 16.6666666667%;
  1502. }
  1503. @media (min-width: 576px) {
  1504. .col-sm {
  1505. -webkit-box-flex: 1;
  1506. -ms-flex: 1 0 0%;
  1507. flex: 1 0 0%;
  1508. }
  1509. .row-cols-sm-auto > * {
  1510. -webkit-box-flex: 0;
  1511. -ms-flex: 0 0 auto;
  1512. flex: 0 0 auto;
  1513. width: auto;
  1514. }
  1515. .row-cols-sm-1 > * {
  1516. -webkit-box-flex: 0;
  1517. -ms-flex: 0 0 auto;
  1518. flex: 0 0 auto;
  1519. width: 100%;
  1520. }
  1521. .row-cols-sm-2 > * {
  1522. -webkit-box-flex: 0;
  1523. -ms-flex: 0 0 auto;
  1524. flex: 0 0 auto;
  1525. width: 50%;
  1526. }
  1527. .row-cols-sm-3 > * {
  1528. -webkit-box-flex: 0;
  1529. -ms-flex: 0 0 auto;
  1530. flex: 0 0 auto;
  1531. width: 33.3333333333%;
  1532. }
  1533. .row-cols-sm-4 > * {
  1534. -webkit-box-flex: 0;
  1535. -ms-flex: 0 0 auto;
  1536. flex: 0 0 auto;
  1537. width: 25%;
  1538. }
  1539. .row-cols-sm-5 > * {
  1540. -webkit-box-flex: 0;
  1541. -ms-flex: 0 0 auto;
  1542. flex: 0 0 auto;
  1543. width: 20%;
  1544. }
  1545. .row-cols-sm-6 > * {
  1546. -webkit-box-flex: 0;
  1547. -ms-flex: 0 0 auto;
  1548. flex: 0 0 auto;
  1549. width: 16.6666666667%;
  1550. }
  1551. .p-sm-1 {
  1552. padding: 0.25rem !important;
  1553. }
  1554. .p-sm-2 {
  1555. padding: 0.5rem !important;
  1556. }
  1557. .p-sm-3 {
  1558. padding: 1rem !important;
  1559. }
  1560. .p-sm-4 {
  1561. padding: 1.5rem !important;
  1562. }
  1563. .p-sm-5 {
  1564. padding: 3rem !important;
  1565. }
  1566. }
  1567. @media (min-width: 992px) {
  1568. .col-lg {
  1569. -webkit-box-flex: 100%;
  1570. -ms-flex: 100%;
  1571. flex: 100%;
  1572. }
  1573. .row-cols-lg-auto > * {
  1574. -webkit-box-flex: 0;
  1575. -ms-flex: 0 0 auto;
  1576. flex: 0 0 auto;
  1577. width: auto;
  1578. }
  1579. .row-cols-lg-1 > * {
  1580. -webkit-box-flex: 0;
  1581. -ms-flex: 0 0 auto;
  1582. flex: 0 0 auto;
  1583. width: 100%;
  1584. }
  1585. .row-cols-lg-2 > * {
  1586. -webkit-box-flex: 0;
  1587. -ms-flex: 0 0 auto;
  1588. flex: 0 0 auto;
  1589. width: 50%;
  1590. }
  1591. .row-cols-lg-3 > * {
  1592. -webkit-box-flex: 0;
  1593. -ms-flex: 0 0 auto;
  1594. flex: 0 0 auto;
  1595. width: 33.3333333333%;
  1596. }
  1597. .row-cols-lg-4 > * {
  1598. -webkit-box-flex: 0;
  1599. -ms-flex: 0 0 auto;
  1600. flex: 0 0 auto;
  1601. width: 25%;
  1602. }
  1603. .row-cols-lg-5 > * {
  1604. -webkit-box-flex: 0;
  1605. -ms-flex: 0 0 auto;
  1606. flex: 0 0 auto;
  1607. width: 20%;
  1608. }
  1609. .row-cols-lg-6 > * {
  1610. -webkit-box-flex: 0;
  1611. -ms-flex: 0 0 auto;
  1612. flex: 0 0 auto;
  1613. width: 16.6666666667%;
  1614. }
  1615. }
  1616. @media (min-width: 1400px) {
  1617. .col-xxl {
  1618. -webkit-box-flex: 1;
  1619. -ms-flex: 1 0 0%;
  1620. flex: 1 0 0%;
  1621. }
  1622. .row-cols-xxl-auto > * {
  1623. -webkit-box-flex: 0;
  1624. -ms-flex: 0 0 auto;
  1625. flex: 0 0 auto;
  1626. width: auto;
  1627. }
  1628. .row-cols-xxl-1 > * {
  1629. -webkit-box-flex: 0;
  1630. -ms-flex: 0 0 auto;
  1631. flex: 0 0 auto;
  1632. width: 100%;
  1633. }
  1634. .row-cols-xxl-2 > * {
  1635. -webkit-box-flex: 0;
  1636. -ms-flex: 0 0 auto;
  1637. flex: 0 0 auto;
  1638. width: 50%;
  1639. }
  1640. .row-cols-xxl-3 > * {
  1641. -webkit-box-flex: 0;
  1642. -ms-flex: 0 0 auto;
  1643. flex: 0 0 auto;
  1644. width: 33.3333333333%;
  1645. }
  1646. .row-cols-xxl-4 > * {
  1647. -webkit-box-flex: 0;
  1648. -ms-flex: 0 0 auto;
  1649. flex: 0 0 auto;
  1650. width: 25%;
  1651. }
  1652. .row-cols-xxl-5 > * {
  1653. -webkit-box-flex: 0;
  1654. -ms-flex: 0 0 auto;
  1655. flex: 0 0 auto;
  1656. width: 20%;
  1657. }
  1658. .row-cols-xxl-6 > * {
  1659. -webkit-box-flex: 0;
  1660. -ms-flex: 0 0 auto;
  1661. flex: 0 0 auto;
  1662. width: 16.6666666667%;
  1663. }
  1664. }
  1665. .toggle,
  1666. [id^=drop] {
  1667. display: none;
  1668. }
  1669. /* Giving a background-color to the nav container. */
  1670. nav {
  1671. margin: 0;
  1672. padding: 0;
  1673. background-color: #FFFFFF;
  1674. /* Since we'll have the "ul li" "float:left"
  1675. * we need to add a clear after the container. */
  1676. /* Removing padding, margin and "list-style" from the "ul",
  1677. * and adding "position:reltive" */
  1678. /* Styling the links */
  1679. }
  1680. nav:after {
  1681. content: "";
  1682. display: table;
  1683. clear: both;
  1684. }
  1685. nav ul {
  1686. float: right;
  1687. padding: 0;
  1688. margin: 0;
  1689. list-style: none;
  1690. position: relative;
  1691. /* Hide Dropdowns by Default
  1692. * and giving it a position of absolute */
  1693. }
  1694. nav ul li {
  1695. margin: 0px;
  1696. float: left;
  1697. background-color: #FFFFFF;
  1698. /* Display Dropdowns on Hover */
  1699. }
  1700. nav ul li:hover > ul {
  1701. display: inherit;
  1702. }
  1703. nav ul ul {
  1704. display: none;
  1705. position: absolute;
  1706. /* has to be the same number as the "line-height" of "nav a" */
  1707. /* top: 60px; */
  1708. top: 50px;
  1709. /* Fisrt Tier Dropdown */
  1710. /* Second, Third and more Tiers
  1711. * We move the 2nd and 3rd etc tier dropdowns to the left
  1712. * by the amount of the width of the first tier.
  1713. */
  1714. }
  1715. nav ul ul li {
  1716. width: 170px;
  1717. float: none;
  1718. display: list-item;
  1719. position: relative;
  1720. }
  1721. nav ul ul ul li {
  1722. position: relative;
  1723. top: -60px;
  1724. /* has to be the same number as the "width" of "nav ul ul li" */
  1725. left: 170px;
  1726. }
  1727. nav a {
  1728. display: block;
  1729. padding: 14px 20px;
  1730. color: #656565;
  1731. font-size: 12pt;
  1732. font-weight: 400;
  1733. text-decoration: none;
  1734. }
  1735. nav a:hover {
  1736. background-color: #78AD42;
  1737. color: #fff;
  1738. text-decoration: none;
  1739. }
  1740. /* Change ' +' in order to change the Dropdown symbol */
  1741. li > a:after {
  1742. content: ' +';
  1743. }
  1744. li > a:only-child:after {
  1745. content: '';
  1746. }
  1747. /* Media Queries
  1748. --------------------------------------------- */
  1749. @media all and (max-width: 768px) {
  1750. nav {
  1751. margin: 0;
  1752. }
  1753. /* Hide the navigation menu by default */
  1754. /* Also hide the */
  1755. .toggle + a,
  1756. .menu {
  1757. display: none;
  1758. }
  1759. /* Stylinf the toggle lable */
  1760. .toggle {
  1761. display: block;
  1762. /* background-color: #FFFFFF; */
  1763. padding: 14px 20px;
  1764. color: #656565;
  1765. font-size: 17px;
  1766. text-decoration: none;
  1767. border: none;
  1768. }
  1769. .toggle:hover {
  1770. /* background-color: #000000; */
  1771. color: #78AD42;
  1772. }
  1773. /* Display Dropdown when clicked on Parent Lable */
  1774. [id^=drop]:checked + ul {
  1775. display: block;
  1776. }
  1777. /* Change menu item's width to 100% */
  1778. nav ul li {
  1779. display: block;
  1780. width: 100%;
  1781. font-weight: 600;
  1782. }
  1783. nav a:hover,
  1784. nav ul ul ul a {
  1785. background-color: #78AD42;
  1786. }
  1787. nav ul li ul li .toggle,
  1788. nav ul ul a {
  1789. background-color: #212121;
  1790. }
  1791. nav ul li ul li .toggle,
  1792. nav ul ul a,
  1793. nav ul ul ul a {
  1794. padding: 14px 20px;
  1795. color: #FFF;
  1796. font-size: 17px;
  1797. }
  1798. /* Hide Dropdowns by Default */
  1799. nav ul ul {
  1800. float: none;
  1801. position: static;
  1802. color: #ffffff;
  1803. /* has to be the same number as the "line-height" of "nav a" */
  1804. }
  1805. /* Hide menus on hover */
  1806. nav ul ul li:hover > ul,
  1807. nav ul li:hover > ul {
  1808. display: none;
  1809. }
  1810. /* Fisrt Tier Dropdown */
  1811. nav ul ul li {
  1812. display: block;
  1813. width: 100%;
  1814. }
  1815. nav ul ul ul li {
  1816. position: static;
  1817. /* has to be the same number as the "width" of "nav ul ul li" */
  1818. }
  1819. }
  1820. @media all and (max-width: 330px) {
  1821. nav ul li {
  1822. display: block;
  1823. width: 94%;
  1824. }
  1825. }
  1826. .widget {
  1827. margin-bottom: 30px;
  1828. padding-bottom: 35px;
  1829. }
  1830. .widget-title {
  1831. margin-bottom: 15px;
  1832. padding-bottom: 10px;
  1833. font-size: 16px;
  1834. color: #333;
  1835. font-weight: 500;
  1836. border-bottom: 1px solid #dedede;
  1837. }
  1838. .widget.widget-latest-post .media .media-object {
  1839. width: 100px;
  1840. height: auto;
  1841. }
  1842. .widget.widget-latest-post .media .media-heading a {
  1843. color: #000;
  1844. font-size: 16px;
  1845. }
  1846. .widget.widget-latest-post .media p {
  1847. font-size: 12px;
  1848. color: #808080;
  1849. }
  1850. .widget.widget-category ul li {
  1851. margin-bottom: 10px;
  1852. }
  1853. .widget.widget-category ul li a {
  1854. color: #837f7e;
  1855. -webkit-transition: all 0.3s ease;
  1856. transition: all 0.3s ease;
  1857. }
  1858. .widget.widget-category ul li a:before {
  1859. padding-right: 10px;
  1860. }
  1861. .widget.widget-category ul li a:hover {
  1862. color: #655E7A;
  1863. padding-left: 5px;
  1864. }
  1865. .widget.widget-tag ul li {
  1866. margin-bottom: 10px;
  1867. display: inline-block;
  1868. margin-right: 5px;
  1869. }
  1870. .widget.widget-tag ul li a {
  1871. color: #837f7e;
  1872. display: inline-block;
  1873. padding: 8px 15px;
  1874. border: 1px solid #dedede;
  1875. border-radius: 30px;
  1876. font-size: 14px;
  1877. -webkit-transition: all 0.3s ease;
  1878. transition: all 0.3s ease;
  1879. }
  1880. .widget.widget-tag ul li a:hover {
  1881. color: #fff;
  1882. background: #655E7A;
  1883. border: 1px solid #655E7A;
  1884. }
  1885. .list-group {
  1886. display: -webkit-box;
  1887. display: -ms-flexbox;
  1888. display: flex;
  1889. -webkit-box-orient: vertical;
  1890. -webkit-box-direction: normal;
  1891. -ms-flex-direction: column;
  1892. flex-direction: column;
  1893. padding-left: 0;
  1894. margin-bottom: 0;
  1895. border-radius: 0.25rem;
  1896. }
  1897. .list-group-item {
  1898. position: relative;
  1899. display: block;
  1900. padding: 0.5rem 1rem;
  1901. text-decoration: none;
  1902. background-color: #fff;
  1903. border: 1px solid rgba(0, 0, 0, 0.125);
  1904. }
  1905. .list-group-item.active {
  1906. z-index: 2;
  1907. color: #fff;
  1908. background-color: #78AD42;
  1909. border-color: #78AD42;
  1910. }
  1911. .d-none {
  1912. display: none !important;
  1913. }
  1914. .d-block {
  1915. display: block !important;
  1916. }
  1917. @media (min-width: 576px) {
  1918. .d-sm-block {
  1919. display: block !important;
  1920. }
  1921. }
  1922. @media (min-width: 768px) {
  1923. .d-md-block {
  1924. display: block !important;
  1925. }
  1926. .d-md-none {
  1927. display: none !important;
  1928. }
  1929. }
  1930. @media (min-width: 992px) {
  1931. .d-lg-none {
  1932. display: none !important;
  1933. }
  1934. }
  1935. input[type="radio"][class="style"]:checked + label {
  1936. color: white;
  1937. background: #6666ff;
  1938. }
  1939. .align-items-center {
  1940. -webkit-box-align: center !important;
  1941. -ms-flex-align: center !important;
  1942. align-items: center !important;
  1943. }
  1944. .order-1 {
  1945. -webkit-box-ordinal-group: 2 !important;
  1946. -ms-flex-order: 1 !important;
  1947. order: 1 !important;
  1948. }
  1949. .order-2 {
  1950. -webkit-box-ordinal-group: 3 !important;
  1951. -ms-flex-order: 2 !important;
  1952. order: 2 !important;
  1953. }
  1954. .title {
  1955. font-size: 1.3rem;
  1956. }
  1957. .footer {
  1958. color: #656565;
  1959. }
  1960. .footer a {
  1961. color: #656565;
  1962. text-decoration: none;
  1963. }
  1964. .footer a:hover {
  1965. color: #78AD42;
  1966. }
  1967. .footer h5 {
  1968. color: black;
  1969. font-weight: 600;
  1970. padding-bottom: 15px;
  1971. }
  1972. .footer .link {
  1973. padding-bottom: 20px;
  1974. }
  1975. @media (min-width: 992px) {
  1976. .order-lg-1 {
  1977. -webkit-box-ordinal-group: 2 !important;
  1978. -ms-flex-order: 1 !important;
  1979. order: 1 !important;
  1980. }
  1981. .order-lg-2 {
  1982. -webkit-box-ordinal-group: 3 !important;
  1983. -ms-flex-order: 2 !important;
  1984. order: 2 !important;
  1985. }
  1986. }
  1987. /* Airspace Template SCSS */
  1988. .w-25 {
  1989. width: 25% !important;
  1990. }
  1991. .w-50 {
  1992. width: 50% !important;
  1993. }
  1994. .w-75 {
  1995. width: 75% !important;
  1996. }
  1997. .w-100 {
  1998. width: 100% !important;
  1999. }
  2000. .blank {
  2001. height: 130px;
  2002. width: 100%;
  2003. background-color: white;
  2004. }
  2005. .hero__imgfr {
  2006. margin: 0 9rem;
  2007. -webkit-transform: translateY(-90px);
  2008. transform: translateY(-90px);
  2009. position: relative;
  2010. }
  2011. .hero__stamp {
  2012. position: absolute;
  2013. left: -6rem;
  2014. bottom: -4rem;
  2015. width: 150px;
  2016. }
  2017. @media (max-width: 992px) {
  2018. .hero__stamp {
  2019. width: 120px;
  2020. }
  2021. }
  2022. @media (max-width: 576px) {
  2023. .hero__stamp {
  2024. transform: translateX(-50%);
  2025. left: 50%;
  2026. bottom: -3rem;
  2027. }
  2028. }
  2029. .hero__underline {
  2030. width: 50%;
  2031. height: 6px;
  2032. background-color: transparent;
  2033. border: none;
  2034. border-top: 2px solid black;
  2035. border-bottom: 2px solid black;
  2036. margin: 2.5rem auto;
  2037. }
  2038. .hero__h2 {
  2039. margin: 0 12rem;
  2040. font-size: 3rem;
  2041. color: black;
  2042. margin-top: -2rem;
  2043. }
  2044. .hero__p {
  2045. color: black;
  2046. margin: 0 12rem;
  2047. }
  2048. .text-dark {
  2049. color: black;
  2050. }
  2051. .footer {
  2052. background-color: #F0F0F0;
  2053. padding: 3rem;
  2054. }
  2055. .footer .row {
  2056. display: -webkit-box;
  2057. display: -ms-flexbox;
  2058. display: flex;
  2059. -webkit-box-align: center;
  2060. -ms-flex-align: center;
  2061. align-items: center;
  2062. }
  2063. .footer .footer-aigirl {
  2064. font-weight: 600;
  2065. font-size: 2rem;
  2066. margin-top: 1rem;
  2067. margin-bottom: 2.5rem;
  2068. }
  2069. .footer .footer-follow {
  2070. font-size: 1.6rem;
  2071. margin-bottom: 1rem;
  2072. }
  2073. .footer .footer-socials a {
  2074. margin-right: 5px;
  2075. }
  2076. @media (max-width: 992px) {
  2077. .hero__imgfr {
  2078. margin: 0 3rem;
  2079. }
  2080. }
  2081. @media (max-width: 576px) {
  2082. .hero__imgfr {
  2083. margin: 0 0rem;
  2084. }
  2085. }
  2086. @media (max-width: 992px) {
  2087. .hero__h2 {
  2088. margin: 0rem;
  2089. }
  2090. }
  2091. @media (max-width: 992px) {
  2092. .hero__p {
  2093. margin: 0rem;
  2094. }
  2095. }
  2096. .logos__img {
  2097. width: 100%;
  2098. height: 12rem;
  2099. background-size: contain;
  2100. background-repeat: no-repeat;
  2101. background-position: center;
  2102. }
  2103. .cards .card {
  2104. height: 75vh;
  2105. max-height: 80vh;
  2106. }
  2107. @media (max-width: 576px) {
  2108. .cards .card {
  2109. height: 80vh;
  2110. max-height: 85vh;
  2111. }
  2112. }
  2113. </style>
  2114. <script async src="https://cdn.ampproject.org/v0.js"></script>
  2115. <script async custom-element="amp-mega-menu" src="https://cdn.ampproject.org/v0/amp-mega-menu-0.1.js"></script>
  2116. <script src="base.js"></script>
  2117. <style amp-boilerplate>
  2118. body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;
  2119. -moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;
  2120. -ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;
  2121. animation:-amp-start 8s steps(1,end) 0s 1 normal both}
  2122. @-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
  2123. @-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
  2124. @-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
  2125. @-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
  2126. @keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
  2127. </style><noscript>
  2128. <style amp-boilerplate>
  2129. body{-webkit-animation:none;
  2130. -moz-animation:none;-ms-animation:none;
  2131. animation:none}</style></noscript>
  2132. </head>
  2133. <body>
  2134. <amp-mega-menu height="65" layout="fixed-height">
  2135. <nav class="d-flex align-items-center">
  2136. <span>
  2137. <a href="/" >
  2138. <img src="./Choozmo cloud logo.png" alt="" width="160">
  2139. </a>
  2140. </span>
  2141. <!-- <ul class="ms-auto">
  2142. <li>
  2143. <a href="https://amp.dev/">Link</a>
  2144. </li>
  2145. <li>
  2146. <a href="https://amp.dev/">Link</a>
  2147. </li>
  2148. </ul> -->
  2149. </nav>
  2150. </amp-mega-menu>
  2151. <main>
  2152. <div class="blank">
  2153. </div>
  2154. <section class="hero pb-5" style="background-color: #f1f5f9;padding-bottom: 3rem;">
  2155. <div class="container">
  2156. <div class="hero__imgfr" >
  2157. <amp-img src="./hero-img.jpg"
  2158. width="266"
  2159. height="150"
  2160. layout="responsive"
  2161. alt="mountains">
  2162. </amp-img>
  2163. <img src="https://images01.nicepage.com/17/7a/177a0cd3cf8239fd77d0994fde9f6248.png" alt="" class="hero__stamp">
  2164. </div>
  2165. <h2 class="text-center hero__h2">改變世界不難,Choozmo 與您一起立刻行動</h2>
  2166. <p class="hero__p text-center">It doesn’t take tons of time or scary talent to be successful. You’ve already got what it takes.
  2167. Now, you need to tap it. Let’s go!</p>
  2168. <div class="hero__underline">
  2169. </div>
  2170. </div>
  2171. </section>
  2172. <section class="logos" style="background-color: white;padding: 2rem 0;">
  2173. <div class="container">
  2174. <h2 style="margin-top: 0rem;color: black;" class="text-center">基金會夥伴</h2>
  2175. <div class="row justify-content-center" style="margin: auto auto;">
  2176. <div class="col-11" style="margin: 0 auto;">
  2177. <div class="row">
  2178. <div class="col-1 d-none d-md-block"></div>
  2179. <div class="col-6 col-md-2 logos__img" style="background-image: url(./tzuchi.png);"></div>
  2180. <div class="col-6 col-md-2 logos__img" style="background-image: url(./guide_dog.png);"></div>
  2181. <div class="col-6 col-md-2 logos__img" style="background-image: url(./women_rescue.png);"></div>
  2182. <div class="col-6 col-md-2 logos__img" style="background-image: url(./zhishan.png);"></div>
  2183. <div class="col-6 col-md-2 logos__img" style="background-image: url(./garden_hope.gif);"></div>
  2184. <div class="col-1 d-none d-md-block"></div>
  2185. </div>
  2186. </div>
  2187. </div>
  2188. </div>
  2189. </section>
  2190. <section class="cards" style="padding: 4rem 0;background-color: #cad7e6;">
  2191. <div class="container">
  2192. <div class="row">
  2193. <div class="col-12 col-md-6 col-lg-4">
  2194. <div class="card text-dark mb-4" style="border: none;">
  2195. <amp-img src="./hero-img.jpg"
  2196. width="266"
  2197. height="150"
  2198. layout="responsive"
  2199. alt="mountains"
  2200. class="card-img-top">
  2201. </amp-img>
  2202. <div class="card-body">
  2203. <h5 class="card-title">慈濟基金會</h5>
  2204. <p class="card-text">慈濟慈善工作從弱勢家庭濟助到心靈關懷,包含長期扶困、急難救助、居家關懷及海外慈善;近年來也著
  2205. 重於結合社區力量,增益社區善的機能。慈濟重視的不只是救濟、援助的成效,更在乎啟發人性善的良能。</p>
  2206. <p class="card-text">
  2207. <a href="https://www.tzuchi.org.tw" target="_blank" class="d-flex align-items-center">
  2208. <small class="text-muted me-1">深入瞭解慈濟</small><i class="fas fa-angle-double-right"></i>
  2209. </a>
  2210. </p>
  2211. <a href="https://www.tzuchi.org.tw/%E6%8D%90%E6%AC%BE" class="btn btn-light" target="_blank">捐款去</a>
  2212. </div>
  2213. </div>
  2214. </div>
  2215. <div class="col-12 col-md-6 col-lg-4">
  2216. <div class="card text-dark mb-4" style="border: none;">
  2217. <amp-img src="./hero-img.jpg"
  2218. width="266"
  2219. height="150"
  2220. layout="responsive"
  2221. alt="mountains"
  2222. class="card-img-top">
  2223. </amp-img>
  2224. <div class="card-body">
  2225. <h5 class="card-title">台灣導盲犬協會</h5>
  2226. <p class="card-text">協會主要目標是建立並推動導盲犬制度,讓台灣的視障者除了使用白手杖外,也有使用導盲犬的權利。</p>
  2227. <p class="card-text">
  2228. <a href="http://www.guidedog.org.tw" target="_blank" class="d-flex align-items-center">
  2229. <small class="text-muted me-1">深入瞭解導盲犬協會</small><i class="fas fa-angle-double-right"></i>
  2230. </a>
  2231. </p>
  2232. <a href="http://www.guidedog.org.tw/donation/donation-1.html" class="btn btn-light" target="_blank">捐款去</a>
  2233. </div>
  2234. </div>
  2235. </div>
  2236. <div class="col-12 col-md-6 col-lg-4">
  2237. <div class="card text-dark mb-4" style="border: none;">
  2238. <amp-img src="./hero-img.jpg"
  2239. width="266"
  2240. height="150"
  2241. layout="responsive"
  2242. alt="mountains"
  2243. class="card-img-top">
  2244. </amp-img>
  2245. <div class="card-body">
  2246. <h5 class="card-title">婦女救援協會</h5>
  2247. <p class="card-text">婦女救援基金會基於尊重生命價值及追求社會正義,致力於關心受到性別暴力壓迫及被忽略的弱勢婦幼,
  2248. 以倡議推動社會改革,以服務充權弱勢婦幼,讓其得以自立及自主,提升婦幼人權。</p>
  2249. <p class="card-text">
  2250. <a href="https://www.twrf.org.tw" target="_blank" class="d-flex align-items-center">
  2251. <small class="text-muted me-1">深入瞭解婦女救援協會</small><i class="fas fa-angle-double-right"></i>
  2252. </a>
  2253. </p>
  2254. <a href="https://www.twrf.org.tw/info/category/25" class="btn btn-light" target="_blank">捐款去</a>
  2255. </div>
  2256. </div>
  2257. </div>
  2258. <div class="col-12 col-md-6 col-lg-4">
  2259. <div class="card text-dark mb-4" style="border: none;">
  2260. <amp-img src="./hero-img.jpg"
  2261. width="266"
  2262. height="150"
  2263. layout="responsive"
  2264. alt="mountains"
  2265. class="card-img-top">
  2266. </amp-img>
  2267. <div class="card-body">
  2268. <h5 class="card-title">至善社會福利基金會</h5>
  2269. <p class="card-text">至善是立足台灣的亞洲兒少發展最佳夥伴,服務地區包括台灣、越南、雲南,以及緬甸等亞洲四地,每一年約幫助
  2270. 90,000 名孩子吃飽、上學,獲得照顧,讓他們成長之路不孤單。</p>
  2271. <p class="card-text">
  2272. <a href="https://www.zhi-shan.org" target="_blank" class="d-flex align-items-center">
  2273. <small class="text-muted me-1">深入瞭解至善基金會</small><i class="fas fa-angle-double-right"></i>
  2274. </a>
  2275. </p>
  2276. <a href="https://www.zhi-shan.org/donate?gclid=Cj0KCQiA2sqOBhCGARIsAPuPK0gGNFU0NutrGGL0hI8WDWeo60Te3T-jZAQ7Tc1pz_CEY8L7UXaSockaAsdmEALw_wcB"
  2277. class="btn btn-light" target="_blank">捐款去</a>
  2278. </div>
  2279. </div>
  2280. </div>
  2281. <div class="col-12 col-md-6 col-lg-4">
  2282. <div class="card text-dark mb-4" style="border: none;">
  2283. <amp-img src="./hero-img.jpg"
  2284. width="266"
  2285. height="150"
  2286. layout="responsive"
  2287. alt="mountains"
  2288. class="card-img-top">
  2289. </amp-img>
  2290. <div class="card-body">
  2291. <h5 class="card-title">勵馨基金會</h5>
  2292. <p class="card-text">勵馨本著基督精神,以追求公義與愛的決心和勇氣,預防及消弭性侵害、性剥削及家庭暴力對婦女與兒少的傷害
  2293. ,並致力於社會改造,創造對婦女及兒少的友善環境。</p>
  2294. <p class="card-text">
  2295. <a href="https://www.goh.org.tw" target="_blank" class="d-flex align-items-center">
  2296. <small class="text-muted me-1">深入瞭解勵馨基金會</small><i class="fas fa-angle-double-right"></i>
  2297. </a>
  2298. </p>
  2299. <a href="https://www.goh.org.tw/mobile/donation.asp" class="btn btn-light" target="_blank">捐款去</a>
  2300. </div>
  2301. </div>
  2302. </div>
  2303. </div>
  2304. </div>
  2305. </section>
  2306. <footer class="footer">
  2307. <div class="container">
  2308. <div class="row">
  2309. <div class="col-xs-12 col-sm-6">
  2310. <img src="https://i.imgur.com/P1gNopa.png" alt="" width="250">
  2311. <div class="footer-aigirl">Choozmo AI Spokesgirl</div>
  2312. <div class="footer-follow">關注我們</div>
  2313. <div class="footer-socials">
  2314. <a href="https://www.linkedin.com/company/choozmo/"><img src="https://i.imgur.com/qnd9QrT.png" alt="" width="32px" height="32px"></a>
  2315. <a href="https://www.facebook.com/choozmo/"><img src="https://i.imgur.com/WdCAhSo.png" alt="" width="48px" height="48px"></a>
  2316. <a href="https://line.me/R/ti/p/@choozmo?from=page"><img src="https://i.imgur.com/dNZ2aGW.png" alt="" width="32px" height="32px"></a>
  2317. <a href="https://www.youtube.com/channel/UC2Qda9PhJWuiMTCZ-j7K_hg"><img src="https://i.imgur.com/zn6DUY8.png" alt="" width="32px" height="32px"></a>
  2318. <a href="https://www.instagram.com/choozmo_cmm/"><img src="https://i.imgur.com/pdJPY7m.png" alt="" width="48px" height="48px"></a>
  2319. <a href="https://twitter.com/ai_cmm"><img src="https://i.imgur.com/qGBzq4J.png" alt="" width="32px" height="32px"></a>
  2320. </div>
  2321. </div>
  2322. <div class="col-xs-12 col-sm-6">
  2323. <div class="footer-contacts">
  2324. <h5>CONTACT</h5>
  2325. <div>
  2326. 集仕多股份有限公司<br>新竹縣竹北市復興二路229號9樓之9<br>聯絡電話:036670804<br>聯絡信箱:SERVICE@CHOOZMO.COM
  2327. </div>
  2328. </div>
  2329. </div>
  2330. </div>
  2331. </div>
  2332. </footer>
  2333. </main>
  2334. </body>
  2335. </html>