{"id":43,"date":"2024-07-24T14:21:25","date_gmt":"2024-07-24T14:21:25","guid":{"rendered":"http:\/\/aw-innovations.matrixdev.net\/cahiim\/?page_id=43"},"modified":"2024-09-11T16:21:04","modified_gmt":"2024-09-11T21:21:04","slug":"style-guide","status":"publish","type":"page","link":"https:\/\/aw-innovations.matrixdev.net\/cahiim\/style-guide\/","title":{"rendered":"Style Guide"},"content":{"rendered":"\n

The purpose of this HTML is to help determine what default settings are with CSS and to make sure that all possible HTML Elements are included in this HTML so as to not miss any possible Elements when designing a site.<\/p>\n\n\n\n

\n\n\n\n

Theme Colors<\/h2>\n\n\n\n
\n
\n
#5c2a47<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#B8A3AF<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#014d41<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#89AEA7<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#ffa300<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#161616<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#eeeded<\/code><\/pre>\n<\/div>\n\n\n\n
\n
#f7f7f7<\/code><\/pre>\n<\/div>\n<\/div>\n\n\n\n
\n    H1: Open Sans
The quick brown fox jumps over the lazy dog\n<\/h1>\n\n\n\n
\n    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sapien\n    lacus, maximus vel augue vitae, consectetur hendrerit augue. Class aptent\n    taciti sociosqu ad litora torquent per conubia nostra, per inceptos\n    himenaeos.\n<\/p>\n\n\n\n
\n    Nam rhoncus risus mauris, eget ultrices felis feugiat eu. Pellentesque sed\n    sapien nunc. Donec non scelerisque arcu. Vivamus feugiat dapibus justo.\n<\/p>\n\n\n\n
\n    H2: Open Sans
The quick brown fox jumps over the lazy dog\n<\/h2>\n\n\n\n
\n    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sapien\n    lacus, maximus vel augue vitae, consectetur hendrerit augue. Class aptent\n    taciti sociosqu ad litora torquent per conubia nostra, per inceptos\n    himenaeos.\n<\/p>\n\n\n\n
\n    Nam rhoncus risus mauris, eget ultrices felis feugiat eu. Pellentesque sed\n    sapien nunc. Donec non scelerisque arcu. Vivamus feugiat dapibus justo.\n<\/p>\n\n\n\n
\n    H3: Open Sans
The quick brown fox jumps over the lazy dog\n<\/h3>\n\n\n\n
\n    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sapien\n    lacus, maximus vel augue vitae, consectetur hendrerit augue. Class aptent\n    taciti sociosqu ad litora torquent per conubia nostra, per inceptos\n    himenaeos.\n<\/p>\n\n\n\n
\n    Nam rhoncus risus mauris, eget ultrices felis feugiat eu. Pellentesque sed\n    sapien nunc. Donec non scelerisque arcu. Vivamus feugiat dapibus justo.\n<\/p>\n\n\n\n
\n    H4: Open Sans
The quick brown fox jumps over the lazy dog\n<\/h4>\n\n\n\n
\n    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sapien\n    lacus, maximus vel augue vitae, consectetur hendrerit augue. Class aptent\n    taciti sociosqu ad litora torquent per conubia nostra, per inceptos\n    himenaeos.\n<\/p>\n\n\n\n
\n    Nam rhoncus risus mauris, eget ultrices felis feugiat eu. Pellentesque sed\n    sapien nunc. Donec non scelerisque arcu. Vivamus feugiat dapibus justo.\n<\/p>\n\n\n\n
\n    H5: Open Sans
The quick brown fox jumps over the lazy dog\n<\/h5>\n\n\n\n
\n    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sapien\n    lacus, maximus vel augue vitae, consectetur hendrerit augue. Class aptent\n    taciti sociosqu ad litora torquent per conubia nostra, per inceptos\n    himenaeos.\n<\/p>\n\n\n\n
\n    Nam rhoncus risus mauris, eget ultrices felis feugiat eu. Pellentesque sed\n    sapien nunc. Donec non scelerisque arcu. Vivamus feugiat dapibus justo.\n<\/p>\n\n\n\n
\n    H6: Open Sans
The quick brown fox jumps over the lazy dog\n<\/h6>\n\n\n\n
\n    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sapien\n    lacus, maximus vel augue vitae, consectetur hendrerit augue. Class aptent\n    taciti sociosqu ad litora torquent per conubia nostra, per inceptos\n    himenaeos.\n<\/p>\n\n\n\n
\n    Nam rhoncus risus mauris, eget ultrices felis feugiat eu. Pellentesque sed\n    sapien nunc. Donec non scelerisque arcu. Vivamus feugiat dapibus justo.\n<\/p>\n\n\n\n
\n\n\n\n
Heading with Decor<\/h2>\n\n\n\n
The decor is applied via a heading block style option. <\/p>\n\n\n\n
Paragraph<\/h2>\n\n\n\n
Body: Open Sans<\/p>\n\n\n\n
\n    Lorem ipsum dolor sit amet, test link<\/a> adipiscing elit. Nullam dignissim convallis est. Quisque aliquam.\n    Donec faucibus. Nunc iaculis suscipit dui.\n    Nam sit amet sem. Aliquam<\/strong> libero nisi,\n    imperdiet at, tincidunt<\/em> nec, gravida vehicula, nisl. Praesent\n    mattislus.\n<\/p>\n\n\n\n
\n    This is a link<\/a>.\n<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a dui bibendum libero tempus scelerisque. Aenean eu nulla convallis, commodo lacus a, semper diam. Curabitur nec cursus dolor. Mauris auctor purus sed elit vulputate laoreet. Praesent dictum ipsum a sem condimentum, accumsan bibendum sapien auctor. Nunc scelerisque mauris accumsan, imperdiet mi nec, gravida urna. Nunc vestibulum elementum porttitor. Etiam quis mauris dictum, faucibus risus et, blandit neque. Pellentesque pretium eros vel libero pretium, sed laoreet quam tempor. Proin quis posuere lectus, non congue nulla.<\/p>\n\n\n\n
Buttons<\/h2>\n\n\n\n
\n
Primary Button<\/a><\/div>\n\n\n\n
Secondary Button<\/a><\/div>\n<\/div>\n\n\n\n
Blockquote<\/h2>\n\n\n\n
\n
\n        To be, or not to be, that is the question: Whether \u2019tis nobler in the\n        mind to suffer The slings and arrows of outrageous fortune, Or to take\n        arms against a sea of troubles And by opposing end them.\n    <\/p>\nShakespeare<\/cite><\/blockquote>\n\n\n\n
\n\n\n\n
List Types<\/h2>\n\n\n\n
Definition List<\/h3>\n\n\n\n
\n    
Definition List Title<\/dt>\n    
This is a definition list division.<\/dd>\n<\/dl>\n\n\n\n
Ordered List<\/h3>\n\n\n\n
    \n
  1. List Item 1<\/li>\n\n\n\n
  2. List Item 2<\/li>\n\n\n\n
  3. List Item 3<\/li>\n<\/ol>\n\n\n\n
    Unordered List<\/h3>\n\n\n\n
      \n
    • List Item 1<\/li>\n\n\n\n
    • List Item 2<\/li>\n\n\n\n
    • List Item 3<\/li>\n<\/ul>\n\n\n\n
      \n    Misc Stuff \u2013 abbr, acronym, pre, code, sub, sup, etc.\n<\/h2>\n\n\n\n
      Lorem superscript<\/sup> dolor subscript<\/sub> amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. cite. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. NBA Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus. AVE<\/p>\n\n\n\n
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. \nNunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. \nPraesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. \nDonec sed tellus eget sapien fringilla nonummy. NBA \nMauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.  \nAVE\n<\/pre>\n\n\n\n
      \n\n\n\n
      Tables<\/h2>\n\n\n\n
      Table Header 1<\/th>Table Header 2<\/th>Table Header 3<\/th><\/tr>
      Division 1<\/td>Division 2<\/td>Division 3<\/td><\/tr>
      Division 1<\/td>Division 2<\/td>Division 3<\/td><\/tr>
      Division 1<\/td>Division 2<\/td>Division 3<\/td><\/tr><\/tbody><\/table>
      \n        This is the table caption\n    <\/figcaption><\/figure>\n\n\n\n
      Table Header 1<\/th>Table Header 2<\/th>Table Header 3<\/th><\/tr>
      Division 1<\/td>Division 2<\/td>Division 3<\/td><\/tr>
      Division 1<\/td>Division 2<\/td>Division 3<\/td><\/tr>
      Division 1<\/td>Division 2<\/td>Division 3<\/td><\/tr><\/tbody><\/table>
      \n        This is the table caption\n    <\/figcaption><\/figure>\n\n\n\n
      Forms<\/h2>\n\n\n