@charset "UTF-8";

html {
  position: relative;
}

.homepage-schoolbooks-widget {
  background-color: transparent;
}

.schoolbooks-info {
  display: none;
}

#addstudent-form, .inputs, #addstudent-form input[type=text], .k-dropdownlist {
  width: 100%;
  max-width: 300px;
}

  #addstudent-form input[type=text] {
    max-width: 290px;
    margin-bottom: 4px;
    font-size: 1.1em;
    font-weight: normal;
    min-height: 28px;
    max-height: 28px;
    text-align: center;
    font-size: 17px;
  }

.student-name-label {
  font-family: "Fredoka One",cursive;
  font-size: 1.1em;
  margin-bottom: 4px;
}

#SchoolCode {
  width: 200px;
}

.k-dropdownlist {
  background-color: #20b390;
  margin-bottom: 4px;
}

  .k-dropdownlist .k-input-value-text {
    color: white;
  }

.k-picker-solid:hover, .k-picker-solid.k-hover, .k-picker-solid:focus, .k-picker-solid.k-focus {
  background-color: #20b390de !important;
}

.k-button {
  background-color: #fbbc1e;
}

#addstudent-form {
  text-align: center;
  display: flex;
  flex-flow: column;
  align-items: center;
  margin-top: 20px;
}

.text-uppercase {
  text-transform: uppercase;
}

.webtail-public-wrapper.add-student-container .page-body {
  display: flex;
  flex-flow: column;
  align-items: center;
  margin-top: 20px;
}

@media screen and (min-width: 450px) {
  #OrderGrid img {
      max-width: 60px!important;
  }
}

@media screen and (min-width: 767px) {
  #OrderGrid img {
    max-width: 120px!important;
  }

  #selectBooklist > .k-dropdownlist {
    max-width: 25%;
    margin-right: 20px;
  }

  #selectBooklist {
    display: flex;
    flex-flow: row wrap;
    align-items: baseline;
  }
}

@media screen and (min-width: 1024px) {

  #selectBooklist > .k-dropdownlist {
    max-width: 230px;
  }

  .webtail-public-wrapper .page-body {
    display: flex;
    flex-flow: column;
    align-items: center;
    margin-top: 20px;
  }
}

@media screen and (min-width: 1150px) {

  #selectBooklist {
    justify-content: center;
  }
}