#msg
{
position:absolute;
display:flex;
align-items: center;/*vertical*/
justify-content: center;/*horisontal*/

height:100%;
width:100%;
background-color:rgba(0,0,0,0.0); 
top:0;
left:0;
z-index:4;

animation: anim22 400ms normal forwards ease-in;
-webkit-animation: anim22 400ms normal forwards ease-in;
-moz-animation: anim22 400ms normal forwards ease-in;
-o-animation: anim22 400ms normal forwards ease-in;
}

@keyframes anim22{from {background-color:rgba(0,0,0,0.0)} to {background-color:rgba(0,0,0,0.8)}}
@-webkit-keyframes anim22{from {background-color:rgba(0,0,0,0.0)} to {background-color:rgba(0,0,0,0.8)}}
@-moz-keyframes anim22{from {background-color:rgba(0,0,0,0.0)} to {background-color:rgba(0,0,0,0.8)}}
@-o-keyframes anim22{from {background-color:rgba(0,0,0,0.0)} to {background-color:rgba(0,0,0,0.8)}}


#msg_box{
display: flex;
align-items: center;
justify-content: center;
flex-direction:column;

width:80%;
height:40%;
background-color:rgba(243,235,183,1.0);

 -webkit-border-radius: 1.5vw;
-moz-border-radius: 1.5vw;
-o-border-radius: 1.5vw;
border-radius: 1.5vw;

animation: anim23 400ms normal forwards ease-in;
-webkit-animation: anim23 400ms normal forwards ease-in;
-moz-animation: anim23 400ms normal forwards ease-in;
-o-animation: anim23 400ms normal forwards ease-in;
}

@keyframes anim23{from {background-color:rgba(243,235,183,0.0)} to {background-color:rgba(243,235,183,1.0)}}
@-webkit-keyframes anim23{from {background-color:rgba(243,235,183,0.0)} to {background-color:rgba(243,235,183,1.0)}}
@-moz-keyframes anim23{from {background-color:rgba(243,235,183,0.0)} to {background-color:rgba(243,235,183,1.0)}}
@-o-keyframes anim23{from {background-color:rgba(243,235,183,0.0)} to {background-color:rgba(243,235,183,1.0)}}

#msg_link{
width:80%;
height:20%;
}
#msg_bt
{
display: flex;
align-items: center;
justify-content: center;
background-color: #3F91C8;
color: #FFF;

height: 100%;
width:100%;

border: none;
border-radius: 2vw;
}
#msg_text{
color: #111;
margin: 0px;
left: 10%;
width: 80%;
}