.fancy-border {
    border: 25px solid #007bff;
    border-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='75' height='75'%3E%3Cg fill='none' stroke='%23007bff' stroke-width='2'%3E%3Cpath d='M1 1h73v73H1z'/%3E%3Cpath d='M8 8h59v59H8z'/%3E%3Cpath d='M8 8h16v16H8zM51 8h16v16H51zM51 51h16v16H51zM8 51h16v16H8z'/%3E%3C/g%3E%3Cg fill='%23007bff'%3E%3Ccircle cx='16' cy='16' r='2'/%3E%3Ccircle cx='59' cy='16' r='2'/%3E%3Ccircle cx='59' cy='59' r='2'/%3E%3Ccircle cx='16' cy='59' r='2'/%3E%3C/g%3E%3C/svg%3E") 25;
  }
  .navbar-dark .navbar-nav .nav-link {
    color: #fff;
}
 .coinbox{
     width:100%;
 } 
  
 .head,.tail{
     width:150px;
     margin:auto;
 }

 .head{
     margin-top: -150px;
 }


 #restart-me{
   margin-top: 50px;
 }



  
  #flip-game{
    width: 150px;
    height: 150px;
    left: 0;
    right: 0;
    margin: auto;
    margin-top: 0px;
    transform-style: preserve-3d;
    
  }
  #flip-game img{
    width: 150px;
  }
  
  .coin-heads, .coin-tails {
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
  }
  
  .flip .coin-heads{
    animation: flip-head 0.5s linear 0s infinite alternate;
  }
  .flip .coin-tails{
    animation: flip-tail 0.5s linear 0s infinite alternate;
  }
  .flip2 .coin-heads{
    animation: flip-head2 0.5s linear 0s infinite alternate;
  }
  .flip2 .coin-tails{
    animation: flip-tail2 0.5s linear 0s infinite alternate;
  }
  
 
  @keyframes flip-head {
    0%, 100% { transform: rotateX(0deg); }
    50% { transform: rotateX(180deg); }
  }
  
  @keyframes flip-tail {
    0%, 100% { transform: rotateX(180deg); }
    50% { transform: rotateX(0deg); }
  }

  
 
  @keyframes flip-head2 {
    0%, 100% { transform: rotateY(0deg); }
    50% { transform: rotateY(180deg); }
  }
  
  @keyframes flip-tail2 {
    0%, 100% { transform: rotateY(180deg); }
    50% { transform: rotateY(0deg); }
  }
  #flip-game-result{
    
  }

  .border-special{
    border:2px solid  #007bff;
    margin-left: -16px;
    margin-bottom: 5px;
    margin-top: 5px;
   
    padding:0;
    font-family: cursive;
  }
  .border-special p{
    padding-left:15px;
  }
  .paddingmy{
    padding-left: 15px;
    padding-right: 3px;
  }
  #restart-me{
    display: none;
  }
 

  @media(max-width:767px){
    .border-special{
      margin-left:0px;
     
    }
   
    #restart-me{
      margin-top: 5px;
      margin-bottom: 5px;
    }
   
   
  }
  .row-result{
    margin:0;
    padding:0;
    margin-bottom: 2px;
  }
  .lightd{
font-size:20px;
  }
  .darktd{
font-size:15px;
line-height: 20px;
  }
  .tcoins{
    margin:auto;
    background-color: #007bff;
    color:#fff;
    padding:5px;
    margin-bottom: 5px;
  }
  .tcoins input{
    width:80px;
    text-align: center;
  }

  .res-coin{
    width:55px;
    float:left;
    margin:2px;
    border:1px solid #007bff;
    text-align:center;

  }
   .res-coin img{
   width:47px;   
   margin:auto;
  }
  .coin-text{
    color:#fff;
    text-align: center;
    width: 100%;
    background-color: #007bff;
  }
 
  .restart{
    font-size: 20px;

    vertical-align: middle;
  }
  i{
    vertical-align: middle;
  }
  #flip-game-but{
    width:100%;
    text-align: center;
  }
  #msgshow{
    display: none;
  }