body {
    z-index: -10;
}

* {
    outline: none !important;
    outline: 0;
}

.example_image {
    display: block;
    width: 80vw;
    height: 80vw;
}
@media screen and (min-width: 48em) {
    .example_image {
        display: block;
        width: 45vw;
        height: 45vw;
    }
}

.mvn {
    max-width: none;
}

.grid3 {
  display: grid;
}

@media screen and (min-width: 60em) {
    .grid3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

.code_area {
    /* height: 150px; */
    /* overflow-y: hidden; */
    /* overflow-y: scroll; */
}

#ctrl_canvas {
    margin: 0;
    background-color: #dddddd;
}

.canvas_ui {
    width: 150px;
    height: 150px;
}

.img_objects_count {
    width: 75px;
    height: 75px;
}

.canvas_ui2 {
    width: 150px;
    height: 150px;
    padding: 0;
    margin: 0;
}

.canvas_overlay {
    background-color: gray;
}

.canvas_img_ui {
    margin-right: 4px;
    margin-bottom: 4px;
    width: 150px;
}

.canvas_img_ui > div {
    margin-top: 0px;
    border-top: 0px;
}

#status {
    display: hide;
}

.delete_button {
    width: 55px;
    text-align: center;
}

input {
     box-sizing: border-box;
     -webkit-box-sizing:border-box;
     -moz-box-sizing: border-box;
    border: 0px;
    border-bottom: 1px solid;
}

#one {
    width: 400px;
    overflow-y: scroll;
}

.editable_code {
	white-space:pre-wrap;

    -ms-word-break: break-all;
    word-break: break-all;

 /* Non standard for webkit */
     word-break: break-word;

    -webkit-hyphens: auto;
       -moz-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
}