-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathstyles.47cfcec4ef875e4f6612.css
1 lines (1 loc) · 17.7 KB
/
styles.47cfcec4ef875e4f6612.css
1
@import url(https://fonts.googleapis.com/css?family=Slabo|Lato);.big-pic-container{padding-top:2rem}@media only screen and (max-width:640px){.big-pic-container{padding-top:0}}.big-pic{background-image:url(/static/profile1-2b1fb2383be11aa0f301c45548397e85.jpg);background-position:50%;background-size:cover;border-radius:50%;box-shadow:0 4px 20px 6px rgba(0,0,0,.3);height:48vh;transition:min-width .3s ease-in-out,min-height .3s ease-in-out,width .3s ease-in-out,height .3s ease-in-out,margin-top .3s ease-in-out;width:48vh}@media only screen and (max-width:800px){.big-pic{height:40vh;min-height:40vh;min-width:40vh;width:40vh}}.big-pic--small{height:180px;min-height:180px;min-width:180px;width:180px}@media only screen and (max-width:1024px){.big-pic--small{height:110px;min-height:110px;min-width:110px;width:110px}}@media only screen and (max-width:640px){.big-pic--small{transform:translate(-20%,5%)}}.copyright{align-self:center;bottom:0;color:#a66470;font-family:Lato,Helvetica,Arial,sans-serif;font-size:90%;font-weight:400;padding:.5rem;position:absolute}@media only screen and (max-width:1024px){.copyright{align-self:flex-end;font-size:86%;padding:0 .5rem .5rem}}@media only screen and (max-width:800px){.copyright{bottom:0;font-size:60%;right:1rem}}.main-layout{background-color:#fff;box-sizing:border-box;display:flex;height:100vh;min-height:600px;position:relative}@media only screen and (max-width:800px){.main-layout{flex-direction:column;justify-content:space-between}}.profile-section{align-items:center;background-color:#312f34;-webkit-clip-path:polygon(0 0,100% 0,92% 100%,0 100%);clip-path:polygon(0 0,100% 0,92% 100%,0 100%);display:flex;flex-direction:column;height:100%;justify-content:space-between;transition:width .3s ease-in-out;width:85%}@media only screen and (max-width:800px){.profile-section{-webkit-clip-path:polygon(0 0,100% 0,100% 99%,0 100%);clip-path:polygon(0 0,100% 0,100% 99%,0 100%);height:calc(100% - 3.5rem);transition:height .3s ease-in-out;width:100%;z-index:2}}.profile-section--open{justify-content:flex-start;width:20%}@media only screen and (max-width:1024px){.profile-section--open{-webkit-clip-path:none;clip-path:none;overflow:hidden;width:120px}}@media only screen and (max-width:800px){.profile-section--open{-webkit-clip-path:polygon(0 0,100% 0,100% 80%,0 100%);clip-path:polygon(0 0,100% 0,100% 80%,0 100%);flex-direction:row;height:5rem;justify-content:space-between;width:100%}}.profile-section .info-block{align-items:center;display:flex;flex:1 1;flex-direction:column;justify-content:space-between;transition:width .3s ease-in-out;width:100%}@media only screen and (max-width:800px){.profile-section .info-block{transition:height .3s ease-in-out}}@media only screen and (max-width:640px){.profile-section .info-block{height:50%;justify-content:space-around;padding:1rem .5rem}}@media only screen and (max-width:800px){.profile-section .info-block--small{align-items:center;flex:5 1;flex-direction:row;justify-content:space-between;max-height:100%;padding:.5rem;width:auto}}@media only screen and (max-width:640px){.profile-section .info-block--small{flex:5 1;padding:0 1rem 0 0}}.content-section{height:100%;max-width:0;min-width:0;opacity:0;overflow-y:auto;padding:.5rem;position:relative;transition:max-width .3s ease-in-out,min-width .3s ease-in-out,opacity 1.2s ease-in-out,width .3s ease-in-out}@media only screen and (max-width:800px){.content-section{height:0;max-width:100%;padding:0;width:100%}}.content-section--open{max-width:65%;min-width:calc(80% - 260px);opacity:1}@media only screen and (max-width:1024px){.content-section--open{max-width:68%;min-width:calc(80% - 180px)}}@media only screen and (max-width:800px){.content-section--open{height:100%;max-width:100%;padding-bottom:3rem}}.menu-section{align-content:right;display:flex;flex-direction:column;height:100%;justify-content:center;max-width:14%;min-width:160px;position:absolute;right:0;width:15%}@media only screen and (max-width:1024px){.menu-section{min-width:200px}}@media only screen and (max-width:800px){.menu-section{background-color:#fff;bottom:0;box-shadow:0 -2px 12px rgba(0,0,0,.15);height:4rem;left:0;max-width:100%;right:0;width:100%;z-index:1}}@keyframes spinning{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loading{align-items:center;background-color:hsla(0,0%,100%,.6);display:flex;height:100%;justify-content:center;text-align:center;width:100%;z-index:8}.loading,.loading__spinner{color:#c3c3c3;font-size:24px}.loading__spinner{animation:spinning 1s linear infinite;padding:0 .5rem}.menu-container{align-content:center;align-self:center;display:flex;flex-wrap:wrap;width:100%}@media only screen and (max-width:800px){.menu-container{justify-content:space-evenly}}.menu-item{box-sizing:border-box;color:#312f34;display:block;font-family:Lato,Helvetica,Arial,sans-serif;font-size:180%;padding:1rem 2rem 1rem .25rem;position:relative;text-align:right;text-decoration:none;transition:background-color .2s ease-in-out,color .2s ease-in-out;width:100%;z-index:2}@media only screen and (max-width:1024px){.menu-item{font-size:160%}}@media only screen and (max-width:800px){.menu-item{font-size:120%;padding-top:0;width:auto}}@media only screen and (max-width:640px){.menu-item{padding:.25rem 1rem 1rem}}.menu-item:before{background-color:#a66470;content:"";height:42px;position:absolute;right:0;transform:translateY(-14%);transition:width .3s ease-in-out,border-radius .3s ease-in-out;width:0;z-index:-1}@media only screen and (max-width:800px){.menu-item:before{height:.5rem;left:50%;top:-.85rem;transform:translate(-50%,-100%);transition:border-radius .3s ease-in-out,width .3s ease-in-out;width:0}}.menu-item:hover:before{width:.5rem}@media only screen and (max-width:800px){.menu-item:hover:before{height:.5rem;width:100%}}.menu-item--active{color:#fdba67}.menu-item--active:hover:before{border-radius:2% 0 0 2%/50% 0 0 50%;width:105%}@media only screen and (max-width:1024px){.menu-item--active:hover:before{width:85%}}@media only screen and (max-width:800px){.menu-item--active:hover:before{border-radius:50% 50% 0 0}}.menu-item--active:before{border-radius:2% 0 0 2%/50% 0 0 50%;width:100%}@media only screen and (max-width:800px){.menu-item--active:before{border-radius:50% 50% 0 0}}.page-main{padding:1rem}.page-main .page-section{display:flex;flex-wrap:nowrap;justify-content:space-between;padding:1rem}.page-main .page-section__container,.page-main .page-section__container--full{width:98%}.page-main .page-section__container--two-thirds{width:64%}.page-main .page-section__container--half{width:48%}.page-main .page-section__container--third{width:32%}.page-main .title{color:#a66470;font-family:Lato,Helvetica,Arial,sans-serif;font-size:32px;font-weight:700;padding-bottom:2rem}.page-main .title:after{background-color:#a66470;content:"";height:2px;margin-top:.5rem;position:absolute;width:calc(100% - 4rem)}.page-main .subtitle{color:#c3c3c3;display:inline-block;font-family:Lato,Helvetica,Arial,sans-serif;font-size:24px;font-weight:500;padding:1rem 0 0}.page-main .paragraph{color:#312f34;font-family:Slabo,serif;font-size:18px;line-height:24px;padding:1rem;text-align:justify;white-space:pre-wrap}.page-main .page-link{display:inline-block;padding:1rem 0}.page-main .page-link,.page-main .page-link__anchor{color:#a66470;font-family:Lato,Helvetica,Arial,sans-serif;font-size:16px;font-weight:500}.page-main .page-link__anchor{padding-left:.25rem;position:relative;text-decoration:none}.page-main .page-link__anchor:before{background-color:#a66470;bottom:-2px;content:"";height:2px;position:absolute;transition:width .3s ease-in;width:0}.page-main .page-link__icon{font-weight:700;margin-left:.5rem;text-align:center;transform-origin:center}.page-main .page-link:hover .page-link__anchor:before{width:100%}.page-main .page-link:hover .page-link__icon{animation:shake .3s ease-in-out .3s}.portfolio-link{align-items:center;display:flex;transform:translateX(200%);transition:transform .3s ease-in-out}.portfolio-link:first-child{transition-delay:.1s}.portfolio-link:nth-child(2){transition-delay:.2s}.portfolio-link:nth-child(3){transition-delay:.3s}.portfolio-link:nth-child(4){transition-delay:.4s}.portfolio-link__header{color:#efefef;display:inline-block;font-family:Lato,Helvetica,Arial,sans-serif;font-size:22px;padding-left:1rem;transform:translateY(-50%);transition:color .3s ease-in-out}.portfolio-link .social-link{color:#efefef;font-size:28px;line-height:1rem;padding:.25rem 1rem}.portfolio-link .social-link svg{transform-origin:center;transition:fill .3s ease-in-out,color .3s ease-in-out}.portfolio-link:hover{cursor:pointer}.portfolio-link:hover .social-link{color:#fdba67}.portfolio-link:hover .social-link svg{animation:shake .3s ease-in-out;animation-delay:.3s;fill:#fdba67}.portfolio-link:hover .portfolio-link__header{color:#fdba67}.portfolio-badge{background-color:#a66470;border-radius:12px/50%;color:#efefef;display:inline-block;font-family:Lato,Helvetica,Arial,sans-serif;font-size:16px;font-weight:500;line-height:.75rem;margin:0 .5rem;padding:.5rem;text-align:center}@media only screen and (max-width:800px){.portfolio-badge{margin-bottom:.25rem}}.portfolio-entry{flex-direction:column;margin-bottom:8rem;width:100%}.portfolio-entry,.portfolio-entry__block-area{display:flex;overflow:hidden;position:relative}.portfolio-entry__block-area{border-radius:3px;box-shadow:0 2px 6px rgba(0,0,0,.3);margin-bottom:.75rem}.portfolio-entry__image{height:10rem;-o-object-fit:cover;object-fit:cover;-o-object-position:top center;object-position:top center;width:100%;transition:width .3s ease-in-out,-webkit-filter .3s ease-in-out;transition:width .3s ease-in-out,filter .3s ease-in-out;transition:width .3s ease-in-out,filter .3s ease-in-out,-webkit-filter .3s ease-in-out}.portfolio-entry__header{background-color:#312f34;-webkit-clip-path:polygon(91.5% 0,100% 0,100% 100%,88% 100%);clip-path:polygon(91.5% 0,100% 0,100% 100%,88% 100%);height:10rem;position:absolute;right:0;transition:-webkit-clip-path .3s ease-in-out;transition:clip-path .3s ease-in-out;transition:clip-path .3s ease-in-out,-webkit-clip-path .3s ease-in-out;width:100%}@media only screen and (max-width:640px){.portfolio-entry__header{background-color:transparent;-webkit-clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%)}}.portfolio-entry__title{background-color:#312f34;bottom:1.75rem;-webkit-clip-path:polygon(4% 0,100% 0,100% 100%,0 100%);clip-path:polygon(4% 0,100% 0,100% 100%,0 100%);color:#fff;font-family:Lato,Helvetica,Arial,sans-serif;font-size:30px;font-weight:700;padding:.25rem 3rem .5rem;position:absolute;right:0;transform:translateZ(0);transition:color .3s ease-in-out,opacity .3s ease-in-out,font-size .3s ease-in-out,right .3s ease-in-out;z-index:1}@media only screen and (max-width:640px){.portfolio-entry__title{bottom:0;font-size:24px}}.portfolio-entry__text-area{color:#4f4c54;font-size:18px;padding:.5rem}.portfolio-entry__text-area p{padding:.5rem 0}.portfolio-entry__links{align-items:flex-end;display:flex;flex-direction:column;height:100%;justify-content:space-around;padding:.5rem 0;position:absolute;right:3rem;transition:transform .3s ease-in-out}.portfolio-entry:not(:last-child):after{background-color:#c3c3c3;content:"";height:1px;width:100%}.portfolio-entry__block-area:hover .portfolio-entry__image{-webkit-filter:brightness(35%);filter:brightness(35%);width:75%}.portfolio-entry__block-area:hover .portfolio-entry__header{-webkit-clip-path:polygon(61.5% 0,100% 0,100% 100%,58% 100%);clip-path:polygon(61.5% 0,100% 0,100% 100%,58% 100%)}@media only screen and (max-width:640px){.portfolio-entry__block-area:hover .portfolio-entry__header{background-color:#312f34;-webkit-clip-path:polygon(14% 0,100% 0,100% 100%,20% 100%);clip-path:polygon(14% 0,100% 0,100% 100%,20% 100%)}}.portfolio-entry__block-area:hover .portfolio-entry__title{color:#fdba67;right:32%}@media only screen and (max-width:640px){.portfolio-entry__block-area:hover .portfolio-entry__title{font-size:11px;left:0;padding:.5rem;right:auto}}.portfolio-entry__block-area:hover .portfolio-link{transform:translateX(0)}.social-bar{align-content:center;align-items:center;display:flex;height:42%;justify-content:space-between;justify-self:flex-end;padding:0 2rem 2rem}@media only screen and (max-width:1024px){.social-bar{padding:2rem 0 0}}@media only screen and (max-width:800px){.social-bar{width:70%}}@media only screen and (max-width:640px){.social-bar{padding:0}}.social-bar--small{flex-wrap:wrap;justify-content:center;padding:0 2.5rem 1rem}@media only screen and (max-width:1024px){.social-bar--small{padding:4rem 0 0}}@media only screen and (max-width:800px){.social-bar--small{flex-direction:row;padding:0 2rem 0 0}}@media only screen and (max-width:640px){.social-bar--small{padding-right:0}}@keyframes shake{25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}to{transform:rotate(0)}}.social-link{color:#c3c3c3;font-size:40px;padding:1rem;transition:color .3s ease-in-out}.social-link svg{transition:fill .3s ease-in-out,color .3s ease-in-out}@media only screen and (max-width:1024px){.social-link{font-size:36px;padding:.5rem}}@media only screen and (max-width:640px){.social-link{font-size:8vw;padding:0 .25rem}}.social-link svg{transform-origin:center;transition:transform .3s ease-in-out}.social-link:hover svg{animation:shake .3s ease-in-out;fill:#fdba67}.title-container{padding-bottom:1rem;padding-top:2rem;text-align:center}@media only screen and (max-width:800px){.title-container{padding-top:2.5rem}}@media only screen and (max-width:640px){.title-container{padding:0}}.title-container--small{padding-top:.5rem}@media only screen and (max-width:800px){.title-container--small{height:100%;padding:0}}.title-container .title{font-family:Lato,Helvetica,Arial,sans-serif;transition:font-size .3s ease-in-out,opacity .3s ease-in-out}@media only screen and (max-width:1024px){.title-container .title{padding-top:0}}.title-container .title--main{color:#a66470;font-size:36px;font-weight:700;white-space:normal;word-wrap:break-word}@media only screen and (max-width:640px){.title-container .title--main .hideable{display:none}}.title-container .title--main--small{font-size:26px;padding-top:1.5rem}@media only screen and (max-width:800px){.title-container .title--main--small{font-size:28px;margin:0;padding-top:0}}@media only screen and (max-width:640px){.title-container .title--main--small{display:none}}.title-container .title--main--small .hideable{display:none}.title-container .title--sub{color:#c3c3c3;font-size:24px;font-weight:500;padding-top:1rem;transition:opacity .3s ease-in-out}@media only screen and (max-width:800px){.title-container .title--sub{padding-top:1rem}}@media only screen and (max-width:640px){.title-container .title--sub{display:none}}.title-container .title--sub--hidden{display:none}.tags-container{display:flex;height:auto;justify-content:space-between;padding-top:1rem;width:auto}@media only screen and (max-width:800px){.tags-container{padding-top:1rem}}@media only screen and (max-width:640px){.tags-container{flex-direction:column;height:auto;text-align:center}}.tags-container .tag{color:#fdba67;font-family:Lato,Helvetica,Arial,sans-serif;font-size:24px;width:auto}@media only screen and (max-width:800px){.tags-container .tag{font-size:20px}}@media only screen and (max-width:640px){.tags-container .tag{font-size:18px;margin-bottom:.5rem}}.tags-container .tag:after{color:#a66470;content:"/";font-weight:500;margin:0 .5rem}@media only screen and (max-width:640px){.tags-container .tag:after{content:""}}.tags-container .tag:last-child:after{content:""}.tags-container--short{flex-direction:column;justify-content:center}@media only screen and (max-width:1024px){.tags-container--short{height:auto;padding-top:1.5rem}}@media only screen and (max-width:800px){.tags-container--short{display:none}}.tags-container--short .tag{font-size:16px;padding:.25rem 0;text-align:center}@media only screen and (max-width:1024px){.tags-container--short .tag{margin-bottom:.5rem}}.tags-container--short .tag:after{content:"";display:none}.skill-section{display:flex;flex-wrap:wrap;justify-content:center;text-align:center}.skill{display:inline-block;margin:0 .5rem;position:relative}.skill:before{background-color:#312f34;border-radius:50%;bottom:0;content:"";-webkit-filter:blur(4px);filter:blur(4px);height:1rem;left:50%;opacity:.1;position:absolute;transform:translateX(-50%);width:50%}.skill__text{color:#312f34;display:block;font-family:Lato,Helvetica,Arial,sans-serif;font-size:24px;font-weight:bolder;left:50%;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%)}.skill__percent{display:block;font-size:18px;padding-top:.5rem}.skill__donut{height:100%;width:100%;z-index:1}.skill__donut .bgCircle,.skill__donut .fgCircle{fill:none;transform:rotate(90deg) translate(50%,50%);transform-origin:center}.skill__donut .bgCircle{stroke:#efefef;stroke-opacity:.7}*,html{box-sizing:border-box}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{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}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}.cv{height:calc(100% - .25rem);width:100%}.cv__frame{box-sizing:border-box;height:100%;padding:.5rem 1rem .25rem;transition:-webkit-filter .3s ease-in-out;transition:filter .3s ease-in-out;transition:filter .3s ease-in-out,-webkit-filter .3s ease-in-out;width:100%}.cv__frame--blurred{-webkit-filter:blur(4px);filter:blur(4px)}html{background-color:#312f34}