@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@100;200;300;400;500;600;700&family=Poppins:wght@100;200;300;400;500;600&family=Oleo+Script:wght@400;700&family=Source+Sans+Pro&family=Inter&family=Courgette&family=Goldman&family=Roboto+Slab:wght@300;600&display=swap);:root{--primary-color:#2a73cc;--primary-color-hover:#215699;--primary-color-light:#e7eef9;--secondary-color:#153966;--light-color:#eff2fa;--light-color-hover:#f0f0f0;--dark-color:#333333;--shadow:0 0 5px 0 rgba(0, 0, 0, 0.1);--border-color:#e5e7eb;--border-radius:5px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--light-color);print-color-adjust:exact;-webkit-print-color-adjust:exact;font-family:Nunito,Inter,sans-serif;margin:0}body a{text-decoration:none;color:var(--primary-color)}.screen-reader-text{position:absolute;width:1px;height:1px;clip:rect(1px,1px,1px,1px);overflow:hidden;opacity:0;visibility:hidden}.main-content ol,.main-content ul{text-align:justify;margin-left:-10px;line-height:1.8}button,input,li,p,select{color:#212223;font-size:16px;font-weight:400}h1,h2,h3,h4,h5,h6{font-family:Poppins,Inter,sans-serif;font-weight:500;color:var(--dark-color);text-align:left}.page-title{margin:30px auto}.section{display:grid;grid-template-columns:22% 1fr 15%;grid-template-areas:'sidebar-left content sidebar-right' 'sidebar-left content-footer sidebar-right';grid-auto-rows:min-content;background-color:#fff}.main-content-home{display:flex;flex-direction:column;width:100%;position:relative;overflow:hidden}.main-content{width:100%;overflow:hidden;grid-area:content;z-index:100;position:relative;padding:0 30px;height:fit-content;display:flex;flex-direction:column;gap:30px;border-left:1px solid rgba(0,0,0,.05);border-right:1px solid rgba(0,0,0,.05);box-shadow:-1px 0 5px -10px rgba(0,0,0,.5),1px 0 5px -15px rgba(0,0,0,.5)}article>ol,article>p,article>ul{text-align:justify}.main-content article>:last-child{margin-bottom:0}.content-footer{grid-area:content-footer;grid-column:2;position:relative;display:flex;flex-direction:column;gap:30px;padding:0;padding-bottom:30px;border-left:1px solid rgba(0,0,0,.05);border-right:1px solid rgba(0,0,0,.05);box-shadow:-1px 0 5px -15px rgba(0,0,0,.5),1px 0 5px -15px rgba(0,0,0,.5)}.main-content h1{font-size:36px;margin-top:0;margin-bottom:50px;font-weight:600}.main-content h2{font-size:34px;margin-top:50px;margin-bottom:20px;font-weight:500}.main-content h3{font-size:26px;margin-top:40px;margin-bottom:20px;font-weight:400}.main-content h4{font-size:22px;margin-top:30px;margin-bottom:20px;font-weight:400}.main-content h5{font-size:20px;margin-top:10px;margin-bottom:10px;font-weight:400}.main-content h6{font-size:20px;margin-top:10px;margin-bottom:10px;font-weight:400}.main-content p a,.main-content table a,.main-content ul li a{color:var(--primary-color);text-decoration:underline}.main-content p a:hover,.main-content table a:hover,.main-content ul li a:hover{color:var(--primary-color-hover)}.main-content a[target*="_blank"]:after{font-family:tutsinsider;content:'\e959';font-size:10px;padding-left:5px;text-decoration:none}.main-content>a[target*="_blank"]:after{border-bottom:1px solid}.main-content p{font-size:16px;line-height:1.8;text-align:justify}.main-content table{font-size:1rem;margin:30px auto;border:1px solid #999;width:100%;border-collapse:collapse}.main-content table caption{background:var(--light-color);color:#000;border:1px solid #ddd;text-align:center;padding:10px 0;text-transform:uppercase;font-weight:900;font-size:16px}.main-content table caption a{color:#3949ab}.main-content table thead{font-weight:900;line-height:30px;font-size:110%;background:var(--light-color);color:#333}.main-content table tbody tr:hover{background:#f7f7f4}.main-content table tr td,.main-content table tr th{padding:5px;padding-left:10px;padding-right:10px}.main-content table td,.main-content table th{border:1px solid #ddd}@media screen and (max-width:680px){.main-content-home{display:flex}.section{display:flex;flex-direction:column;align-items:center}.main-content{padding:15px;width:100%}.content-footer{width:100%;margin-bottom:0}.main-content h1{font-size:30px;margin-bottom:30px;line-height:1.5}.main-content h2{font-size:24px;margin-top:26px;margin-bottom:26px}.main-content h3{font-size:22px;margin-top:22px;margin-bottom:22px}.main-content h4{font-size:20px;margin-top:20px;margin-bottom:20px}.main-content h5{font-size:20px;margin-top:10px;margin-bottom:10px}.main-content h6{font-size:20px;margin-top:10px;margin-bottom:10px}}.sidebar-left{grid-area:sidebar-left}.sidebar-right{grid-area:sidebar-right;padding-left:30px}.section>input[type=checkbox]{display:none}.sidebar-left,.sidebar-right{padding-top:30px;background-color:var(--light-color)}.sidebar-left{position:sticky;top:40px;overflow-y:auto;max-height:calc(100vh - 40px)}body.tools-template-default .sidebar-left{top:0;max-height:100vh}@media (max-width:680px){.sidebar-left{position:relative;top:initial;overflow-y:initial;margin:auto;max-height:initial}body.tools-template-default .sidebar-left{top:0;max-height:100vh}}.sidebar-posts-list-outer{border-bottom:1px solid var(--border-color);margin-bottom:8px}.sidebar-posts-list-outer:nth-last-child(2){border-bottom:none}.sidebar-posts-list-outer input[type=checkbox]{display:none}.sidebar-posts-title{cursor:pointer;position:relative;margin:0}.sidebar-pagelist-title,.sidebar-posts-title label{display:flex;justify-content:space-between;align-items:center;width:100%;padding:10px 30px;font-size:1rem;font-weight:600;color:var(--primary-color);cursor:pointer}.sidebar-posts-title label::after{content:'\e909';font-family:tutsinsider;color:var(--primary-color);transform:rotate(90deg);position:absolute;right:20px;font-size:16px;transition:transform .3s cubic-bezier(.25, .1, .25, 1)}.sidebar-posts-list-inner{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.25, .1, .25, 1)}.has-nested-posts{display:flex;justify-content:space-between;align-items:center;width:100%;cursor:pointer;position:relative}.has-nested-posts a{width:100%}.has-nested-posts::after{content:'\e905';font-family:tutsinsider;color:#ccc;position:absolute;right:20px;font-size:16px;transition:transform .3s cubic-bezier(.25, .1, .25, 1)}.has-nested-posts+.sidebar-nested-posts{display:none}.sidebar-posts.active.has-nested-posts::after,.sidebar-posts.has-active-nested::after{content:'\e903'}.sidebar-nested-posts.is-active,.sidebar-posts.active.has-nested-posts+.sidebar-nested-posts{display:block}.sidebar-nested-posts{background:#fff;box-shadow:inset 0 3px 5px -5px #333,inset 0 -3px 5px -5px #333}.sidebar-left .sidebar-posts,.sidebar-right .sidebar-posts{display:block;padding:5px 30px;font-size:.95rem;line-height:26px;color:var(--dark-color);text-decoration:none;transition:background-color .2s ease,color .2s ease}.sidebar-posts.active::after,.sidebar-posts.has-active-nested,.sidebar-posts.has-active-nested::after{color:var(--primary-color)}.sidebar-posts:hover{background-color:var(--primary-color-light);color:var(--primary-color)}.sidebar-posts.active{background-color:var(--primary-color);color:var(--light-color)}.sidebar-posts-list-outer input[type=checkbox]:checked~.sidebar-posts-list-inner{max-height:1000px;padding-bottom:10px}.sidebar-posts-list-outer input[type=checkbox]:not(:checked)~.sidebar-posts-title label{color:#333}.sidebar-posts-list-outer input[type=checkbox]:not(:checked)~.sidebar-posts-title label::after{transform:rotate(0);color:#333}@media (max-width:680px){.sidebar-posts-title{margin:0}}.sidebar-right .sidebar-posts-list-outer{border-bottom:1px solid var(--border-color);padding-bottom:8px}.sidebar-right .sidebar-posts-list-outer:last-child{border-bottom:none}.sidebar-right .sidebar-posts-title label{padding:10px 0}.sidebar-posts-list-outer.page .sidebar-posts-title label:hover,.sidebar-right .sidebar-posts-title label:hover{cursor:default}.sidebar-posts-list-outer.page .sidebar-posts-title label::after,.sidebar-right label::after{content:''}.sidebar-right .sidebar-posts-list-inner a{padding:5px 0}.sidebar-right .sidebar-posts-list-inner a:hover{background:initial}.sidebar-posts-list-outer.page .sidebar-posts-list-inner,.sidebar-right .sidebar-posts-list-inner{max-height:1500px}.validation-checkbox-value{display:inline-flex;float:right;margin-top:10px;text-decoration:none;opacity:.3}.validation-passed{color:#0ac80a}.validation-failed{color:#ef0e0e}.sidebar-left-ad-unit{margin:24px 16px;text-align:center}.footer{background-color:var(--secondary-color);color:#cdd3d8;padding:60px 5% 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-template-rows:auto auto auto;gap:40px;position:relative;border-top:5px solid var(--primary-color);overflow:hidden}.footer::before{content:'';position:absolute;top:-50px;left:-50px;width:250px;height:250px;background-color:rgba(255,255,255,.05);border-radius:50%;transform:rotate(45deg);pointer-events:none}.footer::after{content:'';position:absolute;bottom:-70px;right:-70px;width:150px;height:150px;background-color:rgba(255,255,255,.03);border-radius:50%;transform:rotate(-30deg);pointer-events:none}.footer-menu,.footer-subscribe,.footer-title-section{display:flex;flex-direction:column;gap:20px}.footer-title-section{grid-row:1;grid-column:1/-1;margin:auto}.footer-title{font-size:3rem;font-weight:700;font-family:Goldman,cursive;color:var(--light-color);text-decoration:none;display:inline-flex;align-items:center;gap:12px;transition:color .3s ease}.footer-logo-icon{font-size:1.2em;color:var(--light-color)!important;transition:color .3s ease}.footer-title:hover,.footer-title:hover i{color:var(--primary-color)!important}.footer-menu{grid-row:2;display:flex;flex-direction:row;gap:60px;grid-column:span 2}.footer-menu nav{flex:1}.footer-menu nav::before{content:attr(data-title);font-size:18px;font-weight:600;color:var(--light-color);margin-bottom:15px;display:block}.footer-menu ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}.footer-menu .menu-item a{color:#cdd3d8;text-decoration:none;font-size:15px;transition:color .3s ease,padding-left .3s ease;position:relative}.footer-menu .menu-item a:hover{color:var(--light-color);padding-left:8px}.footer-menu .menu-item a::before{content:'\e905';font-family:tutsinsider;position:absolute;left:-5px;opacity:0;transition:opacity .3s ease,left .3s ease;color:var(--primary-color)}.footer-menu .menu-item a:hover::before{opacity:1;left:-2px}.footer-subscribe{grid-row:2;position:relative}.footer-subscribe-form{display:flex;flex-direction:column;gap:15px}.footer-subscribe::before{content:'Stay Updated';font-size:18px;font-weight:600;color:var(--light-color);display:block}.footer-subscribe-form input[type=email]{width:100%;padding:12px 15px;border-radius:8px;border:1px solid #3a5f94;background:#a8a8a8;color:#333;font-family:Poppins,sans-serif;font-size:14px;transition:border-color .3s ease,box-shadow .3s ease,background .3s ease}.footer-subscribe-form input[type=email]:focus,.footer-subscribe-form input[type=email]:not(:placeholder-shown){outline:0;border-color:var(--primary-color);background:var(--light-color);box-shadow:0 0 0 3px rgba(42,115,204,.3)}.footer-subscribe-form input[type=email]::placeholder{color:#575757}.footer-subscribe-form button[type=submit]{padding:12px 20px;border-radius:8px;border:none;background-color:var(--primary-color);color:var(--light-color);font-size:16px;cursor:pointer;transition:background-color .3s ease,transform .2s ease}.footer-subscribe-form button[type=submit]:hover{background-color:var(--primary-color-hover);transform:translateY(-2px)}.grecaptcha-badge{z-index:9999!important}.subscriber-message{font-size:1rem;font-weight:600}.subscriber-message.success{color:#0ac80a}.subscriber-message.error{color:#ff6161}.subscriber-message.hidden{display:none}.subscriber-loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border:5px solid #fff;border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}.subscriber-loader.hidden{display:none}@keyframes rotation{0%{transform:translate(-50%,-50%) rotate(0)}100%{transform:translate(-50%,-50%) rotate(360deg)}}.footer-bottom{grid-row:3;grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding-top:30px;margin-top:30px;border-top:1px solid #3a5f94;flex-wrap:wrap;gap:20px}.copyright-text,.powerd-by,.powerd-by a{font-size:14px;color:#aab1b8}.powerd-by a{text-decoration:none;font-weight:500;color:#cdd3d8;transition:color .3s ease}.powerd-by a:hover{color:var(--primary-color)}.social-footer .menu{list-style:none;padding:0;margin:0;display:flex;gap:8px}.social-footer .menu-item a{display:inline-flex;justify-content:center;align-items:center;width:40px;height:40px;border-radius:50%;background-color:#1f4a80;color:#cdd3d8;font-size:16px;text-decoration:none;transition:background-color .3s ease,color .3s ease,transform .3s ease}.social-footer .menu-item a:hover{background-color:var(--primary-color);color:var(--light-color);transform:translateY(-3px)}.top-btn{position:fixed;bottom:20px;right:20px;z-index:999;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s ease,transform .4s ease;transform:translateY(20px)}.top-btn.show{opacity:1;visibility:visible;transform:translateY(0)}#top-btn{display:flex;align-items:center;justify-content:center;width:45px;height:45px;background-color:var(--primary-color);color:var(--light-color);border-radius:8px;text-decoration:none;font-size:20px;box-shadow:0 4px 12px rgba(0,0,0,.2);transition:background-color .3s ease,transform .3s ease}#top-btn:hover{background-color:var(--primary-color-hover);transform:scale(1.1)}.screen-reader-text{display:none}@media (max-width:680px){.footer{display:flex;flex-direction:column;padding:40px 5%;text-align:center}.footer-title{justify-content:center}.footer-menu{flex-direction:column;gap:30px;align-items:center}.footer-menu nav{width:100%;text-align:center}.footer-menu .menu-item a:hover{padding-left:0}.footer-menu .menu-item a::before{display:none}.footer-subscribe{padding:50px 10px 50px 10px;background-color:#00000025;border-radius:15px}.footer-subscribe-form{position:relative;max-width:100%}.footer-subscribe-form input[type=email]{padding-right:60px;border-radius:50px;height:50px;box-sizing:border-box}.footer-subscribe-form button[type=submit]{position:absolute;right:0;top:50%;transform:translateY(-50%);width:auto;height:50px;border-top-right-radius:50px;border-bottom-right-radius:50px;padding:0 10px;display:flex;align-items:center;justify-content:center;font-size:18px}.footer-bottom{flex-direction:column;justify-content:center;gap:15px;border-top:none;margin-top:0;padding-top:10px}.footer-copyright{text-align:center}.social-footer .menu{justify-content:center}}iframe{border:none}pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}kbd{background:var(--light-color);color:#dc143c;padding-left:4px;padding-right:4px;border-radius:2px}.bg-pattern{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAATklEQVQoU2NkYGAwZmBgOMuAACA+CKCIMSIpADGRNaEYgKwQ3WQUjTCF6CYhWw2WAynEpgjmIpg7jUlSiM0TWK2GWUOUZ7ApxggeogIcABHJFtftKVfJAAAAAElFTkSuQmCC) repeat}.highlight-green{background:#e9fde6;padding:1px 5px;border-left:5px solid #1e6014;border-right:5px solid #1e6014;border-radius:3px;display:inline-block}.highlight-blue{background:#d4f0fd;padding:1px 5px;border-left:5px solid #29b6f6;border-right:5px solid #29b6f6;border-radius:3px;display:inline-block}.highlight-red{background:#fde6e6;padding:1px 5px;border-left:5px solid #d92d2d;border-right:5px solid #d92d2d;border-radius:3px;display:inline-block}.code,.tidbit-blue,.tidbit-green,.tidbit-red{box-sizing:border-box;padding:10px;border-left:5px solid #000;margin:50px auto;border-radius:var(--border-radius);-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.15);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.15);box-shadow:0 0 5px 0 rgba(0,0,0,.15)}.code .code-body,.tidbit-body-blue,.tidbit-body-green,.tidbit-body-red{padding:10px;text-wrap:wrap}.code h3.code-heading,.main-content h3.tidbit-heading-blue,.main-content h3.tidbit-heading-green,.main-content h3.tidbit-heading-red{position:relative;padding:0 20px;display:inline-block;width:auto;font-size:30px;margin:10px 0 10px -16px;line-height:2;border-radius:0 5px 5px 0;box-shadow:-1px 2px 3px rgba(0,0,0,.5);font-family:'Source Sans Pro',sans-serif;font-weight:500}.code h3.code-heading::after,.code h3.code-heading::before,.tidbit-heading-blue::after,.tidbit-heading-blue::before,.tidbit-heading-green::after,.tidbit-heading-green::before,.tidbit-heading-red::after,.tidbit-heading-red::before{position:absolute;content:'';display:block}.code h3.code-heading::before,.tidbit-heading-blue::before,.tidbit-heading-green::before,.tidbit-heading-red::before{width:16px;height:100%;padding:0 0 10px;top:0;left:-15px;background:inherit;border-radius:5px 0 0 5px}.code h3.code-heading::after,.tidbit-heading-blue::after,.tidbit-heading-green::after,.tidbit-heading-red::after{width:11px;height:6px;background:rgba(0,0,0,.5);bottom:-6px;left:-10px;border-radius:5px 0 0 5px;box-shadow:inset -1px 2px 2px rgba(0,0,0,.3)}.tidbit-green{background:#e9fde6;color:#333}.tidbit-heading-green{background:#1e6014;color:#e9fde6}.tidbit-blue{background:#d4f0fd;color:#333}.tidbit-heading-blue{background:#29b6f6;color:#333}.tidbit-red{background:#fde6e6;color:#333}.tidbit-heading-red{background:#d92d2d;color:#fde6e6}.code-example{display:block;width:100%;overflow:hidden;background-color:#f8f9fa;border:1px solid #dee2e6;border-radius:10px;margin:50px auto}.code-example .code-file-name{padding:5px 0;margin:0 20px;color:#212529;border-radius:0;display:block;font-size:.85rem;font-weight:600;letter-spacing:.5px;box-shadow:none;transition:background .3s ease;border-bottom:1px solid #dee2e6}.code-example .code-header{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:var(--light-color);border-bottom:1px solid #dee2e6;box-shadow:inset 0 -1px 0 rgba(0,0,0,.05)}.code-example .code-header-heading{display:flex;align-items:center;gap:10px}.code-example .header-icon{display:flex;align-items:center;justify-content:center}.code-example h3.code-heading{font-size:1.1rem;margin:0;padding:0;font-weight:700;color:#153966;letter-spacing:.2px}.code-example .code-header-controls{display:flex;align-items:center;gap:8px}.code-example .code-toggle-group{display:flex;border-radius:50px;overflow:hidden;border:1px solid #ccc}.code-example .cc-button{display:flex;align-items:center;gap:6px;padding:6px 12px;font-size:.875rem;font-weight:600;background-color:#fff;color:#495057;cursor:pointer;transition:all .25s ease;border:none;outline:0;text-decoration:none;white-space:nowrap}.code-example .code-toggle{border:1px solid #dee2e6;transition:all .3s ease}.code-example .code-toggle:last-child{border-right:none}.code-example .code-toggle i{max-width:0;height:16px;opacity:0;overflow:hidden;transition:all .5s ease;color:var(--light-color)}.code-example .code-toggle.active i{max-width:16px;opacity:1}.code-example .code-copy{border-radius:50px;border:1px solid #ccc;transition:all .3s ease}.code-example .cc-button.active,.code-example .cc-button.copying,.code-example .cc-button:not(.active):hover{background-color:var(--primary-color);color:var(--light-color);border-color:var(--primary-color)}.code-example a.tryit-btn{background-image:linear-gradient(to right,#2a73cc 0,#153966 100%);color:#fff;text-decoration:none;border-radius:50px;transition:all .3s ease-in-out;padding:6px 15px}.code-example a.tryit-btn:active,.code-example a.tryit-btn:focus,.code-example a.tryit-btn:hover{color:#fff!important;background-image:linear-gradient(to right,#2a73cc 0,#0d233f 100%)!important}.code-example .code-body{margin:15px;padding:10px;font-size:14px;color:#212529;overflow:auto;tab-size:2;-moz-tab-size:2;-o-tab-size:2;white-space:pre;word-wrap:normal;word-break:normal;line-height:23px;background:#fff;border-radius:8px;box-shadow:inset 0 0 5px 0 rgba(0,0,0,.3)}.code-example .code-output{margin:15px;padding:15px 20px;background:#fff;border-radius:8px;box-shadow:inset 0 0 5px 0 rgba(0,0,0,.3)}.code-description+.code-body,.code-description+.code-output{margin-top:5px}.code-description{margin:0 15px;color:#555;font-size:14px;font-weight:500;padding:5px 0;border-bottom:1px solid #dee2e6}.code-example .code-body{scrollbar-width:thin;scrollbar-color:var(--secondary-color) var(--light-color)}.code-example .code-body::-webkit-scrollbar{height:10px;width:10px}.code-example .code-body::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.code-example .code-body::-webkit-scrollbar-thumb{background:#888;border-radius:10px}.code-example .code-body::-webkit-scrollbar-thumb:hover{background:#555}.code-example>p{padding:0 15px}@media (max-width:680px){.code-example{margin:30px auto}.code-example .code-file-name{padding:5px 0;margin:0 10px}.code-example .code-header{padding:10px;gap:10px}.code-example h3.code-heading{font-size:1rem}.code-example .cc-button,.code-example a.tryit-btn{padding:5px 10px;font-size:.8rem}.code-example .code-body,.code-example .code-output{margin:10px}}@media (max-width:380px){.code-example{margin:30px auto}.code-example .code-file-name{padding:5px 0;margin:0 10px}.code-example .code-header{padding:10px;gap:10px;flex-direction:column;align-items:flex-start}.code-example h3.code-heading{font-size:1rem}.code-example .cc-button,.code-example a.tryit-btn{padding:5px 10px;font-size:.8rem}.code-example .code-body,.code-example .code-output{margin:10px}}a.reference-link{background:var(--light-color);display:block;padding:5px;border-radius:4px;color:#000;text-align:center;max-width:400px;margin:10px auto;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.5);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.5);box-shadow:0 0 5px 0 rgba(0,0,0,.5)}a.reference-link:active,a.reference-link:focus,a.reference-link:hover{background:#e9eaf8}@media screen and (max-width:680px){.single-tutorial .tutorial-btn{font-size:14px;margin-top:10px;margin-bottom:5px;margin-left:-5px}.tidbit-blue,.tidbit-green,.tidbit-red{margin:20px auto}.tidbit-body-blue,.tidbit-body-green,.tidbit-body-red{padding:10px;margin:5px}.main-content h3.tidbit-heading-blue,.main-content h3.tidbit-heading-green,.main-content h3.tidbit-heading-red{font-size:20px;margin-top:0}}.code{box-sizing:border-box;padding:10px;margin:50px auto;width:100%;border-radius:var(--border-radius);background:var(--light-color);border-left:5px solid var(--primary-color);-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.15);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.15);box-shadow:0 0 5px 0 rgba(0,0,0,.15)}.code .code p{margin:0 10px}.code .code-heading{background:var(--primary-color);color:#fff}.code .code-file-name{padding:0 10px;margin:10px;margin-bottom:-10px;background:#999;color:#fff}.code .code-file-name:hover{background:#aaa}.code .code-body{padding:0 10px;tab-size:2;text-align:left;-moz-tab-size:2;-o-tab-size:2;display:block;overflow-x:auto;overflow-y:auto;text-wrap:wrap;margin:10px;font-size:14px;border-radius:2px;line-height:1.9;background-image:repeating-linear-gradient(#f8f8f8 0 27px,#fdfdfd 27px 53px);-webkit-box-shadow:inset 0 0 3px 0 rgba(0,0,0,.5);-moz-box-shadow:inset 0 0 3px 0 rgba(0,0,0,.5);box-shadow:inset 0 0 3px 0 rgba(0,0,0,.5)}.code .tryit-btn{display:inline-block;padding:5px 10px;margin:5px 0 0 10px;background:var(--primary-color);color:#fff;font-size:16px;font-weight:500;text-decoration:none;text-transform:uppercase;border-radius:var(--border-radius);transition:all .3s ease-in-out}.code .tryit-btn:active,.code .tryit-btn:focus,.code .tryit-btn:hover{color:#fff;-webkit-box-shadow:0 0 0 5px var(--primary-color-light);-moz-box-shadow:0 0 0 5px var(--primary-color-light);box-shadow:0 0 0 5px var(--primary-color-light);transition:all .3s ease-in-out}.code h3.code-output-heading{background:var(--light-color);color:#000;border-top-left-radius:5px;border-top-right-radius:5px;margin-bottom:0}.code .code-output,.code h3.code-output-heading{padding:10px;-webkit-box-shadow:inset 0 0 3px 0 rgba(0,0,0,.5);-moz-box-shadow:inset 0 0 3px 0 rgba(0,0,0,.5);box-shadow:inset 0 0 3px 0 rgba(0,0,0,.5)}.code .code-output{margin:10px;background:#fff;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.code a.reference-link{background:var(--light-color);display:block;padding:5px;border-radius:4px;color:#000;text-align:center;max-width:400px;margin:10px auto;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.5);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.5);box-shadow:0 0 5px 0 rgba(0,0,0,.5)}.code a.reference-link:active,.code a.reference-link:focus,.code a.reference-link:hover{background:#e9eaf8}@media screen and (max-width:680px){.code .code-body{tab-size:1;-moz-tab-size:1;-o-tab-size:1}.code .code .tryit-btn,.code .single-tutorial .tutorial-btn{font-size:14px;margin-top:10px;margin-bottom:5px;margin-left:-5px}.code .code-output,.code h3.code-output-heading{font-size:20px}.code .code,.code .tidbit-blue,.code .tidbit-green,.code .tidbit-red{margin:20px auto}.code .code-body,.code .tidbit-body-blue,.code .tidbit-body-green,.code .tidbit-body-red{padding:10px;margin:5px}.code .main-content h3.code-heading,.code .main-content h3.tidbit-heading-blue,.code .main-content h3.tidbit-heading-green,.code .main-content h3.tidbit-heading-red{font-size:20px;margin-top:0}.code .code-output{margin:5px}.code .code-file-name{margin:5px 5px -5px 5px}}.code-wrapper .hidden{display:none}.tabs-wrapper{display:flex;margin:0 10px;border-bottom:1px solid #ddd;width:max-content}.code-tab{padding:0 20px;cursor:pointer;border:1px solid transparent;border-bottom:none;margin-bottom:-1px}.code-tab.active{border-color:#ddd;border-bottom-color:#fff;background-color:#fff;color:var(--primary-color);font-weight:600}.code-tab:not(.active):hover{background-color:#f5f5f5}.single-tab{cursor:pointer;padding:0;margin:0 25px;display:inline-block;position:relative}.single-tab:first-child{margin-left:0}.single-tab:last-child{margin-right:0}.single-tab:before{font-family:tutsinsider;position:absolute;content:'\e935';margin-left:-30px;font-weight:900;color:#000}.single-tab:first-child:before{content:'';margin-left:-30px}.code .radio{display:none}.example-wrapper1 .tab1-content,.example-wrapper1 .tab2-content,.example-wrapper1 .tab3-content,.example-wrapper10 .tab1-content,.example-wrapper10 .tab2-content,.example-wrapper10 .tab3-content,.example-wrapper2 .tab1-content,.example-wrapper2 .tab2-content,.example-wrapper2 .tab3-content,.example-wrapper3 .tab1-content,.example-wrapper3 .tab2-content,.example-wrapper3 .tab3-content,.example-wrapper4 .tab1-content,.example-wrapper4 .tab2-content,.example-wrapper4 .tab3-content,.example-wrapper5 .tab1-content,.example-wrapper5 .tab2-content,.example-wrapper5 .tab3-content,.example-wrapper6 .tab1-content,.example-wrapper6 .tab2-content,.example-wrapper6 .tab3-content,.example-wrapper7 .tab1-content,.example-wrapper7 .tab2-content,.example-wrapper7 .tab3-content,.example-wrapper8 .tab1-content,.example-wrapper8 .tab2-content,.example-wrapper8 .tab3-content,.example-wrapper9 .tab1-content,.example-wrapper9 .tab2-content,.example-wrapper9 .tab3-content{display:none;opacity:0;animation:sass-fade .5s ease-in-out}@keyframes sass-fade{0%{opacity:0}100%{opacity:1}}#tab1-input10:checked~.code-wrapper10 .tab1-content,#tab1-input1:checked~.code-wrapper1 .tab1-content,#tab1-input2:checked~.code-wrapper2 .tab1-content,#tab1-input3:checked~.code-wrapper3 .tab1-content,#tab1-input4:checked~.code-wrapper4 .tab1-content,#tab1-input5:checked~.code-wrapper5 .tab1-content,#tab1-input6:checked~.code-wrapper6 .tab1-content,#tab1-input7:checked~.code-wrapper7 .tab1-content,#tab1-input8:checked~.code-wrapper8 .tab1-content,#tab1-input9:checked~.code-wrapper9 .tab1-content,#tab2-input10:checked~.code-wrapper10 .tab2-content,#tab2-input1:checked~.code-wrapper1 .tab2-content,#tab2-input2:checked~.code-wrapper2 .tab2-content,#tab2-input3:checked~.code-wrapper3 .tab2-content,#tab2-input4:checked~.code-wrapper4 .tab2-content,#tab2-input5:checked~.code-wrapper5 .tab2-content,#tab2-input6:checked~.code-wrapper6 .tab2-content,#tab2-input7:checked~.code-wrapper7 .tab2-content,#tab2-input8:checked~.code-wrapper8 .tab2-content,#tab2-input9:checked~.code-wrapper9 .tab2-content,#tab3-input10:checked~.code-wrapper10 .tab3-content,#tab3-input1:checked~.code-wrapper1 .tab3-content,#tab3-input2:checked~.code-wrapper2 .tab3-content,#tab3-input3:checked~.code-wrapper3 .tab3-content,#tab3-input4:checked~.code-wrapper4 .tab3-content,#tab3-input5:checked~.code-wrapper5 .tab3-content,#tab3-input6:checked~.code-wrapper6 .tab3-content,#tab3-input7:checked~.code-wrapper7 .tab3-content,#tab3-input8:checked~.code-wrapper8 .tab3-content,#tab3-input9:checked~.code-wrapper9 .tab3-content{display:block;opacity:1}#tab1-input10:checked~.tabs-wrapper .first-tab,#tab1-input1:checked~.tabs-wrapper .first-tab,#tab1-input2:checked~.tabs-wrapper .first-tab,#tab1-input3:checked~.tabs-wrapper .first-tab,#tab1-input4:checked~.tabs-wrapper .first-tab,#tab1-input5:checked~.tabs-wrapper .first-tab,#tab1-input6:checked~.tabs-wrapper .first-tab,#tab1-input7:checked~.tabs-wrapper .first-tab,#tab1-input8:checked~.tabs-wrapper .first-tab,#tab1-input9:checked~.tabs-wrapper .first-tab,#tab2-input10:checked~.tabs-wrapper .second-tab,#tab2-input1:checked~.tabs-wrapper .second-tab,#tab2-input2:checked~.tabs-wrapper .second-tab,#tab2-input3:checked~.tabs-wrapper .second-tab,#tab2-input4:checked~.tabs-wrapper .second-tab,#tab2-input5:checked~.tabs-wrapper .second-tab,#tab2-input6:checked~.tabs-wrapper .second-tab,#tab2-input7:checked~.tabs-wrapper .second-tab,#tab2-input8:checked~.tabs-wrapper .second-tab,#tab2-input9:checked~.tabs-wrapper .second-tab,#tab3-input10:checked~.tabs-wrapper .third-tab,#tab3-input1:checked~.tabs-wrapper .third-tab,#tab3-input2:checked~.tabs-wrapper .third-tab,#tab3-input3:checked~.tabs-wrapper .third-tab,#tab3-input4:checked~.tabs-wrapper .third-tab,#tab3-input5:checked~.tabs-wrapper .third-tab,#tab3-input6:checked~.tabs-wrapper .third-tab,#tab3-input7:checked~.tabs-wrapper .third-tab,#tab3-input8:checked~.tabs-wrapper .third-tab,#tab3-input9:checked~.tabs-wrapper .third-tab{color:var(--primary-color);font-weight:900}@media screen and (max-width:680px){.tabs-wrapper{font-size:12px;margin:0 5px}.code-tab{padding:0 10px}}.header-ad-unit{display:block}.article-ad-unit-1,.article-ad-unit-2,.article-ad-unit-3,.article-ending-ad-unit{display:block;width:90%;margin:0 auto}.article-ad-unit-1>.adsbygoogle,.article-ad-unit-2>.adsbygoogle,.article-ad-unit-3>.adsbygoogle,.article-ending-ad-unit>.adsbygoogle{display:block;margin:0 auto}.sidebar-left-ad-unit{display:block;width:95%;margin:0 auto}.sidebar-left-ad-unit>.adsbygoogle{display:block;margin:0 auto}.sidebar-right-ad-unit{display:block;width:95%;margin:0 auto}.sidebar-right-ad-unit>.adsbygoogle{display:block;margin:0 auto}.footer-ad-unit{display:block;width:90%;margin:0 auto}.footer-ad-unit>.adsbygoogle{display:block;margin:0 auto}.random-tools-wrapper.hidden{display:none}.random-tools-wrapper{display:flex;flex-direction:column;align-items:center;background:linear-gradient(to bottom right,var(--primary-color),var(--secondary-color));padding:2rem;width:100%;color:#fff;text-align:center;transition:all .3s ease-in-out;position:relative}.random-tools-wrapper::after{font-family:tutsinsider;font-weight:900;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;opacity:.2}.random-tools-wrapper:not(.last)::after{content:"\e913";font-size:15rem}.random-tools-wrapper.last::after{content:"\e96b";font-size:20rem}.random-tools-wrapper.last{background:linear-gradient(to bottom right,#e4e4e4,#e7e7e7);margin-bottom:0}.random-tools-wrapper::before{content:'';position:absolute;top:0;left:0;width:150px;height:100%;background-image:radial-gradient(#fff 2px,transparent 2px);background-size:10px 10px;opacity:.2;pointer-events:none;z-index:1}.random-tools-wrapper.last h3{color:#333}.random-tools-wrapper h3{font-size:2rem;font-weight:800;margin-bottom:3rem;line-height:1.25;color:#fff;text-align:center}.random-tools-wrapper h3 span{font-size:80%;color:#fff;background-color:#ff3737;padding:.2em .4em;border-radius:.2em;font-weight:600;box-shadow:0 0 10px rgba(255,55,55,.5)}.random-tools-container{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;width:80%;z-index:2}.random-tools-container a{display:inline-flex;align-items:center;justify-content:center;gap:5px;background-color:#fff;font-weight:600;padding:.75rem 1.5rem;border-radius:9999px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);transition:all .3s ease-in-out;transform:translateY(0) scale(1);outline:0;position:relative;min-width:160px;font-size:1rem;text-decoration:none}.random-tools-container a:hover{transform:translateY(-4px) scale(1.05)}.random-tools-container a{color:var(--tool-color,var(--primary-color))!important}.random-tools-container a:hover{background-color:#f0f4ff!important;color:var(--tool-color,var(--primary-color))!important}.random-tools-container a:focus::after{content:'';position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;border-radius:9999px;box-shadow:0 0 0 4px #b3d4ff!important}@supports (background-color:color-mix(in srgb,#000,white)){.random-tools-container a:hover{background-color:color-mix(in srgb,var(--tool-color,var(--primary-color)),#fff 80%)!important}.random-tools-container a:focus::after{box-shadow:0 0 0 4px color-mix(in srgb,var(--tool-color,var(--primary-color)),#fff 50%)!important}}@media (max-width:680px){.random-tools-wrapper{padding:1rem;margin:0}.random-tools-wrapper::after,.random-tools-wrapper:not(.last)::after{font-size:10rem}.random-tools-wrapper.last::after{font-size:15rem}.random-tools-wrapper::before{width:100px;background-size:8px 8px}.random-tools-wrapper h3{font-size:1.75rem;margin-bottom:2rem}.random-tools-wrapper h3 span{font-size:75%;padding:.15em .3em}.random-tools-container{width:90%;gap:.75rem}.random-tools-container a{padding:.6rem 1.2rem;min-width:unset;font-size:.9rem}}[data-tooltip-bottom],[data-tooltip-top]{position:relative;cursor:pointer}[data-tooltip-bottom]::before,[data-tooltip-top]::before{content:attr(data-tooltip-top);position:absolute;background-color:#333;color:#fff;padding:0 10px;height:30px;line-height:30px;border-radius:4px;font-size:13px;white-space:nowrap;z-index:10;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;pointer-events:none;left:50%;transform:translateX(-50%)}[data-tooltip-bottom]::after,[data-tooltip-top]::after{content:"";position:absolute;left:50%;transform:translateX(-50%);border-style:solid;z-index:10;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;pointer-events:none}[data-tooltip-top]::before{bottom:125%}[data-tooltip-top]::after{bottom:calc(125% - 5px);border-width:5px 5px 0 5px;border-color:#333 transparent transparent transparent}[data-tooltip-bottom]::before{top:125%;content:attr(data-tooltip-bottom)}[data-tooltip-bottom]::after{top:calc(125% - 5px);border-width:0 5px 5px 5px;border-color:transparent transparent #333 transparent}[data-tooltip-bottom]:hover::after,[data-tooltip-bottom]:hover::before,[data-tooltip-top]:hover::after,[data-tooltip-top]:hover::before{opacity:1;visibility:visible}@media screen and (max-width:690px){::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background-color:#fff;box-shadow:inset 0 0 5px 0 #a8a5a5}::-webkit-scrollbar-thumb{background-color:#333;border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:var(--primary-color)}}input[type=search]::-webkit-search-cancel-button{display:none}input::-webkit-clear-button,input::-webkit-search-cancel-button{display:none}input::-ms-clear,input::-ms-reveal{display:none}.related-posts-container{padding:0 30px;overflow:hidden;position:relative;border-top:1px solid var(--border-color)}h2.related-posts-heading{font-size:1.5rem;font-weight:700;color:#111827;padding:20px 0;margin:0;border-bottom:1px solid var(--border-color);display:flex;align-items:center;position:relative}.related-posts-heading i,.related-posts-icon{display:inline-flex;justify-content:center;align-items:center;max-width:40px;width:100%;height:40px;background-color:var(--light-color);border:1px solid transparent;color:var(--color);border-radius:30px;margin-right:16px;font-size:1.2rem;transition:all .3s ease}.related-posts-heading i{background-color:var(--primary-color);color:var(--light-color)}.related-posts{list-style:none;padding:0;margin:0}.related-posts-item a.related-posts-link{display:flex;align-items:center;padding:10px 0;text-decoration:none;color:#374151;font-weight:500;transition:background-color .2s ease,color .2s ease;border-bottom:1px solid #f9f9f9}.related-posts-item:last-child a.related-posts-link{border-bottom:none}.related-posts-item a.related-posts-link:hover{color:var(--color,var(--primary-color))}.related-posts-item a.related-posts-link:hover .related-posts-icon{border:1px solid var(--color,var(--primary-color))}.related-posts-container.tools .related-posts{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1rem 0 .2rem 0}@media (max-width:680px){.related-posts-container.tools .related-posts{grid-template-columns:1fr}}.related-posts-container.tools .related-posts-item a{position:relative;display:flex;flex-direction:column;gap:.5rem;border:none;background:var(--light-color);border-radius:4px;box-shadow:0 0 3px 0 rgba(0,0,0,.5);transition:all .3s ease-in-out;overflow:hidden}.related-posts-container.tools .related-posts-item a::after{content:'';width:50px;height:1px;background:var(--primary-color);position:absolute;bottom:0;left:-50px;transition:all 1s ease}.related-posts-container.tools .related-posts-item a:hover::after{left:calc(100% + 50px)}.related-posts-container.tools .related-posts-item a:hover{background:#f8f9fa;color:#333}.related-posts-container.tools a.related-posts-link:hover .related-posts-icon{border:none}.related-posts-container.tools .related-posts-item .related-posts-icon{font-size:2rem;max-width:50px;background:0 0;border:none;height:50px;border-radius:50px;line-height:50px;text-align:center}@media (max-width:680px){.related-posts-container{margin:0;border-radius:0;box-shadow:none;padding:0 15px}h2.related-posts-heading{font-size:1.2rem;padding:10px 0}.related-posts-heading i,.related-posts-icon{display:inline-flex;justify-content:center;align-items:center;max-width:40px;width:100%;height:40px;background-color:var(--light-color);border:1px solid transparent;box-shadow:inset 0 0 5px #eee;color:var(--color);border-radius:20px;margin-right:16px;font-size:1.2rem;transition:all .3s ease}.related-posts-heading i{background-color:var(--primary-color);color:var(--light-color)}.related-posts{list-style:none;padding:0;margin:0}.related-posts-item a.related-posts-link{display:flex;align-items:center;padding:10px 0;text-decoration:none;color:#374151;font-weight:500;transition:background-color .2s ease,color .2s ease;border-bottom:1px solid var(--border-color)}}mark.blue,mark.dark,mark.green,mark.red{padding:0 .4em;border-radius:4px;font-weight:600}mark.blue{background-color:#cce5ff;color:#004085}mark.green{background-color:#d4edda;color:#155724}mark.red{background-color:#f8d7da;color:#721c24}mark.dark{background-color:#343a40;color:#f8f9fa}.toc-wrapper{display:flex;justify-content:center;position:relative;margin:0 auto}.toc-tooltip{display:block;position:fixed;top:calc(-100% - 20px);padding:3px 20px;background:var(--light-color);border:2px solid #ccc;border-radius:20px;box-shadow:var(--shadow);cursor:pointer;z-index:100;width:max-content;transition:background .3s,opacity .3s,top .3s ease}.tools-template-default .toc-tooltip{padding:8px 20px}.toc-tooltip::after{content:'\e907';font-family:tutsinsider;margin-left:10px;display:inline-block;transition:transform .2s ease-in-out}.toc-wrapper.visible .toc-tooltip::after{transform:rotate(180deg)}.toc-tooltip.active{top:45px}.tools-template-default .toc-tooltip.active{top:5px}@media (max-width:680px){.toc-tooltip.active{top:35px}.tools-template-default .toc-tooltip.active{top:5px}}.toc-tooltip:hover{background:var(--light-color-hover)}.toc-tooltip-dropdown{position:fixed;top:70px;margin-left:0!important;background:#fff;border:2px solid var(--border-color);border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,.1);list-style:none;padding:0;max-height:0;overflow-y:hidden;opacity:0;transition:max-height .4s ease,opacity .4s ease;z-index:999}.tools-template-default .toc-tooltip-dropdown{top:35px}.toc-tooltip-dropdown{scrollbar-width:thin;scrollbar-color:#333 #ffffff}.toc-tooltip-dropdown::-webkit-scrollbar{width:8px}.toc-tooltip-dropdown::-webkit-scrollbar-track{background-color:#fff;box-shadow:inset 0 0 5px 0 #a8a5a5;border-radius:20px}.toc-tooltip-dropdown::-webkit-scrollbar-thumb{background-color:#333;border-radius:4px}.toc-tooltip-dropdown::-webkit-scrollbar-thumb:hover{background-color:var(--primary-color)}@supports (not selector(::-webkit-scrollbar)){.toc-tooltip-dropdown{scrollbar-color:#333 #ffffff}.toc-tooltip-dropdown:hover{scrollbar-color:var(--primary-color) #ffffff}}.toc-tooltip-dropdown>li{list-style:decimal inside;margin:0;padding:0;font-weight:600}.toc-tooltip-dropdown ol{list-style:none;margin:0;padding:0}.toc-tooltip-dropdown ol li{margin:0;position:relative;font-size:95%;line-height:20px;cursor:pointer;padding:8px 50px;color:#555;transition:all .3s ease}.toc-tooltip-dropdown ol li::before{position:absolute;left:20px;width:20px;content:attr(data-prefix)}.toc-tooltip-dropdown li{cursor:pointer;padding:8px 10px;border-bottom:1px solid #f4f4f4;transition:all .3s ease}.toc-tooltip-dropdown li.active,.toc-tooltip-dropdown li:hover,.toc-tooltip-dropdown ol li.active,.toc-tooltip-dropdown ol li:hover{background:var(--primary-color-light);color:var(--primary-color)}.modal-toggle{display:none}.modal-wrapper{display:flex;width:100%;z-index:1000}body.no-scroll{overflow:hidden}.modal-overlay{height:100vh;position:fixed;z-index:1000;top:0;left:0;right:0;bottom:0;overflow:hidden;transition:all .3s ease;background:rgba(75,74,74,.5);opacity:0;visibility:hidden}.modal-wrapper.open .modal-overlay,.modal-wrapper.open>.modal-body{visibility:visible;opacity:1;transition:all .3s ease}.mobile-menu-label .modal-trigger{color:var(--light-color);cursor:pointer;transition:all .3s ease}.mobile-menu-label .modal-trigger{margin-right:10px}.primary-search-label .modal-trigger,.sidebar-list-label .modal-trigger{color:#333;height:30px;width:60px;display:inline-flex;justify-content:center;align-items:center;cursor:pointer;flex-shrink:0;transition:all .3s ease}.sidebar-list-label .modal-trigger:focus i::before,.sidebar-list-label .modal-trigger:hover i::before{content:'\e96c'}.primary-search-label .modal-trigger:focus,.primary-search-label .modal-trigger:hover,.sidebar-list-label .modal-trigger:focus,.sidebar-list-label .modal-trigger:hover{color:var(--primary-color)}.mobile-menu-label .modal-trigger:focus i::before,.mobile-menu-label .modal-trigger:hover i::before{content:'\e96c'}.mobile-menu-modal .modal-body,.sidebar-list-modal .modal-body{display:grid;visibility:hidden;position:fixed;bottom:0;transition:all .3s ease}.mobile-menu-modal,.sidebar-list-modal{height:100vh;position:fixed;visibility:hidden;opacity:none}.mobile-menu-modal .modal-body{background:var(--light-color);grid-template-rows:70px 1fr 50px;transform:translateX(100%);width:100%;height:100dvh;right:0;top:0;bottom:0}.sidebar-list-modal .modal-body{background:var(--light-color);grid-template-rows:auto 1fr;transform:translateX(-100%);position:fixed;max-width:320px;width:100%;top:auto;left:0;bottom:0;box-shadow:5px 0 5px #5251515e;transition:all .3s ease}.mobile-menu-modal.open .modal-body,.sidebar-list-modal.open .modal-body{visibility:visible;transform:translateX(0);transition:all .3s ease}.mobile-menu-modal .modal-header,.sidebar-list-modal .modal-header,.sidebar-list-modal .sidebar-posts-list-outer.page .sidebar-posts-title label{background-color:var(--primary-color);color:#fff;display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;max-height:70px;padding:15px 25px;box-shadow:0 3px 5px 0 #ccc;letter-spacing:1px;font-family:Poppins,Inter,sans-serif;font-weight:600}.sidebar-list-modal .modal-header{padding:5px 20px;max-height:50px;background-color:#000000b9}.sidebar-list-modal .sidebar-posts-list-outer.page .sidebar-posts-title label{margin-left:0;max-height:50px;margin-bottom:20px;border-radius:none;background-color:#000000b9}.mobile-menu-modal .modal-header a{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:10px}.mobile-menu-modal .modal-title,.sidebar-list-modal .sidebar-list-title{font-size:1.4rem;font-weight:600;color:var(--light-color)}.sidebar-list-modal .sidebar-list-title{font-size:1rem}.mobile-menu-modal .modal-logo{display:flex;align-items:center;font-size:2rem}.mobile-menu-modal .modal-logo i{color:var(--light-color)}.mobile-menu-modal .modal-content,.sidebar-list-modal .modal-content{overflow-y:auto}.sidebar-list-modal .sidebar-left{margin:0;padding:0}.sidebar-list-modal .sidebar-posts-list-inner{padding:0}.mobile-menu-modal .modal-content form,.sidebar-list-modal .modal-content form{height:60px;padding:0 25px;display:flex;justify-content:center;align-items:center;position:relative}.sidebar-list-modal .modal-content form{padding:0 20px}.mobile-menu-modal form input,.sidebar-list-modal form input{height:40px;padding:10px 15px;width:100%;border-radius:50px;border:none;outline:0;background-color:#e2e0e0;transition:all .3s ease}.sidebar-list-modal form input{border:2px solid #ccc}.mobile-menu-modal form input::placeholder,.sidebar-list-modal form input::placeholder{color:#666}.mobile-menu-modal form input:focus,.mobile-menu-modal form input:hover{background-color:#fff;box-shadow:0 0 5px 0 #333}.sidebar-list-modal form input:focus,.sidebar-list-modal form input:hover{background-color:#fff;border:2px solid var(--primary-color)}.mobile-menu-modal form i,.sidebar-list-modal form i{position:absolute;border:none;outline:0;cursor:default;color:#484a4b;font-size:20px}.mobile-menu-modal form i{right:40px}.sidebar-list-modal form i{right:36px}.mobile-menu-modal .mobile-menu-input:focus~i,.mobile-menu-modal .mobile-menu-input:hover~i,.mobile-menu-modal i:focus,.mobile-menu-modal i:hover,.sidebar-list-modal .sidebar-search-input:focus~i,.sidebar-list-modal .sidebar-search-input:hover~i,.sidebar-list-modal i:focus,.sidebar-list-modal i:hover{color:var(--primary-color)}.mobile-menu-modal .mobile-menu-wrapper,.sidebar-list-modal .modal-content{scrollbar-width:thin;scrollbar-color:var(--primary-color) var(--secondary-color)}.mobile-menu-modal .mobile-menu-wrapper::-webkit-scrollbar,.sidebar-list-modal .modal-content::-webkit-scrollbar{width:8px;height:8px}.mobile-menu-modal .mobile-menu-wrapper::-webkit-scrollbar-thumb,.sidebar-list-modal .modal-content::-webkit-scrollbar-thumb{background-color:var(--primary-color);border-radius:10px}.mobile-menu-modal .mobile-menu-wrapper::-webkit-scrollbar-track,.sidebar-list-modal .modal-content::-webkit-scrollbar-track{background-color:var(--secondary-color)}.mobile-menu-modal .no-results-message,.sidebar-list-modal .no-results-message,.top-nav-modal .no-results-message{font-size:1.5rem;text-wrap:nowrap;left:50%;top:50%;transform:translate(-50%,-50%);position:absolute;color:var(--primary-color)}.mobile-menu-wrapper{width:100%;overflow-y:auto}.mobile-menu-wrapper .menu-section{border-bottom:1px solid var(--primary-color) 55}.mobile-menu-wrapper .menu-section:last-child{border-bottom:none}.mobile-menu-wrapper .menu-section-title{padding:14px 20px;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;position:relative;background:var(--light-color)}.mobile-menu-wrapper .menu-section-title i{margin-right:10px}.mobile-menu-wrapper .menu-section-title::after{content:'\e909';font-family:tutsinsider;position:absolute;right:20px;top:18px;transition:transform .3s ease}.mobile-menu-wrapper .menu-section.open>.menu-section-title::after{transform:rotate(90deg)}.mobile-menu-wrapper .menu-section-content{display:none;background-color:#fff;box-shadow:inset 0 5px 5px -5px #333,inset 0 -5px 5px -5px #333;padding:5px 0 5px 20px}.mobile-menu-wrapper .menu-section-content:has(.menu-section){background-color:initial}.menu-section:last-child .menu-section-content{box-shadow:inset 0 5px 5px -5px #333}.mobile-menu-wrapper .menu-section.open>.menu-section-content{display:block}.mobile-menu-wrapper .menu-item{padding:12px 20px;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--primary-color);background-color:#fff;border-bottom:1px solid var(--primary-color) 55}.mobile-menu-wrapper .menu-item i{margin-right:10px}.mobile-menu-wrapper .menu-item:last-child{border-bottom:none}.mobile-menu-wrapper .menu-item a{color:inherit;text-decoration:none;display:block;width:100%}.mobile-menu-wrapper .menu-section .menu-section-content{display:none}.mobile-menu-wrapper .menu-section.open>.menu-section-content{display:block}.mobile-menu-modal .modal-footer,.sidebar-list-modal .modal-footer{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;background-color:var(--light-color);box-shadow:0 -3px 5px 0 #adadad8a}.mobile-menu-modal .modal-credits,.sidebar-list-modal .modal-credits{height:50px;display:flex;align-items:center;gap:5px;font-size:10px;text-transform:uppercase}.mobile-menu-modal .modal-credits a,.sidebar-list-modal .modal-credits a{color:var(--primary-color);text-transform:capitalize;font-size:14px}.mobile-menu-modal .modal-close{position:absolute;top:25px;right:25px;cursor:pointer;z-index:1000;color:var(--light-color)}.sidebar-list-modal .modal-close{position:absolute;top:9px;border-radius:4px;right:10px;width:40px;text-align:center;font-size:20px;cursor:pointer;z-index:1000;color:var(--light-color);background-color:#444}.top-nav{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:flex-end;height:100%}.top-nav .modal-trigger{display:flex;align-items:center;flex-wrap:nowrap;color:var(--light-color);height:100%;padding:0 20px;cursor:pointer;transition:all .3s ease}.top-nav .modal-trigger:hover{background-color:var(--primary-color-hover)}.editor-brand .top-nav .modal-trigger{color:var(--primary-color)}.editor-brand .top-nav .modal-trigger:hover{background-color:var(--primary-color-light)}.top-nav .modal-trigger::after{font-family:tutsinsider;content:'\e903';margin-left:5px;transition:transform .3s ease}.top-nav-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.6);pointer-events:none;opacity:0;transition:all .1s ease;z-index:999}.top-nav-modal.open{pointer-events:auto;opacity:1;display:flex}.top-nav-modal .modal-body{position:relative;display:flex;flex-direction:column;background:#fff;overflow:hidden;width:100%;height:100%}.top-nav-modal .modal-header{position:relative;z-index:2;background:var(--primary-color);color:#fff;padding:16px 50px;font-size:1.5rem;font-weight:600;display:flex;justify-content:flex-start;align-items:center;gap:100px}.top-nav-modal .modal-header .nav-modal-search{position:fixed;top:15px;left:50%;transform:translateX(-50%)}.top-nav-modal .modal-header .nav-modal-search form{display:flex;align-items:center;position:relative}.top-nav-modal .modal-header .nav-modal-search input[type=search]{width:300px;padding:12px;padding-right:40px;font-size:1rem;border:1px solid #d1d5db;border-radius:8px;background-color:#f9fafb;color:#111827;transition:border-color .2s ease,box-shadow .2s ease}.top-nav-modal .modal-header .nav-modal-search input[type=search]::placeholder{color:#9ca3af}.top-nav-modal .modal-header .nav-modal-search input[type=search]:focus{outline:0;border-color:var(--secondary-color);box-shadow:0 0 0 3px #ffffffb9}.top-nav-modal .modal-header .nav-modal-search .ti-filter{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:1.25rem;color:#9ca3af}.top-nav-modal .modal-close{position:absolute;top:15px;right:50px;color:#fff;border-radius:var(--border-radius);background-color:#00000046;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;font-size:2rem;cursor:pointer;z-index:3}.top-nav-modal .modal-close:hover{background-color:#00000079}.top-nav-modal .modal-content{flex:1;min-height:0;overflow-y:auto;background:#f9f9f9;padding:25px}.tutorials-modal.top-nav-modal .top-nav-dropdown-content{display:flex;flex-direction:row;flex-wrap:wrap;gap:1.5rem;padding:0 25px}.tutorials-modal.top-nav-modal .top-nav-dropdown-content>*{flex-basis:350px;max-width:400px;flex-grow:1}.top-nav-modal .top-nav-dropdown-section .top-nav-dropdown-list{display:flex;flex-direction:column}.top-nav-modal .tab-nav{display:flex;border-bottom:2px solid var(--border-color);margin-bottom:16px;padding:0;margin:25px}.top-nav-modal .tab-nav li{list-style:none;margin-right:25px;padding-bottom:8px;font-weight:600;cursor:pointer;font-size:1rem;color:#374151;transition:color .2s ease,border-color .2s ease;border-bottom:3px solid transparent}.top-nav-modal .tab-nav li.active{color:var(--primary-color);border-bottom:3px solid var(--primary-color)}.top-nav-modal .tab-content{display:none;padding:0 25px}.top-nav-modal .tab-content.active{display:block}.top-nav-modal .top-nav-dropdown-content h3{font-size:1.3rem;font-weight:400;margin-bottom:1.5rem;color:#131313;position:relative;display:block;width:max-content}.top-nav-modal .top-nav-dropdown-content h3::after{display:block;position:absolute;content:'';width:100%;left:0;bottom:0;height:3px;background:linear-gradient(to right,var(--primary-color) 65%,var(--secondary-color) 65%)}.top-nav-modal .top-nav-dropdown-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 24px;list-style:none;margin:0;margin-bottom:50px;padding:0}.top-nav-modal .top-nav-dropdown-item a{display:block;padding:12px;background:#fff;box-shadow:0 1px 3px 2px rgba(0,0,0,.1);border-radius:4px;text-decoration:none;color:#374151;font-size:1rem;transition:background .2s ease,transform .2s ease}.top-nav-modal .top-nav-dropdown-item a:hover{color:var(--primary-color);transform:translateY(-1px);box-shadow:0 1px 3px 2px rgba(0,0,0,.2)}.top-nav-modal .top-nav-dropdown-item a .lang{font-weight:400;color:var(--primary-color)}.primary-search-label{margin-left:auto}.primary-search-modal{opacity:0;transform:translateY(-100%);visibility:hidden;position:absolute;display:flex;align-items:center;justify-content:center;right:10px;top:-15px;max-width:50%;z-index:180;width:100%;height:250px;background:#fff;box-shadow:0 3px 10px 3px rgba(0,0,0,.377);border-radius:var(--border-radius);padding:20px;pointer-events:none;transition:all .5s ease}@media (max-width:680px){.primary-search-modal{max-width:calc(100% - 20px);height:200px;top:0}}.primary-search-modal.open{opacity:1;transform:translateY(0);visibility:visible;transition:all .5s ease;pointer-events:all}.primary-search-modal .modal-body{flex-grow:1;height:100%;display:grid;grid-template-rows:1fr 50px}.primary-search-modal .modal-content{width:90%;display:flex;margin:auto;flex-direction:column;justify-content:center}.primary-search-modal .modal-footer{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:100%;color:#9c9b9b;border-top:1px solid #cccccc6b;padding:10px 0;width:80%;margin:auto;overflow:hidden}.primary-search-modal .footer-text{font-size:16px}.primary-search-modal .modal-credits{font-size:12px}.primary-search-modal .modal-credits a{font-size:16px}.primary-search-modal .modal-footer::after{content:'';position:absolute;top:0;left:-100px;width:100px;height:1px;background-color:var(--primary-color) 8c;transition:left 1s ease}.primary-search-modal:hover .modal-footer::after{left:calc(100% + 100px)}.primary-search-modal .modal-close{position:absolute;top:10px;right:10px;font-size:22px;width:36px;height:36px;text-align:center;line-height:36px;border-radius:2px;border:1px solid #ccc;cursor:pointer;transition:all .2s ease}.primary-search-modal .modal-close:hover{color:var(--primary-color);border-color:var(--primary-color);background:#cccccc34}.primary-search-modal .primary-searchbar{width:100%}.primary-search-modal .primary-search-form{display:flex;align-items:center;position:relative}.primary-search-modal .primary-search-input{position:relative;flex:1;border:none;font-size:16px;outline:0;color:#333;background-color:#cccccc4d;border-radius:30px;padding:15px 20px;transition:all .2s ease;box-shadow:inset 0 0 5px rgba(0,0,0,.26)}.primary-search-input:focus,.primary-search-input:hover{background-color:#fff}.primary-search-modal .primary-search-btn{position:absolute;right:4px;top:4px;bottom:4px;outline:0;border:none;padding:0 12px;border-radius:30px;font-size:18px;color:#fff;cursor:pointer;background-color:var(--primary-color);transition:all .2s ease;display:flex;align-items:center;justify-content:center}.primary-search-modal .primary-search-btn:focus,.primary-search-modal .primary-search-btn:hover,.primary-search-modal .primary-search-input:focus~.primary-search-btn,.primary-search-modal .primary-search-input:hover~.primary-search-btn{border-top-left-radius:0;border-bottom-left-radius:0;right:0;top:0;bottom:0;padding:0 16px;background-color:#2460a8}.mega-menu-modal{position:absolute;width:100%;height:500px;top:100%;left:0;right:0;bottom:0;z-index:1000;pointer-events:none;perspective:1500px}.mega-menu-modal .modal-body{background:#fff;border-radius:8px;box-shadow:0 15px 45px rgba(0,0,0,.2);border:1px solid #ddd;width:100%;height:100%;overflow:hidden;opacity:0;visibility:hidden;transform:rotateX(-10deg);transform-origin:top center;transition:transform .5s cubic-bezier(.23, 1, .32, 1),opacity .4s ease,visibility .4s ease}.mega-menu-modal.open .modal-body{opacity:1;visibility:visible;transform:rotateX(0);pointer-events:all}.mega-menu-modal .modal-content{display:grid;grid-template-columns:280px 1fr;height:100%}.mega-menu-modal .mega-menu-heading{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:40px 10px;background:var(--light-color);height:100%;box-sizing:border-box}.mega-menu-modal .mega-menu-heading a{display:flex;flex-direction:column;gap:10px}.mega-menu-modal .mega-menu-icon{font-size:3rem;line-height:1;color:var(--primary-color);margin-bottom:20px}.mega-menu-modal .mega-menu-title{font-size:1.8rem;font-weight:700;color:#343a40;margin:0}.mega-menu-modal .mega-menu-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;padding:30px;height:100%;overflow-y:auto;box-sizing:border-box}.mega-menu-modal .nav-tool-link{display:grid;grid-template-rows:1fr 1fr;place-content:center;height:70px;padding:10px;text-decoration:none;background-color:var(--light-color);border-radius:8px;font-weight:500;text-align:center;transition:all .2s ease-in-out}.mega-menu-modal .nav-tool-link:hover{transform:scale(1.03);box-shadow:0 4px 10px var(--primary-color) 4d}.mega-menu-modal .nav-tool-link span{margin:0 8px;font-style:italic}.mega-menu-modal .nav-tool-link div.item-label{display:block}.mega-menu-modal .nav-tool-link div.item-suffix{display:block;font-weight:100}.mega-menu-modal .modal-close{display:none}@media (max-width:680px){.mega-menu-modal{top:70px}.mega-menu-modal .modal-body{overflow-y:auto}.mega-menu-modal .modal-content{grid-template-columns:1fr;height:auto}.mega-menu-modal .mega-menu-heading{flex-direction:row;justify-content:flex-start;text-align:left;padding:20px;background:#fff;border-bottom:1px solid #eee}.mega-menu-modal .mega-menu-icon{font-size:1.8rem;margin-bottom:0;margin-right:15px}.mega-menu-modal .mega-menu-title{font-size:1.4rem}.mega-menu-modal .mega-menu-items{height:auto;overflow-y:visible;padding:20px;grid-template-columns:1fr 1fr;gap:12px}}.editor-report-modal{position:fixed;top:0;left:0;width:100%;height:100%;opacity:0;visibility:hidden;display:flex;align-items:center;justify-content:center;z-index:1000;transition:opacity .3s ease,visibility .3s ease}.editor-report-modal.open{opacity:1;visibility:visible}.editor-report-modal .modal-body{background:#fff;border-radius:12px;border:5px solid var(--light-color);width:90%;max-width:550px;box-shadow:0 10px 30px rgba(0,0,0,.3);position:relative;transform:scale(.95);transition:transform .3s ease;display:flex;flex-direction:column}.editor-report-modal .modal-body.submitting{background:#eee}.editor-report-modal.open .modal-body{transform:scale(1)}.editor-report-modal .modal-header{padding:20px 25px;border-bottom:1px solid #eee}.editor-report-modal .modal-header h2{margin:0;font-size:1.25rem;font-weight:600;color:#111827}.editor-report-modal .modal-content{padding:25px}.editor-report-modal .report-description{margin-bottom:20px}.editor-report-modal .modal-content form{display:flex;flex-direction:column;gap:18px}.editor-report-modal .modal-body.submitting form{pointer-events:none}.editor-report-modal .form-group{display:flex;flex-direction:column;gap:8px}.editor-report-modal .form-group label{font-size:.875rem;font-weight:500;color:#374151}.editor-report-modal input[type=email],.editor-report-modal input[type=text],.editor-report-modal textarea{width:60%;min-width:200px;padding:12px;font-size:1rem;border:1px solid #d1d5db;border-radius:8px;background-color:#f9fafb;color:#111827;transition:border-color .2s ease,box-shadow .2s ease}.editor-report-modal textarea{width:100%}.editor-report-modal .modal-body.submitting .editor-report-modal input[type=email],.editor-report-modal .modal-body.submitting .editor-report-modal input[type=text],.editor-report-modal .modal-body.submitting .editor-report-modal textarea{background-color:#e2e2e2}.editor-report-modal input[type=email]::placeholder,.editor-report-modal input[type=text]::placeholder,.editor-report-modal textarea::placeholder{color:#9ca3af}.editor-report-modal input[type=email]:focus,.editor-report-modal input[type=text]:focus,.editor-report-modal textarea:focus{outline:0;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(59,130,246,.2)}.editor-report-modal textarea{resize:none;min-height:120px;font-family:Poppins,sans-serif}.editor-report-modal button[type=submit]{padding:12px 20px;background:linear-gradient(to bottom,var(--primary-color),#2a67b3);color:#fff;border:none;font-size:1rem;font-weight:500;border-radius:8px;cursor:pointer;transition:background-color .2s ease,transform .2s ease;margin-top:10px}.editor-report-modal button[type=submit]:hover{background:linear-gradient(to bottom,var(--primary-color) 60%,#2a67b3)}.editor-report-modal button[type=submit]:active{transform:scale(.98)}.editor-report-modal .modal-close{position:absolute;top:12px;right:12px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#6b7280;background-color:#f3f4f6;border:none;border-radius:50%;cursor:pointer;transition:all .2s ease}.editor-report-modal .modal-close:hover{color:#111827;background-color:#e5e7eb;transform:rotate(90deg)}.grecaptcha-badge.hidden{display:none!important}.editor-report-modal .report-loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border:5px solid var(--primary-color);border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}.editor-report-modal .report-loader.hidden{display:none}@keyframes rotation{0%{transform:translate(-50%,-50%) rotate(0)}100%{transform:translate(-50%,-50%) rotate(360deg)}}@font-face{font-display:swap;font-family:tutsinsider;src:url('/wp-content/themes/tutsinsider/resources/production/tutsinsider-icons/fonts/tutsinsider.eot?xscra6');src:url('/wp-content/themes/tutsinsider/resources/production/tutsinsider-icons/fonts/tutsinsider.eot?xscra6#iefix') format('embedded-opentype'),url('/wp-content/themes/tutsinsider/resources/production/tutsinsider-icons/fonts/tutsinsider.ttf?xscra6') format('truetype'),url('/wp-content/themes/tutsinsider/resources/production/tutsinsider-icons/fonts/tutsinsider.woff?xscra6') format('woff'),url('/wp-content/themes/tutsinsider/resources/production/tutsinsider-icons/fonts/tutsinsider.svg?xscra6#tutsinsider') format('svg');font-weight:400;font-style:normal;font-display:block}i{font-family:tutsinsider!important;speak:never;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ti-list:before{content:"\e9ad"}.ti-copy:before{content:"\ea84"}.ti-copy-solid:before{content:"\ed67"}.ti-screen-rotate:before{content:"\e95e"}.ti-checkcircle:before{content:"\e95a"}.ti-arrows-left-right:before{content:"\e900"}.ti-arrows-up-down:before{content:"\e901"}.ti-book:before{content:"\e902"}.ti-caret-down:before{content:"\e903"}.ti-caret-left:before{content:"\e904"}.ti-caret-right:before{content:"\e905"}.ti-caret-up:before{content:"\e906"}.ti-chevron-down:before{content:"\e907"}.ti-chevron-left:before{content:"\e908"}.ti-chevron-right:before{content:"\e909"}.ti-chevron-up:before{content:"\e90a"}.ti-circle-arrow-down:before{content:"\e90b"}.ti-circle-arrow-left:before{content:"\e90c"}.ti-circle-arrow-right:before{content:"\e90d"}.ti-circle-arrow-up:before{content:"\e90e"}.ti-desktop:before{content:"\e90f"}.ti-html:before{content:"\e910"}.ti-javascript:before{content:"\e911"}.ti-php:before{content:"\e912"}.ti-logo:before{content:"\e913"}.ti-python:before{content:"\e914"}.ti-sass:before{content:"\e915"}.ti-wordpress:before{content:"\e916"}.ti-bootstrap:before{content:"\e917"}.ti-css:before{content:"\e918"}.ti-howto:before{content:"\e919"}.ti-react:before{content:"\e91a"}.ti-laptop:before{content:"\e91b"}.ti-nodejs:before{content:"\e91c"}.ti-home:before{content:"\e91d"}.ti-java:before{content:"\e91e"}.ti-file-code:before{content:"\e91f"}.ti-github:before{content:"\e920"}.ti-code-brackets:before{content:"\e921"}.ti-database:before{content:"\e922"}.ti-angular:before{content:"\e923"}.ti-ajax:before{content:"\e924"}.ti-email:before{content:"\e925"}.ti-facebook:before{content:"\e926"}.ti-face-dizzy:before{content:"\e927"}.ti-face-smile:before{content:"\e928"}.ti-google:before{content:"\e929"}.ti-heart:before{content:"\e92a"}.ti-instagram:before{content:"\e92b"}.ti-laptop-code:before{content:"\e92c"}.ti-linkedin:before{content:"\e92d"}.ti-search:before{content:"\e92e"}.ti-sitemap:before{content:"\e92f"}.ti-slack:before{content:"\e930"}.ti-square-check:before{content:"\e931"}.ti-stackoverflow:before{content:"\e932"}.ti-twitter:before{content:"\e933"}.ti-hand-point-left:before{content:"\e934"}.ti-hand-point-right:before{content:"\e935"}.ti-half-circle:before{content:"\e936"}.ti-sliders:before{content:"\e937"}.ti-play:before{content:"\e938"}.ti-chrome:before{content:"\e939"}.ti-edge:before{content:"\e93a"}.ti-firefox:before{content:"\e93b"}.ti-less:before{content:"\e93c"}.ti-opera:before{content:"\e93d"}.ti-r:before{content:"\e93e"}.ti-safari:before{content:"\e93f"}.ti-reddit:before{content:"\e940"}.ti-rust:before{content:"\e941"}.ti-fontawesome:before{content:"\e942"}.ti-swift:before{content:"\e943"}.ti-tumblr:before{content:"\e944"}.ti-vue:before{content:"\e945"}.ti-amazon:before{content:"\e946"}.ti-linux:before{content:"\e947"}.ti-readme:before{content:"\e948"}.ti-whatsapp:before{content:"\e949"}.ti-paypal:before{content:"\e94b"}.ti-apple:before{content:"\e94c"}.ti-youtube:before{content:"\e94d"}.ti-mountain:before{content:"\e94e"}.ti-square-up-right:before{content:"\e94f"}.ti-trashcan:before{content:"\e950"}.ti-bars:before{content:"\e951"}.ti-figma:before{content:"\e954"}.ti-x:before{content:"\e953"}.ti-kotlin:before{content:"\e952"}.ti-jquery:before{content:"\e958"}.ti-turn-right:before{content:"\e94a"}.ti-check:before{content:"\ea41"}.ti-check-double:before{content:"\ea47"}.ti-terminal:before{content:"\ec42"}.ti-close:before{content:"\ec8d"}.ti-x-circle:before{content:"\ef06"}.ti-x-square:before{content:"\ef07"}.ti-logo-left:before{content:"\e9a8"}.ti-logo-right:before{content:"\e9a9"}.ti-logo-top:before{content:"\e9ab"}.ti-windows:before{content:"\eac2"}.ti-android:before{content:"\eac0"}.ti-macos:before{content:"\eabf"}.ti-lab:before{content:"\e9aa"}.ti-redo:before{content:"\e966"}.ti-undo:before{content:"\e965"}.ti-printer:before{content:"\e95d"}.ti-cart:before{content:"\e95c"}.ti-price-tag:before{content:"\e957"}.ti-books:before{content:"\e95b"}.ti-check-alt:before{content:"\e99b"}.ti-tag:before{content:"\e99c"}.ti-terminal1:before{content:"\e9b2"}.ti-powershell:before{content:"\e9b1"}.ti-bash:before{content:"\e9b0"}.ti-yarn:before{content:"\e9af"}.ti-npm:before{content:"\e9ae"}.ti-tools:before{content:"\e9ac"}.ti-hcl:before{content:"\e9a7"}.ti-bittorrent:before{content:"\e9a6"}.ti-livescript:before{content:"\e9a5"}.ti-typescript:before{content:"\e9a4"}.ti-postcss:before{content:"\e9a3"}.ti-stylus:before{content:"\e9a2"}.ti-ltsv:before{content:"\e9a1"}.ti-plist:before{content:"\e9a0"}.ti-protobuf:before{content:"\e99f"}.ti-ssv:before{content:"\e99e"}.ti-properties:before{content:"\e99d"}.ti-avro:before{content:"\e955"}.ti-clojure:before{content:"\e956"}.ti-mongodb:before{content:"\e99a"}.ti-jsonc:before{content:"\e999"}.ti-hjson:before{content:"\e998"}.ti-svg:before{content:"\e997"}.ti-jsonld:before{content:"\e996"}.ti-ndjson:before{content:"\e995"}.ti-json5:before{content:"\e994"}.ti-coffeescript:before{content:"\e993"}.ti-cbor:before{content:"\e992"}.ti-ini:before{content:"\e991"}.ti-toml:before{content:"\e990"}.ti-psv:before{content:"\e98f"}.ti-tsv:before{content:"\e98e"}.ti-lua:before{content:"\e98d"}.ti-csv:before{content:"\e98c"}.ti-yaml:before{content:"\e98b"}.ti-xml:before{content:"\e98a"}.ti-bug-report:before{content:"\e988"}.ti-json:before{content:"\e989"}.ti-mustache:before{content:"\e986"}.ti-nunjucks:before{content:"\e987"}.ti-handlebars:before{content:"\e985"}.ti-ejs:before{content:"\e984"}.ti-haml:before{content:"\e982"}.ti-markdown:before{content:"\e983"}.ti-pug:before{content:"\e981"}.ti-help:before{content:"\e97f"}.ti-support:before{content:"\e980"}.ti-arrow-left:before{content:"\e97d"}.ti-arrow-right:before{content:"\e97e"}.ti-filter:before{content:"\e97b"}.ti-align-left:before{content:"\e97c"}.ti-archive:before{content:"\e976"}.ti-zip:before{content:"\e977"}.ti-lock:before{content:"\e978"}.ti-unlock:before{content:"\e979"}.ti-pen-to-square:before{content:"\e97a"}.ti-search-code:before{content:"\e975"}.ti-search-alt:before{content:"\e974"}.ti-arrow-left-from-bracket:before{content:"\e972"}.ti-arrow-left-to-bracket:before{content:"\e973"}.ti-brush:before{content:"\e970"}.ti-compress-code:before{content:"\e971"}.ti-arrow-right-from-bracket:before{content:"\e96d"}.ti-arrow-right-to-bracket:before{content:"\e96e"}.ti-braces:before{content:"\e96f"}.ti-bars-staggered:before{content:"\e96c"}.ti-code:before{content:"\e96b"}.ti-info-circle-solid:before{content:"\e967"}.ti-info-square:before{content:"\e968"}.ti-info-square-solid:before{content:"\e969"}.ti-info-circle:before{content:"\e96a"}.ti-upload:before{content:"\e964"}.ti-download:before{content:"\e963"}.ti-two-arrow-spin:before{content:"\e962"}.ti-exclamation:before{content:"\e961"}.ti-info:before{content:"\e960"}.ti-grip-lines-vertical:before{content:"\e95f"}.ti-external-link:before{content:"\e959"}.ti-ban:before{content:"\f05e"}.ti-exclamation-triangle:before{content:"\f071"}:root{--deprecated-item-color:#f2ab47;--removed-item-color:#d9534f}body{line-height:1.7}.site-header{display:grid;grid-template-columns:auto auto 1fr;gap:100px;position:relative;padding-left:30px;padding-right:30px;background:var(--primary-color);white-space:pre;text-wrap:nowrap;height:70px;z-index:198;align-items:stretch;justify-content:space-between;box-shadow:inset 0 -1px 3px 0 rgba(0,0,0,.2)}.header-logo-title{display:flex;align-items:center}.header-widget{margin:auto 0;text-align:right}::-moz-selection{color:#fff;background:#ff0}::selection{color:#000;background:#8b9cff6c}.site-title{display:flex;align-items:center;justify-content:center;letter-spacing:1px;font-family:Poppins,Inter,sans-serif;font-weight:600;color:var(--light-color);font-size:34px}i.header-logo{font-size:30px;margin-right:10px;color:var(--light-color)}.site-description{font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--secondary-color);text-shadow:1px 1px 1px #999,-1px -1px 1px #999}@media (max-width:980px){.site-header{display:flex}.header-logo-title{display:flex;justify-content:center}.header-widget{display:none}}@media (max-width:680px){.site-header{display:flex;justify-content:space-between;align-items:center;height:70px;padding:0 10px}a.site-title{display:flex;align-items:center;font-size:26px;margin:0;padding:10px}.header-widget{display:none}.header-logo{margin:0 auto;font-size:30px}}.primary-menu{background:var(--light-color);width:100%;z-index:190;position:-webkit-sticky;position:sticky;top:0;padding-left:20px;padding-right:20px;display:flex;justify-content:space-between;align-items:center;height:40px;box-shadow:0 0 5px 0 rgba(0,0,0,.4)}.primary-menu nav{width:calc(100% - 50px);height:100%;display:flex;align-items:center;flex-direction:row;flex-wrap:nowrap;position:relative;flex:1 1 auto;min-width:0}.primary-menu nav::after,.primary-menu nav::before{content:'';pointer-events:none;width:100px;height:100%;position:absolute;top:0;z-index:1;transition:opacity .3s ease;opacity:0}.primary-menu nav::before{background:linear-gradient(to right,var(--light-color),transparent);left:0}.primary-menu nav::after{background:linear-gradient(to left,var(--light-color),transparent);right:0}.primary-menu.show-shadow:not(.nav-start) nav::before{opacity:1}.primary-menu.show-shadow:not(.nav-end) nav::after{opacity:1}div.menu-primary-menu-container{height:100%;flex-grow:1;overflow:hidden;min-width:0;display:flex;align-items:center}.primary-menu nav ul{display:flex;flex-direction:row;justify-content:flex-start;flex-wrap:nowrap;overflow:hidden;white-space:nowrap;list-style-type:none;height:100%;margin:0;padding:0}.primary-menu nav>ul::-webkit-scrollbar{display:none}.scroll-left,.scroll-right{display:none;cursor:pointer;font-size:16px;align-items:center;padding:0 15px;height:100%;position:relative;z-index:10}.scroll-left::after{content:'';position:absolute;top:0;right:-100px;width:100px;height:100%;pointer-events:none;background:linear-gradient(to right,var(--light-color),transparent);z-index:-1}.scroll-right::after{content:'';position:absolute;top:0;left:-100px;width:100px;height:100%;pointer-events:none;background:linear-gradient(to left,var(--light-color),transparent);z-index:-1}.scroll-left:hover,.scroll-right:hover{color:var(--primary-color)}.primary-menu nav ul li a{color:#000;font-size:15px;padding:0 20px;height:100%;min-width:50px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.primary-menu .menu ul li a:hover,.primary-menu nav ul li a:hover{background:var(--primary-color-light)}.primary-menu .menu .current-menu-item a,.primary-menu .menu .current-page-ancestor,.primary-menu .menu .current_page_item{background:var(--primary-color-light)}.primary-menu .toggle-menu ul{display:table;width:25px}.primary-menu .toggle-menu ul li{width:100%;height:4px;background-color:#3949ab;margin-bottom:4px}.primary-menu .toggle-menu ul li:last-child{margin-bottom:-8px}.primary-menu-label{display:none}#primary-menu-input{display:none}@media (max-width:680px){.primary-menu{height:30px;padding:0}.primary-menu nav ul li a{padding:0 10px}}.ti-logo{color:var(--primary-color)}.ti-html{color:#e34f26}.ti-css{color:#264de4}.ti-javascript{color:#f7df1e}.ti-php{color:#8892be}.ti-wordpress{color:#21759b}.ti-python{color:#ffde57}.ti-jquery{color:#0769ad}.ti-bootstrap{color:#563d7c}.ti-sass{color:#bf4080}.ti-howto{color:var(--primary-color)}.ti-ajax{color:#0f0}.ti-less{color:#1d365d}.ti-r{color:#2366b8}.ti-rust{color:#000}.ti-font-awesome{color:#538dd7}.ti-vue{color:#42b883}.ti-react{color:#61dafb}.ti-java{color:#f29111}.ti-angular{color:#dd0031}.ti-kotlin{color:#6b57ff}.posthero{background:url('/wp-content/themes/tutsinsider/resources/images/hero-background.svg');display:flex;position:relative;flex-direction:row;align-items:center;-webkit-box-shadow:0 -2px 2px 0 inset rgba(0,0,0,.4);-moz-box-shadow:0 -2px 2px 0 inset rgba(0,0,0,.4);box-shadow:0 -2px 2px 0 inset rgba(0,0,0,.4)}.posthero-ajax,.posthero-bootstrap,.posthero-css,.posthero-howto,.posthero-html,.posthero-javascript,.posthero-jquery,.posthero-json,.posthero-kotlin,.posthero-php,.posthero-python,.posthero-sass,.posthero-wordpress{min-height:400px}.hero-cat-sections{position:absolute;width:100%;height:100%;display:flex;align-items:center}.htmlhero-sec-1,.htmlhero-sec-2,.htmlhero-sec-3,.htmlhero-sec-4{display:flex;align-items:center;width:25%;height:100%;font-family:Goldman;font-size:220px;color:#fff;opacity:.2}.htmlhero-sec-1:before,.htmlhero-sec-2:before,.htmlhero-sec-3:before,.htmlhero-sec-4:before{display:block;margin:auto}.htmlhero-sec-1{background:#00f0f0}.htmlhero-sec-1:before{content:'H'}.htmlhero-sec-2{background:#00f}.htmlhero-sec-2:before{content:'T'}.htmlhero-sec-3{background:#0f0}.htmlhero-sec-3:before{content:'M'}.htmlhero-sec-4{background:red}.htmlhero-sec-4:before{content:'L'}.csshero-sec-1,.csshero-sec-2,.csshero-sec-3{display:flex;align-items:center;width:33.33%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.csshero-sec-1:before,.csshero-sec-2:before,.csshero-sec-3:before{display:block;margin:auto}.csshero-sec-1{background:#00f0f0}.csshero-sec-1:before{content:'C'}.csshero-sec-2{background:#00f}.csshero-sec-2:before{content:'S'}.csshero-sec-3{background:#0f0}.csshero-sec-3:before{content:'S'}.sasshero-sec-1,.sasshero-sec-2,.sasshero-sec-3,.sasshero-sec-4{display:flex;align-items:center;width:33.33%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.sasshero-sec-1:before,.sasshero-sec-2:before,.sasshero-sec-3:before,.sasshero-sec-4:before{display:block;margin:auto}.sasshero-sec-1{background:#00f0f0}.sasshero-sec-1:before{content:'S'}.sasshero-sec-2{background:#00f}.sasshero-sec-2:before{content:'A'}.sasshero-sec-3{background:#0f0}.sasshero-sec-3:before{content:'S'}.sasshero-sec-4{background:red}.sasshero-sec-4:before{content:'S'}.javascripthero-sec-1,.javascripthero-sec-2{display:flex;align-items:center;width:50%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.javascripthero-sec-1:before,.javascripthero-sec-2:before{display:block;margin:auto}.javascripthero-sec-1{background:#00f0f0}.javascripthero-sec-1:before{content:'J'}.javascripthero-sec-2{background:#00f}.javascripthero-sec-2:before{content:'S'}.phphero-sec-1,.phphero-sec-2,.phphero-sec-3{display:flex;align-items:center;width:33.33%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.phphero-sec-1:before,.phphero-sec-2:before,.phphero-sec-3:before{display:block;margin:auto}.phphero-sec-1{background:#00f0f0}.phphero-sec-1:before{content:'P'}.phphero-sec-2{background:#00f}.phphero-sec-2:before{content:'H'}.phphero-sec-3{background:#0f0}.phphero-sec-3:before{content:'P'}.wordpresshero-sec-1,.wordpresshero-sec-2{display:flex;align-items:center;width:50%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.wordpresshero-sec-1:before,.wordpresshero-sec-2:before{display:block;margin:auto}.wordpresshero-sec-1{background:#00f0f0}.wordpresshero-sec-1:before{content:'W'}.wordpresshero-sec-2{background:#00f}.wordpresshero-sec-2:before{content:'P'}.pythonhero-sec-1,.pythonhero-sec-2{display:flex;align-items:center;width:50%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.pythonhero-sec-1:before,.pythonhero-sec-2:before{display:block;margin:auto}.pythonhero-sec-1{background:#00f0f0}.pythonhero-sec-1:before{content:'P'}.pythonhero-sec-2{background:#00f}.pythonhero-sec-2:before{content:'y'}.jqueryhero-sec-1,.jqueryhero-sec-2,.jqueryhero-sec-3,.jqueryhero-sec-4,.jqueryhero-sec-5,.jqueryhero-sec-6{display:flex;align-items:center;width:50%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.jqueryhero-sec-1:before,.jqueryhero-sec-2:before,.jqueryhero-sec-3:before,.jqueryhero-sec-4:before,.jqueryhero-sec-5:before,.jqueryhero-sec-6:before{display:block;margin:auto}.jqueryhero-sec-1{background:#00f0f0}.jqueryhero-sec-1:before{content:'j'}.jqueryhero-sec-2{background:#00f}.jqueryhero-sec-2:before{content:'Q'}.jqueryhero-sec-3{background:#0f0}.jqueryhero-sec-3:before{content:'u'}.jqueryhero-sec-4{background:red}.jqueryhero-sec-4:before{content:'e'}.jqueryhero-sec-5{background:#494949}.jqueryhero-sec-5:before{content:'r'}.jqueryhero-sec-6{background:#7674fc}.jqueryhero-sec-6:before{content:'y'}.jsonhero-sec-1,.jsonhero-sec-2,.jsonhero-sec-3,.jsonhero-sec-4{display:flex;align-items:center;width:50%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.jsonhero-sec-1:before,.jsonhero-sec-2:before,.jsonhero-sec-3:before,.jsonhero-sec-4:before{display:block;margin:auto}.jsonhero-sec-1{background:#00f0f0}.jsonhero-sec-1:before{content:'J'}.jsonhero-sec-2{background:#00f}.jsonhero-sec-2:before{content:'S'}.jsonhero-sec-3{background:#0f0}.jsonhero-sec-3:before{content:'O'}.jsonhero-sec-4{background:red}.jsonhero-sec-4:before{content:'N'}.ajaxhero-sec-1,.ajaxhero-sec-2,.ajaxhero-sec-3,.ajaxhero-sec-4{display:flex;align-items:center;width:33.33%;height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.ajaxhero-sec-1:before,.ajaxhero-sec-2:before,.ajaxhero-sec-3:before,.ajaxhero-sec-4:before{display:block;margin:auto}.ajaxhero-sec-1{background:#00f0f0}.ajaxhero-sec-1:before{content:'A'}.ajaxhero-sec-2{background:#00f}.ajaxhero-sec-2:before{content:'J'}.ajaxhero-sec-3{background:#0f0}.ajaxhero-sec-3:before{content:'A'}.ajaxhero-sec-4{background:red}.ajaxhero-sec-4:before{content:'X'}.kotlinhero-sec-1,.kotlinhero-sec-2,.kotlinhero-sec-3,.kotlinhero-sec-4,.kotlinhero-sec-5,.kotlinhero-sec-6{display:flex;align-items:center;width:calc(100%/6);height:100%;font-family:Goldman,cursive;font-size:220px;color:#fff;opacity:.2}.kotlinhero-sec-1:before,.kotlinhero-sec-2:before,.kotlinhero-sec-3:before,.kotlinhero-sec-4:before,.kotlinhero-sec-5:before,.kotlinhero-sec-6:before{display:block;margin:auto}.kotlinhero-sec-1{background:#00f0f0}.kotlinhero-sec-1:before{content:'K'}.kotlinhero-sec-2{background:#00f}.kotlinhero-sec-2:before{content:'O'}.kotlinhero-sec-3{background:#0f0}.kotlinhero-sec-3:before{content:'T'}.kotlinhero-sec-4{background:red}.kotlinhero-sec-4:before{content:'L'}.kotlinhero-sec-5{background:#494949}.kotlinhero-sec-5:before{content:'I'}.kotlinhero-sec-6{background:#7674fc}.kotlinhero-sec-6:before{content:'N'}.posthero-body{flex-direction:column;flex:7;padding:30px}.posthero-contents{background:inherit;padding:20px 20px 20px 0;margin:5px;flex:3}.posthero-page-title,.posthero-search-title{color:#000;display:block;width:100%;text-align:center;letter-spacing:5px;font-size:36px;text-shadow:1px 1px 2px #000,-1px -1px 2px #fff}.posthero-title,.posthero-title-mobile{color:#000;position:relative;font-size:36px}.posthero-title-substring{color:var(--primary-color);text-shadow:0 0 3px var(--primary-color)}.post-contents{display:none;padding:10px;position:relative;margin:0;background:#fff;border-radius:var(--border-radius);box-shadow:0 0 5px 0 #555}h3.post-contents-heading{margin:0;padding:10px;color:#000;font-weight:900}.post-contents ol{margin:0;padding:10px 10px;list-style:none;counter-reset:list-number}.post-contents ol li{font-size:15px;line-height:1.6;margin:0;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}.post-contents ol li:before{counter-increment:list-number;content:counter(list-number);background:var(--primary-color);color:#fff;padding:1px 8px;text-align:center;border-radius:var(--border-radius);-webkit-box-shadow:0 0 2px 0 #999;-moz-box-shadow:0 0 2px 0 #999;box-shadow:0 0 2px 0 #999}.post-contents ol li a{color:#000;background:var(--light-color);display:block;width:100%;margin:5px 0;padding:5px 10px;margin-left:0;border-radius:var(--border-radius);-webkit-box-shadow:0 0 2px 0 #999;-moz-box-shadow:0 0 2px 0 #999;box-shadow:0 0 2px 0 #999}.post-contents ol li a:hover{color:var(--primary-color);background:#fff;transition:all .3s ease}@keyframes rotate{100%{transform:rotate(1turn)}}.post-contents{z-index:0;overflow:hidden}.post-contents::before{content:"";position:absolute;z-index:-2;left:-50%;top:-50%;width:200%;height:200%;background-color:#399953;background-repeat:no-repeat;background-size:50% 50%,50% 50%;background-position:0 0,100% 0,100% 100%,0 100%;background-image:linear-gradient(#399953,#399953),linear-gradient(#fbb300,#fbb300),linear-gradient(#d53e33,#d53e33),linear-gradient(#377af5,#377af5);animation:rotate 10s linear infinite}.post-contents::after{content:"";position:absolute;z-index:-1;left:3px;top:3px;width:calc(100% - 6px);height:calc(100% - 6px);background:#fff;border-radius:var(--border-radius)}@media screen and (max-width:1100px){.post-contents{padding:10px}.post-contents ol{padding:10px}}@media screen and (max-width:980px){.posthero{flex-direction:column}.posthero-search-title{padding-bottom:30px}.posthero-css,.posthero-html,.posthero-javascript,.posthero-jquery,.posthero-json,.posthero-kotlin,.posthero-php,.posthero-python,.posthero-sass,.posthero-wordpress{min-height:300px;flex-direction:row}.htmlhero-sec-1,.htmlhero-sec-2,.htmlhero-sec-3,.htmlhero-sec-4{font-size:150px}.sasshero-sec-1,.sasshero-sec-2,.sasshero-sec-3,.sasshero-sec-4{font-size:150px}.csshero-sec-1,.csshero-sec-2,.csshero-sec-3{font-size:150px}.phphero-sec-1,.phphero-sec-2,.phphero-sec-3{font-size:150px}.wordpresshero-sec-1,.wordpresshero-sec-2{font-size:150px}.pythonhero-sec-1,.pythonhero-sec-2{font-size:150px}.jqueryhero-sec-1,.jqueryhero-sec-2,.jqueryhero-sec-3,.jqueryhero-sec-4,.jqueryhero-sec-5,.jqueryhero-sec-6{font-size:150px}.jsonhero-sec-1,.jsonhero-sec-2,.jsonhero-sec-3,.jsonhero-sec-4{font-size:150px}.kotlinhero-sec-1,.kotlinhero-sec-2,.kotlinhero-sec-3,.kotlinhero-sec-4,.kotlinhero-sec-5,.kotlinhero-sec-6{font-size:150px}.posthero-body{padding:0 30px}.posthero-contents{padding:0 0 30px 0;margin-bottom:20px}.posthero-title{font-size:36px}.posthero-page-title{font-size:36px}}@media screen and (max-width:680px){.posthero{flex-direction:column}.post-contents ol li{font-size:14px}.posthero-css,.posthero-html,.posthero-javascript,.posthero-jquery,.posthero-json,.posthero-kotlin,.posthero-php,.posthero-python,.posthero-sass,.posthero-wordpress{min-height:150px;flex-direction:row}.htmlhero-sec-1,.htmlhero-sec-2,.htmlhero-sec-3,.htmlhero-sec-4{font-size:80px}.csshero-sec-1,.csshero-sec-2,.csshero-sec-3{font-size:80px}.sasshero-sec-1,.sasshero-sec-2,.sasshero-sec-3,.sasshero-sec-4{font-size:80px}.phphero-sec-1,.phphero-sec-2,.phphero-sec-3{font-size:80px}.wordpresshero-sec-1,.wordpresshero-sec-2{font-size:80px}.pythonhero-sec-1,.pythonhero-sec-2{font-size:80px}.jqueryhero-sec-1,.jqueryhero-sec-2,.jqueryhero-sec-3,.jqueryhero-sec-4,.jqueryhero-sec-5,.jqueryhero-sec-6{font-size:80px}.jsonhero-sec-1,.jsonhero-sec-2,.jsonhero-sec-3,.jsonhero-sec-4{font-size:80px}.kotlinhero-sec-1,.kotlinhero-sec-2,.kotlinhero-sec-3,.kotlinhero-sec-4,.kotlinhero-sec-5,.kotlinhero-sec-6{font-size:80px}.posthero-body{padding:15px}.posthero-contents{padding:15px;padding-top:0;margin-bottom:30px;width:100%}.posthero-contents ol{padding:10px}.posthero-search>.posthero-search-title:after{display:none}.posthero-page-title,.posthero-search-title{letter-spacing:0;font-size:30px}.posthero-title{display:none}.posthero-title-mobile{display:block;font-size:30px}}.breadcrumbs{margin:5px 30px;display:inline-block;position:absolute;left:0;bottom:0}@media (max-width:680px){.breadcrumbs{margin:5px 15px}}.breadcrumbs ul{display:flex;align-items:center;list-style:none;margin:0;padding:0;flex-wrap:wrap}.breadcrumbs li{display:flex;align-items:center;font-size:.95rem}.breadcrumbs li:not(:last-child)::after{content:'/';margin:0 .75rem;color:var(--dark-color);font-size:.9rem;font-weight:900}.breadcrumbs a{color:#495057;text-decoration:none;font-weight:500;border-radius:6px;transition:color .2s ease-in-out,background-color .2s ease-in-out;padding:.25rem .5rem;margin:-.25rem -.5rem}.breadcrumbs a:hover{color:var(--primary-color)}.breadcrumbs .current-breadcrumbs-item,.breadcrumbs .current-breadcrumbs-item a{color:var(--primary-color);font-weight:700;cursor:default;text-wrap:nowrap}.breadcrumbs .current-breadcrumbs-item a{cursor:pointer}.info-table,.info-table tr td{border:none!important}.info-table{border-left:5px solid var(--primary-color)!important;box-shadow:0 0 10px 0 #e0e0e0;border-radius:10px}.info-table td:nth-child(3){width:2vw}.info-table td:first-child{font-weight:600}.try-link{outline:0;cursor:pointer;text-wrap:nowrap;background:var(--primary-color);color:#fff!important;padding:2px 20px;text-decoration:none!important;border-radius:3px;box-shadow:0 -2px 2px #cecfd1,0 -2px 2px #fefefe,inset 0 0 1px 0 #cecfd1;transition:all .2s ease;font-size:14px;text-shadow:0 1px #fff}.try-link:is(:hover,:active,:focus,.active){box-shadow:0 -2px 2px #333,0 -2px 2px #fefefe,inset 0 0 1px 0 #333;background:var(--primary-color);color:#fff}.full-width-container{background:#000;display:flex;flex-direction:column;padding:20px;background:#fff}@media screen and (max-width:680px){.full-width-container{padding:15px}}.f0f-content{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;text-align:center;color:var(--dark-color);background-color:var(--light-color);padding:2rem;box-sizing:border-box}.f0f-heading{font-size:10rem;font-weight:800;color:var(--dark-color);margin-bottom:0;line-height:1}.f0f-title{font-size:2.5rem;font-weight:600;color:var(--dark-color);margin-top:1rem;margin-bottom:2rem}.f0f-body{max-width:600px;background-color:#fff;padding:3rem;border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.1);margin-top:2rem;width:100%;box-sizing:border-box}.f0f-body h1{font-size:2rem;color:var(--dark-color);margin-top:0;margin-bottom:1rem}.f0f-body p{font-size:1.1rem;line-height:1.6;color:#666;margin-bottom:2rem}.f0f-content .search-form{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}.f0f-content .form-input{padding:.8rem 1.2rem;border:2px solid #ddd;border-radius:.5rem;font-size:1rem;width:70%;max-width:350px;transition:all .3s ease;box-sizing:border-box}.f0f-content .form-input:focus{outline:0;border-color:var(--primary-color);box-shadow:0 0 0 3px rgb(81 71 255 / 20%)}.f0f-content .form-btn{background-color:var(--primary-color);color:#fff;border:none;padding:.8rem 1.5rem;border-radius:.5rem;font-size:1rem;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.f0f-content .form-btn:hover{background-color:var(--primary-color-hover);transform:translateY(-2px);box-shadow:0 5px 15px rgb(63 81 181 / 39%)}.f0f-content .form-btn i{font-size:1.2rem}@media (max-width:768px){.f0f-heading{font-size:8rem}.f0f-title{font-size:2rem}.f0f-body{padding:2rem;margin-top:1rem}.f0f-body h1{font-size:1.8rem}.f0f-body p{font-size:1rem}.f0f-content .search-form{flex-direction:column;align-items:center}.f0f-content .form-input{width:90%;margin-bottom:.5rem}.f0f-content .form-btn{width:90%}}@media (max-width:480px){.f0f-heading{font-size:6rem}.f0f-title{font-size:1.5rem}.f0f-body{padding:1.5rem}.f0f-body h1{font-size:1.5rem}.f0f-body p{font-size:.9rem}}.search-none{font-size:5rem;display:block;text-align:center}.search-none-string{padding:30px;text-align:center}.tutorial-suggestions{padding:2.5rem;border-radius:16px;text-align:left;font-family:'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif}.suggestions-header{display:flex;align-items:center;font-size:1.75rem;font-weight:700;margin-bottom:2rem;color:#1a237e;border-bottom:3px solid #b3e0ff;padding-bottom:1rem}.suggestions-header span{flex-grow:1}.suggesitons-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px}.suggestion-link{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.8rem 1.4rem;font-size:1.05rem;font-weight:600;color:#0d47a1;background-color:#e3f2fd;border-radius:30px;text-decoration:none;transition:all .3s ease,transform .2s ease;box-shadow:0 3px 8px rgba(0,0,0,.08);border:1px solid rgba(0,0,0,.05)}.suggestion-link i{font-size:1.25rem;line-height:1}.suggestion-link:hover{background-color:#bbdefb;color:#1a237e;transform:translateY(-3px);box-shadow:0 6px 15px rgba(0,0,0,.15);border-color:#90caf9}.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:30px}.search-header+.tools-grid{margin-top:80px}@media (max-width:680px){.search-header+.tools-grid{margin-top:50px}}.tool-card{display:flex;flex-direction:column;justify-content:space-evenly;background:#fff;border-radius:12px;border:1px solid #ddd;box-shadow:0 6px 15px rgba(0,0,0,.1);padding:20px 24px 32px;transition:box-shadow .3s ease,transform .3s ease;min-height:180px}.tool-card:hover{box-shadow:0 10px 30px rgba(0,122,204,.3);transform:translateY(-6px)}.tool-card .count{display:block;color:var(--primary-color);text-align:center}.tool-convert-icons{display:flex;flex-direction:column;align-items:center;font-weight:600;font-size:1.1rem;color:#333;margin-bottom:20px;gap:6px}.tool-convert-icons>span:first-child,.tool-convert-icons>span:last-child{display:flex;align-items:center;gap:8px;font-weight:600;font-size:1.2rem;color:#007acc}.tool-convert-icons>span:nth-child(2){font-weight:500;font-style:italic;font-size:1rem;color:#777;display:block;text-align:center;margin:8px 0}.tool-convert-icons i,.tool-single-icon i{font-size:2.4rem;text-shadow:1px 1px 1px #ccc}.tool-single-icon{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:12px;font-weight:600;font-size:1.2rem;color:#007acc;margin-bottom:20px}.tool-single-icon div{text-transform:uppercase}.tool-name{font-weight:600;font-size:1.3rem;color:#444;text-align:center;margin-bottom:20px}.tool-btn{margin-top:auto;display:inline-block;background-color:#007acc;color:#fff;font-weight:700;text-align:center;padding:12px 0;border-radius:8px;text-decoration:none;font-size:1rem;box-shadow:0 4px 10px rgba(0,122,204,.35);transition:background-color .3s ease,box-shadow .3s ease}.tool-btn:focus,.tool-btn:hover{background-color:#005ea3;box-shadow:0 6px 15px rgba(0,94,163,.5);outline:0}.search-header{background:#fff;padding:0 30px;padding-bottom:10px;margin:0 -30px;margin-bottom:30px;position:-webkit-sticky;position:sticky;top:40px;z-index:100;border-bottom-left-radius:10px;border-bottom-right-radius:10px;box-shadow:0 5px 5px -2px rgba(0,0,0,.1)}.search-header form{display:inline-flex;width:99%;position:relative;margin:0 auto}.search-header .form-input{padding:10px;border-radius:500px;outline:0;background:var(--light-color);width:100%;border:1px solid transparent;transition:.1s;box-shadow:0 0 1px 0 #000}.search-header .form-input:focus,.search-header .form-input:hover{border:1px solid var(--primary-color);background:#fff;-webkit-box-shadow:0 0 3px 1px rgba(0,0,0,.2);-moz-box-shadow:0 0 3px 1px rgba(0,0,0,.2);box-shadow:0 0 3px 1px rgba(0,0,0,.2)}.search-header .form-btn{outline:0;border:none;background:0 0;color:#3949ab;padding:10px;margin-left:-40px;cursor:pointer}.search-header .search-query{margin:10px 0 0 0}.search-term{background:var(--primary-color);padding:5px 10px;color:#fff;border-radius:var(--border-radius)}article.search-result{background:#fff;padding:0;text-align:justify;border-radius:var(--border-radius);padding-bottom:20px;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1)}article.search-result a{display:flex;flex-direction:column;gap:20px}article.search-result:has(.random-tools-wrapper){padding:0}.search-result:hover{-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.2);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.2);box-shadow:0 0 5px 0 rgba(0,0,0,.2)}a h3.search-heading{display:block;font-size:20px;padding:20px 20px 0 20px;color:var(--primary-color);font-family:'Source Sans Pro',sans-serif;line-height:1.5;font-weight:500}a h3.search-heading:focus,a h3.search-heading:hover{text-decoration:underline}.search-permalink{color:#00b200;margin-top:-45px;padding:0 20px;font-size:14px}.search-description{padding:0 20px;line-height:1.5;color:#000;font-size:16px}.tools-grid .no-results-message{display:block;width:100%;font-size:2rem;text-align:center;padding:2rem}@media screen and (max-width:680px){.search-header{margin:0 -15px;padding:20px 10px;padding-bottom:10px;position:-webkit-sticky;position:sticky;top:30px}.search-header .search-query{margin:10px 0;font-size:14px}.main-content article.search-result{background:#fff;padding:0;margin:0;padding-bottom:20px}article.search-result:has(.random-tools-wrapper){padding:0}a h3.search-heading{font-size:18px}.search-permalink{margin-top:-25px;font-size:14px}.search-description{font-size:16px}}.navigation-bottom{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 30px;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;box-sizing:border-box}.nav-next-bottom,.nav-previous-bottom{display:flex;align-items:center;font-size:1rem;font-weight:500;color:var(--primary-color);transition:color .2s ease-in-out}.nav-next-bottom a,.nav-previous-bottom a{display:flex;flex-direction:column;text-decoration:none;color:inherit}.nav-previous-bottom a{align-items:flex-start}.nav-next-bottom a{align-items:flex-end}.nav-next-bottom a:hover,.nav-previous-bottom a:hover{color:var(--primary-color-hover)}.nav-bottom-prefix{font-size:.75rem;color:var(--dark-color);margin-bottom:.25rem}.nav-link-content{display:flex;align-items:center;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out;padding:.25rem 0;border-radius:.25rem}@media (max-width:680px){.nav-link-content{display:none}.nav-bottom-prefix{font-size:1rem;display:flex;align-items:center;gap:5px}.nav-previous-bottom .nav-bottom-prefix::before{font-family:tutsinsider;content:'\e908';color:var(--primary-color);transition:transform .3s ease-in-out}.nav-next-bottom .nav-bottom-prefix::after{font-family:tutsinsider;content:'\e909';color:var(--primary-color);transition:transform .3s ease-in-out}.nav-previous-bottom .nav-bottom-prefix:hover::before{transform:translateX(-5px)}.nav-next-bottom .nav-bottom-prefix:hover::after{transform:translateX(5px)}}.nav-previous-bottom a:hover .nav-link-content{transform:translateX(5px)}.nav-next-bottom a:hover .nav-link-content{transform:translateX(-5px)}.nav-link-content i{font-size:1rem;line-height:1;transition:transform .3s ease-in-out}.nav-previous-bottom .nav-link-content i.ti-chevron-left{margin-right:.25rem}.nav-next-bottom .nav-link-content i.ti-chevron-right{margin-left:.25rem}.nav-previous-bottom a:hover .nav-link-content i.ti-chevron-left{transform:translateX(-3px)}.nav-next-bottom a:hover .nav-link-content i.ti-chevron-right{transform:translateX(3px)}@media (max-width:680px){.navigation-bottom{padding:1rem;overflow:hidden}}.navigation ul li:before{content:none}.navigation{display:flex;justify-content:center}.navigation ul{padding-left:0}.navigation li{display:inline}.content-footer .navigation li a,.content-footer .navigation li a:hover,.content-footer .navigation li.active a,.content-footer .navigation li.disabled{background:#ffff;padding:10px 15px;border-radius:var(--border-radius);text-decoration:none;color:var(--primary-color);box-shadow:0 0 0 1px #00000033;-webkit-box-shadow:0 0 0 1px #00000033;-moz-box-shadow:0 0 0 px #00000033}.content-footer .navigation li.active a,.content-footer .navigation ul li a:hover{background:var(--primary-color);color:#fff}a.reference-link{background:var(--light-color);display:block;padding:5px;border-radius:4px;color:#000;text-align:center;max-width:400px;margin:10px auto;-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.5);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.5);box-shadow:0 0 5px 0 rgba(0,0,0,.5)}a.reference-link:active,a.reference-link:focus,a.reference-link:hover{background:#e9eaf8}@media screen and (max-width:680px){.big-table thead tr td:nth-child(n+2){display:none}.big-table{overflow-x:scroll}.big-table td,.big-table th{display:block}.big-table tr td:first-child{background:#3949ab22}.big-table td[data-th]:before{content:attr(data-th)}.big-table-with-headings{overflow-x:scroll}.big-table th,.big-table-with-headings td{display:block}.big-table-with-headings tr td:first-child{background:#3949ab22}}.img-responsive{width:100%;max-width:600px;height:auto;margin:20px auto;display:block}.main-content .link-button{display:block;width:fit-content;background:var(--primary-color);padding:5px 20px;color:#fff;text-decoration:none;margin:10px 0;font-weight:500;text-transform:uppercase;text-wrap:nowrap;border-radius:var(--border-radius);-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.3);-moz-box-shadow:0 0 5px 0 rgba(0,0,0,.3);box-shadow:0 0 5px 0 rgba(0,0,0,.3)}.main-content .link-button:hover{color:#fff;background:var(--primary-color-hover)}.comparison{display:flex;align-items:flex-start;text-align:center;font-size:40px;font-family:'Source Sans Pro',sans-serif;font-weight:900;margin:30px 0}.left-comparison,.right-comparison{flex:40%;line-height:150px;color:#fff;box-shadow:0 0 3px 0 #333}.left-comparison{background:#ff997f;border-bottom:5px solid #ddd}.right-comparison{background:#4eee94;border-bottom:5px solid #ddd}.vs-comparison{line-height:150px;padding:0 10px;background:linear-gradient(to right,#ff997f 50%,#ff997f 50%,#4eee94 50%,#4eee94 100%);min-width:50px;margin:-20px;z-index:100;color:#fff;box-shadow:0 0 3px 0 #333;border-bottom:5px solid #ddd}@media screen and (max-width:980px){.comparison{font-size:30px}.left-comparison,.right-comparison{line-height:100px}.vs-comparison{line-height:100px}}@media screen and (max-width:680px){.comparison{font-size:24px}.left-comparison,.right-comparison{line-height:70px}.vs-comparison{line-height:70px}}.main-content a.post-loop-item{text-decoration:none;display:block;background:var(--light-color);padding:10px;color:#000;box-shadow:0 0 3px 0 #000}.main-content a.post-loop-item:hover{background:#eee;color:#000}.html-forms-form-elements tr td:first-child,.html-forms-form-elements tr td:nth-child(2){text-align:center}@media screen and (max-width:680px){.html-forms-form-elements tr td:first-child{display:none}.html-forms-form-elements tr td{display:block}}.deprecated-component:after{font-family:tutsinsider;content:'\e950';color:#b20000;border-radius:var(--border-radius);width:20px;margin:0 auto;padding:0 2px;text-align:center;display:block}.deprecated-component:before{content:'This item is Deprecated.';background:var(--light-color);font-size:14px;font-weight:100;display:block;position:absolute;padding:20px;transform:translatex(-25%);width:120px;height:50px;margin-top:-15%;visibility:hidden;opacity:0;max-height:0;max-width:0;color:#f20000;border-radius:var(--border-radius);border:5px solid #f20000;z-index:1000;-webkit-box-shadow:0 0 3px 0 #999;-moz-box-shadow:0 0 3px 0 #999;box-shadow:0 0 3px 0 #999;transition:max-width,max-height,.5s ease-in-out;animation:fadeout .5s ease-in-out}.deprecated-component-right:after{font-size:auto;display:inline-flex;margin-left:10px}.deprecated-component-right:before{display:inline-block;right:0;left:0;margin:0 auto;margin-top:-15%;transform:translatex(0)}.deprecated-component:hover:before{max-width:100%;max-height:100%;opacity:1;visibility:visible;transition:max-width,max-height,.5s ease-in-out;animation:fadein .5s ease-in-out}@keyframes fadein{0%{opacity:0;visibility:hidden}100%{opacity:1;visibility:visible}}@keyframes fadeout{100%{opacity:0;visibility:hidden}0%{opacity:1;visibility:visible}}@media screen and (max-width:980px){.deprecated-component-right:after{margin-left:5px}.deprecated-component-right:before{margin-top:-20%}}@media screen and (max-width:680px){.deprecated-component:after{width:100px;margin:0 auto}.deprecated-component:before{margin:0 auto;position:absolute;left:0;right:0;transform:translatex(0);transform:translatey(-100%)}.deprecated-component-right:after{margin-left:5px}.deprecated-component-right:before{transform:translatey(0);margin-top:-35%}}.color-group{background:#f4f4fb;display:flex;flex-wrap:wrap;margin-top:10px;margin-bottom:-10px}.single-color{border-radius:4px;flex:40%;display:block;text-align:center;padding-top:20px;padding-bottom:20px;margin:2px;box-sizing:border-box}.bg-pattern{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAATklEQVQoU2NkYGAwZmBgOMuAACA+CKCIMSIpADGRNaEYgKwQ3WQUjTCF6CYhWw2WAynEpgjmIpg7jUlSiM0TWK2GWUOUZ7ApxggeogIcABHJFtftKVfJAAAAAElFTkSuQmCC) repeat}.hero-right{margin-top:20px;display:flex;align-items:center}.formula-vertical{background:url('/wp-content/themes/tutsinsider/resources/images/hero-background.svg');text-transform:uppercase;text-shadow:0 0 2px #333;text-align:center;height:70%;margin-right:-6px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:30px;-webkit-box-shadow:-5px 0 5px -5px rgba(0,0,0,.75);-moz-box-shadow:-5px 0 5px -5px rgba(0,0,0,.75);box-shadow:-5px 0 5px -5px rgba(0,0,0,.75);z-index:98}.formula-horizontal{flex:90%}.formula-1,.formula-2,.formula-3{display:flex;text-align:center;border-bottom-right-radius:10px;border-top-right-radius:10px;-webkit-box-shadow:0 0 5px 0 #000;-moz-box-shadow:0 0 5px 0 #000;box-shadow:0 0 5px 0 #000}.formula-1{margin:0 0 20px 0}.formula-2{margin:0 0 20px 0}.formula-3{margin:0}.fa-analyze,.fa-practice,.fa-study{color:#333;margin-right:10px}.formula-analyze,.formula-practice,.formula-study{margin:auto 0;padding:30px;font-size:28px;font-weight:900}.formula-study{flex:80%;background:linear-gradient(to right,var(--light-color) 0,var(--primary-color) 30%,#fff 30%)}.formula-analyze{flex:80%;background:linear-gradient(to right,var(--light-color) 0,var(--primary-color) 50%,#fff 50%)}.formula-practice{flex:80%;background:linear-gradient(to right,var(--light-color) 0,var(--primary-color) 100%)}.analyze-box,.practice-box,.study-box{background:var(--primary-color);color:#fff;border-bottom-left-radius:10px;border-top-left-radius:10px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:24px}@media screen and (max-width:980px){.formula-vertical{height:45%;font-size:24px}.formula-1,.formula-2,.formula-3{margin:15px 0}.fa-analyze,.fa-practice,.fa-study{display:none}.formula-analyze,.formula-practice,.formula-study{padding:10px 20px;font-size:24px}.analyze-box,.practice-box,.study-box{padding:5px;font-size:16px}}@media screen and (max-width:680px){.hero-right{margin-top:20px;display:flex;align-items:center}.formula-vertical{height:45%;font-size:20px}.formula-1,.formula-2,.formula-3{margin:10px 0}.fa-analyze,.fa-practice,.fa-study{display:inline}.formula-analyze,.formula-practice,.formula-study{padding:10px;font-size:20px}.analyze-box,.practice-box,.study-box{padding-right:5px;font-size:16px}}.deprecated-item,.js-deprecated,.removed-item{position:relative}.deprecated-item:after,.js-deprecated:after,.removed-item:after{font-family:tutsinsider;content:'\e950';margin-left:5px;padding:2px;color:#b20000}.deprecated-item:after{content:'\f071';color:var(--deprecated-item-color)}.removed-item:after{content:'\f05e';color:var(--removed-item-color)}.deprecated-item:before,.js-deprecated:before,.removed-item:before{font-family:'Noto sans',sans-serif;font-weight:100;font-size:12px;text-align:center;width:200px;opacity:0;visibility:hidden;padding:10px;color:#f20000;border-radius:var(--border-radius);border:2px solid #f20000;background:var(--light-color);position:absolute;display:block;left:50%;transform:translate(-50%,-110%);z-index:2;transition:all .2s ease-in-out;-webkit-box-shadow:0 0 3px 0 #333;-moz-box-shadow:0 0 3px 0 #333;box-shadow:0 0 3px 0 #333}.deprecated-item::before{content:'This item is Deprecated.';color:#333;border-color:var(--deprecated-item-color)}.deprecated-item[data-deprecated-item]::before{content:attr(data-deprecated-item);color:#333;border-color:var(--deprecated-item-color)}.removed-item:before{content:'This item is Removed.';color:#333;border-color:var(--removed-item-color)}.removed-item[data-removed-item]::before{content:attr(data-removed-item);color:#333;border-color:var(--removed-item-color)}.js-deprecated:before{content:'This JavaScript item is deprecated.'}.deprecated-item:hover:before,.js-deprecated:hover:before,.removed-item:hover:before{opacity:1;visibility:visible;transition:all .2s ease-in-out}.ordered-list-contents{list-style:none;counter-reset:list-number;margin:30px auto;margin-left:-20px}.ordered-list-contents li{line-height:1.5;margin:5px}.ordered-list-contents li:before{counter-increment:list-number;content:counter(list-number);background:#555;margin-right:10px;color:#fff;padding:1px 8px;text-align:center;border-radius:var(--border-radius);-webkit-box-shadow:0 0 2px 0 #999;-moz-box-shadow:0 0 2px 0 #999;box-shadow:0 0 2px 0 #999}.item-list-box{display:block;background:var(--light-color);padding-top:0;border-radius:var(--border-radius);border:1px solid #ddd;margin-top:50px}.main-content h3.item-list-box-heading{border-bottom:1px solid #ddd;padding:10px 25px;font-size:18px;margin:0}.item-list-box-heading i{margin-right:10px}.main-content .item-list-box-content{font-size:18px;margin:0;list-style:none;margin-left:20px;padding-top:10px;padding-bottom:10px}.main-content .item-list-box-content li:before{font-family:tutsinsider;display:inline-block;content:"\e95a";font-weight:900;margin-right:15px;transform:translatey(4px);font-size:22px;color:#aaa}.item-list-box-content li{position:relative;margin-left:-20px;line-height:30px}.item-list-box-content li:not(:last-child)::after{display:inline-block;content:'';width:2px;height:15px;background:#aaa;position:absolute;left:0;transform:translateX(10px) translateY(30px)}.tutorial-intro{background:rgba(217,255,208,.5);padding:20px;margin-top:30px;border:1px solid #dee2e6;border-radius:10px;color:#0f172a}.tutorial-intro h2{margin-top:10px;color:#0f172a}.tutorial-intro .btn-intro{display:flex;align-items:center;justify-content:center;gap:8px;width:fit-content;padding:10px 28px;border-radius:12px;text-decoration:none;color:#fff;margin-top:16px;background:#4caf50;font-weight:600;font-size:1.1rem;box-shadow:0 6px 12px rgba(76,175,80,.3);transition:background .3s ease,box-shadow .3s ease,transform .2s ease;cursor:pointer;position:relative}.tutorial-intro .btn-intro i{margin-left:8px;display:inline-block;transition:transform .3s ease}.tutorial-intro .btn-intro:focus,.tutorial-intro .btn-intro:hover{box-shadow:0 6px 12px rgba(76,175,80,.4);color:#fff}.tutorial-intro .btn-intro:focus i,.tutorial-intro .btn-intro:hover i{transform:translateX(6px)}article hr{border:none;height:1px;background-color:#eee;margin:2rem 0}.reference-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.reference-links>div{width:100%}.reference-links a{display:block;padding:2rem 0;text-align:center;background-color:var(--light-color);color:#333;font-size:1.2rem;text-decoration:none;border-radius:10px;transition:background-color .3s ease,color .3s ease;width:100%;border:1px solid #dfdfdf}.reference-links a:hover{background-color:var(--primary-color-light)}