body {
    width: 100%;
    margin: 0;
    padding: 40px; /* creates white frame effect inside the viewport */
    background: #fff;
    box-sizing: border-box;
}
img .images
{
    margin-bottom: 10px;
    margin-left: 20px;
    margin-top: 20px;
}
.thbig
{
    font-size: 28px;
}
.table_big
{
    width: 100%;
}
.ecm_tables_div
{
    display: flex;
    flex-direction: row;
}

.frame {
    width: 100%;
    margin: 10px; /* creates the white frame with spacing from edges */
    padding: 50px;
    background: #fff; /* white background inside the frame */
    border: 2px solid black; /* black outer border */
    box-sizing: border-box;
}

table, tbody
{
    border: 1px solid black;
    text-align: center;
    padding: 2px;
}
.ctrheading
{
    font-family: Arial, sans-serif;
    font-size: 46px;
    margin-left: 20px;
    text-align: center;
}
tr, td
{
    border: 1px solid black;
    text-align: center;
    font-size: 12px;
}
#wire_color_table
{
    width: 180px;
    border: 1px solid #000;
    margin-right: 20px;
    padding: 10px;
}
#connect_table
{
    width: 100px;
    border: 1px solid #000;
    margin-bottom: 50px;
    padding: 20px;
}
#function_table
{
    width: 100px;
    margin-top: 20px;
    text-align: center;
    border: 1px solid #000;
    font-size: 12px;
    padding: 4px;
    table-layout: fixed;
}
.diagram_header
{
    background: rgb(34, 34, 34);
    border: 1px solid rgb(0, 0, 0);
    padding-top: 40px;
}


.speedometer_container
{
    width: 80%;
}
.small-svg {
    display: inline-block; /* Aligns SVG with text */
    vertical-align: middle; /* Centers SVG vertically with text */
    width: 30px; /* Reduced width for the icons */
    height: 30px; /* Reduced height for the icons */
}
/* Style for the text inside the SVG triangle */
.svg-text {
    font-size: 8px; /* Reduced font size for E and C */
    text-anchor: middle;
    font-weight: normal;
}
.ground-symbols {
    display: flex;
    flex-direction: column; /* Stacks the items vertically */
    align-items: flex-start; /* Aligns them to the left */
}
.ground-symbols .paragraph {
    margin-bottom: 4px; /* Adjust as needed for vertical spacing */
}
.allow-wrap td {
    white-space: normal !important; /* Use !important if needed */
}
.splice_high_container,.splice_gnd_container
{
    margin-left: 100px;
}
.splice_gnd_container2
{
    margin-top: 100px;
}
.diagram_container {
    display: flex;
    flex-wrap: nowrap; /* Prevents wrapping to a new line */
    gap: 20px;
    margin-top: 50px;
}
.diagram_container2 {
    display: flex;
    flex-wrap: nowrap; /* Prevents wrapping to a new line */
    gap: 10px;
    padding: 5px;
}
.diagram_group_small{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 5px;
}
.diagram_group {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px;
    height: 250px;
}
.diagram_group_big {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px;
    height: 250px;
}
.diagram_big_title
{
    margin-top: 90px;
    transform: rotate(-90deg);
    white-space: nowrap;
    margin-bottom: 45px;
    font-size: 16px;
    text-align: center;
}
.diagram_title {
    margin-top: 50px;
    transform: rotate(-90deg);
    white-space: nowrap;
    margin-bottom: 45px;
    font-size: 16px;
    text-align: center;
}
.diagram_group .diagram_ports,.diagram_group_big .diagram_ports {
    transform: rotate(-90deg);
    padding: 0;
    font-size: 12px;
    line-height: 1;
    white-space:nowrap;
}
.diagram_group .diagram_ports2
{
    padding: 0;
    font-size: 18px;
    line-height: 1;
    white-space:nowrap;
}
.diagram_group_small .diagram_ports2
{
    padding: 0;
    font-size: 18px;
    white-space:nowrap;
}
.ground_diagrams_div
{
    border: 1px solid black;
    background-color: antiquewhite;
}
.diagram_img {
    margin-top: 10px;
    width: 600px;
    height: 600px;
    object-fit: contain;
    margin-bottom: 50px;
}
.diagram_img2
{
    width: 250px;
    height: 250px;
    object-fit: contain;
    margin-bottom: 50px;
}
.diagram_container_group12
{
    background-color: cornflowerblue;
}
.diagram_big_img {
    margin-top: 40px;
    width: 250px;
    height: 250px;
    object-fit: contain;
    margin-bottom: 50px;
}
.bottom_left_div,.center_left_div,.top_left_div
{
    width: 250px;
}
.bottom_middled_div,.bottom_left_div,.bottom_right_div
{
    margin-bottom: 100px;
}
.bottom_left_div,.center_left_div,.center_middled_div,.bottom_middled_div,.bottom_right_div
{
    margin-top: 100px;
}
.purge_container,.diagram_group29
{
    background-color: chocolate;
    color: #fff;
}
.starter_title
{
    margin-left: 100px;
}
.chasis_gnd_diagram
{
    width: 250px;
    height: 250px;
}
.bottom_middled_div,.center_middled_div,.top_centered_div
{
    width: 250px;
    margin-left: 100px;
}
.bottom_right_div,.center_right_div,.top_right_div {
    width: 250px;
    margin-left: 100px;
    margin-right: 100px;
}
