.admin-bar #page {

    min-height: calc(50vh - 32px) !important;

}



.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-draggable.ui-resizable{

    width: 100% !important;

    left: 0 !important;

  }

      /* body {

        padding: 0px;

        margin: 0px;

        min-height: calc(100vh - 50px);

        position: relative;

        background: #fff;

      } */

  

      /* body>div.content {

        padding: 20px 40px;

      } */

  

      .title {

        margin: 6px 0;

      }

  

      .container {

        display: flex;

        flex-direction: row;

        flex-wrap: wrap;

      }

  

      .garment {

        position: relative;

        margin: 10px;

        width: 200px;

        height: 300px;

        padding-bottom: 10px;

        border: 2px solid #9E9E9E;

        border-radius: 10px;

      }

      .garment .tryon_button {

        display: block;

        position: absolute;

        bottom: 0px;

        left: 0px;

        right: 0px;

        text-align: center;

        padding: 6px;

      }

      .garment input[type=checkbox] {

        position: absolute;

        top: 0px;

        left: 0px;

        margin: 8px;

        width: 20px;

        height: 20px;

      }

  

      .garment:hover {

        background-color: #EEEEEE;

      }

  

      .garment:active {

        background-color: #BDBDBD;

      }

  

      .garment_icon {

        width: 200px;

      }

  

      .garment_name {

        display: block;

        text-align: center;

      }

  

      .part_item_container {

        overflow: auto;

        height: 200px;

        min-height: 200px;

      }

  

      .part_item {

        box-sizing: border-box;

        display: inline-block;

        margin: 10px 12px;

        position: relative;

        height: 160px;

        width: 120px;

        overflow: hidden;

      }

  

      .part_item:hover {

        background-color: #EEEEEE;

      }

  

      .part_item:active {

        background-color: #BDBDBD;

      }

  

      .part_item > img {

        width: 120px;

      }

  

      .part_item_selected {

        border: 2px solid #9E9E9E;

      }

  

      .part_item_name {

        text-align: center;

        position: absolute;

        bottom: 6px;

        left: 0;

        right: 0;

      }

  

      .garment_view {

        width: 100%;

        height: 500px;

        border: none;

        background: #c460e2; /* Old browsers */

        background-image: linear-gradient(to bottom, #a2a2a2, #111111);

        position: relative;

        display: flex;

      }

  

      .previews {

        width: 100%;

        height: 500px;

        overflow-x: auto;

        display: flex;

        flex-direction: column;

        flex-wrap: wrap;

      }

  

      #signin_dialog>div>div {

        padding: 6px;

      }

  

      #signin_dialog input {

        width: 320px;

      }

  

      .tryon_garment_view {

        width: 100%;

        height: 90vh;

        border: none;

        background: #c460e2; /* Old browsers */

        background-image: linear-gradient(to bottom, #a2a2a2, #111111);

        position: relative;

      }

  

      #tryon_dialog .previews {

        height: auto;

      }

  

      #tryon_dialog[status=ready] .tryon_garment_view {

        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC");

      }

  

      @keyframes tryon_panel_fadein {

        from {height: 0px;}

        to {height: 48px;}

      }

      #tryon_panel {

        background-color: #2CBDCB;

        animation-name: tryon_panel_fadein;

        animation-duration: .5s;

        background-color: #ddd;

        padding: 12px;

        text-align: center;

      }

      #tryon_panel button {

        font-size: 1.2em;

        font-weight: bold;

        background-color: black;

        color: #fff;

        width: auto;

        height: 48px;

        line-height: 48px;

        border: none;

        padding: 0px 12px;

      }

  

      #tryon_panel button:hover {

        /* background-color: #2CBDCB; */

        background-color: #00BCD4;

        color: black;

      }

  

      .ui-dialog{

        /* width: 100% !important; */

      }

      .ui-dialog {

        padding: 0;

        border-radius: 0;

        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3) !important;

      }

  

      .ui-dialog-titlebar-close {

        background: none;

        border: none;

        outline: 0;

      }

  

      .ui-dialog-titlebar-close:hover {

        background: none;

        border: none;

      }

  

      .ui-dialog-titlebar-close:focus {

        background: none;

        border: none;

        outline: 0;

      }

  

      .ui-dialog-titlebar-close:active {

        background: none;

        border: none;

      }

  

      .ui-widget-content {

        padding: 0;

        border-radius: 0;

        box-shadow: none;

        border: #757575 0.5px solid !important;

      }

      .ui-dialog-content{

        width: 100% !important;

      }

      .ui-widget-header {

        background: #9E9E9E !important;

        border-color: #9E9E9E !important;

        border-radius: 0 !important;

      }

  

      .ui-tabs-tab {

        background: #F5F5F5 !important;

        margin: 2px .2em 2px 0 !important;

        padding-bottom: 1px !important;

        border: #F5F5F5 1px solid !important;

      }

  

      .ui-tabs-anchor {

        color: #222 !important;

      }

  

      .ui-tabs-active {

        background: #757575 !important;

        border: #757575 1px solid !important;

      }

  

      .ui-tabs-active .ui-tabs-anchor {

        color: #fff !important;

      }

  

      .ui-tabs-active .ui-tabs-anchor:hover {

        outline: 0;

      }

  

      .ui-tabs-active .ui-tabs-anchor:focus {

        outline: 0;

      }

  

      .ui-tabs-active .ui-tabs-anchor:active {

        outline: 0;

      }

  

      .spinner {

        width: 40px;

        height: 40px;

        position: absolute;

        bottom: 240px;

        left: calc(50% - 10px);

        z-index: 999;

      }

  

      .arrow_left {

        border: solid black;

        border-width: 0 3px 3px 0;

        display: inline-block;

        padding: 5px;

        transform: rotate(135deg);

        -webkit-transform: rotate(135deg);

        margin-right: 3px;

        cursor: pointer;

      }

  

      .folder {

        width: 120px;

        height: 90px;

        display: inline-block;

        margin: auto;

        position: relative;

        background-color: #708090;

        border-radius: 0 8px 8px 8px;

        margin-bottom: -8px;

        margin-top: 20px;

      }

      .ui-tabs .ui-tabs-nav {

      margin: 0;

      padding: .2em .2em 0;

      display: flex;

      flex-direction: column;

      width: 250px;

      }

      /* .ui-widget.ui-widget-content {

        display: flex;

      } */

  

      div#tabs{

        display: flex;

      }

      .ui-tabs .ui-tabs-panel{

        height: 100vh;

        width: 36vw;

      }

  

      .ui-widget-overlay.ui-front{

        width: 100%;

      }

      #dialog{

        display: flex;

      }

      .folder:before {

        content: '';

        width: 36%;

        height: 12px;

        border-radius: 0 20px 0 0;

        background-color: #708090;

        position: absolute;

        top: -12px;

        left: 0px;

      }

  

      .double-bounce1, .double-bounce2 {

        width: 100%;

        height: 100%;

        border-radius: 50%;

        background-color: #fff;

        opacity: 0.6;

        position: absolute;

        top: 0;

        left: 0;

        -webkit-animation: sk-bounce 3.0s infinite ease-in-out;

        animation: sk-bounce 3.0s infinite ease-in-out;

      }

  

      .double-bounce2 {

        -webkit-animation-delay: -1.5s;

        animation-delay: -1.5s;

      }

  

      @-webkit-keyframes sk-bounce {

        0%, 100% { -webkit-transform: scale(0.0) }

        50% { -webkit-transform: scale(1.0) }

      }

  

      @keyframes sk-bounce {

        0%, 100% {

          transform: scale(0.0);

          -webkit-transform: scale(0.0);

        } 50% {

          transform: scale(1.0);

          -webkit-transform: scale(1.0);

        }

      }

  

      .copyright {

        position: absolute;

        left: 0;

        right: 0;

        bottom: 0;

        font-size: 8px;

        text-align: center;

        margin-bottom: 10px;

      }

      

      .garment{

        width: 300px !important;

        height: auto !important;

      }