@import"https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap";@import"https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1";@import"https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700";@import"https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";:root{--ds-font-one: "DM Serif Display";--ds-font-two: "Kanit";--ds-font-three: "Permanent Marker";--ds-font-four: "Dancing Script";--ds-color-primary: #000000;--ds-color-secondary: #ffffff;--ds-color-tertiary: #006d77;--ds-background-primary: #006d77;--ds-background-secondary: #edf6f9;--ds-background-tertiary: #83c5be;--ds-margin-xxs: 5px;--ds-margin-xs: 10px;--ds-margin-s: 20px;--ds-margin-m: 30px;--ds-margin-l: 40px;--ds-margin-xl: 50px;--ds-margin-xxl: 60px;--ds-padding-none: 0;--ds-padding-xxs: 5px;--ds-padding-xs: 10px;--ds-padding-s: 20px;--ds-padding-m: 30px;--ds-padding-l: 40px;--ds-padding-xl: 50px;--ds-padding-xxl: 60px;--ds-gap-xxs: 5px;--ds-gap-xs: 10px;--ds-gap-s: 15px;--ds-gap-m: 20px;--ds-gap-l: 25px;--ds-gap-xl: 30px;--ds-gap-xxl: 35px;--ds-border-xxs: 5px;--ds-border-xs: 10px;--ds-border-s: 15px;--ds-border-m: 20px;--ds-border-l: 25px;--ds-border-xl: 30px;--ds-border-xxl: 35px}*{margin:0;padding:0;box-sizing:border-box;list-style:none;text-decoration:none}body{width:100%;height:100%;color:var(--ds-color-primary)}main{display:flex;flex-direction:column}section{background:linear-gradient(180deg,#edf6f9,#006d77)}html{scroll-behavior:smooth}@media (width <= 1441px){body{width:100%;height:100%;color:var(--ds-color-primary);min-width:fit-content}}#header{background:-webkit-linear-gradient(360deg,#edf6f9 0%,#006d77 100%);width:100%;height:100px;position:fixed;z-index:1}.ul-nav-header{display:flex;justify-content:space-evenly;align-items:center;margin-top:var(--ds-margin-l);margin-left:50%;list-style:none}@media (width <= 1465px){.ul-nav-header{margin-left:30%}}@media (width <= 1165px){.ul-nav-header{justify-content:center;margin-left:0}}@media (width <= 850px){#nav-bar{display:none}}.li-ul-nav-header{display:flex;gap:75px}.link-nav{display:flex;justify-content:space-evenly;color:var(--ds-color-secondary);font-family:var(--ds-font-one);font-size:large;transition:all 1s}.link-nav:hover{transition:all .5s;transform:scale(1.2)}@media (width <= 1025px){.li-ul-nav-header{gap:50px}}@media (width <= 426px){.li-ul-nav-header{gap:90px}}.button-open,.button-close,.nav-menu{display:none}@media (width <= 850px){.button-open{display:block;position:absolute;right:0;border:0;width:50px;height:50px;margin:30px;background-color:transparent;cursor:pointer;transition:all 1s}.button-open:hover{transition:all .5s;transform:scale(1.2)}.button-close{display:block;border:0;width:50px;height:50px;background-color:transparent;cursor:pointer;transition:all 1s}.button-close:hover{transition:all .5s;transform:scale(1.2)}.img-open,.img-close{width:50px;height:50px}.nav-menu{display:flex;flex-direction:column;align-items:end;gap:var(--ds-gap-l);position:absolute;padding:var(--ds-padding-m);top:0;right:0;background:linear-gradient(180deg,#edf6f9,#006d77);opacity:0;visibility:hidden;box-shadow:0 0 0 100vmax #00000062;border-radius:100px 0 0 50px;transition:all .5s}.nav-menu.visible{opacity:1;visibility:visible}.link-nav{margin:var(--ds-margin-s)}}#presentation{display:flex;height:1050px}@media (width <= 1165px){#presentation{justify-content:center;flex-wrap:wrap;height:1350px}}#hello{margin:200px 100px 100px;font-family:var(--ds-font-four);width:fit-content}.h2-presentation{font-size:45px;cursor:default}.h1-presentation{font-size:90px;margin-top:var(--ds-margin-m);cursor:default}.h3-presentation{font-size:xxx-large;margin-top:var(--ds-margin-s);color:var(--ds-color-secondary);cursor:default}.ul-presentation{display:flex;margin:50px 100px;justify-content:flex-start}.ul-presentation>li{margin-right:var(--ds-margin-xxl)}a>.img-email{width:50px;height:50px;transition:all 1s}a>.img-github{width:50px;height:50px;transition:all 1s}a>.img-linkedin{width:50px;height:50px;transition:all 1s}.p-presentation{margin-top:var(--ds-margin-xl);max-width:800px;font-family:var(--ds-font-one);font-size:large;color:var(--ds-color-secondary);cursor:default}@media (width <= 1941px){#hello{margin:250px 100px 100px 200px}}@media (width <= 1465px){#hello{margin:250px 100px 100px}.ul-presentation{justify-content:space-around}}@media (width <= 1165px){#hello{margin:150px 0 0}}@media (width <= 850px){#hello{margin:150px 20px 0}}@media (width <= 600px){.ul-presentation{margin:var(--ds-margin-m)}}.photo-personal{width:550px;height:650px;margin:150px 50px 0;border-radius:20%;transition:all .5s;cursor:pointer}@media (min-width: 1941px){.photo-personal{width:650px;height:750px;margin:150px 50px 0 250px}}@media (width <= 1600px){.photo-personal{width:450px;height:550px;margin:220px 50px 0 0}}@media (width <= 1350px){.photo-personal{width:350px;height:450px;margin:250px 50px 0 0}}@media (width <= 1165px){.photo-personal{width:350px;height:450px;margin:0}}@media (width <= 600px){.photo-personal{width:250px;height:350px}}#aboutme{display:flex;flex-direction:column;justify-content:center;align-items:center;height:1050px;cursor:default}#title-aboutme{border:var(--ds-border-xxs) solid var(--ds-color-primary);padding:20px 70px;font-family:var(--ds-font-one);letter-spacing:10px}.text-aboutme{display:flex;width:800px;margin:170px;color:var(--ds-color-primary);font-family:var(--ds-font-one);font-size:large;text-align:center}@media (width <= 1165px){#aboutme{height:1150px}.text-aboutme{display:flex;width:auto;flex-wrap:wrap;margin:170px}}@media (width <= 600px){#aboutme{height:1450px}.text-aboutme{margin:170px 20px}}@media (width <= 470px){#title-aboutme{padding:15px}}#skills{display:flex;flex-direction:column;align-items:center;cursor:default;padding-top:var(--ds-padding-xl)}.title-skills{display:flex;flex-direction:column;border:var(--ds-border-xxs) solid var(--ds-color-primary);margin:75px 0 80px;padding:15px 80px;font-family:var(--ds-font-one);letter-spacing:10px}@media (width <= 470px){.title-skills{padding:15px}}.div-used-skills{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:75px;max-width:700px}.img-used-skills{object-fit:contain;width:60px;height:60px}.div-used-skills>p{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;font-family:var(--ds-font-two);gap:var(--ds-gap-xs)}@media (width <= 760px){.div-used-skills{gap:75px;margin:0 20px;max-width:700px}}@media (width <= 600px){.div-used-skills{gap:50px;max-width:400px}}@media (width <= 470px){.div-used-skills{gap:50px;max-width:250px}}.title-learning{margin:75px 0 50px}.div-learning-skills{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:75px;max-width:700px}.img-learning-skills{object-fit:contain;width:60px;height:60px}.div-learning-skills>p{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;font-family:var(--ds-font-two);gap:var(--ds-gap-xs)}@media (width <= 760px){.div-learning-skills{gap:75px;margin:0 20px;max-width:700px}}@media (width <= 600px){.div-learning-skills{gap:50px;max-width:400px}}@media (width <= 470px){.div-learning-skills{gap:50px;max-width:250px}}.title-other{margin:75px 0 50px}.div-other-skills{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:75px;max-width:700px}.img-other-skills{object-fit:contain;width:60px;height:60px}.div-other-skills>p{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;font-family:var(--ds-font-two);gap:var(--ds-gap-xs);margin-bottom:75px}@media (width <= 760px){.div-other-skills{gap:75px;margin:0 20px;max-width:700px}}@media (width <= 600px){.div-other-skills{gap:50px;max-width:400px}}@media (width <= 470px){.div-other-skills{gap:50px;max-width:250px}}#projects{display:flex;flex-direction:column;align-items:center;min-height:1050px;cursor:default;padding-top:var(--ds-padding-xl)}.title-projects{border:var(--ds-border-xxs) solid var(--ds-color-primary);margin:75px 0 40px;padding:15px 70px;font-family:var(--ds-font-one);letter-spacing:10px}#cards-projects{display:flex;justify-content:center;flex-wrap:wrap;margin:var(--ds-margin-xl);gap:50px}@media (width <= 470px){#cards-projects{margin:0 20px;gap:50px}.title-projects{padding:15px}}.article-projects{display:flex;flex-direction:column;flex-wrap:wrap;align-items:center;background-color:var(--ds-background-secondary);border-radius:var(--ds-border-m);gap:var(--ds-gap-m);transition:all 1s}.article-projects:hover{transform:scale(1.1);transition:all .5s}.img-project{width:350px;height:250px;border-radius:var(--ds-border-m);object-fit:cover}.title-project{display:flex;font-size:x-large;font-family:var(--ds-font-two)}.text-project{color:var(--ds-color-tertiary);display:flex;font-size:medium;font-family:var(--ds-font-two);max-width:300px}.links-project{display:flex;gap:80px}.github-img-project,.web-img-project{width:40px;height:40px;margin-bottom:var(--ds-margin-s);transition:all 1s}.github-img-project:hover,.web-img-project:hover{width:40px;height:40px;margin-bottom:var(--ds-margin-xs);transform:scale(1.3);transition:all .5s}#experience{display:flex;flex-direction:column;align-items:center;cursor:default;padding-top:var(--ds-padding-xl)}.title-experience{border:var(--ds-border-xxs) solid var(--ds-color-primary);margin:75px 0 60px;padding:15px 70px;font-family:var(--ds-font-one);letter-spacing:8px}.title-training{display:flex;margin-bottom:var(--ds-margin-xl)}.title-work-experience{display:flex;margin:75px 0 50px}@media (width <= 470px){.title-experience{padding:15px}}.container-training{display:flex;justify-content:center;align-items:start;flex-wrap:wrap;gap:75px;max-width:900px}.img-training{object-fit:contain;width:100px;height:60px}.container-training>p{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;font-family:var(--ds-font-two);gap:var(--ds-gap-xs);width:200px}@media (width <= 975px){.container-training{gap:50px;max-width:600px}}@media (width <= 650px){.container-training{max-width:300px}}.container-work-experience{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:50px;max-width:900px;margin-bottom:var(--ds-margin-xl)}.img-work-experience{object-fit:contain;width:150px;height:100px}.name-work-experience{display:flex;justify-content:center;align-items:center;font-family:var(--ds-font-two);gap:var(--ds-gap-xs)}.time-work-experience{display:flex;flex-direction:column-reverse;justify-content:center;align-items:center;font-family:var(--ds-font-two);gap:var(--ds-gap-xs)}.container-work-experience>p{display:flex;justify-content:center;align-items:center;margin:10px 20px;font-family:var(--ds-font-two);gap:var(--ds-gap-xs)}.container-customers{display:flex;justify-content:center;flex-wrap:wrap;gap:50px;max-width:900px;margin-bottom:var(--ds-margin-xl)}.img-customers{object-fit:contain;width:100px;height:60px}@media (width <= 975px){#work-experience{gap:50px;max-width:600px}}@media (width <= 650px){#work-experience{max-width:300px}}#footer{display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;position:sticky;background:-webkit-linear-gradient(90deg,#edf6f9 0%,#006d77 100%);padding:var(--ds-margin-xxl) 0px;gap:var(--ds-gap-l)}.h3-footer{margin:var(--ds-margin-xs) 0px;cursor:default}a>.img-email{width:40px;height:40px;transition:all 1s}a>.img-github{width:40px;height:40px;transition:all 1s}a>.img-linkedin{width:40px;height:40px;transition:all 1s}.img-email:hover,.img-github:hover,.img-linkedin:hover{transform:scale(1.3);transition:all .5s}.link-email,.link-github,.link-linkedin{width:50px;height:50px;transition:all 1s}.ul-footer{display:flex;justify-content:space-around}.ul-footer>li{margin:0px var(--ds-margin-l)}@media (width <= 470px){.ul-footer>li{margin:0px var(--ds-margin-xs)}}
