/*
    CSS for my_images.asp
 */
#my_images_div {
    max-width: 800px;
    padding: 0px 0px 0px 5px;
}
div.mimg_ui_label {
    font-size: 1.25em;
    color:#849BCD;
}
#select_image_note {
    font-size: 0.9em;
}

/* image list div */
#img_list {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    gap: 3px 5px;
    overflow: auto;
    border: 1px solid #DDD;
}
div.img_list {
    width: 750px;
    height: 400px;
    padding: 5px 0px 10px 10px;
}
div.img_list_m {
    min-width: 305px;
    max-width: 500px;
    height: 250px;
    padding: 5px 0px 10px 5px;
    margin: 0px 5px 0px 0px;
}

div.img_div,
div.img_div_m {
    padding: 5px 0px;
    overflow: hidden;
    text-align: center;
    background: #FFF;
    border: 1px solid #DDD;
    font-size: 10px;
}
div.img_div {
    width: 165px;
    height: 235px;
}
div.img_div_m {
    width: 145px;
    height: 160px;
}
div.mimg_img_links {
    display: flex;
}
div.mimg_img_links div {
    margin: 0px 5px;
}

#no_images_div {
    flex: 2;
    font-size: 1em;
    text-align: center;
}

/* upload div */

#upload_div {
    display: flex;
    padding: 5px 0px;
    font-size: 0.75em;
    border-bottom: 1px solid #DDD;
}
div.upload_div {
    width: 750px;
}
div.upload_div_m {
    min-width: 305px;
    margin: 0px 10px 0px 0px;
}
div.upload_buttons {
    margin: 0px 0px 0px 10px;
}
div.upload_buttons_m input.gcubutton_grey {
    margin: 5px 0px 0px 0px;
}
input.upload_file_m {
    max-width: 230px;
}
#upload_button {
    display: none;
}

#upload_wait {
    display: none;
    gap: 15px;
    width: 250px;
    margin: 0px 0px 0px 10px;
}
#upload_wait > img {
    align-self: center;
}

/* zoom div */

#zoom_image_div {
    display: none;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin: 5px 0px;
}
div.zoom_image_div {
    width: 800px;
    height: 595px;
}
div.zoom_image_div_m {
    padding: 0px 5px;
}
div.zoom_image_div > div {
    max-width: 750px;
    max-height: 570px;
}
div.zoom_image_div_m > div {
    max-width: 425px;
    max-height: 425px;
}
img.zoom_image_img {
    width: auto;
    height : auto;
    max-height: 100%;
    max-width: 100%;
}

#my_images_footer {
    display: flex;
}
div.my_images_footer {
    width: 750px;
    margin: 15px 0px 0px 0px;
}
div.my_images_footer_m {
    min-width: 305px;
    margin: 5px 0px 0px 0px;
}
#my_images_footer > div {
    padding: 0px 5px 0px 0px;
}