.code_example_bg a{text-decoration:none}@media not all and (min-width:400px){.code_example_bg a{width:100%!important}}.code_example_bg a:hover{color:#333}.button01 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button01 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button01 a:hover{text-decoration:none;background-color:#bbb}.button02 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;border-radius:50vh}.button02 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button02 a:hover{text-decoration:none;background-color:#bbb}.button03 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#2285b1;font-size:18px;font-weight:700;border:2px solid #2285b1}.button03 a::after{content:'';width:5px;height:5px;border-top:3px solid #2285b1;border-right:3px solid #2285b1;transform:rotate(45deg)}.button03 a:hover{color:#333;text-decoration:none;background-color:#a0c4d3}.button03 a:hover::after{border-top:3px solid #333;border-right:3px solid #333}.button04 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#2285b1;font-size:18px;font-weight:700;border:3px solid #a0c4d3;border-radius:10px}.button04 a::after{content:'';width:5px;height:5px;border-top:3px solid #2285b1;border-right:3px solid #2285b1;transform:rotate(45deg)}.button04 a:hover{color:#333;text-decoration:none;background-color:#a0c4d3}.button04 a:hover::after{border-top:3px solid #333;border-right:3px solid #333}.button05 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;box-shadow:0 5px 0 #aaa;border-radius:6px;transition:.3s}.button05 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button05 a:hover{transform:translateY(3px);text-decoration:none;box-shadow:0 2px 0 #aaa}.button06 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#bbb;box-shadow: 0 0 10px rgba(0 0 0 / .2);border-radius:6px;transition:.3s}.button06 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button06 a:hover{text-decoration:none;background-color:#aaa;box-shadow: 0 0 10px rgba(0 0 0 / 0)}.button07 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;border:3px dashed #3d9ec8;border-radius:6px;transition:.3s}.button07 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button07 a:hover{text-decoration:none;background-color:#bbb}.button08 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;border-image-source:repeating-linear-gradient(45deg,#3d9ec8 0,#3d9ec8 8px,rgba(0,0,0,0) 8px,rgba(0,0,0,0) 11px);border-image-slice:3;border-width:3px;border-image-repeat:round;border-style:solid;transition:.3s}.button08 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button08 a:hover{text-decoration:none;background-color:#bbb}.button09 a{display:flex;justify-content:space-between;align-items:center;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button09 a::before{content:'';position:absolute;top:-5px;left:-5px;width:calc(100% - 4px);height:calc(100% - 4px);border:2px solid #3d9ec8;transition:.2s}.button09 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button09 a:hover::before{top:0;left:0}.button09 a:hover{text-decoration:none;background-color:#a0c4d3}.button10 a{display:flex;justify-content:space-between;align-items:center;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;border-radius:50vh;transition:.3s}.button10 a::before{content:'';position:absolute;top:-5px;left:-5px;width:calc(100% - 4px);height:calc(100% - 4px);border:2px solid #3d9ec8;border-radius:50vh;transition:.2s}.button10 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button10 a:hover::before{top:0;left:0}.button10 a:hover{text-decoration:none;background-color:#a0c4d3}.button11 a{display:flex;justify-content:space-between;align-items:center;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button11 a::before{content:'';position:absolute;top:-5px;left:-5px;width:calc(100% - 4px);height:calc(100% - 4px);border:2px dashed #3d9ec8;transition:.2s}.button11 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button11 a:hover::before{top:0;left:0}.button11 a:hover{text-decoration:none;background-color:#a0c4d3}.button12 a{display:flex;justify-content:space-between;align-items:center;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button12 a::before{content:'';position:absolute;bottom:-7px;right:-7px;width:100%;height:2px;background-color:#bbb;transition:.2s ease 0s}.button12 a::after{content:'';position:absolute;top:7px;right:-7px;width:2px;height:100%;background-color:#bbb;transition:.2s ease .2s}.button12 a:hover::before{width:0%}.button12 a:hover::after{height:0%}.button12 a:hover{text-decoration:none;background-color:#a0c4d3}.button13 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;box-shadow:5px 5px 0 #3d9ec8;transition:.3s}.button13 a:hover{text-decoration:none;background-color:#a0c4d3;box-shadow:0 0 0}.button14 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-image:linear-gradient(170deg,#659de6,#5abab8);border-radius:50vh;transition:.3s}.button14 a::after{content:'';width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333;transform:rotate(45deg)}.button14 a:hover{text-decoration:none;background-image:linear-gradient(-170deg,#659de6,#5abab8)}.button15 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;border-radius:50vh;transition:.3s}.button15 a::before{content:'';position:absolute;top:50%;right:10px;transform:translateY(-50%);width:50px;height:50px;background-color:#f2f2f2;border-radius:50vh}.button15 a::after{content:'';position:absolute;top:50%;right:32px;transform:translateY(-50%) rotate(45deg);width:5px;height:5px;border-top:3px solid #333;border-right:3px solid #333}.button15 a:hover{text-decoration:none;background-color:#aaa}.button16 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button16 a::after{content:'';position:absolute;top:50%;right:-25px;transform:translateY(-50%);width:50px;height:2px;background-color:#2285b1;transition:.3s}.button16 a:hover{text-decoration:none;background-color:#bbb}.button16 a:hover::after{transform:translateX(3px)}.button17 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button17 a::before{content:'';position:absolute;top:50%;right:1em;transform:translateY(-50%);width:35px;height:35px;border:2px solid #2285b1;border-radius:50vh;transition:.3s}.button17 a::after{content:'';position:absolute;top:50%;right:35px;transform:translateY(-50%);width:40px;height:2px;background-color:#2285b1}.button17 a:hover{text-decoration:none;background-color:#bbb}.button17 a:hover::before{background-color:#a0c4d3}.button18 a{display:flex;justify-content:space-between;align-items:center;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button18 a::before{content:'';position:absolute;top:calc(50% - 2px);right:1em;transform:translateY(calc(-50% - 2px)) rotate(30deg);width:12px;height:2px;background-color:#2285b1;transition:.3s}.button18 a::after{content:'';position:absolute;top:50%;right:1em;transform:translateY(-50%);width:40px;height:2px;background-color:#2285b1;transition:.3s}.button18 a:hover{text-decoration:none;background-color:#bbb}.button18 a:hover::before,.button18 a:hover::after{right:.5em}.button19 a{display:flex;justify-content:space-between;align-items:center;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button19 a::before{content:'';position:absolute;top:calc(50% - 2px);right:-20px;transform:translateY(calc(-50% - 2px)) rotate(30deg);width:12px;height:2px;background-color:#2285b1;transition:.3s}.button19 a::after{content:'';position:absolute;top:50%;right:-20px;transform:translateY(-50%);width:60px;height:2px;background-color:#2285b1;transition:.3s}.button19 a:hover{text-decoration:none;background-color:#bbb}.button19 a:hover::before,.button19 a:hover::after{right:-2.5em}.button20 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button20 a::before{content:'';position:absolute;top:50%;right:2em;transform:translateY(-50%) rotate(45deg);width:5px;height:5px;border-top:2px solid #333;border-right:2px solid #333;transition:.3s}.button20 a::after{content:'';position:absolute;top:50%;right: calc(2em + 5px);transform:translateY(-50%) rotate(45deg);width:5px;height:5px;border-top:2px solid #333;border-right:2px solid #333;transition:.3s}.button20 a:hover{text-decoration:none;background-color:#bbb}.button20 a:hover::before{right:1.8em}.button20 a:hover::after{right: calc(1.8em + 5px)}.button21 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button21 a::after{content:'';width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #333;transition:.3s}.button21 a:hover{text-decoration:none;background-color:#bbb}.button21 a:hover::after{transform:translateX(5px)}.button22 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button22 a::before{content:'';position:absolute;top:50%;right:2em;transform:translateY(-50%);width:40px;height:2px;background-color:#333;transition:.3s}.button22 a::after{content:'';position:absolute;top:50%;right:calc(2em - 2px);transform:translateY(-50%);width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent #333;transition:.3s}.button22 a:hover{text-decoration:none;background-color:#bbb}.button22 a:hover::before,.button22 a:hover::after{right:1.7em}.button23 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button23 a::after{content:'';position:absolute;bottom:10px;right:10px;width:0;height:0;border-style:solid;border-width:0 0 12px 12px;border-color:transparent transparent #333 transparent;transition:.3s}.button23 a:hover{text-decoration:none;background-color:#bbb}.button23 a:hover::after{bottom:8px;right:8px}.button24 a{display:block;position:relative;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;border-radius:30px 0 30px 30px;transition:.3s}.button24 a::after{content:'';position:absolute;top:10px;right:10px;width:0;height:0;border-style:solid;border-width:0 10px 10px 0;border-color:transparent #333 transparent transparent;transition:.3s}.button24 a:hover{text-decoration:none;background-color:#bbb}.button24 a:hover::after{top:8px;right:8px}.button25 a{display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:1em 2em;max-width:300px;color:#333;font-size:18px;font-weight:700;background-color:#ccc;transition:.3s}.button25 a::after{content:'';width:10px;height:10px;background-color:#2285b1;border-radius:50vh;transition:.3s}.button25 a:hover{text-decoration:none;background-color:#bbb}.button25 a:hover::after{transform:scale(2)}.button26{text-align:center}.button26 a{display:inline-block;position:relative;padding:1em 110px 1em 0;color:#333;font-size:18px;font-weight:700;transition:.3s}.button26 a::before{content:'';position:absolute;top:50%;right:0;transform:translateY(-50%);width:80px;height:80px;border:3px solid #aaa;border-radius:50vh;transition:.3s}.button26 a::after{content:'';position:absolute;top:50%;right:40px;transform:translateY(-50%) rotate(45deg);width:5px;height:5px;border-top:2px solid #333;border-right:2px solid #333;transition:.3s}.button26 a:hover{text-decoration:underline}.button26 a:hover::before{background-color:#333}.button26 a:hover::after{border-top:2px solid #f2f2f2;border-right:2px solid #f2f2f2}.button27{text-align:center}.button27 a{display:inline-block;position:relative;padding:1em 1em 1em 50px;color:#333;font-size:18px;font-weight:700;transition:.3s}.button27 a::before{content:'';position:absolute;top:50%;left:0;transform:translateY(-50%);width:30px;height:30px;border:3px solid #aaa;border-radius:50vh;transition:.3s}.button27 a::after{content:'';position:absolute;top:50%;left:15px;transform:translateY(-50%) rotate(45deg);width:3px;height:3px;border-top:1px solid #333;border-right:1px solid #333;transition:.3s}.button27 a:hover{text-decoration:underline}.button27 a:hover::before{background-color:#333}.button27 a:hover::after{border-top:1px solid #f2f2f2;border-right:1px solid #f2f2f2}.button28 a{display:block;position:relative;margin:0 auto;padding:1em 2em 1em 50px;max-width:300px;color:#333;font-size:18px;font-weight:700;border-bottom:2px solid;border-image:linear-gradient(90deg,#2285b1 0,#2285b1 30px,#aaa 30px,#aaa 100%);border-image-slice:1;transition:.3s}.button28 a::before{content:'';position:absolute;bottom:0;left:0;width:30px;height:100%;background-color:#2285b1;transition:.3s;opacity:0}.button28 a::after{content:'';position:absolute;top:50%;left:10px;transform:translateY(-50%) rotate(45deg);width:5px;height:5px;border-top:2px solid #2285b1;border-right:2px solid #2285b1}.button28 a:hover{text-decoration:none;background-color:#ccc}.button28 a:hover::before{opacity:1}.button28 a:hover::after{border-top:2px solid #f2f2f2;border-right:2px solid #f2f2f2}.button29 a{display:flex;justify-content:center;align-items:center;margin:0 auto;width:80px;height:80px;background-color:#ccc;border-radius:50vh;transition:.3s}.button29 a::after{content:'';width:7px;height:7px;border-top:3px solid #333;border-left:3px solid #333;transform:rotate(45deg);transition:.3s}.button29 span{width:0;height:0;visibility:hidden}.button29 a:hover{background-color:#333}.button29 a:hover::after{border-top:3px solid #f2f2f2;border-left:3px solid #f2f2f2}.button30 a{display:flex;justify-content:center;align-items:center;margin:0 auto;width:80px;height:80px;background-color:#ccc;border:3px solid #aaa;border-radius:50vh;transition:.3s}.button30 a::after{content:'';width:7px;height:7px;border-top:3px solid #333;border-left:3px solid #333;transform:rotate(45deg);transition:.3s}.button30 span{width:0;height:0;visibility:hidden}.button30 a:hover{background-color:#333}.button30 a:hover::after{border-top:3px solid #f2f2f2;border-left:3px solid #f2f2f2;transform:translateY(-5px) rotate(45deg)}.code-example{margin-bottom:32px;padding:64px 32px;background-color:#f8f8f8;border-radius:8px}