:root{--nav-height: 70px;--hello-message-height: 30px;--nav-separator-space: calc((var(--nav-height))+10px);--primary-color: #ff6804ff;--secondary-color: #141623ff;--black-color: #2a2a2a;--white-color: #d7d7d7;--gray-color: #676767;--background-color: #ffffff;--text-color: var(--black-color)}html{scroll-behavior:smooth;scroll-padding-top:var(--nav-height)}html ::selection{background-color:var(--primary-color);color:var(--white-color)}body{margin:0;padding:0;min-height:100vh;background-color:var(--background-color);font-family:Roboto,Arial,Helvetica,sans-serif;color:var(--black-color);scrollbar-width:none;-ms-overflow-style:none}body::-webkit-scrollbar{width:0;height:0;display:none}body#dark{--background-color: var(--secondary-color);--text-color: var(--white-color) }@media (prefers-color-scheme: dark){body#system{--background-color: var(--secondary-color);--text-color: var(--white-color) }}*{margin:0;padding:0;box-sizing:border-box}a{color:inherit;font-size:inherit;text-decoration:none;text-underline-offset:5px}li{list-style:none}button{border:none;cursor:pointer}img{width:100%;object-fit:contain}select{color:var(--text-color)}.container{width:100%;max-width:860px;height:100%;margin:0 auto;padding:0 .5em}main{padding-bottom:5em}section{position:relative;padding:2em 1em;display:flex;flex-direction:column;align-items:center;gap:1em}section .section-image{width:100px;height:100px;border-radius:50%;border:2px solid white;box-shadow:0 0 3px 3px #0000001a;overflow:hidden}section .section-image img{width:100%}section .section-header{position:sticky;top:var(--nav-height);padding:1em 0;text-align:center;background-color:var(--background-color);width:100%;color:var(--text-color);z-index:1}section .section-header:after{content:"";position:absolute;bottom:0;width:50px;height:3px;border-radius:10px;background-color:var(--primary-color);transform:translate(-50%)}section .section-intro-paragraph{max-width:600px;text-align:center;color:var(--text-color)}section .section-content{color:var(--text-color)}section .section-dive-link{color:var(--primary-color)}section .section-dive-link:hover{text-decoration:underline}section .pagination-buttons{display:flex;gap:10px}section .pagination-buttons .pagination-btn:hover{color:var(--primary-color)}section .section-social-links{margin-top:1em;display:flex;flex-direction:column;align-items:center;gap:.5em;color:var(--text-color)}section .section-social-links span{font-size:.8rem}section .section-social-links ul{display:flex;gap:1em}section .section-social-links a{display:flex;width:35px}section .section-social-links a:hover{color:var(--primary-color)}.project{display:flex;gap:1em;max-width:400px;padding:.5em;border-radius:5px;cursor:pointer;box-shadow:0 0 5px 5px #0000001a}.project .project-image-container{flex-shrink:0;width:70px;height:70px;border-radius:5px;overflow:hidden}.project .project-description{display:flex;flex-direction:column;gap:.5em;align-items:start}.project .project-description .project-header{font-weight:700}.project .project-description .project-descr{text-align:left;font-size:.9rem}.project .project-description .project-view-links{margin-top:1em;display:flex;gap:1em;font-size:.9rem}.project .project-description .project-view-links a{color:var(--primary-color)}.project .project-description .project-view-links a:hover{text-decoration:underline}#hello-message{height:var(--hello-message-height);background-color:var(--primary-color);color:#fff}#hello-message .container{display:flex;align-items:center;justify-content:center}nav{--name-size: 1rem;--descr-size: .8rem;--logo-size: 50px;position:sticky;top:0;z-index:2;width:100%;height:var(--nav-height);background-color:var(--background-color);color:var(--text-color);box-shadow:0 0 5px 5px #0000000d}nav .container{display:flex;justify-content:space-between;align-items:center}nav #intro-container{display:flex;align-items:center;gap:.8em}nav #intro-container #logo{width:var(--logo-size);height:var(--logo-size);border-radius:50%;overflow:hidden}nav #intro-container #logo img{width:100%;object-fit:contain}nav #intro-container #intro #name{font-size:var(--name-size);font-weight:700}nav #intro-container #intro p{font-size:var(--descr-size)}nav ul#nav-links{display:flex;align-items:center;gap:1em}nav ul#nav-links #theme-changer{display:flex;flex-direction:column}nav ul#nav-links #theme-changer span{font-size:.7rem}nav ul#nav-links #theme-changer select{border:none;background-color:var(--background-color);font-size:.95rem}nav ul#nav-links #theme-changer select:focus{outline:none}nav ul#nav-links li a:hover{color:var(--primary-color);text-decoration:underline}section#about .section-content{display:flex;flex-direction:column;gap:1em}section#about .section-content p{max-width:600px;text-align:center}section#projects #featured-projects{display:flex;flex-direction:column;gap:1.5em;padding:2em 0}section#articles ul#featured-articles{display:flex;flex-direction:column;gap:1.5em;padding:2em 0}section#articles ul#featured-articles li.article{max-width:450px;display:flex;flex-direction:column;gap:.5em;padding:.5em;border-bottom:1px solid gray}section#articles ul#featured-articles li.article .article-header{font-weight:700;text-align:left}section#articles ul#featured-articles li.article .article-teaser{color:var(--gray-color);font-size:.9rem;text-align:left}section#articles ul#featured-articles li.article a{color:var(--primary-color)}section#articles ul#featured-articles li.article a:hover{text-decoration:underline}section#resume .resume-section{margin-top:2em}section#resume h4{padding:.5rem;border-bottom:2px solid var(--text-color);width:fit-content;min-width:200px;margin:0 auto;text-align:center}section#resume #experiences{margin:1em 0;display:flex;flex-direction:column;gap:1em}section#resume #experiences .experience{padding:1em}section#resume #experiences .experience .experience-title{max-width:400px;margin:0 auto;position:relative;font-size:1rem}section#resume #experiences .experience .experience-title:before{--size: 15px;content:"";position:absolute;left:-20px;width:var(--size);height:var(--size);background-color:var(--primary-color);border-radius:50%}section#resume #experiences .experience .image-gallery{max-width:400px;margin:1em auto;display:flex;gap:1em}section#resume #experiences .experience .image-gallery .image-container{max-width:250px;max-height:200px;border-radius:5px;overflow:hidden;box-shadow:0 0 5px 5px #0000000d}section#resume #experiences .experience .experience-description{max-width:400px;margin:0 auto;color:var(--gray-color)}section#resume ul#skills{padding:2em 0;display:flex;flex-direction:column;gap:1em}section#resume ul#skills li.skills-section{padding:.3em}section#resume ul#skills h5.skills-section-title{font-size:1em;padding:.3em 0}section#resume ul#skills ul.skills-list{font-size:.9rem;color:gray}section#resume ul#skills ul.skills-list li{list-style:inside}section#my-story .section-content,section#education .section-content,section#hobbies .section-content,section#goals .section-content{display:flex;flex-direction:column;gap:1em}section#my-story .section-content p,section#education .section-content p,section#hobbies .section-content p,section#goals .section-content p{max-width:600px;text-align:center}section#my-story .section-content p a,section#education .section-content p a,section#hobbies .section-content p a,section#goals .section-content p a{color:var(--primary-color)}section#my-story .section-content p a:hover,section#education .section-content p a:hover,section#hobbies .section-content p a:hover,section#goals .section-content p a:hover{text-decoration:underline}section#blog ul#articles{display:flex;flex-direction:column;gap:1.5em;padding:2em 0;max-width:600px}section#blog ul#articles li.article{display:flex;flex-direction:column;gap:.5em;padding:.5em;border-bottom:1px solid gray}section#blog ul#articles li.article .article-header{font-weight:700;text-align:left}section#blog ul#articles li.article .article-time{color:var(--gray-color);font-size:.7rem;text-align:left}section#blog ul#articles li.article .article-teaser{color:var(--gray-color);font-size:.9rem;text-align:left}section#blog ul#articles li.article a{color:var(--primary-color)}section#article #article-content{width:85%;line-height:1.5em}@media screen and (max-width: 450px){section#article #article-content{width:100%}}section#article h1,section#article h2,section#article h3,section#article h4,section#article h5,section#article h6,section#article p,section#article pre,section#article table,section#article li{margin-bottom:.5em}section#article a{color:var(--primary-color)}section#article a:hover{text-decoration:underline}section#article h1{color:var(--primary-color)}section#article h2{margin-top:1.5em}section#article p{text-align:left!important}section#article pre{padding:1.2em 1em;border-radius:5px;line-height:1.6em}section#article ul li{list-style:none;position:relative}section#article ul li:before{--size: 10px;content:"";position:absolute;left:-20px;top:6px;width:var(--size);height:var(--size);border-radius:50%;background-color:var(--text-color)}section#projects #projects-list{display:flex;flex-direction:column;gap:1.5em;padding:2em 0}section#not-found{min-height:50vh;display:flex;align-items:center;justify-content:center;color:var(--text-color)}section#not-found h1{color:var(--primary-color);font-size:3rem}section#not-found #not-found-image{--size: 300px;width:var(--size);height:var(--size)}section#not-found a{border:2px solid var(--text-color);border-radius:500px;padding:1em}section#not-found a:hover{box-shadow:0 3px var(--text-color)}footer{position:fixed;z-index:1;width:100%;padding:1em;bottom:0;background-color:var(--background-color);box-shadow:0 0 5px 5px #0000001a;font-size:.9rem}footer .container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1em}footer ul{display:flex;gap:1em;color:var(--text-color)}footer ul li a:hover{color:var(--primary-color)}footer span{color:gray}code{font-family:Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace}