html 
  {
     height: 100%;
     direction:rtl;
     font-family: 'El Messiri';
    }
    @font-face {
      font-family: 'El Messiri';
      font-style: normal;
      font-weight: 400;
      font-display: swap;
      src: url(el.woff2) format('woff2');
      unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
    }
    body {
       direction: rtl;
      font-family: "El Messiri";	
      line-height: 22px;
      color: #00144e;
      font-size:16px;
      background-color:#f3f8ff;
      }

  /*--------------------------------------------------------------
  # Header 
  --------------------------------------------------------------*/
  .alert-info {
    background: #bacee9;
    transition: all 0.5s;
    z-index: 997;
    padding: 8px 0;
    box-shadow: 0px 2px 15px #c7d0db;
   }
   .img-responsive {  height: auto;  }
   @media (max-width: 992px) {
    .alert-info  { padding: 14px 0; font-size:12px;}
    .img-responsive { width: 50%;}
    .alert-info ,.sub-tittle-info ,.alert-info h3,h5,em,h4,h6 {font-size:11px;}
  }
  /*--------------------------------------------------------------*/

.btn-done 
{
  background-color: #95c2eb;
  color:#033d80;
  border-radius: 10px;
  display:inline-block;
  cursor:pointer;
  font-size:19px;
  text-decoration:none;
  padding: 7px 14px;
  border: none;
  box-shadow: 2px 2px 2px #b1b1b1,-3px -3px 3px #fff;
  border: 1px solid rgb(249, 250, 249); 
 }

.btn-done:hover 
              { box-shadow: 3px 3px 3px #f1e6f0,-3px -3px 3px #b0cacc; color:#f5f58d}
/*---------------------------------# Sections General--------------------------------------*/