Difference between revisions of "Team:Leiden/css/main css"

 
(62 intermediate revisions by the same user not shown)
Line 9: Line 9:
 
   --background: #D3D1BE;
 
   --background: #D3D1BE;
 
   --accent4: #B2B09B;
 
   --accent4: #B2B09B;
 +
  --accentRed: #F86767;
 +
  --accentCyan: #5FC8D8;
 
}
 
}
−
 
−
/* Font things */
 
  
 
@font-face {
 
@font-face {
Line 22: Line 22:
 
   font-family: UnderTitle;
 
   font-family: UnderTitle;
 
   src: url('https://static.igem.org/mediawiki/2018/d/d6/T--Leiden--YuGothicLight.ttf');
 
   src: url('https://static.igem.org/mediawiki/2018/d/d6/T--Leiden--YuGothicLight.ttf');
−
   /* src: url('../webfonts/yugothil.ttf'); */
+
   /* src: url('../webfonts/YuGothic-Light-reduced.ttf'); */
 
}
 
}
  
Line 43: Line 43:
 
   /* src: url('../webfonts/Roboto-LightItalic.ttf'); */
 
   /* src: url('../webfonts/Roboto-LightItalic.ttf'); */
 
   font-style: italic;
 
   font-style: italic;
 +
}
 +
 +
@font-face {
 +
  font-family: 'iGEMLeidenIcons';
 +
  src: url('https://static.igem.org/mediawiki/2018/5/54/T--Leiden--iGEMLeidenIcons.eot?43u2u1');
 +
  /* src: url('../webfonts/iGEMLeidenIcons.eot?43u2u1'); */
 +
  src: url('https://static.igem.org/mediawiki/2018/5/54/T--Leiden--iGEMLeidenIcons.eot?43u2u1#iefix') format('embedded-opentype'), url('https://static.igem.org/mediawiki/2018/e/e4/T--Leiden--iGEMLeidenIconsttf.ttf?43u2u1') format('truetype'), url('https://static.igem.org/mediawiki/2018/8/89/T--Leiden--iGEMLeidenIconswoff.woff?43u2u1') format('woff'), url('https://static.igem.org/mediawiki/2018/d/d1/T--Leiden--iGEMLeidenIconssvg.svg') format('svg');
 +
  /* src: url('../webfonts/iGEMLeidenIcons.eot?43u2u1#iefix') format('embedded-opentype'), url('../webfonts/iGEMLeidenIcons.ttf?43u2u1') format('truetype'), url('../webfonts/iGEMLeidenIcons.woff?43u2u1') format('woff'), url('../webfonts/iGEMLeidenIcons.svg?43u2u1#iGEMLeidenIcons') format('svg'); */
 +
  font-weight: normal;
 +
  font-style: normal;
 
}
 
}
  
 
/* Correct iGEM shit... */
 
/* Correct iGEM shit... */
−
 
 
#Global p, p {
 
#Global p, p {
 
   padding: 0;
 
   padding: 0;
Line 53: Line 62:
 
   line-height: 1.4;
 
   line-height: 1.4;
 
   position: relative;
 
   position: relative;
−
   z-index: 1;
+
   z-index: 50;
 
}
 
}
  
Line 60: Line 69:
 
   margin: 0;
 
   margin: 0;
 
}
 
}
−
 
−
/* #Global {
 
−
  width: 100%;
 
−
  position: absolute;
 
−
  background-color: var(--whiteish);
 
−
  color: var(--blackish);
 
−
  font-family: Body, sans-serif;
 
−
} */
 
  
 
#globalWrapper {
 
#globalWrapper {
Line 91: Line 92:
 
}
 
}
  
−
/***********************************************************************************************************************************************************/
+
#globalWrapper #content #top_title div.logo_2018 a img {
 +
  content: url('https://static.igem.org/mediawiki/2018/c/c8/T--Leiden--LogoLeidenV1.png')
 +
}
  
 +
/***********************************************************************************************************************************************************/
 
/* Global styles */
 
/* Global styles */
−
 
+
sup, sub {
−
sup {
+
 
   font-size: 60%;
 
   font-size: 60%;
 +
}
 +
 +
b, #body b {
 +
  font-family: Kopje;
 +
}
 +
 +
b.highlightBlue {
 +
  color: var(--accent1);
 +
}
 +
 +
b.highlightOrange {
 +
  color: var(--main);
 
}
 
}
  
Line 110: Line 125:
  
 
h1.SectionTitle {
 
h1.SectionTitle {
−
   font-size: 3em;
+
   font-size: 3rem;
 +
  z-index: 50;
 +
  position: relative;
 +
  padding-top: 60px;
 +
}
 +
 
 +
h2.SectionTitle {
 +
  font-size: 2.4rem;
 +
}
 +
 
 +
.container-text h1.SectionTitle {
 +
  text-align: left;
 
}
 
}
  
 
h1 {
 
h1 {
−
   font-size: 2em;
+
   font-size: 2rem;
 
}
 
}
  
 
h2 {
 
h2 {
−
   font-size: 1.5em;
+
   font-size: 1.5rem;
 
}
 
}
  
 
h3 {
 
h3 {
−
   font-size: 1.17em;
+
   font-size: 1.17rem;
 
}
 
}
  
 
h4 {
 
h4 {
−
   font-size: 1.12em;
+
   font-size: 1.12rem;
 
}
 
}
  
 
h5 {
 
h5 {
−
   font-size: .83em;
+
   font-size: .83rem;
 
}
 
}
  
 
h6 {
 
h6 {
−
   font-size: .75em;
+
   font-size: .75rem;
 
}
 
}
  
Line 159: Line 185:
 
}
 
}
  
−
li, ul {
+
ul li, ul {
 
   margin: 0;
 
   margin: 0;
 
   line-height: normal;
 
   line-height: normal;
Line 186: Line 212:
 
   margin: auto;
 
   margin: auto;
 
   padding: 60px 0 40px 0;
 
   padding: 60px 0 40px 0;
 +
  text-align: justify;
 +
  text-align-last: start;
 
}
 
}
  
Line 191: Line 219:
 
   color: inherit;
 
   color: inherit;
 
   text-decoration: none;
 
   text-decoration: none;
 +
}
 +
 +
a.colouredlink, span.colouredlink {
 +
  color: var(--main);
 +
  font-family: Kopje;
 +
  cursor: pointer;
 +
}
 +
 +
a.colouredlink.Blue {
 +
  color: var(--accent1);
 +
}
 +
 +
a.wrap {
 +
  display: block;
 +
}
 +
 +
code {
 +
  text-align: left;
 +
  display: block;
 +
  padding-left: 20px;
 
}
 
}
  
Line 198: Line 246:
  
 
/* References */
 
/* References */
−
 
 
.smaller {
 
.smaller {
 
   font-size: 0.75em;
 
   font-size: 0.75em;
 
}
 
}
  
−
/***********************************************************************************************************************************************************/
+
.popout .refs p, .refs p, .projectDescription .refs p {
 +
  padding: 0 0 5px 0;
 +
}
  
−
/* Homepage */
+
.center {
 +
  text-align: center;
 +
  text-align-last: center;
 +
}
  
−
.circles {
+
.caption {
−
   background: url('https://static.igem.org/mediawiki/2018/3/3a/T--Leiden--circles1200pxplus.png') no-repeat;
+
   font-size: 0.9em;
−
   background-position: 50% 50%;
+
  text-align: justify;
−
   background-size: cover;
+
}
 +
 
 +
span.grouped {
 +
  display: inline-block;
 +
  position: relative;
 +
}
 +
 
 +
/* Custom scrollbar (chrome & IE/Edge) */
 +
/* width */
 +
::-webkit-scrollbar {
 +
  width: 10px;
 +
  height: 10px;
 +
}
 +
 
 +
::-webkit-scrollbar-track {
 +
  background: #efefef;
 +
  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
 +
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
 +
}
 +
 
 +
::-webkit-scrollbar-thumb {
 +
  border-radius: 5px;
 +
   background: var(--accent1);
 +
}
 +
 
 +
/*********************** Blobs ***************************/
 +
.blobs {
 +
  background: var(--main);
 +
  margin: 0 -2px;
 +
  padding: 2px 7px;
 +
  -webkit-filter: url("#goo");
 +
  filter: url("#goo");
 +
  cursor: default;
 +
  position: relative;
 +
  display: inline-block;
 +
  border: solid transparent;
 +
  border-width: 0px;
 +
  -webkit-transition: all 0.5s;
 +
  transition: all 0.5s;
 +
   background-clip: padding-box;
 +
  -webkit-box-sizing: content-box;
 +
  box-sizing: content-box;
 +
  z-index: 52;
 +
}
 +
 
 +
.blobs:hover {
 +
  border-width: 10px;
 +
  margin: -10px -12px;
 +
}
 +
 
 +
.blobs .popoutBlob {
 +
  position: absolute;
 +
  z-index: -1;
 +
  display: block;
 +
  width: 20px;
 
   height: -webkit-max-content;
 
   height: -webkit-max-content;
 
   height: -moz-max-content;
 
   height: -moz-max-content;
 
   height: max-content;
 
   height: max-content;
−
   min-height: calc(70vh - 10px);
+
   max-height: 20px;
−
   position: relative;
+
  bottom: 3px;
−
   top: 0;
+
  left: calc(50% - 10px);
−
   z-index: 3;
+
   background: var(--main);
 +
   padding: 0px;
 +
  border-radius: 50%;
 +
  color: var(--main);
 +
  font-size: 0px;
 +
  border: solid transparent;
 +
  border-width: 0px;
 +
  -webkit-transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 +
   transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 +
  background-clip: padding-box;
 +
  -webkit-box-sizing: content-box;
 +
  box-sizing: content-box;
 
}
 
}
  
−
div#headercontent {
+
.blobs.bottom .popoutBlob {
 +
  bottom: auto;
 +
  top: 3px;
 +
}
 +
 
 +
.blobs:hover .popoutBlob {
 +
  left: calc(50% - 135px);
 +
  border-radius: 10px;
 +
  width: 200px;
 +
  height: -webkit-max-content;
 +
  height: -moz-max-content;
 +
  height: max-content;
 +
  max-height: 300px;
 +
  font-size: 1em;
 +
  bottom: 25px;
 +
  padding: 15px;
 +
  border-width: 20px;
 +
  -webkit-transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 +
  transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 +
  cursor: pointer;
 +
  -webkit-animation: textappear 0.9s forwards;
 +
  animation: textappear 0.9s forwards;
 +
  /* z-index: 99999; */
 +
}
 +
 
 +
#iHP .blobs .popoutBlob {
 +
  cursor: default;
 +
}
 +
 
 +
#iHP .blobs.Clickable .popoutBlob {
 +
  cursor: pointer;
 +
}
 +
 
 +
.blobs.XXL:hover .popoutBlob {
 +
  left: calc(50% - 185px);
 +
  width: 300px;
 +
}
 +
 
 +
.blobs.bottom .popoutBlob {
 +
  bottom: auto;
 +
  top: 25px;
 +
}
 +
 
 +
.blobs .wobblybobbly {
 
   position: absolute;
 
   position: absolute;
 +
  z-index: -1;
 +
  width: 30%;
 +
  background: var(--main);
 +
  height: 70%;
 +
  border-radius: 50%;
 +
  left: 35%;
 +
  bottom: 4px;
 +
}
 +
 +
.blobs:hover .wobblybobbly {
 +
  -webkit-animation: wobble 1.7s 0.2s;
 +
  animation: wobble 1.7s 0.2s;
 +
}
 +
 +
@-webkit-keyframes wobble {
 +
  0% {
 +
    bottom: 4px
 +
  }
 +
 +
  15% {
 +
    bottom: 14px
 +
  }
 +
 +
  42% {
 +
    bottom: -4px
 +
  }
 +
 +
  67% {
 +
    bottom: 11px
 +
  }
 +
 +
  90% {
 +
    bottom: -2px
 +
  }
 +
 +
  100% {
 +
    bottom: 4px
 +
  }
 +
}
 +
 +
@keyframes wobble {
 +
  0% {
 +
    bottom: 4px
 +
  }
 +
 +
  15% {
 +
    bottom: 14px
 +
  }
 +
 +
  42% {
 +
    bottom: -4px
 +
  }
 +
 +
  67% {
 +
    bottom: 11px
 +
  }
 +
 +
  90% {
 +
    bottom: -2px
 +
  }
 +
 +
  100% {
 +
    bottom: 4px
 +
  }
 +
}
 +
 +
@-webkit-keyframes textappear {
 +
  0% {
 +
    color: var(--main);
 +
  }
 +
 +
  60% {
 +
    color: var(--main);
 +
  }
 +
 +
  100% {
 +
    color: var(--blackish);
 +
  }
 +
}
 +
 +
@keyframes textappear {
 +
  0% {
 +
    color: var(--main);
 +
  }
 +
 +
  60% {
 +
    color: var(--main);
 +
  }
 +
 +
  100% {
 +
    color: var(--blackish);
 +
  }
 +
}
 +
 +
a.ref {
 +
  display: inline;
 +
}
 +
 +
/*********************** Navigation boxes at bottom of page ***************************/
 +
.UnderPageNav {
 +
  width: 90%;
 +
  position: relative;
 +
  max-width: 1100px;
 +
  margin: 50px auto;
 
   display: -webkit-box;
 
   display: -webkit-box;
 
   display: -ms-flexbox;
 
   display: -ms-flexbox;
 
   display: flex;
 
   display: flex;
−
   -webkit-box-orient: vertical;
+
   -webkit-box-orient: horizontal;
 
   -webkit-box-direction: normal;
 
   -webkit-box-direction: normal;
−
   -ms-flex-direction: column;
+
   -ms-flex-flow: row wrap;
−
   flex-direction: column;
+
   flex-flow: row wrap;
 +
  -webkit-box-pack: space-evenly;
 +
  -ms-flex-pack: space-evenly;
 +
  justify-content: space-evenly;
 +
  /* -webkit-box-align: center;
 +
  -ms-flex-align: center;
 +
  align-items: center;
 +
  -ms-flex-line-pack: center;
 +
  align-content: center; */
 +
}
 +
 
 +
.UnderPageNav.crowdfunding {
 +
  position: absolute;
 +
  bottom: 0;
 +
  left: 50%;
 +
  -webkit-transform: translate(-50%, 0);
 +
  transform: translate(-50%, 0);
 +
}
 +
 
 +
.donors.static~.UnderPageNav.crowdfunding {
 +
  position: relative;
 +
  left: auto;
 +
  -webkit-transform: translate(0, 0);
 +
  transform: translate(0, 0);
 +
}
 +
 
 +
/* .UnderPageNav.crowdfunding .NavBlockIcon {
 +
  margin-top: 40px
 +
} */
 +
.NavBlock {
 +
  width: 200px;
 +
  height: 200px;
 +
  background: var(--main);
 +
  display: block;
 +
  border-radius: 20px;
 +
  padding: 20px;
 +
  overflow: hidden;
 +
  position: relative;
 +
  cursor: pointer;
 +
  -webkit-box-shadow: 2px 2px 10px 0px grey;
 +
  box-shadow: 2px 2px 10px 0px grey;
 +
  -webkit-transition: all 0.5s;
 +
  transition: all 0.5s;
 +
  margin: 10px;
 +
}
 +
 
 +
.NavBlock:hover {
 +
  -webkit-box-shadow: 2px 2px 2px -2px grey;
 +
  box-shadow: 2px 2px 2px -2px grey;
 +
  -webkit-transform: translate(3px, 3px);
 +
  transform: translate(3px, 3px);
 +
}
 +
 
 +
.NavBlockIcon {
 +
  color: #f7f7f7;
 +
  font-size: 70px;
 +
  width: -webkit-max-content;
 +
  width: -moz-max-content;
 +
  width: max-content;
 +
  margin: auto;
 
   height: -webkit-max-content;
 
   height: -webkit-max-content;
 
   height: -moz-max-content;
 
   height: -moz-max-content;
 
   height: max-content;
 
   height: max-content;
−
   width: 100%;
+
   position: relative;
 
   top: 50%;
 
   top: 50%;
 
   -webkit-transform: translateY(-50%);
 
   -webkit-transform: translateY(-50%);
 
   transform: translateY(-50%);
 
   transform: translateY(-50%);
 +
  -webkit-transition: all 0.5s;
 +
  transition: all 0.5s;
 
}
 
}
  
−
div.logo {
+
.NavBlock:hover .NavBlockIcon {
−
  background: url('https://static.igem.org/mediawiki/2018/c/c8/T--Leiden--LogoLeidenV1.png');
+
   font-size: 30px;
−
   height: calc(0.9 * 50vw);
+
   top: 10%;
−
  max-height: 300px;
+
−
   width: 50%;
+
−
  margin: auto;
+
−
  background-size: contain;
+
−
  background-repeat: no-repeat;
+
−
  background-position: center bottom;
+
 
}
 
}
  
−
div#Fsos {
+
.NavBlockText {
 
   color: var(--blackish);
 
   color: var(--blackish);
−
   font-size: 50px;
+
  text-align: center;
−
   font-family: ProjectTitle;
+
   font-size: 15px;
 +
  overflow: hidden;
 +
   -webkit-transition: all 0.5s;
 +
  transition: all 0.5s;
 +
  opacity: 0;
 +
  position: relative;
 +
  top: 60px;
 +
}
 +
 
 +
.NavBlockText span {
 
   display: block;
 
   display: block;
−
   width: -webkit-max-content;
+
   color: var(--whiteish);
−
   width: -moz-max-content;
+
   font-family: Kopje;
−
   width: max-content;
+
   font-size: 16px;
−
  margin: auto;
+
 
   text-align: center;
 
   text-align: center;
−
   padding-top: 20px;
+
   text-align-last: center;
−
  background: rgba(222, 217, 208, 0.7);
+
   padding-bottom: 10px;
−
  -webkit-box-shadow: 0 0 20px 5px rgba(222, 217, 208, 1);
+
−
   box-shadow: 0 0 20px 5px rgba(222, 217, 208, 1);
+
−
  border-radius: 50px;
+
 
}
 
}
  
−
div#UnderTitle {
+
.NavBlock:hover .NavBlockText {
 +
  opacity: 1;
 +
  top: 0px;
 +
}
 +
 
 +
/*********************** Timeline Concept ***************************/
 +
.popout p.introTextTimeline {
 +
  border-bottom: 3px solid var(--main);
 +
  padding-bottom: 25px;
 +
  margin: 0px auto 30px;
 +
  width: 90%;
 +
}
 +
 
 +
.timeline li.timelineUnit {
 +
  list-style-type: none;
 +
  position: relative;
 +
  width: 100%;
 +
  margin-top: 50px;
 +
}
 +
 
 +
.timeline li.timelineUnit:first-of-type {
 +
  padding-top: 50px;
 +
}
 +
 
 +
.timeline li.timelineUnit:first-of-type i.iHPicon {
 +
  top: 150px;
 +
}
 +
 
 +
.timeline li.timelineUnit:first-of-type .linesegment::before {
 +
  content: '';
 +
  position: absolute;
 +
  top: 0;
 +
  height: 100px;
 +
  width: 100%;
 +
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(253, 253, 253, 1)), to(rgba(253, 253, 253, 0)));
 +
  background: linear-gradient(rgba(253, 253, 253, 1), rgba(253, 253, 253, 0));
 +
}
 +
 
 +
.timeline li.timelineUnit:last-of-type {
 +
  margin-bottom: 25px;
 +
}
 +
 
 +
.timeline li.timelineUnit:last-of-type .linesegment::before {
 +
  content: '';
 +
  position: absolute;
 +
  bottom: 0;
 +
  height: 100px;
 +
  width: 100%;
 +
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(253, 253, 253, 0)), to(rgba(253, 253, 253, 1)));
 +
  background: linear-gradient(rgba(253, 253, 253, 0), rgba(253, 253, 253, 1));
 +
}
 +
 
 +
.timeline li.timelineUnit .timelineContent {
 +
  position: relative;
 +
  width: calc(90% - 50px);
 
   color: var(--blackish);
 
   color: var(--blackish);
−
   font-size: 21.62px;
+
   border-radius: 20px;
−
   font-family: UnderTitle;
+
  opacity: 0;
 +
  -webkit-transition: all 0.5s, opacity 1s;
 +
  transition: all 0.5s, opacity 1s;
 +
}
 +
 
 +
.timeline li.timelineUnit.conclusion .timelineContent {
 +
  padding: 0;
 +
}
 +
 
 +
.timelineContent .title {
 +
   font-family: Kopje;
 +
  padding: 7px 25px 7px;
 +
  background: var(--main);
 +
}
 +
 
 +
.right .timelineContent .title {
 +
  border-radius: 0 20px 0 0;
 +
}
 +
 
 +
.left .timelineContent .title {
 +
  border-radius: 20px 0 0 0;
 +
}
 +
 
 +
.popout .timelineContent p.text, #Global .popout .timelineContent p.text {
 +
  background: var(--whiteish);
 +
  padding: 15px 25px 20px;
 +
  border: 1px solid #aaa;
 +
  border-top: 0px;
 +
  border-radius: 0 0 20px 20px;
 +
}
 +
 
 +
.timelineUnit.right .timelineContent {
 +
  left: calc(10% + 70px)
 +
}
 +
 
 +
.timeline li.timelineUnit.right .timelineContent.revealed {
 +
  left: calc(10% + 50px);
 +
  opacity: 1;
 +
}
 +
 
 +
.timelineUnit.left .timelineContent {
 +
  left: -20px;
 +
}
 +
 
 +
.timeline li.timelineUnit.left .timelineContent.revealed {
 +
  left: 0;
 +
  opacity: 1;
 +
}
 +
 
 +
.timeline li.timelineUnit.conclusion {
 +
  margin: 0 auto;
 +
  padding: 30px 0;
 +
}
 +
 
 +
.timelineUnit.conclusion .timelineContent.revealed {
 +
  opacity: 1;
 +
}
 +
 
 +
.conclusion .timelineContent {
 +
  border-radius: 20px;
 +
}
 +
 
 +
.conclusion .timelineContent .title {
 +
  border-radius: 15px 15px 0 0;
 +
  padding: 7px 25px 7px;
 +
  background: var(--main);
 +
  text-align: center;
 +
}
 +
 
 +
.popout .conclusion .timelineContent p.text, #Global .popout .conclusion .timelineContent p.text {
 +
  border: none;
 +
  padding: 10px 25px 20px;
 +
}
 +
 
 +
.timeline li.timelineUnit.conclusion .linesegment {
 +
  left: calc(50% - 4px);
 +
}
 +
 
 +
.timeline li.timelineUnit.conclusion .timelineContent {
 +
  width: 100%;
 +
  border: 3px solid var(--main);
 +
}
 +
 
 +
.timeline li.timelineUnit .linesegment {
 +
  position: absolute;
 
   display: block;
 
   display: block;
 +
  width: 8px;
 +
  top: 0;
 +
  bottom: 0;
 +
  background: var(--main);
 +
  border-radius: 4px;
 +
}
 +
 +
.timeline li.timelineUnit.left .linesegment {
 +
  right: calc(10% - 4px);
 +
}
 +
 +
.timeline li.timelineUnit.right .linesegment {
 +
  left: calc(10% - 4px);
 +
}
 +
 +
.timeline li.timelineUnit i.iHPicon {
 +
  position: absolute;
 +
  font-size: 30px;
 +
  border-radius: 50%;
 +
  width: 60px;
 +
  height: 60px;
 +
  background: var(--main);
 +
  color: white;
 +
  top: 100px;
 +
}
 +
 +
.timeline li.timelineUnit.left i.iHPicon {
 +
  right: 10%;
 +
  -webkit-transform: translateX(50%);
 +
  transform: translateX(50%);
 +
}
 +
 +
.timeline li.timelineUnit.right i.iHPicon {
 +
  left: 10%;
 +
  -webkit-transform: translateX(-50%);
 +
  transform: translateX(-50%);
 +
}
 +
 +
.timeline li.timelineUnit i.iHPicon::before {
 +
  position: absolute;
 +
  left: 50%;
 +
  top: 50%;
 +
  -webkit-transform: translate(-50%, -50%);
 +
  transform: translate(-50%, -50%);
 +
}
 +
 +
.timeline li.timelineUnit .arrow {
 +
  -webkit-box-sizing: content-box;
 +
  box-sizing: content-box;
 +
  position: absolute;
 +
  top: 0px;
 +
  width: 48px;
 +
  height: 50px;
 +
  border-top: 42px solid var(--main);
 +
}
 +
 +
.timeline li.timelineUnit.left .arrow {
 +
  left: 100%;
 +
  border-radius: 0 100% 0 0;
 +
}
 +
 +
.timeline li.timelineUnit.right .arrow {
 +
  right: 100%;
 +
  border-radius: 100% 0 0 0;
 +
}
 +
 +
.timeline li.timelineUnit.semiconclusion .timelineContent {
 +
  padding-top: 50px;
 +
}
 +
 +
.timeline li.timelineUnit.semiconclusion.right .arrow {
 +
  border-top: 0;
 +
  border-bottom: 42px solid var(--main);
 +
  border-radius: 0 0 0 100%;
 +
}
 +
 +
.timeline li.timelineUnit.semiconclusion.left .arrow {
 +
  border-top: 0;
 +
  border-bottom: 42px solid var(--main);
 +
  border-radius: 0 0 100% 0;
 +
}
 +
 +
.timeline li.timelineUnit.Mid {
 +
  margin: auto;
 +
  width: 100%;
 +
  padding-top: 70px;
 +
}
 +
 +
.timeline li.timelineUnit.Mid .linesegment {
 +
  left: calc(50% - 4px);
 +
  )
 +
}
 +
 +
.timeline .conclusion .flowIn, .timeline .conclusion .flowOut {
 +
  position: absolute;
 +
  background: var(--main);
 +
  left: calc(50% - 42px);
 +
  width: 84px;
 +
  height: 38px;
 +
}
 +
 +
.timeline .conclusion .flowIn {
 +
  bottom: calc(100% + 3px);
 +
}
 +
 +
.timeline .conclusion .flowOut {
 +
  top: calc(100% + 3px);
 +
}
 +
 +
.flowIn::before, .flowIn::after, .flowOut::before, .flowOut::after {
 +
  content: '';
 +
  position: absolute;
 +
  height: 38px;
 +
  width: 38px;
 +
  background: #fdfdfd;
 +
}
 +
 +
.flowIn::before {
 +
  top: 0;
 +
  left: 0;
 +
  border-radius: 0 0 100% 0;
 +
}
 +
 +
.flowIn::after {
 +
  top: 0;
 +
  right: 0;
 +
  border-radius: 0 0 0 100%;
 +
}
 +
 +
.flowOut::before {
 +
  bottom: 0;
 +
  left: 0;
 +
  border-radius: 0 100% 0 0;
 +
}
 +
 +
.flowOut::after {
 +
  bottom: 0;
 +
  right: 0;
 +
  border-radius: 100% 0 0 0;
 +
}
 +
 +
.timeline li.link {
 +
  position: relative;
 +
  border-style: solid;
 +
  border-color: var(--main);
 +
  height: 50px;
 +
}
 +
 +
.timeline li.link.LeftRight1 {
 +
  width: calc(40% + 5px);
 +
  border-width: 0 0 8px 8px;
 +
  left: calc(10% - 4px);
 +
  -webkit-transform: skewY(10deg);
 +
  transform: skewY(10deg);
 +
  -webkit-transform-origin: 100% 0;
 +
  transform-origin: 100% 0;
 +
  border-radius: 0 0 0 30px;
 +
  margin-top: 33px;
 +
}
 +
 +
.timeline li.link.LeftRight2 {
 +
  width: calc(40% + 4px);
 +
  margin-top: -8px;
 +
  margin-bottom: -18px;
 +
  border-width: 8px 8px 0 0;
 +
  left: 50%;
 +
  -webkit-transform: skewY(10deg);
 +
  transform: skewY(10deg);
 +
  -webkit-transform-origin: 0 0;
 +
  transform-origin: 0 0;
 +
  border-radius: 0 30px 0 0;
 +
}
 +
 +
.timeline li.link.RightLeft1 {
 +
  width: calc(40% + 4px);
 +
  border-width: 0 8px 8px 0px;
 +
  left: 50%;
 +
  -webkit-transform: skewY(-10deg);
 +
  transform: skewY(-10deg);
 +
  -webkit-transform-origin: 0 100%;
 +
  transform-origin: 0 100%;
 +
  border-radius: 0 0 30px 0;
 +
  margin-top: 33px;
 +
}
 +
 +
.timeline li.link.RightLeft2 {
 +
  width: calc(40% + 5px);
 +
  margin-top: -8px;
 +
  margin-bottom: -18px;
 +
  border-width: 8px 0 0 8px;
 +
  left: calc(10% - 4px);
 +
  -webkit-transform: skewY(-10deg);
 +
  transform: skewY(-10deg);
 +
  -webkit-transform-origin: 100% 0;
 +
  transform-origin: 100% 0;
 +
  border-radius: 30px 0 0 0;
 +
}
 +
 +
.timeline li.link.LeftMid1 {
 +
  width: calc(20% + 4px);
 +
  border-width: 0 0 8px 8px;
 +
  left: calc(10% - 4px);
 +
  -webkit-transform: skewY(10deg);
 +
  transform: skewY(10deg);
 +
  -webkit-transform-origin: 100% 0;
 +
  transform-origin: 100% 0;
 +
  border-radius: 0 0 0 30px;
 +
  margin-top: 4px;
 +
}
 +
 +
.timeline li.link.LeftMid2 {
 +
  width: calc(20% + 5px);
 +
  margin-top: -8px;
 +
  margin-bottom: 15px;
 +
  border-width: 8px 8px 0 0;
 +
  left: calc(30% - 1px);
 +
  -webkit-transform: skewY(10deg);
 +
  transform: skewY(10deg);
 +
  -webkit-transform-origin: 0 0;
 +
  transform-origin: 0 0;
 +
  border-radius: 0 30px 0 0;
 +
}
 +
 +
.timeline li.link.MidRight1 {
 +
  width: calc(20% + 5px);
 +
  border-width: 0 0 8px 8px;
 +
  left: calc(50% - 4px);
 +
  -webkit-transform: skewY(10deg);
 +
  transform: skewY(10deg);
 +
  -webkit-transform-origin: 100% 0;
 +
  transform-origin: 100% 0;
 +
  border-radius: 0 0 0 30px;
 +
  margin-top: 15px;
 +
}
 +
 +
.timeline li.link.MidRight2 {
 +
  width: calc(20% + 4px);
 +
  margin-top: -8px;
 +
  margin-bottom: -45px;
 +
  border-width: 8px 8px 0 0;
 +
  left: 70%;
 +
  -webkit-transform: skewY(10deg);
 +
  transform: skewY(10deg);
 +
  -webkit-transform-origin: 0 0;
 +
  transform-origin: 0 0;
 +
  border-radius: 0 30px 0 0;
 +
}
 +
 +
.timeline li.link.RightMid1 {
 +
  width: calc(20% + 4px);
 +
  border-width: 0 8px 8px 0px;
 +
  left: 70%;
 +
  -webkit-transform: skewY(-10deg);
 +
  transform: skewY(-10deg);
 +
  -webkit-transform-origin: 0 100%;
 +
  transform-origin: 0 100%;
 +
  border-radius: 0 0 30px 0;
 +
  margin-top: 4px;
 +
}
 +
 +
.timeline li.link.RightMid2 {
 +
  width: calc(20% + 5px);
 +
  margin-top: -8px;
 +
  margin-bottom: 15px;
 +
  border-width: 8px 0 0 8px;
 +
  left: calc(50% - 4px);
 +
  -webkit-transform: skewY(-10deg);
 +
  transform: skewY(-10deg);
 +
  -webkit-transform-origin: 100% 0;
 +
  transform-origin: 100% 0;
 +
  border-radius: 30px 0 0 0;
 +
}
 +
 +
.timeline li.link.MidLeft1 {
 +
  width: calc(20% + 4px);
 +
  border-width: 0 8px 8px 0px;
 +
  left: calc(30% - 0px);
 +
  -webkit-transform: skewY(-10deg);
 +
  transform: skewY(-10deg);
 +
  -webkit-transform-origin: 0 100%;
 +
  transform-origin: 0 100%;
 +
  border-radius: 0 0 30px 0;
 +
  margin-top: 15px;
 +
}
 +
 +
.timeline li.link.MidLeft2 {
 +
  width: calc(20% + 5px);
 +
  margin-top: -8px;
 +
  margin-bottom: -45px;
 +
  border-width: 8px 0 0 8px;
 +
  left: calc(10% - 4px);
 +
  -webkit-transform: skewY(-10deg);
 +
  transform: skewY(-10deg);
 +
  -webkit-transform-origin: 100% 0;
 +
  transform-origin: 100% 0;
 +
  border-radius: 30px 0 0 0;
 +
}
 +
 +
.popout .PicCaroussel {
 +
  display: block;
 +
  margin: 25px auto;
 +
  position: relative;
 +
}
 +
 +
.popout .PicCaroussel.horizontal {
 +
  width: 80%;
 +
}
 +
 +
.popout .PicCaroussel.vertical {
 +
  width: 40%;
 +
}
 +
 +
.PicCaroussel img:first-child {
 +
  position: relative;
 +
  width: 100%;
 +
  height: auto;
 +
}
 +
 +
.PicCaroussel img {
 +
  width: auto;
 +
  height: 100%;
 +
  position: absolute;
 +
  top: 0;
 +
  left: 50%;
 +
  -webkit-transform: translateX(-50%);
 +
  transform: translateX(-50%);
 +
  -webkit-transition: opacity 1s;
 +
  transition: opacity 1s;
 +
  opacity: 0;
 +
  border: 2px solid var(--main);
 +
}
 +
 +
.PicCaroussel img.active {
 +
  opacity: 1;
 +
}
 +
 +
.PicCaroussel .SlideNav {
 +
  display: block;
 +
  position: absolute;
 +
  bottom: 15px;
 
   width: -webkit-max-content;
 
   width: -webkit-max-content;
 
   width: -moz-max-content;
 
   width: -moz-max-content;
 
   width: max-content;
 
   width: max-content;
−
   margin: auto;
+
  left: 0;
−
   text-align: center;
+
  right: 0;
−
   padding-left: 2px;
+
   margin: 0 auto;
−
   background: rgba(222, 217, 208, 0.7);
+
}
−
   -webkit-box-shadow: 0 0 20px 5px rgba(222, 217, 208, 1);
+
 
−
   box-shadow: 0 0 20px 5px rgba(222, 217, 208, 1);
+
.PicCaroussel .SlideNav span {
−
   border-radius: 20px;
+
   display: inline-block;
 +
  width: 15px;
 +
   height: 15px;
 +
  border-radius: 50%;
 +
   color: var(--whiteish);
 +
  /* background: rgba(17, 17, 17, 0.5); */
 +
  background: rgba(69, 105, 144, 0.7);
 +
  border: 2px solid currentColor;
 +
  margin: 0 3px;
 +
  -webkit-transition: all 1s;
 +
  transition: all 1s;
 +
  position: relative;
 +
   -webkit-box-shadow: 0 0 0 1px rgba(17, 17, 17, 0.5);
 +
   box-shadow: 0 0 0 1px rgba(17, 17, 17, 0.5);
 +
}
 +
 
 +
.PicCaroussel .SlideNav span:hover {
 +
  background: currentColor;
 +
  cursor: pointer;
 +
}
 +
 
 +
.PicCaroussel .SlideNav span.active {
 +
  background: currentColor;
 +
}
 +
 
 +
.popout .SubSectionTitle, .projectDescription .SubSectionTitle {
 +
   border-bottom: 3px solid var(--main);
 +
  width: 90%;
 +
  margin-left: auto;
 +
  margin-right: auto;
 +
}
 +
 
 +
.projectDescription .SubSectionTitle {
 +
  width: 100%
 +
}
 +
 
 +
#animation50SOS {
 +
  width: 100%;
 +
  height: auto;
 +
  -webkit-box-shadow: 0 0 40px 5px var(--whiteish);
 +
  box-shadow: 0 0 40px 5px var(--whiteish);
 +
  margin: 5px auto;
 +
  border: 3px solid var(--main);
 
}
 
}
  
 
/***********************************************************************************************************************************************************/
 
/***********************************************************************************************************************************************************/
 +
/* Homepage */
 +
#loader-wrapper {
 +
  position: fixed;
 +
  width: 100vw;
 +
  height: 100vh;
 +
  top: 0;
 +
  left: 0;
 +
  background: white;
 +
  z-index: 99999999;
 +
  overflow: hidden;
 +
}
  
−
/* Eventpage */
+
#loader {
 +
  display: block;
 +
  position: absolute;
 +
  left: 50%;
 +
  top: 50%;
 +
  width: 150px;
 +
  height: 150px;
 +
  margin: -75px 0 0 -75px;
 +
  border-radius: 50%;
 +
  border: 4px solid transparent;
 +
  border-top-color: var(--main);
 +
  -webkit-animation: spin 2s linear infinite;
 +
  animation: spin 2s linear infinite;
 +
}
  
 +
#loader:before {
 +
  content: "";
 +
  position: absolute;
 +
  top: 6px;
 +
  left: 6px;
 +
  right: 6px;
 +
  bottom: 6px;
 +
  border-radius: 50%;
 +
  border: 4px solid transparent;
 +
  border-top-color: var(--accent2);
 +
  -webkit-animation: spin 3s linear infinite;
 +
  animation: spin 3s linear infinite;
 +
}
 +
 +
#loader:after {
 +
  content: "";
 +
  position: absolute;
 +
  top: 17px;
 +
  left: 17px;
 +
  right: 17px;
 +
  bottom: 17px;
 +
  border-radius: 50%;
 +
  border: 4px solid transparent;
 +
  border-top-color: var(--accent1);
 +
  -webkit-animation: spin 1.5s linear infinite;
 +
  animation: spin 1.5s linear infinite;
 +
}
 +
 +
#loader-wrapper #BestOnLargeScreens, #loader-wrapper #BadonEdge {
 +
  display: none;
 +
  padding: 0 10px;
 +
  font-size: 20px;
 +
  max-width: 90%;
 +
  margin: 0 auto;
 +
  text-align: center;
 +
  position: relative;
 +
  top: 80vh;
 +
}
 +
 +
#loader-wrapper #BadonEdge {
 +
  display: block;
 +
}
 +
 +
/* if javascript is not enabled, remove loader */
 +
.no-js#loader-wrapper, .no-js#loader-wrapper #loader {
 +
  display: none;
 +
}
 +
 +
@-webkit-keyframes spin {
 +
  0% {
 +
    -webkit-transform: rotate(0deg);
 +
    transform: rotate(0deg);
 +
  }
 +
 +
  100% {
 +
    -webkit-transform: rotate(360deg);
 +
    transform: rotate(360deg);
 +
  }
 +
}
 +
 +
@keyframes spin {
 +
  0% {
 +
    -webkit-transform: rotate(0deg);
 +
    transform: rotate(0deg);
 +
  }
 +
 +
  100% {
 +
    -webkit-transform: rotate(360deg);
 +
    transform: rotate(360deg);
 +
  }
 +
}
 +
 +
.largerText {
 +
  font-size: 30px;
 +
  position: relative;
 +
  width: 100%;
 +
  overflow: hidden;
 +
}
 +
 +
.popout object {
 +
  display: block;
 +
  margin: 10px auto;
 +
  width: 100%;
 +
}
 +
 +
.popout object.small {
 +
  height: 30vh;
 +
  min-height: 200px;
 +
}
 +
 +
.popout object.large {
 +
  height: 50vh;
 +
  min-height: 300px;
 +
}
 +
 +
.popout object.notebook {
 +
  height: 80vh;
 +
  min-height: 600px;
 +
}
 +
 +
.popout.Parts {
 +
  width: 90%;
 +
  max-width: 1000px;
 +
}
 +
 +
.popout.Parts.chapter.revealed {
 +
  max-width: 1100px;
 +
}
 +
 +
.popout.Parts.revealed .collapsibleContent {
 +
  padding: 20px 30px 0px;
 +
}
 +
 +
table.PartTable, table.ResultTable {
 +
  border-collapse: collapse;
 +
  border-spacing: 0;
 +
  width: 95%;
 +
  /* max-width: 900px; */
 +
  margin: 0 auto;
 +
  table-layout: fixed;
 +
  text-align: center;
 +
}
 +
 +
table.PartTable tr:first-of-type {
 +
  border-bottom: 1px solid grey;
 +
}
 +
 +
table.PartTable tr:nth-child(even), table.ResultTable tr:nth-child(even) {
 +
  background: rgba(255, 179, 117, 0.5);
 +
}
 +
 +
table.PartTable td, table.PartTable th, table.ResultTable td, table.ResultTable th {
 +
  padding: 10px 5px;
 +
}
 +
 +
table.PartTable.primers td:nth-child(2) {
 +
  word-break: break-all;
 +
}
 +
 +
table.ResultTable {
 +
  text-align: left;
 +
}
 +
 +
/***********************************************************************************************************************************************************/
 +
/* Eventpage */
 
.title {
 
.title {
 
   display: block;
 
   display: block;
Line 393: Line 1,406:
 
   height: 150px;
 
   height: 150px;
 
   width: 75px;
 
   width: 75px;
−
   border-right: 0px;
+
}
 +
 
 +
.circle.halfcircle.circle1 {
 +
   border-right: 0;
 
}
 
}
  
Line 441: Line 1,457:
 
}
 
}
  
−
.circle.circle1 {
+
.parallaxCircles .circle.circle1 {
 
   top: 320px;
 
   top: 320px;
 
   right: 0px;
 
   right: 0px;
 
}
 
}
  
−
.circle.circle2 {
+
.parallaxCircles .circle.circle2 {
 
   top: 600px;
 
   top: 600px;
 
   right: 170px;
 
   right: 170px;
 
}
 
}
  
−
.circle.circle3 {
+
.parallaxCircles .circle.circle3 {
 
   top: 150px;
 
   top: 150px;
 
   right: 50px;
 
   right: 50px;
 
}
 
}
  
−
.circle.circle4 {
+
.parallaxCircles .circle.circle4 {
 
   top: 900px;
 
   top: 900px;
 
   right: 50px;
 
   right: 50px;
 
}
 
}
  
−
.circle.circle5 {
+
.parallaxCircles .circle.circle5 {
 
   top: 650px;
 
   top: 650px;
 
   right: 150px;
 
   right: 150px;
 
}
 
}
  
−
.circle.circle6 {
+
.parallaxCircles .circle.circle6 {
 
   top: 820px;
 
   top: 820px;
 
   left: -40px;
 
   left: -40px;
 
}
 
}
  
−
.circle.circle7 {
+
.parallaxCircles .circle.circle7 {
 
   top: 300px;
 
   top: 300px;
 
   left: 50px;
 
   left: 50px;
 
}
 
}
  
−
.circle.circle8 {
+
.parallaxCircles .circle.circle8 {
 
   top: 750px;
 
   top: 750px;
 
   left: 150px;
 
   left: 150px;
 
}
 
}
  
−
.circle.circle9 {
+
.parallaxCircles .circle.circle9 {
 
   top: 850px;
 
   top: 850px;
 
   left: 250px;
 
   left: 250px;
 
}
 
}
  
−
.circle.circle10 {
+
.parallaxCircles .circle.circle10 {
 
   top: 370px;
 
   top: 370px;
 
   left: 120px;
 
   left: 120px;
Line 522: Line 1,538:
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
 +
 
   100% {
 
   100% {
−
     -webkit-transform: rotate(4deg) translateY(-25vh) scale(1);
+
     -webkit-transform: rotate(4deg) translateY(-25px) scale(1);
−
     transform: rotate(4deg) translateY(-25vh) scale(1);
+
     transform: rotate(4deg) translateY(-25px) scale(1);
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
Line 535: Line 1,552:
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
 +
 
   100% {
 
   100% {
−
     -webkit-transform: rotate(4deg) translateY(-25vh) scale(1);
+
     -webkit-transform: rotate(4deg) translateY(-25px) scale(1);
−
     transform: rotate(4deg) translateY(-25vh) scale(1);
+
     transform: rotate(4deg) translateY(-25px) scale(1);
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
Line 548: Line 1,566:
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
 +
 
   100% {
 
   100% {
−
     -webkit-transform: rotate(-2deg) translateY(-30vh) scale(1);
+
     -webkit-transform: rotate(-2deg) translateY(-30px) scale(1);
−
     transform: rotate(-2deg) translateY(-30vh) scale(1);
+
     transform: rotate(-2deg) translateY(-30px) scale(1);
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
Line 561: Line 1,580:
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
 +
 
   100% {
 
   100% {
−
     -webkit-transform: rotate(-2deg) translateY(-30vh) scale(1);
+
     -webkit-transform: rotate(-2deg) translateY(-30px) scale(1);
−
     transform: rotate(-2deg) translateY(-30vh) scale(1);
+
     transform: rotate(-2deg) translateY(-30px) scale(1);
 
     opacity: 1;
 
     opacity: 1;
 
   }
 
   }
Line 576: Line 1,596:
 
     filter: blur(10px);
 
     filter: blur(10px);
 
   }
 
   }
 +
 
   100% {
 
   100% {
−
     -webkit-transform: rotate(0deg) translateY(-50vh) scale(1);
+
     -webkit-transform: rotate(0deg) translateY(-50px) scale(1);
−
     transform: rotate(0deg) translateY(-50vh) scale(1);
+
     transform: rotate(0deg) translateY(-50px) scale(1);
 
     opacity: 1;
 
     opacity: 1;
 
     -webkit-filter: blur(0);
 
     -webkit-filter: blur(0);
Line 593: Line 1,614:
 
     filter: blur(10px);
 
     filter: blur(10px);
 
   }
 
   }
 +
 
   100% {
 
   100% {
−
     -webkit-transform: rotate(0deg) translateY(-50vh) scale(1);
+
     -webkit-transform: rotate(0deg) translateY(-50px) scale(1);
−
     transform: rotate(0deg) translateY(-50vh) scale(1);
+
     transform: rotate(0deg) translateY(-50px) scale(1);
 
     opacity: 1;
 
     opacity: 1;
 
     -webkit-filter: blur(0);
 
     -webkit-filter: blur(0);
Line 603: Line 1,625:
  
 
/***********************************************************************************************************************************************************/
 
/***********************************************************************************************************************************************************/
−
 
 
/* Sponsorpage */
 
/* Sponsorpage */
−
 
 
.SponsorFlexBox {
 
.SponsorFlexBox {
−
   padding: 50px 0;
+
   padding: 25px 0;
 
   display: -webkit-box;
 
   display: -webkit-box;
 
   display: -ms-flexbox;
 
   display: -ms-flexbox;
Line 639: Line 1,659:
 
.container-text.sponsorPossibility {
 
.container-text.sponsorPossibility {
 
   text-align: center;
 
   text-align: center;
 +
  text-align-last: center;
 
}
 
}
  
−
/***********************************************************************************************************************************************************/
+
div.highlight {
 +
  background: rgba(178, 176, 155, 0.5);
 +
  margin: 25px auto 0;
 +
}
  
 +
/***********************************************************************************************************************************************************/
 
/* Teampage */
 
/* Teampage */
−
 
 
header.white-out {
 
header.white-out {
 
   position: relative;
 
   position: relative;
Line 670: Line 1,694:
 
}
 
}
  
−
div.flexbox {
+
div.TeamFlexbox {
 
   display: -webkit-box;
 
   display: -webkit-box;
 
   display: -ms-flexbox;
 
   display: -ms-flexbox;
Line 741: Line 1,765:
 
h2.MemberName, p.MemberFunction {
 
h2.MemberName, p.MemberFunction {
 
   text-align: center;
 
   text-align: center;
 +
  text-align-last: center;
 
   padding: 0;
 
   padding: 0;
 
   margin: 0;
 
   margin: 0;
Line 751: Line 1,776:
 
.underlined {
 
.underlined {
 
   display: block;
 
   display: block;
−
  width: -webkit-max-content;
 
−
  width: -moz-max-content;
 
−
  width: max-content;
 
 
   margin: auto;
 
   margin: auto;
 +
  padding: 0 20px;
 +
}
 +
 +
.underlined::after {
 +
  content: "";
 +
  display: block;
 +
  margin: 0 auto;
 
   border-bottom: var(--main) solid 5px;
 
   border-bottom: var(--main) solid 5px;
 +
  padding-top: 5px;
 +
  width: 825px;
 
}
 
}
  
 
/* Change colors of each circle/member */
 
/* Change colors of each circle/member */
−
 
 
.TeamMemberBox:nth-child(8n+1) {
 
.TeamMemberBox:nth-child(8n+1) {
 
   color: var(--main);
 
   color: var(--main);
Line 793: Line 1,823:
  
 
/* Change order of text-picture */
 
/* Change order of text-picture */
−
 
 
.TeamMemberBox:nth-child(2n+1) .PicBox {
 
.TeamMemberBox:nth-child(2n+1) .PicBox {
 
   grid-row: 1;
 
   grid-row: 1;
Line 811: Line 1,840:
  
 
/* Change config of icon */
 
/* Change config of icon */
−
 
 
.TeamMemberBox:nth-child(4n+1) div.iconBox {
 
.TeamMemberBox:nth-child(4n+1) div.iconBox {
 
   right: -25px;
 
   right: -25px;
Line 833: Line 1,861:
  
 
/* add some padding to the MemberDescription to align to the bottom/top */
 
/* add some padding to the MemberDescription to align to the bottom/top */
−
 
 
.TeamMemberBox:nth-child(2n+1) .MemberDescription {
 
.TeamMemberBox:nth-child(2n+1) .MemberDescription {
 
   -ms-flex-item-align: start;
 
   -ms-flex-item-align: start;
Line 844: Line 1,871:
 
   align-self: end;
 
   align-self: end;
 
   padding-bottom: 20px;
 
   padding-bottom: 20px;
 +
}
 +
 +
.modal {
 +
  position: fixed;
 +
  width: 100vw;
 +
  height: 100vh;
 +
  left: 0;
 +
  top: 0;
 +
  display: none;
 +
  opacity: 0;
 +
  background: rgb(0, 0, 0);
 +
  background: rgba(0, 0, 0, 0.5);
 +
  z-index: 2000;
 +
  -webkit-transition: all 0.5s;
 +
  transition: all 0.5s;
 +
  color: var(--blackish);
 +
}
 +
 +
span.close {
 +
  position: absolute;
 +
  right: 20px;
 +
  top: 20px;
 +
  font-size: 30px;
 +
  color: #888;
 +
  padding: 0 10px;
 +
}
 +
 +
span.close:hover, span.close:active {
 +
  color: #444;
 +
  cursor: pointer;
 +
}
 +
 +
.modalContent {
 +
  background: var(--whiteish);
 +
  width: 80%;
 +
  max-width: 800px;
 +
  height: 95vh;
 +
  max-height: 711px;
 +
  position: absolute;
 +
  top: 0;
 +
  bottom: 0;
 +
  left: 0;
 +
  right: 0;
 +
  margin: auto;
 +
  overflow: auto;
 +
  padding: 20px;
 +
  text-align: center;
 +
  text-align-last: center;
 +
  border-radius: 20px;
 +
  -webkit-box-shadow: 1px 1px 20px 1px #222;
 +
  box-shadow: 1px 1px 20px 1px #222;
 +
}
 +
 +
.ModalMemberName {
 +
  font-family: Kopje;
 +
  font-size: 1.5rem;
 +
  width: 90%;
 +
  margin: auto;
 +
}
 +
 +
div.separator {
 +
  display: block;
 +
  background: var(--main);
 +
  width: 55%;
 +
  min-width: 200px;
 +
  height: 2px;
 +
  margin: 5px auto 0;
 +
}
 +
 +
.ModalMemberFunction {
 +
  font-size: 1.5rem;
 +
  width: 90%;
 +
  display: block;
 +
  margin: 0 auto 10px;
 +
}
 +
 +
.CasualPic {
 +
  width: 80%;
 +
  max-width: 450px;
 +
  margin: 20px auto;
 +
}
 +
 +
.CasualPic img {
 +
  width: 100%;
 +
  height: auto;
 +
}
 +
 +
.ModalStudy {
 +
  font-family: Kopje;
 +
  font-size: 1.1rem;
 +
}
 +
 +
.ModalDescription {
 +
  width: 82%;
 +
  margin: 10px auto;
 +
}
 +
 +
.ModalFunFact {
 +
  font-style: italic;
 +
  width: 82%;
 +
  margin: auto;
 +
  /* padding-bottom: 10px; */
 +
}
 +
 +
.TeamFlexbox.Members .PicBox, .TeamFlexbox.Members .MemberDescription {
 +
  cursor: pointer;
 
}
 
}
  
 
/***********************************************************************************************************************************************************/
 
/***********************************************************************************************************************************************************/
 +
div.CF {
 +
  margin: 0px auto 50px;
 +
  background: rgba(247, 247, 247, 0.9);
 +
  border-radius: 50px;
 +
  border: 1px solid #cecdc0;
 +
  /* padding-bottom: 0; */
 +
}
  
−
/* Countdown to crowdfunding campaign */
+
#Global div.CF p.crowdfundingtext, div.CF p.crowdfundingtext {
 +
  font-size: 1.4rem;
 +
  padding: 20px 50px 10px;
 +
}
  
−
div.verticalspan {
+
#DonateButton {
−
   min-height: calc(100vh - 64px);
+
   display: block;
 +
  margin: 25px auto 0;
 +
  width: -webkit-max-content;
 +
  width: -moz-max-content;
 +
  width: max-content;
 +
  border: 2px solid var(--main);
 +
  background: rgba(255, 179, 117, 0.4);
 +
  border-radius: 15px;
 +
  padding: 30px 25px;
 +
  text-align: center;
 +
  text-align-last: center;
 +
  font-size: 35px;
 +
  /* margin-top: 150px; */
 
}
 
}
  
−
h1.HelpUs:first-of-type {
+
/* static-dynamic switch */
−
   margin-bottom: 75px;
+
div.StatDynSwitch {
−
   padding-top: 150px;
+
   position: fixed;
 +
  display: block;
 +
  bottom: 30px;
 +
   right: 40px;
 
}
 
}
  
−
.HelpUs {
+
.switch {
−
   padding-left: 40px;
+
   position: relative;
−
   padding-right: 40px;
+
   display: inline-block;
 +
  width: 60px;
 +
  height: 34px;
 +
  margin: -10px 10px;
 
}
 
}
  
−
.countdown {
+
.switch input {
 +
  display: none
 +
}
 +
 
 +
.slider {
 +
  position: absolute;
 +
  cursor: pointer;
 +
  top: 0;
 +
  left: 0;
 +
  right: 0;
 +
  bottom: 0;
 +
  background-color: var(--accent2);
 +
  -webkit-transition: .4s;
 +
  transition: .4s;
 +
  -webkit-box-shadow: 0px 0px 5px #f7f7f7;
 +
  box-shadow: 0px 0px 5px #f7f7f7;
 +
}
 +
 
 +
.slider:before {
 +
  position: absolute;
 +
  content: "";
 +
  height: 26px;
 +
  width: 26px;
 +
  left: 4px;
 +
  bottom: 4px;
 +
  background-color: #f7f7f7;
 +
  -webkit-transition: .4s;
 +
  transition: .4s;
 +
}
 +
 
 +
input:checked+.slider {
 +
  background-color: var(--accent3);
 +
}
 +
 
 +
input:checked+.slider:before {
 +
  -webkit-transform: translateX(26px);
 +
  transform: translateX(26px);
 +
}
 +
 
 +
.slider {
 +
  border-radius: 34px;
 +
}
 +
 
 +
.slider:before {
 +
  border-radius: 50%;
 +
}
 +
 
 +
.StatDynSwitch>span {
 +
  display: inline-block;
 +
  font-size: 20px;
 +
  text-shadow: 0px 0px 5px #f7f7f7;
 +
}
 +
 
 +
/***********************************************************************************************************************************************************/
 +
/* InterLab */
 +
ul#DeviceList li {
 +
  display: list-item;
 +
  list-style-type: disc;
 +
  list-style-position: inside;
 +
}
 +
 
 +
div.InterLabFigureBox {
 +
  width: 80%;
 +
  max-width: 600px;
 +
  padding: 10px 0 25px;
 +
  margin: auto;
 +
}
 +
 
 +
img.InterLabFigure {
 +
  width: 100%;
 +
  display: block;
 +
  margin: auto;
 +
}
 +
 
 +
/***********************************************************************************************************************************************************/
 +
/* Featured */
 +
.FeaturedFlexbox {
 
   display: -webkit-box;
 
   display: -webkit-box;
 
   display: -ms-flexbox;
 
   display: -ms-flexbox;
 
   display: flex;
 
   display: flex;
−
   -webkit-box-pack: center;
+
  -webkit-box-orient: horizontal;
−
   -ms-flex-pack: center;
+
  -webkit-box-direction: normal;
−
   justify-content: center;
+
  -ms-flex-flow: row wrap;
 +
  flex-flow: row wrap;
 +
   -webkit-box-pack: space-evenly;
 +
   -ms-flex-pack: space-evenly;
 +
   justify-content: space-evenly;
 
   -webkit-box-align: center;
 
   -webkit-box-align: center;
 
   -ms-flex-align: center;
 
   -ms-flex-align: center;
 
   align-items: center;
 
   align-items: center;
−
   font-size: 50px;
+
   -ms-flex-line-pack: center;
 +
  align-content: center;
 
}
 
}
  
−
.countdown div {
+
div.featuredBox {
−
   padding: 10px 20px;
+
   display: -webkit-box;
−
   margin: 20px 10px 0;
+
   display: -ms-flexbox;
−
   border-radius: 15px;
+
   display: flex;
−
   border: 2px solid var(--accent4);
+
  -webkit-box-orient: vertical;
−
   background: rgba(178, 176, 117, 0.2);
+
   -webkit-box-direction: normal;
 +
  -ms-flex-direction: column;
 +
   flex-direction: column;
 +
  min-height: 0;
 +
  margin: 50px 20px;
 +
  min-width: 450px;
 +
  width: 45%;
 +
  max-width: 800px;
 +
  height: 90vh;
 
}
 
}
  
−
.countdown div:first-of-type {
+
.Feature {
 +
  display: -webkit-box;
 +
  display: -ms-flexbox;
 +
  display: flex;
 +
  -webkit-box-orient: horizontal;
 +
  -webkit-box-direction: normal;
 +
  -ms-flex-direction: row;
 +
  flex-direction: row;
 +
  /* firefox correction */
 +
  min-width: 0;
 +
  -webkit-box-align: center;
 +
  -ms-flex-align: center;
 +
  align-items: center;
 +
  min-height: -webkit-max-content;
 +
  min-height: -moz-max-content;
 +
  min-height: max-content;
 +
}
 +
 
 +
.Feature h3 {
 +
  min-width: -webkit-max-content;
 +
  min-width: -moz-max-content;
 +
  min-width: max-content;
 +
  padding: 0px 20px;
 +
}
 +
 
 +
.Feature h2 {
 +
  padding: 0 20px;
 +
  margin-left: auto;
 +
  width: -webkit-max-content;
 +
  width: -moz-max-content;
 +
  width: max-content;
 +
}
 +
 
 +
div.ScrollBox {
 +
  margin-top: 10px;
 +
  display: inline-block;
 +
  -webkit-box-flex: 1;
 +
  -ms-flex-positive: 1;
 +
  flex-grow: 1;
 +
  max-height: -webkit-max-content;
 +
  max-height: -moz-max-content;
 +
  max-height: max-content;
 
   border: 2px solid var(--main);
 
   border: 2px solid var(--main);
−
   background: rgba(255, 179, 117, 0.4);
+
   overflow-y: scroll;
 +
  width: 100%;
 
}
 
}
  
−
.countdown span {
+
div.ScrollBox a img {
 +
  width: 100%;
 +
  margin-top: auto;
 +
}
 +
 
 +
div.ScrollBox a {
 
   display: block;
 
   display: block;
−
  font-size: 30px;
 
 
}
 
}
  
−
.SYTS {
+
/***********************************************************************************************************************************************************/
−
   padding-bottom: 50px;
+
/* Newsletter */
 +
/* correction */
 +
.collapsibleContent div {
 +
   line-height: 150%;
 
}
 
}
  
−
#DonateButton {
+
table {
−
   display: none;
+
   background: none;
−
   margin: auto;
+
}
−
   width: max-content;
+
 
−
   border: 2px solid var(--main);
+
/* other styling for Newsletter */
−
   background: rgba(255, 179, 117, 0.4);
+
.popout {
−
   border-radius: 15px;
+
   display: block;
−
   padding: 50px;
+
   width: 80%;
 +
  max-width: 900px;
 +
   margin: 15px auto;
 +
  position: relative;
 +
  z-index: 10;
 +
  -webkit-transition: all 0s;
 +
   transition: all 0s;
 +
}
 +
 
 +
.popout:last-of-type, .popout.protocols:last-of-type, .popout.chapter:last-of-type {
 +
  margin-bottom: 75px;
 +
}
 +
 
 +
.popout.revealed {
 +
   background: #fdfdfd;
 +
  margin: 30px auto;
 +
  -webkit-box-shadow: 2px 2px 15px 0px gray;
 +
  box-shadow: 2px 2px 15px 0px gray;
 +
   padding-bottom: 20px;
 +
  -webkit-transition: all 0.7s;
 +
  transition: all 0.7s;
 +
}
 +
 
 +
.popout.revealed .collapsibleContent {
 +
  padding: 20px 75px 0px;
 +
  opacity: 1;
 +
}
 +
 
 +
.collapsible {
 +
  display: block;
 
   text-align: center;
 
   text-align: center;
 +
  text-align-last: center;
 +
  font-family: Body;
 
   font-size: 50px;
 
   font-size: 50px;
−
   margin-top: 150px;
+
   padding: 17px 50px;
 +
  width: 100%;
 +
  position: relative;
 +
  z-index: 15;
 +
  color: rgb(235, 235, 235);
 
}
 
}
  
−
.bubbles {
+
.collapsible::before {
 
   position: absolute;
 
   position: absolute;
−
   width: 100%;
+
   content: '';
−
  height: calc(100vh - 10px);
+
 
   top: 0;
 
   top: 0;
−
   z-index: -1;
+
  left: 0;
 +
  height: 100%;
 +
  width: 10px;
 +
  background: var(--accent2);
 +
  -webkit-transition: all 0.2s ease-in-out;
 +
  transition: all 0.2s ease-in-out;
 +
   z-index: 11;
 
}
 
}
  
−
div.bubbles span.circle {
+
.collapsible::after {
 
   position: absolute;
 
   position: absolute;
 +
  content: '';
 +
  top: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: 100%;
 +
  background: var(--accent1);
 +
  height: 100%;
 
   z-index: -1;
 
   z-index: -1;
−
  top: auto;
 
 
}
 
}
  
−
div.bubbles span.circle.large {
+
.collapsible:hover {
−
   -webkit-animation: bubbly 10s infinite linear;
+
   cursor: pointer;
−
  animation: bubbly 10s infinite linear;
+
−
  bottom: -150px;
+
 
}
 
}
  
−
div.bubbles span.circle.normal {
+
.collapsible:hover::before {
−
  -webkit-animation: bubbly 7s infinite linear;
+
   width: 50px;
−
  animation: bubbly 7s infinite linear;
+
−
   bottom: -100px;
+
 
}
 
}
  
−
div.bubbles span.circle.small {
+
.collapsibleContent {
−
   -webkit-animation: bubbly 4s infinite linear;
+
   position: relative;
−
   animation: bubbly 4s infinite linear;
+
  max-height: 0;
−
   bottom: -50px;
+
  overflow-y: hidden;
 +
   margin: auto;
 +
   padding: 0px 75px 0;
 +
  -webkit-transition: all 0s;
 +
  transition: all 0s;
 +
  opacity: 0;
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(1) {
+
.collapsibleContent.revealed {
−
  right: 150px;
+
   -webkit-transition: all 0.7s;
−
   -webkit-animation-delay: 8s;
+
   transition: all 0.7s;
−
   animation-delay: 8s;
+
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(2) {
+
/***********************************************************************************************************************************************************/
−
   -webkit-animation-delay: 7s;
+
/* Attributions */
−
   animation-delay: 7s;
+
li.description {
 +
   margin-bottom: 15px;
 +
  font-style: italic;
 +
  padding-left: 12px;
 +
   /* font-size: 0.95rem; */
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(3) {
+
h2.SubSectionTitle {
−
   -webkit-animation-delay: 5s;
+
   margin-top: 10px;
−
  animation-delay: 5s;
+
−
  right: 220px;
+
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(4) {
+
ul.bullet li {
−
   -webkit-animation-delay: 2s;
+
   list-style-type: disc;
−
   animation-delay: 2s;
+
   display: list-item;
 +
  list-style-position: inside;
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(5) {
+
ul.bullet li.description {
−
   -webkit-animation-delay: 4s;
+
   padding-left: 37px;
−
   animation-delay: 4s;
+
   list-style-type: none;
−
  right: 320px;
+
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(6) {
+
ul.bullet li ul {
−
   -webkit-animation-delay: 12s;
+
   -webkit-padding-start: 40px;
−
   animation-delay: 12s;
+
   padding-inline-start: 40px;
−
  left: 180px;
+
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(7) {
+
ul.dashed li {
−
   -webkit-animation-delay: 4s;
+
  list-style-type: none;
−
   animation-delay: 4s;
+
   display: list-item;
−
   right: 250px;
+
  list-style-position: inside;
 +
   padding-bottom: 10px;
 +
   padding-left: 25px;
 +
  text-indent: -25px;
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(8) {
+
ul.dashed li::before {
−
   -webkit-animation-delay: 6s;
+
   content: '-';
−
   animation-delay: 6s;
+
   margin-right: 20px
−
  left: 345px;
+
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(9) {
+
.popout p, .projectDescription p, #Global .popout p, #Global .projectDescription p {
−
   -webkit-animation-delay: 1s;
+
   padding: 10px 0;
−
  animation-delay: 1s;
+
 
}
 
}
  
−
div.bubbles span.circle:nth-of-type(10) {
+
/* .popout ul {
−
   -webkit-animation-delay: 3s;
+
  padding-bottom: 20px;
−
   animation-delay: 3s;
+
} */
 +
/***********************************************************************************************************************************************************/
 +
/* Protocols */
 +
.popout.protocols {
 +
  margin: 5px auto;
 +
   -webkit-transition: all 0.4s;
 +
   transition: all 0.4s;
 
}
 
}
  
−
@-webkit-keyframes bubbly {
+
.popout.protocols.revealed {
−
  0% {
+
   max-width: 930px;
−
    -webkit-transform: translate(0%, 0vh) scale(1);
+
   margin: 15px auto;
−
    transform: translate(0%, 0vh) scale(1);
+
−
  }
+
−
  0.29% {
+
−
    -webkit-transform: translate(-3.9265%, -0.3667vh) scale(0.9992);
+
−
    transform: translate(-3.9265%, -0.3667vh) scale(0.9992);
+
−
  }
+
−
  0.58% {
+
−
    -webkit-transform: translate(-7.8504%, -0.7333vh) scale(0.9983);
+
−
    transform: translate(-7.8504%, -0.7333vh) scale(0.9983);
+
−
   }
+
−
  0.88% {
+
−
    -webkit-transform: translate(-11.7689%, -1.1vh) scale(0.9975);
+
−
    transform: translate(-11.7689%, -1.1vh) scale(0.9975);
+
−
   }
+
−
  1.17% {
+
−
    -webkit-transform: translate(-15.6793%, -1.4667vh) scale(0.9967);
+
−
    transform: translate(-15.6793%, -1.4667vh) scale(0.9967);
+
−
  }
+
−
  1.46% {
+
−
    -webkit-transform: translate(-19.5789%, -1.8333vh) scale(0.9958);
+
−
    transform: translate(-19.5789%, -1.8333vh) scale(0.9958);
+
−
  }
+
−
  1.75% {
+
−
    -webkit-transform: translate(-23.4652%, -2.2vh) scale(0.995);
+
−
    transform: translate(-23.4652%, -2.2vh) scale(0.995);
+
−
  }
+
−
  2.05% {
+
−
    -webkit-transform: translate(-27.3353%, -2.5667vh) scale(0.9942);
+
−
    transform: translate(-27.3353%, -2.5667vh) scale(0.9942);
+
−
  }
+
−
  2.34% {
+
−
    -webkit-transform: translate(-31.1868%, -2.9333vh) scale(0.9933);
+
−
    transform: translate(-31.1868%, -2.9333vh) scale(0.9933);
+
−
  }
+
−
  2.63% {
+
−
    -webkit-transform: translate(-35.0168%, -3.3vh) scale(0.9925);
+
−
    transform: translate(-35.0168%, -3.3vh) scale(0.9925);
+
−
  }
+
−
  2.92% {
+
−
    -webkit-transform: translate(-38.8229%, -3.6667vh) scale(0.9917);
+
−
    transform: translate(-38.8229%, -3.6667vh) scale(0.9917);
+
−
  }
+
−
  3.22% {
+
−
    -webkit-transform: translate(-42.6023%, -4.0333vh) scale(0.9908);
+
−
    transform: translate(-42.6023%, -4.0333vh) scale(0.9908);
+
−
  }
+
−
  3.51% {
+
−
    -webkit-transform: translate(-46.3525%, -4.4vh) scale(0.99);
+
−
    transform: translate(-46.3525%, -4.4vh) scale(0.99);
+
−
  }
+
−
  3.8% {
+
−
    -webkit-transform: translate(-50.071%, -4.7667vh) scale(0.9892);
+
−
    transform: translate(-50.071%, -4.7667vh) scale(0.9892);
+
−
  }
+
−
  4.09% {
+
−
    -webkit-transform: translate(-53.7552%, -5.1333vh) scale(0.9883);
+
−
    transform: translate(-53.7552%, -5.1333vh) scale(0.9883);
+
−
  }
+
−
  4.39% {
+
−
    -webkit-transform: translate(-57.4025%, -5.5vh) scale(0.9875);
+
−
    transform: translate(-57.4025%, -5.5vh) scale(0.9875);
+
−
  }
+
−
  4.68% {
+
−
    -webkit-transform: translate(-61.0105%, -5.8667vh) scale(0.9867);
+
−
    transform: translate(-61.0105%, -5.8667vh) scale(0.9867);
+
−
  }
+
−
  4.97% {
+
−
    -webkit-transform: translate(-64.5767%, -6.2333vh) scale(0.9858);
+
−
    transform: translate(-64.5767%, -6.2333vh) scale(0.9858);
+
−
  }
+
−
  5.26% {
+
−
    -webkit-transform: translate(-68.0986%, -6.6vh) scale(0.985);
+
−
    transform: translate(-68.0986%, -6.6vh) scale(0.985);
+
−
  }
+
−
  5.56% {
+
−
    -webkit-transform: translate(-71.5738%, -6.9667vh) scale(0.9842);
+
−
    transform: translate(-71.5738%, -6.9667vh) scale(0.9842);
+
−
  }
+
−
  5.85% {
+
−
    -webkit-transform: translate(-75%, -7.3333vh) scale(0.9833);
+
−
    transform: translate(-75%, -7.3333vh) scale(0.9833);
+
−
  }
+
−
  6.14% {
+
−
    -webkit-transform: translate(-78.3748%, -7.7vh) scale(0.9825);
+
−
    transform: translate(-78.3748%, -7.7vh) scale(0.9825);
+
−
  }
+
−
  6.43% {
+
−
    -webkit-transform: translate(-81.6959%, -8.0667vh) scale(0.9817);
+
−
    transform: translate(-81.6959%, -8.0667vh) scale(0.9817);
+
−
  }
+
−
  6.73% {
+
−
    -webkit-transform: translate(-84.9609%, -8.4333vh) scale(0.9808);
+
−
    transform: translate(-84.9609%, -8.4333vh) scale(0.9808);
+
−
  }
+
−
  7.02% {
+
−
    -webkit-transform: translate(-88.1678%, -8.8vh) scale(0.98);
+
−
    transform: translate(-88.1678%, -8.8vh) scale(0.98);
+
−
  }
+
−
  7.31% {
+
−
    -webkit-transform: translate(-91.3142%, -9.1667vh) scale(0.9792);
+
−
    transform: translate(-91.3142%, -9.1667vh) scale(0.9792);
+
−
  }
+
−
  7.6% {
+
−
    -webkit-transform: translate(-94.3981%, -9.5333vh) scale(0.9783);
+
−
    transform: translate(-94.3981%, -9.5333vh) scale(0.9783);
+
−
  }
+
−
  7.89% {
+
−
    -webkit-transform: translate(-97.4172%, -9.9vh) scale(0.9775);
+
−
    transform: translate(-97.4172%, -9.9vh) scale(0.9775);
+
−
  }
+
−
  8.19% {
+
−
    -webkit-transform: translate(-100.3696%, -10.2667vh) scale(0.9767);
+
−
    transform: translate(-100.3696%, -10.2667vh) scale(0.9767);
+
−
  }
+
−
  8.48% {
+
−
    -webkit-transform: translate(-103.2532%, -10.6333vh) scale(0.9758);
+
−
    transform: translate(-103.2532%, -10.6333vh) scale(0.9758);
+
−
  }
+
−
  8.77% {
+
−
    -webkit-transform: translate(-106.066%, -11vh) scale(0.975);
+
−
    transform: translate(-106.066%, -11vh) scale(0.975);
+
−
  }
+
−
  9.06% {
+
−
    -webkit-transform: translate(-108.8062%, -11.3667vh) scale(0.9742);
+
−
    transform: translate(-108.8062%, -11.3667vh) scale(0.9742);
+
−
  }
+
−
  9.36% {
+
−
    -webkit-transform: translate(-111.4717%, -11.7333vh) scale(0.9733);
+
−
    transform: translate(-111.4717%, -11.7333vh) scale(0.9733);
+
−
  }
+
−
  9.65% {
+
−
    -webkit-transform: translate(-114.0609%, -12.1vh) scale(0.9725);
+
−
    transform: translate(-114.0609%, -12.1vh) scale(0.9725);
+
−
  }
+
−
  9.94% {
+
−
    -webkit-transform: translate(-116.5719%, -12.4667vh) scale(0.9717);
+
−
    transform: translate(-116.5719%, -12.4667vh) scale(0.9717);
+
−
  }
+
−
  10.23% {
+
−
    -webkit-transform: translate(-119.003%, -12.8333vh) scale(0.9708);
+
−
    transform: translate(-119.003%, -12.8333vh) scale(0.9708);
+
−
  }
+
−
  10.53% {
+
−
    -webkit-transform: translate(-121.3525%, -13.2vh) scale(0.97);
+
−
    transform: translate(-121.3525%, -13.2vh) scale(0.97);
+
−
  }
+
−
  10.82% {
+
−
    -webkit-transform: translate(-123.6189%, -13.5667vh) scale(0.9692);
+
−
    transform: translate(-123.6189%, -13.5667vh) scale(0.9692);
+
−
  }
+
−
  11.11% {
+
−
    -webkit-transform: translate(-125.8006%, -13.9333vh) scale(0.9683);
+
−
    transform: translate(-125.8006%, -13.9333vh) scale(0.9683);
+
−
  }
+
−
  11.4% {
+
−
    -webkit-transform: translate(-127.896%, -14.3vh) scale(0.9675);
+
−
    transform: translate(-127.896%, -14.3vh) scale(0.9675);
+
−
  }
+
−
  11.7% {
+
−
    -webkit-transform: translate(-129.9038%, -14.6667vh) scale(0.9667);
+
−
    transform: translate(-129.9038%, -14.6667vh) scale(0.9667);
+
−
  }
+
−
  11.99% {
+
−
    -webkit-transform: translate(-131.8226%, -15.0333vh) scale(0.9658);
+
−
    transform: translate(-131.8226%, -15.0333vh) scale(0.9658);
+
−
  }
+
−
  12.28% {
+
−
    -webkit-transform: translate(-133.651%, -15.4vh) scale(0.965);
+
−
    transform: translate(-133.651%, -15.4vh) scale(0.965);
+
−
  }
+
−
  12.57% {
+
−
    -webkit-transform: translate(-135.3878%, -15.7667vh) scale(0.9642);
+
−
    transform: translate(-135.3878%, -15.7667vh) scale(0.9642);
+
−
  }
+
−
  12.87% {
+
−
    -webkit-transform: translate(-137.0318%, -16.1333vh) scale(0.9633);
+
−
    transform: translate(-137.0318%, -16.1333vh) scale(0.9633);
+
−
  }
+
−
  13.16% {
+
−
    -webkit-transform: translate(-138.5819%, -16.5vh) scale(0.9625);
+
−
    transform: translate(-138.5819%, -16.5vh) scale(0.9625);
+
−
  }
+
−
  13.45% {
+
−
    -webkit-transform: translate(-140.0371%, -16.8667vh) scale(0.9617);
+
−
    transform: translate(-140.0371%, -16.8667vh) scale(0.9617);
+
−
  }
+
−
  13.74% {
+
−
    -webkit-transform: translate(-141.3962%, -17.2333vh) scale(0.9608);
+
−
    transform: translate(-141.3962%, -17.2333vh) scale(0.9608);
+
−
  }
+
−
  14.04% {
+
−
    -webkit-transform: translate(-142.6585%, -17.6vh) scale(0.96);
+
−
    transform: translate(-142.6585%, -17.6vh) scale(0.96);
+
−
  }
+
−
  14.33% {
+
−
    -webkit-transform: translate(-143.823%, -17.9667vh) scale(0.9592);
+
−
    transform: translate(-143.823%, -17.9667vh) scale(0.9592);
+
−
  }
+
−
  14.62% {
+
−
    -webkit-transform: translate(-144.8889%, -18.3333vh) scale(0.9583);
+
−
    transform: translate(-144.8889%, -18.3333vh) scale(0.9583);
+
−
  }
+
−
  14.91% {
+
−
    -webkit-transform: translate(-145.8555%, -18.7vh) scale(0.9575);
+
−
    transform: translate(-145.8555%, -18.7vh) scale(0.9575);
+
−
  }
+
−
  15.2% {
+
−
    -webkit-transform: translate(-146.7221%, -19.0667vh) scale(0.9567);
+
−
    transform: translate(-146.7221%, -19.0667vh) scale(0.9567);
+
−
  }
+
−
  15.5% {
+
−
    -webkit-transform: translate(-147.4882%, -19.4333vh) scale(0.9558);
+
−
    transform: translate(-147.4882%, -19.4333vh) scale(0.9558);
+
−
  }
+
−
  15.79% {
+
−
    -webkit-transform: translate(-148.1533%, -19.8vh) scale(0.955);
+
−
    transform: translate(-148.1533%, -19.8vh) scale(0.955);
+
−
  }
+
−
  16.08% {
+
−
    -webkit-transform: translate(-148.7167%, -20.1667vh) scale(0.9542);
+
−
    transform: translate(-148.7167%, -20.1667vh) scale(0.9542);
+
−
  }
+
−
  16.37% {
+
−
    -webkit-transform: translate(-149.1783%, -20.5333vh) scale(0.9533);
+
−
    transform: translate(-149.1783%, -20.5333vh) scale(0.9533);
+
−
  }
+
−
  16.67% {
+
−
    -webkit-transform: translate(-149.5376%, -20.9vh) scale(0.9525);
+
−
    transform: translate(-149.5376%, -20.9vh) scale(0.9525);
+
−
  }
+
−
  16.96% {
+
−
    -webkit-transform: translate(-149.7944%, -21.2667vh) scale(0.9517);
+
−
    transform: translate(-149.7944%, -21.2667vh) scale(0.9517);
+
−
  }
+
−
  17.25% {
+
−
    -webkit-transform: translate(-149.9486%, -21.6333vh) scale(0.9508);
+
−
    transform: translate(-149.9486%, -21.6333vh) scale(0.9508);
+
−
  }
+
−
  17.54% {
+
−
    -webkit-transform: translate(-150%, -22vh) scale(0.95);
+
−
    transform: translate(-150%, -22vh) scale(0.95);
+
−
  }
+
−
  17.84% {
+
−
    -webkit-transform: translate(-149.9525%, -22.3772vh) scale(0.9491);
+
−
    transform: translate(-149.9525%, -22.3772vh) scale(0.9491);
+
−
  }
+
−
  18.13% {
+
−
    -webkit-transform: translate(-149.8102%, -22.7544vh) scale(0.9482);
+
−
    transform: translate(-149.8102%, -22.7544vh) scale(0.9482);
+
−
  }
+
−
  18.42% {
+
−
    -webkit-transform: translate(-149.5731%, -23.1316vh) scale(0.9474);
+
−
    transform: translate(-149.5731%, -23.1316vh) scale(0.9474);
+
−
  }
+
−
  18.71% {
+
−
    -webkit-transform: translate(-149.2413%, -23.5088vh) scale(0.9465);
+
−
    transform: translate(-149.2413%, -23.5088vh) scale(0.9465);
+
−
  }
+
−
  19.01% {
+
−
    -webkit-transform: translate(-148.8153%, -23.886vh) scale(0.9456);
+
−
    transform: translate(-148.8153%, -23.886vh) scale(0.9456);
+
−
  }
+
−
  19.3% {
+
−
    -webkit-transform: translate(-148.2952%, -24.2632vh) scale(0.9447);
+
−
    transform: translate(-148.2952%, -24.2632vh) scale(0.9447);
+
−
  }
+
−
  19.59% {
+
−
    -webkit-transform: translate(-147.6814%, -24.6404vh) scale(0.9439);
+
−
    transform: translate(-147.6814%, -24.6404vh) scale(0.9439);
+
−
  }
+
−
  19.88% {
+
−
    -webkit-transform: translate(-146.9745%, -25.0175vh) scale(0.943);
+
−
    transform: translate(-146.9745%, -25.0175vh) scale(0.943);
+
−
  }
+
−
  20.18% {
+
−
    -webkit-transform: translate(-146.175%, -25.3947vh) scale(0.9421);
+
−
    transform: translate(-146.175%, -25.3947vh) scale(0.9421);
+
−
  }
+
−
  20.47% {
+
−
    -webkit-transform: translate(-145.2835%, -25.7719vh) scale(0.9412);
+
−
    transform: translate(-145.2835%, -25.7719vh) scale(0.9412);
+
−
  }
+
−
  20.76% {
+
−
    -webkit-transform: translate(-144.3006%, -26.1491vh) scale(0.9404);
+
−
    transform: translate(-144.3006%, -26.1491vh) scale(0.9404);
+
−
  }
+
−
  21.05% {
+
−
    -webkit-transform: translate(-143.2272%, -26.5263vh) scale(0.9395);
+
−
    transform: translate(-143.2272%, -26.5263vh) scale(0.9395);
+
−
  }
+
−
  21.35% {
+
−
    -webkit-transform: translate(-142.0639%, -26.9035vh) scale(0.9386);
+
−
    transform: translate(-142.0639%, -26.9035vh) scale(0.9386);
+
−
  }
+
−
  21.64% {
+
−
    -webkit-transform: translate(-140.8118%, -27.2807vh) scale(0.9377);
+
−
    transform: translate(-140.8118%, -27.2807vh) scale(0.9377);
+
−
  }
+
−
  21.93% {
+
−
    -webkit-transform: translate(-139.4717%, -27.6579vh) scale(0.9368);
+
−
    transform: translate(-139.4717%, -27.6579vh) scale(0.9368);
+
−
  }
+
−
  22.22% {
+
−
    -webkit-transform: translate(-138.0446%, -28.0351vh) scale(0.936);
+
−
    transform: translate(-138.0446%, -28.0351vh) scale(0.936);
+
−
  }
+
−
  22.51% {
+
−
    -webkit-transform: translate(-136.5318%, -28.4123vh) scale(0.9351);
+
−
    transform: translate(-136.5318%, -28.4123vh) scale(0.9351);
+
−
  }
+
−
  22.81% {
+
−
    -webkit-transform: translate(-134.9342%, -28.7895vh) scale(0.9342);
+
−
    transform: translate(-134.9342%, -28.7895vh) scale(0.9342);
+
−
  }
+
−
  23.1% {
+
−
    -webkit-transform: translate(-133.2532%, -29.1667vh) scale(0.9333);
+
−
    transform: translate(-133.2532%, -29.1667vh) scale(0.9333);
+
−
  }
+
−
  23.39% {
+
−
    -webkit-transform: translate(-131.4899%, -29.5439vh) scale(0.9325);
+
−
    transform: translate(-131.4899%, -29.5439vh) scale(0.9325);
+
−
  }
+
−
  23.68% {
+
−
    -webkit-transform: translate(-129.6458%, -29.9211vh) scale(0.9316);
+
−
    transform: translate(-129.6458%, -29.9211vh) scale(0.9316);
+
−
  }
+
−
  23.98% {
+
−
    -webkit-transform: translate(-127.7222%, -30.2982vh) scale(0.9307);
+
−
    transform: translate(-127.7222%, -30.2982vh) scale(0.9307);
+
−
  }
+
−
  24.27% {
+
−
    -webkit-transform: translate(-125.7206%, -30.6754vh) scale(0.9298);
+
−
    transform: translate(-125.7206%, -30.6754vh) scale(0.9298);
+
−
  }
+
−
  24.56% {
+
−
    -webkit-transform: translate(-123.6426%, -31.0526vh) scale(0.9289);
+
−
    transform: translate(-123.6426%, -31.0526vh) scale(0.9289);
+
−
  }
+
−
  24.85% {
+
−
    -webkit-transform: translate(-121.4896%, -31.4298vh) scale(0.9281);
+
−
    transform: translate(-121.4896%, -31.4298vh) scale(0.9281);
+
−
  }
+
−
  25.15% {
+
−
    -webkit-transform: translate(-119.2633%, -31.807vh) scale(0.9272);
+
−
    transform: translate(-119.2633%, -31.807vh) scale(0.9272);
+
−
  }
+
−
  25.44% {
+
−
    -webkit-transform: translate(-116.9655%, -32.1842vh) scale(0.9263);
+
−
    transform: translate(-116.9655%, -32.1842vh) scale(0.9263);
+
−
  }
+
−
  25.73% {
+
−
    -webkit-transform: translate(-114.5978%, -32.5614vh) scale(0.9254);
+
−
    transform: translate(-114.5978%, -32.5614vh) scale(0.9254);
+
−
  }
+
−
  26.02% {
+
−
    -webkit-transform: translate(-112.1621%, -32.9386vh) scale(0.9246);
+
−
    transform: translate(-112.1621%, -32.9386vh) scale(0.9246);
+
−
  }
+
−
  26.32% {
+
−
    -webkit-transform: translate(-109.6602%, -33.3158vh) scale(0.9237);
+
−
    transform: translate(-109.6602%, -33.3158vh) scale(0.9237);
+
−
  }
+
−
  26.61% {
+
−
    -webkit-transform: translate(-107.094%, -33.693vh) scale(0.9228);
+
−
    transform: translate(-107.094%, -33.693vh) scale(0.9228);
+
−
  }
+
−
  26.9% {
+
−
    -webkit-transform: translate(-104.4655%, -34.0702vh) scale(0.9219);
+
−
    transform: translate(-104.4655%, -34.0702vh) scale(0.9219);
+
−
  }
+
−
  27.19% {
+
−
    -webkit-transform: translate(-101.7766%, -34.4474vh) scale(0.9211);
+
−
    transform: translate(-101.7766%, -34.4474vh) scale(0.9211);
+
−
  }
+
−
  27.49% {
+
−
    -webkit-transform: translate(-99.0294%, -34.8246vh) scale(0.9202);
+
−
    transform: translate(-99.0294%, -34.8246vh) scale(0.9202);
+
−
  }
+
−
  27.78% {
+
−
    -webkit-transform: translate(-96.226%, -35.2018vh) scale(0.9193);
+
−
    transform: translate(-96.226%, -35.2018vh) scale(0.9193);
+
−
  }
+
−
  28.07% {
+
−
    -webkit-transform: translate(-93.3685%, -35.5789vh) scale(0.9184);
+
−
    transform: translate(-93.3685%, -35.5789vh) scale(0.9184);
+
−
  }
+
−
  28.36% {
+
−
    -webkit-transform: translate(-90.4591%, -35.9561vh) scale(0.9175);
+
−
    transform: translate(-90.4591%, -35.9561vh) scale(0.9175);
+
−
  }
+
−
  28.65% {
+
−
    -webkit-transform: translate(-87.5%, -36.3333vh) scale(0.9167);
+
−
    transform: translate(-87.5%, -36.3333vh) scale(0.9167);
+
−
  }
+
−
  28.95% {
+
−
    -webkit-transform: translate(-84.4934%, -36.7105vh) scale(0.9158);
+
−
    transform: translate(-84.4934%, -36.7105vh) scale(0.9158);
+
−
  }
+
−
  29.24% {
+
−
    -webkit-transform: translate(-81.4417%, -37.0877vh) scale(0.9149);
+
−
    transform: translate(-81.4417%, -37.0877vh) scale(0.9149);
+
−
  }
+
−
  29.53% {
+
−
    -webkit-transform: translate(-78.3471%, -37.4649vh) scale(0.914);
+
−
    transform: translate(-78.3471%, -37.4649vh) scale(0.914);
+
−
  }
+
−
  29.82% {
+
−
    -webkit-transform: translate(-75.2119%, -37.8421vh) scale(0.9132);
+
−
    transform: translate(-75.2119%, -37.8421vh) scale(0.9132);
+
−
  }
+
−
  30.12% {
+
−
    -webkit-transform: translate(-72.0387%, -38.2193vh) scale(0.9123);
+
−
    transform: translate(-72.0387%, -38.2193vh) scale(0.9123);
+
−
  }
+
−
  30.41% {
+
−
    -webkit-transform: translate(-68.8297%, -38.5965vh) scale(0.9114);
+
−
    transform: translate(-68.8297%, -38.5965vh) scale(0.9114);
+
−
  }
+
−
  30.7% {
+
−
    -webkit-transform: translate(-65.5874%, -38.9737vh) scale(0.9105);
+
−
    transform: translate(-65.5874%, -38.9737vh) scale(0.9105);
+
−
  }
+
−
  30.99% {
+
−
    -webkit-transform: translate(-62.3144%, -39.3509vh) scale(0.9096);
+
−
    transform: translate(-62.3144%, -39.3509vh) scale(0.9096);
+
−
  }
+
−
  31.29% {
+
−
    -webkit-transform: translate(-59.0129%, -39.7281vh) scale(0.9088);
+
−
    transform: translate(-59.0129%, -39.7281vh) scale(0.9088);
+
−
  }
+
−
  31.58% {
+
−
    -webkit-transform: translate(-55.6857%, -40.1053vh) scale(0.9079);
+
−
    transform: translate(-55.6857%, -40.1053vh) scale(0.9079);
+
−
  }
+
−
  31.87% {
+
−
    -webkit-transform: translate(-52.3351%, -40.4825vh) scale(0.907);
+
−
    transform: translate(-52.3351%, -40.4825vh) scale(0.907);
+
−
  }
+
−
  32.16% {
+
−
    -webkit-transform: translate(-48.9638%, -40.8596vh) scale(0.9061);
+
−
    transform: translate(-48.9638%, -40.8596vh) scale(0.9061);
+
−
  }
+
−
  32.46% {
+
−
    -webkit-transform: translate(-45.5743%, -41.2368vh) scale(0.9053);
+
−
    transform: translate(-45.5743%, -41.2368vh) scale(0.9053);
+
−
  }
+
−
  32.75% {
+
−
    -webkit-transform: translate(-42.1692%, -41.614vh) scale(0.9044);
+
−
    transform: translate(-42.1692%, -41.614vh) scale(0.9044);
+
−
  }
+
−
  33.04% {
+
−
    -webkit-transform: translate(-38.751%, -41.9912vh) scale(0.9035);
+
−
    transform: translate(-38.751%, -41.9912vh) scale(0.9035);
+
−
  }
+
−
  33.33% {
+
−
    -webkit-transform: translate(-35.3224%, -42.3684vh) scale(0.9026);
+
−
    transform: translate(-35.3224%, -42.3684vh) scale(0.9026);
+
−
  }
+
−
  33.63% {
+
−
    -webkit-transform: translate(-31.886%, -42.7456vh) scale(0.9018);
+
−
    transform: translate(-31.886%, -42.7456vh) scale(0.9018);
+
−
  }
+
−
  33.92% {
+
−
    -webkit-transform: translate(-28.4443%, -43.1228vh) scale(0.9009);
+
−
    transform: translate(-28.4443%, -43.1228vh) scale(0.9009);
+
−
  }
+
−
  34.21% {
+
−
    -webkit-transform: translate(-25%, -43.5vh) scale(0.9);
+
−
    transform: translate(-25%, -43.5vh) scale(0.9);
+
−
  }
+
−
  34.5% {
+
−
    -webkit-transform: translate(-21.5557%, -43.8772vh) scale(0.8991);
+
−
    transform: translate(-21.5557%, -43.8772vh) scale(0.8991);
+
−
  }
+
−
  34.8% {
+
−
    -webkit-transform: translate(-18.114%, -44.2544vh) scale(0.8982);
+
−
    transform: translate(-18.114%, -44.2544vh) scale(0.8982);
+
−
  }
+
−
  35.09% {
+
−
    -webkit-transform: translate(-14.6776%, -44.6316vh) scale(0.8974);
+
−
    transform: translate(-14.6776%, -44.6316vh) scale(0.8974);
+
−
  }
+
−
  35.38% {
+
−
    -webkit-transform: translate(-11.249%, -45.0088vh) scale(0.8965);
+
−
    transform: translate(-11.249%, -45.0088vh) scale(0.8965);
+
−
  }
+
−
  35.67% {
+
−
    -webkit-transform: translate(-7.8308%, -45.386vh) scale(0.8956);
+
−
    transform: translate(-7.8308%, -45.386vh) scale(0.8956);
+
−
  }
+
−
  35.96% {
+
−
    -webkit-transform: translate(-4.4257%, -45.7632vh) scale(0.8947);
+
−
    transform: translate(-4.4257%, -45.7632vh) scale(0.8947);
+
−
  }
+
−
  36.26% {
+
−
    -webkit-transform: translate(-1.0362%, -46.1404vh) scale(0.8939);
+
−
    transform: translate(-1.0362%, -46.1404vh) scale(0.8939);
+
−
  }
+
−
  36.55% {
+
−
    -webkit-transform: translate(2.3351%, -46.5175vh) scale(0.893);
+
−
    transform: translate(2.3351%, -46.5175vh) scale(0.893);
+
−
  }
+
−
  36.84% {
+
−
    -webkit-transform: translate(5.6857%, -46.8947vh) scale(0.8921);
+
−
    transform: translate(5.6857%, -46.8947vh) scale(0.8921);
+
−
  }
+
−
  37.13% {
+
−
    -webkit-transform: translate(9.0129%, -47.2719vh) scale(0.8912);
+
−
    transform: translate(9.0129%, -47.2719vh) scale(0.8912);
+
−
  }
+
−
  37.43% {
+
−
    -webkit-transform: translate(12.3144%, -47.6491vh) scale(0.8904);
+
−
    transform: translate(12.3144%, -47.6491vh) scale(0.8904);
+
−
  }
+
−
  37.72% {
+
−
    -webkit-transform: translate(15.5874%, -48.0263vh) scale(0.8895);
+
−
    transform: translate(15.5874%, -48.0263vh) scale(0.8895);
+
−
  }
+
−
  38.01% {
+
−
    -webkit-transform: translate(18.8297%, -48.4035vh) scale(0.8886);
+
−
    transform: translate(18.8297%, -48.4035vh) scale(0.8886);
+
−
  }
+
−
  38.3% {
+
−
    -webkit-transform: translate(22.0387%, -48.7807vh) scale(0.8877);
+
−
    transform: translate(22.0387%, -48.7807vh) scale(0.8877);
+
−
  }
+
−
  38.6% {
+
−
    -webkit-transform: translate(25.2119%, -49.1579vh) scale(0.8868);
+
−
    transform: translate(25.2119%, -49.1579vh) scale(0.8868);
+
−
  }
+
−
  38.89% {
+
−
    -webkit-transform: translate(28.3471%, -49.5351vh) scale(0.886);
+
−
    transform: translate(28.3471%, -49.5351vh) scale(0.886);
+
−
  }
+
−
  39.18% {
+
−
    -webkit-transform: translate(31.4417%, -49.9123vh) scale(0.8851);
+
−
    transform: translate(31.4417%, -49.9123vh) scale(0.8851);
+
−
  }
+
−
  39.47% {
+
−
    -webkit-transform: translate(34.4934%, -50.2895vh) scale(0.8842);
+
−
    transform: translate(34.4934%, -50.2895vh) scale(0.8842);
+
−
  }
+
−
  39.77% {
+
−
    -webkit-transform: translate(37.5%, -50.6667vh) scale(0.8833);
+
−
    transform: translate(37.5%, -50.6667vh) scale(0.8833);
+
−
  }
+
−
  40.06% {
+
−
    -webkit-transform: translate(40.4591%, -51.0439vh) scale(0.8825);
+
−
    transform: translate(40.4591%, -51.0439vh) scale(0.8825);
+
−
  }
+
−
  40.35% {
+
−
    -webkit-transform: translate(43.3685%, -51.4211vh) scale(0.8816);
+
−
    transform: translate(43.3685%, -51.4211vh) scale(0.8816);
+
−
  }
+
−
  40.64% {
+
−
    -webkit-transform: translate(46.226%, -51.7982vh) scale(0.8807);
+
−
    transform: translate(46.226%, -51.7982vh) scale(0.8807);
+
−
  }
+
−
  40.94% {
+
−
    -webkit-transform: translate(49.0294%, -52.1754vh) scale(0.8798);
+
−
    transform: translate(49.0294%, -52.1754vh) scale(0.8798);
+
−
  }
+
−
  41.23% {
+
−
    -webkit-transform: translate(51.7766%, -52.5526vh) scale(0.8789);
+
−
    transform: translate(51.7766%, -52.5526vh) scale(0.8789);
+
−
  }
+
−
  41.52% {
+
−
    -webkit-transform: translate(54.4655%, -52.9298vh) scale(0.8781);
+
−
    transform: translate(54.4655%, -52.9298vh) scale(0.8781);
+
−
  }
+
−
  41.81% {
+
−
    -webkit-transform: translate(57.094%, -53.307vh) scale(0.8772);
+
−
    transform: translate(57.094%, -53.307vh) scale(0.8772);
+
−
  }
+
−
  42.11% {
+
−
    -webkit-transform: translate(59.6602%, -53.6842vh) scale(0.8763);
+
−
    transform: translate(59.6602%, -53.6842vh) scale(0.8763);
+
−
  }
+
−
  42.4% {
+
−
    -webkit-transform: translate(62.1621%, -54.0614vh) scale(0.8754);
+
−
    transform: translate(62.1621%, -54.0614vh) scale(0.8754);
+
−
  }
+
−
  42.69% {
+
−
    -webkit-transform: translate(64.5978%, -54.4386vh) scale(0.8746);
+
−
    transform: translate(64.5978%, -54.4386vh) scale(0.8746);
+
−
  }
+
−
  42.98% {
+
−
    -webkit-transform: translate(66.9655%, -54.8158vh) scale(0.8737);
+
−
    transform: translate(66.9655%, -54.8158vh) scale(0.8737);
+
−
  }
+
−
  43.27% {
+
−
    -webkit-transform: translate(69.2633%, -55.193vh) scale(0.8728);
+
−
    transform: translate(69.2633%, -55.193vh) scale(0.8728);
+
−
  }
+
−
  43.57% {
+
−
    -webkit-transform: translate(71.4896%, -55.5702vh) scale(0.8719);
+
−
    transform: translate(71.4896%, -55.5702vh) scale(0.8719);
+
−
  }
+
−
  43.86% {
+
−
    -webkit-transform: translate(73.6426%, -55.9474vh) scale(0.8711);
+
−
    transform: translate(73.6426%, -55.9474vh) scale(0.8711);
+
−
  }
+
−
  44.15% {
+
−
    -webkit-transform: translate(75.7206%, -56.3246vh) scale(0.8702);
+
−
    transform: translate(75.7206%, -56.3246vh) scale(0.8702);
+
−
  }
+
−
  44.44% {
+
−
    -webkit-transform: translate(77.7222%, -56.7018vh) scale(0.8693);
+
−
    transform: translate(77.7222%, -56.7018vh) scale(0.8693);
+
−
  }
+
−
  44.74% {
+
−
    -webkit-transform: translate(79.6458%, -57.0789vh) scale(0.8684);
+
−
    transform: translate(79.6458%, -57.0789vh) scale(0.8684);
+
−
  }
+
−
  45.03% {
+
−
    -webkit-transform: translate(81.4899%, -57.4561vh) scale(0.8675);
+
−
    transform: translate(81.4899%, -57.4561vh) scale(0.8675);
+
−
  }
+
−
  45.32% {
+
−
    -webkit-transform: translate(83.2532%, -57.8333vh) scale(0.8667);
+
−
    transform: translate(83.2532%, -57.8333vh) scale(0.8667);
+
−
  }
+
−
  45.61% {
+
−
    -webkit-transform: translate(84.9342%, -58.2105vh) scale(0.8658);
+
−
    transform: translate(84.9342%, -58.2105vh) scale(0.8658);
+
−
  }
+
−
  45.91% {
+
−
    -webkit-transform: translate(86.5318%, -58.5877vh) scale(0.8649);
+
−
    transform: translate(86.5318%, -58.5877vh) scale(0.8649);
+
−
  }
+
−
  46.2% {
+
−
    -webkit-transform: translate(88.0446%, -58.9649vh) scale(0.864);
+
−
    transform: translate(88.0446%, -58.9649vh) scale(0.864);
+
−
  }
+
−
  46.49% {
+
−
    -webkit-transform: translate(89.4717%, -59.3421vh) scale(0.8632);
+
−
    transform: translate(89.4717%, -59.3421vh) scale(0.8632);
+
−
  }
+
−
  46.78% {
+
−
    -webkit-transform: translate(90.8118%, -59.7193vh) scale(0.8623);
+
−
    transform: translate(90.8118%, -59.7193vh) scale(0.8623);
+
−
  }
+
−
  47.08% {
+
−
    -webkit-transform: translate(92.0639%, -60.0965vh) scale(0.8614);
+
−
    transform: translate(92.0639%, -60.0965vh) scale(0.8614);
+
−
  }
+
−
  47.37% {
+
−
    -webkit-transform: translate(93.2272%, -60.4737vh) scale(0.8605);
+
−
    transform: translate(93.2272%, -60.4737vh) scale(0.8605);
+
−
  }
+
−
  47.66% {
+
−
    -webkit-transform: translate(94.3006%, -60.8509vh) scale(0.8596);
+
−
    transform: translate(94.3006%, -60.8509vh) scale(0.8596);
+
−
  }
+
−
  47.95% {
+
−
    -webkit-transform: translate(95.2835%, -61.2281vh) scale(0.8588);
+
−
    transform: translate(95.2835%, -61.2281vh) scale(0.8588);
+
−
  }
+
−
  48.25% {
+
−
    -webkit-transform: translate(96.175%, -61.6053vh) scale(0.8579);
+
−
    transform: translate(96.175%, -61.6053vh) scale(0.8579);
+
−
  }
+
−
  48.54% {
+
−
    -webkit-transform: translate(96.9745%, -61.9825vh) scale(0.857);
+
−
    transform: translate(96.9745%, -61.9825vh) scale(0.857);
+
−
  }
+
−
  48.83% {
+
−
    -webkit-transform: translate(97.6814%, -62.3596vh) scale(0.8561);
+
−
    transform: translate(97.6814%, -62.3596vh) scale(0.8561);
+
−
  }
+
−
  49.12% {
+
−
    -webkit-transform: translate(98.2952%, -62.7368vh) scale(0.8553);
+
−
    transform: translate(98.2952%, -62.7368vh) scale(0.8553);
+
−
  }
+
−
  49.42% {
+
−
    -webkit-transform: translate(98.8153%, -63.114vh) scale(0.8544);
+
−
    transform: translate(98.8153%, -63.114vh) scale(0.8544);
+
−
  }
+
−
  49.71% {
+
−
    -webkit-transform: translate(99.2413%, -63.4912vh) scale(0.8535);
+
−
    transform: translate(99.2413%, -63.4912vh) scale(0.8535);
+
−
  }
+
−
  50% {
+
−
    -webkit-transform: translate(99.5731%, -63.8684vh) scale(0.8526);
+
−
    transform: translate(99.5731%, -63.8684vh) scale(0.8526);
+
−
  }
+
−
  50.29% {
+
−
    -webkit-transform: translate(99.8102%, -64.2456vh) scale(0.8518);
+
−
    transform: translate(99.8102%, -64.2456vh) scale(0.8518);
+
−
  }
+
−
  50.58% {
+
−
    -webkit-transform: translate(99.9525%, -64.6228vh) scale(0.8509);
+
−
    transform: translate(99.9525%, -64.6228vh) scale(0.8509);
+
−
  }
+
−
  50.88% {
+
−
    -webkit-transform: translate(100%, -65vh) scale(0.85);
+
−
    transform: translate(100%, -65vh) scale(0.85);
+
−
  }
+
−
  51.17% {
+
−
    -webkit-transform: translate(99.9715%, -65.3772vh) scale(0.8496);
+
−
    transform: translate(99.9715%, -65.3772vh) scale(0.8496);
+
−
  }
+
−
  51.46% {
+
−
    -webkit-transform: translate(99.8861%, -65.7544vh) scale(0.8491);
+
−
    transform: translate(99.8861%, -65.7544vh) scale(0.8491);
+
−
  }
+
−
  51.75% {
+
−
    -webkit-transform: translate(99.7438%, -66.1316vh) scale(0.8487);
+
−
    transform: translate(99.7438%, -66.1316vh) scale(0.8487);
+
−
  }
+
−
  52.05% {
+
−
    -webkit-transform: translate(99.5448%, -66.5088vh) scale(0.8482);
+
−
    transform: translate(99.5448%, -66.5088vh) scale(0.8482);
+
−
  }
+
−
  52.34% {
+
−
    -webkit-transform: translate(99.2892%, -66.886vh) scale(0.8478);
+
−
    transform: translate(99.2892%, -66.886vh) scale(0.8478);
+
−
  }
+
−
  52.63% {
+
−
    -webkit-transform: translate(98.9771%, -67.2632vh) scale(0.8474);
+
−
    transform: translate(98.9771%, -67.2632vh) scale(0.8474);
+
−
  }
+
−
  52.92% {
+
−
    -webkit-transform: translate(98.6089%, -67.6404vh) scale(0.8469);
+
−
    transform: translate(98.6089%, -67.6404vh) scale(0.8469);
+
−
  }
+
−
  53.22% {
+
−
    -webkit-transform: translate(98.1847%, -68.0175vh) scale(0.8465);
+
−
    transform: translate(98.1847%, -68.0175vh) scale(0.8465);
+
−
  }
+
−
  53.51% {
+
−
    -webkit-transform: translate(97.705%, -68.3947vh) scale(0.8461);
+
−
    transform: translate(97.705%, -68.3947vh) scale(0.8461);
+
−
  }
+
−
  53.8% {
+
−
    -webkit-transform: translate(97.1701%, -68.7719vh) scale(0.8456);
+
−
    transform: translate(97.1701%, -68.7719vh) scale(0.8456);
+
−
  }
+
−
  54.09% {
+
−
    -webkit-transform: translate(96.5804%, -69.1491vh) scale(0.8452);
+
−
    transform: translate(96.5804%, -69.1491vh) scale(0.8452);
+
−
  }
+
−
  54.39% {
+
−
    -webkit-transform: translate(95.9363%, -69.5263vh) scale(0.8447);
+
−
    transform: translate(95.9363%, -69.5263vh) scale(0.8447);
+
−
  }
+
−
  54.68% {
+
−
    -webkit-transform: translate(95.2383%, -69.9035vh) scale(0.8443);
+
−
    transform: translate(95.2383%, -69.9035vh) scale(0.8443);
+
−
  }
+
−
  54.97% {
+
−
    -webkit-transform: translate(94.4871%, -70.2807vh) scale(0.8439);
+
−
    transform: translate(94.4871%, -70.2807vh) scale(0.8439);
+
−
  }
+
−
  55.26% {
+
−
    -webkit-transform: translate(93.683%, -70.6579vh) scale(0.8434);
+
−
    transform: translate(93.683%, -70.6579vh) scale(0.8434);
+
−
  }
+
−
  55.56% {
+
−
    -webkit-transform: translate(92.8268%, -71.0351vh) scale(0.843);
+
−
    transform: translate(92.8268%, -71.0351vh) scale(0.843);
+
−
  }
+
−
  55.85% {
+
−
    -webkit-transform: translate(91.9191%, -71.4123vh) scale(0.8425);
+
−
    transform: translate(91.9191%, -71.4123vh) scale(0.8425);
+
−
  }
+
−
  56.14% {
+
−
    -webkit-transform: translate(90.9605%, -71.7895vh) scale(0.8421);
+
−
    transform: translate(90.9605%, -71.7895vh) scale(0.8421);
+
−
  }
+
−
  56.43% {
+
−
    -webkit-transform: translate(89.9519%, -72.1667vh) scale(0.8417);
+
−
    transform: translate(89.9519%, -72.1667vh) scale(0.8417);
+
−
  }
+
−
  56.73% {
+
−
    -webkit-transform: translate(88.894%, -72.5439vh) scale(0.8412);
+
−
    transform: translate(88.894%, -72.5439vh) scale(0.8412);
+
−
  }
+
−
  57.02% {
+
−
    -webkit-transform: translate(87.7875%, -72.9211vh) scale(0.8408);
+
−
    transform: translate(87.7875%, -72.9211vh) scale(0.8408);
+
−
  }
+
−
  57.31% {
+
−
    -webkit-transform: translate(86.6333%, -73.2982vh) scale(0.8404);
+
−
    transform: translate(86.6333%, -73.2982vh) scale(0.8404);
+
−
  }
+
−
  57.6% {
+
−
    -webkit-transform: translate(85.4324%, -73.6754vh) scale(0.8399);
+
−
    transform: translate(85.4324%, -73.6754vh) scale(0.8399);
+
−
  }
+
−
  57.89% {
+
−
    -webkit-transform: translate(84.1855%, -74.0526vh) scale(0.8395);
+
−
    transform: translate(84.1855%, -74.0526vh) scale(0.8395);
+
−
  }
+
−
  58.19% {
+
−
    -webkit-transform: translate(82.8937%, -74.4298vh) scale(0.839);
+
−
    transform: translate(82.8937%, -74.4298vh) scale(0.839);
+
−
  }
+
−
  58.48% {
+
−
    -webkit-transform: translate(81.558%, -74.807vh) scale(0.8386);
+
−
    transform: translate(81.558%, -74.807vh) scale(0.8386);
+
−
  }
+
−
  58.77% {
+
−
    -webkit-transform: translate(80.1793%, -75.1842vh) scale(0.8382);
+
−
    transform: translate(80.1793%, -75.1842vh) scale(0.8382);
+
−
  }
+
−
  59.06% {
+
−
    -webkit-transform: translate(78.7587%, -75.5614vh) scale(0.8377);
+
−
    transform: translate(78.7587%, -75.5614vh) scale(0.8377);
+
−
  }
+
−
  59.36% {
+
−
    -webkit-transform: translate(77.2973%, -75.9386vh) scale(0.8373);
+
−
    transform: translate(77.2973%, -75.9386vh) scale(0.8373);
+
−
  }
+
−
  59.65% {
+
−
    -webkit-transform: translate(75.7961%, -76.3158vh) scale(0.8368);
+
−
    transform: translate(75.7961%, -76.3158vh) scale(0.8368);
+
−
  }
+
−
  59.94% {
+
−
    -webkit-transform: translate(74.2564%, -76.693vh) scale(0.8364);
+
−
    transform: translate(74.2564%, -76.693vh) scale(0.8364);
+
−
  }
+
−
  60.23% {
+
−
    -webkit-transform: translate(72.6793%, -77.0702vh) scale(0.836);
+
−
    transform: translate(72.6793%, -77.0702vh) scale(0.836);
+
−
  }
+
−
  60.53% {
+
−
    -webkit-transform: translate(71.066%, -77.4474vh) scale(0.8355);
+
−
    transform: translate(71.066%, -77.4474vh) scale(0.8355);
+
−
  }
+
−
  60.82% {
+
−
    -webkit-transform: translate(69.4176%, -77.8246vh) scale(0.8351);
+
−
    transform: translate(69.4176%, -77.8246vh) scale(0.8351);
+
−
  }
+
−
  61.11% {
+
−
    -webkit-transform: translate(67.7356%, -78.2018vh) scale(0.8346);
+
−
    transform: translate(67.7356%, -78.2018vh) scale(0.8346);
+
−
  }
+
−
  61.4% {
+
−
    -webkit-transform: translate(66.0211%, -78.5789vh) scale(0.8342);
+
−
    transform: translate(66.0211%, -78.5789vh) scale(0.8342);
+
−
  }
+
−
  61.7% {
+
−
    -webkit-transform: translate(64.2755%, -78.9561vh) scale(0.8338);
+
−
    transform: translate(64.2755%, -78.9561vh) scale(0.8338);
+
−
  }
+
−
  61.99% {
+
−
    -webkit-transform: translate(62.5%, -79.3333vh) scale(0.8333);
+
−
    transform: translate(62.5%, -79.3333vh) scale(0.8333);
+
−
  }
+
−
  62.28% {
+
−
    -webkit-transform: translate(60.6961%, -79.7105vh) scale(0.8329);
+
−
    transform: translate(60.6961%, -79.7105vh) scale(0.8329);
+
−
  }
+
−
  62.57% {
+
−
    -webkit-transform: translate(58.865%, -80.0877vh) scale(0.8325);
+
−
    transform: translate(58.865%, -80.0877vh) scale(0.8325);
+
−
  }
+
−
  62.87% {
+
−
    -webkit-transform: translate(57.0082%, -80.4649vh) scale(0.832);
+
−
    transform: translate(57.0082%, -80.4649vh) scale(0.832);
+
−
  }
+
−
  63.16% {
+
−
    -webkit-transform: translate(55.1272%, -80.8421vh) scale(0.8316);
+
−
    transform: translate(55.1272%, -80.8421vh) scale(0.8316);
+
−
  }
+
−
  63.45% {
+
−
    -webkit-transform: translate(53.2232%, -81.2193vh) scale(0.8311);
+
−
    transform: translate(53.2232%, -81.2193vh) scale(0.8311);
+
−
  }
+
−
  63.74% {
+
−
    -webkit-transform: translate(51.2978%, -81.5965vh) scale(0.8307);
+
−
    transform: translate(51.2978%, -81.5965vh) scale(0.8307);
+
−
  }
+
−
  64.04% {
+
−
    -webkit-transform: translate(49.3525%, -81.9737vh) scale(0.8303);
+
−
    transform: translate(49.3525%, -81.9737vh) scale(0.8303);
+
−
  }
+
−
  64.33% {
+
−
    -webkit-transform: translate(47.3886%, -82.3509vh) scale(0.8298);
+
−
    transform: translate(47.3886%, -82.3509vh) scale(0.8298);
+
−
  }
+
−
  64.62% {
+
−
    -webkit-transform: translate(45.4078%, -82.7281vh) scale(0.8294);
+
−
    transform: translate(45.4078%, -82.7281vh) scale(0.8294);
+
−
  }
+
−
  64.91% {
+
−
    -webkit-transform: translate(43.4114%, -83.1053vh) scale(0.8289);
+
−
    transform: translate(43.4114%, -83.1053vh) scale(0.8289);
+
−
  }
+
−
  65.2% {
+
−
    -webkit-transform: translate(41.4011%, -83.4825vh) scale(0.8285);
+
−
    transform: translate(41.4011%, -83.4825vh) scale(0.8285);
+
−
  }
+
−
  65.5% {
+
−
    -webkit-transform: translate(39.3783%, -83.8596vh) scale(0.8281);
+
−
    transform: translate(39.3783%, -83.8596vh) scale(0.8281);
+
−
  }
+
−
  65.79% {
+
−
    -webkit-transform: translate(37.3446%, -84.2368vh) scale(0.8276);
+
−
    transform: translate(37.3446%, -84.2368vh) scale(0.8276);
+
−
  }
+
−
  66.08% {
+
−
    -webkit-transform: translate(35.3015%, -84.614vh) scale(0.8272);
+
−
    transform: translate(35.3015%, -84.614vh) scale(0.8272);
+
−
  }
+
−
  66.37% {
+
−
    -webkit-transform: translate(33.2506%, -84.9912vh) scale(0.8268);
+
−
    transform: translate(33.2506%, -84.9912vh) scale(0.8268);
+
−
  }
+
−
  66.67% {
+
−
    -webkit-transform: translate(31.1935%, -85.3684vh) scale(0.8263);
+
−
    transform: translate(31.1935%, -85.3684vh) scale(0.8263);
+
−
  }
+
−
  66.96% {
+
−
    -webkit-transform: translate(29.1316%, -85.7456vh) scale(0.8259);
+
−
    transform: translate(29.1316%, -85.7456vh) scale(0.8259);
+
−
  }
+
−
  67.25% {
+
−
    -webkit-transform: translate(27.0666%, -86.1228vh) scale(0.8254);
+
−
    transform: translate(27.0666%, -86.1228vh) scale(0.8254);
+
−
  }
+
−
  67.54% {
+
−
    -webkit-transform: translate(25%, -86.5vh) scale(0.825);
+
−
    transform: translate(25%, -86.5vh) scale(0.825);
+
−
  }
+
−
  67.84% {
+
−
    -webkit-transform: translate(22.9334%, -86.8772vh) scale(0.8246);
+
−
    transform: translate(22.9334%, -86.8772vh) scale(0.8246);
+
−
  }
+
−
  68.13% {
+
−
    -webkit-transform: translate(20.8684%, -87.2544vh) scale(0.8241);
+
−
    transform: translate(20.8684%, -87.2544vh) scale(0.8241);
+
−
  }
+
−
  68.42% {
+
−
    -webkit-transform: translate(18.8065%, -87.6316vh) scale(0.8237);
+
−
    transform: translate(18.8065%, -87.6316vh) scale(0.8237);
+
−
  }
+
−
  68.71% {
+
−
    -webkit-transform: translate(16.7494%, -88.0088vh) scale(0.8232);
+
−
    transform: translate(16.7494%, -88.0088vh) scale(0.8232);
+
−
  }
+
−
  69.01% {
+
−
    -webkit-transform: translate(14.6985%, -88.386vh) scale(0.8228);
+
−
    transform: translate(14.6985%, -88.386vh) scale(0.8228);
+
−
  }
+
−
  69.3% {
+
−
    -webkit-transform: translate(12.6554%, -88.7632vh) scale(0.8224);
+
−
    transform: translate(12.6554%, -88.7632vh) scale(0.8224);
+
−
  }
+
−
  69.59% {
+
−
    -webkit-transform: translate(10.6217%, -89.1404vh) scale(0.8219);
+
−
    transform: translate(10.6217%, -89.1404vh) scale(0.8219);
+
−
  }
+
−
  69.88% {
+
−
    -webkit-transform: translate(8.5989%, -89.5175vh) scale(0.8215);
+
−
    transform: translate(8.5989%, -89.5175vh) scale(0.8215);
+
−
  }
+
−
  70.18% {
+
−
    -webkit-transform: translate(6.5886%, -89.8947vh) scale(0.8211);
+
−
    transform: translate(6.5886%, -89.8947vh) scale(0.8211);
+
−
  }
+
−
  70.47% {
+
−
    -webkit-transform: translate(4.5922%, -90.2719vh) scale(0.8206);
+
−
    transform: translate(4.5922%, -90.2719vh) scale(0.8206);
+
−
  }
+
−
  70.76% {
+
−
    -webkit-transform: translate(2.6114%, -90.6491vh) scale(0.8202);
+
−
    transform: translate(2.6114%, -90.6491vh) scale(0.8202);
+
−
  }
+
−
  71.05% {
+
−
    -webkit-transform: translate(0.6475%, -91.0263vh) scale(0.8197);
+
−
    transform: translate(0.6475%, -91.0263vh) scale(0.8197);
+
−
  }
+
−
  71.35% {
+
−
    -webkit-transform: translate(-1.2978%, -91.4035vh) scale(0.8193);
+
−
    transform: translate(-1.2978%, -91.4035vh) scale(0.8193);
+
−
  }
+
−
  71.64% {
+
−
    -webkit-transform: translate(-3.2232%, -91.7807vh) scale(0.8189);
+
−
    transform: translate(-3.2232%, -91.7807vh) scale(0.8189);
+
−
  }
+
−
  71.93% {
+
−
    -webkit-transform: translate(-5.1272%, -92.1579vh) scale(0.8184);
+
−
    transform: translate(-5.1272%, -92.1579vh) scale(0.8184);
+
−
  }
+
−
  72.22% {
+
−
    -webkit-transform: translate(-7.0082%, -92.5351vh) scale(0.818);
+
−
    transform: translate(-7.0082%, -92.5351vh) scale(0.818);
+
−
  }
+
−
  72.51% {
+
−
    -webkit-transform: translate(-8.865%, -92.9123vh) scale(0.8175);
+
−
    transform: translate(-8.865%, -92.9123vh) scale(0.8175);
+
−
  }
+
−
  72.81% {
+
−
    -webkit-transform: translate(-10.6961%, -93.2895vh) scale(0.8171);
+
−
    transform: translate(-10.6961%, -93.2895vh) scale(0.8171);
+
−
  }
+
−
  73.1% {
+
−
    -webkit-transform: translate(-12.5%, -93.6667vh) scale(0.8167);
+
−
    transform: translate(-12.5%, -93.6667vh) scale(0.8167);
+
−
  }
+
−
  73.39% {
+
−
    -webkit-transform: translate(-14.2755%, -94.0439vh) scale(0.8162);
+
−
    transform: translate(-14.2755%, -94.0439vh) scale(0.8162);
+
−
  }
+
−
  73.68% {
+
−
    -webkit-transform: translate(-16.0211%, -94.4211vh) scale(0.8158);
+
−
    transform: translate(-16.0211%, -94.4211vh) scale(0.8158);
+
−
  }
+
−
  73.98% {
+
−
    -webkit-transform: translate(-17.7356%, -94.7982vh) scale(0.8154);
+
−
    transform: translate(-17.7356%, -94.7982vh) scale(0.8154);
+
−
  }
+
−
  74.27% {
+
−
    -webkit-transform: translate(-19.4176%, -95.1754vh) scale(0.8149);
+
−
    transform: translate(-19.4176%, -95.1754vh) scale(0.8149);
+
−
  }
+
−
  74.56% {
+
−
    -webkit-transform: translate(-21.066%, -95.5526vh) scale(0.8145);
+
−
    transform: translate(-21.066%, -95.5526vh) scale(0.8145);
+
−
  }
+
−
  74.85% {
+
−
    -webkit-transform: translate(-22.6793%, -95.9298vh) scale(0.814);
+
−
    transform: translate(-22.6793%, -95.9298vh) scale(0.814);
+
−
  }
+
−
  75.15% {
+
−
    -webkit-transform: translate(-24.2564%, -96.307vh) scale(0.8136);
+
−
    transform: translate(-24.2564%, -96.307vh) scale(0.8136);
+
−
  }
+
−
  75.44% {
+
−
    -webkit-transform: translate(-25.7961%, -96.6842vh) scale(0.8132);
+
−
    transform: translate(-25.7961%, -96.6842vh) scale(0.8132);
+
−
  }
+
−
  75.73% {
+
−
    -webkit-transform: translate(-27.2973%, -97.0614vh) scale(0.8127);
+
−
    transform: translate(-27.2973%, -97.0614vh) scale(0.8127);
+
−
  }
+
−
  76.02% {
+
−
    -webkit-transform: translate(-28.7587%, -97.4386vh) scale(0.8123);
+
−
    transform: translate(-28.7587%, -97.4386vh) scale(0.8123);
+
−
  }
+
−
  76.32% {
+
−
    -webkit-transform: translate(-30.1793%, -97.8158vh) scale(0.8118);
+
−
    transform: translate(-30.1793%, -97.8158vh) scale(0.8118);
+
−
  }
+
−
  76.61% {
+
−
    -webkit-transform: translate(-31.558%, -98.193vh) scale(0.8114);
+
−
    transform: translate(-31.558%, -98.193vh) scale(0.8114);
+
−
  }
+
−
  76.9% {
+
−
    -webkit-transform: translate(-32.8937%, -98.5702vh) scale(0.811);
+
−
    transform: translate(-32.8937%, -98.5702vh) scale(0.811);
+
−
  }
+
−
  77.19% {
+
−
    -webkit-transform: translate(-34.1855%, -98.9474vh) scale(0.8105);
+
−
    transform: translate(-34.1855%, -98.9474vh) scale(0.8105);
+
−
  }
+
−
  77.49% {
+
−
    -webkit-transform: translate(-35.4324%, -99.3246vh) scale(0.8101);
+
−
    transform: translate(-35.4324%, -99.3246vh) scale(0.8101);
+
−
  }
+
−
  77.78% {
+
−
    -webkit-transform: translate(-36.6333%, -99.7018vh) scale(0.8096);
+
−
    transform: translate(-36.6333%, -99.7018vh) scale(0.8096);
+
−
  }
+
−
  78.07% {
+
−
    -webkit-transform: translate(-37.7875%, -100.0789vh) scale(0.8092);
+
−
    transform: translate(-37.7875%, -100.0789vh) scale(0.8092);
+
−
  }
+
−
  78.36% {
+
−
    -webkit-transform: translate(-38.894%, -100.4561vh) scale(0.8088);
+
−
    transform: translate(-38.894%, -100.4561vh) scale(0.8088);
+
−
  }
+
−
  78.65% {
+
−
    -webkit-transform: translate(-39.9519%, -100.8333vh) scale(0.8083);
+
−
    transform: translate(-39.9519%, -100.8333vh) scale(0.8083);
+
−
  }
+
−
  78.95% {
+
−
    -webkit-transform: translate(-40.9605%, -101.2105vh) scale(0.8079);
+
−
    transform: translate(-40.9605%, -101.2105vh) scale(0.8079);
+
−
  }
+
−
  79.24% {
+
−
    -webkit-transform: translate(-41.9191%, -101.5877vh) scale(0.8075);
+
−
    transform: translate(-41.9191%, -101.5877vh) scale(0.8075);
+
−
  }
+
−
  79.53% {
+
−
    -webkit-transform: translate(-42.8268%, -101.9649vh) scale(0.807);
+
−
    transform: translate(-42.8268%, -101.9649vh) scale(0.807);
+
−
  }
+
−
  79.82% {
+
−
    -webkit-transform: translate(-43.683%, -102.3421vh) scale(0.8066);
+
−
    transform: translate(-43.683%, -102.3421vh) scale(0.8066);
+
−
  }
+
−
  80.12% {
+
−
    -webkit-transform: translate(-44.4871%, -102.7193vh) scale(0.8061);
+
−
    transform: translate(-44.4871%, -102.7193vh) scale(0.8061);
+
−
  }
+
−
  80.41% {
+
−
    -webkit-transform: translate(-45.2383%, -103.0965vh) scale(0.8057);
+
−
    transform: translate(-45.2383%, -103.0965vh) scale(0.8057);
+
−
  }
+
−
  80.7% {
+
−
    -webkit-transform: translate(-45.9363%, -103.4737vh) scale(0.8053);
+
−
    transform: translate(-45.9363%, -103.4737vh) scale(0.8053);
+
−
  }
+
−
  80.99% {
+
−
    -webkit-transform: translate(-46.5804%, -103.8509vh) scale(0.8048);
+
−
    transform: translate(-46.5804%, -103.8509vh) scale(0.8048);
+
−
  }
+
−
  81.29% {
+
−
    -webkit-transform: translate(-47.1701%, -104.2281vh) scale(0.8044);
+
−
    transform: translate(-47.1701%, -104.2281vh) scale(0.8044);
+
−
  }
+
−
  81.58% {
+
−
    -webkit-transform: translate(-47.705%, -104.6053vh) scale(0.8039);
+
−
    transform: translate(-47.705%, -104.6053vh) scale(0.8039);
+
−
  }
+
−
  81.87% {
+
−
    -webkit-transform: translate(-48.1847%, -104.9825vh) scale(0.8035);
+
−
    transform: translate(-48.1847%, -104.9825vh) scale(0.8035);
+
−
  }
+
−
  82.16% {
+
−
    -webkit-transform: translate(-48.6089%, -105.3596vh) scale(0.8031);
+
−
    transform: translate(-48.6089%, -105.3596vh) scale(0.8031);
+
−
  }
+
−
  82.46% {
+
−
    -webkit-transform: translate(-48.9771%, -105.7368vh) scale(0.8026);
+
−
    transform: translate(-48.9771%, -105.7368vh) scale(0.8026);
+
−
  }
+
−
  82.75% {
+
−
    -webkit-transform: translate(-49.2892%, -106.114vh) scale(0.8022);
+
−
    transform: translate(-49.2892%, -106.114vh) scale(0.8022);
+
−
  }
+
−
  83.04% {
+
−
    -webkit-transform: translate(-49.5448%, -106.4912vh) scale(0.8018);
+
−
    transform: translate(-49.5448%, -106.4912vh) scale(0.8018);
+
−
  }
+
−
  83.33% {
+
−
    -webkit-transform: translate(-49.7438%, -106.8684vh) scale(0.8013);
+
−
    transform: translate(-49.7438%, -106.8684vh) scale(0.8013);
+
−
  }
+
−
  83.63% {
+
−
    -webkit-transform: translate(-49.8861%, -107.2456vh) scale(0.8009);
+
−
    transform: translate(-49.8861%, -107.2456vh) scale(0.8009);
+
−
  }
+
−
  83.92% {
+
−
    -webkit-transform: translate(-49.9715%, -107.6228vh) scale(0.8004);
+
−
    transform: translate(-49.9715%, -107.6228vh) scale(0.8004);
+
−
  }
+
−
  84.21% {
+
−
    -webkit-transform: translate(-50%, -108vh) scale(0.8);
+
−
    transform: translate(-50%, -108vh) scale(0.8);
+
−
  }
+
−
  84.5% {
+
−
    -webkit-transform: translate(-49.9788%, -108.4074vh) scale(0.7981);
+
−
    transform: translate(-49.9788%, -108.4074vh) scale(0.7981);
+
−
  }
+
−
  84.8% {
+
−
    -webkit-transform: translate(-49.9154%, -108.8148vh) scale(0.7963);
+
−
    transform: translate(-49.9154%, -108.8148vh) scale(0.7963);
+
−
  }
+
−
  85.09% {
+
−
    -webkit-transform: translate(-49.8097%, -109.2222vh) scale(0.7944);
+
−
    transform: translate(-49.8097%, -109.2222vh) scale(0.7944);
+
−
  }
+
−
  85.38% {
+
−
    -webkit-transform: translate(-49.6619%, -109.6296vh) scale(0.7926);
+
−
    transform: translate(-49.6619%, -109.6296vh) scale(0.7926);
+
−
  }
+
−
  85.67% {
+
−
    -webkit-transform: translate(-49.4721%, -110.037vh) scale(0.7907);
+
−
    transform: translate(-49.4721%, -110.037vh) scale(0.7907);
+
−
  }
+
−
  85.96% {
+
−
    -webkit-transform: translate(-49.2404%, -110.4444vh) scale(0.7889);
+
−
    transform: translate(-49.2404%, -110.4444vh) scale(0.7889);
+
−
  }
+
−
  86.26% {
+
−
    -webkit-transform: translate(-48.967%, -110.8519vh) scale(0.787);
+
−
    transform: translate(-48.967%, -110.8519vh) scale(0.787);
+
−
  }
+
−
  86.55% {
+
−
    -webkit-transform: translate(-48.6522%, -111.2593vh) scale(0.7852);
+
−
    transform: translate(-48.6522%, -111.2593vh) scale(0.7852);
+
−
  }
+
−
  86.84% {
+
−
    -webkit-transform: translate(-48.2963%, -111.6667vh) scale(0.7833);
+
−
    transform: translate(-48.2963%, -111.6667vh) scale(0.7833);
+
−
  }
+
−
  87.13% {
+
−
    -webkit-transform: translate(-47.8995%, -112.0741vh) scale(0.7815);
+
−
    transform: translate(-47.8995%, -112.0741vh) scale(0.7815);
+
−
  }
+
−
  87.43% {
+
−
    -webkit-transform: translate(-47.4621%, -112.4815vh) scale(0.7796);
+
−
    transform: translate(-47.4621%, -112.4815vh) scale(0.7796);
+
−
  }
+
−
  87.72% {
+
−
    -webkit-transform: translate(-46.9846%, -112.8889vh) scale(0.7778);
+
−
    transform: translate(-46.9846%, -112.8889vh) scale(0.7778);
+
−
  }
+
−
  88.01% {
+
−
    -webkit-transform: translate(-46.4674%, -113.2963vh) scale(0.7759);
+
−
    transform: translate(-46.4674%, -113.2963vh) scale(0.7759);
+
−
  }
+
−
  88.3% {
+
−
    -webkit-transform: translate(-45.9108%, -113.7037vh) scale(0.7741);
+
−
    transform: translate(-45.9108%, -113.7037vh) scale(0.7741);
+
−
  }
+
−
  88.6% {
+
−
    -webkit-transform: translate(-45.3154%, -114.1111vh) scale(0.7722);
+
−
    transform: translate(-45.3154%, -114.1111vh) scale(0.7722);
+
−
  }
+
−
  88.89% {
+
−
    -webkit-transform: translate(-44.6816%, -114.5185vh) scale(0.7704);
+
−
    transform: translate(-44.6816%, -114.5185vh) scale(0.7704);
+
−
  }
+
−
  89.18% {
+
−
    -webkit-transform: translate(-44.0101%, -114.9259vh) scale(0.7685);
+
−
    transform: translate(-44.0101%, -114.9259vh) scale(0.7685);
+
−
  }
+
−
  89.47% {
+
−
    -webkit-transform: translate(-43.3013%, -115.3333vh) scale(0.7667);
+
−
    transform: translate(-43.3013%, -115.3333vh) scale(0.7667);
+
−
  }
+
−
  89.77% {
+
−
    -webkit-transform: translate(-42.5558%, -115.7407vh) scale(0.7648);
+
−
    transform: translate(-42.5558%, -115.7407vh) scale(0.7648);
+
−
  }
+
−
  90.06% {
+
−
    -webkit-transform: translate(-41.7744%, -116.1481vh) scale(0.763);
+
−
    transform: translate(-41.7744%, -116.1481vh) scale(0.763);
+
−
  }
+
−
  90.35% {
+
−
    -webkit-transform: translate(-40.9576%, -116.5556vh) scale(0.7611);
+
−
    transform: translate(-40.9576%, -116.5556vh) scale(0.7611);
+
−
  }
+
−
  90.64% {
+
−
    -webkit-transform: translate(-40.1062%, -116.963vh) scale(0.7593);
+
−
    transform: translate(-40.1062%, -116.963vh) scale(0.7593);
+
−
  }
+
−
  90.94% {
+
−
    -webkit-transform: translate(-39.2208%, -117.3704vh) scale(0.7574);
+
−
    transform: translate(-39.2208%, -117.3704vh) scale(0.7574);
+
−
  }
+
−
  91.23% {
+
−
    -webkit-transform: translate(-38.3022%, -117.7778vh) scale(0.7556);
+
−
    transform: translate(-38.3022%, -117.7778vh) scale(0.7556);
+
−
  }
+
−
  91.52% {
+
−
    -webkit-transform: translate(-37.3513%, -118.1852vh) scale(0.7537);
+
−
    transform: translate(-37.3513%, -118.1852vh) scale(0.7537);
+
−
  }
+
−
  91.81% {
+
−
    -webkit-transform: translate(-36.3687%, -118.5926vh) scale(0.7519);
+
−
    transform: translate(-36.3687%, -118.5926vh) scale(0.7519);
+
−
  }
+
−
  92.11% {
+
−
    -webkit-transform: translate(-35.3553%, -119vh) scale(0.75);
+
−
    transform: translate(-35.3553%, -119vh) scale(0.75);
+
−
  }
+
−
  92.4% {
+
−
    -webkit-transform: translate(-34.3121%, -119.4074vh) scale(0.7481);
+
−
    transform: translate(-34.3121%, -119.4074vh) scale(0.7481);
+
−
  }
+
−
  92.69% {
+
−
    -webkit-transform: translate(-33.2398%, -119.8148vh) scale(0.7463);
+
−
    transform: translate(-33.2398%, -119.8148vh) scale(0.7463);
+
−
  }
+
−
  92.98% {
+
−
    -webkit-transform: translate(-32.1394%, -120.2222vh) scale(0.7444);
+
−
    transform: translate(-32.1394%, -120.2222vh) scale(0.7444);
+
−
  }
+
−
  93.27% {
+
−
    -webkit-transform: translate(-31.0118%, -120.6296vh) scale(0.7426);
+
−
    transform: translate(-31.0118%, -120.6296vh) scale(0.7426);
+
−
  }
+
−
  93.57% {
+
−
    -webkit-transform: translate(-29.8579%, -121.037vh) scale(0.7407);
+
−
    transform: translate(-29.8579%, -121.037vh) scale(0.7407);
+
−
  }
+
−
  93.86% {
+
−
    -webkit-transform: translate(-28.6788%, -121.4444vh) scale(0.7389);
+
−
    transform: translate(-28.6788%, -121.4444vh) scale(0.7389);
+
−
  }
+
−
  94.15% {
+
−
    -webkit-transform: translate(-27.4754%, -121.8519vh) scale(0.737);
+
−
    transform: translate(-27.4754%, -121.8519vh) scale(0.737);
+
−
  }
+
−
  94.44% {
+
−
    -webkit-transform: translate(-26.2488%, -122.2593vh) scale(0.7352);
+
−
    transform: translate(-26.2488%, -122.2593vh) scale(0.7352);
+
−
  }
+
−
  94.74% {
+
−
    -webkit-transform: translate(-25%, -122.6667vh) scale(0.7333);
+
−
    transform: translate(-25%, -122.6667vh) scale(0.7333);
+
−
  }
+
−
  95.03% {
+
−
    -webkit-transform: translate(-23.73%, -123.0741vh) scale(0.7315);
+
−
    transform: translate(-23.73%, -123.0741vh) scale(0.7315);
+
−
  }
+
−
  95.32% {
+
−
    -webkit-transform: translate(-22.44%, -123.4815vh) scale(0.7296);
+
−
    transform: translate(-22.44%, -123.4815vh) scale(0.7296);
+
−
  }
+
−
  95.61% {
+
−
    -webkit-transform: translate(-21.1309%, -123.8889vh) scale(0.7278);
+
−
    transform: translate(-21.1309%, -123.8889vh) scale(0.7278);
+
−
  }
+
−
  95.91% {
+
−
    -webkit-transform: translate(-19.804%, -124.2963vh) scale(0.7259);
+
−
    transform: translate(-19.804%, -124.2963vh) scale(0.7259);
+
−
  }
+
−
  96.2% {
+
−
    -webkit-transform: translate(-18.4603%, -124.7037vh) scale(0.7241);
+
−
    transform: translate(-18.4603%, -124.7037vh) scale(0.7241);
+
−
  }
+
−
  96.49% {
+
−
    -webkit-transform: translate(-17.101%, -125.1111vh) scale(0.7222);
+
−
    transform: translate(-17.101%, -125.1111vh) scale(0.7222);
+
−
  }
+
−
  96.78% {
+
−
    -webkit-transform: translate(-15.7272%, -125.5185vh) scale(0.7204);
+
−
    transform: translate(-15.7272%, -125.5185vh) scale(0.7204);
+
−
  }
+
−
  97.08% {
+
−
    -webkit-transform: translate(-14.3402%, -125.9259vh) scale(0.7185);
+
−
    transform: translate(-14.3402%, -125.9259vh) scale(0.7185);
+
−
  }
+
−
  97.37% {
+
−
    -webkit-transform: translate(-12.941%, -126.3333vh) scale(0.7167);
+
−
    transform: translate(-12.941%, -126.3333vh) scale(0.7167);
+
−
  }
+
−
  97.66% {
+
−
    -webkit-transform: translate(-11.5308%, -126.7407vh) scale(0.7148);
+
−
    transform: translate(-11.5308%, -126.7407vh) scale(0.7148);
+
−
  }
+
−
  97.95% {
+
−
    -webkit-transform: translate(-10.1109%, -127.1481vh) scale(0.713);
+
−
    transform: translate(-10.1109%, -127.1481vh) scale(0.713);
+
−
  }
+
−
  98.25% {
+
−
    -webkit-transform: translate(-8.6824%, -127.5556vh) scale(0.7111);
+
−
    transform: translate(-8.6824%, -127.5556vh) scale(0.7111);
+
−
  }
+
−
  98.54% {
+
−
    -webkit-transform: translate(-7.2466%, -127.963vh) scale(0.7093);
+
−
    transform: translate(-7.2466%, -127.963vh) scale(0.7093);
+
−
  }
+
−
  98.83% {
+
−
    -webkit-transform: translate(-5.8046%, -128.3704vh) scale(0.7074);
+
−
    transform: translate(-5.8046%, -128.3704vh) scale(0.7074);
+
−
  }
+
−
  99.12% {
+
−
    -webkit-transform: translate(-4.3578%, -128.7778vh) scale(0.7056);
+
−
    transform: translate(-4.3578%, -128.7778vh) scale(0.7056);
+
−
  }
+
−
  99.42% {
+
−
    -webkit-transform: translate(-2.9072%, -129.1852vh) scale(0.7037);
+
−
    transform: translate(-2.9072%, -129.1852vh) scale(0.7037);
+
−
  }
+
−
  99.71% {
+
−
    -webkit-transform: translate(-1.4542%, -129.5926vh) scale(0.7019);
+
−
    transform: translate(-1.4542%, -129.5926vh) scale(0.7019);
+
−
  }
+
−
  100% {
+
−
    -webkit-transform: translate(0%, -130vh) scale(0.7);
+
−
    transform: translate(0%, -130vh) scale(0.7);
+
−
  }
+
 
}
 
}
  
−
@keyframes bubbly {
+
.popout.protocols .collapsible {
−
  0% {
+
   font-size: 30px;
−
    -webkit-transform: translate(0%, 0vh) scale(1);
+
}
−
    transform: translate(0%, 0vh) scale(1);
+
 
−
  }
+
.popout.protocols .collapsibleContent.revealed {
−
  0.29% {
+
   -webkit-transition: all 0.4s;
−
    -webkit-transform: translate(-3.9265%, -0.3667vh) scale(0.9992);
+
   transition: all 0.4s;
−
    transform: translate(-3.9265%, -0.3667vh) scale(0.9992);
+
}
−
  }
+
 
−
  0.58% {
+
ol li {
−
    -webkit-transform: translate(-7.8504%, -0.7333vh) scale(0.9983);
+
   display: list-item;
−
    transform: translate(-7.8504%, -0.7333vh) scale(0.9983);
+
   padding-left: 15px;
−
   }
+
}
−
  0.88% {
+
 
−
    -webkit-transform: translate(-11.7689%, -1.1vh) scale(0.9975);
+
ol {
−
    transform: translate(-11.7689%, -1.1vh) scale(0.9975);
+
   padding-left: 20px;
−
  }
+
}
−
  1.17% {
+
 
−
    -webkit-transform: translate(-15.6793%, -1.4667vh) scale(0.9967);
+
ul.indented li {
−
    transform: translate(-15.6793%, -1.4667vh) scale(0.9967);
+
   padding-left: 5px;
−
  }
+
   list-style-position: inside;
−
  1.46% {
+
   display: list-item;
−
    -webkit-transform: translate(-19.5789%, -1.8333vh) scale(0.9958);
+
   list-style-type: disc;
−
    transform: translate(-19.5789%, -1.8333vh) scale(0.9958);
+
}
−
   }
+
 
−
  1.75% {
+
ul.indented li span.indent {
−
    -webkit-transform: translate(-23.4652%, -2.2vh) scale(0.995);
+
   padding-left: 10px;
−
    transform: translate(-23.4652%, -2.2vh) scale(0.995);
+
}
−
   }
+
 
−
  2.05% {
+
.protocols table {
−
    -webkit-transform: translate(-27.3353%, -2.5667vh) scale(0.9942);
+
   margin: 10px 0 10px 13px;
−
    transform: translate(-27.3353%, -2.5667vh) scale(0.9942);
+
}
−
  }
+
 
−
  2.34% {
+
.protocols th {
−
    -webkit-transform: translate(-31.1868%, -2.9333vh) scale(0.9933);
+
   text-align: left;
−
    transform: translate(-31.1868%, -2.9333vh) scale(0.9933);
+
}
−
  }
+
 
−
  2.63% {
+
table .top {
−
    -webkit-transform: translate(-35.0168%, -3.3vh) scale(0.9925);
+
   vertical-align: top;
−
    transform: translate(-35.0168%, -3.3vh) scale(0.9925);
+
}
−
   }
+
 
−
  2.92% {
+
.protocols table tr th:first-child, .protocols table tr td:first-child {
−
    -webkit-transform: translate(-38.8229%, -3.6667vh) scale(0.9917);
+
   padding-right: 20px;
−
    transform: translate(-38.8229%, -3.6667vh) scale(0.9917);
+
−
   }
+
−
  3.22% {
+
−
    -webkit-transform: translate(-42.6023%, -4.0333vh) scale(0.9908);
+
−
    transform: translate(-42.6023%, -4.0333vh) scale(0.9908);
+
−
  }
+
−
  3.51% {
+
−
    -webkit-transform: translate(-46.3525%, -4.4vh) scale(0.99);
+
−
    transform: translate(-46.3525%, -4.4vh) scale(0.99);
+
−
  }
+
−
  3.8% {
+
−
    -webkit-transform: translate(-50.071%, -4.7667vh) scale(0.9892);
+
−
    transform: translate(-50.071%, -4.7667vh) scale(0.9892);
+
−
   }
+
−
  4.09% {
+
−
    -webkit-transform: translate(-53.7552%, -5.1333vh) scale(0.9883);
+
−
    transform: translate(-53.7552%, -5.1333vh) scale(0.9883);
+
−
  }
+
−
  4.39% {
+
−
    -webkit-transform: translate(-57.4025%, -5.5vh) scale(0.9875);
+
−
    transform: translate(-57.4025%, -5.5vh) scale(0.9875);
+
−
  }
+
−
  4.68% {
+
−
    -webkit-transform: translate(-61.0105%, -5.8667vh) scale(0.9867);
+
−
    transform: translate(-61.0105%, -5.8667vh) scale(0.9867);
+
−
   }
+
−
  4.97% {
+
−
    -webkit-transform: translate(-64.5767%, -6.2333vh) scale(0.9858);
+
−
    transform: translate(-64.5767%, -6.2333vh) scale(0.9858);
+
−
   }
+
−
  5.26% {
+
−
    -webkit-transform: translate(-68.0986%, -6.6vh) scale(0.985);
+
−
    transform: translate(-68.0986%, -6.6vh) scale(0.985);
+
−
   }
+
−
  5.56% {
+
−
    -webkit-transform: translate(-71.5738%, -6.9667vh) scale(0.9842);
+
−
    transform: translate(-71.5738%, -6.9667vh) scale(0.9842);
+
−
   }
+
−
  5.85% {
+
−
    -webkit-transform: translate(-75%, -7.3333vh) scale(0.9833);
+
−
    transform: translate(-75%, -7.3333vh) scale(0.9833);
+
−
  }
+
−
  6.14% {
+
−
    -webkit-transform: translate(-78.3748%, -7.7vh) scale(0.9825);
+
−
    transform: translate(-78.3748%, -7.7vh) scale(0.9825);
+
−
  }
+
−
  6.43% {
+
−
    -webkit-transform: translate(-81.6959%, -8.0667vh) scale(0.9817);
+
−
    transform: translate(-81.6959%, -8.0667vh) scale(0.9817);
+
−
   }
+
−
  6.73% {
+
−
    -webkit-transform: translate(-84.9609%, -8.4333vh) scale(0.9808);
+
−
    transform: translate(-84.9609%, -8.4333vh) scale(0.9808);
+
−
  }
+
−
  7.02% {
+
−
    -webkit-transform: translate(-88.1678%, -8.8vh) scale(0.98);
+
−
    transform: translate(-88.1678%, -8.8vh) scale(0.98);
+
−
  }
+
−
  7.31% {
+
−
    -webkit-transform: translate(-91.3142%, -9.1667vh) scale(0.9792);
+
−
    transform: translate(-91.3142%, -9.1667vh) scale(0.9792);
+
−
   }
+
−
  7.6% {
+
−
    -webkit-transform: translate(-94.3981%, -9.5333vh) scale(0.9783);
+
−
    transform: translate(-94.3981%, -9.5333vh) scale(0.9783);
+
−
  }
+
−
  7.89% {
+
−
    -webkit-transform: translate(-97.4172%, -9.9vh) scale(0.9775);
+
−
    transform: translate(-97.4172%, -9.9vh) scale(0.9775);
+
−
  }
+
−
  8.19% {
+
−
    -webkit-transform: translate(-100.3696%, -10.2667vh) scale(0.9767);
+
−
    transform: translate(-100.3696%, -10.2667vh) scale(0.9767);
+
−
   }
+
−
  8.48% {
+
−
    -webkit-transform: translate(-103.2532%, -10.6333vh) scale(0.9758);
+
−
    transform: translate(-103.2532%, -10.6333vh) scale(0.9758);
+
−
  }
+
−
  8.77% {
+
−
    -webkit-transform: translate(-106.066%, -11vh) scale(0.975);
+
−
    transform: translate(-106.066%, -11vh) scale(0.975);
+
−
  }
+
−
  9.06% {
+
−
    -webkit-transform: translate(-108.8062%, -11.3667vh) scale(0.9742);
+
−
    transform: translate(-108.8062%, -11.3667vh) scale(0.9742);
+
−
   }
+
−
  9.36% {
+
−
    -webkit-transform: translate(-111.4717%, -11.7333vh) scale(0.9733);
+
−
    transform: translate(-111.4717%, -11.7333vh) scale(0.9733);
+
−
  }
+
−
  9.65% {
+
−
    -webkit-transform: translate(-114.0609%, -12.1vh) scale(0.9725);
+
−
    transform: translate(-114.0609%, -12.1vh) scale(0.9725);
+
−
  }
+
−
  9.94% {
+
−
    -webkit-transform: translate(-116.5719%, -12.4667vh) scale(0.9717);
+
−
    transform: translate(-116.5719%, -12.4667vh) scale(0.9717);
+
−
  }
+
−
  10.23% {
+
−
    -webkit-transform: translate(-119.003%, -12.8333vh) scale(0.9708);
+
−
    transform: translate(-119.003%, -12.8333vh) scale(0.9708);
+
−
   }
+
−
  10.53% {
+
−
    -webkit-transform: translate(-121.3525%, -13.2vh) scale(0.97);
+
−
    transform: translate(-121.3525%, -13.2vh) scale(0.97);
+
−
  }
+
−
  10.82% {
+
−
    -webkit-transform: translate(-123.6189%, -13.5667vh) scale(0.9692);
+
−
    transform: translate(-123.6189%, -13.5667vh) scale(0.9692);
+
−
  }
+
−
  11.11% {
+
−
    -webkit-transform: translate(-125.8006%, -13.9333vh) scale(0.9683);
+
−
    transform: translate(-125.8006%, -13.9333vh) scale(0.9683);
+
−
  }
+
−
  11.4% {
+
−
    -webkit-transform: translate(-127.896%, -14.3vh) scale(0.9675);
+
−
    transform: translate(-127.896%, -14.3vh) scale(0.9675);
+
−
  }
+
−
  11.7% {
+
−
    -webkit-transform: translate(-129.9038%, -14.6667vh) scale(0.9667);
+
−
    transform: translate(-129.9038%, -14.6667vh) scale(0.9667);
+
−
  }
+
−
  11.99% {
+
−
    -webkit-transform: translate(-131.8226%, -15.0333vh) scale(0.9658);
+
−
    transform: translate(-131.8226%, -15.0333vh) scale(0.9658);
+
−
  }
+
−
  12.28% {
+
−
    -webkit-transform: translate(-133.651%, -15.4vh) scale(0.965);
+
−
    transform: translate(-133.651%, -15.4vh) scale(0.965);
+
−
  }
+
−
  12.57% {
+
−
    -webkit-transform: translate(-135.3878%, -15.7667vh) scale(0.9642);
+
−
    transform: translate(-135.3878%, -15.7667vh) scale(0.9642);
+
−
  }
+
−
  12.87% {
+
−
    -webkit-transform: translate(-137.0318%, -16.1333vh) scale(0.9633);
+
−
    transform: translate(-137.0318%, -16.1333vh) scale(0.9633);
+
−
  }
+
−
  13.16% {
+
−
    -webkit-transform: translate(-138.5819%, -16.5vh) scale(0.9625);
+
−
    transform: translate(-138.5819%, -16.5vh) scale(0.9625);
+
−
  }
+
−
  13.45% {
+
−
    -webkit-transform: translate(-140.0371%, -16.8667vh) scale(0.9617);
+
−
    transform: translate(-140.0371%, -16.8667vh) scale(0.9617);
+
−
  }
+
−
  13.74% {
+
−
    -webkit-transform: translate(-141.3962%, -17.2333vh) scale(0.9608);
+
−
    transform: translate(-141.3962%, -17.2333vh) scale(0.9608);
+
−
  }
+
−
  14.04% {
+
−
    -webkit-transform: translate(-142.6585%, -17.6vh) scale(0.96);
+
−
    transform: translate(-142.6585%, -17.6vh) scale(0.96);
+
−
  }
+
−
  14.33% {
+
−
    -webkit-transform: translate(-143.823%, -17.9667vh) scale(0.9592);
+
−
    transform: translate(-143.823%, -17.9667vh) scale(0.9592);
+
−
  }
+
−
  14.62% {
+
−
    -webkit-transform: translate(-144.8889%, -18.3333vh) scale(0.9583);
+
−
    transform: translate(-144.8889%, -18.3333vh) scale(0.9583);
+
−
  }
+
−
  14.91% {
+
−
    -webkit-transform: translate(-145.8555%, -18.7vh) scale(0.9575);
+
−
    transform: translate(-145.8555%, -18.7vh) scale(0.9575);
+
−
  }
+
−
  15.2% {
+
−
    -webkit-transform: translate(-146.7221%, -19.0667vh) scale(0.9567);
+
−
    transform: translate(-146.7221%, -19.0667vh) scale(0.9567);
+
−
  }
+
−
  15.5% {
+
−
    -webkit-transform: translate(-147.4882%, -19.4333vh) scale(0.9558);
+
−
    transform: translate(-147.4882%, -19.4333vh) scale(0.9558);
+
−
  }
+
−
  15.79% {
+
−
    -webkit-transform: translate(-148.1533%, -19.8vh) scale(0.955);
+
−
    transform: translate(-148.1533%, -19.8vh) scale(0.955);
+
−
  }
+
−
  16.08% {
+
−
    -webkit-transform: translate(-148.7167%, -20.1667vh) scale(0.9542);
+
−
    transform: translate(-148.7167%, -20.1667vh) scale(0.9542);
+
−
  }
+
−
  16.37% {
+
−
    -webkit-transform: translate(-149.1783%, -20.5333vh) scale(0.9533);
+
−
    transform: translate(-149.1783%, -20.5333vh) scale(0.9533);
+
−
  }
+
−
  16.67% {
+
−
    -webkit-transform: translate(-149.5376%, -20.9vh) scale(0.9525);
+
−
    transform: translate(-149.5376%, -20.9vh) scale(0.9525);
+
−
  }
+
−
  16.96% {
+
−
    -webkit-transform: translate(-149.7944%, -21.2667vh) scale(0.9517);
+
−
    transform: translate(-149.7944%, -21.2667vh) scale(0.9517);
+
−
  }
+
−
  17.25% {
+
−
    -webkit-transform: translate(-149.9486%, -21.6333vh) scale(0.9508);
+
−
    transform: translate(-149.9486%, -21.6333vh) scale(0.9508);
+
−
  }
+
−
  17.54% {
+
−
    -webkit-transform: translate(-150%, -22vh) scale(0.95);
+
−
    transform: translate(-150%, -22vh) scale(0.95);
+
−
  }
+
−
  17.84% {
+
−
    -webkit-transform: translate(-149.9525%, -22.3772vh) scale(0.9491);
+
−
    transform: translate(-149.9525%, -22.3772vh) scale(0.9491);
+
−
  }
+
−
  18.13% {
+
−
    -webkit-transform: translate(-149.8102%, -22.7544vh) scale(0.9482);
+
−
    transform: translate(-149.8102%, -22.7544vh) scale(0.9482);
+
−
  }
+
−
  18.42% {
+
−
    -webkit-transform: translate(-149.5731%, -23.1316vh) scale(0.9474);
+
−
    transform: translate(-149.5731%, -23.1316vh) scale(0.9474);
+
−
  }
+
−
  18.71% {
+
−
    -webkit-transform: translate(-149.2413%, -23.5088vh) scale(0.9465);
+
−
    transform: translate(-149.2413%, -23.5088vh) scale(0.9465);
+
−
  }
+
−
  19.01% {
+
−
    -webkit-transform: translate(-148.8153%, -23.886vh) scale(0.9456);
+
−
    transform: translate(-148.8153%, -23.886vh) scale(0.9456);
+
−
  }
+
−
  19.3% {
+
−
    -webkit-transform: translate(-148.2952%, -24.2632vh) scale(0.9447);
+
−
    transform: translate(-148.2952%, -24.2632vh) scale(0.9447);
+
−
  }
+
−
  19.59% {
+
−
    -webkit-transform: translate(-147.6814%, -24.6404vh) scale(0.9439);
+
−
    transform: translate(-147.6814%, -24.6404vh) scale(0.9439);
+
−
  }
+
−
  19.88% {
+
−
    -webkit-transform: translate(-146.9745%, -25.0175vh) scale(0.943);
+
−
    transform: translate(-146.9745%, -25.0175vh) scale(0.943);
+
−
  }
+
−
  20.18% {
+
−
    -webkit-transform: translate(-146.175%, -25.3947vh) scale(0.9421);
+
−
    transform: translate(-146.175%, -25.3947vh) scale(0.9421);
+
−
  }
+
−
  20.47% {
+
−
    -webkit-transform: translate(-145.2835%, -25.7719vh) scale(0.9412);
+
−
    transform: translate(-145.2835%, -25.7719vh) scale(0.9412);
+
−
  }
+
−
  20.76% {
+
−
    -webkit-transform: translate(-144.3006%, -26.1491vh) scale(0.9404);
+
−
    transform: translate(-144.3006%, -26.1491vh) scale(0.9404);
+
−
  }
+
−
  21.05% {
+
−
    -webkit-transform: translate(-143.2272%, -26.5263vh) scale(0.9395);
+
−
    transform: translate(-143.2272%, -26.5263vh) scale(0.9395);
+
−
  }
+
−
  21.35% {
+
−
    -webkit-transform: translate(-142.0639%, -26.9035vh) scale(0.9386);
+
−
    transform: translate(-142.0639%, -26.9035vh) scale(0.9386);
+
−
  }
+
−
  21.64% {
+
−
    -webkit-transform: translate(-140.8118%, -27.2807vh) scale(0.9377);
+
−
    transform: translate(-140.8118%, -27.2807vh) scale(0.9377);
+
−
  }
+
−
  21.93% {
+
−
    -webkit-transform: translate(-139.4717%, -27.6579vh) scale(0.9368);
+
−
    transform: translate(-139.4717%, -27.6579vh) scale(0.9368);
+
−
  }
+
−
  22.22% {
+
−
    -webkit-transform: translate(-138.0446%, -28.0351vh) scale(0.936);
+
−
    transform: translate(-138.0446%, -28.0351vh) scale(0.936);
+
−
  }
+
−
  22.51% {
+
−
    -webkit-transform: translate(-136.5318%, -28.4123vh) scale(0.9351);
+
−
    transform: translate(-136.5318%, -28.4123vh) scale(0.9351);
+
−
  }
+
−
  22.81% {
+
−
    -webkit-transform: translate(-134.9342%, -28.7895vh) scale(0.9342);
+
−
    transform: translate(-134.9342%, -28.7895vh) scale(0.9342);
+
−
  }
+
−
  23.1% {
+
−
    -webkit-transform: translate(-133.2532%, -29.1667vh) scale(0.9333);
+
−
    transform: translate(-133.2532%, -29.1667vh) scale(0.9333);
+
−
  }
+
−
  23.39% {
+
−
    -webkit-transform: translate(-131.4899%, -29.5439vh) scale(0.9325);
+
−
    transform: translate(-131.4899%, -29.5439vh) scale(0.9325);
+
−
  }
+
−
  23.68% {
+
−
    -webkit-transform: translate(-129.6458%, -29.9211vh) scale(0.9316);
+
−
    transform: translate(-129.6458%, -29.9211vh) scale(0.9316);
+
−
  }
+
−
  23.98% {
+
−
    -webkit-transform: translate(-127.7222%, -30.2982vh) scale(0.9307);
+
−
    transform: translate(-127.7222%, -30.2982vh) scale(0.9307);
+
−
  }
+
−
  24.27% {
+
−
    -webkit-transform: translate(-125.7206%, -30.6754vh) scale(0.9298);
+
−
    transform: translate(-125.7206%, -30.6754vh) scale(0.9298);
+
−
  }
+
−
  24.56% {
+
−
    -webkit-transform: translate(-123.6426%, -31.0526vh) scale(0.9289);
+
−
    transform: translate(-123.6426%, -31.0526vh) scale(0.9289);
+
−
  }
+
−
  24.85% {
+
−
    -webkit-transform: translate(-121.4896%, -31.4298vh) scale(0.9281);
+
−
    transform: translate(-121.4896%, -31.4298vh) scale(0.9281);
+
−
  }
+
−
  25.15% {
+
−
    -webkit-transform: translate(-119.2633%, -31.807vh) scale(0.9272);
+
−
    transform: translate(-119.2633%, -31.807vh) scale(0.9272);
+
−
  }
+
−
  25.44% {
+
−
    -webkit-transform: translate(-116.9655%, -32.1842vh) scale(0.9263);
+
−
    transform: translate(-116.9655%, -32.1842vh) scale(0.9263);
+
−
  }
+
−
  25.73% {
+
−
    -webkit-transform: translate(-114.5978%, -32.5614vh) scale(0.9254);
+
−
    transform: translate(-114.5978%, -32.5614vh) scale(0.9254);
+
−
  }
+
−
  26.02% {
+
−
    -webkit-transform: translate(-112.1621%, -32.9386vh) scale(0.9246);
+
−
    transform: translate(-112.1621%, -32.9386vh) scale(0.9246);
+
−
  }
+
−
  26.32% {
+
−
    -webkit-transform: translate(-109.6602%, -33.3158vh) scale(0.9237);
+
−
    transform: translate(-109.6602%, -33.3158vh) scale(0.9237);
+
−
  }
+
−
  26.61% {
+
−
    -webkit-transform: translate(-107.094%, -33.693vh) scale(0.9228);
+
−
    transform: translate(-107.094%, -33.693vh) scale(0.9228);
+
−
  }
+
−
  26.9% {
+
−
    -webkit-transform: translate(-104.4655%, -34.0702vh) scale(0.9219);
+
−
    transform: translate(-104.4655%, -34.0702vh) scale(0.9219);
+
−
  }
+
−
  27.19% {
+
−
    -webkit-transform: translate(-101.7766%, -34.4474vh) scale(0.9211);
+
−
    transform: translate(-101.7766%, -34.4474vh) scale(0.9211);
+
−
  }
+
−
  27.49% {
+
−
    -webkit-transform: translate(-99.0294%, -34.8246vh) scale(0.9202);
+
−
    transform: translate(-99.0294%, -34.8246vh) scale(0.9202);
+
−
  }
+
−
  27.78% {
+
−
    -webkit-transform: translate(-96.226%, -35.2018vh) scale(0.9193);
+
−
    transform: translate(-96.226%, -35.2018vh) scale(0.9193);
+
−
  }
+
−
  28.07% {
+
−
    -webkit-transform: translate(-93.3685%, -35.5789vh) scale(0.9184);
+
−
    transform: translate(-93.3685%, -35.5789vh) scale(0.9184);
+
−
  }
+
−
  28.36% {
+
−
    -webkit-transform: translate(-90.4591%, -35.9561vh) scale(0.9175);
+
−
    transform: translate(-90.4591%, -35.9561vh) scale(0.9175);
+
−
  }
+
−
  28.65% {
+
−
    -webkit-transform: translate(-87.5%, -36.3333vh) scale(0.9167);
+
−
    transform: translate(-87.5%, -36.3333vh) scale(0.9167);
+
−
  }
+
−
  28.95% {
+
−
    -webkit-transform: translate(-84.4934%, -36.7105vh) scale(0.9158);
+
−
    transform: translate(-84.4934%, -36.7105vh) scale(0.9158);
+
−
  }
+
−
  29.24% {
+
−
    -webkit-transform: translate(-81.4417%, -37.0877vh) scale(0.9149);
+
−
    transform: translate(-81.4417%, -37.0877vh) scale(0.9149);
+
−
  }
+
−
  29.53% {
+
−
    -webkit-transform: translate(-78.3471%, -37.4649vh) scale(0.914);
+
−
    transform: translate(-78.3471%, -37.4649vh) scale(0.914);
+
−
  }
+
−
  29.82% {
+
−
    -webkit-transform: translate(-75.2119%, -37.8421vh) scale(0.9132);
+
−
    transform: translate(-75.2119%, -37.8421vh) scale(0.9132);
+
−
  }
+
−
  30.12% {
+
−
    -webkit-transform: translate(-72.0387%, -38.2193vh) scale(0.9123);
+
−
    transform: translate(-72.0387%, -38.2193vh) scale(0.9123);
+
−
  }
+
−
  30.41% {
+
−
    -webkit-transform: translate(-68.8297%, -38.5965vh) scale(0.9114);
+
−
    transform: translate(-68.8297%, -38.5965vh) scale(0.9114);
+
−
  }
+
−
  30.7% {
+
−
    -webkit-transform: translate(-65.5874%, -38.9737vh) scale(0.9105);
+
−
    transform: translate(-65.5874%, -38.9737vh) scale(0.9105);
+
−
  }
+
−
  30.99% {
+
−
    -webkit-transform: translate(-62.3144%, -39.3509vh) scale(0.9096);
+
−
    transform: translate(-62.3144%, -39.3509vh) scale(0.9096);
+
−
  }
+
−
  31.29% {
+
−
    -webkit-transform: translate(-59.0129%, -39.7281vh) scale(0.9088);
+
−
    transform: translate(-59.0129%, -39.7281vh) scale(0.9088);
+
−
  }
+
−
  31.58% {
+
−
    -webkit-transform: translate(-55.6857%, -40.1053vh) scale(0.9079);
+
−
    transform: translate(-55.6857%, -40.1053vh) scale(0.9079);
+
−
  }
+
−
  31.87% {
+
−
    -webkit-transform: translate(-52.3351%, -40.4825vh) scale(0.907);
+
−
    transform: translate(-52.3351%, -40.4825vh) scale(0.907);
+
−
  }
+
−
  32.16% {
+
−
    -webkit-transform: translate(-48.9638%, -40.8596vh) scale(0.9061);
+
−
    transform: translate(-48.9638%, -40.8596vh) scale(0.9061);
+
−
  }
+
−
  32.46% {
+
−
    -webkit-transform: translate(-45.5743%, -41.2368vh) scale(0.9053);
+
−
    transform: translate(-45.5743%, -41.2368vh) scale(0.9053);
+
−
  }
+
−
  32.75% {
+
−
    -webkit-transform: translate(-42.1692%, -41.614vh) scale(0.9044);
+
−
    transform: translate(-42.1692%, -41.614vh) scale(0.9044);
+
−
  }
+
−
  33.04% {
+
−
    -webkit-transform: translate(-38.751%, -41.9912vh) scale(0.9035);
+
−
    transform: translate(-38.751%, -41.9912vh) scale(0.9035);
+
−
  }
+
−
  33.33% {
+
−
    -webkit-transform: translate(-35.3224%, -42.3684vh) scale(0.9026);
+
−
    transform: translate(-35.3224%, -42.3684vh) scale(0.9026);
+
−
  }
+
−
  33.63% {
+
−
    -webkit-transform: translate(-31.886%, -42.7456vh) scale(0.9018);
+
−
    transform: translate(-31.886%, -42.7456vh) scale(0.9018);
+
−
  }
+
−
  33.92% {
+
−
    -webkit-transform: translate(-28.4443%, -43.1228vh) scale(0.9009);
+
−
    transform: translate(-28.4443%, -43.1228vh) scale(0.9009);
+
−
  }
+
−
  34.21% {
+
−
    -webkit-transform: translate(-25%, -43.5vh) scale(0.9);
+
−
    transform: translate(-25%, -43.5vh) scale(0.9);
+
−
  }
+
−
  34.5% {
+
−
    -webkit-transform: translate(-21.5557%, -43.8772vh) scale(0.8991);
+
−
    transform: translate(-21.5557%, -43.8772vh) scale(0.8991);
+
−
  }
+
−
  34.8% {
+
−
    -webkit-transform: translate(-18.114%, -44.2544vh) scale(0.8982);
+
−
    transform: translate(-18.114%, -44.2544vh) scale(0.8982);
+
−
  }
+
−
  35.09% {
+
−
    -webkit-transform: translate(-14.6776%, -44.6316vh) scale(0.8974);
+
−
    transform: translate(-14.6776%, -44.6316vh) scale(0.8974);
+
−
  }
+
−
  35.38% {
+
−
    -webkit-transform: translate(-11.249%, -45.0088vh) scale(0.8965);
+
−
    transform: translate(-11.249%, -45.0088vh) scale(0.8965);
+
−
  }
+
−
  35.67% {
+
−
    -webkit-transform: translate(-7.8308%, -45.386vh) scale(0.8956);
+
−
    transform: translate(-7.8308%, -45.386vh) scale(0.8956);
+
−
  }
+
−
  35.96% {
+
−
    -webkit-transform: translate(-4.4257%, -45.7632vh) scale(0.8947);
+
−
    transform: translate(-4.4257%, -45.7632vh) scale(0.8947);
+
−
  }
+
−
  36.26% {
+
−
    -webkit-transform: translate(-1.0362%, -46.1404vh) scale(0.8939);
+
−
    transform: translate(-1.0362%, -46.1404vh) scale(0.8939);
+
−
  }
+
−
  36.55% {
+
−
    -webkit-transform: translate(2.3351%, -46.5175vh) scale(0.893);
+
−
    transform: translate(2.3351%, -46.5175vh) scale(0.893);
+
−
  }
+
−
  36.84% {
+
−
    -webkit-transform: translate(5.6857%, -46.8947vh) scale(0.8921);
+
−
    transform: translate(5.6857%, -46.8947vh) scale(0.8921);
+
−
  }
+
−
  37.13% {
+
−
    -webkit-transform: translate(9.0129%, -47.2719vh) scale(0.8912);
+
−
    transform: translate(9.0129%, -47.2719vh) scale(0.8912);
+
−
  }
+
−
  37.43% {
+
−
    -webkit-transform: translate(12.3144%, -47.6491vh) scale(0.8904);
+
−
    transform: translate(12.3144%, -47.6491vh) scale(0.8904);
+
−
  }
+
−
  37.72% {
+
−
    -webkit-transform: translate(15.5874%, -48.0263vh) scale(0.8895);
+
−
    transform: translate(15.5874%, -48.0263vh) scale(0.8895);
+
−
  }
+
−
  38.01% {
+
−
    -webkit-transform: translate(18.8297%, -48.4035vh) scale(0.8886);
+
−
    transform: translate(18.8297%, -48.4035vh) scale(0.8886);
+
−
  }
+
−
  38.3% {
+
−
    -webkit-transform: translate(22.0387%, -48.7807vh) scale(0.8877);
+
−
    transform: translate(22.0387%, -48.7807vh) scale(0.8877);
+
−
  }
+
−
  38.6% {
+
−
    -webkit-transform: translate(25.2119%, -49.1579vh) scale(0.8868);
+
−
    transform: translate(25.2119%, -49.1579vh) scale(0.8868);
+
−
  }
+
−
  38.89% {
+
−
    -webkit-transform: translate(28.3471%, -49.5351vh) scale(0.886);
+
−
    transform: translate(28.3471%, -49.5351vh) scale(0.886);
+
−
  }
+
−
  39.18% {
+
−
    -webkit-transform: translate(31.4417%, -49.9123vh) scale(0.8851);
+
−
    transform: translate(31.4417%, -49.9123vh) scale(0.8851);
+
−
  }
+
−
  39.47% {
+
−
    -webkit-transform: translate(34.4934%, -50.2895vh) scale(0.8842);
+
−
    transform: translate(34.4934%, -50.2895vh) scale(0.8842);
+
−
  }
+
−
  39.77% {
+
−
    -webkit-transform: translate(37.5%, -50.6667vh) scale(0.8833);
+
−
    transform: translate(37.5%, -50.6667vh) scale(0.8833);
+
−
  }
+
−
  40.06% {
+
−
    -webkit-transform: translate(40.4591%, -51.0439vh) scale(0.8825);
+
−
    transform: translate(40.4591%, -51.0439vh) scale(0.8825);
+
−
  }
+
−
  40.35% {
+
−
    -webkit-transform: translate(43.3685%, -51.4211vh) scale(0.8816);
+
−
    transform: translate(43.3685%, -51.4211vh) scale(0.8816);
+
−
  }
+
−
  40.64% {
+
−
    -webkit-transform: translate(46.226%, -51.7982vh) scale(0.8807);
+
−
    transform: translate(46.226%, -51.7982vh) scale(0.8807);
+
−
  }
+
−
  40.94% {
+
−
    -webkit-transform: translate(49.0294%, -52.1754vh) scale(0.8798);
+
−
    transform: translate(49.0294%, -52.1754vh) scale(0.8798);
+
−
  }
+
−
  41.23% {
+
−
    -webkit-transform: translate(51.7766%, -52.5526vh) scale(0.8789);
+
−
    transform: translate(51.7766%, -52.5526vh) scale(0.8789);
+
−
  }
+
−
  41.52% {
+
−
    -webkit-transform: translate(54.4655%, -52.9298vh) scale(0.8781);
+
−
    transform: translate(54.4655%, -52.9298vh) scale(0.8781);
+
−
  }
+
−
  41.81% {
+
−
    -webkit-transform: translate(57.094%, -53.307vh) scale(0.8772);
+
−
    transform: translate(57.094%, -53.307vh) scale(0.8772);
+
−
  }
+
−
  42.11% {
+
−
    -webkit-transform: translate(59.6602%, -53.6842vh) scale(0.8763);
+
−
    transform: translate(59.6602%, -53.6842vh) scale(0.8763);
+
−
  }
+
−
  42.4% {
+
−
    -webkit-transform: translate(62.1621%, -54.0614vh) scale(0.8754);
+
−
    transform: translate(62.1621%, -54.0614vh) scale(0.8754);
+
−
  }
+
−
  42.69% {
+
−
    -webkit-transform: translate(64.5978%, -54.4386vh) scale(0.8746);
+
−
    transform: translate(64.5978%, -54.4386vh) scale(0.8746);
+
−
  }
+
−
  42.98% {
+
−
    -webkit-transform: translate(66.9655%, -54.8158vh) scale(0.8737);
+
−
    transform: translate(66.9655%, -54.8158vh) scale(0.8737);
+
−
  }
+
−
  43.27% {
+
−
    -webkit-transform: translate(69.2633%, -55.193vh) scale(0.8728);
+
−
    transform: translate(69.2633%, -55.193vh) scale(0.8728);
+
−
  }
+
−
  43.57% {
+
−
    -webkit-transform: translate(71.4896%, -55.5702vh) scale(0.8719);
+
−
    transform: translate(71.4896%, -55.5702vh) scale(0.8719);
+
−
  }
+
−
  43.86% {
+
−
    -webkit-transform: translate(73.6426%, -55.9474vh) scale(0.8711);
+
−
    transform: translate(73.6426%, -55.9474vh) scale(0.8711);
+
−
  }
+
−
  44.15% {
+
−
    -webkit-transform: translate(75.7206%, -56.3246vh) scale(0.8702);
+
−
    transform: translate(75.7206%, -56.3246vh) scale(0.8702);
+
−
  }
+
−
  44.44% {
+
−
    -webkit-transform: translate(77.7222%, -56.7018vh) scale(0.8693);
+
−
    transform: translate(77.7222%, -56.7018vh) scale(0.8693);
+
−
  }
+
−
  44.74% {
+
−
    -webkit-transform: translate(79.6458%, -57.0789vh) scale(0.8684);
+
−
    transform: translate(79.6458%, -57.0789vh) scale(0.8684);
+
−
  }
+
−
  45.03% {
+
−
    -webkit-transform: translate(81.4899%, -57.4561vh) scale(0.8675);
+
−
    transform: translate(81.4899%, -57.4561vh) scale(0.8675);
+
−
  }
+
−
  45.32% {
+
−
    -webkit-transform: translate(83.2532%, -57.8333vh) scale(0.8667);
+
−
    transform: translate(83.2532%, -57.8333vh) scale(0.8667);
+
−
  }
+
−
  45.61% {
+
−
    -webkit-transform: translate(84.9342%, -58.2105vh) scale(0.8658);
+
−
    transform: translate(84.9342%, -58.2105vh) scale(0.8658);
+
−
  }
+
−
  45.91% {
+
−
    -webkit-transform: translate(86.5318%, -58.5877vh) scale(0.8649);
+
−
    transform: translate(86.5318%, -58.5877vh) scale(0.8649);
+
−
  }
+
−
  46.2% {
+
−
    -webkit-transform: translate(88.0446%, -58.9649vh) scale(0.864);
+
−
    transform: translate(88.0446%, -58.9649vh) scale(0.864);
+
−
  }
+
−
  46.49% {
+
−
    -webkit-transform: translate(89.4717%, -59.3421vh) scale(0.8632);
+
−
    transform: translate(89.4717%, -59.3421vh) scale(0.8632);
+
−
  }
+
−
  46.78% {
+
−
    -webkit-transform: translate(90.8118%, -59.7193vh) scale(0.8623);
+
−
    transform: translate(90.8118%, -59.7193vh) scale(0.8623);
+
−
  }
+
−
  47.08% {
+
−
    -webkit-transform: translate(92.0639%, -60.0965vh) scale(0.8614);
+
−
    transform: translate(92.0639%, -60.0965vh) scale(0.8614);
+
−
  }
+
−
  47.37% {
+
−
    -webkit-transform: translate(93.2272%, -60.4737vh) scale(0.8605);
+
−
    transform: translate(93.2272%, -60.4737vh) scale(0.8605);
+
−
  }
+
−
  47.66% {
+
−
    -webkit-transform: translate(94.3006%, -60.8509vh) scale(0.8596);
+
−
    transform: translate(94.3006%, -60.8509vh) scale(0.8596);
+
−
  }
+
−
  47.95% {
+
−
    -webkit-transform: translate(95.2835%, -61.2281vh) scale(0.8588);
+
−
    transform: translate(95.2835%, -61.2281vh) scale(0.8588);
+
−
  }
+
−
  48.25% {
+
−
    -webkit-transform: translate(96.175%, -61.6053vh) scale(0.8579);
+
−
    transform: translate(96.175%, -61.6053vh) scale(0.8579);
+
−
  }
+
−
  48.54% {
+
−
    -webkit-transform: translate(96.9745%, -61.9825vh) scale(0.857);
+
−
    transform: translate(96.9745%, -61.9825vh) scale(0.857);
+
−
  }
+
−
  48.83% {
+
−
    -webkit-transform: translate(97.6814%, -62.3596vh) scale(0.8561);
+
−
    transform: translate(97.6814%, -62.3596vh) scale(0.8561);
+
−
  }
+
−
  49.12% {
+
−
    -webkit-transform: translate(98.2952%, -62.7368vh) scale(0.8553);
+
−
    transform: translate(98.2952%, -62.7368vh) scale(0.8553);
+
−
  }
+
−
  49.42% {
+
−
    -webkit-transform: translate(98.8153%, -63.114vh) scale(0.8544);
+
−
    transform: translate(98.8153%, -63.114vh) scale(0.8544);
+
−
  }
+
−
  49.71% {
+
−
    -webkit-transform: translate(99.2413%, -63.4912vh) scale(0.8535);
+
−
    transform: translate(99.2413%, -63.4912vh) scale(0.8535);
+
−
  }
+
−
  50% {
+
−
    -webkit-transform: translate(99.5731%, -63.8684vh) scale(0.8526);
+
−
    transform: translate(99.5731%, -63.8684vh) scale(0.8526);
+
−
  }
+
−
  50.29% {
+
−
    -webkit-transform: translate(99.8102%, -64.2456vh) scale(0.8518);
+
−
    transform: translate(99.8102%, -64.2456vh) scale(0.8518);
+
−
  }
+
−
  50.58% {
+
−
    -webkit-transform: translate(99.9525%, -64.6228vh) scale(0.8509);
+
−
    transform: translate(99.9525%, -64.6228vh) scale(0.8509);
+
−
  }
+
−
  50.88% {
+
−
    -webkit-transform: translate(100%, -65vh) scale(0.85);
+
−
    transform: translate(100%, -65vh) scale(0.85);
+
−
  }
+
−
  51.17% {
+
−
    -webkit-transform: translate(99.9715%, -65.3772vh) scale(0.8496);
+
−
    transform: translate(99.9715%, -65.3772vh) scale(0.8496);
+
−
  }
+
−
  51.46% {
+
−
    -webkit-transform: translate(99.8861%, -65.7544vh) scale(0.8491);
+
−
    transform: translate(99.8861%, -65.7544vh) scale(0.8491);
+
−
  }
+
−
  51.75% {
+
−
    -webkit-transform: translate(99.7438%, -66.1316vh) scale(0.8487);
+
−
    transform: translate(99.7438%, -66.1316vh) scale(0.8487);
+
−
  }
+
−
  52.05% {
+
−
    -webkit-transform: translate(99.5448%, -66.5088vh) scale(0.8482);
+
−
    transform: translate(99.5448%, -66.5088vh) scale(0.8482);
+
−
  }
+
−
  52.34% {
+
−
    -webkit-transform: translate(99.2892%, -66.886vh) scale(0.8478);
+
−
    transform: translate(99.2892%, -66.886vh) scale(0.8478);
+
−
  }
+
−
  52.63% {
+
−
    -webkit-transform: translate(98.9771%, -67.2632vh) scale(0.8474);
+
−
    transform: translate(98.9771%, -67.2632vh) scale(0.8474);
+
−
  }
+
−
  52.92% {
+
−
    -webkit-transform: translate(98.6089%, -67.6404vh) scale(0.8469);
+
−
    transform: translate(98.6089%, -67.6404vh) scale(0.8469);
+
−
  }
+
−
  53.22% {
+
−
    -webkit-transform: translate(98.1847%, -68.0175vh) scale(0.8465);
+
−
    transform: translate(98.1847%, -68.0175vh) scale(0.8465);
+
−
  }
+
−
  53.51% {
+
−
    -webkit-transform: translate(97.705%, -68.3947vh) scale(0.8461);
+
−
    transform: translate(97.705%, -68.3947vh) scale(0.8461);
+
−
  }
+
−
  53.8% {
+
−
    -webkit-transform: translate(97.1701%, -68.7719vh) scale(0.8456);
+
−
    transform: translate(97.1701%, -68.7719vh) scale(0.8456);
+
−
  }
+
−
  54.09% {
+
−
    -webkit-transform: translate(96.5804%, -69.1491vh) scale(0.8452);
+
−
    transform: translate(96.5804%, -69.1491vh) scale(0.8452);
+
−
  }
+
−
  54.39% {
+
−
    -webkit-transform: translate(95.9363%, -69.5263vh) scale(0.8447);
+
−
    transform: translate(95.9363%, -69.5263vh) scale(0.8447);
+
−
  }
+
−
  54.68% {
+
−
    -webkit-transform: translate(95.2383%, -69.9035vh) scale(0.8443);
+
−
    transform: translate(95.2383%, -69.9035vh) scale(0.8443);
+
−
  }
+
−
  54.97% {
+
−
    -webkit-transform: translate(94.4871%, -70.2807vh) scale(0.8439);
+
−
    transform: translate(94.4871%, -70.2807vh) scale(0.8439);
+
−
  }
+
−
  55.26% {
+
−
    -webkit-transform: translate(93.683%, -70.6579vh) scale(0.8434);
+
−
    transform: translate(93.683%, -70.6579vh) scale(0.8434);
+
−
  }
+
−
  55.56% {
+
−
    -webkit-transform: translate(92.8268%, -71.0351vh) scale(0.843);
+
−
    transform: translate(92.8268%, -71.0351vh) scale(0.843);
+
−
  }
+
−
  55.85% {
+
−
    -webkit-transform: translate(91.9191%, -71.4123vh) scale(0.8425);
+
−
    transform: translate(91.9191%, -71.4123vh) scale(0.8425);
+
−
  }
+
−
  56.14% {
+
−
    -webkit-transform: translate(90.9605%, -71.7895vh) scale(0.8421);
+
−
    transform: translate(90.9605%, -71.7895vh) scale(0.8421);
+
−
  }
+
−
  56.43% {
+
−
    -webkit-transform: translate(89.9519%, -72.1667vh) scale(0.8417);
+
−
    transform: translate(89.9519%, -72.1667vh) scale(0.8417);
+
−
  }
+
−
  56.73% {
+
−
    -webkit-transform: translate(88.894%, -72.5439vh) scale(0.8412);
+
−
    transform: translate(88.894%, -72.5439vh) scale(0.8412);
+
−
  }
+
−
  57.02% {
+
−
    -webkit-transform: translate(87.7875%, -72.9211vh) scale(0.8408);
+
−
    transform: translate(87.7875%, -72.9211vh) scale(0.8408);
+
−
  }
+
−
  57.31% {
+
−
    -webkit-transform: translate(86.6333%, -73.2982vh) scale(0.8404);
+
−
    transform: translate(86.6333%, -73.2982vh) scale(0.8404);
+
−
  }
+
−
  57.6% {
+
−
    -webkit-transform: translate(85.4324%, -73.6754vh) scale(0.8399);
+
−
    transform: translate(85.4324%, -73.6754vh) scale(0.8399);
+
−
  }
+
−
  57.89% {
+
−
    -webkit-transform: translate(84.1855%, -74.0526vh) scale(0.8395);
+
−
    transform: translate(84.1855%, -74.0526vh) scale(0.8395);
+
−
  }
+
−
  58.19% {
+
−
    -webkit-transform: translate(82.8937%, -74.4298vh) scale(0.839);
+
−
    transform: translate(82.8937%, -74.4298vh) scale(0.839);
+
−
  }
+
−
  58.48% {
+
−
    -webkit-transform: translate(81.558%, -74.807vh) scale(0.8386);
+
−
    transform: translate(81.558%, -74.807vh) scale(0.8386);
+
−
  }
+
−
  58.77% {
+
−
    -webkit-transform: translate(80.1793%, -75.1842vh) scale(0.8382);
+
−
    transform: translate(80.1793%, -75.1842vh) scale(0.8382);
+
−
  }
+
−
  59.06% {
+
−
    -webkit-transform: translate(78.7587%, -75.5614vh) scale(0.8377);
+
−
    transform: translate(78.7587%, -75.5614vh) scale(0.8377);
+
−
  }
+
−
  59.36% {
+
−
    -webkit-transform: translate(77.2973%, -75.9386vh) scale(0.8373);
+
−
    transform: translate(77.2973%, -75.9386vh) scale(0.8373);
+
−
  }
+
−
  59.65% {
+
−
    -webkit-transform: translate(75.7961%, -76.3158vh) scale(0.8368);
+
−
    transform: translate(75.7961%, -76.3158vh) scale(0.8368);
+
−
  }
+
−
  59.94% {
+
−
    -webkit-transform: translate(74.2564%, -76.693vh) scale(0.8364);
+
−
    transform: translate(74.2564%, -76.693vh) scale(0.8364);
+
−
  }
+
−
  60.23% {
+
−
    -webkit-transform: translate(72.6793%, -77.0702vh) scale(0.836);
+
−
    transform: translate(72.6793%, -77.0702vh) scale(0.836);
+
−
  }
+
−
  60.53% {
+
−
    -webkit-transform: translate(71.066%, -77.4474vh) scale(0.8355);
+
−
    transform: translate(71.066%, -77.4474vh) scale(0.8355);
+
−
  }
+
−
  60.82% {
+
−
    -webkit-transform: translate(69.4176%, -77.8246vh) scale(0.8351);
+
−
    transform: translate(69.4176%, -77.8246vh) scale(0.8351);
+
−
  }
+
−
  61.11% {
+
−
    -webkit-transform: translate(67.7356%, -78.2018vh) scale(0.8346);
+
−
    transform: translate(67.7356%, -78.2018vh) scale(0.8346);
+
−
  }
+
−
  61.4% {
+
−
    -webkit-transform: translate(66.0211%, -78.5789vh) scale(0.8342);
+
−
    transform: translate(66.0211%, -78.5789vh) scale(0.8342);
+
−
  }
+
−
  61.7% {
+
−
    -webkit-transform: translate(64.2755%, -78.9561vh) scale(0.8338);
+
−
    transform: translate(64.2755%, -78.9561vh) scale(0.8338);
+
−
  }
+
−
  61.99% {
+
−
    -webkit-transform: translate(62.5%, -79.3333vh) scale(0.8333);
+
−
    transform: translate(62.5%, -79.3333vh) scale(0.8333);
+
−
  }
+
−
  62.28% {
+
−
    -webkit-transform: translate(60.6961%, -79.7105vh) scale(0.8329);
+
−
    transform: translate(60.6961%, -79.7105vh) scale(0.8329);
+
−
  }
+
−
  62.57% {
+
−
    -webkit-transform: translate(58.865%, -80.0877vh) scale(0.8325);
+
−
    transform: translate(58.865%, -80.0877vh) scale(0.8325);
+
−
  }
+
−
  62.87% {
+
−
    -webkit-transform: translate(57.0082%, -80.4649vh) scale(0.832);
+
−
    transform: translate(57.0082%, -80.4649vh) scale(0.832);
+
−
  }
+
−
  63.16% {
+
−
    -webkit-transform: translate(55.1272%, -80.8421vh) scale(0.8316);
+
−
    transform: translate(55.1272%, -80.8421vh) scale(0.8316);
+
−
  }
+
−
  63.45% {
+
−
    -webkit-transform: translate(53.2232%, -81.2193vh) scale(0.8311);
+
−
    transform: translate(53.2232%, -81.2193vh) scale(0.8311);
+
−
  }
+
−
  63.74% {
+
−
    -webkit-transform: translate(51.2978%, -81.5965vh) scale(0.8307);
+
−
    transform: translate(51.2978%, -81.5965vh) scale(0.8307);
+
−
  }
+
−
  64.04% {
+
−
    -webkit-transform: translate(49.3525%, -81.9737vh) scale(0.8303);
+
−
    transform: translate(49.3525%, -81.9737vh) scale(0.8303);
+
−
  }
+
−
  64.33% {
+
−
    -webkit-transform: translate(47.3886%, -82.3509vh) scale(0.8298);
+
−
    transform: translate(47.3886%, -82.3509vh) scale(0.8298);
+
−
  }
+
−
  64.62% {
+
−
    -webkit-transform: translate(45.4078%, -82.7281vh) scale(0.8294);
+
−
    transform: translate(45.4078%, -82.7281vh) scale(0.8294);
+
−
  }
+
−
  64.91% {
+
−
    -webkit-transform: translate(43.4114%, -83.1053vh) scale(0.8289);
+
−
    transform: translate(43.4114%, -83.1053vh) scale(0.8289);
+
−
  }
+
−
  65.2% {
+
−
    -webkit-transform: translate(41.4011%, -83.4825vh) scale(0.8285);
+
−
    transform: translate(41.4011%, -83.4825vh) scale(0.8285);
+
−
  }
+
−
  65.5% {
+
−
    -webkit-transform: translate(39.3783%, -83.8596vh) scale(0.8281);
+
−
    transform: translate(39.3783%, -83.8596vh) scale(0.8281);
+
−
  }
+
−
  65.79% {
+
−
    -webkit-transform: translate(37.3446%, -84.2368vh) scale(0.8276);
+
−
    transform: translate(37.3446%, -84.2368vh) scale(0.8276);
+
−
  }
+
−
  66.08% {
+
−
    -webkit-transform: translate(35.3015%, -84.614vh) scale(0.8272);
+
−
    transform: translate(35.3015%, -84.614vh) scale(0.8272);
+
−
  }
+
−
  66.37% {
+
−
    -webkit-transform: translate(33.2506%, -84.9912vh) scale(0.8268);
+
−
    transform: translate(33.2506%, -84.9912vh) scale(0.8268);
+
−
  }
+
−
  66.67% {
+
−
    -webkit-transform: translate(31.1935%, -85.3684vh) scale(0.8263);
+
−
    transform: translate(31.1935%, -85.3684vh) scale(0.8263);
+
−
  }
+
−
  66.96% {
+
−
    -webkit-transform: translate(29.1316%, -85.7456vh) scale(0.8259);
+
−
    transform: translate(29.1316%, -85.7456vh) scale(0.8259);
+
−
  }
+
−
  67.25% {
+
−
    -webkit-transform: translate(27.0666%, -86.1228vh) scale(0.8254);
+
−
    transform: translate(27.0666%, -86.1228vh) scale(0.8254);
+
−
  }
+
−
  67.54% {
+
−
    -webkit-transform: translate(25%, -86.5vh) scale(0.825);
+
−
    transform: translate(25%, -86.5vh) scale(0.825);
+
−
  }
+
−
  67.84% {
+
−
    -webkit-transform: translate(22.9334%, -86.8772vh) scale(0.8246);
+
−
    transform: translate(22.9334%, -86.8772vh) scale(0.8246);
+
−
  }
+
−
  68.13% {
+
−
    -webkit-transform: translate(20.8684%, -87.2544vh) scale(0.8241);
+
−
    transform: translate(20.8684%, -87.2544vh) scale(0.8241);
+
−
  }
+
−
  68.42% {
+
−
    -webkit-transform: translate(18.8065%, -87.6316vh) scale(0.8237);
+
−
    transform: translate(18.8065%, -87.6316vh) scale(0.8237);
+
−
  }
+
−
  68.71% {
+
−
    -webkit-transform: translate(16.7494%, -88.0088vh) scale(0.8232);
+
−
    transform: translate(16.7494%, -88.0088vh) scale(0.8232);
+
−
  }
+
−
  69.01% {
+
−
    -webkit-transform: translate(14.6985%, -88.386vh) scale(0.8228);
+
−
    transform: translate(14.6985%, -88.386vh) scale(0.8228);
+
−
  }
+
−
  69.3% {
+
−
    -webkit-transform: translate(12.6554%, -88.7632vh) scale(0.8224);
+
−
    transform: translate(12.6554%, -88.7632vh) scale(0.8224);
+
−
  }
+
−
  69.59% {
+
−
    -webkit-transform: translate(10.6217%, -89.1404vh) scale(0.8219);
+
−
    transform: translate(10.6217%, -89.1404vh) scale(0.8219);
+
−
  }
+
−
  69.88% {
+
−
    -webkit-transform: translate(8.5989%, -89.5175vh) scale(0.8215);
+
−
    transform: translate(8.5989%, -89.5175vh) scale(0.8215);
+
−
  }
+
−
  70.18% {
+
−
    -webkit-transform: translate(6.5886%, -89.8947vh) scale(0.8211);
+
−
    transform: translate(6.5886%, -89.8947vh) scale(0.8211);
+
−
  }
+
−
  70.47% {
+
−
    -webkit-transform: translate(4.5922%, -90.2719vh) scale(0.8206);
+
−
    transform: translate(4.5922%, -90.2719vh) scale(0.8206);
+
−
  }
+
−
  70.76% {
+
−
    -webkit-transform: translate(2.6114%, -90.6491vh) scale(0.8202);
+
−
    transform: translate(2.6114%, -90.6491vh) scale(0.8202);
+
−
  }
+
−
  71.05% {
+
−
    -webkit-transform: translate(0.6475%, -91.0263vh) scale(0.8197);
+
−
    transform: translate(0.6475%, -91.0263vh) scale(0.8197);
+
−
  }
+
−
  71.35% {
+
−
    -webkit-transform: translate(-1.2978%, -91.4035vh) scale(0.8193);
+
−
    transform: translate(-1.2978%, -91.4035vh) scale(0.8193);
+
−
  }
+
−
  71.64% {
+
−
    -webkit-transform: translate(-3.2232%, -91.7807vh) scale(0.8189);
+
−
    transform: translate(-3.2232%, -91.7807vh) scale(0.8189);
+
−
  }
+
−
  71.93% {
+
−
    -webkit-transform: translate(-5.1272%, -92.1579vh) scale(0.8184);
+
−
    transform: translate(-5.1272%, -92.1579vh) scale(0.8184);
+
−
  }
+
−
  72.22% {
+
−
    -webkit-transform: translate(-7.0082%, -92.5351vh) scale(0.818);
+
−
    transform: translate(-7.0082%, -92.5351vh) scale(0.818);
+
−
  }
+
−
  72.51% {
+
−
    -webkit-transform: translate(-8.865%, -92.9123vh) scale(0.8175);
+
−
    transform: translate(-8.865%, -92.9123vh) scale(0.8175);
+
−
  }
+
−
  72.81% {
+
−
    -webkit-transform: translate(-10.6961%, -93.2895vh) scale(0.8171);
+
−
    transform: translate(-10.6961%, -93.2895vh) scale(0.8171);
+
−
  }
+
−
  73.1% {
+
−
    -webkit-transform: translate(-12.5%, -93.6667vh) scale(0.8167);
+
−
    transform: translate(-12.5%, -93.6667vh) scale(0.8167);
+
−
  }
+
−
  73.39% {
+
−
    -webkit-transform: translate(-14.2755%, -94.0439vh) scale(0.8162);
+
−
    transform: translate(-14.2755%, -94.0439vh) scale(0.8162);
+
−
  }
+
−
  73.68% {
+
−
    -webkit-transform: translate(-16.0211%, -94.4211vh) scale(0.8158);
+
−
    transform: translate(-16.0211%, -94.4211vh) scale(0.8158);
+
−
  }
+
−
  73.98% {
+
−
    -webkit-transform: translate(-17.7356%, -94.7982vh) scale(0.8154);
+
−
    transform: translate(-17.7356%, -94.7982vh) scale(0.8154);
+
−
  }
+
−
  74.27% {
+
−
    -webkit-transform: translate(-19.4176%, -95.1754vh) scale(0.8149);
+
−
    transform: translate(-19.4176%, -95.1754vh) scale(0.8149);
+
−
  }
+
−
  74.56% {
+
−
    -webkit-transform: translate(-21.066%, -95.5526vh) scale(0.8145);
+
−
    transform: translate(-21.066%, -95.5526vh) scale(0.8145);
+
−
  }
+
−
  74.85% {
+
−
    -webkit-transform: translate(-22.6793%, -95.9298vh) scale(0.814);
+
−
    transform: translate(-22.6793%, -95.9298vh) scale(0.814);
+
−
  }
+
−
  75.15% {
+
−
    -webkit-transform: translate(-24.2564%, -96.307vh) scale(0.8136);
+
−
    transform: translate(-24.2564%, -96.307vh) scale(0.8136);
+
−
  }
+
−
  75.44% {
+
−
    -webkit-transform: translate(-25.7961%, -96.6842vh) scale(0.8132);
+
−
    transform: translate(-25.7961%, -96.6842vh) scale(0.8132);
+
−
  }
+
−
  75.73% {
+
−
    -webkit-transform: translate(-27.2973%, -97.0614vh) scale(0.8127);
+
−
    transform: translate(-27.2973%, -97.0614vh) scale(0.8127);
+
−
  }
+
−
  76.02% {
+
−
    -webkit-transform: translate(-28.7587%, -97.4386vh) scale(0.8123);
+
−
    transform: translate(-28.7587%, -97.4386vh) scale(0.8123);
+
−
  }
+
−
  76.32% {
+
−
    -webkit-transform: translate(-30.1793%, -97.8158vh) scale(0.8118);
+
−
    transform: translate(-30.1793%, -97.8158vh) scale(0.8118);
+
−
  }
+
−
  76.61% {
+
−
    -webkit-transform: translate(-31.558%, -98.193vh) scale(0.8114);
+
−
    transform: translate(-31.558%, -98.193vh) scale(0.8114);
+
−
  }
+
−
  76.9% {
+
−
    -webkit-transform: translate(-32.8937%, -98.5702vh) scale(0.811);
+
−
    transform: translate(-32.8937%, -98.5702vh) scale(0.811);
+
−
  }
+
−
  77.19% {
+
−
    -webkit-transform: translate(-34.1855%, -98.9474vh) scale(0.8105);
+
−
    transform: translate(-34.1855%, -98.9474vh) scale(0.8105);
+
−
  }
+
−
  77.49% {
+
−
    -webkit-transform: translate(-35.4324%, -99.3246vh) scale(0.8101);
+
−
    transform: translate(-35.4324%, -99.3246vh) scale(0.8101);
+
−
  }
+
−
  77.78% {
+
−
    -webkit-transform: translate(-36.6333%, -99.7018vh) scale(0.8096);
+
−
    transform: translate(-36.6333%, -99.7018vh) scale(0.8096);
+
−
  }
+
−
  78.07% {
+
−
    -webkit-transform: translate(-37.7875%, -100.0789vh) scale(0.8092);
+
−
    transform: translate(-37.7875%, -100.0789vh) scale(0.8092);
+
−
  }
+
−
  78.36% {
+
−
    -webkit-transform: translate(-38.894%, -100.4561vh) scale(0.8088);
+
−
    transform: translate(-38.894%, -100.4561vh) scale(0.8088);
+
−
  }
+
−
  78.65% {
+
−
    -webkit-transform: translate(-39.9519%, -100.8333vh) scale(0.8083);
+
−
    transform: translate(-39.9519%, -100.8333vh) scale(0.8083);
+
−
  }
+
−
  78.95% {
+
−
    -webkit-transform: translate(-40.9605%, -101.2105vh) scale(0.8079);
+
−
    transform: translate(-40.9605%, -101.2105vh) scale(0.8079);
+
−
  }
+
−
  79.24% {
+
−
    -webkit-transform: translate(-41.9191%, -101.5877vh) scale(0.8075);
+
−
    transform: translate(-41.9191%, -101.5877vh) scale(0.8075);
+
−
  }
+
−
  79.53% {
+
−
    -webkit-transform: translate(-42.8268%, -101.9649vh) scale(0.807);
+
−
    transform: translate(-42.8268%, -101.9649vh) scale(0.807);
+
−
  }
+
−
  79.82% {
+
−
    -webkit-transform: translate(-43.683%, -102.3421vh) scale(0.8066);
+
−
    transform: translate(-43.683%, -102.3421vh) scale(0.8066);
+
−
  }
+
−
  80.12% {
+
−
    -webkit-transform: translate(-44.4871%, -102.7193vh) scale(0.8061);
+
−
    transform: translate(-44.4871%, -102.7193vh) scale(0.8061);
+
−
  }
+
−
  80.41% {
+
−
    -webkit-transform: translate(-45.2383%, -103.0965vh) scale(0.8057);
+
−
    transform: translate(-45.2383%, -103.0965vh) scale(0.8057);
+
−
  }
+
−
  80.7% {
+
−
    -webkit-transform: translate(-45.9363%, -103.4737vh) scale(0.8053);
+
−
    transform: translate(-45.9363%, -103.4737vh) scale(0.8053);
+
−
  }
+
−
  80.99% {
+
−
    -webkit-transform: translate(-46.5804%, -103.8509vh) scale(0.8048);
+
−
    transform: translate(-46.5804%, -103.8509vh) scale(0.8048);
+
−
  }
+
−
  81.29% {
+
−
    -webkit-transform: translate(-47.1701%, -104.2281vh) scale(0.8044);
+
−
    transform: translate(-47.1701%, -104.2281vh) scale(0.8044);
+
−
  }
+
−
  81.58% {
+
−
    -webkit-transform: translate(-47.705%, -104.6053vh) scale(0.8039);
+
−
    transform: translate(-47.705%, -104.6053vh) scale(0.8039);
+
−
  }
+
−
  81.87% {
+
−
    -webkit-transform: translate(-48.1847%, -104.9825vh) scale(0.8035);
+
−
    transform: translate(-48.1847%, -104.9825vh) scale(0.8035);
+
−
  }
+
−
  82.16% {
+
−
    -webkit-transform: translate(-48.6089%, -105.3596vh) scale(0.8031);
+
−
    transform: translate(-48.6089%, -105.3596vh) scale(0.8031);
+
−
  }
+
−
  82.46% {
+
−
    -webkit-transform: translate(-48.9771%, -105.7368vh) scale(0.8026);
+
−
    transform: translate(-48.9771%, -105.7368vh) scale(0.8026);
+
−
  }
+
−
  82.75% {
+
−
    -webkit-transform: translate(-49.2892%, -106.114vh) scale(0.8022);
+
−
    transform: translate(-49.2892%, -106.114vh) scale(0.8022);
+
−
  }
+
−
  83.04% {
+
−
    -webkit-transform: translate(-49.5448%, -106.4912vh) scale(0.8018);
+
−
    transform: translate(-49.5448%, -106.4912vh) scale(0.8018);
+
−
  }
+
−
  83.33% {
+
−
    -webkit-transform: translate(-49.7438%, -106.8684vh) scale(0.8013);
+
−
    transform: translate(-49.7438%, -106.8684vh) scale(0.8013);
+
−
  }
+
−
  83.63% {
+
−
    -webkit-transform: translate(-49.8861%, -107.2456vh) scale(0.8009);
+
−
    transform: translate(-49.8861%, -107.2456vh) scale(0.8009);
+
−
  }
+
−
  83.92% {
+
−
    -webkit-transform: translate(-49.9715%, -107.6228vh) scale(0.8004);
+
−
    transform: translate(-49.9715%, -107.6228vh) scale(0.8004);
+
−
  }
+
−
  84.21% {
+
−
    -webkit-transform: translate(-50%, -108vh) scale(0.8);
+
−
    transform: translate(-50%, -108vh) scale(0.8);
+
−
  }
+
−
  84.5% {
+
−
    -webkit-transform: translate(-49.9788%, -108.4074vh) scale(0.7981);
+
−
    transform: translate(-49.9788%, -108.4074vh) scale(0.7981);
+
−
  }
+
−
  84.8% {
+
−
    -webkit-transform: translate(-49.9154%, -108.8148vh) scale(0.7963);
+
−
    transform: translate(-49.9154%, -108.8148vh) scale(0.7963);
+
−
  }
+
−
  85.09% {
+
−
    -webkit-transform: translate(-49.8097%, -109.2222vh) scale(0.7944);
+
−
    transform: translate(-49.8097%, -109.2222vh) scale(0.7944);
+
−
  }
+
−
  85.38% {
+
−
    -webkit-transform: translate(-49.6619%, -109.6296vh) scale(0.7926);
+
−
    transform: translate(-49.6619%, -109.6296vh) scale(0.7926);
+
−
  }
+
−
  85.67% {
+
−
    -webkit-transform: translate(-49.4721%, -110.037vh) scale(0.7907);
+
−
    transform: translate(-49.4721%, -110.037vh) scale(0.7907);
+
−
  }
+
−
  85.96% {
+
−
    -webkit-transform: translate(-49.2404%, -110.4444vh) scale(0.7889);
+
−
    transform: translate(-49.2404%, -110.4444vh) scale(0.7889);
+
−
  }
+
−
  86.26% {
+
−
    -webkit-transform: translate(-48.967%, -110.8519vh) scale(0.787);
+
−
    transform: translate(-48.967%, -110.8519vh) scale(0.787);
+
−
  }
+
−
  86.55% {
+
−
    -webkit-transform: translate(-48.6522%, -111.2593vh) scale(0.7852);
+
−
    transform: translate(-48.6522%, -111.2593vh) scale(0.7852);
+
−
  }
+
−
  86.84% {
+
−
    -webkit-transform: translate(-48.2963%, -111.6667vh) scale(0.7833);
+
−
    transform: translate(-48.2963%, -111.6667vh) scale(0.7833);
+
−
  }
+
−
  87.13% {
+
−
    -webkit-transform: translate(-47.8995%, -112.0741vh) scale(0.7815);
+
−
    transform: translate(-47.8995%, -112.0741vh) scale(0.7815);
+
−
  }
+
−
  87.43% {
+
−
    -webkit-transform: translate(-47.4621%, -112.4815vh) scale(0.7796);
+
−
    transform: translate(-47.4621%, -112.4815vh) scale(0.7796);
+
−
  }
+
−
  87.72% {
+
−
    -webkit-transform: translate(-46.9846%, -112.8889vh) scale(0.7778);
+
−
    transform: translate(-46.9846%, -112.8889vh) scale(0.7778);
+
−
  }
+
−
  88.01% {
+
−
    -webkit-transform: translate(-46.4674%, -113.2963vh) scale(0.7759);
+
−
    transform: translate(-46.4674%, -113.2963vh) scale(0.7759);
+
−
  }
+
−
  88.3% {
+
−
    -webkit-transform: translate(-45.9108%, -113.7037vh) scale(0.7741);
+
−
    transform: translate(-45.9108%, -113.7037vh) scale(0.7741);
+
−
  }
+
−
  88.6% {
+
−
    -webkit-transform: translate(-45.3154%, -114.1111vh) scale(0.7722);
+
−
    transform: translate(-45.3154%, -114.1111vh) scale(0.7722);
+
−
  }
+
−
  88.89% {
+
−
    -webkit-transform: translate(-44.6816%, -114.5185vh) scale(0.7704);
+
−
    transform: translate(-44.6816%, -114.5185vh) scale(0.7704);
+
−
  }
+
−
  89.18% {
+
−
    -webkit-transform: translate(-44.0101%, -114.9259vh) scale(0.7685);
+
−
    transform: translate(-44.0101%, -114.9259vh) scale(0.7685);
+
−
  }
+
−
  89.47% {
+
−
    -webkit-transform: translate(-43.3013%, -115.3333vh) scale(0.7667);
+
−
    transform: translate(-43.3013%, -115.3333vh) scale(0.7667);
+
−
  }
+
−
  89.77% {
+
−
    -webkit-transform: translate(-42.5558%, -115.7407vh) scale(0.7648);
+
−
    transform: translate(-42.5558%, -115.7407vh) scale(0.7648);
+
−
  }
+
−
  90.06% {
+
−
    -webkit-transform: translate(-41.7744%, -116.1481vh) scale(0.763);
+
−
    transform: translate(-41.7744%, -116.1481vh) scale(0.763);
+
−
  }
+
−
  90.35% {
+
−
    -webkit-transform: translate(-40.9576%, -116.5556vh) scale(0.7611);
+
−
    transform: translate(-40.9576%, -116.5556vh) scale(0.7611);
+
−
  }
+
−
  90.64% {
+
−
    -webkit-transform: translate(-40.1062%, -116.963vh) scale(0.7593);
+
−
    transform: translate(-40.1062%, -116.963vh) scale(0.7593);
+
−
  }
+
−
  90.94% {
+
−
    -webkit-transform: translate(-39.2208%, -117.3704vh) scale(0.7574);
+
−
    transform: translate(-39.2208%, -117.3704vh) scale(0.7574);
+
−
  }
+
−
  91.23% {
+
−
    -webkit-transform: translate(-38.3022%, -117.7778vh) scale(0.7556);
+
−
    transform: translate(-38.3022%, -117.7778vh) scale(0.7556);
+
−
  }
+
−
  91.52% {
+
−
    -webkit-transform: translate(-37.3513%, -118.1852vh) scale(0.7537);
+
−
    transform: translate(-37.3513%, -118.1852vh) scale(0.7537);
+
−
  }
+
−
  91.81% {
+
−
    -webkit-transform: translate(-36.3687%, -118.5926vh) scale(0.7519);
+
−
    transform: translate(-36.3687%, -118.5926vh) scale(0.7519);
+
−
  }
+
−
  92.11% {
+
−
    -webkit-transform: translate(-35.3553%, -119vh) scale(0.75);
+
−
    transform: translate(-35.3553%, -119vh) scale(0.75);
+
−
  }
+
−
  92.4% {
+
−
    -webkit-transform: translate(-34.3121%, -119.4074vh) scale(0.7481);
+
−
    transform: translate(-34.3121%, -119.4074vh) scale(0.7481);
+
−
  }
+
−
  92.69% {
+
−
    -webkit-transform: translate(-33.2398%, -119.8148vh) scale(0.7463);
+
−
    transform: translate(-33.2398%, -119.8148vh) scale(0.7463);
+
−
  }
+
−
  92.98% {
+
−
    -webkit-transform: translate(-32.1394%, -120.2222vh) scale(0.7444);
+
−
    transform: translate(-32.1394%, -120.2222vh) scale(0.7444);
+
−
  }
+
−
  93.27% {
+
−
    -webkit-transform: translate(-31.0118%, -120.6296vh) scale(0.7426);
+
−
    transform: translate(-31.0118%, -120.6296vh) scale(0.7426);
+
−
  }
+
−
  93.57% {
+
−
    -webkit-transform: translate(-29.8579%, -121.037vh) scale(0.7407);
+
−
    transform: translate(-29.8579%, -121.037vh) scale(0.7407);
+
−
  }
+
−
  93.86% {
+
−
    -webkit-transform: translate(-28.6788%, -121.4444vh) scale(0.7389);
+
−
    transform: translate(-28.6788%, -121.4444vh) scale(0.7389);
+
−
  }
+
−
  94.15% {
+
−
    -webkit-transform: translate(-27.4754%, -121.8519vh) scale(0.737);
+
−
    transform: translate(-27.4754%, -121.8519vh) scale(0.737);
+
−
  }
+
−
  94.44% {
+
−
    -webkit-transform: translate(-26.2488%, -122.2593vh) scale(0.7352);
+
−
    transform: translate(-26.2488%, -122.2593vh) scale(0.7352);
+
−
  }
+
−
  94.74% {
+
−
    -webkit-transform: translate(-25%, -122.6667vh) scale(0.7333);
+
−
    transform: translate(-25%, -122.6667vh) scale(0.7333);
+
−
  }
+
−
  95.03% {
+
−
    -webkit-transform: translate(-23.73%, -123.0741vh) scale(0.7315);
+
−
    transform: translate(-23.73%, -123.0741vh) scale(0.7315);
+
−
  }
+
−
  95.32% {
+
−
    -webkit-transform: translate(-22.44%, -123.4815vh) scale(0.7296);
+
−
    transform: translate(-22.44%, -123.4815vh) scale(0.7296);
+
−
  }
+
−
  95.61% {
+
−
    -webkit-transform: translate(-21.1309%, -123.8889vh) scale(0.7278);
+
−
    transform: translate(-21.1309%, -123.8889vh) scale(0.7278);
+
−
  }
+
−
  95.91% {
+
−
    -webkit-transform: translate(-19.804%, -124.2963vh) scale(0.7259);
+
−
    transform: translate(-19.804%, -124.2963vh) scale(0.7259);
+
−
  }
+
−
  96.2% {
+
−
    -webkit-transform: translate(-18.4603%, -124.7037vh) scale(0.7241);
+
−
    transform: translate(-18.4603%, -124.7037vh) scale(0.7241);
+
−
  }
+
−
  96.49% {
+
−
    -webkit-transform: translate(-17.101%, -125.1111vh) scale(0.7222);
+
−
    transform: translate(-17.101%, -125.1111vh) scale(0.7222);
+
−
  }
+
−
  96.78% {
+
−
    -webkit-transform: translate(-15.7272%, -125.5185vh) scale(0.7204);
+
−
    transform: translate(-15.7272%, -125.5185vh) scale(0.7204);
+
−
  }
+
−
  97.08% {
+
−
    -webkit-transform: translate(-14.3402%, -125.9259vh) scale(0.7185);
+
−
    transform: translate(-14.3402%, -125.9259vh) scale(0.7185);
+
−
  }
+
−
  97.37% {
+
−
    -webkit-transform: translate(-12.941%, -126.3333vh) scale(0.7167);
+
−
    transform: translate(-12.941%, -126.3333vh) scale(0.7167);
+
−
  }
+
−
  97.66% {
+
−
    -webkit-transform: translate(-11.5308%, -126.7407vh) scale(0.7148);
+
−
    transform: translate(-11.5308%, -126.7407vh) scale(0.7148);
+
−
  }
+
−
  97.95% {
+
−
    -webkit-transform: translate(-10.1109%, -127.1481vh) scale(0.713);
+
−
    transform: translate(-10.1109%, -127.1481vh) scale(0.713);
+
−
  }
+
−
  98.25% {
+
−
    -webkit-transform: translate(-8.6824%, -127.5556vh) scale(0.7111);
+
−
    transform: translate(-8.6824%, -127.5556vh) scale(0.7111);
+
−
  }
+
−
  98.54% {
+
−
    -webkit-transform: translate(-7.2466%, -127.963vh) scale(0.7093);
+
−
    transform: translate(-7.2466%, -127.963vh) scale(0.7093);
+
−
  }
+
−
  98.83% {
+
−
    -webkit-transform: translate(-5.8046%, -128.3704vh) scale(0.7074);
+
−
    transform: translate(-5.8046%, -128.3704vh) scale(0.7074);
+
−
  }
+
−
  99.12% {
+
−
    -webkit-transform: translate(-4.3578%, -128.7778vh) scale(0.7056);
+
−
    transform: translate(-4.3578%, -128.7778vh) scale(0.7056);
+
−
  }
+
−
  99.42% {
+
−
    -webkit-transform: translate(-2.9072%, -129.1852vh) scale(0.7037);
+
−
    transform: translate(-2.9072%, -129.1852vh) scale(0.7037);
+
−
  }
+
−
  99.71% {
+
−
    -webkit-transform: translate(-1.4542%, -129.5926vh) scale(0.7019);
+
−
    transform: translate(-1.4542%, -129.5926vh) scale(0.7019);
+
−
  }
+
−
  100% {
+
−
    -webkit-transform: translate(0%, -130vh) scale(0.7);
+
−
    transform: translate(0%, -130vh) scale(0.7);
+
−
  }
+
 
}
 
}
  
 
/***********************************************************************************************************************************************************/
 
/***********************************************************************************************************************************************************/
 +
/* Model */
 +
.popout.chapter {
 +
  margin: 5px auto;
 +
  -webkit-transition: all 0.6s;
 +
  transition: all 0.6s;
 +
  text-align: justify;
 +
}
  
−
/* Responsiveness*/
+
.popout.chapter.revealed {
 +
  max-width: 930px;
 +
  margin: 15px auto;
 +
}
  
−
/* Global */
+
.popout.chapter .collapsible {
 +
  font-size: 35px;
 +
}
  
 +
.popout.chapter .collapsibleContent.revealed {
 +
  -webkit-transition: all 0.6s;
 +
  transition: all 0.6s;
 +
  overflow-x: hidden;
 +
}
 +
 +
span.eq span.katex-display {
 +
  /* margin-bottom: 25px; */
 +
}
 +
 +
span.inline-eq {
 +
  font-size: 0.9em;
 +
}
 +
 +
div#plot1 {
 +
  height: 500px;
 +
  margin: 0 auto;
 +
}
 +
 +
figure.resultfig {
 +
  width: 100%;
 +
  margin: 40px auto;
 +
  padding: 0 40px;
 +
  overflow-y: hidden;
 +
}
 +
 +
figure.resultfig.vertical {
 +
  width: 50%;
 +
}
 +
 +
figure.resultfig.horizontal {
 +
  width: 80%;
 +
}
 +
 +
figure.resultfig.wide {
 +
  padding: 0;
 +
}
 +
 +
figure.resultfig img {
 +
  width: 100%;
 +
}
 +
 +
figure#realisationPic {
 +
  position: relative;
 +
  width: 100%;
 +
  height: 400px;
 +
  overflow-x: auto;
 +
  background-image:
 +
    -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), color-stop(70%, #fdfdfd)),
 +
    -webkit-gradient(linear, right top, left top, color-stop(30%, #fdfdfd), to(rgba(255, 255, 255, 0))),
 +
    radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0)),
 +
    radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0));
 +
  background-image:
 +
    linear-gradient(to left, rgba(255, 255, 255, 0), #fdfdfd 70%),
 +
    linear-gradient(to left, #fdfdfd 30%, rgba(255, 255, 255, 0)),
 +
    radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0)),
 +
    radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0));
 +
  background-position: 0 50%, 100% 50%, 0 50%, 100% 50%;
 +
  background-repeat: no-repeat;
 +
  background-color: #fdfdfd;
 +
  background-size: 50px 400px, 50px 400px, 15px 400px, 15px 400px;
 +
  background-attachment: local, local, scroll, scroll;
 +
}
 +
 +
figure#realisationPic>img {
 +
  height: 100%;
 +
  width: auto;
 +
}
 +
 +
div.FigFlexbox {
 +
  display: -webkit-box;
 +
  display: -ms-flexbox;
 +
  display: flex;
 +
  -webkit-box-orient: horizontal;
 +
  -webkit-box-direction: normal;
 +
  -ms-flex-flow: row wrap;
 +
  flex-flow: row wrap;
 +
  -webkit-box-pack: center;
 +
  -ms-flex-pack: center;
 +
  justify-content: center;
 +
}
 +
 +
.FigFlexbox .flexfig {
 +
  width: 50%;
 +
}
 +
 +
.FigFlexbox .flexfig.smallSize {
 +
  width: 50%;
 +
  min-width: 200px;
 +
  max-width: 259px;
 +
}
 +
 +
.FigFlexbox .flexText {
 +
  width: 50%;
 +
  min-width: 250px;
 +
}
 +
 +
.FigFlexbox .flexText {
 +
  padding: 0 10px;
 +
  border-bottom: 1px solid grey;
 +
}
 +
 +
figcaption, caption {
 +
  font-size: 0.8em;
 +
  text-align: justify;
 +
  padding-top: 10px;
 +
}
 +
 +
table caption {
 +
  padding-bottom: 10px;
 +
  padding-top: 0;
 +
}
 +
 +
figcaption b, caption b {
 +
  font-family: Kopje;
 +
}
 +
 +
figure div.plot-container.plotly div.svg-container {
 +
  margin-top: -70px;
 +
}
 +
 +
/***********************************************************************************************************************************************************/
 +
/* Custom-made igem icons */
 +
.icon {
 +
  /* use !important to prevent issues with browser extensions that change fonts */
 +
  font-family: 'iGEMLeidenIcons' !important;
 +
  speak: none;
 +
  display: inline-block;
 +
  font-style: normal;
 +
  font-weight: normal;
 +
  font-variant: normal;
 +
  text-transform: none;
 +
  line-height: 1;
 +
  /* Better Font Rendering =========== */
 +
  -webkit-font-smoothing: antialiased;
 +
  -moz-osx-font-smoothing: grayscale;
 +
}
 +
 +
.icon.Applied-design:before {
 +
  content: "\e90a";
 +
}
 +
 +
.icon.Attributions:before {
 +
  content: "\e900";
 +
}
 +
 +
.icon.Demonstration:before {
 +
  content: "\e901";
 +
}
 +
 +
.icon.Entrepreneurship:before {
 +
  content: "\e902";
 +
}
 +
 +
.icon.Home-iGEM:before {
 +
  content: "\e903";
 +
}
 +
 +
.icon.Model:before {
 +
  content: "\e904";
 +
}
 +
 +
.icon.Notebook:before {
 +
  content: "\e905";
 +
}
 +
 +
.icon.PE-E:before {
 +
  content: "\e906";
 +
}
 +
 +
.icon.Project-description:before {
 +
  content: "\e907";
 +
}
 +
 +
.icon.Protocols:before {
 +
  content: "\e908";
 +
}
 +
 +
.icon.Results:before {
 +
  content: "\e909";
 +
}
 +
 +
/***********************************************************************************************************************************************************/
 +
/* Responsiveness*/
 +
/* Global */
 
@media (max-width: 768px) {
 
@media (max-width: 768px) {
 +
  #loader-wrapper #BestOnLargeScreens {
 +
    display: block;
 +
  }
 +
 +
  #loader-wrapper #BadonEdge {
 +
    display: none;
 +
  }
 +
 
   body, #body {
 
   body, #body {
 
     font-size: calc(100vw * 0.0058 + 12.5292px);
 
     font-size: calc(100vw * 0.0058 + 12.5292px);
 
   }
 
   }
 +
 
   .container {
 
   .container {
 
     width: 100%;
 
     width: 100%;
 
     padding: 0 20px;
 
     padding: 0 20px;
 +
  }
 +
 +
  .NavBlockIcon {
 +
    font-size: 30px;
 +
    top: 10%;
 +
  }
 +
 +
  .NavBlock .NavBlockText {
 +
    opacity: 1;
 +
    top: 0px;
 
   }
 
   }
 
}
 
}
Line 3,778: Line 2,647:
 
     margin: auto;
 
     margin: auto;
 
   }
 
   }
 +
 
   div#UnderTitle {
 
   div#UnderTitle {
 
     font-size: calc(100vw * 0.0288 + 1.437px);
 
     font-size: calc(100vw * 0.0288 + 1.437px);
 
     width: 90%;
 
     width: 90%;
−
    margin: auto;
 
−
    padding: 0;
 
−
  }
 
−
}
 
−
 
−
/* Homepage */
 
−
 
−
@media (max-width: 470px) {
 
−
  div#Fsos {
 
−
    font-size: 35px;
 
−
    width: 95%;
 
−
    margin: auto;
 
−
  }
 
−
  div#UnderTitle {
 
−
    font-size: 15px;
 
−
    width: 95%;
 
 
     margin: auto;
 
     margin: auto;
 
     padding: 0;
 
     padding: 0;
Line 3,803: Line 2,657:
  
 
/* Eventpage */
 
/* Eventpage */
−
 
 
@media (max-width:768px) {
 
@media (max-width:768px) {
 
   .card {
 
   .card {
 
     width: 95%;
 
     width: 95%;
 
   }
 
   }
 +
 
   .card:first-child {
 
   .card:first-child {
 
     margin-top: 20px;
 
     margin-top: 20px;
 
   }
 
   }
 +
 
   .card:nth-child(3n+1) {
 
   .card:nth-child(3n+1) {
 
     -webkit-transform: rotate(0) translateY(0);
 
     -webkit-transform: rotate(0) translateY(0);
Line 3,819: Line 2,674:
 
     animation: none;
 
     animation: none;
 
   }
 
   }
 +
 
   .card:nth-child(3n+2) {
 
   .card:nth-child(3n+2) {
 
     -webkit-transform: rotate(0) translateY(0);
 
     -webkit-transform: rotate(0) translateY(0);
Line 3,827: Line 2,683:
 
     animation: none;
 
     animation: none;
 
   }
 
   }
 +
 
   .card:nth-child(3n+0) {
 
   .card:nth-child(3n+0) {
 
     -webkit-transform: translateY(0);
 
     -webkit-transform: translateY(0);
Line 3,835: Line 2,692:
 
     animation: none;
 
     animation: none;
 
   }
 
   }
 +
 
   .cardtextfull {
 
   .cardtextfull {
 
     grid-column: 1;
 
     grid-column: 1;
 
   }
 
   }
 +
 
   .title {
 
   .title {
 
     grid-column: 1;
 
     grid-column: 1;
 
     grid-row: 1;
 
     grid-row: 1;
 
   }
 
   }
 +
 
   .images {
 
   .images {
 
     grid-row: 3;
 
     grid-row: 3;
 
   }
 
   }
 +
 
   .images.special {
 
   .images.special {
 
     grid-row: 4;
 
     grid-row: 4;
 
   }
 
   }
 +
 
   .cardcontent {
 
   .cardcontent {
 
     grid-row: 2;
 
     grid-row: 2;
 
   }
 
   }
−
   .circle {
+
 
−
     display: block;
+
   .parallaxCircles.circle {
 +
     display: none;
 
   }
 
   }
 
}
 
}
Line 3,864: Line 2,727:
 
     z-index: 99;
 
     z-index: 99;
 
   }
 
   }
 +
 
   .card.links:nth-child(3n+2) img:hover {
 
   .card.links:nth-child(3n+2) img:hover {
 
     -webkit-transform: scale(1.7) rotate(2deg) translateX(100px);
 
     -webkit-transform: scale(1.7) rotate(2deg) translateX(100px);
Line 3,871: Line 2,735:
 
     z-index: 99;
 
     z-index: 99;
 
   }
 
   }
 +
 
   .card.links:nth-child(3n+0) img:hover {
 
   .card.links:nth-child(3n+0) img:hover {
 
     -webkit-transform: scale(1.7) translateX(100px);
 
     -webkit-transform: scale(1.7) translateX(100px);
Line 3,878: Line 2,743:
 
     z-index: 99;
 
     z-index: 99;
 
   }
 
   }
 +
 
   .card.rechts:nth-child(3n+1) img:hover {
 
   .card.rechts:nth-child(3n+1) img:hover {
 
     -webkit-transform: scale(1.7) rotate(-4deg) translateX(-100px);
 
     -webkit-transform: scale(1.7) rotate(-4deg) translateX(-100px);
Line 3,885: Line 2,751:
 
     z-index: 99;
 
     z-index: 99;
 
   }
 
   }
 +
 
   .card.rechts:nth-child(3n+2) img:hover {
 
   .card.rechts:nth-child(3n+2) img:hover {
 
     -webkit-transform: scale(1.7) rotate(2deg) translateX(-100px);
 
     -webkit-transform: scale(1.7) rotate(2deg) translateX(-100px);
Line 3,892: Line 2,759:
 
     z-index: 99;
 
     z-index: 99;
 
   }
 
   }
 +
 
   .card.rechts:nth-child(3n+0) img:hover {
 
   .card.rechts:nth-child(3n+0) img:hover {
 
     -webkit-transform: scale(1.7) translateX(-100px);
 
     -webkit-transform: scale(1.7) translateX(-100px);
Line 3,902: Line 2,770:
  
 
/**************** sponsorpage *********************/
 
/**************** sponsorpage *********************/
−
 
 
@media (max-width:849px) {
 
@media (max-width:849px) {
 
   .SponsorFlexBox {
 
   .SponsorFlexBox {
 
     padding: 20px 0;
 
     padding: 20px 0;
 
   }
 
   }
 +
 
   a.sponsor {
 
   a.sponsor {
 
     margin: 20px 10px;
 
     margin: 20px 10px;
 
   }
 
   }
 +
 
   img.sponsorLogo {
 
   img.sponsorLogo {
 
     width: 60vw;
 
     width: 60vw;
Line 3,916: Line 2,785:
  
 
/**************** teampage *********************/
 
/**************** teampage *********************/
 +
@media (max-width:1083px) {
 +
  .underlined::after {
 +
    width: 615px;
 +
  }
 +
}
 +
 +
@media (max-width:673px) {
 +
  .underlined::after {
 +
    width: 500px;
 +
  }
 +
}
 +
 +
@media (max-width:549px) {
 +
  .underlined::after {
 +
    width: 90%;
 +
  }
 +
}
 +
 +
@media (max-width:421px) {
 +
  .underlined::after {
 +
    width: 270px;
 +
  }
 +
}
  
 
@media (max-width:768px) {
 
@media (max-width:768px) {
Line 3,921: Line 2,813:
 
     content: url("https://static.igem.org/mediawiki/2018/0/04/T--Leiden--group_cropped_square.jpg")
 
     content: url("https://static.igem.org/mediawiki/2018/0/04/T--Leiden--group_cropped_square.jpg")
 
   }
 
   }
 +
 
   .TeamMemberBox:nth-child(2n+2) .PicBox {
 
   .TeamMemberBox:nth-child(2n+2) .PicBox {
 
     grid-row: 1;
 
     grid-row: 1;
 
   }
 
   }
 +
 
   .TeamMemberBox:nth-child(2n+2) .MemberDescription {
 
   .TeamMemberBox:nth-child(2n+2) .MemberDescription {
 
     grid-row: 2;
 
     grid-row: 2;
 
   }
 
   }
 +
 
   .TeamMemberBox:nth-child(2n+1) .MemberDescription {
 
   .TeamMemberBox:nth-child(2n+1) .MemberDescription {
 
     -ms-flex-item-align: start;
 
     -ms-flex-item-align: start;
Line 3,932: Line 2,827:
 
     padding-top: 15px;
 
     padding-top: 15px;
 
   }
 
   }
 +
 
   .TeamMemberBox:nth-child(2n+2) .MemberDescription {
 
   .TeamMemberBox:nth-child(2n+2) .MemberDescription {
 
     -ms-flex-item-align: start;
 
     -ms-flex-item-align: start;
Line 3,937: Line 2,833:
 
     padding-top: 15px;
 
     padding-top: 15px;
 
   }
 
   }
 +
 
   .TeamMemberBox {
 
   .TeamMemberBox {
 
     margin: 30px 0;
 
     margin: 30px 0;
 
     height: auto;
 
     height: auto;
 +
  }
 +
 +
  .modalContent {
 +
    width: calc(100% - 40px);
 +
    height: calc(100% - 40px);
 +
    border-radius: 10px;
 +
    max-height: none;
 +
    margin: 20px;
 
   }
 
   }
 
}
 
}
  
−
/**************** crowdfundingpage *********************/
+
@media (max-width:425px) {
 +
  .modalContent {
 +
    width: 100%;
 +
    height: 100%;
 +
    border-radius: 0;
 +
    margin: 0;
 +
  }
  
 +
  .ModalFunFact {
 +
    padding-bottom: 5px;
 +
  }
 +
 +
  span.close {
 +
    right: 10px;
 +
    top: 10px;
 +
  }
 +
}
 +
 +
/**************** crowdfundingpage *********************/
 
@media (max-width:768px) {
 
@media (max-width:768px) {
 
   #excessive {
 
   #excessive {
 
     display: none;
 
     display: none;
 
   }
 
   }
 +
 
   div.bubbles span.circle.right, div.bubbles span.circle.left {
 
   div.bubbles span.circle.right, div.bubbles span.circle.left {
 +
    -webkit-animation: none;
 
     animation: none;
 
     animation: none;
 
     display: none;
 
     display: none;
Line 3,955: Line 2,879:
 
}
 
}
  
−
@media (max-width:425px) {
+
@media (max-width:450px) {
 
   .countdown {
 
   .countdown {
 
     display: block;
 
     display: block;
Line 3,961: Line 2,885:
 
     margin: auto;
 
     margin: auto;
 
   }
 
   }
 +
 
   #DonateButton {
 
   #DonateButton {
 
     margin-top: 0px;
 
     margin-top: 0px;
 
   }
 
   }
 +
}
 +
 +
/**************** InterLab *********************/
 +
@media (max-width: 768px) {
 +
  div.InterLabFigureBox {
 +
    width: 100%;
 +
  }
 +
}
 +
 +
/**************** Featured *********************/
 +
@media (max-width: 1000px) {
 +
  div.featuredBox {
 +
    width: 70%;
 +
  }
 +
}
 +
 +
@media (max-width: 768px) {
 +
  div.featuredBox {
 +
    width: 90%;
 +
    min-width: inherit;
 +
    margin: 15px 0;
 +
  }
 +
 +
  .Feature {
 +
    -webkit-box-orient: vertical;
 +
    -webkit-box-direction: normal;
 +
    -ms-flex-direction: column;
 +
    flex-direction: column;
 +
  }
 +
 +
  .Feature h2 {
 +
    width: auto;
 +
    text-align: center;
 +
    margin-left: 0;
 +
  }
 +
}
 +
 +
/**************** Newsletter *********************/
 +
@media (max-width: 768px) {
 +
  .collapsibleContent {
 +
    padding: 0px 20px;
 +
  }
 +
 +
  .popout.revealed .collapsibleContent {
 +
    padding: 20px;
 +
  }
 +
 +
  .popout.revealed {
 +
    padding: 0;
 +
  }
 +
 +
  .collapsible {
 +
    font-size: 35px;
 +
  }
 +
 +
  .popout {
 +
    width: 90%;
 +
  }
 +
 +
  /* .collapsible::before {
 +
    height: 100%;
 +
  } */
 +
}
 +
 +
@media (max-width: 425px) {
 +
  .popout.revealed .collapsibleContent {
 +
    padding: 20px;
 +
    padding-top: 20px;
 +
  }
 +
 +
  .popout, .popout.chapter, .popout.protocols {
 +
    width: calc(100vw - 40px);
 +
    margin-left: 20px;
 +
    margin-right: 20px;
 +
  }
 +
}
 +
 +
/**************** Model *********************/
 +
@media (max-width: 950px) {
 +
  .FigFlexbox .flexfig {
 +
    width: 400px;
 +
  }
 +
 +
  .FigFlexbox .flexfig.smallSize {
 +
    width: 80%;
 +
    max-width: none;
 +
  }
 +
 +
  figure.resultfig {
 +
    width: 100%;
 +
    margin: 40px auto;
 +
    padding: 0;
 +
    overflow-y: hidden;
 +
  }
 +
}
 +
 +
/**************** Timeline *********************/
 +
@media (max-width: 768px) {
 +
  figure.resultfig.vertical {
 +
    width: 60%;
 +
  }
 +
 +
  figure.resultfig.horizontal {
 +
    width: 90%;
 +
  }
 +
 +
  .timeline li.timelineUnit {
 +
    margin-top: -5px;
 +
    padding-bottom: 50px;
 +
  }
 +
 +
  .timeline li.timelineUnit .timelineContent {
 +
    width: calc(95% - 50px);
 +
  }
 +
 +
  .timelineUnit.right .timelineContent, .timelineUnit.left .timelineContent {
 +
    left: calc(5% + 70px)
 +
  }
 +
 +
  .timeline li.timelineUnit.right .timelineContent.revealed, .timeline li.timelineUnit.left .timelineContent.revealed {
 +
    left: calc(5% + 50px);
 +
    right: auto;
 +
    opacity: 1;
 +
  }
 +
 +
  .left .timelineContent .title {
 +
    border-radius: 0 20px 0 0;
 +
  }
 +
 +
  .timeline li.timelineUnit .linesegment {
 +
    position: absolute;
 +
    display: block;
 +
    width: 8px;
 +
    top: 0;
 +
    bottom: 0;
 +
    background: var(--main);
 +
    border-radius: 4px;
 +
  }
 +
 +
  .timeline li.timelineUnit.left .linesegment, .timeline li.timelineUnit.right .linesegment {
 +
    left: calc(5% - 4px);
 +
    right: auto;
 +
  }
 +
 +
  .timeline li.timelineUnit.left i.iHPicon, .timeline li.timelineUnit.right i.iHPicon {
 +
    left: 5%;
 +
    right: auto;
 +
    -webkit-transform: translateX(-50%);
 +
    transform: translateX(-50%);
 +
  }
 +
 +
  .timeline li.timelineUnit.right .arrow, .timeline li.timelineUnit.left .arrow {
 +
    right: 100%;
 +
    left: auto;
 +
    border-radius: 100% 0 0 0;
 +
  }
 +
 +
  .link.LeftRight1, .link.LeftRight2, .link.RightLeft1, .link.RightLeft2 {
 +
    display: none;
 +
  }
 +
 +
  .timeline li.timelineUnit.semiconclusion.left .arrow {
 +
    border-top: 0;
 +
    border-bottom: 42px solid var(--main);
 +
    border-radius: 0 0 0 100%;
 +
  }
 +
 +
  /* .timeline li.timelineUnit.semiconclusion.left .arrow {
 +
    border-top: 0;
 +
    border-bottom: 42px solid var(--main);
 +
    border-radius: 0 0 100% 0;
 +
  } */
 +
  .timeline li.link.LeftMid1, .timeline li.link.RightMid1 {
 +
    width: calc(25% + 4px);
 +
    border-width: 0 0 8px 8px;
 +
    left: calc(5% - 4px);
 +
    -webkit-transform: skewY(10deg);
 +
    transform: skewY(10deg);
 +
    -webkit-transform-origin: 100% 0;
 +
    transform-origin: 100% 0;
 +
    border-radius: 0 0 0 30px;
 +
    margin-top: 4px;
 +
  }
 +
 +
  .timeline li.link.LeftMid2, .timeline li.link.RightMid2 {
 +
    width: calc(20% + 5px);
 +
    margin-top: -8px;
 +
    margin-bottom: 5px;
 +
    border-width: 8px 8px 0 0;
 +
    left: calc(30% - 0px);
 +
    -webkit-transform: skewY(10deg);
 +
    transform: skewY(10deg);
 +
    -webkit-transform-origin: 0 0;
 +
    transform-origin: 0 0;
 +
    border-radius: 0 30px 0 0;
 +
  }
 +
 +
  .timeline li.link.MidLeft1, .timeline li.link.MidRight1 {
 +
    width: calc(20% + 4px);
 +
    border-width: 0 8px 8px 0px;
 +
    left: calc(30% + 1px);
 +
    -webkit-transform: skewY(-10deg);
 +
    transform: skewY(-10deg);
 +
    -webkit-transform-origin: 0 100%;
 +
    transform-origin: 0 100%;
 +
    border-radius: 0 0 30px 0;
 +
    margin-top: 4px;
 +
  }
 +
 +
  .timeline li.link.MidLeft2, .timeline li.link.MidRight2 {
 +
    width: calc(25% + 5px);
 +
    margin-top: -8px;
 +
    margin-bottom: 0px;
 +
    border-width: 8px 0 0 8px;
 +
    left: calc(5% - 4px);
 +
    -webkit-transform: skewY(-10deg);
 +
    transform: skewY(-10deg);
 +
    -webkit-transform-origin: 100% 0;
 +
    transform-origin: 100% 0;
 +
    border-radius: 30px 0 0 0;
 +
  }
 +
 +
  .popout .PicCaroussel.vertical {
 +
    width: 60%;
 +
  }
 +
 +
  .popout .PicCaroussel.horizontal {
 +
    width: 100%;
 +
  }
 +
}
 +
 +
.AchievementBox1 {
 +
  height: 290px;
 +
  width: 290px;
 +
  background-color: var(--whiteish);
 +
  border: 20px solid currentColor;
 +
border-radius: 50%;
 +
position: relative;
 +
margin: 25px;
 +
    padding:10px;
 +
}
 +
 +
.Achievement {
 +
  width: 100%;
 +
  height: 100%;
 +
}
 +
 +
.AchievementBox1:nth-child(5n+1) {
 +
  color: var(--main);
 +
}
 +
.AchievementBox1:nth-child(5n+2) {
 +
  color: var(--accent1);
 +
}
 +
.AchievementBox1:nth-child(5n+3) {
 +
  color: var(--accent2);
 +
}
 +
.AchievementBox1:nth-child(5n+4) {
 +
  color: var(--accent3);
 +
}
 +
.AchievementBox1:nth-child(5n+5) {
 +
  color: var(--accent4);
 +
}
 +
.AchievementBox1  p {
 +
  display: block;
 +
  position: relative;
 +
  top: 50%;
 +
  transform: translateY(-50%);
 +
  text-align: center;
 +
  color: var(--blackish);
 +
  font-size: 25px;
 +
 +
}
 +
.AchievementBox1:nth-child(4n+1) div.iconBox {
 +
  right: -15px;
 +
  bottom: -15px;
 +
}
 +
 +
.AchievementBox1:nth-child(4n+2) div.iconBox {
 +
  top: -15px;
 +
  left: -15px;
 +
}
 +
 +
.AchievementBox1:nth-child(4n+3) div.iconBox {
 +
  bottom: -15px;
 +
  left: -15px;
 +
}
 +
 +
.AchievementBox1:nth-child(4n+4) div.iconBox {
 +
  top: -15px;
 +
  right: -15px;
 +
}
 +
 +
.padding-top {
 +
  padding-top:20px;
 +
}
 +
 +
@media (max-width: 420px) {
 +
  .padding-top{
 +
    padding-top:0;
 +
  }
 +
  .AchievementBox1{
 +
    width:240px;
 +
    height:240px;
 +
margin-left:0;
 +
margin-right:0;
 +
  }
 +
  .AchievementBox1 p {
 +
    font-size:20px;
 +
  }
 +
.AchievementBox1:nth-child(4n+1) div.iconBox {
 +
  right: -25px;
 +
  bottom: -25px;
 +
}
 +
 +
.AchievementBox1:nth-child(4n+2) div.iconBox {
 +
  top: -25px;
 +
  left: -25px;
 +
}
 +
 +
.AchievementBox1:nth-child(4n+3) div.iconBox {
 +
  bottom: -25px;
 +
  left: -25px;
 +
}
 +
 +
.AchievementBox1:nth-child(4n+4) div.iconBox {
 +
  top: -25px;
 +
  right: -25px;
 +
}
 
}
 
}

Latest revision as of 23:30, 8 November 2018

root {
 --whiteish: #F7F7F7;
 --blackish: #111;
 --main: #FFB375;
 --main_darker: #FFA666;
 --accent1: #456990;
 --accent2: #49BEAA;
 --accent3: #49DCB1;
 --background: #D3D1BE;
 --accent4: #B2B09B;
 --accentRed: #F86767;
 --accentCyan: #5FC8D8;

}

@font-face { 

 font-family: ProjectTitle;
 src: url('https://static.igem.org/mediawiki/2018/b/b7/T--Leiden--copperplatelightssilight.ttf');
 /* src: url('../webfonts/copperplatelightssilight.ttf'); */

}

@font-face { 

 font-family: UnderTitle;
 src: url('https://static.igem.org/mediawiki/2018/d/d6/T--Leiden--YuGothicLight.ttf');
 /* src: url('../webfonts/YuGothic-Light-reduced.ttf'); */

}

@font-face { 

 font-family: Kopje;
 src: url('https://static.igem.org/mediawiki/2018/c/ca/T--Leiden--Roboto-Medium.ttf');
 /* src: url('../webfonts/Roboto-Medium.ttf'); */
 font-weight: bold;

}

@font-face { 

 font-family: Body;
 src: url('https://static.igem.org/mediawiki/2018/0/0d/T--Leiden--Roboto-Light.ttf');
 /* src: url('../webfonts/Roboto-Light.ttf'); */

}

@font-face { 

 font-family: Body;
 src: url('https://static.igem.org/mediawiki/2018/b/bb/T--Leiden--Roboto-LightItalic.ttf');
 /* src: url('../webfonts/Roboto-LightItalic.ttf'); */
 font-style: italic;

}

@font-face { 

 font-family: 'iGEMLeidenIcons';
 src: url('https://static.igem.org/mediawiki/2018/5/54/T--Leiden--iGEMLeidenIcons.eot?43u2u1');
 /* src: url('../webfonts/iGEMLeidenIcons.eot?43u2u1'); */
 src: url('https://static.igem.org/mediawiki/2018/5/54/T--Leiden--iGEMLeidenIcons.eot?43u2u1#iefix') format('embedded-opentype'), url('https://static.igem.org/mediawiki/2018/e/e4/T--Leiden--iGEMLeidenIconsttf.ttf?43u2u1') format('truetype'), url('https://static.igem.org/mediawiki/2018/8/89/T--Leiden--iGEMLeidenIconswoff.woff?43u2u1') format('woff'), url('https://static.igem.org/mediawiki/2018/d/d1/T--Leiden--iGEMLeidenIconssvg.svg') format('svg');
 /* src: url('../webfonts/iGEMLeidenIcons.eot?43u2u1#iefix') format('embedded-opentype'), url('../webfonts/iGEMLeidenIcons.ttf?43u2u1') format('truetype'), url('../webfonts/iGEMLeidenIcons.woff?43u2u1') format('woff'), url('../webfonts/iGEMLeidenIcons.svg?43u2u1#iGEMLeidenIcons') format('svg'); */
 font-weight: normal;
 font-style: normal;

}

/* Correct iGEM shit... */

  1. Global p, p {
 padding: 0;
 padding-bottom: 5px;
 margin: 0px;
 line-height: 1.4;
 position: relative;
 z-index: 50;

}

  1. Global p.meta {
 padding: 0;
 margin: 0;

}

  1. globalWrapper {
 font-size: 100%;
 padding: 0;

}

  1. top_menu_under, #top_menu_14, #top_menu_inside {
 -webkit-box-sizing: content-box;
 box-sizing: content-box;

}

  1. top_menu_under {
 height: 0px;

}

a[href ^="https://"] { 

 padding: 0;

}

  1. top_menu_inside ul a, #top_menu_inside ul li.has_submenu {
 line-height: 1.5em;

}

  1. globalWrapper #content #top_title div.logo_2018 a img {
 content: url('https://static.igem.org/mediawiki/2018/c/c8/T--Leiden--LogoLeidenV1.png')

}

/***********************************************************************************************************************************************************/ /* Global styles */ sup, sub { 

 font-size: 60%;

}

b, #body b { 

 font-family: Kopje;

}

b.highlightBlue { 

 color: var(--accent1);

}

b.highlightOrange { 

 color: var(--main);

}

h1, h2, h3, h4, h5, h6 { 

 font-family: Kopje, sans-serif;
 margin: 0;
 padding: 0;
 padding-top: 15px;
 border: none;
 font-weight: bold;
 overflow: visible;

}

h1.SectionTitle { 

 font-size: 3rem;
 z-index: 50;
 position: relative;
 padding-top: 60px;

}

h2.SectionTitle { 

 font-size: 2.4rem;

}

.container-text h1.SectionTitle { 

 text-align: left;

}

h1 { 

 font-size: 2rem;

}

h2 { 

 font-size: 1.5rem;

}

h3 { 

 font-size: 1.17rem;

}

h4 { 

 font-size: 1.12rem;

}

h5 { 

 font-size: .83rem;

}

h6 { 

 font-size: .75rem;

}

.submenu div { 

 line-height: 1.5em;

}

body, #body { 

 /* target body and the alternative body tag in iGEM terms (see Javascript-script) */
 width: 100%;
 height: -webkit-max-content;
 height: -moz-max-content;
 height: max-content;
 padding: 0;
 margin: 0;
 line-height: normal;
 position: absolute;
 top: 9px;
 background-color: var(--whiteish);
 font-size: 17px;
 color: var(--blackish);
 font-family: Body, sans-serif;
 z-index: -5;

}

ul li, ul { 

 margin: 0;
 line-height: normal;
 list-style-type: none;
 list-style-image: none;
 display: block;

}

  • {
 padding: 0;
 margin: 0;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 text-decoration: none;
 line-height: normal;

}

.container { 

 width: 80%;
 margin: auto;

}

.container-text { 

 width: 80%;
 max-width: 800px;
 margin: auto;
 padding: 60px 0 40px 0;
 text-align: justify;
 text-align-last: start;

}

a, a:active, a:visited, a:hover { 

 color: inherit;
 text-decoration: none;

}

a.colouredlink, span.colouredlink { 

 color: var(--main);
 font-family: Kopje;
 cursor: pointer;

}

a.colouredlink.Blue { 

 color: var(--accent1);

}

a.wrap { 

 display: block;

}

code { 

 text-align: left;
 display: block;
 padding-left: 20px;

}

.hidden { 

 display: none;

}

/* References */ .smaller { 

 font-size: 0.75em;

}

.popout .refs p, .refs p, .projectDescription .refs p { 

 padding: 0 0 5px 0;

}

.center { 

 text-align: center;
 text-align-last: center;

}

.caption { 

 font-size: 0.9em;
 text-align: justify;

}

span.grouped { 

 display: inline-block;
 position: relative;

}

/* Custom scrollbar (chrome & IE/Edge) */ /* width */

-webkit-scrollbar {
 width: 10px;
 height: 10px;

}

-webkit-scrollbar-track {
 background: #efefef;
 -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
 box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);

}

-webkit-scrollbar-thumb {
 border-radius: 5px;
 background: var(--accent1);

}

/*********************** Blobs ***************************/ .blobs { 

 background: var(--main);
 margin: 0 -2px;
 padding: 2px 7px;
 -webkit-filter: url("#goo");
 filter: url("#goo");
 cursor: default;
 position: relative;
 display: inline-block;
 border: solid transparent;
 border-width: 0px;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 background-clip: padding-box;
 -webkit-box-sizing: content-box;
 box-sizing: content-box;
 z-index: 52;

}

.blobs:hover { 

 border-width: 10px;
 margin: -10px -12px;

}

.blobs .popoutBlob { 

 position: absolute;
 z-index: -1;
 display: block;
 width: 20px;
 height: -webkit-max-content;
 height: -moz-max-content;
 height: max-content;
 max-height: 20px;
 bottom: 3px;
 left: calc(50% - 10px);
 background: var(--main);
 padding: 0px;
 border-radius: 50%;
 color: var(--main);
 font-size: 0px;
 border: solid transparent;
 border-width: 0px;
 -webkit-transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 background-clip: padding-box;
 -webkit-box-sizing: content-box;
 box-sizing: content-box;

}

.blobs.bottom .popoutBlob { 

 bottom: auto;
 top: 3px;

}

.blobs:hover .popoutBlob { 

 left: calc(50% - 135px);
 border-radius: 10px;
 width: 200px;
 height: -webkit-max-content;
 height: -moz-max-content;
 height: max-content;
 max-height: 300px;
 font-size: 1em;
 bottom: 25px;
 padding: 15px;
 border-width: 20px;
 -webkit-transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 transition: all 0.5s cubic-bezier(0.72, 0.01, 0.6, 0.84);
 cursor: pointer;
 -webkit-animation: textappear 0.9s forwards;
 animation: textappear 0.9s forwards;
 /* z-index: 99999; */

}

  1. iHP .blobs .popoutBlob {
 cursor: default;

}

  1. iHP .blobs.Clickable .popoutBlob {
 cursor: pointer;

}

.blobs.XXL:hover .popoutBlob { 

 left: calc(50% - 185px);
 width: 300px;

}

.blobs.bottom .popoutBlob { 

 bottom: auto;
 top: 25px;

}

.blobs .wobblybobbly { 

 position: absolute;
 z-index: -1;
 width: 30%;
 background: var(--main);
 height: 70%;
 border-radius: 50%;
 left: 35%;
 bottom: 4px;

}

.blobs:hover .wobblybobbly { 

 -webkit-animation: wobble 1.7s 0.2s;
 animation: wobble 1.7s 0.2s;

}

@-webkit-keyframes wobble { 

 0% {
   bottom: 4px
 }

 15% {
   bottom: 14px
 }

 42% {
   bottom: -4px
 }

 67% {
   bottom: 11px
 }

 90% {
   bottom: -2px
 }

 100% {
   bottom: 4px
 }

}

@keyframes wobble { 

 0% {
   bottom: 4px
 }

 15% {
   bottom: 14px
 }

 42% {
   bottom: -4px
 }

 67% {
   bottom: 11px
 }

 90% {
   bottom: -2px
 }

 100% {
   bottom: 4px
 }

}

@-webkit-keyframes textappear { 

 0% {
   color: var(--main);
 }

 60% {
   color: var(--main);
 }

 100% {
   color: var(--blackish);
 }

}

@keyframes textappear { 

 0% {
   color: var(--main);
 }

 60% {
   color: var(--main);
 }

 100% {
   color: var(--blackish);
 }

}

a.ref { 

 display: inline;

}

/*********************** Navigation boxes at bottom of page ***************************/ .UnderPageNav { 

 width: 90%;
 position: relative;
 max-width: 1100px;
 margin: 50px auto;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 -ms-flex-flow: row wrap;
 flex-flow: row wrap;
 -webkit-box-pack: space-evenly;
 -ms-flex-pack: space-evenly;
 justify-content: space-evenly;
 /* -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -ms-flex-line-pack: center;
 align-content: center; */

}

.UnderPageNav.crowdfunding { 

 position: absolute;
 bottom: 0;
 left: 50%;
 -webkit-transform: translate(-50%, 0);
 transform: translate(-50%, 0);

}

.donors.static~.UnderPageNav.crowdfunding { 

 position: relative;
 left: auto;
 -webkit-transform: translate(0, 0);
 transform: translate(0, 0);

}

/* .UnderPageNav.crowdfunding .NavBlockIcon { 

 margin-top: 40px

} */ .NavBlock { 

 width: 200px;
 height: 200px;
 background: var(--main);
 display: block;
 border-radius: 20px;
 padding: 20px;
 overflow: hidden;
 position: relative;
 cursor: pointer;
 -webkit-box-shadow: 2px 2px 10px 0px grey;
 box-shadow: 2px 2px 10px 0px grey;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 margin: 10px;

}

.NavBlock:hover { 

 -webkit-box-shadow: 2px 2px 2px -2px grey;
 box-shadow: 2px 2px 2px -2px grey;
 -webkit-transform: translate(3px, 3px);
 transform: translate(3px, 3px);

}

.NavBlockIcon { 

 color: #f7f7f7;
 font-size: 70px;
 width: -webkit-max-content;
 width: -moz-max-content;
 width: max-content;
 margin: auto;
 height: -webkit-max-content;
 height: -moz-max-content;
 height: max-content;
 position: relative;
 top: 50%;
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 -webkit-transition: all 0.5s;
 transition: all 0.5s;

}

.NavBlock:hover .NavBlockIcon { 

 font-size: 30px;
 top: 10%;

}

.NavBlockText { 

 color: var(--blackish);
 text-align: center;
 font-size: 15px;
 overflow: hidden;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 opacity: 0;
 position: relative;
 top: 60px;

}

.NavBlockText span { 

 display: block;
 color: var(--whiteish);
 font-family: Kopje;
 font-size: 16px;
 text-align: center;
 text-align-last: center;
 padding-bottom: 10px;

}

.NavBlock:hover .NavBlockText { 

 opacity: 1;
 top: 0px;

}

/*********************** Timeline Concept ***************************/ .popout p.introTextTimeline { 

 border-bottom: 3px solid var(--main);
 padding-bottom: 25px;
 margin: 0px auto 30px;
 width: 90%;

}

.timeline li.timelineUnit { 

 list-style-type: none;
 position: relative;
 width: 100%;
 margin-top: 50px;

}

.timeline li.timelineUnit:first-of-type { 

 padding-top: 50px;

}

.timeline li.timelineUnit:first-of-type i.iHPicon { 

 top: 150px;

}

.timeline li.timelineUnit:first-of-type .linesegment::before { 

 content: ;
 position: absolute;
 top: 0;
 height: 100px;
 width: 100%;
 background: -webkit-gradient(linear, left top, left bottom, from(rgba(253, 253, 253, 1)), to(rgba(253, 253, 253, 0)));
 background: linear-gradient(rgba(253, 253, 253, 1), rgba(253, 253, 253, 0));

}

.timeline li.timelineUnit:last-of-type { 

 margin-bottom: 25px;

}

.timeline li.timelineUnit:last-of-type .linesegment::before { 

 content: ;
 position: absolute;
 bottom: 0;
 height: 100px;
 width: 100%;
 background: -webkit-gradient(linear, left top, left bottom, from(rgba(253, 253, 253, 0)), to(rgba(253, 253, 253, 1)));
 background: linear-gradient(rgba(253, 253, 253, 0), rgba(253, 253, 253, 1));

}

.timeline li.timelineUnit .timelineContent { 

 position: relative;
 width: calc(90% - 50px);
 color: var(--blackish);
 border-radius: 20px;
 opacity: 0;
 -webkit-transition: all 0.5s, opacity 1s;
 transition: all 0.5s, opacity 1s;

}

.timeline li.timelineUnit.conclusion .timelineContent { 

 padding: 0;

}

.timelineContent .title { 

 font-family: Kopje;
 padding: 7px 25px 7px;
 background: var(--main);

}

.right .timelineContent .title { 

 border-radius: 0 20px 0 0;

}

.left .timelineContent .title { 

 border-radius: 20px 0 0 0;

}

.popout .timelineContent p.text, #Global .popout .timelineContent p.text { 

 background: var(--whiteish);
 padding: 15px 25px 20px;
 border: 1px solid #aaa;
 border-top: 0px;
 border-radius: 0 0 20px 20px;

}

.timelineUnit.right .timelineContent { 

 left: calc(10% + 70px)

}

.timeline li.timelineUnit.right .timelineContent.revealed { 

 left: calc(10% + 50px);
 opacity: 1;

}

.timelineUnit.left .timelineContent { 

 left: -20px;

}

.timeline li.timelineUnit.left .timelineContent.revealed { 

 left: 0;
 opacity: 1;

}

.timeline li.timelineUnit.conclusion { 

 margin: 0 auto;
 padding: 30px 0;

}

.timelineUnit.conclusion .timelineContent.revealed { 

 opacity: 1;

}

.conclusion .timelineContent { 

 border-radius: 20px;

}

.conclusion .timelineContent .title { 

 border-radius: 15px 15px 0 0;
 padding: 7px 25px 7px;
 background: var(--main);
 text-align: center;

}

.popout .conclusion .timelineContent p.text, #Global .popout .conclusion .timelineContent p.text { 

 border: none;
 padding: 10px 25px 20px;

}

.timeline li.timelineUnit.conclusion .linesegment { 

 left: calc(50% - 4px);

}

.timeline li.timelineUnit.conclusion .timelineContent { 

 width: 100%;
 border: 3px solid var(--main);

}

.timeline li.timelineUnit .linesegment { 

 position: absolute;
 display: block;
 width: 8px;
 top: 0;
 bottom: 0;
 background: var(--main);
 border-radius: 4px;

}

.timeline li.timelineUnit.left .linesegment { 

 right: calc(10% - 4px);

}

.timeline li.timelineUnit.right .linesegment { 

 left: calc(10% - 4px);

}

.timeline li.timelineUnit i.iHPicon { 

 position: absolute;
 font-size: 30px;
 border-radius: 50%;
 width: 60px;
 height: 60px;
 background: var(--main);
 color: white;
 top: 100px;

}

.timeline li.timelineUnit.left i.iHPicon { 

 right: 10%;
 -webkit-transform: translateX(50%);
 transform: translateX(50%);

}

.timeline li.timelineUnit.right i.iHPicon { 

 left: 10%;
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);

}

.timeline li.timelineUnit i.iHPicon::before { 

 position: absolute;
 left: 50%;
 top: 50%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);

}

.timeline li.timelineUnit .arrow { 

 -webkit-box-sizing: content-box;
 box-sizing: content-box;
 position: absolute;
 top: 0px;
 width: 48px;
 height: 50px;
 border-top: 42px solid var(--main);

}

.timeline li.timelineUnit.left .arrow { 

 left: 100%;
 border-radius: 0 100% 0 0;

}

.timeline li.timelineUnit.right .arrow { 

 right: 100%;
 border-radius: 100% 0 0 0;

}

.timeline li.timelineUnit.semiconclusion .timelineContent { 

 padding-top: 50px;

}

.timeline li.timelineUnit.semiconclusion.right .arrow { 

 border-top: 0;
 border-bottom: 42px solid var(--main);
 border-radius: 0 0 0 100%;

}

.timeline li.timelineUnit.semiconclusion.left .arrow { 

 border-top: 0;
 border-bottom: 42px solid var(--main);
 border-radius: 0 0 100% 0;

}

.timeline li.timelineUnit.Mid { 

 margin: auto;
 width: 100%;
 padding-top: 70px;

}

.timeline li.timelineUnit.Mid .linesegment { 

 left: calc(50% - 4px);
 )

}

.timeline .conclusion .flowIn, .timeline .conclusion .flowOut { 

 position: absolute;
 background: var(--main);
 left: calc(50% - 42px);
 width: 84px;
 height: 38px;

}

.timeline .conclusion .flowIn { 

 bottom: calc(100% + 3px);

}

.timeline .conclusion .flowOut { 

 top: calc(100% + 3px);

}

.flowIn::before, .flowIn::after, .flowOut::before, .flowOut::after { 

 content: ;
 position: absolute;
 height: 38px;
 width: 38px;
 background: #fdfdfd;

}

.flowIn::before { 

 top: 0;
 left: 0;
 border-radius: 0 0 100% 0;

}

.flowIn::after { 

 top: 0;
 right: 0;
 border-radius: 0 0 0 100%;

}

.flowOut::before { 

 bottom: 0;
 left: 0;
 border-radius: 0 100% 0 0;

}

.flowOut::after { 

 bottom: 0;
 right: 0;
 border-radius: 100% 0 0 0;

}

.timeline li.link { 

 position: relative;
 border-style: solid;
 border-color: var(--main);
 height: 50px;

}

.timeline li.link.LeftRight1 { 

 width: calc(40% + 5px);
 border-width: 0 0 8px 8px;
 left: calc(10% - 4px);
 -webkit-transform: skewY(10deg);
 transform: skewY(10deg);
 -webkit-transform-origin: 100% 0;
 transform-origin: 100% 0;
 border-radius: 0 0 0 30px;
 margin-top: 33px;

}

.timeline li.link.LeftRight2 { 

 width: calc(40% + 4px);
 margin-top: -8px;
 margin-bottom: -18px;
 border-width: 8px 8px 0 0;
 left: 50%;
 -webkit-transform: skewY(10deg);
 transform: skewY(10deg);
 -webkit-transform-origin: 0 0;
 transform-origin: 0 0;
 border-radius: 0 30px 0 0;

}

.timeline li.link.RightLeft1 { 

 width: calc(40% + 4px);
 border-width: 0 8px 8px 0px;
 left: 50%;
 -webkit-transform: skewY(-10deg);
 transform: skewY(-10deg);
 -webkit-transform-origin: 0 100%;
 transform-origin: 0 100%;
 border-radius: 0 0 30px 0;
 margin-top: 33px;

}

.timeline li.link.RightLeft2 { 

 width: calc(40% + 5px);
 margin-top: -8px;
 margin-bottom: -18px;
 border-width: 8px 0 0 8px;
 left: calc(10% - 4px);
 -webkit-transform: skewY(-10deg);
 transform: skewY(-10deg);
 -webkit-transform-origin: 100% 0;
 transform-origin: 100% 0;
 border-radius: 30px 0 0 0;

}

.timeline li.link.LeftMid1 { 

 width: calc(20% + 4px);
 border-width: 0 0 8px 8px;
 left: calc(10% - 4px);
 -webkit-transform: skewY(10deg);
 transform: skewY(10deg);
 -webkit-transform-origin: 100% 0;
 transform-origin: 100% 0;
 border-radius: 0 0 0 30px;
 margin-top: 4px;

}

.timeline li.link.LeftMid2 { 

 width: calc(20% + 5px);
 margin-top: -8px;
 margin-bottom: 15px;
 border-width: 8px 8px 0 0;
 left: calc(30% - 1px);
 -webkit-transform: skewY(10deg);
 transform: skewY(10deg);
 -webkit-transform-origin: 0 0;
 transform-origin: 0 0;
 border-radius: 0 30px 0 0;

}

.timeline li.link.MidRight1 { 

 width: calc(20% + 5px);
 border-width: 0 0 8px 8px;
 left: calc(50% - 4px);
 -webkit-transform: skewY(10deg);
 transform: skewY(10deg);
 -webkit-transform-origin: 100% 0;
 transform-origin: 100% 0;
 border-radius: 0 0 0 30px;
 margin-top: 15px;

}

.timeline li.link.MidRight2 { 

 width: calc(20% + 4px);
 margin-top: -8px;
 margin-bottom: -45px;
 border-width: 8px 8px 0 0;
 left: 70%;
 -webkit-transform: skewY(10deg);
 transform: skewY(10deg);
 -webkit-transform-origin: 0 0;
 transform-origin: 0 0;
 border-radius: 0 30px 0 0;

}

.timeline li.link.RightMid1 { 

 width: calc(20% + 4px);
 border-width: 0 8px 8px 0px;
 left: 70%;
 -webkit-transform: skewY(-10deg);
 transform: skewY(-10deg);
 -webkit-transform-origin: 0 100%;
 transform-origin: 0 100%;
 border-radius: 0 0 30px 0;
 margin-top: 4px;

}

.timeline li.link.RightMid2 { 

 width: calc(20% + 5px);
 margin-top: -8px;
 margin-bottom: 15px;
 border-width: 8px 0 0 8px;
 left: calc(50% - 4px);
 -webkit-transform: skewY(-10deg);
 transform: skewY(-10deg);
 -webkit-transform-origin: 100% 0;
 transform-origin: 100% 0;
 border-radius: 30px 0 0 0;

}

.timeline li.link.MidLeft1 { 

 width: calc(20% + 4px);
 border-width: 0 8px 8px 0px;
 left: calc(30% - 0px);
 -webkit-transform: skewY(-10deg);
 transform: skewY(-10deg);
 -webkit-transform-origin: 0 100%;
 transform-origin: 0 100%;
 border-radius: 0 0 30px 0;
 margin-top: 15px;

}

.timeline li.link.MidLeft2 { 

 width: calc(20% + 5px);
 margin-top: -8px;
 margin-bottom: -45px;
 border-width: 8px 0 0 8px;
 left: calc(10% - 4px);
 -webkit-transform: skewY(-10deg);
 transform: skewY(-10deg);
 -webkit-transform-origin: 100% 0;
 transform-origin: 100% 0;
 border-radius: 30px 0 0 0;

}

.popout .PicCaroussel { 

 display: block;
 margin: 25px auto;
 position: relative;

}

.popout .PicCaroussel.horizontal { 

 width: 80%;

}

.popout .PicCaroussel.vertical { 

 width: 40%;

}

.PicCaroussel img:first-child { 

 position: relative;
 width: 100%;
 height: auto;

}

.PicCaroussel img { 

 width: auto;
 height: 100%;
 position: absolute;
 top: 0;
 left: 50%;
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);
 -webkit-transition: opacity 1s;
 transition: opacity 1s;
 opacity: 0;
 border: 2px solid var(--main);

}

.PicCaroussel img.active { 

 opacity: 1;

}

.PicCaroussel .SlideNav { 

 display: block;
 position: absolute;
 bottom: 15px;
 width: -webkit-max-content;
 width: -moz-max-content;
 width: max-content;
 left: 0;
 right: 0;
 margin: 0 auto;

}

.PicCaroussel .SlideNav span { 

 display: inline-block;
 width: 15px;
 height: 15px;
 border-radius: 50%;
 color: var(--whiteish);
 /* background: rgba(17, 17, 17, 0.5); */
 background: rgba(69, 105, 144, 0.7);
 border: 2px solid currentColor;
 margin: 0 3px;
 -webkit-transition: all 1s;
 transition: all 1s;
 position: relative;
 -webkit-box-shadow: 0 0 0 1px rgba(17, 17, 17, 0.5);
 box-shadow: 0 0 0 1px rgba(17, 17, 17, 0.5);

}

.PicCaroussel .SlideNav span:hover { 

 background: currentColor;
 cursor: pointer;

}

.PicCaroussel .SlideNav span.active { 

 background: currentColor;

}

.popout .SubSectionTitle, .projectDescription .SubSectionTitle { 

 border-bottom: 3px solid var(--main);
 width: 90%;
 margin-left: auto;
 margin-right: auto;

}

.projectDescription .SubSectionTitle { 

 width: 100%

}

  1. animation50SOS {
 width: 100%;
 height: auto;
 -webkit-box-shadow: 0 0 40px 5px var(--whiteish);
 box-shadow: 0 0 40px 5px var(--whiteish);
 margin: 5px auto;
 border: 3px solid var(--main);

}

/***********************************************************************************************************************************************************/ /* Homepage */

  1. loader-wrapper {
 position: fixed;
 width: 100vw;
 height: 100vh;
 top: 0;
 left: 0;
 background: white;
 z-index: 99999999;
 overflow: hidden;

}

  1. loader {
 display: block;
 position: absolute;
 left: 50%;
 top: 50%;
 width: 150px;
 height: 150px;
 margin: -75px 0 0 -75px;
 border-radius: 50%;
 border: 4px solid transparent;
 border-top-color: var(--main);
 -webkit-animation: spin 2s linear infinite;
 animation: spin 2s linear infinite;

}

  1. loader:before {
 content: "";
 position: absolute;
 top: 6px;
 left: 6px;
 right: 6px;
 bottom: 6px;
 border-radius: 50%;
 border: 4px solid transparent;
 border-top-color: var(--accent2);
 -webkit-animation: spin 3s linear infinite;
 animation: spin 3s linear infinite;

}

  1. loader:after {
 content: "";
 position: absolute;
 top: 17px;
 left: 17px;
 right: 17px;
 bottom: 17px;
 border-radius: 50%;
 border: 4px solid transparent;
 border-top-color: var(--accent1);
 -webkit-animation: spin 1.5s linear infinite;
 animation: spin 1.5s linear infinite;

}

  1. loader-wrapper #BestOnLargeScreens, #loader-wrapper #BadonEdge {
 display: none;
 padding: 0 10px;
 font-size: 20px;
 max-width: 90%;
 margin: 0 auto;
 text-align: center;
 position: relative;
 top: 80vh;

}

  1. loader-wrapper #BadonEdge {
 display: block;

}

/* if javascript is not enabled, remove loader */ .no-js#loader-wrapper, .no-js#loader-wrapper #loader { 

 display: none;

}

@-webkit-keyframes spin { 

 0% {
   -webkit-transform: rotate(0deg);
   transform: rotate(0deg);
 }

 100% {
   -webkit-transform: rotate(360deg);
   transform: rotate(360deg);
 }

}

@keyframes spin { 

 0% {
   -webkit-transform: rotate(0deg);
   transform: rotate(0deg);
 }

 100% {
   -webkit-transform: rotate(360deg);
   transform: rotate(360deg);
 }

}

.largerText { 

 font-size: 30px;
 position: relative;
 width: 100%;
 overflow: hidden;

}

.popout object { 

 display: block;
 margin: 10px auto;
 width: 100%;

}

.popout object.small { 

 height: 30vh;
 min-height: 200px;

}

.popout object.large { 

 height: 50vh;
 min-height: 300px;

}

.popout object.notebook { 

 height: 80vh;
 min-height: 600px;

}

.popout.Parts { 

 width: 90%;
 max-width: 1000px;

}

.popout.Parts.chapter.revealed { 

 max-width: 1100px;

}

.popout.Parts.revealed .collapsibleContent { 

 padding: 20px 30px 0px;

}

table.PartTable, table.ResultTable { 

 border-collapse: collapse;
 border-spacing: 0;
 width: 95%;
 /* max-width: 900px; */
 margin: 0 auto;
 table-layout: fixed;
 text-align: center;

}

table.PartTable tr:first-of-type { 

 border-bottom: 1px solid grey;

}

table.PartTable tr:nth-child(even), table.ResultTable tr:nth-child(even) { 

 background: rgba(255, 179, 117, 0.5);

}

table.PartTable td, table.PartTable th, table.ResultTable td, table.ResultTable th { 

 padding: 10px 5px;

}

table.PartTable.primers td:nth-child(2) { 

 word-break: break-all;

}

table.ResultTable { 

 text-align: left;

}

/***********************************************************************************************************************************************************/ /* Eventpage */ .title { 

 display: block;
 grid-column: 1 / span 2;
 border-bottom: 3px solid var(--main);

}

.cardtitle { 

 font-family: Kopje;
 display: inline-block;

}

.date { 

 font-family: Body;
 font-size: 1.95em;
 display: inline-block;
 width: 165px;
 margin-right: 30px;

}

.cardtext { 

 font-family: Body;
 -ms-flex-line-pack: center;
 align-content: center;

}

.cardtextfull { 

 grid-column: 1 / span 2;

}

.card { 

 opacity: 0;
 width: 85%;
 background: white;
 padding: 40px 40px 80px 40px;
 margin: 20px auto;
 display: grid;
 grid-gap: 20px;
 -webkit-box-shadow: 4px 0px 16px -3px rgba(0, 0, 0, 0.5);
 box-shadow: 4px 0px 16px -3px rgba(0, 0, 0, 0.5);
 border-radius: 10px;
 position: relative;
 z-index: 1;

}

.card.links { 

 grid-template-columns: 250px 1fr;

}

.card.rechts { 

 grid-template-columns: 1fr 250px;

}

.images { 

 width: 100%;
 display: grid;
 grid-gap: 10px;
 -ms-flex-line-pack: center;
 align-content: center;

}

.card .images img { 

 width: 100%;
 border: solid 2px var(--main);
 -webkit-transition: all 0.3s ease-in-out;
 transition: all 0.3s ease-in-out;
 position: relative;

}

img.scrolldown { 

 position: fixed;
 bottom: 10px;
 left: 50%;
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);
 width: 100px;
 height: auto;

}

.circle { 

 border-radius: 50%;
 display: block;
 position: absolute;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;

}

.halfcircle { 

 border-top-left-radius: 105px;
 border-bottom-left-radius: 105px;
 border-top-right-radius: 0;
 border-bottom-right-radius: 0;

}

.circle.small { 

 height: 50px;
 width: 50px;

}

.circle.normal { 

 height: 100px;
 width: 100px;

}

.halfcircle.halflarge { 

 height: 150px;
 width: 75px;

}

.circle.halfcircle.circle1 { 

 border-right: 0;

}

.circle.large { 

 height: 150px;
 width: 150px;

}

.circle.orange { 

 color: var(--main);
 background-color: var(--main);

}

.circle.accent1 { 

 color: var(--accent1);
 background-color: var(--accent1);

}

.circle.accent2 { 

 color: var(--accent2);
 background-color: var(--accent2);

}

.circle.accent3 { 

 color: var(--accent3);
 background-color: var(--accent3);

}

.circle.accent4 { 

 color: var(--accent4);
 background-color: var(--accent4);

}

.circle.accent5 { 

 color: var(--accent5);
 background-color: var(--accent5);

}

.circle.thick { 

 border: 30px solid;
 background-color: transparent;

}

.circle.thin { 

 border: 15px solid;
 background-color: transparent;

}

.parallaxCircles .circle.circle1 { 

 top: 320px;
 right: 0px;

}

.parallaxCircles .circle.circle2 { 

 top: 600px;
 right: 170px;

}

.parallaxCircles .circle.circle3 { 

 top: 150px;
 right: 50px;

}

.parallaxCircles .circle.circle4 { 

 top: 900px;
 right: 50px;

}

.parallaxCircles .circle.circle5 { 

 top: 650px;
 right: 150px;

}

.parallaxCircles .circle.circle6 { 

 top: 820px;
 left: -40px;

}

.parallaxCircles .circle.circle7 { 

 top: 300px;
 left: 50px;

}

.parallaxCircles .circle.circle8 { 

 top: 750px;
 left: 150px;

}

.parallaxCircles .circle.circle9 { 

 top: 850px;
 left: 250px;

}

.parallaxCircles .circle.circle10 { 

 top: 370px;
 left: 120px;

}

.visible:nth-child(1) { 

 margin-top: 100px;
 max-width: 950px;
 -webkit-animation: fly-from-bottom-left 0.8s forwards ease-out;
 animation: fly-from-bottom-left 0.8s forwards ease-out;

}

.visible:nth-child(3n+4) { 

 max-width: 950px;
 -webkit-animation: fly-from-bottom-left 0.9s forwards ease-out;
 animation: fly-from-bottom-left 0.9s forwards ease-out;

}

.visible:nth-child(3n+2) { 

 max-width: 1000px;
 -webkit-animation: fly-from-bottom-right 0.85s forwards ease-out;
 animation: fly-from-bottom-right 0.85s forwards ease-out;

}

.visible:nth-child(3n+0) { 

 max-width: 900px;
 -webkit-animation: fly-from-top-right 0.9s forwards ease-out;
 animation: fly-from-top-right 0.9s forwards ease-out;

}

@-webkit-keyframes fly-from-bottom-left { 

 0% {
   -webkit-transform: translate(-100vw, 100vh) rotate(-20deg) scale(3);
   transform: translate(-100vw, 100vh) rotate(-20deg) scale(3);
   opacity: 1;
 }

 100% {
   -webkit-transform: rotate(4deg) translateY(-25px) scale(1);
   transform: rotate(4deg) translateY(-25px) scale(1);
   opacity: 1;
 }

}

@keyframes fly-from-bottom-left { 

 0% {
   -webkit-transform: translate(-100vw, 100vh) rotate(-20deg) scale(3);
   transform: translate(-100vw, 100vh) rotate(-20deg) scale(3);
   opacity: 1;
 }

 100% {
   -webkit-transform: rotate(4deg) translateY(-25px) scale(1);
   transform: rotate(4deg) translateY(-25px) scale(1);
   opacity: 1;
 }

}

@-webkit-keyframes fly-from-bottom-right { 

 0% {
   -webkit-transform: translate(100vw, 100vh) rotate(20deg) scale(3);
   transform: translate(100vw, 100vh) rotate(20deg) scale(3);
   opacity: 1;
 }

 100% {
   -webkit-transform: rotate(-2deg) translateY(-30px) scale(1);
   transform: rotate(-2deg) translateY(-30px) scale(1);
   opacity: 1;
 }

}

@keyframes fly-from-bottom-right { 

 0% {
   -webkit-transform: translate(100vw, 100vh) rotate(20deg) scale(3);
   transform: translate(100vw, 100vh) rotate(20deg) scale(3);
   opacity: 1;
 }

 100% {
   -webkit-transform: rotate(-2deg) translateY(-30px) scale(1);
   transform: rotate(-2deg) translateY(-30px) scale(1);
   opacity: 1;
 }

}

@-webkit-keyframes fly-from-top-right { 

 0% {
   -webkit-transform: translate(100vw, -100vh) rotate(45deg) scale(3);
   transform: translate(100vw, -100vh) rotate(45deg) scale(3);
   opacity: 1;
   -webkit-filter: blur(10px);
   filter: blur(10px);
 }

 100% {
   -webkit-transform: rotate(0deg) translateY(-50px) scale(1);
   transform: rotate(0deg) translateY(-50px) scale(1);
   opacity: 1;
   -webkit-filter: blur(0);
   filter: blur(0);
 }

}

@keyframes fly-from-top-right { 

 0% {
   -webkit-transform: translate(100vw, -100vh) rotate(45deg) scale(3);
   transform: translate(100vw, -100vh) rotate(45deg) scale(3);
   opacity: 1;
   -webkit-filter: blur(10px);
   filter: blur(10px);
 }

 100% {
   -webkit-transform: rotate(0deg) translateY(-50px) scale(1);
   transform: rotate(0deg) translateY(-50px) scale(1);
   opacity: 1;
   -webkit-filter: blur(0);
   filter: blur(0);
 }

}

/***********************************************************************************************************************************************************/ /* Sponsorpage */ .SponsorFlexBox { 

 padding: 25px 0;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 -ms-flex-flow: row wrap;
 flex-flow: row wrap;
 -webkit-box-pack: space-evenly;
 -ms-flex-pack: space-evenly;
 justify-content: space-evenly;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -ms-flex-line-pack: center;
 align-content: center;

}

img.sponsorLogo { 

 width: 300px;
 height: auto;
 /* margin: 20px; */

}

a.sponsor { 

 display: block;
 margin: 10px;
 padding: 10px;

}

.container-text.sponsorPossibility { 

 text-align: center;
 text-align-last: center;

}

div.highlight { 

 background: rgba(178, 176, 155, 0.5);
 margin: 25px auto 0;

}

/***********************************************************************************************************************************************************/ /* Teampage */ header.white-out { 

 position: relative;
 display: block;

}

header.white-out::after { 

 position: absolute;
 content: ;
 display: block;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background: rgba(255, 255, 255, .5);

}

.headerpic { 

 width: 100%;
 height: auto;

}

.team { 

 content: url("T--Leiden--group_cropped_wide.jpg");

}

div.TeamFlexbox { 

 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 -ms-flex-flow: row wrap;
 flex-flow: row wrap;
 -webkit-box-pack: space-evenly;
 -ms-flex-pack: space-evenly;
 justify-content: space-evenly;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -ms-flex-line-pack: center;
 align-content: center;

}

.TeamMemberBox { 

 margin: 50px 25px;
 display: grid;
 justify-items: center;
 grid-template-columns: 1fr;

}

.PicBox { 

 position: relative;
 width: 200px;
 height: 200px;

}

img.MemberPic { 

 height: auto;
 width: 110%;
 margin-left: -5px;
 margin-top: -25px;

}

.circularPortrait { 

 width: 200px;
 height: 200px;
 overflow: hidden;
 position: relative;
 border-radius: 50%;
 border: 25px solid;

}

div.iconBox { 

 display: block;
 position: absolute;
 border: solid 30px;
 border-radius: 50%;

}

div.iconBox>i { 

 color: var(--blackish);
 font-size: 30px;
 position: absolute;
 top: 49%;
 left: 48%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);

}

.MemberDescription { 

 color: var(--blackish);
 width: 250px;

}

h2.MemberName, p.MemberFunction { 

 text-align: center;
 text-align-last: center;
 padding: 0;
 margin: 0;

}

p.MemberFunction { 

 font-size: 1.3em;

}

.underlined { 

 display: block;
 margin: auto;
 padding: 0 20px;

}

.underlined::after { 

 content: "";
 display: block;
 margin: 0 auto;
 border-bottom: var(--main) solid 5px;
 padding-top: 5px;
 width: 825px;

}

/* Change colors of each circle/member */ .TeamMemberBox:nth-child(8n+1) { 

 color: var(--main);

}

.TeamMemberBox:nth-child(8n+2) { 

 color: var(--accent4);

}

.TeamMemberBox:nth-child(8n+3) { 

 color: var(--accent1);

}

.TeamMemberBox:nth-child(8n+4) { 

 color: var(--accent2);

}

.TeamMemberBox:nth-child(8n+5) { 

 color: var(--accent4);

}

.TeamMemberBox:nth-child(8n+6) { 

 color: var(--main);

}

.TeamMemberBox:nth-child(8n+7) { 

 color: var(--accent2);

}

.TeamMemberBox:nth-child(8n+8) { 

 color: var(--accent1);

}

/* Change order of text-picture */ .TeamMemberBox:nth-child(2n+1) .PicBox { 

 grid-row: 1;

}

.TeamMemberBox:nth-child(2n+2) .PicBox { 

 grid-row: 2;

}

.TeamMemberBox:nth-child(2n+1) .MemberDescription { 

 grid-row: 2;

}

.TeamMemberBox:nth-child(2n+2) .MemberDescription { 

 grid-row: 1;

}

/* Change config of icon */ .TeamMemberBox:nth-child(4n+1) div.iconBox { 

 right: -25px;
 bottom: 0px;

}

.TeamMemberBox:nth-child(4n+2) div.iconBox { 

 top: 0px;
 left: -25px;

}

.TeamMemberBox:nth-child(4n+3) div.iconBox { 

 bottom: 0px;
 left: -25px;

}

.TeamMemberBox:nth-child(4n+4) div.iconBox { 

 top: 0px;
 right: -25px;

}

/* add some padding to the MemberDescription to align to the bottom/top */ .TeamMemberBox:nth-child(2n+1) .MemberDescription { 

 -ms-flex-item-align: start;
 align-self: start;
 padding-top: 20px;

}

.TeamMemberBox:nth-child(2n+2) .MemberDescription { 

 -ms-flex-item-align: end;
 align-self: end;
 padding-bottom: 20px;

}

.modal { 

 position: fixed;
 width: 100vw;
 height: 100vh;
 left: 0;
 top: 0;
 display: none;
 opacity: 0;
 background: rgb(0, 0, 0);
 background: rgba(0, 0, 0, 0.5);
 z-index: 2000;
 -webkit-transition: all 0.5s;
 transition: all 0.5s;
 color: var(--blackish);

}

span.close { 

 position: absolute;
 right: 20px;
 top: 20px;
 font-size: 30px;
 color: #888;
 padding: 0 10px;

}

span.close:hover, span.close:active { 

 color: #444;
 cursor: pointer;

}

.modalContent { 

 background: var(--whiteish);
 width: 80%;
 max-width: 800px;
 height: 95vh;
 max-height: 711px;
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
 overflow: auto;
 padding: 20px;
 text-align: center;
 text-align-last: center;
 border-radius: 20px;
 -webkit-box-shadow: 1px 1px 20px 1px #222;
 box-shadow: 1px 1px 20px 1px #222;

}

.ModalMemberName { 

 font-family: Kopje;
 font-size: 1.5rem;
 width: 90%;
 margin: auto;

}

div.separator { 

 display: block;
 background: var(--main);
 width: 55%;
 min-width: 200px;
 height: 2px;
 margin: 5px auto 0;

}

.ModalMemberFunction { 

 font-size: 1.5rem;
 width: 90%;
 display: block;
 margin: 0 auto 10px;

}

.CasualPic { 

 width: 80%;
 max-width: 450px;
 margin: 20px auto;

}

.CasualPic img { 

 width: 100%;
 height: auto;

}

.ModalStudy { 

 font-family: Kopje;
 font-size: 1.1rem;

}

.ModalDescription { 

 width: 82%;
 margin: 10px auto;

}

.ModalFunFact { 

 font-style: italic;
 width: 82%;
 margin: auto;
 /* padding-bottom: 10px; */

}

.TeamFlexbox.Members .PicBox, .TeamFlexbox.Members .MemberDescription { 

 cursor: pointer;

}

/***********************************************************************************************************************************************************/ div.CF { 

 margin: 0px auto 50px;
 background: rgba(247, 247, 247, 0.9);
 border-radius: 50px;
 border: 1px solid #cecdc0;
 /* padding-bottom: 0; */

}

  1. Global div.CF p.crowdfundingtext, div.CF p.crowdfundingtext {
 font-size: 1.4rem;
 padding: 20px 50px 10px;

}

  1. DonateButton {
 display: block;
 margin: 25px auto 0;
 width: -webkit-max-content;
 width: -moz-max-content;
 width: max-content;
 border: 2px solid var(--main);
 background: rgba(255, 179, 117, 0.4);
 border-radius: 15px;
 padding: 30px 25px;
 text-align: center;
 text-align-last: center;
 font-size: 35px;
 /* margin-top: 150px; */

}

/* static-dynamic switch */ div.StatDynSwitch { 

 position: fixed;
 display: block;
 bottom: 30px;
 right: 40px;

}

.switch { 

 position: relative;
 display: inline-block;
 width: 60px;
 height: 34px;
 margin: -10px 10px;

}

.switch input { 

 display: none

}

.slider { 

 position: absolute;
 cursor: pointer;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: var(--accent2);
 -webkit-transition: .4s;
 transition: .4s;
 -webkit-box-shadow: 0px 0px 5px #f7f7f7;
 box-shadow: 0px 0px 5px #f7f7f7;

}

.slider:before { 

 position: absolute;
 content: "";
 height: 26px;
 width: 26px;
 left: 4px;
 bottom: 4px;
 background-color: #f7f7f7;
 -webkit-transition: .4s;
 transition: .4s;

}

input:checked+.slider { 

 background-color: var(--accent3);

}

input:checked+.slider:before { 

 -webkit-transform: translateX(26px);
 transform: translateX(26px);

}

.slider { 

 border-radius: 34px;

}

.slider:before { 

 border-radius: 50%;

}

.StatDynSwitch>span { 

 display: inline-block;
 font-size: 20px;
 text-shadow: 0px 0px 5px #f7f7f7;

}

/***********************************************************************************************************************************************************/ /* InterLab */ ul#DeviceList li { 

 display: list-item;
 list-style-type: disc;
 list-style-position: inside;

}

div.InterLabFigureBox { 

 width: 80%;
 max-width: 600px;
 padding: 10px 0 25px;
 margin: auto;

}

img.InterLabFigure { 

 width: 100%;
 display: block;
 margin: auto;

}

/***********************************************************************************************************************************************************/ /* Featured */ .FeaturedFlexbox { 

 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 -ms-flex-flow: row wrap;
 flex-flow: row wrap;
 -webkit-box-pack: space-evenly;
 -ms-flex-pack: space-evenly;
 justify-content: space-evenly;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 -ms-flex-line-pack: center;
 align-content: center;

}

div.featuredBox { 

 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: vertical;
 -webkit-box-direction: normal;
 -ms-flex-direction: column;
 flex-direction: column;
 min-height: 0;
 margin: 50px 20px;
 min-width: 450px;
 width: 45%;
 max-width: 800px;
 height: 90vh;

}

.Feature { 

 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 -ms-flex-direction: row;
 flex-direction: row;
 /* firefox correction */
 min-width: 0;
 -webkit-box-align: center;
 -ms-flex-align: center;
 align-items: center;
 min-height: -webkit-max-content;
 min-height: -moz-max-content;
 min-height: max-content;

}

.Feature h3 { 

 min-width: -webkit-max-content;
 min-width: -moz-max-content;
 min-width: max-content;
 padding: 0px 20px;

}

.Feature h2 { 

 padding: 0 20px;
 margin-left: auto;
 width: -webkit-max-content;
 width: -moz-max-content;
 width: max-content;

}

div.ScrollBox { 

 margin-top: 10px;
 display: inline-block;
 -webkit-box-flex: 1;
 -ms-flex-positive: 1;
 flex-grow: 1;
 max-height: -webkit-max-content;
 max-height: -moz-max-content;
 max-height: max-content;
 border: 2px solid var(--main);
 overflow-y: scroll;
 width: 100%;

}

div.ScrollBox a img { 

 width: 100%;
 margin-top: auto;

}

div.ScrollBox a { 

 display: block;

}

/***********************************************************************************************************************************************************/ /* Newsletter */ /* correction */ .collapsibleContent div { 

 line-height: 150%;

}

table { 

 background: none;

}

/* other styling for Newsletter */ .popout { 

 display: block;
 width: 80%;
 max-width: 900px;
 margin: 15px auto;
 position: relative;
 z-index: 10;
 -webkit-transition: all 0s;
 transition: all 0s;

}

.popout:last-of-type, .popout.protocols:last-of-type, .popout.chapter:last-of-type { 

 margin-bottom: 75px;

}

.popout.revealed { 

 background: #fdfdfd;
 margin: 30px auto;
 -webkit-box-shadow: 2px 2px 15px 0px gray;
 box-shadow: 2px 2px 15px 0px gray;
 padding-bottom: 20px;
 -webkit-transition: all 0.7s;
 transition: all 0.7s;

}

.popout.revealed .collapsibleContent { 

 padding: 20px 75px 0px;
 opacity: 1;

}

.collapsible { 

 display: block;
 text-align: center;
 text-align-last: center;
 font-family: Body;
 font-size: 50px;
 padding: 17px 50px;
 width: 100%;
 position: relative;
 z-index: 15;
 color: rgb(235, 235, 235);

}

.collapsible::before { 

 position: absolute;
 content: ;
 top: 0;
 left: 0;
 height: 100%;
 width: 10px;
 background: var(--accent2);
 -webkit-transition: all 0.2s ease-in-out;
 transition: all 0.2s ease-in-out;
 z-index: 11;

}

.collapsible::after { 

 position: absolute;
 content: ;
 top: 0;
 left: 0;
 right: 0;
 width: 100%;
 background: var(--accent1);
 height: 100%;
 z-index: -1;

}

.collapsible:hover { 

 cursor: pointer;

}

.collapsible:hover::before { 

 width: 50px;

}

.collapsibleContent { 

 position: relative;
 max-height: 0;
 overflow-y: hidden;
 margin: auto;
 padding: 0px 75px 0;
 -webkit-transition: all 0s;
 transition: all 0s;
 opacity: 0;

}

.collapsibleContent.revealed { 

 -webkit-transition: all 0.7s;
 transition: all 0.7s;

}

/***********************************************************************************************************************************************************/ /* Attributions */ li.description { 

 margin-bottom: 15px;
 font-style: italic;
 padding-left: 12px;
 /* font-size: 0.95rem; */

}

h2.SubSectionTitle { 

 margin-top: 10px;

}

ul.bullet li { 

 list-style-type: disc;
 display: list-item;
 list-style-position: inside;

}

ul.bullet li.description { 

 padding-left: 37px;
 list-style-type: none;

}

ul.bullet li ul { 

 -webkit-padding-start: 40px;
 padding-inline-start: 40px;

}

ul.dashed li { 

 list-style-type: none;
 display: list-item;
 list-style-position: inside;
 padding-bottom: 10px;
 padding-left: 25px;
 text-indent: -25px;

}

ul.dashed li::before { 

 content: '-';
 margin-right: 20px

}

.popout p, .projectDescription p, #Global .popout p, #Global .projectDescription p { 

 padding: 10px 0;

}

/* .popout ul { 

 padding-bottom: 20px;

} */ /***********************************************************************************************************************************************************/ /* Protocols */ .popout.protocols { 

 margin: 5px auto;
 -webkit-transition: all 0.4s;
 transition: all 0.4s;

}

.popout.protocols.revealed { 

 max-width: 930px;
 margin: 15px auto;

}

.popout.protocols .collapsible { 

 font-size: 30px;

}

.popout.protocols .collapsibleContent.revealed { 

 -webkit-transition: all 0.4s;
 transition: all 0.4s;

}

ol li { 

 display: list-item;
 padding-left: 15px;

}

ol { 

 padding-left: 20px;

}

ul.indented li { 

 padding-left: 5px;
 list-style-position: inside;
 display: list-item;
 list-style-type: disc;

}

ul.indented li span.indent { 

 padding-left: 10px;

}

.protocols table { 

 margin: 10px 0 10px 13px;

}

.protocols th { 

 text-align: left;

}

table .top { 

 vertical-align: top;

}

.protocols table tr th:first-child, .protocols table tr td:first-child { 

 padding-right: 20px;

}

/***********************************************************************************************************************************************************/ /* Model */ .popout.chapter { 

 margin: 5px auto;
 -webkit-transition: all 0.6s;
 transition: all 0.6s;
 text-align: justify;

}

.popout.chapter.revealed { 

 max-width: 930px;
 margin: 15px auto;

}

.popout.chapter .collapsible { 

 font-size: 35px;

}

.popout.chapter .collapsibleContent.revealed { 

 -webkit-transition: all 0.6s;
 transition: all 0.6s;
 overflow-x: hidden;

}

span.eq span.katex-display { 

 /* margin-bottom: 25px; */

}

span.inline-eq { 

 font-size: 0.9em;

}

div#plot1 { 

 height: 500px;
 margin: 0 auto;

}

figure.resultfig { 

 width: 100%;
 margin: 40px auto;
 padding: 0 40px;
 overflow-y: hidden;

}

figure.resultfig.vertical { 

 width: 50%;

}

figure.resultfig.horizontal { 

 width: 80%;

}

figure.resultfig.wide { 

 padding: 0;

}

figure.resultfig img { 

 width: 100%;

}

figure#realisationPic { 

 position: relative;
 width: 100%;
 height: 400px;
 overflow-x: auto;
 background-image:
   -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), color-stop(70%, #fdfdfd)),
   -webkit-gradient(linear, right top, left top, color-stop(30%, #fdfdfd), to(rgba(255, 255, 255, 0))),
   radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0)),
   radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0));
 background-image:
   linear-gradient(to left, rgba(255, 255, 255, 0), #fdfdfd 70%),
   linear-gradient(to left, #fdfdfd 30%, rgba(255, 255, 255, 0)),
   radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0)),
   radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .2), rgba(255, 255, 255, 0));
 background-position: 0 50%, 100% 50%, 0 50%, 100% 50%;
 background-repeat: no-repeat;
 background-color: #fdfdfd;
 background-size: 50px 400px, 50px 400px, 15px 400px, 15px 400px;
 background-attachment: local, local, scroll, scroll;

}

figure#realisationPic>img { 

 height: 100%;
 width: auto;

}

div.FigFlexbox { 

 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction: normal;
 -ms-flex-flow: row wrap;
 flex-flow: row wrap;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 justify-content: center;

}

.FigFlexbox .flexfig { 

 width: 50%;

}

.FigFlexbox .flexfig.smallSize { 

 width: 50%;
 min-width: 200px;
 max-width: 259px;

}

.FigFlexbox .flexText { 

 width: 50%;
 min-width: 250px;

}

.FigFlexbox .flexText { 

 padding: 0 10px;
 border-bottom: 1px solid grey;

}

figcaption, caption { 

 font-size: 0.8em;
 text-align: justify;
 padding-top: 10px;

}

table caption { 

 padding-bottom: 10px;
 padding-top: 0;

}

figcaption b, caption b { 

 font-family: Kopje;

}

figure div.plot-container.plotly div.svg-container { 

 margin-top: -70px;

}

/***********************************************************************************************************************************************************/ /* Custom-made igem icons */ .icon { 

 /* use !important to prevent issues with browser extensions that change fonts */
 font-family: 'iGEMLeidenIcons' !important;
 speak: none;
 display: inline-block;
 font-style: normal;
 font-weight: normal;
 font-variant: normal;
 text-transform: none;
 line-height: 1;
 /* Better Font Rendering =========== */
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;

}

.icon.Applied-design:before { 

 content: "\e90a";

}

.icon.Attributions:before { 

 content: "\e900";

}

.icon.Demonstration:before { 

 content: "\e901";

}

.icon.Entrepreneurship:before { 

 content: "\e902";

}

.icon.Home-iGEM:before { 

 content: "\e903";

}

.icon.Model:before { 

 content: "\e904";

}

.icon.Notebook:before { 

 content: "\e905";

}

.icon.PE-E:before { 

 content: "\e906";

}

.icon.Project-description:before { 

 content: "\e907";

}

.icon.Protocols:before { 

 content: "\e908";

}

.icon.Results:before { 

 content: "\e909";

}

/***********************************************************************************************************************************************************/ /* Responsiveness*/ /* Global */ @media (max-width: 768px) { 

 #loader-wrapper #BestOnLargeScreens {
   display: block;
 }

 #loader-wrapper #BadonEdge {
   display: none;
 }

 body, #body {
   font-size: calc(100vw * 0.0058 + 12.5292px);
 }

 .container {
   width: 100%;
   padding: 0 20px;
 }

 .NavBlockIcon {
   font-size: 30px;
   top: 10%;
 }

 .NavBlock .NavBlockText {
   opacity: 1;
   top: 0px;
 }

}

@media (max-width: 425px) { 

 body, #body {
   font-size: 15px;
 }

}

@media (max-width: 700px) { 

 div#Fsos {
   font-size: calc(100vw * 0.0667 + 3.3px);
   width: 90%;
   margin: auto;
 }

 div#UnderTitle {
   font-size: calc(100vw * 0.0288 + 1.437px);
   width: 90%;
   margin: auto;
   padding: 0;
 }

}

/* Eventpage */ @media (max-width:768px) { 

 .card {
   width: 95%;
 }

 .card:first-child {
   margin-top: 20px;
 }

 .card:nth-child(3n+1) {
   -webkit-transform: rotate(0) translateY(0);
   transform: rotate(0) translateY(0);
   grid-template-columns: 1fr;
   opacity: 1;
   -webkit-animation: none;
   animation: none;
 }

 .card:nth-child(3n+2) {
   -webkit-transform: rotate(0) translateY(0);
   transform: rotate(0) translateY(0);
   grid-template-columns: 1fr;
   opacity: 1;
   -webkit-animation: none;
   animation: none;
 }

 .card:nth-child(3n+0) {
   -webkit-transform: translateY(0);
   transform: translateY(0);
   grid-template-columns: 1fr;
   opacity: 1;
   -webkit-animation: none;
   animation: none;
 }

 .cardtextfull {
   grid-column: 1;
 }

 .title {
   grid-column: 1;
   grid-row: 1;
 }

 .images {
   grid-row: 3;
 }

 .images.special {
   grid-row: 4;
 }

 .cardcontent {
   grid-row: 2;
 }

 .parallaxCircles.circle {
   display: none;
 }

}

@media (min-width:769px) { 

 .card.links:nth-child(3n+1) img:hover {
   -webkit-transform: scale(1.7) rotate(-4deg) translateX(100px);
   transform: scale(1.7) rotate(-4deg) translateX(100px);
   -webkit-box-shadow: -100px 0 20px -55px rgba(0, 0, 0, 0.2);
   box-shadow: -100px 0 20px -55px rgba(0, 0, 0, 0.2);
   z-index: 99;
 }

 .card.links:nth-child(3n+2) img:hover {
   -webkit-transform: scale(1.7) rotate(2deg) translateX(100px);
   transform: scale(1.7) rotate(2deg) translateX(100px);
   -webkit-box-shadow: -100px 0 20px -55px rgba(0, 0, 0, 0.2);
   box-shadow: -100px 0 20px -55px rgba(0, 0, 0, 0.2);
   z-index: 99;
 }

 .card.links:nth-child(3n+0) img:hover {
   -webkit-transform: scale(1.7) translateX(100px);
   transform: scale(1.7) translateX(100px);
   -webkit-box-shadow: -100px 0 20px -55px rgba(0, 0, 0, 0.2);
   box-shadow: -100px 0 20px -55px rgba(0, 0, 0, 0.2);
   z-index: 99;
 }

 .card.rechts:nth-child(3n+1) img:hover {
   -webkit-transform: scale(1.7) rotate(-4deg) translateX(-100px);
   transform: scale(1.7) rotate(-4deg) translateX(-100px);
   -webkit-box-shadow: 100px 0 20px -55px rgba(0, 0, 0, 0.2);
   box-shadow: 100px 0 20px -55px rgba(0, 0, 0, 0.2);
   z-index: 99;
 }

 .card.rechts:nth-child(3n+2) img:hover {
   -webkit-transform: scale(1.7) rotate(2deg) translateX(-100px);
   transform: scale(1.7) rotate(2deg) translateX(-100px);
   -webkit-box-shadow: 100px 0 20px -55px rgba(0, 0, 0, 0.2);
   box-shadow: 100px 0 20px -55px rgba(0, 0, 0, 0.2);
   z-index: 99;
 }

 .card.rechts:nth-child(3n+0) img:hover {
   -webkit-transform: scale(1.7) translateX(-100px);
   transform: scale(1.7) translateX(-100px);
   -webkit-box-shadow: 100px 0 20px -55px rgba(0, 0, 0, 0.2);
   box-shadow: 100px 0 20px -55px rgba(0, 0, 0, 0.2);
   z-index: 99;
 }

}

/**************** sponsorpage *********************/ @media (max-width:849px) { 

 .SponsorFlexBox {
   padding: 20px 0;
 }

 a.sponsor {
   margin: 20px 10px;
 }

 img.sponsorLogo {
   width: 60vw;
 }

}

/**************** teampage *********************/ @media (max-width:1083px) { 

 .underlined::after {
   width: 615px;
 }

}

@media (max-width:673px) { 

 .underlined::after {
   width: 500px;
 }

}

@media (max-width:549px) { 

 .underlined::after {
   width: 90%;
 }

}

@media (max-width:421px) { 

 .underlined::after {
   width: 270px;
 }

}

@media (max-width:768px) { 

 .team {
   content: url("T--Leiden--group_cropped_square.jpg")
 }

 .TeamMemberBox:nth-child(2n+2) .PicBox {
   grid-row: 1;
 }

 .TeamMemberBox:nth-child(2n+2) .MemberDescription {
   grid-row: 2;
 }

 .TeamMemberBox:nth-child(2n+1) .MemberDescription {
   -ms-flex-item-align: start;
   align-self: start;
   padding-top: 15px;
 }

 .TeamMemberBox:nth-child(2n+2) .MemberDescription {
   -ms-flex-item-align: start;
   align-self: start;
   padding-top: 15px;
 }

 .TeamMemberBox {
   margin: 30px 0;
   height: auto;
 }

 .modalContent {
   width: calc(100% - 40px);
   height: calc(100% - 40px);
   border-radius: 10px;
   max-height: none;
   margin: 20px;
 }

}

@media (max-width:425px) { 

 .modalContent {
   width: 100%;
   height: 100%;
   border-radius: 0;
   margin: 0;
 }

 .ModalFunFact {
   padding-bottom: 5px;
 }

 span.close {
   right: 10px;
   top: 10px;
 }

}

/**************** crowdfundingpage *********************/ @media (max-width:768px) { 

 #excessive {
   display: none;
 }

 div.bubbles span.circle.right, div.bubbles span.circle.left {
   -webkit-animation: none;
   animation: none;
   display: none;
 }

}

@media (max-width:450px) { 

 .countdown {
   display: block;
   width: 200px;
   margin: auto;
 }

 #DonateButton {
   margin-top: 0px;
 }

}

/**************** InterLab *********************/ @media (max-width: 768px) { 

 div.InterLabFigureBox {
   width: 100%;
 }

}

/**************** Featured *********************/ @media (max-width: 1000px) { 

 div.featuredBox {
   width: 70%;
 }

}

@media (max-width: 768px) { 

 div.featuredBox {
   width: 90%;
   min-width: inherit;
   margin: 15px 0;
 }

 .Feature {
   -webkit-box-orient: vertical;
   -webkit-box-direction: normal;
   -ms-flex-direction: column;
   flex-direction: column;
 }

 .Feature h2 {
   width: auto;
   text-align: center;
   margin-left: 0;
 }

}

/**************** Newsletter *********************/ @media (max-width: 768px) { 

 .collapsibleContent {
   padding: 0px 20px;
 }

 .popout.revealed .collapsibleContent {
   padding: 20px;
 }

 .popout.revealed {
   padding: 0;
 }

 .collapsible {
   font-size: 35px;
 }

 .popout {
   width: 90%;
 }

 /* .collapsible::before {
   height: 100%;
 } */

}

@media (max-width: 425px) { 

 .popout.revealed .collapsibleContent {
   padding: 20px;
   padding-top: 20px;
 }

 .popout, .popout.chapter, .popout.protocols {
   width: calc(100vw - 40px);
   margin-left: 20px;
   margin-right: 20px;
 }

}

/**************** Model *********************/ @media (max-width: 950px) { 

 .FigFlexbox .flexfig {
   width: 400px;
 }

 .FigFlexbox .flexfig.smallSize {
   width: 80%;
   max-width: none;
 }

 figure.resultfig {
   width: 100%;
   margin: 40px auto;
   padding: 0;
   overflow-y: hidden;
 }

}

/**************** Timeline *********************/ @media (max-width: 768px) { 

 figure.resultfig.vertical {
   width: 60%;
 }

 figure.resultfig.horizontal {
   width: 90%;
 }

 .timeline li.timelineUnit {
   margin-top: -5px;
   padding-bottom: 50px;
 }

 .timeline li.timelineUnit .timelineContent {
   width: calc(95% - 50px);
 }

 .timelineUnit.right .timelineContent, .timelineUnit.left .timelineContent {
   left: calc(5% + 70px)
 }

 .timeline li.timelineUnit.right .timelineContent.revealed, .timeline li.timelineUnit.left .timelineContent.revealed {
   left: calc(5% + 50px);
   right: auto;
   opacity: 1;
 }

 .left .timelineContent .title {
   border-radius: 0 20px 0 0;
 }

 .timeline li.timelineUnit .linesegment {
   position: absolute;
   display: block;
   width: 8px;
   top: 0;
   bottom: 0;
   background: var(--main);
   border-radius: 4px;
 }

 .timeline li.timelineUnit.left .linesegment, .timeline li.timelineUnit.right .linesegment {
   left: calc(5% - 4px);
   right: auto;
 }

 .timeline li.timelineUnit.left i.iHPicon, .timeline li.timelineUnit.right i.iHPicon {
   left: 5%;
   right: auto;
   -webkit-transform: translateX(-50%);
   transform: translateX(-50%);
 }

 .timeline li.timelineUnit.right .arrow, .timeline li.timelineUnit.left .arrow {
   right: 100%;
   left: auto;
   border-radius: 100% 0 0 0;
 }

 .link.LeftRight1, .link.LeftRight2, .link.RightLeft1, .link.RightLeft2 {
   display: none;
 }

 .timeline li.timelineUnit.semiconclusion.left .arrow {
   border-top: 0;
   border-bottom: 42px solid var(--main);
   border-radius: 0 0 0 100%;
 }

 /* .timeline li.timelineUnit.semiconclusion.left .arrow {
   border-top: 0;
   border-bottom: 42px solid var(--main);
   border-radius: 0 0 100% 0;
 } */
 .timeline li.link.LeftMid1, .timeline li.link.RightMid1 {
   width: calc(25% + 4px);
   border-width: 0 0 8px 8px;
   left: calc(5% - 4px);
   -webkit-transform: skewY(10deg);
   transform: skewY(10deg);
   -webkit-transform-origin: 100% 0;
   transform-origin: 100% 0;
   border-radius: 0 0 0 30px;
   margin-top: 4px;
 }

 .timeline li.link.LeftMid2, .timeline li.link.RightMid2 {
   width: calc(20% + 5px);
   margin-top: -8px;
   margin-bottom: 5px;
   border-width: 8px 8px 0 0;
   left: calc(30% - 0px);
   -webkit-transform: skewY(10deg);
   transform: skewY(10deg);
   -webkit-transform-origin: 0 0;
   transform-origin: 0 0;
   border-radius: 0 30px 0 0;
 }

 .timeline li.link.MidLeft1, .timeline li.link.MidRight1 {
   width: calc(20% + 4px);
   border-width: 0 8px 8px 0px;
   left: calc(30% + 1px);
   -webkit-transform: skewY(-10deg);
   transform: skewY(-10deg);
   -webkit-transform-origin: 0 100%;
   transform-origin: 0 100%;
   border-radius: 0 0 30px 0;
   margin-top: 4px;
 }

 .timeline li.link.MidLeft2, .timeline li.link.MidRight2 {
   width: calc(25% + 5px);
   margin-top: -8px;
   margin-bottom: 0px;
   border-width: 8px 0 0 8px;
   left: calc(5% - 4px);
   -webkit-transform: skewY(-10deg);
   transform: skewY(-10deg);
   -webkit-transform-origin: 100% 0;
   transform-origin: 100% 0;
   border-radius: 30px 0 0 0;
 }

 .popout .PicCaroussel.vertical {
   width: 60%;
 }

 .popout .PicCaroussel.horizontal {
   width: 100%;
 }

}

.AchievementBox1 { 

 height: 290px;
 width: 290px;
 background-color: var(--whiteish);
 border: 20px solid currentColor;

border-radius: 50%; position: relative; margin: 25px; 

   padding:10px;

}

.Achievement { 

 width: 100%;
 height: 100%;

}

.AchievementBox1:nth-child(5n+1) { 

 color: var(--main);

} .AchievementBox1:nth-child(5n+2) { 

 color: var(--accent1);

} .AchievementBox1:nth-child(5n+3) { 

 color: var(--accent2);

} .AchievementBox1:nth-child(5n+4) { 

 color: var(--accent3);

} .AchievementBox1:nth-child(5n+5) { 

 color: var(--accent4);

} .AchievementBox1 p { 

 display: block;
 position: relative;
 top: 50%;
 transform: translateY(-50%);
 text-align: center;
 color: var(--blackish);
 font-size: 25px;

} .AchievementBox1:nth-child(4n+1) div.iconBox { 

 right: -15px;
 bottom: -15px;

}

.AchievementBox1:nth-child(4n+2) div.iconBox { 

 top: -15px;
 left: -15px;

}

.AchievementBox1:nth-child(4n+3) div.iconBox { 

 bottom: -15px;
 left: -15px;

}

.AchievementBox1:nth-child(4n+4) div.iconBox { 

 top: -15px;
 right: -15px;

}

.padding-top { 

 padding-top:20px;

}

@media (max-width: 420px) { 

 .padding-top{
   padding-top:0;
 }
 .AchievementBox1{
   width:240px;
   height:240px;

margin-left:0; margin-right:0; 

 }
 .AchievementBox1 p {
   font-size:20px;
 }

.AchievementBox1:nth-child(4n+1) div.iconBox { 

 right: -25px;
 bottom: -25px;

}

.AchievementBox1:nth-child(4n+2) div.iconBox { 

 top: -25px;
 left: -25px;

}

.AchievementBox1:nth-child(4n+3) div.iconBox { 

 bottom: -25px;
 left: -25px;

}

.AchievementBox1:nth-child(4n+4) div.iconBox { 

 top: -25px;
 right: -25px;

} }