*{padding: 0;margin: 0;}
body{
    background-color: #B9D4E2;
}
p{
    font-size:1.2vw;
    line-height: 2vw;
    padding:2%;
}
div{
    font-size:1.2vw;
    line-height: 1.5vw;
}



td{padding: 0%;}


body{
    
    background: url('#');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #B7D4E2;
}
.bapart1{   position: relative;
width: 100%;
height: 48vw;
background-color: transparent;
}
.bapart2{
position: relative;
width: 100%;
height: 29vw;
background-color: transparent;
}
.bapart3{
position: relative;
width: 100%;
height:  153vw;
background-color: transparent;

}
.bapart4{
position: relative;
width: 100%;
height: 125vw;
background-color: transparent;

}




.bapart1content{
position: relative;
width: 70%;
left: 27%;
height: auto;
top: 23%;
border-radius: 14px;
background-color:#98cfeb;
}
.bapart2content{
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 5vw;
    border-radius: 14px;
    background-color:rgba(188, 220, 237, 0.6);
}
.bapart3content1{
position: relative;
border-radius: 14px;
width: 70%;
left: 27%;
height: auto;
top: 4%;
color:white;
background-color:  rgba(44, 92, 129, 0.6);
}
.bapart3content21{
border-radius: 14px;
position: relative;
width: 70%;
left: 27%;
height: auto;
top: 17vw;
color:white;
background-color:  rgba(44, 92, 129, 0.6);
}
.bapart3content22{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 28vw;
    color:white;
    background-color:  rgba(44, 92, 129, 0.6);
    }
.bapart3content23{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 33vw;
    color:rgb(44, 92, 129);
background-color:  rgba(188, 220, 237, 0.6);
    }
.bapart3content24{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 37vw;
    color:white;
    background-color:rgba(44, 92, 129, 0.6);
    }
    .mopart4content3{
            border-radius: 14px;
            position: relative;
            width: 70%;
            left:27%;
            height: auto;
            top: 82%;
            background-color:#83bfdd;
            }
.bapart5content{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 4%;
    background-color:#83bfdd;
}
.bapart4content11{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 4%;
    background-color:#83bfdd;
}
.bapart4content12{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 4%;
    background-color:#83bfdd;
}
.bapart4content13{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 6%;
    background-color:#83bfdd;
}
.bapart4content2{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left: 27%;
    height: auto;
    top: 4%;
    background-color:#83bfdd;
}


.mopart5content2{
    border-radius: 14px;
    position: relative;
    width: 70%;
    left:27%;
    height: auto;
    top: 55vw;
    background-color:#83bfdd;
    }



.footer{
position: relative;
left: 0vw;
background-color: #cdedf9;
width: 100%;
height: 24vw;
bottom: -222vw;
}





.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%;
}









.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: -222vw;
}


/* 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: 6vw;
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: 81%;
}
.overbasicpart:hover{
width: 12%;
left: 24%;
top: 74% ;
transition: 0.4s;
}
.basisword{
position: absolute;
width: 10%;
left: 24%;
top:100%;
}
.overcompositeparts{

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


}
.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: 100%;
}

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;
}