@import "../variables.scss";

ema-app-dev {

  .flip-board {
    .item {
      width: 240px;
      justify-self: center;
      margin: 0 auto;

      .ema-card-header-title {
        font-weight: bold;
      }
      .ema-flip__front {
        ema-card {
          text-align: center;
        }
      }
      .ema-flip__back {
        ema-card {
          text-align: center;
          background: #e9e9e9;
        }
      }
    }
  }

  .ema-splitter-container {
    position: absolute;
    padding-top: 0;
    padding-bottom: $header-height*2;
    left: 0;
    height: 100%;
    width: 100%;
    //top: $header-height;
    //bottom: -$header-height;

    ema-splitter {
      div[slot] {
        height: 100%;
        width: 100%;
        display: flex;
        overflow: hidden;
        flex-direction: column;
        justify-content: center; /* align horizontal */
        align-items: center; /* align vertical */
        //text-align: center;
        ion-icon {
          display: block;
          font-size: 3rem;
          color: $ema-primary;
        }
      }
      .main{
        .column-2{
          background: $gray-300;
          border-radius: 50%;
        }
      }

      //.dark-green {
      //  background-color: #009688;
      //}
      //.red {
      //  background-color: #f44336;
      //}
      //.green {
      //  background-color: #4CAF50;
      //}
      //.teal {
      //  background-color: #00BCD4;
      //}
      //.orange {
      //  background-color: #FF9800;
      //}
      //.blue {
      //  background-color: #3F51B5;
      //}
      //.purple {
      //  background-color: #9C27B0;
      //}
      //.light-green {
      //  background-color: #CDDC39;
      //}
    }
  }



}
