body{background-color:#1b1b1b;color:var(--para-color);font-family:Poppins,sans-serif}body header{display:flex;align-items:start;justify-content:space-between;flex-direction:column;gap:20px;max-width:1200px;margin:0 auto;padding:25px 0 0}body header .brand-name{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 20px}body header .brand-name .name{line-height:22px;display:flex;flex-direction:column;align-items:center;justify-content:center}body header .brand-name .name h1{font-family:Silkscreen,cursive;color:var(--main-color)}body header .brand-name .name p{font-size:10pt;color:var(--title-color);font-style:italic}body header .brand-name .port-web a{text-decoration:none;font-size:10pt;color:#62a192;transition:all .2s ease-in-out;display:flex;align-items:center;gap:5px}body header .brand-name .port-web a:hover{color:#0ff}body header .brand-nav{padding:10px 20px;border:1px solid #62a192;background-color:var(--bg-color);width:100%}body header .brand-nav ul{list-style:none;display:flex;gap:20px}body header .brand-nav ul li a{color:var(--para-color);font-size:9pt;text-decoration:none;letter-spacing:1px;display:flex;align-items:center;gap:5px}body header .brand-nav ul li a:hover{color:#0ff}body footer{display:flex;align-items:center;justify-content:space-between;flex-direction:column;gap:20px;max-width:1200px;margin:0 auto;background-color:var(--title-color);padding:20px}body footer .footer-nav{padding:6px 20px;width:100%;display:flex;align-items:center;justify-content:center}body footer .footer-nav ul{list-style:none;display:flex;gap:20px}body footer .footer-nav ul li a{color:var(--para-color);font-size:9pt;text-decoration:none;letter-spacing:1px;display:flex;align-items:center;gap:5px}body footer .footer-nav ul li a:hover{color:var(--main-color)}body footer .footer-date p{font-size:10pt;font-family:Silkscreen,cursive}.page-container{max-width:1200px;margin:10px auto;padding:10px;background-color:var(--bg-color);border-left:1px solid var(--title-color);border-right:1px solid var(--title-color)}.page-container .home-container{display:flex;flex-direction:column;gap:20px}.page-container .home-container .article{display:flex;gap:10px;align-items:center;background-color:#1b1b1b;border-radius:5px;padding:10px}.page-container .home-container .article .article-image{height:140px;width:120px;border-radius:5px;background-position:center;background-size:cover}.page-container .home-container .article .article-info{height:140px;display:flex;flex-direction:column;gap:5px;width:100%}.page-container .home-container .article .article-info h1{font-family:Silkscreen,cursive}.page-container .home-container .article .article-info p{font-family:Poppins,sans-serif;font-size:8pt;font-weight:300;color:var(--main-color);display:flex;align-items:center;gap:3px}.page-container .home-container .article .article-info .desc{font-size:12pt;font-weight:400;color:#f0f0f0}.page-container .home-container .article .article-info button{padding:2px 6px;width:10%;background-color:var(--main-color);border:none;cursor:pointer;border-radius:3px}.page-container .home-container .article .article-info button a{color:#050808;text-decoration:none;display:flex;align-items:center;justify-content:center}.page-container .single-article{display:flex;flex-direction:column;width:100%;gap:20px}.page-container .single-article .single-article-image{height:200px;background-position:center;background-size:cover;border-radius:5px}.page-container .single-article p{font-size:10pt;letter-spacing:1px;color:#62a192;display:flex;align-items:center;gap:3px}.page-container .single-article h1{font-family:Silkscreen,cursive;color:var(--main-color)}.page-container .single-article p{font-family:Silkscreen,cursive;font-style:italic}.page-container .single-article .content{font-family:Poppins,sans-serif;padding:20px;background-color:#1b1b1b;border-radius:3px;display:flex;flex-direction:column;gap:20px;width:100%}.page-container .single-article .content p{letter-spacing:1px}.page-container .single-article .content h1,.page-container .single-article .content h2,.page-container .single-article .content h3,.page-container .single-article .content h4,.page-container .single-article .content h5,.page-container .single-article .content h6,.page-container .single-article .content p{font-family:Poppins,sans-serif;color:var(--para-color)}.page-container .single-article .content h1{font-size:20pt}.page-container .single-article .content h2{font-size:17pt}.page-container .single-article .content h3{font-size:14pt}.page-container .single-article .content h4{font-size:11pt}.page-container .single-article .content h5{font-size:9pt}.page-container .single-article .content h6{font-size:7pt}.page-container .single-article .content pre{background-color:#2a2a2a}.page-container .single-article .content pre code{font-family:Source Code Pro,monospace;color:#f2dc14}.page-container .single-article .content ul{list-style:none}.page-container .single-article .content a{color:#f0f0f0;padding:5px}.page-container .material .material-item{display:flex;flex-direction:column;gap:10px}.page-container .material .material-item a{padding:10px;background-color:#f2dc14;color:var(--bg-color);font-family:silkscreen,cursive;text-decoration:none;border-radius:3px;transition:all .2s ease-in-out;display:flex;align-items:center;gap:5px}.page-container .material .material-item a:hover{background-color:#f2dc14bc}.page-container .material .material-item .thell{background-color:red;color:#f0f0f0}.page-container .material .material-item .thell:hover{background-color:#ff0000a6}@media (max-width: 557px){header .brand-name{padding:15px 30px}.page-container .home-container .article .article-info h1{font-size:12pt}.page-container .home-container .article .article-info .desc{font-size:10pt}.page-container .home-container .article .article-info button{width:30%;padding:5px 10px}}.page-container .script-container{display:flex;flex-direction:column;gap:20px}.page-container .script-container .article{background-color:var(--title-color);padding:0 30px;border-radius:5px}.page-container .script-container .article .article-info{display:flex;align-items:center;justify-content:space-between;height:50px;width:100%;border-radius:5px}.page-container .script-container .article .article-info h1{font-family:Silkscreen,cursive;font-size:12pt}.page-container .script-container .article .article-info p{font-family:Poppins,sans-serif;font-size:10pt;font-weight:300;display:flex;align-items:center;gap:3px}.page-container .script-container .article .article-info .desc{font-size:12pt;font-weight:400;font-style:italic}.page-container .script-container .article .article-info button{padding:5px 10px;width:10%;background-color:var(--main-color);border:none;cursor:pointer;border-radius:3px}.page-container .script-container .article .article-info button a{color:#050808;text-decoration:none;display:flex;align-items:center;justify-content:center}.page-container .script-container .article .article-info .article-info-btn-group{display:flex;flex-direction:column}@media (max-width: 557px){.page-container .script-container .article .article-info h1{font-size:12pt}.page-container .script-container .article .article-info .desc{font-size:10pt}.page-container .script-container .article .article-info button{width:30%;padding:5px 10px}}:root{--main-color: #f2dc14;--bg-color: #2a2a2a;--title-color: #62a192;--para-color: #f0f0f0}*{margin:0;padding:0;box-sizing:border-box}.material-container{padding:20px 30px;max-width:767px;margin:10px auto}.material-container .jbp{display:flex;flex-direction:column;gap:30px}.material-container .jbp h1{display:flex;align-items:center;gap:5px;font-family:Silkscreen,cursive}.material-container .jbp h1 .icon{color:var(--main-color);font-size:30pt}.material-container .jbp p{font-weight:300;letter-spacing:1px}.material-container .jbp p span{color:var(--main-color)}.material-container .jbp ol{display:flex;flex-direction:column;gap:20px}.material-container .jbp ol li h1{font-size:15pt;margin:10px 0;font-family:Silkscreen,cursive}.material-container .jbp ol li ul{padding:0 20px}.material-container .jbp ol li ul li{font-weight:300}.material-container .jbp ol li ul li a{color:var(--main-color);padding-right:5px}.material-container .jbp ol li p a{color:var(--main-color)}.material-container .jb{display:flex;flex-direction:column;gap:20px}.material-container .jb h1{display:flex;align-items:center;font-family:Silkscreen,cursive}.material-container .jb h1 .icon{color:var(--main-color);font-size:30pt}.material-container .jb ol{display:flex;flex-direction:column;gap:20px}.material-container .jb ol li{padding:10px}.material-container .jb ol li a{color:var(--main-color);padding:0 5px}.material-container .jb h2{font-size:12pt;display:flex;align-items:center;justify-content:center;width:100%;color:#f0f0f046}.material-container .jh{display:flex;flex-direction:column;gap:30px}.material-container .jh h1{display:flex;align-items:center;font-family:Silkscreen,cursive}.material-container .jh h1 .icon{color:var(--main-color);font-size:30pt}.material-container .jh ol{display:flex;flex-direction:column;gap:20px;list-style:none}.material-container .jh ol li strong{color:var(--main-color);font-family:Silkscreen,cursive}.material-container .jh ol ul{padding:0 35px;display:flex;flex-direction:column;gap:10px}.material-container .jh p{font-style:italic;text-align:justify}.material-container .jh p span{color:var(--main-color)}.material-container .tutorial-hell{display:flex;flex-direction:column;gap:30px}.material-container .tutorial-hell h1{display:flex;align-items:center;font-family:Silkscreen,cursive}.material-container .tutorial-hell h1 .icon{color:red;font-size:30pt}.material-container .tutorial-hell p{font-weight:300}.material-container .tutorial-hell p span{border-bottom:1px solid #f2dc14;color:#f2dc14;font-style:italic}.material-container .tutorial-hell ol{display:flex;flex-direction:column;gap:20px;list-style:none}.material-container .tutorial-hell ol li strong{color:red;font-family:Silkscreen,cursive}.material-container .tutorial-hell ol p{padding:0 35px;display:flex;flex-direction:column;gap:10px}
