@charset "UTF-8";
@font-face {
  font-family: kanit;
  src: url(../fonts/kanit/kanit-regular.ttf);
  font-weight: normal; }

  @font-face {
    font-family: kanit;
    src: url(../fonts/kanit/kanit-bold.ttf);
    font-weight: bold; }

    @font-face {
      font-family: arimo;
      src: url(../fonts/arimo/arimo-regular.ttf);
      font-weight: normal; }

      @font-face {
        font-family: arimo;
        src: url(../fonts/arimo/arimo-bold.ttf);
        font-weight: bold; }

        ul.tabs {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          margin: 0;
          padding: 0;
          float: left;
          list-style: none;
          border-bottom: 1px solid #ddd;
          width: 100%; }

          ul.tabs li {
            float: left;
            margin: 0;
            cursor: pointer;
            padding: 10px 3.95%;
            background-color: #fff;
            color: #333;
            overflow: hidden;
            position: relative;
            background-color: #ddd;
            border: 0;
            border-bottom: 3px solid; }

            .tab_last {
              border-right: 1px solid #ddd; }

              ul.tabs li:hover {
                color: #fff; }

                ul.tabs li.active {
                  background-color: #fff;
                  color: #333;
                  display: block;
                  color: #fff; }

                  .tab_container {
                    border: 1px solid #ddd;
                    border-top: none;
                    clear: both;
                    float: left;
                    width: 100%;
                    background: #fff;
                    overflow: auto;
                    min-height: 300px; }

                    .tab_content {
                      padding: 20px;
                      display: none;
                      max-height: 300px;
                      overflow: hidden; }

                      .tab_content .media {
                        border-bottom: 1px solid #ddd;
                        padding: 2.5px 5px;
                        cursor: pointer; }
                        .tab_content .media .media-body h4.media-heading {
                          font-weight: bold; }

                          .tab_content h2 {
                            margin-top: 0; }

                            .tab_drawer_heading {
                              display: none; }

                              @media screen and (max-width: 767px) {
                                .tabs {
                                  display: none !important; }
                                  .tab_drawer_heading {
                                    background-color: #fff;
                                    border-top: 1px solid #ddd;
                                    color: #333;
                                    font-weight: bold;
                                    margin: 0;
                                    padding: 10px 20px;
                                    display: block;
                                    font-size: 18px;
                                    cursor: pointer;
                                    -webkit-touch-callout: none;
                                    -webkit-user-select: none;
                                    -khtml-user-select: none;
                                    -moz-user-select: none;
                                    -ms-user-select: none;
                                    user-select: none; }
                                    .d_active {
                                      color: #fff; } }

                                      body {
                                        background-color: #f2f4ff; }

                                        .bgw {
                                          background-color: #fff;
                                          margin: 10px auto; }

                                          .pannel {
                                            padding-bottom: 20px;
                                            -webkit-filter: drop-shadow(0 20px 10px rgba(0, 0, 0, 0.1));
                                            filter: drop-shadow(0 20px 10px rgba(0, 0, 0, 0.1)); }

                                            .form-group {
                                              margin: 15px 0 0 0; }
                                              .form-group input[type="text"], .form-group input[type="email"], .form-group textarea {
                                                background-color: #fafafa;
                                                border: 1px solid #f1f1f1; }
                                                .form-group .checked:invalid {
                                                  background: #ffe8e8;
                                                  border-bottom: 1px solid #ff0303; }
                                                  .form-group .checked:valid {
                                                    background: #e3ffc2;
                                                    border-bottom: 1px solid #14e500; }
                                                    .form-group input ~ input[type="text"] {
                                                      margin-top: 10px; }
                                                      .form-group label {
                                                        font-weight: 200;
                                                        margin-right: 20px; }
                                                        .form-group label.question {
                                                          margin-bottom: 10px;
                                                          font-weight: bold;
                                                          text-transform: capitalize; }
                                                          .form-group .form-control {
                                                            border: 1px solid #ddd;
                                                            outline: none;
                                                            border-radius: 0;
                                                            -webkit-box-shadow: 0 0 0;
                                                            box-shadow: 0 0 0; }

                                                            input[type="radio"], input[type="checkbox"] {
                                                              margin: 0 15px 5px 0; }
                                                              input[type="radio"]:before, input[type="checkbox"]:before {
                                                                content: "✓";
                                                                color: #fafafa;
                                                                border: 1px solid #999;
                                                                background: #fafafa;
                                                                height: 20px;
                                                                width: 20px;
                                                                display: block;
                                                                position: relative;
                                                                top: -5px;
                                                                line-height: 18px;
                                                                text-align: center;
                                                                -webkit-transition: color 0.2s ease;
                                                                -o-transition: color 0.2s ease;
                                                                transition: color 0.2s ease; }
                                                                input[type="radio"]:checked:before, input[type="checkbox"]:checked:before {
                                                                  color: #000; }

                                                                  .formSubTitle {
                                                                    font-size: 25px;
                                                                    font-weight: 800;
                                                                    margin: 20px 0;
                                                                    text-align: center;
                                                                    text-transform: capitalize; }
                                                                    .formSubTitle:after {
                                                                      content: "";
                                                                      display: block;
                                                                      background: #3953dc;
                                                                      height: 2px;
                                                                      margin: 10px auto 0;
                                                                      width: 100px; }

                                                                      .panelbar {
                                                                        padding: 10px;
                                                                        margin-bottom: 0;
                                                                        border-bottom: 1px solid #ddd; }
                                                                        .panelbar span {
                                                                          margin: 0 10px;
                                                                          border-radius: 50%;
                                                                          width: 20px;
                                                                          height: 20px;
                                                                          display: inline-block;
                                                                          background-color: #3953dc;
                                                                          -webkit-box-shadow: inset 0 0 34px #b2b2b2;
                                                                          -moz-box-shadow: inset 0 0 34px #b2b2b2;
                                                                          box-shadow: inset 0 0 4px #b2b2b2;
                                                                          color: #fff; }

                                                                          .mt0 {
                                                                            margin-top: 0; }

                                                                            .mt1 {
                                                                              margin-top: 10px; }

                                                                              .notdone {
                                                                                background-color: #eee !important;
                                                                                color: #333 !important; }
                                                                                .notdone ~ span {
                                                                                  background-color: #eee;
                                                                                  color: #333; }

                                                                                  .mt3 {
                                                                                    margin-top: 30px; }

                                                                                    .btn {
                                                                                      border-radius: 0;
                                                                                      -webkit-transition: -webkit-box-shadow .2s ease;
                                                                                      transition: -webkit-box-shadow .2s ease;
                                                                                      -o-transition: box-shadow .2s ease;
                                                                                      transition: box-shadow .2s ease;
                                                                                      transition: box-shadow .2s ease, -webkit-box-shadow .2s ease;
                                                                                      width: 100px;
                                                                                      text-transform: capitalize;
                                                                                      margin: 0 10px;
                                                                                      font-weight: bold;
                                                                                      border: 0; }
                                                                                      .btn:hover {
                                                                                        -webkit-box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.2);
                                                                                        box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.2); }

                                                                                        .btn-default {
                                                                                          background-color: #3953dc !important;
                                                                                          color: #fff !important; }

                                                                                          .table {
                                                                                            background-color: #f4f4f4;
                                                                                            border: 1px solid #eee; }
                                                                                            .table tbody {
                                                                                              background-color: #fafafa; }

                                                                                              .completepannel {
                                                                                                height: 300px;
                                                                                                font-size: 50px;
                                                                                                display: -webkit-box;
                                                                                                display: -ms-flexbox;
                                                                                                display: flex; }
                                                                                                .completepannel > div {
                                                                                                  margin: auto; }

                                                                                                  .survey{

                                                                                                    margin-top: 20px;
                                                                                                    text-align: center;
                                                                                                    font-weight: bold;
                                                                                                    font-size: 20px;


                                                                                                  }
                                                                                                  .survey a{
                                                                                                    color: #fff;
                                                                                                    padding: 10px 40px;
                                                                                                    display: inline-block;
                                                                                                    background: #17296d;
                                                                                                    text-decoration: none;
                                                                                                    transition:box-shadow .2s ease;
                                                                                                  }

                                                                                                  .survey a:hover{
                                                                                                    box-shadow: 0 20px 40px -20px rgba(0,0,0,0.5);
                                                                                                  }
                                                                                                  .info{
                                                                                                    /*width: 100; */
                                                                                                    border: 1px solid #ddd;
                                                                                                    word-wrap: break-word;
                                                                                                    font-size: 15px;
                                                                                                    margin: 5px;
                                                                                                    background: #FFF;
                                                                                                    padding-bottom: 15px;
                                                                                                  }
                                                                                                  .heading{
                                                                                                    text-align: center;
                                                                                                    font-weight: bold;
                                                                                                  }
                                                                                                  .subheading{
                                                                                                    text-align: center;
                                                                                                    font-weight: bold;
                                                                                                  }
                                                                                                  .innerheading{
                                                                                                    font-weight: bold;
                                                                                                    font-size: 15px;
                                                                                                    text-align: center;
                                                                                                  }
                                                                                                  .main-body{
                                                                                                    float: left;
                                                                                                    font-weight: bold;
                                                                                                    margin-top: 15px;
                                                                                                    margin-bottom: 15px;
                                                                                                  }
                                                                                                  .body-heading{
                                                                                                    font-weight: bold;
                                                                                                    font-size: 15px;
                                                                                                  }
                                                                                                  .final{
                                                                                                    text-align: center;
                                                                                                    margin-top: 15px;
                                                                                                    font-size: 30px;
                                                                                                    color: #17296d;

                                                                                                  }

                                                                                                  .shakeClass {
                                                                                                    -webkit-animation: shake .2s;
                                                                                                    animation: shake .2s; }

                                                                                                    @-webkit-keyframes shake {
                                                                                                      0% {
                                                                                                        -webkit-transform: translateX(-3px);
                                                                                                        transform: translateX(-3px); }
                                                                                                        10% {
                                                                                                          -webkit-transform: translateX(3px);
                                                                                                          transform: translateX(3px); }
                                                                                                          30% {
                                                                                                            -webkit-transform: translateX(-5px);
                                                                                                            transform: translateX(-5px); }
                                                                                                            40% {
                                                                                                              -webkit-transform: translateX(5px);
                                                                                                              transform: translateX(5px); }
                                                                                                              60% {
                                                                                                                -webkit-transform: translateX(-8px);
                                                                                                                transform: translateX(-8px); }
                                                                                                                70% {
                                                                                                                  -webkit-transform: translateX(8px);
                                                                                                                  transform: translateX(8px); }
                                                                                                                  80% {
                                                                                                                    -webkit-transform: translateX(-11px);
                                                                                                                    transform: translateX(-11px); }
                                                                                                                    90% {
                                                                                                                      -webkit-transform: translateX(11px);
                                                                                                                      transform: translateX(11px); }
                                                                                                                      100% {
                                                                                                                        -webkit-transform: translateX(-16px);
                                                                                                                        transform: translateX(-16px); }
  /*	90%{
		transform:translateX(16px);
	}
	100%{
		transform:translateX(-20px);*/
    /*}*/
  /*	55%{
		transform:translateX(20px);
	}
	60%{
		transform:translateX(-25px);
   }*/
  /*65%{
		transform:translateX(25px);
	}
	70%{
		transform:translateX(-35px);
	}
	75%{
		transform:translateX(35px);
	}
/*	80%{
		transform:translateX(-25px);
   }*/
  /*	85%{
		transform:translateX(25px);
	}
	90%{
		transform:translateX(-15px);
	}
	95%{
		transform:translateX(10px);
   }*/
  /*	100%{
		transform:translateX(0px);
	}*/ }

  @keyframes shake {
    0% {
      -webkit-transform: translateX(-3px);
      transform: translateX(-3px); }
      10% {
        -webkit-transform: translateX(3px);
        transform: translateX(3px); }
        30% {
          -webkit-transform: translateX(-5px);
          transform: translateX(-5px); }
          40% {
            -webkit-transform: translateX(5px);
            transform: translateX(5px); }
            60% {
              -webkit-transform: translateX(-8px);
              transform: translateX(-8px); }
              70% {
                -webkit-transform: translateX(8px);
                transform: translateX(8px); }
                80% {
                  -webkit-transform: translateX(-11px);
                  transform: translateX(-11px); }
                  90% {
                    -webkit-transform: translateX(11px);
                    transform: translateX(11px); }
                    100% {
                      -webkit-transform: translateX(-16px);
                      transform: translateX(-16px); }
  /*	90%{
		transform:translateX(16px);
	}
	100%{
		transform:translateX(-20px);*/
    /*}*/
  /*	55%{
		transform:translateX(20px);
	}
	60%{
		transform:translateX(-25px);
   }*/
  /*65%{
		transform:translateX(25px);
	}
	70%{
		transform:translateX(-35px);
	}
	75%{
		transform:translateX(35px);
	}
/*	80%{
		transform:translateX(-25px);
   }*/
  /*	85%{
		transform:translateX(25px);
	}
	90%{
		transform:translateX(-15px);
	}
	95%{
		transform:translateX(10px);
   }*/
  /*	100%{
		transform:translateX(0px);
	}*/ }

  .checkboxInvalid:before {
    border-color: red !important;
    background: #ffc0c0;
    -webkit-box-shadow: 0 0 5px #ff2212;
    box-shadow: 0 0 5px #ff2212; }
