@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap";*{margin:0;padding:0;list-style:none;box-sizing:border-box;font-family:Roboto,sans-serif}body{background:#c4c4c4;font-size:14px;line-height:20px}img{width:100%}.wrapper{display:flex;margin:0 auto;background:#fff;max-width:60rem}aside{width:20rem;background-color:#26252d}.profile ul{margin-top:.75rem}.profile li{margin:.5rem 0}.wrapper .title{color:#fff}.warpper .title,.wrapper .namerole .name{font-weight:700;margin-bottom:.5rem;letter-spacing:4px}aside .info{color:#aaa}aside .bottom{padding:.5rem 1rem}.wrapper .item{padding:1rem 0;border-bottom:1px solid #0175b2}.wrapper .item:last-child{border-bottom:0}img.sm,aside .namerole{display:none}.wrapper .namerole .name{font-size:20px}aside .info:last-child{margin-top:.75rem}.skills li{display:flex;align-items:center;margin-bottom:.5rem;justify-content:space-between}.skills_bar{position:relative;width:8rem;height:1.25rem;background:#fff}.skills_bar p{position:absolute;top:0;left:0;background:#0175b2;width:100%;height:100%}.md_icon{font-size:18px;margin-right:1rem}main{width:75%;padding:1rem}main,main .namerole .name,main .item .title{color:#26252d}.education li,.experience li{display:flex}main li .year{padding-right:2rem;width:9rem;position:relative}main li .content{padding-left:2rem;margin-bottom:1.5rem;width:calc(100% - 2rem)}main li .content p{line-height:1.5}main li .content p:first-child{display:flex;justify-content:space-between}main li .content p span{font-weight:700}main li .year:before{content:"";position:absolute;top:5px;right:0;width:10px;height:10px;background:#fff;border:1px solid #26252d;border-radius:50%}main li .year:after{content:"";position:absolute;top:17px;right:4px;width:3px;height:90%;background:#0175b2}main li:last-child .year:after{display:none}.sites .info{display:flex;justify-content:center;text-align:center}@media screen and (max-width:800px){img.lg,main .namerole{display:none}img.sm{display:initial}aside .namerole{display:block;color:#fff}.wrapper{flex-direction:column}aside,main{width:100%}}@media screen and (max-width:424px){main{padding:1rem}main li{flex-direction:column}main li .year{padding:0;margin-bottom:5px;width:100%;color:#0175b2}main li .year:before,main li .year:after{display:none}main li .content{width:100%;padding:0}.int_icon{font-size:24px}}