From 45c45be1094a4c6c88e16a65cb18775b1dd4b54d Mon Sep 17 00:00:00 2001
From: liliana <liliana.sanfilippo@uni-bielefeld.de>
Date: Fri, 19 Jul 2024 11:29:15 +0200
Subject: [PATCH] beautify
---
src/App/App.css | 4248 ++++++++++++++++++++++++++---------------------
1 file changed, 2358 insertions(+), 1890 deletions(-)
diff --git a/src/App/App.css b/src/App/App.css
index 9b167a5b..3f23a28f 100644
--- a/src/App/App.css
+++ b/src/App/App.css
@@ -1,1955 +1,2423 @@
/* * * * * * * */
+
+
+
+
/* * COLOURS * */
+
+
+
+
/* * * * * * * */
+
+
:root {
/* our colours*/
- --text-primary: #850F78;
- --mediumpurple: #bc15aa;
+
+ --text-primary: #850F78;
+ --mediumpurple: #bc15aa;
/*--purple: #B85BD1; */
- --accen-secondary: #F57D22;
- --accent-primary: #F4CC1E;
- --lightyellow: #fae99e;
- --lightblue: #A0A7F3 ;
- --verylightblue: #ebecfd;
- --offblack: #32232C ;
- --cebitecgray: #8295A4;
+
+
+
+ --accen-secondary: #F57D22;
+ --accent-primary: #F4CC1E;
+ --lightyellow: #fae99e;
+ --lightblue: #A0A7F3;
+ --verylightblue: #ebecfd;
+ --offblack: #32232C;
+ --cebitecgray: #8295A4;
/*--offwhite: #e9dff1; */
- --ourbeige: #FFF6F2;
- --darkerbeige: #e2dad7;
- --background: #FFF6F2;
+
+
+
+ --ourbeige: #FFF6F2;
+ --darkerbeige: #e2dad7;
+ --background: #FFF6F2;
/*igem colours*/
- --igemdarkgreen: #006530;
- --igemmediumgreen: #019968;
- --igemlightgreen: #99cb9a;
-
- --info-border-color: var(--mediumpurple);
- --vp-ct: var(--text-primary);
- --info-border-color: var(--accent-primary);
- --info-bg-color: var(--lightyellow);
- --info-title-color: var(--text-primary);
- --info-code-bg-color: var(--lightyellow);
- --note-border-color: var(--text-primary);
- --note-bg-color: var(--darkoffwhite);
+
+
+
+ --igemdarkgreen: #006530;
+ --igemmediumgreen: #019968;
+ --igemlightgreen: #99cb9a;
+ --info-border-color: var(--mediumpurple);
+ --vp-ct: var(--text-primary);
+ --info-border-color: var(--accent-primary);
+ --info-bg-color: var(--lightyellow);
+ --info-title-color: var(--text-primary);
+ --info-code-bg-color: var(--lightyellow);
+ --note-border-color: var(--text-primary);
+ --note-bg-color: var(--darkoffwhite);
--note-title-color: var(--text-primary);
--note-code-bg-color: var(--darkoffwhite);
- --tip-border-color: var(--text-primary);
- --tip-bg-color: var(--darkoffwhite);
+ --tip-border-color: var(--text-primary);
+ --tip-bg-color: var(--darkoffwhite);
--tip-title-color: var(--text-primary);
--tip-code-bg-color: var(--darkoffwhite);
- --warning-border-color: var(--accen-secondary);
- --warning-bg-color: var(--lightorange);
+ --warning-border-color: var(--accen-secondary);
+ --warning-bg-color: var(--lightorange);
--warning-title-color: var(--text-primary);
- --warning-code-bg-color: var(--lightorange);
-
-}
-
-
-/* * * * * * * */
-/* * * BODY* * */
-/* * * * * * * */
-body {
+ --warning-code-bg-color: var(--lightorange);
+ }
+
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * * BODY* * */
+
+
+
+
+ /* * * * * * * */
+
+
+ body {
/* padding-top: 56px; */
- background-color: var(--ourbeige);
- color: #493843;
-}
-body.dark-mode {
- background-color: var(--offblack);
- color: white;
-}
-p {
- text-align: justify;
-}
-a {
- color: var(--lightblue) !important;
- text-decoration: none !important;
-}
-
-
-
-/* * * * * * * */
-/* *SIDEBAR* * */
-/* * * * * * * */
-
-.sidebar{
- border-left: 6px solid;
- border-left-color: var(--text-primary);
- border-color: var(--accent-primary);
- color: var(--text-primary);
- list-style-type: none;
- line-height: 280%;
- margin: 0px 0px;
- padding: 0px 0px;
-}
-.sidebar>div>a>span:hover{
- text-shadow: 5px 5px 15px black;
- transition: all 0.1s linear;
-}
-.sidebar>div{
-overflow: hidden;
-text-align: center;
-cursor: pointer;
-}
-.sidebar>div>a>span{
-padding: 1rem;
-color: var(--text-primary);
-}
-.active-scroll-spy{
- background-color: yellowgreen !important;
-}
-
-/* * * * * * * */
-/* * GENERAL * */
-/* * * * * * * */
-.relative{position: relative;}
-.absolute{position: absolute;}
-.left-aligned {margin-left: auto;}
-.align-items-center{align-items:center!important}
-.zweirem{padding: 2rem;}
-.left{float: left;}
-.right{float: right;}
-.sticky-top {
- position: -webkit-sticky;
- position: sticky !important;
- top: 0;
- z-index: 1020;
- top: 80px !important;
- overflow-wrap: break-word;
-}
-.fullsize{
- max-height: 100% !important;
- max-width: 100% !important;
-}
-.header-container{
- padding-top: 380px;
- padding-bottom: 60px;
- background-color: var(--ourbeige);
-}
-.null{
- padding: 0% !important;
- margin: 0% !important;
-}
-.v-align-m{
- vertical-align: middle !important;
-}
-.fit-cont{
- max-width: fit-content;
-}
-.center{
- display: flex !important;
- align-items: center !important;
- text-align: center;
-}
-.shadow{
- box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
-}
-/* * * * * * * */
-/* * NAVBAR * */
-/* * * * * * * */
-.nav-link{
- color: var(--text-primary) !important;
-}
-.nav-link:hover {
- color: white !important;
- background-color: var(--text-primary) !important;
- border-radius: 7px;
-}
-.navbar{
- backdrop-filter: blur(5px);
- transition: visibility 0s, 0.6s, opacity 0.6s linear, transform 1s;
-}
- nav.navbar {
- padding-top: 1rem;
- padding-bottom: 1rem;
-}
-.dropdown-item{
- color: var(--text-primary) !important;
-}
-.dropdown-item:hover{
- color: white !important;
- background-color: var(--text-primary) !important;
-}
-.nav-item.dropdown:hover .dropdown-menu {
- display: block;
- background-color: white;
- border-color: var(--text-primary);
- border-radius: 7px;
-}
-.navbar-brand{
- color: var(--text-primary) !important;
-}
-.dropdown-menu{
- margin-top: 0 !important;
-}
-/* TABLES */
-table {
- font-family: arial, sans-serif;
- border-collapse: collapse;
- width: 100%;
-}
-
-td, th {
- border: 1px solid black;
- text-align: left;
- padding: 8px;
-}
-
-tr:nth-child(even) {
- background-color: #ededed;
-}
-tr:nth-child(odd) {
- background-color: #f3f3f3;
-}
-tr:nth-child(1) {
- background-color: var(--lightblue) !important;
-}
-
-/* * * * * * * */
-/* BACKGROUND */
-/* * * * * * * */
-.bg-video-container{
-margin-bottom: 10vw !important;
-}
-.bg-d{
- background-color: var(--text-primary) !important;
-}
-.bg-l{
- background-color: var(--text-primary) !important;
- color: white;
-}
-.bg-transp{
- background:transparent;
- color: var(--text-primary);
-}
-
-/* * * * * * * */
-/* *HEADINGS * */
-/* * * * * * * */
-
-.base {
- width: 100%;
- background-color: var(--accent-primary);
- padding: 120px 30px;
-}
-
-.header-title{
- color: var(--text-primary);
- text-align: left;
- align-self: flex-start;
- padding: 0 30px;
- font-size: 130px;
- font-weight: 900;
- line-height: 130px;
-}
-
-/* p:first-child::first-letter{
- color:var(--text-primary);
- font-weight: bold;
- font-size: x-large;
-} */
-.popart{
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 5vw;
- letter-spacing:0.1em;
- -webkit-text-fill-color: transparent;
- -webkit-text-stroke-width: 0.3vw;
- -webkit-text-stroke-color: var(--accent-primary);
- text-shadow:
- 0.4vw 0.4vw var(--mediumpurple),
- 0.8vw 0.8vw var(--offblack);
-}
-h2{
- font-size: 3rem !important;
- -webkit-background-clip: text !important;
- -webkit-text-stroke-width: 2px !important;
- -webkit-text-stroke-color: var(--text-primary) !important;
- background-clip: text !important;
- color: transparent !important;
- padding-top: 15px !important;
- background-image: repeating-linear-gradient(-45deg, var(--text-primary) 0, var(--text-primary) 2px, white 2px, white 4px) !important;
-}
-
-.underline--magical {
- background-image: linear-gradient(120deg, var(--lightblue) 0%, var(--mediumpurple) 100%);
- background-repeat: no-repeat;
- color: black;
- background-size: 100% 0.2em;
- background-position: 0 105%;
- transition: background-size 0.25s ease-in;
-}
-.underline--magical:hover {
- background-size: 100% 100%;
- color: black !important;
- text-decoration: none !important;
-}
-
-.v2 p {
- background-position: left;
- background-size: 0% 100%;
- background-image: linear-gradient(#f6e05e, #f6e05e);
-}
-.v2:hover p {
- background-size: 100% 100%;
-}
-
-.v3 p {
- color: transparent;
- background-position: right;
- background-size: 100% 100%;
- background-image: linear-gradient(#a0aec0, #a0aec0);
-}
-.v3:hover p {
- color: #000;
- background-size: 0% 100%;
-}
-
-
-/* * * * * * * */
-/* * CALLOUT * */
-/* * * * * * * */
-
-.bg-b{
- background-color: var(--ourbeige);
-}
-.bd-callout {
- padding: 1.25rem;
- margin-top: 1.25rem;
- margin-bottom: 1.25rem;
- border: 1px solid #e9ecef;
- border-left-width: 0.25rem;
- border-radius: 0.25rem;
-}
-
-.bd-callout h4 {
- margin-bottom: 0.25rem;
-}
-
-.bd-callout p:last-child {
- margin-bottom: 0;
-}
-
-.bd-callout code {
- border-radius: 0.25rem;
-}
-
-.bd-callout + .bd-callout {
- margin-top: -0.25rem;
-}
-
-.bd-callout-info {
- border-left-color: #ABD2FA;
-}
-
-.bd-callout-warning {
- border-left-color: #f0ad4e;
-}
-
-.bd-callout-danger {
- border-left-color: #d9534f;
-}
-
-/* * * * * * * */
-/* * FOOTER * */
-/* * * * * * * */
-footer{
- background-color: var(--background);
-}
-footer a {
- color: white;
- font-weight: bold;
- text-decoration: none;
-}
-footer a:hover {
- color: white;
- text-decoration: underline;
-}
-
-
-/* * * * * * * * */
-/*VILLAGE BUTTONS*/
-/* * * * * * * * */
-.bottom-buttons{
- margin-top: 50px !important;
- margin-bottom: 20px;
- padding-left: 30px;
-}
-.village-style-button{
- box-shadow: 5px 5px 15px gray !important;
- border-radius: 2rem !important;
- padding: 0 !important;
- max-width: 12% !important;
- aspect-ratio: 2 / 3 !important;
- margin-left: 1vw;
-}
-.village-style-button:hover{
- box-shadow: 5px 5px 15px black !important;
-}
-.village-style-button h3{
- text-align: center !important;
- font-size: 10px;
- font-weight: bold;
- color: #000;
-}
-.village-style-button img{
- max-width: 70% !important;
- max-height: 70% !important;
- padding-top: 20px !important;
-}
-
-/* * * * * * * * * */
-/* * * IMAGES * * */
-/* * * * * * * * * */
-img,
-picture,
-svg {
- max-width: 100%;
- display: block;
-}
-img .middle{
- vertical-align:middle;
-}
-.socials{
- height: 1.5rem;
- width: auto;
- margin: 0.5rem;
-}
-.spin {
- transition: transform 1s ease-in-out;
-}
-.spin:hover{
- transform: rotate(360deg);
-}
-.img-sponsor{
- max-width: 70%;
- max-height: 150px;
- margin-left: auto;
- margin-right: auto;
-}
-.img-right{
- float: right !important;
- padding-left: 2vw !important;
- padding-bottom: 1vw !important;
- padding-top: 1vw !important;
-}
-.img-left{
- float: left !important;
- padding-right: 2vw !important;
- padding-bottom: 1vw !important;
- padding-top: 1vw !important;
-}
-.img-half{
- max-width: 50% !important;
-}
-
-.img-round{
- border-radius: 50%;
- max-width: 80%;
-}
-.updown{
- max-width: 3vw;
-}
-
-.hexagon{
- clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
-}
-
-/* * * * * * * */
-/* * * SVG * * */
-/* * * * * * * */
-svg{
- background:transparent
-}
-.hone svg text{
- font-size: 7vw !important;
- stroke-width:2px !important;
- fill:var(--accent-primary) ;
- stroke:var(--text-primary);
- /*letter-spacing:4px;*/
- animation:effect 3s, dash 3s;
-}
-.hone svg text:hover{
- fill: var(--text-primary)
-}
-
-
-
-
-/* * * * * * * */
-/* MEDIA RULES */
-/* * * * * * * */
-/*For tablet or bigger*/
-@media screen and (min-width: 992px) {
- /* navbar opens on hover*/
- .dropdown:hover .dropdown-menu {
- display: block;
- }
-}
-/*For Tablet and smaller*/
-@media screen and (max-width: 992px){
-
-}
-/*For Smartphones*/
-@media screen and (max-width: 768px){
- svg text{
- font-size: 9vw;
- stroke-width:1px;
- }
- .village-style-button h3{
- display: none !important;
+
+
+
+ background-color: var(--ourbeige);
+ color: #493843;
}
- .village-style-button{
- box-shadow: 1px 1px 1px gray;
- border-radius: 10px;
- border-color: black;
+
+ body.dark-mode {
+ background-color: var(--offblack);
+ color: white;
}
- .village-style-button:hover{
- box-shadow: none;
+
+ p {
+ text-align: justify;
}
- .village-style-button img{
- max-width: 90%;
- max-height: 90%;
- padding-top: 10px;
- padding-bottom: 5px;
+
+ a {
+ color: var(--lightblue) !important;
+ text-decoration: none !important;
+ }
+
+
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* *SIDEBAR* * */
+
+
+
+
+ /* * * * * * * */
+
+
+
+ .sidebar {
+ border-left: 6px solid;
+ border-left-color: var(--text-primary);
+ border-color: var(--accent-primary);
+ color: var(--text-primary);
+ list-style-type: none;
+ line-height: 280%;
+ margin: 0px 0px;
+ padding: 0px 0px;
+ }
+
+ .sidebar>div>a>span:hover {
+ text-shadow: 5px 5px 15px black;
+ transition: all 0.1s linear;
+ }
+
+ .sidebar>div {
+ overflow: hidden;
+ text-align: center;
+ cursor: pointer;
+ }
+
+ .sidebar>div>a>span {
+ padding: 1rem;
+ color: var(--text-primary);
+ }
+
+ .active-scroll-spy {
+ background-color: yellowgreen !important;
+ }
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * GENERAL * */
+
+
+
+
+ /* * * * * * * */
+
+
+ .relative {
+ position: relative;
+ }
+
+ .absolute {
+ position: absolute;
+ }
+
+ .left-aligned {
+ margin-left: auto;
+ }
+
+ .align-items-center {
+ align-items: center!important
+ }
+
+ .zweirem {
+ padding: 2rem;
+ }
+
+ .left {
+ float: left;
}
- .img-half{
+
+ .right {
+ float: right;
+ }
+
+ .sticky-top {
+ position: -webkit-sticky;
+ position: sticky !important;
+ top: 0;
+ z-index: 1020;
+ top: 80px !important;
+ overflow-wrap: break-word;
+ }
+
+ .fullsize {
+ max-height: 100% !important;
max-width: 100% !important;
}
-}
-/*Bigger than smartphones*/
-@media only screen and (min-width: 768px) {
- .col-1 {width: 8.33%;}
- .col-2 {width: 16.66%;}
- .col-3 {width: 25%;}
- .col-4 {width: 33.33%;}
- .col-5 {width: 41.66%;}
- .col-6 {width: 50%;}
- .col-7 {width: 58.33%;}
- .col-8 {width: 66.66%;}
- .col-9 {width: 75%;}
- .col-10 {width: 83.33%;}
- .col-11 {width: 91.66%;}
- .col-12 {width: 100%;}
-
-}
-
-
-/* * * * * * * */
-/* * EFFECTS * */
-/* * * * * * * */
-@keyframes effect{
- 0%{
- stroke-dasharray:0 70%;
+ .header-container {
+ padding-top: 380px;
+ padding-bottom: 60px;
+ background-color: var(--ourbeige);
}
- 100%{
- stroke-dasharray:10% 0%;
- stroke-dashoffset:20%;
+
+ .null {
+ padding: 0% !important;
+ margin: 0% !important;
}
-}
-@keyframes dash {
- 0% {
- stroke-dashoffset: 1300;
+
+ .v-align-m {
+ vertical-align: middle !important;
}
- 35% {
- fill-opacity: 0;
+
+ .fit-cont {
+ max-width: fit-content;
}
- 50% {
- stroke-dashoffset: 0;
+
+ .center {
+ display: flex !important;
+ align-items: center !important;
+ text-align: center;
}
- 100% {
- stroke-dashoffset: 0;
- fill-opacity: 1;
+
+ .shadow {
+ box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
}
-}
-
-/* Headings */
-.revealUp {
- opacity: 0;
- visibility: hidden;
-}
-.spacer {
- height: 50vh;
- background-color: #000;
-}
-
-.hello:hover {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 25vw;
- animation-name: jumpy;
- animation-iteration-count: infinite;
- animation-timing-function: ease-in-out;
- -webkit-text-stroke-width: 3px;
- -webkit-text-stroke-color: black;
-}
-
-.error{
- background-color: lightgray;
- border-radius: 10px;
- color: black;
- padding-left: 1vw;
- padding-right: 1vw;
-}
-
-
-/* TIMELINE EINS */
-
-.timeline-container {
- display: flex;
- flex-direction: column;
- position: relative;
- margin: 40px 0;
-}
-
-.timeline-container::after {
- background-color: var(--text-primary);
- position: absolute;
- left: calc(50% - 2px);
- content: "";
- width: 4px;
- height: 100%;
- z-index: 0;
-}
-.timeline-item {
- min-width: 100px;
- /* display: flex; */
- justify-content: flex-end;
- padding-right: 30px;
- position: relative;
- margin: 10px 0;
- width: 50%;
-}
-
-.timeline-item:nth-child(odd) {
- align-self: flex-end;
- justify-content: flex-start;
- padding-left: 30px;
- padding-right: 0;
-}
-.timeline-item-content {
- box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
- border-radius: 5px;
- background-color: #fff;
- display: flex;
- flex-direction: column;
- align-items: flex-end;
- padding: 15px;
- position: relative;
- text-align: right;
-}
-.timeline-end{
- box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
- border-radius: 5px;
- background-color: #fff;
- padding: 15px;
- position: relative;
- text-align: center;
- z-index: 1;
- margin-top: 8vw;
-}
-.timeline-begin{
- box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
- border-radius: 5px;
- background-color: #fff;
- padding: 15px;
- position: relative;
- text-align: center;
- z-index: 1;
- margin-bottom: 8vw;
-}
-
-.timeline-item-content::after {
- background-color: #fff;
- box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.2);
- position: absolute;
- right: -7.5px;
- top: calc(50% - 7.5px);
- transform: rotate(45deg);
- width: 15px;
- height: 15px;
-}
-
-.timeline-item:nth-child(odd) .timeline-item-content {
- text-align: left;
- align-items: flex-start;
-}
-
-.timeline-item:nth-child(odd) .timeline-item-content::after {
- right: auto;
- left: -7.5px;
- box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
-}
-.timeline-item-content .tag {
- color: #fff;
- font-size: 12px;
- font-weight: bold;
- top: 5px;
- left: 5px;
- letter-spacing: 1px;
- padding: 5px;
- position: absolute;
- text-transform: uppercase;
-}
-
-.timeline-item:nth-child(odd) .timeline-item-content .tag {
- left: auto;
- right: 5px;
-}
-
-.timeline-item-content time {
- color: var(--lightblue);
- font-size: 12px;
- font-weight: bold;
-}
-
-.timeline-item-content p {
- font-size: 16px;
- line-height: 24px;
- margin: 15px 0;
- max-width: 250px;
-}
-
-.timeline-item-content a {
- font-size: 14px;
- font-weight: bold;
-}
-
-.timeline-item-content a::after {
- font-size: 12px;
-}
-
-.timeline-item-content .circle {
- background-color: #fff;
- border: 3px solid var(--text-primary);
- border-radius: 50%;
- position: absolute;
- top: calc(50% - 10px);
- right: -40px;
- width: 20px;
- height: 20px;
- z-index: 100;
-}
-
-.timeline-item:nth-child(odd) .timeline-item-content .circle {
- right: auto;
- left: -40px;
-}
-@media only screen and (max-width: 1023px) {
- .timeline-item-content {
- max-width: 100%;
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * NAVBAR * */
+
+
+
+
+ /* * * * * * * */
+
+
+ .nav-link {
+ color: var(--text-primary) !important;
}
-}
-
-@media only screen and (max-width: 767px) {
- .timeline-item-content,
- .timeline-item:nth-child(odd) .timeline-item-content {
- padding: 15px 10px;
- text-align: center;
- align-items: center;
+
+ .nav-link:hover {
+ color: white !important;
+ background-color: var(--text-primary) !important;
+ border-radius: 7px;
}
- .timeline-item-content .tag {
- width: calc(100% - 10px);
- text-align: center;
+ .navbar {
+ backdrop-filter: blur(5px);
+ transition: visibility 0s, 0.6s, opacity 0.6s linear, transform 1s;
}
- .timeline-item-content time {
- margin-top: 20px;
+ nav.navbar {
+ padding-top: 1rem;
+ padding-bottom: 1rem;
}
- .timeline-item-content a {
- text-decoration: underline;
+ .dropdown-item {
+ color: var(--text-primary) !important;
}
- .timeline-item-content a::after {
- display: none;
+ .dropdown-item:hover {
+ color: white !important;
+ background-color: var(--text-primary) !important;
}
-}
-/* Horizontal */
-.timeline {
- white-space: nowrap;
- overflow-x: auto;
- overflow-y: hidden;
-}
-
-.timelineol {
- font-size: 0;
- width: 100vw;
- padding: 250px 0;
- transition: all 1s;
-}
-
-
-.t-tag{
- color: #fff;
- font-size: 12px;
- font-weight: bold;
- letter-spacing: 1px;
- padding: 5px;
- margin-bottom: 10px;
- text-transform: uppercase;
- width: fit-content !important;
-}
-
-.All{
- background-color: white;
-}
-button.tabbutton.Patient.active, button.tabbutton.All.active,
-button.tabbutton.Industry.active, button.tabbutton.Academia.active,
-button.tabbutton.Medical.active{
- border-color: black;
-}
-
-
-
-.Patient{
- background-color: var(--accen-secondary);
-}
-
-.Medical{
- background-color: var(--accent-primary);
-}
-
-.Academia{
- background-color: var(--lightblue);
-}
-
-.Industry{
- background-color: var(--mediumpurple);
-}
-
-.timelineolli {
- position: relative;
- display: inline-block;
- list-style-type: none;
- width: 160px;
- height: 5px;
- /* background-image: url("../components/data/stroke.svg");
- background-size: auto 100%;
- background-repeat: round;
- background-position: 0em; */
- background: var(--text-primary);
-}
-.timeline ol li:last-child {
- width: 280px;
-}
-
-
-.timeline ol li:not(:first-child) {
- margin-left: 14px;
-}
-
-.timeline ol li:not(:last-child)::after {
- content: '';
- position: absolute;
- top: 50%;
- left: calc(100% + 1px);
- bottom: 0;
- width: 12px;
- height: 12px;
- transform: translateY(-50%);
- border-radius: 50%;
- background: var(--text-primary);
-}
-
-
-.timeline ol li .timeline-item {
- min-height: 310%;
- position: absolute;
- left: calc(100% + 7px);
- width: 280px;
- padding: 15px;
- font-size: 1rem;
- white-space: normal;
- color: black;
- background: white;
-}
-.timeline ol li:nth-child(2n+1) .moretop{
- top: -30px !important;
-}
-
-.timeline ol li .timeline-item::before {
- content: '';
- position: absolute;
- top: 100%;
- left: 0;
- width: 0;
- height: 0;
- border-style: solid;
-
-}
-
-.timeline ol li:nth-child(odd) .timeline-item {
- top: -16px;
- transform: translateY(-100%);
- box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
-}
-
-.timeline ol li:nth-child(even) .timeline-item {
- box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
- top: calc(100% + 16px);
-}
-.timeline ol li:nth-child(odd) .timeline-item::before {
- top: 100%;
- border-width: 8px 8px 0 0;
- border-color: white transparent transparent transparent;
-}
-.timeline ol li:nth-child(even) .timeline-item::before {
- top: -8px;
- border-width: 8px 0 0 8px;
- border-color: transparent transparent transparent white;
-}
-
-
-
-
-.timeline {
- background-color: inherit;
- font-size: 1rem;
+
+ .nav-item.dropdown:hover .dropdown-menu {
+ display: block;
+ background-color: white;
+ border-color: var(--text-primary);
+ border-radius: 7px;
}
-
-.card {
- border-radius: 4px;
- background-color: #fff;
- color: #333;
- padding: 10px;
- box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
- width: 100%;
- max-width: 560px;
-
-}
-
-.date {
- background-color: var(--text-primary) !important;
- padding: 4px !important;
- color: #fff !important;
- border-radius: 4px !important;
- font-weight: 500;
- font-size: .85rem;
-}
-.imageAtom{
- object-fit: cover;
- overflow: hidden;
- width: 100%;
- max-height: 400px;
-}
-.imageCredit { margin-top: 10px; font-size: 0.85rem }
-.imageText { margin-bottom: 10px; font-size: 1rem }
-.events{ padding: 10px }
-.event { margin-bottom: 20px }
-
-.date-col{
- position: relative;
- background-color: #fff ;
- padding: 10px;
- width: 10%;
+
+ .navbar-brand {
+ color: var(--text-primary) !important;
+ }
+
+ .dropdown-menu {
+ margin-top: 0 !important;
+ }
+
+
+ /* TABLES */
+
+
+ table {
+ font-family: arial, sans-serif;
+ border-collapse: collapse;
+ width: 100%;
+ }
+
+ td, th {
+ border: 1px solid black;
+ text-align: left;
+ padding: 8px;
+ }
+
+ tr:nth-child(even) {
+ background-color: #ededed;
+ }
+
+ tr:nth-child(odd) {
+ background-color: #f3f3f3;
+ }
+
+ tr:nth-child(1) {
+ background-color: var(--lightblue) !important;
+ }
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* BACKGROUND */
+
+
+
+
+ /* * * * * * * */
+
+
+ .bg-video-container {
+ margin-bottom: 10vw !important;
+ }
+
+ .bg-d {
+ background-color: var(--text-primary) !important;
+ }
+
+ .bg-l {
+ background-color: var(--text-primary) !important;
+ color: white;
+ }
+
+ .bg-transp {
+ background: transparent;
+ color: var(--text-primary);
+ }
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* *HEADINGS * */
+
+
+
+
+ /* * * * * * * */
+
+
+
+ .base {
+ width: 100%;
+ background-color: var(--accent-primary);
+ padding: 120px 30px;
+ }
+
+ .header-title {
+ color: var(--text-primary);
+ text-align: left;
+ align-self: flex-start;
+ padding: 0 30px;
+ font-size: 130px;
+ font-weight: 900;
+ line-height: 130px;
+ }
+
+
+
+ /* p:first-child::first-letter{
+ color:var(--text-primary);
+ font-weight: bold;
+ font-size: x-large;
+ } */
+
+
+ .popart {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 5vw;
+ letter-spacing: 0.1em;
+ -webkit-text-fill-color: transparent;
+ -webkit-text-stroke-width: 0.3vw;
+ -webkit-text-stroke-color: var(--accent-primary);
+ text-shadow: 0.4vw 0.4vw var(--mediumpurple),
+ 0.8vw 0.8vw var(--offblack);
+ }
+
+ h2 {
+ font-size: 3rem !important;
+ -webkit-background-clip: text !important;
+ -webkit-text-stroke-width: 2px !important;
+ -webkit-text-stroke-color: var(--text-primary) !important;
+ background-clip: text !important;
+ color: transparent !important;
+ padding-top: 15px !important;
+ background-image: repeating-linear-gradient(-45deg, var(--text-primary) 0, var(--text-primary) 2px, white 2px, white 4px) !important;
+ }
+
+ .underline--magical {
+ background-image: linear-gradient(120deg, var(--lightblue) 0%, var(--mediumpurple) 100%);
+ background-repeat: no-repeat;
+ color: black;
+ background-size: 100% 0.2em;
+ background-position: 0 105%;
+ transition: background-size 0.25s ease-in;
+ }
+
+ .underline--magical:hover {
+ background-size: 100% 100%;
+ color: black !important;
+ text-decoration: none !important;
+ }
+
+ .v2 p {
+ background-position: left;
+ background-size: 0% 100%;
+ background-image: linear-gradient(#f6e05e, #f6e05e);
+ }
+
+ .v2:hover p {
+ background-size: 100% 100%;
+ }
+
+ .v3 p {
+ color: transparent;
+ background-position: right;
+ background-size: 100% 100%;
+ background-image: linear-gradient(#a0aec0, #a0aec0);
+ }
+
+ .v3:hover p {
+ color: #000;
+ background-size: 0% 100%;
+ }
+
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * CALLOUT * */
+
+
+
+
+ /* * * * * * * */
+
+
+
+ .bg-b {
+ background-color: var(--ourbeige);
+ }
+
+ .bd-callout {
+ padding: 1.25rem;
+ margin-top: 1.25rem;
+ margin-bottom: 1.25rem;
+ border: 1px solid #e9ecef;
+ border-left-width: 0.25rem;
+ border-radius: 0.25rem;
+ }
+
+ .bd-callout h4 {
+ margin-bottom: 0.25rem;
+ }
+
+ .bd-callout p:last-child {
+ margin-bottom: 0;
+ }
+
+ .bd-callout code {
+ border-radius: 0.25rem;
+ }
+
+ .bd-callout + .bd-callout {
+ margin-top: -0.25rem;
+ }
+
+ .bd-callout-info {
+ border-left-color: #ABD2FA;
+ }
+
+ .bd-callout-warning {
+ border-left-color: #f0ad4e;
+ }
+
+ .bd-callout-danger {
+ border-left-color: #d9534f;
+ }
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * FOOTER * */
+
+
+
+
+ /* * * * * * * */
+
+
+ footer {
+ background-color: var(--background);
+ }
+
+ footer a {
+ color: white;
+ font-weight: bold;
+ text-decoration: none;
+ }
+
+ footer a:hover {
+ color: white;
+ text-decoration: underline;
+ }
+
+
+
+
+ /* * * * * * * * */
+
+
+
+
+ /*VILLAGE BUTTONS*/
+
+
+
+
+ /* * * * * * * * */
+
+
+ .bottom-buttons {
+ margin-top: 50px !important;
+ margin-bottom: 20px;
+ padding-left: 30px;
+ }
+
+ .village-style-button {
+ box-shadow: 5px 5px 15px gray !important;
+ border-radius: 2rem !important;
+ padding: 0 !important;
+ max-width: 12% !important;
+ aspect-ratio: 2 / 3 !important;
+ margin-left: 1vw;
+ }
+
+ .village-style-button:hover {
+ box-shadow: 5px 5px 15px black !important;
+ }
+
+ .village-style-button h3 {
+ text-align: center !important;
+ font-size: 10px;
+ font-weight: bold;
+ color: #000;
+ }
+
+ .village-style-button img {
+ max-width: 70% !important;
+ max-height: 70% !important;
+ padding-top: 20px !important;
+ }
+
+
+
+ /* * * * * * * * * */
+
+
+
+
+ /* * * IMAGES * * */
+
+
+
+
+ /* * * * * * * * * */
+
+
+ img,
+ picture,
+ svg {
+ max-width: 100%;
+ display: block;
+ }
+
+ img .middle {
+ vertical-align: middle;
+ }
+
+ .socials {
+ height: 1.5rem;
+ width: auto;
+ margin: 0.5rem;
+ }
+
+ .spin {
+ transition: transform 1s ease-in-out;
+ }
+
+ .spin:hover {
+ transform: rotate(360deg);
+ }
+
+ .img-sponsor {
+ max-width: 70%;
+ max-height: 150px;
+ margin-left: auto;
+ margin-right: auto;
+ }
+
+ .img-right {
+ float: right !important;
+ padding-left: 2vw !important;
+ padding-bottom: 1vw !important;
+ padding-top: 1vw !important;
+ }
+
+ .img-left {
+ float: left !important;
+ padding-right: 2vw !important;
+ padding-bottom: 1vw !important;
+ padding-top: 1vw !important;
+ }
+
+ .img-half {
+ max-width: 50% !important;
+ }
+
+ .img-round {
+ border-radius: 50%;
+ max-width: 80%;
+ }
+
+ .updown {
+ max-width: 3vw;
+ }
+
+ .hexagon {
+ clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
+ }
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * * SVG * * */
+
+
+
+
+ /* * * * * * * */
+
+
+ svg {
+ background: transparent
+ }
+
+ .hone svg text {
+ font-size: 7vw !important;
+ stroke-width: 2px !important;
+ fill: var(--accent-primary);
+ stroke: var(--text-primary);
+ /*letter-spacing:4px;*/
+
+
+
+ animation: effect 3s, dash 3s;
+ }
+
+ .hone svg text:hover {
+ fill: var(--text-primary)
+ }
+
+
+
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* MEDIA RULES */
+
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /*For tablet or bigger*/
+
+
+ @media screen and (min-width: 992px) {
+ /* navbar opens on hover*/
+
+
+
+ .dropdown:hover .dropdown-menu {
+ display: block;
+ }
+ }
+
+
+ /*For Tablet and smaller*/
+
+
+ @media screen and (max-width: 992px) {
+ }
+
+
+ /*For Smartphones*/
+
+
+ @media screen and (max-width: 768px) {
+ svg text{
+ font-size: 9vw;
+ stroke-width: 1px;
+ }
+
+ .village-style-button h3 {
+ display: none !important;
+ }
+
+ .village-style-button {
+ box-shadow: 1px 1px 1px gray;
+ border-radius: 10px;
+ border-color: black;
+ }
+
+ .village-style-button:hover {
+ box-shadow: none;
+ }
+
+ .village-style-button img {
+ max-width: 90%;
+ max-height: 90%;
+ padding-top: 10px;
+ padding-bottom: 5px;
+ }
+
+ .img-half {
+ max-width: 100% !important;
+ }
+ }
+
+
+ /*Bigger than smartphones*/
+
+
+ @media only screen and (min-width: 768px) {
+ .col-1 {width: 8.33%;
+ }
+
+ .col-2 {
+ width: 16.66%;
+ }
+
+ .col-3 {
+ width: 25%;
+ }
+
+ .col-4 {
+ width: 33.33%;
+ }
+
+ .col-5 {
+ width: 41.66%;
+ }
+
+ .col-6 {
+ width: 50%;
+ }
+
+ .col-7 {
+ width: 58.33%;
+ }
+
+ .col-8 {
+ width: 66.66%;
+ }
+
+ .col-9 {
+ width: 75%;
+ }
+
+ .col-10 {
+ width: 83.33%;
+ }
+
+ .col-11 {
+ width: 91.66%;
+ }
+
+ .col-12 {
+ width: 100%;
+ }
+
+
+ }
+
+
+
+
+ /* * * * * * * */
+
+
+
+
+ /* * EFFECTS * */
+
+
+
+
+ /* * * * * * * */
+
+
+ @keyframes effect {
+ 0%{
+ stroke-dasharray: 0 70%;
+ }
+
+ 100% {
+ stroke-dasharray: 10% 0%;
+ stroke-dashoffset: 20%;
+ }
+ }
+
+ @keyframes dash {
+ 0% {
+ stroke-dashoffset: 1300;
+ }
+
+ 35% {
+ fill-opacity: 0;
+ }
+
+ 50% {
+ stroke-dashoffset: 0;
+ }
+
+ 100% {
+ stroke-dashoffset: 0;
+ fill-opacity: 1;
+ }
+ }
+
+
+
+ /* Headings */
+
+
+ .revealUp {
+ opacity: 0;
+ visibility: hidden;
+ }
+
+ .spacer {
+ height: 50vh;
+ background-color: #000;
+ }
+
+ .hello:hover {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 25vw;
+ animation-name: jumpy;
+ animation-iteration-count: infinite;
+ animation-timing-function: ease-in-out;
+ -webkit-text-stroke-width: 3px;
+ -webkit-text-stroke-color: black;
+ }
+
+ .error {
+ background-color: lightgray;
+ border-radius: 10px;
+ color: black;
+ padding-left: 1vw;
+ padding-right: 1vw;
+ }
+
+
+
+
+ /* TIMELINE EINS */
+
+
+
+ .timeline-container {
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ margin: 40px 0;
+ }
+
+ .timeline-container::after {
+ background-color: var(--text-primary);
+ position: absolute;
+ left: calc(50% - 2px);
+ content: "";
+ width: 4px;
+ height: 100%;
+ z-index: 0;
+ }
+
+ .timeline-item {
+ min-width: 100px;
+ /* display: flex; */
+
+
+
+ justify-content: flex-end;
+ padding-right: 30px;
+ position: relative;
+ margin: 10px 0;
+ width: 50%;
+ }
+
+ .timeline-item:nth-child(odd) {
+ align-self: flex-end;
+ justify-content: flex-start;
+ padding-left: 30px;
+ padding-right: 0;
+ }
+
+ .timeline-item-content {
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+ border-radius: 5px;
+ background-color: #fff;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-end;
+ padding: 15px;
+ position: relative;
+ text-align: right;
+ }
+
+ .timeline-end {
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+ border-radius: 5px;
+ background-color: #fff;
+ padding: 15px;
+ position: relative;
+ text-align: center;
+ z-index: 1;
+ margin-top: 8vw;
+ }
+
+ .timeline-begin {
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+ border-radius: 5px;
+ background-color: #fff;
+ padding: 15px;
+ position: relative;
+ text-align: center;
+ z-index: 1;
+ margin-bottom: 8vw;
+ }
+
+ .timeline-item-content::after {
+ background-color: #fff;
+ box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.2);
+ position: absolute;
+ right: -7.5px;
+ top: calc(50% - 7.5px);
+ transform: rotate(45deg);
+ width: 15px;
+ height: 15px;
+ }
+
+ .timeline-item:nth-child(odd) .timeline-item-content {
+ text-align: left;
+ align-items: flex-start;
+ }
+
+ .timeline-item:nth-child(odd) .timeline-item-content::after {
+ right: auto;
+ left: -7.5px;
+ box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
+ }
+
+ .timeline-item-content .tag {
+ color: #fff;
+ font-size: 12px;
+ font-weight: bold;
+ top: 5px;
+ left: 5px;
+ letter-spacing: 1px;
+ padding: 5px;
+ position: absolute;
+ text-transform: uppercase;
+ }
+
+ .timeline-item:nth-child(odd) .timeline-item-content .tag {
+ left: auto;
+ right: 5px;
+ }
+
+ .timeline-item-content time {
+ color: var(--lightblue);
+ font-size: 12px;
+ font-weight: bold;
+ }
+
+ .timeline-item-content p {
+ font-size: 16px;
+ line-height: 24px;
+ margin: 15px 0;
+ max-width: 250px;
+ }
+
+ .timeline-item-content a {
+ font-size: 14px;
+ font-weight: bold;
+ }
+
+ .timeline-item-content a::after {
+ font-size: 12px;
+ }
+
+ .timeline-item-content .circle {
+ background-color: #fff;
+ border: 3px solid var(--text-primary);
+ border-radius: 50%;
+ position: absolute;
+ top: calc(50% - 10px);
+ right: -40px;
+ width: 20px;
+ height: 20px;
+ z-index: 100;
+ }
+
+ .timeline-item:nth-child(odd) .timeline-item-content .circle {
+ right: auto;
+ left: -40px;
+ }
+
+ @media only screen and (max-width: 1023px) {
+ .timeline-item-content {
+ max-width: 100%;
+ }
+ }
+
+ @media only screen and (max-width: 767px) {
+ .timeline-item-content,
+ .timeline-item:nth-child(odd) .timeline-item-content {
+ padding: 15px 10px;
+ text-align: center;
+ align-items: center;
+ }
+
+ .timeline-item-content .tag {
+ width: calc(100% - 10px);
+ text-align: center;
+ }
+
+ .timeline-item-content time {
+ margin-top: 20px;
+ }
+
+ .timeline-item-content a {
+ text-decoration: underline;
+ }
+
+ .timeline-item-content a::after {
+ display: none;
+ }
+ }
+
+
+ /* Horizontal */
+
+
+ .timeline {
+ white-space: nowrap;
+ overflow-x: auto;
+ overflow-y: hidden;
+ }
+
+ .timelineol {
+ font-size: 0;
+ width: 100vw;
+ padding: 250px 0;
+ transition: all 1s;
+ }
+
+ .t-tag {
+ color: #fff;
+ font-size: 12px;
+ font-weight: bold;
+ letter-spacing: 1px;
+ padding: 5px;
+ margin-bottom: 10px;
+ text-transform: uppercase;
+ width: fit-content !important;
+ }
+
+ .All {
+ background-color: white;
+ }
+
+ button.tabbutton.Patient.active, button.tabbutton.All.active,
+ button.tabbutton.Industry.active, button.tabbutton.Academia.active,
+ button.tabbutton.Medical.active {
+ border-color: black;
+ }
+
+ .Patient {
+ background-color: var(--accen-secondary);
+ }
+
+ .Medical {
+ background-color: var(--accent-primary);
+ }
+
+ .Academia {
+ background-color: var(--lightblue);
+ }
+
+ .Industry {
+ background-color: var(--mediumpurple);
+ }
+
+ .timelineolli {
+ position: relative;
+ display: inline-block;
+ list-style-type: none;
+ width: 160px;
+ height: 5px;
+ /* background-image: url("../components/data/stroke.svg");
+ background-size: auto 100%;
+ background-repeat: round;
+ background-position: 0em; */
+
+
+
+ background: var(--text-primary);
+ }
+
+ .timeline ol li:last-child {
+ width: 280px;
+ }
+
+ .timeline ol li:not(:first-child) {
+ margin-left: 14px;
+ }
+
+ .timeline ol li:not(:last-child)::after {
+ content: '';
+ position: absolute;
+ top: 50%;
+ left: calc(100% + 1px);
+ bottom: 0;
+ width: 12px;
+ height: 12px;
+ transform: translateY(-50%);
+ border-radius: 50%;
+ background: var(--text-primary);
+ }
+
+ .timeline ol li .timeline-item {
+ min-height: 310%;
+ position: absolute;
+ left: calc(100% + 7px);
+ width: 280px;
+ padding: 15px;
+ font-size: 1rem;
+ white-space: normal;
+ color: black;
+ background: white;
+ }
+
+ .timeline ol li:nth-child(2n+1) .moretop {
+ top: -30px !important;
+ }
+
+ .timeline ol li .timeline-item::before {
+ content: '';
+ position: absolute;
+ top: 100%;
+ left: 0;
+ width: 0;
+ height: 0;
+ border-style: solid;
+ }
+
+ .timeline ol li:nth-child(odd) .timeline-item {
+ top: -16px;
+ transform: translateY(-100%);
+ box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
+ }
+
+ .timeline ol li:nth-child(even) .timeline-item {
+ box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
+ top: calc(100% + 16px);
+ }
+
+ .timeline ol li:nth-child(odd) .timeline-item::before {
+ top: 100%;
+ border-width: 8px 8px 0 0;
+ border-color: white transparent transparent transparent;
+ }
+
+ .timeline ol li:nth-child(even) .timeline-item::before {
+ top: -8px;
+ border-width: 8px 0 0 8px;
+ border-color: transparent transparent transparent white;
+ }
+
+ .timeline {
+ background-color: inherit;
+ font-size: 1rem;
+ }
+
+ .card {
+ border-radius: 4px;
+ background-color: #fff;
+ color: #333;
+ padding: 10px;
+ box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
+ width: 100%;
+ max-width: 560px;
+ }
+
+ .date {
+ background-color: var(--text-primary) !important;
+ padding: 4px !important;
+ color: #fff !important;
+ border-radius: 4px !important;
+ font-weight: 500;
+ font-size: .85rem;
+ }
+
+ .imageAtom {
+ object-fit: cover;
+ overflow: hidden;
+ width: 100%;
+ max-height: 400px;
+ }
+
+ .imageCredit {
+ margin-top: 10px;
+ font-size: 0.85rem
+ }
+
+ .imageText {
+ margin-bottom: 10px;
+ font-size: 1rem
+ }
+
+ .events {
+ padding: 10px
+ }
+
+ .event {
+ margin-bottom: 20px
+ }
+
+ .date-col {
+ position: relative;
+ background-color: #fff;
+ padding: 10px;
+ width: 10%;
border-right: #000;
border-right-width: 2px;
-}
-
-.card-col{
- width: 100%;
- display: flex;
- flex-direction: column;
- justify-content: flex-start;
- flex-basis: 50%;
- flex-grow: 1;
- align-items: flex-end;
-}
-
-.img-text{
- margin-bottom:10px;
- font-size: 1rem;
-}
-.img-credit{
- margin-top: 10px;
+ }
+
+ .card-col {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ flex-basis: 50%;
+ flex-grow: 1;
+ align-items: flex-end;
+ }
+
+ .img-text {
+ margin-bottom: 10px;
+ font-size: 1rem;
+ }
+
+ .img-credit {
+ margin-top: 10px;
font-size: 0.85rem;
-}
-.event{
- position: relative;
- display: flex;
- margin-top: 20px;
-}
-.img-timeline{
- overflow: hidden;
- object-fit: cover;
- width: 100%;
- max-height: 400px;
-}
-
-
-/*PDF*/
-.container_document{
- max-width: 40%;
-}
-
-
-.download-butt{
- background-color: var(--text-primary);
- padding: 0.5vw;
- border-radius: 5px;
- margin: auto !important;
- width: fit-content !important;
-}
-.download-col{
- height: 5vw !important;
- display: flex;
- align-items: center !important;
-}
-.small-i{
- width: 80%;
-}
-
-
-/* SHAPES */
-.circle {
- display: flex;
- width: 10vw;
- height: 10vw;
- background-color: var(--lightblue) !important;
- box-shadow: 3px 3px 10px black !important;
- border-radius: 50%;
- margin: 1vw;
-}
-.shape-text {
- margin: auto;
- text-align: center;
-}
-
-
-/*collapsible*/
-
-.collapse-card {
- border-radius: 4px;
- background-color: #fff;
- color: #333;
- padding: 10px;
- box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
- width: 100%;
-
-}
-
-
-/*boxes*/
-.hint-container {
- position:relative;
- transition:background var(--vp-ct),border-color var(--vp-ct),color var(--vp-ct)
-}
-@media print {
+ }
+
+ .event {
+ position: relative;
+ display: flex;
+ margin-top: 20px;
+ }
+
+ .img-timeline {
+ overflow: hidden;
+ object-fit: cover;
+ width: 100%;
+ max-height: 400px;
+ }
+
+
+
+
+ /*PDF*/
+
+
+ .container_document {
+ max-width: 40%;
+ }
+
+ .download-butt {
+ background-color: var(--text-primary);
+ padding: 0.5vw;
+ border-radius: 5px;
+ margin: auto !important;
+ width: fit-content !important;
+ }
+
+ .download-col {
+ height: 5vw !important;
+ display: flex;
+ align-items: center !important;
+ }
+
+ .small-i {
+ width: 80%;
+ }
+
+
+
+
+ /* SHAPES */
+
+
+ .circle {
+ display: flex;
+ width: 10vw;
+ height: 10vw;
+ background-color: var(--lightblue) !important;
+ box-shadow: 3px 3px 10px black !important;
+ border-radius: 50%;
+ margin: 1vw;
+ }
+
+ .shape-text {
+ margin: auto;
+ text-align: center;
+ }
+
+
+
+
+ /*collapsible*/
+
+
+
+ .collapse-card {
+ border-radius: 4px;
+ background-color: #fff;
+ color: #333;
+ padding: 10px;
+ box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
+ width: 100%;
+ }
+
+
+
+
+ /*boxes*/
+
+
.hint-container {
- page-break-inside:avoid
- }
-}
-.hint-container .hint-container-title {
- position:relative;
- font-weight:600;
- line-height:1.25
-}
-.hint-container.info,
-.hint-container.note,
-.hint-container.tip,
-.hint-container.warning,
-.hint-container.danger {
- margin:1rem 0;
- padding:.25rem 1rem;
- border-inline-start-width:.3rem;
- border-inline-start-style:solid;
- border-radius:.5rem;
- color:inherit
-}
-@media (max-width: 419px) {
+ position: relative;
+ transition: background var(--vp-ct),border-color var(--vp-ct),color var(--vp-ct)
+ }
+
+ @media print {
+ .hint-container {
+ page-break-inside: avoid
+ }
+ }
+
+ .hint-container .hint-container-title {
+ position: relative;
+ font-weight: 600;
+ line-height: 1.25
+ }
+
.hint-container.info,
.hint-container.note,
.hint-container.tip,
.hint-container.warning,
.hint-container.danger {
- margin-inline:-.75rem
- }
-}
-.hint-container.info .hint-container-title,
-.hint-container.note .hint-container-title,
-.hint-container.tip .hint-container-title,
-.hint-container.warning .hint-container-title,
-.hint-container.danger .hint-container-title {
- padding-inline-start:1.75rem
-}
-@media print {
+ margin: 1rem 0;
+ padding: .25rem 1rem;
+ border-inline-start-width: .3rem;
+ border-inline-start-style: solid;
+ border-radius: .5rem;
+ color: inherit
+ }
+
+ @media (max-width: 419px) {
+ .hint-container.info,
+ .hint-container.note,
+ .hint-container.tip,
+ .hint-container.warning,
+ .hint-container.danger {
+ margin-inline: -.75rem
+ }
+ }
+
.hint-container.info .hint-container-title,
.hint-container.note .hint-container-title,
.hint-container.tip .hint-container-title,
.hint-container.warning .hint-container-title,
.hint-container.danger .hint-container-title {
- padding-inline-start:0
- }
-}
-.hint-container.info .hint-container-title:before,
-.hint-container.note .hint-container-title:before,
-.hint-container.tip .hint-container-title:before,
-.hint-container.warning .hint-container-title:before,
-.hint-container.danger .hint-container-title:before {
- content:" ";
- position:absolute;
- top:calc(50% - .6125em);
- left:0;
- width:1.25em;
- height:1.25em;
- background-position:left;
- background-repeat:no-repeat
-}
-@media print {
+ padding-inline-start: 1.75rem
+ }
+
+ @media print {
+ .hint-container.info .hint-container-title,
+ .hint-container.note .hint-container-title,
+ .hint-container.tip .hint-container-title,
+ .hint-container.warning .hint-container-title,
+ .hint-container.danger .hint-container-title {
+ padding-inline-start: 0
+ }
+ }
+
.hint-container.info .hint-container-title:before,
.hint-container.note .hint-container-title:before,
.hint-container.tip .hint-container-title:before,
.hint-container.warning .hint-container-title:before,
.hint-container.danger .hint-container-title:before {
- display:none
- }
-}
-html[dir=rtl] .hint-container.info .hint-container-title:before,
-html[dir=rtl] .hint-container.note .hint-container-title:before,
-html[dir=rtl] .hint-container.tip .hint-container-title:before,
-html[dir=rtl] .hint-container.warning .hint-container-title:before,
-html[dir=rtl] .hint-container.danger .hint-container-title:before {
- right:0;
- left:unset
-}
-.hint-container.info p,
-.hint-container.note p,
-.hint-container.tip p,
-.hint-container.warning p,
-.hint-container.danger p {
- line-height:1.5
-}
-.hint-container.info a,
-.hint-container.note a,
-.hint-container.tip a,
-.hint-container.warning a,
-.hint-container.danger a {
- color:var(--vp-tc)
-}
-.hint-container.info {
- border-color:var(--info-border-color);
- background:var(--info-bg-color)
-}
-.hint-container.info>.hint-container-title {
- color:var(--info-title-color)
-}
-.hint-container.info>.hint-container-title:before {
- background-image:url("https://static.igem.wiki/teams/5247/design/icons/info-filled-small.png")
-}
-.hint-container.info code {
- background:var(--info-code-bg-color)
-}
-
-
-/*POPUP*/
-.popup {
- position: relative;
- display: inline-block;
- cursor: pointer;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
-}
-
-/* The actual popup */
-.popup .popuptext {
- visibility: hidden;
- min-width: 50vw;
- min-height: 20vw;
- background-color: #555;
- color: #fff;
- text-align: center;
- border-radius: 6px;
- z-index: 1;
- position: absolute;
- top:0;
- bottom: 0;
- left: 0;
- right: 0;
-}
-
-/* Toggle this class - hide and show the popup */
-.popup .show {
- visibility: visible;
- -webkit-animation: fadeIn 1s;
- animation: fadeIn 1s;
-}
-.tl-butt img:hover{
- cursor: pointer;
- box-shadow: 3px 3px 10px black;
-}
-/* Add animation (fade in the popup) */
-@-webkit-keyframes fadeIn {
- from {opacity: 0;}
- to {opacity: 1;}
-}
-
-@keyframes fadeIn {
- from {opacity: 0;}
- to {opacity:1 ;}
-}
-
-.tabcontent {
- display: none;
- padding: 6px 12px;
-}
-
-
-/*GALLERY*/
-.gall {
- --s: 150px; /* control the size */
- --g: 10px; /* control the gap */
- display: grid;
- margin: calc(var(--s) + var(--g));
-}
-
-.gall > img {
- grid-area: 1/1;
- width: var(--s);
- aspect-ratio: 1.15;
- object-fit: cover;
- clip-path: polygon(25% 0%, 75% 0%, 100% 50%,75% 100%,25% 100%,0 50%);
- transform: translate(var(--_x,0),var(--_y,0)) scale(var(--_t,1));
- cursor: pointer;
- filter: grayscale(80%);
- transition: .2s linear;
-}
-.gall > img:hover {
- filter: grayscale(0);
- z-index: 1;
- --_t: 1.2;
-}
-
-.gall > img:nth-child(1) {--_y: calc(-100% - var(--g))}
-.gall > img:nth-child(7) {--_y: calc( 100% + var(--g))}
-.gall > img:nth-child(3), .gall > img:nth-child(5) {--_x: calc(-75% - .87*var(--g))}
-.gall > img:nth-child(4), .gall > img:nth-child(6) {--_x: calc( 75% + .87*var(--g))}
-.gall > img:nth-child(3),.gall > img:nth-child(4) {--_y: calc(-50% - .5*var(--g))}
-.gall > img:nth-child(5), .gall > img:nth-child(6) {--_y: calc( 50% + .5*var(--g))}
-
-
+ content: " ";
+ position: absolute;
+ top: calc(50% - .6125em);
+ left: 0;
+ width: 1.25em;
+ height: 1.25em;
+ background-position: left;
+ background-repeat: no-repeat
+ }
+
+ @media print {
+ .hint-container.info .hint-container-title:before,
+ .hint-container.note .hint-container-title:before,
+ .hint-container.tip .hint-container-title:before,
+ .hint-container.warning .hint-container-title:before,
+ .hint-container.danger .hint-container-title:before {
+ display: none
+ }
+ }
+
+ html[dir=rtl] .hint-container.info .hint-container-title:before,
+ html[dir=rtl] .hint-container.note .hint-container-title:before,
+ html[dir=rtl] .hint-container.tip .hint-container-title:before,
+ html[dir=rtl] .hint-container.warning .hint-container-title:before,
+ html[dir=rtl] .hint-container.danger .hint-container-title:before {
+ right: 0;
+ left: unset
+ }
+
+ .hint-container.info p,
+ .hint-container.note p,
+ .hint-container.tip p,
+ .hint-container.warning p,
+ .hint-container.danger p {
+ line-height: 1.5
+ }
+
+ .hint-container.info a,
+ .hint-container.note a,
+ .hint-container.tip a,
+ .hint-container.warning a,
+ .hint-container.danger a {
+ color: var(--vp-tc)
+ }
+
+ .hint-container.info {
+ border-color: var(--info-border-color);
+ background: var(--info-bg-color)
+ }
+
+ .hint-container.info>.hint-container-title {
+ color: var(--info-title-color)
+ }
+
+ .hint-container.info>.hint-container-title:before {
+ background-image: url("https://static.igem.wiki/teams/5247/design/icons/info-filled-small.png")
+ }
+
+ .hint-container.info code {
+ background: var(--info-code-bg-color)
+ }
+
+
+
+
+ /*POPUP*/
+
+
+ .popup {
+ position: relative;
+ display: inline-block;
+ cursor: pointer;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ }
+
+
+
+ /* The actual popup */
+
+
+ .popup .popuptext {
+ visibility: hidden;
+ min-width: 50vw;
+ min-height: 20vw;
+ background-color: #555;
+ color: #fff;
+ text-align: center;
+ border-radius: 6px;
+ z-index: 1;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ }
+
+
+
+ /* Toggle this class - hide and show the popup */
+
+
+ .popup .show {
+ visibility: visible;
+ -webkit-animation: fadeIn 1s;
+ animation: fadeIn 1s;
+ }
+
+ .tl-butt img:hover {
+ cursor: pointer;
+ box-shadow: 3px 3px 10px black;
+ }
+
+
+ /* Add animation (fade in the popup) */
+
+
+ @-webkit-keyframes fadeIn {
+ from {opacity: 0;
+ }
+
+ to {
+ opacity: 1;
+ }
+ }
+
+ @keyframes fadeIn {
+ from {
+ opacity: 0;
+ }
+
+ to {
+ opacity: 1;
+ }
+ }
+
+ .tabcontent {
+ display: none;
+ padding: 6px 12px;
+ }
+
+
+
+
+ /*GALLERY*/
+
+
+ .gall {
+ --s: 150px;
+ /* control the size */
+
+ --g: 10px;
+ /* control the gap */
-.wrapper{
- width: 500px;
- height: 100%;
- background: #fff;
- margin: 15px auto 0;
-}
-.wrapper .tabs_wrap{
- padding: 20px;
- border-bottom: 1px solid #ebedec;
-}
-.wrapper .tabs_wrap ul{
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
-}
-.wrapper .tabs_wrap ul li{
- list-style-type: none;
- width: 135px;
+
+
+ display: grid;
+ margin: calc(var(--s) + var(--g));
+ }
+
+ .gall > img {
+ grid-area: 1/1;
+ width: var(--s);
+ aspect-ratio: 1.15;
+ object-fit: cover;
+ clip-path: polygon(25% 0%, 75% 0%, 100% 50%,75% 100%,25% 100%,0 50%);
+ transform: translate(var(--_x,0),var(--_y,0)) scale(var(--_t,1));
+ cursor: pointer;
+ filter: grayscale(80%);
+ transition: .2s linear;
+ }
+
+ .gall > img:hover {
+ filter: grayscale(0);
+ z-index: 1;
+ --_t: 1.2;
+ }
+
+ .gall > img:nth-child(1) {
+ --_y: calc(-100% - var(--g))
+ }
+
+ .gall > img:nth-child(7) {
+ --_y: calc( 100% + var(--g))
+ }
+
+ .gall > img:nth-child(3), .gall > img:nth-child(5) {
+ --_x: calc(-75% - .87*var(--g))
+ }
+
+ .gall > img:nth-child(4), .gall > img:nth-child(6) {
+ --_x: calc( 75% + .87*var(--g))
+ }
+
+ .gall > img:nth-child(3),.gall > img:nth-child(4) {
+ --_y: calc(-50% - .5*var(--g))
+ }
+
+ .gall > img:nth-child(5), .gall > img:nth-child(6) {
+ --_y: calc( 50% + .5*var(--g))
+ }
+
+ .wrapper {
+ width: 500px;
+ height: 100%;
+ background: #fff;
+ margin: 15px auto 0;
+ }
+
+ .wrapper .tabs_wrap {
+ padding: 20px;
+ border-bottom: 1px solid #ebedec;
+ }
+
+ .wrapper .tabs_wrap ul {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ }
+
+ .wrapper .tabs_wrap ul li {
+ list-style-type: none;
+ width: 135px;
+ text-align: center;
+ background: #e9ecf1;
+ border-right: 1px solid #c1c4c9;
+ padding: 13px 15px;
+ cursor: pointer;
+ -webkit-transition: all 0.2s ease;
+ -o-transition: all 0.2s ease;
+ transition: all 0.2s ease;
+ }
+
+ .wrapper .tabs_wrap ul li:first-child {
+ border-top-left-radius: 25px;
+ border-bottom-left-radius: 25px;
+ }
+
+ .wrapper .tabs_wrap ul li:last-child {
+ border-right: 0px;
+ border-top-right-radius: 25px;
+ border-bottom-right-radius: 25px;
+ }
+
+ .wrapper .tabs_wrap ul li:hover,
+ .wrapper .tabs_wrap ul li.active {
+ background: #7fc469;
+ color: #fff;
+ }
+
+ .gall-a {
+ --s: 200px;
+ /* control the size */
+
+
+
+ --g: 8px;
+ /* control the gap */
+
+
+
+
+ display: grid;
+ grid: auto-flow var(--s)/repeat(2,var(--s));
+ gap: var(--g);
+ }
+
+ .gall-a > span {
+ width: 100%;
+ aspect-ratio: 1;
+ z-index: 0;
+ position: relative;
+ transition: .25s,z-index 0s .25s;
+ background-color: lightgray;
+ }
+
+ .gall-b:hover {
+ background-color: var(--ourbeige);
+ }
+
+ .bg-act {
+ background-color: var(--background)!important;
+ }
+
+ .gall-a > span > div > img {
+ width: 8rem;
+ position: absolute;
+ cursor: pointer;
+ }
+
+ .gall-a > span:nth-child(1) > div > img {
+ bottom: 0.5rem;
+ right: 1rem;
+ }
+
+ .gall-a > span:nth-child(2) > div > img {
+ bottom: 0.5rem;
+ left: 1rem;
+ }
+
+ .gall-a > span:nth-child(3) > div > img {
+ top: 0.5rem;
+ right: 1rem;
+ }
+
+ .gall-a > span:nth-child(4) > div > img {
+ top: 0.5rem;
+ left: 1rem;
+ }
+
+ .gall-a > span:nth-child(1) {
+ clip-path: circle(var(--_c,70% at 70% 70%));
+ place-self: start;
+ }
+
+ .gall-a > span:nth-child(2) {
+ clip-path: circle(var(--_c,70% at 30% 70%));
+ place-self: start end;
+ }
+
+ .gall-a > span:nth-child(3) {
+ clip-path: circle(var(--_c,70% at 70% 30%));
+ place-self: end start;
+ }
+
+ .gall-a > span:nth-child(4) {
+ clip-path: circle(var(--_c,70% at 30% 30%));
+ place-self: end;
+ }
+
+ .buffer {
+ height: 5vw;
+ }
+
+ .explore {
+ position: absolute;
+ right: -4vw;
+ bottom: 8vw;
+ z-index: 1;
+ transform: rotate(-35deg);
+ font-size: xx-large;
+ }
+
+ .team-container {
+ grid-template-columns: 100px 50px 100px;
+ grid-template-rows: 80px auto 80px;
+ column-gap: 10px;
+ row-gap: 15px;
+ }
+
+
+
+ /* TEAM */
+
+
+ .lnp {
+ background-image: url("https://static.igem.wiki/teams/5247/scientific-figures/lnp.png");
+ height: 12rem;
+ width: 12rem;
+ background-size: 11.8rem;
+ background-repeat: no-repeat;
+ background-position: center;
+ align-items: center;
+ }
+
+ .lnp > img {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ width: 16rem !important;
+ max-width: 66% !important;
+ transition: all 1s ease;
+ border: 5px solid var(--text-primary);
+ }
+
+ .lnp:hover > img {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ width: 100% !important;
+ max-width: 100% !important;
+ }
+
+
+
+
+ /* datawrapper */
+
+
+ .chart.vis-d3-maps-choropleth {
+ overflow: hidden;
+ position: relative
+ }
+
+ .chart.vis-d3-maps-choropleth .label-buffer.svelte-u5v6p6,
+ .chart.vis-d3-maps-choropleth .label.svelte-u5v6p6 {
+ text-anchor: end
+ }
+
+ .chart.vis-d3-maps-choropleth .rtl .label-buffer.svelte-u5v6p6,
+ .chart.vis-d3-maps-choropleth .rtl .label.svelte-u5v6p6 {
+ text-anchor: start
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container svg {
+ overflow: visible
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container path.view {
+ fill: none
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container circle.view {
+ stroke: none
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container .graticule {
+ fill: none
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container div.label {
+ position: absolute;
+ text-align: center
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container div.label.outline {
+ opacity: .5
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container div.label:not(.outline) span {
+ text-shadow: none
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container {
+ display: flex;
+ justify-content: start;
+ z-index: 1
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container.align-center {
+ justify-content: center
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container[data-position*=inside] {
+ justify-content: start
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container.align-center .legend-title {
+ text-align: center
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container.align-center .category-legend.horizontal {
+ display: grid;
+ justify-items: center
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container.align-center .size-legend[data-title-position=above],
+ .chart.vis-d3-maps-choropleth .legend-container.align-center .size-legend[data-title-position=below] {
+ align-items: center
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-combined {
+ gap: 10px
+ }
+
+ @media (max-width:449px) {
+ .chart.vis-d3-maps-choropleth .legend-container {
+ display: block
+ }
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.mobile {
+ background: #0000;
+ position: static!important
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.mobile .legend-categories {
+ display: inline-block!important
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.mobile .category-legend.horizontal {
+ height: auto!important;
+ width: auto!important
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.mobile .title br {
+ display: none
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.map-key-mb,
+ .chart.vis-d3-maps-choropleth .map-key.map-key-mt,
+ .chart.vis-d3-maps-choropleth .map-key.mobile {
+ background: #0000;
+ padding: 0;
+ position: static!important
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.map-key-mb .legend-categories,
+ .chart.vis-d3-maps-choropleth .map-key.map-key-mt .legend-categories,
+ .chart.vis-d3-maps-choropleth .map-key.mobile .legend-categories {
+ display: inline-block!important
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key.map-key-mb .category-legend.horizontal,
+ .chart.vis-d3-maps-choropleth .map-key.map-key-mt .category-legend.horizontal,
+ .chart.vis-d3-maps-choropleth .map-key.mobile .category-legend.horizontal {
+ height: auto!important;
+ width: auto!important
+ }
+
+ .chart.vis-d3-maps-choropleth .map-key svg {
+ display: block
+ }
+
+ .chart.vis-d3-maps-choropleth .category-legend {
+ border-radius: 4px
+ }
+
+ .chart.vis-d3-maps-choropleth .color-legend {
+ border-radius: 0
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip {
+ background: #fff;
+ border: 1px solid #f5f5f5;
+ box-shadow: 3px 3px 3px #0000001a;
+ font-size: 11px;
+ max-width: 200px;
+ padding: 10px;
+ position: absolute;
+ visibility: hidden;
+ z-index: 100
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip h2 {
+ font-size: 13px;
+ margin-top: 0
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip table {
+ border-spacing: 0;
+ color: inherit;
+ font-size: inherit;
+ font-style: inherit;
+ font-variant: inherit;
+ font-weight: inherit;
+ line-height: inherit;
+ text-align: inherit;
+ white-space: inherit
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip td,
+ .chart.vis-d3-maps-choropleth .dw-tooltip th {
+ padding: 0 5px 3px 0;
+ text-align: left
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip ol,
+ .chart.vis-d3-maps-choropleth .dw-tooltip ul {
+ padding-left: 15px
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip ol li,
+ .chart.vis-d3-maps-choropleth .dw-tooltip ul li {
+ margin-bottom: 2px
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip hr {
+ border: 0;
+ border-top: 1px solid #777
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip big {
+ font-size: 120%
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip small {
+ font-size: 95%
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning {
+ background-color: #f2dede;
+ border: 1px solid #eed3d7;
+ border-radius: 4px;
+ color: #b94a48;
+ font-family: roboto;
+ font-weight: 700;
+ padding: 8px 35px 8px 14px;
+ position: relative;
+ text-shadow: 0 1px 0 #ffffff80
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table {
+ background: #fff;
+ border-radius: 1px;
+ display: block;
+ font-weight: 400;
+ margin-top: 10px;
+ padding: 1px 4px
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table td {
+ padding: 0;
+ vertical-align: top
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table td.arrow {
+ padding-right: 2px
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
+ color: #a7a7a7;
+ float: right;
+ font-size: 17px;
+ height: 17px;
+ line-height: 17px;
+ transform: translate(7px, -5px);
+ width: 17px
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip {
+ left: 0;
+ padding-right: 20px;
+ pointer-events: none;
+ top: 0
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip.sticky {
+ pointer-events: all
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
+ color: #d8d8d8;
+ cursor: pointer;
+ font-size: 14px;
+ height: 14px;
+ line-height: 14px;
+ position: absolute;
+ right: 2px;
text-align: center;
- background: #e9ecf1;
- border-right: 1px solid #c1c4c9;
- padding: 13px 15px;
- cursor: pointer;
- -webkit-transition: all 0.2s ease;
- -o-transition: all 0.2s ease;
- transition: all 0.2s ease;
-}
-
-.wrapper .tabs_wrap ul li:first-child{
- border-top-left-radius: 25px;
- border-bottom-left-radius: 25px;
-}
-
-.wrapper .tabs_wrap ul li:last-child{
- border-right: 0px;
- border-top-right-radius: 25px;
- border-bottom-right-radius: 25px;
-}
-
-.wrapper .tabs_wrap ul li:hover,
-.wrapper .tabs_wrap ul li.active{
- background: #7fc469;
- color: #fff;
-}
-
-
-.gall-a {
- --s: 200px; /* control the size */
- --g: 8px; /* control the gap */
-
- display: grid;
- grid: auto-flow var(--s)/repeat(2,var(--s));
- gap: var(--g);
-}
-.gall-a > span {
- width: 100%;
- aspect-ratio: 1;
- z-index: 0;
- position: relative;
- transition: .25s,z-index 0s .25s;
- background-color: lightgray;
-}
-.gall-b:hover{
- background-color: var(--ourbeige);
-}
-.bg-act{
- background-color: var(--background)!important;
-}
-.gall-a > span > div > img{
- width: 8rem;
- position: absolute;
- cursor: pointer;
-}
-
-.gall-a > span:nth-child(1) > div > img{
- bottom: 0.5rem;
- right: 1rem;
-}
-.gall-a > span:nth-child(2) > div > img{
- bottom: 0.5rem;
- left : 1rem;
-}
-.gall-a > span:nth-child(3) > div > img{
- top: 0.5rem;
- right: 1rem;
-}
-.gall-a > span:nth-child(4) > div > img{
- top: 0.5rem;
- left: 1rem;
-}
-
-.gall-a > span:nth-child(1){
- clip-path: circle(var(--_c,70% at 70% 70%));
- place-self: start;
-}
-.gall-a > span:nth-child(2){
- clip-path: circle(var(--_c,70% at 30% 70%));
- place-self: start end;
-}
-.gall-a > span:nth-child(3){
- clip-path: circle(var(--_c,70% at 70% 30%));
- place-self: end start;
-}
-.gall-a > span:nth-child(4){
- clip-path: circle(var(--_c,70% at 30% 30%));
- place-self: end;
-}
-
-.buffer{
- height: 5vw;
-}
-
-.explore{
- position: absolute;
- right: -4vw;
- bottom: 8vw;
- z-index: 1;
- transform: rotate(-35deg);
- font-size: xx-large;
-}
-
-.team-container {
- grid-template-columns: 100px 50px 100px;
- grid-template-rows: 80px auto 80px;
- column-gap: 10px;
- row-gap: 15px;
-}
-
-/* TEAM */
-.lnp{
- background-image: url("https://static.igem.wiki/teams/5247/scientific-figures/lnp.png");
- height: 12rem;
- width: 12rem;
- background-size: 11.8rem;
- background-repeat: no-repeat;
- background-position: center;
- align-items: center;
-}
-.lnp > img{
- display: block;
- margin-left: auto;
- margin-right: auto;
- width: 16rem !important;
- max-width: 66% !important;
- transition: all 1s ease;
- border: 5px solid var(--text-primary);
-}
-.lnp:hover > img{
- display: block;
- margin-left: auto;
- margin-right: auto;
- width: 100% !important;
- max-width: 100% !important;
-
-}
-
-
-/* datawrapper */
- .chart.vis-d3-maps-choropleth {
- overflow: hidden;
- position: relative
- }
-
- .chart.vis-d3-maps-choropleth .label-buffer.svelte-u5v6p6,
- .chart.vis-d3-maps-choropleth .label.svelte-u5v6p6 {
- text-anchor: end
- }
-
- .chart.vis-d3-maps-choropleth .rtl .label-buffer.svelte-u5v6p6,
- .chart.vis-d3-maps-choropleth .rtl .label.svelte-u5v6p6 {
- text-anchor: start
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container svg {
- overflow: visible
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container path.view {
- fill: none
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container circle.view {
- stroke: none
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container .graticule {
- fill: none
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container div.label {
- position: absolute;
- text-align: center
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container div.label.outline {
- opacity: .5
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container div.label:not(.outline) span {
- text-shadow: none
- }
-
- .chart.vis-d3-maps-choropleth .legend-container {
- display: flex;
- justify-content: start;
- z-index: 1
- }
-
- .chart.vis-d3-maps-choropleth .legend-container.align-center {
- justify-content: center
- }
-
- .chart.vis-d3-maps-choropleth .legend-container[data-position*=inside] {
- justify-content: start
- }
-
- .chart.vis-d3-maps-choropleth .legend-container.align-center .legend-title {
- text-align: center
- }
-
- .chart.vis-d3-maps-choropleth .legend-container.align-center .category-legend.horizontal {
- display: grid;
- justify-items: center
- }
-
- .chart.vis-d3-maps-choropleth .legend-container.align-center .size-legend[data-title-position=above],
- .chart.vis-d3-maps-choropleth .legend-container.align-center .size-legend[data-title-position=below] {
- align-items: center
- }
-
- .chart.vis-d3-maps-choropleth .legend-combined {
- gap: 10px
- }
-
- @media (max-width:449px) {
- .chart.vis-d3-maps-choropleth .legend-container {
- display: block
- }
- }
-
- .chart.vis-d3-maps-choropleth .map-key.mobile {
- background: #0000;
- position: static!important
- }
-
- .chart.vis-d3-maps-choropleth .map-key.mobile .legend-categories {
- display: inline-block!important
- }
-
- .chart.vis-d3-maps-choropleth .map-key.mobile .category-legend.horizontal {
- height: auto!important;
- width: auto!important
- }
-
- .chart.vis-d3-maps-choropleth .map-key.mobile .title br {
- display: none
- }
-
- .chart.vis-d3-maps-choropleth .map-key.map-key-mb,
- .chart.vis-d3-maps-choropleth .map-key.map-key-mt,
- .chart.vis-d3-maps-choropleth .map-key.mobile {
- background: #0000;
- padding: 0;
- position: static!important
- }
-
- .chart.vis-d3-maps-choropleth .map-key.map-key-mb .legend-categories,
- .chart.vis-d3-maps-choropleth .map-key.map-key-mt .legend-categories,
- .chart.vis-d3-maps-choropleth .map-key.mobile .legend-categories {
- display: inline-block!important
- }
-
- .chart.vis-d3-maps-choropleth .map-key.map-key-mb .category-legend.horizontal,
- .chart.vis-d3-maps-choropleth .map-key.map-key-mt .category-legend.horizontal,
- .chart.vis-d3-maps-choropleth .map-key.mobile .category-legend.horizontal {
- height: auto!important;
- width: auto!important
- }
-
- .chart.vis-d3-maps-choropleth .map-key svg {
- display: block
- }
-
- .chart.vis-d3-maps-choropleth .category-legend {
- border-radius: 4px
- }
-
- .chart.vis-d3-maps-choropleth .color-legend {
- border-radius: 0
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip {
- background: #fff;
- border: 1px solid #f5f5f5;
- box-shadow: 3px 3px 3px #0000001a;
- font-size: 11px;
- max-width: 200px;
- padding: 10px;
- position: absolute;
- visibility: hidden;
- z-index: 100
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip h2 {
- font-size: 13px;
- margin-top: 0
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip table {
- border-spacing: 0;
- color: inherit;
- font-size: inherit;
- font-style: inherit;
- font-variant: inherit;
- font-weight: inherit;
- line-height: inherit;
- text-align: inherit;
- white-space: inherit
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip td,
- .chart.vis-d3-maps-choropleth .dw-tooltip th {
- padding: 0 5px 3px 0;
- text-align: left
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip ol,
- .chart.vis-d3-maps-choropleth .dw-tooltip ul {
- padding-left: 15px
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip ol li,
- .chart.vis-d3-maps-choropleth .dw-tooltip ul li {
- margin-bottom: 2px
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip hr {
- border: 0;
- border-top: 1px solid #777
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip big {
- font-size: 120%
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip small {
- font-size: 95%
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning {
- background-color: #f2dede;
- border: 1px solid #eed3d7;
- border-radius: 4px;
- color: #b94a48;
- font-family: roboto;
- font-weight: 700;
- padding: 8px 35px 8px 14px;
- position: relative;
- text-shadow: 0 1px 0 #ffffff80
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table {
- background: #fff;
- border-radius: 1px;
- display: block;
- font-weight: 400;
- margin-top: 10px;
- padding: 1px 4px
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table td {
- padding: 0;
- vertical-align: top
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip .tooltip-warning table td.arrow {
- padding-right: 2px
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
- color: #a7a7a7;
- float: right;
- font-size: 17px;
- height: 17px;
- line-height: 17px;
- transform: translate(7px, -5px);
- width: 17px
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip {
- left: 0;
- padding-right: 20px;
- pointer-events: none;
- top: 0
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip.sticky {
- pointer-events: all
- }
-
- .chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
- color: #d8d8d8;
- cursor: pointer;
- font-size: 14px;
- height: 14px;
- line-height: 14px;
- position: absolute;
- right: 2px;
- text-align: center;
- top: 2px;
- transform: none;
- width: 14px
- }
-
- @media (max-device-width:600px) {
- .chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
- font-size: 17px;
- height: 17px;
- line-height: 17px;
- padding: 4px;
- width: 17px
- }
- }
-
- .chart.vis-d3-maps-choropleth rect.background {
- fill: none;
- pointer-events: all
- }
-
- .chart.vis-d3-maps-choropleth svg.svg-main {
- display: block
- }
-
- .chart.vis-d3-maps-choropleth .label {
- pointer-events: none
- }
-
- .chart.vis-d3-maps-choropleth .map-outer {
- position: relative
- }
-
- .chart.vis-d3-maps-choropleth .annotations,
- .chart.vis-d3-maps-choropleth .map-outer canvas {
- left: 0;
- pointer-events: none;
- position: absolute;
- top: 0
- }
-
- .chart.vis-d3-maps-choropleth .annotations {
- height: 99%;
- width: 100%
- }
-
- .chart.vis-d3-maps-choropleth .d3-maps-zoomed-in .annotations {
- overflow: hidden
- }
-
- .chart.vis-d3-maps-choropleth .editing-annotations .zoom-buttons,
- .chart.vis-d3-maps-choropleth .editing-annotations svg {
- pointer-events: none
- }
-
- .chart.vis-d3-maps-choropleth .legend-container {
- min-height: 10px
- }
-
- .chart.vis-d3-maps-choropleth .inset-map-container {
- opacity: 1;
- pointer-events: none;
- position: absolute;
- transition: opacity .1s ease-in-out
- }
-
- .chart.vis-d3-maps-choropleth .dw-chart-body-content.inset-map-zoom-only:not(.inset-map-show) .inset-map-container {
- opacity: 0
- }
-
- .chart.vis-d3-maps-choropleth path.region {
- fill: #bebcba
- }
-
- .chart.vis-d3-maps-choropleth .lbl-hidden {
- pointer-events: none;
- visibility: hidden
- }
-
- .chart.vis-d3-maps-choropleth path.borders {
- fill: none;
- stroke-linejoin: round;
- stroke-linecap: round;
- pointer-events: none
- }
-
-
- .d3-maps-zoomed-in .annotations {
- overflow: hidden
- }
-
-
-
- .chart.dir-rtl .dw-chart-body.svelte-9ysojt {
- direction: rtl
- }
-
-
-
-
-
-
- .chart.js.svelte-9ysojt .noscript {
- display: none
- }
-
- .chart .hidden{
- display: none
- }
-
- a img {
- border: 0px
- }
-
- b,
- strong {
- font-weight: bold
- }
-
- svg rect {
- shape-rendering: crispEdges
- }
-
- .error {
- background-color: #fbeff2;
- box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) inset;
- margin: 2em
- }
-
- .error p {
- color: #b63057;
- font-size: 14px;
- padding: 1.25em 1.5em;
- line-height: 1.5;
- border-color: #cf4870;
- border-style: solid;
- border-width: 0 0 0 4px;
- border-radius: 4px
- }
-
- .dw-chart-body-content.svelte-9ysojt {
- position: relative;
- z-index: 0
- }
-
- .is-static.svelte-ej8jdi a {
- color: unset;
- pointer-events: none;
- text-decoration: inherit
- }
-
- .dir-rtl .outer-container.svelte-ej8jdi {
- direction: rtl
- }
-
- .outer-container.svelte-ej8jdi {
- position: relative
- }
-
- .container-afterChart.svelte-ej8jdi {
- position: absolute;
- pointer-events: none;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0
- }
-
- /* Additional bc missing? */
- .datawrapper-llngz-1tjke6r.horizontal g.labels text, .datawrapper-llngz-1tjke6r.horizontal g.labels text tspan {
- dominant-baseline: hanging;
- }
- .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text.min, .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text tspan.min {
- text-anchor: start;
- }
- .datawrapper-llngz-1j8h2cc text:not(.buffer) {
- fill: currentcolor;
- }
- .datawrapper-llngz-umw1i2 {
- color: rgb(24, 24, 24) !important;
- font-family: Roboto, sans-serif;
- font-size: 12px;
- }
- .datawrapper-llngz-1tjke6r.horizontal g.labels text, .datawrapper-llngz-1tjke6r.horizontal g.labels text tspan {
- dominant-baseline: hanging;
- }
- .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text.max, .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text tspan.max {
- text-anchor: end;
- }
- .chart.vis-d3-maps-choropleth .map-outer {
- position: relative;
- }
- .chart.vis-d3-maps-choropleth .annotations, .chart.vis-d3-maps-choropleth .map-outer canvas {
- left: 0;
- pointer-events: none;
- position: absolute;
- top: 0;
- }
- .chart.vis-d3-maps-choropleth rect.background {
- fill: none;
- pointer-events: all;
- }
- svg rect {
- shape-rendering: crispEdges;
- }
- .datawrapper-llngz-mbp9a6 path.region-outline.has-data:hover, .datawrapper-llngz-mbp9a6 path.region-outline.hover-outline, .datawrapper-llngz-mbp9a6 path.region-outline.sticky {
- stroke: rgb(0, 0, 0);
- }
-
- /* FILTER */
- .filterable {
- margin-bottom: 4px;
- display: none;
- }
- .show {
- display: block;
- }
- .noshow{
- display: none;
- }
-
-
- /* SLICK */
-
- /* .slider-container{
- display: grid;
- align-items: center;
- } */
-
-
-
-
-
-
-
-.slick-loading
-
-{
-
+ top: 2px;
+ transform: none;
+ width: 14px
+ }
+
+ @media (max-device-width:600px) {
+ .chart.vis-d3-maps-choropleth .dw-tooltip .dw-tooltip-close {
+ font-size: 17px;
+ height: 17px;
+ line-height: 17px;
+ padding: 4px;
+ width: 17px
+ }
+ }
+
+ .chart.vis-d3-maps-choropleth rect.background {
+ fill: none;
+ pointer-events: all
+ }
+
+ .chart.vis-d3-maps-choropleth svg.svg-main {
+ display: block
+ }
+
+ .chart.vis-d3-maps-choropleth .label {
+ pointer-events: none
+ }
+
+ .chart.vis-d3-maps-choropleth .map-outer {
+ position: relative
+ }
+
+ .chart.vis-d3-maps-choropleth .annotations,
+ .chart.vis-d3-maps-choropleth .map-outer canvas {
+ left: 0;
+ pointer-events: none;
+ position: absolute;
+ top: 0
+ }
+
+ .chart.vis-d3-maps-choropleth .annotations {
+ height: 99%;
+ width: 100%
+ }
+
+ .chart.vis-d3-maps-choropleth .d3-maps-zoomed-in .annotations {
+ overflow: hidden
+ }
+
+ .chart.vis-d3-maps-choropleth .editing-annotations .zoom-buttons,
+ .chart.vis-d3-maps-choropleth .editing-annotations svg {
+ pointer-events: none
+ }
+
+ .chart.vis-d3-maps-choropleth .legend-container {
+ min-height: 10px
+ }
+
+ .chart.vis-d3-maps-choropleth .inset-map-container {
+ opacity: 1;
+ pointer-events: none;
+ position: absolute;
+ transition: opacity .1s ease-in-out
+ }
+
+ .chart.vis-d3-maps-choropleth .dw-chart-body-content.inset-map-zoom-only:not(.inset-map-show) .inset-map-container {
+ opacity: 0
+ }
+
+ .chart.vis-d3-maps-choropleth path.region {
+ fill: #bebcba
+ }
+
+ .chart.vis-d3-maps-choropleth .lbl-hidden {
+ pointer-events: none;
+ visibility: hidden
+ }
+
+ .chart.vis-d3-maps-choropleth path.borders {
+ fill: none;
+ stroke-linejoin: round;
+ stroke-linecap: round;
+ pointer-events: none
+ }
+
+ .d3-maps-zoomed-in .annotations {
+ overflow: hidden
+ }
+
+ .chart.dir-rtl .dw-chart-body.svelte-9ysojt {
+ direction: rtl
+ }
+
+ .chart.js.svelte-9ysojt .noscript {
+ display: none
+ }
+
+ .chart .hidden {
+ display: none
+ }
+
+ a img {
+ border: 0px
+ }
+
+ b,
+ strong {
+ font-weight: bold
+ }
+
+ svg rect {
+ shape-rendering: crispEdges
+ }
+
+ .error {
+ background-color: #fbeff2;
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) inset;
+ margin: 2em
+ }
+
+ .error p {
+ color: #b63057;
+ font-size: 14px;
+ padding: 1.25em 1.5em;
+ line-height: 1.5;
+ border-color: #cf4870;
+ border-style: solid;
+ border-width: 0 0 0 4px;
+ border-radius: 4px
+ }
+
+ .dw-chart-body-content.svelte-9ysojt {
+ position: relative;
+ z-index: 0
+ }
+
+ .is-static.svelte-ej8jdi a {
+ color: unset;
+ pointer-events: none;
+ text-decoration: inherit
+ }
+
+ .dir-rtl .outer-container.svelte-ej8jdi {
+ direction: rtl
+ }
+
+ .outer-container.svelte-ej8jdi {
+ position: relative
+ }
+
+ .container-afterChart.svelte-ej8jdi {
+ position: absolute;
+ pointer-events: none;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0
+ }
+
+
+
+ /* Additional bc missing? */
+
+
+ .datawrapper-llngz-1tjke6r.horizontal g.labels text, .datawrapper-llngz-1tjke6r.horizontal g.labels text tspan {
+ dominant-baseline: hanging;
+ }
+
+ .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text.min, .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text tspan.min {
+ text-anchor: start;
+ }
+
+ .datawrapper-llngz-1j8h2cc text:not(.buffer) {
+ fill: currentcolor;
+ }
+
+ .datawrapper-llngz-umw1i2 {
+ color: rgb(24, 24, 24) !important;
+ font-family: Roboto, sans-serif;
+ font-size: 12px;
+ }
+
+ .datawrapper-llngz-1tjke6r.horizontal g.labels text, .datawrapper-llngz-1tjke6r.horizontal g.labels text tspan {
+ dominant-baseline: hanging;
+ }
+
+ .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text.max, .datawrapper-llngz-zuu2r2.horizontal:not(.dir-rtl) g.labels text tspan.max {
+ text-anchor: end;
+ }
+
+ .chart.vis-d3-maps-choropleth .map-outer {
+ position: relative;
+ }
+
+ .chart.vis-d3-maps-choropleth .annotations, .chart.vis-d3-maps-choropleth .map-outer canvas {
+ left: 0;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ }
+
+ .chart.vis-d3-maps-choropleth rect.background {
+ fill: none;
+ pointer-events: all;
+ }
+
+ svg rect {
+ shape-rendering: crispEdges;
+ }
+
+ .datawrapper-llngz-mbp9a6 path.region-outline.has-data:hover, .datawrapper-llngz-mbp9a6 path.region-outline.hover-outline, .datawrapper-llngz-mbp9a6 path.region-outline.sticky {
+ stroke: rgb(0, 0, 0);
+ }
+
+
+
+ /* FILTER */
+
+
+ .filterable {
+ margin-bottom: 4px;
+ display: none;
+ }
+
+ .show {
+ display: block;
+ }
+
+ .noshow {
+ display: none;
+ }
+
+
+
+
+ /* SLICK */
+
+
+
+
+
+ /* .slider-container{
+ display: grid;
+ align-items: center;
+ } */
+
+
+
+
+
+
+
+
+
+ .slick-loading {
visibility: hidden;
-
-}
-
-
-
-
-
-
-
-.slick-initialized
-
-{
-
+ }
+
+ .slick-initialized {
display: block;
-
-}
-
-.slick-loading
-
-{
-
+ }
+
+ .slick-loading {
visibility: hidden;
-
-}
-
-.slick-vertical
-
-{
-
+ }
+
+ .slick-vertical {
display: block;
-
-
height: auto;
-
-
border: 1px solid transparent;
-
-}
-
-
-
-
-/* Dots */
-
-
-
-.sponsor-container{
- align-items: center !important;
- display: flex !important;
-}
-
-#All {
- display: block;
-}
-
-.tabtabs, .tabbys{
- display: none;
-}
-
-.tabbutton{
- padding: 5px;
- border-radius: 10px;
- padding-left: 10px;
- padding-right: 10px;
- margin-left: 5px;
- margin-right: 5px;
-}
+ }
+
+
+
+
+
+
+ /* Dots */
+
+
+
+
+
+ .sponsor-container {
+ align-items: center !important;
+ display: flex !important;
+ }
+
+ #All {
+ display: block;
+ }
+
+ .tabtabs, .tabbys {
+ display: none;
+ }
+
+ .tabbutton {
+ padding: 5px;
+ border-radius: 10px;
+ padding-left: 10px;
+ padding-right: 10px;
+ margin-left: 5px;
+ margin-right: 5px;
+ }
\ No newline at end of file
--
GitLab