body {
  font-size: .950rem;
  background-color: #f3f4f7;
}

/*
 * Sidebar
 */

.load {
  text-align: center;
  margin: auto;
  height: 100%;
}

.loginfirst {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background-color: #000;

}

.no-js #sploader { display: none;  }
.js #sploader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(/inc/images/preload.gif) center no-repeat #fff;
}

.imger {
  padding: 300px 0;
  text-align: center;
}

.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 100; /* Behind the navbar */
  padding: 48px 0 0; /* Height of navbar */
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}

.sidebar-sticky {
  position: relative;
  top: 0;
  height: calc(100vh - 48px);
  padding-top: .5rem;
  overflow-x: hidden;
  overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
  .sidebar-sticky {
    position: -webkit-sticky;
    position: sticky;
  }
}

.nav-link {
  font-weight: 500;
  color: #333;
  padding: 10px 15px; /* Navlink spaced */

}

.nav-item a:hover {
	color: #b51515;
	background-color: #e6e6e6;
}

.menuitem {
  border: 1px solid #ddd; /* Add a border to all links */
  margin-top: -1px; /* Prevent double borders */
  background-color: #dfdfdf; /* Grey background color */
  padding: 10px; /* Add some padding */
  text-decoration: none; /* Remove default text underline */
  font-size: 14px; /* Increase the font-size */
  color: black; /* Add a black text color */
  display: block; /* Make it into a block element to fill the whole list */
}

.menu {
  font-size: 13px; /* Increase the font-size */
}

.menu2 {
  font-size: 13px; /* Increase the font-size */
}

.menuback {
color: #19425d;
background: rgb(223,223,223);
background: linear-gradient(0deg, rgba(223,223,223,1) 0%, rgba(223,223,223,1) 97%, rgba(62,149,205,1) 100%);

}

.sidebar-heading {
  font-size: .75rem;
  text-transform: uppercase;
}

/*
 * Content
 */

[role="main"] {
  padding-top: 133px; /* Space for fixed navbar */
}

@media (min-width: 768px) {
  [role="main"] {
    padding-top: 48px; /* Space for fixed navbar */
  }
}

/*
 * Navbar
 */

.navbar-brand {
  padding-top: .75rem;
  padding-bottom: .75rem;
  font-size: 1rem;
  background-color: rgba(0, 0, 0, .25);
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}

.navbar .form-control {
  padding: .75rem 1rem;
  border-width: 0;
  border-radius: 0;
}

.form-control-dark {
  color: #fff;
  background-color: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .1);
}

.form-control-dark:focus {
  border-color: transparent;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}

.bd-callout{padding:1.25rem;margin-top:1.25rem;border:1px solid #eee;border-left-width:.25rem;border-radius:.25rem}.bd-callout h4{margin-top:0;margin-bottom:.25rem}.bd-callout p:last-child{margin-bottom:0}.bd-callout code{border-radius:.25rem}.bd-callout+.bd-callout{margin-top:-.25rem}.bd-callout-info{border-left-color:#5bc0de}.bd-callout-info h4{color:#5bc0de}.bd-callout-warning{border-left-color:#f0ad4e}.bd-callout-warning h4{color:#f0ad4e}

.plistbtn:hover {

   background-color: red;

}

.plistbtns:hover {

   background-color: #5bc0de;

}

.form-row{
  border: 1px solid;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 6px 6px #888888;
}

.sonic-control{dwidth:100%;height:calc(2.25rem + 2px);padding:.375rem .75rem;font-size:1rem;line-height:1.5;color:#495057;background-color:#fff;background-clip:padding-box;border:1px solid #ced4da;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}

.form-row2{
  width: 800px;
  border: 1px solid;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 6px 6px #888888;
  -ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-5px;margin-left:-5px
}

.plist-sel{display:inline-block;width:250px;height:calc(2.25rem + 2px);padding:.375rem 1.75rem .375rem .75rem;line-height:1.5;color:#495057;vertical-align:middle;background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center;background-size:8px 10px;border:1px solid #ced4da;border-radius:.25rem;-webkit-appearance:none;-moz-appearance:none;appearance:none}


.homelink {
text-decoration: none;
font-weight: bold;
}

.homelink:hover {
text-decoration: none;
}

#relay2 a {
text-decoration: none;
color: #ffffff;
}

#relay2:hover {
text-decoration: none;
}

.logout {
text-decoration: none;
font-weight: bold;
color: #979797;
}

.logout:hover {
text-decoration: none;
color: #da0f0f;
}

.topver {
text-decoration: none;
font-size: 12px; /* Increase the font-size */
color: #cdcdcd;
}

.updatelog {
text-decoration: none;
color: #cdcdcd;
}

.updatelog:hover {
text-decoration: none;
color: #fff;
}



.maintop {
color: #c5e7ff;
text-decoration: none;
font-weight: bold;
background: rgb(11,31,45);
background: linear-gradient(180deg, rgba(11,31,45,1) 0%, rgba(11,31,45,1) 88%, rgba(0,189,255,1) 99%);
/* box-shadow: 0 6px 6px #888888; */
}

.footer {

text-decoration: none;
background-color: #eaeaea;
}

.footer a:hover {
	color: #2daaf1;
	text-decoration: none;
}

.footer a {
	color: #000000;
	text-decoration: none;
}

.player {
  background-color: #f1f3f4; /* Grey background color */
  text-decoration: none; /* Remove default text underline */
  width: 100%;
}

#jp_container_1 {
max-width: 100%;
width:100%;
}

.alert-white {
  background-image: linear-gradient(to bottom, #fff, #f9f9f9);
  border-top-color: #d8d8d8;
  border-bottom-color: #bdbdbd;
  border-left-color: #cacaca;
  border-right-color: #cacaca;
  color: #404040;
  padding-left: 61px;
  position: relative;
}

.alert-white.rounded {
  border-radius: 3px;
  -webkit-border-radius: 3px;
}

.alert-white.rounded .icon {
  border-radius: 3px 0 0 3px;
  -webkit-border-radius: 3px 0 0 3px;
}

.alert-white .icon {
  text-align: center;
  width: 45px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 1px solid #bdbdbd;
  padding-top: 15px;
}


.alert-white .icon:after {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  display: block;
  content: '';
  width: 10px;
  height: 10px;
  border: 1px solid #bdbdbd;
  position: absolute;
  border-left: 0;
  border-bottom: 0;
  top: 50%;
  right: -6px;
  margin-top: -3px;
  background: #fff;
}

.alert-white .icon i {
  font-size: 20px;
  color: #fff;
  left: 12px;
  margin-top: -10px;
  position: absolute;
  top: 50%;
}
/*============ colors ========*/
.alert-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}

.alert-white.alert-success .icon,
.alert-white.alert-success .icon:after {
  border-color: #54a754;
  background: #60c060;
}

.alert-info {
  background-color: #d9edf7;
  border-color: #98cce6;
  color: #3a87ad;
}

.alert-white.alert-info .icon,
.alert-white.alert-info .icon:after {
  border-color: #3a8ace;
  background: #4d90fd;
}


.alert-white.alert-warning .icon,
.alert-white.alert-warning .icon:after {
  border-color: #d68000;
  background: #fc9700;
}

.alert-warning {
  background-color: #fcf8e3;
  border-color: #f1daab;
  color: #c09853;
}

.alert-danger {
  background-color: #f2dede;
  border-color: #e0b1b8;
  color: #b94a48;
}

.alert-white.alert-danger .icon,
.alert-white.alert-danger .icon:after {
  border-color: #ca452e;
  background: #da4932;
}

.map { width: 100%; height:600px; }

.packlist{
margin-left: 15px;
margin: auto;
width: 330px;
position:relative;
display:-ms-flexbox;
display:flex;-ms-flex-direction:column;
flex-direction:column;
min-width:0;
word-wrap:break-word;
background-color:#fff;
background-clip:border-box;
border:1px solid rgba(0,0,0,.125);
border-radius:.25rem

}

.searchicon {
        float: right;
        margin-right: 6px;
        margin-top: -30px;
        position: relative;
        z-index: 2;
        color: red;
    }

.packlist {
margin-left: 20px;
width: 330px;
position:relative;
display:-ms-flexbox;
display:flex;-ms-flex-direction:column;
flex-direction:column;
min-width:0;
word-wrap:break-word;
background-color:#fff;
background-clip:border-box;
border:1px solid rgba(0,0,0,.125);
border-radius:.25rem
}

.general {
text-decoration: none;
color: #00a8ff !important;

}

.general a {
text-decoration: none;
color: #00a8ff !important;

}

.general:hover {
text-decoration: none;
color: #d81010 !important;
}