/* Dialog Box */

@media (max-width:768px) {
    .my-popup { width: 540px; height: auto; margin: 0px; padding: 0px;}
    .my-popup {
        top: 0%;
/*        transform: translateX(calc((0vw)/2));
        -ms-transform: translate(-50%,-50%);*/
        height: 100vh;
        width: 100vw;
    }

}


@media (min-width:768px) {
    .my-popup { width: 720px; height: auto; margin: 0px; padding: 0px;}
    .my-popup {
      
        
        width: 600px;
    }

}

@media (min-width:992px) {
    .my-popup { width: 920px; height: auto; margin: 0px; padding: 0px;}
    .my-popup {
        
        width: 768px;

    }

}
@media (min-width:1200px) {
    .my-popup { width: 1040px; height: auto;margin: 0px; padding: 0px;}
    .my-popup {

     
        width: 768px;
        
    }
}





@media (min-width:200px) {

    .mDialog-Header {
        min-width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-start;
        align-content: space-between;
    }
    .mDialog-Header .pull-left  { }
    .mDialog-Header .pull-right { }


    .mDialog-Header .my-close-btn {
        width: 100%;
    }
    
    .my-popup-content { margin: 20px;}


    .my-popup-content .element-header.my-h2-black-border-orange {
        padding-bottom: 1rem;
        border-bottom: 2px solid #219a33;
        font-size: 1.25rem;
        font-weight: 600;
        padding-bottom: 1rem;
    }
    .my-popup-content .frame-header {        
        padding-bottom: .5rem;
    }


   

    .mDialog-Close {
        /* display: block; */
        text-align: center;
        font-weight: bold;
        font-size: 1.2rem;
        color: white;
        padding: .25rem;
        padding-left: .5rem;
        padding-right: .5rem;
        cursor: pointer;
        float: right;
        margin-bottom: 0px;
    }


    .mDialog-Footer {
        min-width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-start;
        align-content: space-between;
    }
    .mDialog-Footer .pull-left  { }
    .mDialog-Footer .pull-right { }



    /* Popup Dialog Box*/
    .my-popup {
        position: fixed;
        display: none;
        background: white;
        background: rgba(255,255,255,.95);
        z-index: 10099;
        box-shadow: -1px 1px 10px #666;
    }

    .my-popup-content {
        padding-top: 0rem;
        padding-bottom: 0rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .my-popup-content > .frame {
        padding-top: 2.5rem;
        padding-bottom: 1em;
    }


    #my-overlay {
        position: fixed; /* Sit on top of the page content */
        display: none; /* Hidden by default */
        width: 100%; /* Full width (cover the whole page) */
        height: 100%; /* Full height (cover the whole page) */
        top: 0; 
        left: 0;
        right: 0;
        bottom: 0;

        background-color: rgba(0,0,0,0.1); 

        /* Black background with opacity */
        z-index: 10097;/* Specify a stack order in case you're using a different order for other elements */
        cursor: pointer; /* Add a pointer on hover */
    }


}

/* mobile version kein rgba */

@media (max-width: 540px) {
    
    .my-popup { 
         background: rgba(255,255,255,1);overflow-y: scroll;
    }
    .my-popup-content { overflow-y: scroll;}
   
    
}



@media (min-width:768px) {

.my-popup-content .frame { border: 0px solid red;}
.my-popup-content .frame { padding-top: 1rem; padding-bottom: 1rem;}
.my-popup-content .frame-container {padding-top: 0rem;padding-bottom: 0rem;border: 0px solid red;padding-left: 0px;padding-right: 0px;}

}




/* Farbe der Links in Dialogbox */

.my-popup-content .frame a {
    
    color: black;
    font-weight: bold;
    
}

.my-popup  { 
    
    max-height: calc(100vh);
    overflow-y: scroll;
}

.my-popup::-webkit-scrollbar {
  display: none;
}

.my-popup-content:-webkit-scrollbar {
  display: none;
}

.my-popup {
  -ms-overflow-style: none;
}

.my-popup-content { 
    
    height: 100%;

}