@font-face {
  font-family: "Lato";
  src: url("https://static.igem.wiki/teams/4273/wiki/pdf/lato-font/lato-v23-latin-regular.woff2")
      format("woff2"), 
    url("https://static.igem.wiki/teams/4273/wiki/pdf/lato-font/lato-v23-latin-regular.woff")
      format("woff");
    
  font-style: normal;
}
/*award*/
.award-avatar{
    width: 9vw;
    position: fixed;
    display: block;
    top: 48vh;
    left: 2vw;
}
.award-avatar:hover{
    width: 9vw;
    position: fixed;
    display: block;
    top: 48vh;
    left: 2vw;
    transition: transform 2s;
    border-radius: 50%;
    transform: scale(1.25) rotate(360deg);;
    box-shadow: 3px 3px 3px rgb(224, 240, 254);

}
/*footer*/
.footer-container{
    display: flex;
}
.left-half{
 flex: 1;
}
.right-half{
 flex: 1;
}

.title{
    position: absolute;
    margin-top: -33vw;
    font-family: fantasy;
    font-size: 10vw;
    width: 100%;
    text-align: center;
    color: #598BAF;
}

td{
    text-align: center;
}
.show_buttons:active{
    transform: translateY(4px) !important;
}
.three_buttons{
    margin:8% !important; 
}
#borderimgadvisor p {
    font-size: 1.3vw!important;
    margin-left: 0vw!important;
    margin-right: 0vw!important;
    
}
#team_members > div {
    display: inline-block!important;
    width: 18vw!important;
    height: 42vw!important;
    border-radius: 5%!important;
    margin: 3vw!important;
    box-shadow: 0px 5px 15px rgba(0,0,0,0.2)!important;
    overflow: scroll!important;
}
#team_members img {
    width: 15vw!important;
    height: auto!important;
    border-radius: 3%!important;
}
#team_members h3 {
    text-align: center!important;
    font-family: "Open Sans"!important;
    overflow: visible !important;
}

#borderimgadvisor { 
  border: 1vw solid transparent;
  border-image: url("https://static.igem.wiki/teams/4273/wiki/t-links-china-border-advisors.jpg") 30 round;
  border-image-width: 1.8vw; 
  border-image-outset: 1.5vw;
}

p {
    margin-top: 2.5vw;
    margin-right: 1vw;
    margin-bottom: 2.5vw;
    margin-left: 1vw;
    font-size: 1.3vw;
    font-weight: 390;
    font-family: 'LatoLight', sans-serif;
    color:black!important;
line-height: 1.75;
}
.attribution-img{
    width: 20vw;
    height: auto;
    box-shadow: 2px 2px 2px #ccc;
    margin: 10px 0px;
    border-radius: 10px;
}
body{
    animation: fadeInAnimation ease 2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
@keyframes fadeInAnimation {
            0% {
                opacity: 0;
            }
            100% {
                opacity: 1;
            }
        }

#common-background{
    background-image: url('https://static.igem.wiki/teams/4273/wiki/t-links-china-bottom-image.jpg');
    background-size: cover;
}

.navbutton{
    width:11vw!important;
    padding:3px;
    background: #a8ccc3;
    border-radius:10px;
    z-index:9999;
}
#scrolltop{
    width:11vw!important;
    height:auto!important;
}
#scrolltop1{
    margin-left:-0.19vw!important;
    width:11vw!important;
    height:auto!important;
    transform:scaleX(0.98);
}
#scrolltop2{
    margin-left:-0.19vw!important;
    width:11vw!important;
    height:auto!important;
    transform:scaleX(0.985);
}
#scroll{
    width:11vw;
    height:auto;
}
.left-aligned { margin-left: auto; }
.bg-dark{ background-color:transparent!important; }

/*header*/

.header-img{
    height:auto;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    width:100%;
}
.navbar-brand{
    position: absolute;
    top:6.303vh;
    left:8%;
}
li{
    list-style:none!important;
}
    .text-white-50 {
    color: darkcyan!important;
}
ul.dropdown-content{
    display:none;
      position:absolute;
}
.dropdown:hover ul.dropdown-content{
    display:block;
}
.header-content{
    position:absolute;
    top:50%;
    left:8%;
    text-align: center;
}
/*text*/
.normal-paragraph{
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
   border-radius: 10px;
   padding: 2rem;
   background-color:rgba(255,255,255,0.85);
   opacity:1;
   margin-left: 6vw;
   overflow-wrap: break-word;
}

/*embed pdf*/
.pdf {
display: flex;
width:100%;
height:70.028vh;
margin:auto;
}


/*nav*/
.navbar-dark .navbar-brand {
    color: darkcyan!important;
    font-size:1.875em!important;
}
.navbar-dark .navbar-nav .nav-link {
    color: darkcyan!important;
}
.dropdown-item{
    color:darkcyan!important;
    padding:0;
    width:7.813vw!important;
}
.dropdown-item:hover{
background-color:transparent!important;
}
.dropdown-menu:hover{
background-color:transparent!important;  
}
.dropdown-menu{
background-color: transparent!important;
border:none;
}

/*sidebar*/
@media only screen and (min-width: 1224px) {
#sidebar{
    position: sticky;
    background:linear-gradient(to top, rgba(53,72,115,0.7), rgba(118,212,236,0.7));
    opacity: 1;
    top: 12%;
    /*margin: 100vh 0vw 15vh 0vw;*/
    float: left;
    left: 3.5vw;
    border-radius: 30px;
}
#sidelink ul{
display:block; 
list-style:none;
margin-left: 0px !important;
margin-top:5vh;
}


#sidelink a{
color: black;
padding: 2.55vh 2vw;
display: block;
font-size: 1.2vw;
}
#sidebar a:hover{
color: lightcoral;
background:linear-gradient(to left,#fffbea,#c2efff);
border-radius: 0px !important;
text-shadow: 0.8px 0.8px grey;
padding: 2.5vh 2vw;
}

.yeast {
  width: 3.8vw!important;
  height: 3.8vw!important;
  background-image: url('https://static.igem.wiki/teams/4273/wiki/t-links-china-sidebar-img.png')!important;
  background-size: contain!important;
  background-repeat: no-repeat!important;
  position: relative!important;
  animation: yeastmove 8s infinite!important;
  animation-delay: 0s!important;
  animation-direction: alternate!important;
  animation-iteration-count: infinite!important; 
}
}

@media only screen and (max-width: 1224px) {
    .yeast{
        display: none;
    }
    #sidebar{
        display: none;
    }
    #sidelink ul{
        display: none;
    }
    #sidelink a{
       display: none; 
    }
    #sidebar a:hover{
     display: none; 
    }
}


/*footer link color*/
footer a{
    color:lavender!important;
}

/*footer image style*/

.sponsors{
    display: flex!important;
}

#footer-img2{
    width: 15vw !important;
display: inline-block;
    height: auto !important;
    margin-bottom: 8%;
    margin-right: 0;
    margin-left: 7%;
    margin-top: 6%;
}

hr {
color: black;
height: 5px!important;
}

a{
    text-decoration: none;
}

.normal-one-image{
display: block;
margin-left: auto;
margin-right: auto;
width: 75%!important;
height: auto!important;
margin-top: 7.003vh;
margin-bottom: 3.501vh;
}

.normal-one-image-caption{
text-align: center!important;
font-size: 0.9vw!important;
margin-bottom: 7.003vh;
left:auto;
right:auto;
display:block;
}


.citations{
font-size: medium;
font-family: LatoLight;
overflow-wrap: break-word;
}

/* CALLOUT */
.bd-callout { padding:1.25rem; margin-top:1.25rem; margin-bottom:1.25rem; border:1px solid #e9ecef; border-left-width:.25rem; border-radius:.25rem }
.bd-callout h4 { margin-bottom:.25rem }
.bd-callout p:last-child { margin-bottom:0 }
.bd-callout code { border-radius:.25rem }
.bd-callout+.bd-callout { margin-top:-.25rem }
.bd-callout-info { border-left-color:#5bc0de }
.bd-callout-warning { border-left-color:#f0ad4e }
.bd-callout-danger { border-left-color:#d9534f }

/* footer */
footer a { color: white; font-weight: bold; text-decoration: none; }
footer a:hover { color: white; text-decoration: underline; }