.ddsmoothmenu {
  width: 100%;
  display: none;
}
.ddsmoothmenu ul {
  z-index: 100;
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.ddsmoothmenu ul li ul {
  position: absolute;
  left: -3000px;
  display: none;
  visibility: hidden;
  width: 100%;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  min-width: 150px;
  max-height: 100%;
}

.ddsmoothmenu ul li ul li ul {
  top: 0;
  margin: 0 0 0 0px;
}
.ddsmoothmenu ul li {
  position: relative;
  display: inline;
  float: left;
  width: 12.5%;
  margin-bottom: 1px;
}
.ddsmoothmenu ul li + li {
  background: url(../images/web/menu_c.png) no-repeat center left;
}
.ddsmoothmenu ul li ul li {
  display: list-item;
  float: none;
  width: 100%;
  margin-bottom: 0px;
}

/*Top level menu link items style*/
.ddsmoothmenu ul li a {
  display: block;
 margin: 56px 0 0;
  padding: 5px 0 5px;
  text-align: center;
  font-size: 19px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  opacity: 1;
}
.ddsmoothmenu ul li a:hover {
  text-decoration: none;
}
.ddsmoothmenu ul li a:link,
.ddsmoothmenu ul li a:visited {
}
.ddsmoothmenu ul li a.selected {
}

.ddsmoothmenu ul li ul li a {
  width: auto;
  padding: 5px 15px;
  margin: 0;
  border-top: 0px solid #ddd;
  background: #fff;
  font-size: 15px;
  display: block;
}
.ddsmoothmenu ul li ul li + li a {
  border-top: 1px solid #ddd;
}

.ddsmoothmenu ul li ul li ul li a {
  border-top: 0px solid #ddd;
}
.ddsmoothmenu ul li ul li ul li + li a {
  border-top: 1px solid #ddd;
}

.ddsmoothmenu p {
  width: 100%;
  height: 40px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  /* margin: 0 auto; */
      margin: 10px 0;
  z-index: 1;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  opacity: 1;
}
/* 
.btn_sch_info a {
  color: #074fad;
}
.btn_sch_info p {
  background: url(../images/web/btn_sch_info.png) no-repeat;
  background-position: center;
}
.btn_sch_info a:hover p,
.btn_sch_info a.selected p {
      top: -8px;
}
.btn_sch_info a:hover,
.btn_sch_info a.selected,
.btn_sch_info a.current {
  background: #074fad;
  color: #fff;
}

.btn_grad a {
  color: #db2321;
}
.btn_grad p {
  background: url(../images/web/btn_grad.png) no-repeat;
  background-position: center;
}
.btn_grad a:hover p,
.btn_grad a.selected p {
      top: -8px;
}
.btn_grad a:hover,
.btn_grad a.selected,
.btn_grad a.current {
  background: #db2321;
  color: #fff;
}

.btn_study a {
  color: #178c59;
}
.btn_study p {
  background: url(../images/web/btn_study.png) no-repeat;
  background-position: center;
}
.btn_study a:hover p,
.btn_study a.selected p {
     top: -8px;
}
.btn_study a:hover,
.btn_study a.selected,
.btn_study a.current {
  background: #178c59;
  color: #fff;
}

.btn_award a {
  color: #ff9d0c;
}
.btn_award p {
  background: url(../images/web/btn_award.png) no-repeat;
  background-position: center;
}
.btn_award a:hover p,
.btn_award a.selected p {
     top: -8px;
}
.btn_award a:hover,
.btn_award a.selected,
.btn_award a.current {
  background: #ff9d0c;
  color: #fff;
}

.btn_life a {
  color: #017194;
}
.btn_life p {
  background: url(../images/web/btn_life.png) no-repeat;
  background-position: center;
}
.btn_life a:hover p,
.btn_life a.selected p {
    top: -8px;
}
.btn_life a:hover,
.btn_life a.selected,
.btn_life a.current {
  background: #017194;
  color: #fff;
}

.btn_support a {
  color: #ff6917;
}
.btn_support p {
  background: url(../images/web/btn_support.png) no-repeat;
  background-position: center;
}
.btn_support a:hover p,
.btn_support a.selected p {
    top: -8px;
}
.btn_support a:hover,
.btn_support a.selected,
.btn_support a.current {
  background: #ff6917;
  color: #fff;
}

.btn_related a {
  color: #1f6e77;
}
.btn_related p {
  background: url(../images/web/btn_related.png) no-repeat;
  background-position: center;
}
.btn_related a:hover p,
.btn_related a.selected p {
    top: -8px;
}
.btn_related a:hover,
.btn_related a.selected,
.btn_related a.current {
  background: #1f6e77;
  color: #fff;
}

.btn_contact a {
  color: #ff8a00;
}
.btn_contact p {
  background: url(../images/web/btn_contact.png) no-repeat;
  background-position: center;
}
.btn_contact a:hover p,
.btn_contact a.selected p {
    top: -8px;
}
.btn_contact a:hover,
.btn_contact a.selected,
.btn_contact a.current {
  background: #ff8a00;
  color: #fff;
} */

* html .ddsmoothmenu ul li a {
  display: inline-block;
}
* html .ddsmoothmenu {
  height: 1%;
}

.downarrowclass {
  position: absolute;
  top: 0px;
  right: 0px;
}
.rightarrowclass {
  position: absolute;
  top: 12px;
  right: 2px;
}
.leftarrowclass {
  margin-right: 5px;
}
.ddshadow {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  background-color: #ccc;
}
.toplevelshadow {
  margin: 5px 0 0 5px;
  opacity: 0.8;
}
.ddcss3support .ddshadow.toplevelshadow {
  margin: 0;
}
.ddcss3support .ddshadow {
  background-color: transparent;
  box-shadow: 5px 5px 5px #aaa; /* box-shadow color generally should be a little darker than that for the NON CSS3 capable browsers background-color */
  -moz-box-shadow: 5px 5px 5px #aaa;
  -webkit-box-shadow: 5px 5px 5px #aaa;
}

/* ######### Mobile menu container CSS ######### */

div.ddsmoothmobile {
  /* main mobile menu container */
  background: #414141;
  color: white;
  position: fixed;
  top: 51px;
  width: 200px; /* width of mobile menu */
  overflow: hidden;
  visibility: hidden;
  border-radius: 0 0 0 10px;
  box-shadow: 0 0 10px gray;
}

div.ddsmoothmobile a {
  color: white;
  text-decoration: none;
}

div.ddsmoothmobile div.topulsdiv {
  /* Single DIV that surrounds all top level ULs before being flattened, or the ULs on the "frontpage" of the menu */
  position: relative;
  background: #414141;
  overflow-y: auto;
  width: 100%;
  height: 100%;
}

div.ddsmoothmobile ul {
  /* style for all ULs in general inside mobile menu */
  list-style: none;
  width: 100%;
  top: 0;
  left: 0;
  background: #414141;
  margin: 0;
  padding: 0;
}

div.ddsmoothmobile div.topulsdiv ul.submenu {
  /* top level ULs style */
}

div.ddsmoothmobile ul.submenu {
  /* sub level ULs style */
  position: absolute;
  height: 100%;
  overflow-y: auto;
}

div.ddsmoothmobile ul li {
  border-bottom: 1px solid gray;
  position: relative;
  font-weight: bold;
}

div.ddsmoothmobile ul li.breadcrumb {
  /* breadcrumb LI that's added to the top of every sub level UL */
  cursor: pointer;
  padding: 10px;
  background: #ffa200;
}

div.ddsmoothmobile ul li a {
  display: block;
  padding: 6px;
}

div.ddsmoothmobile ul li a:hover {
  background: black;
}

/* ############# Animated Drawer icon (mobile menu toggler) CSS ############# */

.animateddrawer {
  font-size: 10px; /* Base font size. Adjust this value to modify size of drawer icon */
  width: 3em;
  height: 2.8em;
  outline: none;
  position: fixed; /* BY default, make toggler fixed on screen */
  display: none;
  top: 10px; /* Position at upper right corner */
  right: 10px;
  z-index: 1001;
}

.animateddrawer:before,
.animateddrawer:after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 0.6em; /* height of top and bottom drawer line */
  background: #fff;
  border-radius: 2px;
  top: 8px;
  left: 0;
  opacity: 1;
  -webkit-transition: all 0.3s ease-in; /* set transition type and time */
  transition: all 0.3s ease-in;
}

.animateddrawer:after {
  top: auto;
  bottom: 2px;
}

.animateddrawer span {
  width: 100%;
  height: 0.6em; /* height of middle drawer line */
  background: black;
  position: absolute;
  top: 50%;
  margin-top: -0.3em; /* set this to - half of middle drawer line height */
  border-radius: 2px;
  -ms-transform-origin: 50% 50%;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition: all 0.3s ease-in 0.3s; /* set transition type and time */
  transition: all 0.3s ease-in 0.3s;
}

.animateddrawer span::after {
  content: "";
  display: block;
  width: 100%;
  height: 0.6em; /* height of middle drawer line */
  background: black;
  border-radius: 2px;
  position: absolute;
  -ms-transform-origin: 50% 50%;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition: all 0.3s ease-in 0.3s; /* set transition type and time */
  transition: all 0.3s ease-in 0.3s;
}

.animateddrawer.open {
}

.animateddrawer.open:before {
  /* style when .open class is added to button */
  /*top: 50%;
  margin-top: -0.3em;*/ /* set this to - half of top drawer line height */
  opacity: 1;
  transform: rotate3d(0, 0, 1, 45deg);
  top: 50%;
}

.animateddrawer.open:after {
  /* style when .open class is added to button */
  /*bottom: 50%;*/
  opacity: 1;
  transform: rotate3d(0, 0, 1, -45deg);
  top: 50%;
}

.animateddrawer.open span {
  /* style when .open class is added to button */
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.animateddrawer.open span:after {
  /* style when .open class is added to button */
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

@media screen and (max-width: 800px) {
  .btn_sch_info a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_support a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_study a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_life a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_contact a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_grad a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_award a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
  .btn_related a.current {
    background: none;
    color: #ffa200;
    font-weight: bold;
  }
}