/*-----------------------------------*\ #CUSTOM PROPERTY \*-----------------------------------*/ :root { /** * colors */ --selective-yellow: hsl(42, 94%, 55%); --eerie-black-1: hsl(0, 0%, 9%); --eerie-black-2: hsl(180, 3%, 7%); --quick-silver: hsl(0, 0%, 65%); --radical-red: hsl(351, 83%, 61%); --light-gray: hsl(0, 0%, 80%); --isabelline: hsl(36, 33%, 94%); --gray-x-11: hsl(0, 0%, 73%); --kappel_15: hsla(170, 75%, 41%, 0.15); --platinum: hsl(0, 0%, 90%); --gray-web: hsl(0, 0%, 50%); --black_80: hsla(0, 0%, 0%, 0.8); --white_50: hsla(0, 0%, 100%, 0.5); --black_50: hsla(0, 0%, 0%, 0.5); --black_30: hsla(0, 0%, 0%, 0.3); --kappel: hsl(170, 75%, 41%); --white: hsl(0, 0%, 100%); /** * gradient color */ --gradient: linear-gradient( -90deg, hsl(151, 58%, 46%) 0%, hsl(170, 75%, 41%) 100% ); /** * typography */ --ff-league_spartan: "League Spartan", sans-serif; --ff-poppins: "Poppins", sans-serif; --fs-1: 4.2rem; --fs-2: 3.2rem; --fs-3: 2.3rem; --fs-4: 1.8rem; --fs-5: 1.5rem; --fs-6: 1.4rem; --fs-7: 1.3rem; --fw-500: 500; --fw-600: 600; /** * spacing */ --section-padding: 75px; /** * shadow */ --shadow-1: 0 6px 15px 0 hsla(0, 0%, 0%, 0.05); --shadow-2: 0 10px 30px hsla(0, 0%, 0%, 0.06); --shadow-3: 0 10px 50px 0 hsla(220, 53%, 22%, 0.1); /** * radius */ --radius-pill: 500px; --radius-circle: 50%; --radius-3: 3px; --radius-5: 5px; --radius-10: 10px; /** * transition */ --transition-1: 0.25s ease; --transition-2: 0.5s ease; --cubic-in: cubic-bezier(0.51, 0.03, 0.64, 0.28); --cubic-out: cubic-bezier(0.33, 0.85, 0.4, 0.96); --soft-violet: hsl(273, 75%, 66%); --soft-blue: hsl(240, 73%, 65%); --soft-red: hsl(14, 88%, 65%); --very-dark-blue: hsl(238, 29%, 16%); --light-grayish-blue: hsl(240, 5%, 91%); --dark-grayish-blue: hsl(240, 6%, 50%); --very-dark-grayish-blue: hsl(237, 12%, 33%); --mobile-illustration1: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 236.85 179.57'%3E%3Cdefs%3E%3ClinearGradient id='linear-gradient' x1='1.78' y1='537.83' x2='1.58' y2='537.64' gradientTransform='matrix(52.93 0 0 -35.76 42.83 19334.13)' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%237f3500'/%3E%3Cstop offset='1' stop-color='%23231f20' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='linear-gradient-2' x1='1.82' y1='531.01' x2='1.3' y2='530.67' gradientTransform='matrix(43.55 0 0 -25.69 29.51 13785.7)' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='.03' stop-color='%237f3500'/%3E%3Cstop offset='1' stop-color='%23231f20' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='linear-gradient-3' x1='1.33' y1='520.5' x2='.74' y2='520.06' gradientTransform='matrix(26.11 0 0 -17.98 42.05 9434.58)' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23843c09' stop-opacity='.85'/%3E%3Cstop offset='1' stop-color='%23231f20' stop-opacity='0'/%3E%3C/linearGradient%3E%3ClinearGradient id='linear-gradient-4' x1='2.04' y1='537.08' x2='1.9' y2='537.14' gradientTransform='matrix(64.69 0 0 -34.67 47.7 18696.01)' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='.99' stop-color='%23dc841e'/%3E%3C/linearGradient%3E%3ClinearGradient id='linear-gradient-5' x1='1.83' y1='531.61' x2='1.31' y2='531.26' gradientTransform='matrix(43.54 0 0 -26.33 -26.72 14107.68)' xlink:href='%23linear-gradient-2'/%3E%3Cstyle%3E.cls-6%7Bfill:%2368e1fd%7D.cls-8%7Bfill:%23999a1c%7D.cls-10%7Bfill:%23f47b56%7D.cls-11%7Bfill:%23fff%7D.cls-15%7Bfill:%23f2f2f2%7D.cls-16%7Bfill:%23ff8f6f%7D.cls-17%7Bfill:%23003b94%7D.cls-18%7Bfill:%233e2928%7D%3C/style%3E%3C/defs%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Cg id='Layer_1-2' data-name='Layer 1'%3E%3Cg id='Page-1'%3E%3Cg id='Group-4'%3E%3Cg id='mention_isometric-2' data-name='mention isometric-2'%3E%3Cg id='mention_isometric' data-name='mention isometric'%3E%3Cpath id='Path' d='M114.92 177.69 4.61 112.51c-3.52-2-6.53-5.21-3.11-7.33l110.72-63.79c1.65-1 4.18-1.7 5.87-.72l115.78 67.19c3.52 2 4.15 7.72.65 9.78l-105.06 60a14.67 14.67 0 0 1-14.54.05Z' style='fill:%235b36a0'/%3E%3Cpath id='Path-Copy' d='M114.92 174.68 4.61 109.5c-3.52-2-6.53-5.21-3.11-7.33l110.72-63.79c1.65-1 4.18-1.7 5.87-.72l115.78 67.19c3.52 2 4.15 7.72.65 9.78l-105.06 60a14.67 14.67 0 0 1-14.54.05Z' style='fill:%236862e6'/%3E%3Cpath id='Path-2' data-name='Path' d='m124 88.69-21.75 12.41s33.53 20.46 40.39 23.34l12.54-18' style='fill:url(%23linear-gradient);isolation:isolate;opacity:.25'/%3E%3Cpath id='Path-3' data-name='Path' d='m116.5 148.26-21.77-12.39L73 148.29s11.34 6.92 22.18 13.27c6.82-4.87 13.72-9.79 21.32-13.3Z' style='fill:url(%23linear-gradient-2);isolation:isolate;opacity:.25'/%3E%3Cpath id='Path-4' data-name='Path' d='m69.59 71.73-13.81 7.88s1.17 7.22 8 10.11l18.11-11.58' style='opacity:.46;fill:url(%23linear-gradient-3);isolation:isolate'/%3E%3Cellipse id='Oval' class='cls-6' cx='76.35' cy='73.75' rx='8.33' ry='5.86'/%3E%3Cellipse id='Oval-2' data-name='Oval' cx='76.34' cy='70.29' rx='6.24' ry='2.55' style='fill:%23974c26'/%3E%3Cpath id='Shape' class='cls-8' d='M76.12 66c0-1.15 0-2.3-.13-3.45l-.09-.9-.06-.58a3.49 3.49 0 0 0-.09-.6l-.12-.7a27.53 27.53 0 0 0-4.45-10.89 16 16 0 0 0-1.25 6.37c0 .65.06 1.29.11 1.9v.37c0 .31.11.65.17.93a27.17 27.17 0 0 0 1 3.45 20.33 20.33 0 0 0 1.35 3c.57 1.09 1.18 2.15 1.85 3.19.51.81 1 1.53 1.49 2.22a41.69 41.69 0 0 0 .22-4.31Zm-3.28-12.91a1.14 1.14 0 0 0 0-.45c.16.16.32.33.47.5a1.24 1.24 0 0 0-.47 0Z'/%3E%3Cpath id='Shape-2' data-name='Shape' class='cls-8' d='M78.26 66.92a31.43 31.43 0 0 0 1.75-3c.15-.27.28-.53.42-.8l.26-.53.25-.55c.09-.22.19-.44.28-.65a27.49 27.49 0 0 0 2.14-11.57 15.85 15.85 0 0 0-4.5 4.69c-.34.54-.65 1.09-.94 1.65l-.13.24v.1l-.36.87a25.67 25.67 0 0 0-1 3.44 21.35 21.35 0 0 0-.5 3.27c-.11 1.22-.17 2.44-.17 3.67 0 1 0 1.83.06 2.67.8-1.12 1.66-2.29 2.44-3.5Zm4.24-12.66a1 1 0 0 0 .22-.4c0 .23.09.44.12.65a1.2 1.2 0 0 0-.34-.25Z'/%3E%3Cpath id='Shape-3' data-name='Shape' class='cls-8' d='M78.21 69.79c.65-.33 1.29-.67 1.93-1.05l.49-.29.31-.2.31-.22.36-.26a17.36 17.36 0 0 0 4.89-5.55 10.2 10.2 0 0 0-3.94 1.08c-.35.18-.69.38-1 .59l-.15.09-.48.36a16 16 0 0 0-1.67 1.52 14.38 14.38 0 0 0-1.32 1.6c-.46.65-.88 1.29-1.29 1.93s-.58 1-.83 1.47c.75-.31 1.58-.67 2.39-1.07Zm6.38-5.47a.77.77 0 0 0 .25-.14c0 .14-.1.27-.16.4a.58.58 0 0 0-.09-.25Z'/%3E%3Cpath id='Shape-4' data-name='Shape' class='cls-8' d='M76.12 66c0-1.15 0-2.3-.13-3.45l-.09-.9-.06-.58a3.49 3.49 0 0 0-.09-.6l-.12-.7a27.53 27.53 0 0 0-4.45-10.89 16 16 0 0 0-1.25 6.37c0 .65.06 1.29.11 1.9v.37c0 .31.11.65.17.93a27.17 27.17 0 0 0 1 3.45 20.33 20.33 0 0 0 1.35 3c.57 1.09 1.18 2.15 1.85 3.19.51.81 1 1.53 1.49 2.22a41.69 41.69 0 0 0 .22-4.31Zm-3.28-12.91a1.14 1.14 0 0 0 0-.45c.16.16.32.33.47.5a1.24 1.24 0 0 0-.47 0Z'/%3E%3Cpath id='Shape-5' data-name='Shape' class='cls-8' d='M78.26 66.92a31.43 31.43 0 0 0 1.75-3c.15-.27.28-.53.42-.8l.26-.53.25-.55c.09-.22.19-.44.28-.65a27.49 27.49 0 0 0 2.14-11.57 15.85 15.85 0 0 0-4.5 4.69c-.34.54-.65 1.09-.94 1.65l-.13.24v.1l-.36.87a25.67 25.67 0 0 0-1 3.44 21.35 21.35 0 0 0-.5 3.27c-.11 1.22-.17 2.44-.17 3.67 0 1 0 1.83.06 2.67.8-1.12 1.66-2.29 2.44-3.5Zm4.24-12.66a1 1 0 0 0 .22-.4c0 .23.09.44.12.65a1.2 1.2 0 0 0-.34-.25Z'/%3E%3Cpath id='Shape-6' data-name='Shape' class='cls-8' d='M78.21 69.79c.65-.33 1.29-.67 1.93-1.05l.49-.29.31-.2.31-.22.36-.26a17.36 17.36 0 0 0 4.89-5.55 10.2 10.2 0 0 0-3.94 1.08c-.35.18-.69.38-1 .59l-.15.09-.48.36a16 16 0 0 0-1.67 1.52 14.38 14.38 0 0 0-1.32 1.6c-.46.65-.88 1.29-1.29 1.93s-.58 1-.83 1.47c.75-.31 1.58-.67 2.39-1.07Zm6.38-5.47a.77.77 0 0 0 .25-.14c0 .14-.1.27-.16.4a.58.58 0 0 0-.09-.25Z'/%3E%3Cpath id='Path-5' data-name='Path' d='m132.66 83.84-12 5.79a2.75 2.75 0 0 0-1.61 2.37 2.79 2.79 0 0 0 1.37 2.51L149 111.18a2.77 2.77 0 0 0 3.73-.9l6.94-10.79' style='fill:%23a1482d'/%3E%3Cpath id='Path-6' data-name='Path' class='cls-10' d='M198.19 55.92 102.12.58a4.33 4.33 0 0 0-6.49 3.75v57.58a3.59 3.59 0 0 0 1.8 3.09l102.42 59.1a2.31 2.31 0 0 0 3.48-2V64.78a10.21 10.21 0 0 0-5.14-8.86Z'/%3E%3Cpath id='Path-7' data-name='Path' class='cls-11' d='m102.13 4.93 93.17 53.59a6.54 6.54 0 0 1 3.27 5.66v43.16a2.36 2.36 0 0 1-3.53 2L100 54.9a2.34 2.34 0 0 1-1.18-2V6.83a2.2 2.2 0 0 1 3.28-1.9Z'/%3E%3Cellipse id='Oval-3' data-name='Oval' cx='140.89' cy='84.06' rx='2.03' ry='2.32' transform='rotate(-10.9 140.901 84.042)' style='fill:%23ab643c'/%3E%3Cpath id='Path-8' data-name='Path' style='opacity:.32;fill:url(%23linear-gradient-4);isolation:isolate' d='m127.17 63.48 43.3 26.01 21.39-12.43-38.22-22.24'/%3E%3Cpath id='Path-9' data-name='Path' d='m180.68 58.31-46.81-28.54a1.62 1.62 0 0 0-2.43 1.46v16.26a1.69 1.69 0 0 0 .81 1.47l46.81 27.93a1.62 1.62 0 0 0 1.61 0 1.64 1.64 0 0 0 .8-1.4l.24-15.16a2.27 2.27 0 0 0-1.03-2.02Z' style='fill:%23e2ac00'/%3E%3Cpath id='Path-10' data-name='Path' class='cls-11' d='M169.48 66.67c1.68 2.35 4.63 3 6.58 1.48s2.19-4.68.51-7-4.63-3-6.59-1.47-2.18 4.65-.5 6.99Z'/%3E%3Cpath id='Path-11' data-name='Path' class='cls-15' d='m164.89 55.41-19.1-11.5a.73.73 0 0 0-.73 1.25l19.09 11.49a.73.73 0 0 0 .74-1.24Z'/%3E%3Cpath id='Path-12' data-name='Path' class='cls-15' d='m164.1 60.08-26.32-15.84a.72.72 0 0 0-.87.33.72.72 0 0 0 .17.91l26.29 15.85a.72.72 0 0 0 .93-.29.73.73 0 0 0-.2-1Z'/%3E%3Cpath id='Path-13' data-name='Path' class='cls-10' d='m171.34 61.46-46.79-28.53a1.62 1.62 0 0 0-2.43 1.46v16.25a1.69 1.69 0 0 0 .81 1.47L169.74 80a1.6 1.6 0 0 0 2.41-1.44l.25-15.15a2.28 2.28 0 0 0-1.06-2Z'/%3E%3Cpath id='Path-14' data-name='Path' class='cls-11' d='M160.14 69.83c1.68 2.34 4.63 3 6.58 1.47s2.19-4.68.51-7-4.63-3-6.59-1.47-2.18 4.65-.5 7Z'/%3E%3Cpath id='Path-15' data-name='Path' class='cls-15' d='m155.54 58.56-19.1-11.49a.72.72 0 0 0-.73 1.24l19.09 11.5a.73.73 0 0 0 .93-.29.72.72 0 0 0-.2-1Z'/%3E%3Cpath id='Path-16' data-name='Path' class='cls-15' d='m154.75 63.26-26.31-15.87a.72.72 0 0 0-.93.29.73.73 0 0 0 .2 1L154 64.48a.72.72 0 0 0 .93-.29.73.73 0 0 0-.2-1Z'/%3E%3Cpath id='Path-17' data-name='Path' class='cls-6' d='m159.6 63.37-46.8-28.52a1.61 1.61 0 0 0-2.43 1.46v16.25a1.7 1.7 0 0 0 .82 1.46L158 82a1.61 1.61 0 0 0 2.42-1.44l.24-15.15a2.3 2.3 0 0 0-1.05-2Z'/%3E%3Cpath id='Path-18' data-name='Path' class='cls-6' d='m159.6 63.37-46.8-28.52a1.61 1.61 0 0 0-2.43 1.46v16.25a1.7 1.7 0 0 0 .82 1.46L158 82a1.61 1.61 0 0 0 2.42-1.44l.24-15.15a2.3 2.3 0 0 0-1.05-2Z'/%3E%3Cpath id='Path-19' data-name='Path' class='cls-11' d='M148.39 71.74c1.68 2.35 4.63 3 6.59 1.47s2.18-4.67.5-7-4.63-3-6.59-1.47-2.16 4.65-.5 7Z'/%3E%3Cpath id='Path-20' data-name='Path' class='cls-15' d='M143.8 60.47 124.7 49a.73.73 0 0 0-.73 1.25l19.09 11.49a.71.71 0 0 0 .93-.29.72.72 0 0 0-.2-1Z'/%3E%3Cpath id='Path-21' data-name='Path' class='cls-15' d='m143 65.15-26.31-15.84a.73.73 0 0 0-.73 1.25l26.31 15.84a.73.73 0 0 0 .74-1.25Z'/%3E%3Cpath id='Path-22' data-name='Path' class='cls-16' d='M98.18 61.78a22.75 22.75 0 0 0-6.63 9.72C89.22 77.93 95 88.44 95 88.44l9.06-7.17'/%3E%3Cpath id='Path-23' data-name='Path' class='cls-17' d='m97.2 146.8-2.46-1.35.65-3.52s3.66.35 4 1.65'/%3E%3Cpath id='Path-24' data-name='Path' class='cls-10' d='M98.1 146.75c.56-.34 1.13-.64 1.71-.94 1.42-.78 3.47-1.59 4.35-3.05a1.69 1.69 0 0 0-.12-1.92c-1.29-1.56-4.1 1-5.55-.73-.28-.34-.41-5.74-.41-5.74l-5.48 1.47s-.93 10.87-.83 11.54 2 1.29 2 1.29a4.76 4.76 0 0 0 1.58-.65c.58-.41 0-5.51.79-4.8s1.05 3.51 1.05 3.51a4.06 4.06 0 0 0 .91.02Z'/%3E%3Cpath id='Path-25' data-name='Path' class='cls-17' d='m107.67 152.06-2.46-1.34.64-3.51s3.66.35 4 1.64'/%3E%3Cpath id='Path-26' data-name='Path' class='cls-10' d='M108.59 152c.56-.35 1.14-.65 1.71-.95 1.42-.78 3.47-1.58 4.35-3a1.71 1.71 0 0 0-.12-1.93c-1.29-1.56-4.1 1-5.54-.72-.29-.34-.42-5.75-.42-5.75l-5.48 1.48s-.94 10.91-.83 11.55 2 1.28 2 1.28a4.62 4.62 0 0 0 1.58-.64c.57-.42 0-5.52.78-4.8s1.06 3.5 1.06 3.5a3.54 3.54 0 0 0 .91-.02Z'/%3E%3Cpath id='Path-27' data-name='Path' class='cls-18' d='m89.81 116.73-1.61 21.58s2.57 3.55 11.2 1.58l.08-14.55'/%3E%3Cpath id='Path-28' data-name='Path' class='cls-18' d='M99.77 121c-.18 1.86 0 22.36 0 22.36s2.39 4.47 12.78 0l-.15-17.42'/%3E%3Cpath id='Path-29' data-name='Path' class='cls-18' d='M89 123.86c.7.49.95-2 1.69-1.6a41.51 41.51 0 0 0 8.53 3.74h.06a.61.61 0 0 1 .46 0 .58.58 0 0 1 .33.32 46.18 46.18 0 0 0 5.59 1.28c2.43.39 4.43-1.4 6.92-1.53 0-9.53 0-36.65-4-42.44l-12-4c-.06 1-5.83 7.68-5.69 15.83a183.16 183.16 0 0 1-1.24 20.74c-.05.44-.65 7.14-.65 7.66Z'/%3E%3Cpath id='Path-30' data-name='Path' class='cls-16' d='m109.67 72.66-1.1 10.93s-9 .36-12.82-2.3V72'/%3E%3Cpath id='Path-31' data-name='Path' d='m121.07 65.46-.92 1.25a28.42 28.42 0 0 0 1.29-3.12c.26-.72-.91-1-1.16-.29l-.14.38c.11-.39.22-.78.32-1.17a.6.6 0 0 0-1.17-.29 28.59 28.59 0 0 1-.91 3 21.36 21.36 0 0 0 .43-2.64c.08-.76-1.13-.73-1.2 0a18.93 18.93 0 0 1-.54 3 6.06 6.06 0 0 0-.09-1 .6.6 0 0 0-.26-.43c0-.13-.07-.26-.11-.4a.62.62 0 0 0-.67-.4.6.6 0 0 0-.51.58l-.08 4.5a5.21 5.21 0 0 1-.84 1.29 19 19 0 0 1 1.67 1.28 16.59 16.59 0 0 1 1.37 1.28c.38-.48.75-1 1.11-1.46l.12-.13q1.6-2.39 3.32-4.68c.47-.57-.58-1.16-1.03-.55Z' style='fill:%23ffb5a9'/%3E%3Cpath id='Path-32' data-name='Path' class='cls-16' d='M104 62.69s4.23 1.14 6 3.86a48.49 48.49 0 0 1 2.83 5.85l3.13-4.86s3.8 1.17 5.3 3c0 0-4.5 9.84-8.43 10.68s-8.09-5.77-8.09-5.77-.86 2.76-.69-.19'/%3E%3Cpath id='Path-33' data-name='Path' d='M106.68 73.21a8.68 8.68 0 0 1-2.68-3.82c-.5-1.73.13-3.25.72-4.86a15.32 15.32 0 0 0 1.11-5 50.08 50.08 0 0 0-.26-5 .81.81 0 0 1 0-.22c-.56-1.9-1.72-3.51-4-3.7-5.91-.5-6.25 6-6.2 8.71s.32 4.46-1.64 5.57-3.38 4-1.5 6.4.19 1.49-1.06 3.59-.92 4.71 1.64 5.66 14.46-.83 15.55-1.93a2.26 2.26 0 0 0 .56-1.61 6.24 6.24 0 0 0-2.23-3.75Z' style='fill:%23007f68'/%3E%3Cpath id='Shape-7' data-name='Shape' class='cls-10' d='M112.49 19.21a9.47 9.47 0 0 1 1.67 4.89 3.18 3.18 0 0 1-.54 2.28 1.33 1.33 0 0 1-1.6.28 2.51 2.51 0 0 1-.86-.58 2.89 2.89 0 0 1-.55-.7l-.16-.3a1.07 1.07 0 0 1-.15.22 1.18 1.18 0 0 1-.53.22 1.63 1.63 0 0 1-1-.11 3.64 3.64 0 0 1-1.69-1.51 4.84 4.84 0 0 1-.74-2.44 2.36 2.36 0 0 1 .6-1.93 1.39 1.39 0 0 1 1.56-.25 2.67 2.67 0 0 1 .7.44 2.47 2.47 0 0 1 .46.51l.12.21v-.58l1.29.5.12 3.62a1.38 1.38 0 0 0 .24.73 1.19 1.19 0 0 0 .52.47c.62.24.91-.3.87-1.61a7 7 0 0 0-1.25-3.64 6 6 0 0 0-2.85-2.43 2.41 2.41 0 0 0-2.67.34 3.67 3.67 0 0 0-1 3 7.69 7.69 0 0 0 1.29 3.85 5.88 5.88 0 0 0 2.75 2.58 3.28 3.28 0 0 0 1.28.25 1.73 1.73 0 0 0 .84-.16l.26-.14.77 1.45-.12.09a3.26 3.26 0 0 1-.38.18 2.52 2.52 0 0 1-.65.18 3 3 0 0 1-.85 0 4.48 4.48 0 0 1-1.09-.28 7 7 0 0 1-2.57-1.89 11.1 11.1 0 0 1-2-3.11 9.58 9.58 0 0 1-.82-3.46 5.51 5.51 0 0 1 .59-2.9 3.24 3.24 0 0 1 1.83-1.6 3.46 3.46 0 0 1 2.53.13 8.16 8.16 0 0 1 3.77 3.22Zm-2.83 4.58a1.32 1.32 0 0 0 .26-1 2.55 2.55 0 0 0-.34-1.19 1.66 1.66 0 0 0-.78-.7.68.68 0 0 0-.79.1 1.14 1.14 0 0 0-.28.93 2.41 2.41 0 0 0 .36 1.2 1.71 1.71 0 0 0 .82.73.65.65 0 0 0 .75-.11'/%3E%3Cpath id='Shape-8' data-name='Shape' class='cls-10' d='M188.44 88.85a9.41 9.41 0 0 1 1.67 4.89 3.19 3.19 0 0 1-.54 2.28 1.33 1.33 0 0 1-1.6.27 2.49 2.49 0 0 1-.86-.57 3.14 3.14 0 0 1-.55-.71l-.16-.3a1.07 1.07 0 0 1-.15.22 1.19 1.19 0 0 1-.53.23 1.63 1.63 0 0 1-.95-.11 3.6 3.6 0 0 1-1.68-1.52 4.73 4.73 0 0 1-.75-2.44 2.38 2.38 0 0 1 .59-1.93 1.37 1.37 0 0 1 1.56-.25 2.13 2.13 0 0 1 .7.44 2.85 2.85 0 0 1 .47.51l.12.21v-.57l1.28.49.13 3.62a1.43 1.43 0 0 0 .23.72 1.15 1.15 0 0 0 .53.47c.65.25.91-.29.87-1.61a6.88 6.88 0 0 0-1.24-3.63 6.11 6.11 0 0 0-2.84-2.43 2.42 2.42 0 0 0-2.68.33 3.67 3.67 0 0 0-1 3 7.6 7.6 0 0 0 1.29 3.85 5.9 5.9 0 0 0 2.78 2.49 3.29 3.29 0 0 0 1.28.26 1.85 1.85 0 0 0 .84-.15l.26-.15.77 1.45-.12.09a3.26 3.26 0 0 1-.38.18 2.52 2.52 0 0 1-.65.18 3.1 3.1 0 0 1-.86 0 4.52 4.52 0 0 1-1.08-.28 7.07 7.07 0 0 1-2.57-1.89 11 11 0 0 1-2-3.12 9.33 9.33 0 0 1-.82-3.45 5.46 5.46 0 0 1 .59-2.89 3.31 3.31 0 0 1 1.83-1.62 3.59 3.59 0 0 1 2.54.13 8.22 8.22 0 0 1 3.68 3.31Zm-2.84 4.57a1.26 1.26 0 0 0 .27-1 2.48 2.48 0 0 0-.34-1.19 1.61 1.61 0 0 0-.77-.71.71.71 0 0 0-.8.1 1.2 1.2 0 0 0-.29.93 2.52 2.52 0 0 0 .37 1.19 1.73 1.73 0 0 0 .82.74.64.64 0 0 0 .74-.11'/%3E%3Cpath id='Path-34' data-name='Path' d='m60.25 116.27-21.77-12.39-21.77 12.41s12.11 7.57 22.95 13.92c6.89-4.86 13-10.42 20.59-13.94Z' style='fill:url(%23linear-gradient-5);isolation:isolate;opacity:.25'/%3E%3C/g%3E%3C/g%3E%3Cpath id='path-6-2' data-name='path-6' style='fill-rule:evenodd' d='M20.93 81.47v26.94l20.98 12.01 23.7-14.01V79.48'/%3E%3Cpath id='path-6-3' data-name='path-6' style='fill:%23ff9271;fill-rule:evenodd' d='M20.93 81.47v26.94l20.98 12.01 23.7-14.01V79.48'/%3E%3Cpath id='Path-35' data-name='Path' style='fill:%23df5c34' d='M41.91 93.49v26.93l23.7-14.01V79.48l-23.7 14.01z'/%3E%3Cpath id='Path-36' data-name='Path' class='cls-10' d='m20.93 81.47 24.35-13.88 20.33 11.89-23.7 14.01-20.98-12.02z'/%3E%3Cpath id='Shape-9' data-name='Shape' class='cls-18' d='M42.47 73.78a12.91 12.91 0 0 1 7.1 1.56c1.25.73 1.93 1.49 2 2.29a2.1 2.1 0 0 1-1.28 2.07 4.69 4.69 0 0 1-1.49.59 5.42 5.42 0 0 1-1.33.14h-.48a1.89 1.89 0 0 1 .09.34 1.64 1.64 0 0 1-.26.77 2.91 2.91 0 0 1-1.05 1 6.34 6.34 0 0 1-3.35.88 6.63 6.63 0 0 1-3.42-.88 2.64 2.64 0 0 1-1.55-2.08 2.25 2.25 0 0 1 1.28-2 4.26 4.26 0 0 1 1.14-.46 4.35 4.35 0 0 1 1-.17h.35l-.64-.39 1.8-1.12 4.17 2.46a2.19 2.19 0 0 0 2.08 0c.88-.56.56-1.28-.95-2.18a9.63 9.63 0 0 0-5.28-1.17A10.81 10.81 0 0 0 36.91 77c-1.51 1-2.26 2.07-2.25 3.38s.8 2.43 2.36 3.34A10.53 10.53 0 0 0 42.59 85a10.46 10.46 0 0 0 5.51-1.46 6.28 6.28 0 0 0 1.53-1.28 2.94 2.94 0 0 0 .64-1.09l.09-.41 2.38.14v.21a5.54 5.54 0 0 1-.17.58 5.22 5.22 0 0 1-.41.86 6.25 6.25 0 0 1-.85 1 8 8 0 0 1-1.38 1.07 12.92 12.92 0 0 1-4.66 1.68 17.72 17.72 0 0 1-5.44.09 12.46 12.46 0 0 1-4.67-1.52 6.12 6.12 0 0 1-2.65-2.79 4.09 4.09 0 0 1 0-3.29 6.28 6.28 0 0 1 2.63-2.88 14.41 14.41 0 0 1 7.33-2.14Zm2.33 6.63a1.34 1.34 0 0 0-.8-1 3.24 3.24 0 0 0-1.66-.41 2.79 2.79 0 0 0-1.55.4 1.13 1.13 0 0 0-.64 1 1.27 1.27 0 0 0 .75 1 3.36 3.36 0 0 0 1.7.43 3.13 3.13 0 0 0 1.63-.43 1 1 0 0 0 .6-1'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); --mobile-illustration2: url("data:image/svg+xml,%3Csvg width='240' height='104' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M116.454 102.048L4.667 34.239c-3.56-2.054-6.61-5.42-3.142-7.627l112.184-66.364c1.682-1.07 4.237-1.773 5.951-.75l117.328 69.904c3.559 2.12 4.198 8.028.652 10.17L131.185 101.94a14.53 14.53 0 01-14.731.107z' fill='%236862E6' fill-rule='nonzero' opacity='.099'/%3E%3C/svg%3E"); --desktop-illustration1: url("data:image/svg+xml,%3Csvg width='472' height='359' xmlns='http://www.w3.org/2000/svg'%3E%3Cdefs%3E%3ClinearGradient x1='61.181%25' y1='36.82%25' x2='40.788%25' y2='55.54%25' id='a'%3E%3Cstop stop-color='%2378B46A' offset='0%25'/%3E%3Cstop stop-color='%237F3500' offset='3%25'/%3E%3Cstop stop-color='%23FFF' offset='100%25'/%3E%3C/linearGradient%3E%3ClinearGradient x1='82.186%25' y1='28.519%25' x2='29.852%25' y2='62.464%25' id='b'%3E%3Cstop stop-color='%2378B46A' offset='0%25'/%3E%3Cstop stop-color='%237F3500' offset='3%25'/%3E%3Cstop stop-color='%23FFF' offset='100%25'/%3E%3C/linearGradient%3E%3ClinearGradient x1='80.66%25' y1='21.864%25' x2='21.557%25' y2='66.62%25' id='c'%3E%3Cstop stop-color='%2378B46A' offset='0%25'/%3E%3Cstop stop-color='%237F3500' offset='3%25'/%3E%3Cstop stop-color='%23FFF' offset='100%25'/%3E%3C/linearGradient%3E%3ClinearGradient x1='81.016%25' y1='60.589%25' x2='67.462%25' y2='55.277%25' id='d'%3E%3Cstop stop-color='%23FFF' stop-opacity='0' offset='0%25'/%3E%3Cstop stop-color='%23DC841E' offset='99%25'/%3E%3C/linearGradient%3E%3ClinearGradient x1='82.183%25' y1='27.537%25' x2='29.857%25' y2='62.324%25' id='e'%3E%3Cstop stop-color='%2378B46A' offset='0%25'/%3E%3Cstop stop-color='%237F3500' offset='3%25'/%3E%3Cstop stop-color='%23FFF' offset='100%25'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill-rule='nonzero' fill='none'%3E%3Cpath d='M229.018 355.203L9.313 225.211c-6.995-3.938-12.99-10.39-6.175-14.622L223.625 83.367c3.305-2.052 8.327-3.399 11.696-1.437l230.595 134.007c6.994 4.066 8.25 15.392 1.28 19.496L257.972 354.998a29.178 29.178 0 01-28.953.205z' fill='%235B36A0'/%3E%3Cpath d='M229.018 349.203L9.313 219.211c-6.995-3.938-12.99-10.39-6.175-14.622L223.625 77.367c3.305-2.052 8.327-3.399 11.696-1.437l230.595 134.007c6.994 4.066 8.25 15.392 1.28 19.496L257.972 348.998a29.178 29.178 0 01-28.953.205z' fill='%236862E6'/%3E%3Cpath d='M247.133 177.693L203.78 202.46s66.783 40.8 80.439 46.546l24.968-35.913' fill='url(%23a)' opacity='.25' style='mix-blend-mode:multiply'/%3E%3Cpath d='M232.157 296.513l-43.365-24.715-43.364 24.767s22.585 13.8 44.171 26.473c13.708-9.71 27.428-19.521 42.558-26.525z' fill='url(%23b)' opacity='.25' style='mix-blend-mode:multiply'/%3E%3Cpath d='M138.728 143.883l-27.505 15.712s2.331 14.404 15.988 20.15l36.01-23.087' fill='url(%23c)' opacity='.46' style='mix-blend-mode:multiply'/%3E%3Cellipse fill='%2368E1FD' cx='152.192' cy='147.898' rx='16.59' ry='11.697'/%3E%3Cellipse fill='%23974C26' cx='152.179' cy='140.997' rx='12.426' ry='5.092'/%3E%3Cpath d='M151.73 132.506c0-2.296-.076-4.591-.256-6.887-.051-.599-.106-1.193-.166-1.783l-.128-1.167c0-.347-.18-1.283-.18-1.193-.077-.47-.158-.936-.243-1.398a54.855 54.855 0 00-8.865-21.715 31.778 31.778 0 00-2.473 12.71c0 1.284.103 2.566.205 3.772v.757c.103.615.218 1.282.346 1.846a50.222 50.222 0 001.96 6.888 41.928 41.928 0 002.678 6.003 82.454 82.454 0 003.676 6.349 90.88 90.88 0 002.985 4.425c.308-2.86.449-5.734.461-8.607zm-6.52-25.819a2.067 2.067 0 000-.897c.316.324.628.658.935 1a2.84 2.84 0 00-.948-.103h.013z' fill='%23999A1C'/%3E%3Cpath d='M155.996 134.276a65.015 65.015 0 003.498-5.938c.282-.53.555-1.06.82-1.59l.525-1.065.5-1.103.55-1.283a54.876 54.876 0 004.266-23.087 31.728 31.728 0 00-8.967 9.363 45.938 45.938 0 00-1.858 3.284l-.256.474-.064.206c-.243.577-.487 1.154-.717 1.744a50.22 50.22 0 00-2.063 6.862 41.95 41.95 0 00-.986 6.503 77.621 77.621 0 00-.333 7.323c0 1.911 0 3.656.115 5.336 1.704-2.27 3.42-4.605 4.97-7.029zm8.456-25.254c.2-.226.349-.493.435-.783.094.445.175.873.244 1.283-.2-.2-.43-.368-.68-.5z' fill='%23999A1C'/%3E%3Cpath d='M155.907 139.997a64.687 64.687 0 003.843-2.078l.96-.59.629-.398.615-.436.717-.526a34.464 34.464 0 009.736-11.069 19.928 19.928 0 00-7.84 2.168c-.705.36-1.384.757-2.063 1.167l-.294.18-.103.09-.948.705a31.541 31.541 0 00-3.33 3.04 26.351 26.351 0 00-2.627 3.193 83.516 83.516 0 00-2.562 3.848 55.792 55.792 0 00-1.653 2.925c1.653-.693 3.306-1.411 4.92-2.22zm12.708-10.902a1.28 1.28 0 00.487-.283c-.094.274-.196.543-.308.808a1.797 1.797 0 00-.179-.513v-.012zM151.73 132.506c0-2.296-.076-4.591-.256-6.887-.051-.599-.106-1.193-.166-1.783l-.128-1.167c0-.347-.18-1.283-.18-1.193-.077-.47-.158-.936-.243-1.398a54.855 54.855 0 00-8.865-21.715 31.778 31.778 0 00-2.473 12.71c0 1.284.103 2.566.205 3.772v.757c.103.615.218 1.282.346 1.846a50.222 50.222 0 001.96 6.888 41.928 41.928 0 002.678 6.003 82.454 82.454 0 003.676 6.349 90.88 90.88 0 002.985 4.425c.308-2.86.449-5.734.461-8.607zm-6.52-25.819a2.067 2.067 0 000-.897c.316.324.628.658.935 1a2.84 2.84 0 00-.948-.103h.013z' fill='%23999A1C'/%3E%3Cpath d='M155.996 134.276a65.015 65.015 0 003.498-5.938c.282-.53.555-1.06.82-1.59l.525-1.065.5-1.103.55-1.283a54.876 54.876 0 004.266-23.087 31.728 31.728 0 00-8.967 9.363 45.938 45.938 0 00-1.858 3.284l-.256.474-.064.206c-.243.577-.487 1.154-.717 1.744a50.22 50.22 0 00-2.063 6.862 41.95 41.95 0 00-.986 6.503 77.621 77.621 0 00-.333 7.323c0 1.911 0 3.656.115 5.336 1.704-2.27 3.42-4.605 4.97-7.029zm8.456-25.254c.2-.226.349-.493.435-.783.094.445.175.873.244 1.283-.2-.2-.43-.368-.68-.5z' fill='%23999A1C'/%3E%3Cpath d='M155.907 139.997a64.687 64.687 0 003.843-2.078l.96-.59.629-.398.615-.436.717-.526a34.464 34.464 0 009.736-11.069 19.928 19.928 0 00-7.84 2.168c-.705.36-1.384.757-2.063 1.167l-.294.18-.103.09-.948.705a31.541 31.541 0 00-3.33 3.04 26.351 26.351 0 00-2.627 3.193 83.516 83.516 0 00-2.562 3.848 55.792 55.792 0 00-1.653 2.925c1.653-.693 3.306-1.411 4.92-2.22zm12.708-10.902a1.28 1.28 0 00.487-.283c-.094.274-.196.543-.308.808a1.797 1.797 0 00-.179-.513v-.012z' fill='%23999A1C'/%3E%3Cpath d='M264.35 168.022l-23.994 11.543a5.53 5.53 0 00-.384 9.76l56.867 33.22a5.518 5.518 0 007.43-1.782l13.823-21.523' fill='%23A1482D'/%3E%3Cpath d='M394.854 112.344L203.524 1.962a8.626 8.626 0 00-8.626.01 8.644 8.644 0 00-4.312 7.48v114.833a7.184 7.184 0 003.587 6.22L398.146 248.39a4.62 4.62 0 004.632.003 4.631 4.631 0 002.312-4.018V130.018a20.398 20.398 0 00-10.236-17.674z' fill='%23F47B56'/%3E%3Cpath d='M203.537 10.646l185.552 106.88a13.034 13.034 0 016.52 11.286v86.076a4.708 4.708 0 01-2.344 4.065 4.697 4.697 0 01-4.688.014L199.348 110.304a4.643 4.643 0 01-2.331-4.027V14.429c0-1.555.827-2.992 2.171-3.772a4.351 4.351 0 014.35-.011z' fill='%23FFF'/%3E%3Cellipse fill='%23AB643C' transform='rotate(-10.9 280.738 168.465)' cx='280.738' cy='168.465' rx='4.036' ry='4.617'/%3E%3Cpath fill='url(%23d)' opacity='.32' d='M253.41 127.427l86.23 51.869 42.595-24.793-76.109-44.353'/%3E%3Cpath d='M359.97 117.102l-93.224-56.91a3.225 3.225 0 00-3.278.028 3.233 3.233 0 00-1.565 2.884V95.53a3.4 3.4 0 001.627 2.924l93.212 55.704c.997.567 2.22.56 3.21-.02a3.22 3.22 0 001.594-2.79l.487-30.23a4.542 4.542 0 00-2.063-4.015z' fill='%23E2AC00'/%3E%3Cpath d='M337.667 133.789c3.343 4.681 9.223 5.99 13.118 2.937 3.894-3.053 4.343-9.324 1-13.993-3.345-4.669-9.225-5.99-13.12-2.937-3.894 3.052-4.342 9.311-.998 13.993z' fill='%23FFF'/%3E%3Cpath d='M328.52 111.318l-38.023-22.92a1.447 1.447 0 00-1.862.578 1.45 1.45 0 00.402 1.91l38.022 22.92a1.447 1.447 0 001.862-.578 1.45 1.45 0 00-.401-1.91zM326.957 120.63l-52.41-31.591a1.45 1.45 0 00-1.396 2.488l52.345 31.603a1.447 1.447 0 001.862-.578 1.45 1.45 0 00-.401-1.91v-.013z' fill='%23F2F2F2'/%3E%3Cpath d='M341.369 123.387L248.196 66.49a3.225 3.225 0 00-3.278.028 3.233 3.233 0 00-1.565 2.884v32.411a3.4 3.4 0 001.615 2.938l93.211 55.703c1.008.58 2.25.57 3.248-.025a3.22 3.22 0 001.569-2.848l.487-30.23a4.542 4.542 0 00-2.114-3.964z' fill='%23F47B56'/%3E%3Cpath d='M319.065 140.074c3.344 4.681 9.224 5.99 13.119 2.937 3.894-3.053 4.342-9.325.999-13.993-3.344-4.67-9.224-5.99-13.118-2.938-3.895 3.053-4.343 9.312-1 13.994z' fill='%23FFF'/%3E%3Cpath d='M309.918 117.602l-38.048-22.92a1.447 1.447 0 00-1.862.578 1.45 1.45 0 00.402 1.91l38.022 22.92a1.447 1.447 0 001.862-.578 1.45 1.45 0 00-.401-1.91h.025zM308.343 126.978l-52.397-31.642a1.447 1.447 0 00-1.862.579 1.45 1.45 0 00.402 1.91l52.409 31.59a1.447 1.447 0 001.862-.578 1.45 1.45 0 00-.402-1.91l-.012.051z' fill='%23F2F2F2'/%3E%3Cpath d='M317.99 127.21l-93.2-56.897a3.225 3.225 0 00-3.278.027 3.233 3.233 0 00-1.564 2.884v32.412a3.4 3.4 0 001.627 2.924l93.211 55.704c1.008.58 2.25.57 3.249-.026a3.22 3.22 0 001.568-2.847l.487-30.231a4.542 4.542 0 00-2.1-3.95z' fill='%2368E1FD'/%3E%3Cpath d='M317.99 127.21l-93.2-56.897a3.225 3.225 0 00-3.278.027 3.233 3.233 0 00-1.564 2.884v32.412a3.4 3.4 0 001.627 2.924l93.211 55.704c1.008.58 2.25.57 3.249-.026a3.22 3.22 0 001.568-2.847l.487-30.231a4.542 4.542 0 00-2.1-3.95z' fill='%2368E1FD'/%3E%3Cpath d='M295.673 143.896c3.343 4.681 9.224 5.99 13.118 2.937 3.895-3.053 4.343-9.325 1-13.993-3.344-4.669-9.225-5.99-13.119-2.937-3.894 3.052-4.304 9.311-1 13.993z' fill='%23FFF'/%3E%3Cpath d='M286.526 121.425l-38.035-22.92a1.447 1.447 0 00-1.862.578 1.45 1.45 0 00.401 1.91l38.023 22.92a1.447 1.447 0 001.862-.578 1.45 1.45 0 00-.402-1.91h.013zM284.95 130.75l-52.409-31.592a1.447 1.447 0 00-1.862.579 1.45 1.45 0 00.402 1.91l52.409 31.59a1.447 1.447 0 001.862-.578 1.45 1.45 0 00-.402-1.91z' fill='%23F2F2F2'/%3E%3Cpath d='M195.672 124.028a45.406 45.406 0 00-13.208 19.38c-4.638 12.827 6.956 33.784 6.956 33.784l18.038-14.3' fill='%23FF8F6F'/%3E%3Cpath d='M193.724 293.602l-4.893-2.706 1.28-7.003s7.29.692 7.93 3.283' fill='%23003B94'/%3E%3Cpath d='M195.518 293.5c1.102-.68 2.255-1.283 3.395-1.886 2.83-1.552 6.918-3.155 8.66-6.067a3.39 3.39 0 00-.23-3.848c-2.563-3.104-8.174 2.001-11.044-1.436-.563-.68-.832-11.467-.832-11.467l-10.915 2.95s-1.845 21.676-1.64 23.01c.205 1.334 3.959 2.566 3.959 2.566a9.666 9.666 0 003.151-1.283c1.14-.834.102-11.005 1.563-9.581 1.46 1.424 2.1 6.99 2.1 6.99.607.092 1.222.11 1.833.051z' fill='%23F47B56'/%3E%3Cpath d='M214.568 304.08l-4.894-2.667 1.28-7.003s7.29.693 7.93 3.283' fill='%23003B94'/%3E%3Cpath d='M216.412 303.978c1.102-.68 2.255-1.282 3.395-1.885 2.831-1.552 6.918-3.155 8.66-6.067a3.39 3.39 0 00-.23-3.848c-2.563-3.104-8.174 2.001-11.043-1.436-.564-.68-.833-11.467-.833-11.467l-10.915 2.95s-1.857 21.753-1.652 23.036c.205 1.282 3.958 2.565 3.958 2.565a9.666 9.666 0 003.152-1.283c1.14-.833.102-11.004 1.563-9.58 1.46 1.423 2.1 6.99 2.1 6.99a7.498 7.498 0 001.845.025z' fill='%23F47B56'/%3E%3Cpath d='M179.005 233.614l-3.216 43.058s5.125 7.08 22.304 3.142l.166-29.026M198.849 242.144c-.372 3.706 0 44.596 0 44.596s4.752 8.901 25.442 0l-.295-34.746' fill='%233E2928'/%3E%3Cpath d='M177.403 247.838c1.41.975 1.896-4.04 3.37-3.18a83.77 83.77 0 0016.961 7.49h.128a1.165 1.165 0 011.576.577 89.585 89.585 0 0011.133 2.565c4.83.77 8.826-2.808 13.784-3.052 0-19.008.09-73.109-7.994-84.652l-23.918-8.055c-.115 1.975-11.606 15.314-11.325 31.578.32 18.328-2.062 35.618-2.472 41.351-.064.975-1.191 14.34-1.243 15.378z' fill='%233E2928'/%3E%3Cpath d='M218.564 145.73l-2.203 21.804s-17.845.719-25.532-4.591v-18.496' fill='%23FF8F6F'/%3E%3Cpath d='M241.252 131.378l-1.819 2.488c.97-2.024 1.826-4.1 2.562-6.22.513-1.45-1.806-2.027-2.318-.578l-.27.744c.223-.77.432-1.543.628-2.322a1.195 1.195 0 10-2.319-.577 62.236 62.236 0 01-1.806 5.952 42.54 42.54 0 00.846-5.26c.154-1.525-2.242-1.461-2.383 0a37.916 37.916 0 01-1.076 5.965c0-.684-.064-1.368-.192-2.052a1.206 1.206 0 00-.5-.86 9.29 9.29 0 00-.23-.795 1.204 1.204 0 00-2.345.36l-.154 8.978c-.433.93-.999 1.795-1.678 2.565a41.64 41.64 0 013.331 2.565 34.337 34.337 0 012.716 2.565 65.716 65.716 0 002.216-2.924c.088-.075.166-.161.23-.257a255.44 255.44 0 016.611-9.337c.948-1.052-1.14-2.219-2.05-1z' fill='%23FFB5A9'/%3E%3Cpath d='M207.24 125.85s8.43 2.27 11.85 7.695a96.553 96.553 0 015.65 11.66l6.225-9.685s7.559 2.322 10.556 6.042c0 0-8.967 19.623-16.782 21.304-7.814 1.68-16.116-11.518-16.116-11.518s-1.716 5.515-1.383-.372' fill='%23FF8F6F'/%3E%3Cpath d='M212.595 146.82a17.097 17.097 0 01-5.342-7.618c-1.013-3.45.256-6.478 1.434-9.684a31.237 31.237 0 002.204-9.966c.102-3.36-.282-6.72-.513-10.069a.976.976 0 010-.436c-1.127-3.783-3.433-6.99-7.98-7.375-11.774-1-12.44 12.057-12.35 17.367.09 5.31.653 8.901-3.254 11.12-3.908 2.219-6.726 8.042-2.998 12.75 3.728 4.706.384 2.988-2.101 7.169-2.485 4.181-1.845 9.402 3.254 11.287 5.099 1.885 28.799-1.655 30.976-3.848a4.531 4.531 0 001.115-3.206 12.444 12.444 0 00-4.445-7.49z' fill='%23007F68'/%3E%3Cpath d='M224.176 39.132a18.805 18.805 0 013.33 9.748 6.419 6.419 0 01-1.088 4.553 2.624 2.624 0 01-3.178.552 4.906 4.906 0 01-1.716-1.154 5.989 5.989 0 01-1.102-1.398l-.307-.603a2.13 2.13 0 01-.308.436 2.24 2.24 0 01-1.05.449 3.186 3.186 0 01-1.896-.231 7.113 7.113 0 01-3.357-3.014 9.692 9.692 0 01-1.486-4.861 4.775 4.775 0 011.192-3.848 2.739 2.739 0 013.113-.488c.513.205.986.5 1.396.873.35.297.659.637.922 1.013l.23.41v-1.141l2.563 1 .256 7.209c.018.516.178 1.017.462 1.449.24.417.609.745 1.05.936 1.238.488 1.81-.581 1.717-3.206a13.889 13.889 0 00-2.473-7.247 12.136 12.136 0 00-5.675-4.848 4.774 4.774 0 00-5.33.68 7.252 7.252 0 00-2.062 5.925 15.3 15.3 0 002.562 7.696 11.817 11.817 0 005.47 5.13c.812.34 1.684.51 2.563.5a3.417 3.417 0 001.665-.307l.513-.283 1.55 2.886-.257.18a6.133 6.133 0 01-.755.359c-.41.177-.84.298-1.282.36a6.398 6.398 0 01-1.703 0 8.575 8.575 0 01-2.165-.552 14.093 14.093 0 01-5.125-3.771 22.36 22.36 0 01-3.971-6.208 19.027 19.027 0 01-1.64-6.888c-.138-2 .27-3.999 1.179-5.784a6.51 6.51 0 013.638-3.207 7 7 0 015.047.257 16.288 16.288 0 017.508 6.438zm-5.65 9.12c.42-.538.61-1.221.525-1.899a4.904 4.904 0 00-.679-2.372 3.255 3.255 0 00-1.55-1.411 1.395 1.395 0 00-1.576.205 2.35 2.35 0 00-.563 1.86c.029.846.28 1.669.73 2.385.37.652.94 1.165 1.627 1.463a1.28 1.28 0 001.486-.231M375.433 178.013a18.74 18.74 0 013.33 9.748 6.419 6.419 0 01-1.088 4.553 2.637 2.637 0 01-3.177.552 5.047 5.047 0 01-1.717-1.154 6.207 6.207 0 01-1.102-1.399l-.307-.602c-.087.156-.19.302-.308.436-.304.24-.666.395-1.05.449a3.071 3.071 0 01-1.883-.218 7.113 7.113 0 01-3.357-3.027 9.653 9.653 0 01-1.499-4.874 4.724 4.724 0 011.192-3.848 2.726 2.726 0 013.1-.487c.514.204.987.499 1.396.872.35.302.66.647.923 1.026l.243.41v-1.141l2.562.987.257 7.209c.022.515.181 1.015.46 1.449.242.417.61.745 1.051.936 1.281.488 1.807-.577 1.73-3.206a13.953 13.953 0 00-2.473-7.26 12.161 12.161 0 00-5.662-4.835 4.787 4.787 0 00-5.33.667 7.252 7.252 0 00-2.01 5.964 15.25 15.25 0 002.561 7.695 11.868 11.868 0 005.535 4.964 6.668 6.668 0 002.562.513 3.545 3.545 0 001.665-.308l.513-.282 1.55 2.886-.256.18a6.133 6.133 0 01-.756.359c-.412.17-.842.29-1.281.359a6.526 6.526 0 01-1.717 0 8.55 8.55 0 01-2.152-.564 14.093 14.093 0 01-5.125-3.759 22.41 22.41 0 01-3.97-6.22 18.988 18.988 0 01-1.64-6.888 11.003 11.003 0 011.178-5.772 6.562 6.562 0 013.638-3.219 7.09 7.09 0 015.06.257 16.315 16.315 0 017.354 6.592zm-5.65 9.12a2.567 2.567 0 00.538-1.899 4.865 4.865 0 00-.691-2.372 3.204 3.204 0 00-1.538-1.411 1.395 1.395 0 00-1.575.192 2.323 2.323 0 00-.577 1.86c.03.842.281 1.66.73 2.373.369.655.94 1.172 1.627 1.475a1.28 1.28 0 001.486-.218' fill='%23F47B56'/%3E%3Cpath d='M120.139 232.704L76.774 208l-43.351 24.754s24.122 15.083 45.709 27.756c13.707-9.697 25.89-20.791 41.007-27.807z' fill='url(%23e)' opacity='.25' style='mix-blend-mode:multiply'/%3E%3C/g%3E%3C/svg%3E"); --desktop-illustration2: url("data:image/svg+xml,%3Csvg width='966' height='945' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill-rule='nonzero' fill='none' opacity='.099'%3E%3Cpath d='M468.755 937.353L19.744 671.73c-14.295-8.047-26.548-21.23-12.62-29.878L457.734 381.89c6.754-4.194 17.018-6.946 23.903-2.936l471.265 273.827c14.296 8.308 16.861 31.45 2.619 39.837L527.925 936.933a59.64 59.64 0 01-59.17.42z' fill='%236862E6'/%3E%3Cpath d='M468.755 561.353L19.744 295.73c-14.295-8.047-26.548-21.23-12.62-29.878L457.734 5.89c6.754-4.194 17.018-6.946 23.903-2.936l471.265 273.827c14.296 8.308 16.861 31.45 2.619 39.837L527.925 560.933a59.64 59.64 0 01-59.17.42z' stroke='%231E1F36'/%3E%3Cpath d='M468.755 636.353L19.744 370.73c-14.295-8.047-26.548-21.23-12.62-29.878L457.734 80.89c6.754-4.194 17.018-6.946 23.903-2.936l471.265 273.827c14.296 8.308 16.861 31.45 2.619 39.837L527.925 635.933a59.64 59.64 0 01-59.17.42z' stroke='%231E1F36'/%3E%3C/g%3E%3C/svg%3E"); --desktop-illustration3: url("data:image/svg+xml,%3Csvg width='191' height='184' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cfilter x='-97.9%25' y='-76.3%25' width='295.8%25' height='313.7%25' filterUnits='objectBoundingBox' id='a'%3E%3CfeOffset dy='25' in='SourceAlpha' result='shadowOffsetOuter1'/%3E%3CfeGaussianBlur stdDeviation='25' in='shadowOffsetOuter1' result='shadowBlurOuter1'/%3E%3CfeColorMatrix values='0 0 0 0 0.209139076 0 0 0 0 0.0691446444 0 0 0 0 0.478091033 0 0 0 0.497159091 0' in='shadowBlurOuter1'/%3E%3C/filter%3E%3Cpath id='b' d='M0 27.756v53.87l41.968 24.035 47.387-28.025v-53.87'/%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(50.93 2.125)'%3E%3Cuse fill='%23000' filter='url(%23a)' xlink:href='%23b'/%3E%3Cuse fill='%23FF9271' xlink:href='%23b'/%3E%3C/g%3E%3Cpath fill='%23DF5C34' fill-rule='nonzero' d='M92.899 53.917v53.87l47.387-28.026v-53.87z'/%3E%3Cpath fill='%23F47B56' fill-rule='nonzero' d='M50.93 29.88L99.624 2.126l40.662 23.767-47.387 28.025z'/%3E%3Cpath d='M94.013 14.49a25.942 25.942 0 0114.207 3.129c2.486 1.462 3.844 2.988 4.036 4.579.192 1.59-.628 2.975-2.562 4.143a9.115 9.115 0 01-2.985 1.18c-.869.205-1.76.295-2.652.269l-.974-.077c.091.217.151.446.18.68a3.132 3.132 0 01-.513 1.552 5.704 5.704 0 01-2.1 2.065 12.633 12.633 0 01-6.7 1.77 13.247 13.247 0 01-6.957-1.757c-1.999-1.18-3.023-2.566-3.1-4.156a4.49 4.49 0 012.562-4.015 8.488 8.488 0 012.357-1.013 9.175 9.175 0 012.037-.346h.705l-1.282-.77 3.6-2.244 8.34 4.912a4.377 4.377 0 004.15 0c1.769-1.103 1.137-2.552-1.895-4.348a19.261 19.261 0 00-10.556-2.347 21.67 21.67 0 00-11.018 3.168c-3.023 1.89-4.522 4.143-4.496 6.76 0 2.564 1.601 4.848 4.714 6.682a21.015 21.015 0 0011.146 2.655 20.926 20.926 0 0011.017-2.925 12.353 12.353 0 003.062-2.565 5.683 5.683 0 001.28-2.18l.18-.808 4.753.269c.008.145.008.29 0 .436a8.216 8.216 0 01-.346 1.154 8.303 8.303 0 01-.82 1.72 11.912 11.912 0 01-1.69 2 15.952 15.952 0 01-2.755 2.13 25.602 25.602 0 01-9.326 3.36 35.176 35.176 0 01-10.877.192 24.896 24.896 0 01-9.339-3.053 12.127 12.127 0 01-5.304-5.566 8.192 8.192 0 010-6.593 12.692 12.692 0 015.266-5.759 28.966 28.966 0 0114.655-4.284zm4.663 13.262c-.17-.891-.77-1.64-1.601-2.001a6.579 6.579 0 00-3.33-.911 5.619 5.619 0 00-3.101.795 2.283 2.283 0 00-1.281 2.001c.117.89.69 1.654 1.512 2.014a6.54 6.54 0 003.394.86 6.092 6.092 0 003.254-.847 2.065 2.065 0 001.205-1.911' fill='%233E2928' fill-rule='nonzero'/%3E%3C/g%3E%3C/svg%3E"); } /* Banner Spacer */ .spacer { padding: 60px; } /********* Header HTML CSS Starts **********/ .newsticker { background: #00367f; /* padding: 6px; */ } .newsticker b { background: var(--kappel); color: #fff; padding: 12px 20px 4px 20px; font-size: 15px; } .newsticker marquee { font-size: 20px; color: #ffffff; width: 80%; margin-bottom: -14px; } .newsticker a { font-size: 15px; text-align: center; display: block; padding: 6px 10px 10px 10px; color: #fff; text-decoration: none; font-weight: 600; text-transform: uppercase; } .headerMarquee a { border-right: 1px solid #fff; } .category-card .h3 { font-size: 19px; font-weight: 700; } .section-title { margin-bottom: 20px; } /* .section-title h2 { font-size: 40px; font-weight: 600; margin-top: 0; position: relative; line-height: 50px; } .section-title p { width: 60%; margin: auto; margin-top: 20px; } */ .section-padding { padding: 80px 0; } .cat_list ul { text-align: center; } .cat_list li { background: #fff; box-sizing: border-box; border: 1px solid #ddd; border-radius: 100px; display: inline-flex; align-items: center; margin: 0 15px 20px 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .cat_list ul li a { color: #6d7193; display: flex; text-decoration: none; font-size: 17px; font-weight: 600; align-items: center; padding: 8px 40px 8px 10px; transition: all 0.25s ease-out; transition: 0.3s; } .cat_list ul li a img { width: 45px; margin-right: 10px; height: 45px; border-radius: 100px; border: 4px solid #ecedff; background: #fff; } .cat_list ul li:hover { background: #525fe1; } .cat_list ul li a:hover { color: #fff; } /********* Header HTML CSS End **********/ /*-----------------------------------*\ #RESET \*-----------------------------------*/ *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } li { list-style: none; } a, img, span, data, input, button, ion-icon { display: block; } a { color: inherit; text-decoration: none; } img { height: auto; } .p1 { text-align: justify; } input, button { background: none; border: none; font: inherit; } input { width: 100%; } button { cursor: pointer; } ion-icon { pointer-events: none; } address { font-style: normal; } html { font-family: var(--ff-poppins); font-size: 10px; scroll-behavior: smooth; } body { background-color: var(--white); color: var(--gray-web); font-size: 1.6rem; line-height: 1.75; } :focus-visible { outline-offset: 4px; } ::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-track { background-color: hsl(0, 0%, 98%); } ::-webkit-scrollbar-thumb { background-color: hsl(0, 0%, 80%); } ::-webkit-scrollbar-thumb:hover { background-color: hsl(0, 0%, 70%); } /*-----------------------------------*\ #REUSED STYLE \*-----------------------------------*/ .container { padding-inline: 15px; } .section { padding-block: var(--section-padding); } .shape { position: absolute; display: none; } .has-bg-image { background-repeat: no-repeat; background-size: cover; background-position: center; } .h1, .h2, .h3 { color: var(--eerie-black-1); font-family: var(--ff-league_spartan); line-height: 1; } .h1, .h2 { font-weight: var(--fw-600); } .h1 { font-size: var(--fs-1); } .h2 { font-size: var(--fs-2); } .h3 { font-size: var(--fs-3); font-weight: var(--fw-500); } .section-title { --color: var(--radical-red); text-align: center; } .section-title .span { display: inline-block; color: var(--color); } .btn { background-color: var(--kappel); color: var(--white); font-family: var(--ff-league_spartan); font-size: var(--fs-4); display: flex; align-items: center; gap: 7px; max-width: max-content; padding: 10px 20px; border-radius: var(--radius-5); overflow: hidden; } .has-before, .has-after { position: relative; z-index: 1; } .has-before::before, .has-after::after { position: absolute; content: ""; } .btn::before { inset: 0; background-image: var(--gradient); z-index: -1; border-radius: inherit; transform: translateX(-100%); transition: var(--transition-2); } .btn:is(:hover, :focus)::before { transform: translateX(0); } .img-holder { aspect-ratio: var(--width) / var(--height); background-color: var(--light-gray); overflow: hidden; } .img-cover { width: 100%; height: 100%; object-fit: cover; } .section-subtitle { font-size: var(--fs-5); text-transform: uppercase; font-weight: var(--fw-500); letter-spacing: 1px; text-align: center; margin-block-end: 15px; } .section-text { font-size: var(--fs-5); text-align: center; margin-block: 15px 25px; } .grid-list { display: grid; gap: 30px; } .category-card, .stats-card { background-color: hsla(var(--color), 0.1); } :is(.course, .blog) .section-title { margin-block-end: 40px; } /*-----------------------------------*\ #HEADER \*-----------------------------------*/ .header .btn { display: none; } .header { position: absolute; top: 0; left: 0; width: 100%; background-color: var(--white); /* padding-block: 12px; */ box-shadow: var(--shadow-1); z-index: 4; } .header.active { position: fixed; } .header .container, .header-actions, .navbar .wrapper { display: flex; justify-content: space-between; align-items: center; gap: 15px; } .header-action-btn, .nav-close-btn { position: relative; color: var(--eerie-black-1); font-size: 24px; transition: var(--transition-1); } .header-action-btn:is(:hover, :focus) { color: var(--kappel); } .header-action-btn .btn-badge { position: absolute; top: -10px; right: -10px; background-color: var(--kappel); color: var(--white); font-family: var(--ff-league_spartan); font-size: var(--fs-6); min-width: 20px; height: 20px; border-radius: var(--radius-circle); } .navbar { position: fixed; top: 0; left: -320px; background-color: var(--white); width: 100%; max-width: 320px; height: 100%; z-index: 2; transition: 0.25s var(--cubic-in); } .navbar.active { transform: translateX(320px); transition: 0.5s var(--cubic-out); } .navbar .wrapper { padding: 15px 20px; border-block-end: 1px solid var(--platinum); } .nav-close-btn { background-color: var(--white); box-shadow: var(--shadow-2); padding: 8px; border-radius: var(--radius-circle); } .nav-close-btn:is(:hover, :focus) { background-color: var(--kappel); color: var(--white); } .navbar-list { padding: 15px 20px; } .navbar-item:not(:last-child) { border-block-end: 1px solid var(--platinum); } .navbar-link { padding-block: 8px; font-weight: var(--fw-500); transition: var(--transition-1); } .navbar-link:is(:hover, :focus) { color: var(--kappel); } .overlay { position: fixed; inset: 0; background-color: var(--black_80); pointer-events: none; opacity: 0; z-index: 1; transition: var(--transition-1); } .overlay.active { opacity: 1; pointer-events: all; } /*-----------------------------------*\ #HERO \*-----------------------------------*/ .hero { padding-block-start: calc(var(--section-padding) + 80px); } .hero .container { display: grid; gap: 40px; } .hero-text { color: var(--eerie-black-1); font-size: var(--fs-4); text-align: center; margin-block: 18px 20px; } .hero .btn { margin-inline: auto; } .hero-banner { display: grid; grid-template-columns: 1fr 0.8fr; align-items: flex-start; gap: 30px; } .hero-banner .img-holder.one { border-top-right-radius: 70px; border-bottom-left-radius: 110px; } .hero-banner .img-holder.two { border-top-left-radius: 50px; border-bottom-right-radius: 90px; } /*-----------------------------------*\ #CATEGORY \*-----------------------------------*/ .category .section-subtitle { color: var(--radical-red); } .category .section-title { --color: var(--kappel); } .category .section-text { margin-block-end: 40px; } .category-card { padding: 16px; text-align: center; border-radius: var(--radius-5); } .category-card .card-icon { background-color: hsla(var(--color), 0.1); width: 80px; height: 80px; display: grid; place-items: center; border-radius: var(--radius-circle); margin-inline: auto; margin-block-end: 30px; } .category-card .card-text { color: var(--eerie-black-1); font-size: var(--fs-5); margin-block: 15px 25px; } .category-card .card-badge { background-color: hsla(var(--color), 0.1); color: hsl(var(--color)); font-size: var(--fs-5); font-weight: var(--fw-500); padding: 2px 18px; max-width: max-content; margin-inline: auto; margin-top: 20px; border-radius: var(--radius-5); } /*-----------------------------------*\ #ABOUT \*-----------------------------------*/ .about { padding-block-start: 0; overflow: hidden; } .about .container { display: grid; gap: 30px; } .about-banner { position: relative; z-index: 1; } .about-banner .img-holder { border-radius: var(--radius-10); } .about-shape-2 { display: block; bottom: -100px; left: -60px; animation: bounce 2.5s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(-30px); } 60% { transform: translateY(-15px); } } .about :is(.section-subtitle, .section-text) { text-align: justify; } .about :is(.section-title) { text-align: left; } .about-item { margin-block: 15px; display: flex; align-items: center; gap: 15px; } .about-item ion-icon { color: var(--selective-yellow); font-size: 20px; --ionicon-stroke-width: 50px; } .about-item .span { color: var(--eerie-black-1); font-family: var(--ff-league_spartan); } /*-----------------------------------*\ #COURSE \*-----------------------------------*/ .course { background-color: var(--isabelline); } .course-card { position: relative; background-color: var(--white); border-radius: var(--radius-5); overflow: hidden; } .course-card .img-cover { transition: var(--transition-2); } .course-card:is(:hover, :focus-within) .img-cover { transform: scale(1.1); } .course-card :is(.abs-badge, .badge) { font-family: var(--ff-league_spartan); border-radius: var(--radius-3); } .course-card .abs-badge { position: absolute; top: 10px; right: 10px; background-color: var(--selective-yellow); color: var(--white); display: flex; align-items: center; gap: 5px; line-height: 1; padding: 6px 8px; padding-block-end: 3px; } .course-card .abs-badge ion-icon { font-size: 18px; margin-block-end: 5px; --ionicon-stroke-width: 50px; } .course-card .card-content { padding: 0 25px 25px; } .course-card .badge { background-color: var(--kappel_15); max-width: max-content; color: var(--kappel); line-height: 25px; padding-inline: 10px; } .course-card .card-title { display: -webkit-box; text-align: center; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-block: 15px 8px; transition: var(--transition-1); } .course-card .card-title:is(:hover, :focus) { color: var(--kappel); } .course-card :is(.wrapper, .rating-wrapper, .card-meta-list, .card-meta-item) { display: flex; align-items: center; } .course-card .wrapper { gap: 10px; } .course-card .rating-wrapper { gap: 3px; } .course-card .rating-wrapper ion-icon { color: var(--selective-yellow); } .course-card .rating-text { color: var(--eerie-black-1); font-size: var(--fs-6); text-align: center; font-weight: var(--fw-500); } .course-card .price { color: var(--radical-red); font-family: var(--ff-league_spartan); font-size: var(--fs-4); font-weight: var(--fw-600); margin-block: 8px 15px; } .course-card .card-meta-list { flex-wrap: wrap; } .course-card .card-meta-item { position: relative; gap: 5px; } .course-card .card-meta-item:not(:last-child)::after { content: "|"; display: inline-block; color: var(--platinum); padding-inline: 10px; } .course-card .card-meta-item ion-icon { color: var(--quick-silver); --ionicon-stroke-width: 50px; } .course-card .card-meta-item .span { color: var(--eerie-black-1); font-size: var(--fs-7); } .course .btn { margin-inline: auto; margin-block-start: 60px; } /*-----------------------------------*\ #VIDEO \*-----------------------------------*/ .video { background-size: contain; background-position: center top; } .video-banner { position: relative; border-top-right-radius: 80px; border-bottom-left-radius: 120px; } .video .play-btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: var(--radical-red); font-size: 30px; padding: 16px; color: var(--white); border-radius: var(--radius-circle); box-shadow: 0 0 0 0 var(--white_50); z-index: 1; animation: pulse 3s ease infinite; } @keyframes pulse { 0% { box-shadow: 0 0 0 0 var(--white_50); } 100% { box-shadow: 0 0 0 20px transparent; } } .video-banner::after { inset: 0; background-color: var(--black_30); } /*-----------------------------------*\ #STATS \*-----------------------------------*/ .stats-card { text-align: center; padding: 25px; border-radius: var(--radius-10); } .stats-card :is(.card-title, .card-text) { font-family: var(--ff-league_spartan); } .stats-card .card-title { color: hsl(var(--color)); font-size: var(--fs-2); line-height: 1.1; } .stats-card .card-text { color: var(--eerie-black-1); text-transform: uppercase; } /*-----------------------------------*\ #BLOG \*-----------------------------------*/ .blog-card .card-banner { border-radius: var(--radius-10); } .blog-card .card-banner .img-cover { transition: var(--transition-2); } .blog-card .card-banner::after { inset: 0; background-color: var(--black_50); opacity: 0; transition: var(--transition-1); } .blog-card:is(:hover, :focus-within) .card-banner .img-cover { transform: scale(1.1); } .blog-card:is(:hover, :focus-within) .card-banner::after { opacity: 1; } .blog-card .card-content { position: relative; margin-inline: 15px; background-color: var(--white); padding: 20px; border-radius: var(--radius-10); box-shadow: var(--shadow-3); margin-block-start: -100px; z-index: 1; } .blog-card .card-btn { position: absolute; top: -40px; right: 30px; background-color: var(--kappel); color: var(--white); font-size: 20px; padding: 20px; border-radius: var(--radius-circle); transition: var(--transition-1); opacity: 0; } .blog-card .card-btn:is(:hover, :focus) { background-color: var(--radical-red); } .blog-card:is(:hover, :focus-within) .card-btn { opacity: 1; transform: translateY(10px); } .blog-card :is(.card-meta-item, .card-text, .card-subtitle) { font-size: var(--fs-5); } .blog-card .card-subtitle { text-transform: uppercase; } .blog-card .card-title { margin-block: 10px 15px; transition: var(--transition-1); } .blog-card .card-title:is(:hover, :focus) { color: var(--kappel); } .blog-card :is(.card-meta-list, .card-meta-item) { display: flex; } .blog-card .card-meta-list { flex-wrap: wrap; gap: 10px 20px; margin-block-end: 20px; } .blog-card .card-meta-item { gap: 10px; align-items: center; color: var(--eerie-black-1); } .blog-card .card-meta-item ion-icon { color: var(--kappel); font-size: 18px; --ionicon-stroke-width: 40px; } /*-----------------------------------*\ #FOOTER \*-----------------------------------*/ .footer { background-repeat: no-repeat; background-color: var(--eerie-black-2); color: var(--gray-x-11); font-size: var(--fs-5); } .footer-top { display: grid; gap: 30px; } .footer-brand-text { margin-block: 20px; } .footer-brand .wrapper { display: flex; gap: 5px; } .footer-brand .wrapper .span { font-weight: var(--fw-500); } .footer-link { transition: var(--transition-1); } .footer-link:is(:hover, :focus) { color: var(--kappel); } .footer-list-title { color: var(--white); font-family: var(--ff-league_spartan); font-size: var(--fs-3); font-weight: var(--fw-600); margin-block-end: 10px; } .footer-list .footer-link { padding-block: 5px; } .newsletter-form { margin-block: 20px 35px; } .newsletter-form .input-field { background-color: var(--white); padding: 12px; border-radius: var(--radius-5); margin-block-end: 20px; } .newsletter-form .btn { min-width: 100%; justify-content: center; } .social-list { display: flex; gap: 25px; } .social-link { font-size: 20px; } .footer-bottom { border-block-start: 1px solid var(--eerie-black-1); padding-block: 30px; } .copyright { text-align: center; } .copyright-link { color: var(--kappel); display: inline-block; } /*-----------------------------------*\ #BACK TO TOP \*-----------------------------------*/ .back-top-btn { position: fixed; bottom: 40px; right: 30px; background-color: var(--kappel); color: var(--white); font-size: 20px; padding: 15px; border-radius: var(--radius-circle); z-index: 3; opacity: 0; pointer-events: none; transition: var(--transition-1); } .back-top-btn.active { transform: translateY(10px); opacity: 1; pointer-events: all; } /*-----------------------------------*\ #MEDIA QUERIES \*-----------------------------------*/ /** * responsive for large than 575px screen */ @media (max-width: 768px) { .newsticker marquee { width: 60%; } .logo img { width: 80px; } .newsticker a { font-size: 14px; } } @media (min-width: 575px) { /** * REUSED STYLE */ .container { max-width: 520px; width: 100%; margin-inline: auto; } .grid-list { grid-template-columns: 1fr 1fr; } :is(.course, .blog) .grid-list { grid-template-columns: 1fr; } /** * HEADER */ .header .container { max-width: unset; } /* .header-actions { gap: 30px; } */ /** * HERO */ .hero-banner { grid-template-columns: 1fr 0.9fr; } /** * VIDEO */ .video .play-btn { padding: 25px; } /** * STATS */ .stats-card { padding: 40px 30px; } /** * FOOTER */ .footer-brand, .footer-list:last-child { grid-column: 1 / 3; } .newsletter-form { display: flex; align-items: center; gap: 10px; } .newsletter-form .input-field { margin-block-end: 0; } .newsletter-form .btn { min-width: max-content; } } /** * responsive for large than 768px screen */ @media (min-width: 768px) { /** * CUSTOM PROPERTY */ :root { /** * typography */ --fs-1: 4.6rem; --fs-2: 3.8rem; } /** * REUSED STYLE */ .container { max-width: 720px; } .btn { padding: 15px 30px; } :is(.course, .blog) .grid-list { grid-template-columns: 1fr 1fr; } /** * HEADER */ .header .container { padding-inline: 30px; } .header .btn { display: flex; padding: 8px 20px; } /** * HERO */ .hero { padding-block-start: calc(var(--section-padding) + 90px); } .hero .container { gap: 50px; } .hero-text { margin-block-end: 30px; } .hero-banner { position: relative; z-index: 1; } .hero-banner .img-holder { max-width: max-content; } .hero-banner .img-holder.one { justify-self: flex-end; } .hero-banner .img-holder.two { margin-block-start: 100px; } .hero-shape-1 { display: block; position: absolute; bottom: -40px; left: -10px; } /** * ABOUT */ .about { padding-block-start: 126px; } .about-banner { padding: 60px; padding-inline-end: 0; } .about-banner .img-holder { max-width: max-content; margin-inline: auto; } .about-shape-1 { display: block; top: -100px; right: -120px; } .phone-call { width: 50px; height: 50px; left: 20px; bottom: 20px; background: #ffc600; position: fixed; text-align: center; color: #ffffff; cursor: pointer; border-radius: 50%; z-index: 99; display: inline-block; line-height: 47px; } .phone-call:before { position: absolute; content: " "; z-index: -1; top: -15px; left: -15px; background-color: #ffc600; width: 80px; height: 80px; border-radius: 100%; animation-fill-mode: both; -webkit-animation-fill-mode: both; opacity: 0.6; -webkit-animation: pulse 1s ease-out; animation: pulse 1.8s ease-out; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } @keyframes pulse { 0% { transform: scale(0); opacity: 0; } 25% { transform: scale(0.3); opacity: 1; } 50% { transform: scale(0.6); opacity: 0.6; } 75% { transform: scale(0.9); opacity: 0.3; } 100% { transform: scale(1); opacity: 0; } } /** * FOOTER */ .footer-brand, .footer-list:last-child { grid-column: auto; } .newsletter-form .btn { padding-block: 10px; } } /** * responsive for large than 992px screen */ @media (min-width: 992px) { /** * CUSTOM PROPERTY */ :root { /** * typography */ --fs-1: 5.5rem; --fs-2: 4.5rem; } /** * REUSED STYLE */ .container { max-width: 960px; } .grid-list { grid-template-columns: repeat(6, 1fr); } :is(.course, .blog) .grid-list { grid-template-columns: repeat(3, 1fr); } /** * HERO */ .hero .container { grid-template-columns: 1fr 1fr; align-items: center; } .hero .section-title, .hero-text { text-align: left; } .hero .btn { margin-inline: 0; } /** * ABOUT */ .about .container { grid-template-columns: 1fr 1fr; align-items: center; gap: 60px; } /** * VIDEO */ .video-banner { max-width: 75%; margin-inline: auto; } /** * FOOTER */ .footer .grid-list { grid-template-columns: 1fr 0.6fr 0.6fr 1.2fr; } } /** * responsive for large than 1200px screen */ @media (min-width: 1200px) { /** * CUSTOM PROPERTY */ :root { /** * typography */ --fs-1: 6.5rem; /** * spacing */ --section-padding: 66px; } /** * REUSED STYLE */ .container { max-width: 1185px; } .shape { display: block; } .about-content, .video-card, .blog { position: relative; } /** * HEADER */ .header-action-btn:last-child, .navbar .wrapper, .overlay { display: none; } .header.active { transform: translateY(-100%); animation: slideIn 0.5s ease forwards; } @keyframes slideIn { 0% { transform: translateY(-100%); } 100% { transform: translateY(0); } } .navbar, .navbar.active { all: unset; } .navbar-list { display: flex; gap: 26px; padding: 0; } .navbar-item:not(:last-child) { border-block-end: none; } .navbar-link { color: var(--eerie-black-1); padding-block: 20px; } .header .btn { margin-inline-end: 0; } /** * HERO */ .hero { padding-block-start: calc(var(--section-padding) + 120px); } .hero .container { gap: 80px; } .hero-shape-2 { top: -80px; z-index: -1; } /** * ABOUT */ .about .container { gap: 88px; } .about-banner .img-holder { margin-inline: 0; } .about-shape-3 { top: -20px; left: -160px; z-index: -1; } .about-content { z-index: 1; } .about-shape-4 { top: 30px; right: -60px; z-index: -1; } /** * VIDEO */ .video-shape-1 { top: -50px; left: 0; } .video-shape-2 { top: -80px; right: 120px; z-index: 1; } /** * BLOG */ .blog-shape { top: 0; left: 0; } } /* FAQ */ .faq-container { width: 100%; padding: 48px 0; margin: auto; } .faq-article { display: grid; margin-top: min(1.5rem, 5vw); box-shadow: 0 0.62rem 1.87rem rgba(0, 0, 0, 0.2); border-radius: 1.25rem; } @media (min-width: 57.06rem) { .faq-article { grid-template-columns: 22.5rem 1fr; } } .faq-img-container { grid-row: 1 / span 2; grid-column: 1; z-index: 1; height: min(15rem, 60vw); width: 100%; background-image: var(--mobile-illustration1), var(--mobile-illustration2); background-repeat: no-repeat; background-size: auto 85%, auto 50%; background-position: 50% 0%, 50% 100%; } @media (min-width: 57.06rem) { .faq-img-container { grid-row: 1; grid-column: 1; height: 100%; background-color: white; border-radius: 1.25rem 0 0 1.25rem; background-image: var(--desktop-illustration1), var(--desktop-illustration2); background-size: 120%, auto; background-position: 100% 50%, 100% 60%; } .faq-img-container::before { content: ""; display: block; height: 100%; width: 50%; background-image: var(--desktop-illustration3); background-repeat: no-repeat; background-size: 100%; background-position: left 65%; position: relative; left: -24.5%; } } .faq { grid-row: 2 / span 2; grid-column: 1; padding: min(7.5rem, 30vw) 1.5rem 2.5rem; background-color: white; border-radius: 1.25rem; } @media (min-width: 57.06rem) { .faq { grid-row: 1; grid-column: 2; padding: 3.5rem 4rem 3.5rem; border-radius: 0 1.25rem 1.25rem 0; } } .faq h2 { color: var(--very-dark-blue); font-weight: 700; font-size: 1.8rem; text-align: center; margin: 1.2em 0; } @media (min-width: 57.06rem) { .faq h2 { text-align: left; margin: 0 0 1.65em 0; } } .faq .q-a { font-size: 0.95rem; border-bottom: 1.5px solid var(--light-grayish-blue); padding-bottom: 1.05em; margin-top: 1.05em; } .faq .q-wrapper { display: grid; grid-template-columns: 1fr auto; } .faq h3 { grid-column: 1; color: var(--very-dark-grayish-blue); cursor: pointer; } .faq h3:hover { color: var(--soft-red); } .faq h3.h3-active { color: var(--very-dark-blue); font-weight: 700; } .faq svg { grid-column: 2; padding: 0.5rem 0 0 0.7rem; justify-self: end; cursor: pointer; transition: transform 0.2s; } .faq svg.svg-animation { transform: rotate(180deg); padding: 0 0.7rem 0.5rem 0; } .faq p { width: calc(100% - calc(10px + 0.7rem)); color: var(--dark-grayish-blue); margin-top: 1.05em; } .faq p.p-visible { display: block; } /* Breadcrumbs */ .page-width { max-width: var(--page-width); margin: auto; width: 100%; padding: 0 15px; } .contact-page { font-family: var(--base-fm); font-size: var(--base-size); color: var(--white-clr); align-items: center; } .contact-bnr-scn { background: linear-gradient(96.41deg, #6cc17e 10.61%, #098b99 70.66%); position: relative; z-index: 1; overflow: hidden; display: flex; flex-flow: row wrap; justify-content: center; align-items: center; text-align: center; width: 100%; min-height: 250px; } .contact-bnr-scn h2 { font-size: 40px; color: #fff; margin: 0px; } .breadcrumbs { display: flex; flex-flow: row wrap; margin: 0px; padding: 0; list-style: none; justify-content: center; margin-top: 10px; } .breadcrumbs li { margin: 0px 6px; } .breadcrumbs li a, .breadcrumbs li { color: #fff; font-weight: 600; } .breadcrumbs li:last-child:after { content: normal; } .breadcrumbs li a:hover { text-decoration: none; } .is-underlined { background-image: linear-gradient( transparent calc(100% - 0.15em), #ffe26d 0.15em ); background-position: left bottom 0.18em; background-repeat: no-repeat; background-size: 100% 100%; display: inline; font-weight: inherit; transition: background-size 0.6s cubic-bezier(0.45, 0, 0.55, 1); } .about-heading { font-size: 30px; } /* Start Popular Courses */ .courseCard-container { display: flex; gap: 30px; justify-content: center; flex-wrap: wrap; } .card-list { width: 90%; max-width: 400px; } .course-card { background-color: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 20px 50px 0 rgba(0, 0, 0, 0.1); border-radius: 15px; overflow: hidden; padding: 1.25rem; position: relative; transition: 0.15s ease-in; } .course-card:hover, .card:focus-within { box-shadow: 0 0 0 2px #16c79a, 0 10px 60px 0 rgba(0, 0, 0, 0.1); transform: translatey(-5px); } .card-image { border-radius: 10px; overflow: hidden; } .card-image img { max-width: 100%; } .course-card-header { margin-top: 1.5rem; display: flex; align-items: center; justify-content: space-evenly; } .course-cardsec { flex-direction: column !important; } .course-card-header h3 { color: #000; font-weight: 800; font-size: 22px; } .course-card-header p { color: #000; text-align: center; } .card-footer { margin-top: 1.25rem; display: flex !important; justify-content: center !important; padding: 1rem !important; } .card-footer button { font-size: 16px; font-weight: 700; } /* CTA Button */ .btn-contact { position: fixed; right: -60px; bottom: 19rem; width: 174px; top: 185px; height: 4rem; background: #831010; text-align: center; z-index: 999; transform: rotate(90deg); rotate: inherit; min-width: 140px; border-radius: 4px; font-weight: 500; align-items: center; padding: 4px 16px 5px; } .btn-contact2 { position: fixed; right: -60px; bottom: 19rem; width: 174px; top: 372px; height: 4rem; background: #831010; text-align: center; z-index: 999; transform: rotate(90deg); rotate: inherit; min-width: 140px; border-radius: 4px; font-weight: 500; align-items: center; padding: 4px 10px 5px; } .social { position: fixed; top: 220px; z-index: 1; } .social ul { padding: 0px; transform: translate(-270px, 0); } .social ul li { display: block; margin: 5px 5px 5px 22px; background: rgba(0, 0, 0, 0.36); width: 300px; text-align: right; padding: 10px; border-radius: 0 30px 30px 0; transition: all 1s; } .social ul li:hover { transform: translate(90px, 0); background: rgba(255, 255, 255, 0.4); } .social ul li:hover a { color: #000; } .social ul li:hover i { color: #fff; background: rgba(0, 0, 0, 0.36); transform: rotate(360deg); transition: all 1s; } .social ul li i { margin-left: 10px; color: #000; background: #fff; padding: 10px; border-radius: 50%; width: 38px; height: 38px; font-size: 20px; background: #ffffff; transform: rotate(0deg); } .tags .badge { background: #00367f !important; margin: 0 5px 0 0; padding: 0.2rem 1rem; color: #fff; text-transform: uppercase !important; } .ov__college { object-fit: cover; height: 195px !important; width: 100% !important; } .bg-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #011331a1; z-index: 10; } .dark-overlay, .gradient-overlay, .light-overlay { position: relative; overflow: hidden; } .tile-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; z-index: 30; } .card-img-overlay-bottom { position: absolute; right: 1rem; bottom: 1rem; left: 1rem; } .z-index-20 { z-index: 20 !important; } .accredition { position: absolute; background-color: #893918; left: 0.5rem; top: 0.5rem; text-transform: uppercase; color: #fff; font-weight: 600; padding: 5px 32px; /* border-radius: 10px; */ z-index: 20; line-height: 1; } .card-score { position: absolute; top: 0.5rem; right: 0.5rem; color: #eee; z-index: 20; } .avatar { display: inline-block; position: relative; width: 6rem; border: 2px #fff solid; height: 6rem; text-align: center; border-radius: 5%; background: #fff; box-shadow: 0 0 1rem rgb(0 0 0 / 15%); line-height: 3rem; } .l-add small { font-weight: 600; margin-bottom: 10px; display: inline-block; font-size: 15px; } .l-card h3 { font-size: 22px !important; } .modal-content { background-color: white; } .modal-header{ color: #fff; background-color: #831010; font-size: 18px; } .form-group { margin-bottom: 20px; color: #000; font-weight: 500; } .form-control { padding: 10px; font-size: 15px; } #callme { position: fixed; right: 20px; bottom: 10px; width: 70px; height: 70px; cursor: pointer; z-index: 99990; } #callme #callmeMain { -moz-border-radius: 50% !important; -webkit-border-radius: 50% !important; border-radius: 50% !important; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; background-color: rgb(207,8,8); width: 70px; height: 70px; -webkit-animation: zcwmini2 1.5s 0s ease-out infinite; -moz-animation: zcwmini2 1.5s 0s ease-out infinite; animation: zcwmini2 1.5s 0s ease-out infinite; } #callme #callmeMain:before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-image: url(https://res.cloudinary.com/dglv3fims/image/upload/v1668592876/cal_swjmmc.png); background-repeat: no-repeat; background-position: center center; -webkit-animation: zcwphone2 1.5s linear infinite; -moz-animation: zcwphone2 1.5s linear infinite; animation: zcwphone2 1.5s linear infinite; } @-webkit-keyframes zcwphone { 0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);} 50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);} 100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} } @-moz-keyframes zcwphone { 0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);} 50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);} 100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} } @keyframes zcwphone { 0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);} 50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);} 100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} } @-webkit-keyframes zcwphone2 { 0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);} 50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);} 100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} } @-moz-keyframes zcwphone2 { 0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);} 50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);} 100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} } @keyframes zcwphone2 { 0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);} 50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} 75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);} 100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);} } @-webkit-keyframes zcwmini { 0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);} 10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;} 100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);} } @-moz-keyframes zcwmini { 0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);} 10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;} 100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);} } @keyframes zcwmini { 0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);} 10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;} 100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);} } @-webkit-keyframes zcwmini2 { 0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);} 10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;} 100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);} } @-moz-keyframes zcwmini2 { 0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);} 10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;} 100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);} } @keyframes zcwmini2 { 0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);} 10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;} 100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);} } #social_side_links { position: fixed; bottom: 0px; left: -21px; padding:0px; list-style: none; z-index: 99; } #social_side_links li a {display: block;} #social_side_links li a img { display: block; max-width:100%; padding:7px; }