1 line
4.4 KiB
CSS
1 line
4.4 KiB
CSS
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;box-sizing:border-box}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}.container{max-width:960px;margin:0 auto}.site-header .container{display:flex;flex-flow:row wrap;align-items:center;justify-content:space-between}.site-header a{text-decoration:none;color:inherit;display:block;height:5rem;display:flex;align-items:center}.site-title{font-weight:700}.site-title h1{font-size:1.5em}#hamburger{display:none}.hamburger-label{display:none}.site-nav{display:flex}.site-nav a{font-size:1.25em;margin-left:2em}.site-nav a:first-child{margin-left:0}.personal-summary .container{display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;margin-top:5em;justify-items:end;align-items:center}.personal-summary img{grid-area:1/1}.personal-summary p{grid-area:1/2}.personal-summary .cta{grid-area:2/2}.personal-summary img{height:15em}.personal-summary p{font-size:3em;line-height:1.4}.personal-summary em{font-style:normal;font-weight:700}.personal-summary .cta{display:flex;justify-self:start;margin-top:2em}.personal-summary .cta a{display:flex;font-size:24px;width:200px;height:48px;margin-left:2em;align-items:center;justify-content:center;text-decoration:none;color:#fff;background:#00a3ff;border-radius:4px;transition:background .4s ease-in-out}.personal-summary .cta a:nth-child(2){background:inherit;border:2px solid #00a3ff;color:#00a3ff;margin-left:1em}.personal-summary .cta a:hover{background:#ccedff}@media(max-width:62em){.site-header .container,main header,main section{padding:0 1em}.personal-summary img{height:224px}.personal-summary p{font-size:2.5em;justify-self:start;margin-left:3rem}}@media(max-width:860px){.personal-summary .container{grid-template-rows:auto auto auto;grid-template-columns:auto;justify-items:start;margin-top:0}.personal-summary img{grid-area:1/1;height:192px}.personal-summary p{grid-area:2/1;margin-left:0}.personal-summary .cta{grid-area:3/1}.personal-summary .cta a:first-child{margin-left:0}}@media(max-width:640px){.site-header{flex-flow:column}.site-header a{height:3rem}.site-nav{flex-basis:100%;display:flex}.personal-summary br{display:none}}@media(max-width:540px){.personal-summary p{font-size:2em}}@media(max-width:460px){.personal-summary .cta{flex-flow:column}.personal-summary .cta a:nth-child(2){margin-left:0;margin-top:1rem}.personal-summary p{font-size:1.5em;margin-top:1rem}}@media(max-width:400px){.site-nav{flex-flow:column}.site-nav a{margin-left:0;font-size:1em}.site-title{flex-grow:1}.hamburger{display:flex;align-items:center}.site-nav{display:none}#hamburger:checked~.site-nav{display:flex}.hamburger-label{display:block}.site-header{position:fixed;bottom:0;background:#fff;width:100vw}body{margin-bottom:48px}#hamburger{transition:all .3s;box-sizing:border-box;display:none}.hamburger-label{transition:all .3s;box-sizing:border-box;cursor:pointer;position:absolute;z-index:99;height:100%;width:100%;top:16px;right:16px;height:22px;width:22px}.spinner{transition:all .3s;box-sizing:border-box;position:absolute;height:3px;width:100%;background-color:#000}.horizontal{transition:all .3s;box-sizing:border-box;position:relative;float:left;margin-top:3px}.diagonal.part-1{position:relative;transition:all .3s;box-sizing:border-box;float:left}.diagonal.part-2{transition:all .3s;box-sizing:border-box;position:relative;float:left;margin-top:3px}#hamburger:checked~.hamburger-label>.horizontal{transition:all .3s;box-sizing:border-box;opacity:0}#hamburger:checked~.hamburger-label>.diagonal.part-1{transition:all .3s;box-sizing:border-box;transform:rotate(135deg);margin-top:8px}#hamburger:checked~.hamburger-label>.diagonal.part-2{transition:all .3s;box-sizing:border-box;transform:rotate(-135deg);margin-top:-9px}.hamburger-label::before{content:"Menu";position:absolute;right:28px}} |