@charset "UTF-8";

.jquery-helpers-modal{
 min-width: 200px;
 min-height: 100px;
 background-color: #00000090
}
.jquery-helpers-modal.cover{
 position: fixed;
 top: 0;
 left: 0;
 min-width: 100%;
 min-height: 100%;
 overflow: auto
}
.jquery-helpers-modal.center{
 position: fixed;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
}
.jquery-helpers-modal>a{
 display: block;
 width: 50px;
 height: 50px
}
.jquery-helpers-modal>a.close{
 top: 20px;
 right: 20px
}

/*
 Alert
 */

.jquery-helpers-alert{
 position: fixed;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: fit-content;
 min-width: 300px;
 max-width: calc( 100% - 40px );
 min-height: 100px;
 padding: 0;
 text-align: center;
 background-color: #fff
}
.jquery-helpers-alert.fixed-bottom{
 top: auto;
 left: 0;
 right: 0;
 bottom: 0;
 transform: none;
}

.jquery-helpers-alert.thin{
 width: calc( 100% - 40px );
 max-width: 400px
}
.jquery-helpers-alert.wide{
 width: calc( 100% - 40px );
 max-width: 800px
}
.jquery-helpers-alert.fullwidth{
 width: 100%;
 max-width: none
}
.jquery-helpers-alert.loading>div{
 opacity: 0	
}
.jquery-helpers-alert .alert-header p, 
.jquery-helpers-alert .alert-message p{
 margin: 0
}
.jquery-helpers-alert .alert-header a.close{
 top: 50%;
 right: 0;
 margin-top: -30px
}
.jquery-helpers-alert .alert-header{
 position: relative;
 padding: 14px 20px;
 border-bottom: solid #c0c0c0 1px
}
.jquery-helpers-alert .alert-message{
 padding: 0 20px;
 margin-top: 14px
}
.jquery-helpers-alert .ajaxbox,
.jquery-helpers-alert .ajax-wrapper{
 max-height: calc( 100vh - 333px );
 padding: 0 20px 20px 20px;
 min-height: 100px;
 text-align: left;
 overflow: hidden;
 overflow-y: auto
}
.jquery-helpers-alert .alert-message+.ajaxbox,
.jquery-helpers-alert .alert-message+.ajax-wrapper{
 max-height: calc( 100vh - 444px );
 margin-top: 20px
}
.jquery-helpers-alert .ajaxbox>div,
.jquery-helpers-alert .ajax-wrapper>div{
 padding-top: 25px;
 padding-bottom: 25px 
}
.jquery-helpers-alert .alert-controls{
 padding: 24px 20px 20px 20px
}
.jquery-helpers-alert .alert-controls:empty{
 height: 10px;
 padding: 0
}
.jquery-helpers-alert .alert-controls.align-left{
 text-align: left
}
.jquery-helpers-alert .alert-controls.align-right{
 text-align: right
}
.jquery-helpers-alert .alert-controls button+button{
 margin-left: 20px
}
