#title{
    text-align: center;
    padding-top: 26px;
    padding-bottom: 14px;
    font-size: 365%;
    font-style: italic;
    text-shadow: 3px 3px 5px grey;
}

#title, #docksText {
    animation: slideIn linear forwards;
    animation-duration: 1.5s;
    
}

@keyframes slideIn{
    from{transform: translate(-1797px, 0)}
    to {transform: translate(0, 0)}
}

@keyframes slideInLeft {
    from{transform: translate(1797px, 0)}
    to {transform: translate(0, 0)}
}

#docks {
    display: flex;
    justify-content: space-between;
    padding-bottom: 13px;
    

}

#dock1{
    width: 35%;
    animation: slideInLeft linear;
    animation-duration: 1.5s;
}

#docksText{
    border-radius: 15px;
    width: 57%;

    padding: 22px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    font-size: 110%
}

#docksText ul li::marker {
    color: #64ca93;
}

.subtitle{
    text-align: center ;
}

#serSub {
    text-align: center;
    padding-left: 150px;
    padding-right: 150px;
}

table tr td{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    border-radius: 15px;
    width: 45%;
    padding: 12px;
    text-align: center;
    transition: transform 0.4s;
    background-color: white;
}

table tr td:hover {
    transform: scale(1.1)
}

table {
    border-spacing: 10px;
}

.graphic {
    width: 20%;
}

#reviewPic1{
    width: 53%
}
#reviewPic2{
    width: 55%
}
#reviewPic3{
    width: 61%
}
#reviewPic4{
    width: 50%
}
#reviewPic5{
    width: 32%
}

.review {
    font-weight: bold;
}

.name {
    color: #64ca93;
    font-weight: bold;
}