style.css

/*
This CSS file is modified from:
https://huggingface.co/spaces/DeepFloyd/IF/blob/main/style.css
*/

h1 {
    text-align: center;
}
  
.gradio-container {
    font-family: 'IBM Plex Sans', sans-serif;
    width: 85% !important
}

.gr-image img {
    max-width: 50%;
    max-height: 50%;
    height: auto;
    width: auto;
}
  
input[type='range'] {
    accent-color: black;
}
  
.dark input[type='range'] {
    accent-color: #dfdfdf;
}
  
.container {
    max-width: 730px;
    margin: auto;
}
  
#prompt-container {
gap: 0;
}

#prompt-text-input,
#negative-prompt-text-input {
padding: .45rem 0.625rem
}

/* #component-16 {
border-top-width: 1px !important;
margin-top: 1em
} */

.image_duplication {
position: absolute;
width: 100px;
left: 50px
}

#component-0 {
max-width: 730px;
margin: auto;
padding-top: 1.5rem;
}
#share-btn-wrapper{background-color: transparent;border: 0;margin-top: -10px}
#share-btn-wrapper .styler{background-color: transparent}
#share-btn-container{padding-left: 0.5rem !important; padding-right: 0.5rem !important; background-color: #000000; justify-content: center; align-items: center; border-radius: 9999px !important; max-width: 13rem; margin-left: auto;}
div#share-btn-container > div {flex-direction: row;background: black;align-items: center}
#share-btn-container:hover {background-color: #060606}
#share-btn {all: initial; color: #ffffff;font-weight: 600; cursor:pointer; font-family: 'IBM Plex Sans', sans-serif; margin-left: 0.5rem !important; padding-top: 0.5rem !important; padding-bottom: 0.5rem !important;right:0;font-size: 15px;}
#share-btn * {all: unset}
#share-btn-container div:nth-child(-n+2){width: auto !important;min-height: 0px !important;}
#share-btn-container .wrap {display: none !important}
#share-btn-container.hidden {display: none!important}