/******************************* colors **************************/
/******************************* gradients **************************/
/******************************* transitions **************************/
/******************************* margins **************************/
/******************************* sizes **************************/
/******************************* font stacks **************************/
/******************************* font sizes **************************/
/******************************* letterSpacing **************************/
/******************************* font weight **************************/
/******************************* z-indexes **************************/
/******************************* breakpoint **************************/

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

html {
  color: white;
  /* font-family: Poppins, "Roboto Condensed", sans-serif; */
  font-size: 14px; /** set font-size, nhung neu dug webfontloader thi bo di*/}

html, body {
  margin: 0;
  padding: 0; }

html {
  background-attachment: fixed;
  background-size: cover;
  height: 100%;
  width: 100%; }

body {
  overflow: auto; }

.dev-header {
  content: '';
  display: block;
  height: 1em;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0; }

.dev-header:before {
  content: '';
  display: block;
  background-color: #4fbf40;
  height: 1em;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 50%; }

body {
  width: 100%; }

h1 {
  text-transform: uppercase; }

input,
select,
textarea,
button {
  color: inherit;
  font-family: inherit;
  font-size: inherit; }

button {
  background: none;
  border: 1px solid white; }

figure {
  margin: 0; }

table {
  border-collapse: collapse; }

*::-webkit-scrollbar {
  width: 1em;
  height: 1em; }

*::-webkit-scrollbar-thumb {
  background: #00fff7; }

*::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.2); }

a {
  color: white; }

::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5); }

::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5); }

/* firefox 19+ */
:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5); }

/* ie */
input:-moz-placeholder {
  color: rgba(255, 255, 255, 0.5); }

input {
  background-color: rgba(255, 255, 255, 0.3);
  border: 0;
  padding: 0.5em; }
  input:focus {
    outline: 1px solid white; }

input[type="radio"],
input[type="checkbox"] {
  background-color: none;
  border: 0; }

.floating-header {
  position: fixed;
  top: 0;
  visibility: hidden; }

html {
  background-image: url("../img_z0g/bg.png"); }

@keyframes m-menu-entry {
  from {
    visibility: visible;
    opacity: 0;
    height: auto; }
  80% {
    visibility: visible;
    opacity: 1;
    height: auto; }
  to {
    visibility: visible;
    opacity: 1;
    height: auto; } }

body {
  padding-top: 2em;
  padding-left: 2em;
  padding-right: 2em; }
  @media (max-width: 48em) {
    body {
      padding: 1em; } }

.main-nav__wrapper {
  margin: 1.3em 0 0; }

.main-content__wrapper {
  text-align: center; }

.main-content__wrapper > * {
  text-align: left; }

.main-content {
  /*display: inline-block;*/
  position: absolute;
  width: 100%; }

.sg {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex; }

.sg__main {
  background-color: rgba(0, 0, 0, 0.2);
  text-align: center;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  position: absolute;
  top: 10vh;
  left: 10vh;
  right: 10vh;
  bottom: 10vh;
  margin: auto; }

.sg-outline {
  width: 25%;
  max-width: 15em;
  background-color: rgba(0, 0, 0, 0.5);
  margin-right: 2em;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  flex-shrink: 0;
  -ms-flex-negative: 0; }

.sg-outline a {
  padding: 0.5em 1em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  display: block;
  text-decoration: none; }
  .sg-outline a.current {
    border-right: 1em solid #00fff7; }

.sg-outline ul {
  list-style-type: none;
  padding: 0;
  margin: 0; }

.sg-content {
  width: 75%;
  -webkit-flex-basis: 100%;
  -moz-flex-basis: 100%;
  flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  flex-grow: 1;
  -ms-flex-positive: 1; }

.sg-content > section > h1 {
  margin-top: 0; }

.sg-section > ol {
  counter-reset: section;
  list-style-type: none;
  margin: 0;
  padding: 0; }

.sg-section--main > h1 {
  margin-top: 3em; }

.sg-section--sub > h1 {
  margin-top: 2em;
  margin-bottom: 2em;
  text-transform: none;
  font-weight: normal; }
  .sg-section--sub > h1:before {
    counter-increment: section;
    content: counters(section, ".") " - "; }

.sg-section__related {
  margin: 4em 0; }

.sg-section__examples {
  background-color: rgba(0, 0, 0, 0.2);
  padding: 2em;
  display: inline-block;
  max-width: 100%; }

.sg-section__examples .progress {
  width: 100%;
  height: 100%; }

.sg-section__code {
  max-height: 80vh; }

.sg-section .line-chart {
  margin: 2em 0;
  max-width: 100%; }

.sg-section--panel .sg-section__examples,
.sg-section--colors .sg-section__examples,
.sg-section--tasks-table .sg-section__examples,
.sg-section--calendar .sg-section__examples,
.sg-section--availability .sg-section__examples {
  width: 100%; }

.sg-section--availability .availability,
.sg-section--calendar .calendar {
  width: 100%; }

.sg-section--progress-pie .progress-pie {
  width: 18em;
  height: 18em; }

.sg-section--colors .sg-color:before {
  content: '';
  width: 7em;
  height: 3em;
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.2);
  vertical-align: middle;
  margin: 1em 2em; }

.sg-section--colors .sg-color.red:before {
  background-color: #ed1d27; }

.sg-section--colors .sg-color.green:before {
  background-color: #00ff4d; }

.sg-section--colors .sg-color.blue:before {
  background-color: #00fff7; }

.sg-section--colors .sg-color.dark-blue:before {
  background-color: #00426b; }

.sg-section--colors .sg-color.purple:before {
  background-color: magenta; }

.sg-section--colors .sg-color.yellow:before {
  background-color: #faae3d; }

.sg-section--colors .sg-color.coral:before {
  background-color: #f05656; }

.sg-section--colors .sg-color.lemon:before {
  background-color: #e4ff1a; }

.sg-section--colors .sg-color.aquablue:before {
  background-color: #00ff99; }

.sg-section--colors .sg-color.teal:before {
  background-color: #0c5b73; }

.sg-section--colors .sg-color.orange:before {
  background-color: #f05a24; }

.sg-section--fonts .sg-fonts {
  margin: 3em;
  font-size: 2em; }

.sg-section--fonts .sg-fonts--main {
  /* font-family: Poppins, "Roboto Condensed", sans-serif;  */
}

.sg-section--fonts .sg-fonts--headings {
  /* font-family: Poppins, "Iceland", sans-serif;  */
}

.sg-section--fonts .sg-fonts--alternate {
  /* font-family: Poppins, "Iceland", sans-serif;  */
}

.btn {
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
  font-size: 0.83em;
  padding: 0.6em 1.2em 0.65em 1.2em;
  cursor: pointer;
  transition: fill 0.2s, color 0.2s;
  fill: currentColor;
  white-space: nowrap;
  vertical-align: middle;
  display: inline-block;
  text-decoration: none; }
  .btn:focus, .btn:active, .btn:hover {
    color: #00fff7;
    outline: 0; }
  .btn:focus, .btn:active {
    border-color: #00fff7; }

.btn--bare,
.btn--bare-img {
  background: none;
  border: 0; }
  .btn--bare:focus, .btn--bare:active,
  .btn--bare-img:focus,
  .btn--bare-img:active {
    outline-color: rgba(0, 255, 247, 0.2);
    outline-width: 1px;
    outline-style: solid; }

.btn--bare-img {
  padding: 0.5em; }

.btn__icon {
  width: 0.8em;
  height: 0.8em;
  overflow: visible;
  color: inherit;
  fill: inherit; }

.btn--m-align > * {
  vertical-align: middle; }

.btn--bare .btn__icon:not(svg) {
  width: auto;
  height: auto; }

.btn--bare-img .btn__icon {
  width: auto;
  max-width: 100%;
  height: auto; }

.btn--bare-img svg.btn__icon {
  width: 1.5em;
  height: 1.5em; }

.btn__icon + .btn__text,
.btn__text + .btn__icon {
  margin-left: 0.5em; }

.btn--highlight {
  border-color: rgba(0, 255, 247, 0.8); }

.btn--warning {
  border-color: rgba(237, 29, 39, 0.8); }
  .btn--warning:focus, .btn--warning:hover, .btn--warning:active {
    color: white;
    fill: #ed1d27; }

.btn--important {
  border-color: rgba(240, 90, 36, 0.8); }
  .btn--important:focus, .btn--important:hover, .btn--important:active {
    color: #f05a24;
    fill: #f05a24; }

.btn--fancy {
  background: linear-gradient(to right, #00426a 9.6%, #2aeaff 86.33%);
  border: 0;
  border-radius: 0.3em; }

.panel {
  background-color: rgba(0, 0, 0, 0.3);
  padding: 1em 2em;
  margin-top: 2em; }

.panel__title {
  color: #faae3d;
  margin-top: 0;
  margin-bottom: 0.5em;
  font-size: 1.7em;
  /* font-family: Poppins, "Iceland", sans-serif; */
  letter-spacing: 0; }

.panel__section {
  border-top: 1px solid #00fff7;
  margin-bottom: 1.5em; }

.panel-section__header {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -moz-box-align: start;
  box-align: start;
  -webkit-align-items: flex-start;
  -moz-align-items: flex-start;
  -ms-align-items: flex-start;
  -o-align-items: flex-start;
  align-items: flex-start;
  -ms-flex-align: start; }

.panel-section__title {
  padding: 1.1em 1.8em;
  height: 2.7rem;
  font-size: 0.8125em;
  font-weight: normal;
  margin: 0;
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.4);
  vertical-align: top;
  min-width: 10em;
  width: 12%;
  text-align: center;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  flex-shrink: 0;
  -ms-flex-negative: 0; }

.panel-section__header-content {
  vertical-align: top;
  -webkit-flex-shrink: 1;
  -moz-flex-shrink: 1;
  flex-shrink: 1;
  -ms-flex-negative: 1;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  flex-grow: 1;
  -ms-flex-positive: 1;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  width: 88%; }

.panel-section__content {
  width: 100%; }

.panel-section__inline-block {
  display: inline-block;
  padding: 0.5em;
  margin: 0;
  height: 2.7rem; }

.panel-section__header-content > p {
  padding: 0.5em;
  margin: 0;
  height: 2.7rem; }

.panel-section__header-content .select {
  vertical-align: top; }

.main-nav__wrapper {
  margin-right: 7em; }

.main-nav {
  position: relative;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: inline-box;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: auto; }
  .main-nav:before {
    content: '';
    position: absolute;
    top: 1px;
    left: -0.125em;
    right: -0.125em;
    background-color: white;
    height: 0.25em;
    border-radius: 0.125em;
    box-shadow: 0 0 7px 0 rgba(255, 255, 255, 0.5); }

.main-nav--untoggled.main-nav {
  position: absolute; }

.main-nav__item {
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.8);
  padding: 1.1em 1.7em 1em;
  text-transform: uppercase;
  margin-top: 0.25em;
  cursor: pointer;
  display: inline-block;
  font-size: 0.83em;
  transition: all 0.2s; }
  .main-nav__item ~ .main-nav__item {
    margin-left: 0.4em; }
  .main-nav__item:hover {
    background: linear-gradient(to right, rgba(0, 66, 107, 0.4) 9.6%, rgba(41, 234, 255, 0.4) 86.33%); }
  .main-nav__item:focus, .main-nav__item:active {
    border-color: #00fff7;
    outline: 0; }

.main-nav--untoggled .main-nav__item {
  height: 0;
  opacity: 0;
  visibility: hidden;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden; }

.main-nav__toggle {
  cursor: pointer;
  background-image: url("../img_z0g/minimize-blue.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
  width: 1.0625em;
  height: 1.0625em;
  content: '';
  display: block;
  position: absolute;
  top: -1.5em;
  right: 0;
  background-color: transparent;
  border: 0; }
  .main-nav__toggle:focus, .main-nav__toggle:active {
    outline: 1px solid rgba(0, 255, 247, 0.5); }

.main-nav--untoggled .main-nav__toggle {
  background-image: url("../img_z0g/maximize-blue.svg"); }

.main-nav__toggle-text {
  display: none; }

.secondary-nav__item {
  background: none;
  border: 0;
  color: white;
  cursor: pointer;
  font-size: 0.83em;
  padding: 1.2em 0.5em;
  display: inline-block;
  transition: fill 0.2s, color 0.2s; }
  .secondary-nav__item:focus, .secondary-nav__item:hover, .secondary-nav__item:active {
    color: #00fff7;
    outline: 0; }
  .secondary-nav__item:first-of-type {
    padding-left: 0; }
  .secondary-nav__item:last-of-type {
    padding-right: 0; }

.secondary-nav__item--highlight {
  color: #00fff7;
  position: relative; }
  .secondary-nav__item--highlight:hover {
    color: white; }
  .secondary-nav__item--highlight:after {
    content: '';
    display: block;
    margin-top: 0.2em;
    height: 2px;
  width: 100%;
    background-color: #f05656; }

.third-nav {
  position: absolute;
  top: 3em;
  right: 5.5em;
  display: inline-block; }

.third-nav:before {
  content: url("../img_z0g/light.png");
  pointer-events: none;
  position: absolute;
  transform: translate(-38%, -30%);
  z-index: 2; }

.third-nav__item {
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 12%;
  width: 2.5em;
  height: 2.5em;
  padding: 0.5em;
  position: absolute;
  cursor: pointer;
  transition: all 1s; }

.third-nav__item:after {
  pointer-events: none;
  content: url("../img_z0g/light-small.png");
  opacity: 0;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%); }

.third-nav__item:hover::after {
  opacity: 1; }

.third-nav__item:hover {
  background: linear-gradient(to right, rgba(13, 60, 110, 0.8), rgba(8, 102, 140, 0.8));
  border: 0;
  z-index: 1; }

.third-nav__item > * {
  width: 100%;
  height: 100%;
  vertical-align: middle; }

.third-nav__item-text {
  font-weight: bold;
  font-size: 1.0625em; }

.third-nav__item:nth-child(1) {
  top: -1.575em;
  left: -2.675em; }

.third-nav__item:nth-child(2) {
  top: -2.675em;
  left: -0.55em; }

.third-nav__item:nth-child(3) {
  top: -0.55em;
  left: 0.55em; }

.third-nav__item:nth-child(4) {
  top: 0.55em;
  left: -1.575em; }

.weather .radio-btn__tick + *,
.weather * + .radio-btn__tick {
  margin-left: 0.1em; }

.weather .radio-btn__label {
  padding: 0 1em; }

.radio-btn {
  display: none; }

.radio-btn__label img {
  display: inline-block;
  vertical-align: middle; }

.radio-btn__text {
  vertical-align: middle; }

.radio-btn__label {
  padding: 0 1.5em;
  cursor: pointer;
  white-space: nowrap; }

.radio-btn__tick {
  border: 2px solid white;
  border-radius: 50%;
  width: 1.1em;
  height: 1.1em;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: 0.05em; }

.radio-btn__tick + *,
* + .radio-btn__tick {
  margin-left: 0.5em; }

[type="radio"]:checked + label .radio-btn__tick {
  border: 2px solid #00fff7;
  background-image: url("../img_z0g/tick.svg");
  background-size: 70% 70%;
  background-position: center;
  background-repeat: no-repeat; }

.checkbox {
  display: none; }

.checkbox__label img {
  display: inline-block;
  vertical-align: middle; }

.checkbox__text {
  vertical-align: middle; }

.checkbox__label {
  padding: 0 1.5em;
  cursor: pointer;
  white-space: nowrap; }

.checkbox__tick {
  border: 2px solid white;
  border-radius: 50%;
  width: 1.1em;
  height: 1.1em;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: 0.05em; }

.checkbox__tick + *,
* + .checkbox__tick {
  margin-left: 0.5em; }

[type="checkbox"]:checked + label .checkbox__tick {
  border: 2px solid #00fff7;
  background-image: url("../img_z0g/tick.svg");
  background-size: 70% 70%;
  background-position: center;
  background-repeat: no-repeat; }

.select {
  display: inline-block; }

.select select {
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.8);
  color: white;
  font-size: 0.83em;
  padding: 0.6em 2em 0.65em 1.2em;
  text-transform: uppercase;
  border-radius: 0;
  background-image: url("../img_z0g/dropdown.svg");
  background-repeat: no-repeat;
  background-position: right 0.65em center;
  background-size: 0.7em auto;
  -o-appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none; }
  .select select::-ms-expand {
    display: none; }
  .select select:focus, .select select:active {
    outline-color: rgba(0, 255, 247, 0.8);
    outline-width: 1px;
    outline-style: solid; }

.select optgroup,
.select option {
  background-color: white;
  color: black;
  text-transform: none;
  /* font-family: Poppins, sans-serif;  */
}

.select--lgt select {
  padding: 1.1em 1.8em;
  height: 2.7rem;
  font-size: 0.8125em;
  font-weight: normal;
  border: 0;
  background-position: right 1.7em center;
  padding: 0.8em 4.1em 0.8em 1.7em;
  background-color: rgba(255, 255, 255, 0.1); }

.select--filter select {
  border: 0;
  background-position: right 1.1em center;
  padding: 1em 2.9em 1em 1.1em;
  background-color: transparent; }

.line-chart {
  max-width: 100%; }

.line-chart__ordinate,
.line-chart__abcissa {
  stroke: #00fff7; }

.line-chart__readability-lines line {
  stroke: white; }

.line-chart text {
  /* font-family: Poppins, "Roboto Condensed", sans-serif; */
  fill: white; }

.line-chart__curve {
  fill: none; }

.line-chart rect[fill="orange"],
.line-chart polyline[fill="orange"],
.line-chart line[fill="orange"] {
  fill: #f05a24; }

.line-chart rect[fill="aquablue"],
.line-chart polyline[fill="aquablue"],
.line-chart line[fill="aquablue"] {
  fill: #00ff99; }

.line-chart rect[fill="purple"],
.line-chart polyline[fill="purple"],
.line-chart line[fill="purple"] {
  fill: magenta; }

.line-chart rect[stroke="purple"],
.line-chart polyline[stroke="purple"],
.line-chart line[stroke="purple"] {
  stroke: magenta; }

.line-chart rect[stroke="orange"],
.line-chart polyline[stroke="orange"],
.line-chart line[stroke="orange"] {
  stroke: #f05a24; }

.line-chart rect[stroke="aquablue"],
.line-chart polyline[stroke="aquablue"],
.line-chart line[stroke="aquablue"] {
  stroke: #00ff99; }

.progress-pie__bg {
  fill: rgba(255, 255, 255, 0.5); }

.progress-pie__text {
  fill: #00426b;
  /* font-family: Poppins, "Iceland", sans-serif; */
  letter-spacing: -2; }

.progress-pie__gradient stop {
  stop-color: #00fff7; }

.progress-pie__gradient stop + stop {
  stop-color: #00426b; }

.progress-pie__inner-disc {
  fill: white; }

.diagram {
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden; }

.diagram__grp {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  white-space: nowrap;
  position: relative;
  font-size: 0; }

.diagram__grp--untoggled .diagram__children {
  display: none; }

.diagram__entry {
  display: block;
  padding: 3em;
  position: relative;
  font-size: 1rem; }

.diagram__entry-content {
  display: inline-block;
  text-align: right;
  background-color: rgba(0, 0, 0, 0.2);
  border: 1px solid #00fff7;
  min-width: 13em;
  text-transform: uppercase;
  font-size: 0.75em; }

.diagram__entry-title {
  text-align: center;
  margin-top: 1em;
  font-size: 1.15em; }

.diagram__entry-supervisor {
  padding: 2em 1em 0.3em;
  font-size: 1.05em;
  text-align: left; }

.diagram__entry-content ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  padding: 0.3em 1em 1em;
  text-align: left; }

/******************************* button **************************/
.diagram__toggle-btn {
  padding: 1em; }

.diagram__grp--toggled > .diagram__entry .diagram__toggle-btn [alt="expand"] {
  display: none; }

.diagram__grp--untoggled > .diagram__entry .diagram__toggle-btn [alt="collapse"] {
  display: none; }

.diagram__grp--leaf .diagram__toggle-btn {
  display: none; }

.diagram .link__vertical-bottom,
.diagram .link__vertical-top,
.diagram .link__horizontal {
  position: absolute;
  left: 0;
  height: 3em;
  width: 100%; }
  .diagram .link__vertical-bottom line,
  .diagram .link__vertical-top line,
  .diagram .link__horizontal line {
    stroke: white; }

/******************************* lines **************************/
.diagram .link__vertical-top,
.diagram .link__horizontal {
  top: 0; }

.diagram .link__vertical-bottom {
  bottom: 0; }

.diagram__grp:first-child > .diagram__entry > .link__horizontal > .link__left {
  display: none; }

.diagram__grp:last-child > .diagram__entry > .link__horizontal > .link__right {
  display: none; }

.diagram__grp--leaf .link__vertical-bottom {
  display: none; }

.diagram__grp--root > .diagram__entry > .link__vertical-top {
  display: none; }

.diagram__grp--untoggled > .diagram__entry .link__vertical-bottom {
  display: none; }

.task-list {
  border-top: 1px solid #00fff7;
  border-spacing: 0;
  width: 100%; }

.task-list td,
.task-list th {
  margin: 0; }

.task-list thead th {
  background-color: rgba(255, 255, 255, 0.4);
  border-left: 1px solid white;
  border-right: 1px solid white;
  text-align: center;
  font-weight: normal;
  padding: 0.8em 1em; }

.task-list__header th {
  text-align: left; }

.task-list__body-header,
.task-list__task-name {
  padding-left: 0; }

.task-list__task-name {
  text-align: left;
  padding-left: 1em;
  white-space: nowrap; }

.task-list__icon {
  margin-right: 0.5em;
  vertical-align: middle; }

.task-list__header .task-list__body-header,
.task-list__header .task-list__tree--branching {
  cursor: pointer; }

.task-list__header-parent--toggled {
  opacity: 1;
  height: 0;
  overflow: hidden;
  position: static; }

.task-list__header-parent--untoggled {
  opacity: 0;
  height: 0;
  overflow: hidden;
  position: absolute; }

.task-list__header--main {
  background-color: rgba(255, 255, 255, 0.2);
  text-transform: uppercase; }

.task-list__header--main > * {
  border-left: 1px solid white;
  border-right: 1px solid white;
  padding: 0.8em 1em;
  text-align: center;
  font-weight: normal; }

.task-list__header--main .task-list__tree {
  border-right: 0;
  padding: 0.8em 0 0.8em 1em; }

.task-list__header--main > .task-list__body-header {
  border-left: 0; }

.task-list__task-row {
  text-align: center; }

.task-list__body-header {
  padding-left: 0;
  white-space: nowrap; }

.task-list__tree {
  padding: 0; }

/******************************* tree **************************/
.tree-svg__wrapper {
  width: 1.5em;
  height: 3em; }

.tree-svg {
  position: relative;
  width: 1.5em;
  height: 3em; }

.tree-svg__plus-minus,
.tree-svg__branching {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 200%; }

.tree-svg svg {
  position: absolute;
  top: 0;
  left: 0.5em;
  width: 100%;
  height: 100%; }

.tree-svg svg circle,
.tree-svg svg line {
  stroke: white; }

.task-list__tree .tree-svg__plus-minus {
  display: none; }

.task-list__tree--collapsible .tree-svg__plus-minus {
  display: block; }

.task-list__tree--collapsible .tree-svg__branching {
  display: none; }

.task-list__tree--last .tree-svg__bottom {
  display: none; }

.task-list__tree--collapsible.task-list__tree--first .tree-svg__top {
  display: none; }

.task-list__tree--last:not(.task-list__tree--branching) > * {
  display: none; }

.task-list__tree:not(.task-list__tree--branching) .tree-svg__right {
  display: none; }

.task-list__header--toggled .tree-svg__plus {
  display: none; }

.gantt {
  padding: 0;
  margin: 0;
  border-spacing: 0; }

.gantt th,
.gantt td {
  padding: 0;
  margin: 0; }

.gantt__wrapperA {
  position: relative;
  width: 100%;
  z-index: 1; }

.gantt__wrapperA:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 20%;
  bottom: 0;
  z-index: 0; }

.gantt__wrapperB {
  overflow-x: scroll;
  overflow-y: hidden;
  margin-left: 20%;
  padding-bottom: 2em; }

.gantt__controls {
  width: 20%;
  position: absolute;
  left: 0;
  top: auto;
  z-index: 1; }

.gantt__date-content {
  text-align: center; }

.gantt__type-cell,
.gantt__client-cell {
  position: absolute;
  left: 0;
  top: auto;
  width: 10%;
  border-left: 0; }

.gantt__client-cell {
  left: 10%; }

.gantt__timeline-cell {
  border-bottom: 0; }

.gantt__date-content,
.gantt__timeline-wrapper {
  padding: 0 2em; }

.gantt__date-content > *,
.gantt__timeline-wrapper > * {
  /* top: 0;
  left: 0;
  width: 100%;
  height: 100%; */
  display: block;
  overflow: hidden; }

.gantt__type,
.gantt__client {
  height: 5em;
  display: flex;
  align-items: center; }

.gantt__v-line {
  stroke: white;
  opacity: 0.5; }

.gantt__item [stroke="coral"] {
  stroke: #f05656; }

.gantt__item [fill="coral"] {
  fill: #f05656; }

.gantt__item [stroke="green"] {
  stroke: #00ff4d; }

.gantt__item [fill="green"] {
  fill: #00ff4d; }

.gantt__item [fill="aquablue"] {
  fill: #00ff99; }

.gantt__item [stroke="aquablue"] {
  stroke: #00ff99; }

.gantt__item [stroke="red"] {
  stroke: #ed1d27; }

.gantt__item [fill="red"] {
  fill: #ed1d27; }

.gantt__item text {
  fill: white; }

.gantt__date-text {
  fill: white; }

.projects-gantt .gantt__date-cell,
.projects-gantt .gantt__timeline-cell {
  border-bottom: 1px solid rgba(255, 255, 255, 0.25); }

.projects-gantt .gantt__date-text {
  /* font-family: Poppins, "Iceland", sans-serif;  */
}

.planning__link {
  display: block;
  text-align: right;
  color: #00fff7;
  text-decoration: none;
  font-weight: normal;
  text-transform: uppercase;
  font-size: 1.1em;
  padding: 0.5em 3em;
  position: absolute;
  top: auto;
  right: 0;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%); }

.planning .gantt__wrapperA:before {
  background-color: rgba(255, 255, 255, 0.1);
  border-right: 1px solid white; }

.planning .gantt tbody tr:first-child > * {
  padding-top: 4.7em; }

.planning .gantt__date-content {
  background-color: rgba(255, 255, 255, 0.4); }

.planning .gantt__date-content {
  border-top: 1px solid #00fff7; }

.planning .gantt__timeline-cell {
  border-bottom: 1px solid white; }

.planning .gantt__type,
.planning .gantt__client {
  height: 3em; }

.planning .gantt__date-text {
  font-size: 1em;
  font-weight: normal; }

.planning .gantt__h-line {
  display: none; }

.calendar th,
.calendar td {
  vertical-align: top;
  padding: 0;
  position: relative; }

.calendar thead th {
  text-transform: uppercase;
  font-size: 0.9em;
  font-weight: normal;
  background-color: rgba(255, 255, 255, 0.2);
  padding: 1em; }

.calendar tbody th {
  text-align: right;
  padding-right: 0.5em;
  font-size: 0.9em;
  font-weight: normal; }

.calendar tbody td {
  border-top: 1px solid #00fff7;
  border-bottom: 1px solid #00fff7; }
  .calendar tbody td:first-of-type {
    border-left: 1px solid #00fff7; }
  .calendar tbody td:last-of-type {
    border-right: 1px solid #00fff7; }

.calendar__bg,
.calendar__hours {
  margin: 0;
  padding: 0;
  list-style-type: none; }
  .calendar__bg li,
  .calendar__hours li {
    height: 3rem; }

.calendar__bg-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2); }

.calendar__bg-item--noon {
  border-bottom: 1px solid #00fff7; }

.calendar__content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

.calendar__item {
  position: absolute;
  width: 100%;
  padding: 1em;
  font-size: 0.83em; }

.calendar__item:before {
  content: '';
  top: 0;
  bottom: 1px;
  left: 0;
  right: 0;
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0);
  -webkit-transition: border-color 0.5s;
  -moz-transition: border-color 0.5s;
  transition: border-color 0.5s; }

.calendar__item:hover:before {
  border: 1px solid #00fff7; }

.calendar__item--black:before {
  background-color: rgba(0, 0, 0, 0.2); }

.calendar__item--white:before {
  background-color: rgba(255, 255, 255, 0.4); }

.calendar__item--green:before {
  background-color: rgba(0, 255, 77, 0.4); }

.calendar__item--yellow:before {
  background-color: rgba(228, 255, 26, 0.4); }

.calendar tfoot th {
  padding-top: 1em; }

.calendar__footer-item {
  padding: 0.5em;
  font-size: 0.9em;
  font-weight: normal;
  background-color: rgba(255, 255, 255, 0.2); }

.selector {
  display: inline-block; }

.selector ul {
  list-style-type: none;
  margin: 0;
  display: inline-block;
  padding: 0;
  text-transform: uppercase; }

.selector ul,
.selector__prev,
.selector__next {
  vertical-align: middle; }

.selector__entry {
  font-size: 0.83em;
  visibility: hidden;
  height: 0; }

.selector__entry--active {
  visibility: visible;
  height: auto; }

.col-menu {
  background-color: rgba(0, 0, 0, 0.4);
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  width: auto; }

.col-menu__col {
  margin-right: 0.9em;
  margin-bottom: 0.9em;
  opacity: 1; }

.col-menu__col[aria-expanded="true"] {
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  transition: all 0.6s; }

.col-menu__col[aria-expanded="false"] {
  opacity: 0;
  position: absolute;
  visibility: hidden; }

.col-menu__search {
  margin: 0.9em 0 0.9em 0.9em;
  position: relative; }
  .col-menu__col + .col-menu__col .col-menu__search {
    margin-left: 0; }
  .col-menu__search input {
    width: 100%;
    padding: 0.2em 1.5em 0.2em 0.2em;
    height: 1.5em;
    line-height: 1.5em; }
  .col-menu__search:after {
    position: absolute;
    right: 0.225em;
    top: 0.225em;
    content: '';
    display: block;
    background: no-repeat center url("../img_z0g/m-glass.svg");
    background-size: contain;
    width: 1.05em;
    height: 1.05em; }

.col-menu ul {
  margin: 2em 0 0;
  padding: 0;
  list-style-type: none; }

.col-menu__entry--untoggled .col-menu {
  display: none; }

.col-menu__btn {
  text-align: left;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  text-transform: none;
  padding: 0.2em 0.5em 0.2em 1em; }

.btn.col-menu__btn--toggled {
  background-color: rgba(255, 255, 255, 0.3);
  outline: 0;
  color: white; }

.col-menu__btn .btn__text {
  width: 100%; }

.col-menu__btn[aria-controls]:after {
  content: '';
  display: inline-block;
  background: no-repeat center url("../img_z0g/menu-arrow.svg");
  background-size: contain;
  width: 0.8em;
  height: 0.8em; }

.poll-panel {
  padding: 1.5em;
  background-color: #0c5b73;
  box-shadow: 6px 7px 5px rgba(0, 0, 0, 0.15); }

.poll-panel__title {
  margin-top: 0;
  font-weight: normal;
  font-size: 0.9em;
  padding-bottom: 0.5em;
  padding-left: 1em;
  border-bottom: 1px solid #00fff7; }

.poll-panel__question {
  font-size: 0.9em; }

.poll-panel__list {
  margin: 0;
  padding: 0;
  list-style-type: none; }

.poll-panel__list .checkbox__text {
  font-size: 0.9em; }

.poll-panel__list .checkbox__label {
  padding: 0; }

.poll-panel__list li {
  padding: 0.5em; }

.home-btn {
  position: relative;
  width: 9.5em;
  height: 9.5em;
  text-decoration: none;
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 0.8em;
  border: 0.15em solid rgba(255, 255, 255, 0.4);
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  box-pack: end;
  -webkit-justify-content: flex-end;
  -moz-justify-content: flex-end;
  -ms-justify-content: flex-end;
  -o-justify-content: flex-end;
  justify-content: flex-end;
  -ms-flex-pack: end;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  padding: 1em;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s; }
  .home-btn:hover {
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
    background: linear-gradient(to right, rgba(26, 107, 188, 0.99) 15%, rgba(47, 218, 244, 0.99) 100%);
    border-color: #00fff7; }

.home-btn:after {
  pointer-events: none;
  content: url("../img_z0g/light-small.png");
  opacity: 0;
  position: absolute;
  left: 100%;
  top: 100%;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
  -webkit-transform: translateX(-55%) translateY(-55%);
  -moz-transform: translateX(-55%) translateY(-55%);
  -ms-transform: translateX(-55%) translateY(-55%);
  -o-transform: translateX(-55%) translateY(-55%);
  transform: translateX(-55%) translateY(-55%); }

.home-btn:hover::after {
  opacity: 0.5; }

.home-btn__icon-wrapper {
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center; }

.home-btn__icon {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s; }

.home-btn:hover .home-btn__icon {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05); }

.home-btn__text {
  display: block;
  text-transform: uppercase;
  font-size: 0.83em;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
  text-align: center;}

.home-btn:hover .home-btn__text {
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2); }

.availability {
  border-left: 1px solid #00fff7; }

.availability__table {
  width: 100%; }

.availability th {
  border-right: 1px solid white; }

.availability thead tr {
  background-color: rgba(255, 255, 255, 0.3); }

.availability tbody tr:nth-last-child(even) {
  background-color: rgba(255, 255, 255, 0.1); }

.availability thead tr > * {
  font-weight: normal;
  text-transform: uppercase;
  font-size: 0.75em;
  padding: 0.4em; }

.availability thead tr > .availability__priority {
  text-align: right;
  padding-left: 1.5em;
  padding-right: 1.5em;
  width: 26%; }

.availability thead tr > .availability__title {
  width: 12%; }

.availability tbody tr > * {
  font-size: 0.7em;
  text-align: center;
  text-transform: uppercase;
  padding: 1.1em; }

.availability tbody tr > *:first-child {
  text-align: left; }

.availability tbody td:nth-child(n+2) {
  border-left: 1px solid white; }

.availability tbody tr:nth-last-child(n+2) > * {
  border-bottom: 1px solid white; }

.availability .availability__heading--purple {
  background-color: rgba(255, 0, 255, 0.6);
  border: 0; }

.availability .availability__heading--green {
  border: 0;
  background-color: rgba(0, 255, 77, 0.6); }

.availability .availability__heading--lemon {
  border: 0;
  background-color: rgba(228, 255, 26, 0.6); }

.page-login {
  position: relative;
}
.page-login:after{
  position: absolute;width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  content: '';
  z-index: -1;
  /*background-color:  #000;*/
  background: url("../img/login_bg_pic.png") no-repeat left center;
   background-size: cover;
  /*opacity: 0.6;*/
}

.page-login body {
  height: 100%;
}

.page-login__main-holder {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center;
  height: 100%; }

.page-login__panel {
  padding: 3.5em;
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 1em;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  box-direction: normal;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -ms-flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center; }
  @media (max-width: 48em) {
    .page-login__panel {
    width: 100%;
    min-height: 25em;
    padding: 3em;
    margin-top: 130px;} }

.page-login__logo {
  margin-bottom: 5.5em;
  margin-top: -0.3em;}
  @media (max-width: 48em) {
    .page-login__logo {
      margin-bottom: 2em;
      width: 100%;
      min-height: 20px;
      text-align: center; } }

.page-login__logo img {
  width: 100%;
  height: auto; }
  @media (max-width: 48em) {
    .page-login__logo img {
      width: 75%; } }

.page-login__input {
  /*border-bottom: 1px solid white;*/
  margin-bottom: 1.65em;
  width: 63%;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -moz-box-align: end;
  box-align: end;
  -webkit-align-items: flex-end;
  -moz-align-items: flex-end;
  -ms-align-items: flex-end;
  -o-align-items: flex-end;
  align-items: flex-end;
  -ms-flex-align: end; }
  @media (max-width: 48em) {
    .page-login__input {
      width: 97%; } }

.page-login__input img {
  margin-bottom: 0.3em;
  -webkit-flex-grow: 0;
  -moz-flex-grow: 0;
  flex-grow: 0;
  -ms-flex-positive: 0;
  -webkit-flex-shrink: 0;
  -moz-flex-shrink: 0;
  flex-shrink: 0;
  -ms-flex-negative: 0;
  display: inline-block; }

.page-login__input input {
  background: none;
  color: white;
  font-size: 0.9em;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  flex-grow: 1;
  -ms-flex-positive: 1;
  display: block; }
  .page-login__input input:focus {
    outline: 0; }

.page-login__input input[type="password"] {
  padding-top: 0;
  padding-bottom: 0; }


.page-login__login-btn {
  margin-top: 3em;
  padding-top: 0.6em;
  padding-bottom: 0.6em;
  font-size: 1em;
  min-width: 63%;
  text-align: center; }


.page-login__lost-password {
  text-decoration: none;
  font-size: 0.9em;
  margin-top: 0.5em; }

.page-login__lang {
  padding: 0;
  margin: 1.1em 0 0;
  list-style-type: none; }

.page-login__lang > * {
  display: inline-block;
  padding-top: 1em; }

.page-login__lang-btn {
  background: none;
  border: 0;
  padding: 0.5em;
  position: relative; }

.page-login__lang-btn .btn__icon-holder {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em; }

.page-login__lang-btn .btn__icon {
  position: relative;
  width: 100%;
  height: 100%; }

.page-login__lang-btn--active .btn__icon-holder:before {
  position: absolute;
  content: '';
  display: block;
  border-radius: 50%;
  border: 1px solid white; }

.table th,
.table td {
  border: 1px solid white;
  padding: 0.8em 1em;
  text-align: center; }

.table caption {
  text-align: left;
  padding: 2em 0; }

.table thead tr:first-child th {
  background-color: rgba(255, 255, 255, 0.4); }

.table thead tr:nth-child(n+2) th {
  background-color: rgba(255, 255, 255, 0.1); }

.table thead tr:nth-child(n+2) .table__highlighted-header {
  background-color: rgba(0, 255, 77, 0.15); }

.table thead tr:nth-last-child(n+2):first-child th {
  border-bottom: 0; }

.table thead tr:nth-child(2) th {
  border-top: 0; }

.table th {
  background-color: rgba(255, 255, 255, 0.2);
  font-weight: normal; }

.table td:empty {
  border: 0; }

.notes-table__wrapper {
  width: 100%;
  max-height: 18em;
  overflow: auto;
  border-bottom: 1px solid white; }

.notes-table {
  width: 100%; }

.notes-table td,
.notes-table th {
  padding-left: 1.5em;
  padding-right: 1.5em;
  border-left: 1px solid white;
  font-size: 0.83em; }

.notes-table thead tr > * {
  height: 2.7rem;
  padding-top: 0;
  padding-bottom: 0; }

.notes-table__add-btn {
  padding: 0;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: inline-box;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center; }

.notes-table__profile-btn {
  padding: 0;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: inline-box;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center; }

.notes-table thead tr {
  background-color: rgba(255, 255, 255, 0.4); }

.notes-table thead td:first-child {
  width: 30%; }

.notes-table thead th {
  padding: 1.1em 1.8em;
  height: 2.7rem;
  font-size: 0.8125em;
  font-weight: normal;
  width: 64%;
  text-transform: uppercase;
  text-align: center; }

.notes-table thead td:last-child {
  width: 5%;
  padding: 0.5em; }

.notes-table tbody tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.1); }

.notes-table tbody td:last-child {
  text-align: center;
  min-width: 4em;
  overflow: hidden;
  padding: 0.3em; }

.notes-table tbody td,
.notes-table tbody th {
  padding: 0.8em 2em;
  text-align: left; }

.acceptance-table {
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 60em; }

.acceptance-table td,
.acceptance-table th {
  margin: 0;
  padding: 0.45em 3em;
  text-align: center;
  border: 1px solid white;
  font-weight: normal; }

.acceptance-table th {
  font-size: 1.0625em;
  background-color: rgba(255, 255, 255, 0.1); }

.acceptance-table tr:first-child td,
.acceptance-table tr:first-child th {
  border-top: 0; }

.risks-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0; }

.risks-table th,
.risks-table td {
  border: 1px solid white;
  padding: 0.2em 2em; }

.risks-table thead th {
  text-align: center;
  background-color: rgba(255, 255, 255, 0.4);
  padding: 1.5em 2em;
  text-transform: uppercase;
  font-weight: normal;
  font-size: 0.83em; }

.risks-table tbody th,
.risks-table tbody td {
  text-align: left; }

.risks-table tbody th:first-child {
  white-space: nowrap;
  font-weight: normal;
  background-color: rgba(255, 255, 255, 0.1); }

.risks-table tbody td:nth-child(2) {
  width: 100%;
  border-right: 0; }

.risks-table tbody td:last-child {
  text-align: center;
  border-left: 0; }

.risks-table tbody td.risks-table__profile {
  text-align: right;
  padding: 0.4em; }

.risks-table__profile .btn {
  padding: 0;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: inline-box;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  -ms-align-items: center;
  -o-align-items: center;
  align-items: center;
  -ms-flex-align: center; }

.section-progress {
  position: relative; }

.section-progress__header-content {
  width: 80%;
  margin-left: auto;
  margin-right: 0;
  text-align: right; }

.section-progress__header-content figure {
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.1);
  text-align: center;
  max-width: 100%; }

.section-progress__header-content figure > *:not(figcaption) {
  margin-bottom: 3em;
  padding: 1em 3em 3em; }

.section-progress__header-content figcaption {
  margin-top: 2em; }

.section-progress__content aside {
  position: absolute;
  top: 10em;
  max-width: 30%; }

.section-progress__content aside > * {
  max-width: 100%; }

.section-budget__int-ext {
  width: 100%;
  table-layout: fixed; }

.section-budget__vente {
  table-layout: fixed; }

.section-budget .table {
  margin-top: 2em;
  margin-bottom: 4em; }

.section-budget .table tbody td {
  text-align: right; }

.section-budget .table__first-col {
  width: 14.5em; }

.section-budget__jh {
  width: 1em;
  overflow: hidden; }

.section-staffing .panel-section__content {
  text-align: center; }

.section-staffing figure {
  display: inline-block;
  margin: 3em 6em; }

.section-staffing figcaption {
  margin-top: 2em; }

.section-risks .risks-table {
  margin-top: 2em; }

/* More custom login page style */

#EmployeeLoginForm, #EmployeeGetCompanyRoleForm{
  max-width: 960px;
  z-index: 2;
  font-family: "Open Sans";
  position: relative;
}
.page-login__panel{
  background-color: #fff;
}
.btn--fancy{
  background: #5487FF;
}
.page-login__panel{
  border-radius: 0;
}
.page-login__input{
  width: 240px;
}
.page-login__input input, .page-login__login-btn{
    border: 1px solid #E1E6E8;
    border-radius: 3px;
    color: #C6CCCF;
    height: 50px; width: 240px;
    line-height: 50px;
    padding: 0;
    padding-left: 25px;
    box-shadow: 0 0 10px 1px rgba(29,29,27,0.06);
    font-size: 14px;
    font-weight: 400;
}
.page-login__login-btn{
  padding: 0;
  color: #fff;
   width: 280px;
   border: none;
   font-size: 16px;
   font-weight: bold;
   text-transform: uppercase;
}
.page-login__input input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #C6CCCF;
}
.page-login__input input::-moz-placeholder { /* Firefox 19+ */
  color: #C6CCCF;
}
.page-login__input input:-ms-input-placeholder { /* IE 10+ */
  color: #C6CCCF;
}
.page-login__input input:-moz-placeholder { /* Firefox 18- */
  color: #C6CCCF;
}
.page-login__input {
  position: relative;
}
.page-login__input i{
   color: #C6CCCF;
   font-size: 16px;
   height: 50px;
   line-height: 50px;
   position: absolute;
   left: 5px;
   z-index: 2;
   top: 0;
}

.page-login__lost-password{
    color: #C6CCCF; 
    font-size: 14px;
    margin-top: 21px;
    display: block;
}
.page-login__copy-right{
    color: #C6CCCF;
    font-size: 13px;
    position: absolute;
    bottom: 40px;
    width: 100%;
    left: 0;
    text-align: center;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    // IE10+ CSS here

    .page-login:before{
      position: absolute;width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      content: '';
      opacity: 0.7;
      z-index: -1;
      background-color: #fff;
      background-size: cover;
      z-index: 2;
    }
}

@media(max-width: 1024px){
  #EmployeeLoginForm .page-login__panel, #EmployeeLoginForm .login-pic,
  #EmployeeGetCompanyRoleForm .page-login__panel, #EmployeeGetCompanyRoleForm .login-pic{
    width: 100%;

  }
  #EmployeeLoginForm .login-pic,
  #EmployeeGetCompanyRoleForm .login-pic{
    display: none;

  }
}


.page-login__logo{
  text-align: center;
  margin-bottom: 2.5em;
}
.page-login__logo img{
  width: inherit;
}
.wd-contact{
  position: absolute;
  top: 3px;
  right: 21px;
  z-index: 3;
}
#EmployeeLoginForm{
  position: relative;
}
.wd-contact li{
  display: inline-block;
}
.wd-contact li:last-child{
  margin-left: 10px;
}
.wd-contact li a{
    color: #fff;
    text-decoration: none;
}
.wd-contact li a:hover{
  text-decoration: none;
}
.page-login__lang-btn--active .btn__icon-holder:before{
  border-color: #5487FF;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
}

.page-login__input.page-login__checkbox input{
  position: absolute; 
  opacity: 0;
  z-index: 3;
  cursor: pointer;
  height: inherit;
  width: inherit;
  top:0;
}
.page-login__checkbox input + span{
    position: relative;
    cursor: pointer;
    padding: 0;
    display: inline-block;
  }
.page-login__checkbox input + span:before {
    content: '';
    margin-right: 10px;
    display: inline-block;
    vertical-align: text-top;
    width: 14px;
    height: 14px;
    background: white;
    z-index: 2;
    position: relative;
    top: 3px;
    left: 3px;
    border-radius: 2px;
    cursor: pointer;
  }

.page-login__checkbox label{
  color: #C6CCCF;
}
.page-login__checkbox input:focus + span:before {
    /*box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);*/
 }
.page-login__checkbox input:checked + span:before {
    background: #5584FF;
  }
.assistant input:disabled + span {
    color: #b8b8b8;
    cursor: auto;
  }
.page-login__checkbox input:disabled + span:before {
    box-shadow: none;
    background: #ddd;
  }
.page-login__checkbox input + span:after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background: white;
    border: 1px solid #E1E6E8;
    box-shadow: 0 0 10px 1px rgba(29,29,27,0.06);
    left: 0;
    z-index: 1;
    border-radius: 3px;
    cursor: pointer;
  }