#canvas_container {
    width: 940px;
    height: 600px;
    overflow: auto;

}
#canvas_container {
    padding-top: 40px;
    background: #333;
    text-align: center;
    border: solid 3px;
    border-radius: 20px;
}
#zoom_in{
    font-family: Arial;
    font-size: 25px;
    width: 60px;
    height: 30px;
    color: white;
    background-color: rgba(15,46,76,1);
    border-radius: 5px;
    border-color: rgb(21, 55, 94);

}
#zoom_in:hover {
    font-family: Arial;
    font-size: 25px;
    width: 60px;
    height: 30px;
    color: white;
    background-color: rgb(31, 80, 46);
    border-radius: 5px;
    border-color: rgba(20,46,76,1);
}
#zoom_in{
    transition: color 0.8s linear 0.2s;
}
#zoom_out{
    font-family: Arial;
    font-size: 25px;
    width: 60px;
    height: 30px;
    color: white;
    background-color: rgba(15,46,76,1);
    border-radius: 5px;
    border-color: rgb(21, 55, 94);

}
#zoom_out:hover{
    font-family: Arial;
    font-size: 25px;
    width: 60px;
    height: 30px;
    color: white;
    background-color: rgb(31, 80, 46);
    border-radius: 5px;
    border-color: rgba(20,46,76,1);
}
#zoom_out{
    transition: color 0.8s linear 0.2s;
}
#go_next{
    font-family: Arial;
    font-size: 20px;
    width: 100px;
    height: 30px;
    color: white;
    background-color: rgba(15,46,76,1);
    border-radius: 5px;
    border-color: rgb(21, 55, 94);

}
#go_next:hover{
    font-family: Arial;
    font-size: 20px;
    width: 100px;
    height: 30px;
    color: white;
    background-color: rgb(31, 80, 46);
    border-radius: 5px;
    border-color: rgba(20,46,76,1);
}
#go_next{
    transition: color 0.8s linear 0.2s;
}
#go_previous{
    font-family: Arial;
    font-size: 20px;
    width: 100px;
    height: 30px;
    color: white;
    background-color: rgba(15,46,76,1);
    border-radius: 5px;
    border-color: rgb(21, 55, 94);

}
#go_previous:hover{
    font-family: Arial;
    font-size: 20px;
    width: 100px;
    height: 30px;
    color: white;
    background-color: rgb(31, 80, 46);
    border-radius: 5px;
    border-color: rgba(20,46,76,1);
}
#go_previous{
    transition: color 0.8s linear 0.2s;
}
#current_page {
    background-color: rgba(72, 72, 76, 0.36);
    width: 110px;
    height: 30px;
    border-color: #18344c;
    font-size: 20px;
    color: rgba(8, 51, 76, 1);
    border-radius: 5px;
    border: 4px;
}
#fam1, #fam2, #fam3, #fam4{
    font-family: Arial;
    font-size: 20px;
    width: 160px;
    height: 30px;
    color: white;
    background-color: rgba(15,46,76,1);
    border-radius: 5px;
    border-color: rgb(21, 55, 94);
    transition: color 1s linear 0.8s;;

}
#fam1:hover, #fam2:hover, #fam3:hover, #fam4:hover{
    font-family: Arial;
    font-size: 20px;
    width: 160px;
    height: 30px;
    color: white;
    background-color: rgb(31, 80, 46);
    border-radius: 5px;
    border-color: rgba(20,46,76,1);
}