@import"https://fonts.googleapis.com/css2?family=Dosis&display=swap";@import"https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap";@import"https://fonts.googleapis.com/css2?family=Kanit&display=swap";:root{--main-color: #ffffffae;--box-shadow: #e94200;--text-shadow: #ff7139;--base-color: #842702;--secendary-color: #30e764;--secendary-shawdow: #88f5a7;--thirt-color: #6430e7}#app{margin:0 auto;font-weight:400}a{text-decoration:none}body{background-color:#2e2e2e;min-height:100vh;font-family:Kanit,sans-serif}grgnfrtfgh *{box-sizing:border-box;padding:0;margin:0;scroll-behavior:smooth;text-decoration:none;border:none}.navbar{width:100%;box-shadow:0 10px 10px -9px var(--box-shadow);background:linear-gradient(to bottom,var(--base-color),#8427022d);position:fixed;top:0;left:0;display:flex;justify-content:space-between;align-items:center;z-index:100;padding:10px}.logo{cursor:default;font-size:40px;color:#fff;font-weight:600;cursor:pointer;margin-left:80px}.menu-icon{display:none}.menu{margin-right:150px;font-size:25px;font-family:Patrick Hand,cursive;font-weight:400;font-style:normal}.menu a{margin-left:4rem;color:var(--main-color);transition:.8s;font-weight:400}.menu a:hover{color:var(--box-shadow);font-weight:500;font-size:27px;margin-left:4rem;text-shadow:0px 1px 13px var(--text-shadow);transition:.8s}@media (max-width: 557px){.navbar{width:100%;box-shadow:0 10px 10px -9px var(--main-color);background:linear-gradient(to bottom,var(--base-color),#8427022d);position:fixed;top:0;left:0;display:flex;justify-content:space-between;align-items:center;z-index:100;padding:20px}.logo{cursor:default;font-size:20px;color:#fff;font-weight:600;margin-left:10px}.menu{display:none}.menu-icon{display:block;color:#fff}}@media (min-width: 558px) and (max-width: 991px){.navbar{width:100%;box-shadow:0 10px 10px -9px var(--main-color);background:linear-gradient(to bottom,var(--base-color),#8427022d);position:fixed;top:0;left:0;display:flex;justify-content:space-between;align-items:center;z-index:100;padding:20px}.logo{cursor:default;font-size:20px;color:#fff;font-weight:600;margin-left:10px}.menu{display:block}.menu-icon{display:none;color:#fff}}@media (min-width: 992px) and (max-width: 1199px){.navbar{width:100%;box-shadow:0 10px 10px -9px var(--main-color);background:linear-gradient(to bottom,var(--base-color),#8427022d);position:fixed;top:0;left:0;display:flex;justify-content:space-between;align-items:center;z-index:100;padding:20px}.logo{cursor:default;font-size:20px;color:#fff;font-weight:600;margin-left:10px}.menu{display:block;margin-right:0;font-size:20px;font-family:Dosis,sans-serif;font-weight:400;font-style:normal}.menu-icon{display:none;color:#fff}}section{min-height:100vh;padding:4rem 9%}.home{display:flex;justify-content:center;align-items:center;color:var(--box-shadow)}.home-content{line-height:60px;text-align:center}h3{font-size:45px;font-weight:700}h3:nth-of-type(2){margin-bottom:30px}span{color:var(--base-color);text-shadow:0px 0px 4px var(--main-color)}.home-content h1{font-size:70px}.home-image{width:500px;height:500px;margin-left:60px;border-radius:24px;overflow:hidden;box-shadow:0 0 21px 0 var(--box-shadow);transition:2s}.home-image:hover{transition:2s;box-shadow:none;border:4px solid var(--secendary-color)}.home-image img{width:100%;height:100%}.social-media a{display:inline-flex;justify-content:center;align-items:center;width:3rem;height:3rem;background:transparent;border:2px solid var(--base-color);border-radius:50%;font-size:30px;color:var(--base-color);margin:45px 22px 15px 0;transition:.5s}.social-media a:hover{background:var(--base-color);color:var(--main-color);box-shadow:0 0 5px 2px var(--box-shadow)}.btn{display:inline-block;padding:.5px 12px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer;transition:2s}.btn:hover{transition:2s;box-shadow:0 0 5px 2px var(--main-color);background:#212121;color:var(--base-color);text-shadow:0px 1px 13px var(--box-shadow)}@media (max-width: 557px){section{min-height:100vh;padding:3rem 9% 4rem}.home{display:flex;justify-content:center;align-items:center;color:var(--main-color)}.home-content{line-height:70px}h3{font-size:40px;font-weight:700}h3:nth-of-type(2){font-size:25px}span{color:var(--base-color)}.home-content h1{font-size:30px}.home-image{display:none}.social-media a{display:inline-flex;justify-content:center;align-items:center;width:2rem;height:2rem;background:transparent;border:2px solid var(--base-color);border-radius:50%;font-size:30px;color:var(--base-color);margin:1px 15px 15px 0;transition:.5s}.social-media a:hover{background:var(--base-color);color:var(--main-color);box-shadow:0 0 5px 2px var(--box-shadow)}.btn{display:inline-block;padding:.5px 7px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:15px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:400;cursor:pointer}.btn:hover{box-shadow:none}}@media (min-width: 558px) and (max-width: 991px){section{min-height:100vh;padding:7rem 9% 4rem}.home{display:flex;justify-content:center;align-items:center;color:var(--main-color)}.home-content{line-height:70px}h3{font-size:70px;font-weight:700}h3:nth-of-type(2){font-size:50px}span{color:var(--base-color)}.home-content h1{font-size:80px}.home-image{display:none}.social-media a{display:inline-flex;justify-content:center;align-items:center;width:4rem;height:4rem;background:transparent;border:2px solid var(--base-color);border-radius:50%;font-size:50px;color:var(--base-color);margin:1px 22px 15px 0;transition:.5s}.social-media a:hover{background:var(--base-color);color:var(--main-color);box-shadow:0 0 5px 2px var(--box-shadow)}.btn{display:inline-block;padding:.5px 12px;margin-top:10px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer}.btn:hover{box-shadow:none}}@media (min-width: 992px) and (max-width: 1199px){section{min-height:100vh;padding:3rem 9% 2rem}.home{display:flex;justify-content:center;align-items:center;color:var(--main-color)}.home-content{line-height:35px}h3{font-size:25px;font-weight:600}h3:nth-of-type(2){font-size:25px}span{color:var(--base-color)}.home-content h1{font-size:40px}.home-image{display:block;width:40%;height:300px}.social-media a{display:inline-flex;justify-content:center;align-items:center;width:2rem;height:2rem;background:transparent;border:2px solid var(--base-color);border-radius:50%;font-size:25px;color:var(--base-color);margin:1px 22px 15px 0;transition:.5s}.social-media a:hover{background:var(--base-color);color:var(--main-color);box-shadow:0 0 5px 2px var(--box-shadow)}.btn{display:inline-block;padding:.5px 12px;margin-top:10px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer}.btn:hover{box-shadow:none}}#about{display:flex;justify-content:center;align-items:center;gap:32px}.about-image img{width:35vw;margin-left:60px;border-radius:50%;box-shadow:0 0 21px 0 var(--box-shadow);transition:2s}.about-image img:hover{box-shadow:none;transition:2s;border:4px solid var(--base-color)}.heading-about{font-size:4.5rem}.about-content{color:var(--main-color);text-align:left;line-height:1.2}.about-content p{font-size:1.6rem;margin:2rem 0 3rem}.btn-about{display:inline-block;padding:10px 16px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer;transition:2s}.btn-about:hover{transition:2s;box-shadow:none;border:2px solid var(--base-color)}@media (max-width: 557px){#about{display:flex;justify-content:center;align-items:center;gap:32px}.about-image img{display:none}.heading-about{font-size:3rem}.about-content{color:var(--main-color);text-align:left;line-height:1.2}.about-content p{font-size:1.7rem;margin:2rem 0 3rem}.btn-about{display:inline-block;padding:10px 16px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer}.btn-about:hover{box-shadow:none}}@media (min-width: 558px) and (max-width: 991px){#about{display:flex;justify-content:center;align-items:center;gap:32px}.about-image img{display:none}.heading-about{font-size:3rem}.about-content h3{font-size:3.5rem}.about-content{color:var(--main-color);text-align:left;line-height:1.2}.about-content p{font-size:2rem;margin:2rem 0 3rem}.btn-about{display:inline-block;padding:10px 16px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer}.btn-about:hover{box-shadow:none}}@media (min-width: 992px) and (max-width: 1199px){#about{display:flex;justify-content:center;align-items:center;gap:32px}.about-image img{display:none}.heading{font-size:5rem}.about-content{color:var(--main-color);text-align:left;line-height:1.2}.about-content p{font-size:2rem;margin:2rem 0 3rem}.btn-about{display:inline-block;padding:10px 16px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer}.btn-about:hover{box-shadow:none}}.slideshow-card{max-width:800px;margin:auto;text-align:center;position:relative;background:#2121212f;padding:2rem;border-radius:1.5rem;box-shadow:0 0 25px var(--base-color)}.card{position:relative;background:#2121219c;border-radius:1.2rem;box-shadow:0 10px 20px #64646f33;padding:1.5rem;transition:all .4s ease}.card-img img{width:100%;height:auto;border-radius:1rem;box-shadow:0 6px 12px #0000001a}.desc{margin:1rem 0;color:orange;text-shadow:1px 0px 9px #ffffff;font-size:1rem;line-height:1.5}.btn-project{display:inline-block;background:linear-gradient(135deg,var(--base-color),#f56f22);color:#fff;padding:.6rem 1.2rem;border-radius:2rem;font-weight:600;font-size:1rem;box-shadow:0 4px 12px var(--base-color);transition:all .3s ease;text-decoration:none}.btn-project:hover{transform:translateY(-3px);background:#ddd;color:#333}.slideshow-controls{display:flex;justify-content:center;align-items:center;margin-top:1.5rem;gap:1rem}.nav-btn{background:#f0f0f0;color:#333;border:none;padding:.6rem 1.2rem;border-radius:2rem;font-weight:700;cursor:pointer;transition:background .3s ease}.nav-btn:hover{background:#ddd}.dots{display:flex;gap:.5rem}.dot{width:10px;height:10px;background:#bbb;border-radius:50%;cursor:pointer;transition:background .3s}.dot.active{background:var(--base-color)}.fade-slide-enter-active,.fade-slide-leave-active{transition:all .5s ease}.fade-slide-enter-from{opacity:0;transform:translateY(30px)}.fade-slide-leave-to{opacity:0;transform:translateY(-30px)}.heading-contact{text-align:center;color:var(--main-color);font-size:4.5rem}.contact h2{margin-bottom:1rem}.contact form{max-width:70rem;margin:1rem auto 3rem;text-align:center}.contact form input{width:100%;display:flex;justify-content:space-between;padding:1.5rem;font-size:1.6rem;color:var(--main-color);background:#212121;border-radius:.8rem;margin:.7rem 0;border:none}.contact form textarea{width:100%;padding:1.5rem;font-size:1.6rem;color:var(--main-color);background:#212121;border-radius:.8rem;margin:.7rem 0;border:none}.contact form .input-box input{width:49%}.contact form textarea{resize:none;height:170px}.btn-contact{display:inline-block;padding:10px 16px;color:var(--main-color);background:var(--base-color);border:none;border-radius:10px;font-size:26px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--main-color);font-weight:600;cursor:pointer;transition:2s}.btn-contact:hover{transition:2s;box-shadow:none;background-color:#212121;color:var(--box-shadow);box-shadow:0 0 5px 2px var(--box-shadow)}@media (max-width: 557px){.heading-contact{text-align:center;color:var(--main-color);font-size:2.4rem}.contact h2{margin-bottom:3rem}.contact form{max-width:70rem;margin:1rem auto 3rem;text-align:center}.contact form{display:flex;justify-content:space-between;flex-wrap:wrap}.contact form input,.contact form textarea{width:100%;padding:1.5rem;font-size:1rem;color:var(--main-color);background:#212121;border-radius:.8rem;margin:.7rem 0}.contact form input{width:100%}.contact form textarea{resize:none;height:200px}.btn-contact{display:inline-block;padding:10px 16px;color:var(--main-color);background:var(--base-color);border-radius:35px;font-size:20px;letter-spacing:.1rem;box-shadow:0 0 5px 2px var(--box-shadow);font-weight:600;cursor:pointer}.btn-contact:hover{box-shadow:none}}.footer{background:#212121;display:flex;justify-content:space-between;align-items:center;padding:2rem 9%;color:var(--main-color)}.footer-text{font-size:1.6rem}.footer-iconTop a{display:inline-flex;justify-content:center;align-items:center;padding:.8rem;background:var(--base-color);border-radius:.8rem;transition:1s}.footer-iconTop a:hover{box-shadow:0 0 5px 2px var(--box-shadow)}.footer-iconTop a i{font-size:2.4rem;color:#212121}