*{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{direction:ltr;-moz-appearance:textfield}@-webkit-keyframes rotatePic{from{transform:rotateZ(0deg) scale(1)}to{transform:rotateZ(360deg) scale(1)}}@keyframes rotatePic{from{transform:rotateZ(0deg) scale(1)}to{transform:rotateZ(360deg) scale(1)}}@-webkit-keyframes scale-up-center{0%{transform:scale(0.9)}100%{transform:scale(1)}}@keyframes scale-up-center{0%{transform:scale(0.9)}100%{transform:scale(1)}}@-webkit-keyframes scale-up-center-rev{0%{transform:scale(1)}100%{transform:scale(0.9)}}@keyframes scale-up-center-rev{0%{transform:scale(1)}100%{transform:scale(0.9)}}@-webkit-keyframes pic-filter{0%{filter:none}100%{filter:grayscale(100%)}}@keyframes pic-filter{0%{filter:none}100%{filter:grayscale(100%)}}@-webkit-keyframes pic-filter-rev{0%{filter:grayscale(100%)}100%{filter:none}}@keyframes pic-filter-rev{0%{filter:grayscale(100%)}100%{filter:none}}@-webkit-keyframes circle-color{0%{width:28px;height:28px;border-radius:50%}100%{width:100vw;height:100vh;border-radius:13%;top:0}}@keyframes circle-color{0%{width:28px;height:28px;border-radius:50%}100%{width:100vw;height:100vh;border-radius:13%;top:0}}@-webkit-keyframes circle-color-mobile{0%{width:28px;height:28px;border-radius:50%}100%{width:100vw;height:100vh;border-radius:13%}}@keyframes circle-color-mobile{0%{width:28px;height:28px;border-radius:50%}100%{width:100vw;height:100vh;border-radius:13%}}@-webkit-keyframes skill-span-100{0%{width:0}100%{width:100%}}@keyframes skill-span-100{0%{width:0}100%{width:100%}}@-webkit-keyframes skill-span-80{0%{width:0}100%{width:80%}}@keyframes skill-span-80{0%{width:0}100%{width:80%}}@-webkit-keyframes skill-span-60{0%{width:0}100%{width:60%}}@keyframes skill-span-60{0%{width:0}100%{width:60%}}@-webkit-keyframes row-1-low-to-height{0%{height:66.6666666667%}100%{height:calc(100% - 20px)}}@keyframes row-1-low-to-height{0%{height:66.6666666667%}100%{height:calc(100% - 20px)}}@-webkit-keyframes row-1-height-to-low{0%{height:calc(100% - 20px)}100%{height:66.6666666667%}}@keyframes row-1-height-to-low{0%{height:calc(100% - 20px)}100%{height:66.6666666667%}}@-webkit-keyframes row-2-low-to-height{0%{height:33.3333333333%}100%{height:calc(100% - 20px)}}@keyframes row-2-low-to-height{0%{height:33.3333333333%}100%{height:calc(100% - 20px)}}@-webkit-keyframes row-2-height-to-low{0%{height:calc(100% - 20px)}100%{height:33.3333333333%}}@keyframes row-2-height-to-low{0%{height:calc(100% - 20px)}100%{height:33.3333333333%}}@-webkit-keyframes blur{0%{filter:blur(0)}100%{filter:blur(8px)}}@keyframes blur{0%{filter:blur(0)}100%{filter:blur(8px)}}@-webkit-keyframes un-blur{0%{filter:blur(8px)}100%{filter:blur(0)}}@keyframes un-blur{0%{filter:blur(8px)}100%{filter:blur(0)}}@-webkit-keyframes big-picture{0%{height:30%}100%{height:65%}}@keyframes big-picture{0%{height:30%}100%{height:65%}}@-webkit-keyframes toast{0%{opacity:0}100%{opacity:1}}@keyframes toast{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes toast-rev{0%{opacity:1}100%{opacity:0}}@keyframes toast-rev{0%{opacity:1}100%{opacity:0}}:root{--body-color: linear-gradient(0deg, #2C3E50, #2C3E50);--pic-sidebar-color: #0D2C5B;--svg-color: #fff;--svg-hover-color: #B65F00;--skill-color: #002943;--certificates-color: #012B42;--resume-color: #002F51;--codeSandBox-color: #012B42;--sample-color: #002F51;--contact-color: #002943;--toast-success-color: green;--toast-error-color: red}[data-theme=blue]{--body-color: linear-gradient(0deg, #2C3E50, #2C3E50);--pic-sidebar-color: #0D2C5B;--svg-color: #fff;--svg-hover-color: #B65F00;--skill-color: #002943;--certificates-color: #012B42;--resume-color: #002F51;--codeSandBox-color: #012B42;--sample-color: #002F51;--contact-color: #002943;--toast-success-color: green;--toast-error-color: red}[data-theme=red]{--body-color: linear-gradient(to right, #642b73, #c6426e);--pic-sidebar-color: #97233F;--svg-color: #fff;--svg-hover-color: #1F7B37;--skill-color: #A52A2A;--certificates-color: #9E1B32;--resume-color: #E31837;--codeSandBox-color: #9E1B32;--sample-color: #E31837;--contact-color: #A52A2A;--toast-success-color: green;--toast-error-color: red}[data-theme=purple]{--body-color: linear-gradient(to right, #ff0099, #DDA0DD);--pic-sidebar-color: #800080;--svg-color: #fff;--svg-hover-color: #FFFD5D;--skill-color: #8E44AD;--certificates-color: #720E9E;--resume-color: #662D91;--codeSandBox-color: #720E9E;--sample-color: #662D91;--contact-color: #8E44AD;--toast-success-color: green;--toast-error-color: red}[data-theme=green]{--body-color: linear-gradient(to right, #11998e, #38ef7d);--pic-sidebar-color: #018749;--svg-color: #fff;--svg-hover-color: #A92E2B;--skill-color: #03C03C;--certificates-color: #00573F;--resume-color: #00AB66;--codeSandBox-color: #00573F;--sample-color: #00AB66;--contact-color: #03C03C;--toast-success-color: green;--toast-error-color: red}[data-theme=yellow]{--body-color: linear-gradient(to right, #fffc00, #D7C066);--pic-sidebar-color: #FFC72C;--svg-color: #fff;--svg-hover-color: #2E3B75;--skill-color: #FEBE10;--certificates-color: #FFD700;--resume-color: #F1C40F;--codeSandBox-color: #FFD700;--sample-color: #F1C40F;--contact-color: #FEBE10;--toast-success-color: green;--toast-error-color: red}[data-theme=orange]{--body-color: linear-gradient(to right, #f85032, #e73827);--pic-sidebar-color: #FF4500;--svg-color: #fff;--svg-hover-color: #62A96B;--skill-color: #FF6347;--certificates-color: #E67E22;--resume-color: #D35400;--codeSandBox-color: #E67E22;--sample-color: #D35400;--contact-color: #FF6347;--toast-success-color: green;--toast-error-color: red}[data-theme=white]{--body-color: linear-gradient(to right, #ada996, #f2f2f2, #dbdbdb, #eaeaea);--pic-sidebar-color: #ECF0F1;--svg-color: #2c3e50;--svg-hover-color: #686C6E;--skill-color: #BDC3C7;--certificates-color: #F7F1E3;--resume-color: #D1D8E0;--codeSandBox-color: #F7F1E3;--sample-color: #D1D8E0;--contact-color: #BDC3C7;--toast-success-color: green;--toast-error-color: red}.back-color-blue{background:linear-gradient(0deg, #2C3E50, #2C3E50)}.back-color-red{background:linear-gradient(to right, #642b73, #c6426e)}.back-color-purple{background:linear-gradient(to right, #ff0099, #DDA0DD)}.back-color-green{background:linear-gradient(to right, #11998e, #38ef7d)}.back-color-yellow{background:linear-gradient(to right, #fffc00, #D7C066)}.back-color-orange{background:linear-gradient(to right, #f85032, #e73827)}.back-color-white{background:linear-gradient(to right, #ada996, #f2f2f2, #dbdbdb, #eaeaea)}.content{width:100%;display:flex;align-items:center;flex-direction:column;padding:1rem;overflow-y:auto;position:relative}.content h2{font-weight:bold;color:var(--svg-color, #fff);text-align:center;width:100%;margin:.5rem 0}.content::-webkit-scrollbar{width:12px;background-color:#f5f5f5}.content::-webkit-scrollbar-thumb{border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3);background-color:#555}.content::-webkit-scrollbar-track{box-shadow:inset 0 0 6px rgba(0,0,0,.3);border-radius:10px;background-color:#f5f5f5}@media(min-width: 768px){.content{padding:1.5rem}.content h2{margin:1rem 0}}.skill-cards{width:100%;display:flex;flex-direction:column}.skill-cards .card{display:flex;width:calc(100% - (2rem + 2px));padding:.5rem;margin:.5rem;background:rgba(255,255,255,.25);box-shadow:0 8px 32px 0 rgba(31,38,135,.37);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:10px;border:1px solid rgba(255,255,255,.18)}.skill-cards .card .card-left,.skill-cards .card .card-right{width:50%}.skill-cards .card .card-left{display:flex;flex-direction:column;justify-content:center;align-items:center}.skill-cards .card .card-left svg{display:block;width:50%;height:50%;fill:var(--svg-color, #fff)}.skill-cards .card .card-left .card-title{font-size:.8rem;text-align:center;font-weight:bold;color:var(--svg-color, #fff);margin:.8rem 0}.skill-cards .card .card-right div{width:100%;display:flex;flex-direction:column}.skill-cards .card .card-right div p{font-size:.7rem;color:var(--svg-color, #fff)}.skill-cards .card .card-right div .spans{position:relative;width:100%}.skill-cards .card .card-right div .spans span{width:100%;height:10px;margin:.5rem 0;border-radius:7px}.skill-cards .card .card-right div .spans .span-fill{background-color:var(--svg-hover-color, #d35400)}.skill-cards .card .card-right div .spans .span-empty{position:absolute;outline:.5px gray solid}.skill-cards .card .card-right div .skill-span-anim-60{-webkit-animation:skill-span-60 320ms ease-in-out;animation:skill-span-60 320ms ease-in-out}.skill-cards .card .card-right div .skill-span-anim-80{-webkit-animation:skill-span-80 320ms ease-in-out;animation:skill-span-80 320ms ease-in-out}.skill-cards .card .card-right div .skill-span-anim-100{-webkit-animation:skill-span-100 320ms ease-in-out;animation:skill-span-100 320ms ease-in-out}@media(min-width: 768px){.skill-cards{flex-direction:row;flex-wrap:wrap}.skill-cards .card{padding:1rem;width:calc(50% - (3rem + 2px))}.skill-cards .card .card-left .card-title{font-size:1rem}.skill-cards .card .card-left svg{width:80%;height:80%}.skill-cards .card .card-right div p{font-size:1rem}}.contact-full{width:100%;display:flex;flex-direction:column}.contact-full label,.contact-full span,.contact-full a{width:100%;color:var(--svg-color, #fff);margin:.5rem}.contact-full a{text-decoration:none}@media(min-width: 768px){.contact-full{flex-direction:column}.contact-full label,.contact-full span,.contact-full a{font-size:2rem}.contact-full .contact-details{padding-left:1rem}}.certificates-boxes,.sample-boxes{width:100%;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;position:relative}.certificates-boxes .box-pic,.sample-boxes .box-pic{width:100%;display:flex;flex-direction:column}.certificates-boxes .box-pic p,.certificates-boxes .box-pic a,.sample-boxes .box-pic p,.sample-boxes .box-pic a{color:var(--svg-color, #fff);margin:.5rem 0;font-weight:bold;text-align:center}.certificates-boxes .box-pic a,.sample-boxes .box-pic a{text-decoration:none}.certificates-boxes .box-pic img:hover,.sample-boxes .box-pic img:hover{cursor:pointer}.big-picture{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;width:95%;margin-left:auto;margin-right:auto;left:0;right:0;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-animation:big-picture 300ms ease-in-out;animation:big-picture 300ms ease-in-out}.big-picture a{text-decoration:none}.big-picture div,.big-picture a{width:97%;font-size:.7rem;color:var(--svg-color, #fff);background:var(--body-color, linear-gradient(0deg, #2C3E50, #2C3E50));margin-top:.5rem;font-weight:bold;text-align:center;padding:.5rem}.big-picture img{width:100%}.big-picture img:hover{cursor:pointer}@media(min-width: 768px){.certificates-boxes .box-pic,.sample-boxes .box-pic{width:calc(50% - 1rem);margin:1rem .5rem}.big-picture{width:40%}.big-picture div,.big-picture a{font-size:1rem}}html{min-height:100%;height:100%;direction:ltr;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;font-weight:normal;line-height:1.8}body,.container{width:100%;display:flex;justify-content:center;align-items:center;height:100%;background:linear-gradient(0deg, #2C3E50, #2C3E50);background:var(--body-color, linear-gradient(0deg, #2C3E50, #2C3E50));position:relative}.hide-item{display:none}.show-item{display:flex}.change-background{-webkit-animation:changeBackgroundColor .3s ease-in-out;animation:changeBackgroundColor .3s ease-in-out}.main{width:100%;height:100%;display:flex;flex-direction:column}.summery{margin:10px;width:calc(100% - 20px);height:calc(50% - 20px);display:flex;flex-direction:column;align-items:center;background-color:#0d2c5b;background-color:var(--pic-sidebar-color, #0D2C5B);border-radius:14px;-webkit-animation:scale-up-center .7s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:scale-up-center .7s cubic-bezier(0.39, 0.575, 0.565, 1) both;box-shadow:0px 4px 4px rgba(0,0,0,.25)}.summery .img{display:flex;justify-content:center;align-items:center;overflow:hidden;margin:1rem;width:100px;height:100px;border-radius:50%;position:relative}.summery .img img{width:100px;height:100px;z-index:1;-webkit-animation:pic-filter-rev 400ms ease-in-out;animation:pic-filter-rev 400ms ease-in-out}.summery .img img:hover{filter:grayscale(100%);-webkit-animation:pic-filter 400ms ease-in-out;animation:pic-filter 400ms ease-in-out}.summery .img .border-image{z-index:1;width:100px;height:100px;border-radius:50%;position:fixed;box-shadow:0 1px 0 1px rgba(255,192,0,.25),0 -1px 0 1px rgba(255,64,0,.25),1px 0 0 1px rgba(255,192,0,.25),-1px 0 0 1px rgba(255,64,0,.25),1px -1px 0 1px rgba(255,128,0,.5),-1px 1px 0 1px rgba(255,128,0,.5),1px 1px 0 1px rgba(255,255,0,.75),-1px -1px 0 1px rgba(255,0,0,.75);-webkit-animation:rotatePic 1s linear infinite;animation:rotatePic 1s linear infinite}.summery .bio{width:100%;text-align:justify;color:var(--svg-color, #fff)}.summery .bio p{font-size:.6rem;margin:0 1rem;line-height:1.8}.summery .social-media{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between}.summery .social-media a{width:calc(50% - 1rem);padding:1rem .5rem;display:flex;justify-content:space-between;align-items:center;text-decoration:none}.summery .social-media a svg{fill:var(--svg-color, #fff);width:20px;height:20px}.summery .social-media a span{color:var(--svg-color, #fff);font-size:.6rem;margin:3px}.summery .social-media a:hover{cursor:pointer}.summery .social-media a:hover svg{fill:var(--svg-hover-color, #B65F00)}.summery .social-media a:hover span{color:var(--svg-hover-color, #B65F00)}.section{margin:0 10px;width:calc(100% - 20px);height:50%;display:flex;justify-content:center;align-items:center;flex-direction:column;position:relative}.section div[colName="*"]{display:none}.section div[colName="*"] .svg-main-box{display:none}.section .box{flex-direction:column;justify-content:center;align-items:center;margin:10px;border-radius:14px;-webkit-animation:scale-up-center .7s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:scale-up-center .7s cubic-bezier(0.39, 0.575, 0.565, 1) both;box-shadow:0px 4px 4px rgba(0,0,0,.25);text-decoration:none}.section .box svg{display:block;fill:#fff;fill:var(--svg-color, #fff);width:48px;height:48px}.section .box .title{color:var(--svg-color, #fff);font-size:.6rem;font-weight:bold;margin-top:1rem;text-align:center}.section .box:hover{-webkit-animation:scale-up-center-rev .7s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:scale-up-center-rev .7s cubic-bezier(0.39, 0.575, 0.565, 1) both;cursor:pointer}.section .box:hover svg{fill:#d35400;fill:var(--svg-hover-color, #d35400)}.section .show{display:flex;margin:10px;border-radius:14px;min-width:100%;min-height:100%}.section .show .svg-main-box,.section .show .title{display:none}.section .tabs-content{background:red;width:90%;height:90%;position:absolute}.section .back{display:none;position:absolute;left:20px;top:20px;z-index:2}.section .back svg{width:40px;height:40px;fill:var(--svg-color, #fff)}.section .back:hover{cursor:pointer}.section .back:hover svg{fill:var(--svg-hover-color, #B65F00)}.row-1{width:100%;align-items:center;justify-content:center}.row-1 .skill{width:calc(66.6666666667% - 20px);height:calc(100% - 20px);background-color:#002943;background-color:var(--skill-color, #002943)}.row-1 .skill svg{width:116px;height:116px}.row-1 .col-1{width:33.3333333333%;height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.row-1 .col-1 .certificates{width:calc(100% - 20px);height:calc(50% - 20px);background-color:#012b42;background-color:var(--certificates-color, #012B42)}.row-1 .col-1 .resume{width:calc(100% - 20px);height:calc(50% - 20px);background-color:#002f51;background-color:var(--resume-color, #002F51)}.row-1-low-height{height:66.6666666667%}.row-full-height{height:calc(100% - 20px)}.row-1-low-to-height{-webkit-animation:row-1-low-to-height 700ms ease-in-out;animation:row-1-low-to-height 700ms ease-in-out}.row-1-height-to-low{-webkit-animation:row-1-height-to-low 700ms ease-in-out;animation:row-1-height-to-low 700ms ease-in-out}.row-2{width:100%;align-items:center;justify-content:center}.row-2 .codeSandBox{width:calc(33.3333333333% - 20px);height:calc(100% - 20px);background-color:#012b42;background-color:var(--codeSandBox-color, #012B42)}.row-2 .sample{width:calc(33.3333333333% - 20px);height:calc(100% - 20px);background-color:#002f51;background-color:var(--sample-color, #002F51)}.row-2 .contact{width:calc(33.3333333333% - 20px);height:calc(100% - 20px);background-color:#002943;background-color:var(--contact-color, #002943)}.row-2-low-height{height:33.3333333333%}.row-2-low-to-height{-webkit-animation:row-2-low-to-height 700ms ease-in-out;animation:row-2-low-to-height 700ms ease-in-out}.row-2-height-to-low{-webkit-animation:row-2-height-to-low 700ms ease-in-out;animation:row-2-height-to-low 700ms ease-in-out}.user-selector{position:absolute;display:flex;justify-content:center;align-items:center;width:40px;left:0;bottom:12.5%;flex-direction:column;border:#fff 2px dashed;border-top-right-radius:14px;border-bottom-right-radius:14px;border-left:0}.user-selector div{margin:3px 3px;width:28px;height:28px;border-radius:3px}.user-selector div:hover{cursor:pointer}.user-selector .blue{background-color:#2980b9}.user-selector .red{background-color:#c0392b}.user-selector .purple{background-color:#8e44ad}.user-selector .green{background-color:#27ae60}.user-selector .yellow{background-color:#f1c40f}.user-selector .orange{background-color:#d35400}.user-selector .white{background-color:#ecf0f1}.circle-color{width:28px;height:28px;bottom:0;left:0;position:absolute;border-radius:50%;opacity:70%;margin-left:6px}.circle-color-anim{-webkit-animation:circle-color-mobile 300ms ease-in;animation:circle-color-mobile 300ms ease-in}.blur{width:100%;filter:blur(8px);-webkit-animation:blur 400ms ease-in-out;animation:blur 400ms ease-in-out}.un-blur{width:100%;filter:blur(0px);-webkit-animation:un-blur 400ms ease-in-out;animation:un-blur 400ms ease-in-out}.modal-back{position:absolute;align-items:center;justify-content:center;top:0;left:0;width:100%;height:100%;z-index:1}@media(min-width: 768px){.main{width:80%;flex-direction:row}.summery{width:30%;height:calc(100% - 20px)}.summery .img{width:200px;height:200px}.summery .img img{z-index:2;width:200px;height:200px}.summery .img .border-image{width:200px;height:200px}.summery .bio p{font-size:1rem}.summery .social-media{flex-wrap:nowrap;flex-direction:column}.summery .social-media a{width:unset}.summery .social-media a svg{width:35px;height:35px}.summery .social-media a span{font-size:1.2rem}.section{margin:0;width:70%;height:100%}.section .box svg{width:100px;height:100px}.section .box .title{font-size:1.3rem}.row-1 .skill svg{width:200px;height:200px}.user-selector{width:40px;left:0;bottom:auto;flex-direction:column;border-left:0;border-bottom:#fff 2px dashed;border-top-right-radius:14px;border-top-left-radius:0px;border-top-right-radius:14px;border-bottom-right-radius:14px}.user-selector div{margin:3px 0}.circle-color{top:50%;left:0}.circle-color-anim{-webkit-animation:circle-color 300ms ease-in;animation:circle-color 300ms ease-in}}@media(min-width: 768px)and (max-width: 1270px){.summery .img{width:120px;height:120px}.summery .img img,.summery .img .border-image{width:120px;height:120px}.summery .bio p{font-size:.8rem}}@media(max-height: 650px)and (min-width: 768px){.summery .img{width:120px;height:120px}.summery .img img,.summery .img .border-image{width:120px;height:120px}.summery .bio p{font-size:.8rem}.summery .social-media a svg{width:25px;height:25px}.summery .social-media a span{font-size:.8rem}}