body {
    background-color: #f8f8f8 !important;
    /*background-image: url("https://ak.picdn.net/shutterstock/videos/16179688/thumb/1.jpg") !important;*/
    /* background-position: center !important;*/
    /*background-repeat: no-repeat !important;*/
    /*background-size: cover !important;*/
}

.dz {
    min-height: 400px!important;
    margin-left: 20%;
    max-width: 400px!important;
    background-color: #ccc !important;
    border-radius: 10px !important;
    border: 3px solid darkblue !important;
}

.dz:hover {
    background-color: aliceblue !important;
}

.dropzone .dz-preview .dz-image {
  width: 300px !important;
  height: 300px !important;
}

#open_col{
    display: none;
}

@media (max-width: 600px) {

    .dropzone .dz-preview .dz-image {
        width: 150px !important;
        height:200px !important;
    }

    .dz {
        min-height: 300px !important;
        margin-left: 0;

    }

    #create_col {
        display: none;
        margin-left: 50%;
    }
    #result_col {
        display: none;
        margin-left: 50%;
    }
    #clear_col {
        display: none;
        margin-left: 50%;
    }

    #open_col {
        display: block;
    }

    #dropzone_container{
        width:100%;
    }


}

/*@media (max-width: 1100px) {*/

/*    .dropzone .dz-preview .dz-image {*/
/*        width: 150px !important;*/
/*        height:200px !important;*/
/*    }*/

/*    .dz {*/
/*        min-height: 300px !important;*/
/*        margin-left: 0;*/

/*    }*/

/*    #create_col {*/
/*        display: none;*/
/*        margin-left: 50%;*/
/*    }*/
/*    #result_col {*/
/*        display: none;*/
/*        margin-left: 50%;*/
/*    }*/
/*    #clear_col {*/
/*        display: none;*/
/*        margin-left: 50%;*/
/*    }*/

/*    #open_col {*/
/*        display: block;*/
/*    }*/

/*    #dropzone_container{*/
/*        width:100%;*/
/*    }*/


/*}*/