body,
  html {
    height: 100%;
    margin: 0;
    padding: 0;
    background: rgb(26, 188, 156);
    background: -moz-linear-gradient(-45deg, rgba(26, 188, 156, 1) 0%, rgba(142, 68, 173, 1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(26, 188, 156, 1) 0%, rgba(142, 68, 173, 1) 100%);
    background: linear-gradient(135deg, rgba(26, 188, 156, 1) 0%, rgba(142, 68, 173, 1) 100%);
    font-family: 'Noto Kufi Arabic','Kanit', Times, serif;
  }

  h1, h2,h3,h4 {
    font-size: 24px;
    color: #eeeeee;
    top: 50%;
    position: fixed;
    text-align: center;
    box-sizing: border-box;
    box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
    border: 2px white solid;
    border-radius: 500px;

    padding: 10px;
    background-color: cornflowerblue;
  }

  .radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline {
    margin-left: 0px !important;
  }

  label { display: inline-block }
  label > input { /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
  }
  label > input + img { /* IMAGE STYLES */
    cursor:pointer;
    border:2px solid transparent;
    border-radius: 500px;

  }
  label > input:checked + img { /* (RADIO CHECKED) IMAGE STYLES */
    border:3px solid #f00;
    border-radius: 500px;

  }


  label > input + i { /* IMAGE STYLES */
    cursor:pointer;
    border:2px solid transparent;
    border-radius: 0;

  }
  label > input:checked + i { /* (RADIO CHECKED) IMAGE STYLES */
    border:3px solid #f00;
    border-radius: 0;

  }

  .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    padding: 12px 20px;
    vertical-align: top;
    border-top: 0px solid #ddd !important;
}

.page-container .panel{
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%);
      width:90%;
      font-size:28px;

    }

  .img-rounded{
    width:75px;
  }

  


  



/*
 3D pyrmids
*/

    @font-face {
      font-family: "Noto Kufi Arabic";
      src: url(../../assets/custom_font/NotoKufiArabic-Bold.ttf) format("truetype");
    }

    @font-face {
      font-family: "Kanit";
        src: url(../../assets/custom_font/Kanit-Regular.ttf) format("truetype");
    }

    p {
        font-size: xx-large;
        text-align: center;
    }

    .particalcontainer{
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .particle{
      display: inline-flex;
      position: absolute;
      height: 44px;
      width: 44px;
      left: 0;
      right: 0;
      top: 100%;
      border: 2px white solid;
      margin: auto;
      background-image: url('../../assets/images/rate.png');
      background-size: 30rem;
      background-repeat: no-repeat;
      border-radius: 500px;
      background-color: white;

      box-sizing: border-box;
      box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
    }
    .particle.like{
      background-position: 0px 0px;
     }

     .particle.love{
      background-position: -52px 0px;
     }

     .particle.anger{
      background-position: -259px 0px;
     }

     .particle.sad{
      background-position: -207px 0px;
     }

     .particle.happy{
      background-position: -103px 0px;
     }

     .particle.wow{
      background-position: -155px 0px;
     }

    #footer{
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 50px;
        font-size: 16px;
    }

    .cntr {
      
      left: 10%;
    }  

    .lang-sel{
      cursor: pointer;
    } 

    .hide {
      display: none;
    }


    @keyframes shadow-pulse
    {
      0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
      }
      100% {
        box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
      }
    }

    @keyframes shadow-pulse-big
    {
      0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1);
      }
      100% {
        box-shadow: 0 0 0 70px rgba(0, 0, 0, 0);
      }
    }

    .pulses_like, .pulses_love, .pulses_bad, .pulses_wow, .pulses_anger
    {
      
      animation: shadow-pulse 1s infinite;
    }


    .container1 {
     /* position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;*/
      display: flex;
      justify-content: center;
      align-items: center;
      margin-left: 10%;
    }


    .fbRating {
      display: flex;
      background-color: #ffffff;
      border-radius: 31.25rem;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    }
    .fbRating input[type="radio"] {
      display: none;
    }
    .fbRating input[type="radio"] + label {
      display: inline-flex ;
      height: 55px ;
      width: 55px ;
      border: 1px solid ;
      box-sizing: unset !important;
      background-image: url(../../assets/images/rate_action.png) ;
      background-repeat: no-repeat ;
      background-size: 400px ;
      border-radius: 31.25rem ;
      margin: 10px 25px ;
      filter: grayscale(100%) ;
      transition: all ease 0.25s ;
      border: 0.25rem solid #ffffff ;
    }


    .fbRating input[type="radio"] + label:hover {
      cursor: pointer;
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    }
    .fbRating input:nth-of-type(1) + label {
      background-position: -346px 0;
    }
    .fbRating input:nth-of-type(1):checked + label {
      filter: grayscale(0);
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
      animation: shadow-pulse 1s infinite;

    }
    .fbRating input:nth-of-type(2) + label {
      background-position: -346px 0;
    }
    .fbRating input:nth-of-type(2):checked + label {
      filter: grayscale(0);
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
      animation: shadow-pulse 1s infinite;

    }
    .fbRating input:nth-of-type(3) + label {
      background-position: -276px  0;
    }
    .fbRating input:nth-of-type(3):checked + label {
      filter: grayscale(0);
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
      animation: shadow-pulse 1s infinite;

    }
    .fbRating input:nth-of-type(4) + label {
      background-position: 1px 0;
    }
    .fbRating input:nth-of-type(4):checked + label {
      filter: grayscale(0);
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
      animation: shadow-pulse 1s infinite;

    }
    .fbRating input:nth-of-type(5) + label {
      background-position: -138px 0;
    }
    .fbRating input:nth-of-type(5):checked + label {
      filter: grayscale(0);
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
      animation: shadow-pulse 1s infinite;

    }
    .fbRating input:nth-of-type(6) + label {
      background-position: -69px 0;
    }
    .fbRating input:nth-of-type(6):checked + label {
      filter: grayscale(0);
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    }

    .table > thead > tr > th {
      border-bottom: 0px solid #bbb !important;
    }