article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:'Roboto',sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
*,
*::after,
*::before {
	box-sizing: border-box;
}

body{--color-text:#fff;--color-bg:#252525;--color-link:#fff;--color-link-hover:#e4094c;--color-bg-item1:#1a1a1a;--color-bg-item2:#2c35b7;--color-bg-item3:#1a1a1a;--color-bg-item4:#e4094c;--color-bg-item5:#3a183c;--color-item-alt:#494d54;--color-quote:#5b677a;--color-info:#57535a;--color-title:#e23434;--color-tagline:#e2e2e2;font-family:"Roboto Mono",Futura,Arial,sans-serif;min-height:100vh;color:#57585c;color:var(--color-text);background-color:#fff;background-color:#fff/*var(--color-bg)*/;overflow:hidden;padding:6rem 0 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.js .loading::before{content:'';position:fixed;z-index:100000;top:0;left:0;width:100%;height:100%;background:var(--color-bg)}
.js .loading::after{content:'';position:fixed;z-index:100000;top:50%;left:50%;width:60px;height:60px;margin:-30px 0 0 -30px;pointer-events:none;border-radius:50%;opacity:.4;background:var(--color-link);animation:loaderAnim .7s linear infinite alternate forwards}
@keyframes loaderAnim {to{opacity:1;transform:scale3d(0.5,0.5,1)}
}
a{text-decoration:none;color:var(--color-link);outline:none;transition:color .2s}
a:hover,a:focus{color:var(--color-link-hover)}
button:focus,a:focus{outline:none}
.hidden{position:absolute;overflow:hidden;width:0;height:0;pointer-events:none}
.icon{display:block;width:1.5em;height:1.5em;margin:0 auto;fill:currentColor}
main{position:relative;width:100%}



.mainmenu__item{font-size:18px;text-transform:lowercase;overflow:visible;margin:.5rem 0;padding:0 .5rem;position:relative;transition:color .3s}
.mainmenu__item:hover{color:#ffff00/*var(--color-item-alt)*/; text-decoration: none;}

.action{background:none;border:0;color:#fff;cursor:pointer;padding:0}
.action--menu{pointer-events:auto;position:absolute;top:1.5rem;right:1.5rem;z-index:1000}
.menu--open .action--menu{pointer-events:none}
.action--close{position:absolute;top:1.5rem;right:1.75rem;z-index:1000;opacity:0;padding:0 .5rem}
.icon--menu{width:2rem}
.icon--close{width:1rem}
.menu{text-align:center;width:100%;height:100vh;overflow:hidden;position:fixed;top:0;left:0;z-index:200;display:grid;grid-template-columns:100%;grid-template-rows:repeat(3,40% 20% 40%)/*grid-template-rows:repeat(2,33.33% )*/;pointer-events:none}
.menu--open{pointer-events:auto;pointer-events:auto}
.menu__item{width:100%;position:relative;overflow:hidden}
.menu__item-inner{overflow:hidden;transform:translate3d(100%,0,0);height:100%;width:100%;position:relative;display:flex;flex-direction:column;justify-content:center}
.menu__item--1 .menu__item-inner{background:var(--color-bg-item1)}
.menu__item--2 .menu__item-inner{background:var(--color-bg-item2)}
.menu__item--3 .menu__item-inner{background:var(--color-bg-item3)}
.menu__item--4 .menu__item-inner{background:var(--color-bg-item4)}
.menu__item--5 .menu__item-inner{background:var(--color-bg-item5)}
.menu__item--4,.menu__item--5{display:none}
.label{display:none}
.mainmenu__item{opacity:0}
.mainmenu__item,.sidemenu__item{position:relative;overflow:hidden;transition:color .1s;margin:.25rem 0;display:block}
.sidemenu__item-inner{display:block;transform:translate3d(0,100%,0)}
.menu__item-map{width:100%;height:100%;position:absolute;top:0;left:0;background:url(https://strikelab.it/gestione/img/img-sito/nic2.jpg) no-repeat 50% 50%;background-size:cover;transition:transform .8s cubic-bezier(0.2,1,0.8,1)}
.menu__item-inner:hover .menu__item-map{transform:scale3d(1.1,1.1,1)}
.menu__item-hoverlink{font-weight:700;text-transform:capitalize;position:relative;z-index:1000;display:block}
.menu__item-hoverlink:hover{color:var(--color-link)}
.menu__item-link{text-align:left;align-self:flex-start;justify-self:start;font-size:1.5rem;width:100%;line-height:1;padding:2rem;margin:3rem 0 auto;display:flex;flex-direction:column;height:calc(100% - 3rem)}
.menu__item-link::after{content:'\27F6';display:block;margin-top:auto;font-size:.95rem}
@media screen and (min-width: 53em) {body{padding:0}
.content{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;margin:0 auto;min-height:100vh;text-align:left}
.frame{position:fixed;z-index:199;top:0;left:0;display:grid;align-content:space-between;width:100%;max-width:none;height:100vh;padding:1.5rem;pointer-events:none;grid-template-columns:50% 50%;grid-template-rows:auto auto auto;grid-template-areas:'codropsheader info' '... ...' 'github ...'}
.codrops-header{grid-area:codropsheader;padding:0;justify-content:start}
.codrops-links{margin:0}
.frame a{pointer-events:auto}
.github{grid-area:github;justify-self:start}
.info{margin:0 6rem 0 0;color:var(--color-info)}
.menu{width:100%;height:100vh;overflow:hidden;position:fixed;top:0;left:0;grid-template-columns:20% 30% 50%;grid-template-rows:60% 40%;grid-template-areas:"item3 item2 item1" "item4 item5 item1"}
.menu__item{height:100%}
.menu__item--1{grid-area:item1}
.menu__item--2{grid-area:item2}
.menu__item--3{grid-area:item3}
.menu__item--4{grid-area:item4}
.menu__item--5{grid-area:item5}
.menu__item--4,.menu__item--5{display:block}
.menu__item-inner{align-items:center}
.label{display:block;color:var(--color-item-alt);position:absolute;z-index:1000;font-size:.85rem;font-weight:700;margin:0;white-space:nowrap}
.label--topleft{top:2rem;left:2rem}
.label--vert,.label--vert-mirror{-webkit-writing-mode:vertical-rl;writing-mode:vertical-rl}
.label--vert-mirror{transform:rotate(180deg)}
.label--bottomright{bottom:2rem;right:2rem}
.label::before{content:'------------- ';-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-1px;margin:0 .75rem 0 0}
.label--vert::before,.label--vert-mirror::before{margin:.75rem 0}
.mainmenu,.sidemenu{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.mainmenu{counter-reset:menuitem}
.mainmenu__item{font-size:3vw;text-transform:lowercase;overflow:visible;margin:.5rem 0;padding:0 .5rem;position:relative;transition:color .3s}
.mainmenu__item:hover{color:#ffff00/*var(--color-item-alt)*/; text-decoration: none;}
.mainmenu__item::before{counter-increment:menuitem;content:counters(menuitem, "", decimal-leading-zero);position:absolute;font-size:.85rem;top:25%;left:-1.25rem;color:var(--color-item-alt)}
.mainmenu__item::after{content:'';width:100%;top:58%;height:6px;background:var(--color-link-hover);position:absolute;left:0;opacity:0;transform:scale3d(0,1,1);transition:transform 0.3s,opacity .3s;transform-origin:100% 50%}
.mainmenu__item:hover::after{opacity:0;transform:scale3d(1,1,1)}/* nicola --  metti opacity a 1 per vedere il barrato*/
.sidemenu__item{text-transform:uppercase;letter-spacing:.15rem;font-size:.85rem}
.menu__item-hoverlink{font-size:1.25rem;text-transform:lowercase;border-bottom:2px solid #fff;opacity:0;transition:opacity .3s}
.menu__item-inner:hover .menu__item-hoverlink{opacity:1}
}