*{padding: 0;margin: 0;scroll-behavior: smooth;}

body{
    background: url('#');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

p{
    font-size:1.2vw;
    line-height: 2vw;
    padding:2%;
}


.overbasicpart{
    position: absolute;
    width: 10%;
    left: 25%;
    top: 100%;
    }
    .overbasicpart:hover{
    width: 12%;
    left: 24%;
    top: 99% ;
    transition: 0.4s;
    }
    .basisword{
    position: absolute;
    width: 7%;
    left: 26%;
    top:135%;
    }
    .overcompositeparts{
    
    position: absolute;
    width: 10%;
    left: 45%;
    top: 100%;
    }
    .overcompositeparts:hover{
    width: 12%;
    left: 44%;
    top: 99% ;
    transition: 0.4s;
    }
    .compoword{
    position: absolute;
    width: 10%;
    left: 45%;
    top: 135%;
    
    
    }
    .overpartcollection{
    
    position: absolute;
    width: 10%;
    left:65%;
    top:101%;
    
    }
    .overpartcollection:hover{
    width: 11.5%;
    left: 64.25%;
    top: 100.25% ;
    transition: 0.4s;
    }
    .collectword{
    position: absolute; 
    width: 9%;
    left: 65%;
    top: 135%;
    }
    





.papart1{   position: relative;
width: 100%;
height: 30vw;
background-color: transparent;
}
.papart2{
position: relative;
width: 100%;
height: 40vw;
background-color: transparent;
top:19vw;
}
.papart3{
position: relative;
width: 100%;
height: 135vw;
background-color: transparent;
top: 73vw;

}
.papart4{
position: relative;
width: 100%;
height: 52vw;
background-color: transparent;
top: 93vw;
}
.papart5{
position: relative;
width: 100%;
height: 106vw;
background-color: transparent;
top:68vw;
}
.papart6{
position: relative;
width: 100%;
height: 50vw;
background-color: transparent;
top:15vw;
}



.papart2content1 {
position: relative;
width: 70%;
left: 27%;
height: auto;
top: 0%;
border-radius: 14px;
background-color:rgba(188, 220, 237,0.6);
color:rgba(44, 92, 129,1);
}
.papart3content1{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 4%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.bapart3content1{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 4%;
color:white;
background-color:  rgba(44, 92, 129, 0.6);
color:aliceblue;
}
.bapart3content21{
border-radius: 14px;
position: relative;
width: 70%;
left: 27%;
height: auto;
top: 17vw;
color:white;
background-color:  rgba(44, 92, 129, 0.6);
color:aliceblue;
}
.papart3content2{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top:  6%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.papart3content3{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top:  8%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.papart3content4{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top:  52%;
}
.papart4content1{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 4%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.papart5content1{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 6%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.papart5content2{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top:  9%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.papart5content3{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 12%;
background-color:rgba(44, 92, 129,0.8) ;
color:aliceblue;
}
.papart5content4{
position: relative;
border-radius: 14px;
width: 70%;
left: 11%;
height: auto;
top:  15%;
}
.papart5content5{
position: relative;
border-radius: 14px;
width: 70%;
left: 37%;
height: auto;
top:  15%;
}
.papart5content6{
position: relative;
border-radius: 14px;
width: 70%;
left: 62%;
height: auto;
top:  15%;
}
.papart6content{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 48%;
background-color:rgba(44, 92, 129,0.8);
}
.footer{
position: relative;
left: 0vw;
background-color: #cdedf9;
width: 100%;
height: 24vw;
bottom: -30vw;
}





.part{
position:absolute;
width: auto;
height: 25%;
left: 25%;
top: 56%;

}

.hp{
position:absolute;
width: auto;
height: 29%;
left:45% ;
top: 52.5%;
}
.labwork{
position:absolute;
left: 5%;
width: auto;
height: 29%;
top: 52%;
}
.team{
position:absolute;
left: 35%;
width: auto;
height: 29%;
top: 53%;
}

.project{
position:absolute;
width: auto;
height: 29%;
top: 52%;
left: 15%;
}

.labwork:hover{
height: 34%;
transition: 0.2s;
left: 4.4%;
top: 49.5%;
}
.part:hover{
height: 29.31%;
transition: 0.2s;
left: 24.3535%;
top: 53.85%;
}
.team:hover{
height: 34%;
transition: 0.2s;
left: 34.4%;
top: 49.5%;
}
.project:hover{
height: 34%;
transition: 0.2s;
top: 49.5%;
left: 14.4%;
}
.hp:hover{
height:34%;
transition: 0.2s;
top: 50%;
left: 44.4%;
}

.pc{
    font-size: 1.2vw;
    line-height: 1.5vw;
    padding: 2%;
}

.cpfigure1{
    width: 35vw;
    position: absolute;
    left: 43vw;
    top: 36vw;
}

.cpfigure3a{
    width: 21vw;
    position: absolute;
    left: 16vw;
}
.cpfigure3b{
    width: 21vw;
    position: absolute;
    left: 15vw;
}
.cpfigure3c{
    width: 21vw;
    position: absolute;
    left: 14vw;
}
.cpfigure{
    font-size: 0.8vw;
    line-height: 1,5vw;
}



.knight{
position: absolute;
top:5%;
left: 3%;
width: 16%;
height: auto;

}

.rightdiv{
position: absolute;
width: 25%;
height: auto;
left: 68%;
bottom: 10%;
}



.transition {
position: relative;
text-align: center;
border:0;
margin: 0;
z-index: 9;
}

.waves {
position: relative;
width: 100%;
height: 15vh;
margin-bottom: -7px; 
min-height: 50px;
max-height: 150px;
bottom: -30vw;
}


/* Animation */

.parallax > use {
animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
}
.parallax > use:nth-child(1) {
animation-delay: -2s;
animation-duration: 7s;
}
.parallax > use:nth-child(2) {
animation-delay: -3s;
animation-duration: 10s;
}
.parallax > use:nth-child(3) {
animation-delay: -4s;
animation-duration: 13s;
}
.parallax > use:nth-child(4) {
animation-delay: -5s;
animation-duration: 20s;
}
@keyframes move-forever {
0% {
transform: translate3d(-90px, 0, 0);
}
100% {
transform: translate3d(85px, 0, 0);
}
}
/*Shrinking for mobile*/
@media (max-width: 768px) {
.waves {
height: 20px;
min-height: 20px;
}

}



.lisencep1{
margin: 0;

text-align: center;
}
.lisencep2{
margin: 0;
text-align: center;

}
a{
text-decoration-line: none; 
color: #416d8e;
}



#tooltip {
position: absolute;
bottom: 7vw;
right: 5vw;
width: 15vw;

background: transparent;
color: #416d8e;
text-align: center;
line-height: 1rem;
font-size: 0.7vw;
font-weight: 800;
}
.snapgene{
position: absolute;
width: 24%;
height: auto;
top: 2.6vw;
left: 23%;
}
.footerschool{
position: absolute;
width: 8%;
height: auto;
top: 3vw;
left:50%;
}

.overclick{
position: relative;
display: inline;
text-align: center;
top: 18vw;
left: 45%;
}
.overbasicpart{
position: absolute;
width: 10%;
left: 25%;
top: 75%;
}
.overbasicpart:hover{
width: 12%;
left: 24%;
top: 74% ;
transition: 0.4s;
}
.basisword{
position: absolute;
width: 10%;
left: 24%;
top:115%;
}
.overcompositeparts{

position: absolute;
width: 10%;
left: 45%;
top: 75%;
}
.overcompositeparts:hover{
width: 12%;
left: 44%;
top: 74% ;
transition: 0.4s;
}
.compoword{
position: absolute;
width: 10%;
left: 45%;
top: 115%;


}
.overpartcollection{

position: absolute;
width: 10%;
left:65%;
top:81%;

}
.overpartcollection:hover{
width: 12%;
left: 64%;
top: 80% ;
transition: 0.4s;
}
.collectword{
position: absolute; 
width: 10%;
left: 65%;
top: 115%;
}

p{
padding: 2%;
}






#p1-1 {
/* padding-left: 50%; */
top: 50px;
}
.pppppart {
box-sizing: border-box;
position: relative;
width: 100%;
height: auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
overflow: hidden;
margin: 0;
}
#p2-2t1 {
text-align: right;
}

.content {
height: auto;
width: 80%;
overflow: hidden;
text-overflow: ellipsis;
word-break: keep-all;
/* padding-bottom: 50px; */
font-family: Arial, sans-serif;
font-size: 1rem;
line-height: 1.5rem;
text-align: justify;
text-align-last: left;
}
.img-intro {
text-align: center;
font-size: 13px;
}
.insert-img {
margin-top: 40px;
margin-bottom: 40px;
width: 70%;
display: inline-block;
}
.block1 {
width: 70%;
height: auto;
overflow-x: hidden;
font-family: Arial, sans-serif;
font-size: 1rem;
line-height: 1.5rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#p1-1-1, #p1-1-2 {
width: 80vw;
align-items: center;
left: 10%;
/* padding-left: 20vw; */
}
#p1-1-1, #p1-1-2 {
width: 80vw;
align-items: center;
left: 10%;}
.block1 {
width: 70%;
height: auto;
overflow-x: hidden;
font-family: Arial, sans-serif;
font-size: 1rem;
line-height: 1.5rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#table1 {
width: 90%;
border-collapse: collapse;
height: auto;
text-align: center;
table-layout: auto;
}
a{
color: #144851;
text-decoration: none;
}
.odd {
background-color: #AAD6E0;
border: 1px #174747;
}
.even {
background-color: #77b2bc;
}