{"id":8557,"date":"2026-03-12T20:17:56","date_gmt":"2026-03-13T00:17:56","guid":{"rendered":"https:\/\/cfcquebec.ca\/?page_id=8557"},"modified":"2026-03-12T20:58:58","modified_gmt":"2026-03-13T00:58:58","slug":"test-badge","status":"publish","type":"page","link":"https:\/\/cfcquebec.ca\/en\/badge-test\/","title":{"rendered":"badge test"},"content":{"rendered":"<div class=\"fusion-fullwidth fullwidth-box fusion-builder-row-1 fusion-flex-container has-pattern-background has-mask-background nonhundred-percent-fullwidth non-hundred-percent-height-scrolling\" style=\"--awb-border-radius-top-left:0px;--awb-border-radius-top-right:0px;--awb-border-radius-bottom-right:0px;--awb-border-radius-bottom-left:0px;--awb-flex-wrap:wrap;\" ><div class=\"fusion-builder-row fusion-row fusion-flex-align-items-flex-start fusion-flex-content-wrap\" style=\"max-width:2059.2px;margin-left: calc(-4% \/ 2 );margin-right: calc(-4% \/ 2 );\"><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-0 fusion_builder_column_1_1 1_1 fusion-flex-column\" style=\"--awb-bg-size:cover;--awb-width-large:100%;--awb-margin-top-large:0px;--awb-spacing-right-large:1.92%;--awb-margin-bottom-large:20px;--awb-spacing-left-large:1.92%;--awb-width-medium:100%;--awb-order-medium:0;--awb-spacing-right-medium:1.92%;--awb-spacing-left-medium:1.92%;--awb-width-small:100%;--awb-order-small:0;--awb-spacing-right-small:1.92%;--awb-spacing-left-small:1.92%;\"><div class=\"fusion-column-wrapper fusion-column-has-shadow fusion-flex-justify-content-flex-start fusion-content-layout-column\"><div class=\"cfc-45-wrap\">\n  <div class=\"cfc-45-badge\">\n\n    <div class=\"cfc-45-face cfc-45-front\">\n      <div class=\"cfc-45-edge\"><\/div>\n      <div class=\"cfc-45-rim\"><\/div>\n\n      <div class=\"cfc-45-stars cfc-45-stars-top\">\u2605 \u2605 \u2605 \u2605 \u2605<\/div>\n\n      <div class=\"cfc-45-laurel cfc-45-laurel-left\" aria-hidden=\"true\">\n        <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n      <\/div>\n      <div class=\"cfc-45-laurel cfc-45-laurel-right\" aria-hidden=\"true\">\n        <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n      <\/div>\n\n      <div class=\"cfc-45-inner\">\n        <div class=\"cfc-45-top\">Celebrating 45<\/div>\n        <div class=\"cfc-45-bottom\">Years of Fencing<\/div>\n      <\/div>\n\n      <div class=\"cfc-45-stars cfc-45-stars-bottom\">\u2605 \u2605 \u2605 \u2605 \u2605<\/div>\n    <\/div>\n\n    <div class=\"cfc-45-face cfc-45-back\">\n      <div class=\"cfc-45-edge\"><\/div>\n      <div class=\"cfc-45-rim\"><\/div>\n\n      <div class=\"cfc-45-stars cfc-45-stars-top\">\u2605 \u2605 \u2605 \u2605 \u2605<\/div>\n\n      <div class=\"cfc-45-laurel cfc-45-laurel-left\" aria-hidden=\"true\">\n        <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n      <\/div>\n      <div class=\"cfc-45-laurel cfc-45-laurel-right\" aria-hidden=\"true\">\n        <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n      <\/div>\n\n      <div class=\"cfc-45-inner\">\n        <div class=\"cfc-45-top\">Celebrating 45<\/div>\n        <div class=\"cfc-45-bottom\">Years of fencing<\/div>\n      <\/div>\n\n      <div class=\"cfc-45-stars cfc-45-stars-bottom\">\u2605 \u2605 \u2605 \u2605 \u2605<\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n<style>\n.cfc-45-wrap{\n  display:flex;\n  justify-content:center;\n  align-items:center;\n  perspective:1400px;\n  padding:4px;\n  line-height:1;\n}\n\n.cfc-45-badge{\n  position:relative;\n  width:140px;\n  height:140px;\n  transform-style:preserve-3d;\n  -webkit-transform-style:preserve-3d;\n  animation:cfcSpin45 12s linear infinite;\n}\n\n.cfc-45-face{\n  position:absolute;\n  top:0;\n  left:0;\n  width:100%;\n  height:100%;\n  border-radius:50%;\n  backface-visibility:hidden;\n  -webkit-backface-visibility:hidden;\n  overflow:hidden;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  background:\n    radial-gradient(circle at 50% 40%, #352708 0%, #1f1402 55%, #0f0900 100%);\n  box-shadow:\n    0 6px 16px rgba(0,0,0,.24),\n    inset 0 0 0 2px #7b5a09,\n    inset 0 0 0 5px #d8b24c,\n    inset 0 0 0 9px #8e6710,\n    inset 0 0 0 18px #2a1b00;\n}\n\n.cfc-45-front{\n  transform:rotateY(0deg);\n}\n\n.cfc-45-back{\n  transform:rotateY(180deg);\n}\n\n.cfc-45-edge{\n  position:absolute;\n  inset:0;\n  border-radius:50%;\n  background:\n    repeating-conic-gradient(\n      from 0deg,\n      #f2d06a 0deg 5deg,\n      #8e6710 5deg 10deg\n    );\n  -webkit-mask: radial-gradient(circle, transparent 0 82%, #000 83% 100%);\n  mask: radial-gradient(circle, transparent 0 82%, #000 83% 100%);\n  opacity:1;\n}\n\n.cfc-45-rim{\n  position:absolute;\n  inset:8px;\n  border-radius:50%;\n  border:1px solid rgba(255,230,150,.35);\n  box-shadow:\n    inset 0 0 0 3px rgba(0,0,0,.65),\n    inset 0 0 0 4px rgba(232,192,86,.55),\n    0 0 4px rgba(0,0,0,.10);\n}\n\n.cfc-45-rim:before{\n  content:\"\";\n  position:absolute;\n  inset:6px;\n  border-radius:50%;\n  border:1px dashed rgba(255,220,120,.18);\n}\n\n.cfc-45-inner{\n  position:relative;\n  z-index:3;\n  width:60%;\n  height:60%;\n  border-radius:50%;\n  display:flex;\n  flex-direction:column;\n  align-items:center;\n  justify-content:center;\n  text-align:center;\n  padding:8px;\n  box-sizing:border-box;\n  background:\n    radial-gradient(circle at 35% 30%, rgba(255,220,120,.10), rgba(255,255,255,.03) 35%, rgba(0,0,0,.22) 100%);\n  box-shadow:\n    inset 0 1px 0 rgba(255,240,190,.12),\n    inset 0 -4px 10px rgba(0,0,0,.38),\n    inset 0 0 8px rgba(0,0,0,.28);\n}\n\n.cfc-45-top,\n.cfc-45-bottom{\n  font-family:Georgia, \"Times New Roman\", serif;\n  text-transform:uppercase;\n  font-weight:700;\n  letter-spacing:.7px;\n  color:#efcb62;\n  text-shadow:\n    0 1px 0 #fff1b1,\n    0 2px 0 #d2aa3c,\n    0 3px 0 #8a650d,\n    0 4px 6px rgba(0,0,0,.35);\n  position:relative;\n  z-index:4;\n}\n\n.cfc-45-top{\n  font-size:14px;\n  line-height:1.08;\n  margin-bottom:4px;\n}\n\n.cfc-45-bottom{\n  font-size:9px;\n  line-height:1.1;\n  margin-top:4px;\n}\n\n.cfc-45-stars{\n  position:absolute;\n  left:50%;\n  transform:translateX(-50%);\n  z-index:4;\n  font-size:8px;\n  letter-spacing:1px;\n  color:#efcb62;\n  text-shadow:\n    0 1px 0 #fff1b1,\n    0 2px 0 #8a650d,\n    0 3px 5px rgba(0,0,0,.35);\n  white-space:nowrap;\n}\n\n.cfc-45-stars-top{\n  top:22px;\n}\n\n.cfc-45-stars-bottom{\n  bottom:22px;\n}\n\n.cfc-45-laurel{\n  position:absolute;\n  width:36px;\n  height:68px;\n  top:34px;\n  z-index:2;\n}\n\n.cfc-45-laurel-left{\n  left:14px;\n  transform:rotate(-8deg);\n}\n\n.cfc-45-laurel-right{\n  right:14px;\n  transform:scaleX(-1) rotate(-8deg);\n}\n\n.cfc-45-laurel span{\n  position:absolute;\n  display:block;\n  width:10px;\n  height:5px;\n  background:linear-gradient(180deg, #ffe69a 0%, #d4a329 55%, #8a650c 100%);\n  border-radius:10px \/ 6px;\n  box-shadow:\n    inset 0 1px 1px rgba(255,255,255,.35),\n    0 1px 2px rgba(0,0,0,.18);\n  transform-origin:right center;\n}\n\n.cfc-45-laurel span:nth-child(1){ top:3px; left:18px; transform:rotate(-58deg); }\n.cfc-45-laurel span:nth-child(2){ top:11px; left:14px; transform:rotate(-42deg); }\n.cfc-45-laurel span:nth-child(3){ top:20px; left:10px; transform:rotate(-26deg); }\n.cfc-45-laurel span:nth-child(4){ top:29px; left:8px; transform:rotate(-8deg); }\n.cfc-45-laurel span:nth-child(5){ top:38px; left:8px; transform:rotate(10deg); }\n.cfc-45-laurel span:nth-child(6){ top:47px; left:12px; transform:rotate(28deg); }\n.cfc-45-laurel span:nth-child(7){ top:56px; left:17px; transform:rotate(44deg); }\n\n.cfc-45-wrap:hover .cfc-45-badge{\n  animation-play-state:paused;\n}\n\n@keyframes cfcSpin45{\n  0%{ transform:rotateY(0deg); }\n  100%{ transform:rotateY(360deg); }\n}\n\n@media (max-width:640px){\n  .cfc-45-badge{\n    width:120px;\n    height:120px;\n  }\n\n  .cfc-45-top{\n    font-size:12px;\n  }\n\n  .cfc-45-bottom{\n    font-size:8px;\n  }\n\n  .cfc-45-stars{\n    font-size:7px;\n    letter-spacing:.5px;\n  }\n\n  .cfc-45-stars-top{ top:19px; }\n  .cfc-45-stars-bottom{ bottom:19px; }\n\n  .cfc-45-laurel{\n    width:30px;\n    height:56px;\n    top:30px;\n  }\n\n  .cfc-45-laurel-left{ left:11px; }\n  .cfc-45-laurel-right{ right:11px; }\n\n  .cfc-45-laurel span{\n    width:8px;\n    height:4px;\n  }\n\n  .cfc-45-laurel span:nth-child(1){ top:2px; left:15px; }\n  .cfc-45-laurel span:nth-child(2){ top:9px; left:11px; }\n  .cfc-45-laurel span:nth-child(3){ top:16px; left:8px; }\n  .cfc-45-laurel span:nth-child(4){ top:23px; left:6px; }\n  .cfc-45-laurel span:nth-child(5){ top:31px; left:7px; }\n  .cfc-45-laurel span:nth-child(6){ top:39px; left:10px; }\n  .cfc-45-laurel span:nth-child(7){ top:46px; left:14px; }\n}\n\n@media (prefers-reduced-motion: reduce){\n  .cfc-45-badge{\n    animation:none;\n  }\n}\n<\/style><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":7,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"100-width.php","meta":{"footnotes":""},"class_list":["post-8557","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/pages\/8557","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/comments?post=8557"}],"version-history":[{"count":0,"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/pages\/8557\/revisions"}],"wp:attachment":[{"href":"https:\/\/cfcquebec.ca\/en\/wp-json\/wp\/v2\/media?parent=8557"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}