Difference between revisions of "Template:Marburg/index.css"

Line 1: Line 1:
−
<html><style>h1{overflow:unset!important}.wrapper{margin-left:-20px;position:absolute;top:0;left:0;width:100vw;max-width:100vw;height:calc(100vh - 18px);overflow:auto;max-height:calc(100vh - 18px);min-height:calc(100vh - 18px);background-color:#f5f5f5}hr{display:block;height:1px;border:0;border-top:2px solid #69a555;padding:0;margin:1em 15%}p.glitch{font-size:4em!important;line-height:1em}.glitch,p.glitch{letter-spacing:.15em}.glitch{position:relative;color:#fff}.glitch:before{left:0;left:2px;text-shadow:-2px 0 #ff00c1;clip:rect(44px,450px,56px,0);animation:glitch-anim 5s linear infinite alternate-reverse}.glitch:after,.glitch:before{content:attr(data-text);position:absolute;top:0;width:100%;height:100%}.glitch:after{left:0;left:-2px;text-shadow:-2px 0 #00fff9,2px 2px #ff00c1;animation:glitch-anim2 1s linear infinite alternate-reverse}@-webkit-keyframes glitch-anim{0%{clip:rect(43px,9999px,85px,0);transform:skew(.57deg)}5%{clip:rect(77px,9999px,66px,0);transform:skew(.15deg)}10%{clip:rect(47px,9999px,42px,0);transform:skew(.88deg)}15%{clip:rect(91px,9999px,73px,0);transform:skew(.3deg)}20%{clip:rect(72px,9999px,52px,0);transform:skew(.46deg)}25%{clip:rect(7px,9999px,90px,0);transform:skew(.11deg)}30%{clip:rect(13px,9999px,58px,0);transform:skew(.11deg)}35%{clip:rect(36px,9999px,19px,0);transform:skew(.57deg)}40%{clip:rect(47px,9999px,25px,0);transform:skew(.92deg)}45%{clip:rect(40px,9999px,47px,0);transform:skew(.39deg)}50%{clip:rect(14px,9999px,72px,0);transform:skew(.94deg)}55%{clip:rect(27px,9999px,13px,0);transform:skew(.5deg)}60%{clip:rect(96px,9999px,71px,0);transform:skew(.83deg)}65%{clip:rect(67px,9999px,39px,0);transform:skew(.24deg)}70%{clip:rect(8px,9999px,22px,0);transform:skew(.52deg)}75%{clip:rect(83px,9999px,41px,0);transform:skew(.6deg)}80%{clip:rect(28px,9999px,92px,0);transform:skew(.89deg)}85%{clip:rect(29px,9999px,23px,0);transform:skew(.7deg)}90%{clip:rect(90px,9999px,26px,0);transform:skew(.75deg)}95%{clip:rect(73px,9999px,35px,0);transform:skew(.29deg)}to{clip:rect(74px,9999px,39px,0);transform:skew(1deg)}}@keyframes glitch-anim{0%{clip:rect(43px,9999px,85px,0);transform:skew(.57deg)}5%{clip:rect(77px,9999px,66px,0);transform:skew(.15deg)}10%{clip:rect(47px,9999px,42px,0);transform:skew(.88deg)}15%{clip:rect(91px,9999px,73px,0);transform:skew(.3deg)}20%{clip:rect(72px,9999px,52px,0);transform:skew(.46deg)}25%{clip:rect(7px,9999px,90px,0);transform:skew(.11deg)}30%{clip:rect(13px,9999px,58px,0);transform:skew(.11deg)}35%{clip:rect(36px,9999px,19px,0);transform:skew(.57deg)}40%{clip:rect(47px,9999px,25px,0);transform:skew(.92deg)}45%{clip:rect(40px,9999px,47px,0);transform:skew(.39deg)}50%{clip:rect(14px,9999px,72px,0);transform:skew(.94deg)}55%{clip:rect(27px,9999px,13px,0);transform:skew(.5deg)}60%{clip:rect(96px,9999px,71px,0);transform:skew(.83deg)}65%{clip:rect(67px,9999px,39px,0);transform:skew(.24deg)}70%{clip:rect(8px,9999px,22px,0);transform:skew(.52deg)}75%{clip:rect(83px,9999px,41px,0);transform:skew(.6deg)}80%{clip:rect(28px,9999px,92px,0);transform:skew(.89deg)}85%{clip:rect(29px,9999px,23px,0);transform:skew(.7deg)}90%{clip:rect(90px,9999px,26px,0);transform:skew(.75deg)}95%{clip:rect(73px,9999px,35px,0);transform:skew(.29deg)}to{clip:rect(74px,9999px,39px,0);transform:skew(1deg)}}@-webkit-keyframes glitch-anim2{0%{clip:rect(98px,9999px,61px,0);transform:skew(.63deg)}5%{clip:rect(78px,9999px,5px,0);transform:skew(.78deg)}10%{clip:rect(67px,9999px,67px,0);transform:skew(.19deg)}15%{clip:rect(61px,9999px,86px,0);transform:skew(.76deg)}20%{clip:rect(70px,9999px,12px,0);transform:skew(.22deg)}25%{clip:rect(14px,9999px,36px,0);transform:skew(.83deg)}30%{clip:rect(32px,9999px,99px,0);transform:skew(.96deg)}35%{clip:rect(58px,9999px,60px,0);transform:skew(.39deg)}40%{clip:rect(47px,9999px,41px,0);transform:skew(.45deg)}45%{clip:rect(40px,9999px,8px,0);transform:skew(.76deg)}50%{clip:rect(60px,9999px,62px,0);transform:skew(.47deg)}55%{clip:rect(86px,9999px,86px,0);transform:skew(.1deg)}60%{clip:rect(98px,9999px,34px,0);transform:skew(.2deg)}65%{clip:rect(38px,9999px,31px,0);transform:skew(.66deg)}70%{clip:rect(5px,9999px,1px,0);transform:skew(.22deg)}75%{clip:rect(26px,9999px,45px,0);transform:skew(.04deg)}80%{clip:rect(1px,9999px,56px,0);transform:skew(.45deg)}85%{clip:rect(51px,9999px,31px,0);transform:skew(.7deg)}90%{clip:rect(30px,9999px,6px,0);transform:skew(.95deg)}95%{clip:rect(57px,9999px,97px,0);transform:skew(.01deg)}to{clip:rect(80px,9999px,54px,0);transform:skew(.97deg)}}@keyframes glitch-anim2{0%{clip:rect(98px,9999px,61px,0);transform:skew(.63deg)}5%{clip:rect(78px,9999px,5px,0);transform:skew(.78deg)}10%{clip:rect(67px,9999px,67px,0);transform:skew(.19deg)}15%{clip:rect(61px,9999px,86px,0);transform:skew(.76deg)}20%{clip:rect(70px,9999px,12px,0);transform:skew(.22deg)}25%{clip:rect(14px,9999px,36px,0);transform:skew(.83deg)}30%{clip:rect(32px,9999px,99px,0);transform:skew(.96deg)}35%{clip:rect(58px,9999px,60px,0);transform:skew(.39deg)}40%{clip:rect(47px,9999px,41px,0);transform:skew(.45deg)}45%{clip:rect(40px,9999px,8px,0);transform:skew(.76deg)}50%{clip:rect(60px,9999px,62px,0);transform:skew(.47deg)}55%{clip:rect(86px,9999px,86px,0);transform:skew(.1deg)}60%{clip:rect(98px,9999px,34px,0);transform:skew(.2deg)}65%{clip:rect(38px,9999px,31px,0);transform:skew(.66deg)}70%{clip:rect(5px,9999px,1px,0);transform:skew(.22deg)}75%{clip:rect(26px,9999px,45px,0);transform:skew(.04deg)}80%{clip:rect(1px,9999px,56px,0);transform:skew(.45deg)}85%{clip:rect(51px,9999px,31px,0);transform:skew(.7deg)}90%{clip:rect(30px,9999px,6px,0);transform:skew(.95deg)}95%{clip:rect(57px,9999px,97px,0);transform:skew(.01deg)}to{clip:rect(80px,9999px,54px,0);transform:skew(.97deg)}}.as_hero{position:relative;background-color:#333;background-size:cover;background-repeat:no-repeat;background-attachment:fixed;background-position:top;height:100vh}.logo{background:url(https://static.igem.org/mediawiki/2019/3/3f/T--Marburg--header_logo.svg);min-height:100%;width:inherit;background-repeat:no-repeat;margin-top:5px}.as_hero .as_hero_content{position:relative;z-index:99;display:flex;align-items:center;background:transparent;border-radius:0;min-height:calc(100vh - 52px);padding-left:50%;overflow:hidden}.navbar,.transparent{transition:background-color .4s ease}.transparent{background-color:transparent}.transparent.navbar{background-color:rgba(100,0,35,.5)}.transparent .logo{background:url(https://static.igem.org/mediawiki/2019/3/3a/T--Marburg--header_logo_white.svg);background-repeat:no-repeat}.transparent .navbar-burger,.transparent .navbar-item,.transparent .navbar-link,.transparent .navbar-menu a:visited{color:#f5f5f5}.transparent .navbar-dropdown,.transparent .navbar-item.has-dropdown:hover .navbar-link{background:rgba(2,2,2,.5)}.transparent .navbar-menu.is-active{background:rgba(2,2,2,.7)}.transparent .navbar-menu.is-active .navbar-dropdown,.transparent .navbar-menu.is-active .navbar-item,.transparent .navbar-menu.is-active .navbar-item.has-dropdown:hover .navbar-link{background:transparent!important}.grid-wrapper{display:flex;align-items:center;flex-direction:row}.text1{margin-left:-125px;z-index:10;padding:1em}.grid1{display:grid;grid-auto-columns:-webkit-min-content;grid-auto-columns:min-content;float:left}.grid1 #img1{grid-column:2;grid-row:1/span 2;margin-left:-150px;background-color:#418d2a}.grid1 #img1,.grid1 #img2{min-width:200px;height:200px}.grid1 #img2{grid-column:1;grid-row:2/span 2;z-index:1;margin-top:-75px;background-color:#186703}.grid1 #img3{grid-column:3;grid-row:3;z-index:2;margin-left:-125px;margin-top:-75px;min-width:200px;height:150px;background-color:#6fb05a}header{z-index:1}video{min-width:100%;max-width:none!important;min-height:100%;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.video-container{height:100%;width:100%;overflow:hidden;position:relative}@media screen and (max-width:1550px){.as_hero_content p{margin:0!important}}@media screen and (max-width:1375px){.as_hero_content{padding-left:25%!important}}@media screen and (max-width:925px){.as_hero_content{padding-left:10%!important}.footer-container,.grid-wrapper{flex-direction:column!important}.footer-container{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.text1{margin-left:0;z-index:unset}}@media screen and (max-width:785px){.as_hero_content{padding-left:5%!important}}</style></html>
+
<html><style>h1{overflow:unset!important}.wrapper{margin-left:-20px;position:absolute;top:0;left:0;width:100vw;max-width:100vw;height:calc(100vh - 18px);overflow:auto;max-height:calc(100vh - 18px);min-height:calc(100vh - 18px);background-color:#f5f5f5}hr{display:block;height:1px;border:0;border-top:2px solid #69a555;padding:0;margin:1em 15%}p.word{font-size:4em!important;line-height:1em}.glitch,p.word{letter-spacing:.15em}.glitch{position:relative;color:#fff}.glitch:before{left:0;left:2px;text-shadow:-2px 0 #ff00c1;clip:rect(44px,450px,56px,0);animation:glitch-anim 5s linear infinite alternate-reverse}.glitch:after,.glitch:before{content:attr(data-text);position:absolute;top:0;width:100%;height:100%}.glitch:after{left:0;left:-2px;text-shadow:-2px 0 #00fff9,2px 2px #ff00c1;animation:glitch-anim2 1s linear infinite alternate-reverse}@-webkit-keyframes glitch-anim{0%{clip:rect(43px,9999px,85px,0);transform:skew(.57deg)}5%{clip:rect(77px,9999px,66px,0);transform:skew(.15deg)}10%{clip:rect(47px,9999px,42px,0);transform:skew(.88deg)}15%{clip:rect(91px,9999px,73px,0);transform:skew(.3deg)}20%{clip:rect(72px,9999px,52px,0);transform:skew(.46deg)}25%{clip:rect(7px,9999px,90px,0);transform:skew(.11deg)}30%{clip:rect(13px,9999px,58px,0);transform:skew(.11deg)}35%{clip:rect(36px,9999px,19px,0);transform:skew(.57deg)}40%{clip:rect(47px,9999px,25px,0);transform:skew(.92deg)}45%{clip:rect(40px,9999px,47px,0);transform:skew(.39deg)}50%{clip:rect(14px,9999px,72px,0);transform:skew(.94deg)}55%{clip:rect(27px,9999px,13px,0);transform:skew(.5deg)}60%{clip:rect(96px,9999px,71px,0);transform:skew(.83deg)}65%{clip:rect(67px,9999px,39px,0);transform:skew(.24deg)}70%{clip:rect(8px,9999px,22px,0);transform:skew(.52deg)}75%{clip:rect(83px,9999px,41px,0);transform:skew(.6deg)}80%{clip:rect(28px,9999px,92px,0);transform:skew(.89deg)}85%{clip:rect(29px,9999px,23px,0);transform:skew(.7deg)}90%{clip:rect(90px,9999px,26px,0);transform:skew(.75deg)}95%{clip:rect(73px,9999px,35px,0);transform:skew(.29deg)}to{clip:rect(74px,9999px,39px,0);transform:skew(1deg)}}@keyframes glitch-anim{0%{clip:rect(43px,9999px,85px,0);transform:skew(.57deg)}5%{clip:rect(77px,9999px,66px,0);transform:skew(.15deg)}10%{clip:rect(47px,9999px,42px,0);transform:skew(.88deg)}15%{clip:rect(91px,9999px,73px,0);transform:skew(.3deg)}20%{clip:rect(72px,9999px,52px,0);transform:skew(.46deg)}25%{clip:rect(7px,9999px,90px,0);transform:skew(.11deg)}30%{clip:rect(13px,9999px,58px,0);transform:skew(.11deg)}35%{clip:rect(36px,9999px,19px,0);transform:skew(.57deg)}40%{clip:rect(47px,9999px,25px,0);transform:skew(.92deg)}45%{clip:rect(40px,9999px,47px,0);transform:skew(.39deg)}50%{clip:rect(14px,9999px,72px,0);transform:skew(.94deg)}55%{clip:rect(27px,9999px,13px,0);transform:skew(.5deg)}60%{clip:rect(96px,9999px,71px,0);transform:skew(.83deg)}65%{clip:rect(67px,9999px,39px,0);transform:skew(.24deg)}70%{clip:rect(8px,9999px,22px,0);transform:skew(.52deg)}75%{clip:rect(83px,9999px,41px,0);transform:skew(.6deg)}80%{clip:rect(28px,9999px,92px,0);transform:skew(.89deg)}85%{clip:rect(29px,9999px,23px,0);transform:skew(.7deg)}90%{clip:rect(90px,9999px,26px,0);transform:skew(.75deg)}95%{clip:rect(73px,9999px,35px,0);transform:skew(.29deg)}to{clip:rect(74px,9999px,39px,0);transform:skew(1deg)}}@-webkit-keyframes glitch-anim2{0%{clip:rect(98px,9999px,61px,0);transform:skew(.63deg)}5%{clip:rect(78px,9999px,5px,0);transform:skew(.78deg)}10%{clip:rect(67px,9999px,67px,0);transform:skew(.19deg)}15%{clip:rect(61px,9999px,86px,0);transform:skew(.76deg)}20%{clip:rect(70px,9999px,12px,0);transform:skew(.22deg)}25%{clip:rect(14px,9999px,36px,0);transform:skew(.83deg)}30%{clip:rect(32px,9999px,99px,0);transform:skew(.96deg)}35%{clip:rect(58px,9999px,60px,0);transform:skew(.39deg)}40%{clip:rect(47px,9999px,41px,0);transform:skew(.45deg)}45%{clip:rect(40px,9999px,8px,0);transform:skew(.76deg)}50%{clip:rect(60px,9999px,62px,0);transform:skew(.47deg)}55%{clip:rect(86px,9999px,86px,0);transform:skew(.1deg)}60%{clip:rect(98px,9999px,34px,0);transform:skew(.2deg)}65%{clip:rect(38px,9999px,31px,0);transform:skew(.66deg)}70%{clip:rect(5px,9999px,1px,0);transform:skew(.22deg)}75%{clip:rect(26px,9999px,45px,0);transform:skew(.04deg)}80%{clip:rect(1px,9999px,56px,0);transform:skew(.45deg)}85%{clip:rect(51px,9999px,31px,0);transform:skew(.7deg)}90%{clip:rect(30px,9999px,6px,0);transform:skew(.95deg)}95%{clip:rect(57px,9999px,97px,0);transform:skew(.01deg)}to{clip:rect(80px,9999px,54px,0);transform:skew(.97deg)}}@keyframes glitch-anim2{0%{clip:rect(98px,9999px,61px,0);transform:skew(.63deg)}5%{clip:rect(78px,9999px,5px,0);transform:skew(.78deg)}10%{clip:rect(67px,9999px,67px,0);transform:skew(.19deg)}15%{clip:rect(61px,9999px,86px,0);transform:skew(.76deg)}20%{clip:rect(70px,9999px,12px,0);transform:skew(.22deg)}25%{clip:rect(14px,9999px,36px,0);transform:skew(.83deg)}30%{clip:rect(32px,9999px,99px,0);transform:skew(.96deg)}35%{clip:rect(58px,9999px,60px,0);transform:skew(.39deg)}40%{clip:rect(47px,9999px,41px,0);transform:skew(.45deg)}45%{clip:rect(40px,9999px,8px,0);transform:skew(.76deg)}50%{clip:rect(60px,9999px,62px,0);transform:skew(.47deg)}55%{clip:rect(86px,9999px,86px,0);transform:skew(.1deg)}60%{clip:rect(98px,9999px,34px,0);transform:skew(.2deg)}65%{clip:rect(38px,9999px,31px,0);transform:skew(.66deg)}70%{clip:rect(5px,9999px,1px,0);transform:skew(.22deg)}75%{clip:rect(26px,9999px,45px,0);transform:skew(.04deg)}80%{clip:rect(1px,9999px,56px,0);transform:skew(.45deg)}85%{clip:rect(51px,9999px,31px,0);transform:skew(.7deg)}90%{clip:rect(30px,9999px,6px,0);transform:skew(.95deg)}95%{clip:rect(57px,9999px,97px,0);transform:skew(.01deg)}to{clip:rect(80px,9999px,54px,0);transform:skew(.97deg)}}.as_hero{position:relative;background-color:#333;background-size:cover;background-repeat:no-repeat;background-attachment:fixed;background-position:top;height:100vh}.logo{background:url(https://static.igem.org/mediawiki/2019/3/3f/T--Marburg--header_logo.svg);min-height:100%;width:inherit;background-repeat:no-repeat;margin-top:5px}.as_hero .as_hero_content{position:relative;z-index:99;display:flex;align-items:center;background:transparent;border-radius:0;min-height:calc(100vh - 52px);padding-left:50%;overflow:hidden}.navbar,.transparent{transition:background-color .4s ease}.transparent{background-color:transparent}.transparent.navbar{background-color:rgba(100,0,35,.5)}.transparent .logo{background:url(https://static.igem.org/mediawiki/2019/3/3a/T--Marburg--header_logo_white.svg);background-repeat:no-repeat}.transparent .navbar-burger,.transparent .navbar-item,.transparent .navbar-link,.transparent .navbar-menu a:visited{color:#f5f5f5}.transparent .navbar-dropdown,.transparent .navbar-item.has-dropdown:hover .navbar-link{background:rgba(2,2,2,.5)}.transparent .navbar-menu.is-active{background:rgba(2,2,2,.7)}.transparent .navbar-menu.is-active .navbar-dropdown,.transparent .navbar-menu.is-active .navbar-item,.transparent .navbar-menu.is-active .navbar-item.has-dropdown:hover .navbar-link{background:transparent!important}.grid-wrapper{display:flex;align-items:center;flex-direction:row}.text1{margin-left:-125px;z-index:10;padding:1em}.grid1{display:grid;grid-auto-columns:-webkit-min-content;grid-auto-columns:min-content;float:left}.grid1 #img1{grid-column:2;grid-row:1/span 2;margin-left:-150px;background-color:#418d2a}.grid1 #img1,.grid1 #img2{min-width:200px;height:200px}.grid1 #img2{grid-column:1;grid-row:2/span 2;z-index:1;margin-top:-75px;background-color:#186703}.grid1 #img3{grid-column:3;grid-row:3;z-index:2;margin-left:-125px;margin-top:-75px;min-width:200px;height:150px;background-color:#6fb05a}header{z-index:1}video{min-width:100%;max-width:none!important;min-height:100%;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%)}.video-container{height:100%;width:100%;overflow:hidden;position:relative}@media screen and (max-width:1550px){.as_hero_content p{margin:0!important}}@media screen and (max-width:1375px){.as_hero_content{padding-left:25%!important}}@media screen and (max-width:925px){.as_hero_content{padding-left:10%!important}.footer-container,.grid-wrapper{flex-direction:column!important}.footer-container{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.text1{margin-left:0;z-index:unset}}@media screen and (max-width:785px){.as_hero_content{padding-left:5%!important}}</style></html>

Revision as of 11:15, 5 October 2019