body, html {
  height: 100.0%;
}

h4, h5 {
  margin-bottom: 10.0px;
  margin-top: 20.0px;
}

header {
  width: 100.0%;
  height: 40.0px;
  background-color: #e0eaf2;
}

header .sidemenu-switch {
  float: left;
  padding-top: 11.0px;
}

header .logo {
  float: left;
  padding-left: 20.0px;
  padding-top: 8.0px;
}

nav.sidemenu, main {
  -webkit-transition: margin 200.0ms ease-out;
  -moz-transition: margin 200.0ms ease-out;
  -o-transition: margin 200.0ms ease-out;
  transition: margin 200.0ms ease-out;
}

nav.sidemenu {
  float: left;
  width: 200.0px;
  height: calc(100.0% - 40.0px);
  margin-bottom: 0.0;
  padding-top: 15.0px;
  background: linear-gradient(#f6f6f6, #ffffff);
}

nav.sidemenu ul>li {
  width: 100.0%;
  border-bottom: 1.0px #e5e5e5 solid;
}

nav.sidemenu ul>li ul>li {
  padding-left: 1.0em;
  border-bottom: 1.0px #e5e5e5 solid;
  font-size: 0.9em;
  word-wrap: break-word;
}

nav.sidemenu hr {
  margin: 1.0em;
}

nav.sidemenu .glyphicon {
  font-size: 1.2em;
}

main {
  position: absolute;
  height: calc(100.0% - 40.0px);
  padding-top: 15.0px;
}

main table {
  margin-bottom: 1.0em;
}

main table thead td, main table tbody td {
  padding: 0.5em;
}

main table thead tr {
  background-color: #eff6f6;
}

main table tbody tr {
  border-bottom: 1.0px solid #ccc;
}

.CodeMirror {
  height: auto;
  margin-bottom: 1.0em;
  border: 1.0px solid #eee;
}

.map {
  background-image: url("images/map-bg-pattern.svg");
  height: 250.0px;
  width: 100.0%;
}

/* Cursors */
.cursorPointer {
  cursor: pointer;
}

/* Waiting animation */
.glyphicon-refresh-animate {
  -webkit-animation: glyphicon-refresh-animate-spin2 0.7s linear infinite;
  -moz-animation: glyphicon-refresh-animate-spin2 0.7s linear infinite;
  -ms-animation: glyphicon-refresh-animate-spin2 0.7s linear infinite;
  -o-animation: glyphicon-refresh-animate-spin2 0.7s linear infinite;
  -animation: glyphicon-refresh-animate-spin 0.7s linear infinite;
  animation: glyphicon-refresh-animate-spin 0.7s linear infinite;
}

/* Top of page */
#gotoTopOfPage {
  display: none;
  position: fixed;
  bottom: 20.0px;
  right: 30.0px;
  z-index: 99;
  border: none;
  outline: none;
  background-color: #999;
  color: white;
  cursor: pointer;
  padding: 8.0px 15.0px 8.0px 15.0px;
  border-radius: 10.0px;
  font-size: 1.5em;
}

#gotoTopOfPage:hover {
  background-color: #555;
}

/* Effect of page elements */

.float-right {
 float: right;
}

.overflow-hidden {
 overflow: hidden;
}

.shadow {
 box-shadow: 0.0 4.0px 8.0px 0.0 rgba(0.0, 0.0, 0.0, 0.2), 0.0 6.0px 20.0px 0.0 rgba(0.0, 0.0, 0.0, 0.19);
}

/* Patch for Bootstrap Select */
.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
 width: 100.0% !important;
}

/* Animation */

@-webkit-keyframes glyphicon-refresh-animate-spin2 {
  from {
    -webkit-transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes glyphicon-refresh-animate-spin {
  from {
    transform: scale(1) rotate(0deg);
  }

  to {
    transform: scale(1) rotate(360deg);
  }
}

/* Media outputs */
@media only screen and (min-width: 768px) {
  nav.sidemenu {
    margin-left: 0;
  }

  main {
    width: calc(100.0% - 200.0px);
    margin-left: 200.0px;
  }
}

@media only screen and (max-width: 768px) {
  .sidemenu-menu-close {
    margin-left: -160px;
  }

  .main-menu-close {
    width: calc(100% - 40px);
    margin-left: 40px;
  }

  .sidemenu-menu-open {
    margin-left: 0;
  }

  .main-menu-open {
    width: calc(100% - 200px);
    margin-left: 200px;
  }
}