* {
    margin : 0;
    padding : 0;
    box-sizing: border-box;
}

.inckormodal {
    z-index : 1052;
    position : fixed;
    display : flex;
    align-items : center;
    justify-content : center;
    top : 0;
    left : 0;
    width : 100%;
    height : 100%;
    background : rgb(0,0,0,0.8) ;
    animation: fadeIn .3s both
}

.inckormodal-wrapper{
    background : #FFF;
    margin : 4rem auto;
    width : 788px;
    max-width : calc(100vw - 20px);
    max-height : calc(100vh - 20px);
    background-color : #FFF;
    animation: slideFromTop .5s both
}

.inckormodal[aria-hidden="true"]{
    animation: fadeOut .3s both
}

.inckormodal[aria-hidden="true"] .inckormodal-wrapper{
    animation: slideToBottom .5s both
}

@keyframes fadeIn{
    from { opacity : 0;}
    to {opcacity : 1;}
}

@keyframes fadeOut{
    from { opacity : 1;}
    to {opcacity : 0;}
}

@keyframes slideFromTop{
    from { transform : translateY(-50px);}
    to {transform : translateY(0px);}
}

@keyframes slideToBottom{
    from { transform : translateY(0px);}
    to {transform : translateY(50px);}
}


.inckormodal-header{
    background : #0F0F0F;
    height : 53px;
    padding : 17px 17px 17px 27px;
    display : flex;
    align-items : center;
    justify-content : space-between;
}

.inckormodal-header ._title{
    font-size: 16px;
    line-height: 19px;
}

.inckormodal-header .close-modal-btn{
    width : 30px;
    height : 50px;
    background :url('/src/static/img/closemodal.png') center center no-repeat;
    background-size : 30px 30px;
    margin : 0;
    font-size : 3rem;
    transition : transform 0.2s;
    cursor : pointer;
    padding : 0;
    margin : 0
}

.inckormodal-header .close-modal-btn:hover{
    transform : scale(1.2)
}


.inckormodal-content {
    background : #262626;
    display : flex;
}

.inckormodal-content h3{
    position: static;
    width: 134px;
    height: 21px;

    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 20px;
}
.inckormodal-content p {
    font-size : 1rem;
    background : #eee;
    color : #333;
    padding : 1rem;
    margin : 1rem 0 2rem 0;
}

.inckormodal-footer {
    border : "none";
    background : #3E3E3E;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.inckormodal-footer button {
    display : block;
    font-size : 1rem;
    margin : 1rem 1rem 1rem 0rem;
    width : 124px;


}


/* width */
.inckormodal ::-webkit-scrollbar {
    width: 10px;
}

/* Track */
.inckormodal ::-webkit-scrollbar-track {
    background: #2F2F2F;
    border-radius: 10px;
}
  
/* Handle */
.inckormodal ::-webkit-scrollbar-thumb {
    background: #141414;
    border-radius: 10px;
    border-color :rgba(255, 255, 255, .5);
    border-width : thin ;
    border-style : solid;
}
  
/* Handle on hover */
/*.inckormodal ::-webkit-scrollbar-thumb:hover {
    background: #4A4A4A;
}*/