@charset "UTF-8";


.voting{
    max-width: 1000px;   /*Maximum width of image voting and options*/
    margin-left: auto;
    margin-right: auto;
}

.voting-img{
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
    width: 90%;

    height: auto;
}

/* Image higlight on button hover only if hasHover enabled.*/
body.hasHover .image_hover{
    border: solid 3px black;
}

.voting-options{
    margin-top: 2vh;
    /*display: grid;
    grid-template-columns: auto auto auto;
    width: 25%; /*To center buttons with image center*/

    width:25%;          /* To center this inside parent element.*/
    margin-left: auto;  /* To center this inside parent element.*/
    margin-right: auto; /* To center this inside parent element.*/

    display: flex;              /* To center children. */
    justify-content: center;    /* Vertical centering. */
    align-items: center;	    /* Horizontal centering. */
}

.voting-opt{
    display:inline-block;
    margin-left: auto;
    margin-right: auto;
}

#left_btn{
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    margin-right: 10px;
}

#left_btn, #equal_btn, #right_btn{
    background-color: white;
    border: 3px solid black;
    color: black;
}

#right_btn{
    border-top-right-radius: 50%;
    border-bottom-right-radius: 50%;
    margin-left: 10px;
}

/* Hover only if hasHover enabled.*/
body.hasHover .grows:hover {
    background-color:#212529 !important;
    color: rgb(254, 209, 54) !important;
}

#voting_text, #perc{
    margin-top:2rem;
}

#voting {
    padding-top: 9rem;
}