/*_____________________________________________________________________________
-                 Trinix Media - Fronted Framework Library
-                       M O D A L   S T Y L I N G 
-                       Development Version 0.0.1
-                         (c) Trinix Media 2022

- Created by: Brandon Reilly on 11/16/2022 @ 10:52PM
-
- 
______________________________________________________________________________________*/


:root {
 --modal-var-background: rgba(13, 13, 26, .666);
 --modal-var-border-color: rgba(100, 100, 125, .95);
 --modal-var-border-width: .075rem;
 
    
}
.TM.modal-container-fullsize-background {
    position: fixed;
    left: 0;
    top: 0;
    
    width: 100%;
    height: 100%;
    
    margin: 0;
    padding: 0;
    
    background: var(--modal-var-background);
    
}

.TM.modal-container-fullsize-background .modal {
    display: block;
    
    min-width: 20rem;
    max-width: 50rem;
    
    width: 75%;
    
    min-height: 5rem;
    max-height: 15rem;
    height: auto;
    
    border-radius: .35rem;
    border: var(--modal-var-border-width) outset var(--modal-var-border-color);
    
}


.TM.modal-container-fullsize-background .modal {
    display: block;
    min-width: 20rem;
    position: absolute;
    max-width: 80vw;
    width: 60rem;
    left: 50%;
    top: 50%;
    margin: auto;
    min-height: 5rem;
    /* border: .15rem outset rgba(245, 250, 255, 1); */
    max-height: 75vh;
    border: .25rem outset rgba(45, 125, 205, 1);
    height: auto;
    transform: translate3d(-50%, -50%, 0);
    padding: .25rem .5rem;
    box-shadow: 0.25rem 0.25rem 0.5rem rgb(6 6 6 / 75%);
    background: rgba(225, 235, 245, 1);
    border-radius: .5rem;
    background: linear-gradient(to bottom, hsla(0,0%,14%,0.31) 1%,hsla(0,0%,14%,0.54) 2%,hsla(0,0%,25%,1) 4%,hsla(0,0%,61%,1) 10%, hsla(0,0%,29%,1) 98%,hsla(0,0%,25%,1) 100%);
    background: rgb(119 136 153);
    background: radial-gradient(rgba(225, 235, 250, 1), rgba(175, 185, 185, 1));
    background: radial-gradient(ellipse farthest-corner at 0% 20%, rgb(204, 210, 215) 20%, rgb(125, 130, 135) 80%, rgb(110, 115, 125) 100%);
    /* background: rgb(192 192 192); */
    /* border: var(--modal-var-border-width) outset var(--modal-var-border-color); */
    background: radial-gradient(ellipse farthest-corner at 0% 20%, rgb(235, 240, 245) 20%, rgb(195, 190, 195) 80%, rgb(180, 175, 175) 100%);
}


.TM.modal-container-fullsize-background .image-modal {
    position: absolute;
    display: block;
    min-width: 20rem;
    max-width: 95vw;
    width: 100%;
    min-height: 25rem;
    max-height: 85vh;
    height: auto;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);

    margin: auto;
    padding: .25rem .5rem;
    
    box-shadow: .5rem .5rem .75rem rgba(6, 6, 6, .75);
    background: rgba(126, 126, 126, 1);
    border-radius: .5rem;
    border: var(--modal-var-border-width) outset var(--modal-var-border-color);
}

.TM.modal-container-fullsize-background .modal .modal-body {
    color: rgb(13, 13, 13);
    font-family: 'Prompt';
    font-size: 1.15rem;
}


.TM.modal-container-fullsize-background .modal #modal-progress-lable-id {
    color: rgb(6, 6, 6);
    font-family: 'Tomorrow';
    text-align: center;
    width: 100%;
}

.TM.modal-container-fullsize-background .modal #modal-progress-id {
    width: 100%;
}



@media (min-width: 1400px) {
    
    
      
}

@media (max-width:768px)
{

    

}