/* CSS Document */
.navbar-login
{
    width: 305px;
    padding: 10px;
    padding-bottom: 0px;
}

.navbar-login-session
{
    padding: 10px;
    padding-bottom: 0px;
    padding-top: 0px;

}
.navbar-footer
{
    background-color:#DDD;
}
.navbar-footer-content { padding:15px 15px 15px 15px; }
.dropdown-menu {
padding: 0px;
overflow: hidden;
}

.icon-size
{
    font-size: 87px;
}

/* CSS used here will be applied after bootstrap.css */
#formLogin{padding: 15px; min-width:300px;}

/*make footers blue in panels */
table.table tr th{background-color:#428bca !important;
color:white !important;}

table.table.th-actions {
    background-color: darkgray;
}



.menu,
.menu ul {
margin:0;
padding:0;
list-style:none;
}
.menu {
	width: 700px;
	font-size: 14px;

}
.menu li {
	margin-bottom: 1px;
	width: 500px;
	margin-top: 0;
	margin-right: 0;
	margin-left: 0;
}
.menu a {
	display: block;
	border-radius: 10px;
	padding: 5px 5px;
	color: #ffffff;
	text-decoration: none;
	background-color: #0E5BA0;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	border: 2px solid #ffffff;

}
.menu a:hover {
	background-color: #ffffff;
	color: #0E5BA0;
	border: 2px solid #0E5BA0;
}
.menu ul li {padding-left:15px;}
.menu ul a {
	text-align: left;

	background-color: #CCCCCC;
	color: #333;
}
.hidden {display:none;}

	div.sidebar{
	float: left;
    width: 200px;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    padding: 0px;
    margin: 0px;
}

	 div.sidebarQuad {
	float: left;
    width: 400px;
	height: 400px;
	background-color: gray;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    border: ;
	background-color: white;
    padding: ;
    margin: ;
}

	 .Blue {
	border: 0px solid #055f92;
	background-color: #055f92;
	 }

	.LightBlue {
	border: 0px solid #178bcb;
	background-color: #178bcb;
	 }

	 .White{
		 border: 0px solid White;
	background-color: White;
	 }


.sidebar h1 {
		font-size: 4em;
	margin-bottom: 0;
	margin-top: 40px;
	text-align: center;
	font-weight: normal;
	color: white;
		 }
.Blue	 p{
		font-size: 1em;
		 margin-top: 0;
		text-align: center;
	    color: #178bcb;
		 }
.LightBlue p {
		font-size: 1em;
		 margin-top: 0;
		text-align: center;
	    color: #055f92;
		 }

.btn-sq {
  width: 100px !important;
  height: 100px !important;
  font-size: 10px;
}


.button-anchor {
   border: none;
    outline: none;
    background: none;
    cursor: pointer;
    color: #0000EE;
    padding: 0;
    text-decoration: underline;
    font-family: inherit;
    font-size: inherit;
}


.button-collapse {
    background-color: transparent;
    background-repeat:no-repeat;
      border-radius: 3px;
     padding: 4px 6px;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
    transition-duration: 0.4s;
}

.button-collapse:hover {
  background-color:  #e7e7e7;
}


.commercial-logo-div {
    padding-top: 30px;
    padding-bottom: 10px;
    text-align: center;
}

.vb-table {
    text-align: center;
}

.vb-table th {
    text-align: center;
}

.vb-table th:last-child {
    width: 5%;
}


.with-margin{
    margin-bottom: 1%;
}

/* Scheduling Table */

.past-deployment{
    background-color: lightgray;
    opacity: 95%
}

.deployed{
    background-color: lightgreen;
    opacity: 95%
}

.future-deployment{
    background-color: lightblue;
    opacity: 95%
}


/*  Timetable   */

.timetable-labels{
position: sticky;
top: 20%;
margin-top: 20%;
}


.hour{
    display: inline-block;
    width: 4%;
}
.time{
  position: relative;
  right: 2%;
  width: 104%;
  margin-bottom: 0px;

}
.ruler_line{
  display: inline-block;
  position: relative;
  width: 1%;
  height: 10px;
  background-color: black;
  top: 3px;
  z-index: -2;

}


.timetable-label{
    display: inline-block;
    white-space: nowrap;
}

.event-block{
  position: relative;
  top: 5px;
  margin-right: 5px;
  display: inline-block;
  height: 20px;
  width: 20px;
  font-size: 20px;
  text-align: center;
}

.event-label{
  height: 30px;
}

.na-block{
  background-color: black;
}
.op-block{
  background-color: #5cb85c;
}

.breakdown-block{
  background-color: #d9534f;
}

.weather-block{
  background-color: #428bca;
}

.standby-block{
  background-color: #f0ad4e;
}

.transit-block{
  background-color: #5bc0de;
}

.deployment-completed{
  background-color: green;
  opacity: 100%;
}

/* custom progress bars */

.progress-lg{

  outline: none;
  height:8rem !important;
  margin-top: 0px;
  border-radius: 0px;
  background-color: transparent;
  position: relative;
  bottom: 20px;
  -moz-box-shadow: none;
  -goog-ms-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.change-over{
    position:relative;
    top: 5px
}

.progress-hover{
  cursor: pointer;
  opacity: 70%;
}
.progress-hover:active
{
  opacity: 100%
}


.progress-bar-null{
  background-color: black;

}

.progress-bar-invisible{
    opacity: 100%;
    height: 70%;
    background-color: transparent;
    border-width: 0px;
    border-bottom: none;
    margin-top: 20px;
    border-left: 2px;
    -moz-box-shadow: none;
    -goog-ms-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.progress-bar-timetable {
    height: 50%;
    z-index: 10;
}

.progress-bar-dep-range {
    height: 75%;
    min-width: 0.5%;
    position: relative;
    bottom: 7.5px;
    background-color: black;
}

.mobilisation-label{
    color: white;
    position: relative;
    top: 27%;
    left: 6px;
    font-size: 125%;
}
.demobilisation-label{
    color: white;
    position: relative;
    top: 27%;
    right: 14px;
    font-size: 125%;
}

.deployments-label{
    text-align: center;
    position: relative;
    bottom: 30%;
    height: 30%;
}

.progress-bar-vessel-label{
    display: inline-block;
    width: 100%;
    height: 50%;
    background-color: transparent;
    color: black;
    border-radius: 0px;
}

.bar-deployment-label{
    display: inline-block;
    height: 20%;
    background-color: transparent;
    color: black;
    border-radius: 0px;
}


.progress-descr{
  position: sticky;
  bottom: 100%;
  color: white;

}

.clickable-element:hover{
  opacity: 75%;
  cursor: pointer;
  user-select: none;
}

.clickable-background{
  background-color: #f5f5f5;
}

.icon-full-width{
  font-size: 1.3vw;
}

/*////////////////////////*/

.no-close .ui-dialog-titlebar-close {
  display: none;
}


.no_space_line_break{
  display: block; /* makes it have a width */
            content: ""; /* clears default height */
            margin-top: 0; /* change this to whatever height you want it */
            margin-bottom: 0; /* change this to whatever height you want it */
}


.disabled-element{
  pointer-events: none;
  opacity: 50%;

}
.active-element{

}


.sticky-bottom{
    position: absolute;
  bottom: 0;
  width: 100%;
  height: 12.5rem;
}


/* project tooltips */

.wrapper-tooltip
{
    text-align: center;
}
.parent-tooltip
{
    display: inline-block;
    font-size: 125%;
}
.main-tooltip
{
    font-size: 150%;
}
.closed-item
{
    color: darkgray;
}
.active-item
{
    color: green;
}
.future-item
{
    color: deepskyblue;
}

#callus{
--call-us-form-header-background: #007bc7;
--call-us-header-text-color: #ffffff;
position: fixed;
bottom: 20px;
right: 6px;
}
#callus{
--call-us-form-header-background: #007bc7;
--call-us-header-text-color: #ffffff;
position: fixed;
bottom: 20px;
right: 6px;
}

</style>