.truck_form{
    max-width: 300px;
    margin: auto;
    padding-top: 30px;
}

.wrapper_form{
    max-width: 600px;
    margin: auto;
    padding-top: 30px;
}

.chartBox {
    width: 1000px;
}

.chart-container {
    /* position: relative; */
    /* width: 30%; */
    /* height: 30%; */
    /* margin: auto; */
    display: block;
    display: inline-block;
    /* float: left; */
    padding: 20;
}

#myChartRev, #myChartCost {
    width: 630px;
    height: 400px;
}

.container_button {
    font-size:18px;
    /* margin:auto; */
    display: flex;  
    justify-content: center;  
    align-items: center;  
    margin-top: 30px;
}

.graphBoxtop {
    position: relative;
    width: 100%;
    padding: 20px;
    display: grid;
    /* grid-template-columns: 2fr 1fr; */
    grid-gap: 25px;
    /* max-height: 480px; */
}

.graphBoxtop .boxtop {
    position: relative;
    background: rgb(255, 255, 255);
    padding: 20px;
    width: 100%;
    /* box-shadow: 0 7px 25px rgb(0, 0, 0, 0.08); */
    /* border-radius: 20px; */
}

.graphBoxbottom {
    position: relative;
    width: 100%;
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 25px;
    /* max-height: 480px; */
}

.graphBoxbottom .boxbottom {
    position: relative;
    background: rgb(255, 255, 255);
    padding: 20px;
    width: 100%;
    /* box-shadow: 0 7px 25px rgb(0, 0, 0, 0.08); */
    /* border-radius: 20px; */
}

@media (max-width:991px) {
    .graphBoxbottom {
        grid-template-columns: 1fr;
        height: auto;
    }
}