.toplayer {

    background-image: url('image/cvas_bg.png');
    display:none;
    z-index: 1000;

    width:100%;
    height:100%;
    left:0;
    top:0;
    position: fixed;
}



.toplayer.active {

    display: flex;
    flex-direction: column;
    align-items:stretch;
}

.toplayer .container {
    display: flex;
    flex-direction: column;
    align-items:stretch;
    height:fit-content;
    width: fit-content;
    margin:auto;
    min-width: 400px;
}

.toplayer.popup .container{

    min-width: unset;
    width: auto;
    height: auto;
}

.toplayer .container>.head, .toplayer .content, .toplayer .foot {

    margin: auto;
    width: 100%;
    position: relative;
}

.toplayer .container>.head {

    background-color: #b3e5fc;
    min-height: 45px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.toplayer .container>.head .btn-close{
    
    position: absolute;
    right:0px;
    top:0px;
    font-size: 1.5em;
    padding-top:2px;
    padding-right:5px;
    cursor: pointer;
}

.toplayer .container>.head .btn-close:hover {

    font-weight: bold;
}

.toplayer .container>.head .title {

    padding:5px ;
    font-size: 1.2em;
}

.toplayer .container .content {
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #f5f5f5;
    display: flex;
    flex: 1 ;
    flex-shrink: inherit; 
    justify-content: center;
}



.toplayer .container .content > div {

    max-width: 90%;
    background-color: transparent;
}

.toplayer .container .foot {

    display: flex;
    min-width: 55px;
    background-color: #e0f7fa;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;

    justify-content: center;
}

.toplayer .container .foot > div {
    min-width: 75px;
    border-radius: 5px;
    padding:5px;
    cursor: pointer;
    background-color: #29b6f6;
    margin-left: 5px;
    margin-top:5px;
    margin-bottom:5px;
    text-align: center;
    color:white;
}

.toplayer .container .foot > div:hover{

    background-color: #0086c3;
}

.toplayer.popup .container .content {

    padding:10px;
    background-color: #eceff1;
    border-radius: 5px;
}

.toplayer.popup .container .content > div {
    max-width: unset;
}