:root{--color-white:#fff;--color-dark:#18181b;--color-darker:#1a1a1a;--color-primary:#a3e635;--color-secondary:#00ff84;--color-accent:#14b8a6;--color-border:#27272a;--color-light-gray:rgb(255 255 255 / 0.9);--color-overlay:rgba(39 39 42 / 0.95);--color-border-light:rgb(162 230 53 / 0.6);--color-border-accent:rgb(20 184 165 / 0.6);--font-stack:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
    Segoe UI Symbol, "Noto Color Emoji";--max-width:1250px;--border-radius:10px}@media all and (max-width:1000px){.parent:has(header){position:fixed;background:var(--color-white);display:flex;align-items:center;justify-content:space-between;gap:15px;top:0;left:0;width:100%}header{background:var(--color-white)!important}#nav_area{box-shadow:none!important;background:var(--color-white)!important}header .mobile_logo,header .main_logo{max-width:unset!important;width:fit-content!important;height:fit-content!important}header .mobile_logo img,header .main_logo img{height:130px!important;width:auto!important}main#main{padding-top:170px}main#main .content{padding-left:30px;padding-right:30px}}@media all and (max-width:480px){main#main .content{padding-left:15px;padding-right:15px}}main#main .content{padding-left:30px;padding-right:30px}html:has(.custom-homepage) .custom-homepage *,html:has(.custom-homepage) footer *,.celebrating.menu{font-family:var(--font-stack)!important;letter-spacing:0!important;font-size:16px;line-height:26px}html:has(.custom-homepage) footer .contact-list *{line-height:16px!important}html:has(.custom-homepage) .header_info{display:none!important}html:has(.custom-homepage) .white-light{color:var(--color-light-gray)!important}html:has(.custom-homepage) .protect-me,html:has(.custom-homepage) .clearfix,main#main{margin:0 auto;background:var(--color-dark)}main#main .h1,main#main h2{font-weight:700!important;margin-bottom:20px!important}main#main p{font-size:18px!important;line-height:30px!important;color:var(--color-light-gray)!important}main#main span:not(.popular):not(.heading){color:var(--color-light-gray)!important}.custom-homepage .hero-container{border-bottom:5px solid var(--color-secondary);padding-top:150px}.celebrating.menu{position:absolute;width:fit-content!important;white-space:nowrap;top:-90px;right:0}.custom-homepage .hero-container .celebrating,.celebrating.menu,.custom-homepage .sixth-container .celebrating{display:inline-flex;align-items:center;gap:10px;padding:5px 15px;border-radius:999px;background:linear-gradient( 90deg,var(--color-primary),var(--color-secondary) );color:var(--color-dark);letter-spacing:.5px;text-transform:uppercase;box-shadow:0 4px 12px rgb(24 24 27/.25);font-size:14px;font-weight:700;margin-bottom:20px}.custom-homepage .hero{text-align:left;display:flex;align-items:center;justify-content:space-between;gap:30px;max-width:var(--max-width);margin:0 auto;padding:50px 0;& .h1, & .h1 span { font-size: 34px !important; line-height: 46px !important; color: var(--color-white) !important; } & span { display: block; } & .description, & .serving { font-size: 18px !important; opacity: 0.9 !important; display: flex; align-items: center; justify-content: flex-start; gap: 8px; } & .serving svg { width: 25px; } & .ctas { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; } & > div, & img { flex: 1; width: 100%; } & img { max-width: 500px; height: auto; border-radius: var(--border-radius); width: 100%; } & .ctas .btn { text-align: center; font-size: 18px; line-height: 1.4; padding: 10px 15px; font-weight: 700; text-decoration: none; display: flex; align-items: center; justify-content: center; border-radius: var(--border-radius); transition: transform 0.2s ease-in-out; transform: scale(1); &:hover { transform: scale(1.09); } &:not(:first-child) { height: 45px; background: var(--color-accent); color: var(--color-white); } &:first-child { grid-column: 1 / -1; height: 55px; } } & .ctas .btn-primary { background: var(--color-primary); color: #000; } & .ctas .btn-secondary { background: var(--color-dark); color: var(--color-white); } & .ctas .btn:nth-child(1) { grid-column: 1 / -1; grid-row: 1; } & .ctas .btn:nth-child(2) { grid-column: 1 / 4; grid-row: 2; } & .ctas .btn:nth-child(3) { grid-column: 4 / -1; grid-row: 2; } & .ctas .btn:nth-child(4) { grid-column: 1 / 3; grid-row: 3; } & .ctas .btn:nth-child(5) { grid-column: 3 / 5; grid-row: 3; } & .ctas .btn:nth-child(6) { grid-column: 5 / -1; grid-row: 3; }}@media(max-width:768px){.custom-homepage .hero .ctas{grid-template-columns:repeat(2,1fr);& .btn:first-child { grid-column: 1 / -1; } & .btn:nth-child(2), & .btn:nth-child(3), & .btn:nth-child(4), & .btn:nth-child(5), & .btn:nth-child(6) { grid-column: auto; grid-row: auto; }}}@media(max-width:480px){.custom-homepage .hero .ctas{grid-template-columns:1fr;& .btn:first-child { grid-column: 1; } & .btn:nth-child(2), & .btn:nth-child(3), & .btn:nth-child(4), & .btn:nth-child(5), & .btn:nth-child(6) { grid-column: auto; grid-row: auto; }}}.custom-homepage .secondthird-container{position:relative;overflow:hidden;&:after { position:absolute; top:0; left:0; width:100%; height:100%; background:var(--color-overlay); content:""; z-index:0; } &:before { position:absolute; content:""; width:100%; height:100%; top:0; left:0; background-image:url(https://aycarambaeh.ca/wp-content/themes/aycaramba/images/main-logo.svg); display:block; background-size:180px; background-position:0 0,90px 90px; background-repeat:repeat; transform:rotate(-15deg) scale(1.5); transform-origin:center center; z-index:0; }}.custom-homepage .second-container,.custom-homepage .third-container{z-index:1;position:relative;& h3 { color: var(--color-white) !important; }}.custom-homepage .second-container{& .content { text-align: center; display: flex; align-items: center; justify-content: center; max-width: var(--max-width); margin: 0 auto; padding: 50px 0; } & h2 { font-size: 28px !important; line-height: 40px !important; color: var(--color-white) !important; margin-bottom: 20px; } & .menu-items { display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; justify-content: center; align-items: center; & div { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 18px; flex-direction: column; } & strong { color: var(--color-primary); font-size: 20px !important; } } @media (max-width: 999px) { & .menu-items { grid-template-columns: repeat(3, 1fr); gap: 15px; } & h2 { font-size: 26px !important; line-height: 38px !important; } } @media (max-width: 768px) { & .menu-items { grid-template-columns: repeat(2, 1fr); gap: 10px; justify-items: center; & div { text-align: center; font-size: 15px; } & strong { font-size: 18px !important; } &:nth-child(5) { grid-column: 1 / -1; width: 50%; margin: 0 auto; } } & h2 { font-size: 22px !important; line-height: 32px !important; } & .content { padding: 25px 15px !important; } } @media (max-width: 480px) { & .menu-items { grid-template-columns: 1fr; gap: 8px; justify-items: center; & div { text-align: center; font-size: 13px; } & strong { font-size: 15px !important; } } & h2 { font-size: 18px !important; line-height: 26px !important; } & .content { padding: 15px 12px !important; } }}.custom-homepage .third-container{& .content { text-align: center; display: flex; align-items: center; justify-content: center; max-width: var(--max-width); margin: 0 auto; padding: 0 0 50px 0; & .menu-items { display: flex; flex-direction: column; align-items: center; gap: 30px; } & .menu { display: flex; gap: 30px; justify-content: space-between; align-items: stretch; &.reverse { flex-direction: row-reverse; } & > img { max-width: 450px; width: 100%; border-radius: var(--border-radius); flex: 1; height: 250px; object-fit: cover; object-position: center; } & > div { flex: 1; display: flex; gap: 10px; flex-direction: column; justify-content: center; align-items: flex-start; text-align: left; & .popular { background: var(--color-primary); color: var(--color-dark) !important; padding: 0 10px; border-radius: 100px; font-weight: 700; display: flex; align-items: center; justify-content: center; min-width: 150px; font-size: 14px; } } } & h3 { font-size: 24px !important; font-weight: 700 !important; } } & .notice { text-align: left !important; border-left: 5px solid var(--color-primary); padding: 20px; margin-top: 30px; border-radius: var(--border-radius); background: var(--color-dark); } @media (max-width: 768px) { & .content { padding: 20px 15px 25px 15px !important; & .menu { flex-direction: column !important; gap: 20px; align-items: center; & > img { max-width: 100%; width: 100%; height: 250px; } } & h3 { font-size: 22px !important; } } } @media (max-width: 480px) { & .content { padding: 15px 12px !important; & .menu { flex-direction: column !important; gap: 15px; align-items: center; & > img { height: 200px; width: 100%; } & > div { text-align: center; align-items: center; } } & h3 { font-size: 18px !important; } } & .notice { border-left: 4px solid var(--color-primary); padding: 15px; margin-top: 20px; font-size: 13px; } }}.custom-homepage .fourth-container{background:var(--color-white);& .content { text-align: center; display: flex; align-items: center; justify-content: center; max-width: var(--max-width); margin: 0 auto; padding: 50px 0; & img { height: 150px; width: auto; } } & h2 { font-size: 28px !important; color: var(--color-white) !important; margin-bottom: 20px; } @media (max-width: 768px) { & h2 { font-size: 22px !important; line-height: 32px !important; } & .content { padding: 25px 15px !important; } } @media (max-width: 480px) { & .content { padding: 15px 12px !important; & img { height: 80px; width: auto; } } & h2 { font-size: 18px !important; line-height: 26px !important; } }}.custom-homepage .fifth-container{background:var(--color-border);& .content { text-align: center; display: flex; align-items: center; justify-content: center; max-width: var(--max-width); margin: 0 auto; padding: 50px 0; & strong { color: var(--color-white) !important; font-size: 20px !important; } } & .menu-items { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; justify-content: center; align-items: center; & div { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 18px; flex-direction: column; & svg { width: 50px; height: 50px; padding: 10px; border-radius: 100%; background: var(--color-dark) !important; } &:not(:nth-child(2)) svg { stroke: var(--color-primary); } &:nth-child(2) svg { fill: var(--color-primary); } } } @media (max-width: 768px) { & .menu-items { grid-template-columns: repeat(2, 1fr); justify-items: center; & div { text-align: center; font-size: 15px; } & strong { font-size: 18px !important; } } & .content { padding: 25px 15px !important; } } @media (max-width: 480px) { & .menu-items { grid-template-columns: 1fr; gap: 12px; justify-items: center; & div { text-align: center; font-size: 13px; & svg { width: 40px; height: 40px; } } & strong { font-size: 15px !important; } } & .content { padding: 15px 12px !important; } }}.custom-homepage .sixth-container{background:var(--color-accent);border-bottom:5px solid var(--color-primary);& h2 { font-size: 28px !important; line-height: 40px !important; color: var(--color-white) !important; margin-bottom: 20px; } & .content { text-align: center; display: flex; align-items: center; justify-content: center; max-width: var(--max-width); margin: 0 auto; padding: 50px 0; flex-direction: column; gap: 20px; & p { margin-bottom: 0 !important; } } @media (max-width: 999px) { & h2 { font-size: 26px !important; line-height: 38px !important; } } @media (max-width: 768px) { & h2 { font-size: 22px !important; line-height: 32px !important; } & .content { padding: 25px 15px !important; } } @media (max-width: 480px) { border-bottom: 3px solid var(--color-primary); & h2 { font-size: 18px !important; line-height: 26px !important; } & .content { padding: 15px 12px !important; gap: 15px; } }}.custom-homepage .seventh-container{& h2 { font-size: 28px !important; line-height: 40px !important; color: var(--color-white) !important; margin-bottom: 20px; } & .content { text-align: center; display: flex; align-items: center; justify-content: center; max-width: var(--max-width); margin: 0 auto; padding: 50px 0; flex-direction: column; gap: 20px; & .milestones { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; justify-content: center; align-items: center; width: 100%; & .milestone { height: 180px; padding: 30px 20px; display: flex; align-items: stretch; justify-content: center; border-radius: var(--border-radius); & div { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; & div:not(.white-light) { font-size: 18px !important; color: var(--color-white) !important; font-weight: 500; } } & h3 { font-size: 32px !important; font-weight: 700; } &:nth-child(odd) { border: 2px solid var(--color-border-light); & h3 { color: var(--color-primary) !important; } &:hover { border: 2px solid var(--color-primary); } } &:nth-child(even) { border: 2px solid var(--color-border-accent); & h3 { color: #14b8a5 !important; } &:hover { border: 2px solid var(--color-accent); } } } & .milestone-google { height: 180px; padding: 30px 20px; border-radius: var(--border-radius); border: 2px solid var(--color-border-accent); & * { color: var(--color-accent) !important; } & .ti-info-icon { background: var(--color-accent) !important; } &:hover { border: 2px solid var(--color-accent); } } } } @media (max-width: 999px) { & h2 { font-size: 26px !important; line-height: 38px !important; } } @media (max-width: 768px) { & h2 { font-size: 22px !important; line-height: 32px !important; } & .content { padding: 25px 15px !important; & .milestones { grid-template-columns: repeat(2, 1fr); gap: 20px; & .milestone { height: auto; padding: 20px 15px; & h3 { font-size: 24px !important; } & div div:not(.white-light) { font-size: 15px !important; } } } } } @media (max-width: 480px) { & h2 { font-size: 18px !important; line-height: 26px !important; } & .content { padding: 15px 12px !important; gap: 15px; & .milestones { grid-template-columns: 1fr; gap: 15px; & .milestone { height: auto; padding: 15px 12px; & h3 { font-size: 20px !important; } & div div:not(.white-light) { font-size: 13px !important; } } } } }}@media(max-width:1060px){.custom-homepage .second-container .content,.custom-homepage .third-container .content,.custom-homepage .fourth-container .content,.custom-homepage .sixth-container .content,.custom-homepage .seventh-container .content,.custom-homepage .fifth-container .content{padding:40px 30px!important}.custom-homepage .third-container .content{padding:30px 30px 40px!important}.custom-homepage .hero{padding:40px 30px}.custom-homepage .hero-container{padding-top:150px}}@media(max-width:999px){main#main p{font-size:17px!important;line-height:28px!important}main#main h2{font-size:26px!important;line-height:38px!important}.custom-homepage .second-container{& .menu-items { grid-template-columns: repeat(3, 1fr); gap: 15px; } & h2 { font-size: 26px !important; line-height: 38px !important; }}.custom-homepage .hero-container{padding-top:90px}.custom-homepage .hero{flex-direction:column;gap:20px;padding:25px 15px;text-align:center;& > div { text-align: center; } & .h1, & .h1 span { font-size: 30px !important; line-height: 42px !important; } & .description, & .serving { font-size: 17px !important; justify-content: center; }}.custom-homepage .sixth-container h2{font-size:26px!important;line-height:38px!important}.custom-homepage .seventh-container h2{font-size:26px!important;line-height:38px!important}.trust-index-review .ti-widget{justify-content:center!important}}@media(max-width:768px){main#main p{font-size:16px!important;line-height:26px!important}main#main h2{font-size:22px!important;line-height:32px!important}main#main .h1,main#main h3{font-size:22px!important;line-height:32px!important}.custom-homepage .hero{& .h1, & .h1 span { font-size: 26px !important; line-height: 36px !important; } & .ctas { grid-template-columns: repeat(2, 1fr); & .btn { width: 100%; font-size: 15px; &:first-child { grid-column: auto; height: 45px; } } } & .description, & .serving { font-size: 15px !important; }}.custom-homepage .second-container{& .menu-items { grid-template-columns: repeat(2, 1fr); gap: 10px; justify-items: center; & div { text-align: center; font-size: 15px; } & strong { font-size: 18px !important; } &:nth-child(5) { grid-column: 1 / -1; width: 50%; margin: 0 auto; } } & h2 { font-size: 22px !important; line-height: 32px !important; }}.custom-homepage .third-container{& .content { padding: 20px 15px 25px 15px !important; & .menu { flex-direction: column !important; gap: 20px; align-items: center; & > img { max-width: 100%; width: 100%; height: 250px; } } & h3 { font-size: 22px !important; } }}.custom-homepage .fourth-container{& h2 { font-size: 22px !important; line-height: 32px !important; }}.custom-homepage .fifth-container{& .menu-items { grid-template-columns: repeat(2, 1fr); justify-items: center; & div { text-align: center; font-size: 15px; } & strong { font-size: 18px !important; } }}.custom-homepage .sixth-container h2{font-size:22px!important;line-height:32px!important}.custom-homepage .seventh-container{& h2 { font-size: 22px !important; line-height: 32px !important; } & .content .milestones { grid-template-columns: repeat(2, 1fr); gap: 20px; & .milestone { height: auto; padding: 20px 15px; & h3 { font-size: 24px !important; } & div div:not(.white-light) { font-size: 15px !important; } } }}.custom-homepage .second-container .content,.custom-homepage .third-container .content,.custom-homepage .fourth-container .content,.custom-homepage .sixth-container .content,.custom-homepage .seventh-container .content,.custom-homepage .fifth-container .content{padding:25px 15px!important}}@media(max-width:480px){html:has(.custom-homepage) .custom-homepage *,html:has(.custom-homepage) footer *{font-size:14px;line-height:22px}main#main .h1,main#main h2{font-size:18px!important;line-height:26px!important;margin-bottom:15px!important}main#main h3{font-size:18px!important;line-height:26px!important}main#main p{font-size:14px!important;line-height:22px!important}.custom-homepage .hero-container{padding-top:90px;border-bottom:3px solid var(--color-secondary)}.custom-homepage .hero{flex-direction:column;gap:15px;padding:15px 12px;text-align:center;& > div { text-align: center; } & .h1, & .h1 span { font-size: 20px !important; line-height: 28px !important; } & .ctas { grid-template-columns: 1fr; gap: 8px; & .btn { font-size: 13px; padding: 8px 12px !important; height: auto !important; &:not(:first-child) { height: 40px !important; } } } & img { max-width: 100%; border-radius: 8px; } & .description, & .serving { font-size: 13px !important; gap: 5px; justify-content: center; & svg { width: 18px; } }}.custom-homepage .celebrating,.custom-homepage .sixth-container .celebrating{font-size:12px;padding:4px 12px;margin-bottom:15px!important}.custom-homepage .second-container{& .menu-items { grid-template-columns: 1fr; gap: 8px; justify-items: center; & div { text-align: center; font-size: 13px; } & strong { font-size: 15px !important; } } & h2 { font-size: 18px !important; line-height: 26px !important; }}.custom-homepage .third-container{& .content { padding: 15px 12px !important; & .menu { flex-direction: column !important; gap: 15px; align-items: center; & > img { height: 200px; width: 100%; } & > div { text-align: center; align-items: center; } } & h3 { font-size: 18px !important; } } & .notice { border-left: 4px solid var(--color-primary); padding: 15px; margin-top: 20px; font-size: 13px; }}.custom-homepage .fourth-container{& .content { padding: 15px 12px !important; & img { height: 80px; width: auto; } } & h2 { font-size: 18px !important; line-height: 26px !important; }}.custom-homepage .fifth-container{& .menu-items { grid-template-columns: 1fr; gap: 12px; justify-items: center; & div { text-align: center; font-size: 13px; & svg { width: 40px; height: 40px; } } & strong { font-size: 15px !important; } } & .content { padding: 15px 12px !important; }}.custom-homepage .sixth-container{border-bottom:3px solid var(--color-primary);& h2 { font-size: 18px !important; line-height: 26px !important; } & .content { padding: 15px 12px !important; gap: 15px; }}.custom-homepage .seventh-container{& h2 { font-size: 18px !important; line-height: 26px !important; } & .content { padding: 15px 12px !important; gap: 15px; & .milestones { grid-template-columns: 1fr; gap: 15px; & .milestone { height: auto; padding: 15px 12px; & h3 { font-size: 20px !important; } & div div:not(.white-light) { font-size: 13px !important; } } } }}.custom-homepage .second-container .content,.custom-homepage .third-container .content,.custom-homepage .fourth-container .content,.custom-homepage .sixth-container .content,.custom-homepage .seventh-container .content,.custom-homepage .fifth-container .content{padding:15px 12px!important;max-width:100%!important}}.trust-index-review .ti-widget{display:flex!important;justify-content:flex-start;margin:20px 0}.trust-index-review .ti-widget-container{margin:0!important}@keyframes neon-pulse{0%,100%{filter:blur(4px);opacity:.7}50%{filter:blur(7px);opacity:1}}.secondthird-container.main-menu-container,.third-container.about-container{padding-top:270px}main#main .third-container.menu{.content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 50px; h1, h2 { font-size: 28px !important; line-height: 40px !important; color: #fff !important; margin-bottom: 10px !important; font-weight: 600 !important; } } .main-menu { width: 100%; } .main-menu-items { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; align-items: center; } .main-menu-items.drinks > div > div { align-items: center !important; color: var(--color-white) !important; justify-content: center; background: var(--color-darker); min-height: 100px; border-radius: var(--border-radius); font-size: 18px; display: flex; justify-content: center; padding: 20px; position: relative; } .main-menu-items > div { display: flex; flex-direction: column; gap: 0; flex: 0 0 calc(33.333% - 13.33px); position: relative; background: var(--color-darker); &:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: var(--border-radius); background: transparent; box-shadow: 0 0 0 3px var(--color-primary), 0 0 15px var(--color-primary); } & * { flex: 1; } h3 { font-size: 18px !important; text-transform: uppercase; font-weight: 600 !important; background: var(--color-darker); min-height: 90px; display: flex; align-items: center; justify-content: center; max-height: 90px; padding: 20px 15px; border-top-left-radius: var(--border-radius); border-top-right-radius: var(--border-radius); order: 1; } img { width: 100%; height: 300px; min-height: 300px; object-fit: cover; object-position: center; border-bottom-left-radius: var(--border-radius); border-bottom-right-radius: var(--border-radius); background: var(--color-darker); } img:not(.burroquieles) { order: 3; margin-top: 20px; } img.burroquieles { order: 2; margin-bottom: 20px; } div:not(.drinks-menu) { display: flex; align-items: flex-start; text-align: left; max-height: 120px; padding: 0 20px 20px 20px !important; overflow-y: auto; min-height: 120px; order: 2; background: var(--color-darker); z-index: 10; color: var(--color-white) !important; } }}@media(max-width:1350px){.content{.main-menu-items > div { flex: 0 0 calc(50% - 10px) !important; img { max-height: 300px !important; } }}}@media(max-width:1060px){.secondthird-container.main-menu-container,.third-container.about-container{padding-top:150px}}@media(max-width:999px){.secondthird-container.main-menu-container,.third-container.about-container{padding-top:90px}}@media(max-width:768px){.content{.main-menu-items > div { flex: 0 0 100% !important; img { max-height: 250px !important; } }}.third-container.menu{h1, h2 { font-size: 22px; line-height: 32px; }}}@media(max-width:480px){.secondthird-container.main-menu-container,.third-container.about-container{padding-top:90px}}.menu-celebrate{display:none}@media all and (max-width:1000px){.menu-celebrate{position:fixed;width:100%;height:max-content;top:170px;display:flex;justify-content:center;align-items:flex-end;padding-bottom:30px;background:var(--color-white)}.celebrating.menu{position:relative!important;top:unset!important;right:unset!important;margin-bottom:0!important}.celebrating.menu.no-mobile{display:none!important}}main#main .third-container.menu.about-container{.content { gap: 30px !important; } * { text-align: left !important; } & .content h1 { text-align: left !important; width: 100%; }}.catering-menu{color:var(--color-white)}.about-sections{width:100%}.catering-table{border-collapse:collapse;width:100%;max-width:600px}.catering-table thead{background-color:var(--color-primary);color:var(--color-dark)}.catering-table th,.catering-table td{border:1px solid var(--color-light-gray);padding:12px;text-align:left}.about-container.first{position:relative;overflow:hidden;.content { z-index: 20; } &:after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--color-overlay); content: ""; z-index: 0; } &:before { position: absolute; content: ""; width: 100%; height: 100%; top: 0; left: 0; background-image: url(https://aycarambaeh.ca/wp-content/themes/aycaramba/images/main-logo.svg); display: block; background-size: 180px; background-position: 0 0, 90px 90px; background-repeat: repeat; transform: rotate(-15deg) scale(1.5); transform-origin: center center; z-index: 0; }}.about-container a{color:var(--color-primary)}main#main .third-container.menu.about-container .about-sections .feature-items{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;justify-content:center;align-items:center;.center-text { text-align: center !important; } .feature { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 18px; flex-direction: column; strong { color: var(--color-primary) !important; } &:first-child svg { fill: var(--color-primary); } &:not(:first-child) svg { stroke: var(--color-primary); } svg { width: 50px; height: 50px; padding: 10px; border-radius: 100%; background: var(--color-dark) !important; } } @media (max-width: 768px) { grid-template-columns: repeat(2, 1fr); justify-items: center; .feature { text-align: center; font-size: 15px; } strong { font-size: 18px !important; } } @media (max-width: 480px) { grid-template-columns: 1fr; gap: 12px; justify-items: center; .feature { text-align: center; font-size: 13px; svg { width: 40px; height: 40px; } } strong { font-size: 15px !important; } }}.catering-container{display:flex;flex-direction:column;align-items:flex-start;gap:15px;div { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex: 1; max-width: 600px; width: 100%; background: var(--color-darker); border-radius: 10px; border-left: 10px solid var(--color-primary); padding: 20px; box-shadow: 0px 0px 20px 0px #000000; span, strong { font-size: 28px !important; } }}@media(max-width:768px){.catering-container{div { span, strong { font-size: 22px !important; } }}}html body footer#colophon{display:flex!important;flex-direction:column;align-items:center;width:100%;& > * { width: 100%; }}