html {
height:100%;
font-size:15px;
}

body {
height:100%;
}

.card {
border-radius:0px;
}

#TOSBox {
height:300px;
margin-left:1rem;
margin-right:1rem;
margin-top:1rem;
padding:1rem;
overflow:auto;
background-color:#f3f3f3;
}

.cardPadding {
padding-bottom:2rem;
}

.card-header {
background-color:#FFF;
}

#dropdownMenu2 {
border:none;
background-color:transparent;
}

#dropdownMenu2:hover {
background-color:transparent;
}

#subdropdownMenu2 {
border:none;
background-color:transparent;
color:#676767;
margin-top:10px;
}

.namedisplay {
color: white;
display: inline-block;
margin-top: 0px;
}

.namedisplay-namemode {
color: white;
display: inline-block;
margin-top: 7px;
margin-right: 8px;
}

.user-menu .nav-item .nav-link {
color: white;
}

.nav-item.pull-xs-right .btn{
padding: 6px;
margin-top: 10px;
}

.card.closetogether {
margin-bottom:1px;
min-height:62px;
}

.closetogether .btn-default {
margin-top:-10px;
margin-bottom:10px;
}

.card.header {
background-color:transparent !important;
border:none;
font-weight:bold;
}

.btn-primary {
background-color:#3074ae;
}

.center {
text-align:center;
}

.btn-default {
background-color:#f3f4f7;
border:1px solid #e1e2e5;
}

#signin {
background-color:transparent;
color:#FFF;
border:none;
}

#passwordField {
margin-bottom:10px;
}

#termscard {
width: 100%;
max-width: 800px;
margin: 0 auto 100px;
}

.textbox {
padding:10px;
font-size:.9rem;
}

.navbar {
background-color:#3074ae;
border-radius:0;
}

#panelPopup .nav-item {
height:auto;
}

.card-header-tabs .nav-item {
line-height: inherit;
}

.nav-item .active {
background-color:#DDD;
}

#company_logo {
width: 66px;
height: 33px;
}

.tester {
background-color:#3074ae;
color:#FFF;
}

.narrow {
width:70%;
margin:auto;
margin-bottom:20px;
}

.centerme {
text-align:center;
}

.nav-link .subnavdropdown {
border:none;
background-color:transparent !important;
padding:0px;
color:#676767 !important;
vertical-align:top !important;
}

#networkDiagram {
color:#BBB;
width:calc(100% - 300px);
text-align:center;
font-size: 1rem;
margin-top: 0px;
position: relative;
height:100%;
}
#networkDiagram center, .eai-area {
height:100%;
}
.eai-area button {
position: relative;
top: 50%;
transform: translateY(-50%);
}

html,body{
height:100%;
}

.jumbotron {
background-color:#f9f9f9;
padding-top:2rem;
padding-bottom:0px;
margin-bottom:0px;
position:relative;
height: -moz-calc(100% - 112px);
height: -webkit-calc(100% - 112px);
height: calc(100% - 112px);
}


#taskCard {
position:fixed;
margin-top: 110px;
top:-1px;
right:0px;
height: calc(100% - 110px);
background-color:#fff;
width:300px;
line-height:1em;
}

#panelPopup #taskCard {
height: 100%;
}

#taskCard .card-block {
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
padding-top:.6rem;
padding-bottom:.6rem;
background-color: #f9f9f9;
overflow-y:auto;
}

.detailCard {

}

.newWindow {
display:inline;
float:right;
}

#taskModal {
position:absolute;
top:67px;
right:0px;
width:300px;
height:100%;
line-height:1em;
}

#taskModalDialog {
height:100%;
}

#taskModal .modal-dialog {
width:auto;
margin-bottom:0px;
}

#taskModal .modal-content {
height:100%;
}

#taskModal .modal-body {
padding-top:0px;
}

#taskModal .modal-body {
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
}

#taskModal ul {
margin-left:0px;
padding-left:0px;
margin-bottom:0px;
padding-bottom:0px;
cursor:pointer;
}

#taskModal .detailtext {
padding:25px;
}

.close div {
color:#000 !important;
}
.close span {
color:#666;
font-size:.7em;
}
.alert {
margin-top:.8em;
}

.arrow {
background-color:transparent;
color:#000 !important;
position:absolute;
top:0px;
}

.rightarrow {
right:0px;
}

#handle {
cursor:pointer;
position:absolute;
top:0px;
right:300px;
width:15px;
height:33px;
height: 100%;
background-image:url("../images/handle.png");
background-color:transparent;
border:none;
}

#handle:hover{
border-right: 2px solid #3074ae;
cursor: ew-resize;
}

.carousel-inner {
height:100%;
}

.carousel-item {
height:100%;
overflow:auto;
position:relative;
}

.detailCard .bigleftarrow {
font-size:1.4rem;
cursor:pointer;
text-align:center;
}

.detailCard .bigleftarrow:hover {
color:#666;
}

.chevronzone {
padding-right:0px;
}

.detailCard {
font-size:.9rem;
line-height:1.2rem;
color:#000;
padding:20px;
padding-bottom:0px;
}

#viewTasksButton {
font-size: 0.9rem;
}

.expandzone {
position:absolute;
left:0px;
bottom:0px;
height:45px;
width:100%;
border-top:1px solid rgba(0, 0, 0, 0.15);
padding-top:6px;
background-color:#FFF;
margin-top: -1000px;
z-index: 12;
}

.bottomNavZone {
position:absolute;
left:0px;
bottom:0px;
height:45px;
width:100%;
border-top:1px solid rgba(0, 0, 0, 0.15);
padding-top:6px;
background-color:#FFF;
display:none;
}

.navArrow {
cursor: pointer;
display: inline-block;
font-size: 1rem;
color:#000;
padding:15px;
position:absolute;
top:0px;
padding-bottom:0px;
}

.rightArrow {
right:0px;
}

.disabled {
opacity:.2;
}

.close {
font-size:1.9rem;
color:#000 !important;
opacity:1;
}

.bottomarrows {
height:40px;
position:absolute;
left:0px;
bottom:0px;
border-top:1px solid rgba(0, 0, 0, 0.15);
background-color:#FFF;
width:100%;
display:none;
}

.panelItem {
font-size:.9rem;
list-style:none;
line-height: 1.2em;
border-bottom:1px solid rgba(0, 0, 0, 0.15);
padding-top:12px;
padding-bottom:12px;
padding-left:20px;
padding-right:10px;
width:100%;
word-wrap: break-word;
text-wrap: normal;
white-space: normal;
cursor:pointer;
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none;   /* Chrome/Safari/Opera */
-khtml-user-select: none;    /* Konqueror */
-moz-user-select: none;      /* Firefox */
-ms-user-select: none;       /* Internet Explorer/Edge */
user-select: none;           /* Non-prefixed version, currently not supported by any browser */
}

.level2 > .panelItem {
padding-left:40px !important;
}

.panelItem:hover {
background-color:#EEE;
}

.tree {
display:none;
}

#taskModal .tree.level2 li {
color:#0b69c2;
text-indent: 40px;
}

#taskModal .tree .noborder {
border-bottom:none;
}


#lab_timer {
color: white;
position: absolute;
left:50%;
transform:translateX(-50%);
font-size: 85%;
padding: 10px 10px;
}


#taskCard{
padding-bottom: 0px;
margin-bottom: 0px;
}

/* override some Bootstrap internals to get the sidebar look right in flex mode */
#taskCard .carousel-item {
  flex-direction: column;
}
#taskCard .card-block {
  padding: 0;
  /* make sure the content doesn't hide behind .card-footer */
  padding-bottom: 51px;
}

#taskCard .lds_sidebar_task h1,
#taskCard .lds_sidebar_task h2,
#taskCard .lds_sidebar_task h3,
#taskCard .lds_sidebar_task h4,
#taskCard .lds_sidebar_task h5,
#taskCard .lds_sidebar_task h6 {
font-size: .9rem;
list-style: none;
line-height: 1.2em;
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
padding-top: 12px;
padding-bottom: 12px;
padding-left: 20px;
padding-right: 10px;
width: 100%;
word-wrap: break-word;
text-wrap: normal;
white-space: normal;
cursor: pointer;
margin: 0px;
font-weight:bold;
background-color:#ddd;
}
#taskCard .lds_sidebar_task h1 :hover,
#taskCard .lds_sidebar_task h2 :hover,
#taskCard .lds_sidebar_task h3 :hover,
#taskCard .lds_sidebar_task h4 :hover,
#taskCard .lds_sidebar_task h5 :hover,
#taskCard .lds_sidebar_task h6 :hover {
background-color:#fff;
}

#taskCard .lds_sidebar_task p {
padding: 6px 10px 6px 20px;
margin-bottom:0px;
}

#taskCard .lds_sidebar_task .box,
#taskCard .lds_sidebar_task .box_closed {
margin-top:10px;
}

#taskCard .lds_sidebar_task > p, #taskCard .lds_sidebar_steps{
display: none;
}

.lds_sidebar_steps .lds_sidebar_tip{
font-size: 0.8rem;
margin-bottom: 15px;
position: relative;
margin-top:10px;
padding: 25px;
}

.lds_sidebar_steps .lds_sidebar_tip pre{
padding: 5px;
margin-top: -10px;
}


ul.lds_sidebar_steps{
list-style-type: none;
padding: 0px;
}

.lds_sidebar_steps li{
padding-top: 6px;
padding-left: 20px;
padding-bottom: 6px;
list-style-type: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
line-height: 1.2em;
}

#taskCard h1:hover, #taskCard .lds_sidebar_steps li:hover{
background-color: #eee;
}

.ui-widget-shadow{
opacity: 1 !important;
}

.ui-tooltip, .qtip{
width: 800px;
border: 1px solid grey;
border-radius: 10px;
min-width: 500px;
width: 500px;
max-width: 500px;
}

.card-block{
border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.card-block a{
color: black;
display: inline-block;
}

.card-block a.active{
border: 1px solid rgba(0, 0, 0, 0.15);
margin-top: 0px;
padding-bottom: 9px;
border-bottom: 1px solid #f9f9f9;
background-color: #f9f9f9;
}


/*#tabs .ui-tabs-panel {
display: block;
border-width: 0;
padding: 1em 1.4em;
background: none;
}*/


#tabs .ui-tabs-panel {
display: block;
border-width: 0;
padding: 0;
  padding-bottom: 20px;
background: none;
}


.i-tabs-hide,#tabs [aria-hidden=true] {
display: none !important;
}

#taskCard .card-block a.active{
border-bottom: 1px solid white;
background-color: white;
}

.device{
    word-wrap: break-word;
    white-space: normal;
    cursor: pointer;
}

.device:hover{
background-color: #eee;
}

.device .dev_actions{
display: none;
padding-top: 8px;
padding-left: 8px;
}
.device.display_action .dev_actions{
display: block;
margin-top: 10px;
}
.device.inactive {
  pointer-events: none;
  opacity: 0.5;
  background: #CCC;
}


#taskCard.fixed {
position:fixed;
top:0;
height: 100%;
}

.spacer3x{
height:60px;
}
.spacer2x{
height:30px;
}
.spacer1x{
height:20px;
}

span.error,span.error_message{
display: block;
color: #a94442;
background-color: #f2dede;
border-color: #ebcccc;
padding: 15px;
margin-bottom: 1rem;
border: 1px solid transparent;
border-radius: .25rem;
}
.warning {
color:red;
font-weight: bold;
}
.warning-bs4 {
color:#e63e35;
font-weight: bold;
}

#topnavi{
    background-color: #f4f4f4;
}

.content-spacer{
height: 110px;
}

.navbar-toggleable-xs.collapse.in{
/*    background-color: white;
    margin-top: 25px;*/
}

@media only screen and (max-width: 768px){
  #topnavi{
    background-color: #f9f9f9;
    border-bottom: 1px solid  #3074ae;
  }
  .navbar-nav .nav-item {
    float: right;
  }
  .navbar-nav .nav-link {
    padding-bottom: 0rem;
    padding-top: 0rem;
  }
  .nav-item{
    line-height: 1.5rem;
  }
  #lab_timer{
    margin: 0px;
  }
  #company-logo{
    margin-top: 5px;
  }
  #taskCard {
    margin-top: 60px;
  }
}

.clear
clear: both;
}

.titlesmall{
display: block;
text-align: center;
}

.navbar-toggler{
color: white;
border: 1px solid white;
margin-top: 5px;
}

.line {
display: block;
text-align: center;
overflow: hidden;
white-space: nowrap;
}

.line > a {
position: relative;
display: inline-block;
}

.line > a:before,
.line > a:after {
content: "";
position: absolute;
top: 50%;
width: 9999px;
height: 1px;
background: red;
}

.line > a:before {
right: 100%;
margin-right: 15px;
}

.line > a:after {
left: 100%;
margin-left: 15px;
}


/*new sidebar behaviour*/

.box .action{
text-align: center;
position: absolute;
top: -8px;
left: 50%;
width: 100px;
margin-left: -50px;
background-color: white;
}

.box{
margin-bottom: 20px;
width:100%;
position: relative;
border: 1px solid lightgrey;
padding-bottom:20px;
background-color: white;
}

#panelPopup .box.closed, #panelPopup .box.closed .action{
background-color: #f9f9f9;
}

.box .lds_sidebar_tip{
background-color: white;
}

.box.closed .lds_sidebar_tip{
display: none;
}

.box.closed {
border: 0px solid grey;
border-top: 1px solid lightgrey;
background-color: white;
}

.lds_sidebar_steps li:hover .action{
background-color: white;
}

.lds_sidebar_steps li:hover .box, .lds_sidebar_steps li:hover .box.closed .action {
background-color: #eee;
}

.lds_sidebar_steps li:hover .box, .lds_sidebar_steps li:hover .box.closed {
background-color: #eee;
}

.lds_sidebar_steps li:hover .box{
background-color: white;
}

#start-lab-button-3 {
color: #fff;
margin-top:5px;
padding:4px 8px;
}
.dropdown-menu {
margin-top:-5px;
}
.dropdown:hover .dropdown-menu {
display: block;
}

/*
*/
.dropdown-item {
line-height: 1.5;
}
.navbar,
.dropdown-item,
.btn {
}

#tabs .ui-tabs-anchor {
font-size:.8rem;
padding:.3rem .7rem;
}
#tabs {
min-height: 100%;
padding:1px;
}
#tabs ul li {
list-style-type:none;
}
#tabs-diagram {
display:none;
}
.net-diag-msg {
font-size:.8rem;
margin-bottom:.5rem;
font-weight:400;
height:14px;
}
#tabs > .tnetdiv {
  position: absolute;
  top: 32px;
  right: 0;
  bottom: 0;
  left: 0;
  height: auto;
  margin: 0;
  max-height: 700px;
}
div.xterm-rows, .xterm-helpers {
background-color: #000;
font-family:monospace;
font-size:12px;
line-height:14px;
}
.terminal {
  height: 100%;
}
.xterm-viewport {
  height: 100%;
}
.xterm-helpers {
  visibility: visible;
}
#tabs div.xterm-helpers > span {
  display: block !important;
}
select.custom-select {
display: inline-block;
max-width: 100%;
padding: 0.375rem 1.75rem 0.375rem 0.75rem;
padding-right: 0.75rem \9;
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='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.75rem center;
background-image: none \9;
-webkit-background-size: 8px 10px;
background-size: 8px 10px;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0.25rem;
-moz-appearance: none;
-webkit-appearance: none;
}
.navbar .fa-close {
color: white;
cursor:pointer;
}
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.title-limited {
width:40%;
}
.tmpborder {
border:1px solid red;
}
.vcenter {
display: inline-block;
vertical-align: middle;
float: none;
}
.intructor-token-help {
margin-top:10px;
}
.pi_sel_help {
display:flex;
align-items:center;
}


#preinit_status {
}
#preinit_status .progress {
border: 1px solid #ccc;
background-color:#f5f5f5;
}

.dev-status-str {
padding-top:3px;
padding-left:5px;
}
.pi-summary {
background-color:#f1f1f1;
}
.pi-summary .progress {
background-color:#ccc;
}
#pi_0 {
}
#preinit-status-div .card {
border-radius:4px;
border: 1px solid #999;
}
#preinit-status-div .card-block {
padding-left: 10px;
padding-right: 10px;
}
#preinit-status-div h5 {
font-size:1rem;
}
#preinit-status-div hr {
width: 75%;
border-top-color: #999;
margin-top:20px;
margin-bottom:20px;
}
#preinit-status-div hr {
}
.preinit_part_status {
margin-top:10px;
}
.pi-no-status {
background-color:#cdcdcd;
margin-top:10px;
}
.pi-uctrl-status {
background-color:#c7d7db;
margin-top:10px;
}
.progress-bar {
color:#000;
}
.text-primary {
color:#3074ae !important;
}
.error {
color:#f00;
font-weight:bold;
}
.form_error_message {
color:#f00;
font-weight:bold;
}
.form-check {
margin-bottom:.25rem;
}

#tab_anchor.svg {
  width: 800px;
}
#topo svg .device-click-handler {
    cursor: pointer;
    fill: #ff0000;
    fill-opacity: 0.05;
    stroke: red;
    stroke-width: 1;
    stroke-opacity: 1;
}
#topo svg .device-click-handler:hover {
    stroke-width: 2;
}
.help-card {
padding: 1rem;
}
.std-prep {
color: #ff0;
text-shadow:0 0 4px black;
font-size:1.4rem;
}
.std-running {
color: #00d700;
text-shadow:0 0 4px black;
font-size:1.4rem;

}
.std-inactive {
color:#f6f6f6;
font-size:1.4rem;
text-shadow:0 0 4px #777;
}
.pi-excluded {
color: #aaa;
font-size:1.4rem;
}
.pi_cancel, .pi_cancel_all, .pi_cancel_snew {
color: #000;
font-size:1.3rem;
}
.pi_cancel:hover, .pi_cancel_all:hover, .pi_cancel_snew:hover {
color: #c9302c;
font-size:1.3rem;
}
.pi_retry {
color: #c9302c;
font-size:1.3rem;
}
.pi_retry:hover {
color: #f9302c;
font-size:1.3rem;
}
input[type='checkbox'] {
vertical-align: middle;
}
div .submit {
display:inline-block;
margin-right:1rem;
}
div.bootbox-body span.warning {
text-indent:-19px;
margin-left:40px;
display:inline-block;
}
div.bootbox-body span.warning:before {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
display: inline-block;
text-decoration: inherit;
content: '\f071';
font-size: 1.5rem;
padding-right:15px;
}
#running-gear {
margin-left:.5rem;
}
.img-center {
display:block;
margin:auto;
}

#pi_tips {
height:135px !important;
font-size:14px;
}
#pi_tips, #pi_toggles {
border:1px solid #ccc;
}
#pi_tips fa {
font-size:100% !important;
}
.pi_tip_title {
font-weight:bold;
font-size:14px;
}
#pi_tips p {
margin: .3em 0 0 0;
}
#pi_tips ol, #pi_tips ul {
margin-bottom:.3em
}

#footer-legal {
    background-color:#3074ae;
}
#footer-legal a {
    color: white;
}
.button-cell {
  display: flex;
}
.button-cell .btn {
  margin-left: 5px;
  margin-right: 5px;
}
.student-carousel .card-body {
  padding: 2px 5px;
}
.external_lab_launch {
  margin-right: auto;
  margin-left: auto;
  max-width: 50%;
  text-align:center;
}
.amp-lab {
    color: #000;
    text-align: left;
}
.amp-email {
    margin: 1.5em;
    padding: 1em;
    font-family: Courier;
    border: 1px solid #999;
}
.amp-claim-url {
    text-align: center;
}