/*Student Reference*/
#ref-buttons {
  width: 100%;
}

#section-header {
  vertical-align: bottom;
  margin-bottom: 15px;
}

#section-header > h1 {
  margin: 0;
}

#menu-toggle-btn {
  background-color: #0a7ed3;
  color: #fff;
  width: 100%;
  margin-bottom: 15px;
}

#ref-menu {
  padding-top: 150px;
}

.side-nav {
  float: left;
  top: 150px;
  position: relative;
  display: block;
}

.belt {
  margin: 10px;
  width: 50%;
}

.btn-group-vertical > .btn:first-child:not(:last-child) {
  margin-left: 0px;
  margin-right: 0px;
}

.white-belt-badge {
  background: linear-gradient(80deg, #fff 70%, #fff 30%);
}

.white-belt-yellow-tag-badge {
  background: linear-gradient(80deg, #fff 70%, #ffff00 30%);
}

.yellow-belt-badge {
  background: linear-gradient(80deg, #ffff00 70%, #ffff00 30%);
}

.yellow-belt-green-tag-badge {
  background: linear-gradient(80deg, #ffff00 70%, #85e085 30%);
}

.green-belt-badge {
  background: linear-gradient(80deg, #85e085 70%, #85e085 30%);
}

.green-belt-blue-tag-badge {
  background: linear-gradient(80deg, #85e085 70%, #66a3ff 30%);
}

.blue-belt-badge {
  background: linear-gradient(80deg, #66a3ff 70%, #66a3ff 30%);
}

.blue-belt-red-tag-badge {
  background: linear-gradient(80deg, #66a3ff 70%, #ff6666 30%);
}

.red-belt-badge {
  background: linear-gradient(80deg, #ff6666 70%, #ff6666 30%);
}

.red-belt-black-tag-badge {
  background: linear-gradient(80deg, #ff6666 70%, #000000 30%);
}

.black-belt-badge {
  background: linear-gradient(80deg, #000000 50%, #000000 50%);
  color: white;
}

@media (max-width: 767px) {
  #ref-menu {
    padding-top: 0px;
  }
}

/*What is TKD Page*/

@media (max-width: 767px) {
  #what-is-tkd {
    padding: 0px 50px;
  }

  #tkd-patterns {
    padding: 0px 50px;
  }
}

/*Contact Page*/
.mugshot {
  width: 100px;
  height: 100px;
  object-fit: cover;
  overflow: hidden;
  float: left;
}

.instructor-card {
  width: 700px;
  height: 100px;
}

.instructor-description {
  margin-left: 110px;
  text-align: left;
}

.in-progress {
  text-align: center;
  vertical-align: middle;
  width: 100%;
  height: 90%;
}

#instructor-details {
  color: white;
  background-color: #2785c6;
  border-top: solid #0072bb thin;
  border-bottom: solid #0072bb thin;
  padding: 0px 100px 50px 100px;
  margin-bottom: 50px;
  padding-left: 30px;
}

#instructor-heading {
  margin-right: 30px;
}

#about-us-blurb {
  text-align: justify;
}

@media (max-width: 767px) {
  #instructor-details {
    padding: 0px 10px 50px 30px;
  }

  #contact-info {
    margin: 0px 30px 50px 30px;
  }

  .instructor-card {
    width: 100%;
    display: inline-block;
    height: auto;
  }
}

@media (min-width: 768px) {
  #instructor-cards {
    width: 50%;
    margin: auto;
  }

  #instructor-details {
    padding: 0px 10px 50px 30px;
  }

  .logo-right {
    margin: 0px 100px 50px 300px;
  }
}

@media (min-width: 992px) {
  .logo-right {
    margin: 0px 100px 50px 300px;
  }

  #instructor-cards {
    width: 100%;
    margin: 0px;
  }
}

@media (min-width: 1200px) {
  #instructor-details {
    padding: 0px 100px 50px 100px;
  }

  .logo-right {
    margin: 0px 100px 50px 300px;
  }
}

@media (min-width: 1420px) {
  .logo-right {
    margin: 0px 100px 50px 400px;
  }
}

#wrapper {
  max-width: 1600px;
  margin: auto;
}

/*index*/
#index-factoids {
  /*background-color: #2785c6;*/
  /*border-top: solid #0072bb thin;*/
  /*border-bottom: solid #0072bb thin;*/
}

#index-wrapper {
  text-align: center;
}

#index-factoids {
  margin: 30px 10px;
  /*border-radius:25px;*/
}

.alternate {
  color: white;
  background-color: #2785c6;
  border-top: solid #0072bb thin;
  border-bottom: solid #0072bb thin;
}

.clear {
  clear: both;
  display: block;
}

/*base*/
p,
div {
  font-family: "Droid Sans", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 25px;
}

/*body{*/
/*background-image: url("../base_images/tkd_tree.png");*/
/*}*/
.navbar {
  background-color: #0072bb;
  border-bottom: solid #192289 thin;
  color: #fff;
}

#student-dropdown {
  list-style: none;
  text-align: left;
}

#student-dropdown > li > a {
  color: #1f2121;
}

#student-dropdown {
  padding-left: 15px;
}

.navbar .navbar-nav {
  left: 0px;
  position: relative;
}

.navbar .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:focus {
  background-color: #0a7ed3;
  color: #fff;
}

.navbar .navbar-nav > li > a,
.navbar .navbar-nav > li > a {
  color: #d1d5d6;
}

.centeredContent {
  /*width: 70%;*/
  text-align: center;
  margin: 0 auto;
}

/*footer.footer {*/
/*height: 100px;*/
/*clear: both;*/
/*position:relative;*/
/*}*/

.news-post {
  text-align: left;
}

.navbar-brand {
  margin-top: 10px;
}

.stretch {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
}

/*Classes Page*/

.secondary-wrapper {
  width: 1000px;
  margin: auto;
}

.tkd-class-name {
  vertical-align: middle;
  height: 100px;
}

#classes-interested {
}

#classes-info {
  display: block;
  margin: 0px 100px 50px 400px;
}

#classes-blurb {
  padding-bottom: 20px;
  border-radius: 25px 0 0 25px;
  text-align: center;
  padding-left: 30px;
  margin-right: 0;
  padding-top: 35px;
  padding-right: 30px;
  min-height: 130px;
  background: #0072bb; /* For browsers that do not support gradients */
  background: -webkit-radial-gradient(#0072bb, #244ad3); /* Safari 5.1 to 6.0 */
  background: -o-radial-gradient(#0072bb, #1539d3); /* For Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(
    #0072bb,
    #1539d3
  ); /* For Firefox 3.6 to 15 */
  background: radial-gradient(#5a92bb, #0072bb); /* Standard syntax */
}

.kids-panel-heading {
  background-color: #bbb;
}

.class-panel {
  height: 300px;
}

.class-panel-body {
  height: 200px;
}

.circle {
  padding-top: 30px;
  width: 300px;
  height: 300px;
  border-radius: 300px;
}

.classes-map {
  width: auto;
  height: 300px;
  margin: 20px 15px 20px 15px;
}

.overlay {
  background: transparent;
  position: relative;
  width: auto;
  height: 300px; /* your iframe height */
  top: 300px; /* your iframe height */
  margin-top: -300px; /* your iframe height */
}

.inset {
  border-top: 1px rgba(0, 0, 0, 0.2) inset;
  border-bottom: 2px rgba(255, 255, 255, 0.8) inset;
}

.class-blurb-box {
  height: auto;
  margin-right: 0;
  margin-bottom: 20px;
}

.classes-wrapper {
  width: auto;
  margin: 0px 30px 0px 30px;
}

#class2 {
  margin-top: 3px;
  left: 0px;
}

#footer-logos {
  text-align: center;
  padding: 30px 0px;
}

@media (max-width: 767px) {
  .logo-container {
    text-align: left;
    width: 230px;
    height: auto;
    display: inline-block;
  }

  .navbar-brand {
    width: 230px;
    height: 38px;
    background-image: url("../base_images/logo_compact.png");
  }

  .footer > div > div > img {
    width: 50px;
  }

  #index_factiods {
    visibility: visible;
  }

  .classes-wrapper {
    margin: 0 0 0 0;
  }

  #classes-blurb {
    border-radius: 0;
  }

  #student-dropdown {
    text-align: center;
  }

  #student-dropdown {
    padding-left: 0px;
  }
}

@media (min-width: 768px) {
  .logo-container {
    text-align: left;
    width: 179px;
    height: 1px;
    display: inline-block;
  }

  #no-script-nav {
    left: 170px;
  }

  #no-js-alert {
    clear: both;
  }

  #no-script-nav > li {
    white-space: nowrap;
    display: inline-block;
  }

  .navbar-brand {
    /*position: absolute;*/
    width: 179px;
    height: 195px;
    top: 5px;
    background-image: url("../base_images/logo.png");
  }

  .navbar .navbar-nav {
    left: 0px;
  }

  #index_factiods {
    visibility: visible;
  }
}

@media (min-width: 992px) {
  .navbar .navbar-nav {
    left: 0px;
  }

  #no-script-nav {
    left: 0px;
  }

  .logo-container {
    text-align: left;
    width: 179px;
    height: 1px;
    display: inline-block;
  }

  .navbar-brand {
    /*position: absolute;*/
    width: 179px;
    height: 195px;
    top: 5px;
    background-image: url("../base_images/logo.png");
  }

  /*#index_factiods {*/
  /*visibility: hidden;*/
  /*}*/
}

@media (min-width: 1200px) {
}
